Skip to content

Instantly share code, notes, and snippets.

@ivanjeremic
Last active April 29, 2020 03:05
Show Gist options
  • Save ivanjeremic/e0fc9014a9e5f102f13bd5f4f95a3985 to your computer and use it in GitHub Desktop.
Save ivanjeremic/e0fc9014a9e5f102f13bd5f4f95a3985 to your computer and use it in GitHub Desktop.
React_Context_Typescript_Snippet_VSCODE
{
"Context_Typescript": {
"prefix": "ctxts",
"body": [
"import React, { useReducer } from 'react';",
"",
"/* ***** */",
"/* Types */",
"/* ***** */",
"interface Props {",
" children: React.ReactNode;",
"}",
"",
"interface StateTypes {",
" dummyBool: boolean;",
"}",
"interface ActionTypes {",
" type: string;",
"}",
"",
"type ContextProps = {",
" DummyAction: unknown;",
"};",
"",
"/* ******* */",
"/* Reducer */",
"/* ******* */",
"function stateReducer(state: StateTypes, action: ActionTypes) {",
" switch (action.type) {",
" case 'DUMMYACTION':",
" return {",
" ...state,",
" dummyBool: true",
" };",
"",
" default:",
" return state;",
" }",
"}",
"",
"export const AppContext = React.createContext<Partial<ContextProps>>({});",
"",
"export const AppContextProvider = (props: Props) => {",
" const { children } = props;",
"",
" /* ************ */",
" /* initialState */",
" /* ************ */",
" const initialState: StateTypes = {",
" dummyBool: false",
" };",
"",
" const [state, dispatch] = useReducer(stateReducer, initialState);",
"",
" const DummyAction = () => {",
" dispatch({ type: 'DUMMYACTION' });",
" };",
"",
" console.log('dummyBool', state.dummyBool);",
"",
" return (",
" <AppContext.Provider",
" value={{",
" DummyAction",
" }}",
" >",
" {children}",
" </AppContext.Provider>",
" );",
"};",
""
],
"description": "Context_Typescript"
}
}
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment