전체 구조 수정 (#39)

전체 구조 수정

.github/workflows/deploy-admin.yml

@@ -7,7 +7,7 @@ on:
     workflow_dispatch:
 env:
     AWS_REGION: ap-northeast-2
-    ADMIN_BUCKET_NAME: vision.gdsc-knu.com
+    ADMIN_BUCKET_NAME: v-admin.gdsc-knu.com
 permissions:
     contents: read
 
@@ -41,8 +41,8 @@ jobs:
             - name: Configure AWS credentials
               uses: aws-actions/configure-aws-credentials@v4
               with:
-                  aws-access-key-id: ${{ secrets.AWS_ACCESS_KEY_ID }}
-                  aws-secret-access-key: ${{ secrets.AWS_SECRET_ACCESS_KEY }}
+                  aws-access-key-id: ${{ secrets.AWS_ADMIN_ACCESS_KEY_ID }}
+                  aws-secret-access-key: ${{ secrets.AWS_ADMIN_SECRET_ACCESS_KEY }}
                   aws-region: ${{ env.AWS_REGION }}
 
             - name: Upload to AWS S3

packages/admin/src/App.tsx

@@ -1,5 +1,5 @@
 import { Routes } from "@/app/routes";
-import { queryClient } from "@/shared/api/instance";
+import { queryClient } from "@/shared";
 import { QueryClientProvider } from "@tanstack/react-query";
 
 function App() {

packages/admin/src/app/index.ts

@@ -0,0 +1,2 @@
+export * from "./lib";
+export * from "./routes";

packages/admin/src/app/lib/index.ts

@@ -0,0 +1 @@
+export { cn } from "./utils";

packages/admin/src/app/routes/index.tsx → packages/admin/src/app/routes/Routes.tsx

@@ -1,15 +1,11 @@
-import { createBrowserRouter, Navigate, RouterProvider } from "react-router-dom";
+import { createBrowserRouter, RouterProvider } from "react-router-dom";
 
 import { RouterPath } from "./path";
 import { PeopleManagementPage } from "@/feature/people-management";
 
 const router = createBrowserRouter([
     {
         path: RouterPath.ROOT,
-        element: <Navigate to={RouterPath.ADMIN} replace />,
-    },
-    {
-        path: RouterPath.ADMIN,
         element: <PeopleManagementPage />,
     },
 ]);

packages/admin/src/app/routes/index.ts

@@ -0,0 +1,2 @@
+export { RouterPath } from "./path";
+export { Routes } from "./Routes";

packages/admin/src/app/routes/path.ts

@@ -1,4 +1,3 @@
 export const RouterPath = {
     ROOT: "/",
-    ADMIN: "admin",
 };

packages/admin/src/feature/QR-code-scanner/index.ts

@@ -1 +1 @@
-export { default as QRCodeScannerPage } from "./ui";
+export * from "./ui";

packages/admin/src/feature/QR-code-scanner/ui/index.tsx → packages/admin/src/feature/QR-code-scanner/ui/QRCodeScannerPage.tsx

@@ -1,9 +1,9 @@
 import { useState, useCallback } from "react";
 
-import { Button } from "@/shared/components/ui/button";
+import { Button } from "@/shared";
 import { Scanner } from "@yudiel/react-qr-scanner";
 
-const QrCodeScannerPage = () => {
+export const QRCodeScannerPage = () => {
     const [scanning, setScanning] = useState(false);
     const [scannedData, setScannedData] = useState<string | null>(null);
 
@@ -46,5 +46,3 @@ const QrCodeScannerPage = () => {
         </div>
     );
 };
-
-export default QrCodeScannerPage;

packages/admin/src/feature/QR-code-scanner/ui/index.ts

@@ -0,0 +1 @@
+export { QRCodeScannerPage } from "./QRCodeScannerPage";

packages/admin/src/feature/index.ts

@@ -0,0 +1,2 @@
+export * from "./people-management";
+export * from "./QR-code-scanner";

packages/admin/src/feature/people-management/api/index.ts

@@ -0,0 +1,2 @@
+// export * from "./hook";
+export * from "./mock";

packages/admin/src/feature/people-management/api/mock/index.ts

@@ -0,0 +1,2 @@
+export type { PeopleResponseData } from "./useGetPeople";
+export { useGetPeople } from "./useGetPeople";

packages/admin/src/feature/people-management/components/common/MainContents.tsx

@@ -1,13 +1,15 @@
 import { useState } from "react";
 
-import { useGetPeople } from "../../api/mock/useGetPeople";
-import useDeletePerson from "../../hook/useDeletePerson";
-import useFilteredPeople from "../../hook/useFilteredPeople";
-import useUpdatePersonStatus from "../../hook/useUpdatePersonStatus";
-import InputField from "../feature/InputField";
-import PeopleTable from "../feature/PeopleTable";
-
-const MainContents = () => {
+import {
+    InputField,
+    PeopleTable,
+    useDeletePerson,
+    useUpdatePersonStatus,
+    useFilteredPeople,
+    useGetPeople,
+} from "@/feature";
+
+export const MainContents = () => {
     const [searchTerm, setSearchTerm] = useState("");
 
     const { data } = useGetPeople();
@@ -26,5 +28,3 @@ const MainContents = () => {
         </main>
     );
 };
-
-export default MainContents;

packages/admin/src/feature/people-management/components/common/index.ts

@@ -0,0 +1 @@
+export { MainContents } from "./MainContents";

packages/admin/src/feature/people-management/components/feature/InputField.tsx

@@ -5,7 +5,7 @@ type Props = {
     setSearchTerm: (term: string) => void;
 };
 
-const InputField = ({ searchTerm, setSearchTerm }: Props) => {
+export const InputField = ({ searchTerm, setSearchTerm }: Props) => {
     return (
         <div className="relative mb-4">
             <input
@@ -19,5 +19,3 @@ const InputField = ({ searchTerm, setSearchTerm }: Props) => {
         </div>
     );
 };
-
-export default InputField;

packages/admin/src/feature/people-management/components/feature/PeopleTable.tsx

@@ -8,7 +8,7 @@ type Props = {
     deletePerson: (id: number) => void;
 };
 
-const PeopleTable = ({ people, updatePersonStatus, deletePerson }: Props) => {
+export const PeopleTable = ({ people, updatePersonStatus, deletePerson }: Props) => {
     return (
         <div className="overflow-x-auto bg-white rounded-lg shadow">
             <table className="w-full">
@@ -88,5 +88,3 @@ const PeopleTable = ({ people, updatePersonStatus, deletePerson }: Props) => {
         </div>
     );
 };
-
-export default PeopleTable;

packages/admin/src/feature/people-management/components/feature/index.ts

@@ -0,0 +1,2 @@
+export { InputField } from "./InputField";
+export { PeopleTable } from "./PeopleTable";

packages/admin/src/feature/people-management/components/index.ts

@@ -0,0 +1,2 @@
+export * from "./common";
+export * from "./feature";

packages/admin/src/feature/people-management/hook/index.ts

@@ -0,0 +1,3 @@
+export { useDeletePerson } from "./useDeletePerson";
+export { useFilteredPeople } from "./useFilteredPeople";
+export { useUpdatePersonStatus } from "./useUpdatePersonStatus";

packages/admin/src/feature/people-management/hook/useDeletePerson.ts

@@ -2,7 +2,7 @@ import { useState } from "react";
 
 import { PeopleResponseData } from "../api/mock/useGetPeople";
 
-const useDeletePerson = (initialPeople: PeopleResponseData[]) => {
+export const useDeletePerson = (initialPeople: PeopleResponseData[]) => {
     const [people, setPeople] = useState<PeopleResponseData[]>(initialPeople);
 
     const deletePerson = (id: number) => {
@@ -11,5 +11,3 @@ const useDeletePerson = (initialPeople: PeopleResponseData[]) => {
 
     return { people, setPeople, deletePerson };
 };
-
-export default useDeletePerson;

packages/admin/src/feature/people-management/hook/useFilteredPeople.ts

@@ -2,7 +2,7 @@ import { useMemo } from "react";
 
 import { PeopleResponseData } from "../api/mock/useGetPeople";
 
-const useFilteredPeople = (people: PeopleResponseData[], searchTerm: string) => {
+export const useFilteredPeople = (people: PeopleResponseData[], searchTerm: string) => {
     const filteredPeople = useMemo(() => {
         return people.filter(
             (person) =>
@@ -15,5 +15,3 @@ const useFilteredPeople = (people: PeopleResponseData[], searchTerm: string) =>
 
     return filteredPeople;
 };
-
-export default useFilteredPeople;

packages/admin/src/feature/people-management/hook/useUpdatePersonStatus.ts

@@ -1,6 +1,9 @@
 import { PeopleResponseData } from "../api/mock/useGetPeople";
 
-const useUpdatePersonStatus = (people: PeopleResponseData[], setPeople: (people: PeopleResponseData[]) => void) => {
+export const useUpdatePersonStatus = (
+    people: PeopleResponseData[],
+    setPeople: (people: PeopleResponseData[]) => void,
+) => {
     const updatePersonStatus = (id: number, status: "accepted" | "rejected" | "checkedIn" | "checkedOut") => {
         setPeople(
             people.map((person) => {
@@ -25,5 +28,3 @@ const useUpdatePersonStatus = (people: PeopleResponseData[], setPeople: (people:
 
     return updatePersonStatus;
 };
-
-export default useUpdatePersonStatus;

packages/admin/src/feature/people-management/index.ts

@@ -1 +1,4 @@
-export { default as PeopleManagementPage } from "./ui";
+export * from "./api";
+export * from "./hook";
+export * from "./components";
+export * from "./ui";

packages/admin/src/feature/people-management/ui/index.tsx → packages/admin/src/feature/people-management/ui/PeopleManagementPage.tsx

@@ -1,11 +1,9 @@
 import { useState } from "react";
 
-import MainContents from "../components/common/MainContents";
-import { QRCodeScannerPage } from "@/feature/QR-code-scanner";
-import Header from "@/shared/components/feature/layout/header";
-import Sidebar from "@/shared/components/feature/layout/sidebar";
+import { MainContents, QRCodeScannerPage } from "@/feature";
+import { Header, Sidebar } from "@/shared";
 
-const PeopleManagementPage = () => {
+export const PeopleManagementPage = () => {
     const [isSidebarOpen, setIsSidebarOpen] = useState(false);
     const [activePage, setActivePage] = useState("people");
 
@@ -24,5 +22,3 @@ const PeopleManagementPage = () => {
         </div>
     );
 };
-
-export default PeopleManagementPage;

packages/admin/src/feature/people-management/ui/index.ts

@@ -0,0 +1 @@
+export { PeopleManagementPage } from "./PeopleManagementPage";

packages/admin/src/shared/api/index.ts

@@ -0,0 +1 @@
+export * from "./instance";

packages/admin/src/shared/api/instance/index.ts

@@ -0,0 +1 @@
+export { fetchInstance, queryClient } from "./Instance";

packages/admin/src/shared/components/common/index.ts

@@ -0,0 +1,2 @@
+export { Button, buttonVariants } from "./button";
+export { Input } from "./input";

packages/admin/src/shared/components/feature/index.ts

@@ -0,0 +1,5 @@
+export * from "./layout";
+
+export { Avatar, AvatarImage, AvatarFallback } from "./avatar";
+export { ScrollArea, ScrollBar } from "./scroll-area";
+export { Table, TableHeader, TableBody, TableFooter, TableHead, TableRow, TableCell, TableCaption } from "./table";

packages/admin/src/shared/components/feature/layout/header.tsx

@@ -4,7 +4,7 @@ type Props = {
     toggleSidebar: () => void;
 };
 
-const Header = ({ toggleSidebar }: Props) => {
+export const Header = ({ toggleSidebar }: Props) => {
     return (
         <header className="flex items-center justify-between p-4 bg-white shadow-md lg:hidden">
             <button className="p-2 rounded-md hover:bg-gray-100" onClick={toggleSidebar}>
@@ -14,5 +14,3 @@ const Header = ({ toggleSidebar }: Props) => {
         </header>
     );
 };
-
-export default Header;

packages/admin/src/shared/components/feature/layout/index.ts

@@ -0,0 +1,2 @@
+export { Header } from "./header";
+export { Sidebar } from "./sidebar";

packages/admin/src/shared/components/feature/layout/sidebar.tsx

@@ -6,7 +6,7 @@ type Props = {
     setActivePage: (page: string) => void;
 };
 
-const Sidebar = ({ isSidebarOpen, activePage, setActivePage }: Props) => {
+export const Sidebar = ({ isSidebarOpen, activePage, setActivePage }: Props) => {
     return (
         <aside className={`${isSidebarOpen ? "block" : "hidden"} lg:block w-full lg:w-64 bg-white shadow-md`}>
             <nav className="flex flex-col p-4 space-y-2">
@@ -29,5 +29,3 @@ const Sidebar = ({ isSidebarOpen, activePage, setActivePage }: Props) => {
         </aside>
     );
 };
-
-export default Sidebar;

packages/admin/src/shared/components/index.ts

@@ -0,0 +1,2 @@
+export * from "./common";
+export * from "./feature";

packages/admin/src/shared/index.ts

@@ -0,0 +1,2 @@
+export * from "./api";
+export * from "./components";