Where communities thrive


  • Join over 1.5M+ people
  • Join over 100K+ communities
  • Free without limits
  • Create your own community
People
Repo info
Activity
  • 09:01
    ricardo-devis-agullo opened #1268
  • 09:01
    ricardo-devis-agullo opened #1268
  • 09:00

    ricardo-devis-agullo on improve-events-handler-types

    Improve typings of events in ev… (compare)

  • 09:00

    ricardo-devis-agullo on improve-events-handler-types

    Improve typings of events in ev… (compare)

  • Oct 23 22:59
    ricardo-devis-agullo edited #1267
  • Oct 23 22:59
    ricardo-devis-agullo edited #1267
  • Oct 23 22:58
    ricardo-devis-agullo opened #1267
  • Oct 23 22:58
    ricardo-devis-agullo opened #1267
  • Oct 23 22:57

    ricardo-devis-agullo on add-express-promise-router

    add express-promise-router to a… (compare)

  • Oct 23 22:57

    ricardo-devis-agullo on add-express-promise-router

    add express-promise-router to a… (compare)

  • Oct 23 20:20
    ricardo-devis-agullo edited #1265
  • Oct 23 20:20
    ricardo-devis-agullo edited #1265
  • Oct 23 20:19
    ricardo-devis-agullo opened #1266
  • Oct 23 20:19
    ricardo-devis-agullo opened #1266
  • Oct 23 20:17

    ricardo-devis-agullo on upgrade-storage-adapters

    upgrade storage adapters and pa… (compare)

  • Oct 23 20:17

    ricardo-devis-agullo on upgrade-storage-adapters

    upgrade storage adapters and pa… (compare)

  • Oct 23 12:30
    ricardo-devis-agullo opened #1265
  • Oct 23 12:30
    ricardo-devis-agullo opened #1265
  • Oct 23 12:30

    ricardo-devis-agullo on components-details-promise

    move components-details and rep… (compare)

  • Oct 23 12:30

    ricardo-devis-agullo on components-details-promise

    move components-details and rep… (compare)

Florian Barbare
@fbarbare
Hi there! This might be a question more for @matteofigus but maybe @pbazydlo might have an answer too: Are there any specific reasons why oc dev needs to run in the parent folder of the OC itself? Why not allowing it to run in its own folder?
Matteo Figus
@matteofigus
To be consistent with tools that operate with similar folder structures like lerna etc
Oc dev for example needs things like mocks and other stuff that are common to more components, starting off inside would mean reading or writing to the parent which seems wrong
Florian Barbare
@fbarbare
Cool, thanks! :)
Ken Crawford
@kmcrawford
Is there a way to override the template externals to not pull from unpkg?
Ken Crawford
@kmcrawford
I think I figured it out, it’s coming form oc-template-react package.json, I may have to fork it.
Matteo Figus
@matteofigus
Yeah it’s not simple right now, but if you make some progress it would be nice to be able to parametrise that
I think there are bits in the browser client too
Ken Crawford
@kmcrawford
I was looking into overriding some values so I don’t have to fork. I ran into a different issue I haven’t had time to troubleshoot. But looks promising.
Ken Crawford
@kmcrawford
@matteofigus I found the real issue is here, https://github.com/opencomponents/oc-template-react/blob/master/packages/oc-template-react-compiler/lib/viewTemplate.js the template.js that gets generated at build time has unpkg.com hardcoded. An option could be to override this value at publish time with the registry. Otherwise the oc-template-react needs to have overrides, I’m kinda liking the idea to override in a central place.
Ken Crawford
@kmcrawford
@matteofigus I created a draft, that will accomplish what I was referring to above. opencomponents/oc#1188
Mukul Jain
@mukuljainx

Hi Team, thanks for the open components really awesome stuff, we at Innovaccer are developing a system around it, so things can move pretty easily from developer's system to production and less coupling, we also introduce a store mechanism so if components are sharing common data they get them from there.

