feat(validators): move report tool to validators index

src/components/Layout/Sidebar/Sidebar.tsx

@@ -165,10 +165,6 @@ const ethereumConsensusPages: NavItem[] = [
   { name: 'Forks', to: '/ethereum/forks', icon: SignalIcon },
 ];
 
-const ethereumValidatorsPages: NavItem[] = [
-  { name: 'Report', to: '/ethereum/validators/report', icon: DocumentTextIcon },
-];
-
 const ethereumDataAvailabilityPages: NavItem[] = [
   { name: 'Custody', to: '/ethereum/data-availability/custody', icon: CircleStackIcon },
   { name: 'Probes', to: '/ethereum/data-availability/probes', icon: MagnifyingGlassIcon },
@@ -292,11 +288,6 @@ export function Sidebar({ sidebarOpen, setSidebarOpen, collapsed, setCollapsed }
     [config?.features, currentNetwork?.name]
   );
 
-  const filteredEthereumValidatorsPages = useMemo(
-    () => ethereumValidatorsPages.filter(page => isPageEnabled(page.to, config?.features, currentNetwork?.name)),
-    [config?.features, currentNetwork?.name]
-  );
-
   const filteredXatuPages = useMemo(
     () => xatuPages.filter(page => isPageEnabled(page.to, config?.features, currentNetwork?.name)),
     [config?.features, currentNetwork?.name]
@@ -356,16 +347,6 @@ export function Sidebar({ sidebarOpen, setSidebarOpen, collapsed, setCollapsed }
                           </div>
                         </div>
                       )}
-                      {filteredEthereumValidatorsPages.length > 0 && (
-                        <div>
-                          <SubsectionHeader title="Validators" collapsed={false} />
-                          <div className="space-y-0.5">
-                            {filteredEthereumValidatorsPages.map(page => (
-                              <NavLink key={page.to} page={page} collapsed={false} />
-                            ))}
-                          </div>
-                        </div>
-                      )}
                     </div>
                   </div>
 
@@ -487,16 +468,6 @@ export function Sidebar({ sidebarOpen, setSidebarOpen, collapsed, setCollapsed }
                     </div>
                   </div>
                 )}
-                {filteredEthereumValidatorsPages.length > 0 && (
-                  <div>
-                    <SubsectionHeader title="Validators" collapsed={collapsed} />
-                    <div className={clsx(collapsed ? 'space-y-1' : 'space-y-0.5')}>
-                      {filteredEthereumValidatorsPages.map(page => (
-                        <NavLink key={page.to} page={page} collapsed={collapsed} />
-                      ))}
-                    </div>
-                  </div>
-                )}
               </div>
             </div>
 

src/pages/ethereum/validators/IndexPage.tsx

