Skip to content

Commit

Permalink
Add docs for using values with localStorage
Browse files Browse the repository at this point in the history
  • Loading branch information
sgwilym committed Feb 3, 2021
1 parent 626d85b commit 2e9b1a9
Show file tree
Hide file tree
Showing 2 changed files with 24 additions and 0 deletions.
6 changes: 6 additions & 0 deletions docs/components.md
Original file line number Diff line number Diff line change
Expand Up @@ -78,6 +78,12 @@ A form which creates an invitation code for a given workspace, provided via the

A form which takes an invitation code and adds the encoded workspace and pubs to the app. Also offers an interface for selecting which pubs you'd like to add.

## LocalStorageSettingsWriter

(Doesn't render anything!)

This component writes app settings to a browser's localStorage whenever there are changes. Use it with the `useLocalStorageEarthstarSettings` hook, which reads the values it writes.

## NewKeypairForm

![NewKeypairForm](images/new-keypair-form.png)
Expand Down
18 changes: 18 additions & 0 deletions docs/hooks.md
Original file line number Diff line number Diff line change
Expand Up @@ -217,3 +217,21 @@ useSubscribeToStorages({
},
});
```

### useLocalStorageEarthstarSettings

If your Earthstar app is running in the browser, it's nice to have your user's settings persisted between sessions. This hook pulls the values from localStorage that can then be passed to `EarthstarPeer`.

This hook expects a string which you can use to differentiate the keys used with localStorage. This is especially important when many apps will be run on the same address, e.g. localhost:3000.

Use this key in combination with `<LocalStorageSettingsWriter>`, which will listen for changes and write them to localStorage.

```jsx
const initValues = useLocalStorageEarthstarSettings('my-app');

return (
<EarthstarPeer {...initValues}>
<LocalStorageSettingsWriter />
</EarthstarPeer>
)
```

0 comments on commit 2e9b1a9

Please sign in to comment.