base

2026-04-18 18:39:25 +03:00
commit 3ba092b60c
4944 changed files with 497564 additions and 0 deletions
@@ -0,0 +1,36 @@
+/**
+ * Copyright (c) 2023-present Plane Software, Inc. and contributors
+ * SPDX-License-Identifier: AGPL-3.0-only
+ * See the LICENSE file for details.
+ */
+
+import { Info } from "lucide-react";
+// plane constants
+import type { TAdminAuthErrorInfo } from "@plane/constants";
+// icons
+import { CloseIcon } from "@plane/propel/icons";
+
+type TAuthBanner = {
+  bannerData: TAdminAuthErrorInfo | undefined;
+  handleBannerData?: (bannerData: TAdminAuthErrorInfo | undefined) => void;
+};
+
+export function AuthBanner(props: TAuthBanner) {
+  const { bannerData, handleBannerData } = props;
+
+  if (!bannerData) return <></>;
+  return (
+    <div className="relative flex items-center gap-2 rounded-md border border-accent-strong/50 bg-accent-primary/10 p-2">
+      <div className="relative flex h-4 w-4 flex-shrink-0 items-center justify-center">
+        <Info size={16} className="text-accent-primary" />
+      </div>
+      <div className="w-full text-13 font-medium text-accent-primary">{bannerData?.message}</div>
+      <div
+        className="relative ml-auto flex h-6 w-6 cursor-pointer items-center justify-center rounded-xs text-accent-primary transition-all hover:bg-accent-primary/20"
+        onClick={() => handleBannerData && handleBannerData(undefined)}
+      >
+        <CloseIcon className="h-4 w-4 flex-shrink-0" />
+      </div>
+    </div>
+  );
+}
@@ -0,0 +1,18 @@
+/**
+ * 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 { PlaneLockup } from "@plane/propel/icons";
+
+export function AuthHeader() {
+  return (
+    <div className="sticky top-0 flex w-full flex-shrink-0 items-center justify-between gap-6">
+      <Link href="/">
+        <PlaneLockup height={20} width={95} className="text-primary" />
+      </Link>
+    </div>
+  );
+}
@@ -0,0 +1,100 @@
+/**
+ * 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";
+// plane packages
+import type { TAdminAuthErrorInfo } from "@plane/constants";
+import { SUPPORT_EMAIL, EAdminAuthErrorCodes } from "@plane/constants";
+
+export enum EErrorAlertType {
+  BANNER_ALERT = "BANNER_ALERT",
+  INLINE_FIRST_NAME = "INLINE_FIRST_NAME",
+  INLINE_EMAIL = "INLINE_EMAIL",
+  INLINE_PASSWORD = "INLINE_PASSWORD",
+  INLINE_EMAIL_CODE = "INLINE_EMAIL_CODE",
+}
+
+const errorCodeMessages: {
+  [key in EAdminAuthErrorCodes]: { title: string; message: (email?: string) => React.ReactNode };
+} = {
+  // admin
+  [EAdminAuthErrorCodes.ADMIN_ALREADY_EXIST]: {
+    title: `Admin already exists`,
+    message: () => `Admin already exists. Please try again.`,
+  },
+  [EAdminAuthErrorCodes.REQUIRED_ADMIN_EMAIL_PASSWORD_FIRST_NAME]: {
+    title: `Email, password and first name required`,
+    message: () => `Email, password and first name required. Please try again.`,
+  },
+  [EAdminAuthErrorCodes.INVALID_ADMIN_EMAIL]: {
+    title: `Invalid admin email`,
+    message: () => `Invalid admin email. Please try again.`,
+  },
+  [EAdminAuthErrorCodes.INVALID_ADMIN_PASSWORD]: {
+    title: `Invalid admin password`,
+    message: () => `Invalid admin password. Please try again.`,
+  },
+  [EAdminAuthErrorCodes.REQUIRED_ADMIN_EMAIL_PASSWORD]: {
+    title: `Email and password required`,
+    message: () => `Email and password required. Please try again.`,
+  },
+  [EAdminAuthErrorCodes.ADMIN_AUTHENTICATION_FAILED]: {
+    title: `Authentication failed`,
+    message: () => `Authentication failed. Please try again.`,
+  },
+  [EAdminAuthErrorCodes.ADMIN_USER_ALREADY_EXIST]: {
+    title: `Admin user already exists`,
+    message: () => (
+      <div>
+        Admin user already exists.&nbsp;
+        <Link className="font-medium underline underline-offset-4 transition-all hover:font-bold" href={`/admin`}>
+          Sign In
+        </Link>
+        &nbsp;now.
+      </div>
+    ),
+  },
+  [EAdminAuthErrorCodes.ADMIN_USER_DOES_NOT_EXIST]: {
+    title: `Admin user does not exist`,
+    message: () => (
+      <div>
+        Admin user does not exist.&nbsp;
+        <Link className="font-medium underline underline-offset-4 transition-all hover:font-bold" href={`/admin`}>
+          Sign In
+        </Link>
+        &nbsp;now.
+      </div>
+    ),
+  },
+  [EAdminAuthErrorCodes.ADMIN_USER_DEACTIVATED]: {
+    title: `User account deactivated`,
+    message: () => `User account deactivated. Please contact ${SUPPORT_EMAIL ? SUPPORT_EMAIL : "administrator"}.`,
+  },
+};
+
+export const authErrorHandler = (errorCode: EAdminAuthErrorCodes, email?: string): TAdminAuthErrorInfo | undefined => {
+  const bannerAlertErrorCodes = [
+    EAdminAuthErrorCodes.ADMIN_ALREADY_EXIST,
+    EAdminAuthErrorCodes.REQUIRED_ADMIN_EMAIL_PASSWORD_FIRST_NAME,
+    EAdminAuthErrorCodes.INVALID_ADMIN_EMAIL,
+    EAdminAuthErrorCodes.INVALID_ADMIN_PASSWORD,
+    EAdminAuthErrorCodes.REQUIRED_ADMIN_EMAIL_PASSWORD,
+    EAdminAuthErrorCodes.ADMIN_AUTHENTICATION_FAILED,
+    EAdminAuthErrorCodes.ADMIN_USER_ALREADY_EXIST,
+    EAdminAuthErrorCodes.ADMIN_USER_DOES_NOT_EXIST,
+    EAdminAuthErrorCodes.ADMIN_USER_DEACTIVATED,
+  ];
+
+  if (bannerAlertErrorCodes.includes(errorCode))
+    return {
+      type: EErrorAlertType.BANNER_ALERT,
+      code: errorCode,
+      title: errorCodeMessages[errorCode]?.title || "Error",
+      message: errorCodeMessages[errorCode]?.message(email) || "Something went wrong. Please try again.",
+    };
+
+  return undefined;
+};
@@ -0,0 +1,31 @@
+/**
+ * Copyright (c) 2023-present Plane Software, Inc. and contributors
+ * SPDX-License-Identifier: AGPL-3.0-only
+ * See the LICENSE file for details.
+ */
+
+import { useEffect } from "react";
+import { observer } from "mobx-react";
+import { useRouter } from "next/navigation";
+import { Outlet } from "react-router";
+// hooks
+import { useUser } from "@/hooks/store/use-user";
+
+function RootLayout() {
+  // router
+  const { replace } = useRouter();
+  // store hooks
+  const { isUserLoggedIn } = useUser();
+
+  useEffect(() => {
+    if (isUserLoggedIn === true) replace("/general");
+  }, [replace, isUserLoggedIn]);
+
+  return (
+    <div className="relative z-10 flex h-screen w-screen flex-col items-center overflow-hidden overflow-y-auto bg-surface-1 px-8 pt-6 pb-10">
+      <Outlet />
+    </div>
+  );
+}
+
+export default observer(RootLayout);
@@ -0,0 +1,50 @@
+/**
+ * Copyright (c) 2023-present Plane Software, Inc. and contributors
+ * SPDX-License-Identifier: AGPL-3.0-only
+ * See the LICENSE file for details.
+ */
+
+import { observer } from "mobx-react";
+// components
+import { LogoSpinner } from "@/components/common/logo-spinner";
+import { InstanceFailureView } from "@/components/instance/failure";
+import { InstanceSetupForm } from "@/components/instance/setup-form";
+// hooks
+import { useInstance } from "@/hooks/store";
+// components
+import type { Route } from "./+types/page";
+import { InstanceSignInForm } from "./sign-in-form";
+
+function HomePage() {
+  // store hooks
+  const { instance, error } = useInstance();
+
+  // if instance is not fetched, show loading
+  if (!instance && !error) {
+    return (
+      <div className="flex h-screen w-full items-center justify-center">
+        <LogoSpinner />
+      </div>
+    );
+  }
+
+  // if instance fetch fails, show failure view
+  if (error) {
+    return <InstanceFailureView />;
+  }
+
+  // if instance is fetched and setup is not done, show setup form
+  if (instance && !instance?.is_setup_done) {
+    return <InstanceSetupForm />;
+  }
+
+  // if instance is fetched and setup is done, show sign in form
+  return <InstanceSignInForm />;
+}
+
+export default observer(HomePage);
+
+export const meta: Route.MetaFunction = () => [
+  { title: "Admin – Instance Setup & Sign-In" },
+  { name: "description", content: "Configure your Plane instance or sign in to the admin portal." },
+];
@@ -0,0 +1,199 @@
+/**
+ * Copyright (c) 2023-present Plane Software, Inc. and contributors
+ * SPDX-License-Identifier: AGPL-3.0-only
+ * See the LICENSE file for details.
+ */
+
+import { useEffect, useMemo, useState } from "react";
+import { useSearchParams } from "next/navigation";
+import { Eye, EyeOff } from "lucide-react";
+// plane internal packages
+import type { EAdminAuthErrorCodes, TAdminAuthErrorInfo } from "@plane/constants";
+import { API_BASE_URL } from "@plane/constants";
+import { Button } from "@plane/propel/button";
+import { AuthService } from "@plane/services";
+import { Input, Spinner } from "@plane/ui";
+// components
+import { Banner } from "@/components/common/banner";
+// local components
+import { FormHeader } from "@/components/instance/form-header";
+import { AuthBanner } from "./auth-banner";
+import { AuthHeader } from "./auth-header";
+import { authErrorHandler } from "./auth-helpers";
+
+// service initialization
+const authService = new AuthService();
+
+// error codes
+enum EErrorCodes {
+  INSTANCE_NOT_CONFIGURED = "INSTANCE_NOT_CONFIGURED",
+  REQUIRED_EMAIL_PASSWORD = "REQUIRED_EMAIL_PASSWORD",
+  INVALID_EMAIL = "INVALID_EMAIL",
+  USER_DOES_NOT_EXIST = "USER_DOES_NOT_EXIST",
+  AUTHENTICATION_FAILED = "AUTHENTICATION_FAILED",
+}
+
+type TError = {
+  type: EErrorCodes | undefined;
+  message: string | undefined;
+};
+
+// form data
+type TFormData = {
+  email: string;
+  password: string;
+};
+
+const defaultFromData: TFormData = {
+  email: "",
+  password: "",
+};
+
+export function InstanceSignInForm() {
+  // search params
+  const searchParams = useSearchParams();
+  const emailParam = searchParams.get("email") || undefined;
+  const errorCode = searchParams.get("error_code") || undefined;
+  const errorMessage = searchParams.get("error_message") || undefined;
+  // state
+  const [showPassword, setShowPassword] = useState(false);
+  const [csrfToken, setCsrfToken] = useState<string | undefined>(undefined);
+  const [formData, setFormData] = useState<TFormData>(defaultFromData);
+  const [isSubmitting, setIsSubmitting] = useState(false);
+  const [errorInfo, setErrorInfo] = useState<TAdminAuthErrorInfo | undefined>(undefined);
+
+  const handleFormChange = (key: keyof TFormData, value: string | boolean) =>
+    setFormData((prev) => ({ ...prev, [key]: value }));
+
+  useEffect(() => {
+    if (csrfToken === undefined)
+      authService.requestCSRFToken().then((data) => data?.csrf_token && setCsrfToken(data.csrf_token));
+  }, [csrfToken]);
+
+  useEffect(() => {
+    if (emailParam) setFormData((prev) => ({ ...prev, email: emailParam }));
+  }, [emailParam]);
+
+  // derived values
+  const errorData: TError = useMemo(() => {
+    if (errorCode && errorMessage) {
+      switch (errorCode) {
+        case EErrorCodes.INSTANCE_NOT_CONFIGURED:
+          return { type: EErrorCodes.INSTANCE_NOT_CONFIGURED, message: errorMessage };
+        case EErrorCodes.REQUIRED_EMAIL_PASSWORD:
+          return { type: EErrorCodes.REQUIRED_EMAIL_PASSWORD, message: errorMessage };
+        case EErrorCodes.INVALID_EMAIL:
+          return { type: EErrorCodes.INVALID_EMAIL, message: errorMessage };
+        case EErrorCodes.USER_DOES_NOT_EXIST:
+          return { type: EErrorCodes.USER_DOES_NOT_EXIST, message: errorMessage };
+        case EErrorCodes.AUTHENTICATION_FAILED:
+          return { type: EErrorCodes.AUTHENTICATION_FAILED, message: errorMessage };
+        default:
+          return { type: undefined, message: undefined };
+      }
+    } else return { type: undefined, message: undefined };
+  }, [errorCode, errorMessage]);
+
+  const isButtonDisabled = useMemo(
+    () => (!isSubmitting && formData.email && formData.password ? false : true),
+    [formData.email, formData.password, isSubmitting]
+  );
+
+  useEffect(() => {
+    if (errorCode) {
+      const errorDetail = authErrorHandler(errorCode?.toString() as EAdminAuthErrorCodes);
+      if (errorDetail) {
+        setErrorInfo(errorDetail);
+      }
+    }
+  }, [errorCode]);
+
+  return (
+    <>
+      <AuthHeader />
+      <div className="mt-10 flex w-full flex-grow flex-col items-center justify-center py-6">
+        <div className="relative flex w-full max-w-[22.5rem] flex-col gap-6">
+          <FormHeader
+            heading="Manage your Plane instance"
+            subHeading="Configure instance-wide settings to secure your instance"
+          />
+          <form
+            className="space-y-4"
+            method="POST"
+            action={`${API_BASE_URL}/api/instances/admins/sign-in/`}
+            onSubmit={() => setIsSubmitting(true)}
+            onError={() => setIsSubmitting(false)}
+          >
+            {errorData.type && errorData?.message ? (
+              <Banner type="error" message={errorData?.message} />
+            ) : (
+              <>
+                {errorInfo && <AuthBanner bannerData={errorInfo} handleBannerData={(value) => setErrorInfo(value)} />}
+              </>
+            )}
+            <input type="hidden" name="csrfmiddlewaretoken" value={csrfToken} />
+
+            <div className="w-full space-y-1">
+              <label className="text-13 font-medium text-tertiary" htmlFor="email">
+                Email <span className="text-danger-primary">*</span>
+              </label>
+              <Input
+                className="w-full border border-subtle !bg-surface-1 placeholder:text-placeholder"
+                id="email"
+                name="email"
+                type="email"
+                inputSize="md"
+                placeholder="name@company.com"
+                value={formData.email}
+                onChange={(e) => handleFormChange("email", e.target.value)}
+                autoComplete="off"
+                autoFocus
+              />
+            </div>
+
+            <div className="w-full space-y-1">
+              <label className="text-13 font-medium text-tertiary" htmlFor="password">
+                Password <span className="text-danger-primary">*</span>
+              </label>
+              <div className="relative">
+                <Input
+                  className="w-full border border-subtle !bg-surface-1 placeholder:text-placeholder"
+                  id="password"
+                  name="password"
+                  type={showPassword ? "text" : "password"}
+                  inputSize="md"
+                  placeholder="Enter your password"
+                  value={formData.password}
+                  onChange={(e) => handleFormChange("password", e.target.value)}
+                  autoComplete="off"
+                />
+                {showPassword ? (
+                  <button
+                    type="button"
+                    className="absolute top-3.5 right-3 flex items-center justify-center text-placeholder"
+                    onClick={() => setShowPassword(false)}
+                  >
+                    <EyeOff className="h-4 w-4" />
+                  </button>
+                ) : (
+                  <button
+                    type="button"
+                    className="absolute top-3.5 right-3 flex items-center justify-center text-placeholder"
+                    onClick={() => setShowPassword(true)}
+                  >
+                    <Eye className="h-4 w-4" />
+                  </button>
+                )}
+              </div>
+            </div>
+            <div className="py-2">
+              <Button type="submit" size="xl" className="w-full" disabled={isButtonDisabled}>
+                {isSubmitting ? <Spinner height="20px" width="20px" /> : "Sign in"}
+              </Button>
+            </div>
+          </form>
+        </div>
+      </div>
+    </>
+  );
+}