fix: shared 파일명 변경(CC-134)

.github/workflows/ci.cd.prod.yml

@@ -14,10 +14,12 @@ jobs:
         uses: actions/checkout@v2
       - name: Check Node v
         run: node -v
-      - name: Install Dependencies
-        run: yarn install --frozen-lockfile
       - name: ts & react install
         run: npm install --save-dev typescript @types/react @types/react-dom
+      - name: vite install
+        run: npm install --save-dev vite @vitejs/plugin-react @types/node
+        - name: Install Dependencies
+        run: yarn install --frozen-lockfile
       - name: Build
         run: npm run-script build
         working-directory: ./Caecae

Caecae/src/shared/Hyundux-saga/Example/Example.tsx

@@ -0,0 +1,86 @@
+import { createStory, Story } from "../Story";
+import huynxios from "../../Hyunxios";
+import { Action } from "../../Hyundux/Actions";
+import useSaga from "../useSaga";
+import { createState } from "../../Hyundux/State";
+import { makePayLoad } from "../../Hyundux/Util/StoreUtil";
+import Reducer from "../../Hyundux/Reducer";
+import useWork from "../../Hyundux/Hooks/useWork";
+import { useEffect } from "react";
+
+// storyExample
+interface HealthCheckDTO {
+  responseCode: number;
+  message: string;
+  data: string;
+}
+
+const HealthCheckStory: Story = async () => {
+  const response = await huynxios.get<HealthCheckDTO>("/api/health");
+  return response;
+};
+
+// test component
+const TestComponent = () => {
+  const [state, store] = useWork(initTestState, countReducer);
+  const [status, teller] = useSaga();
+  store;
+  useEffect(() => {
+    setTimeout(() => {
+      const testStory = createStory(HealthCheckStory, {});
+      teller(action.init, [testStory]);
+    }, 5000);
+  }, []);
+
+  let content = <p> is Loading... </p>;
+  if (status == "isSuccess") {
+    content = <p>{state.data}</p>;
+  } else if (status == "isError") {
+    content = <p>"fuck error"</p>;
+  }
+
+  return content;
+};
+
+export { TestComponent };
+
+// Test Work-------------------------------------------
+const WORKFLOW_NAME = "Test";
+
+// state type
+interface TestPayLoad {
+  data: string;
+}
+
+const initTestState = createState<TestPayLoad>(WORKFLOW_NAME, {
+  data: "",
+});
+
+// define reducer
+const countReducer: Reducer<TestPayLoad> = {
+  type: WORKFLOW_NAME,
+  reducer: async function reducer(state, action) {
+    switch (action.actionName) {
+      case "init": {
+        const actionPayLoad = (action.payload || {}) as { data: string };
+        return makePayLoad(state, { data: actionPayLoad.data });
+      }
+      default:
+        return state;
+    }
+  },
+};
+
+// actions
+const action = {
+  init: (object: object): Action => {
+    const parameter = object as { data: string };
+    return {
+      type: WORKFLOW_NAME,
+      actionName: "init",
+      payload: {
+        data: parameter.data,
+      },
+    };
+  },
+};

Caecae/src/shared/Hyundux-saga/Saga.tsx

@@ -0,0 +1,31 @@
+import { Action } from "../Hyundux/Actions";
+import store, { Store } from "../Hyundux/Store";
+import { RunStory } from "./Story";
+
+class Saga {
+  store: Store | null = null;
+
+  constructor(store: Store) {
+    this.store = store;
+  }
+  async run(action: (object: object) => Action, stories: RunStory[]) {
+    try {
+      const asyncResult = await Promise.all(
+        stories.map(async (story) => {
+          return await story();
+        })
+      );
+      const newResult = asyncResult.reduce((originObject, newObject) => {
+        return { ...originObject, ...newObject };
+      }, {});
+      this.store?.dispatch(action(newResult));
+    } catch (e) {
+      console.log(`Saga error: ${e}`);
+      throw "some story is problem";
+    }
+  }
+}
+
+const saga = new Saga(store);
+
+export default saga;

