WorkSpace -> Company -> People Flow 체크 및 구현 (#43)

* feat: people, member 코드 분리 및 구현

* feat: workspace 이동시 id 및 이름 localStorage에 저장 및 구현

* env: msw 시작 멈추기

* feat: 회사 데이터 get으로 받아오기

* chore: 필요없는 코드 제거

* chore: 필요없는 코드 제거 people

* feat: workspace 받아오기 및 만들기 구현

* fix: reissue-workspace 수정

* feat: 해당 워크 스페이스 클릭시 reissue-workspace되도록 로직 구현

* feat: Company Data 받아오기 구현

* feat: people 데이터 받아오기 및 post 구현

* fix: PR Conflict 수정

src/apis/auth/refresh.api.ts

@@ -6,6 +6,7 @@ interface AuthAPIRequest {
   status: number;
   headers: any;
 }
+
 export async function refresh(): Promise<AuthAPIRequest> {
   try {
     const response = await axios.post(`${BASE_URI}/users/reissue`, {
@@ -25,7 +26,7 @@ export async function refreshWorkSpace(
 ): Promise<AuthAPIRequest> {
   try {
     const response = await axios.post(
-      `${BASE_URI}/users/reissue`,
+      `${BASE_URI}/users/reissue-workspace`,
       { workspaceId },
       {
         withCredentials: true,

src/apis/companies/useGetWCompany.ts

@@ -0,0 +1,11 @@
+import { axiosClient } from '../AxiosClient';
+
+export const useGetWCompany = async () => {
+  try {
+    const response = await axiosClient.get(`/workspaces/companies`);
+
+    return response.data;
+  } catch (error) {
+    console.error(error);
+  }
+};

src/apis/companies/usePostCompanyCol.ts

@@ -0,0 +1,35 @@
+import { axiosClient } from '../AxiosClient';
+
+export const postWCompany = async ({
+  columnId,
+  workspaceId,
+  columnName,
+  columnType,
+  columnIndex,
+  isHided,
+  dtype,
+}: {
+  columnId: number;
+  workspaceId: number;
+  columnName: 'string';
+  columnType: 'string';
+  columnIndex: number;
+  isHided: boolean;
+  dtype: 'string';
+}) => {
+  try {
+    const response = await axiosClient.post(`/workspaces`, {
+      columnId,
+      workspaceId,
+      columnName,
+      columnType,
+      columnIndex,
+      isHided,
+      dtype,
+    });
+
+    return response.data;
+  } catch (error) {
+    console.error(error);
+  }
+};

src/apis/companies/usePostWCompany.ts

@@ -0,0 +1,20 @@
+import { axiosClient } from '../AxiosClient';
+
+export const postWCompany = async ({
+  domain,
+  companyName,
+}: {
+  domain: string;
+  companyName: string;
+}) => {
+  try {
+    const response = await axiosClient.post(`/workspaces/companies`, {
+      domain,
+      companyName,
+    });
+
+    return response.data;
+  } catch (error) {
+    console.error(error);
+  }
+};

src/apis/member/useGetMember.ts

@@ -0,0 +1,13 @@
+import { axiosClient } from '@finnect/apis/AxiosClient';
+
+import { IMemberProps } from '@finnect/interface/MemberInterface';
+
+export const useGetMember = async (): Promise<IMemberProps> => {
+  try {
+    const response = await axiosClient.get(`/workspaces/members`);
+    return response.data;
+  } catch (error) {
+    console.error(error);
+    throw error;
+  }
+};

src/apis/member/usePostMember.ts

@@ -0,0 +1,20 @@
+import { axiosClient } from '@finnect/apis/AxiosClient';
+import { IMemberProps } from '@finnect/interface/MemberInterface';
+
+export const postMember = async (
+  nickname: string,
+  role: string,
+  phone: string
+): Promise<IMemberProps> => {
+  try {
+    const response = await axiosClient.post(`/workspaces/members`, {
+      nickname,
+      role,
+      phone,
+    });
+    return response.data;
+  } catch (error) {
+    console.error(error);
+    throw error;
+  }
+};

src/apis/people/useDeletePeople.ts

@@ -0,0 +1,11 @@
+import { axiosClient } from '@finnect/apis/AxiosClient';
+
+export const useDeletePeople = async () => {
+  try {
+    const response = await axiosClient.delete(`/workspaces/people`);
+    return response.data;
+  } catch (error) {
+    console.error(error);
+    throw error;
+  }
+};

src/apis/people/useGetPeople.ts

@@ -1,10 +1,13 @@
-import axios from 'axios';
+import { axiosClient } from '@finnect/apis/AxiosClient';
 
-export const useGetPeople = async () => {
+import { IPeopleAxiosProps } from '@finnect/interface/PeopleInterface';
+
+export const useGetPeople = async (): Promise<IPeopleAxiosProps> => {
   try {
-    const response = await axios.get(`/workspaces/members`);
+    const response = await axiosClient.get(`/workspaces/people`);
     return response.data;
   } catch (error) {
     console.error(error);
+    throw error;
   }
 };

src/apis/people/usePatchPeople.ts

@@ -0,0 +1,23 @@
+import { axiosClient } from '@finnect/apis/AxiosClient';
+
+import { IPeopleProps } from '@finnect/interface/PeopleInterface';
+
+export const patchPeople = async (
+  personName: string,
+  personRole: string,
+  personEmail: string,
+  personPhone: string
+): Promise<IPeopleProps> => {
+  try {
+    const response = await axiosClient.patch(`/workspaces/people`, {
+      personName,
+      personRole,
+      personEmail,
+      personPhone,
+    });
+    return response.data;
+  } catch (error) {
+    console.error(error);
+    throw error;
+  }
+};

src/apis/people/usePostPeople.ts

@@ -1,16 +1,19 @@
-import axios from 'axios';
+import { axiosClient } from '@finnect/apis/AxiosClient';
+
 import { IPeopleProps } from '@finnect/interface/PeopleInterface';
 
 export const postPeople = async (
-  nickname: string,
-  role: string,
-  phone: string
+  personName: string,
+  personRole: string,
+  personEmail: string,
+  personPhone: string
 ): Promise<IPeopleProps> => {
   try {
-    const response = await axios.post(`/workspaces/members`, {
-      nickname,
-      role,
-      phone,
+    const response = await axiosClient.post(`/workspaces/people`, {
+      personName,
+      personRole,
+      personEmail,
+      personPhone,
     });
     return response.data;
   } catch (error) {

src/apis/workspace/useGetWorkSpace.ts

@@ -3,6 +3,7 @@ import { axiosClient } from '../AxiosClient';
 export const useGetWorkspace = async () => {
   try {
     const response = await axiosClient.get(`/workspaces`);
+
     return response.data;
   } catch (error) {
     console.error(error);

src/apis/workspace/usePostWorkSpace.ts

@@ -7,6 +7,7 @@ export const usePostWorkspace = async ({
 }) => {
   try {
     const response = await axiosClient.post(`/workspaces`, { workspaceName });
+
     return response.data;
   } catch (error) {
     console.error(error);

src/atoms/company/useCompany.ts

@@ -15,11 +15,11 @@ export const columnDefsState = atom<ColDef[]>({
   default: [
     {
       headerName: 'Companies',
-      field: 'Companies',
+      field: 'companyName',
       checkboxSelection: true,
       rowDrag: true,
     },
-    { headerName: 'Domains', field: 'Domains' },
+    { headerName: 'Domains', field: 'domain' },
     {
       headerName: 'Categories',
       field: 'Categories',

src/atoms/people/usePeople.ts

@@ -12,12 +12,13 @@ export const columnDefsPeopleState = atom<ColDef[]>({
   key: 'columnDefsPeopleState',
   default: [
     {
-      headerName: 'Nickname',
-      field: 'nickname',
+      headerName: 'Name',
+      field: 'personName',
       checkboxSelection: true,
     },
-    { headerName: 'Role', field: 'role' },
-    { headerName: 'Phone', field: 'phone' },
+    { headerName: 'Role', field: 'personRole' },
+    { headerName: 'Email', field: 'personEmail' },
+    { headerName: 'Phone', field: 'personPhone' },
   ],
 });
 

src/atoms/sider/useSelectedMenu.ts

@@ -1,13 +1,19 @@
 import { atom } from 'recoil';
 
 export const selectedMenuItem = localStorage.getItem('selectedMenuItem');
+export const selectedWorkSpaceId = localStorage.getItem('selectedWorkSpaceId');
 export const selectedWorkSpace = localStorage.getItem('selectedWorkSpace');
 
 export const selectedMenuItemState = atom({
   key: 'selectedMenuItemState',
   default: selectedMenuItem,
 });
 
+export const selectedWorkSpaceIdState = atom({
+  key: 'selectedWorkSpaceId',
+  default: selectedWorkSpaceId,
+});
+
 export const selectedWorkSpaceState = atom({
   key: 'selectedWorkSpaceState',
   default: selectedWorkSpace,

src/components/common/modal/people/PeopleForm.tsx

@@ -1,36 +1,49 @@
-import { IPeopleProps } from '@finnect/interface/PeopleInterface';
 import { Form, Input, Button } from 'antd';
 
+import { IPeopleProps } from '@finnect/interface/PeopleInterface';
+
 interface PeopleFormProps {
   onCreatePeople: (person: IPeopleProps) => void;
 }
 
 const PeopleForm = ({ onCreatePeople }: PeopleFormProps) => {
   const [formPeople] = Form.useForm();
 
-  const handleFinish = ({ nickname, role, phone }: IPeopleProps) => {
-    onCreatePeople({ nickname, role, phone });
+  const handleFinish = ({
+    personName,
+    personRole,
+    personEmail,
+    personPhone,
+  }: IPeopleProps) => {
+    onCreatePeople({ personName, personRole, personEmail, personPhone });
     formPeople.resetFields();
   };
 
   return (
     <Form form={formPeople} onFinish={handleFinish}>
       <Form.Item
-        name='nickname'
+        name='personName'
         label='Nickname'
         rules={[{ required: true, message: 'Please input the nickname!' }]}
       >
         <Input />
       </Form.Item>
       <Form.Item
-        name='role'
+        name='personRole'
         label='Role'
         rules={[{ required: true, message: 'Please select the role!' }]}
       >
         <Input />
       </Form.Item>
       <Form.Item
-        name='phone'
+        name='personEmail'
+        label='Email'
+        rules={[{ required: true, message: 'Please input the email!' }]}
+      >
+        <Input />
+      </Form.Item>
+      <Form.Item
+        name='personPhone'
         label='Phone'
         rules={[{ required: true, message: 'Please input the phone!' }]}
       >