@devvistatech/devvista-kit 0.0.12 → 0.0.13

package/README.md

@@ -6,6 +6,15 @@
 - Initialize the project with the prebuilt template: `npx devvista-kit`
 - Start the development server: `npm run dev`
 
+Now after install, the steps to set up a repo:
+$ rm -rf .git
+$ git init
+$ cat .gitignore
+node_modules/
+$ git add .
+git remote add origin https://github.com/DevVistaTech/reponame.git
+git push -f -u origin main
+
 ### Updating the npm Package with the Latest Version
 
 - Increment the package version: `npm version patch  # e.g., to 0.1.8`
@@ -13,3 +22,34 @@
 - Commit the changes: `git commit -m "Increment version to 0.1.8"`
 - Push to the remote repository: `git push origin main`
 - Update projects with the new version: `npm install --save @devvistatech/devvista-kit@latest && npx devvista-kit`
+
+
+### Instructions to Set Up Environment VariablesGOOGLE_ANALYTICS_CLIENT_EMAIL & GOOGLE_ANALYTICS_PRIVATE_KEY Go to console.cloud.google.com.
+Navigate to IAM & Admin > Service Accounts.
+Click + Create Service Account, name it (e.g., "devvistatest"), and create.
+Click the service account, go to Keys > Add Key > Create New Key, select JSON, and download.
+Open the JSON file:client_email is the email (e.g., devvistatest@devvista-test.iam.gserviceaccount.com).
+private_key is the key (e.g., -----BEGIN PRIVATE KEY-----\n[long string]\n-----END PRIVATE KEY-----), copy it exactly with all \n newlines.
+
+GOOGLE_ANALYTICS_PROPERTY_ID
+Go to analytics.google.com.
+Select "Gabriel Labbate" account, then "DevVista" property.
+Go to Admin > Property Settings > Property Details; note the Property ID (e.g., 479012946).
+
+NEXT_PUBLIC_GA_MEASUREMENT_ID
+In analytics.google.com, select "Gabriel Labbate" account and "DevVista" property.
+Go to Admin > Data Streams, select your stream, and note the Measurement ID (e.g., G-VX3LV8FCS8).
+
+Add Service Account to PermissionsIn analytics.google.com, select "Gabriel Labbate" account and "DevVista" property.
+Go to Admin > Account Access Management.
+Click +, enter devvistatest@devvista-test.iam.gserviceaccount.com, assign Viewer role, and click Add. Wait 5-10 minutes for propagation.
+
+Save VariablesAdd to your .env file:
+
+GOOGLE_ANALYTICS_CLIENT_EMAIL=devvistatest@devvista-test.iam.gserviceaccount.com
+GOOGLE_ANALYTICS_PRIVATE_KEY=-----BEGIN PRIVATE KEY-----\nMIIEvwIBADANBgkqhkikVXFFwjmA==\n-----END PRIVATE KEY----- //This is an example
+GOOGLE_ANALYTICS_PROPERTY_ID=47934342 //This is an example
+NEXT_PUBLIC_GA_MEASUREMENT_ID=G-VX3SDFDF //This is an example
+
+Troubleshooting StepsRestart Application: After saving the .env file, stop your Next.js app (e.g., Ctrl+C) and restart it (e.g., npm run dev). Clear the .next folder and rebuild if needed.
+

package/app/ClientLayout.tsx