The main challenge we are facing is for routing! Currently, we have a bunch of React apps that are stitched together with the help of Single SPA and app-level routing is mostly handled by React Router but if a component is packaged with OC and loaded it will not have the react-router context,
What would be your advice and how you guys are handling it

Can't switch to universal router as every would then need to if not the last options, I am trying to make oc components easily adaptable to all. Right now what I though create patterns, like if a team is using react-router, we already have redux in place, from oc components one can dispatch action to parent React component to update route.

Also is there any doc on patterns or best practices with opencomponents?
Ken Crawford
@kmcrawford
@mukuljainx we have a similar SPA application, our OC components are components embedded in a page, so the routing works just like you would expect.
Ken Crawford
@kmcrawford
@matteofigus could I get your insight on this? opencomponents/oc#1188
yugandhar-pathi
@yugandhar-pathi
I am not sure if we can use open components for building component library like material-ui? can we ?
Ricardo Devis Agullo
@ricardo-devis-agullo
what do you mean by "building"? you can use it inside oc's for sure
Is there any reason why we wouldn't want to pass the process object to vm contexts so dataProviders can access things like environment variables of the registry? I was thinking into PRing it, but wondering if there is any drawback
https://github.com/opencomponents/oc/blob/d7d65dddcd03213faafb7cdd12a5ddde9bc58cd2/src/registry/routes/helpers/get-component.js#L438
Piotr Bazydło
@pbazydlo
@yugandhar-pathi if you mean creating basic components like 'generic button', then that's not something I'd try to do with OC and instead would try to embed a part of logic from the page. Ex. Navigation bar, a card viewing user details, comments section, etc. then the components themselves could use something like material-ui
Gus deMayo
@gusdemayo
If I have a private component registry, what is mechanism for authenticating the retrieval of components onto the page?
Ricardo Devis Agullo
@ricardo-devis-agullo
I'm not sure if it's possible, but what would be the use case of wanting to have authentication at the registry level? You can always add authentication at the Component level (on the server/dataprovider that renders it)
Matteo Figus
@matteofigus
Consider that a component's server.js can read and write HTTP headers so in theory you can do all you want there - for instance creating an auth plugin to abstract header handling away
Gus deMayo
@gusdemayo
@ricardo-devis-agullo @matteofigus Either of those would probably work, my thinking was that I might not want the registry to be publically accessible or to allow just anyone to embed a component in their app without some kind of API key or something.
I took a look at the existing templates for React and ES6, presumably components could be written in Vue, do you have any thoughts on how to go about that? I'm still kind of wrapping my head around what the template compiler's doing
Ricardo Devis Agullo
@ricardo-devis-agullo
So here's an explanation of the steps of what happens on client-side rendering (https://github.com/opencomponents/oc/wiki/Client-side-rendering). The react compiler does an extra step where after compiling with webpack, the template will take the bundle and wrap it (https://github.com/opencomponents/oc-template-react/blob/master/packages/oc-react-component-wrapper/index.js) so the React component will be saved in oc.reactComponents, and then taken by window.React
It should be possible to do the same with Vue
save them in oc.vueComponents I guess?
Matteo Figus
@matteofigus
Also to prevent rendering you can do lots of things, the simpler I can think of is restrict the origin for Cors by sending headers as part of the serverjs rendering.
mgrub
@mgrub1

Hello folks!

What can be the causes for the error "oc registry not available" when trying to add the heroku registry? Thankyou

Ricardo Devis Agullo
@ricardo-devis-agullo
what's the command you are running? do you have already a oc.json at that moment with a url defined that may not be responding?
mgrub
@mgrub1
i use oc registry add <heroku-app-url>
where <heroku-app-url> is the domain of the heroku app i've created
Ricardo Devis Agullo
@ricardo-devis-agullo
and that url holds a oc registry currently running?
because that command will try to to call that url
mgrub
@mgrub1

well, if i open the url on heroku, i get the error: Application error

An error occurred in the application and your page could not be served.

