diff --git a/knip.json b/knip.json
index 4353923aa..97a0043f4 100644
--- a/knip.json
+++ b/knip.json
@@ -5,8 +5,7 @@
     "src/api/**",
     "src/components/ui/**",
     "src/config/announcements.ts",
-    "src/components/shared/BetaFeatureWrapper/BetaFeatureWrapper.tsx",
-    "src/components/Home/FavoritesSection/FavoritesSection.tsx"
+    "src/components/shared/BetaFeatureWrapper/BetaFeatureWrapper.tsx"
   ],
   "ignoreDependencies": [
     "@radix-ui/react-accordion",
diff --git a/src/components/Home/FavoritesSection/FavoritesSection.tsx b/src/components/Home/FavoritesSection/FavoritesSection.tsx
deleted file mode 100644
index 9493f2a8a..000000000
--- a/src/components/Home/FavoritesSection/FavoritesSection.tsx
+++ /dev/null
@@ -1,168 +0,0 @@
-import { Link } from "@tanstack/react-router";
-import { useState } from "react";
-
-import { Button } from "@/components/ui/button";
-import { Icon } from "@/components/ui/icon";
-import { Input } from "@/components/ui/input";
-import { BlockStack, InlineStack } from "@/components/ui/layout";
-import { Heading, Paragraph, Text } from "@/components/ui/typography";
-import {
-  type FavoriteItem,
-  type FavoriteType,
-  useFavorites,
-} from "@/hooks/useFavorites";
-import { cn } from "@/lib/utils";
-import { EDITOR_PATH, RUNS_BASE_PATH } from "@/routes/router";
-
-const PAGE_SIZE = 10;
-
-function getFavoriteUrl(item: FavoriteItem): string {
-  if (item.type === "pipeline") return `${EDITOR_PATH}/${item.id}`;
-  return `${RUNS_BASE_PATH}/${item.id}`;
-}
-
-const FavoriteChip = ({
-  item,
-  onRemove,
-}: {
-  item: FavoriteItem;
-  onRemove: (type: FavoriteType, id: string) => void;
-}) => (
-  <Link
-    to={getFavoriteUrl(item)}
-    title={item.name}
-    className={cn(
-      "group flex items-center gap-1.5 pl-2 pr-1 py-1 border rounded-md min-w-0 no-underline",
-      item.type === "pipeline"
-        ? "bg-violet-50/50 hover:bg-violet-50 border-violet-100"
-        : "bg-emerald-50/50 hover:bg-emerald-50 border-emerald-100",
-    )}
-  >
-    <Icon
-      name={item.type === "pipeline" ? "GitBranch" : "Play"}
-      size="sm"
-      className="shrink-0 text-muted-foreground"
-    />
-    <Text size="sm" className="truncate">
-      {item.name}
-    </Text>
-    <Button
-      variant="ghost"
-      size="icon"
-      onClick={(e) => {
-        e.preventDefault();
-        e.stopPropagation();
-        onRemove(item.type, item.id);
-      }}
-      className="shrink-0 opacity-0 group-hover:opacity-100 text-muted-foreground hover:text-foreground"
-      aria-label="Remove from favorites"
-    >
-      <Icon name="X" size="sm" />
-    </Button>
-  </Link>
-);
-
-export const FavoritesSection = () => {
-  const { favorites, removeFavorite } = useFavorites();
-  const [page, setPage] = useState(0);
-  const [query, setQuery] = useState("");
-
-  const normalizedQuery = query.trim().toLowerCase();
-  const filtered = normalizedQuery
-    ? favorites.filter(
-        (favorite) =>
-          favorite.id.toLowerCase().includes(normalizedQuery) ||
-          favorite.name.toLowerCase().includes(normalizedQuery),
-      )
-    : favorites;
-
-  const totalPages = Math.ceil(filtered.length / PAGE_SIZE);
-  const safePage = Math.min(page, Math.max(0, totalPages - 1));
-  const paginated = filtered.slice(
-    safePage * PAGE_SIZE,
-    (safePage + 1) * PAGE_SIZE,
-  );
-
-  return (
-    <BlockStack gap="2">
-      <InlineStack blockAlign="center" gap="1">
-        <Icon name="Star" className="text-warning fill-current" />
-        <Heading level={2}>Favorites</Heading>
-      </InlineStack>
-
-      {favorites.length === 0 ? (
-        <Paragraph tone="subdued" size="sm">
-          No favorites yet. Star a pipeline or run to pin it here.
-        </Paragraph>
-      ) : (
-        <BlockStack gap="2">
-          <div className="relative w-48">
-            <Icon
-              name="Search"
-              className="absolute left-3 top-1/2 -translate-y-1/2 text-muted-foreground"
-            />
-            <Input
-              placeholder="Search by name or ID..."
-              value={query}
-              onChange={(e) => {
-                setPage(0);
-                setQuery(e.target.value);
-              }}
-              className="pl-9 pr-8 w-full"
-            />
-            {query && (
-              <Button
-                variant="ghost"
-                size="icon"
-                onClick={() => {
-                  setPage(0);
-                  setQuery("");
-                }}
-                className="absolute right-2 top-1/2 -translate-y-1/2 size-6 text-muted-foreground hover:text-foreground"
-                aria-label="Clear search"
-              >
-                <Icon name="X" size="sm" />
-              </Button>
-            )}
-          </div>
-
-          <InlineStack wrap="wrap" gap="2">
-            {paginated.map((item) => (
-              <FavoriteChip
-                key={`${item.type}-${item.id}`}
-                item={item}
-                onRemove={removeFavorite}
-              />
-            ))}
-          </InlineStack>
-
-          {totalPages > 1 && (
-            <InlineStack blockAlign="center" gap="2">
-              <Button
-                variant="ghost"
-                size="icon"
-                className="h-6 w-6"
-                disabled={safePage === 0}
-                onClick={() => setPage(safePage - 1)}
-              >
-                <Icon name="ChevronLeft" />
-              </Button>
-              <Paragraph tone="subdued" size="sm">
-                {safePage + 1} / {totalPages}
-              </Paragraph>
-              <Button
-                variant="ghost"
-                size="icon"
-                className="h-6 w-6"
-                disabled={safePage >= totalPages - 1}
-                onClick={() => setPage(safePage + 1)}
-              >
-                <Icon name="ChevronRight" />
-              </Button>
-            </InlineStack>
-          )}
-        </BlockStack>
-      )}
-    </BlockStack>
-  );
-};
diff --git a/src/components/Home/RunSection/RunSection.tsx b/src/components/Home/RunSection/RunSection.tsx
index 0019a68d0..4ffa2ed16 100644
--- a/src/components/Home/RunSection/RunSection.tsx
+++ b/src/components/Home/RunSection/RunSection.tsx
@@ -43,9 +43,18 @@ interface RunSectionProps {
   onEmptyList?: () => void;
   /** When true, hides the built-in filter UI (used when new filter bar is enabled) */
   hideFilters?: boolean;
+  /** When provided, overrides the URL filter param (e.g. "created_by:me") */
+  forcedFilter?: string;
+  /** When provided, limits the number of rows shown (pagination still works per backend page) */
+  maxItems?: number;
 }
 
-export const RunSection = ({ onEmptyList, hideFilters }: RunSectionProps) => {
+export const RunSection = ({
+  onEmptyList,
+  hideFilters,
+  forcedFilter,
+  maxItems,
+}: RunSectionProps) => {
   const { backendUrl, configured, available, ready } = useBackend();
   const navigate = useNavigate();
   const { pathname } = useLocation();
@@ -54,7 +63,7 @@ export const RunSection = ({ onEmptyList, hideFilters }: RunSectionProps) => {
   const dataVersion = useRef(0);
 
   // Supports both JSON (new) and key:value (legacy) URL formats
-  const filters = parseFilterParam(search.filter);
+  const filters = parseFilterParam(forcedFilter ?? search.filter);
   const createdByValue = filters.created_by;
 
   const apiFilterQuery = filtersToFilterQuery(filters);
@@ -281,7 +290,10 @@ export const RunSection = ({ onEmptyList, hideFilters }: RunSectionProps) => {
           </TableRow>
         </TableHeader>
         <TableBody>
-          {data.pipeline_runs?.map((run) => (
+          {(maxItems
+            ? data.pipeline_runs?.slice(0, maxItems)
+            : data.pipeline_runs
+          )?.map((run) => (
             <RunRow key={run.id} run={run} />
           ))}
         </TableBody>
diff --git a/src/hooks/useRecentlyViewed.ts b/src/hooks/useRecentlyViewed.ts
index a149dfbcd..64c5024ed 100644
--- a/src/hooks/useRecentlyViewed.ts
+++ b/src/hooks/useRecentlyViewed.ts
@@ -3,7 +3,7 @@ import { useEffect, useState } from "react";
 import { getStorage } from "@/utils/typedStorage";
 
 const RECENTLY_VIEWED_KEY = "Home/recently_viewed";
-const MAX_ITEMS = 10;
+const MAX_ITEMS = 100;
 
 type RecentlyViewedType = "pipeline" | "run" | "component";
 
diff --git a/src/routes/Dashboard/DashboardFavoritesView.tsx b/src/routes/Dashboard/DashboardFavoritesView.tsx
index cf808afde..6476015de 100644
--- a/src/routes/Dashboard/DashboardFavoritesView.tsx
+++ b/src/routes/Dashboard/DashboardFavoritesView.tsx
@@ -10,7 +10,7 @@ import { type FavoriteItem, useFavorites } from "@/hooks/useFavorites";
 import { cn } from "@/lib/utils";
 import { EDITOR_PATH, RUNS_BASE_PATH } from "@/routes/router";
 
-const PAGE_SIZE = 16;
+const PAGE_SIZE = 20;
 
 function getFavoriteUrl(item: FavoriteItem): string {
   if (item.type === "pipeline") return `${EDITOR_PATH}/${item.id}`;
@@ -25,7 +25,7 @@ const FavoriteCard = ({ item }: { item: FavoriteItem }) => {
   return (
     <Link
       to={getFavoriteUrl(item)}
-      className="group relative flex flex-col gap-2.5 p-3 rounded-lg transition-all shadow-sm hover:shadow-md bg-card border border-border hover:border-foreground/20 no-underline"
+      className="group relative flex flex-col gap-2.5 p-3 rounded-lg transition-all shadow-sm hover:shadow-md bg-card border border-border hover:border-foreground/20 no-underline overflow-hidden"
     >
       {/* Remove button */}
       <Button
diff --git a/src/routes/Dashboard/DashboardHomeView.tsx b/src/routes/Dashboard/DashboardHomeView.tsx
new file mode 100644
index 000000000..99410b0fb
--- /dev/null
+++ b/src/routes/Dashboard/DashboardHomeView.tsx
@@ -0,0 +1,241 @@
+import { Link } from "@tanstack/react-router";
+
+import { RunSection } from "@/components/Home/RunSection/RunSection";
+import { AnnouncementBanners } from "@/components/shared/AnnouncementBanners";
+import { Button } from "@/components/ui/button";
+import { Icon, type IconName } from "@/components/ui/icon";
+import { BlockStack, InlineStack } from "@/components/ui/layout";
+import {
+  Tooltip,
+  TooltipContent,
+  TooltipTrigger,
+} from "@/components/ui/tooltip";
+import { Paragraph, Text } from "@/components/ui/typography";
+import { type FavoriteItem, useFavorites } from "@/hooks/useFavorites";
+import {
+  type RecentlyViewedItem,
+  useRecentlyViewed,
+} from "@/hooks/useRecentlyViewed";
+import { cn } from "@/lib/utils";
+import { APP_ROUTES, EDITOR_PATH, RUNS_BASE_PATH } from "@/routes/router";
+import { formatRelativeTime } from "@/utils/date";
+
+const PREVIEW_COUNT = 5;
+
+function getRecentlyViewedUrl(item: RecentlyViewedItem): string {
+  if (item.type === "pipeline") return `${EDITOR_PATH}/${item.id}`;
+  if (item.type === "run") return `${RUNS_BASE_PATH}/${item.id}`;
+  return APP_ROUTES.DASHBOARD_COMPONENTS;
+}
+
+function getFavoriteUrl(item: FavoriteItem): string {
+  if (item.type === "pipeline") return `${EDITOR_PATH}/${item.id}`;
+  return `${RUNS_BASE_PATH}/${item.id}`;
+}
+
+type ItemType = "pipeline" | "run" | "component";
+
+const TYPE_CONFIG: Record<
+  ItemType,
+  { className: string; icon: IconName; label: string }
+> = {
+  pipeline: {
+    className: "bg-violet-100 text-violet-700",
+    icon: "GitBranch",
+    label: "Pipeline",
+  },
+  run: {
+    className: "bg-emerald-100 text-emerald-700",
+    icon: "Play",
+    label: "Run",
+  },
+  component: {
+    className: "bg-blue-100 text-blue-700",
+    icon: "Package",
+    label: "Component",
+  },
+};
+
+const TypePill = ({ type }: { type: ItemType }) => {
+  const config = TYPE_CONFIG[type];
+  return (
+    <span
+      className={cn(
+        "inline-flex items-center gap-1 px-1.5 py-0.5 rounded-full text-xs font-semibold shrink-0",
+        config.className,
+      )}
+    >
+      <Icon name={config.icon} size="sm" />
+      {config.label}
+    </span>
+  );
+};
+
+interface SectionHeaderProps {
+  title: string;
+  viewAllTo: string;
+  viewAllLabel?: string;
+}
+
+const SectionHeader = ({
+  title,
+  viewAllTo,
+  viewAllLabel = "View all",
+}: SectionHeaderProps) => (
+  <InlineStack gap="3" blockAlign="center">
+    <Text as="h2" size="lg" weight="semibold">
+      {title}
+    </Text>
+    <Link
+      to={viewAllTo}
+      className="text-xs text-muted-foreground hover:text-foreground"
+    >
+      {viewAllLabel} →
+    </Link>
+  </InlineStack>
+);
+
+const FavoritePreviewRow = ({
+  item,
+  onRemove,
+}: {
+  item: FavoriteItem;
+  onRemove: () => void;
+}) => (
+  <Link
+    to={getFavoriteUrl(item)}
+    className="group flex items-center gap-3 px-4 py-2.5 hover:bg-muted/50 no-underline"
+  >
+    <TypePill type={item.type} />
+    <Tooltip>
+      <TooltipTrigger asChild>
+        <Text size="sm" className="flex-1 min-w-0 truncate">
+          {item.name}
+        </Text>
+      </TooltipTrigger>
+      <TooltipContent>{item.name}</TooltipContent>
+    </Tooltip>
+    <Button
+      variant="ghost"
+      size="icon"
+      onClick={(e) => {
+        e.preventDefault();
+        e.stopPropagation();
+        onRemove();
+      }}
+      className="shrink-0 size-5 opacity-0 group-hover:opacity-100 text-muted-foreground hover:text-foreground"
+      aria-label="Remove from favorites"
+    >
+      <Icon name="X" size="sm" />
+    </Button>
+  </Link>
+);
+
+const RecentlyViewedPreviewRow = ({ item }: { item: RecentlyViewedItem }) => (
+  <Link
+    to={getRecentlyViewedUrl(item)}
+    className="flex items-center gap-3 px-4 py-2.5 hover:bg-muted/50 no-underline"
+  >
+    <TypePill type={item.type} />
+    <Tooltip>
+      <TooltipTrigger asChild>
+        <Text size="sm" className="flex-1 min-w-0 truncate">
+          {item.name}
+        </Text>
+      </TooltipTrigger>
+      <TooltipContent>{item.name}</TooltipContent>
+    </Tooltip>
+    <Text size="xs" className="text-muted-foreground shrink-0">
+      {formatRelativeTime(new Date(item.viewedAt))}
+    </Text>
+  </Link>
+);
+
+const FavoritesPreview = () => {
+  const { favorites, removeFavorite } = useFavorites();
+  const preview = favorites.slice(0, PREVIEW_COUNT);
+
+  return (
+    <BlockStack gap="3" className="min-w-0">
+      <SectionHeader
+        title="Favorites"
+        viewAllTo={APP_ROUTES.DASHBOARD_FAVORITES}
+      />
+      <div className="border border-border rounded-lg overflow-hidden divide-y divide-border">
+        {preview.length === 0 ? (
+          <div className="px-4 py-3">
+            <Paragraph tone="subdued" size="sm">
+              No favorites yet. Star a pipeline or run to pin it here.
+            </Paragraph>
+          </div>
+        ) : (
+          preview.map((item) => (
+            <FavoritePreviewRow
+              key={`${item.type}-${item.id}`}
+              item={item}
+              onRemove={() => removeFavorite(item.type, item.id)}
+            />
+          ))
+        )}
+      </div>
+    </BlockStack>
+  );
+};
+
+const RecentlyViewedPreview = () => {
+  const { recentlyViewed } = useRecentlyViewed();
+  const preview = recentlyViewed.slice(0, PREVIEW_COUNT);
+
+  return (
+    <BlockStack gap="3" className="min-w-0">
+      <SectionHeader
+        title="Recently Viewed"
+        viewAllTo={APP_ROUTES.DASHBOARD_RECENTLY_VIEWED}
+      />
+      <div className="border border-border rounded-lg overflow-hidden divide-y divide-border">
+        {preview.length === 0 ? (
+          <div className="px-4 py-3">
+            <Paragraph tone="subdued" size="sm">
+              Nothing viewed yet. Open a pipeline or run to see it here.
+            </Paragraph>
+          </div>
+        ) : (
+          preview.map((item) => (
+            <RecentlyViewedPreviewRow
+              key={`${item.type}-${item.id}`}
+              item={item}
+            />
+          ))
+        )}
+      </div>
+    </BlockStack>
+  );
+};
+
+export function DashboardHomeView() {
+  return (
+    <BlockStack gap="6">
+      <AnnouncementBanners />
+
+      <div className="grid grid-cols-3 gap-6">
+        <FavoritesPreview />
+        <RecentlyViewedPreview />
+        <div />
+      </div>
+
+      <BlockStack gap="3">
+        <SectionHeader
+          title="My Runs"
+          viewAllTo={APP_ROUTES.DASHBOARD_RUNS}
+          viewAllLabel="View all runs"
+        />
+        {/*
+          Fetching 10 records because the API does not yet support a custom page_size.
+          Once TangleML/tangle#188 lands, reduce this to match the visible row count.
+          Tracked in TangleML/tangle-ui#2016.
+        */}
+        <RunSection hideFilters forcedFilter="created_by:me" maxItems={10} />
+      </BlockStack>
+    </BlockStack>
+  );
+}
diff --git a/src/routes/Dashboard/DashboardLayout.tsx b/src/routes/Dashboard/DashboardLayout.tsx
index abe4a345a..bfb235d63 100644
--- a/src/routes/Dashboard/DashboardLayout.tsx
+++ b/src/routes/Dashboard/DashboardLayout.tsx
@@ -22,11 +22,13 @@ interface SidebarItem {
   to: string;
   label: string;
   icon: IconName;
+  exact?: boolean;
 }
 
 const SIDEBAR_ITEMS: SidebarItem[] = [
-  { to: "/runs", label: "Runs", icon: "Play" },
-  { to: "/pipelines", label: "Pipelines", icon: "GitBranch" },
+  { to: "/", label: "My Dashboard", icon: "LayoutDashboard", exact: true },
+  { to: "/pipelines", label: "My Pipelines", icon: "GitBranch" },
+  { to: "/runs", label: "All Runs", icon: "Play" },
   { to: "/components", label: "Components", icon: "Package" },
   { to: "/favorites", label: "Favorites", icon: "Star" },
   { to: "/recently-viewed", label: "Recently Viewed", icon: "Clock" },
@@ -67,6 +69,7 @@ export function DashboardLayout() {
               to={item.to}
               className="w-full"
               activeProps={{ className: "is-active" }}
+              activeOptions={item.exact ? { exact: true } : undefined}
             >
               {({ isActive }) => (
                 <InlineStack
diff --git a/src/routes/Dashboard/DashboardRecentlyViewedView.tsx b/src/routes/Dashboard/DashboardRecentlyViewedView.tsx
index 708af8e31..4adedbdfa 100644
--- a/src/routes/Dashboard/DashboardRecentlyViewedView.tsx
+++ b/src/routes/Dashboard/DashboardRecentlyViewedView.tsx
@@ -1,5 +1,7 @@
 import { Link } from "@tanstack/react-router";
+import { useState } from "react";
 
+import { Button } from "@/components/ui/button";
 import { Icon } from "@/components/ui/icon";
 import { BlockStack, InlineStack } from "@/components/ui/layout";
 import { Paragraph, Text } from "@/components/ui/typography";
@@ -10,6 +12,8 @@ import {
 import { APP_ROUTES, EDITOR_PATH, RUNS_BASE_PATH } from "@/routes/router";
 import { formatRelativeTime } from "@/utils/date";
 
+const PAGE_SIZE = 20;
+
 function getRecentlyViewedUrl(item: RecentlyViewedItem): string {
   if (item.type === "pipeline") return `${EDITOR_PATH}/${item.id}`;
   if (item.type === "run") return `${RUNS_BASE_PATH}/${item.id}`;
@@ -20,44 +24,54 @@ const RecentlyViewedCard = ({ item }: { item: RecentlyViewedItem }) => {
   const isPipeline = item.type === "pipeline";
 
   return (
-    <Link
-      to={getRecentlyViewedUrl(item)}
-      className="flex flex-col gap-2.5 p-3 rounded-lg transition-all shadow-sm hover:shadow-md bg-card border border-border hover:border-foreground/20 no-underline"
-    >
-      {/* Type pill + timestamp */}
-      <InlineStack blockAlign="center" align="space-between">
-        <InlineStack>
-          <span
-            className={`inline-flex items-center gap-1 px-1.5 py-0.5 rounded-full text-xs font-semibold ${
-              isPipeline
-                ? "bg-violet-100 text-violet-700"
-                : "bg-emerald-100 text-emerald-700"
-            }`}
-          >
-            <Icon name={isPipeline ? "GitBranch" : "Play"} size="sm" />
-            {isPipeline ? "Pipeline" : "Run"}
-          </span>
+    <Link to={getRecentlyViewedUrl(item)} className="no-underline block">
+      <BlockStack
+        gap="2"
+        className="p-3 rounded-lg transition-all shadow-sm hover:shadow-md bg-card border border-border hover:border-foreground/20 overflow-hidden"
+      >
+        {/* Type pill + timestamp */}
+        <InlineStack blockAlign="center" align="space-between">
+          <InlineStack>
+            <span
+              className={`inline-flex items-center gap-1 px-1.5 py-0.5 rounded-full text-xs font-semibold ${
+                isPipeline
+                  ? "bg-violet-100 text-violet-700"
+                  : "bg-emerald-100 text-emerald-700"
+              }`}
+            >
+              <Icon name={isPipeline ? "GitBranch" : "Play"} size="sm" />
+              {isPipeline ? "Pipeline" : "Run"}
+            </span>
+          </InlineStack>
+          <Text size="xs" className="text-muted-foreground">
+            {formatRelativeTime(new Date(item.viewedAt))}
+          </Text>
         </InlineStack>
-        <Text size="xs" className="text-muted-foreground">
-          {formatRelativeTime(new Date(item.viewedAt))}
-        </Text>
-      </InlineStack>
 
-      {/* Name */}
-      <Text size="sm" weight="semibold" className="truncate leading-tight">
-        {item.name}
-      </Text>
+        {/* Name */}
+        <Text size="sm" weight="semibold" className="truncate leading-tight">
+          {item.name}
+        </Text>
 
-      {/* ID */}
-      <Text size="xs" className="truncate text-muted-foreground font-mono">
-        {item.id}
-      </Text>
+        {/* ID */}
+        <Text size="xs" className="truncate text-muted-foreground font-mono">
+          {item.id}
+        </Text>
+      </BlockStack>
     </Link>
   );
 };
 
 export function DashboardRecentlyViewedView() {
   const { recentlyViewed } = useRecentlyViewed();
+  const [page, setPage] = useState(0);
+
+  const totalPages = Math.ceil(recentlyViewed.length / PAGE_SIZE);
+  const safePage = Math.min(page, Math.max(0, totalPages - 1));
+  const paginated = recentlyViewed.slice(
+    safePage * PAGE_SIZE,
+    (safePage + 1) * PAGE_SIZE,
+  );
 
   return (
     <BlockStack gap="4">
@@ -70,11 +84,39 @@ export function DashboardRecentlyViewedView() {
           Nothing viewed yet. Open a pipeline or run to see it here.
         </Paragraph>
       ) : (
-        <div className="grid grid-cols-4 gap-3">
-          {recentlyViewed.map((item) => (
-            <RecentlyViewedCard key={`${item.type}-${item.id}`} item={item} />
-          ))}
-        </div>
+        <BlockStack gap="4">
+          <div className="grid grid-cols-4 gap-3">
+            {paginated.map((item) => (
+              <RecentlyViewedCard key={`${item.type}-${item.id}`} item={item} />
+            ))}
+          </div>
+
+          {totalPages > 1 && (
+            <InlineStack blockAlign="center" gap="2">
+              <Button
+                variant="ghost"
+                size="icon"
+                className="h-7 w-7"
+                disabled={safePage === 0}
+                onClick={() => setPage(safePage - 1)}
+              >
+                <Icon name="ChevronLeft" />
+              </Button>
+              <Text size="sm" className="text-muted-foreground">
+                {safePage + 1} / {totalPages}
+              </Text>
+              <Button
+                variant="ghost"
+                size="icon"
+                className="h-7 w-7"
+                disabled={safePage >= totalPages - 1}
+                onClick={() => setPage(safePage + 1)}
+              >
+                <Icon name="ChevronRight" />
+              </Button>
+            </InlineStack>
+          )}
+        </BlockStack>
       )}
     </BlockStack>
   );
diff --git a/src/routes/router.ts b/src/routes/router.ts
index 25cd61133..d7ac791c2 100644
--- a/src/routes/router.ts
+++ b/src/routes/router.ts
@@ -18,6 +18,7 @@ import { BASE_URL, IS_GITHUB_PAGES } from "@/utils/constants";
 
 import RootLayout from "../components/layout/RootLayout";
 import { DashboardFavoritesView } from "./Dashboard/DashboardFavoritesView";
+import { DashboardHomeView } from "./Dashboard/DashboardHomeView";
 import { DashboardLayout } from "./Dashboard/DashboardLayout";
 import { DashboardPipelinesView } from "./Dashboard/DashboardPipelinesView";
 import { DashboardRecentlyViewedView } from "./Dashboard/DashboardRecentlyViewedView";
@@ -103,9 +104,7 @@ const dashboardRoute = createRoute({
 const dashboardIndexRoute = createRoute({
   getParentRoute: () => dashboardRoute,
   path: "/",
-  beforeLoad: () => {
-    throw redirect({ to: APP_ROUTES.DASHBOARD_RUNS });
-  },
+  component: DashboardHomeView,
 });
 
 // Placeholder component — replaced in subsequent PRs