From 6e8ba63725f1df15e1fc116a499e5d6cb90e4f9a Mon Sep 17 00:00:00 2001
From: Gareth Fuller <gareth.a.f@gmail.com>
Date: Thu, 6 Jul 2023 16:28:01 +0100
Subject: [PATCH] feat: Store chosen sort column in local storage

---
 src/constants/local-storage.keys.ts |  1 +
 src/pages/index.vue                 | 13 ++++++++++++-
 2 files changed, 13 insertions(+), 1 deletion(-)

diff --git a/src/constants/local-storage.keys.ts b/src/constants/local-storage.keys.ts
index 240d02aadb..398bdf5d46 100644
--- a/src/constants/local-storage.keys.ts
+++ b/src/constants/local-storage.keys.ts
@@ -8,6 +8,7 @@ export default {
     EthereumTxType: 'app.ethereumTxType',
     SupportSignatures: 'app.supportSignatures',
     TermsAccepted: 'app.termsAccepted',
+    PoolSorting: 'app.poolSorting',
   },
   Swap: {
     Gasless: 'swap.gasless',
diff --git a/src/pages/index.vue b/src/pages/index.vue
index e2fc31c01c..9f04920f2d 100644
--- a/src/pages/index.vue
+++ b/src/pages/index.vue
@@ -9,8 +9,17 @@ import usePoolFilters from '@/composables/pools/usePoolFilters';
 import useBreakpoints from '@/composables/useBreakpoints';
 import useNetwork from '@/composables/useNetwork';
 import usePools from '@/composables/pools/usePools';
+import { lsGet, lsSet } from '@/lib/utils';
+import LS_KEYS from '@/constants/local-storage.keys';
 
-// COMPOSABLES
+/**
+ * STATE
+ */
+const initSortCol = lsGet(LS_KEYS.App.PoolSorting) || 'totalLiquidity';
+
+/**
+ * COMPOSABLES
+ */
 const router = useRouter();
 const { appNetworkConfig } = useNetwork();
 const isElementSupported = appNetworkConfig.supportsElementPools;
@@ -37,6 +46,7 @@ function navigateToCreatePool() {
 
 function onColumnSort(columnId: string) {
   poolsSortField.value = columnId;
+  lsSet(LS_KEYS.App.PoolSorting, columnId);
 }
 </script>
 
@@ -91,6 +101,7 @@ function onColumnSort(columnId: string) {
           :isLoading="isLoading"
           :selectedTokens="selectedTokens"
           class="mb-8"
+          :sortColumn="initSortCol"
           :hiddenColumns="['migrate', 'actions', 'lockEndDate']"
           :isLoadingMore="poolsIsFetchingNextPage"
           :isPaginated="isPaginated"