improve context

sfeir-open-source · May 27, 2024 · 6a2200c · 6a2200c
1 parent e9359fd
commit 6a2200c
Showing 1 changed file with 23 additions and 0 deletions.
diff --git a/docs/markdown/06-routing-context-suspense/20-context.md b/docs/markdown/06-routing-context-suspense/20-context.md
@@ -121,3 +121,26 @@ export ThemeProvider() {
 ```
 
 <!-- .element: class="big-code" -->
+
+##==##
+
+<!-- .slide: class="with-code" -->
+
+# Use theme everywhere!
+
+```TypeScript [1|3-6|8-11]
+import { useTheme } from './useTheme';
+
+function ShowColorTheme() {
+    const { theme } = useTheme();
+    return <p>{theme}</p>
+}
+
+function ThemeSwitcher() {
+    const { theme, setTheme } = useTheme();
+    const nextTheme = theme === 'light' ? 'dark' : 'light';
+    return <button onClick={() => setTheme(nextTheme)}>Active {nextTheme}</button>;
+}
+```
+
+<!-- .element: class="big-code" -->