@reactivers/hooks Github link@reactivers/hooks NPM link

useCookie

Introduction

  • useCookie makes cookie management easier for you.
  • It allows you keep your cookies in state optionally.
  • All your components can access and listen cookies easily
const { getItem, setItem } = useCookie("your-cookie");

Getting Started

  • You need to import useCookie and CookieProvider.
  • useCookie reads data from CookieProvider. So you need to wrap your entry component with CookieProvider.

From Collection

import { useCookie, CookieProvider } from "@reactivers/hooks";

From Package

import { useCookie, CookieProvider } from "@reactivers/use-cookie";

Interfaces

Provider


interface CookieProviderProps {
    // If passed False it doesn't store the data in state.
    withState?: boolean; // Default = True
    
    // Calls this on any change in cookie via useCookie.
    onChange?: (cookie: Record<string, any>) => void;
}

Hook

interface CookieSetItem {
    
    //Value for cookie key
    key?: string,

    //Cookie's value
    value: any,

    //Expire configuration. You should pass one of them.
    expireDays?: number,
    expireHours?: number,
    expire?: string,

    //For domain
    path?: string // Default = "/"
}

interface IUseCookieReturn {
    getItem: (key?: string) => any;
    setItem: (params: CookieSetItem) => void;
    removeItem: (key?: string) => void;
    cookie: Record<string, any>
}

Example

Example Preview - CodeSandbox