fix(ui): only and files/folders to the grid/list if they were added to the current folder (#12525)

Author: JarrodMFlesch

packages/ui/src/elements/FolderView/CurrentFolderActions/index.tsx

@@ -39,7 +39,7 @@ export function CurrentFolderActions({ className }: Props) {
   const { i18n, t } = useTranslation()
 
   const deleteCurrentFolder = React.useCallback(async () => {
-    await fetch(`${serverURL}${routes.api}/${folderCollectionSlug}/${folderID}`, {
+    await fetch(`${serverURL}${routes.api}/${folderCollectionSlug}/${folderID}?depth=0`, {
       credentials: 'include',
       method: 'DELETE',
     })

packages/ui/src/elements/FolderView/Drawers/MoveToFolder/index.tsx

@@ -267,6 +267,7 @@ function Content({
             <Button
               buttonStyle="pill"
               className={`${baseClass}__add-folder-button`}
+              margin={false}
               onClick={() => {
                 openModal(newFolderDrawerSlug)
               }}

packages/ui/src/elements/FolderView/Drawers/NewFolder/index.tsx

@@ -30,7 +30,7 @@ export const NewFolderDrawer = ({ drawerSlug, onNewFolderSuccess }: Props) => {
   return (
     <Drawer gutter={false} Header={null} slug={drawerSlug}>
       <Form
-        action={`${serverURL}${routes.api}/${folderCollectionSlug}`}
+        action={`${serverURL}${routes.api}/${folderCollectionSlug}?depth=0`}
         handleResponse={async (res, successToast, errorToast) => {
           try {
             const { doc } = await res.json()

packages/ui/src/elements/FolderView/Drawers/RenameFolder/index.tsx

@@ -39,7 +39,7 @@ export function RenameFolderDrawer(props: Props) {
   return (
     <Drawer gutter={false} Header={null} slug={drawerSlug}>
       <Form
-        action={`${serverURL}${routes.api}/${folderCollectionSlug}/${folderToRename.value.id}`}
+        action={`${serverURL}${routes.api}/${folderCollectionSlug}/${folderToRename.value.id}?depth=0`}
         initialState={{
           name: {
             initialValue: folderName,

packages/ui/src/providers/Folders/index.tsx

@@ -195,6 +195,7 @@ export function FolderProvider({
   sort,
   subfolders: subfoldersFromProps = [],
 }: FolderProviderProps) {
+  const parentFolderContext = useFolder()
   const { config, getEntityConfig } = useConfig()
   const folderFieldName = config.folders.fieldName
   const { routes, serverURL } = config
@@ -806,8 +807,36 @@ export function FolderProvider({
    * Does NOT handle the request to the server.
    * Used when a document needs to be added to the current state.
    */
-  const addItems = React.useCallback(
-    (items: FolderOrDocument[]) => {
+  const addItems: FolderContextValue['addItems'] = React.useCallback(
+    (itemsToAdd) => {
+      const { items, parentItems } = itemsToAdd.reduce(
+        (acc, item) => {
+          const destinationFolderID = item.value.folderID || null
+          if (
+            (item.value.folderID && item.value.folderID === activeFolderID) ||
+            (!activeFolderID && !item.value.folderID)
+          ) {
+            acc.items.push(item)
+          }
+
+          if (
+            parentFolderContext &&
+            ((parentFolderContext.folderID &&
+              destinationFolderID === parentFolderContext.folderID) ||
+              (!parentFolderContext.folderID && !item.value.folderID))
+          ) {
+            acc.parentItems.push(item)
+          }
+
+          return acc
+        },
+        { items: [], parentItems: [] },
+      )
+
+      if (parentItems.length) {
+        parentFolderContext.addItems(parentItems)
+      }
+
       if (!items.length) {
         return
       }
@@ -845,7 +874,7 @@ export function FolderProvider({
         setAllSubfolders(sortedAllSubfolders)
       }
     },
-    [documents, separateItems, sortItems, subfolders],
+    [activeFolderID, documents, separateItems, sortItems, subfolders],
   )
 
   /**
@@ -867,7 +896,7 @@ export function FolderProvider({
 
       if (movingCurrentFolder) {
         const req = await fetch(
-          `${serverURL}${routes.api}/${folderCollectionSlug}/${activeFolderID}`,
+          `${serverURL}${routes.api}/${folderCollectionSlug}/${activeFolderID}?depth=0`,
           {
             body: JSON.stringify({ [folderFieldName]: toFolderID || null }),
             credentials: 'include',