fix edit and create project (#2723)

app/providers.tsx

@@ -4,7 +4,6 @@ import { NextUIProvider } from "@nextui-org/react";
 import { ClientBootstrapProvider } from "core/bootstrap/client-bootstrap-context";
 import { InitBootstrapAuth } from "core/bootstrap/init-bootstrap-auth";
 import { InitBootstrapImpersonation } from "core/bootstrap/init-bootstrap-impersonation";
-import { NavigationStateProvider } from "providers/navigation-state/navigation-state";
 import { PropsWithChildren } from "react";
 import { useMediaQuery } from "usehooks-ts";
 
@@ -37,21 +36,19 @@ export default function Providers({ children }: PropsWithChildren) {
               <QueryProvider>
                 <NextUIProvider>
                   <OnboardingProvider>
-                    <NavigationStateProvider>
-                      <StackProvider>
-                        <SidePanelStackProvider>
-                          <ToasterProvider>
-                            <ToasterAtom />
-                            <InitBootstrapImpersonation />
-                            <InitBootstrapAuth />
-                            <Stacks />
-                            <Toaster />
-                            {/* Hide tooltips on mobile */ isSm && <Tooltip />}
-                            {children}
-                          </ToasterProvider>
-                        </SidePanelStackProvider>
-                      </StackProvider>
-                    </NavigationStateProvider>
+                    <StackProvider>
+                      <SidePanelStackProvider>
+                        <ToasterProvider>
+                          <ToasterAtom />
+                          <InitBootstrapImpersonation />
+                          <InitBootstrapAuth />
+                          <Stacks />
+                          <Toaster />
+                          {/* Hide tooltips on mobile */ isSm && <Tooltip />}
+                          {children}
+                        </ToasterProvider>
+                      </SidePanelStackProvider>
+                    </StackProvider>
                   </OnboardingProvider>
                 </NextUIProvider>
               </QueryProvider>

components/layout/base-link/base-link.tsx

@@ -1,7 +1,6 @@
 "use client";
 
 import NextLink from "next/link";
-import { useNavigationState } from "providers/navigation-state/navigation-state";
 import { MouseEvent } from "react";
 
 import { cn } from "src/utils/cn";
@@ -20,9 +19,6 @@ export function BaseLink({
   onClick,
   ...props
 }: TBaseLink.Props) {
-  const { block } = useNavigationState();
-  const [shouldBlock] = block.state;
-  const [, setConfirmation] = block.confirmation;
   const isExternal = href?.toString()?.startsWith("http") ?? false;
   const isActive = useMatchPath(String(matchPathOptions?.pattern || href), matchPathOptions);
 
@@ -33,11 +29,6 @@ export function BaseLink({
   const relProps = rel || relExternal;
 
   function handleClick(event: MouseEvent<HTMLAnchorElement>) {
-    if (shouldBlock) {
-      event.preventDefault();
-      setConfirmation(true, event.currentTarget.pathname);
-      return;
-    }
     onClick?.(event);
   }
 

src/_pages/ProjectCreation/ProjectCreation.context.tsx

@@ -53,6 +53,7 @@ type CreateProject = {
   installedRepos: number[];
   organizations: UseGithubOrganizationsResponse[];
   organizationsLoading: boolean;
+  isSubmitting: boolean;
   PoolingFeedback: React.ReactElement;
   ecosystems: TSelectAutocomplete.Item[];
   projectCategories: TSelectAutocomplete.Item[];
@@ -76,6 +77,7 @@ export const CreateProjectContext = createContext<CreateProject>({
   projectCategories: [],
   organizations: [],
   organizationsLoading: false,
+  isSubmitting: false,
   PoolingFeedback: <></>,
   helpers: {
     saveInSession: () => null,
@@ -334,6 +336,7 @@ export function CreateProjectProvider({
         organizationsLoading: isLoading && !organizationsData?.length,
         organizations: (organizationsData || []).sort((a, b) => a.login.localeCompare(b.login)),
         PoolingFeedback,
+        isSubmitting: restCreateProjectMutation.isPending || form.formState.isSubmitting,
         helpers: {
           saveInSession: onSaveInSession,
           goTo,

src/_pages/ProjectCreation/views/ProjectInformations/ProjectInformations.tsx

@@ -12,6 +12,7 @@ import { FieldInput } from "src/components/New/Field/Input";
 import { FieldSwitch } from "src/components/New/Field/Switch";
 import { FieldTextarea } from "src/components/New/Field/Textarea";
 import { Flex } from "src/components/New/Layout/Flex";
+import { Spinner } from "src/components/Spinner/Spinner";
 import CheckLine from "src/icons/CheckLine";
 import InformationLine from "src/icons/InformationLine";
 
@@ -28,6 +29,7 @@ export const ProjectInformationsPage = () => {
     form,
     ecosystems,
     projectCategories,
+    isSubmitting,
     helpers: { prev },
   } = useContext(CreateProjectContext);
   const suggested = form?.watch("categorySuggestions") || [];
@@ -52,10 +54,11 @@ export const ProjectInformationsPage = () => {
         <Button
           htmlType="submit"
           onBackground={ButtonOnBackground.Blue}
-          disabled={!form.formState?.isValid || form.formState.isSubmitting}
+          disabled={!form.formState?.isValid || isSubmitting}
           className="w-full md:w-auto"
         >
-          <CheckLine className="-ml-1 text-2xl" /> {T("common.publish")}
+          {isSubmitting ? <Spinner /> : <CheckLine className="-ml-1 text-2xl" />}
+          {T("common.publish")}
         </Button>
       }
       prev={prev}

src/_pages/ProjectDetails/ProjectEdition/EditContext.tsx

@@ -26,7 +26,6 @@ import { NEXT_ROUTER } from "constants/router";
 import { useIntl } from "hooks/translate/use-translate";
 
 import { useProjectDetailsLastAddedRepoStorage } from "../hooks/useProjectDetailsStorage";
-import { ConfirmationModal } from "./components/ConfirmationModal/ConfirmationModal";
 import { EditPanelProvider } from "./components/Panel/context";
 import { useEditValidationSchema } from "./hooks/useValidationSchema";
 
@@ -303,14 +302,17 @@ export function EditProvider({ children, project }: EditContextProps) {
         // Replace the current path on the history stack if different
 
         if (data.projectSlug !== project.slug) {
-          const newPathname = NEXT_ROUTER.projects.details.edit(data.projectSlug);
+          const newPathname = NEXT_ROUTER.projects.details.root(data.projectSlug);
 
           // Navigate before invalidating queries so the new data can use the updated params
-          router.replace(newPathname, { scroll: false });
+          router.push(newPathname);
 
           queryClient.invalidateQueries({ queryKey: MeApi.tags.all });
+          queryClient.invalidateQueries({ queryKey: ProjectApi.tags.detail_by_slug(data.projectSlug) });
+        } else {
+          queryClient.invalidateQueries({ queryKey: ProjectApi.tags.detail_by_slug(data.projectSlug) });
+          router.push(NEXT_ROUTER.projects.details.root(project.slug));
         }
-        queryClient.invalidateQueries({ queryKey: ProjectApi.tags.detail_by_slug(data.projectSlug) });
       },
     },
   });
@@ -378,7 +380,6 @@ export function EditProvider({ children, project }: EditContextProps) {
         <form onSubmit={form.handleSubmit(onSubmit)} className="h-full overflow-hidden">
           {children}
         </form>
-        <ConfirmationModal />
       </EditPanelProvider>
     </EditContext.Provider>
   );