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

Added Storybook to Netlify build to allow relative links from documentation #5599

Merged
merged 20 commits into from
Jan 19, 2024
Merged
Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
20 commits
Select commit Hold shift + click to select a range
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: 5 additions & 3 deletions Makefile
Original file line number Diff line number Diff line change
Expand Up @@ -156,8 +156,10 @@ docs-vale: bin/python docs-news ## Install (once) and run Vale style, grammar,

.PHONY: netlify
netlify:
pip install -r requirements-docs.txt
cd $(DOCS_DIR) && sphinx-build -b html $(ALLSPHINXOPTS) ../$(BUILDDIR)/html
pnpm build:registry
(cd packages/volto && pnpm build-storybook -o ../../_build/html/storybook)
pwd && pip install -r requirements-docs.txt
cd $(DOCS_DIR) && pwd && sphinx-build -b html $(ALLSPHINXOPTS) ../$(BUILDDIR)/html

.PHONY: docs-test
docs-test: docs-clean docs-linkcheckbroken docs-vale ## Clean docs build, then run linkcheckbroken, vale
Expand All @@ -167,7 +169,7 @@ docs-test: docs-clean docs-linkcheckbroken docs-vale ## Clean docs build, then
.PHONY: storybook-build
storybook-build:
pnpm build:registry
(cd packages/volto && pnpm build-storybook -o ../../docs/_build/storybook)
(cd packages/volto && pnpm build-storybook -o ../../docs/_build/html/storybook)

.PHONY: patches
patches:
Expand Down
24 changes: 24 additions & 0 deletions docs/source/contributing/documentation.md
Original file line number Diff line number Diff line change
Expand Up @@ -144,3 +144,27 @@ To build the Volto Storybook locally and test your entry, run the following comm
```shell
make storybook-build
```


(link-to-storybook-entries-from-documentation)=

### Link to Storybook entries from documentation

To hyperlink to Storybook entries from the narrative documentation, you can use one of two syntaxes.

Use HTML syntax to enable hyperlinking in development, within Netlify preview builds, and when the main Plone documenation is updated.
Hyperlinking in development requires that you run both `make docs-html` and `make storybook-build` commands once, then whenever you update either the narrative documentation or the Storybook.

```html
<a href="/storybook/index.html?path=/story/edit-widgets-colorpicker--default">color picker widget</a>
```

<a href="/storybook/index.html?path=/story/edit-widgets-colorpicker--default">color picker widget</a>

Use CommonMark syntax to point only to the main production Plone documentation.

```md
[color picker widget](https://6.docs.plone.org/storybook/index.html?path=/story/edit-widgets-colorpicker--default)
```

[color picker widget](https://6.docs.plone.org/storybook/index.html?path=/story/edit-widgets-colorpicker--default)
1 change: 0 additions & 1 deletion netlify.toml
Original file line number Diff line number Diff line change
@@ -1,5 +1,4 @@
[build.environment]
PYTHON_VERSION = "3.8"
NODE_VERSION = "16.17.1"
[build]
ignore = "git diff --quiet $CACHED_COMMIT_REF $COMMIT_REF ./docs/"
1 change: 1 addition & 0 deletions packages/volto/news/5599.documentation
Original file line number Diff line number Diff line change
@@ -0,0 +1 @@
Enabled hyperlinking from narrative documentation to Storybook entries while developing, in Netlify preview builds, and when deployed to the main production Plone documentation. Documented usage and syntax in {ref}`link-to-storybook-entries-from-documentation`. @stevepiercy