Skip to content

Commit c2f66d2

Browse files
committed
Improve reducer patterns menu example
1 parent ab8304c commit c2f66d2

File tree

1 file changed

+16
-16
lines changed

1 file changed

+16
-16
lines changed
Lines changed: 16 additions & 16 deletions
Original file line numberDiff line numberDiff line change
@@ -1,29 +1,29 @@
11
# React `useReducer` patterns
22

3-
## Multiple controls where only one can be open at a time
3+
## Menu
44

55
```ts
6-
type FilterValue = null | "first" | "second" | "third"; // null means closed
6+
type Menu = null | "file" | "edit" | "view"; // null means closed
77

8-
const [openFilter, dispatchOpen] = useReducer(
9-
(current: FilterValue, action: FilterValue) => {
8+
const [openMenu, tap] = useReducer(
9+
(current: Menu, action: Menu) => {
1010
if (action === current) {
11-
return null;
11+
return null; // Close if matches
1212
}
1313

14-
return action;
14+
return action; // Use passed value
1515
},
1616
null
1717
);
1818

19-
dispatchOpen("first") // "first"
20-
dispatchOpen(null) // null
21-
dispatchOpen("first") // "first"
22-
dispatchOpen("first") // null
23-
dispatchOpen("first") // "first"
24-
dispatchOpen("second") // "second"
25-
dispatchOpen("third") // "third"
26-
dispatchOpen("second") // "second"
27-
dispatchOpen("second") // null
28-
dispatchOpen(null) // null
19+
tap("file") // "file"
20+
tap(null) // null
21+
tap("file") // "file"
22+
tap("file") // null
23+
tap("file") // "file"
24+
tap("edit") // "edit"
25+
tap("view") // "view"
26+
tap("edit") // "edit"
27+
tap("edit") // null
28+
tap(null) // null
2929
```

0 commit comments

Comments
 (0)