Merge pull request #27 from KERT-core/refactor/prettier-write

KERT-core · Aug 24, 2024 · 91f34b8 · 91f34b8
2 parents 00e37ee + 6d5c099
commit 91f34b8
Show file tree

Hide file tree

Showing 38 changed files with 2,457 additions and 2,114 deletions.
diff --git a/.prettierrc b/.prettierrc
@@ -1,6 +1,6 @@
 {
   "singleQuote": true,
-  "semi": false,
+  "semi": true,
   "tabWidth": 2,
   "trailingComma": "all"
 }
diff --git a/package.json b/package.json
@@ -7,7 +7,8 @@
     "dev": "vite",
     "build": "vite build",
     "lint": "eslint . --ext js,jsx --report-unused-disable-directives --max-warnings 0",
-    "preview": "vite preview"
+    "preview": "vite preview",
+    "format": "prettier --write ./src"
   },
   "dependencies": {
     "axios": "^1.7.4",

diff --git a/src/App.jsx b/src/App.jsx
@@ -3,40 +3,49 @@
 // padding 같은 추가적인 작업이 없다면 내용이 내비바보다 더 높은 위치에서부터 표시되어 일부 내용이 보이지 않습니다.
 // 내비바의 높이는 60px입니다.
 
-import { Routes, Route } from "react-router-dom";
+import { Routes, Route } from 'react-router-dom';
 
-import { GlobalStyle } from "./styles/global";
-import { MainLayout } from "./components/layouts/MainLayout";
-import "./styles/font.css";
+import { GlobalStyle } from './styles/global';
+import { MainLayout } from './components/layouts/MainLayout';
+import './styles/font.css';
 
-import MainPage from "./pages/MainPage";
-import NotFound from "./pages/NotFound";
+import MainPage from './pages/MainPage';
+import NotFound from './pages/NotFound';
 
-import { DashboardLayout } from "./components/layouts/DashboardLayout";
-import {DashboardAdmin, DashboardHome, DashboardHistory, DashboardExecutive ,DashboardUsers} from "./components/display/dashboard";
-import DevDocument from "./pages/DevDocument";
-import Board from "./pages/Board";
+import { DashboardLayout } from './components/layouts/DashboardLayout';
+import {
+  DashboardAdmin,
+  DashboardHome,
+  DashboardHistory,
+  DashboardExecutive,
+  DashboardUsers,
+} from './components/display/dashboard';
+import DevDocument from './pages/DevDocument';
+import Board from './pages/Board';
 
 export default function App() {
-    return (
-        <>
-            <GlobalStyle />
-            <Routes>
-                <Route path="/" element={<MainLayout />}>
-                    <Route index path="/" element={<MainPage />} />
-                    <Route path="/developer" element={<DevDocument />} />
-                    <Route path="/board" element={<Board />} />
-                    <Route path="*" element={<NotFound />} />
-                    <Route path="/dashboard" element={<DashboardLayout />}>
-                        <Route index path="/dashboard" element={<DashboardHome />} />
-                        <Route path="/dashboard/history" element={<DashboardHistory />} />
-                        <Route path="/dashboard/executive" element={<DashboardExecutive />} />
-                        <Route path="/dashboard/admin" element={<DashboardAdmin />} />
-                        <Route path="/dashboard/users" element={<DashboardUsers />} />
-                        <Route path="/dashboard/*" element={<NotFound />} />
-                    </Route>
-                </Route>
-            </Routes>
-        </>
-    )
+  return (
+    <>
+      <GlobalStyle />
+      <Routes>
+        <Route path="/" element={<MainLayout />}>
+          <Route index path="/" element={<MainPage />} />
+          <Route path="/developer" element={<DevDocument />} />
+          <Route path="/board" element={<Board />} />
+          <Route path="*" element={<NotFound />} />
+          <Route path="/dashboard" element={<DashboardLayout />}>
+            <Route index path="/dashboard" element={<DashboardHome />} />
+            <Route path="/dashboard/history" element={<DashboardHistory />} />
+            <Route
+              path="/dashboard/executive"
+              element={<DashboardExecutive />}
+            />
+            <Route path="/dashboard/admin" element={<DashboardAdmin />} />
+            <Route path="/dashboard/users" element={<DashboardUsers />} />
+            <Route path="/dashboard/*" element={<NotFound />} />
+          </Route>
+        </Route>
+      </Routes>
+    </>
+  );
 }
diff --git a/src/components/display/dashboard/Admin.jsx b/src/components/display/dashboard/Admin.jsx
@@ -1,21 +1,21 @@
-import { useEffect } from "react";
+import { useEffect } from 'react';
 
-import useDashboard from "../../../stores/dashboard";
+import useDashboard from '../../../stores/dashboard';
 
 export default function DashboardAdmin() {
-    const { moveAdmin } = useDashboard();
+  const { moveAdmin } = useDashboard();
 
-    useEffect(() => {
-        moveAdmin();
-    }, []);
+  useEffect(() => {
+    moveAdmin();
+  }, []);
 
-    const ScrollTestPTag = Array.from({ length: 200 }, (_, i) => i + 1);
+  const ScrollTestPTag = Array.from({ length: 200 }, (_, i) => i + 1);
 
-    return (
-        <>
-            {ScrollTestPTag.map(number => (
-                <p key={number}>ADMIN {number}</p>
-            ))}
-        </>
-    )
-}
+  return (
+    <>
+      {ScrollTestPTag.map((number) => (
+        <p key={number}>ADMIN {number}</p>
+      ))}
+    </>
+  );
+}
diff --git a/src/components/display/dashboard/Dashboard.styled.js b/src/components/display/dashboard/Dashboard.styled.js
@@ -1,75 +1,73 @@
-import styled from "styled-components";
+import styled from 'styled-components';
 
 export const RowFlex = styled.div`
-    display: flex;
-    flex-direction: row;
-    gap: ${(props) => props.$gap};
-`
+  display: flex;
+  flex-direction: row;
+  gap: ${(props) => props.$gap};
+`;
 
 export const ColumnFlex = styled.div`
