From 5ef8f91570c1df9766a25be27ececb75a0bff22f Mon Sep 17 00:00:00 2001
From: Paul Wackerow <54227730+wackerow@users.noreply.github.com>
Date: Mon, 15 Dec 2025 15:49:32 -0300
Subject: [PATCH] feat: remove fusaka banner and hero image

---
 app/[locale]/page.tsx                         |   5 +-
 .../Banners/FusakaBanner/FusakaCountdown.tsx  | 178 ------------------
 src/components/Banners/FusakaBanner/index.tsx |  44 -----
 3 files changed, 1 insertion(+), 226 deletions(-)
 delete mode 100644 src/components/Banners/FusakaBanner/FusakaCountdown.tsx
 delete mode 100644 src/components/Banners/FusakaBanner/index.tsx

diff --git a/app/[locale]/page.tsx b/app/[locale]/page.tsx
index ec1513556dd..6c2d67056f9 100644
--- a/app/[locale]/page.tsx
+++ b/app/[locale]/page.tsx
@@ -12,7 +12,6 @@ import type {
 import { CodeExample } from "@/lib/interfaces"
 
 import ActivityStats from "@/components/ActivityStats"
-import FusakaBanner from "@/components/Banners/FusakaBanner"
 import { ChevronNext } from "@/components/Chevron"
 import HomeHero from "@/components/Hero/HomeHero"
 import BentoCard from "@/components/Homepage/BentoCard"
@@ -96,7 +95,6 @@ import { fetchAttestantPosts } from "@/lib/api/fetchPosts"
 import { fetchRSS } from "@/lib/api/fetchRSS"
 import { fetchTotalValueLocked } from "@/lib/api/fetchTotalValueLocked"
 import EventFallback from "@/public/images/events/event-placeholder.png"
-import RoadmapFusakaImage from "@/public/images/roadmap/roadmap-fusaka.png"
 
 const BentoCardSwiper = dynamic(
   () => import("@/components/Homepage/BentoCardSwiper"),
@@ -437,8 +435,7 @@ const Page = async ({ params }: { params: PageParams }) => {
     <>
       <IndexPageJsonLD locale={locale} />
       <MainArticle className="flex w-full flex-col items-center" dir={dir}>
-        <FusakaBanner />
-        <HomeHero image={RoadmapFusakaImage} alt="Fusaka Hero" />
+        <HomeHero />
         <div className="w-full space-y-32 px-4 md:mx-6 lg:space-y-48">
           <div className="my-20 grid w-full grid-cols-2 gap-x-4 gap-y-8 md:grid-cols-4 md:gap-x-10">
             {subHeroCTAs.map(
diff --git a/src/components/Banners/FusakaBanner/FusakaCountdown.tsx b/src/components/Banners/FusakaBanner/FusakaCountdown.tsx
deleted file mode 100644
index 48d1de09042..00000000000
--- a/src/components/Banners/FusakaBanner/FusakaCountdown.tsx
+++ /dev/null
@@ -1,178 +0,0 @@
-"use client"
-
-import { useEffect, useState } from "react"
-import humanizeDuration from "humanize-duration"
-import { useLocale } from "next-intl"
-
-const fusakaDate = new Date("2025-12-03T21:49:11.000Z")
-const fusakaDateTime = fusakaDate.getTime()
-const SECONDS = 1000
-
-type TimeUnits = {
-  days: number
-  hours: number
-  minutes: number
-  seconds: number | null
-  isExpired: boolean
-}
-
-type TimeLabels = {
-  days: string
-  hours: string
-  minutes: string
-  seconds: string
-}
-
-const getTimeUnits = (): TimeUnits => {
-  const now = Date.now()
-  const timeLeft = fusakaDateTime - now
-
-  if (timeLeft < 0) {
-    return {
-      days: 0,
-      hours: 0,
-      minutes: 0,
-      seconds: null,
-      isExpired: true,
-    }
-  }
-
-  const days = Math.floor(timeLeft / (24 * 60 * 60 * 1000))
-  const hours = Math.floor(
-    (timeLeft % (24 * 60 * 60 * 1000)) / (60 * 60 * 1000)
-  )
-  const minutes = Math.floor((timeLeft % (60 * 60 * 1000)) / (60 * 1000))
-  const seconds =
-    days === 0 ? Math.floor((timeLeft % (60 * 1000)) / 1000) : null
-
-  return {
-    days,
-    hours,
-    minutes,
-    seconds,
-    isExpired: false,
-  }
-}
-
-const getTimeLabels = (locale: string): TimeLabels => {
-  const baseOptions = {
-    round: true,
-    language: locale,
-  }
-
-  try {
-    // Use humanizeDuration to get translated unit names (plural forms)
-    // Format 2 units of each type to get plural forms
-    const twoDays = humanizeDuration(2 * 24 * 60 * 60 * 1000, {
-      ...baseOptions,
-      units: ["d"],
-    })
-    const twoHours = humanizeDuration(2 * 60 * 60 * 1000, {
-      ...baseOptions,
-      units: ["h"],
-    })
-    const twoMinutes = humanizeDuration(2 * 60 * 1000, {
-      ...baseOptions,
-      units: ["m"],
-    })
-    const twoSeconds = humanizeDuration(2 * 1000, {
-      ...baseOptions,
-      units: ["s"],
-    })
-
-    // Extract unit names (remove the number)
-    const extractUnit = (str: string): string => {
-      // Remove leading numbers, whitespace, and any separators
-      // Handles formats like "1 day", "1d", "1 jour", etc.
-      return str
-        .replace(/^\d+\s*/, "") // Remove leading number and space
-        .replace(/^\d+/, "") // Remove any remaining leading number (for formats like "1d")
-        .trim()
-        .split(/\s+/)[0] // Take first word in case of multiple words
-    }
-
-    return {
-      days: extractUnit(twoDays),
-      hours: extractUnit(twoHours),
-      minutes: extractUnit(twoMinutes),
-      seconds: extractUnit(twoSeconds),
-    }
-  } catch {
-    // Fallback to English if translation fails
-    return {
-      days: "days",
-      hours: "hours",
-      minutes: "minutes",
-      seconds: "seconds",
-    }
-  }
-}
-
-const FusakaCountdown = ({ liveNowText }: { liveNowText: string }) => {
-  const locale = useLocale()
-  const [timeUnits, setTimeUnits] = useState<TimeUnits>(() => getTimeUnits())
-  const [labels, setLabels] = useState<TimeLabels>(() => getTimeLabels(locale))
-
-  useEffect(() => {
-    setLabels(getTimeLabels(locale))
-  }, [locale])
-
-  useEffect(() => {
-    const updateCountdown = () => {
-      setTimeUnits(getTimeUnits())
-    }
-
-    const interval = setInterval(updateCountdown, SECONDS)
-
-    return () => clearInterval(interval)
-  }, [])
-
-  if (timeUnits.isExpired) {
-    return (
-      <p className="text-lg font-extrabold text-white md:text-2xl">
-        {liveNowText}
-      </p>
-    )
-  }
-
-  return (
-    <div className="flex items-center justify-center gap-2 md:gap-4">
-      {timeUnits.days > 0 && (
-        <div className="flex flex-col items-center">
-          <p className="text-lg font-extrabold text-white md:text-3xl">
-            {String(timeUnits.days).padStart(2, "0")}
-          </p>
-          <p className="text-xs font-bold uppercase text-white">
-            {labels.days}
-          </p>
-        </div>
-      )}
-      <div className="flex flex-col items-center">
-        <p className="text-lg font-extrabold text-white md:text-3xl">
-          {String(timeUnits.hours).padStart(2, "0")}
-        </p>
-        <p className="text-xs font-bold uppercase text-white">{labels.hours}</p>
-      </div>
-      <div className="flex flex-col items-center">
-        <p className="text-lg font-extrabold text-white md:text-3xl">
-          {String(timeUnits.minutes).padStart(2, "0")}
-        </p>
-        <p className="text-xs font-bold uppercase text-white">
-          {labels.minutes}
-        </p>
-      </div>
-      {timeUnits.seconds !== null && (
-        <div className="flex flex-col items-center">
-          <p className="text-lg font-extrabold text-white md:text-3xl">
-            {String(timeUnits.seconds).padStart(2, "0")}
-          </p>
-          <p className="text-xs font-bold uppercase text-white">
-            {labels.seconds}
-          </p>
-        </div>
-      )}
-    </div>
-  )
-}
-
-export default FusakaCountdown
diff --git a/src/components/Banners/FusakaBanner/index.tsx b/src/components/Banners/FusakaBanner/index.tsx
deleted file mode 100644
index 17d1b1f0cad..00000000000
--- a/src/components/Banners/FusakaBanner/index.tsx
+++ /dev/null
@@ -1,44 +0,0 @@
-import { getLocale, getTranslations } from "next-intl/server"
-
-import { LinkBox, LinkOverlay } from "@/components/ui/link-box"
-
-import FusakaCountdown from "./FusakaCountdown"
-
-const FusakaBanner = async () => {
-  const locale = getLocale()
-  const t = await getTranslations({ locale, namespace: "page-index" })
-
-  return (
-    <LinkBox className="w-full bg-[#333369] px-4 py-3 text-center text-white md:p-4 md:px-8">
-      <div className="mx-auto flex max-w-7xl flex-col items-center justify-center gap-3 md:flex-row md:gap-16">
-        <div className="flex flex-col items-center justify-center gap-1">
-          <p className="text-2xl font-extrabold uppercase !leading-none">
-            FUSAKA
-          </p>
-          <p className="text-xs font-bold uppercase text-purple-100 md:text-sm">
-            {t("page-index-fusaka-network-upgrade")}
-          </p>
-        </div>
-        <p className="max-w-md text-xs leading-relaxed text-white md:text-sm">
-          {t("page-index-fusaka-description")}{" "}
-          <LinkOverlay
-            href="/roadmap/fusaka"
-            className="whitespace-nowrap text-white hover:text-purple-300"
-          >
-            {t("page-index-fusaka-read-more")}
-          </LinkOverlay>
-        </p>
-        <div className="flex flex-col items-center justify-center gap-2 md:gap-1">
-          <p className="hidden text-xs font-bold uppercase leading-tight text-gray-200 md:block">
-            {t.rich("page-index-fusaka-going-live-in", {
-              br: () => <br className="md:hidden" />,
-            })}
-          </p>
-          <FusakaCountdown liveNowText={t("page-index-fusaka-live-now")} />
-        </div>
-      </div>
-    </LinkBox>
-  )
-}
-
-export default FusakaBanner