[WEB-5506] regression: navigation revamp bugs (#8180)

apps/web/app/(all)/[workspaceSlug]/(projects)/browse/[workItem]/header.tsx

@@ -1,10 +1,12 @@
 import { observer } from "mobx-react";
 import { useParams } from "next/navigation";
-// hooks
+// plane imports
 import { Header, Row } from "@plane/ui";
+// components
 import { AppHeader } from "@/components/core/app-header";
 import { TabNavigationRoot } from "@/components/navigation";
 import { useIssueDetail } from "@/hooks/store/use-issue-detail";
+import { useProjectNavigationPreferences } from "@/hooks/use-navigation-preferences";
 // local components
 import { WorkItemDetailsHeader } from "./work-item-header";
 
@@ -18,9 +20,12 @@ export const ProjectWorkItemDetailsHeader = observer(function ProjectWorkItemDet
   // derived values
   const issueId = getIssueIdByIdentifier(workItem?.toString());
   const issueDetails = issueId ? getIssueById(issueId?.toString()) : undefined;
+  // preferences
+  const { preferences: projectPreferences } = useProjectNavigationPreferences();
 
   return (
     <>
+      {projectPreferences.navigationMode === "horizontal" && (
         <div className="z-20">
           <Row className="h-header flex gap-2 w-full items-center border-b border-custom-border-200 bg-custom-sidebar-background-100">
             <div className="flex items-center gap-2 divide-x divide-custom-border-100 h-full w-full">
@@ -37,6 +42,7 @@ export const ProjectWorkItemDetailsHeader = observer(function ProjectWorkItemDet
             </div>
           </Row>
         </div>
+      )}
       <AppHeader header={<WorkItemDetailsHeader />} />
     </>
   );

apps/web/ce/components/navigations/top-navigation-root.tsx

@@ -15,7 +15,6 @@ export const TopNavigationRoot = observer(() => {
   return (
     <div
       className={cn("flex items-center justify-evenly min-h-11 w-full px-3.5 z-[27] transition-all duration-300", {
-        "px-3.5": showLabel,
         "px-2": !showLabel,
       })}
     >

apps/web/core/components/home/root.tsx

@@ -4,7 +4,6 @@ import useSWR from "swr";
 // plane imports
 import { PRODUCT_TOUR_TRACKER_EVENTS } from "@plane/constants";
 import { ContentWrapper } from "@plane/ui";
-import { cn } from "@plane/utils";
 // components
 import { TourRoot } from "@/components/onboarding/tour";
 // helpers
@@ -60,7 +59,7 @@ export const WorkspaceHomeView = observer(function WorkspaceHomeView() {
       )}
       <>
         <HomePeekOverviewsRoot />
-        <ContentWrapper className={cn("gap-6 bg-custom-background-100 mx-auto scrollbar-hide px-page-x lg:px-0")}>
+        <ContentWrapper className="gap-6 bg-custom-background-100 mx-auto scrollbar-hide px-page-x">
           <div className="max-w-[800px] mx-auto w-full">
             {currentUser && <UserGreetingsView user={currentUser} />}
             <DashboardWidgets />