Skip to content

Persistent storage is a library that allows you to store hook's state in local storage or session storage so that the latest state is available even after the page is refreshed.

License

Notifications You must be signed in to change notification settings

nightmaregaurav/persistent-storage

Repository files navigation

persistent-storage

npm version HitCount
NPM


Description

Persistent storage is a library that allows you to store hook's state in local storage or session storage so that the latest state is available even after the page is refreshed.

Installation

npm install @nightmaregaurav/persistent-storage

Usage (Watch video)

Defining Storage (Adding StorageDescriptor)

import {StorageDescriptor, TStorageType} from "@nightmaregaurav/persistent-storage";

export const TThemes = ["default", "dark", "purple", "green", "orange"] as const;
export type TThemes = typeof TThemes[number];

export class ThemeStorageDescriptor extends StorageDescriptor<TThemes>{
    initialValueIfNotFoundInPreferredStorage: TThemes = "default";
    key: string = "Theme";
    preferredStorage: TStorageType = TStorageType.LocalStorage;
}

Setting Storage

import {ThemeStorageDescriptor} from "./....";

export const ThemeStorage = new ThemeStorageDescriptor();

Using Persistent Storage

import React, {useEffect} from "react";
import {usePersistentStorage} from "@nightmaregaurav/persistent-storage";
import {ThemeStorage} from "./example-store";

const Test = () => {
    const [theme, setTheme] = usePersistentStorage(ThemeStorage);
    useEffect(() => {
        console.log("Theme changed to: ", theme);
    }, [theme]);

    setTheme("dark");
    
    return (
        <div className= {"theme-" + theme}>
            test
        </div>
    );
};

export default Test;

How to Contribute

  • Fork the repository
  • Clone the forked repository
  • Make changes
  • Commit and push the changes
  • Create a pull request
  • Wait for the pull request to be merged
  • Celebrate
  • Repeat

If you are new to open source, you can read this to learn how to contribute to open source projects.
If you are new to GitHub, you can read this to learn how to use GitHub.
If you are new to Git, you can read this to learn how to use Git.
If you are new to TypeScript, you can read this to learn how to use TypeScript.

License

persistent-storage is released under the MIT License. You can find the full license details in the LICENSE file.

Made with ❤️ by NightmareGaurav.


Open For Contribution

About

Persistent storage is a library that allows you to store hook's state in local storage or session storage so that the latest state is available even after the page is refreshed.

Resources

License

Stars

Watchers

Forks

Releases

No releases published

Packages

No packages published