From 76272cf3a89d11ab8ffd4438a4d7defdf46ec356 Mon Sep 17 00:00:00 2001 From: Alejandro Lembke Barrientos Date: Thu, 28 Apr 2022 18:15:07 +0000 Subject: [PATCH] PR-753737: Se Agregan los Actions de redux y se convierte todo el frontend a typescript. --- client/custom.d.ts | 4 +++ client/serviceWorkerRegistration.ts | 2 +- client/src/frontend/actions/index.ts | 9 +++++++ client/src/frontend/actions/testAction.ts | 25 +++++++++++++++++++ ...tialComponent.jsx => InitialComponent.tsx} | 0 ...{OtherComponent.jsx => OtherComponent.tsx} | 0 ...rincipalRoutes.jsx => PrincipalRoutes.tsx} | 0 client/src/frontend/index.tsx | 7 +----- client/src/frontend/reducers/index.ts | 5 ++-- .../{initialState.js => initialState.ts} | 2 +- client/src/frontend/reducers/testReducer.ts | 6 ++--- .../src/frontend/{setStore.js => setStore.ts} | 5 ++-- client/src/server/server.js | 2 +- 13 files changed, 50 insertions(+), 17 deletions(-) create mode 100644 client/custom.d.ts create mode 100644 client/src/frontend/actions/index.ts create mode 100644 client/src/frontend/actions/testAction.ts rename client/src/frontend/components/{InitialComponent.jsx => InitialComponent.tsx} (100%) rename client/src/frontend/components/{OtherComponent.jsx => OtherComponent.tsx} (100%) rename client/src/frontend/components/{PrincipalRoutes.jsx => PrincipalRoutes.tsx} (100%) rename client/src/frontend/reducers/{initialState.js => initialState.ts} (54%) rename client/src/frontend/{setStore.js => setStore.ts} (80%) diff --git a/client/custom.d.ts b/client/custom.d.ts new file mode 100644 index 0000000..e2013b5 --- /dev/null +++ b/client/custom.d.ts @@ -0,0 +1,4 @@ +declare module "*.svg" { + const content: any; + export default content; +} \ No newline at end of file diff --git a/client/serviceWorkerRegistration.ts b/client/serviceWorkerRegistration.ts index 93dc047..abd873a 100644 --- a/client/serviceWorkerRegistration.ts +++ b/client/serviceWorkerRegistration.ts @@ -1,4 +1,4 @@ -import {Workbox} from 'workbox-window'; +import { Workbox } from 'workbox-window'; import packageJson from './package.json'; const serviceWorkerRegistration = () => { diff --git a/client/src/frontend/actions/index.ts b/client/src/frontend/actions/index.ts new file mode 100644 index 0000000..b95c148 --- /dev/null +++ b/client/src/frontend/actions/index.ts @@ -0,0 +1,9 @@ +import test, { TTest } from './testAction'; + +export type TAction = TTest + +const actions = { + test +} + +export default actions \ No newline at end of file diff --git a/client/src/frontend/actions/testAction.ts b/client/src/frontend/actions/testAction.ts new file mode 100644 index 0000000..5891223 --- /dev/null +++ b/client/src/frontend/actions/testAction.ts @@ -0,0 +1,25 @@ +export enum ActionTypesTest { + ChangeHello = 'CHANGE_HELLO' +} + +export interface IChangeHello { + type: ActionTypesTest.ChangeHello + payload: IChangeHelloPayload +} + +export interface IChangeHelloPayload { + hello: any | undefined +} + +export type TTest = IChangeHello + +const changeHello = (payload: string) => ({ + type: 'CREATE_USER', + payload +}) + +const actions = { + changeHello +} + +export default actions \ No newline at end of file diff --git a/client/src/frontend/components/InitialComponent.jsx b/client/src/frontend/components/InitialComponent.tsx similarity index 100% rename from client/src/frontend/components/InitialComponent.jsx rename to client/src/frontend/components/InitialComponent.tsx diff --git a/client/src/frontend/components/OtherComponent.jsx b/client/src/frontend/components/OtherComponent.tsx similarity index 100% rename from client/src/frontend/components/OtherComponent.jsx rename to client/src/frontend/components/OtherComponent.tsx diff --git a/client/src/frontend/components/PrincipalRoutes.jsx b/client/src/frontend/components/PrincipalRoutes.tsx similarity index 100% rename from client/src/frontend/components/PrincipalRoutes.jsx rename to client/src/frontend/components/PrincipalRoutes.tsx diff --git a/client/src/frontend/index.tsx b/client/src/frontend/index.tsx index 41ffbb8..8bd84ef 100644 --- a/client/src/frontend/index.tsx +++ b/client/src/frontend/index.tsx @@ -5,7 +5,7 @@ import { BrowserRouter as Router } from 'react-router-dom'; // Redux import { Provider } from 'react-redux'; import { IInitialState } from './reducers/index'; -import setStore from './setStore.js'; +import setStore from './setStore'; import { config } from '../../config'; import './styles/global.sass'; @@ -61,11 +61,6 @@ hydrateRoot(container, ); */ -// If you want your app to work offline and load faster, you can change -// unregister() to register() below. Note this comes with some pitfalls. -// Learn more about service workers: http://bit.ly/CRA-PWA -//serviceWorker.register(); - if((env) && (env === 'production')){ serviceWorkerRegistration(); } diff --git a/client/src/frontend/reducers/index.ts b/client/src/frontend/reducers/index.ts index 2cfc768..29d9721 100644 --- a/client/src/frontend/reducers/index.ts +++ b/client/src/frontend/reducers/index.ts @@ -1,8 +1,9 @@ import { combineReducers } from 'redux'; -import testReducer, { ITestReducer } from './testReducer'; +import testReducer from './testReducer'; +import { IChangeHelloPayload } from '../actions/testAction'; export interface IInitialState { - testReducer?: ITestReducer | undefined + testReducer?: IChangeHelloPayload | undefined } const rootReducer = combineReducers({ diff --git a/client/src/frontend/reducers/initialState.js b/client/src/frontend/reducers/initialState.ts similarity index 54% rename from client/src/frontend/reducers/initialState.js rename to client/src/frontend/reducers/initialState.ts index 832378f..411deaa 100644 --- a/client/src/frontend/reducers/initialState.js +++ b/client/src/frontend/reducers/initialState.ts @@ -1,2 +1,2 @@ -let initialState = {}; +const initialState = {}; export default initialState; diff --git a/client/src/frontend/reducers/testReducer.ts b/client/src/frontend/reducers/testReducer.ts index 1a1f055..6c27a59 100644 --- a/client/src/frontend/reducers/testReducer.ts +++ b/client/src/frontend/reducers/testReducer.ts @@ -1,12 +1,10 @@ -export interface ITestReducer { - hello: any | undefined -} +import { TAction } from '../actions'; const initialState = { hello: 'world' }; -const testReducer = (state = initialState, action: { type: any; payload: { hello: any; }; }) => { +const testReducer = (state = initialState, action: TAction) => { switch (action.type){ case 'CHANGE_HELLO': { const newHello = action.payload.hello; diff --git a/client/src/frontend/setStore.js b/client/src/frontend/setStore.ts similarity index 80% rename from client/src/frontend/setStore.js rename to client/src/frontend/setStore.ts index dfef2ed..cc29cda 100644 --- a/client/src/frontend/setStore.js +++ b/client/src/frontend/setStore.ts @@ -3,7 +3,8 @@ import { createStore } from 'redux'; //, applyMiddleware // import { Provider } from 'react-redux'; import { composeWithDevTools as composeWithDevToolsWeb } from 'redux-devtools-extension'; import { config } from '../../config'; -import reducer from './reducers'; +import reducer, { IInitialState } from './reducers'; + const { env } = config; @@ -11,7 +12,7 @@ const composeEnhancers = composeWithDevToolsWeb({ // Specify here name, actionsBlacklist, actionsCreators and other options }); -const setStore = ({ initialState }) => { +const setStore = ({ initialState }: { initialState: IInitialState | undefined }) => { const store = env === 'development' ? createStore( reducer, initialState, diff --git a/client/src/server/server.js b/client/src/server/server.js index 70a6afc..3d6490e 100644 --- a/client/src/server/server.js +++ b/client/src/server/server.js @@ -17,7 +17,7 @@ import { StaticRouter } from 'react-router-dom/server'; import routes from '../routes'; //Redux import { Provider } from 'react-redux'; -import setStore from '../frontend/setStore.js'; +import setStore from '../frontend/setStore'; import initialState from '../frontend/reducers/initialState'; //Get Hashes import getHashManifest from './getHashManifest';