Hacktoberfest 2026: le issue che i maintainer hanno segnato per ottobre, aperte e adatte ai principianti. Sfoglia le issue Hacktoberfest

Triggering Refresh to Cookie in `useCookie`

Aperta
#2,495 1 commento 0 reazioni 0 assegnatari Vedi su GitHub

Nessuno ha ancora preso questa issue.

Valutazione

Difficoltà
3/5
Tempo stimato
1-2 giorni
Idoneità per principianti
35/100
Tipo di issue
Funzionalità
Chiarezza
Abbastanza chiara
Stato di attività
Ferma
Stack tecnologico
typescript
Ambito
frontend

Direzione di ricerca

Start at the existing useCookie hook and inspect how it reads and updates the cookie value. Compare its current return value and update behavior with the requested refresh operation. Done means an external cookie change can be read through the hook after refresh is called, with deletion still reflected in the hook state.

Scritto dal modello di indicizzazione a partire dal testo della issue.

Descrizione

Is your feature request related to a problem? Please describe.
My cookie is changed by a request done in some API call. I need to react to that change. The new cookie value is not by useCookie() because it assumes that all changes are done through it.

Describe the solution you'd like
A refresh would probably suffice. Something like this:

import { useCallback, useState } from 'react';
import Cookies from 'js-cookie';

const useCookie = (
  cookieName: string
): [string | null, (newValue: string, options?: Cookies.CookieAttributes) => void, () => void, () => void] => {
  const [value, setValue] = useState<string | null>(() => Cookies.get(cookieName) || null);

  const updateCookie = useCallback(
    (newValue: string, options?: Cookies.CookieAttributes) => {
      Cookies.set(cookieName, newValue, options);
      setValue(newValue);
    },
    [cookieName]
  );

  const refreshCookie = useCallback(() => {
    const newValue = Cookies.get(cookieName);
    if (newValue === value) {
      return;
    }
    if (newValue !== undefined) {
      updateCookie(newValue);
    } else {
      deleteCookie();
    }
  }, [cookieName, updateCookie, value]);

  const deleteCookie = useCallback(() => {
    Cookies.remove(cookieName);
    setValue(null);
  }, [cookieName]);

  return [value, updateCookie, deleteCookie, refreshCookie];
};

export default useCookie;

(not tested)

Usage:

const [value, update, delete, refresh] = useCookie("sessionData");
// ...
fetch("/settings/update").then(() => refresh());

Describe alternatives you've considered
I'm open for suggestions

Lingua principale
TypeScript
Stelle
44k
Fork
3.3k
Metriche di merge delle PR
Nessuna PR unita negli ultimi 30g

Preparare l'ambiente

Come iniziare

  1. Leggi tutta la issue e poi la guida ai contributi del progetto.
  2. Commenta sulla issue per dire che te ne occupi tu — evita che due persone facciano lo stesso lavoro.
  3. Fai un fork del repository e lavora su un branch.
  4. Apri una pull request che faccia riferimento al numero della issue.

Altre issue di streamich/react-use

Tutte le issue di streamich/react-use

Issue simili

Altre issue su TypeScript

Ricevi le nuove issue nella tua casella

Un breve riepilogo di issue GitHub adatte ai principianti.