@@ -0,0 +1,66 @@
+"use client";
+
+import { useEffect, useState } from "react";
+import { ThemeProvider } from "@/components/theme-provider";
+import { AuthProvider } from "@/lib/auth/auth-context";
+import Navbar from "@/components/navBars/navbar";
+import Banner from "@/components/addOns/functional/banner/Banner";
+import { Toaster } from "@/components/other/toaster";
+import Footer from "@/components/footers/footer";
+import IconBubble from "@/components/addOns/non-functional/IconBubble";
+import { useAuth } from "@clerk/nextjs";
+import Spinner from "@/components/addOns/non-functional/spinner";
+
+export default function ClientLayout({ children }: { children: React.ReactNode }) {
+  const [hasError, setHasError] = useState(false);
+  const { isLoaded } = useAuth();
+
+  useEffect(() => {
+    setHasError(false);
+    const handleError = (event: ErrorEvent) => {
+      console.error("Global error:", {
+        message: event.message,
+        filename: event.filename,
+        lineno: event.lineno,
+        colno: event.colno,
+        error: event.error,
+      });
+    };
+    window.addEventListener("error", handleError);
+    return () => window.removeEventListener("error", handleError);
+  }, []);
+
+  if (!isLoaded) {
+    console.log("ClientLayout: Waiting for auth to load");
+    return <Spinner />;
+  }
+
+  if (hasError) {
+    console.log("ClientLayout: Rendering error state");
+    return (
+      <div className="min-h-screen flex flex-col items-center justify-center bg-background text-foreground">
+        <h1 className="text-2xl font-bold">Something went wrong</h1>
+        <p className="mt-2 text-gray-600">Please refresh the page or try again later.</p>
+      </div>
+    );
+  }
+
+  console.log("ClientLayout: Rendering main layout");
+  return (
+    <ThemeProvider
+      attribute="class"
+      defaultTheme="dark"
+      enableSystem={false}
+      disableTransitionOnChange
+    >
+      <AuthProvider>
+        <Navbar />
+        <Banner />
+        <main className="min-h-screen w-full">{children}</main>
+        <Toaster />
+        <Footer />
+        <IconBubble />
+      </AuthProvider>
+    </ThemeProvider>
+  );
+}

package/app/about/page.tsx

@@ -1,48 +1,23 @@
 "use client";
 
 import { motion } from "framer-motion";
-import { useRef, useState, useEffect } from "react";
-import { BioSection } from "@/components/addOns/functional/BioEditor";
+import { useEffect, useState } from "react";
+import { BioSection } from "@/components/addOns/functional/bioSections/BioEditor";
 import Spinner from "@/components/addOns/non-functional/spinner";
-import { useStrapiAuth } from "@/lib/auth-context";
-import { useAuth, useUser } from "@clerk/nextjs";
+import { useStrapiAuth } from "@/lib/auth/auth-context";
+import { useUser } from "@clerk/nextjs";
 import Testimonials from "@/components/addOns/non-functional/Testimonials";
 import { ABOUT_PAGE } from "../../lib/constants/about";
 
