From 6e330046b3432ee777a4aa847b0fd2ef218e521a Mon Sep 17 00:00:00 2001
From: Peter Papp <peterpapp@makingcg.com>
Date: Tue, 11 May 2021 10:34:08 +0200
Subject: [PATCH] Added arrows to Option.vue component

---
 public/mix-manifest.json                      | 23 +++++++++++++++----
 .../FilesView/FileSortingOptions.vue          | 22 ++++++++++++------
 resources/js/components/FilesView/Option.vue  | 14 +++++++----
 .../js/components/Others/MobileNavigation.vue |  4 ++--
 4 files changed, 46 insertions(+), 17 deletions(-)

diff --git a/public/mix-manifest.json b/public/mix-manifest.json
index 87ec8d8d..b9faf491 100644
--- a/public/mix-manifest.json
+++ b/public/mix-manifest.json
@@ -6,9 +6,9 @@
     "/chunks/admin-account~chunks/app-appearance~chunks/app-billings~chunks/app-email~chunks/app-index~chu~c7a13fb0.js": "/chunks/admin-account~chunks/app-appearance~chunks/app-billings~chunks/app-email~chunks/app-index~chu~c7a13fb0.js?id=62b552a0492fe95b2223",
     "/chunks/admin-account~chunks/app-setup~chunks/billings-detail~chunks/create-new-password~chunks/datab~cf616679.js": "/chunks/admin-account~chunks/app-setup~chunks/billings-detail~chunks/create-new-password~chunks/datab~cf616679.js?id=fd241499c4e3b6a88840",
     "/chunks/admin~chunks/admin-account~chunks/app-appearance~chunks/app-billings~chunks/app-email~chunks/~eeab5771.js": "/chunks/admin~chunks/admin-account~chunks/app-appearance~chunks/app-billings~chunks/app-email~chunks/~eeab5771.js?id=dc1abd740ef0db3451a2",
-    "/chunks/admin~chunks/files~chunks/platform~chunks/shared~chunks/shared/file-browser.js": "/chunks/admin~chunks/files~chunks/platform~chunks/shared~chunks/shared/file-browser.js?id=15ca7a475288d2081302",
+    "/chunks/admin~chunks/files~chunks/platform~chunks/shared~chunks/shared/file-browser.js": "/chunks/admin~chunks/files~chunks/platform~chunks/shared~chunks/shared/file-browser.js?id=9f5ea99d0c78f0efb484",
     "/chunks/admin~chunks/files~chunks/settings~chunks/shared/file-browser.js": "/chunks/admin~chunks/files~chunks/settings~chunks/shared/file-browser.js?id=6e8f4b2902f25274a2ce",
-    "/chunks/admin~chunks/platform.js": "/chunks/admin~chunks/platform.js?id=26d495095073454b4c8f",
+    "/chunks/admin~chunks/platform.js": "/chunks/admin~chunks/platform.js?id=e6e239fa538155e7b439",
     "/chunks/admin~chunks/platform~chunks/shared.js": "/chunks/admin~chunks/platform~chunks/shared.js?id=7e94943976a0aea65e09",
     "/chunks/app-appearance.js": "/chunks/app-appearance.js?id=b8a007c37d41c8046be7",
     "/chunks/app-appearance~chunks/app-billings~chunks/app-email~chunks/app-index~chunks/app-others~chunks~605f4c49.js": "/chunks/app-appearance~chunks/app-billings~chunks/app-email~chunks/app-index~chunks/app-others~chunks~605f4c49.js?id=1ae1e65bb6a5ed7c3e10",
@@ -35,7 +35,7 @@
     "/chunks/environment-setup.js": "/chunks/environment-setup.js?id=b92c884582bb24b48a18",
     "/chunks/files.js": "/chunks/files.js?id=af40942fb64ed6bbdd99",
     "/chunks/files~chunks/platform~chunks/shared/file-browser.js": "/chunks/files~chunks/platform~chunks/shared/file-browser.js?id=8cacfb709649a8e34a1b",
