Revert "feat(custom-views): Add custom views to issue stream behind feature flag (#75883)"

This reverts commit 28a4dd2.

Co-authored-by: MichaelSun48 <[email protected]>

Author: getsentry-bot

static/app/components/draggableTabs/draggableTabList.tsx

@@ -30,6 +30,7 @@ function BaseDraggableTabList({
   outerWrapStyles,
   onReorder,
   onAddView,
+  showTempTab = false,
   tabVariant = 'filled',
   ...props
 }: BaseDraggableTabListProps) {
@@ -71,7 +72,7 @@ function BaseDraggableTabList({
   useEffect(() => {
     setTabListState(state);
     // eslint-disable-next-line react-hooks/exhaustive-deps
-  }, [state.selectedItem, state.selectedKey, props.children]);
+  }, [state.disabledKeys, state.selectedItem, state.selectedKey, props.children]);
 
   // Detect tabs that overflow from the wrapper and put them in an overflow menu
   const tabItemsRef = useRef<Record<string | number, HTMLLIElement | null>>({});
@@ -118,14 +119,11 @@ function BaseDraggableTabList({
                   variant={tabVariant}
                 />
               </Reorder.Item>
-              <TabDivider
-                layout
-                active={
-                  state.selectedKey === 'temporary-tab' ||
-                  (state.selectedKey !== item.key &&
-                    state.collection.getKeyAfter(item.key) !== state.selectedKey)
-                }
-              />
+              {(state.selectedKey === 'temporary-tab' ||
+                (state.selectedKey !== item.key &&
+                  state.collection.getKeyAfter(item.key) !== state.selectedKey)) && (
+                <TabDivider layout />
+              )}
             </Fragment>
           ))}
         </TabListWrap>
@@ -136,9 +134,9 @@ function BaseDraggableTabList({
               {t('Add View')}
             </AddViewButton>
           </MotionWrapper>
-          <TabDivider layout active />
+          <TabDivider layout />
           <MotionWrapper layout>
-            {tempTab && (
+            {showTempTab && tempTab && (
               <Tab
                 key={tempTab.key}
                 item={tempTab}
@@ -175,7 +173,12 @@ export interface DraggableTabListProps
  * To be used as a direct child of the <Tabs /> component. See example usage
  * in tabs.stories.js
  */
-export function DraggableTabList({items, onAddView, ...props}: DraggableTabListProps) {
+export function DraggableTabList({
+  items,
+  onAddView,
+  showTempTab,
+  ...props
+}: DraggableTabListProps) {
   const collection = useCollection({items, ...props}, collectionFactory);
 
   const parsedItems = useMemo(
@@ -196,6 +199,7 @@ export function DraggableTabList({items, onAddView, ...props}: DraggableTabListP
     <BaseDraggableTabList
       items={parsedItems}
       onAddView={onAddView}
+      showTempTab={showTempTab}
       disabledKeys={disabledKeys}
       {...props}
     >
@@ -206,18 +210,11 @@ export function DraggableTabList({items, onAddView, ...props}: DraggableTabListP
 
 DraggableTabList.Item = Item;
 
-const TabDivider = styled(motion.div)<{active: boolean}>`
-  ${p =>
-    p.active &&
-    `
-    background-color: ${p.theme.gray200};
-    height: 50%;
-    width: 1px;
-    border-radius: 6px;
-    margin-right: ${space(0.5)};
-  `}
-  margin-top: 1px;
-  margin-left: ${space(0.5)};
+const TabDivider = styled(motion.div)`
+  height: 50%;
+  width: 1px;
+  border-radius: 6px;
+  background-color: ${p => p.theme.gray200};
 `;
 
 const TabListOuterWrap = styled('div')<{
@@ -255,13 +252,14 @@ const TabListWrap = styled('ul')`
 const AddViewButton = styled(Button)`
   display: flex;
   color: ${p => p.theme.gray300};
+  padding-right: ${space(0.5)};
+  margin: 4px 2px 2px 2px;
   font-weight: normal;
-  padding: ${space(0.5)};
-  transform: translateY(1px);
 `;
 
 const StyledIconAdd = styled(IconAdd)`
   margin-right: 4px;
+  margin-left: 2px;
 `;
 
 const MotionWrapper = styled(motion.div)`

static/app/components/layouts/thirds.tsx

@@ -22,17 +22,14 @@ export const Page = styled('main')<{withPadding?: boolean}>`
  *
  * Use `noActionWrap` to disable wrapping if there are minimal actions.
  */
-export const Header = styled('header')<{
-  borderStyle?: 'dashed' | 'solid';
-  noActionWrap?: boolean;
-}>`
+export const Header = styled('header')<{noActionWrap?: boolean}>`
   display: grid;
   grid-template-columns: ${p =>
     !p.noActionWrap ? 'minmax(0, 1fr)' : 'minmax(0, 1fr) auto'};
 
   padding: ${space(2)} ${space(2)} 0 ${space(2)};
   background-color: transparent;
-  border-bottom: 1px ${p => p.borderStyle ?? 'solid'} ${p => p.theme.border};
+  border-bottom: 1px solid ${p => p.theme.border};
 
   @media (min-width: ${p => p.theme.breakpoints.medium}) {
     padding: ${space(2)} ${space(4)} 0 ${space(4)};

static/app/components/tabs/tab.tsx

@@ -53,7 +53,7 @@ export interface BaseTabProps {
   tabProps: DOMAttributes<FocusableElement>;
   /**
    * This controls the border style of the tab. Only active when
-   * `variant='filled'` since other variants do not have a border
+   * `variant=filled` since other variants do not have a border
    */
   borderStyle?: 'solid' | 'dashed';
   to?: string;

static/app/utils/withSavedSearches.tsx

@@ -24,24 +24,17 @@ function withSavedSearches<P extends InjectedSavedSearchesProps>(
     props: Omit<P, keyof InjectedSavedSearchesProps> & Partial<InjectedSavedSearchesProps>
   ) {
     const organization = useOrganization();
-    const {data: savedSearches, isLoading} = useFetchSavedSearchesForOrg(
-      {
-        orgSlug: organization.slug,
-      },
-      {enabled: !organization.features.includes('issue-stream-custom-views')}
-    );
-
+    const {data: savedSearches, isLoading} = useFetchSavedSearchesForOrg({
+      orgSlug: organization.slug,
+    });
     const params = useParams();
     const selectedSavedSearch = useSelectedSavedSearch();
 
     return (
       <WrappedComponent
         {...(props as P)}
         savedSearches={props.savedSearches ?? savedSearches}
-        savedSearchLoading={
-          !organization.features.includes('issue-stream-custom-views') &&
-          (props.savedSearchLoading ?? isLoading)
-        }
+        savedSearchLoading={props.savedSearchLoading ?? isLoading}
         savedSearch={props.savedSearch ?? selectedSavedSearch}
         selectedSearchId={params.searchId ?? null}
       />