From 6601458293971c9138bd26dbb463b4b5d334d592 Mon Sep 17 00:00:00 2001
From: Rotzbua <Rotzbua@users.noreply.github.com>
Date: Tue, 27 Jun 2023 13:19:47 +0200
Subject: [PATCH] feat(webapp): use component name instead of string

---
 .../src/components/GenericActionHandler.vue   |  2 +-
 www/webapp/src/views/ConfirmationPage.vue     |  8 +++----
 www/webapp/src/views/CrudListDomain.vue       |  9 +++++---
 www/webapp/src/views/CrudListRecord.vue       | 15 ++++++++----
 www/webapp/src/views/CrudListTOTP.vue         |  8 ++++---
 www/webapp/src/views/CrudListToken.vue        | 23 +++++++++++--------
 6 files changed, 40 insertions(+), 25 deletions(-)

diff --git a/www/webapp/src/components/GenericActionHandler.vue b/www/webapp/src/components/GenericActionHandler.vue
index 4b1533b5b..f113e247b 100644
--- a/www/webapp/src/components/GenericActionHandler.vue
+++ b/www/webapp/src/components/GenericActionHandler.vue
@@ -20,7 +20,7 @@
       auto_submit: false,
     }),
     async created() {
-      this.auto_submit = this.auto_submit || this.$options.name === 'GenericActionHandler'
+      this.auto_submit = this.auto_submit || this.$options.name === 'GenericActionHandler' /* Generic case. Name of this (root) component. */
       if(this.auto_submit) {
         this.$emit('autosubmit')
       }
diff --git a/www/webapp/src/views/ConfirmationPage.vue b/www/webapp/src/views/ConfirmationPage.vue
index 572722394..99b25db35 100644
--- a/www/webapp/src/views/ConfirmationPage.vue
+++ b/www/webapp/src/views/ConfirmationPage.vue
@@ -79,9 +79,9 @@
       actionHandler: null,
       errors: [],
       handler_map: {
-        'activate-account': 'ActivateAccountActionHandler',
-        'create-totp': 'CreateTOTPActionHandler',
-        'reset-password': 'ResetPasswordActionHandler',
+        'activate-account': ActivateAccountActionHandler.name,
+        'create-totp': CreateTOTPActionHandler.name,
+        'reset-password': ResetPasswordActionHandler.name,
       },
       post_payload: {},
       post_response: {},
@@ -90,7 +90,7 @@
       working: false,
     }),
     async mounted() {
-      this.actionHandler = this.handler_map[this.$route.params.action] || 'GenericActionHandler'
+      this.actionHandler = this.handler_map[this.$route.params.action] || GenericActionHandler.name
     },
     methods: {
       async confirm() {
diff --git a/www/webapp/src/views/CrudListDomain.vue b/www/webapp/src/views/CrudListDomain.vue
index 5e759ce86..69892e69a 100644
--- a/www/webapp/src/views/CrudListDomain.vue
+++ b/www/webapp/src/views/CrudListDomain.vue
@@ -3,6 +3,9 @@ import { HTTP, withWorking } from '@/utils';
 import CrudList from './CrudList';
 import DomainSetupDialog from '@/views/Console/DomainSetupDialog';
 import {mdiDownload, mdiInformation} from "@mdi/js";
+import GenericText from "@/components/Field/GenericText.vue";
+import GenericTextarea from "@/components/Field/GenericTextarea.vue";
+import TimeAgo from "@/components/Field/TimeAgo.vue";
 
 export default {
   name: 'CrudListDomain',
@@ -40,7 +43,7 @@ export default {
             readonly: true,
             required: true,
             writeOnCreate: true,
-            datatype: 'GenericText',
+            datatype: GenericText.name,
             searchable: true,
           },
           published: {
@@ -50,7 +53,7 @@ export default {
             sortable: true,
             value: 'published',
             readonly: true,
-            datatype: 'TimeAgo',
+            datatype: TimeAgo.name,
             searchable: false,
           },
           zonefile: {
@@ -60,7 +63,7 @@ export default {
             align: 'left',
             value: 'zonefile',
             writeOnCreate: true,
-            datatype: 'GenericTextarea',
+            datatype: GenericTextarea.name,
             searchable: false,
             fieldProps: () => ({ hint: 'Note: automatically managed records will be ignored!' }),
             hideFromTable: true,
diff --git a/www/webapp/src/views/CrudListRecord.vue b/www/webapp/src/views/CrudListRecord.vue
index a31924a44..1d58ef3bd 100644
--- a/www/webapp/src/views/CrudListRecord.vue
+++ b/www/webapp/src/views/CrudListRecord.vue
@@ -1,6 +1,11 @@
 <script>
 import CrudList from '@/views/CrudList';
 import {HTTP, withWorking} from "@/utils"
+import GenericText from "@/components/Field/GenericText.vue";
+import RecordList from "@/components/Field/RecordList.vue";
+import TTL from "@/components/Field/TTL.vue";
+import TimeAgo from "@/components/Field/TimeAgo.vue";
+import RRSetType from "@/components/Field/RRSetType.vue";
 
 export default {
   name: 'CrudListRecord',
@@ -34,7 +39,7 @@ export default {
           value: 'type',
           readonly: true,
           required: true,
-          datatype: 'RRSetType',
+          datatype: RRSetType.name,
           searchable: true,
           writeOnCreate: true,
           width: '120px',
@@ -46,7 +51,7 @@ export default {
           sortable: true,
           value: 'subname',
           readonly: true,
-          datatype: 'GenericText',
+          datatype: GenericText.name,
           fieldProps: () => ({ rules: [
               v => !(v.startsWith('.') || v.endsWith('.') || v.includes('..'))
                   || 'Dots must be surrounded by other characters.',
@@ -65,7 +70,7 @@ export default {
           value: 'records',
           readonly: false,
           required: true,
-          datatype: 'RecordList',
+          datatype: RecordList.name,
           fieldProps: rrSet => ({ type: rrSet.type || 'A' }),
           searchable: true,
         },
@@ -77,7 +82,7 @@ export default {
           value: 'ttl',
           readonly: false,
           required: true,
-          datatype: 'TTL',
+          datatype: TTL.name,
           fieldProps: () => ({ min: self.minimumTTL }),
           searchable: true,
           width: '130px',
@@ -89,7 +94,7 @@ export default {
           sortable: true,
           value: 'touched',
           readonly: true,
-          datatype: 'TimeAgo',
+          datatype: TimeAgo.name,
           searchable: false,
           width: '130px',
         },
diff --git a/www/webapp/src/views/CrudListTOTP.vue b/www/webapp/src/views/CrudListTOTP.vue
index 620c791b4..ed9da7dd7 100644
--- a/www/webapp/src/views/CrudListTOTP.vue
+++ b/www/webapp/src/views/CrudListTOTP.vue
@@ -1,6 +1,8 @@
 <script>
 import CrudList from './CrudList';
 import TOTPVerifyDialog from '@/views/Console/TOTPVerifyDialog';
+import GenericText from "@/components/Field/GenericText.vue";
+import TimeAgo from "@/components/Field/TimeAgo.vue";
 
 export default {
   name: 'CrudListTOTP',
@@ -34,7 +36,7 @@ export default {
             readonly: true,
             required: true,
             writeOnCreate: true,
-            datatype: 'GenericText',
+            datatype: GenericText.name,
             searchable: true,
           },
           created: {
@@ -44,7 +46,7 @@ export default {
             sortable: true,
             value: 'created',
             readonly: true,
-            datatype: 'TimeAgo',
+            datatype: TimeAgo.name,
             searchable: false,
           },
           last_used: {
@@ -54,7 +56,7 @@ export default {
             sortable: true,
             value: 'last_used',
             readonly: true,
-            datatype: 'TimeAgo',
+            datatype: TimeAgo.name,
             searchable: false,
           },
         },
diff --git a/www/webapp/src/views/CrudListToken.vue b/www/webapp/src/views/CrudListToken.vue
index 94038fe43..0e404cd1d 100644
--- a/www/webapp/src/views/CrudListToken.vue
+++ b/www/webapp/src/views/CrudListToken.vue
@@ -1,6 +1,11 @@
 <script>
 import CrudList from './CrudList';
 import {useUserStore} from "@/store/user";
+import GenericText from "@/components/Field/GenericText.vue";
+import GenericCheckbox from "@/components/Field/GenericCheckbox.vue";
+import RecordList from "@/components/Field/RecordList.vue";
+import GenericSwitchbox from "@/components/Field/GenericSwitchbox.vue";
+import TimeAgo from "@/components/Field/TimeAgo.vue";
 
 export default {
   name: 'CrudListToken',
@@ -34,7 +39,7 @@ export default {
             value: 'name',
             readonly: false,
             writeOnCreate: true,
-            datatype: 'GenericText',
+            datatype: GenericText.name,
             searchable: true,
           },
           perm_manage_tokens: {
@@ -46,7 +51,7 @@ export default {
             value: 'perm_manage_tokens',
             readonly: false,
             writeOnCreate: true,
-            datatype: 'GenericSwitchbox',
+            datatype: GenericSwitchbox.name,
             searchable: false,
             advanced: true,
           },
@@ -60,7 +65,7 @@ export default {
             readonly: false,
             required: false,
             writeOnCreate: true,
-            datatype: 'RecordList',
+            datatype: RecordList.name,
             fieldProps: () => ({ type: 'Subnet' }),
             searchable: true,
             advanced: true,
@@ -73,7 +78,7 @@ export default {
             value: 'max_age',
             readonly: false,
             writeOnCreate: true,
-            datatype: 'GenericText',
+            datatype: GenericText.name,
             searchable: false,
             fieldProps: () => ({ hint: 'Format: [DD] [HH:[MM:]]ss' }),
             advanced: true,
@@ -86,7 +91,7 @@ export default {
             value: 'max_unused_period',
             readonly: false,
             writeOnCreate: true,
-            datatype: 'GenericText',
+            datatype: GenericText.name,
             searchable: false,
             fieldProps: () => ({ hint: 'Format: [DD] [HH:[MM:]]ss' }),
             advanced: true,
@@ -98,7 +103,7 @@ export default {
             sortable: true,
             value: 'is_valid',
             readonly: true,
-            datatype: 'GenericCheckbox',
+            datatype: GenericCheckbox.name,
             searchable: false,
           },
           value: {
@@ -108,7 +113,7 @@ export default {
             sortable: false,
             value: 'value',
             readonly: true,
-            datatype: 'GenericText',
+            datatype: GenericText.name,
             searchable: false,
             fieldProps: () => ({ placeholder: '(only displayed once)' }),
           },
@@ -119,7 +124,7 @@ export default {
             sortable: true,
             value: 'created',
             readonly: true,
-            datatype: 'TimeAgo',
+            datatype: TimeAgo.name,
             searchable: false,
           },
           last_used: {
@@ -129,7 +134,7 @@ export default {
             sortable: true,
             value: 'last_used',
             readonly: true,
-            datatype: 'TimeAgo',
+            datatype: TimeAgo.name,
             searchable: false,
           },
         },