From e64b62c30b9204ea2130b8a028aaf99c12a44bb9 Mon Sep 17 00:00:00 2001
From: Shariq Ansari <sharique.rik@gmail.com>
Date: Tue, 23 Jan 2024 14:57:35 +0530
Subject: [PATCH] fix: added refresh button on list view controls

---
 frontend/src/components/Icons/RefreshIcon.vue | 18 ++++++++++++++++++
 frontend/src/components/ViewControls.vue      |  8 ++++++++
 2 files changed, 26 insertions(+)
 create mode 100644 frontend/src/components/Icons/RefreshIcon.vue

diff --git a/frontend/src/components/Icons/RefreshIcon.vue b/frontend/src/components/Icons/RefreshIcon.vue
new file mode 100644
index 00000000..48fcdef0
--- /dev/null
+++ b/frontend/src/components/Icons/RefreshIcon.vue
@@ -0,0 +1,18 @@
+<template>
+  <svg width="16" height="16" fill="none" viewBox="0 0 16 16">
+    <g class="es-line-reload" clip-path="url(#a)">
+      <path
+        fill="currentColor"
+        fill-rule="evenodd"
+        d="M9.743 2.189a6 6 0 0 0-6.558 2.596.5.5 0 0 0 .844.535 5 5 0 0 1 9.12 1.683l-1.187-.686a.5.5 0 0 0-.5.866l2.165 1.25a.5.5 0 0 0 .683-.183l1.25-2.165a.5.5 0 0 0-.866-.5l-.603 1.044a6 6 0 0 0-4.348-4.44ZM3.356 9.024l1.189.687a.5.5 0 0 0 .5-.866L2.88 7.595a.5.5 0 0 0-.683.183L.947 9.943a.5.5 0 1 0 .866.5l.603-1.044a6 6 0 0 0 10.9 1.816.5.5 0 0 0-.844-.536 5 5 0 0 1-9.116-1.655Z"
+        class="Union"
+        clip-rule="evenodd"
+      />
+    </g>
+    <defs>
+      <clipPath id="a" class="a">
+        <path fill="currentColor" d="M.25 0h16v16h-16z" />
+      </clipPath>
+    </defs>
+  </svg>
+</template>
diff --git a/frontend/src/components/ViewControls.vue b/frontend/src/components/ViewControls.vue
index 7fa2a0bc..ba023695 100644
--- a/frontend/src/components/ViewControls.vue
+++ b/frontend/src/components/ViewControls.vue
@@ -41,6 +41,11 @@
           :doctype="doctype"
           @update="(isDefault) => updateColumns(isDefault)"
         />
+        <Button label="Refresh" @click="reload()" :loading="isLoading">
+          <template #icon>
+            <RefreshIcon class="h-4 w-4" />
+          </template>
+        </Button>
         <Dropdown :options="viewActions">
           <template #default>
             <Button>
@@ -69,6 +74,7 @@
   />
 </template>
 <script setup>
+import RefreshIcon from '@/components/Icons/RefreshIcon.vue'
 import EditIcon from '@/components/Icons/EditIcon.vue'
 import DuplicateIcon from '@/components/Icons/DuplicateIcon.vue'
 import PinIcon from '@/components/Icons/PinIcon.vue'
@@ -221,6 +227,8 @@ onMounted(() => {
   useDebounceFn(() => reload(), 100)()
 })
 
+const isLoading = computed(() => list.value?.loading)
+
 function reload() {
   list.value.params = getParams()
   list.value.reload()