-    display: flex;
-    flex-direction: column;
-    gap: ${(props) => props.$gap};
-`
+  display: flex;
+  flex-direction: column;
+  gap: ${(props) => props.$gap};
+`;
 
 export const Container = styled.div`
-    width: ${(props) => {
-        if (props.$width) {
-            return props.$width;
-        }
-        else {
-            return "fit-content;";
-        }
-    }};
+  width: ${(props) => {
+    if (props.$width) {
+      return props.$width;
+    } else {
+      return 'fit-content;';
+    }
+  }};
 
-    height: ${(props) => {
-        if (props.$height) {
-            return props.$height;
-        }
-        else {
-            return "fit-content";
-        }
-    }};
+  height: ${(props) => {
+    if (props.$height) {
+      return props.$height;
+    } else {
+      return 'fit-content';
+    }
+  }};
 
-    display: flex;
-    flex-direction: column;
-    gap: 30px;
+  display: flex;
+  flex-direction: column;
+  gap: 30px;
 
-    padding: 30px;
-    box-sizing: border-box;
-    border-radius: 20px;
+  padding: 30px;
+  box-sizing: border-box;
+  border-radius: 20px;
 
-    border: 1px solid #21272E;
-`
+  border: 1px solid #21272e;
+`;
 export const SectionTitle = styled.h2`
-    margin: 0px 0px 20px 10px;
-    font-size: ${(props) => props.$size ?? "25px"};
-    font-weight: 800;
-`
+  margin: 0px 0px 20px 10px;
+  font-size: ${(props) => props.$size ?? '25px'};
+  font-weight: 800;
+`;
 
 export const Title = styled.h3`
-    margin: 0;
-    font-size: ${(props) => props.$size ?? "18px"};
-    font-weight: ${(props) => props.$weight ?? "normal"};
-    color: ${(props) => props.$color ?? "#ffffff"};
-`
+  margin: 0;
+  font-size: ${(props) => props.$size ?? '18px'};
+  font-weight: ${(props) => props.$weight ?? 'normal'};
+  color: ${(props) => props.$color ?? '#ffffff'};
+`;
 
 export const Button = styled.button`
-    transition: background-color 0.2s ease-in-out;
+  transition: background-color 0.2s ease-in-out;
 
-    &:hover {
-        background-color: #ffffff1f
-    }
+  &:hover {
+    background-color: #ffffff1f;
+  }
+
+  outline: none;
+  border: none;
+
+  width: ${(props) => props.$width ?? 'fit-content'};
+  padding: 12px 20px;
 
-    outline: none;
-    border: none;
+  background-color: #ffffff10;
+  font-size: 14px;
+  font-weight: lighter;
 
-    width: ${(props) => props.$width ?? "fit-content"};
-    padding: 12px 20px;
-    
-    background-color: #ffffff10;
-    font-size: 14px;
-    font-weight: lighter;
-    
-    border-radius: 100px;
-`
+  border-radius: 100px;
+`;
diff --git a/src/components/display/dashboard/Executive.jsx b/src/components/display/dashboard/Executive.jsx
@@ -1,21 +1,21 @@
-import { useEffect } from "react";
+import { useEffect } from 'react';
 
-import useDashboard from "../../../stores/dashboard";
+import useDashboard from '../../../stores/dashboard';
 
 export default function DashboardExecutive() {
-    const { moveExecutive } = useDashboard();
+  const { moveExecutive } = useDashboard();
 
-    useEffect(() => {
-        moveExecutive();
-    }, []);
+  useEffect(() => {
+    moveExecutive();
+  }, []);
 
-    const ScrollTestPTag = Array.from({ length: 200 }, (_, i) => i + 1);
+  const ScrollTestPTag = Array.from({ length: 200 }, (_, i) => i + 1);
 
-    return (
-        <>
-            {ScrollTestPTag.map(number => (
-                <p key={number}>EXECUTIVES {number}</p>
-            ))}
-        </>
-    )
-}
+  return (
+    <>
+      {ScrollTestPTag.map((number) => (
+        <p key={number}>EXECUTIVES {number}</p>
+      ))}
+    </>
+  );
+}
diff --git a/src/components/display/dashboard/History.jsx b/src/components/display/dashboard/History.jsx
@@ -1,21 +1,21 @@
-import { useEffect } from "react";
+import { useEffect } from 'react';
 
-import useDashboard from "../../../stores/dashboard";
+import useDashboard from '../../../stores/dashboard';
 
 export default function DashboardHistory() {
-    const { moveHistory } = useDashboard();
+  const { moveHistory } = useDashboard();
 
-    useEffect(() => {
-        moveHistory();
-    }, []);
+  useEffect(() => {
+    moveHistory();
+  }, []);
 
-    const ScrollTestPTag = Array.from({ length: 200 }, (_, i) => i + 1);
+  const ScrollTestPTag = Array.from({ length: 200 }, (_, i) => i + 1);
 
-    return (
-        <>
-            {ScrollTestPTag.map(number => (
-                <p key={number}>HISTORY {number}</p>
-            ))}
-        </>
-    )
-}
+  return (
+    <>
+      {ScrollTestPTag.map((number) => (
+        <p key={number}>HISTORY {number}</p>
+      ))}
+    </>
+  );
+}