Skip to content

Document usage of Lookbook for ViewComponents #11540

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.

Sign up for GitHub

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

Merged
aduth merged 1 commit into from
Nov 25, 2024
Merged

Document usage of Lookbook for ViewComponents #11540

Changes from all commits
Commits
Show all changes
1 commit
Select commit
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
8 changes: 8 additions & 0 deletions docs/frontend.md
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -175,6 +175,14 @@ and independent view components, rendered server-side.

For more information, refer to the [components `README.md`](../app/components/README.md).

To preview components and their available options, we use [Lookbook](https://lookbook.build/) to
generate a navigable index of our available components. These previews are available at the [`/components/` route](http://localhost:3000/components/)
in local development, review applications, and in the `dev` environment. When adding a new component
Copy link
Copy Markdown
Contributor

@zachmargolis zachmargolis Nov 21, 2024

Choose a reason for hiding this comment

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

should we just link the dev environment? or are trying to minimize crawling of it?

Copy link
Copy Markdown
Contributor Author

@aduth aduth Nov 21, 2024

Choose a reason for hiding this comment

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

It was intentional to add some light friction here with the assumption that there's enough detail to help the target audience find their way to the page, without directly linking to the deployed environment. (I think we don't usually link there?)

Copy link
Copy Markdown
Contributor

@zachmargolis zachmargolis Nov 21, 2024

Choose a reason for hiding this comment

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

prob fine to leave as-is

Copy link
Copy Markdown
Contributor

@eileen-nava eileen-nava Nov 21, 2024

Choose a reason for hiding this comment

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

Is it worth noting that the component_previews_enabled feature flag toggles visibility on/off?

Copy link
Copy Markdown
Contributor Author

@aduth aduth Nov 22, 2024

Choose a reason for hiding this comment

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

I think we could, but I can't personally imagine much need to change it from its defaults, so didn't want to dilute the critical information here.

Do you think there's a use-case to be turning it on and off?

Copy link
Copy Markdown
Contributor

@eileen-nava eileen-nava Nov 22, 2024

Choose a reason for hiding this comment

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

Eh, probably not.

or an option to an existing component, you should also make this component or option available in
Lookbook previews, found under [`spec/components/previews`](https://github.com/18F/identity-idp/tree/main/spec/components/previews).
Refer to [Lookbook's _Previews Overview_ documentation](https://lookbook.build/guide/previews) for
more information on how to author Lookbook previews.

#### React

For non-trivial client-side interactivity, we use [React](https://reactjs.org/) to build and combine
Expand Down