chore: update app

AngleProtocol · Dec 19, 2024 · 2b926c2 · 2b926c2
1 parent 55b41bd
commit 2b926c2
Showing 1 changed file with 32 additions and 14 deletions.
diff --git a/src/components/composite/Hero.tsx b/src/components/composite/Hero.tsx
@@ -15,6 +15,7 @@ import {
 } from "dappkit";
 import config from "merkl.config";
 import type { PropsWithChildren, ReactNode } from "react";
+import { v4 as uuidv4 } from "uuid";
 
 export type HeroProps = PropsWithChildren<{
   icons?: IconProps[];
@@ -50,24 +51,34 @@ export default function Hero({
       <OverrideTheme mode="light">
         <Group
           className={`${
-            location?.pathname === "/" || location?.pathname === "/opportunities" ? "bg-cover" : "bg-main-6"
+            location?.pathname === "/" ||
+            location?.pathname === "/opportunities"
+              ? "bg-cover"
+              : "bg-main-6"
           } flex-row justify-between bg-no-repeat xl:aspect-auto xl:min-h-[350px] aspect-[1440/300]`}
           style={{
             backgroundImage:
-              location?.pathname === "/" || location?.pathname === "/opportunities"
+              location?.pathname === "/" ||
+              location?.pathname === "/opportunities"
                 ? `url('${config.images.hero}')`
                 : "none",
-          }}>
+          }}
+        >
           <Container>
             <Group className="flex-col h-full py-xl gap-xl lg:gap-xs">
               <Group className="items-center" size="sm">
                 <Button to={navigation?.link ?? "/"} look="soft" bold size="xs">
                   Home
                 </Button>
-                {breadcrumbs?.map(breadcrumb => {
+                {breadcrumbs?.map((breadcrumb) => {
                   if (breadcrumb.component) return <>{breadcrumb.component}</>;
                   return (
-                    <Button key={breadcrumb.link} to={breadcrumb.link} look="soft" size="xs">
+                    <Button
+                      key={breadcrumb.link}
+                      to={breadcrumb.link}
+                      look="soft"
+                      size="xs"
+                    >
                       <Icon remix="RiArrowRightSLine" />
                       {breadcrumb.name}
                     </Button>
@@ -81,14 +92,14 @@ export default function Hero({
                       {!!icons && (
                         <Icons size="lg">
                           {icons?.length > 1
-                            ? icons?.map(icon => (
+                            ? icons?.map((icon) => (
                                 <Icon
                                   className="hidden md:block text-main-12 !w-lg*4 !h-lg*4"
                                   key={`${Object.values(icon)}`}
                                   {...icon}
                                 />
                               ))
-                            : icons?.map(icon => (
+                            : icons?.map((icon) => (
                                 <Icon
                                   className="hidden md:block text-main-12 !w-xl*4 !h-xl*4"
                                   key={`${Object.values(icon)}`}
@@ -111,8 +122,11 @@ export default function Hero({
                   {!!tags && <Group className="mb-lg">{tags}</Group>}
                 </Group>
                 {!!sideDatas && (
-                  <Group className="w-full lg:w-auto lg:flex-col mr-xl*2" size="lg">
-                    {sideDatas.map(data => (
+                  <Group
+                    className="w-full lg:w-auto lg:flex-col mr-xl*2"
+                    size="lg"
+                  >
+                    {sideDatas.map((data) => (
                       <Group key={data.key} className="flex-col" size="xs">
                         <Text size={4} className="!text-main-12">
                           {data.data}
@@ -137,7 +151,11 @@ export default function Hero({
   );
 }
 
-export function defaultHeroSideDatas(count: number, maxApr: number, dailyRewards: number) {
+export function defaultHeroSideDatas(
+  count: number,
+  maxApr: number,
+  dailyRewards: number
+) {
   return [
     !!count && {
       data: (
@@ -146,7 +164,7 @@ export function defaultHeroSideDatas(count: number, maxApr: number, dailyRewards
         </Value>
       ),
       label: "Live opportunities",
-      key: crypto.randomUUID(),
+      key: uuidv4(),
     },
     !!dailyRewards && {
       data: (
@@ -155,7 +173,7 @@ export function defaultHeroSideDatas(count: number, maxApr: number, dailyRewards
         </Value>
       ),
       label: "Daily rewards",
-      key: crypto.randomUUID(),
+      key: uuidv4(),
     },
     !!maxApr && {
       data: (
@@ -164,7 +182,7 @@ export function defaultHeroSideDatas(count: number, maxApr: number, dailyRewards
         </Value>
       ),
       label: "Max APR",
-      key: crypto.randomUUID(),
+      key: uuidv4(),
     },
-  ].filter(data => !!data);
+  ].filter((data) => !!data);
 }