import { Wrench } from "lucide-react";
import {
  DocArticle,
  DocSection,
  DocCallout,
  DocContactCta,
} from "@/components/support/doc-article";

export const metadata = {
  title: "Troubleshooting — Echo Help",
};

export default function TroubleshootingPage() {
  return (
    <DocArticle
      title="Troubleshooting"
      description="Common problems, quick fixes, and how to get unstuck."
      icon={<Wrench className="size-[18px]" />}
    >
      <DocSection title="OCR accuracy is lower than I expected">
        <ul className="ml-6 list-disc space-y-2">
          <li>
            <strong>Scan at 300 DPI or higher.</strong> Lower resolutions blur
            handwriting and drop accuracy fast.
          </li>
          <li>
            <strong>Scan in color or grayscale</strong>, not bitonal B&amp;W.
            Bitonal drops subtle handwriting strokes.
          </li>
          <li>
            <strong>Make sure the form template matches.</strong> The AI uses
            your field labels as hints; if the template is wrong, every card
            will be off.
          </li>
          <li>
            <strong>Crop out clutter.</strong> If your scanner includes a bunch
            of blank space or overlap from the next card, extraction can
            wander.
          </li>
        </ul>
      </DocSection>

      <DocSection title="Email-watch isn't picking up new mail">
        <ul className="ml-6 list-disc space-y-2">
          <li>
            Confirm the inbox status on <strong>Settings &rarr; Upload Sources
            &rarr; Email</strong> is <em>Connected</em>. If it shows{" "}
            <em>Error</em>, the credentials are likely stale.
          </li>
          <li>
            For Gmail, make sure you&rsquo;re using an{" "}
            <strong>App Password</strong>, not your main account password.
            Regular passwords will fail auth.
          </li>
          <li>
            Check that IMAP access is enabled in the source account&rsquo;s
            settings.
          </li>
          <li>
            Verify the sender isn&rsquo;t being filtered into Spam &mdash; Echo
            only watches the Inbox folder by default.
          </li>
        </ul>
      </DocSection>

      <DocSection title="FTP watcher says 'connection refused'">
        <ul className="ml-6 list-disc space-y-2">
          <li>
            Double-check the host, port, and protocol (FTP vs. SFTP) match what
            your scanner uses.
          </li>
          <li>
            If your FTP is only reachable from inside your church&rsquo;s
            network, expose it via SFTP or switch to email-watch.
          </li>
          <li>
            Some FTP servers require <em>passive mode</em>. Toggle it in the
            source settings if the initial listing hangs.
          </li>
        </ul>
      </DocSection>

      <DocSection title="An integration stopped syncing">
        <ul className="ml-6 list-disc space-y-2">
          <li>
            Go to <strong>Settings &rarr; Integrations</strong> and check the{" "}
            <em>Status</em> badge. A red <em>Auth expired</em> badge means
            OAuth needs reconnecting.
          </li>
          <li>
            Click the integration, then <strong>Reconnect</strong>. You may
            need to sign into the provider (Google, Planning Center, etc.)
            again.
          </li>
          <li>
            For webhook destinations, inspect the latest delivery from{" "}
            <strong>Settings &rarr; Integrations &rarr; Webhook &rarr; Recent
            deliveries</strong>.
          </li>
        </ul>
      </DocSection>

      <DocSection title="Cards are stuck on 'Processing'">
        <p>
          This almost always means the background job queue is backed up.
          Usually it clears within a few minutes. If a card stays in
          Processing for more than an hour:
        </p>
        <ul className="ml-6 list-disc space-y-2">
          <li>
            Open the card, click <strong>More</strong> &rarr;{" "}
            <strong>Retry processing</strong>.
          </li>
          <li>
            If the retry also gets stuck, the file may be corrupted &mdash;
            delete and re-upload.
          </li>
          <li>
            If that still fails, reach out to support and include the card
            ID.
          </li>
        </ul>
      </DocSection>

      <DocSection title="I can't sign in">
        <ul className="ml-6 list-disc space-y-2">
          <li>
            Use the <strong>Forgot password</strong> link on the sign-in page
            to reset.
          </li>
          <li>
            If your church uses SSO, sign in with the{" "}
            <strong>Sign in with SSO</strong> button &mdash; the
            email/password flow won&rsquo;t work for SSO-only accounts.
          </li>
          <li>
            If your email isn&rsquo;t verified yet, check your inbox (and
            spam) for the verification email from{" "}
            <code>mars@noreply.stillwell.cloud</code>.
          </li>
        </ul>
      </DocSection>

      <DocCallout tone="info" title="Have a card ID? Include it">
        When you contact support about a specific card, mention the card ID
        (shown in the URL when you open a card). It lets us jump directly to
        the exact run.
      </DocCallout>

      <DocContactCta label="Still stuck? Describe what you're seeing and we'll dig in." />
    </DocArticle>
  );
}
