fix: #1014

src/components/file/DashboardFile/FileModal.tsx

@@ -237,12 +237,7 @@ export default function FileModal({
                   <Title order={4} mt='lg' mb='xs'>
                     Tags
                   </Title>
-                  <Combobox
-                    zIndex={90000}
-                    withinPortal={false}
-                    store={tagsCombobox}
-                    onOptionSubmit={handleValueSelect}
-                  >
+                  <Combobox zIndex={90000} store={tagsCombobox} onOptionSubmit={handleValueSelect}>
                     <Combobox.DropdownTarget>
                       <PillsInput
                         onBlur={() => triggerSave()}
@@ -318,7 +313,7 @@ export default function FileModal({
                     </Button>
                   ) : (
                     <Combobox
-                      withinPortal={false}
+                      zIndex={90000}
                       store={folderCombobox}
                       onOptionSubmit={(value) => handleAdd(value)}
                     >
@@ -349,6 +344,12 @@ export default function FileModal({
                       </Combobox.Target>
 
                       <Combobox.Dropdown>
+                        {folders?.length === 0 && (
+                          <Combobox.Empty>
+                            You have no folders. Start typing to create a new folder for this file.
+                          </Combobox.Empty>
+                        )}
+
                         <FolderComboboxOptions
                           folderOptions={folderOptions}
                           searchValue={search}

src/components/file/actions.tsx

@@ -141,14 +141,10 @@ export async function createFolderAndAdd(file: File, folderName: string | null)
 }
 
 export async function removeFromFolder(file: File) {
-  const { data, error } = await fetchApi<Response['/api/user/files/[id]']>(
-    `/api/user/folders/${file.folderId}`,
-    'DELETE',
-    {
-      delete: 'file',
-      id: file.id,
-    },
-  );
+  const { data, error } = await fetchApi<{ folder: Folder }>(`/api/user/folders/${file.folderId}`, 'DELETE', {
+    delete: 'file',
+    id: file.id,
+  });
 
   if (error) {
     notifications.show({
@@ -160,7 +156,7 @@ export async function removeFromFolder(file: File) {
   } else {
     notifications.show({
       title: 'File removed from folder',
-      message: `${file.name} has been removed from ${data!.name}`,
+      message: `${file.name} has been removed from ${data?.folder.name}`,
       color: 'green',
       icon: <IconFolderMinus size='1rem' />,
     });