feat(infisical-pg): added migration mode env and page

frontend/src/context/ServerConfigContext/ServerConfigContext.tsx

@@ -27,7 +27,7 @@ export const ServerConfigProvider = ({ children }: Props): JSX.Element => {
   }, [data]);
 
   useEffect(() => {
-    if (!isLoading && data && !data.initialized) {
+    if (!isLoading && data && !data.initialized && !data.isMigrationModeOn) {
       router.push("/admin/signup");
     }
   }, [isLoading, data]);
@@ -40,6 +40,17 @@ export const ServerConfigProvider = ({ children }: Props): JSX.Element => {
     );
   }
 
+  if (data?.isMigrationModeOn) {
+    return (
+      <div className="relative mx-auto flex h-screen w-full flex-col items-center justify-center space-y-8 bg-bunker-800 px-8 text-mineshaft-50 dark:[color-scheme:dark]">
+        <img src="/images/loading/loading.gif" height={70} width={120} alt="loading animation" />
+        <div className="mt-4 text-center text-xl">
+          Infisical under migration. See you in some time. <br /> All read operations are allowed
+        </div>
+      </div>
+    );
+  }
+
   return <ServerConfigContext.Provider value={value}>{children}</ServerConfigContext.Provider>;
 };
 

frontend/src/hooks/api/admin/types.ts

@@ -1,6 +1,7 @@
 export type TServerConfig = {
   initialized: boolean;
   allowSignUp: boolean;
+  isMigrationModeOn?: boolean;
 };
 
 export type TCreateAdminUserDTO = {

frontend/src/views/admin/SignUpPage/SignUpPage.tsx

@@ -61,7 +61,7 @@ export const SignUpPage = () => {
         router.push("/login");
       }
     }
-  }, []);
+  }, [config?.initialized]);
 
   const { mutateAsync: createAdminUser } = useCreateAdminUser();
 
@@ -117,7 +117,7 @@ export const SignUpPage = () => {
     return <ContentLoader text="Redirecting to admin page..." />;
 
   return (
-    <div className="flex justify-center items-center">
+    <div className="flex items-center justify-center">
       <AnimatePresence exitBeforeEnter>
         {step === SignupSteps.DetailsForm && (
           <motion.div
@@ -128,7 +128,7 @@ export const SignUpPage = () => {
             animate={{ opacity: 1, translateX: 0 }}
             exit={{ opacity: 0, translateX: 30 }}
           >
-            <div className="text-center flex flex-col items-center space-y-4">
+            <div className="flex flex-col items-center space-y-4 text-center">
               <img src="/images/gradientLogo.svg" height={90} width={120} alt="Infisical logo" />
               <div className="text-4xl">Welcome to Infisical</div>
               <div>Create your first Admin Account</div>