-    "/chunks/files~chunks/platform~chunks/shared~chunks/shared/file-browser.js": "/chunks/files~chunks/platform~chunks/shared~chunks/shared/file-browser.js?id=8dc0aaecd7129d8ea681",
+    "/chunks/files~chunks/platform~chunks/shared~chunks/shared/file-browser.js": "/chunks/files~chunks/platform~chunks/shared~chunks/shared/file-browser.js?id=9c016d93de5832e704a1",
     "/chunks/files~chunks/platform~chunks/shared~chunks/shared/file-browser~chunks/shared/single-file.js": "/chunks/files~chunks/platform~chunks/shared~chunks/shared/file-browser~chunks/shared/single-file.js?id=01a2f683fae06e7b3a47",
     "/chunks/files~chunks/settings-subscription~chunks/shared/file-browser~chunks/user-subscription.js": "/chunks/files~chunks/settings-subscription~chunks/shared/file-browser~chunks/user-subscription.js?id=8e64aa7dcf2243d072cf",
     "/chunks/files~chunks/shared/file-browser.js": "/chunks/files~chunks/shared/file-browser.js?id=5e4f31eae3364c4e9976",
@@ -91,5 +91,20 @@
     "/vendors~chunks/admin~chunks/admin-account~chunks/app-appearance~chunks/app-billings~chunks/app-email~d5e36d91.js": "/vendors~chunks/admin~chunks/admin-account~chunks/app-appearance~chunks/app-billings~chunks/app-email~d5e36d91.js?id=170765b4fd923b62195c",
     "/vendors~chunks/files~chunks/platform~chunks/shared~chunks/shared/file-browser~chunks/shared/single-file.js": "/vendors~chunks/files~chunks/platform~chunks/shared~chunks/shared/file-browser~chunks/shared/single-file.js?id=ca01bfe1656f58710763",
     "/vendors~chunks/platform~chunks/shared.js": "/vendors~chunks/platform~chunks/shared.js?id=eb141834bc24b72d8e92",
