Skip to content

Commit 6726a9f

Browse files
earthyoungearthyoung
authored
Merge pull request #48 from pythonkr/refactor/separate-common-package
Refactor/separate common package
2 parents 46e5af3 + e0d2576 commit 6726a9f

75 files changed

Lines changed: 1324 additions & 1354 deletions

Some content is hidden

Large Commits have some content hidden by default. Use the searchbox below for content that may be hidden.

‎apps/pyconkr-admin/src/components/elements/admin_signin_guard.tsx‎

Lines changed: 3 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -1,4 +1,4 @@
1-
import * as Common from "@frontend/common";
1+
import { useBackendAdminClient, useSignedInUserQuery } from "@frontend/common/src/hooks/useAdminAPI";
22
import { CircularProgress } from "@mui/material";
33
import { ErrorBoundary, Suspense } from "@suspensive/react";
44
import * as React from "react";
@@ -9,8 +9,8 @@ import { addSnackbar } from "../../utils/snackbar";
99
export const BackendAdminSignInGuard: React.FC<{ children: React.ReactNode }> = ErrorBoundary.with(
1010
{ fallback: <>로그인 정보를 불러오는 중 문제가 발생했습니다.</> },
1111
Suspense.with({ fallback: <CircularProgress /> }, ({ children }) => {
12-
const backendAdminAPIClient = Common.Hooks.BackendAdminAPI.useBackendAdminClient();
13-
const { data } = Common.Hooks.BackendAdminAPI.useSignedInUserQuery(backendAdminAPIClient);
12+
const backendAdminAPIClient = useBackendAdminClient();
13+
const { data } = useSignedInUserQuery(backendAdminAPIClient);
1414

1515
if (!data) {
1616
addSnackbar("로그인 후 이용해주세요.", "error");

‎apps/pyconkr-admin/src/components/layouts/admin_editor.tsx‎

Lines changed: 50 additions & 38 deletions
Original file line numberDiff line numberDiff line change
@@ -1,4 +1,18 @@
1-
import * as Common from "@frontend/common";
1+
import { Components } from "@frontend/common";
2+
import { retrieve } from "@frontend/common/src/apis/admin_api";
3+
import {
4+
useBackendAdminClient,
5+
useChoicesQuery,
6+
useCreateMutation,
7+
useRemoveMutation,
8+
useSchemaQuery,
9+
useUpdateMutation,
10+
} from "@frontend/common/src/hooks/useAdminAPI";
11+
import {
12+
filterPropertiesByLanguageInJsonSchema,
13+
filterReadOnlyPropertiesInJsonSchema,
14+
filterWritablePropertiesInJsonSchema,
15+
} from "@frontend/common/src/utils";
216
import { Add, Close, Delete, Edit } from "@mui/icons-material";
317
import {
418
Box,
@@ -132,7 +146,7 @@ const fieldPropsToSelectedProps = (props: FieldProps): OutlinedSelectProps & { d
132146
};
133147

134148
const M2MSelect: Field = ErrorBoundary.with(
135-
{ fallback: Common.Components.ErrorFallback },
149+
{ fallback: Components.ErrorFallback },
136150
Suspense.with({ fallback: <CircularProgress /> }, (props) => {
137151
const selectable = (props.schema.items as JSONSchema7).oneOf as DescriptedEnum[];
138152
const selectableListObj: DescriptedEnumObject = selectable.reduce((a, i) => ({ ...a, [i.const]: i }), {} as DescriptedEnumObject);
@@ -167,29 +181,26 @@ const MDRendererContainer = styled(Box)(({ theme }) => ({
167181
},
168182
}));
169183

170-
const MDEditorField: Field = ErrorBoundary.with(
171-
{ fallback: Common.Components.ErrorFallback },
172-
({ disabled, formData, name, onChange: rawOnChange }) => {
173-
const [valueState, setValueState] = React.useState<string | undefined>(formData?.toString() || "");
174-
const onChange = (value?: string) => {
175-
setValueState(value);
176-
rawOnChange(value, undefined, name);
177-
};
178-
return (
179-
<MUIStyledFieldset>
180-
<Typography variant="subtitle2" component="legend" children={name} />
181-
<Stack direction="row" spacing={2} sx={{ width: "100%", height: "100%", minHeight: "100%", maxHeight: "100%", flexGrow: 1, py: 2 }}>
182-
<Box sx={{ width: "50%", maxWidth: "50%" }}>
183-
<Common.Components.MarkdownEditor disabled={disabled} name={name} value={valueState} onChange={onChange} extraCommands={[]} />
184-
</Box>
185-
<MDRendererContainer>
186-
<Common.Components.MDXRenderer text={valueState || ""} format="md" />
187-
</MDRendererContainer>
188-
</Stack>
189-
</MUIStyledFieldset>
190-
);
191-
}
192-
);
184+
const MDEditorField: Field = ErrorBoundary.with({ fallback: Components.ErrorFallback }, ({ disabled, formData, name, onChange: rawOnChange }) => {
185+
const [valueState, setValueState] = React.useState<string | undefined>(formData?.toString() || "");
186+
const onChange = (value?: string) => {
187+
setValueState(value);
188+
rawOnChange(value, undefined, name);
189+
};
190+
return (
191+
<MUIStyledFieldset>
192+
<Typography variant="subtitle2" component="legend" children={name} />
193+
<Stack direction="row" spacing={2} sx={{ width: "100%", height: "100%", minHeight: "100%", maxHeight: "100%", flexGrow: 1, py: 2 }}>
194+
<Box sx={{ width: "50%", maxWidth: "50%" }}>
195+
<Components.MarkdownEditor disabled={disabled} name={name} value={valueState} onChange={onChange} extraCommands={[]} />
196+
</Box>
197+
<MDRendererContainer>
198+
<Components.MDXRenderer text={valueState || ""} format="md" />
199+
</MDRendererContainer>
200+
</Stack>
201+
</MUIStyledFieldset>
202+
);
203+
});
193204

194205
type ReadOnlyValueFieldStateType = {
195206
loading: boolean;
@@ -234,7 +245,7 @@ const ReadOnlyValueField: React.FC<{
234245
)}
235246
{fieldState.blob.type.startsWith("application/json") && fieldState.blobText && (
236247
<Box sx={{ maxWidth: "600px", overflow: "auto" }}>
237-
<Common.Components.LottieDebugPanel data={JSON.parse(fieldState.blobText)} />
248+
<Components.LottieDebugPanel data={JSON.parse(fieldState.blobText)} />
238249
</Box>
239250
)}
240251
<a href={value as string}>링크</a>
@@ -251,7 +262,7 @@ type InnerAdminEditorStateType = {
251262
};
252263

253264
const InnerAdminEditor: React.FC<AppResourceIdType & AdminEditorPropsType> = ErrorBoundary.with(
254-
{ fallback: Common.Components.ErrorFallback },
265+
{ fallback: Components.ErrorFallback },
255266
Suspense.with(
256267
{ fallback: <CircularProgress /> },
257268
({
@@ -275,9 +286,10 @@ const InnerAdminEditor: React.FC<AppResourceIdType & AdminEditorPropsType> = Err
275286
tab: 0,
276287
formData: undefined,
277288
});
278-
const backendAdminClient = Common.Hooks.BackendAdminAPI.useBackendAdminClient();
279-
const { data: schemaInfo } = Common.Hooks.BackendAdminAPI.useSchemaQuery(backendAdminClient, app, resource);
280-
const { data: choicesData } = Common.Hooks.BackendAdminAPI.useChoicesQuery(backendAdminClient, app, resource);
289+
290+
const backendAdminClient = useBackendAdminClient();
291+
const { data: schemaInfo } = useSchemaQuery(backendAdminClient, app, resource);
292+
const { data: choicesData } = useChoicesQuery(backendAdminClient, app, resource);
281293

282294
// Merge choices into schema for FK/M2M fields
283295
React.useMemo(() => {
@@ -299,9 +311,9 @@ const InnerAdminEditor: React.FC<AppResourceIdType & AdminEditorPropsType> = Err
299311
const selectedLanguage = editorState.tab === 0 ? "ko" : "en";
300312
const notSelectedLanguage = editorState.tab === 0 ? "en" : "ko";
301313

302-
const createMutation = Common.Hooks.BackendAdminAPI.useCreateMutation<Record<string, string>>(backendAdminClient, app, resource);
303-
const modifyMutation = Common.Hooks.BackendAdminAPI.useUpdateMutation<Record<string, string>>(backendAdminClient, app, resource, id || "");
304-
const deleteMutation = Common.Hooks.BackendAdminAPI.useRemoveMutation(backendAdminClient, app, resource, id || "undefined");
314+
const createMutation = useCreateMutation<Record<string, string>>(backendAdminClient, app, resource);
315+
const modifyMutation = useUpdateMutation<Record<string, string>>(backendAdminClient, app, resource, id || "");
316+
const deleteMutation = useRemoveMutation(backendAdminClient, app, resource, id || "undefined");
305317
const submitMutation = id ? modifyMutation : createMutation;
306318

307319
React.useEffect(() => {
@@ -311,7 +323,7 @@ const InnerAdminEditor: React.FC<AppResourceIdType & AdminEditorPropsType> = Err
311323
return;
312324
}
313325

314-
const initialData = await Common.BackendAdminAPIs.retrieve<Record<string, string>>(backendAdminClient, app, resource, id)();
326+
const initialData = await retrieve<Record<string, string>>(backendAdminClient, app, resource, id)();
315327
setFormData({ ...initialData, ...context });
316328
})();
317329
// eslint-disable-next-line react-hooks/exhaustive-deps
@@ -359,13 +371,13 @@ const InnerAdminEditor: React.FC<AppResourceIdType & AdminEditorPropsType> = Err
359371
.reduce((acc, [key, value]) => ({ ...acc, [key]: value }), {} as RJSFSchema);
360372
}
361373

362-
const writableSchema = Common.Utils.filterPropertiesByLanguageInJsonSchema(
363-
Common.Utils.filterWritablePropertiesInJsonSchema(schemaInfo.schema),
374+
const writableSchema = filterPropertiesByLanguageInJsonSchema(
375+
filterWritablePropertiesInJsonSchema(schemaInfo.schema),
364376
schemaInfo.translation_fields,
365377
selectedLanguage
366378
);
367-
const readOnlySchema = Common.Utils.filterPropertiesByLanguageInJsonSchema(
368-
Common.Utils.filterReadOnlyPropertiesInJsonSchema(schemaInfo.schema),
379+
const readOnlySchema = filterPropertiesByLanguageInJsonSchema(
380+
filterReadOnlyPropertiesInJsonSchema(schemaInfo.schema),
369381
schemaInfo.translation_fields,
370382
selectedLanguage
371383
);

‎apps/pyconkr-admin/src/components/layouts/admin_list.tsx‎

Lines changed: 10 additions & 7 deletions
Original file line numberDiff line numberDiff line change
@@ -1,4 +1,6 @@
1-
import * as Common from "@frontend/common";
1+
import { Components } from "@frontend/common";
2+
import { useBackendAdminClient, useChoicesQuery, useListQuery, useOpenApiSchemaQuery } from "@frontend/common/src/hooks/useAdminAPI";
3+
import { extractQueryParameters } from "@frontend/common/src/utils";
24
import { Add } from "@mui/icons-material";
35
import { Box, Button, CircularProgress, Stack, Table, TableBody, TableCell, TableHead, TableRow, Typography } from "@mui/material";
46
import { ErrorBoundary, Suspense } from "@suspensive/react";
@@ -24,22 +26,23 @@ type ListRowType = {
2426
};
2527

2628
const InnerAdminList: React.FC<AdminListProps> = ErrorBoundary.with(
27-
{ fallback: Common.Components.ErrorFallback },
29+
{ fallback: Components.ErrorFallback },
2830
Suspense.with({ fallback: <CircularProgress /> }, ({ app, resource, hideCreatedAt, hideUpdatedAt, hideCreateNew }) => {
2931
const navigate = useNavigate();
32+
3033
const [searchParams, setSearchParams] = useSearchParams();
31-
const backendAdminClient = Common.Hooks.BackendAdminAPI.useBackendAdminClient();
34+
const backendAdminClient = useBackendAdminClient();
3235

3336
const filterParams: Record<string, string> = Object.fromEntries(searchParams.entries());
34-
const listQuery = Common.Hooks.BackendAdminAPI.useListQuery<ListRowType>(backendAdminClient, app, resource, filterParams);
37+
const listQuery = useListQuery<ListRowType>(backendAdminClient, app, resource, filterParams);
3538

36-
const openApiSchemaQuery = Common.Hooks.BackendAdminAPI.useOpenApiSchemaQuery(backendAdminClient);
39+
const openApiSchemaQuery = useOpenApiSchemaQuery(backendAdminClient);
3740
const queryParameters = React.useMemo(
38-
() => Common.Utils.extractQueryParameters(openApiSchemaQuery.data, app, resource),
41+
() => extractQueryParameters(openApiSchemaQuery.data, app, resource),
3942
[openApiSchemaQuery.data, app, resource]
4043
);
4144

42-
const choicesQuery = Common.Hooks.BackendAdminAPI.useChoicesQuery(backendAdminClient, app, resource);
45+
const choicesQuery = useChoicesQuery(backendAdminClient, app, resource);
4346

4447
const handleFilterApply = (newParams: Record<string, string>) => setSearchParams(newParams, { replace: true });
4548

‎apps/pyconkr-admin/src/components/pages/account/account.tsx‎

Lines changed: 5 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -1,14 +1,15 @@
1-
import * as Common from "@frontend/common";
1+
import { Components } from "@frontend/common";
2+
import { useBackendAdminClient, useSignedInUserQuery } from "@frontend/common/src/hooks/useAdminAPI";
23
import { CircularProgress } from "@mui/material";
34
import { ErrorBoundary, Suspense } from "@suspensive/react";
45
import * as React from "react";
56
import { Navigate } from "react-router-dom";
67

78
export const AccountRedirectPage: React.FC = ErrorBoundary.with(
8-
{ fallback: Common.Components.ErrorFallback },
9+
{ fallback: Components.ErrorFallback },
910
Suspense.with({ fallback: <CircularProgress /> }, () => {
10-
const backendAdminAPIClient = Common.Hooks.BackendAdminAPI.useBackendAdminClient();
11-
const { data } = Common.Hooks.BackendAdminAPI.useSignedInUserQuery(backendAdminAPIClient);
11+
const backendAdminAPIClient = useBackendAdminClient();
12+
const { data } = useSignedInUserQuery(backendAdminAPIClient);
1213

1314
return data ? <Navigate to="/account/manage" replace /> : <Navigate to="/account/sign-in" replace />;
1415
})

‎apps/pyconkr-admin/src/components/pages/account/manage.tsx‎

Lines changed: 9 additions & 7 deletions
Original file line numberDiff line numberDiff line change
@@ -1,4 +1,6 @@
1-
import * as Common from "@frontend/common";
1+
import { me } from "@frontend/common/src/apis/admin_api";
2+
import { useBackendAdminClient, useChangePasswordMutation, useSignOutMutation } from "@frontend/common/src/hooks/useAdminAPI";
3+
import { getFormValue, isFormValid } from "@frontend/common/src/utils";
24
import { Logout } from "@mui/icons-material";
35
import { Button, Stack, Tab, Tabs, TextField, Typography } from "@mui/material";
46
import * as React from "react";
@@ -16,9 +18,9 @@ export const AccountManagementPage: React.FC = () => {
1618
const changePasswordFormRef = React.useRef<HTMLFormElement>(null);
1719
const [pageState, setPageState] = React.useState<{ tab: number }>({ tab: 0 });
1820
const navigate = useNavigate();
19-
const backendAdminAPIClient = Common.Hooks.BackendAdminAPI.useBackendAdminClient();
20-
const signOutMutation = Common.Hooks.BackendAdminAPI.useSignOutMutation(backendAdminAPIClient);
21-
const changePasswordMutation = Common.Hooks.BackendAdminAPI.useChangePasswordMutation(backendAdminAPIClient);
21+
const backendAdminAPIClient = useBackendAdminClient();
22+
const signOutMutation = useSignOutMutation(backendAdminAPIClient);
23+
const changePasswordMutation = useChangePasswordMutation(backendAdminAPIClient);
2224

2325
const setTab = (_: React.SyntheticEvent, tab: number) => setPageState((ps) => ({ ...ps, tab }));
2426

@@ -37,12 +39,12 @@ export const AccountManagementPage: React.FC = () => {
3739
event.stopPropagation();
3840

3941
const form = changePasswordFormRef.current;
40-
if (!Common.Utils.isFormValid(form)) {
42+
if (!isFormValid(form)) {
4143
addSnackbar("폼에 오류가 있습니다. 다시 확인해주세요.", "error");
4244
return;
4345
}
4446

45-
const formData = Common.Utils.getFormValue<ChangePasswordFormType>({ form });
47+
const formData = getFormValue<ChangePasswordFormType>({ form });
4648
if (formData.new_password !== formData.new_password_confirm) {
4749
addSnackbar("새 비밀번호와 확인 비밀번호가 일치하지 않습니다.", "error");
4850
return;
@@ -59,7 +61,7 @@ export const AccountManagementPage: React.FC = () => {
5961

6062
React.useEffect(() => {
6163
(async () => {
62-
const userInfo = await Common.BackendAdminAPIs.me(backendAdminAPIClient)();
64+
const userInfo = await me(backendAdminAPIClient)();
6365
if (!userInfo) {
6466
addSnackbar("로그아웃 상태입니다!", "error");
6567
navigate("/");

‎apps/pyconkr-admin/src/components/pages/account/sign_in.tsx‎

Lines changed: 7 additions & 5 deletions
Original file line numberDiff line numberDiff line change
@@ -1,4 +1,6 @@
1-
import * as Common from "@frontend/common";
1+
import { useBackendAdminClient, useSignInMutation } from "@frontend/common/src/hooks/useAdminAPI";
2+
import { getFormValue } from "@frontend/common/src/utils";
3+
import { me } from "@frontend/common/src/apis/admin_api";
24
import { Login } from "@mui/icons-material";
35
import { Button, Stack, TextField, Typography } from "@mui/material";
46
import * as React from "react";
@@ -16,14 +18,14 @@ export const SignInPage: React.FC = () => {
1618
const [pageState, setPageState] = React.useState<PageStateType>({ userJustSignedIn: false });
1719
const setUserJustSignedIn = () => setPageState((ps) => ({ ...ps, userJustSignedIn: true }));
1820

19-
const backendAdminAPIClient = Common.Hooks.BackendAdminAPI.useBackendAdminClient();
20-
const signInMutation = Common.Hooks.BackendAdminAPI.useSignInMutation(backendAdminAPIClient);
21+
const backendAdminAPIClient = useBackendAdminClient();
22+
const signInMutation = useSignInMutation(backendAdminAPIClient);
2123

2224
const handleSignIn = (event: React.FormEvent<HTMLFormElement>) => {
2325
event.preventDefault();
2426
if (!formRef.current) return;
2527

26-
const formData = Common.Utils.getFormValue<{
28+
const formData = getFormValue<{
2729
identity: string;
2830
password: string;
2931
}>({ form: formRef.current });
@@ -41,7 +43,7 @@ export const SignInPage: React.FC = () => {
4143
(async () => {
4244
if (pageState.userJustSignedIn) return;
4345

44-
const userInfo = await Common.BackendAdminAPIs.me(backendAdminAPIClient)();
46+
const userInfo = await me(backendAdminAPIClient)();
4547
if (userInfo) {
4648
addSnackbar(`이미 ${userInfo.username}님으로 로그인되어 있습니다!`, "success");
4749
navigate("/");

‎apps/pyconkr-admin/src/components/pages/file/upload.tsx‎

Lines changed: 3 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -1,4 +1,4 @@
1-
import * as Common from "@frontend/common";
1+
import { useBackendAdminClient, useUploadPublicFileMutation } from "@frontend/common/src/hooks/useAdminAPI";
22
import { CloudUpload, PermMedia } from "@mui/icons-material";
33
import { Box, Button, Input, Stack, Typography } from "@mui/material";
44
import * as React from "react";
@@ -25,8 +25,8 @@ const InnerPublicFileUploadPage: React.FC = () => {
2525
});
2626
const fileInputRef = React.useRef<HTMLInputElement>(null);
2727
const fileDragBoxRef = React.useRef<HTMLDivElement>(null);
28-
const backendAdminClient = Common.Hooks.BackendAdminAPI.useBackendAdminClient();
29-
const uploadPublicFileMutation = Common.Hooks.BackendAdminAPI.useUploadPublicFileMutation(backendAdminClient);
28+
const backendAdminClient = useBackendAdminClient();
29+
const uploadPublicFileMutation = useUploadPublicFileMutation(backendAdminClient);
3030

3131
const forceRerender = React.useCallback(
3232
() =>

0 commit comments

Comments
 (0)