import { Card } from '@/components/Card'
import { Section } from '@/components/Section'
import { SimpleLayout } from '@/components/SimpleLayout'

function ToolsSection({
  children,
  ...props
}: React.ComponentPropsWithoutRef<typeof Section>) {
  return (
    <Section {...props}>
      <ul role="list" className="space-y-16">
        {children}
      </ul>
    </Section>
  )
}

function Tool({
  title,
  href,
  children,
}: {
  title: string
  href?: string
  children: React.ReactNode
}) {
  return (
    <Card as="li">
      <Card.Title as="h3" href={href}>
        {title}
      </Card.Title>
      <Card.Description>{children}</Card.Description>
    </Card>
  )
}

export const metadata = {
  title: 'Uses',
  description: 'Tools and technologies I use for blockchain development, building Sonr, and staying productive.',
}

export default function Uses() {
  return (
    <SimpleLayout
      title="Tools for building the future of decentralized identity."
      intro="From blockchain development to managing a startup, here are the tools and technologies that power my work at Sonr and help me maintain my position as one of the world\'s most active open-source contributors."
    >
      <div className="space-y-20">
        <ToolsSection title="Workstation">
          <Tool title='16" MacBook Pro, M2 Max, 96GB RAM'>
            When you\'re compiling blockchain nodes and running multiple test networks locally,
            RAM is everything. This machine handles everything I throw at it, from Rust compilation
            to running full Cosmos SDK nodes.
          </Tool>
          <Tool title="LG UltraFine 5K Display (x2)">
            Dual 5K displays give me the screen real estate I need for coding, monitoring
            blockchain metrics, and keeping up with the constant stream of GitHub notifications
            from maintaining one of the world\'s most active contribution streaks.
          </Tool>
          <Tool title="Keychron Q1 with Gateron Brown Switches">
            Mechanical keyboards aren\'t just for gaming. The tactile feedback helps me maintain
            accuracy during long coding sessions, crucial when every character matters in smart contracts.
          </Tool>
          <Tool title="Herman Miller Embody Chair">
            After years of 12+ hour coding days, investing in proper ergonomics isn\'t optional.
            This chair has been perfect for those long sessions building Sonr\'s infrastructure.
          </Tool>
        </ToolsSection>
        <ToolsSection title="Development Tools">
          <Tool title="VS Code with Rust Analyzer">
            Essential for Cosmos SDK development. The Rust analyzer extension is particularly
            crucial for blockchain development where type safety can prevent costly errors.
          </Tool>
          <Tool title="Warp Terminal">
            The AI-powered terminal that understands context. Perfect for managing multiple
            blockchain nodes, SSH sessions, and the complex command sequences involved in
            Cosmos SDK development.
          </Tool>
          <Tool title="Docker & Kubernetes">
            Running local testnets and managing blockchain infrastructure requires serious
            containerization. Docker for local development, K8s for production deployments.
          </Tool>
          <Tool title="Lens IDE">
            The best Kubernetes IDE I\'ve found. Essential for managing Sonr\'s infrastructure
            across multiple environments and monitoring our validator nodes.
          </Tool>
          <Tool title="Tendermint/CometBFT Tools">
            The entire Cosmos SDK toolkit is essential for building IBC-enabled chains.
            From Ignite CLI to CosmWasm, these tools form the backbone of Sonr\'s development.
          </Tool>
        </ToolsSection>
        <ToolsSection title="Blockchain & Web3 Tools">
          <Tool title="Keplr Wallet">
            The premier wallet for Cosmos ecosystem development. Essential for testing
            IBC transactions and interacting with Sonr\'s testnet.
          </Tool>
          <Tool title="Remix IDE">
            While Sonr uses Cosmos SDK, understanding EVM is crucial. Remix helps me
            stay current with Ethereum development and test cross-chain scenarios.
          </Tool>
          <Tool title="IPFS Desktop">
            Since Sonr integrates IPFS for distributed storage, having a local IPFS
            node is essential for development and testing.
          </Tool>
          <Tool title="Postman">
            API testing is crucial when building blockchain infrastructure. Postman
            helps me test our REST and gRPC endpoints thoroughly.
          </Tool>
        </ToolsSection>
        <ToolsSection title="Design & Documentation">
          <Tool title="Figma">
            Designing intuitive blockchain UX requires constant iteration. Figma helps
            us prototype wallet interfaces and visualize complex identity flows.
          </Tool>
          <Tool title="Excalidraw">
            Perfect for sketching blockchain architectures and explaining complex
            technical concepts. Most of our technical documentation starts here.
          </Tool>
          <Tool title="Notion">
            Our entire company knowledge base lives in Notion. From technical specs
            to meeting notes, it\'s our single source of truth.
          </Tool>
        </ToolsSection>
        <ToolsSection title="Productivity & Communication">
          <Tool title="Raycast">
            More than just an app launcher - it\'s my command center. Custom scripts
            for blockchain operations, quick access to documentation, and AI features
            for code generation.
          </Tool>
          <Tool title="Linear">
            Issue tracking designed for modern software teams. Perfect for managing
            Sonr\'s development across multiple repositories and coordinating with our
            distributed team.
          </Tool>
          <Tool title="Cal.com">
            Open-source scheduling that respects privacy. Important when you\'re building
            privacy-first technology and need to practice what you preach.
          </Tool>
          <Tool title="Discord">
            Where the blockchain community lives. Essential for staying connected with
            the Cosmos ecosystem and supporting our developer community.
          </Tool>
          <Tool title="GitHub Copilot">
            AI pair programming at its finest. Particularly helpful when working with
            new Cosmos SDK modules or implementing complex cryptographic functions.
          </Tool>
        </ToolsSection>
      </div>
    </SimpleLayout>
  )
}