-    "/chunks/platform~chunks/shared.eb29acb348a0324f9f55.hot-update.js": "/chunks/platform~chunks/shared.eb29acb348a0324f9f55.hot-update.js"
+    "/chunks/platform~chunks/shared.eb29acb348a0324f9f55.hot-update.js": "/chunks/platform~chunks/shared.eb29acb348a0324f9f55.hot-update.js",
+    "/chunks/admin~chunks/files~chunks/platform~chunks/shared~chunks/shared/file-browser.d79f14a16b7ed4e0e23f.hot-update.js": "/chunks/admin~chunks/files~chunks/platform~chunks/shared~chunks/shared/file-browser.d79f14a16b7ed4e0e23f.hot-update.js",
+    "/chunks/admin~chunks/files~chunks/platform~chunks/shared~chunks/shared/file-browser.7ba5f438ed74391bd85b.hot-update.js": "/chunks/admin~chunks/files~chunks/platform~chunks/shared~chunks/shared/file-browser.7ba5f438ed74391bd85b.hot-update.js",
+    "/chunks/files~chunks/platform~chunks/shared~chunks/shared/file-browser.08e701f92b43a11a1f17.hot-update.js": "/chunks/files~chunks/platform~chunks/shared~chunks/shared/file-browser.08e701f92b43a11a1f17.hot-update.js",
+    "/chunks/admin~chunks/files~chunks/platform~chunks/shared~chunks/shared/file-browser.6a5e8a43f9ed059d2ccf.hot-update.js": "/chunks/admin~chunks/files~chunks/platform~chunks/shared~chunks/shared/file-browser.6a5e8a43f9ed059d2ccf.hot-update.js",
+    "/chunks/files~chunks/platform~chunks/shared~chunks/shared/file-browser.07066d7fc0a2a5640278.hot-update.js": "/chunks/files~chunks/platform~chunks/shared~chunks/shared/file-browser.07066d7fc0a2a5640278.hot-update.js",
+    "/chunks/admin~chunks/files~chunks/platform~chunks/shared~chunks/shared/file-browser.9ac41deadb7db8d21864.hot-update.js": "/chunks/admin~chunks/files~chunks/platform~chunks/shared~chunks/shared/file-browser.9ac41deadb7db8d21864.hot-update.js",
+    "/chunks/files~chunks/platform~chunks/shared~chunks/shared/file-browser.d420323c2369fe526733.hot-update.js": "/chunks/files~chunks/platform~chunks/shared~chunks/shared/file-browser.d420323c2369fe526733.hot-update.js",
+    "/chunks/files~chunks/platform~chunks/shared~chunks/shared/file-browser.1724aa4baeee25c6c5f4.hot-update.js": "/chunks/files~chunks/platform~chunks/shared~chunks/shared/file-browser.1724aa4baeee25c6c5f4.hot-update.js",
+    "/chunks/files~chunks/platform~chunks/shared~chunks/shared/file-browser.e1ceb62905ca310646aa.hot-update.js": "/chunks/files~chunks/platform~chunks/shared~chunks/shared/file-browser.e1ceb62905ca310646aa.hot-update.js",
+    "/chunks/admin~chunks/files~chunks/platform~chunks/shared~chunks/shared/file-browser.fc3df8d9594bfd57477b.hot-update.js": "/chunks/admin~chunks/files~chunks/platform~chunks/shared~chunks/shared/file-browser.fc3df8d9594bfd57477b.hot-update.js",
+    "/chunks/files~chunks/platform~chunks/shared~chunks/shared/file-browser.bab16c44484c01acfa57.hot-update.js": "/chunks/files~chunks/platform~chunks/shared~chunks/shared/file-browser.bab16c44484c01acfa57.hot-update.js",
+    "/chunks/files~chunks/platform~chunks/shared~chunks/shared/file-browser.536fb459581c938dd60c.hot-update.js": "/chunks/files~chunks/platform~chunks/shared~chunks/shared/file-browser.536fb459581c938dd60c.hot-update.js",
+    "/chunks/admin~chunks/files~chunks/platform~chunks/shared~chunks/shared/file-browser.3a22a477aacf3b98c1e7.hot-update.js": "/chunks/admin~chunks/files~chunks/platform~chunks/shared~chunks/shared/file-browser.3a22a477aacf3b98c1e7.hot-update.js",
+    "/chunks/admin~chunks/platform.3a22a477aacf3b98c1e7.hot-update.js": "/chunks/admin~chunks/platform.3a22a477aacf3b98c1e7.hot-update.js",
+    "/chunks/files~chunks/platform~chunks/shared~chunks/shared/file-browser.49a954cdf0c0e32d66fd.hot-update.js": "/chunks/files~chunks/platform~chunks/shared~chunks/shared/file-browser.49a954cdf0c0e32d66fd.hot-update.js"
 }
diff --git a/resources/js/components/FilesView/FileSortingOptions.vue b/resources/js/components/FilesView/FileSortingOptions.vue
index dddebcbb..6060886b 100644
--- a/resources/js/components/FilesView/FileSortingOptions.vue
+++ b/resources/js/components/FilesView/FileSortingOptions.vue
@@ -5,13 +5,9 @@
             <Option v-if="isGrid" @click.native="changePreview('list')" :title="$t('preview_sorting.list_view')" icon="list" />
         </OptionGroup>
         <OptionGroup>
-            <Option @click.native.stop="sort('created_at')" :title="$t('preview_sorting.sort_date')" icon="calendar" />
-            <Option @click.native.stop="sort('name')" :title="$t('preview_sorting.sort_alphabet')" icon="alphabet" />
+            <Option @click.native.stop="sort('created_at')" :arrow="arrowForCreatedAtField" :title="$t('preview_sorting.sort_date')" icon="calendar" />
+            <Option @click.native.stop="sort('name')" :arrow="arrowForNameField" :title="$t('preview_sorting.sort_alphabet')" icon="alphabet" />
         </OptionGroup>
-
-        <!-- TODO: implementovat sipky
-        <arrow-up-icon size="17" v-if="filter.field === 'created_at'" :class="{ 'arrow-down': filter.sort === 'ASC' }"/>
-        <arrow-up-icon size="17" v-if="filter.field === 'name'" :class="{ 'arrow-down': filter.sort === 'ASC' }"/>-->
     </div>
 </template>
 
