@thorprovider/blocks 0.1.3 → 2.0.0

package/src/blocks/e-commerce/storefront-hero/storefront-hero-6.tsx

@@ -1,205 +0,0 @@
-'use client'
-
-import { useEffect, useState } from 'react'
-import { ArrowRight, Sparkles } from 'lucide-react'
-
-import { Badge } from '../../../ui/badge'
-import { Button } from '../../../ui/button'
-import { Card, CardContent } from '../../../ui/card'
-
-export interface HeroDeal {
-  /** Unique identifier for the deal. */
-  id: string
-  /** Deal name shown in the badge, e.g. "Summer Sale". */
-  title: string
-  /** Discount label, e.g. "50% OFF". */
-  discount: string
-  /** Countdown text, e.g. "2d : 15h : 30m". */
-  endTime: string
-}
-
-export interface HeroCategory {
-  /** Unique identifier for the category. */
-  id: string
-  /** Category name. */
-  name: string
-  /** Product count label, e.g. "2.5k+". */
-  count: string
-  /** Image URL for the category card. */
-  image: string
-  /** Accessible image description (falls back to `name`). */
-  imageAlt?: string
-  /** Optional link destination; renders the card arrow as a link when present. */
-  href?: string
-}
-
-export interface StorefrontHero6Props {
-  /** Small pill shown above the headline. */
-  badge?: string
-  /** Main headline. */
-  title: string
-  /** Accent line rendered on a new line after the headline. */
-  subtitle?: string
-  /** Supporting paragraph under the headline. */
-  description: string
-  /** Deals rendered in the sticky auto-rotating top bar. */
-  deals: HeroDeal[]
-  /** Product categories rendered as a card grid. */
-  categories: HeroCategory[]
-  /** Milliseconds between auto-rotating deals (default 3000). */
-  rotationInterval?: number
-  /** Label shown before the deal countdown, e.g. "Ends in". */
-  endsInLabel?: string
-  /** Label of the shop-now button in the deals bar. */
-  shopNowLabel?: string
-  /** Unit appended to each category product count. */
-  productsLabel?: string
-  /** Prefix for the category arrow accessible label. */
-  viewLabel?: string
-  /** Called when the shop-now button in the deals bar is clicked. */
-  onShopNow?: (deal: HeroDeal) => void
-  /** Called when a category arrow is clicked (categories without `href`). */
-  onCategoryClick?: (category: HeroCategory) => void
-}
-
-function StorefrontHero6({
-  badge,
-  title,
-  subtitle,
-  description,
-  deals,
-  categories,
-  rotationInterval = 3000,
-  endsInLabel = 'Termina en',
-  shopNowLabel = 'Comprar ahora',
-  productsLabel = 'productos',
-  viewLabel = 'Ver',
-  onShopNow,
-  onCategoryClick,
-}: StorefrontHero6Props) {
-  const [currentDeal, setCurrentDeal] = useState(0)
-
-  useEffect(() => {
-    if (deals.length <= 1) return
-
-    const interval = setInterval(() => {
-      setCurrentDeal(prev => (prev + 1) % deals.length)
-    }, rotationInterval)
-
-    return () => clearInterval(interval)
-  }, [deals.length, rotationInterval])
-
-  const deal = deals[currentDeal]
-
-  return (
-    <div className='relative'>
-      {deal && (
-        <header className='bg-primary text-primary-foreground sticky top-0 z-50 shadow-md'>
-          <div className='mx-auto w-full max-w-7xl px-4 py-2 sm:px-6 lg:px-8'>
-            <div className='flex items-center justify-center'>
-              <div className='flex w-full max-w-3xl items-center justify-center gap-4'>
-                <div className='flex items-center gap-2'>
-                  <Badge
-                    variant='secondary'
-                    className='bg-primary-foreground text-primary px-2.5 py-0.5 font-semibold'
-                  >
-                    {deal.title}
-                  </Badge>
-                  <span className='font-semibold'>{deal.discount}</span>
-                </div>
-                <span className='hidden sm:inline'>
-                  {endsInLabel} {deal.endTime}
-                </span>
-                <Button
-                  variant='link'
-                  size='sm'
-                  className='text-primary-foreground hover:text-primary-foreground/80 ml-auto h-8 cursor-pointer px-3 text-xs'
-                  onClick={onShopNow ? () => onShopNow(deal) : undefined}
-                >
-                  {shopNowLabel} <ArrowRight />
-                </Button>
-              </div>
-            </div>
-          </div>
-        </header>
-      )}
-
-      <main className='mx-auto w-full max-w-7xl px-4 py-8 sm:px-6 lg:px-8'>
-        <div className='mb-12 text-center'>
-          {badge && (
-            <div className='relative inline-block'>
-              <Badge
-                variant='outline'
-                className='mb-4 flex h-auto items-center gap-2 rounded-full px-3.5 py-1.5 text-sm font-normal'
-              >
-                <Sparkles className='size-4' aria-hidden='true' />
-                {badge}
-              </Badge>
-            </div>
-          )}
-          <h1 className='text-4xl font-bold tracking-tight text-balance sm:text-5xl md:text-6xl'>
-            {title}
-            {subtitle && (
-              <>
-                <br />
-                {subtitle}
-              </>
-            )}
-          </h1>
-          <p className='text-muted-foreground mx-auto mt-4 max-w-2xl text-lg'>{description}</p>
-        </div>
-
-        <div className='grid gap-4 sm:grid-cols-2 lg:grid-cols-4'>
-          {categories.map(category => (
-            <Card key={category.id} className='group relative overflow-hidden py-0 transition-all duration-500'>
-              <img
-                src={category.image || undefined}
-                alt={category.imageAlt ?? category.name}
-                className='aspect-4/5 size-full object-cover grayscale transition-all duration-500 hover:grayscale-0'
-                width={400}
-                height={500}
-                loading='lazy'
-              />
-              <CardContent className='absolute inset-x-0 bottom-0 p-4'>
-                <div className='mt-1 flex items-center justify-between'>
-                  <div>
-                    <h2 className='text-background dark:text-foreground text-lg font-medium'>{category.name}</h2>
-                    <span className='text-background/80 dark:text-foreground/80 text-sm'>
-                      {category.count} {productsLabel}
-                    </span>
-                  </div>
-                  {category.href ? (
-                    <Button
-                      variant='secondary'
-                      size='icon'
-                      className='h-9 w-9 cursor-pointer rounded-full backdrop-blur-xs'
-                      aria-label={`${viewLabel} ${category.name}`}
-                      asChild
-                    >
-                      <a href={category.href}>
-                        <ArrowRight />
-                      </a>
-                    </Button>
-                  ) : (
-                    <Button
-                      variant='secondary'
-                      size='icon'
-                      className='h-9 w-9 cursor-pointer rounded-full backdrop-blur-xs'
-                      aria-label={`${viewLabel} ${category.name}`}
-                      onClick={onCategoryClick ? () => onCategoryClick(category) : undefined}
-                    >
-                      <ArrowRight />
-                    </Button>
-                  )}
-                </div>
-              </CardContent>
-            </Card>
-          ))}
-        </div>
-      </main>
-    </div>
-  )
-}
-
-export { StorefrontHero6 }
-export default StorefrontHero6

