From 8326b913f1403bf777c9b7aaa06ba82932a76797 Mon Sep 17 00:00:00 2001
From: Shekar Siri <sshekarsiri@gmail.com>
Date: Tue, 28 Jan 2025 12:54:36 +0100
Subject: [PATCH] fix(ui/db): co-browse (assist) list sorting and db default
 settings for existing users (#2977)

* fix(ui): co-browser (assist) list sorting

* fix(ui): co-browser (assist) list sorting - duration

* fix(ui): default settings values for existing users
---
 .../db/init_dbs/postgresql/1.21.0/1.21.0.sql  |  9 +++++++
 .../LiveSessionList/LiveSessionList.tsx       |  2 +-
 .../SortOrderButton/SortOrderButton.tsx       | 26 +++++++------------
 frontend/app/mstore/searchStoreLive.ts        |  2 +-
 frontend/app/mstore/sessionStore.ts           |  6 ++++-
 .../db/init_dbs/postgresql/1.21.0/1.21.0.sql  |  9 +++++++
 6 files changed, 35 insertions(+), 19 deletions(-)

diff --git a/ee/scripts/schema/db/init_dbs/postgresql/1.21.0/1.21.0.sql b/ee/scripts/schema/db/init_dbs/postgresql/1.21.0/1.21.0.sql
index 3979d7e2d..686896aca 100644
--- a/ee/scripts/schema/db/init_dbs/postgresql/1.21.0/1.21.0.sql
+++ b/ee/scripts/schema/db/init_dbs/postgresql/1.21.0/1.21.0.sql
@@ -93,6 +93,15 @@ DROP TYPE IF EXISTS events.resource_method;
 
 ALTER TYPE integration_provider ADD VALUE IF NOT EXISTS 'dynatrace';
 
+UPDATE users SET settings=COALESCE(settings, '{}'::jsonb) || '{
+  "modules": [
+    "usability-tests",
+    "feature-flags"
+  ]
+}'::jsonb
+WHERE settings IS NULL
+   OR settings -> 'modules' IS NULL;
+
 COMMIT;
 
 \elif :is_next
diff --git a/frontend/app/components/shared/LiveSessionList/LiveSessionList.tsx b/frontend/app/components/shared/LiveSessionList/LiveSessionList.tsx
index 1f48ab0b5..03196a697 100644
--- a/frontend/app/components/shared/LiveSessionList/LiveSessionList.tsx
+++ b/frontend/app/components/shared/LiveSessionList/LiveSessionList.tsx
@@ -30,7 +30,7 @@ function LiveSessionList() {
   let timeoutId: any;
   const { filters } = filter;
   const hasUserFilter = filters.map((i: any) => i.key).includes(KEYS.USERID);
-  const sortOptions = [{ label: 'Start Time', value: 'timestamp' }].concat(
+  const sortOptions = [{ label: 'Start Time', value: 'timestamp' }, { label: 'Duration', value: 'duration' }].concat(
     metaList
       .map(({ key }: any) => ({
         label: capitalize(key),
diff --git a/frontend/app/components/shared/SortOrderButton/SortOrderButton.tsx b/frontend/app/components/shared/SortOrderButton/SortOrderButton.tsx
index ce585fc0b..79c2b1144 100644
--- a/frontend/app/components/shared/SortOrderButton/SortOrderButton.tsx
+++ b/frontend/app/components/shared/SortOrderButton/SortOrderButton.tsx
@@ -6,28 +6,22 @@ interface Props {
   sortOrder: string;
   onChange?: (sortOrder: string) => void;
 }
+
 export default React.memo(function SortOrderButton(props: Props) {
   const { sortOrder, onChange = () => null } = props;
   const isAscending = sortOrder === 'asc';
 
   return (
     <div className="rounded-full">
-
-          <Segmented
-            size='small'
-            options={[
-              { label: 'Ascending', value: 'Ascending', icon: <ArrowUpOutlined /> },
-              { label: 'Descending', value: 'Descending', icon: <ArrowDownOutlined /> },
-            ]}
-            defaultValue="Ascending"
-            onChange={(value) => {
-              if (value === 'Ascending') {
-                onChange('asc');
-              } else if (value === 'Descending') {
-                onChange('desc');
-              }
-            }}
-          />
+      <Segmented
+        size="small"
+        options={[
+          { label: 'Ascending', value: 'asc', icon: <ArrowUpOutlined /> },
+          { label: 'Descending', value: 'desc', icon: <ArrowDownOutlined /> }
+        ]}
+        defaultValue={sortOrder}
+        onChange={onChange}
+      />
     </div>
   );
 });
diff --git a/frontend/app/mstore/searchStoreLive.ts b/frontend/app/mstore/searchStoreLive.ts
index ac042de14..c02e6eef4 100644
--- a/frontend/app/mstore/searchStoreLive.ts
+++ b/frontend/app/mstore/searchStoreLive.ts
@@ -49,7 +49,7 @@ class SearchStoreLive {
   latestRequestTime: number | null = null;
   latestList = List();
   alertMetricId: number | null = null;
-  instance = new Search();
+  instance = new Search({ sort: 'timestamp', order: 'desc' });
   instanceLive = new Search();
   savedSearch = new Search();
   filterSearchList: any = {};
diff --git a/frontend/app/mstore/sessionStore.ts b/frontend/app/mstore/sessionStore.ts
index f48efcd2b..95d92f00d 100644
--- a/frontend/app/mstore/sessionStore.ts
+++ b/frontend/app/mstore/sessionStore.ts
@@ -201,11 +201,15 @@ export default class SessionStore {
     });
   }
 
-  fetchLiveSessions = async (params = {}) => {
+  fetchLiveSessions = async (params: any = {}) => {
     runInAction(() => {
       this.loadingLiveSessions = true;
     })
     try {
+      if (params.sort === 'duration') { // TODO ui hack to sort by duration, should be removed once the api addressed this issue
+        params.sort = 'timestamp';
+        params.order = params.order === 'asc' ? 'desc' : 'asc';
+      }
       const data: any = await sessionService.getLiveSessions(params);
       this.liveSessions = data.sessions.map((session: any) => new Session({ ...session, live: true }));
       this.totalLiveSessions = data.total;
diff --git a/scripts/schema/db/init_dbs/postgresql/1.21.0/1.21.0.sql b/scripts/schema/db/init_dbs/postgresql/1.21.0/1.21.0.sql
index d11df4e0b..98f66aa61 100644
--- a/scripts/schema/db/init_dbs/postgresql/1.21.0/1.21.0.sql
+++ b/scripts/schema/db/init_dbs/postgresql/1.21.0/1.21.0.sql
@@ -88,6 +88,15 @@ DROP TYPE IF EXISTS events.resource_method;
 
 ALTER TYPE integration_provider ADD VALUE IF NOT EXISTS 'dynatrace';
 
+UPDATE users SET settings=COALESCE(settings, '{}'::jsonb) || '{
+  "modules": [
+    "usability-tests",
+    "feature-flags"
+  ]
+}'::jsonb
+WHERE settings IS NULL
+   OR settings -> 'modules' IS NULL;
+
 COMMIT;
 
 \elif :is_next