@@ -38,7 +34,19 @@ export default {
         },
         isList() {
             return this.FilePreviewType === 'list'
-        }
+        },
+		arrowForCreatedAtField() {
+        	if (this.filter.field !== 'created_at')
+        		return undefined
+
+			return this.filter.sort === 'DESC' ? 'up' : 'down'
+		},
+		arrowForNameField() {
+        	if (this.filter.field !== 'name')
+        		return undefined
+
+			return this.filter.sort === 'DESC' ? 'up' : 'down'
+		}
     },
     data() {
         return {
diff --git a/resources/js/components/FilesView/Option.vue b/resources/js/components/FilesView/Option.vue
index f80e6243..8eb6ac87 100644
--- a/resources/js/components/FilesView/Option.vue
+++ b/resources/js/components/FilesView/Option.vue
@@ -36,8 +36,10 @@
         <div class="text-label group-hover-text-theme" :class="{'text-theme': isActive}">
             {{ title }}
         </div>
-        <div v-if="isArrowRight" class="icon-right group-hover-text-theme">
-            <chevron-right-icon size="17" class="group-hover-text-theme" :class="{'text-theme': isActive}"/>
+        <div v-if="arrow" class="icon-right group-hover-text-theme">
+            <chevron-right-icon v-if="arrow === 'right'" size="17" class="group-hover-text-theme" :class="{'text-theme': isActive}"/>
+            <arrow-up-icon v-if="arrow === 'up'" size="17" class="group-hover-text-theme" :class="{'text-theme': isActive}"/>
+            <arrow-down-icon v-if="arrow === 'down'" size="17" class="group-hover-text-theme" :class="{'text-theme': isActive}"/>
         </div>
     </li>
 </template>
@@ -45,6 +47,8 @@
 <script>
 import AlphabetIcon from '@/components/FilesView/Icons/AlphabetIcon'
 import {
+	ArrowUpIcon,
+	ArrowDownIcon,
     ChevronRightIcon,
     BoxIcon,
     MonitorIcon,
@@ -81,12 +85,14 @@ import {
         name: 'Option',
         props:[
             'isHoverDisabled',
-            'isArrowRight',
             'isActive',
             'title',
+            'arrow',
             'icon'
         ],
         components: {
+			ArrowUpIcon,
+			ArrowDownIcon,
             BoxIcon,
             MonitorIcon,
             GlobeIcon,
@@ -146,7 +152,7 @@ import {
             @include transform(translateY(3px));
         }
 
-        polyline {
+        polyline, line {
             color: inherit;
         }
     }
diff --git a/resources/js/components/Others/MobileNavigation.vue b/resources/js/components/Others/MobileNavigation.vue
index 65a5bbec..088a8b14 100644
--- a/resources/js/components/Others/MobileNavigation.vue
+++ b/resources/js/components/Others/MobileNavigation.vue
@@ -16,8 +16,8 @@
             <!--Main navigation-->
             <OptionGroup v-if="!clickedSubmenu">
                 <Option @click.native="goToFiles" :title="$t('menu.files')" icon="hard-drive" is-hover-disabled="true"/>
-                <Option @click.native.stop="showSubmenu('settings')" :title="$t('menu.settings')" icon="user" :is-arrow-right="true" is-hover-disabled="true"/>
-                <Option v-if="isAdmin" @click.native.stop="showSubmenu('admin')" :title="$t('menu.admin')" icon="settings" :is-arrow-right="true" is-hover-disabled="true"/>
+                <Option @click.native.stop="showSubmenu('settings')" :title="$t('menu.settings')" icon="user" arrow="right" is-hover-disabled="true"/>
+                <Option v-if="isAdmin" @click.native.stop="showSubmenu('admin')" :title="$t('menu.admin')" icon="settings" arrow="right" is-hover-disabled="true"/>
             </OptionGroup>
             <OptionGroup v-if="!clickedSubmenu">
                 <Option @click.native="logOut" :title="$t('menu.logout')" icon="power" is-hover-disabled="true" />