Remove gsv fetch in savedsearch hoc + other fixes/improvements

getsentry · Aug 15, 2024 · 22a449d · 22a449d
1 parent be665e2
commit 22a449d
Show file tree

Hide file tree

Showing 3 changed files with 30 additions and 39 deletions.
diff --git a/static/app/utils/withSavedSearches.tsx b/static/app/utils/withSavedSearches.tsx
@@ -3,13 +3,10 @@ import type {RouteComponentProps} from 'react-router';
 import type {SavedSearch} from 'sentry/types/group';
 import useOrganization from 'sentry/utils/useOrganization';
 import {useParams} from 'sentry/utils/useParams';
-import {useFetchGroupSearchViews} from 'sentry/views/issueList/queries/useFetchGroupSearchViews';
 import {useFetchSavedSearchesForOrg} from 'sentry/views/issueList/queries/useFetchSavedSearchesForOrg';
-import type {GroupSearchView} from 'sentry/views/issueList/types';
 import {useSelectedSavedSearch} from 'sentry/views/issueList/utils/useSelectedSavedSearch';
 
 type InjectedSavedSearchesProps = {
-  groupSearchView: GroupSearchView | null;
   savedSearch: SavedSearch | null;
   savedSearchLoading: boolean;
   savedSearches: SavedSearch[];
@@ -34,24 +31,19 @@ function withSavedSearches<P extends InjectedSavedSearchesProps>(
       {enabled: !organization.features.includes('issue-stream-custom-views')}
     );
 
-    const {data: groupSearchViews} = useFetchGroupSearchViews(
-      {
-        orgSlug: organization.slug,
-      },
-      {enabled: organization.features.includes('issue-stream-custom-views')}
-    );
-
     const params = useParams();
     const selectedSavedSearch = useSelectedSavedSearch();
 
     return (
       <WrappedComponent
         {...(props as P)}
         savedSearches={props.savedSearches ?? savedSearches}
-        savedSearchLoading={props.savedSearchLoading ?? isLoading}
+        savedSearchLoading={
+          !organization.features.includes('issue-stream-custom-views') &&
+          (props.savedSearchLoading ?? isLoading)
+        }
         savedSearch={props.savedSearch ?? selectedSavedSearch}
         selectedSearchId={params.searchId ?? null}
-        groupSearchView={groupSearchViews?.[0] ?? null}
       />
     );
   };

diff --git a/static/app/views/issueList/customViewsHeader.tsx b/static/app/views/issueList/customViewsHeader.tsx
@@ -1,4 +1,4 @@
-import {useEffect, useState} from 'react';
+import {useEffect, useMemo, useState} from 'react';
 import type {InjectedRouter} from 'react-router';
 import styled from '@emotion/styled';
 import {debounce} from 'lodash';
@@ -26,7 +26,6 @@ type CustomViewsIssueListHeaderProps = {
   queryCounts: QueryCounts;
   router: InjectedRouter;
   selectedProjectIds: number[];
-  initalView?: GroupSearchView;
 };
 
 type CustomViewsIssueListHeaderTabsContentProps = {
@@ -36,10 +35,13 @@ type CustomViewsIssueListHeaderTabsContentProps = {
   views: GroupSearchView[];
 };
 
-function CustomViewsIssueListHeader({...props}: CustomViewsIssueListHeaderProps) {
+function CustomViewsIssueListHeader({
+  selectedProjectIds,
+  ...props
+}: CustomViewsIssueListHeaderProps) {
   const {projects} = useProjects();
   const selectedProjects = projects.filter(({id}) =>
-    props.selectedProjectIds.includes(Number(id))
+    selectedProjectIds.includes(Number(id))
   );
 
   const {data: groupSearchViews} = useFetchGroupSearchViews({
@@ -132,20 +134,24 @@ function CustomViewsIssueListHeaderTabsContent({
 
   const {mutate: updateViews} = useUpdateGroupSearchViews();
 
-  const debounceUpdateViews = debounce((newTabs: Tab[]) => {
-    if (newTabs) {
-      updateViews({
-        orgSlug: organization.slug,
-        groupSearchViews: newTabs.map(tab => ({
-          // Do not send over an ID if it's a temporary id
-          ...(tab.id[0] !== '_' ? {id: tab.id} : {}),
-          name: tab.label,
-          query: tab.query,
-          querySort: tab.querySort,
-        })),
-      });
-    }
-  }, 500);
+  const debounceUpdateViews = useMemo(
+    () =>
+      debounce((newTabs: Tab[]) => {
+        if (newTabs) {
+          updateViews({
+            orgSlug: organization.slug,
+            groupSearchViews: newTabs.map(tab => ({
+              // Do not send over an ID if it's a temporary id
+              ...(tab.id[0] !== '_' ? {id: tab.id} : {}),
+              name: tab.label,
+              query: tab.query,
+              querySort: tab.querySort,
+            })),
+          });
+        }
+      }, 500),
+    [organization.slug, updateViews]
+  );
 
   useEffect(() => {
     // If no query, sort, or viewId is present, set the first tab as the selected tab, update query accordingly
@@ -262,7 +268,7 @@ function CustomViewsIssueListHeaderTabsContent({
   }, [queryCounts]);
 
   return (
-    <StyledDraggableTabBar
+    <DraggableTabBar
       selectedTabKey={selectedTabKey}
       setSelectedTabKey={setSelectedTabKey}
       tabs={draggableTabs}
@@ -294,8 +300,3 @@ const StyledGlobalEventProcessingAlert = styled(GlobalEventProcessingAlert)`
     margin-bottom: 0;
   }
 `;
-
-const StyledDraggableTabBar = styled(DraggableTabBar)`
-  border: none;
-  font: Rubik;
-`;
diff --git a/static/app/views/issueList/overview.tsx b/static/app/views/issueList/overview.tsx
@@ -63,7 +63,7 @@ import withPageFilters from 'sentry/utils/withPageFilters';
 import withSavedSearches from 'sentry/utils/withSavedSearches';
 import CustomViewsIssueListHeader from 'sentry/views/issueList/customViewsHeader';
 import SavedIssueSearches from 'sentry/views/issueList/savedIssueSearches';
-import type {GroupSearchView, IssueUpdateData} from 'sentry/views/issueList/types';
+import type {IssueUpdateData} from 'sentry/views/issueList/types';
 import {parseIssuePrioritySearch} from 'sentry/views/issueList/utils/parseIssuePrioritySearch';
 
 import IssueListActions from './actions';
@@ -95,7 +95,6 @@ type Params = {
 
 type Props = {
   api: Client;
-  groupSearchView: GroupSearchView | null;
   location: Location;
   organization: Organization;
   params: Params;
@@ -1229,7 +1228,6 @@ class IssueListOverview extends Component<Props, State> {
         {organization.features.includes('issue-stream-custom-views') ? (
           <CustomViewsIssueListHeader
             organization={organization}
-            initalView={this.props.groupSearchView ?? undefined}
             queryCounts={queryCounts}
             router={router}
             selectedProjectIds={selection.projects}