Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Change ClientApi to be a facade in front of the store #16006

Conversation

tmeasday
Copy link
Member

@tmeasday tmeasday commented Sep 9, 2021

Part of #15871

Telescoping on #16005

What I did

Change the behaviour of the v6 APIs/entrypoints to use the on-demand store in a pre-loaded (i.e. not on-demand) way.

  • Change the @storybook/client-api API exports (which are re-exported by the various app layers) to be a "facade" in front of the story store. What this means is:

    • all calls to addDecorators() & friends are collected on the Client API, and passed to a WebPreview as a getProjectAnnotations function.
    • all calls to storiesOf() are are collected, and massaged into a "CSF import" that is then supplied as a (synchronous) importFn
    • all calls to .add() are similarly added to the CSF imports, and also indexed into to be passed as a (synchronous) fetchStoryIndex function. Note this function implements story sorting in the preview[1]
  • Similarly, if a Loadable is passed to the configure() function (like a require.context), its exports (CSF exports) are collected by the ClientApi in a similar way to the above.

  • When the start() function (called by all e.g. @storybook/react entry points) is called it creates the above and a webpreview, which it initialize()s synchronously -- which means all stories are loaded right away.

[1] In the v7 store the story sorting of the index happens in node.

@tmeasday tmeasday mentioned this pull request Sep 9, 2021
14 tasks
@nx-cloud
Copy link

nx-cloud bot commented Sep 9, 2021

Nx Cloud Report

We didn't find any information for the current pull request with the commit 6e6f0ef.
You might need to set the 'NX_BRANCH' environment variable in your CI pipeline.

Check the Nx Cloud Github Integration documentation for more information.


Sent with 💌 from NxCloud.

@github-actions
Copy link
Contributor

github-actions bot commented Sep 9, 2021

Fails
🚫

PR is not labeled with one of: ["cleanup","BREAKING CHANGE","feature request","bug","documentation","maintenance","dependencies","other"]

Generated by 🚫 dangerJS against 6e6f0ef

Copy link
Member

@shilman shilman left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

We still need to add story sorting to the index server, right?

const clientApi = new ClientApi();
let data;

clientApi.setAddon({
Copy link
Member

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

let's deprecate and remove in 7.0?

Copy link
Member Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Good idea, want to open a ticket for it?

Copy link
Member

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

@tmeasday
Copy link
Member Author

tmeasday commented Sep 10, 2021

We still need to add story sorting to the index server, right?

Yes we do. I think @bebraw has prototyped it over in the skeleton.

@bebraw
Copy link
Contributor

bebraw commented Sep 10, 2021

Yes we do. I think @bebraw has prototyped it over in the skeleton.

Yup, I have a basic implementation in place there at tmeasday/storybook-skeleton#28 .

@shilman
Copy link
Member

shilman commented Sep 14, 2021

Merged as part of #15871

@shilman shilman closed this Sep 14, 2021
@stof stof deleted the on-demand-store-4-client-api-facade branch May 25, 2022 09:44
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

Successfully merging this pull request may close these issues.

3 participants