Ricardo Devis Agullo
@ricardo-devis-agullo
then that's why oc registry add is failing, because your application is erroring
oc registry add only adds an existing oc registry to your project so you can publish your components
it doesn't set up the registry itself
to set it up you can take a look at this
https://github.com/opencomponents/oc/wiki#setup-a-registry
mgrub
@mgrub1
alright, got it. I've already created the registry config with a s3-bucket. Since it's my first time working with opencomponents and heroku i'm sorry if this is a noob question to be asked.
Ricardo Devis Agullo
@ricardo-devis-agullo
no worries, that's what the channel is for :)
mgrub
@mgrub1

ty - i've looked into the heroku logs, and this is what i get:

2021-09-16T09:26:18.318464+00:00 app[web.1]: npm ERR! opencomponents-starter-kit@1.0.0 start: node server.js

2021-09-16T09:26:18.318526+00:00 app[web.1]: npm ERR! Exit status 1

2021-09-16T09:26:18.318598+00:00 app[web.1]: npm ERR!

2021-09-16T09:26:18.318656+00:00 app[web.1]: npm ERR! Failed at the opencomponents-starter-kit@1.0.0 start script.

2021-09-16T09:26:18.318706+00:00 app[web.1]: npm ERR! This is probably not a problem with npm. There is likely additional logging output above.

2021-09-16T09:26:18.322056+00:00 app[web.1]:

2021-09-16T09:26:18.322141+00:00 app[web.1]: npm ERR! A complete log of this run can be found in:

2021-09-16T09:26:18.322188+00:00 app[web.1]: npm ERR! /app/.npm/_logs/2021-09-16T09_26_18_319Z-debug.log

2021-09-16T09:26:18.454194+00:00 heroku[web.1]: Process exited with status 1

2021-09-16T09:26:18.500661+00:00 heroku[web.1]: State changed from starting to crashed

Ricardo Devis Agullo
@ricardo-devis-agullo
hmm, that log is not super helpful, doesn't really say why :/
mgrub
@mgrub1
but im pretty sure, as you said, this problem has to be on the heroku side ... since the domain-url of the app is not exposed properly
Ricardo Devis Agullo
@ricardo-devis-agullo
yeah...
mgrub
@mgrub1
so i re-run the whole action and clicked on the link: "https://heroku.com/deploy?template=https://github.com/opencomponents/starter-kit" from: https://opencomponents.github.io/ again and entered all informations i have. The building process just went fine but the heroku app afterwards, still cannot be reached

2021-09-16T10:05:09.839826+00:00 app[web.1]: npm ERR! opencomponents-starter-kit@1.0.0 start: node server.js

2021-09-16T10:05:09.839897+00:00 app[web.1]: npm ERR! Exit status 1

2021-09-16T10:05:09.839990+00:00 app[web.1]: npm ERR!

2021-09-16T10:05:09.840048+00:00 app[web.1]: npm ERR! Failed at the opencomponents-starter-kit@1.0.0 start script.

2021-09-16T10:05:09.840101+00:00 app[web.1]: npm ERR! This is probably not a problem with npm. There is likely additional logging output above.

2021-09-16T10:05:09.845803+00:00 app[web.1]:

2021-09-16T10:05:09.845897+00:00 app[web.1]: npm ERR! A complete log of this run can be found in:

2021-09-16T10:05:09.845947+00:00 app[web.1]: npm ERR! /app/.npm/_logs/2021-09-16T10_05_09_840Z-debug.log

2021-09-16T10:05:09.970778+00:00 heroku[web.1]: Process exited with status 1

2021-09-16T10:05:10.214722+00:00 heroku[web.1]: State changed from starting to crashed

mgrub
@mgrub1
what mistakes could i possibly make, during the creation of the heroku app, with the open-component deployment link on the website?
is there initially anything written to my aws-s3-bucket during the deployment phase?
Ricardo Devis Agullo
@ricardo-devis-agullo
not really, but you should be able to see this error message at least when it fails
https://github.com/opencomponents/get-started/blob/ef056a982c3557ddf1f813f842a1460d6b5f42b7/server.js#L35