package/src/blocks/marketing/features/feature-1.tsx

@@ -1,97 +0,0 @@
-import { Badge } from '../../../ui/badge'
-import { Button } from '../../../ui/button'
-import { Card, CardContent } from '../../../ui/card'
-import { ArrowRight } from 'lucide-react'
-import type { LucideIcon } from 'lucide-react'
-
-export interface Feature1Item {
-  id: string
-  title: string
-  description: string
-  icon: LucideIcon
-}
-
-export interface Feature1Props {
-  items: Feature1Item[]
-  badge?: string
-  title?: string
-  description?: string
-  learnMoreLabel?: string
-  ctaLabel?: string
-  onCtaClick?: () => void
-  onLearnMore?: (item: Feature1Item) => void
-}
-
-export function Feature1({
-  items,
-  badge,
-  title,
-  description,
-  learnMoreLabel,
-  ctaLabel,
-  onCtaClick,
-  onLearnMore,
-}: Feature1Props) {
-  return (
-    <section className='mx-auto w-full max-w-7xl px-4 py-12 sm:px-6 md:py-16 lg:px-8'>
-      {(badge || title || description) && (
-        <header className='mx-auto mb-12 max-w-2xl text-center'>
-          {badge && (
-            <Badge variant='secondary' className='h-auto mb-4 rounded-full px-4 py-1 font-medium'>
-              {badge}
-            </Badge>
-          )}
-          {title && (
-            <h2 className='mb-4 text-3xl font-bold tracking-tight sm:text-4xl'>{title}</h2>
-          )}
-          {description && (
-            <p className='text-muted-foreground text-pretty'>{description}</p>
-          )}
-        </header>
-      )}
-
-      <div className='grid gap-4 sm:grid-cols-2 sm:gap-6 md:grid-cols-3'>
-        {items.map(feature => (
-          <article key={feature.id} className='group'>
-            <Card className='relative h-full overflow-hidden transition-all hover:shadow-md'>
-              <CardContent className='px-6'>
-                <div className='bg-secondary text-secondary-foreground mb-4 inline-flex size-12 items-center justify-center rounded-xl'>
-                  <feature.icon className='size-5' aria-hidden='true' />
-                </div>
-                <h3 className='mb-2 text-lg font-semibold'>{feature.title}</h3>
-                <p className='text-muted-foreground mb-4 text-sm'>{feature.description}</p>
-
-                {learnMoreLabel && (
-                  <Button
-                    variant='link'
-                    size='sm'
-                    className='h-8 px-3 text-xs text-muted-foreground hover:text-foreground h-auto cursor-pointer !p-0 text-sm'
-                    onClick={onLearnMore ? () => onLearnMore(feature) : undefined}
-                  >
-                    {learnMoreLabel}
-                    <ArrowRight />
-                  </Button>
-                )}
-              </CardContent>
-            </Card>
-          </article>
-        ))}
-      </div>
-
-      {ctaLabel && (
-        <div className='mt-12 text-center'>
-          <Button
-            size='lg'
-            className='h-10 cursor-pointer rounded-lg !px-8'
-            onClick={onCtaClick}
-          >
-            {ctaLabel}
-            <ArrowRight />
-          </Button>
-        </div>
-      )}
-    </section>
-  )
-}
-
-export default Feature1

