From 71bad5e94756980285e71188983d2278fdecceec Mon Sep 17 00:00:00 2001 From: Connie Liu <139280159+coliu-akamai@users.noreply.github.com> Date: Fri, 1 Sep 2023 17:11:12 -0400 Subject: [PATCH] change: [M3-7077] - Remove VPC column from Linodes landing page table (#9625) * remove VPC column from linode landing table and update tests * Added changeset: Removed VPC column from Linodes landing page table --- .../pr-9625-removed-1693588382719.md | 5 +++ .../LinodeRow/LinodeRow.test.tsx | 43 ++---------------- .../LinodesLanding/LinodeRow/LinodeRow.tsx | 45 ------------------- .../LinodesLanding/SortableTableHead.tsx | 7 --- 4 files changed, 9 insertions(+), 91 deletions(-) create mode 100644 packages/manager/.changeset/pr-9625-removed-1693588382719.md diff --git a/packages/manager/.changeset/pr-9625-removed-1693588382719.md b/packages/manager/.changeset/pr-9625-removed-1693588382719.md new file mode 100644 index 00000000000..155471fb661 --- /dev/null +++ b/packages/manager/.changeset/pr-9625-removed-1693588382719.md @@ -0,0 +1,5 @@ +--- +"@linode/manager": Removed +--- + +Removed VPC column from Linodes landing page table ([#9625](https://github.com/linode/manager/pull/9625)) diff --git a/packages/manager/src/features/Linodes/LinodesLanding/LinodeRow/LinodeRow.test.tsx b/packages/manager/src/features/Linodes/LinodesLanding/LinodeRow/LinodeRow.test.tsx index 50b64d25a09..925837951af 100644 --- a/packages/manager/src/features/Linodes/LinodesLanding/LinodeRow/LinodeRow.test.tsx +++ b/packages/manager/src/features/Linodes/LinodesLanding/LinodeRow/LinodeRow.test.tsx @@ -1,46 +1,13 @@ import userEvent from '@testing-library/user-event'; import { shallow } from 'enzyme'; import * as React from 'react'; -import { QueryClient } from 'react-query'; import { mockNotification } from 'src/__data__/notifications'; -import { linodeConfigFactory, linodeFactory, vpcFactory } from 'src/factories'; -import { - mockMatchMedia, - renderWithTheme, - wrapWithTableBody, -} from 'src/utilities/testHelpers'; +import { linodeFactory } from 'src/factories'; +import { renderWithTheme, wrapWithTableBody } from 'src/utilities/testHelpers'; import { LinodeRow, RenderFlag } from './LinodeRow'; -const queryClient = new QueryClient(); - -beforeAll(() => mockMatchMedia()); -afterEach(() => { - queryClient.clear(); -}); - -jest.mock('src/hooks/useFlags', () => ({ - __esModule: true, - useFlags: jest.fn().mockReturnValue({ vpc: true }), -})); - -jest.mock('src/queries/linodes/configs.ts', () => ({ - useAllLinodeConfigsQuery: jest.fn().mockReturnValue({ - data: linodeConfigFactory.buildList(1), - error: {}, - isLoading: false, - }), -})); - -jest.mock('src/queries/vpcs.ts', () => ({ - useVPCQuery: jest.fn().mockReturnValue({ - data: vpcFactory.build({ label: 'vpc-1' }), - isLoading: false, - error: {}, - }), -})); - describe('LinodeRow', () => { describe('when Linode has notification', () => { it('should render a Flag', () => { @@ -58,8 +25,7 @@ describe('LinodeRow', () => { }); }); - // TODO: VPC - when a feature flag is no longer needed for vpc, this should be changed - it('should render a linode row with associated vpc information if the feature flag is on', () => { + it('should render a linode row', () => { const linode = linodeFactory.build(); const renderedLinode = ( { ); const { getByLabelText, getByText } = renderWithTheme( - wrapWithTableBody(renderedLinode, { queryClient }) + wrapWithTableBody(renderedLinode) ); - getByText('vpc-1'); getByText(linode.label); // Open action menu diff --git a/packages/manager/src/features/Linodes/LinodesLanding/LinodeRow/LinodeRow.tsx b/packages/manager/src/features/Linodes/LinodesLanding/LinodeRow/LinodeRow.tsx index 2cbde665cb4..f07f1976c7e 100644 --- a/packages/manager/src/features/Linodes/LinodesLanding/LinodeRow/LinodeRow.tsx +++ b/packages/manager/src/features/Linodes/LinodesLanding/LinodeRow/LinodeRow.tsx @@ -1,4 +1,3 @@ -import type { Config } from '@linode/api-v4'; import { Notification } from '@linode/api-v4/lib/account'; import { SxProps } from '@mui/system'; import * as React from 'react'; @@ -7,7 +6,6 @@ import Flag from 'src/assets/icons/flag.svg'; import { BackupStatus } from 'src/components/BackupStatus/BackupStatus'; import { Hidden } from 'src/components/Hidden'; import { Link } from 'src/components/Link'; -import { Skeleton } from 'src/components/Skeleton'; import { StatusIcon } from 'src/components/StatusIcon/StatusIcon'; import { TableCell } from 'src/components/TableCell'; import { TableRow } from 'src/components/TableRow'; @@ -21,10 +19,7 @@ import { } from 'src/features/Linodes/transitions'; import { notificationContext as _notificationContext } from 'src/features/NotificationCenter/NotificationContext'; import { useNotificationsQuery } from 'src/queries/accountNotifications'; -import { useAllLinodeConfigsQuery } from 'src/queries/linodes/configs'; -import { useVPCQuery } from 'src/queries/vpcs'; import { useTypeQuery } from 'src/queries/types'; -import { useFlags } from 'src/hooks/useFlags'; import { useRecentEventForLinode } from 'src/store/selectors/recentEventForLinode'; import { capitalizeAllWords } from 'src/utilities/capitalize'; import { formatStorageUnits } from 'src/utilities/formatStorageUnits'; @@ -44,7 +39,6 @@ import { type Props = LinodeWithMaintenance & { handlers: LinodeHandlers }; export const LinodeRow = (props: Props) => { - const flags = useFlags(); const { backups, handlers, @@ -61,18 +55,6 @@ export const LinodeRow = (props: Props) => { const { data: notifications } = useNotificationsQuery(); - // TODO: VPC - later if there is a way to directly get a linode's vpc, replace this - const { data: configs, isLoading: configsLoading } = useAllLinodeConfigsQuery( - id, - flags.vpc - ); - const vpcId = getVPCId(configs ?? []); - const { data: vpc, isLoading: vpcLoading } = useVPCQuery( - vpcId ?? -1, - vpcId !== undefined && vpcId !== null - ); - const vpcLabel = vpc?.label; - const linodeNotifications = notifications?.filter( (notification) => @@ -181,21 +163,6 @@ export const LinodeRow = (props: Props) => { - {flags.vpc && ( - - - {vpcLoading || configsLoading ? ( - - ) : vpcLabel ? ( - - {vpcLabel} - - ) : ( - 'None' - )} - - - )} @@ -262,18 +229,6 @@ export const RenderFlag: React.FC<{ return null; }; -const getVPCId = (configs: Config[]) => { - for (const config of configs) { - for (const linodeInterface of config.interfaces) { - if (linodeInterface.purpose === 'vpc') { - return linodeInterface.vpc_id; - } - } - } - - return undefined; -}; - RenderFlag.displayName = `RenderFlag`; export const ProgressDisplay: React.FC<{ diff --git a/packages/manager/src/features/Linodes/LinodesLanding/SortableTableHead.tsx b/packages/manager/src/features/Linodes/LinodesLanding/SortableTableHead.tsx index 8853dc05e5c..b54254a3755 100644 --- a/packages/manager/src/features/Linodes/LinodesLanding/SortableTableHead.tsx +++ b/packages/manager/src/features/Linodes/LinodesLanding/SortableTableHead.tsx @@ -10,7 +10,6 @@ import { TableHead } from 'src/components/TableHead'; import { TableRow } from 'src/components/TableRow'; import { TableSortCell } from 'src/components/TableSortCell'; import { Tooltip } from 'src/components/Tooltip'; -import { useFlags } from 'src/hooks/useFlags'; import { StyledToggleButton } from './DisplayLinodes.styles'; @@ -30,7 +29,6 @@ type CombinedProps = Props & Omit, 'data'>; export const SortableTableHead = ( props: CombinedProps ) => { - const flags = useFlags(); const theme = useTheme(); const { @@ -141,11 +139,6 @@ export const SortableTableHead = ( - {flags.vpc && ( - - VPC - - )}