initial framework

2026-02-11 21:05:26 +00:00
parent 1df6c91109
commit f318513b2f
17 changed files with 1754 additions and 63 deletions
--- a/app/favicon.ico
+++ b/app/favicon.ico
--- a/app/layout.tsx
+++ b/app/layout.tsx
@@ -1,9 +1,25 @@
+
 import type { Metadata } from "next";
 import "./globals.css";
+import { IBM_Plex_Sans, IBM_Plex_Mono } from 'next/font/google';
+import { Provider } from "@/components/ui/provider";
+import { Flex } from "@chakra-ui/react";
+import { Toaster } from "@/components/ui/toaster";
+
+const ibmPlexSans = IBM_Plex_Sans({
+  subsets: ['latin'],
+  variable: '--font-ibm'
+});
+
+const ibmPlexMono = IBM_Plex_Mono({
+  subsets: ['latin'],
+  weight: '600',
+  variable: '--font-ibm-mono'
+})

 export const metadata: Metadata = {
-  title: "Create Next App",
-  description: "Generated by create next app",
+  title: "LMGCITFY",
+  description: "Let me GCI that for you.",
 };

 export default function RootLayout({
@@ -12,8 +28,15 @@ export default function RootLayout({
  children: React.ReactNode;
 }>) {
  return (
-    <html lang="en">
-      <body>{children}</body>
+    <html lang="en" suppressHydrationWarning={true}>
+      <body className={`${ibmPlexSans.variable} ${ibmPlexMono.variable}`}>
+        <Provider>
+          <Flex backgroundImage={'url(/background.gif)'} backgroundRepeat={'repeat'} minH={'100vh'} minW={'full'} justify={'center'} align={'center'}>
+            {children}
+          </Flex>
+          <Toaster />
+        </Provider>
+      </body>
    </html>
  );
 }
--- a/app/page.tsx
+++ b/app/page.tsx
@@ -1,7 +1,69 @@
+'use client'
+import theme from "@/theme";
+import { Button, ChakraProvider, Container, Flex, Heading, Image, Input, Text } from "@chakra-ui/react";
+import { useState } from "react";
+import { toaster } from "@/components/ui/toaster";
+import { feelingFree } from "@/actions";
+
+
 export default function Home() {
+  const [query, setQuery] = useState<string | undefined>(undefined);
+  const feelingFreedom = async () => {
+    try {
+
+      if (!query) {
+        throw new Error('You must provide a search query.');
+      }
+
+      const searchParams = new URLSearchParams();
+      searchParams.set('query', query)
+
+      const result = await feelingFree(searchParams.toString());
+
+      if (result.error) {
+        throw new Error(result.payload);
+      }
+
+      toaster.create({ title: 'Redirecting...', description: 'Was that so hard?', type: 'success' })
+      setTimeout(() => {
+        window.location.href = result.payload;
+      }, 2000)
+
+    } catch (error) {
+      if (error instanceof Error) {
+        toaster.create({ type: 'error', title: 'Error', description: error.message })
+        return;
+      }
+      return;
+    }
+
+  }
+  const lmgcitfy = () => {
+    if (!query) {
+      toaster.create({ title: 'Error', description: 'You must enter a search query.', type: 'error' });
+      return;
+    }
+    const searchParams = new URLSearchParams();
+
+    searchParams.append('query', query);
+    window.location.href = `https://guncadindex.com/search?${searchParams}`;
+  }
  return (
-    <main>
-      <div>Hello world!</div>
-    </main>
+    <ChakraProvider value={theme}>
+      <Container backgroundColor={'#2a2a2a'} borderRadius={'lg'} boxShadow={'0 0 12px #4a4a4a'} py={4} width={{ base: '90%', md: '50%' }} overflow={'hidden'}>
+        <Flex justify={'center'} align={'center'} p={2} mb={4}>
+          <Image src={'/gci_logo_large.png'} height={{ base: '50px', md: '75px' }} alt="GunCAD Index logo" />
+          <Flex flexDir={'column'} mx={4} >
+            <Heading size={{ base: '2xl', md: '5xl' }} fontFamily={'var(--font-ibm)'} lineHeight={1}>GunCAD Index</Heading>
+            <Text fontSize={{ base: 'sm', md: 'xl' }} ml={{ md: 1 }} fontFamily={'var(--font-ibm)'}>A search engine for guns.</Text>
+          </Flex>
+        </Flex>
+        <Input variant={'outline'} borderRadius={'lg'} border={'1px solid #4a4a4a'} size={'lg'} placeholder="Enter your query here" onChange={(e) => setQuery(e.target.value)} />
+        <Flex justify={'space-around'} gapY={4} flexDir={{ base: 'column', md: 'row' }} p={2} my={4}>
+          <Button colorPalette={'green'} variant={'solid'} size={'lg'} onClick={() => lmgcitfy()}>Search on GCI</Button>
+          <Button colorPalette={'white'} variant={'outline'} size={'lg'} border={'1px solid #4a4a4a'} color={'#FFF'} onClick={() => feelingFreedom()}>I&apos;m feeling free</Button>
+        </Flex>
+      </Container>
+    </ChakraProvider>
  );
 }