Keep list of data as single local storage value and use it with react.
npm install react-trick-local-storage --save
Create storage in separate file:
import { createStorage } from 'react-trick-local-storage';
interface Fields {
accessToken: string | undefined;
}
export const storage = createStorage<Fields>(
key: 'my-app-storage-key',
);
Import storage in your react component:
import { useStorageValues } from 'react-trick-local-storage';
import { storage } from './storage';
const App: React.FC = () => {
const [accessToken] = useStorageValues(storage, 'accessToken');
if (accessToken) {
return <div>Authorized</div>;
}
return (
<div>
<button onClick={() => storage.set('accessToken', 'access-token')}>
Set access token
</button>
</div>
)
}
Project is build with tsdx CLI utility.
See node installation requirements here (you need node v14.x.x): https://gist.github.com/maxsbelt/a401dd0c3da8b0e1d50c9eebd2eccf65
In order to prevent some problems in source files related to different platforms .editorconfig
file is located in the root of the project. Please install plugin for your IDE/text editor.