Maintenance: Mobile - Fix chevron icon orientation for the tree selec…

…t navigation button.
zammad · Sep 18, 2023 · ef05171 · ef05171
1 parent ea3f3f0
commit ef05171
Show file tree

Hide file tree

Showing 2 changed files with 27 additions and 1 deletion.
diff --git a/...rontend/apps/mobile/components/Form/fields/FieldTreeSelect/FieldTreeSelectInputDialog.vue b/...rontend/apps/mobile/components/Form/fields/FieldTreeSelect/FieldTreeSelectInputDialog.vue
@@ -200,7 +200,7 @@ const getCurrentIndex = (option: FlatSelectOption) => {
         size="base"
         class="ltr:mr-3 rtl:ml-3"
         :name="`mobile-chevron-${
-          locale.localeData?.dir === 'rtl' ? 'left' : 'right'
+          locale.localeData?.dir === 'rtl' ? 'right' : 'left'
         }`"
       />
       <span class="grow font-semibold text-white/80">

diff --git a/...tend/apps/mobile/components/Form/fields/FieldTreeSelect/__tests__/FieldTreeSelect.spec.ts b/...tend/apps/mobile/components/Form/fields/FieldTreeSelect/__tests__/FieldTreeSelect.spec.ts
@@ -1412,4 +1412,30 @@ describe('Form - Field - TreeSelect - Visuals', () => {
       view.findByIconName('mobile-chevron-left'),
     ).resolves.toBeInTheDocument()
   })
+
+  it('back button arrow changes direction when locale changes', async () => {
+    const view = renderComponent(FormKit, {
+      ...wrapperParameters,
+      props: {
+        label: 'Select…',
+        type: 'treeselect',
+        options: testOptions,
+      },
+    })
+
+    await view.events.click(view.getByLabelText('Select…'))
+
+    await view.events.click(view.getAllByIconName('mobile-chevron-right')[0])
+
+    expect(view.getByIconName('mobile-chevron-left')).toBeInTheDocument()
+
+    const locale = useLocaleStore()
+    locale.localeData = {
+      dir: EnumTextDirection.Rtl,
+    } as any
+
+    await expect(
+      view.findByIconName('mobile-chevron-right'),
+    ).resolves.toBeInTheDocument()
+  })
 })