import {
  Accordion,
  AccordionContent,
  AccordionItem,
  AccordionTrigger,
} from "@components/Accordion";
import Button from "@components/Button";
import Code from "@components/Code";
import InlineLink from "@components/InlineLink";
import Separator from "@components/Separator";
import Steps from "@components/Steps";
import TabsContentPadding, { TabsContent } from "@components/Tabs";
import { Tooltip, TooltipContent, TooltipTrigger } from "@components/Tooltip";
import { getNetBirdUpCommand, GRPC_API_ORIGIN } from "@utils/netbird";
import {
  BeerIcon,
  DownloadIcon,
  ExternalLinkIcon,
  HelpCircle,
  PackageOpenIcon,
  TerminalSquareIcon,
} from "lucide-react";
import Link from "next/link";
import React from "react";
import { OperatingSystem } from "@/interfaces/OperatingSystem";

export default function MacOSTab() {
  return (
    <TabsContent value={String(OperatingSystem.APPLE)}>
      <TabsContentPadding>
        <p className={"font-medium flex gap-3 items-center text-base"}>
          <PackageOpenIcon size={16} />
          Install on macOS
        </p>
        <Steps>
          <Steps.Step step={1}>
            <div className={"flex items-center gap-1 text-sm font-light"}>
              Download and run macOS Installer
              <Tooltip>
                <TooltipTrigger>
                  <HelpCircle
                    size={16}
                    className={"inline-block ml-1 text-netbird"}
                  />
                </TooltipTrigger>
                <TooltipContent>
                  <p className={"max-w-[200px] text-xs"}>
                    {`If you don't know what chip your Mac has, you can find out
                    by clicking on the Apple logo in the top left corner of your
                    screen and selecting 'About This Mac'.`}
                  </p>
                  <div className={"text-xs mt-1.5"}>
                    <InlineLink
                      href={"https://support.apple.com/en-us/HT211814"}
                      passHref
                      target={"_blank"}
                      className={"flex gap-1 items-center"}
                    >
                      Learn more
                      <ExternalLinkIcon size={12} />
                    </InlineLink>
                  </div>
                </TooltipContent>
              </Tooltip>
            </div>
            <div className={"flex gap-4 mt-1 flex-wrap"}>
              <Link
                href={"https://pkgs.netbird.io/macos/amd64"}
                passHref
                target={"_blank"}
              >
                <Button variant={"primary"}>
                  <DownloadIcon size={14} />
                  Download for Intel
                </Button>
              </Link>
              <Link
                href={"https://pkgs.netbird.io/macos/arm64"}
                passHref
                target={"_blank"}
              >
                <Button variant={"outline"}>
                  <DownloadIcon size={14} />
                  Download for Apple Silicon
                </Button>
              </Link>
            </div>
          </Steps.Step>

          {GRPC_API_ORIGIN && (
            <Steps.Step step={2}>
              <p>
                {`Click on "Settings" from the NetBird icon in your system tray and enter the following "Management URL"`}
              </p>
              <Code>
                <Code.Line>{GRPC_API_ORIGIN}</Code.Line>
              </Code>
            </Steps.Step>
          )}

          <Steps.Step step={GRPC_API_ORIGIN ? 3 : 2}>
            <p>
              {/* eslint-disable-next-line react/no-unescaped-entities */}
              Click on "Connect" from the NetBird icon in your system tray
            </p>
          </Steps.Step>
          <Steps.Step step={GRPC_API_ORIGIN ? 4 : 3} line={false}>
            <p>Sign up using your email address</p>
          </Steps.Step>
        </Steps>
      </TabsContentPadding>
      <Separator />
      <TabsContentPadding>
        <Accordion type="single" collapsible>
          <AccordionItem value="item-1">
            <AccordionTrigger>
              <TerminalSquareIcon size={16} />
              Install manually with Terminal
            </AccordionTrigger>
            <AccordionContent>
              <Steps>
                <Steps.Step step={1}>
                  <Code>
                    curl -fsSL https://pkgs.netbird.io/install.sh | sh
                  </Code>
                </Steps.Step>
                <Steps.Step step={2} line={false}>
                  <p>Run NetBird and log in the browser</p>
                  <Code>
                    <Code.Line>{getNetBirdUpCommand()}</Code.Line>
                  </Code>
                </Steps.Step>
              </Steps>
            </AccordionContent>
          </AccordionItem>
        </Accordion>
      </TabsContentPadding>
      <Separator />
      <TabsContentPadding>
        <Accordion type="single" collapsible>
          <AccordionItem value="item-1">
            <AccordionTrigger>
              <BeerIcon size={16} /> Install manually with HomeBrew
            </AccordionTrigger>
            <AccordionContent>
              <Steps>
                <Steps.Step step={1}>
                  <p>Download and install HomeBrew</p>
                  <div className={"flex gap-4"}>
                    <Link href={"https://brew.sh/"} passHref target={"_blank"}>
                      <Button variant={"primary"}>
                        <ExternalLinkIcon size={14} />
                        HomeBrew Installation Guide
                      </Button>
                    </Link>
                  </div>
                </Steps.Step>
                <Steps.Step step={2}>
                  <p>Install NetBird </p>
                  <Code
                    codeToCopy={[
                      `brew install netbirdio/tap/netbird`,
                      `brew install --cask netbirdio/tap/netbird-ui`,
                    ].join("\n")}
                  >
                    <Code.Comment># for CLI only</Code.Comment>
                    <Code.Line>brew install netbirdio/tap/netbird</Code.Line>
                    <Code.Comment># for GUI package</Code.Comment>
                    <Code.Line>
                      brew install --cask netbirdio/tap/netbird-ui
                    </Code.Line>
                  </Code>
                </Steps.Step>
                <Steps.Step step={3}>
                  <p>Start NetBird daemon</p>
                  <Code>
                    <Code.Line>sudo netbird service install</Code.Line>
                    <Code.Line>sudo netbird service</Code.Line>
                  </Code>
                </Steps.Step>
                <Steps.Step step={4} line={false}>
                  <p>Run NetBird and log in the browser</p>
                  <Code>
                    <Code.Line>{getNetBirdUpCommand()}</Code.Line>
                  </Code>
                </Steps.Step>
              </Steps>
            </AccordionContent>
          </AccordionItem>
        </Accordion>
      </TabsContentPadding>
    </TabsContent>
  );
}
