Merge branch 'main' into feat/cursor-pagination

apps/client/src/features/page/components/page-import-modal.tsx

@@ -172,6 +172,10 @@ function ImportFormatSelection({ spaceId, onClose }: ImportFormatSelection) {
             queryKey: ["root-sidebar-pages", fileTask.spaceId],
           });
 
+          await queryClient.invalidateQueries({
+            queryKey: ["recent-changes", fileTask.spaceId],
+          });
+
           setTimeout(() => {
             emit({
               operation: "refetchRootTreeNodeEvent",

apps/client/src/features/page/queries/page-query.ts

@@ -163,9 +163,6 @@ export function useDeletePageMutation() {
 export function useMovePageMutation() {
   return useMutation<void, Error, IMovePage>({
     mutationFn: (data) => movePage(data),
-    onSuccess: () => {
-      invalidateOnMovePage();
-    },
   });
 }
 
@@ -454,17 +451,127 @@ export function invalidateOnUpdatePage(
   });
 }
 
-export function invalidateOnMovePage() {
-  //for move invalidate all sidebars for now (how to do???)
-  //invalidate all root sidebar pages
-  queryClient.invalidateQueries({
-    queryKey: ["root-sidebar-pages"],
-  });
-  //invalidate all sub sidebar pages
-  queryClient.invalidateQueries({
-    queryKey: ["sidebar-pages"],
-  });
-  // ---
+export function updateCacheOnMovePage(
+  spaceId: string,
+  pageId: string,
+  oldParentId: string | null,
+  newParentId: string | null,
+  pageData: Partial<IPage>,
+) {
+  // Remove page from old parent's cache
+  const oldQueryKey =
+    oldParentId === null
+      ? ["root-sidebar-pages", spaceId]
+      : ["sidebar-pages", { pageId: oldParentId, spaceId }];
+
+  queryClient.setQueryData<InfiniteData<IPagination<IPage>>>(
+    oldQueryKey,
+    (old) => {
+      if (!old) return old;
+      return {
+        ...old,
+        pages: old.pages.map((page) => ({
+          ...page,
+          items: page.items.filter((item) => item.id !== pageId),
+        })),
+      };
+    },
+  );
+
+  // Update old parent's hasChildren flag if it has no more children
+  if (oldParentId !== null) {
+    const oldParentCache = queryClient.getQueryData<
+      InfiniteData<IPagination<IPage>>
+    >(["sidebar-pages", { pageId: oldParentId, spaceId }]);
+
+    const remainingChildren =
+      oldParentCache?.pages.flatMap((p) => p.items).length ?? 0;
+
+    if (remainingChildren === 0) {
+      // Update hasChildren in all caches where old parent appears
+      const allSideBarMatches = queryClient.getQueriesData({
+        predicate: (query) =>
+          query.queryKey[0] === "root-sidebar-pages" ||
+          query.queryKey[0] === "sidebar-pages",
+      });
+
+      allSideBarMatches.forEach(([key]) => {
+        queryClient.setQueryData<InfiniteData<IPagination<IPage>>>(
+          key,
+          (old) => {
+            if (!old) return old;
+            return {
+              ...old,
+              pages: old.pages.map((page) => ({
+                ...page,
+                items: page.items.map((item) =>
+                  item.id === oldParentId
+                    ? { ...item, hasChildren: false }
+                    : item,
+                ),
+              })),
+            };
+          },
+        );
+      });
+    }
+  }
+
+  // Add page to new parent's cache
+  const newQueryKey =
+    newParentId === null
+      ? ["root-sidebar-pages", spaceId]
+      : ["sidebar-pages", { pageId: newParentId, spaceId }];
+
+  queryClient.setQueryData<InfiniteData<IPagination<Partial<IPage>>>>(
+    newQueryKey,
+    (old) => {
+      if (!old) return old;
+
+      // Check if page already exists in new location
+      const exists = old.pages.some((page) =>
+        page.items.some((item) => item.id === pageId),
+      );
+      if (exists) return old;
+
+      return {
+        ...old,
+        pages: old.pages.map((page, index) => {
+          if (index === old.pages.length - 1) {
+            return {
+              ...page,
+              items: [...page.items, pageData],
+            };
+          }
+          return page;
+        }),
+      };
+    },
+  );
+
+  // Update new parent's hasChildren flag
+  if (newParentId !== null) {
+    const allSideBarMatches = queryClient.getQueriesData({
+      predicate: (query) =>
+        query.queryKey[0] === "root-sidebar-pages" ||
+        query.queryKey[0] === "sidebar-pages",
+    });
+
+    allSideBarMatches.forEach(([key]) => {
+      queryClient.setQueryData<InfiniteData<IPagination<IPage>>>(key, (old) => {
+        if (!old) return old;
+        return {
+          ...old,
+          pages: old.pages.map((page) => ({
+            ...page,
+            items: page.items.map((item) =>
+              item.id === newParentId ? { ...item, hasChildren: true } : item,
+            ),
+          })),
+        };
+      });
+    });
+  }
 }
 
 export function invalidateOnDeletePage(pageId: string) {

apps/client/src/features/page/services/page-service.ts

@@ -115,7 +115,14 @@ export async function exportPage(data: IExportPageParams): Promise<void> {
     .split("filename=")[1]
     .replace(/"/g, "");
 
-  saveAs(req.data, decodeURIComponent(fileName));
+  let decodedFileName = fileName;
+  try {
+    decodedFileName = decodeURIComponent(fileName);
+  } catch (err) {
+    // fallback to raw filename
+  }
+
+  saveAs(req.data, decodedFileName);
 }
 
 export async function importPage(file: File, spaceId: string) {

apps/client/src/features/page/tree/hooks/use-tree-mutation.ts

@@ -16,6 +16,7 @@ import {
   useRemovePageMutation,
   useMovePageMutation,
   useUpdatePageMutation,
+  updateCacheOnMovePage,
 } from "@/features/page/queries/page-query.ts";
 import { generateJitteredKeyBetween } from "fractional-indexing-jittered";
 import { SpaceTreeNode } from "@/features/page/tree/types.ts";
@@ -175,9 +176,25 @@ export function useTreeMutation<T>(spaceId: string) {
       parentPageId: args.parentId,
     };
 
+    const draggedNode = args.dragNodes[0];
+    const nodeData = draggedNode.data as SpaceTreeNode;
+    const oldParentId = nodeData.parentPageId ?? null;
+    const pageData = {
+      id: nodeData.id,
+      slugId: nodeData.slugId,
+      title: nodeData.name,
+      icon: nodeData.icon,
+      position: newPosition,
+      spaceId: nodeData.spaceId,
+      parentPageId: args.parentId,
+      hasChildren: nodeData.hasChildren,
+    };
+
     try {
       await movePageMutation.mutateAsync(payload);
 
+      updateCacheOnMovePage(spaceId, draggedNodeId, oldParentId, args.parentId, pageData);
+
       setTimeout(() => {
         emit({
           operation: "moveTreeNode",
@@ -185,8 +202,10 @@ export function useTreeMutation<T>(spaceId: string) {
           payload: {
             id: draggedNodeId,
             parentId: args.parentId,
+            oldParentId,
             index: args.index,
             position: newPosition,
+            pageData,
           },
         });
       }, 50);

apps/client/src/features/space/components/delete-space-modal.tsx

@@ -6,6 +6,7 @@ import { ISpace } from "../types/space.types";
 import { useNavigate } from "react-router-dom";
 import APP_ROUTE from "@/lib/app-route";
 import { Trans, useTranslation } from "react-i18next";
+import { useState } from "react";
 
 interface DeleteSpaceModalProps {
   space: ISpace;
@@ -14,6 +15,7 @@ interface DeleteSpaceModalProps {
 export default function DeleteSpaceModal({ space }: DeleteSpaceModalProps) {
   const { t } = useTranslation();
   const [opened, { open, close }] = useDisclosure(false);
+  const [isDeleting, setIsDeleting] = useState(false);
   const deleteSpaceMutation = useDeleteSpaceMutation();
   const navigate = useNavigate();
 
@@ -35,12 +37,15 @@ export default function DeleteSpaceModal({ space }: DeleteSpaceModalProps) {
       return;
     }
 
+    setIsDeleting(true);
     try {
       // pass slug too so we can clear the local cache
       await deleteSpaceMutation.mutateAsync({ id: space.id, slug: space.slug });
       navigate(APP_ROUTE.HOME);
     } catch (error) {
       console.error("Failed to delete space", error);
+    } finally {
+      setIsDeleting(false);
     }
   };
 
@@ -79,7 +84,7 @@ export default function DeleteSpaceModal({ space }: DeleteSpaceModalProps) {
           <Button onClick={close} variant="default">
             {t("Cancel")}
           </Button>
-          <Button onClick={handleDelete} color="red">
+          <Button onClick={handleDelete} color="red" loading={isDeleting}>
             {t("Confirm")}
           </Button>
         </Group>

apps/client/src/features/space/components/sidebar/switch-space.tsx

@@ -3,7 +3,7 @@ import { useNavigate } from "react-router-dom";
 import { SpaceSelect } from "./space-select";
 import { getSpaceUrl } from "@/lib/config";
 import { Button, Popover, Text } from "@mantine/core";
-import { IconChevronDown } from "@tabler/icons-react";
+import { IconChevronDown, IconChevronUp } from "@tabler/icons-react";
 import { useDisclosure } from "@mantine/hooks";
 import { CustomAvatar } from "@/components/ui/custom-avatar.tsx";
 import { AvatarIconType } from "@/features/attachments/types/attachment.types.ts";
@@ -21,7 +21,7 @@ export function SwitchSpace({
   spaceIcon,
 }: SwitchSpaceProps) {
   const navigate = useNavigate();
-  const [opened, { close, open, toggle }] = useDisclosure(false);
+  const [opened, { close, toggle }] = useDisclosure(false);
 
   const handleSelect = (value: string) => {
     if (value) {
@@ -44,9 +44,9 @@ export function SwitchSpace({
           variant="subtle"
           fullWidth
           justify="space-between"
-          rightSection={<IconChevronDown size={18} />}
+          rightSection={opened ? <IconChevronUp size={18} /> : <IconChevronDown size={18} />}
           color="gray"
-          onClick={open}
+          onClick={toggle}
         >
           <CustomAvatar
             name={spaceName}

apps/client/src/features/space/services/space-service.ts

@@ -69,5 +69,12 @@ export async function exportSpace(data: IExportSpaceParams): Promise<void> {
     .split("filename=")[1]
     .replace(/"/g, "");
 
-  saveAs(req.data, decodeURIComponent(fileName));
+  let decodedFileName = fileName;
+  try {
+    decodedFileName = decodeURIComponent(fileName);
+  } catch (err) {
+    // fallback to raw filename
+  }
+
+  saveAs(req.data, decodedFileName);
 }

apps/client/src/features/websocket/types/types.ts

@@ -45,8 +45,10 @@ export type MoveTreeNodeEvent = {
   payload: {
     id: string;
     parentId: string;
+    oldParentId: string | null;
     index: number;
     position: string;
+    pageData: Partial<IPage>;
   };
 };
 

apps/client/src/features/websocket/use-query-subscription.ts

@@ -8,7 +8,7 @@ import { IPagination } from "@/lib/types";
 import {
   invalidateOnCreatePage,
   invalidateOnDeletePage,
-  invalidateOnMovePage,
+  updateCacheOnMovePage,
   invalidateOnUpdatePage,
 } from "../page/queries/page-query";
 import { RQ_KEY } from "../comment/queries/comment-query";
@@ -41,7 +41,13 @@ export const useQuerySubscription = () => {
           invalidateOnCreatePage(data.payload.data);
           break;
         case "moveTreeNode":
-          invalidateOnMovePage();
+          updateCacheOnMovePage(
+            data.spaceId,
+            data.payload.id,
+            data.payload.oldParentId,
+            data.payload.parentId,
+            data.payload.pageData,
+          );
           break;
         case "deleteTreeNode":
           invalidateOnDeletePage(data.payload.node.id);