Hacktoberfest 2026: los issues que los mantenedores marcaron para octubre, abiertos y aptos para principiantes. Explorar issues de Hacktoberfest

Triggering Refresh to Cookie in `useCookie`

Abierto
#2,495 1 comentario 0 reacciones 0 asignados Ver en GitHub

Nadie ha tomado este issue todavía.

Evaluación

Dificultad
3/5
Tiempo estimado
1-2 días
Aptitud para principiantes
35/100
Tipo de issue
Nueva funcionalidad
Claridad
Bastante claro
Estado de actividad
Estancado
Stack tecnológico
typescript
Área
frontend

Línea de trabajo

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.

Escrito por el modelo de indexación a partir del texto del issue.

Descripción

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

Lenguaje dominante
TypeScript
Estrellas
44k
Forks
3.3k
Métricas de merge de PR
Sin PR fusionados en 30 d

Preparar el entorno

Primeros pasos

  1. Lee el issue completo y luego la guía de contribución del proyecto.
  2. Comenta en el issue que vas a ocuparte — evita que dos personas hagan lo mismo.
  3. Haz un fork del repositorio y trabaja en una rama.
  4. Abre un pull request que haga referencia al número del issue.

Más de streamich/react-use

Todos los issues de streamich/react-use

Issues similares

Más issues de TypeScript

Recibe los nuevos issues en tu correo

Un resumen breve de issues de GitHub para principiantes.