Add disable registration option

src/components/auth/AuthForm.tsx

@@ -11,9 +11,11 @@ import {
 import { useForm, yupResolver } from "@mantine/form";
 import * as yup from "yup";
 import aw from "../../utils/appwrite.util";
+import { useConfig } from "../../utils/config.util";
 import toast from "../../utils/toast.util";
 
 const AuthForm = ({ mode }: { mode: "signUp" | "signIn" }) => {
+  const config = useConfig();
   const validationSchema = yup.object().shape({
     email: yup.string().email().required(),
     password: yup.string().min(8).required(),
@@ -39,7 +41,6 @@ const AuthForm = ({ mode }: { mode: "signUp" | "signIn" }) => {
       .then(() => signIn(email, password))
       .catch((e) => toast.error(e.message));
   };
-
   return (
     <Container size={420} my={40}>
       <Title
@@ -51,15 +52,16 @@ const AuthForm = ({ mode }: { mode: "signUp" | "signIn" }) => {
       >
         {mode == "signUp" ? "Sign up" : "Welcome back"}
       </Title>
-      <Text color="dimmed" size="sm" align="center" mt={5}>
-        {mode == "signUp"
-          ? "You have an account already?"
-          : "You don't have an account yet?"}{" "}
-        <Anchor href={mode == "signUp" ? "signIn" : "signUp"} size="sm">
-          {mode == "signUp" ? "Sign in" : "Sign up"}
-        </Anchor>
-      </Text>
-
+      {!config.DISABLE_REGISTRATION && (
+        <Text color="dimmed" size="sm" align="center" mt={5}>
+          {mode == "signUp"
+            ? "You have an account already?"
+            : "You don't have an account yet?"}{" "}
+          <Anchor href={mode == "signUp" ? "signIn" : "signUp"} size="sm">
+            {mode == "signUp" ? "Sign in" : "Sign up"}
+          </Anchor>
+        </Text>
+      )}
       <Paper withBorder shadow="md" p={30} mt={30} radius="md">
         <form
           onSubmit={form.onSubmit((values) =>

src/components/navBar/NavBar.tsx

@@ -15,6 +15,7 @@ import React, { useContext, useEffect, useState } from "react";
 import headerStyle from "../../styles/header.style";
 import aw from "../../utils/appwrite.util";
 import { IsSignedInContext } from "../../utils/auth.util";
+import { useConfig } from "../../utils/config.util";
 import ToggleThemeButton from "./ToggleThemeButton";
 
 type Link = {
@@ -23,62 +24,67 @@ type Link = {
   action?: () => Promise<void>;
 };
 
-const authenticatedLinks: Link[] = [
-  {
-    link: "/upload",
-    label: "Upload",
-  },
-  {
-    label: "Sign out",
-    action: async () => {
-      await aw.account.deleteSession("current");
-      window.location.reload();
-    },
-  },
-];
-
-const unauthenticatedLinks: Link[] = [
-  {
-    link: "/",
-    label: "Home",
-  },
-  {
-    link: "/auth/signUp",
-    label: "Sign up",
-  },
-  {
-    link: "/auth/signIn",
-    label: "Sign in",
-  },
-];
-
 const Header = () => {
   const [opened, toggleOpened] = useBooleanToggle(false);
   const [active, setActive] = useState<string>();
   const isSignedIn = useContext(IsSignedInContext);
+  const config = useConfig();
   const { classes, cx } = headerStyle();
 
+  const authenticatedLinks: Link[] = [
+    {
+      link: "/upload",
+      label: "Upload",
+    },
+    {
+      label: "Sign out",
+      action: async () => {
+        await aw.account.deleteSession("current");
+        window.location.reload();
+      },
+    },
+  ];
+
+  const unauthenticatedLinks: Link[] | undefined = [
+    {
+      link: "/",
+      label: "Home",
+    },
+    {
+      link: "/auth/signIn",
+      label: "Sign in",
+    },
+  ];
+
+  if (!config.DISABLE_REGISTRATION)
+    unauthenticatedLinks.push({
+      link: "/auth/signUp",
+      label: "Sign up",
+    });
+
   const links = isSignedIn ? authenticatedLinks : unauthenticatedLinks;
 
   const items = links.map((link) => {
-    // eslint-disable-next-line react-hooks/rules-of-hooks
-    useEffect(() => {
-      if (window.location.pathname == link.link) {
-        setActive(link.link);
-      }
-    });
-    return (
-      <NextLink
-        key={link.label}
-        href={link.link ?? ""}
-        onClick={link.action}
-        className={cx(classes.link, {
-          [classes.linkActive]: link.link && active === link.link,
-        })}
-      >
-        {link.label}
-      </NextLink>
-    );
+    if (link) {
+      // eslint-disable-next-line react-hooks/rules-of-hooks
+      useEffect(() => {
+        if (window.location.pathname == link.link) {
+          setActive(link.link);
+        }
+      });
+      return (
+        <NextLink
+          key={link.label}
+          href={link.link ?? ""}
+          onClick={link.action}
+          className={cx(classes.link, {
+            [classes.linkActive]: link.link && active === link.link,
+          })}
+        >
+          {link.label}
+        </NextLink>
+      );
+    }
   });
 
   return (

src/components/upload/Dropzone.tsx

@@ -56,7 +56,6 @@ const Dropzone = ({
   const config = useConfig()
   const { classes } = useStyles();
   const openRef = useRef<() => void>();
-
   return (
     <div className={classes.wrapper}>
       <MantineDropzone