/**
 * Copyright (c) 2023-present Plane Software, Inc. and contributors
 * SPDX-License-Identifier: AGPL-3.0-only
 * See the LICENSE file for details.
 */

import Link from "next/link";
import { GOD_MODE_URL } from "@plane/constants";
// assets
import GradientLogo from "@/app/assets/auth/gradient-logo.webp?url";
import GradientBgLogo from "@/app/assets/auth/gradient-bg-logo.webp?url";
import DefaultLayout from "@/layouts/default-layout";
import { PlaneLockup } from "@plane/propel/icons";
import { Button } from "@plane/propel/button";
import { useNodeDCBrandLinkUrl } from "@/hooks/use-nodedc-brand-link-url";

export function InstanceNotReady() {
  const logoLinkUrl = useNodeDCBrandLinkUrl();

  return (
    <DefaultLayout>
      <div className="relative z-10 flex h-screen w-screen overflow-hidden">
        <div className="flex h-full w-full flex-col items-center px-8 pt-6 pb-10">
          <div className="sticky top-0 flex w-full shrink-0 items-center justify-between gap-6">
            <a href={logoLinkUrl} aria-label="NODE.DC">
              <PlaneLockup
                height={40}
                width={190}
                className="nodedc-auth-logo-lockup text-primary transition-opacity hover:opacity-90"
              />
            </a>
          </div>
          <div className="flex h-full w-full flex-col items-center justify-center gap-7">
            <div className="nodedc-error-shell flex max-w-3xl flex-col items-center gap-11 text-center">
              <img
                src={GradientBgLogo}
                className="pointer-events-none absolute -top-24 -left-32 h-56 w-96 opacity-12"
                alt=""
                aria-hidden="true"
              />
              <img
                src={GradientBgLogo}
                className="pointer-events-none absolute -right-20 -bottom-16 h-56 w-96 opacity-12"
                alt=""
                aria-hidden="true"
              />
              <img src={GradientLogo} className="h-24 w-40 object-contain" alt="NODE.DC Logo" />
              <div className="flex max-w-124 flex-col items-center gap-3">
                <h1 className="text-h2-semibold text-primary">NODE.DC готов к запуску</h1>
                <p className="text-center text-body-md-regular text-secondary">
                  Завершите настройку инстанса и создайте первое рабочее пространство, чтобы начать работу с
                  проектами и рабочими элементами.
                </p>
              </div>
              <a href={GOD_MODE_URL} className="w-80">
                <Button variant="primary" className="nodedc-error-primary w-full" size="xl">
                  Перейти к настройке
                </Button>
              </a>
              <a
                href="https://nodedc.dctouch.ru/"
                target="_blank"
                rel="noopener noreferrer"
                className="nodedc-error-link text-13 font-medium"
              >
                Служба поддержки
              </a>
            </div>
          </div>
        </div>
      </div>
    </DefaultLayout>
  );
}