package/src/blocks/marketing/features/feature-2.tsx

@@ -1,82 +0,0 @@
-import { cn } from '../../../lib/utils'
-import type { LucideIcon } from 'lucide-react'
-
-export interface Feature2Item {
-  id: string
-  title: string
-  description: string
-  icon: LucideIcon
-}
-
-export interface Feature2Props {
-  items: Feature2Item[]
-  title?: string
-  description?: string
-  image?: { src: string; alt: string }
-  className?: string
-}
-
-export function Feature2({
-  items,
-  title,
-  description,
-  image,
-  className,
-}: Feature2Props) {
-  return (
-    <section
-      className={cn('mx-auto w-full max-w-7xl px-4 py-12 sm:px-6 md:py-16 lg:px-8', className)}
-    >
-      <div className='grid gap-12 lg:grid-cols-2 lg:gap-16'>
-        <div className='flex flex-col gap-10'>
-          {(title || description) && (
-            <header className='flex flex-col gap-4'>
-              {title && (
-                <h2 className='text-3xl font-bold tracking-tight text-balance sm:text-4xl lg:text-5xl'>
-                  {title}
-                </h2>
-              )}
-              {description && (
-                <p className='text-muted-foreground text-base text-pretty md:text-lg'>
-                  {description}
-                </p>
-              )}
-            </header>
-          )}
-
-          <div className='grid gap-6 sm:grid-cols-2 sm:gap-8'>
-            {items.map(item => (
-              <div key={item.id} className='group flex flex-col items-start gap-3 rounded-lg'>
-                <div className='bg-secondary text-secondary-foreground inline-flex size-10 items-center justify-center rounded-full'>
-                  <item.icon className='size-5' aria-hidden='true' />
-                </div>
-                <div className='flex flex-col gap-1.5'>
-                  <h3 className='text-foreground text-base font-semibold md:text-lg'>{item.title}</h3>
-                  <p className='text-muted-foreground text-sm text-balance'>{item.description}</p>
-                </div>
-              </div>
-            ))}
-          </div>
-        </div>
-
-        {image && (
-          <div className='relative'>
-            <div className='bg-muted relative z-10 overflow-hidden rounded-lg shadow-sm transition-all duration-300 hover:shadow-md'>
-              <div className='aspect-[4/3] w-full'>
-                <img
-                  src={image.src || undefined}
-                  alt={image.alt}
-                  className='size-full object-cover grayscale'
-                  loading='lazy'
-                  decoding='async'
-                />
-              </div>
-            </div>
-          </div>
-        )}
-      </div>
-    </section>
-  )
-}
-
-export default Feature2

package/src/blocks/marketing/footers/footer-section-1.test.tsx

