chore(issues): Remove legacy browser flag from FE (#67715)

Removes `organizations:legacy-browser-update` and logic from the
frontend.

Won't merge until relay updates are in place.

---------

Co-authored-by: Richard Roggenkemper <[email protected]>

Author: leeandher

fixtures/js-stubs/projectFilters.ts

@@ -15,7 +15,7 @@ export function ProjectFiltersFixture(params = []) {
         'This applies to both IPv4 (``127.0.0.1``) and IPv6 (``::1``) addresses.',
     },
     {
-      active: ['ie_pre_9', 'ie9'],
+      active: ['ie', 'safari'],
       id: 'legacy-browsers',
       name: 'Filter out known errors from legacy browsers',
       description:

static/app/views/settings/project/projectFilters/index.spec.tsx

@@ -110,16 +110,18 @@ describe('ProjectFilters', function () {
 
     expect(
       await screen.findByRole('checkbox', {
-        name: 'Internet Explorer (Deprecated) Version 8 and lower',
+        name: 'Internet Explorer Verison 11 and lower',
       })
     ).toBeChecked();
 
     expect(
-      screen.getByRole('checkbox', {name: 'Internet Explorer (Deprecated) Version 9'})
+      await screen.findByRole('checkbox', {
+        name: 'Safari Version 11 and lower',
+      })
     ).toBeChecked();
 
     expect(
-      screen.getByRole('checkbox', {name: 'Internet Explorer (Deprecated) Version 10'})
+      screen.getByRole('checkbox', {name: 'Firefox Version 66 and lower'})
     ).not.toBeChecked();
   });
 
@@ -131,44 +133,22 @@ describe('ProjectFilters', function () {
 
     await userEvent.click(
       await screen.findByRole('checkbox', {
-        name: 'Safari (Deprecated) Version 5 and lower',
+        name: 'Firefox Version 66 and lower',
       })
     );
     expect(mock.mock.calls[0][0]).toBe(getFilterEndpoint(filter));
     // Have to do this because no jest matcher for JS Set
     expect(Array.from(mock.mock.calls[0][1].data.subfilters)).toEqual([
-      'ie_pre_9',
-      'ie9',
-      'safari_pre_6',
+      'ie',
+      'safari',
+      'firefox',
     ]);
 
     // Toggle filter off
     await userEvent.click(
-      screen.getByRole('checkbox', {name: 'Internet Explorer (Deprecated) Version 11'})
-    );
-    expect(Array.from(mock.mock.calls[1][1].data.subfilters)).toEqual([
-      'ie_pre_9',
-      'ie9',
-      'safari_pre_6',
-      'ie11',
-    ]);
-
-    mock.mockReset();
-
-    // Click ie9 and < ie9
-    await userEvent.click(
-      screen.getByRole('checkbox', {name: 'Internet Explorer (Deprecated) Version 9'})
-    );
-    await userEvent.click(
-      screen.getByRole('checkbox', {
-        name: 'Internet Explorer (Deprecated) Version 8 and lower',
-      })
+      await screen.findByRole('checkbox', {name: 'Firefox Version 66 and lower'})
     );
-
-    expect(Array.from(mock.mock.calls[1][1].data.subfilters)).toEqual([
-      'safari_pre_6',
-      'ie11',
-    ]);
+    expect(Array.from(mock.mock.calls[1][1].data.subfilters)).toEqual(['ie', 'safari']);
   });
 
   it('can toggle all/none for legacy browser', async function () {
@@ -180,15 +160,14 @@ describe('ProjectFilters', function () {
     await userEvent.click(await screen.findByRole('button', {name: 'All'}));
     expect(mock.mock.calls[0][0]).toBe(getFilterEndpoint(filter));
     expect(Array.from(mock.mock.calls[0][1].data.subfilters)).toEqual([
-      'safari_pre_6',
-      'android_pre_4',
-      'edge_pre_79',
-      'ie_pre_9',
-      'ie9',
-      'ie10',
-      'ie11',
-      'opera_pre_15',
-      'opera_mini_pre_8',
+      'chrome',
+      'safari',
+      'firefox',
+      'android',
+      'edge',
+      'ie',
+      'opera',
+      'opera_mini',
     ]);
 
     await userEvent.click(screen.getByRole('button', {name: 'None'}));

static/app/views/settings/project/projectFilters/projectFiltersSettings.tsx

@@ -188,7 +188,6 @@ type RowProps = {
   data: {
     active: string[] | boolean;
   };
-  hasLegacyBrowserUpdate: boolean;
   onToggle: (
     data: RowProps['data'],
     filters: RowState['subfilters'],
@@ -211,8 +210,7 @@ class LegacyBrowserFilterRow extends Component<RowProps, RowState> {
     if (props.data.active === true) {
       initialSubfilters = new Set(
         Object.keys(LEGACY_BROWSER_SUBFILTERS).filter(
-          key =>
-            LEGACY_BROWSER_SUBFILTERS[key].legacy === !this.props.hasLegacyBrowserUpdate
+          key => !LEGACY_BROWSER_SUBFILTERS[key].legacy
         )
       );
     } else if (props.data.active === false) {
@@ -234,8 +232,7 @@ class LegacyBrowserFilterRow extends Component<RowProps, RowState> {
     if (subfilter === true) {
       subfilters = new Set(
         Object.keys(LEGACY_BROWSER_SUBFILTERS).filter(
-          key =>
-            LEGACY_BROWSER_SUBFILTERS[key].legacy === !this.props.hasLegacyBrowserUpdate
+          key => !LEGACY_BROWSER_SUBFILTERS[key].legacy
         )
       );
     } else if (subfilter === false) {
@@ -293,13 +290,10 @@ class LegacyBrowserFilterRow extends Component<RowProps, RowState> {
         <FilterGrid>
           {Object.keys(LEGACY_BROWSER_SUBFILTERS)
             .filter(key => {
-              if (this.props.hasLegacyBrowserUpdate) {
-                if (!LEGACY_BROWSER_SUBFILTERS[key].legacy) {
-                  return true;
-                }
-                return this.state.subfilters.has(key);
+              if (!LEGACY_BROWSER_SUBFILTERS[key].legacy) {
+                return true;
               }
-              return LEGACY_BROWSER_SUBFILTERS[key].legacy;
+              return this.state.subfilters.has(key);
             })
             .map(key => {
               const subfilter = LEGACY_BROWSER_SUBFILTERS[key];
@@ -405,9 +399,6 @@ type Filter = {
 export function ProjectFiltersSettings({project, params, features}: Props) {
   const organization = useOrganization();
   const {projectId: projectSlug} = params;
-
-  const hasLegacyBrowserUpdate = organization.features.includes('legacy-browser-update');
-
   const projectEndpoint = `/projects/${organization.slug}/${projectSlug}/`;
   const filtersEndpoint = `${projectEndpoint}filters/`;
 
@@ -511,7 +502,6 @@ export function ProjectFiltersSettings({project, params, features}: Props) {
                               onToggle={(_data, subfilters, event) =>
                                 handleLegacyChange({onChange, onBlur, event, subfilters})
                               }
-                              hasLegacyBrowserUpdate={hasLegacyBrowserUpdate}
                             />
                           )}
                         </FormField>