initial starter pages

src/App.tsx

@@ -1,28 +1,29 @@
-import Navbar from './components/navbar/Navbar'
-import { Routes, Route } from 'react-router-dom'
-import Footer from './components/footer/Footer'
-import About from './pages/about/About'
-import Home from './pages/home/Home'
-import Tickets from './pages/tickets/Tickets'
-import ComingSoon from './pages/comingSoon/ComingSoon'
-import Hackathon from './pages/hackathon/Hackathon'
-import Winners from './pages/winners/Winners'
-import Conference from './pages/conference/Conference'
-import Faucet from './pages/faucet/Faucet'
-import Showcase from './pages/showcase/Showcase'
-import links from './data/links'
-import HackerTicketRedirect from './pages/HackerTicketRedirect'
-import HolidayCollectibleMint from './pages/holidayCollectibleMint/HolidayCollectibleMint'
-import { WagmiConfig } from 'wagmi'
-import wagmiConfig from './wagmiConfig'
-import { ConnectKitProvider } from 'connectkit'
-import Community from './pages/community/Community'
+import Navbar from "./components/navbar/Navbar";
+import { Routes, Route } from "react-router-dom";
+import Footer from "./components/footer/Footer";
+import About from "./pages/about/About";
+import Home from "./pages/home/Home";
+import Tickets from "./pages/tickets/Tickets";
+import ComingSoon from "./pages/comingSoon/ComingSoon";
+import Hackathon from "./pages/hackathon/Hackathon";
+import Winners from "./pages/winners/Winners";
+import Conference from "./pages/conference/Conference";
+import Faucet from "./pages/faucet/Faucet";
+import Showcase from "./pages/showcase/Showcase";
+import links from "./data/links";
+import HackerTicketRedirect from "./pages/HackerTicketRedirect";
+import HolidayCollectibleMint from "./pages/holidayCollectibleMint/HolidayCollectibleMint";
+import { WagmiConfig } from "wagmi";
+import wagmiConfig from "./wagmiConfig";
+import { ConnectKitProvider } from "connectkit";
+import Community from "./pages/community/Community";
+import PromtBattleDemo from "./pages/aiPromtBattleDemo/PromptBattleDemo";
 
 function App() {
   return (
     <WagmiConfig config={wagmiConfig}>
       <ConnectKitProvider>
-        <Navbar /> 
+        <Navbar />
         <Routes>
           <Route path={links.sitePaths.home} element={<Home />} />
           <Route path={links.sitePaths.about} element={<About />} />
@@ -31,11 +32,21 @@ function App() {
           <Route path={links.sitePaths.hackathon} element={<Hackathon />} />
           <Route path={links.sitePaths.winners} element={<Winners />} />
           <Route path={links.sitePaths.conference} element={<Conference />} />
-          <Route path={links.sitePaths.hackerTicketRedirect} element={<HackerTicketRedirect />} />
+          <Route
+            path={links.sitePaths.hackerTicketRedirect}
+            element={<HackerTicketRedirect />}
+          />
           <Route path={links.sitePaths.faucet} element={<Faucet />} />
           <Route path={links.sitePaths.showcase} element={<Showcase />} />
-          <Route path={links.sitePaths.holidayCollectible} element={<HolidayCollectibleMint />} />
+          <Route
+            path={links.sitePaths.holidayCollectible}
+            element={<HolidayCollectibleMint />}
+          />
           <Route path={links.sitePaths.community} element={<Community />} />
+          <Route
+            path={links.sitePaths.promptBattleDemo}
+            element={<PromtBattleDemo />}
+          />
         </Routes>
         <Footer />
       </ConnectKitProvider>

src/data/links.ts

@@ -12,7 +12,9 @@ const links = {
         faucet: "/faucet",
         showcase: "/showcase",
         holidayCollectible: "/holiday-collectible-mint",
-        community: "/community"
+        community: "/community",
+        promptBattleDemo: "/prompt-battle-demo",
+        promptBattleDemo2: "/prompt-battle-demo-2",
     },
     forms: {
         volunteerApp: "https://7tjiyjbn20b.typeform.com/ETHChicagoVol",

src/pages/aiPromtBattleDemo/PromptBattleDemo.tsx

@@ -0,0 +1,24 @@
+import { Link } from "react-router-dom";
+import links from "../../data/links";
+
+export default function PromtBattleDemo() {
+  const handlePromptInput = (event: React.ChangeEvent<HTMLInputElement>) => {
+    console.log(event.target.value);
+  };
+
+  return (
+    <div className="flex flex-col">
+      <input
+        type="text"
+        placeholder="Enter your prompt here"
+        onChange={handlePromptInput}
+      />
+      <Link
+        className="bg-primaryBackground text-xl p-4 px-10 rounded-xl text-primaryType"
+        to={links.sitePaths.promptBattleDemo2}
+      >
+        Mint
+      </Link>
+    </div>
+  );
+}