'use client'

import { FooterBlock as FooterBlockType } from '../types'

interface FooterBlockProps {
  block: FooterBlockType
  onChange: (block: FooterBlockType) => void
  isEditing?: boolean
}

export function FooterBlockEditor({ block, onChange, isEditing = true }: FooterBlockProps) {
  const alignClass =
    block.alignment === 'left'
      ? 'text-left'
      : block.alignment === 'right'
        ? 'text-right'
        : 'text-center'

  return (
    <div className={`py-4 ${alignClass}`}>
      <div className="text-xs text-gray-500 space-y-1">
        <p>{block.companyName}</p>
        {block.address && <p>{block.address}</p>}
        {block.showUnsubscribe && (
          <p className="mt-2">
            <a
              href={block.unsubscribeUrl || '#'}
              className="text-gray-500 underline"
              onClick={isEditing ? (e) => e.preventDefault() : undefined}
            >
              Unsubscribe
            </a>
            {' '}from these emails
          </p>
        )}
      </div>
    </div>
  )
}