feat: moved tools outside page

src/app/page.tsx

@@ -6,49 +6,16 @@ import { useRef } from 'react';
 import { Search, SearchItem } from 'react-fuzzysort';
 import PageWrapper from '../components/PageWrapper';
 import { SearchBar } from '../components/SearchBar';
+import { TOOLS } from '../constants/tools';
 import { theme } from '../stitches.config';
 import * as styles from './page.css';
 
-export const TOOLS = [
-  {
-    id: 'session',
-    title: 'Session tracker',
-    description: 'Track your performance in a session',
-  },
-  {
-    id: 'ratings',
-    title: 'Ratings',
-    description: 'Current and old season leader boards',
-  },
-  {
-    id: 'tankopedia',
-    title: 'Tankopedia',
-    description: 'Full Blitz tank encyclopedia',
-  },
-  {
-    id: 'inactive',
-    title: 'Inactivity tracker',
-    description: 'Find inactive members of a clan',
-  },
-  {
-    id: 'profile',
-    title: 'Player profile',
-    description: "A player's basic non-statistical info",
-  },
-  // {
-  //   title: 'More coming soon',
-  //   description: 'New tools are added often',
-  //   banner: '/assets/banners/more.png',
-  //   id: 'https://discord.gg/nDt7AjGJQH',
-  // },
-];
-
 export default function Page() {
   const input = useRef<HTMLInputElement>(null);
 
   return (
     <PageWrapper>
-      <SearchBar ref={input} />
+      <SearchBar placeholder="Search tools..." ref={input} />
 
       <div
         style={{

src/app/tools/layout.tsx

@@ -1,8 +1,8 @@
 'use client';
 
 import { ReactNode } from 'react';
+import { TOOLS } from '../../constants/tools';
 import { theme } from '../../stitches.config';
-import { TOOLS } from '../page';
 
 interface ToolsLayoutProps {
   children: ReactNode;

src/components/SearchBar.tsx

@@ -39,7 +39,6 @@ export const SearchBar = forwardRef<HTMLInputElement, ComponentProps<'input'>>(
             outline: 'none',
             fontSize: 'inherit',
           }}
-          placeholder="Search tools..."
         />
       </div>
     );

src/constants/tools.ts

@@ -0,0 +1,33 @@
+export const TOOLS = [
+  {
+    id: 'session',
+    title: 'Session tracker',
+    description: 'Track your performance in a session',
+  },
+  // {
+  //   id: 'ratings',
+  //   title: 'Ratings',
+  //   description: 'Current and old season leader boards',
+  // },
+  // {
+  //   id: 'tankopedia',
+  //   title: 'Tankopedia',
+  //   description: 'Full Blitz tank encyclopedia',
+  // },
+  // {
+  //   id: 'inactive',
+  //   title: 'Inactivity tracker',
+  //   description: 'Find inactive members of a clan',
+  // },
+  // {
+  //   id: 'profile',
+  //   title: 'Player profile',
+  //   description: "A player's basic non-statistical info",
+  // },
+  // {
+  //   title: 'More coming soon',
+  //   description: 'New tools are added often',
+  //   banner: '/assets/banners/more.png',
+  //   id: 'https://discord.gg/nDt7AjGJQH',
+  // },
+];