move helper functions out of the model and into the view

dashboard/src/models/BackupSitesModel.js

@@ -1,7 +1,6 @@
 
 import { fetcher } from '@cloudron/pankow';
 import { API_ORIGIN } from '../constants.js';
-import { cronDays, cronHours } from '../utils.js';
 
 function create() {
   const accessToken = localStorage.token;
@@ -220,41 +219,7 @@ const backupRetentions = [
   { name: 'Forever', id: { keepWithinSecs: -1 }}
 ];
 
-function prettyBackupSchedule(pattern) {
-  if (!pattern) return '';
-
-  const tmp = pattern.split(' ');
-  if (tmp.length === 1) return pattern.charAt(0).toUpperCase() + pattern.slice(1); // case for 'never' - capitalize
-
-  const hours = tmp[2].split(','), days = tmp[5].split(',');
-  let prettyDay;
-  if (days.length === 7 || days[0] === '*') {
-      prettyDay = 'Everyday';
-  } else  {
-      prettyDay = days.map(function (day) { return cronDays[parseInt(day, 10)].name.substr(0, 3); }).join(',');
-  }
-
-  const prettyHour = hours.map(function (hour) { return cronHours[parseInt(hour, 10)].name; }).join(',');
-  return prettyDay + ' at ' + prettyHour;
-};
-
-function prettyBackupRetention(retention) {
-  function stableStringify(obj) { return JSON.stringify(obj, Object.keys(obj).sort()); }
-  const tmp = backupRetentions.find(function (p) { return stableStringify(p.id) === stableStringify(retention); });
-  return tmp ? tmp.name : '';
-}
-
-function prettyBackupContents(contents) {
-  if (!contents) return 'Everything';
-  if (contents.include) return `Only ${contents.include.length} item(s)`;
-  if (contents.exclude) return `Exclude ${contents.exclude.length} item(s)`;
-  return '';
-}
-
 export default {
   create,
   backupRetentions,
-  prettyBackupSchedule,
-  prettyBackupRetention,
-  prettyBackupContents
 };

dashboard/src/views/BackupSitesView.vue

@@ -16,7 +16,7 @@ import { TASK_TYPES } from '../constants.js';
 import BackupSitesModel from '../models/BackupSitesModel.js';
 import ProfileModel from '../models/ProfileModel.js';
 import TasksModel from '../models/TasksModel.js';
-import { regionName } from  '../utils.js';
+import { cronDays, cronHours, regionName } from  '../utils.js';
 
 const profileModel = ProfileModel.create();
 const tasksModel = TasksModel.create();
@@ -43,6 +43,37 @@ function onEditSchedule(site) {
   backupScheduleDialog.value.open(site);
 }
 
+function prettyBackupSchedule(pattern) {
+  if (!pattern) return '';
+
+  const tmp = pattern.split(' ');
+  if (tmp.length === 1) return pattern.charAt(0).toUpperCase() + pattern.slice(1); // case for 'never' - capitalize
+
+  const hours = tmp[2].split(','), days = tmp[5].split(',');
+  let prettyDay;
+  if (days.length === 7 || days[0] === '*') {
+      prettyDay = 'Everyday';
+  } else  {
+      prettyDay = days.map(function (day) { return cronDays[parseInt(day, 10)].name.substr(0, 3); }).join(',');
+  }
+
+  const prettyHour = hours.map(function (hour) { return cronHours[parseInt(hour, 10)].name; }).join(',');
+  return prettyDay + ' at ' + prettyHour;
+};
+
+function prettyBackupRetention(retention) {
+  function stableStringify(obj) { return JSON.stringify(obj, Object.keys(obj).sort()); }
+  const tmp = BackupSitesModel.backupRetentions.find(function (p) { return stableStringify(p.id) === stableStringify(retention); });
+  return tmp ? tmp.name : '';
+}
+
+function prettyBackupContents(contents) {
+  if (!contents) return 'Everything';
+  if (contents.include) return `Only ${contents.include.length} item(s)`;
+  if (contents.exclude) return `Exclude ${contents.exclude.length} item(s)`;
+  return '';
+}
+
 async function onRemoveSite(site) {
   const yes = await inputDialog.value.confirm({
     title: t('backup.site.removeDialog.title'),
@@ -229,7 +260,7 @@ onMounted(async () => {
             <StateLED style="padding-top: 5px;" :busy="site.status.busy" :state="site.status.state"/>
           </div>
           <div class="backup-site-details">
-            <div style="margin-bottom: 5px;"><b style="font-size: 18px">{{ site.name }}</b><i style="margin-left: 10px">{{ BackupSitesModel.prettyBackupContents(site.contents) }}</i></div>
+            <div style="margin-bottom: 5px;"><b style="font-size: 18px">{{ site.name }}</b><i style="margin-left: 10px">{{ prettyBackupContents(site.contents) }}</i></div>
             <div>
               <i v-if="site.encrypted" class="fa-solid fa-lock"></i>
               Storage: <b>{{ site.provider }} ({{ site.format }}) </b>
@@ -245,10 +276,10 @@ onMounted(async () => {
             </div>
 
             <div>
-              {{ $t('backups.schedule.schedule') }}: <b>{{ BackupSitesModel.prettyBackupSchedule(site.schedule) }}</b>
+              {{ $t('backups.schedule.schedule') }}: <b>{{ prettyBackupSchedule(site.schedule) }}</b>
             </div>
             <div>
-              {{ $t('backups.schedule.retentionPolicy') }}: <b>{{ BackupSitesModel.prettyBackupRetention(site.retention) }}</b>
+              {{ $t('backups.schedule.retentionPolicy') }}: <b>{{ prettyBackupRetention(site.retention) }}</b>
             </div>
             <div class="backup-site-task">
               <div v-if="!site.task">Last backup: <b>Never</b></div>