From 7526918019786469f05eb4c195e42bdc1373016e Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?=E2=80=9CSebastian?=
 <64795732+slegarraga@users.noreply.github.com>
Date: Thu, 6 Aug 2026 06:51:11 -0400
Subject: [PATCH] translate eslint-plugin-react-hooks globals lint to Spanish
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

Signed-off-by: “Sebastian <64795732+slegarraga@users.noreply.github.com>
---
 .../lints/globals.md                          | 84 +++++++++++++++++++
 1 file changed, 84 insertions(+)
 create mode 100644 src/content/reference/eslint-plugin-react-hooks/lints/globals.md

diff --git a/src/content/reference/eslint-plugin-react-hooks/lints/globals.md b/src/content/reference/eslint-plugin-react-hooks/lints/globals.md
new file mode 100644
index 000000000..576417cd5
--- /dev/null
+++ b/src/content/reference/eslint-plugin-react-hooks/lints/globals.md
@@ -0,0 +1,84 @@
+---
+title: globals
+---
+
+<Intro>
+
+Valida la asignación o mutación de globales durante el renderizado, como parte de garantizar que los [efectos secundarios deben ejecutarse fuera del renderizado](/reference/rules/components-and-hooks-must-be-pure#side-effects-must-run-outside-of-render).
+
+</Intro>
+
+## Detalles de la regla {/*rule-details*/}
+
+Las variables globales existen fuera del control de React. Cuando las modificas durante el renderizado, rompes la suposición de React de que el renderizado es puro. Esto puede hacer que los componentes se comporten de manera diferente en desarrollo y producción, romper Fast Refresh e impedir que tu aplicación se optimice con funciones como React Compiler.
+
+### Inválido {/*invalid*/}
+
+Ejemplos de código incorrecto para esta regla:
+
+```js
+// ❌ Contador global
+let renderCount = 0;
+function Component() {
+  renderCount++; // Mutar un global
+  return <div>Count: {renderCount}</div>;
+}
+
+// ❌ Modificar propiedades de window
+function Component({userId}) {
+  window.currentUser = userId; // Mutación global
+  return <div>User: {userId}</div>;
+}
+
+// ❌ push en un arreglo global
+const events = [];
+function Component({event}) {
+  events.push(event); // Mutar un arreglo global
+  return <div>Events: {events.length}</div>;
+}
+
+// ❌ Manipulación de caché
+const cache = {};
+function Component({id}) {
+  if (!cache[id]) {
+    cache[id] = fetchData(id); // Modificar la caché durante el renderizado
+  }
+  return <div>{cache[id]}</div>;
+}
+```
+
+### Válido {/*valid*/}
+
+Ejemplos de código correcto para esta regla:
+
+```js
+// ✅ Usa estado para contadores
+function Component() {
+  const [clickCount, setClickCount] = useState(0);
+
+  const handleClick = () => {
+    setClickCount(c => c + 1);
+  };
+
+  return (
+    <button onClick={handleClick}>
+      Clicked: {clickCount} times
+    </button>
+  );
+}
+
+// ✅ Usa contexto para valores globales
+function Component() {
+  const user = useContext(UserContext);
+  return <div>User: {user.id}</div>;
+}
+
+// ✅ Sincroniza el estado externo con React
+function Component({title}) {
+  useEffect(() => {
+    document.title = title; // Correcto en un efecto
+  }, [title]);
+
+  return <div>Page: {title}</div>;
+}
+```