From 7b019da1bb9a8de8ff1d1fe6ba17d1d1d9cf05ee Mon Sep 17 00:00:00 2001
From: Oliver Pan <2216991777@qq.com>
Date: Mon, 24 Jun 2024 00:33:34 -0500
Subject: [PATCH] chore: linting

---
 apps/web/components/graphic-visualizer.tsx    |  7 +-
 .../components/visualizer/contact-form.tsx    | 50 +++++++-------
 .../components/visualizer/hero-section.tsx    | 69 +++++++------------
 .../web/components/visualizer/testimonial.tsx |  7 +-
 4 files changed, 59 insertions(+), 74 deletions(-)

diff --git a/apps/web/components/graphic-visualizer.tsx b/apps/web/components/graphic-visualizer.tsx
index b66b7cc..bd0d912 100644
--- a/apps/web/components/graphic-visualizer.tsx
+++ b/apps/web/components/graphic-visualizer.tsx
@@ -1,11 +1,12 @@
 import SvgGeometry from "@/components/svg/geometry";
-import SvgPattern from "@/components/svg/pattern";
 import SvgLanding from "@/components/svg/landing";
 import SvgNamecard from "@/components/svg/namecard";
-import SvgArtisticFont from "./svg/artistic-font";
-import DataChart from "./svg/data-chart";
+import SvgPattern from "@/components/svg/pattern";
 import { Card } from "@ui/components/card";
 import { cn } from "@ui/lib/utils";
