refactor: [M3-6257] - React Query for Firewalls

packages/api-v4/src/firewalls/types.ts

@@ -2,7 +2,7 @@ export type FirewallStatus = 'enabled' | 'disabled' | 'deleted';
 
 export type FirewallRuleProtocol = 'ALL' | 'TCP' | 'UDP' | 'ICMP' | 'IPENCAP';
 
-export type FirewallDeviceEntityType = 'linode' | 'nodebalancer';
+export type FirewallDeviceEntityType = 'linode';
 
 export type FirewallPolicyType = 'ACCEPT' | 'DROP';
 

packages/manager/cypress/e2e/firewalls/migrate-linode-with-firewall.spec.ts

@@ -219,14 +219,19 @@ describe('Migrate Linode With Firewall', () => {
         fbtClick('Create Firewall');
       });
 
-      cy.get('[data-testid="textfield-input"]')
+      cy.get('[data-testid="textfield-input"]:first')
         .should('be.visible')
         .type(firewallLabel);
 
-      cy.get('[data-qa-enhanced-select="Select a Linode or type to search..."]')
+      cy.get('[data-testid="textfield-input"]:last')
         .should('be.visible')
         .click()
-        .type(`${linode.label}{enter}`);
+        .type(linode.label);
+
+      cy.get('[data-qa-autocomplete-popper]')
+        .findByText(linode.label)
+        .should('be.visible')
+        .click();
 
       cy.findByText(linode.label).should('be.visible');
 
@@ -278,14 +283,19 @@ describe('Migrate Linode With Firewall', () => {
         fbtClick('Create Firewall');
       });
 
-      cy.get('[data-testid="textfield-input"]')
+      cy.get('[data-testid="textfield-input"]:first')
         .should('be.visible')
         .type(firewallLabel);
 
-      cy.get('[data-qa-enhanced-select="Select a Linode or type to search..."]')
+      cy.get('[data-testid="textfield-input"]:last')
         .should('be.visible')
         .click()
-        .type(`${linodeLabel}{enter}`);
+        .type(linodeLabel);
+
+      cy.get('[data-qa-autocomplete-popper]')
+        .findByText(linode.label)
+        .should('be.visible')
+        .click();
 
       cy.findByText(linodeLabel).should('be.visible');
 

packages/manager/src/App.tsx

@@ -41,6 +41,7 @@ import withPreferences, {
 } from './containers/preferences.container';
 import { loadScript } from './hooks/useScript';
 import { getNextThemeValue } from './utilities/theme';
+import { firewallEventsHandler } from './queries/firewalls';
 
 interface Props {
   location: RouteComponentProps['location'];
@@ -139,6 +140,13 @@ export class App extends React.Component<CombinedProps, State> {
       .filter((event) => event.action.startsWith('token') && !event._initial)
       .subscribe(tokenEventHandler);
 
+    /*
+      Send any Token events to the Token events handler in the queries file
+     */
+    events$
+      .filter((event) => event.action.startsWith('firewall') && !event._initial)
+      .subscribe(firewallEventsHandler);
+
     /*
      * We want to listen for migration events side-wide
      * It's unpredictable when a migration is going to happen. It could take