fix: code spliting and instance maintenance screens

web/ce/components/instance/index.ts

@@ -0,0 +1 @@
+export * from "./maintenance-message";

web/ce/components/instance/maintenance-message.tsx

@@ -0,0 +1,6 @@
+export const MaintenanceMessage = () => (
+  <h1 className="text-xl font-medium text-custom-text-100 text-center md:text-left">
+    Plane didn&apos;t start up. This could be because one or more Plane services failed to start. <br /> Choose View
+    Logs from setup.sh and Docker logs to be sure.
+  </h1>
+);

web/ce/components/maintenance-mode.tsx

@@ -1,5 +0,0 @@
-"use client";
-
-import { FC, Fragment } from "react";
-
-export const MaintenanceMode: FC = () => <Fragment />;

web/core/components/instance/index.ts

@@ -1 +1,2 @@
 export * from "./not-ready-view";
+export * from "./maintenance-view";

web/core/components/instance/maintenance-view.tsx

@@ -0,0 +1,34 @@
+"use client";
+
+import { FC } from "react";
+import Image from "next/image";
+// ui
+import { Button } from "@plane/ui";
+// layouts
+import DefaultLayout from "@/layouts/default-layout";
+// components
+import { MaintenanceMessage } from "@/plane-web/components/instance";
+// images
+import maintenanceModeImage from "@/public/maintenance-mode.webp";
+
+export const MaintenanceView: FC = () => (
+  <DefaultLayout>
+    <div className="relative container mx-auto h-full w-full flex flex-col md:flex-row gap-2 items-center justify-center gap-y-5 bg-custom-background-100 text-center">
+      <div className="relative w-full">
+        <Image
+          src={maintenanceModeImage}
+          height="176"
+          width="288"
+          alt="ProjectSettingImg"
+          className="w-full h-full object-fill object-center"
+        />
+      </div>
+      <div className="w-full space-y-4 relative flex flex-col justify-center md:justify-start items-center md:items-start">
+        <MaintenanceMessage />
+        <Button variant="outline-primary" onClick={() => window.location.reload()}>
+          Reload
+        </Button>
+      </div>
+    </div>
+  </DefaultLayout>
+);

web/core/lib/wrappers/instance-wrapper.tsx

@@ -3,11 +3,9 @@ import { observer } from "mobx-react";
 import useSWR from "swr";
 // components
 import { LogoSpinner } from "@/components/common";
-import { InstanceNotReady } from "@/components/instance";
+import { InstanceNotReady, MaintenanceView } from "@/components/instance";
 // hooks
 import { useInstance } from "@/hooks/store";
-// plane web components
-import { MaintenanceMode } from "@/plane-web/components/maintenance-mode";
 
 type TInstanceWrapper = {
   children: ReactNode;
@@ -32,7 +30,7 @@ export const InstanceWrapper: FC<TInstanceWrapper> = observer((props) => {
       </div>
     );
 
-  if (instanceSWRError) return <MaintenanceMode />;
+  if (instanceSWRError) return <MaintenanceView />;
 
   // something went wrong while in the request
   if (error && error?.status === "error") return <>{children}</>;

web/ee/components/instance/index.ts

@@ -0,0 +1 @@
+export * from "ce/components/instance";

web/ee/components/instance/maintenance-message.tsx

@@ -0,0 +1 @@
+export const MaintenanceMessage = () => <></>;

web/ee/components/maintenance-mode.tsx

@@ -1 +0,0 @@
-export * from "ce/components/maintenance-mode";