No matter how many times I visit the React docs... I always doubt which is the skeleton for reducer functions.
There are VSCode extensions that do this exact thing. the thing is, I have already installed tons of extensions so, there is a code snippet instead:
Just open Snippets: Configure User Snippets
and add the following section to the JSON:
"react-reducer": {
"scope": "javascriptreact,typescriptreact",
"prefix": "\\reducer",
"body": [
"function reducer(state, action) {",
"\tswitch(action.type) {",
"\t\tcase \"${1:foo}\": {",
"\t\t\treturn {",
"\t\t\t\t...state,",
"\t\t\t\tfoo: action.foo,",
"\t\t\t};",
"\t\t}",
"\t}",
"\tthrow Error('Unknown action: ' + action.type);",
"}"
],
},
Note: I use a custom prefix to name my custom snippets (\\
); this way I'm able to locate my snippets quicker in the suggestion box.
--
Cover image from unDraw
Thanks for reading.
💚
Top comments (0)