-interface BioContent {
-  id: number;
-  documentId: string;
-  title: string;
-  description: string;
-  bio: boolean;
-  about: boolean;
-  image?: { url: string; id: number };
-  createdAt: string;
-}
-
 export default function AboutPage() {
-  const { user, authLoading, checkSession } = useStrapiAuth();
-  const { getToken } = useAuth();
-  const { user: clerkUser, isSignedIn } = useUser();
+  const { user, authLoading } = useStrapiAuth();
+  const { isSignedIn } = useUser();
   const [isMobile, setIsMobile] = useState(false);
-  const [isLoading, setIsLoading] = useState(false);
-  const [error, setError] = useState<string | null>(null);
-  const [bioImageUrl, setBioImageUrl] = useState<string | null>(null);
-  const [bioText, setBioText] = useState<string | null>(null);
-  const [bioTitle, setBioTitle] = useState<string | null>(null);
-  const [isEditModalOpen, setIsEditModalOpen] = useState(false);
 
   useEffect(() => {
     window.scrollTo(0, 0);
   }, []);
 
-  useEffect(() => {
-    const event = new CustomEvent("modalStateChange", {
-      detail: { isOpen: isEditModalOpen },
-    });
-    window.dispatchEvent(event);
-  }, [isEditModalOpen]);
-
   useEffect(() => {
     const debounce = (fn: () => void, delay: number) => {
       let timeout: NodeJS.Timeout;
@@ -51,241 +26,29 @@ export default function AboutPage() {
         timeout = setTimeout(fn, delay);
       };
     };
-
     const checkMobile = debounce(() => {
       setIsMobile(window.innerWidth < 768);
     }, 100);
-
     checkMobile();
     window.addEventListener("resize", checkMobile);
     return () => window.removeEventListener("resize", checkMobile);
   }, []);
 
-  useEffect(() => {
-    const handleLogin = () => checkSession();
-    const handleLogout = () => checkSession();
-    window.addEventListener("user-login", handleLogin);
-    window.removeEventListener("user-logout", handleLogout);
-    return () => {
-      window.removeEventListener("user-login", handleLogin);
-      window.removeEventListener("user-logout", handleLogout);
-    };
-  }, [checkSession]);
-
-  useEffect(() => {
-    const fetchBioData = async () => {
-      setIsLoading(true);
-      try {
-        const response = await fetch("/api/bio", {
-          headers: { "Content-Type": "application/json" },
-        });
-        if (!response.ok) {
-          const errorData = await response.json();
-          throw new Error(errorData.error || ABOUT_PAGE.ERRORS.FETCH_BIO_FAILED);
-        }
-        const result = await response.json();
-        if (result.data) {
-          const bioData: BioContent = result.data;
-          setBioImageUrl(bioData.image?.url || null);
-          setBioText(bioData.description || null);
-          setBioTitle(bioData.title || null);
-        } else {
-          throw new Error(ABOUT_PAGE.ERRORS.BIO_NOT_FOUND);
-        }
-      } catch (err) {
-        console.error("Fetch Error:", err);
-        setError(err instanceof Error ? err.message : ABOUT_PAGE.ERRORS.FETCH_BIO_ERROR);
-      } finally {
-        setIsLoading(false);
-      }
-    };
-    fetchBioData();
-  }, []);
-
-  const handlePatchSubmit = async (
-    e: React.FormEvent,
-    formTitle: string,
-    formDescription: string,
-    formImage: File | null,
-    onSuccess: () => void
-  ) => {
-    e.preventDefault();
-    if (!user?.businessAdminId) {
-      console.error("No user or businessAdminId:", { user, businessAdminId: user?.businessAdminId });
-      setError(ABOUT_PAGE.ERRORS.UNAUTHORIZED_UPDATE);
-      return;
-    }
-
-    try {
-      const formData = new FormData();
-      if (formTitle && formTitle !== bioTitle) {
-        formData.append("title", formTitle);
-      }
-      if (formDescription && formDescription !== bioText) {
-        formData.append("description", formDescription);
-      }
-      if (formImage) {
-        if (!["image/jpeg", "image/png", "image/gif"].includes(formImage.type)) {
-          throw new Error(ABOUT_PAGE.ERRORS.INVALID_IMAGE_TYPE);
-        }
-        formData.append("image", formImage);
-      }
-
-      if (!formData.has("title") && !formData.has("description") && !formData.has("image")) {
-        onSuccess();
-        return;
-      }
-
-      const token = await getToken();
-      if (!token) {
-        throw new Error(ABOUT_PAGE.ERRORS.NO_AUTH_TOKEN);
-      }
-
-      const response = await fetch("/api/bio", {
-        method: "PUT",
-        headers: {
-          Authorization: `Bearer ${token}`,
-        },
-        body: formData,
-      });
-
-      const result = await response.json();
-      if (!response.ok) {
-        throw new Error(result.error || ABOUT_PAGE.ERRORS.UPDATE_BIO_FAILED);
-      }
-
-      if (result.data) {
-        const bioData: BioContent = result.data;
-        setBioImageUrl(bioData.image?.url || null);
-        setBioText(bioData.description || null);
-        setBioTitle(bioData.title || null);
-        setError(null);
-        onSuccess();
-      }
-    } catch (err) {
-      console.error("Update Error:", err);
-      setError(err instanceof Error ? err.message : ABOUT_PAGE.ERRORS.UPDATE_BIO_ERROR);
-    }
-  };
-
-  const sectionVariants = {
-    hidden: { opacity: 0, y: 20 },
-    visible: {
-      opacity: 1,
-      y: 0,
-      transition: { duration: isMobile ? 0.3 : 0.5, ease: "easeOut" },
-    },
-  };
-
-  const cardVariants = {
-    hidden: { opacity: 0, y: 20 },
-    visible: {
-      opacity: 1,
-      y: 0,
-      transition: { duration: isMobile ? 0.3 : 0.5, ease: "easeOut" },
-    },
-    hover: {
-      scale: isMobile ? 1 : 1.05,
-      transition: { duration: 0.2, ease: "easeOut" },
-    },
-  };
-
-  const itemVariants = {
-    hidden: { opacity: 0, y: 10 },
-    visible: {
-      opacity: 1,
-      y: 0,
-      transition: { duration: isMobile ? 0.3 : 0.5, ease: "easeOut" },
-    },
-  };
-
-  if (authLoading || isLoading) {
+  if (authLoading) {
     return <Spinner />;
   }
 
   return (
-    <div className="min-h-screen w-full bg-[#F7F7F7] relative flex flex-col">
-      <style jsx>{`
-        @import url("https://fonts.googleapis.com/css2?family=Inter:wght@400;600;700;800;900&display=swap");
-
-        :root {
-          --jubilee: #F47C7C;
-          --natural-white: #F7F7F7;
-          --caviar: #2D2D2D;
-          --storm-cloud: #4A636E;
-          --exuberant-blue: #FF69B4;
-          --modern-purple: #D946EF;
-        }
-
-        * {
-          font-family: "Inter", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif;
-        }
-
-        .gradient-text {
-          background: linear-gradient(135deg, var(--exuberant-blue), var(--jubilee), var(--modern-purple));
-          -webkit-background-clip: text;
-          background-clip: text;
-          color: transparent;
-          text-shadow: 0 1px 2px rgba(0, 0, 0, 0.1);
-        }
-
-        .glassmorphism {
-          background: rgba(255, 255, 255, 0.1);
-          backdrop-filter: blur(12px);
-          -webkit-backdrop-filter: blur(12px);
-          border: 1px solid rgba(255, 255, 255, 0.2);
-          box-shadow: 0 8px 24px rgba(0, 0, 0, 0.08);
-          transition: transform 0.2s ease-out, box-shadow 0.2s ease-out;
-        }
-
-        @supports not (backdrop-filter: blur(12px)) {
-          .glassmorphism {
-            background: rgba(255, 255, 255, 0.3);
-          }
-        }
-
-        .glassmorphism:hover {
-          box-shadow: 0 12px 32px rgba(0, 0, 0, 0.12);
-        }
-
-        @media (max-width: 768px) {
-          .glassmorphism {
-            padding: 1rem;
-          }
-          .gradient-text {
-            font-size: 2.5rem;
-          }
-        }
-
-        .line-clamp-8 {
-          display: -webkit-box;
-          -webkit-line-clamp: 8;
-          -webkit-box-orient: vertical;
-          overflow: hidden;
-        }
-      `}</style>
-      <div className="w-full pt-20 lg:pt-40 flex-grow relative z-10 container-padding bg-white">
+    <div className="min-h-screen w-full bg-natural-white relative flex flex-col font-inter">
+      <div className="w-full pt-20 lg:pt-40 flex-grow relative z-10 px-4 sm:px-6 lg:px-8 bg-white">
         <motion.h1
           initial={{ opacity: 0, y: -50 }}
           animate={{ opacity: 1, y: 0 }}
-          className="text-4xl sm:text-5xl lg:text-7xl font-black mb-20 lg:mb-20 gradient-text text-center uppercase drop-shadow-lg main-heading pt-36 sm:pt-32"
+          className="text-4xl sm:text-5xl lg:text-7xl font-black mb-20 lg:mb-20 gradient-text text-center uppercase drop-shadow-lg pt-36 sm:pt-32"
         >
           {ABOUT_PAGE.UI.MAIN_HEADING}
         </motion.h1>
-        <BioSection
-          user={user}
-          authLoading={authLoading}
-          bioImageUrl={bioImageUrl}
-          bioText={bioText}
-          bioTitle={bioTitle}
-          error={error}
-          isLoading={isLoading}
-          setBioImageUrl={setBioImageUrl}
-          setBioText={setBioText}
-          setBioTitle={setBioTitle}
-          setError={setError}
-          handlePatchSubmit={handlePatchSubmit}
-        />
+        <BioSection user={user} isSignedIn={isSignedIn} />
         <Testimonials isMobile={isMobile} />
         <div className="px-20 py-52 sm:py-52 pt-32">
           <h1 className="text-2xl sm:text-3xl font-extrabold pb-12 uppercase">

package/app/adRequest/page.tsx

@@ -1,4 +1,4 @@
-'use client';
+"use client";
 
 import { useState, useEffect } from 'react';
 import { Card, CardContent, CardDescription, CardHeader, CardTitle } from '@/components/other/card';
@@ -9,25 +9,13 @@ import { Select, SelectContent, SelectItem, SelectTrigger, SelectValue } from '@
 import { Textarea } from '@/components/other/textarea';
 import { Badge } from '@/components/other/badge';
 import { Separator } from '@/components/other/separator';
-import { AlertCircle, Calendar, CreditCard, Facebook, Heart, Send, Star } from 'lucide-react';
-import { Alert, AlertDescription } from '@/components/other/alert';
+import { AlertCircle, Calendar, CreditCard, Heart, Send, Star } from 'lucide-react';
 import { useAuth, useUser } from '@clerk/nextjs';
-import { useStrapiAuth } from '@/lib/auth-context';
+import { useStrapiAuth } from '@/lib/auth/auth-context';
+import { isAdminUser } from '@/lib/auth/auth-utils';
 import Spinner from '@/components/addOns/non-functional/spinner';
-import { AD_REQUEST_PAGE } from '../../lib/constants/adRequest';
-
-interface AdRequest {
-  id: number;
-  documentId: string;
-  platform: string;
-  adType: string;
-  description: string;
-  timestamp: string;
-  userId: string;
-  credits: number;
-  lastResetDate: string;
-  nextResetDate: string;
-}
+import { AD_REQUEST_PAGE } from '@/lib/constants/adRequest';
+import type { AdRequest } from '@/lib/types';
 
 export default function AdRequest() {
   const [creditsData, setCreditsData] = useState<{
@@ -48,11 +36,50 @@ export default function AdRequest() {
   const [isLoading, setIsLoading] = useState(false);
   const [error, setError] = useState<string | null>(null);
   const [showConfirmPopup, setShowConfirmPopup] = useState(false);
+  const [isAdmin, setIsAdmin] = useState(false);
   const { user, authLoading, checkSession } = useStrapiAuth();
-  const { getToken } = useAuth();
-  const { isSignedIn, user: clerkUser } = useUser();
+  const { getToken, isSignedIn } = useAuth();
+  const { user: clerkUser } = useUser();
 
-  const isAdmin = isSignedIn && !!user?.businessAdminId;
+  useEffect(() => {
+    let isMounted = true;
+    const checkAdmin = async (retries = 3, delay = 1000) => {
+      if (!isSignedIn || !user?.authId) {
+      
+        if (isMounted) setIsAdmin(false);
+        return;
+      }
+
+      for (let attempt = 1; attempt <= retries; attempt++) {
+        try {
+          const adminStatus = await isAdminUser(isSignedIn, user);
+          if (isMounted) {
+          
+            setIsAdmin(adminStatus);
+            setError(null);
+          }
+          return;
+        } catch (error) {
+          console.error("AdRequest: Admin check failed:", {
+            error: error instanceof Error ? error.message : "Unknown error",
+            attempt,
+            timestamp: new Date().toISOString(),
+          });
+          if (attempt < retries) {
+        
+            await new Promise(resolve => setTimeout(resolve, delay));
+          } else if (isMounted) {
+            setIsAdmin(false);
+            setError(AD_REQUEST_PAGE.ERRORS.ADMIN_CHECK_FAILED);
+          }
+        }
+      }
+    };
+    checkAdmin();
+    return () => {
+      isMounted = false;
+    };
+  }, [isSignedIn, user]);
 
   useEffect(() => {
     window.scrollTo(0, 0);
@@ -70,10 +97,16 @@ export default function AdRequest() {
   }, [checkSession]);
 
   const fetchData = async () => {
-    if (!isSignedIn || !clerkUser?.id) return;
+    if (!isSignedIn || !clerkUser?.id) {
+      setError(AD_REQUEST_PAGE.ERRORS.NOT_SIGNED_IN);
+      return;
+    }
     setIsLoading(true);
     try {
       const token = await getToken();
+      if (!token) {
+        throw new Error(AD_REQUEST_PAGE.ERRORS.NO_AUTH_TOKEN);
+      }
       const response = await fetch('/api/adRequest', {
         headers: {
           'Content-Type': 'application/json',
@@ -89,7 +122,7 @@ export default function AdRequest() {
       setRequests(
         data.adRequests.map((req: AdRequest) => ({
           ...req,
-          timestamp: new Date(req.timestamp),
+          timestamp: new Date(req.timestamp).toISOString(),
         }))
       );
       setCreditsData({
@@ -98,6 +131,10 @@ export default function AdRequest() {
         nextResetDate: data.credits.nextResetDate,
       });
     } catch (err) {
+      console.error("AdRequest: Fetch error:", {
+        error: err instanceof Error ? err.message : "Unknown error",
+        timestamp: new Date().toISOString(),
+      });
       setError(err instanceof Error ? err.message : AD_REQUEST_PAGE.ERRORS.UNKNOWN_ERROR);
     } finally {
       setIsLoading(false);
@@ -113,6 +150,14 @@ export default function AdRequest() {
   const handleSubmit = async (e: React.FormEvent) => {
     e.preventDefault();
     if (!isSignedIn) {
+      console.error("AdRequest: Unauthorized submit attempt", {
+        isSignedIn,
+        authId: user?.authId,
+        businessAdminId: user?.businessAdminId,
+        userRole: user?.userRole,
+        businessOwner: user?.businessOwner ?? null,
+        timestamp: new Date().toISOString(),
+      });
       setError(AD_REQUEST_PAGE.ERRORS.NOT_SIGNED_IN);
       return;
     }
@@ -132,6 +177,9 @@ export default function AdRequest() {
     setIsSubmitting(true);
     try {
       const token = await getToken();
+      if (!token) {
+        throw new Error(AD_REQUEST_PAGE.ERRORS.NO_AUTH_TOKEN);
+      }
       const response = await fetch('/api/adRequest', {
         method: 'POST',
         headers: {
@@ -149,6 +197,11 @@ export default function AdRequest() {
 
       if (!response.ok) {
         const errorData = await response.json();
+        console.error("AdRequest: Submit failed", {
+          status: response.status,
+          errorData,
+          timestamp: new Date().toISOString(),
+        });
         throw new Error(errorData.error || AD_REQUEST_PAGE.ERRORS.SUBMIT_AD_REQUEST_FAILED);
       }
 
@@ -156,7 +209,7 @@ export default function AdRequest() {
       setRequests(
         data.adRequests.map((req: AdRequest) => ({
           ...req,
-          timestamp: new Date(req.timestamp),
+          timestamp: new Date(req.timestamp).toISOString(),
         }))
       );
       setCreditsData({
@@ -170,6 +223,10 @@ export default function AdRequest() {
       setShowSuccess(true);
       setTimeout(() => setShowSuccess(false), 3000);
     } catch (err) {
+      console.error("AdRequest: Submit error:", {
+        error: err instanceof Error ? err.message : "Unknown error",
+        timestamp: new Date().toISOString(),
+      });
       setError(err instanceof Error ? err.message : AD_REQUEST_PAGE.ERRORS.UNKNOWN_ERROR);
     } finally {
       setIsSubmitting(false);
@@ -182,6 +239,14 @@ export default function AdRequest() {
 
   const resetCredits = async () => {
     if (!isAdmin) {
+      console.error("AdRequest: Unauthorized reset attempt", {
+        isSignedIn,
+        authId: user?.authId,
+        businessAdminId: user?.businessAdminId,
+        userRole: user?.userRole,
+        businessOwner: user?.businessOwner ?? null,
+        timestamp: new Date().toISOString(),
+      });
       setError(AD_REQUEST_PAGE.ERRORS.UNAUTHORIZED_RESET);
       return;
     }
@@ -189,6 +254,9 @@ export default function AdRequest() {
     try {
       setIsLoading(true);
       const token = await getToken();
+      if (!token) {
+        throw new Error(AD_REQUEST_PAGE.ERRORS.NO_AUTH_TOKEN);
+      }
       const response = await fetch('/api/adRequest', {
         method: 'PUT',
         headers: {
@@ -205,11 +273,20 @@ export default function AdRequest() {
 
       if (!response.ok) {
         const errorData = await response.json();
+        console.error("AdRequest: Reset credits failed", {
+          status: response.status,
+          errorData,
+          timestamp: new Date().toISOString(),
+        });
         throw new Error(errorData.error || AD_REQUEST_PAGE.ERRORS.RESET_CREDITS_FAILED);
       }
 
       await fetchData();
     } catch (err) {
+      console.error("AdRequest: Reset credits error:", {
+        error: err instanceof Error ? err.message : "Unknown error",
+        timestamp: new Date().toISOString(),
+      });
       setError(err instanceof Error ? err.message : AD_REQUEST_PAGE.ERRORS.UNKNOWN_ERROR);
     } finally {
       setIsLoading(false);
@@ -519,7 +596,6 @@ export default function AdRequest() {
                             >
                               {request.platform === 'facebook' ? AD_REQUEST_PAGE.UI.FACEBOOK_BADGE : AD_REQUEST_PAGE.UI.TIKTOK_BADGE}
                             </Badge>
-
                             <span className="text-xs text-gray-400">
                               {new Date(request.timestamp).toLocaleTimeString()}
                             </span>