chore: upgrade to Next 15

apps/admin/app/(all)/(dashboard)/ai/form.tsx

@@ -1,5 +1,4 @@
 "use client";
-import { FC } from "react";
 import { useForm } from "react-hook-form";
 import { Lightbulb } from "lucide-react";
 import { IFormattedInstanceConfiguration, TInstanceAIConfigurationKeys } from "@plane/types";
@@ -15,7 +14,7 @@ type IInstanceAIForm = {
 
 type AIFormValues = Record<TInstanceAIConfigurationKeys, string>;
 
-export const InstanceAIForm: FC<IInstanceAIForm> = (props) => {
+export const InstanceAIForm: React.FC<IInstanceAIForm> = (props) => {
   const { config } = props;
   // store
   const { updateInstanceConfigurations } = useInstance();

apps/admin/app/(all)/(dashboard)/ai/layout.tsx

@@ -1,10 +1,9 @@
-import { ReactNode } from "react";
 import { Metadata } from "next";
 
 export const metadata: Metadata = {
   title: "Artificial Intelligence Settings - God Mode",
 };
 
-export default function AILayout({ children }: { children: ReactNode }) {
+export default function AILayout({ children }: { children: React.ReactNode }) {
   return <>{children}</>;
 }

apps/admin/app/(all)/(dashboard)/authentication/github/form.tsx

@@ -1,6 +1,6 @@
 "use client";
 
-import { FC, useState } from "react";
+import { useState } from "react";
 import isEmpty from "lodash/isEmpty";
 import Link from "next/link";
 import { useForm } from "react-hook-form";
@@ -23,7 +23,7 @@ type Props = {
 
 type GithubConfigFormValues = Record<TInstanceGithubAuthenticationConfigurationKeys, string>;
 
-export const InstanceGithubConfigForm: FC<Props> = (props) => {
+export const InstanceGithubConfigForm: React.FC<Props> = (props) => {
   const { config } = props;
   // states
   const [isDiscardChangesModalOpen, setIsDiscardChangesModalOpen] = useState(false);

apps/admin/app/(all)/(dashboard)/authentication/github/layout.tsx

@@ -1,10 +1,9 @@
-import { ReactNode } from "react";
 import { Metadata } from "next";
 
 export const metadata: Metadata = {
   title: "GitHub Authentication - God Mode",
 };
 
-export default function GitHubAuthenticationLayout({ children }: { children: ReactNode }) {
+export default function GitHubAuthenticationLayout({ children }: { children: React.ReactNode }) {
   return <>{children}</>;
 }

apps/admin/app/(all)/(dashboard)/authentication/gitlab/form.tsx

@@ -1,4 +1,4 @@
-import { FC, useState } from "react";
+import { useState } from "react";
 import isEmpty from "lodash/isEmpty";
 import Link from "next/link";
 import { useForm } from "react-hook-form";
@@ -21,7 +21,7 @@ type Props = {
 
 type GitlabConfigFormValues = Record<TInstanceGitlabAuthenticationConfigurationKeys, string>;
 
-export const InstanceGitlabConfigForm: FC<Props> = (props) => {
+export const InstanceGitlabConfigForm: React.FC<Props> = (props) => {
   const { config } = props;
   // states
   const [isDiscardChangesModalOpen, setIsDiscardChangesModalOpen] = useState(false);

apps/admin/app/(all)/(dashboard)/authentication/gitlab/layout.tsx

@@ -1,10 +1,9 @@
-import { ReactNode } from "react";
 import { Metadata } from "next";
 
 export const metadata: Metadata = {
   title: "GitLab Authentication - God Mode",
 };
 
-export default function GitlabAuthenticationLayout({ children }: { children: ReactNode }) {
+export default function GitlabAuthenticationLayout({ children }: { children: React.ReactNode }) {
   return <>{children}</>;
 }

apps/admin/app/(all)/(dashboard)/authentication/google/form.tsx

@@ -1,5 +1,5 @@
 "use client";
-import { FC, useState } from "react";
+import { useState } from "react";
 import isEmpty from "lodash/isEmpty";
 import Link from "next/link";
 import { useForm } from "react-hook-form";
@@ -22,7 +22,7 @@ type Props = {
 
 type GoogleConfigFormValues = Record<TInstanceGoogleAuthenticationConfigurationKeys, string>;
 
-export const InstanceGoogleConfigForm: FC<Props> = (props) => {
+export const InstanceGoogleConfigForm: React.FC<Props> = (props) => {
   const { config } = props;
   // states
   const [isDiscardChangesModalOpen, setIsDiscardChangesModalOpen] = useState(false);

apps/admin/app/(all)/(dashboard)/authentication/google/layout.tsx

@@ -1,10 +1,9 @@
-import { ReactNode } from "react";
 import { Metadata } from "next";
 
 export const metadata: Metadata = {
   title: "Google Authentication - God Mode",
 };
 
-export default function GoogleAuthenticationLayout({ children }: { children: ReactNode }) {
+export default function GoogleAuthenticationLayout({ children }: { children: React.ReactNode }) {
   return <>{children}</>;
 }

apps/admin/app/(all)/(dashboard)/authentication/layout.tsx

@@ -1,10 +1,9 @@
-import { ReactNode } from "react";
 import { Metadata } from "next";
 
 export const metadata: Metadata = {
   title: "Authentication Settings - Plane Web",
 };
 
-export default function AuthenticationLayout({ children }: { children: ReactNode }) {
+export default function AuthenticationLayout({ children }: { children: React.ReactNode }) {
   return <>{children}</>;
 }

apps/admin/app/(all)/(dashboard)/email/email-config-form.tsx

@@ -1,6 +1,6 @@
 "use client";
 
-import React, { FC, useMemo, useState } from "react";
+import { useMemo, useState } from "react";
 import { useForm } from "react-hook-form";
 // types
 import { IFormattedInstanceConfiguration, TInstanceEmailConfigurationKeys } from "@plane/types";
@@ -27,7 +27,7 @@ const EMAIL_SECURITY_OPTIONS: { [key in TEmailSecurityKeys]: string } = {
   NONE: "No email security",
 };
 
-export const InstanceEmailForm: FC<IInstanceEmailForm> = (props) => {
+export const InstanceEmailForm: React.FC<IInstanceEmailForm> = (props) => {
   const { config } = props;
   // states
   const [isSendTestEmailModalOpen, setIsSendTestEmailModalOpen] = useState(false);

apps/admin/app/(all)/(dashboard)/email/layout.tsx

@@ -1,8 +1,7 @@
-import { ReactNode } from "react";
 import { Metadata } from "next";
 
 interface EmailLayoutProps {
-  children: ReactNode;
+  children: React.ReactNode;
 }
 
 export const metadata: Metadata = {

apps/admin/app/(all)/(dashboard)/email/test-email-modal.tsx

@@ -1,4 +1,4 @@
-import React, { FC, useEffect, useState } from "react";
+import { Fragment, useEffect, useState } from "react";
 import { Dialog, Transition } from "@headlessui/react";
 // plane imports
 import { InstanceService } from "@plane/services";
@@ -18,7 +18,7 @@ enum ESendEmailSteps {
 
 const instanceService = new InstanceService();
 
-export const SendTestEmailModal: FC<Props> = (props) => {
+export const SendTestEmailModal: React.FC<Props> = (props) => {
   const { isOpen, handleClose } = props;
 
   // state
@@ -60,10 +60,10 @@ export const SendTestEmailModal: FC<Props> = (props) => {
   };
 
   return (
-    <Transition.Root show={isOpen} as={React.Fragment}>
+    <Transition.Root show={isOpen} as={Fragment}>
       <Dialog as="div" className="relative z-20" onClose={handleClose}>
         <Transition.Child
-          as={React.Fragment}
+          as={Fragment}
           enter="ease-out duration-300"
           enterFrom="opacity-0"
           enterTo="opacity-100"
@@ -76,7 +76,7 @@ export const SendTestEmailModal: FC<Props> = (props) => {
         <div className="fixed inset-0 z-20 overflow-y-auto">
           <div className="my-10 flex justify-center p-4 text-center sm:p-0 md:my-20">
             <Transition.Child
-              as={React.Fragment}
+              as={Fragment}
               enter="ease-out duration-300"
               enterFrom="opacity-0 translate-y-4 sm:translate-y-0 sm:scale-95"
               enterTo="opacity-100 translate-y-0 sm:scale-100"

apps/admin/app/(all)/(dashboard)/general/form.tsx

@@ -1,5 +1,4 @@
 "use client";
-import { FC } from "react";
 import { observer } from "mobx-react";
 import { Controller, useForm } from "react-hook-form";
 import { Telescope } from "lucide-react";
@@ -18,7 +17,7 @@ export interface IGeneralConfigurationForm {
   instanceAdmins: IInstanceAdmin[];
 }
 
-export const GeneralConfigurationForm: FC<IGeneralConfigurationForm> = observer((props) => {
+export const GeneralConfigurationForm: React.FC<IGeneralConfigurationForm> = observer((props) => {
   const { instance, instanceAdmins } = props;
   // hooks
   const { instanceConfigurations, updateInstanceInfo, updateInstanceConfigurations } = useInstance();

apps/admin/app/(all)/(dashboard)/general/intercom.tsx

@@ -1,6 +1,6 @@
 "use client";
 
-import { FC, useState } from "react";
+import { useState } from "react";
 import { observer } from "mobx-react";
 import useSWR from "swr";
 import { MessageSquare } from "lucide-react";
@@ -13,7 +13,7 @@ type TIntercomConfig = {
   isTelemetryEnabled: boolean;
 };
 
-export const IntercomConfig: FC<TIntercomConfig> = observer((props) => {
+export const IntercomConfig: React.FC<TIntercomConfig> = observer((props) => {
   const { isTelemetryEnabled } = props;
   // hooks
   const { instanceConfigurations, updateInstanceConfigurations, fetchInstanceConfigurations } = useInstance();

apps/admin/app/(all)/(dashboard)/general/layout.tsx

@@ -1,10 +1,9 @@
-import { ReactNode } from "react";
 import { Metadata } from "next";
 
 export const metadata: Metadata = {
   title: "General Settings - God Mode",
 };
 
-export default function GeneralLayout({ children }: { children: ReactNode }) {
+export default function GeneralLayout({ children }: { children: React.ReactNode }) {
   return <>{children}</>;
 }

apps/admin/app/(all)/(dashboard)/header.tsx

@@ -1,6 +1,5 @@
 "use client";
 
-import { FC } from "react";
 import { observer } from "mobx-react";
 import { usePathname } from "next/navigation";
 import { Menu, Settings } from "lucide-react";
@@ -11,7 +10,7 @@ import { BreadcrumbLink } from "@/components/common/breadcrumb-link";
 // hooks
 import { useTheme } from "@/hooks/store";
 
-export const HamburgerToggle: FC = observer(() => {
+export const HamburgerToggle: React.FC = observer(() => {
   const { isSidebarCollapsed, toggleSidebar } = useTheme();
   return (
     <div
@@ -23,7 +22,7 @@ export const HamburgerToggle: FC = observer(() => {
   );
 });
 
-export const AdminHeader: FC = observer(() => {
+export const AdminHeader: React.FC = observer(() => {
   const pathName = usePathname();
 
   const getHeaderTitle = (pathName: string) => {

apps/admin/app/(all)/(dashboard)/image/form.tsx

@@ -1,5 +1,4 @@
 "use client";
-import { FC } from "react";
 import { useForm } from "react-hook-form";
 import { IFormattedInstanceConfiguration, TInstanceImageConfigurationKeys } from "@plane/types";
 import { Button, TOAST_TYPE, setToast } from "@plane/ui";
@@ -14,7 +13,7 @@ type IInstanceImageConfigForm = {
 
 type ImageConfigFormValues = Record<TInstanceImageConfigurationKeys, string>;
 
-export const InstanceImageConfigForm: FC<IInstanceImageConfigForm> = (props) => {
+export const InstanceImageConfigForm: React.FC<IInstanceImageConfigForm> = (props) => {
   const { config } = props;
   // store hooks
   const { updateInstanceConfigurations } = useInstance();

apps/admin/app/(all)/(dashboard)/image/layout.tsx

@@ -1,8 +1,7 @@
-import { ReactNode } from "react";
 import { Metadata } from "next";
 
 interface ImageLayoutProps {
-  children: ReactNode;
+  children: React.ReactNode;
 }
 
 export const metadata: Metadata = {

apps/admin/app/(all)/(dashboard)/layout.tsx

@@ -1,6 +1,6 @@
 "use client";
 
-import { FC, ReactNode, useEffect } from "react";
+import { useEffect } from "react";
 import { observer } from "mobx-react";
 import { useRouter } from "next/navigation";
 // components
@@ -13,10 +13,10 @@ import { AdminHeader } from "./header";
 import { AdminSidebar } from "./sidebar";
 
 type TAdminLayout = {
-  children: ReactNode;
+  children: React.ReactNode;
 };
 
-const AdminLayout: FC<TAdminLayout> = (props) => {
+const AdminLayout: React.FC<TAdminLayout> = (props) => {
   const { children } = props;
   // router
   const router = useRouter();

apps/admin/app/(all)/(dashboard)/sidebar-help-section.tsx

@@ -1,6 +1,6 @@
 "use client";
 
-import { FC, useState, useRef } from "react";
+import { useState, useRef } from "react";
 import { observer } from "mobx-react";
 import Link from "next/link";
 import { ExternalLink, FileText, HelpCircle, MoveLeft } from "lucide-react";
@@ -34,7 +34,7 @@ const helpOptions = [
   },
 ];
 
-export const AdminSidebarHelpSection: FC = observer(() => {
+export const AdminSidebarHelpSection: React.FC = observer(() => {
   // states
   const [isNeedHelpOpen, setIsNeedHelpOpen] = useState(false);
   // store

apps/admin/app/(all)/(dashboard)/sidebar.tsx

@@ -1,6 +1,6 @@
 "use client";
 
-import { FC, useEffect, useRef } from "react";
+import { useEffect, useRef } from "react";
 import { observer } from "mobx-react";
 // plane helpers
 import { useOutsideClickDetector } from "@plane/hooks";
@@ -11,7 +11,7 @@ import { AdminSidebarDropdown } from "./sidebar-dropdown";
 import { AdminSidebarHelpSection } from "./sidebar-help-section";
 import { AdminSidebarMenu } from "./sidebar-menu";
 
-export const AdminSidebar: FC = observer(() => {
+export const AdminSidebar: React.FC = observer(() => {
   // store
   const { isSidebarCollapsed, toggleSidebar } = useTheme();
 

apps/admin/app/(all)/(dashboard)/workspace/layout.tsx

@@ -1,10 +1,9 @@
-import { ReactNode } from "react";
 import { Metadata } from "next";
 
 export const metadata: Metadata = {
   title: "Workspace Management - God Mode",
 };
 
-export default function WorkspaceManagementLayout({ children }: { children: ReactNode }) {
+export default function WorkspaceManagementLayout({ children }: { children: React.ReactNode }) {
   return <>{children}</>;
 }

apps/admin/app/(all)/(home)/auth-banner.tsx

@@ -1,4 +1,3 @@
-import { FC } from "react";
 import { Info, X } from "lucide-react";
 // plane constants
 import { TAdminAuthErrorInfo } from "@plane/constants";
@@ -8,7 +7,7 @@ type TAuthBanner = {
   handleBannerData?: (bannerData: TAdminAuthErrorInfo | undefined) => void;
 };
 
-export const AuthBanner: FC<TAuthBanner> = (props) => {
+export const AuthBanner: React.FC<TAuthBanner> = (props) => {
   const { bannerData, handleBannerData } = props;
 
   if (!bannerData) return <></>;

apps/admin/app/(all)/(home)/auth-helpers.tsx

@@ -1,4 +1,3 @@
-import { ReactNode } from "react";
 import Image from "next/image";
 import Link from "next/link";
 import { KeyRound, Mails } from "lucide-react";
@@ -27,7 +26,7 @@ export enum EErrorAlertType {
 }
 
 const errorCodeMessages: {
-  [key in EAdminAuthErrorCodes]: { title: string; message: (email?: string | undefined) => ReactNode };
+  [key in EAdminAuthErrorCodes]: { title: string; message: (email?: string | undefined) => React.ReactNode };
 } = {
   // admin
   [EAdminAuthErrorCodes.ADMIN_ALREADY_EXIST]: {

apps/admin/app/(all)/(home)/sign-in-form.tsx

@@ -1,6 +1,6 @@
 "use client";
 
-import { FC, useEffect, useMemo, useState } from "react";
+import { useEffect, useMemo, useState } from "react";
 import { useSearchParams } from "next/navigation";
 import { Eye, EyeOff } from "lucide-react";
 // plane internal packages
@@ -43,7 +43,7 @@ const defaultFromData: TFormData = {
   password: "",
 };
 
-export const InstanceSignInForm: FC = () => {
+export const InstanceSignInForm: React.FC = () => {
   // search params
   const searchParams = useSearchParams();
   const emailParam = searchParams.get("email") || undefined;