@@ -56,7 +56,7 @@ function tagsFromUrl(indices?: string): string[] {
  */
 export function IndexPage(): JSX.Element {
   const navigate = useNavigate();
-  const search = useSearch({ from: '/ethereum/validators/report' }) as ValidatorsSearch;
+  const search = useSearch({ from: '/ethereum/validators/' }) as ValidatorsSearch;
 
   // Initialize state from URL params or defaults
   const defaultRange = getDefaultTimeRange();
@@ -117,7 +117,7 @@ export function IndexPage(): JSX.Element {
     (tagList: string[], from: number, to: number) => {
       const indices = tagList.join(',');
       void navigate({
-        to: '/ethereum/validators/report',
+        to: '/ethereum/validators',
         search: {
           indices: indices || undefined,
           from: from || undefined,

src/pages/ethereum/validators/index.ts

@@ -1,2 +1 @@
 export { IndexPage } from './IndexPage';
-export { LandingPage } from './LandingPage';

src/routeTree.gen.ts

@@ -42,7 +42,6 @@ import { Route as EthereumEpochsIndexRouteImport } from './routes/ethereum/epoch
 import { Route as EthereumEntitiesIndexRouteImport } from './routes/ethereum/entities/index'
 import { Route as EthereumContractsIndexRouteImport } from './routes/ethereum/contracts/index'
 import { Route as XatuContributorsIdRouteImport } from './routes/xatu/contributors/$id'
-import { Route as EthereumValidatorsReportRouteImport } from './routes/ethereum/validators/report'
 import { Route as EthereumSlotsSlotRouteImport } from './routes/ethereum/slots/$slot'
 import { Route as EthereumForksForkRouteImport } from './routes/ethereum/forks/$fork'
 import { Route as EthereumExecutionTimingsRouteImport } from './routes/ethereum/execution/timings'
@@ -239,12 +238,6 @@ const XatuContributorsIdRoute = XatuContributorsIdRouteImport.update({
   path: '/$id',
   getParentRoute: () => XatuContributorsRoute,
 } as any)
-const EthereumValidatorsReportRoute =
-  EthereumValidatorsReportRouteImport.update({
-    id: '/report',
-    path: '/report',
-    getParentRoute: () => EthereumValidatorsRoute,
-  } as any)
 const EthereumSlotsSlotRoute = EthereumSlotsSlotRouteImport.update({
   id: '/$slot',
   path: '/$slot',
@@ -433,7 +426,6 @@ export interface FileRoutesByFullPath {
   '/ethereum/execution/timings': typeof EthereumExecutionTimingsRouteWithChildren
   '/ethereum/forks/$fork': typeof EthereumForksForkRoute
   '/ethereum/slots/$slot': typeof EthereumSlotsSlotRoute
-  '/ethereum/validators/report': typeof EthereumValidatorsReportRoute
   '/xatu/contributors/$id': typeof XatuContributorsIdRoute
   '/ethereum/contracts/': typeof EthereumContractsIndexRoute
   '/ethereum/entities/': typeof EthereumEntitiesIndexRoute
@@ -481,7 +473,6 @@ export interface FileRoutesByTo {
   '/ethereum/execution/state-growth': typeof EthereumExecutionStateGrowthRoute
   '/ethereum/forks/$fork': typeof EthereumForksForkRoute
   '/ethereum/slots/$slot': typeof EthereumSlotsSlotRoute
-  '/ethereum/validators/report': typeof EthereumValidatorsReportRoute
   '/xatu/contributors/$id': typeof XatuContributorsIdRoute
   '/ethereum/contracts': typeof EthereumContractsIndexRoute
   '/ethereum/entities': typeof EthereumEntitiesIndexRoute
@@ -543,7 +534,6 @@ export interface FileRoutesById {
   '/ethereum/execution/timings': typeof EthereumExecutionTimingsRouteWithChildren
   '/ethereum/forks/$fork': typeof EthereumForksForkRoute
   '/ethereum/slots/$slot': typeof EthereumSlotsSlotRoute
-  '/ethereum/validators/report': typeof EthereumValidatorsReportRoute
   '/xatu/contributors/$id': typeof XatuContributorsIdRoute
   '/ethereum/contracts/': typeof EthereumContractsIndexRoute
   '/ethereum/entities/': typeof EthereumEntitiesIndexRoute
@@ -606,7 +596,6 @@ export interface FileRouteTypes {
     | '/ethereum/execution/timings'
     | '/ethereum/forks/$fork'
     | '/ethereum/slots/$slot'
-    | '/ethereum/validators/report'
     | '/xatu/contributors/$id'
     | '/ethereum/contracts/'
     | '/ethereum/entities/'
@@ -654,7 +643,6 @@ export interface FileRouteTypes {
     | '/ethereum/execution/state-growth'
     | '/ethereum/forks/$fork'
     | '/ethereum/slots/$slot'
-    | '/ethereum/validators/report'
     | '/xatu/contributors/$id'
     | '/ethereum/contracts'
     | '/ethereum/entities'
@@ -715,7 +703,6 @@ export interface FileRouteTypes {
     | '/ethereum/execution/timings'
     | '/ethereum/forks/$fork'
     | '/ethereum/slots/$slot'
-    | '/ethereum/validators/report'
     | '/xatu/contributors/$id'
     | '/ethereum/contracts/'
     | '/ethereum/entities/'
@@ -981,13 +968,6 @@ declare module '@tanstack/react-router' {
       preLoaderRoute: typeof XatuContributorsIdRouteImport
       parentRoute: typeof XatuContributorsRoute
     }
-    '/ethereum/validators/report': {
-      id: '/ethereum/validators/report'
-      path: '/report'
-      fullPath: '/ethereum/validators/report'
-      preLoaderRoute: typeof EthereumValidatorsReportRouteImport
-      parentRoute: typeof EthereumValidatorsRoute
-    }
     '/ethereum/slots/$slot': {
       id: '/ethereum/slots/$slot'
       path: '/$slot'
@@ -1371,12 +1351,10 @@ const EthereumSlotsRouteWithChildren = EthereumSlotsRoute._addFileChildren(
 )
 
 interface EthereumValidatorsRouteChildren {
-  EthereumValidatorsReportRoute: typeof EthereumValidatorsReportRoute
   EthereumValidatorsIndexRoute: typeof EthereumValidatorsIndexRoute
 }
 
 const EthereumValidatorsRouteChildren: EthereumValidatorsRouteChildren = {
-  EthereumValidatorsReportRoute: EthereumValidatorsReportRoute,
   EthereumValidatorsIndexRoute: EthereumValidatorsIndexRoute,
 }
 

src/routes/ethereum/validators/index.tsx

@@ -1,8 +1,16 @@
 import { createFileRoute } from '@tanstack/react-router';
-import { LandingPage } from '@/pages/ethereum/validators';
+import { z } from 'zod';
+import { IndexPage } from '@/pages/ethereum/validators';
+
+const validatorsSearchSchema = z.object({
+  indices: z.string().optional(),
+  from: z.coerce.number().optional(),
+  to: z.coerce.number().optional(),
+});
 
 export const Route = createFileRoute('/ethereum/validators/')({
-  component: LandingPage,
+  component: IndexPage,
+  validateSearch: validatorsSearchSchema,
   beforeLoad: () => ({
     getBreadcrumb: () => ({ show: false }),
   }),