refactoring + upgrade to 13.5

Spyis · Sep 20, 2023 · 0e81672 · 0e81672
1 parent a0507e7
commit 0e81672
Show file tree

Hide file tree

Showing 14 changed files with 96 additions and 152 deletions.
diff --git a/README.md b/README.md
@@ -2,12 +2,11 @@
 
 ## Todos v1.5
 
-- [x] Add some sample prompts
-- [ ] Clean up codebase: remove the multi thing
+- [ ] Add Vercel blob to the project, along with Vercel KV based on Steven's project to save prompt + photo generated (although, don't make prompt unique)
+  - [ ] Add a new page for an automatic OG image when a new one gets generated
+- [ ] Change ratelimiting back to 10 seconds
 
 ## Todos v2
 
-- [ ] React hook form inconsistency
-- [ ] Add a new page for an automatic OG image when a new one gets generated
-- [ ] Add Vercel blob to the project, along with Vercel KV based on Steven's project
+- [ ] React hook form inconsistency – troubleshoot
 - [ ] Add 3-6 quick themes
diff --git a/app/api/generate/route.ts b/app/api/generate/route.ts
@@ -23,7 +23,6 @@ const validateRequest = (request: QrGenerateRequest) => {
 const ratelimit = new Ratelimit({
   redis: kv,
   // Allow 5 requests from the same IP in 1 day.
-  // TODO: Change this back to 10
   limiter: Ratelimit.slidingWindow(100, '1 d'),
 });
 

diff --git a/app/page.tsx b/app/page.tsx
@@ -1,13 +1,12 @@
 import CTA from '@/components/CTA';
 import GradientWrapper from '@/components/GradientWrapper';
 import Hero from '@/components/Hero';
-// import Testimonials from '@/components/Testimonials';
 
 export default function Home() {
   return (
     <>
       <Hero />
-      <GradientWrapper>{/* <Testimonials /> */}</GradientWrapper>
+      <GradientWrapper></GradientWrapper>
       <CTA />
     </>
   );

diff --git a/components/Brand.tsx b/components/Brand.tsx
diff --git a/components/CTA.tsx b/components/CTA.tsx
@@ -4,7 +4,7 @@ const CTA = () => (
       <div className="max-w-2xl mx-auto text-center">
         <h2
           className="text-gray-800 text-3xl font-semibold sm:text-4xl"
-          id="cta"
+          id="oss"
         >
           QrGPT is Proudly Open Source
         </h2>

diff --git a/components/Footer.tsx b/components/Footer.tsx
@@ -1,52 +1,5 @@
 import { V0Logo } from './v0logo';
 
-const socialInfo = [
-  {
-    icon: (
-      <svg
-        className="w-5 h-5 hover:text-gray-500 duration-150"
-        fill="none"
-        viewBox="0 0 48 48"
-      >
-        <g clipPath="url(#clip0_17_80)">
-          <path
-            fill="currentColor"
-            d="M15.1 43.5c18.11 0 28.017-15.006 28.017-28.016 0-.422-.01-.853-.029-1.275A19.998 19.998 0 0048 9.11c-1.795.798-3.7 1.32-5.652 1.546a9.9 9.9 0 004.33-5.445 19.794 19.794 0 01-6.251 2.39 9.86 9.86 0 00-16.788 8.979A27.97 27.97 0 013.346 6.299 9.859 9.859 0 006.393 19.44a9.86 9.86 0 01-4.462-1.228v.122a9.844 9.844 0 007.901 9.656 9.788 9.788 0 01-4.442.169 9.867 9.867 0 009.195 6.843A19.75 19.75 0 010 39.078 27.937 27.937 0 0015.1 43.5z"
-          />
-        </g>
-        <defs>
-          <clipPath id="clip0_17_80">
-            <path fill="#fff" d="M0 0h48v48H0z" />
-          </clipPath>
-        </defs>
-      </svg>
-    ),
-    href: '#',
-  },
-  {
-    icon: (
-      <svg
-        className="w-5 h-5 hover:text-gray-500 duration-150"
-        fill="none"
-        viewBox="0 0 28 28"
-      >
-        <g clipPath="url(#clip0_1213_3074)">
-          <path
-            fill="currentColor"
-            d="M25.927 0H2.067C.924 0 0 .902 0 2.018v23.959C0 27.092.924 28 2.067 28h23.86C27.07 28 28 27.092 28 25.982V2.018C28 .902 27.07 0 25.927 0zM8.307 23.86H4.151V10.495h4.156V23.86zM6.229 8.673a2.407 2.407 0 110-4.812 2.406 2.406 0 010 4.812zM23.86 23.86h-4.15v-6.497c0-1.547-.028-3.543-2.16-3.543-2.16 0-2.49 1.69-2.49 3.434v6.606h-4.144V10.495h3.98v1.826h.056c.552-1.05 1.908-2.16 3.926-2.16 4.206 0 4.982 2.767 4.982 6.366v7.333z"
-          />
-        </g>
-        <defs>
-          <clipPath id="clip0_1213_3074">
-            <path fill="#fff" d="M0 0h28v28H0z" />
-          </clipPath>
-        </defs>
-      </svg>
-    ),
-    href: '#',
-  },
-];
-
 const Footer = () => (
   <footer>
     <div className="custom-screen pt-16">

diff --git a/components/GradientWrapper.tsx b/components/GradientWrapper.tsx
@@ -11,7 +11,7 @@ const GradientWrapper = ({ children, ...props }: any) => (
         background:
           'linear-gradient(202.72deg, rgba(237, 78, 80, 0.05) 14.76%, rgba(152, 103, 240, 0.04) 34.37%, rgba(152, 103, 240, 0) 86.62%)',
       }}
-    ></div>
+    />
     <div className="relative">{children}</div>
   </div>
 );

diff --git a/components/Hero.tsx b/components/Hero.tsx
@@ -25,7 +25,7 @@ export default function Hero() {
               Generate your QR Code
             </NavLink>
             <NavLink
-              href="#cta"
+              href="#oss"
               className="text-gray-700 border hover:bg-gray-50"
               scroll={false}
             >

diff --git a/components/Navbar.tsx b/components/Navbar.tsx
@@ -2,27 +2,30 @@
 
 import Link from 'next/link';
 import { useEffect, useState } from 'react';
-import Brand from './Brand';
 import NavLink from './NavLink';
 import Image from 'next/image';
+import { usePathname, useSearchParams } from 'next/navigation';
 
 const Navbar = () => {
   const [state, setState] = useState(false);
 
   const navigation = [
     // { title: 'Testimonials', path: '#testimonials' },
-    { title: 'Start Now', path: '#cta' },
+    { title: 'Home Page', path: '/' },
   ];
 
+  const pathname = usePathname();
+  const searchParams = useSearchParams();
+
   useEffect(() => {
-    // Close the navbar menu when navigate
+    // Add closing the navbar menu when navigating
     const handleState = () => {
       document.body.classList.remove('overflow-hidden');
       setState(false);
     };
-    // events.on('routeChangeStart', () => handleState());
-    // events.on('hashChangeStart', () => handleState());
-  }, []);
+
+    handleState();
+  }, [pathname, searchParams]);
 
   const handleNavMenu = () => {
     setState(!state);
@@ -105,7 +108,6 @@ const Navbar = () => {
                 </NavLink>
               </li>
             </ul>
-            {/* grid of images 4 in each row */}
           </div>
         </div>
       </nav>

diff --git a/components/Testimonials.tsx b/components/Testimonials.tsx
@@ -2,50 +2,50 @@ const Testimonials = () => {
   const testimonials = [
     {
       avatar:
-        "https://images.unsplash.com/photo-1599566150163-29194dcaad36?ixlib=rb-4.0.3&ixid=MnwxMjA3fDB8MHxwaG90by1wYWdlfHx8fGVufDB8fHx8&auto=format&fit=crop&w=387&q=80",
-      name: "Alex wonderson",
-      title: "Founder of Lyconf",
+        'https://images.unsplash.com/photo-1599566150163-29194dcaad36?ixlib=rb-4.0.3&ixid=MnwxMjA3fDB8MHxwaG90by1wYWdlfHx8fGVufDB8fHx8&auto=format&fit=crop&w=387&q=80',
+      name: 'Alex wonderson',
+      title: 'Founder of Lyconf',
       quote:
-        "As a small business owner, I was doing everything and my workload was increasing. With this startup, I was able to save time so I could focus on the things that matter most: my clients and my family.",
+        'As a small business owner, I was doing everything and my workload was increasing. With this startup, I was able to save time so I could focus on the things that matter most: my clients and my family.',
     },
     {
       avatar:
-        "https://images.unsplash.com/photo-1507003211169-0a1dd7228f2d?ixlib=rb-4.0.3&ixid=MnwxMjA3fDB8MHxwaG90by1wYWdlfHx8fGVufDB8fHx8&auto=format&fit=crop&w=387&q=80",
-      name: "Karim ahmed",
-      title: "DevOps engineer",
+        'https://images.unsplash.com/photo-1507003211169-0a1dd7228f2d?ixlib=rb-4.0.3&ixid=MnwxMjA3fDB8MHxwaG90by1wYWdlfHx8fGVufDB8fHx8&auto=format&fit=crop&w=387&q=80',
+      name: 'Karim ahmed',
+      title: 'DevOps engineer',
       quote:
         "My company's software now is easy to use, saves time and money, and is loved by a lot of users. One customer saved $10k over the course of 3 years and another saves 8 hours per week! Thanks to Blinder.",
     },
     {
       avatar:
-        "https://images.unsplash.com/photo-1534528741775-53994a69daeb?ixlib=rb-4.0.3&ixid=MnwxMjA3fDB8MHxwaG90by1wYWdlfHx8fGVufDB8fHx8&auto=format&fit=crop&w=464&q=80",
-      name: "Lysa stian",
-      title: "System manger",
+        'https://images.unsplash.com/photo-1534528741775-53994a69daeb?ixlib=rb-4.0.3&ixid=MnwxMjA3fDB8MHxwaG90by1wYWdlfHx8fGVufDB8fHx8&auto=format&fit=crop&w=464&q=80',
+      name: 'Lysa stian',
+      title: 'System manger',
       quote:
-        "My business was in a dire situation. I had no idea what to do, and I felt like I was losing hope. Then I found this Startup and everything changed. It helped me create automated sales.",
+        'My business was in a dire situation. I had no idea what to do, and I felt like I was losing hope. Then I found this Startup and everything changed. It helped me create automated sales.',
     },
     {
-      avatar: "https://randomuser.me/api/portraits/women/79.jpg",
-      name: "Angela stian",
-      title: "Product designer",
+      avatar: 'https://randomuser.me/api/portraits/women/79.jpg',
+      name: 'Angela stian',
+      title: 'Product designer',
       quote:
-        "One day, my company was about to go under and I had no idea what to do. I found Blinder and it helped me get my business back on track.Now, my company is flourishing and I see new opportunities.",
+        'One day, my company was about to go under and I had no idea what to do. I found Blinder and it helped me get my business back on track.Now, my company is flourishing and I see new opportunities.',
     },
     {
       avatar:
-        "https://images.unsplash.com/photo-1464863979621-258859e62245?ixlib=rb-4.0.3&ixid=MnwxMjA3fDB8MHxwaG90by1wYWdlfHx8fGVufDB8fHx8&auto=format&fit=crop&w=386&q=80",
-      name: "Jurica koletic",
-      title: "Founder of Let’s code",
+        'https://images.unsplash.com/photo-1464863979621-258859e62245?ixlib=rb-4.0.3&ixid=MnwxMjA3fDB8MHxwaG90by1wYWdlfHx8fGVufDB8fHx8&auto=format&fit=crop&w=386&q=80',
+      name: 'Jurica koletic',
+      title: 'Founder of Let’s code',
       quote:
-        "In these difficult economic times, doing business is tough. Funding is hard to come by and many entrepreneurs are struggling to keep their doors open. but when I found this startup everything changed.",
+        'In these difficult economic times, doing business is tough. Funding is hard to come by and many entrepreneurs are struggling to keep their doors open. but when I found this startup everything changed.',
     },
     {
       avatar:
-        "https://images.unsplash.com/photo-1590038767624-dac5740a997b?ixlib=rb-4.0.3&ixid=MnwxMjA3fDB8MHxwaG90by1wYWdlfHx8fGVufDB8fHx8&auto=format&fit=crop&w=387&q=80",
-      name: "Kavi laron",
-      title: "Full stack engineer",
+        'https://images.unsplash.com/photo-1590038767624-dac5740a997b?ixlib=rb-4.0.3&ixid=MnwxMjA3fDB8MHxwaG90by1wYWdlfHx8fGVufDB8fHx8&auto=format&fit=crop&w=387&q=80',
+      name: 'Kavi laron',
+      title: 'Full stack engineer',
       quote:
-        "We all know how costly it is to find good help. I was faced with this problem when I lost my data entry staff and my business was on the brink of going under. Thankfully, Blinder saved the day.",
+        'We all know how costly it is to find good help. I was faced with this problem when I lost my data entry staff and my business was on the brink of going under. Thankfully, Blinder saved the day.',
     },
   ];
 
@@ -94,7 +94,7 @@ const Testimonials = () => {
 };
 
 const SectionWrapper = ({ children, ...props }: any) => (
-  <section {...props} className={`py-16 ${props.className || ""}`}>
+  <section {...props} className={`py-16 ${props.className || ''}`}>
     {children}
   </section>
 );
-Original file line number
+Diff line change
@@ Expand Up / @@ -11,7 +11,7 @@ const GradientWrapper = ({ children, ...props }: any) => ( @@
             background:
               'linear-gradient(202.72deg, rgba(237, 78, 80, 0.05) 14.76%, rgba(152, 103, 240, 0.04) 34.37%, rgba(152, 103, 240, 0) 86.62%)',
           }}
-        ></div>
+        />
         <div className="relative">{children}</div>
       </div>
     );
@@ Expand Down @@