fix(web): include home tab in sidebar on project page

web/src/components/atoms/InnerContents/basic.tsx

@@ -2,32 +2,21 @@
 import { Children, ReactNode } from "react";
 
 import Content from "@reearth-cms/components/atoms/Content";
-import Icon from "@reearth-cms/components/atoms/Icon";
 
 type Props = {
   title?: string;
   subtitle?: string;
   flexChildren?: boolean;
   children?: ReactNode;
-  onHomeNavigation?: () => void;
 };
 
-const BasicInnerContents: React.FC<Props> = ({
-  title,
-  subtitle,
-  flexChildren,
-  children,
-  onHomeNavigation,
-}) => {
+const BasicInnerContents: React.FC<Props> = ({ title, subtitle, flexChildren, children }) => {
   const childrenArray = Children.toArray(children);
   return (
     <PaddedContent>
       {title && (
         <Header>
-          <Title>
-            {onHomeNavigation && <Icon icon="arrowLeft" size={16} onClick={onHomeNavigation} />}
-            {title}
-          </Title>
+          <Title>{title}</Title>
           {subtitle && <Subtitle>{subtitle}</Subtitle>}
         </Header>
       )}
@@ -58,9 +47,6 @@
   font-size: 20px;
   line-height: 28px;
   margin: 0;
-  display: flex;
-  align-items: baseline;
-  gap: 16px;
 `;
 
 const Subtitle = styled.p`

web/src/components/molecules/Common/ProjectMenu/index.tsx

@@ -15,13 +15,14 @@
   const t = useT();
 
   const topItems: ItemType[] = [
-    { label: t("Overview"), key: "home", icon: <Icon icon="dashboard" /> },
+    { label: t("Home"), key: "home", icon: <Icon icon="home" /> },
+    { label: t("Overview"), key: "overview", icon: <Icon icon="dashboard" /> },
     { label: t("Schema"), key: "schema", icon: <Icon icon="unorderedList" /> },
     { label: t("Content"), key: "content", icon: <Icon icon="table" /> },
     { label: t("Asset"), key: "asset", icon: <Icon icon="file" /> },
     { label: t("Request"), key: "request", icon: <Icon icon="pullRequest" /> },
   ];
-  const [selected, changeSelected] = useState([defaultSelectedKey ?? "home"]);
+  const [selected, changeSelected] = useState([defaultSelectedKey ?? "overview"]);
 
   useEffect(() => {
     if (defaultSelectedKey && defaultSelectedKey !== selected[0]) {

web/src/components/molecules/ProjectOverview/index.tsx

@@ -14,7 +14,6 @@
   projectDescription?: string;
   models?: Model[];
   onModelModalOpen: () => void;
-  onHomeNavigation: () => void;
   onSchemaNavigate: (modelId: string) => void;
   onContentNavigate: (modelId: string) => void;
   onModelDeletionModalOpen: (model: Model) => Promise<void>;
@@ -26,7 +25,6 @@
   projectDescription,
   models,
   onModelModalOpen,
-  onHomeNavigation,
   onSchemaNavigate,
   onContentNavigate,
   onModelDeletionModalOpen,
@@ -35,11 +33,7 @@
   const t = useT();
 
   return (
-    <InnerContent
-      title={projectName}
-      subtitle={projectDescription}
-      flexChildren
-      onHomeNavigation={onHomeNavigation}>
+    <InnerContent title={projectName} subtitle={projectDescription} flexChildren>
       <ContentSection
         title={t("Models")}
         headerActions={

web/src/components/organisms/CMSWrapper/hooks.ts

@@ -35,8 +35,6 @@
 
   const [, secondaryRoute, subRoute] = useMemo(() => splitPathname(pathname), [pathname]);
 
-  const selectedKey = useMemo(() => subRoute ?? "home", [subRoute]);
-
   const username = useMemo(() => data?.me?.name || "", [data?.me?.name]);
 
   setCurrentUserId(data?.me?.id);
@@ -127,20 +125,12 @@
 
   const handleProjectMenuNavigate = useCallback(
     (info: MenuInfo) => {
-      if (info.key === "schema") {
-        navigate(`/workspace/${workspaceId}/project/${projectId}/schema`);
-      } else if (info.key === "content") {
-        navigate(`/workspace/${workspaceId}/project/${projectId}/content`);
-      } else if (info.key === "asset") {
-        navigate(`/workspace/${workspaceId}/project/${projectId}/asset`);
-      } else if (info.key === "request") {
-        navigate(`/workspace/${workspaceId}/project/${projectId}/request`);
-      } else if (info.key === "accessibility") {
-        navigate(`/workspace/${workspaceId}/project/${projectId}/accessibility`);
-      } else if (info.key === "settings") {
-        navigate(`/workspace/${workspaceId}/project/${projectId}/settings`);
-      } else {
+      if (info.key === "home") {
+        navigate(`/workspace/${workspaceId}`);
+      } else if (info.key === "overview") {
         navigate(`/workspace/${workspaceId}/project/${projectId}`);
+      } else {
+        navigate(`/workspace/${workspaceId}/project/${projectId}/${info.key}`);
       }
     },
     [navigate, workspaceId, projectId],
@@ -175,7 +165,7 @@
     currentWorkspace,
     workspaceModalShown,
     currentProject,
-    selectedKey,
+    selectedKey: subRoute,
     secondaryRoute,
     collapsed,
     handleCollapse,

web/src/components/organisms/Project/Overview/hooks.ts

@@ -107,10 +107,6 @@ export default () => {
     [updateNewModel, handleModelModalClose, t],
   );
 
-  const handleHomeNavigation = useCallback(() => {
-    navigate(`/workspace/${currentWorkspace?.id}`);
-  }, [currentWorkspace?.id, navigate]);
-
   const handleSchemaNavigation = useCallback(
     (modelId: string) => {
       navigate(
@@ -140,7 +136,6 @@ export default () => {
     modelModalShown,
     selectedModel,
     modelDeletionModalShown,
-    handleHomeNavigation,
     handleSchemaNavigation,
     handleContentNavigation,
     handleModelKeyCheck,

web/src/components/organisms/Project/Overview/index.tsx

@@ -11,7 +11,6 @@ const ProjectOverview: React.FC = () => {
     modelModalShown,
     selectedModel,
     modelDeletionModalShown,
-    handleHomeNavigation,
     handleSchemaNavigation,
     handleContentNavigation,
     handleModelKeyCheck,
@@ -31,7 +30,6 @@ const ProjectOverview: React.FC = () => {
         projectName={currentProject?.name}
         projectDescription={currentProject?.description}
         models={models}
-        onHomeNavigation={handleHomeNavigation}
         onSchemaNavigate={handleSchemaNavigation}
         onContentNavigate={handleContentNavigation}
         onModelModalOpen={handleModelModalOpen}