@@ -1,117 +0,0 @@
-import type { ReactElement, ReactNode } from 'react'
-import { renderToStaticMarkup } from 'react-dom/server'
-import { describe, expect, it, vi } from 'vitest'
-import { FooterSection1 } from './footer-section-1'
-
-const base = {
-  brandName: 'ElectroCuba',
-  linkColumns: [],
-}
-
-type SubmitHandler = (event: { preventDefault: () => void }) => void
-
-function findForm(node: ReactNode): ReactElement<{ onSubmit?: SubmitHandler }> | undefined {
-  if (node === null || node === undefined || typeof node !== 'object') return undefined
-  if (Array.isArray(node)) {
-    for (const child of node) {
-      const found = findForm(child)
-      if (found) return found
-    }
-    return undefined
-  }
-  const element = node as ReactElement<{ children?: ReactNode }>
-  if (element.type === 'form') return element as ReactElement<{ onSubmit?: SubmitHandler }>
-  return findForm(element.props?.children)
-}
-
-describe('FooterSection1 — optional brand accent', () => {
-  it('renders the brand name unchanged when no accent is supplied', () => {
-    const html = renderToStaticMarkup(<FooterSection1 {...base} />)
-    expect(html).toContain('>ElectroCuba</span>')
-    expect(html).not.toContain('text-brand-promo')
-  })
-
-  it('accents a matched trailing segment without duplicating the brand name', () => {
-    const html = renderToStaticMarkup(
-      <FooterSection1 {...base} brandAccent={{ text: 'Cuba', className: 'text-brand-promo' }} />,
-    )
-    expect(html).toContain('Electro<span class="text-brand-promo">Cuba</span>')
-    expect(html.match(/Electro/g)).toHaveLength(1)
-    expect(html.match(/Cuba/g)).toHaveLength(1)
-  })
-
-  it('accents the full brand name when the accent covers all of it', () => {
-    const html = renderToStaticMarkup(
-      <FooterSection1 {...base} brandAccent={{ text: 'ElectroCuba', className: 'text-brand-promo' }} />,
-    )
-    expect(html).toContain('<span class="text-brand-promo">ElectroCuba</span>')
-  })
-
-  it('does not accent when the segment is not a trailing match', () => {
-    const html = renderToStaticMarkup(<FooterSection1 {...base} brandAccent={{ text: 'Electro' }} />)
-    expect(html).toContain('>ElectroCuba</span>')
-  })
-})
-
-describe('FooterSection1 — newsletter requires a submit callback', () => {
-  it('renders no form, input, or button when the newsletter has no onSubmit', () => {
-    const html = renderToStaticMarkup(
-      <FooterSection1 {...base} newsletter={{ buttonLabel: 'Suscribirse', placeholder: 'tu@correo.com' }} />,
-    )
-    expect(html).not.toContain('<form')
-    expect(html).not.toContain('<input')
-    expect(html).not.toContain('<button')
-  })
-
-  it('renders the interactive form when a submit handler is supplied', () => {
-    const html = renderToStaticMarkup(
-      <FooterSection1 {...base} newsletter={{ buttonLabel: 'Suscribirse', onSubmit: () => {} }} />,
-    )
-    expect(html).toContain('<form')
-    expect(html).toContain('<input')
-    expect(html).toContain('<button')
-    expect(html).toContain('Suscribirse')
-  })
-
-  it('retains the supplied submit handler and forwards the email', () => {
-    const onSubmit = vi.fn()
-    const tree = FooterSection1({
-      ...base,
-      newsletter: { buttonLabel: 'Suscribirse', onSubmit },
-    })
-    const form = findForm(tree)
-    expect(form).toBeDefined()
-
-    vi.stubGlobal(
-      'FormData',
-      class {
-        get() {
-          return 'shopper@example.com'
-        }
-      },
-    )
-    try {
-      form?.props.onSubmit?.({ preventDefault: () => {} })
-    } finally {
-      vi.unstubAllGlobals()
-    }
-
-    expect(onSubmit).toHaveBeenCalledWith('shopper@example.com')
-  })
-})
-
-describe('FooterSection1 — optional outer surface className', () => {
-  it('keeps the default surface when className is omitted', () => {
-    const html = renderToStaticMarkup(<FooterSection1 {...base} />)
-    expect(html).toContain('bg-secondary')
-  })
-
-  it('merges a branded surface onto the footer and drops the default background', () => {
-    const html = renderToStaticMarkup(
-      <FooterSection1 {...base} className='bg-brand-nav text-brand-nav-foreground' />,
-    )
-    expect(html).toContain('bg-brand-nav')
-    expect(html).toContain('text-brand-nav-foreground')
-    expect(html).not.toContain('bg-secondary')
-  })
-})

