fix lint

Author: alissacrane-cb

apps/web/app/(base-org)/developers/verifications/page.tsx

@@ -8,7 +8,7 @@ import { Customers } from 'apps/web/src/components/Developers/Verifications/Cust
 import { InfoCards } from 'apps/web/src/components/Developers/Verifications/InfoCards';
 import { ValueProps } from 'apps/web/src/components/Developers/Verifications/ValueProps';
 import verification from 'apps/web/src/components/Developers/Verifications/verification.svg';
-import Image from 'next/image';
+import Image, { StaticImageData } from 'next/image';
 
 export default async function Verifications() {
   return (
@@ -18,7 +18,7 @@ export default async function Verifications() {
         <div className="flex flex-col gap-2 pt-20 md:items-center">
           <div className="flex items-center gap-2 pb-6">
             <Image
-              src={verification}
+              src={verification as StaticImageData}
               alt="verification"
               width={32}
               height={32}

apps/web/src/components/Developers/Shared/Marquee.tsx

@@ -1,7 +1,7 @@
 import { cn } from 'base-ui/utils/cn';
 import { ComponentPropsWithoutRef } from 'react';
 
-interface MarqueeProps extends ComponentPropsWithoutRef<'div'> {
+export type MarqueeProps = ComponentPropsWithoutRef<'div'> & {
   /**
    * Optional CSS class name to apply custom styles
    */
@@ -30,7 +30,7 @@ interface MarqueeProps extends ComponentPropsWithoutRef<'div'> {
    * @default 4
    */
   repeat?: number;
-}
+};
 
 export function Marquee({
   className,
@@ -55,9 +55,9 @@ export function Marquee({
     >
       {Array(repeat)
         .fill(0)
-        .map((_, i) => (
+        .map(() => (
           <div
-            key={i}
+            key={crypto.randomUUID()}
             className={cn('flex shrink-0 justify-around [gap:var(--gap)]', {
               'animate-marquee flex-row': !vertical,
               'animate-marquee-vertical flex-col': vertical,

apps/web/src/components/Developers/Shared/ValueProp.tsx

@@ -2,7 +2,7 @@ import Title from 'apps/web/src/components/base-org/typography/Title';
 import { TitleLevel } from 'apps/web/src/components/base-org/typography/Title/types';
 import Image, { type StaticImageData } from 'next/image';
 
-type ValuePropProps = {
+export type ValuePropProps = {
   title: string;
   description: string;
   icon: StaticImageData;

apps/web/src/components/Developers/Verifications/InfoCards.tsx

@@ -2,18 +2,26 @@ import { Card } from 'apps/web/src/components/Developers/Shared/Card';
 import key from 'apps/web/src/components/Developers/Verifications/key.svg';
 import identityCard from 'apps/web/src/components/Developers/Verifications/identityCard.svg';
 import complianceProduct from 'apps/web/src/components/Developers/Verifications/complianceProduct.svg';
-import Image from 'next/image';
+import Image, { StaticImageData } from 'next/image';
 
 const INFO_CARDS = [
   {
-    icon: <Image src={key} alt="key" width={32} height={32} className="h-8 w-8" />,
+    icon: (
+      <Image src={key as StaticImageData} alt="key" width={32} height={32} className="h-8 w-8" />
+    ),
     title: 'Access control',
     description:
       'Implement granular access control using verified Coinbase attestations. Perfect for gating features, content, or entire applications.',
   },
   {
     icon: (
-      <Image src={identityCard} alt="identityCard" width={32} height={32} className="h-8 w-8" />
+      <Image
+        src={identityCard as StaticImageData}
+        alt="identityCard"
+        width={32}
+        height={32}
+        className="h-8 w-8"
+      />
     ),
     title: 'Identity verification',
     description:
@@ -22,7 +30,7 @@ const INFO_CARDS = [
   {
     icon: (
       <Image
-        src={complianceProduct}
+        src={complianceProduct as StaticImageData}
         alt="complianceProduct"
         width={32}
         height={32}

apps/web/src/components/Developers/Verifications/ValueProps.tsx

@@ -35,7 +35,7 @@ export function ValueProps() {
         </Title>
       </div>
       <div className="flex w-full flex-col gap-3">
-        {VALUE_PROPS.map((item) => {
+        {VALUE_PROPS.map((item: ValuePropProps) => {
           return (
             <ValueProp
               key={item.title}