From bf86fc24960ba26ac29d455f94006ee4bec276a7 Mon Sep 17 00:00:00 2001
From: Dani Akash <DaniAkash@users.noreply.github.com>
Date: Tue, 20 Jan 2026 18:41:40 +0530
Subject: [PATCH] fix: added missing focus grid to the newtab page (#249)

---
 apps/agent/entrypoints/app/App.tsx                   |  5 ++---
 .../entrypoints/newtab/layout/NewTabFocusGrid.tsx    | 10 ++++++++++
 .../agent/entrypoints/newtab/layout/NewTabLayout.tsx | 12 ++++++++++++
 3 files changed, 24 insertions(+), 3 deletions(-)
 create mode 100644 apps/agent/entrypoints/newtab/layout/NewTabFocusGrid.tsx
 create mode 100644 apps/agent/entrypoints/newtab/layout/NewTabLayout.tsx

diff --git a/apps/agent/entrypoints/app/App.tsx b/apps/agent/entrypoints/app/App.tsx
index 40a067e1..f06cb59b 100644
--- a/apps/agent/entrypoints/app/App.tsx
+++ b/apps/agent/entrypoints/app/App.tsx
@@ -2,12 +2,11 @@ import { type FC, Suspense } from 'react'
 import { HashRouter, Navigate, Route, Routes, useParams } from 'react-router'
 
 import { NewTab } from '../newtab/index/NewTab'
+import { NewTabLayout } from '../newtab/layout/NewTabLayout'
 import { Personalize } from '../newtab/personalize/Personalize'
-
 import { FeaturesPage } from '../onboarding/features/Features'
 import { Onboarding } from '../onboarding/index/Onboarding'
 import { StepsLayout } from '../onboarding/steps/StepsLayout'
-
 import { AISettingsPage } from './ai-settings/AISettingsPage'
 import { ConnectMCP } from './connect-mcp/ConnectMCP'
 import { CreateGraphWrapper } from './create-graph/CreateGraphWrapper'
@@ -58,7 +57,7 @@ export const App: FC = () => {
           {/* Main app with sidebar */}
           <Route element={<SidebarLayout />}>
             {/* Home routes */}
-            <Route path="home">
+            <Route path="home" element={<NewTabLayout />}>
               <Route index element={<NewTab />} />
               <Route path="personalize" element={<Personalize />} />
             </Route>
diff --git a/apps/agent/entrypoints/newtab/layout/NewTabFocusGrid.tsx b/apps/agent/entrypoints/newtab/layout/NewTabFocusGrid.tsx
new file mode 100644
index 00000000..a8e424fe
--- /dev/null
+++ b/apps/agent/entrypoints/newtab/layout/NewTabFocusGrid.tsx
@@ -0,0 +1,10 @@
+import type { FC } from 'react'
+
+export const NewTabFocusGrid: FC = () => {
+  return (
+    <div className="pointer-events-none absolute inset-0 overflow-hidden">
+      <div className="absolute inset-0 bg-grid-pattern"></div>
+      <div className="absolute inset-0 bg-gradient-radial-focus"></div>
+    </div>
+  )
+}
diff --git a/apps/agent/entrypoints/newtab/layout/NewTabLayout.tsx b/apps/agent/entrypoints/newtab/layout/NewTabLayout.tsx
new file mode 100644
index 00000000..0b6fb8fd
--- /dev/null
+++ b/apps/agent/entrypoints/newtab/layout/NewTabLayout.tsx
@@ -0,0 +1,12 @@
+import type { FC } from 'react'
+import { Outlet } from 'react-router'
+import { NewTabFocusGrid } from './NewTabFocusGrid'
+
+export const NewTabLayout: FC = () => {
+  return (
+    <>
+      <NewTabFocusGrid />
+      <Outlet />
+    </>
+  )
+}