Maintenance: Desktop - Provide additional icon aliases for shared com…

…ponents/modules.
zammad · Dec 8, 2023 · 831df33 · 831df33
1 parent b3c3824
commit 831df33
Show file tree

Hide file tree

Showing 6 changed files with 29 additions and 14 deletions.
diff --git a/app/frontend/apps/desktop/initializer/desktopIconsAliasesMap.ts b/app/frontend/apps/desktop/initializer/desktopIconsAliasesMap.ts
@@ -4,6 +4,11 @@ export default {
   'vip-user': 'crown',
   'vip-organization': 'crown-silver',
   'input-cancel': 'close-small',
+  'alert-danger': 'x-circle',
+  'alert-dismiss': 'close',
+  'alert-info': 'info-circle',
+  'alert-success': 'check-circle-outline',
+  'alert-warning': 'exclamation-triangle',
   tooltip: 'info',
 
   'notification-warn': 'info',
@@ -36,6 +41,9 @@ export default {
   'editor-mention-knowledge-base': 'mention-kb',
   'editor-mention-text-module': 'snippet',
 
+  '2fa-security-keys': 'security-key',
+  '2fa-authenticator-app': 'mobile-code',
+
   // these aliases are used in shared context, but they refer to the same name
   search: 'search',
   loading: 'loading',

diff --git a/app/frontend/apps/mobile/initializer/mobileIconsAliasesMap.ts b/app/frontend/apps/mobile/initializer/mobileIconsAliasesMap.ts
@@ -4,6 +4,11 @@ export default {
   'vip-user': 'crown',
   'vip-organization': 'crown-silver',
   'input-cancel': 'close-small',
+  'alert-danger': 'x-circle',
+  'alert-dismiss': 'close',
+  'alert-info': 'info-circle',
+  'alert-success': 'check-circle-outline',
+  'alert-warning': 'exclamation-triangle',
   tooltip: 'info',
 
   'notification-warn': 'info',
@@ -36,6 +41,9 @@ export default {
   'editor-mention-knowledge-base': 'mention-kb',
   'editor-mention-text-module': 'snippet',
 
+  '2fa-security-keys': 'security-key',
+  '2fa-authenticator-app': 'mobile-code',
+
   // these aliases are used in shared context, but they refer to the same name
   search: 'search',
   loading: 'loading',

diff --git a/app/frontend/shared/components/CommonAlert/CommonAlert.vue b/app/frontend/shared/components/CommonAlert/CommonAlert.vue
@@ -18,15 +18,14 @@ const props = withDefaults(defineProps<Props>(), {
 const icon = computed(() => {
   switch (props.variant) {
     case 'success':
-      return 'desktop-check-circle-outline'
-    case 'info':
-      return 'desktop-info-circle'
+      return 'alert-success'
     case 'warning':
-      return 'desktop-exclamation-triangle'
+      return 'alert-warning'
     case 'danger':
-      return 'desktop-x-circle'
+      return 'alert-danger'
+    case 'info':
     default:
-      return 'desktop-info-circle'
+      return 'alert-info'
   }
 })
 
@@ -69,7 +68,7 @@ const dismissed = ref(false)
         v-if="props.dismissible"
         size="small"
         decorative
-        name="mobile-close"
+        name="alert-dismiss"
         class="ltr:mr-2 rtl:ml-2 cursor-pointer"
         @click="dismissed = true"
       />

diff --git a/app/frontend/shared/components/CommonAlert/__tests__/CommonAlert.spec.ts b/app/frontend/shared/components/CommonAlert/__tests__/CommonAlert.spec.ts
@@ -16,8 +16,8 @@ describe('CommonAlert.vue', () => {
     expect(alert).toHaveTextContent('Dummy')
     expect(alert).toHaveClass('alert-info')
 
-    expect(view.getByIconName('desktop-info-circle')).toBeInTheDocument()
-    expect(view.queryByIconName('mobile-close')).not.toBeInTheDocument()
+    expect(view.getByIconName('info-circle')).toBeInTheDocument()
+    expect(view.queryByIconName('close')).not.toBeInTheDocument()
   })
 
   it('renders an alert with a specific variant', () => {
@@ -35,8 +35,8 @@ describe('CommonAlert.vue', () => {
     expect(alert).toHaveTextContent('Dummy')
     expect(alert).toHaveClass('alert-error')
 
-    expect(view.getByIconName('desktop-x-circle')).toBeInTheDocument()
-    expect(view.queryByIconName('mobile-close')).not.toBeInTheDocument()
+    expect(view.getByIconName('x-circle')).toBeInTheDocument()
+    expect(view.queryByIconName('close')).not.toBeInTheDocument()
   })
 
   it('renders an dismissible alert', () => {
@@ -53,7 +53,7 @@ describe('CommonAlert.vue', () => {
 
     expect(alert).toHaveTextContent('Dummy')
     expect(alert).toHaveClass('alert-info')
-    expect(view.getByIconName('mobile-close')).toBeInTheDocument()
+    expect(view.getByIconName('close')).toBeInTheDocument()
   })
 
   it('renders an alert with a link', () => {

diff --git a/app/frontend/shared/entities/two-factor/plugins/authenticator_app.ts b/app/frontend/shared/entities/two-factor/plugins/authenticator_app.ts
@@ -8,5 +8,5 @@ export default {
   label: __('Authenticator App'),
   order: 200,
   helpMessage: __('Enter the code from your two-factor authenticator app.'),
-  icon: 'mobile-code',
+  icon: '2fa-authenticator-app',
 } satisfies TwoFactorPlugin
diff --git a/app/frontend/shared/entities/two-factor/plugins/security_keys.ts b/app/frontend/shared/entities/two-factor/plugins/security_keys.ts
@@ -39,5 +39,5 @@ export default {
       }
     }
   },
-  icon: 'security-key',
+  icon: '2fa-security-keys',
 } satisfies TwoFactorPlugin