fix: admin app redirections

.eslintrc.js

@@ -4,7 +4,7 @@ module.exports = {
   extends: ["custom"],
   settings: {
     next: {
-      rootDir: ["web/", "space/"],
+      rootDir: ["web/", "space/", "admin/"],
     },
   },
 };

admin/.env.example

@@ -1,5 +1,3 @@
 NEXT_PUBLIC_API_BASE_URL=""
-NEXT_PUBLIC_ADMIN_BASE_URL=""
+NEXT_PUBLIC_ADMIN_BASE_PATH="/god-mode"
-NEXT_PUBLIC_SPACE_BASE_URL=""
+NEXT_PUBLIC_WEB_BASE_URL=""
-NEXT_PUBLIC_WEB_BASE_URL=""
-NEXT_PUBLIC_SPACE_BASE_PATH="/spaces"

admin/app/ai/components/ai-config-form.tsx

@@ -6,7 +6,7 @@ import { IFormattedInstanceConfiguration, TInstanceAIConfigurationKeys } from "@
 // components
 import { ControllerInput, TControllerInputFormField } from "components/common";
 // hooks
-import { useInstance } from "@/hooks";
+import { useInstance } from "@/hooks/store";
 
 type IInstanceAIForm = {
   config: IFormattedInstanceConfiguration;

admin/app/ai/page.tsx

@@ -7,7 +7,7 @@ import { Loader } from "@plane/ui";
 import { PageHeader } from "@/components/core";
 import { InstanceAIForm } from "./components";
 // hooks
-import { useInstance } from "@/hooks";
+import { useInstance } from "@/hooks/store";
 
 const InstanceAIPage = observer(() => {
   // store

admin/app/authentication/components/email-config-switch.tsx

@@ -3,7 +3,7 @@
 import React from "react";
 import { observer } from "mobx-react-lite";
 // hooks
-import { useInstance } from "@/hooks";
+import { useInstance } from "@/hooks/store";
 // ui
 import { ToggleSwitch } from "@plane/ui";
 // types

admin/app/authentication/components/password-config-switch.tsx

@@ -3,7 +3,7 @@
 import React from "react";
 import { observer } from "mobx-react-lite";
 // hooks
-import { useInstance } from "@/hooks";
+import { useInstance } from "@/hooks/store";
 // ui
 import { ToggleSwitch } from "@plane/ui";
 // types

admin/app/authentication/github/components/github-config-form.tsx

@@ -2,7 +2,7 @@ import { FC, useState } from "react";
 import { useForm } from "react-hook-form";
 import Link from "next/link";
 // hooks
-import { useInstance } from "@/hooks";
+import { useInstance } from "@/hooks/store";
 // ui
 import { Button, TOAST_TYPE, getButtonStyling, setToast } from "@plane/ui";
 // components

admin/app/authentication/github/components/root.tsx

@@ -4,7 +4,7 @@ import React from "react";
 import Link from "next/link";
 import { observer } from "mobx-react-lite";
 // hooks
-import { useInstance } from "@/hooks";
+import { useInstance } from "@/hooks/store";
 // ui
 import { ToggleSwitch, getButtonStyling } from "@plane/ui";
 // icons

admin/app/authentication/github/page.tsx

@@ -11,7 +11,7 @@ import { PageHeader } from "@/components/core";
 import { AuthenticationMethodCard } from "../components";
 import { InstanceGithubConfigForm } from "./components";
 // hooks
-import { useInstance } from "@/hooks";
+import { useInstance } from "@/hooks/store";
 // helpers
 import { resolveGeneralTheme } from "@/helpers/common.helper";
 // icons

admin/app/authentication/google/components/google-config-form.tsx

@@ -2,7 +2,7 @@ import { FC, useState } from "react";
 import { useForm } from "react-hook-form";
 import Link from "next/link";
 // hooks
-import { useInstance } from "@/hooks";
+import { useInstance } from "@/hooks/store";
 // ui
 import { Button, TOAST_TYPE, getButtonStyling, setToast } from "@plane/ui";
 // components

admin/app/authentication/google/components/root.tsx

@@ -4,7 +4,7 @@ import React from "react";
 import Link from "next/link";
 import { observer } from "mobx-react-lite";
 // hooks
-import { useInstance } from "@/hooks";
+import { useInstance } from "@/hooks/store";
 // ui
 import { ToggleSwitch, getButtonStyling } from "@plane/ui";
 // icons

admin/app/authentication/google/page.tsx

@@ -10,7 +10,7 @@ import { PageHeader } from "@/components/core";
 import { AuthenticationMethodCard } from "../components";
 import { InstanceGoogleConfigForm } from "./components";
 // hooks
-import { useInstance } from "@/hooks";
+import { useInstance } from "@/hooks/store";
 // icons
 import GoogleLogo from "@/public/logos/google-logo.svg";
 

admin/app/authentication/page.tsx

@@ -14,7 +14,7 @@ import { GoogleConfiguration } from "./google/components";
 import { GithubConfiguration } from "./github/components";
 import { PageHeader } from "@/components/core";
 // hooks
-import { useInstance } from "@/hooks";
+import { useInstance } from "@/hooks/store";
 // helpers
 import { resolveGeneralTheme } from "@/helpers/common.helper";
 // images

admin/app/email/components/email-config-form.tsx

@@ -1,7 +1,7 @@
 import React, { FC, useMemo, useState } from "react";
 import { useForm } from "react-hook-form";
 // hooks
-import { useInstance } from "@/hooks";
+import { useInstance } from "@/hooks/store";
 // ui
 import { Button, CustomSelect, TOAST_TYPE, setToast } from "@plane/ui";
 // components

admin/app/email/page.tsx

@@ -7,7 +7,7 @@ import { Loader } from "@plane/ui";
 import { PageHeader } from "@/components/core";
 import { InstanceEmailForm } from "./components";
 // hooks
-import { useInstance } from "@/hooks";
+import { useInstance } from "@/hooks/store";
 
 const InstanceEmailPage = observer(() => {
   // store

admin/app/general/components/general-config-form.tsx

@@ -6,7 +6,7 @@ import { Button, Input, TOAST_TYPE, ToggleSwitch, setToast } from "@plane/ui";
 // components
 import { ControllerInput } from "components/common";
 // hooks
-import { useInstance } from "@/hooks";
+import { useInstance } from "@/hooks/store";
 
 export interface IGeneralConfigurationForm {
   instance: IInstance["instance"];

admin/app/general/page.tsx

@@ -5,7 +5,7 @@ import { observer } from "mobx-react-lite";
 import { PageHeader } from "@/components/core";
 import { GeneralConfigurationForm } from "./components";
 // hooks
-import { useInstance } from "@/hooks";
+import { useInstance } from "@/hooks/store";
 
 const GeneralPage = observer(() => {
   const { instance, instanceAdmins } = useInstance();

admin/app/image/components/image-config-form.tsx

@@ -5,7 +5,7 @@ import { IFormattedInstanceConfiguration, TInstanceImageConfigurationKeys } from
 // components
 import { ControllerInput } from "components/common";
 // hooks
-import { useInstance } from "@/hooks";
+import { useInstance } from "@/hooks/store";
 
 type IInstanceImageConfigForm = {
   config: IFormattedInstanceConfiguration;

admin/app/image/page.tsx

@@ -7,7 +7,7 @@ import { Loader } from "@plane/ui";
 import { PageHeader } from "@/components/core";
 import { InstanceImageConfigForm } from "./components";
 // hooks
-import { useInstance } from "@/hooks";
+import { useInstance } from "@/hooks/store";
 
 const InstanceImagePage = observer(() => {
   // store

admin/app/layout.tsx

@@ -7,6 +7,8 @@ import { StoreProvider } from "@/lib/store-context";
 import { AppWrapper } from "@/lib/wrappers";
 // constants
 import { SITE_NAME, SITE_DESCRIPTION, SITE_URL, TWITTER_USER_NAME, SITE_KEYWORDS, SITE_TITLE } from "@/constants/seo";
+// helpers
+import { ASSET_PREFIX } from "@/helpers/common.helper";
 // styles
 import "./globals.css";
 
@@ -14,35 +16,31 @@ interface RootLayoutProps {
   children: ReactNode;
 }
 
-const RootLayout = ({ children, ...pageProps }: RootLayoutProps) => {
+const RootLayout = ({ children, ...pageProps }: RootLayoutProps) => (
-  const prefix = "/god-mode/";
+  <html lang="en">
-
+    <head>
-  return (
+      <title>{SITE_TITLE}</title>
-    <html lang="en">
+      <meta property="og:site_name" content={SITE_NAME} />
-      <head>
+      <meta property="og:title" content={SITE_TITLE} />
-        <title>{SITE_TITLE}</title>
+      <meta property="og:url" content={SITE_URL} />
-        <meta property="og:site_name" content={SITE_NAME} />
+      <meta name="description" content={SITE_DESCRIPTION} />
-        <meta property="og:title" content={SITE_TITLE} />
+      <meta property="og:description" content={SITE_DESCRIPTION} />
-        <meta property="og:url" content={SITE_URL} />
+      <meta name="keywords" content={SITE_KEYWORDS} />
-        <meta name="description" content={SITE_DESCRIPTION} />
+      <meta name="twitter:site" content={`@${TWITTER_USER_NAME}`} />
-        <meta property="og:description" content={SITE_DESCRIPTION} />
+      <link rel="apple-touch-icon" sizes="180x180" href={`${ASSET_PREFIX}/favicon/apple-touch-icon.png`} />
-        <meta name="keywords" content={SITE_KEYWORDS} />
+      <link rel="icon" type="image/png" sizes="32x32" href={`${ASSET_PREFIX}/favicon/favicon-32x32.png`} />
-        <meta name="twitter:site" content={`@${TWITTER_USER_NAME}`} />
+      <link rel="icon" type="image/png" sizes="16x16" href={`${ASSET_PREFIX}/favicon/favicon-16x16.png`} />
-        <link rel="apple-touch-icon" sizes="180x180" href={`${prefix}favicon/apple-touch-icon.png`} />
+      <link rel="manifest" href={`${ASSET_PREFIX}/site.webmanifest.json`} />
-        <link rel="icon" type="image/png" sizes="32x32" href={`${prefix}favicon/favicon-32x32.png`} />
+      <link rel="shortcut icon" href={`${ASSET_PREFIX}/favicon/favicon.ico`} />
-        <link rel="icon" type="image/png" sizes="16x16" href={`${prefix}favicon/favicon-16x16.png`} />
+    </head>
-        <link rel="manifest" href={`${prefix}site.webmanifest.json`} />
+    <body className={`antialiased`}>
-        <link rel="shortcut icon" href={`${prefix}favicon/favicon.ico`} />
+      <StoreProvider {...pageProps}>
-      </head>
+        <ThemeProvider themes={["light", "dark"]} defaultTheme="system" enableSystem>
-      <body className={`antialiased`}>
+          <AppWrapper>{children}</AppWrapper>
-        <StoreProvider {...pageProps}>
+        </ThemeProvider>
-          <ThemeProvider themes={["light", "dark"]} defaultTheme="system" enableSystem>
+      </StoreProvider>
-            <AppWrapper>{children}</AppWrapper>
+    </body>
-          </ThemeProvider>
+  </html>
-        </StoreProvider>
+);
-      </body>
-    </html>
-  );
-};
 
 export default RootLayout;

admin/components/admin-sidebar/help-section.tsx

@@ -7,7 +7,7 @@ import { Transition } from "@headlessui/react";
 import { ExternalLink, FileText, HelpCircle, MoveLeft } from "lucide-react";
 import { DiscordIcon, GithubIcon, Tooltip } from "@plane/ui";
 // hooks
-import { useInstance, useTheme } from "@/hooks";
+import { useInstance, useTheme } from "@/hooks/store";
 // assets
 import packageJson from "package.json";
 

admin/components/admin-sidebar/root.tsx

@@ -3,7 +3,7 @@
 import { FC, useEffect, useRef } from "react";
 import { observer } from "mobx-react-lite";
 // hooks
-import { useTheme } from "@/hooks";
+import { useTheme } from "@/hooks/store";
 import useOutsideClickDetector from "hooks/use-outside-click-detector";
 // components
 import { HelpSection, SidebarMenu, SidebarDropdown } from "@/components/admin-sidebar";

admin/components/admin-sidebar/sidebar-dropdown.tsx

@@ -7,7 +7,7 @@ import { LogOut, UserCog2, Palette } from "lucide-react";
 import { Menu, Transition } from "@headlessui/react";
 import { Avatar } from "@plane/ui";
 // hooks
-import { useTheme, useUser } from "@/hooks";
+import { useTheme, useUser } from "@/hooks/store";
 // helpers
 import { API_BASE_URL, cn } from "@/helpers/common.helper";
 // services

admin/components/admin-sidebar/sidebar-menu-hamburger-toogle.tsx

@@ -3,7 +3,7 @@
 import { FC } from "react";
 import { observer } from "mobx-react-lite";
 // hooks
-import { useTheme } from "@/hooks";
+import { useTheme } from "@/hooks/store";
 // icons
 import { Menu } from "lucide-react";
 

admin/components/admin-sidebar/sidebar-menu.tsx

@@ -6,7 +6,7 @@ import { observer } from "mobx-react-lite";
 import { Image, BrainCog, Cog, Lock, Mail } from "lucide-react";
 import { Tooltip } from "@plane/ui";
 // hooks
-import { useTheme } from "@/hooks";
+import { useTheme } from "@/hooks/store";
 // helpers
 import { cn } from "@/helpers/common.helper";
 

admin/components/new-user-popup.tsx

@@ -9,7 +9,7 @@ import { Button, getButtonStyling } from "@plane/ui";
 // helpers
 import { resolveGeneralTheme } from "helpers/common.helper";
 // hooks
-import { useInstance, useTheme } from "@/hooks";
+import { useInstance, useTheme } from "@/hooks/store";
 // icons
 import TakeoffIconLight from "/public/logos/takeoff-icon-light.svg";
 import TakeoffIconDark from "/public/logos/takeoff-icon-dark.svg";

admin/helpers/common.helper.ts

@@ -1,7 +1,16 @@
 import { clsx, type ClassValue } from "clsx";
 import { twMerge } from "tailwind-merge";
 
-export const API_BASE_URL = process.env.NEXT_PUBLIC_API_BASE_URL ? process.env.NEXT_PUBLIC_API_BASE_URL : "";
+export const API_BASE_URL = process.env.NEXT_PUBLIC_API_BASE_URL || "";
+
+export const ADMIN_BASE_PATH = process.env.NEXT_PUBLIC_ADMIN_BASE_PATH || "";
+
+export const SPACE_BASE_URL = process.env.NEXT_PUBLIC_SPACE_BASE_URL || "";
+export const SPACE_BASE_PATH = process.env.NEXT_PUBLIC_SPACE_BASE_PATH || "";
+
+export const WEB_BASE_URL = process.env.NEXT_PUBLIC_WEB_BASE_URL || "";
+
+export const ASSET_PREFIX = ADMIN_BASE_PATH;
 
 export const cn = (...inputs: ClassValue[]) => twMerge(clsx(inputs));
 

admin/hooks/index.ts

@@ -1,6 +0,0 @@
-export * from "./use-outside-click-detector";
-
-// store-hooks
-export * from "./store/use-theme";
-export * from "./store/use-instance";
-export * from "./store/use-user";

admin/hooks/store/index.ts

@@ -0,0 +1,3 @@
+export * from "./use-theme";
+export * from "./use-instance";
+export * from "./use-user";

admin/lib/wrappers/app-wrapper.tsx

@@ -4,11 +4,11 @@ import { FC, ReactNode, useEffect, Suspense } from "react";
 import { observer } from "mobx-react-lite";
 import { SWRConfig } from "swr";
 // hooks
-import { useTheme, useUser } from "@/hooks";
+import { useTheme, useUser } from "@/hooks/store";
 // ui
 import { Toast } from "@plane/ui";
 // constants
-import { SWR_CONFIG } from "constants/swr-config";
+import { SWR_CONFIG } from "@/constants/swr-config";
 // helpers
 import { resolveGeneralTheme } from "helpers/common.helper";
 

admin/lib/wrappers/auth-wrapper.tsx

@@ -6,7 +6,7 @@ import { observer } from "mobx-react-lite";
 import useSWR from "swr";
 import { Spinner } from "@plane/ui";
 // hooks
-import { useInstance, useUser } from "@/hooks";
+import { useInstance, useUser } from "@/hooks/store";
 // helpers
 import { EAuthenticationPageType } from "@/helpers";
 

admin/lib/wrappers/instance-wrapper.tsx

@@ -10,7 +10,7 @@ import { DefaultLayout } from "@/layouts";
 // components
 import { InstanceNotReady } from "@/components/instance";
 // hooks
-import { useInstance } from "@/hooks";
+import { useInstance } from "@/hooks/store";
 // helpers
 import { EInstancePageType } from "@/helpers";
 
@@ -28,6 +28,9 @@ export const InstanceWrapper: FC<TInstanceWrapper> = observer((props) => {
 
   const { isLoading: isSWRLoading } = useSWR("INSTANCE_INFORMATION", () => fetchInstanceInfo(), {
     revalidateOnFocus: false,
+    revalidateIfStale: false,
+    revalidateOnReconnect: false,
+    errorRetryCount: 0,
   });
 
   if (isSWRLoading || isLoading)
@@ -37,6 +40,10 @@ export const InstanceWrapper: FC<TInstanceWrapper> = observer((props) => {
       </div>
     );
 
+  if (!instance) {
+    return <>Something went wrong</>;
+  }
+
   if (instance?.instance?.is_setup_done === false && authEnabled === "1")
     return (
       <DefaultLayout withoutBackground>

admin/package.json

@@ -4,7 +4,7 @@
   "private": true,
   "scripts": {
     "dev": "turbo run develop",
-    "develop": "next dev --port 3333",
+    "develop": "next dev --port 3001",
     "build": "next build",
     "preview": "next build && next start",
     "start": "next start",

admin/services/instance.service.ts

@@ -1,8 +1,8 @@
-import { APIService } from "services/api.service";
 // types
 import type { IFormattedInstanceConfiguration, IInstance, IInstanceAdmin, IInstanceConfiguration } from "@plane/types";
 // helpers
-import { API_BASE_URL } from "helpers/common.helper";
+import { API_BASE_URL } from "@/helpers/common.helper";
+import { APIService } from "@/services/api.service";
 
 export class InstanceService extends APIService {
   constructor() {

space/helpers/common.helper.ts

@@ -1,6 +1,12 @@
 import { clsx, type ClassValue } from "clsx";
 import { twMerge } from "tailwind-merge";
 
-export const API_BASE_URL = process.env.NEXT_PUBLIC_API_BASE_URL ?? "";
+export const API_BASE_URL = process.env.NEXT_PUBLIC_API_BASE_URL || "";
+
+export const SPACE_BASE_PATH = process.env.NEXT_PUBLIC_SPACE_BASE_PATH || "";
+
+export const WEB_BASE_URL = process.env.NEXT_PUBLIC_WEB_BASE_URL || "";
+
+export const ASSET_PREFIX = SPACE_BASE_PATH;
 
 export const cn = (...inputs: ClassValue[]) => twMerge(clsx(inputs));

space/package.json

@@ -4,9 +4,9 @@
   "private": true,
   "scripts": {
     "dev": "turbo run develop",
-    "develop": "next dev -p 4000",
+    "develop": "next dev -p 3002",
     "build": "next build",
-    "start": "next start -p 4000",
+    "start": "next start",
     "lint": "next lint",
     "export": "next export"
   },

space/pages/onboarding/index.tsx

@@ -9,6 +9,7 @@ import { Avatar } from "@plane/ui";
 import { OnBoardingForm } from "@/components/accounts/onboarding-form";
 // helpers
 import { EPageTypes } from "@/helpers/authentication.helper";
+import { ASSET_PREFIX } from "@/helpers/common.helper";
 // hooks
 import { useUser, useUserProfile } from "@/hooks/store";
 // wrappers
@@ -17,8 +18,6 @@ import { AuthWrapper } from "@/lib/wrappers";
 import ProfileSetupDark from "public/onboarding/profile-setup-dark.svg";
 import ProfileSetup from "public/onboarding/profile-setup.svg";
 
-const imagePrefix = process.env.NEXT_PUBLIC_SPACE_BASE_PATH || "";
-
 const OnBoardingPage = observer(() => {
   // router
   const router = useRouter();
@@ -60,7 +59,7 @@ const OnBoardingPage = observer(() => {
             <div className="flex w-full items-center justify-between font-semibold ">
               <div className="flex items-center gap-x-2">
                 <Image
-                  src={`${imagePrefix}/plane-logos/blue-without-text.png`}
+                  src={`${ASSET_PREFIX}/plane-logos/blue-without-text.png`}
                   height={30}
                   width={30}
                   alt="Plane Logo"

web/Dockerfile.web

@@ -36,13 +36,13 @@ ENV NEXT_PUBLIC_API_BASE_URL=$NEXT_PUBLIC_API_BASE_URL
 ARG NEXT_PUBLIC_ADMIN_BASE_URL=""
 ENV NEXT_PUBLIC_ADMIN_BASE_URL=$NEXT_PUBLIC_ADMIN_BASE_URL
 
-ARG NEXT_PUBLIC_ADMIN_BASE_PATH=""
+ARG NEXT_PUBLIC_ADMIN_BASE_PATH="/god-mode"
 ENV NEXT_PUBLIC_ADMIN_BASE_PATH=$NEXT_PUBLIC_ADMIN_BASE_PATH
 
 ARG NEXT_PUBLIC_SPACE_BASE_URL=""
 ENV NEXT_PUBLIC_SPACE_BASE_URL=$NEXT_PUBLIC_SPACE_BASE_URL
 
-ARG NEXT_PUBLIC_SPACE_BASE_PATH=""
+ARG NEXT_PUBLIC_SPACE_BASE_PATH="/spaces"
 ENV NEXT_PUBLIC_SPACE_BASE_PATH=$NEXT_PUBLIC_SPACE_BASE_PATH
 
 ENV NEXT_TELEMETRY_DISABLED 1
@@ -71,13 +71,13 @@ ENV NEXT_PUBLIC_API_BASE_URL=$NEXT_PUBLIC_API_BASE_URL
 ARG NEXT_PUBLIC_ADMIN_BASE_URL=""
 ENV NEXT_PUBLIC_ADMIN_BASE_URL=$NEXT_PUBLIC_ADMIN_BASE_URL
 
-ARG NEXT_PUBLIC_ADMIN_BASE_PATH=""
+ARG NEXT_PUBLIC_ADMIN_BASE_PATH="/god-mode"
 ENV NEXT_PUBLIC_ADMIN_BASE_PATH=$NEXT_PUBLIC_ADMIN_BASE_PATH
 
 ARG NEXT_PUBLIC_SPACE_BASE_URL=""
 ENV NEXT_PUBLIC_SPACE_BASE_URL=$NEXT_PUBLIC_SPACE_BASE_URL
 
-ARG NEXT_PUBLIC_SPACE_BASE_PATH=""
+ARG NEXT_PUBLIC_SPACE_BASE_PATH="/spaces"
 ENV NEXT_PUBLIC_SPACE_BASE_PATH=$NEXT_PUBLIC_SPACE_BASE_PATH
 
 ENV NEXT_TELEMETRY_DISABLED 1

web/components/instance/not-ready-view.tsx

@@ -1,20 +1,14 @@
 import { FC } from "react";
-import { observer } from "mobx-react";
 import Image from "next/image";
 import { Button } from "@plane/ui";
 // helpers
 import { ADMIN_BASE_URL, ADMIN_BASE_PATH } from "@/helpers/common.helper";
-// hooks
-// import { useInstance } from "@/hooks/store";
 // images
 import PlaneTakeOffImage from "@/public/plane-takeoff.png";
 import BluePlaneLogoWithoutText from "public/plane-logos/blue-without-text.png";
 
-export const InstanceNotReady: FC = observer(() => {
+export const InstanceNotReady: FC = () => {
-  // hooks
+  const GOD_MODE_URL = encodeURI(ADMIN_BASE_URL + ADMIN_BASE_PATH + "/setup/?auth_enabled=0");
-  // const { instance } = useInstance();
-
-  const GOD_MODE_URL = encodeURI(ADMIN_BASE_URL + ADMIN_BASE_PATH + "setup/?auth_enabled=0");
 
   return (
     <div className="relative h-screen max-h-max w-full overflow-hidden overflow-y-auto flex flex-col">
@@ -48,4 +42,4 @@ export const InstanceNotReady: FC = observer(() => {
       </div>
     </div>
   );
-});
+};