feat(website): UI/UX improvements (#2829)

* feat(website): UI/UX improvements * feat: UI/UX improvements * feat: UI/UX improvements
pmndrs · Nov 18, 2024 · cc3f3b6 · cc3f3b6
1 parent 14c028a
commit cc3f3b6
Show file tree

Hide file tree

Showing 48 changed files with 137 additions and 91 deletions.
diff --git a/docs/basics/comparison.mdx b/docs/basics/comparison.mdx
@@ -1,6 +1,6 @@
 ---
 title: Comparison
-nav: 6.02
+nav: 7.02
 ---
 
 Jotai was born to solve extra re-render issues in React.

diff --git a/docs/basics/concepts.mdx b/docs/basics/concepts.mdx
@@ -1,6 +1,6 @@
 ---
 title: Concepts
-nav: 6.01
+nav: 7.01
 ---
 
 Jotai is a library that will make you return to the basics of React development & keep everything simple.

diff --git a/docs/basics/functional-programming-and-jotai.mdx b/docs/basics/functional-programming-and-jotai.mdx
@@ -1,6 +1,6 @@
 ---
 title: Functional programming and Jotai
-nav: 6.04
+nav: 7.04
 ---
 
 ### Unexpected similarities

diff --git a/docs/basics/showcase.mdx b/docs/basics/showcase.mdx
@@ -1,6 +1,6 @@
 ---
 title: Showcase
-nav: 6.03
+nav: 7.03
 ---
 
 - Text Length example [![Open in CodeSandbox](https://img.shields.io/badge/Open%20in-CodeSandbox-blue?style=flat-square&logo=codesandbox)](https://githubbox.com/pmndrs/jotai/tree/main/examples/text_length)

diff --git a/docs/guides/async.mdx b/docs/guides/async.mdx
@@ -1,7 +1,7 @@
 ---
 title: Async
 description: This doc describes about the behavior with async.
-nav: 7.99
+nav: 8.99
 keywords: async
 published: false
 ---

diff --git a/docs/guides/atoms-in-atom.mdx b/docs/guides/atoms-in-atom.mdx
@@ -1,6 +1,6 @@
 ---
 title: Atoms in atom
-nav: 7.12
+nav: 8.12
 ---
 
 `atom()` creates an atom config, which is an object, but it doesn't hold a value.

diff --git a/docs/guides/composing-atoms.mdx b/docs/guides/composing-atoms.mdx
@@ -1,6 +1,6 @@
 ---
 title: Composing atoms
-nav: 7.11
+nav: 8.11
 ---
 
 The `atom` function provided by library is very primitive,

diff --git a/docs/guides/core-internals.mdx b/docs/guides/core-internals.mdx
@@ -1,7 +1,7 @@
 ---
 title: Core internals
 description: A simplified version of the core implementation
-nav: 7.10
+nav: 8.10
 ---
 
 This guide is beneficial for those who want to understand the core implementation of Jotai. It's not meant to be a complete example of the

diff --git a/docs/guides/debugging.mdx b/docs/guides/debugging.mdx
@@ -1,6 +1,6 @@
 ---
 title: Debugging
-nav: 7.07
+nav: 8.07
 keywords: debug,labels,devtools,freeze
 ---
 

diff --git a/docs/guides/gatsby.mdx b/docs/guides/gatsby.mdx
diff --git a/docs/guides/initialize-atom-on-render.mdx b/docs/guides/initialize-atom-on-render.mdx
@@ -1,7 +1,7 @@
 ---
 title: Initializing state on render
 description: How to initialize atom state on initial render
-nav: 7.13
+nav: 8.13
 ---
 
 There are times when you need to create an reusable component which uses atoms.

diff --git a/docs/guides/migrating-to-v2-api.mdx b/docs/guides/migrating-to-v2-api.mdx
@@ -1,7 +1,7 @@
 ---
 title: v2 API migration
 description: New "Async" API
-nav: 7.0
+nav: 8.0
 ---
 
 RFC: https://github.com/pmndrs/jotai/discussions/1514

diff --git a/docs/guides/nextjs.mdx b/docs/guides/nextjs.mdx
@@ -1,7 +1,7 @@
 ---
 title: Next.js
 description: How to use Jotai with Next.js
-nav: 7.03
+nav: 8.03
 keywords: next,nextjs
 ---
 

diff --git a/docs/guides/performance.mdx b/docs/guides/performance.mdx
@@ -1,7 +1,7 @@
 ---
 title: Performance
 description: How to limit extra re-renders
-nav: 7.08
+nav: 8.08
 keywords: performance
 ---
 

diff --git a/docs/guides/persistence.mdx b/docs/guides/persistence.mdx
@@ -1,7 +1,7 @@
 ---
 title: Persistence
 description: How to persist atoms
-nav: 7.14
+nav: 8.14
 ---
 
 Jotai has an [atomWithStorage function in the utils bundle](../utilities/storage.mdx) for persistence that supports persisting state in `sessionStorage`, `localStorage`, `AsyncStorage`, or the URL hash.

diff --git a/docs/guides/react-native.mdx b/docs/guides/react-native.mdx
@@ -1,7 +1,7 @@
 ---
 title: React Native
 description: Using Jotai in React Native
-nav: 7.06
+nav: 8.06
 keywords: native,ios,android
 ---
 

diff --git a/docs/guides/remix.mdx b/docs/guides/remix.mdx
@@ -1,7 +1,7 @@
 ---
 title: Remix
 description: How to use Jotai with Remix
-nav: 7.05
+nav: 8.05
 keywords: remix
 status: draft
 ---

diff --git a/docs/guides/resettable.mdx b/docs/guides/resettable.mdx
@@ -1,7 +1,7 @@
 ---
 title: Resettable
 description: How to use resettable atoms
-nav: 7.99
+nav: 8.99
 published: false
 ---
 

diff --git a/docs/guides/testing.mdx b/docs/guides/testing.mdx
@@ -1,7 +1,7 @@
 ---
 title: Testing
 description: How to test your code using Jotai
-nav: 7.09
+nav: 8.09
 keywords: test,testing
 ---
 

diff --git a/docs/guides/typescript.mdx b/docs/guides/typescript.mdx
@@ -1,7 +1,7 @@
 ---
 title: TypeScript
 description: How to use Jotai with TypeScript
-nav: 7.02
+nav: 8.02
 keywords: typescript,types
 ---
 

diff --git a/docs/guides/using-store-outside-react.mdx b/docs/guides/using-store-outside-react.mdx
@@ -1,7 +1,7 @@
 ---
 title: Using store outside React
 description: Using store outside React
-nav: 4.98
+nav: 8.98
 keywords: state, outside, react
 published: false
 ---

diff --git a/docs/guides/vite.mdx b/docs/guides/vite.mdx
@@ -1,7 +1,7 @@
 ---
 title: Vite
 description: How to use Jotai with Vite
-nav: 7.99
+nav: 8.99
 keywords: vite
 published: false
 ---

diff --git a/docs/guides/waku.mdx b/docs/guides/waku.mdx
@@ -0,0 +1,11 @@
+---
+title: Waku
+description: How to use Jotai with Waku
+nav: 8.04
+keywords: waku
+status: draft
+---
+
+### Hydration
+
+Jotai has support for hydration of atoms with `useHydrateAtoms`. The documentation for the hook can be seen [here](../utils/ssr.mdx).
diff --git a/docs/introduction.mdx → docs/index.mdx b/docs/introduction.mdx → docs/index.mdx
@@ -1,5 +1,5 @@
 ---
-title: Introduction
+title: Documentation
 description: Table of contents
 nav: 0
 ---
@@ -11,7 +11,7 @@ Welcome to the Jotai v2 documentation! Jotai's atomic approach to global React s
 - Minimal core API (2kb)
 - Many utilities and extensions
 - TypeScript oriented
-- Works with Next.js, Gatsby, Remix, Waku, and React Native
+- Works with Next.js, Waku, Remix, and React Native
 
 ## Core
 
@@ -27,30 +27,36 @@ Jotai also includes a `jotai/utils` bundle with a variety of extra utility funct
 
 ## Extensions
 
-Jotai has separate bundles for many official extensions including `atomWithQuery` for React Query and `atomWithMachine` for XState, among many others.
+Jotai has many officially maintained extensions including `atomWithQuery` for React Query and `atomWithMachine` for XState, among many others.
 
 <TOC section="extensions" />
 
+## Third-party
+
+Beyond the official extensions, there are many third-party community packages as well.
+
+<TOC section="third-party" />
+
 ## Tools
 
-There are also SWC and Babel compiler plugins for React Fast Refresh support and debugging labels. This creates the best developer experience when using Jotai with a React framework such as Next.js or Gatsby.
+Use SWC and Babel compiler plugins for React Fast Refresh support and debugging labels. This creates the best developer experience when using a React framework such as Next.js or Waku.
 
 <TOC section="tools" />
 
 ## Basics
 
-Learn the basic concepts and primitives of the library, discover how it compares with other solutions, and see examples of it in use.
+Learn the basic concepts of the library, discover how it compares with others, and see usage examples.
 
 <TOC section="basics" />
 
 ## Guides
 
-These guides can help with use common cases such as TypeScript, React frameworks, and basic patterns.
+Guides can help with use common cases such as TypeScript, React frameworks, and basic patterns.
 
 <TOC section="guides" />
 
 ## Recipes
 
-These recipes can help with more advanced patterns.
+Recipes can help with more advanced patterns.
 
 <TOC section="recipes" />
diff --git a/docs/recipes/atom-with-broadcast.mdx b/docs/recipes/atom-with-broadcast.mdx
@@ -1,6 +1,6 @@
 ---
 title: atomWithBroadcast
-nav: 8.09
+nav: 9.09
 keywords: creators,broadcast
 ---
 

diff --git a/docs/recipes/atom-with-compare.mdx b/docs/recipes/atom-with-compare.mdx
@@ -1,6 +1,6 @@
 ---
 title: atomWithCompare
-nav: 8.05
+nav: 9.05
 keywords: creators,compare
 ---
 

diff --git a/docs/recipes/atom-with-debounce.mdx b/docs/recipes/atom-with-debounce.mdx
@@ -1,6 +1,6 @@
 ---
 title: atomWithDebounce
-nav: 8.10
+nav: 9.10
 keywords: creators,debounce
 ---
 

diff --git a/docs/recipes/atom-with-listeners.mdx b/docs/recipes/atom-with-listeners.mdx
@@ -1,6 +1,6 @@
 ---
 title: atomWithListeners
-nav: 8.08
+nav: 9.08
 keywords: creators,listeners
 ---
 

diff --git a/docs/recipes/atom-with-refresh-and-default.mdx b/docs/recipes/atom-with-refresh-and-default.mdx
@@ -1,14 +1,14 @@
 ---
 title: atomWithRefreshAndDefault
-nav: 8.07
+nav: 9.07
 keywords: creators,refresh,default
 ---
 
 > This is for another implementation of [atomWithDefault](../utilities/resettable.mdx#atomwithdefault)
 
 ### Look back to atomWithDefault behavior
 
-As you can see in the example code in atomWithDefault section, the two atoms' relation is disconnected after updating created one, `count2Atom = atomWithDefault((get) => get(count1Atom) * 2)`.  
+As you can see in the example code in atomWithDefault section, the two atoms' relation is disconnected after updating created one, `count2Atom = atomWithDefault((get) => get(count1Atom) * 2)`.
 Let's confirm what's occurred,
 
 - 1. Click "increment count1", then count1 is 2 and count2 is 4

diff --git a/docs/recipes/atom-with-refresh.mdx b/docs/recipes/atom-with-refresh.mdx
@@ -1,6 +1,6 @@
 ---
 title: atomWithRefresh
-nav: 8.06
+nav: 9.06
 keywords: creators,refresh
 ---
 

diff --git a/docs/recipes/atom-with-toggle-and-storage.mdx b/docs/recipes/atom-with-toggle-and-storage.mdx
@@ -1,6 +1,6 @@
 ---
 title: atomWithToggleAndStorage
-nav: 8.05
+nav: 9.05
 keywords: creators,storage
 ---
 

diff --git a/docs/recipes/atom-with-toggle.mdx b/docs/recipes/atom-with-toggle.mdx
@@ -1,6 +1,6 @@
 ---
 title: atomWithToggle
-nav: 8.04
+nav: 9.04
 keywords: creators,toggle
 ---
 

diff --git a/docs/recipes/custom-useatom-hooks.mdx b/docs/recipes/custom-useatom-hooks.mdx
@@ -1,6 +1,6 @@
 ---
 title: Custom useAtom hooks
-nav: 8.02
+nav: 9.02
 keywords: custom,hook
 ---
 

diff --git a/docs/recipes/large-objects.mdx b/docs/recipes/large-objects.mdx
@@ -1,6 +1,6 @@
 ---
 title: Large objects
-nav: 8.01
+nav: 9.01
 keywords: large,object
 ---
 

diff --git a/docs/recipes/use-atom-effect.mdx b/docs/recipes/use-atom-effect.mdx
@@ -1,6 +1,6 @@
 ---
 title: useAtomEffect
-nav: 8.03
+nav: 9.03
 keywords: effect, atom effect, side effect, side-effect, sideeffect, hook, useAtomEffect
 ---
 

diff --git a/docs/recipes/use-reducer-atom.mdx b/docs/recipes/use-reducer-atom.mdx
@@ -1,6 +1,6 @@
 ---
 title: useReducerAtom
-nav: 8.11
+nav: 9.11
 keywords: reducer, hook, useReducerAtom
 ---
 

diff --git a/docs/tools/babel.mdx b/docs/tools/babel.mdx
@@ -1,7 +1,7 @@
 ---
 title: Babel
 description: This doc describes the `jotai/babel` bundle.
-nav: 5.02
+nav: 6.02
 keywords: babel,gatsby,fast,refresh
 ---
 

diff --git a/docs/tools/devtools.mdx b/docs/tools/devtools.mdx
@@ -1,7 +1,7 @@
 ---
 title: Devtools
 description: This doc describes Devtools for Jotai.
-nav: 5.03
+nav: 6.03
 keywords: devtools,debug,snapshot
 ---
 

diff --git a/docs/tools/swc.mdx b/docs/tools/swc.mdx
@@ -1,7 +1,7 @@
 ---
 title: SWC
 description: This doc describes SWC plugins for Jotai.
-nav: 5.01
+nav: 6.01
 keywords: swc,next,nextjs,fast,refresh
 ---