Remove options to set and display the 'primary' backup target

dashboard/src/views/BackupTargetsView.vue

@@ -5,11 +5,11 @@ const i18n = useI18n();
 const t = i18n.t;
 
 import { ref, onMounted, useTemplateRef } from 'vue';
-import { Button, Menu, ButtonGroup, TableView, InputDialog } from '@cloudron/pankow';
+import { Button, Menu, TableView, InputDialog } from '@cloudron/pankow';
 import Section from  '../components/Section.vue';
 import StateLED from  '../components/StateLED.vue';
 import BackupScheduleDialog from  '../components/BackupScheduleDialog.vue';
-import BackupTargetDialog from  '../components/BackupTargetDialog.vue';
+import NewBackupTargetDialog from  '../components/NewBackupTargetDialog.vue';
 import BackupTargetsModel from '../models/BackupTargetsModel.js';
 import ProfileModel from '../models/ProfileModel.js';
 
@@ -33,18 +33,23 @@ const columns = {
   provider: {
     label: 'Provider',
     sort: true,
+    hideMobile: true,
   },
   format: {
     label: 'Format',
-    sort: false,
+    sort: true,
     hideMobile: true,
   },
   actions: {}
 };
 
-const backupTargetDialog = useTemplateRef('backupTargetDialog');
-function onAddOrEdit(target = null) {
-  backupTargetDialog.value.open(target);
+const newBackupTargetDialog = useTemplateRef('newBackupTargetDialog');
+function onAdd() {
+  newBackupTargetDialog.value.open();
+}
+
+function onEdit(target) {
+  console.log(target);
 }
 
 const backupScheduleDialog = useTemplateRef('backupScheduleDialog');
@@ -52,25 +57,6 @@ function onEditSchedule(target) {
   backupScheduleDialog.value.open(target);
 }
 
-async function onMakePrimaryTarget(target) {
-  // TODO translate
-  const yes = await inputDialog.value.confirm({
-    title: '',
-    message: 'Make this target the primary backup destination?',
-    confirmLabel: t('main.dialog.yes'),
-    confirmStyle: 'primary',
-    rejectLabel: t('main.dialog.cancel'),
-    rejectStyle: 'secondary',
-  });
-
-  if (!yes) return;
-
-  const [error] = await backupTargetsModel.setPrimary(target.id);
-  if (error) console.error(error);
-
-  await refresh();
-}
-
 async function onRemoveTarget(target) {
   // TODO translate
   const yes = await inputDialog.value.confirm({
@@ -145,14 +131,10 @@ function onActionMenu(target, event) {
     icon: 'fa-solid fa-clock',
     label: 'Schedule and Retention',
     action: onEditSchedule.bind(null, target),
-  }, {
-    icon: 'fa-solid fa-crown',
-    label: 'Set as Primary',
-    disabled: target.primary,
-    action: onMakePrimaryTarget.bind(null, target),
   }, {
     icon: 'fa-solid fa-pencil-alt',
     label: 'Edit',
+    action: onEdit.bind(null, target),
   }, {
     separator: true
   }, {
@@ -180,13 +162,13 @@ onMounted(async () => {
   <div class="content">
     <Menu ref="actionMenuElement" :model="actionMenuModel" />
     <InputDialog ref="inputDialog" />
-    <BackupTargetDialog ref="backupTargetDialog" @success="refresh()"/>
+    <NewBackupTargetDialog ref="newBackupTargetDialog" @success="refresh()"/>
     <BackupScheduleDialog ref="backupScheduleDialog" @success="refresh()"/>
 
     <!-- TODO translate -->
     <Section title="Backup Storage">
       <template #header-buttons>
-        <Button @click="onAddOrEdit()" icon="fa-solid fa-plus"> Add Storage</Button>
+        <Button @click="onAdd()" icon="fa-solid fa-plus"> Add Storage</Button>
       </template>
       <p>TODO Explain what backup targets are and what primary/secondary is</p>