diff --git a/src/App.tsx b/src/App.tsx index ced8854e..59271401 100644 --- a/src/App.tsx +++ b/src/App.tsx @@ -1,34 +1,31 @@ import { BrowserRouter, Route, Routes } from "react-router-dom"; +import GlobalStyle from "./styles/globalStyle"; import Header from "./components/common/Header"; import Footer from "./components/common/Footer"; import Home from "./pages/Home"; -import Gallery from "./pages/Gallery"; -import GlobalStyle from "./styles/globalStyle"; -import { WikiSideBar, GallerySideBar } from "./components/sidebar/SideBar"; + +// Wiki page import Wiki from "./pages/Wiki"; -import { - CompanyRules, - OfficeLife, - OrganizationChart, - TeamIntroduction, -} from "./components/sidebar/OfficeLife"; -import { - Photos, - OfficePhoto, - Business, - JobPosting, -} from "./components/sidebar/Photos"; -import { - Onboarding, - ReadingList, - Topics, -} from "./components/sidebar/Onboarding"; -import { - Project, - InProject, - UpComing, - Completed, -} from "./components/sidebar/Project"; + +// office-life Componenets +import CompanyRules from "./components/wiki/office-life/CompanyRules"; +import OrganizationChart from "./components/wiki/office-life/OrganizationChart"; +import TeamIntroduction from "./components/wiki/office-life/TeamIntroduction"; + +// project Components +import InProject from "./components/wiki/project/InProject"; +import UpComing from "./components/wiki/project/UpComing"; +import Completed from "./components/wiki/project/Completed"; + +// onboarding Components +import ReadingList from "./components/wiki/onboarding/ReadingList"; +import Topics from "./components/wiki/onboarding/Topics"; + +// Gallery Componenets +import Gallery from "./pages/Gallery"; +import OfficePhoto from "./components/gallery/OfficePhoto"; +import Business from "./components/gallery/Business"; +import JobPosting from "./components/gallery/JobPosting"; const App = () => { return ( @@ -37,28 +34,31 @@ const App = () => {
} /> + {/* wiki */} }> - }> - } /> - } /> - } /> - - }> - } /> - } /> - } /> - - }> - } /> - } /> - + {/* office-life */} + } /> + } + /> + } + /> + {/* project */} + } /> + } /> + } /> + {/* onboarding */} + } /> + } /> + {/* gallery */} }> - }> - } /> - } /> - } /> - + } /> + } /> + } /> diff --git a/src/components/SideBar/SideBar.tsx b/src/components/SideBar/SideBar.tsx index 56526df0..e4f5d555 100644 --- a/src/components/SideBar/SideBar.tsx +++ b/src/components/SideBar/SideBar.tsx @@ -1,4 +1,4 @@ -import { Routes, Route, Link, Outlet } from "react-router-dom"; +import { Link, useNavigate } from "react-router-dom"; import { useState } from "react"; import "../../assets/fonts/Font.css"; import companyBlack from "../../assets/icons/sidebar_icon/company_black_icon.png"; @@ -10,26 +10,19 @@ import projectBlue from "../../assets/icons/sidebar_icon/project_blue_icon.png"; import onboardingBlack from "../../assets/icons/sidebar_icon/onboarding_black_icon.png"; import onboardingBlue from "../../assets/icons/sidebar_icon/onboarding_blue_icon.png"; import photosBlue from "../../assets/icons/sidebar_icon/photos_blue_icon.png"; -import { Photos, OfficePhoto, Business, JobPosting } from "./Photos"; -import { Onboarding, ReadingList, Topics } from "./Onboarding"; -import { Project, InProject, UpComing, Completed } from "./Project"; -import { - OfficeLife, - CompanyRules, - TeamIntroduction, - OrganizationChart, -} from "./OfficeLife"; import { SideBarBox, SideBarItem, Section, SideBarMainText, MainText, + Text, CompanyIcon, BottomIcon, } from "../../styles/SideBarStyle"; const WikiSideBar = () => { + const navigate = useNavigate(); const [CompanyTextVisible, setCompanyTextVisible] = useState(true); const [ProjectTextVisible, setProjectTextVisible] = useState(false); const [OnboardingTextVisible, setOnboardingTextVisible] = useState(false); @@ -38,96 +31,127 @@ const WikiSideBar = () => { setCompanyTextVisible(true); setProjectTextVisible(false); setOnboardingTextVisible(false); + navigate("/wiki/office-life/company-rules"); }; const ToggleProjectText = () => { setCompanyTextVisible(false); setProjectTextVisible(true); setOnboardingTextVisible(false); + navigate("/wiki/project/in-progress"); }; const ToggleOnboardingText = () => { setCompanyTextVisible(false); setProjectTextVisible(false); setOnboardingTextVisible(true); + navigate("/wiki/onboarding/reading-list"); }; return ( + {/* CompanyRules */} - - -
- - 회사생활 -
- +
+ - - - {CompanyTextVisible && } + 회사생활 +
+ + + {CompanyTextVisible && ( + <> + + 회사내규 + + + 팀소개 + + + 조직도 + + + )} + {/* Project */} - - -
- - 프로젝트 -
- +
+ - - - {ProjectTextVisible && } + 프로젝트 +
+ + + {ProjectTextVisible && ( + <> + + 진행중인 프로젝트 + + + 예정된 프로젝트 + + + 완료된 프로젝트 + + + )} + {/* Onboarding */} - - -
- - 온보딩 -
- +
+ - - - {OnboardingTextVisible && } + 온보딩 +
+ + + {OnboardingTextVisible && ( + <> + + 신입사원 필독서 + + + 온보딩 주제 + + + )} ); }; @@ -141,28 +165,34 @@ const GallerySideBar = () => { return ( - - -
- - 온보딩 -
- +
+ - + 사진첩 +
+ + + + 내부 사진 + + + 협력사 + + + 채용공고 - {/* {PhotosTextVisible && } */} ); diff --git a/src/components/wiki/office-life/CompanyRules.tsx b/src/components/wiki/office-life/CompanyRules.tsx new file mode 100644 index 00000000..93de9175 --- /dev/null +++ b/src/components/wiki/office-life/CompanyRules.tsx @@ -0,0 +1,5 @@ +const CompanyRules = () => { + return
회사내규 내용
; +}; + +export default CompanyRules; diff --git a/src/components/wiki/office-life/OrganizationChart.tsx b/src/components/wiki/office-life/OrganizationChart.tsx new file mode 100644 index 00000000..5404ee12 --- /dev/null +++ b/src/components/wiki/office-life/OrganizationChart.tsx @@ -0,0 +1,5 @@ +const OrganizationChart = () => { + return
조직도 내용
; +}; + +export default OrganizationChart; diff --git a/src/components/wiki/office-life/TeamIntroduction.tsx b/src/components/wiki/office-life/TeamIntroduction.tsx new file mode 100644 index 00000000..80ce4745 --- /dev/null +++ b/src/components/wiki/office-life/TeamIntroduction.tsx @@ -0,0 +1,5 @@ +const TeamIntroduction = () => { + return
팀소개 내용
; +}; + +export default TeamIntroduction; diff --git a/src/components/wiki/onboarding/ReadingList.tsx b/src/components/wiki/onboarding/ReadingList.tsx new file mode 100644 index 00000000..2ad9853a --- /dev/null +++ b/src/components/wiki/onboarding/ReadingList.tsx @@ -0,0 +1,5 @@ +const ReadingList = () => { + return
ReadingList
; +}; + +export default ReadingList; diff --git a/src/components/wiki/onboarding/Topics.tsx b/src/components/wiki/onboarding/Topics.tsx new file mode 100644 index 00000000..c39b614f --- /dev/null +++ b/src/components/wiki/onboarding/Topics.tsx @@ -0,0 +1,5 @@ +const Topics = () => { + return
Topics
; +}; + +export default Topics; diff --git a/src/components/wiki/project/Completed.tsx b/src/components/wiki/project/Completed.tsx new file mode 100644 index 00000000..93844985 --- /dev/null +++ b/src/components/wiki/project/Completed.tsx @@ -0,0 +1,5 @@ +const Completed = () => { + return
Completed
; +}; + +export default Completed; diff --git a/src/components/wiki/project/InProject.tsx b/src/components/wiki/project/InProject.tsx new file mode 100644 index 00000000..3d7240e5 --- /dev/null +++ b/src/components/wiki/project/InProject.tsx @@ -0,0 +1,5 @@ +const InProject = () => { + return
InProject
; +}; + +export default InProject; diff --git a/src/components/wiki/project/UpComing.tsx b/src/components/wiki/project/UpComing.tsx new file mode 100644 index 00000000..66c419e4 --- /dev/null +++ b/src/components/wiki/project/UpComing.tsx @@ -0,0 +1,5 @@ +const UpComing = () => { + return
UpComing
; +}; + +export default UpComing;