Caecae/src/shared/Hyundux-saga/Story.tsx

@@ -0,0 +1,8 @@
+export type Story = (object: object) => Promise<object>;
+export type RunStory = () => Promise<object>;
+
+export function createStory(story: Story, parameter: object): RunStory {
+  return function () {
+    return story(parameter);
+  };
+}

Caecae/src/shared/Hyundux-saga/index.tsx

@@ -0,0 +1,6 @@
+import saga from "./Saga";
+import { Story, RunStory, createStory } from "./Story";
+import useSaga from "./useSaga";
+
+export { saga, useSaga, createStory };
+export type { Story, RunStory };

Caecae/src/shared/Hyundux-saga/useSaga.tsx

@@ -0,0 +1,26 @@
+import { useState } from "react";
+import { Action } from "../Hyundux/Actions";
+import { RunStory } from "./Story";
+import saga from "./Saga";
+
+type SagaStatus = "isLoading" | "isSuccess" | "isError";
+
+const useSaga = () => {
+  const [sagaStatus, setSagaStatus] = useState<SagaStatus>("isLoading");
+
+  return [
+    sagaStatus,
+    async (action: (object: object) => Action, stories: RunStory[]) => {
+      setSagaStatus("isLoading");
+      try {
+        await saga.run(action, stories);
+      } catch (e) {
+        console.log(`saga Error: ${e}`);
+        setSagaStatus("isError");
+      }
+      setSagaStatus("isSuccess");
+    },
+  ] as const;
+};
+
+export default useSaga;

Caecae/src/shared/Hyundux/Actions.tsx

@@ -0,0 +1,12 @@
+import State from "./State";
+interface Action {
+  type: string;
+  actionName: string;
+  payload?: object;
+}
+interface DoAction<T> {
+  type: string;
+  doing: (state: State<T>) => State<T>;
+}
+
+export type { Action, DoAction };

Caecae/src/shared/Hyundux/Example_Counter/ConuntUI.tsx

@@ -0,0 +1,29 @@
+import useWork from "../Hooks/useWork.tsx";
+import { action, initCountState, countReducer } from "./CountWork.tsx";
+import store from "../Store.tsx";
+
+const Counter = () => {
+  const [state, dispatch] = useWork(initCountState, countReducer);
+
+  function temp1() {
+    dispatch;
+    store.dispatch(action.countUp());
+  }
+
+  function temp2() {
+    store.dispatch(action.getText("sdsd"));
+    store.dispatch(action.countDown());
+  }
+
+  return (
+    <div>
+      <h1>{state.text}</h1>
+      <div>{state.count}</div>
+      <br></br>
+      <button onClick={temp1}>up</button>
+      <button onClick={temp2}>down</button>
+    </div>
+  );
+};
+
+export default Counter;

Caecae/src/shared/Hyundux/Example_Counter/CountDo.tsx

@@ -0,0 +1,31 @@
+import { createState } from "../State";
+import { DoAction } from "../Actions";
+import State from "../State";
+import { makePayLoad } from "../Util/StoreUtil";
+
+const Do_NAME = "Count";
+
+// state type
+interface CountPayLoad {
+  count: number;
+  text: string;
+}
+
+const initCountState = createState<CountPayLoad>(Do_NAME, {
+  count: 0,
+  text: "helloWorld",
+});
+
+// actions
+const doAction = {
+  countUp: (): DoAction<CountPayLoad> => {
+    return {
+      type: Do_NAME,
+      doing: (state: State<CountPayLoad>): State<CountPayLoad> => {
+        return makePayLoad(state, { count: state.payload.count + 1 });
+      },
+    };
+  },
+};
+
+export { doAction, initCountState };

Caecae/src/shared/Hyundux/Example_Counter/CountWork.tsx