package/src/blocks/marketing/footers/footer-section-1.tsx

@@ -1,178 +0,0 @@
-'use client'
-
-import { Input } from '../../../ui/input'
-import { Button } from '../../../ui/button'
-import { ArrowRight } from 'lucide-react'
-import { cn } from '../../../lib/utils'
-
-export interface FooterLink {
-  label: string
-  href?: string
-}
-
-export interface FooterLinkColumn {
-  title: string
-  links: FooterLink[]
-}
-
-export interface FooterNewsletter {
-  placeholder?: string
-  buttonLabel: string
-  /**
-   * Submit handler. The interactive form (input + submit button) renders only
-   * when this is supplied. A newsletter without `onSubmit` renders no form,
-   * input, or button — never a fake form.
-   */
-  onSubmit?: (email: string) => void
-}
-
-export interface BrandAccent {
-  /** Trailing segment of `brandName` to render with the accent styling. */
-  text: string
-  /** Consumer-supplied classes for the accent span (e.g. a brand color token). */
-  className?: string
-}
-
-export interface FooterSection1Props {
-  brandName: string
-  /**
-   * Optional accent for a trailing segment of `brandName` (e.g. the "Cuba" in
-   * "ElectroCuba"). When omitted, or when `text` is not a trailing segment of
-   * `brandName`, the brand name renders unchanged.
-   */
-  brandAccent?: BrandAccent
-  brandDescription?: string
-  linkColumns: FooterLinkColumn[]
-  newsletter?: FooterNewsletter
-  /**
-   * Consumer-supplied classes merged onto the outer `<footer>` as the final
-   * argument, so a semantic surface such as `bg-brand-nav
-   * text-brand-nav-foreground` overrides the default `bg-secondary`. Purely
-   * presentational: no layout, structure, or behavior changes.
-   */
-  className?: string
-}
-
-export function FooterSection1({
-  brandName,
-  brandAccent,
-  brandDescription,
-  linkColumns,
-  newsletter,
-  className,
-}: FooterSection1Props) {
-  const accentText = brandAccent?.text ?? ''
-  const hasAccent = accentText.length > 0 && brandName.endsWith(accentText)
-  const baseName = hasAccent ? brandName.slice(0, brandName.length - accentText.length) : brandName
-  const newsletterSubmit = newsletter?.onSubmit
-
-  return (
-    <footer
-      className={cn('bg-secondary w-full py-16', className)}
-      aria-label='Pie de página'
-    >
-      <div className='mx-auto w-full max-w-7xl px-4 sm:px-6 lg:px-8'>
-        <div className='grid grid-cols-1 gap-8 lg:grid-cols-12'>
-          {/* Left Section */}
-          <div className='me-8 md:col-span-5'>
-            <div className='mb-6 flex items-center gap-2'>
-              <svg width='32' height='32' viewBox='0 0 32 32' fill='none' xmlns='http://www.w3.org/2000/svg'>
-                <path
-                  d='M26 24.75C26.4142 24.75 26.75 24.4142 26.75 24C26.75 23.5858 26.4142 23.25 26 23.25V24.75ZM26 23.25H11V24.75H26V23.25ZM8.75 21V15H7.25V21H8.75ZM11 23.25C9.75736 23.25 8.75 22.2426 8.75 21H7.25C7.25 23.0711 8.92893 24.75 11 24.75V23.25Z'
-                  fill='currentColor'
-                />
-                <path
-                  d='M1.5 3.25C1.08579 3.25 0.75 3.58579 0.75 4C0.75 4.41421 1.08579 4.75 1.5 4.75V3.25ZM1.5 4.75H6V3.25H1.5V4.75ZM7.25 6V21H8.75V6H7.25ZM6 4.75C6.69036 4.75 7.25 5.30964 7.25 6H8.75C8.75 4.48122 7.51878 3.25 6 3.25V4.75Z'
-                  fill='currentColor'
-                />
-                <path
-                  d='M22 21.75C22.4142 21.75 22.75 21.4142 22.75 21C22.75 20.5858 22.4142 20.25 22 20.25V21.75ZM22 20.25H11V21.75H22V20.25ZM8.75 18V12H7.25V18H8.75ZM11 20.25C9.75736 20.25 8.75 19.2426 8.75 18H7.25C7.25 20.0711 8.92893 21.75 11 21.75V20.25Z'
-                  fill='currentColor'
-                />
-                <path
-                  d='M27.2057 19.754C27.0654 20.1438 26.6357 20.346 26.246 20.2057C25.8562 20.0654 25.654 19.6357 25.7943 19.246L27.2057 19.754ZM30.0361 9.67744L29.3305 9.4234L29.3305 9.4234L30.0361 9.67744ZM25.7943 19.246L29.3305 9.4234L30.7418 9.93148L27.2057 19.754L25.7943 19.246ZM28.1543 7.75L8 7.75V6.25L28.1543 6.25V7.75ZM29.3305 9.4234C29.6237 8.60882 29.0201 7.75 28.1543 7.75V6.25C30.059 6.25 31.3869 8.13941 30.7418 9.93148L29.3305 9.4234Z'
-                  fill='currentColor'
-                />
-                <path
-                  d='M13.5 21.75C13.0858 21.75 12.75 21.4142 12.75 21C12.75 20.5858 13.0858 20.25 13.5 20.25V21.75ZM26.7111 19.009L27.4174 19.2613L27.4174 19.2613L26.7111 19.009ZM13.5 20.25H23.8858V21.75H13.5V20.25ZM26.0048 18.7568L27.7937 13.7477L29.2063 14.2523L27.4174 19.2613L26.0048 18.7568ZM23.8858 20.25C24.8367 20.25 25.6849 19.6522 26.0048 18.7568L27.4174 19.2613C26.8843 20.7537 25.4706 21.75 23.8858 21.75V20.25Z'
-                  fill='currentColor'
-                />
-                <path d='M21.1694 10.5806L14.5651 17.1849' stroke='currentColor' />
-                <path d='M22.1694 14.5806L18.5632 18.1868' stroke='currentColor' />
-                <circle cx='13.1' cy='26.1' r='1.7' stroke='currentColor' />
-                <circle cx='22.1' cy='26.1' r='1.7' stroke='currentColor' />
-              </svg>
-              <span className='text-xl font-semibold'>
-                {baseName}
-                {hasAccent ? <span className={brandAccent?.className}>{accentText}</span> : null}
-              </span>
-            </div>
-            {brandDescription && (
-              <p className='text-muted-foreground mb-8 max-w-sm text-sm leading-relaxed text-balance'>
-                {brandDescription}
-              </p>
-            )}
-            {newsletter && newsletterSubmit ? (
-              <form
-                className='relative'
-                onSubmit={e => {
-                  e.preventDefault()
-                  const email = new FormData(e.currentTarget).get('email')
-                  if (typeof email === 'string') {
-                    newsletterSubmit(email)
-                  }
-                }}
-              >
-                <Input
-                  type='email'
-                  name='email'
-                  placeholder={newsletter.placeholder}
-                  className='border-muted-foreground/20 bg-background/80 h-12 pe-32'
-                  aria-label='Correo electrónico'
-                />
-                <Button
-                  type='submit'
-                  variant='default'
-                  className='absolute end-1 top-1 h-10 cursor-pointer px-4'
-                  aria-label='Suscribirse a la newsletter'
-                >
-                  {newsletter.buttonLabel}
-                  <ArrowRight />
-                </Button>
-              </form>
-            ) : null}
-          </div>
-
-          {/* Right Section */}
-          <div className='md:col-span-7'>
-            <div className='grid grid-cols-1 gap-8 sm:grid-cols-2 md:grid-cols-3'>
-              {linkColumns.map(column => (
-                <div key={column.title}>
-                  <h3 className='mb-4 text-lg font-medium'>{column.title}</h3>
-                  <ul className='flex flex-col gap-3'>
-                    {column.links.map(link => (
-                      <li key={link.label}>
-                        {link.href ? (
-                          <a
-                            href={link.href}
-                            className='text-muted-foreground hover:text-primary text-sm transition-colors'
-                          >
-                            {link.label}
-                          </a>
-                        ) : (
-                          <span className='text-muted-foreground text-sm'>{link.label}</span>
-                        )}
-                      </li>
-                    ))}
-                  </ul>
-                </div>
-              ))}
-            </div>
-          </div>
-        </div>
-      </div>
-    </footer>
-  )
-}
-
-export default FooterSection1