feat: export excel file

refactor: align id columns between export and import

refactor: match column names with template

apps/client/src/common/api/excel.ts

@@ -3,6 +3,7 @@ import { CustomFields, Rundown } from 'ontime-types';
 import { ImportMap } from 'ontime-utils';
 
 import { apiEntryUrl } from './constants';
+import { downloadBlob } from './utils';
 
 const excelPath = `${apiEntryUrl}/excel`;
 
@@ -39,3 +40,18 @@ export async function importRundownPreview(options: ImportMap): Promise<PreviewS
   });
   return response.data;
 }
+
+/**
+ * Downloads a xlsx representation of the rundown from the server
+ */
+export async function downloadAsExcel(rundownId: string, fileName?: string) {
+  try {
+    const response = await axios.get(`${excelPath}/${rundownId}/export`, {
+      responseType: 'blob',
+    });
+
+    downloadBlob(response.data, `${fileName ?? 'Ontime_rundown'}.xlsx`);
+  } catch (error) {
+    console.error('Error downloading file:', error);
+  }
+}

apps/client/src/features/app-settings/panel/manage-panel/ManageRundowns.tsx

@@ -1,10 +1,13 @@
 import { useState } from 'react';
-import { IoAdd } from 'react-icons/io5';
+import { IoAdd, IoDocumentOutline, IoDownloadOutline, IoEllipsisHorizontal, IoTrash } from 'react-icons/io5';
 import { useDisclosure } from '@mantine/hooks';
 
+import { downloadAsExcel } from '../../../../common/api/excel';
 import { maybeAxiosError } from '../../../../common/api/utils';
 import Button from '../../../../common/components/buttons/Button';
+import IconButton from '../../../../common/components/buttons/IconButton';
 import Dialog from '../../../../common/components/dialog/Dialog';
+import { DropdownMenu } from '../../../../common/components/dropdown-menu/DropdownMenu';
 import Tag from '../../../../common/components/tag/Tag';
 import { useMutateProjectRundowns, useProjectRundowns } from '../../../../common/hooks-query/useProjectRundowns';
 import { cx } from '../../../../common/utils/styleUtils';
@@ -55,6 +58,10 @@ export default function ManageRundowns() {
     }
   };
 
+  const handleDownloadXlsx = async (rundownId: string, title: string) => {
+    await downloadAsExcel(rundownId, title);
+  };
+
   return (
     <>
       <Panel.Section>
@@ -93,19 +100,35 @@ export default function ManageRundowns() {
                       <td>
                         {title} {isLoaded && <Tag>Loaded</Tag>}
                       </td>
-                      <Panel.InlineElements as='td'>
-                        <Button size='small' onClick={() => openLoad(id)} disabled={isLoaded}>
-                          Load
-                        </Button>
-                        <Button
-                          size='small'
-                          variant='subtle-destructive'
-                          onClick={() => openDelete(id)}
-                          disabled={isLoaded}
+                      <td>
+                        <DropdownMenu
+                          render={<IconButton variant='ghosted-white' />}
+                          items={[
+                            {
+                              type: 'item',
+                              icon: IoDownloadOutline,
+                              label: 'Load',
+                              onClick: () => openLoad(id),
+                              disabled: isLoaded,
+                            },
+                            {
+                              type: 'item',
+                              icon: IoDocumentOutline,
+                              label: 'Download .xlsx',
+                              onClick: () => handleDownloadXlsx(id, title),
+                            },
+                            {
+                              type: 'item',
+                              icon: IoTrash,
+                              label: 'Delete',
+                              onClick: () => openDelete(id),
+                              disabled: isLoaded,
+                            },
+                          ]}
                         >
-                          Delete
-                        </Button>
-                      </Panel.InlineElements>
+                          <IoEllipsisHorizontal />
+                        </DropdownMenu>
+                      </td>
                     </tr>
                   );
                 })}

apps/client/src/features/app-settings/panel/manage-panel/sources-panel/import-map/importMapUtils.ts

@@ -59,7 +59,7 @@ export function convertToImportMap(namedImportMap: NamedImportMap): ImportMap {
     timeWarning: namedImportMap['Time warning'],
     timeDanger: namedImportMap['Time danger'],
     custom,
-    entryId: namedImportMap.ID,
+    id: namedImportMap.ID,
   };
 }