@@ -0,0 +1,64 @@
+import { createState } from "../State";
+import { makePayLoad } from "../Util/StoreUtil";
+import Reducer from "../Reducer";
+import { Action } from "../Actions";
+
+const WORKFLOW_NAME = "Count";
+
+// state type
+interface CountPayLoad {
+  count: number;
+  text: string;
+}
+
+const initCountState = createState<CountPayLoad>(WORKFLOW_NAME, {
+  count: 0,
+  text: "helloWorld",
+});
+
+// define reducer
+const countReducer: Reducer<CountPayLoad> = {
+  type: WORKFLOW_NAME,
+  reducer: async function reducer(state, action) {
+    const payLoad = state.payload;
+    switch (action.actionName) {
+      case "countUp":
+        return makePayLoad(state, { count: payLoad.count + 1 });
+      case "countDown":
+        return makePayLoad(state, { count: payLoad.count - 1 });
+      case "getText": {
+        const actionPayLoad = (action.payload || {}) as { text: string };
+        return makePayLoad(state, { text: actionPayLoad.text });
+      }
+      default:
+        return state;
+    }
+  },
+};
+
+// actions
+const action = {
+  countUp: (): Action => {
+    return {
+      type: WORKFLOW_NAME,
+      actionName: "countUp",
+    };
+  },
+  countDown: (): Action => {
+    return {
+      type: WORKFLOW_NAME,
+      actionName: "countDown",
+    };
+  },
+  getText: (text: string): Action => {
+    return {
+      type: WORKFLOW_NAME,
+      actionName: "getText",
+      payload: {
+        text: text,
+      },
+    };
+  },
+};
+
+export { action, initCountState, countReducer };

Caecae/src/shared/Hyundux/Hooks/useDo.tsx

@@ -0,0 +1,13 @@
+import { useState } from "react";
+import _State from "../State";
+import store from "../Store";
+
+function useDo<PayLoad>(initialState: _State<PayLoad>): PayLoad {
+  const [state, setState] = useState<_State<PayLoad>>(initialState);
+  store.subscribe(state, null, (newState) => {
+    setState(newState);
+  });
+  return state.payload;
+}
+
+export default useDo;

Caecae/src/shared/Hyundux/Hooks/useExistState.tsx

@@ -0,0 +1,9 @@
+import State from "../State";
+import store from "../Store";
+
+function useExistState<PayLoad>(initState: State<PayLoad>): PayLoad {
+  return store.states.filter((state) => state.type == initState.type)[0]
+    .payload as PayLoad;
+}
+
+export default useExistState;

Caecae/src/shared/Hyundux/Hooks/useWork.tsx

@@ -0,0 +1,17 @@
+import { useState } from "react";
+import HState from "../State";
+import store from "../Store";
+import Reducer from "../Reducer";
+
+function useWork<PayLoad>(
+  initialState: HState<PayLoad>,
+  reducer: Reducer<PayLoad>
+) {
+  const [state, setState] = useState<HState<PayLoad>>(initialState);
+  store.subscribe(state, reducer, (newState) => {
+    setState(newState);
+  });
+  return [state.payload, store.dispatch] as const;
+}
+
+export default useWork;

Caecae/src/shared/Hyundux/Reducer.tsx

@@ -0,0 +1,10 @@
+import State from "./State";
+import { Action } from "./Actions";
+
+interface Reducer<PayLoad> {
+  type: string;
+  // Todo : 여기 생각해보니 굳이 state를 뱉어주는건 reducer가 너무 복잡해질거 같아 그래서 그냥 Promise Payload를 리턴하는게 차라리 더 쉬울거 같아
+  reducer: (state: State<PayLoad>, action: Action) => Promise<State<PayLoad>>;
+}
+
+export default Reducer;

Caecae/src/shared/Hyundux/State.tsx

@@ -0,0 +1,14 @@
+interface State<T> {
+    type: string;
+    payload: T;
+}
+
+function createState<PayLoad>(type: string, payload: PayLoad): State<PayLoad> {
+    return {
+        type: type,
+        payload: payload
+    }
+}
+
+export { createState }
+export default State