+
+import SvgArtisticFont from "./svg/artistic-font";
+import DataChart from "./svg/data-chart";
 function GraphicVisualizer() {
   const cardStyle = cn(
     "flex aspect-[4/3] items-center justify-center p-6 [&>svg]:rounded overflow-hidden",
diff --git a/apps/web/components/visualizer/contact-form.tsx b/apps/web/components/visualizer/contact-form.tsx
index 35481d8..4443872 100644
--- a/apps/web/components/visualizer/contact-form.tsx
+++ b/apps/web/components/visualizer/contact-form.tsx
@@ -2,26 +2,26 @@
  * v0 by Vercel.
  * @see https://v0.dev/t/0AwQeZp
  */
-import { Label } from "@ui/components/label";
-import { Input } from "@ui/components/input";
-import {
-  SelectValue,
-  SelectTrigger,
-  SelectLabel,
-  SelectItem,
-  SelectGroup,
-  SelectContent,
-  Select,
-} from "@ui/components/select";
-import { Textarea } from "@ui/components/textarea";
 import { Button } from "@ui/components/button";
 import {
-  CardContent,
   Card,
+  CardContent,
+  CardDescription,
   CardHeader,
   CardTitle,
-  CardDescription,
 } from "@ui/components/card";
+import { Input } from "@ui/components/input";
+import { Label } from "@ui/components/label";
+import {
+  Select,
+  SelectContent,
+  SelectGroup,
+  SelectItem,
+  SelectLabel,
+  SelectTrigger,
+  SelectValue,
+} from "@ui/components/select";
+import { Textarea } from "@ui/components/textarea";
 import { cn } from "@ui/lib/utils";
 import { Globe, Mail, Phone } from "lucide-react";
 
@@ -33,39 +33,39 @@ export default function VisContactForm() {
           <div className="mx-auto max-w-xl lg:mx-0 lg:max-w-lg">
             <div className="absolute inset-y-0 left-0 -z-10 w-full overflow-hidden ring-1 ring-gray-900/10 lg:w-1/2">
               <svg
-                className="absolute inset-0 h-full w-full stroke-border [mask-image:radial-gradient(100%_100%_at_top_right,white,transparent)]"
                 aria-hidden="true"
+                className="absolute inset-0 h-full w-full stroke-border [mask-image:radial-gradient(100%_100%_at_top_right,white,transparent)]"
               >
                 <defs>
                   <pattern
+                    height={200}
                     id="83fd4e5a-9d52-42fc-97b6-718e5d7ee527"
+                    patternUnits="userSpaceOnUse"
                     width={200}
-                    height={200}
                     x="100%"
                     y={-1}
-                    patternUnits="userSpaceOnUse"
                   >
                     <path d="M130 200V.5M.5 .5H200" fill="none" />
                   </pattern>
                 </defs>
                 <rect
-                  width="100%"
+                  className="fill-background-accent"
                   height="100%"
                   strokeWidth={0}
-                  className="fill-background-accent"
+                  width="100%"
                 />
                 <svg
+                  className="overflow-visible fill-background/30"
                   x="100%"
                   y={-1}
-                  className="overflow-visible fill-background/30"
                 >
                   <path d="M-470.5 0h201v201h-201Z" strokeWidth={0} />
                 </svg>
                 <rect
-                  width="100%"
+                  fill="url(#83fd4e5a-9d52-42fc-97b6-718e5d7ee527)"
                   height="100%"
                   strokeWidth={0}
-                  fill="url(#83fd4e5a-9d52-42fc-97b6-718e5d7ee527)"
+                  width="100%"
                 />
               </svg>
             </div>
@@ -80,8 +80,8 @@ export default function VisContactForm() {
                 <dt className="flex-none">
                   <span className="sr-only">Address</span>
                   <Globe
-                    className="h-7 w-6 text-[hsl(var(--gray-600))]"
                     aria-hidden="true"
+                    className="h-7 w-6 text-[hsl(var(--gray-600))]"
                   />
                 </dt>
                 <dd>
@@ -94,8 +94,8 @@ export default function VisContactForm() {
                 <dt className="flex-none">
                   <span className="sr-only">Telephone</span>
                   <Phone
-                    className="h-7 w-6 text-[hsl(var(--gray-600))]"
                     aria-hidden="true"
+                    className="h-7 w-6 text-[hsl(var(--gray-600))]"
                   />
                 </dt>
                 <dd>
@@ -111,8 +111,8 @@ export default function VisContactForm() {
                 <dt className="flex-none">
                   <span className="sr-only">Email</span>
                   <Mail
-                    className="h-7 w-6 text-[hsl(var(--gray-600))]"
                     aria-hidden="true"
+                    className="h-7 w-6 text-[hsl(var(--gray-600))]"
                   />
                 </dt>
                 <dd>
diff --git a/apps/web/components/visualizer/hero-section.tsx b/apps/web/components/visualizer/hero-section.tsx
index 0b68fe9..c58c22f 100644
--- a/apps/web/components/visualizer/hero-section.tsx
+++ b/apps/web/components/visualizer/hero-section.tsx
@@ -1,4 +1,4 @@
-import { cn } from "@ui/lib/utils";
+import { cn } from '@ui/lib/utils'
 
 /**
  * v0 by Vercel.
@@ -8,17 +8,17 @@ export default function VisHeroSection() {
   return (
     <section className="relative isolate w-full bg-background py-12 transition-colors md:py-24 lg:py-32 xl:py-40">
       <div
+        aria-hidden
         className={cn(
-          "pointer-events-none absolute bg-gradient-to-b opacity-10 mix-blend-normal blur-[120px] dark:opacity-[0.15]",
-          "left-1/2 top-[10vh] -translate-x-1/2 sm:top-1/2 sm:-translate-y-2/3",
-          "h-[145vh] w-[75vw]",
-          "sm:h-[50vw] sm:w-[50vw]",
-          "sm:w-[33vw] lg:h-[33vw]",
-          "from-[hsl(var(--primary-600))] to-[hsl(var(--accent-800))]",
-          "dark:from-[hsl(var(--primary-600))] dark:to-[hsl(var(--accent-400))]",
-          "transition-all",
+          'pointer-events-none absolute bg-gradient-to-b opacity-10 mix-blend-normal blur-[120px] dark:opacity-[0.15]',
+          'left-1/2 top-[10svh] -translate-x-1/2 sm:top-1/2 sm:-translate-y-2/3',
+          'h-[145svh] w-[75vw]',
+          'sm:h-[50vw] sm:w-[50vw]',
+          'sm:w-[33vw] lg:h-[33vw]',
+          'from-[hsl(var(--primary-600))] to-[hsl(var(--accent-800))]',
+          'dark:from-[hsl(var(--primary-600))] dark:to-[hsl(var(--accent-400))]',
+          'transition-all'
         )}
-        aria-hidden
       />
       <div className="container mx-auto px-4 md:px-6">
         <div className="grid items-center gap-6">
@@ -28,8 +28,7 @@ export default function VisHeroSection() {
                 Discover Our Unique Features
               </h1>
               <p className="mx-auto max-w-[600px] text-[hsl(var(--primary-700))] transition-colors dark:text-[hsl(var(--primary-200))] md:text-xl">
-                Our features are designed to enhance your productivity and
-                streamline your workflow.
+                Our features are designed to enhance your productivity and streamline your workflow.
               </p>
             </div>
             <div className="mx-auto w-full max-w-full space-y-4">
@@ -52,12 +51,9 @@ export default function VisHeroSection() {
                       <path d="M5.45 5.11 2 12v6a2 2 0 0 0 2 2h16a2 2 0 0 0 2-2v-6l-3.45-6.89A2 2 0 0 0 16.76 4H7.24a2 2 0 0 0-1.79 1.11z" />
                     </svg>
                   </div>
-                  <h2 className="mb-2 text-xl font-semibold text-foreground/80">
-                    Smart Inbox
-                  </h2>
+                  <h2 className="mb-2 text-xl font-semibold text-foreground/80">Smart Inbox</h2>
                   <p className="w-4/5 text-muted-foreground sm:w-3/4">
-                    Our Smart Inbox feature helps you manage your emails
-                    efficiently by prioritizing important emails.
+                    Our Smart Inbox feature helps you manage your emails efficiently by prioritizing important emails.
                   </p>
                 </div>
                 <div className="flex flex-col items-center space-y-2 rounded-lg border border-border/50 p-4 transition-all hover:border-border hover:bg-muted/30 hover:shadow">
@@ -79,12 +75,10 @@ export default function VisHeroSection() {
                       <path d="m20 22-5-5" />
                     </svg>
                   </div>
-                  <h2 className="mb-2 text-xl font-semibold text-foreground/80">
-                    Seamless Integration
-                  </h2>
+                  <h2 className="mb-2 text-xl font-semibold text-foreground/80">Seamless Integration</h2>
                   <p className="w-4/5 text-muted-foreground sm:w-3/4">
-                    Seamless Integration allows you to connect with your
-                    favorite apps and services without leaving your inbox.
+                    Seamless Integration allows you to connect with your favorite apps and services without leaving your
+                    inbox.
                   </p>
                 </div>
                 <div className="flex flex-col items-center space-y-2 rounded-lg border border-border/50 p-4 transition-all hover:border-border hover:bg-muted/30 hover:shadow">
@@ -105,12 +99,10 @@ export default function VisHeroSection() {
                       <circle cx="12" cy="12" r="3" />
                     </svg>
                   </div>
-                  <h2 className="mb-2 text-xl font-semibold text-foreground/80">
-                    Advanced Customization
-                  </h2>
+                  <h2 className="mb-2 text-xl font-semibold text-foreground/80">Advanced Customization</h2>
                   <p className="w-4/5 text-muted-foreground sm:w-3/4">
-                    With Advanced Customization, you can personalize your email
-                    client to suit your preferences and work style.
+                    With Advanced Customization, you can personalize your email client to suit your preferences and work
+                    style.
                   </p>
                 </div>
                 <div className="flex flex-col items-center space-y-2 rounded-lg border border-border/50 p-4 transition-all hover:border-border hover:bg-muted/30 hover:shadow">
@@ -131,12 +123,9 @@ export default function VisHeroSection() {
                       <path d="m21 21-4.3-4.3" />
                     </svg>
                   </div>
-                  <h2 className="mb-2 text-xl font-semibold text-foreground/80">
-                    Powerful Search
-                  </h2>
+                  <h2 className="mb-2 text-xl font-semibold text-foreground/80">Powerful Search</h2>
                   <p className="w-4/5 text-muted-foreground sm:w-3/4">
-                    Our Powerful Search feature allows you to find any email,
-                    contact, or file in seconds.
+                    Our Powerful Search feature allows you to find any email, contact, or file in seconds.
                   </p>
                 </div>
                 <div className="flex flex-col items-center space-y-2 rounded-lg border border-border/50 p-4 transition-all hover:border-border hover:bg-muted/30 hover:shadow">
@@ -157,12 +146,9 @@ export default function VisHeroSection() {
                       <path d="M7 11V7a5 5 0 0 1 10 0v4" />
                     </svg>
                   </div>
-                  <h2 className="mb-2 text-xl font-semibold text-foreground/80">
-                    Reliable Security
-                  </h2>
+                  <h2 className="mb-2 text-xl font-semibold text-foreground/80">Reliable Security</h2>
                   <p className="w-4/5 text-muted-foreground sm:w-3/4">
-                    With Reliable Security, your data is always safe and
-                    protected.
+                    With Reliable Security, your data is always safe and protected.
                   </p>
                 </div>
                 <div className="flex flex-col items-center space-y-2 rounded-lg border border-border/50 p-4 transition-all hover:border-border hover:bg-muted/30 hover:shadow">
@@ -184,12 +170,9 @@ export default function VisHeroSection() {
                       <path d="m20 22-5-5" />
                     </svg>
                   </div>
-                  <h2 className="mb-2 text-xl font-semibold text-foreground/80">
-                    Easy Collaboration
-                  </h2>
+                  <h2 className="mb-2 text-xl font-semibold text-foreground/80">Easy Collaboration</h2>
                   <p className="w-4/5 text-muted-foreground sm:w-3/4">
-                    Easy Collaboration allows you to share and edit documents
-                    with your team in real time.
+                    Easy Collaboration allows you to share and edit documents with your team in real time.
                   </p>
                 </div>
               </div>
@@ -198,5 +181,5 @@ export default function VisHeroSection() {
         </div>
       </div>
     </section>
-  );
+  )
 }
diff --git a/apps/web/components/visualizer/testimonial.tsx b/apps/web/components/visualizer/testimonial.tsx
index d8eb8b1..ed57369 100644
--- a/apps/web/components/visualizer/testimonial.tsx
+++ b/apps/web/components/visualizer/testimonial.tsx
@@ -1,4 +1,5 @@
 import { cn } from "@ui/lib/utils";
+
 import PeakVentureLogo from "../svg/peak-venture-logo";
 
 export default function VisTestimonials() {
@@ -7,14 +8,14 @@ export default function VisTestimonials() {
       <div className="mx-auto max-w-7xl sm:px-6 lg:px-8">
         <div className="relative overflow-hidden border border-border/10 bg-muted px-6 py-20 shadow-xl shadow-primary/5 sm:rounded-3xl sm:px-10 sm:py-24 md:px-12 lg:px-20">
           <img
+            alt=""
             className="absolute inset-0 h-full w-full object-cover brightness-150 saturate-0"
             src="https://images.unsplash.com/photo-1469474968028-56623f02e42e?ixlib=rb-4.0.3&ixid=M3wxMjA3fDB8MHxwaG90by1wYWdlfHx8fGVufDB8fHx8fA%3D%3D&auto=format&fit=crop&w=1216&q=80"
-            alt=""
           />
           <div className="absolute inset-0 bg-muted/90 mix-blend-screen dark:mix-blend-multiply" />
           <div
-            className="absolute -left-80 -top-56 transform-gpu blur-3xl"
             aria-hidden="true"
+            className="absolute -left-80 -top-56 transform-gpu blur-3xl"
           >
             <div
               className={cn(
@@ -29,8 +30,8 @@ export default function VisTestimonials() {
             />
           </div>
           <div
-            className="hidden md:absolute md:bottom-16 md:left-[50rem] md:block md:transform-gpu md:blur-3xl"
             aria-hidden="true"
+            className="hidden md:absolute md:bottom-16 md:left-[50rem] md:block md:transform-gpu md:blur-3xl"
           >
             <div
               className={cn(