refactor(frontend): streamline breadcrumbs and top-level hierarchy views to 'Overview'

echo/frontend/src/components/layout/ProjectOverviewLayout.tsx

@@ -37,18 +37,11 @@ export const ProjectOverviewLayout = () => {
 			style={{ backgroundColor: "var(--app-background)" }}
 		>
 			<LoadingOverlay visible={projectQuery.isLoading} />
-			{project && (isPrivate || project.language) && (
+			{project && isPrivate && (
 				<Group gap={8} align="center" wrap="nowrap" px="xs">
-					{isPrivate && (
-						<Tooltip label={t`Private · only invited people can see this`}>
-							<IconLock size={16} color="var(--mantine-color-gray-6)" />
-						</Tooltip>
-					)}
-					{project.language && (
-						<Badge size="xs" variant="light" color="gray">
-							{String(project.language).toUpperCase()}
-						</Badge>
-					)}
+					<Tooltip label={t`Private · only invited people can see this`}>
+						<IconLock size={16} color="var(--mantine-color-gray-6)" />
+					</Tooltip>
 				</Group>
 			)}
 			<TabsWithRouter

echo/frontend/src/features/sidebar/breadcrumbs/AppBreadcrumbs.tsx

@@ -30,7 +30,7 @@ const PROJECT_SECTION_LABELS: Record<string, string> = {
 	conversation: "Conversation",
 	conversations: "Conversations",
 	export: "Export",
-	home: "Home",
+	home: "Overview",
 	"host-guide": "Host guide",
 	integrations: "Integrations",
 	library: "Explore",
@@ -62,8 +62,7 @@ const ORG_SETTINGS_LABELS: Record<string, string> = {
 	usage: "Usage and tier",
 };
 
-// Brand: "Breadcrumbs for deep nesting only". Render only when there
-// are 2+ meaningful crumbs to show.
+// Render when there is at least 1 meaningful crumb to show.
 export const AppBreadcrumbs = () => {
 	const { view, params } = useSidebarView();
 	const { orgId: routeOrgId, organisationId } = useParams<{
@@ -93,9 +92,9 @@ export const AppBreadcrumbs = () => {
 		switch (view) {
 			case "inbox":
 			case "help":
-				return [];
+				return out;
 			case "user-home":
-				return [];
+				return out;
 			case "user-settings": {
 				out.push({ href: "/settings/account", label: "User settings" });
 				const section = params.section;
@@ -137,8 +136,22 @@ export const AppBreadcrumbs = () => {
 				}
 				return out;
 			}
-			case "workspace-home":
-				return workspace ? [...out, { label: workspace.name }] : [];
+			case "workspace-home": {
+				if (!workspace) return out;
+				out.push({
+					href: `/w/${workspace.id}/home`,
+					label: workspace.name,
+				});
+				const section = params.section;
+					if (window.location.pathname.endsWith("/projects/new")) {
+						out.push({ label: "New project" });
+					} else if (section === "home" || !section) {
+						out.push({ label: "Overview" });
+					} else {
+						out.push({ label: "Overview" });
+					}
+				return out;
+			}
 			case "workspace-settings": {
 				if (workspace) {
 					out.push({
@@ -195,8 +208,7 @@ export const AppBreadcrumbs = () => {
 		return out;
 	}, [view, params, workspace, orgNameForId, projectQuery.data?.name]);
 
-	// Brand: hide breadcrumbs when there's only one crumb.
-	if (crumbs.length < 2) return null;
+	if (crumbs.length === 0) return null;
 
 	return (
 		<nav

echo/frontend/src/features/sidebar/views/org/OrgHomeView.tsx

@@ -1,5 +1,5 @@
 import { Trans } from "@lingui/react/macro";
-import { Folder, Gear, House, UserPlus } from "@phosphor-icons/react";
+import { AppWindow, Folder, Gear, UserPlus } from "@phosphor-icons/react";
 import { useQuery } from "@tanstack/react-query";
 import { useMemo } from "react";
 import { useParams } from "react-router";
@@ -100,8 +100,8 @@ export const OrgHomeView = () => {
 			{!isExternal && (
 				<NavItem
 					to={`${base}/overview`}
-					label={<Trans>Home</Trans>}
-					icon={House}
+					label={<Trans>Overview</Trans>}
+					icon={AppWindow}
 					end
 				/>
 			)}

echo/frontend/src/features/sidebar/views/project/ProjectHomeView.tsx

@@ -1,13 +1,13 @@
 import { Trans } from "@lingui/react/macro";
 import {
+	AppWindow,
 	BookOpen,
 	Broadcast,
 	ChatCircleDots,
 	ChatCircleText,
 	FileText,
 	Gear,
 	Graph,
-	House,
 	PaintBrush,
 } from "@phosphor-icons/react";
 import { useParams } from "react-router";
@@ -55,7 +55,7 @@ export const ProjectHomeView = () => {
 				</div>
 			)}
 
-			<NavItem to={`${base}/home`} label={<Trans>Home</Trans>} icon={House} />
+			<NavItem to={`${base}/home`} label={<Trans>Overview</Trans>} icon={AppWindow} />
 			<NavItem
 				to={`${base}/chats/new`}
 				label={<Trans>Ask</Trans>}

echo/frontend/src/features/sidebar/views/workspace/WorkspaceHomeView.tsx

@@ -1,5 +1,5 @@
 import { Trans } from "@lingui/react/macro";
-import { Gear, House, Plus, PushPin } from "@phosphor-icons/react";
+import { AppWindow, Gear, Plus, PushPin } from "@phosphor-icons/react";
 import { useMemo } from "react";
 import { useParams } from "react-router";
 import { useWorkspace } from "@/hooks/useWorkspace";
@@ -43,7 +43,7 @@ export const WorkspaceHomeView = () => {
 				</div>
 			)}
 
-			<NavItem to={`${base}/home`} label={<Trans>Home</Trans>} icon={House} />
+			<NavItem to={`${base}/home`} label={<Trans>Overview</Trans>} icon={AppWindow} />
 			{canCreateProject && (
 				<NavItem
 					to={`${base}/projects/new`}