Skip to content

Instantly share code, notes, and snippets.

@JoostKiens
Created June 13, 2019 16:12
Show Gist options
  • Star 0 You must be signed in to star a gist
  • Fork 0 You must be signed in to fork a gist
  • Save JoostKiens/d7daf5c50300d80a8e3fecf8c1e22a1c to your computer and use it in GitHub Desktop.
Save JoostKiens/d7daf5c50300d80a8e3fecf8c1e22a1c to your computer and use it in GitHub Desktop.
React useCookies hook with context provider
import React from 'react'
import Cookies from 'js-cookie'
const CookiesContext = React.createContext(null)
export function useCookies() {
const cookies = React.useContext(CookiesContext)
if (!cookies)
throw new Error('Please make sure CookiesContextProvider is available')
return cookies
}
export function CookiesContextProvider({ children }) {
const cookies = useRawCookies()
return (
<CookiesContext.Provider value={cookies}>
{children}
</CookiesContext.Provider>
)
}
function useRawCookies() {
const [cookies, setCookies] = React.useState(() => Cookies.get() || {})
function get(name) {
return cookies[name]
}
function set(name, value, options) {
setCookies({ ...cookies, [name]: value })
Cookies.set(name, value, options)
}
function remove(name, options) {
const { [name]: _, ...otherCookies } = cookies
setCookies(otherCookies)
Cookies.remove(name, options)
}
return [get, set, remove, cookies]
}
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment