diff --git a/package-lock.json b/package-lock.json index d1e756ea..36095783 100644 --- a/package-lock.json +++ b/package-lock.json @@ -3996,150 +3996,6 @@ "node": ">=10" } }, - "node_modules/@swc/core-darwin-x64": { - "version": "1.3.90", - "resolved": "https://registry.npmjs.org/@swc/core-darwin-x64/-/core-darwin-x64-1.3.90.tgz", - "integrity": "sha512-hKNM0Ix0qMlAamPe0HUfaAhQVbZEL5uK6Iw8v9ew0FtVB4v7EifQ9n41wh+yCj0CjcHBPEBbQU0P6mNTxJu/RQ==", - "cpu": [ - "x64" - ], - "dev": true, - "optional": true, - "os": [ - "darwin" - ], - "engines": { - "node": ">=10" - } - }, - "node_modules/@swc/core-linux-arm-gnueabihf": { - "version": "1.3.90", - "resolved": "https://registry.npmjs.org/@swc/core-linux-arm-gnueabihf/-/core-linux-arm-gnueabihf-1.3.90.tgz", - "integrity": "sha512-HumvtrqTWE8rlFuKt7If0ZL7145H/jVc4AeziVjcd+/ajpqub7IyfrLCYd5PmKMtfeSVDMsxjG0BJ0HLRxrTJA==", - "cpu": [ - "arm" - ], - "dev": true, - "optional": true, - "os": [ - "linux" - ], - "engines": { - "node": ">=10" - } - }, - "node_modules/@swc/core-linux-arm64-gnu": { - "version": "1.3.90", - "resolved": "https://registry.npmjs.org/@swc/core-linux-arm64-gnu/-/core-linux-arm64-gnu-1.3.90.tgz", - "integrity": "sha512-tA7DqCS7YCwngwXZQeqQhhMm8BbydpaABw8Z/EDQ7KPK1iZ1rNjZw+aWvSpmNmEGmH1RmQ9QDS9mGRDp0faAeg==", - "cpu": [ - "arm64" - ], - "dev": true, - "optional": true, - "os": [ - "linux" - ], - "engines": { - "node": ">=10" - } - }, - "node_modules/@swc/core-linux-arm64-musl": { - "version": "1.3.90", - "resolved": "https://registry.npmjs.org/@swc/core-linux-arm64-musl/-/core-linux-arm64-musl-1.3.90.tgz", - "integrity": "sha512-p2Vtid5BZA36fJkNUwk5HP+HJlKgTru+Ghna7pRe45ghKkkRIUk3fhkgudEvfKfhT+3AvP+GTVQ+T9k0gc9S8w==", - "cpu": [ - "arm64" - ], - "dev": true, - "optional": true, - "os": [ - "linux" - ], - "engines": { - "node": ">=10" - } - }, - "node_modules/@swc/core-linux-x64-gnu": { - "version": "1.3.90", - "resolved": "https://registry.npmjs.org/@swc/core-linux-x64-gnu/-/core-linux-x64-gnu-1.3.90.tgz", - "integrity": "sha512-J6pDtWaulYGXuANERuvv4CqmUbZOQrRZBCRQGZQJ6a86RWpesZqckBelnYx48wYmkgvMkF95Y3xbI3WTfoSHzw==", - "cpu": [ - "x64" - ], - "dev": true, - "optional": true, - "os": [ - "linux" - ], - "engines": { - "node": ">=10" - } - }, - "node_modules/@swc/core-linux-x64-musl": { - "version": "1.3.90", - "resolved": "https://registry.npmjs.org/@swc/core-linux-x64-musl/-/core-linux-x64-musl-1.3.90.tgz", - "integrity": "sha512-3Gh6EA3+0K+l3MqnRON7h5bZ32xLmfcVM6QiHHJ9dBttq7YOEeEoMOCdIPMaQxJmK1VfLgZCsPYRd66MhvUSkw==", - "cpu": [ - "x64" - ], - "dev": true, - "optional": true, - "os": [ - "linux" - ], - "engines": { - "node": ">=10" - } - }, - "node_modules/@swc/core-win32-arm64-msvc": { - "version": "1.3.90", - "resolved": "https://registry.npmjs.org/@swc/core-win32-arm64-msvc/-/core-win32-arm64-msvc-1.3.90.tgz", - "integrity": "sha512-BNaw/iJloDyaNOFV23Sr53ULlnbmzSoerTJ10v0TjSZOEIpsS0Rw6xOK1iI0voDJnRXeZeWRSxEC9DhefNtN/g==", - "cpu": [ - "arm64" - ], - "dev": true, - "optional": true, - "os": [ - "win32" - ], - "engines": { - "node": ">=10" - } - }, - "node_modules/@swc/core-win32-ia32-msvc": { - "version": "1.3.90", - "resolved": "https://registry.npmjs.org/@swc/core-win32-ia32-msvc/-/core-win32-ia32-msvc-1.3.90.tgz", - "integrity": "sha512-SiyTethWAheE/JbxXCukAAciU//PLcmVZ2ME92MRuLMLmOhrwksjbaa7ukj9WEF3LWrherhSqTXnpj3VC1l/qw==", - "cpu": [ - "ia32" - ], - "dev": true, - "optional": true, - "os": [ - "win32" - ], - "engines": { - "node": ">=10" - } - }, - "node_modules/@swc/core-win32-x64-msvc": { - "version": "1.3.90", - "resolved": "https://registry.npmjs.org/@swc/core-win32-x64-msvc/-/core-win32-x64-msvc-1.3.90.tgz", - "integrity": "sha512-OpWAW5ljKcPJ3SQ0pUuKqYfwXv7ssIhVgrH9XP9ONtdgXKWZRL9hqJQkcL55FARw/gDjKanoCM47wsTNQL+ZZA==", - "cpu": [ - "x64" - ], - "dev": true, - "optional": true, - "os": [ - "win32" - ], - "engines": { - "node": ">=10" - } - }, "node_modules/@swc/counter": { "version": "0.1.1", "resolved": "https://registry.npmjs.org/@swc/counter/-/counter-0.1.1.tgz", @@ -23043,69 +22899,6 @@ "dev": true, "optional": true }, - "@swc/core-darwin-x64": { - "version": "1.3.90", - "resolved": "https://registry.npmjs.org/@swc/core-darwin-x64/-/core-darwin-x64-1.3.90.tgz", - "integrity": "sha512-hKNM0Ix0qMlAamPe0HUfaAhQVbZEL5uK6Iw8v9ew0FtVB4v7EifQ9n41wh+yCj0CjcHBPEBbQU0P6mNTxJu/RQ==", - "dev": true, - "optional": true - }, - "@swc/core-linux-arm-gnueabihf": { - "version": "1.3.90", - "resolved": "https://registry.npmjs.org/@swc/core-linux-arm-gnueabihf/-/core-linux-arm-gnueabihf-1.3.90.tgz", - "integrity": "sha512-HumvtrqTWE8rlFuKt7If0ZL7145H/jVc4AeziVjcd+/ajpqub7IyfrLCYd5PmKMtfeSVDMsxjG0BJ0HLRxrTJA==", - "dev": true, - "optional": true - }, - "@swc/core-linux-arm64-gnu": { - "version": "1.3.90", - "resolved": "https://registry.npmjs.org/@swc/core-linux-arm64-gnu/-/core-linux-arm64-gnu-1.3.90.tgz", - "integrity": "sha512-tA7DqCS7YCwngwXZQeqQhhMm8BbydpaABw8Z/EDQ7KPK1iZ1rNjZw+aWvSpmNmEGmH1RmQ9QDS9mGRDp0faAeg==", - "dev": true, - "optional": true - }, - "@swc/core-linux-arm64-musl": { - "version": "1.3.90", - "resolved": "https://registry.npmjs.org/@swc/core-linux-arm64-musl/-/core-linux-arm64-musl-1.3.90.tgz", - "integrity": "sha512-p2Vtid5BZA36fJkNUwk5HP+HJlKgTru+Ghna7pRe45ghKkkRIUk3fhkgudEvfKfhT+3AvP+GTVQ+T9k0gc9S8w==", - "dev": true, - "optional": true - }, - "@swc/core-linux-x64-gnu": { - "version": "1.3.90", - "resolved": "https://registry.npmjs.org/@swc/core-linux-x64-gnu/-/core-linux-x64-gnu-1.3.90.tgz", - "integrity": "sha512-J6pDtWaulYGXuANERuvv4CqmUbZOQrRZBCRQGZQJ6a86RWpesZqckBelnYx48wYmkgvMkF95Y3xbI3WTfoSHzw==", - "dev": true, - "optional": true - }, - "@swc/core-linux-x64-musl": { - "version": "1.3.90", - "resolved": "https://registry.npmjs.org/@swc/core-linux-x64-musl/-/core-linux-x64-musl-1.3.90.tgz", - "integrity": "sha512-3Gh6EA3+0K+l3MqnRON7h5bZ32xLmfcVM6QiHHJ9dBttq7YOEeEoMOCdIPMaQxJmK1VfLgZCsPYRd66MhvUSkw==", - "dev": true, - "optional": true - }, - "@swc/core-win32-arm64-msvc": { - "version": "1.3.90", - "resolved": "https://registry.npmjs.org/@swc/core-win32-arm64-msvc/-/core-win32-arm64-msvc-1.3.90.tgz", - "integrity": "sha512-BNaw/iJloDyaNOFV23Sr53ULlnbmzSoerTJ10v0TjSZOEIpsS0Rw6xOK1iI0voDJnRXeZeWRSxEC9DhefNtN/g==", - "dev": true, - "optional": true - }, - "@swc/core-win32-ia32-msvc": { - "version": "1.3.90", - "resolved": "https://registry.npmjs.org/@swc/core-win32-ia32-msvc/-/core-win32-ia32-msvc-1.3.90.tgz", - "integrity": "sha512-SiyTethWAheE/JbxXCukAAciU//PLcmVZ2ME92MRuLMLmOhrwksjbaa7ukj9WEF3LWrherhSqTXnpj3VC1l/qw==", - "dev": true, - "optional": true - }, - "@swc/core-win32-x64-msvc": { - "version": "1.3.90", - "resolved": "https://registry.npmjs.org/@swc/core-win32-x64-msvc/-/core-win32-x64-msvc-1.3.90.tgz", - "integrity": "sha512-OpWAW5ljKcPJ3SQ0pUuKqYfwXv7ssIhVgrH9XP9ONtdgXKWZRL9hqJQkcL55FARw/gDjKanoCM47wsTNQL+ZZA==", - "dev": true, - "optional": true - }, "@swc/counter": { "version": "0.1.1", "resolved": "https://registry.npmjs.org/@swc/counter/-/counter-0.1.1.tgz", diff --git a/src/Pages/ContentListTable/ContentListTable.test.tsx b/src/Pages/ContentListTable/ContentListTable.test.tsx index df437825..a73fc8f8 100644 --- a/src/Pages/ContentListTable/ContentListTable.test.tsx +++ b/src/Pages/ContentListTable/ContentListTable.test.tsx @@ -1,4 +1,3 @@ -import { render, waitFor } from '@testing-library/react'; import dayjs from 'dayjs'; import { ReactQueryTestWrapper, @@ -6,9 +5,11 @@ import { defaultSnapshotItem, testRepositoryParamsResponse, } from '../../testingHelpers'; +import { render, waitFor } from '@testing-library/react'; import ContentListTable from './ContentListTable'; import { useContentListQuery, useRepositoryParams } from '../../services/Content/ContentQueries'; import AddContent from './components/AddContent/AddContent'; +import { ContentOrigin } from '../../services/Content/ContentApi'; jest.mock('../../services/Content/ContentQueries', () => ({ useRepositoryParams: jest.fn(), @@ -22,7 +23,10 @@ jest.mock('../../services/Content/ContentQueries', () => ({ })); jest.mock('../../middleware/AppContext', () => ({ - useAppContext: () => ({}), + useAppContext: () => ({ + contentOrigin: ContentOrigin.EXTERNAL, + setContentOrigin: () => {}, + }), })); jest.mock('./components/AddContent/AddContent'); @@ -30,6 +34,7 @@ jest.mock('./components/AddContent/AddContent'); jest.mock('react-router-dom', () => ({ useNavigate: jest.fn(), Outlet: () => <>, + useSearchParams: () => [{ get: () => 'external' }, () => {}], })); (AddContent as jest.Mock).mockImplementation(() => 'Add Content'); @@ -116,3 +121,52 @@ it('Render with a single row', () => { ).toBeInTheDocument(), ); }); + +it('Render with a single redhat repository', () => { + jest.mock('react-router-dom', () => ({ + useNavigate: jest.fn(), + Outlet: () => <>, + useSearchParams: () => [{ get: () => 'red_hat' }, () => {}], + })); + jest.mock('../../middleware/AppContext', () => ({ + useAppContext: () => ({ + contentOrigin: ContentOrigin.REDHAT, + setContentOrigin: () => {}, + }), + })); + (useRepositoryParams as jest.Mock).mockImplementation(() => ({ + isLoading: false, + data: testRepositoryParamsResponse, + })); + (useContentListQuery as jest.Mock).mockImplementation(() => ({ + isLoading: false, + data: { + data: [ + { + account_id: 'undefined', + distribution_arch: 'x86_64', + distribution_versions: ['el7'], + name: 'AwesomeNamewwyylse12', + org_id: '-1', + url: 'https://google.ca/wwyylse12/x86_64/el7', + uuid: '2375c35b-a67a-4ac2-a989-21139433c172', + package_count: 0, + }, + ], + meta: { count: 1, limit: 20, offset: 0 }, + }, + })); + + const { queryByText } = render( + + + , + ); + + waitFor(() => { + const value = document.getElementById('redhat-repositories-toggle-button'); + expect(value?.getAttribute('aria-pressed')).toBe(true); + }); + expect(queryByText('AwesomeNamewwyylse12')).toBeInTheDocument(); + expect(queryByText('https://google.ca/wwyylse12/x86_64/el7')).toBeInTheDocument(); +}); diff --git a/src/Pages/ContentListTable/ContentListTable.tsx b/src/Pages/ContentListTable/ContentListTable.tsx index 3d233071..32d988b7 100644 --- a/src/Pages/ContentListTable/ContentListTable.tsx +++ b/src/Pages/ContentListTable/ContentListTable.tsx @@ -21,12 +21,13 @@ import { Tr, } from '@patternfly/react-table'; import { global_BackgroundColor_100, global_Color_400 } from '@patternfly/react-tokens'; -import { useCallback, useMemo, useState } from 'react'; +import { useCallback, useEffect, useMemo, useState } from 'react'; import { createUseStyles } from 'react-jss'; import { ContentItem, FilterData, IntrospectRepositoryRequestItem, + ContentOrigin, } from '../../services/Content/ContentApi'; import { SkeletonTable } from '@redhat-cloud-services/frontend-components'; @@ -47,8 +48,8 @@ import PackageCount from './components/PackageCount'; import { useAppContext } from '../../middleware/AppContext'; import ConditionalTooltip from '../../components/ConditionalTooltip/ConditionalTooltip'; import dayjs from 'dayjs'; -import { Outlet, useNavigate, useOutletContext } from 'react-router-dom'; import ChangedArrows from './components/SnapshotListModal/components/ChangedArrows'; +import { Outlet, useNavigate, useOutletContext, useSearchParams } from 'react-router-dom'; const useStyles = createUseStyles({ mainContainer: { @@ -90,13 +91,15 @@ const ContentListTable = () => { const classes = useStyles(); const queryClient = useQueryClient(); const navigate = useNavigate(); - const { rbac, features } = useAppContext(); + const { rbac, features, contentOrigin, setContentOrigin } = useAppContext(); + const [urlSearchParams, setUrlSearchParams] = useSearchParams(); const storedPerPage = Number(localStorage.getItem(perPageKey)) || 20; const [page, setPage] = useState(1); const [perPage, setPerPage] = useState(storedPerPage); const [activeSortIndex, setActiveSortIndex] = useState(0); const [activeSortDirection, setActiveSortDirection] = useState<'asc' | 'desc'>('asc'); - const [checkedRepositories, setCheckedRepositories] = useState(new Set()); + const [checkedRepositories, setCheckedRepositories] = useState>(new Set()); + const isRedHatRepository = contentOrigin === ContentOrigin.REDHAT; const [filterData, setFilterData] = useState({ searchQuery: '', @@ -105,6 +108,20 @@ const ContentListTable = () => { statuses: [], }); + const setOriginAndSearchParams = (origin: ContentOrigin) => { + setContentOrigin(origin); + setUrlSearchParams(origin === ContentOrigin.EXTERNAL ? {} : { origin }); + }; + + useEffect(() => { + if ( + contentOrigin === ContentOrigin.REDHAT || + urlSearchParams.get('origin') === ContentOrigin.REDHAT + ) { + setOriginAndSearchParams(ContentOrigin.REDHAT); + } + }, []); + const clearFilters = () => setFilterData({ searchQuery: '', versions: [], arches: [], statuses: [] }); @@ -142,7 +159,7 @@ const ContentListTable = () => { isError, isFetching, data = { data: [], meta: { count: 0, limit: 20, offset: 0 } }, - } = useContentListQuery(page, perPage, filterData, sortString()); + } = useContentListQuery(page, perPage, filterData, sortString(), contentOrigin); const { mutateAsync: deleteItem, isLoading: isDeleting } = useDeleteContentItemMutate( queryClient, @@ -223,50 +240,69 @@ const ContentListTable = () => { } = data; const rowActions = useCallback( - (rowData: ContentItem): IAction[] => [ - { - isDisabled: actionTakingPlace, - title: 'Edit', - onClick: () => { - navigate(`edit-repository?repoUUIDS=${rowData.uuid}`); - }, - }, - ...(features?.snapshots?.accessible - ? [ + (rowData: ContentItem): IAction[] => + isRedHatRepository + ? features?.snapshots?.accessible + ? [ + { + isDisabled: + actionTakingPlace || + !rowData.snapshot || + !(rowData.snapshot && rowData.last_snapshot_uuid), + title: + rowData.snapshot && rowData.last_snapshot_uuid + ? 'View all snapshots' + : 'No snapshots yet', + onClick: () => { + navigate(`${rowData.uuid}/snapshots`); + }, + }, + ] + : [] + : [ { - isDisabled: - actionTakingPlace || - !rowData.snapshot || - !(rowData.snapshot && rowData.last_snapshot_uuid), - title: - rowData.snapshot && rowData.last_snapshot_uuid - ? 'View all snapshots' - : 'No snapshots yet', + isDisabled: actionTakingPlace, + title: 'Edit', onClick: () => { - navigate(`${rowData.uuid}/snapshots`); + navigate(`edit-repository?repoUUIDS=${rowData.uuid}`); }, }, - ] - : []), - { - isDisabled: actionTakingPlace || rowData?.status == 'Retrying', - title: 'Introspect Now', - onClick: () => introspectRepoForUuid(rowData?.uuid).then(clearCheckedRepositories), - }, - { isSeparator: true }, - { - title: 'Delete', - onClick: () => - deleteItem(rowData?.uuid).then(() => { - clearCheckedRepositories(); - // If this is the last item on a page, go to previous page. - if (page > 1 && count / perPage + 1 >= page && (count - 1) % perPage === 0) { - setPage(page - 1); - } - }), - }, - ], - [actionTakingPlace, checkedRepositories], + ...(features?.snapshots?.accessible + ? [ + { + isDisabled: + actionTakingPlace || + !rowData.snapshot || + !(rowData.snapshot && rowData.last_snapshot_uuid), + title: + rowData.snapshot && rowData.last_snapshot_uuid + ? 'View all snapshots' + : 'No snapshots yet', + onClick: () => { + navigate(`${rowData.uuid}/snapshots`); + }, + }, + ] + : []), + { + isDisabled: actionTakingPlace || rowData?.status == 'Retrying', + title: 'Introspect Now', + onClick: () => introspectRepoForUuid(rowData?.uuid).then(clearCheckedRepositories), + }, + { isSeparator: true }, + { + title: 'Delete', + onClick: () => + deleteItem(rowData?.uuid).then(() => { + clearCheckedRepositories(); + // If this is the last item on a page, go to previous page. + if (page > 1 && count / perPage + 1 >= page && (count - 1) % perPage === 0) { + setPage(page - 1); + } + }), + }, + ], + [actionTakingPlace, checkedRepositories, isRedHatRepository], ); const clearCheckedRepositories = () => setCheckedRepositories(new Set()); @@ -328,209 +364,56 @@ const ContentListTable = () => { clearCheckedRepositories(); }); - const itemName = 'custom repositories'; + const itemName = + contentOrigin === ContentOrigin.EXTERNAL ? 'custom repositories' : 'red hat repositories'; const notFilteredBody = 'To get started, create a custom repository'; const countIsZero = count === 0; const showLoader = countIsZero && notFiltered && !isLoading; + + // If Red Hat repositories returns a 0 count + if (notFiltered && countIsZero && !isFetching && contentOrigin === ContentOrigin.REDHAT) { + throw new Error('Unable to load Red Hat repositories'); + } + return ( <> - {showLoader ? ( - - - - - } + + + { + setFilterData(values); + setPage(1); + }} + filterData={filterData} + atLeastOneRepoChecked={atLeastOneRepoChecked} + numberOfReposChecked={checkedRepositories.size} + deleteCheckedRepos={deleteCheckedRepos} /> - - ) : ( - - - { - setFilterData(values); - setPage(1); - }} - filterData={filterData} - atLeastOneRepoChecked={atLeastOneRepoChecked} - numberOfReposChecked={checkedRepositories.size} - deleteCheckedRepos={deleteCheckedRepos} + + - - - - - - - - - - - - - <> - - - - - - ))} - - - - - {contentList.map((rowData: ContentItem, index) => { - const { - uuid, - name, - url, - last_snapshot, - distribution_arch, - distribution_versions, - last_introspection_time, - } = rowData; - return ( - - - - - - - - - - - ); - })} - -
- - {columnHeaders.map((columnHeader, index) => ( - - {columnHeader} - - -
- onSelectRepo(rowData.uuid, isSelecting), - isSelected: checkedRepositories.has(rowData.uuid), - isDisabled: !repoCanBeChecked(rowData), - }} - /> - - - {name} - - - - - {last_snapshot - ? `Last snapshot ${dayjs(last_snapshot?.created_at).fromNow()}` - : 'No snapshot yet'} - - - - Changes: - - - - - - {archesDisplay(distribution_arch)}{versionDisplay(distribution_versions)} - - {lastIntrospectionDisplay(last_introspection_time)} - - - - - -
- - - - - - - - - + + + {showLoader ? ( + { } /> - - - )} + + ) : ( + <> + + + + + + + <> + + + + + + ))} + + + + + {contentList.map((rowData: ContentItem, index) => { + const { + uuid, + name, + url, + last_snapshot, + distribution_arch, + distribution_versions, + last_introspection_time, + } = rowData; + return ( + + + + + + + + + + + + + ); + })} + +
+ + {columnHeaders.map((columnHeader, index) => ( + + {columnHeader} + + +
+ onSelectRepo(rowData.uuid, isSelecting), + isSelected: checkedRepositories.has(rowData.uuid), + isDisabled: !repoCanBeChecked(rowData), + }} + /> + + + {name} + + + + + {last_snapshot + ? `Last snapshot ${dayjs(last_snapshot?.created_at).fromNow()}` + : 'No snapshot yet'} + + + + + Changes: + + + + + + + {archesDisplay(distribution_arch)}{versionDisplay(distribution_versions)} + + {lastIntrospectionDisplay(last_introspection_time)} + + + + + +
+ + + + + + + + + + + + + } + /> + + + )} + ); }; diff --git a/src/Pages/ContentListTable/components/AddContent/AddContent.tsx b/src/Pages/ContentListTable/components/AddContent/AddContent.tsx index 5d284316..8e27ec94 100644 --- a/src/Pages/ContentListTable/components/AddContent/AddContent.tsx +++ b/src/Pages/ContentListTable/components/AddContent/AddContent.tsx @@ -549,7 +549,6 @@ const AddContent = () => { variant='warning' title='Disabling snapshots might result in a higher risk of losing content or unintentionally modifying it irreversibly.' isInline - // isPlain /> diff --git a/src/Pages/ContentListTable/components/AddContent/helpers.ts b/src/Pages/ContentListTable/components/AddContent/helpers.ts index 50dddabe..364dba11 100644 --- a/src/Pages/ContentListTable/components/AddContent/helpers.ts +++ b/src/Pages/ContentListTable/components/AddContent/helpers.ts @@ -135,6 +135,7 @@ export const makeValidationSchema = () => { // eslint-disable-next-line @typescript-eslint/ban-ts-comment // @ts-ignore-next-line .uniqueProperty('name', 'Names must be unique') + // eslint-disable-next-line quotes .uniqueProperty('url', "Url's must be unique"), ); }; diff --git a/src/Pages/ContentListTable/components/ContentListFilters.test.tsx b/src/Pages/ContentListTable/components/ContentListFilters.test.tsx index 1f84c0fc..2501948b 100644 --- a/src/Pages/ContentListTable/components/ContentListFilters.test.tsx +++ b/src/Pages/ContentListTable/components/ContentListFilters.test.tsx @@ -3,6 +3,7 @@ import { testRepositoryParamsResponse } from '../../../testingHelpers'; import AddContent from './AddContent/AddContent'; import ContentListFilters from './ContentListFilters'; import { useQueryClient } from 'react-query'; +import { ContentOrigin } from '../../../services/Content/ContentApi'; jest.mock('./AddContent/AddContent'); @@ -28,6 +29,8 @@ beforeAll(() => { it('Render loading state (disabled)', async () => { const { getByRole } = render( null} isLoading={true} setFilterData={() => null} filterData={{ @@ -49,6 +52,8 @@ it('Render loading state (disabled)', async () => { it('Select a filter of each type and ensure chips are present', async () => { const { queryByText, getByRole, getByLabelText } = render( null} setFilterData={() => null} filterData={{ searchQuery: '', diff --git a/src/Pages/ContentListTable/components/ContentListFilters.tsx b/src/Pages/ContentListTable/components/ContentListFilters.tsx index 5ff1b2ad..ccf6b9e7 100644 --- a/src/Pages/ContentListTable/components/ContentListFilters.tsx +++ b/src/Pages/ContentListTable/components/ContentListFilters.tsx @@ -9,13 +9,19 @@ import { TextInput, InputGroupItem, InputGroupText, + ToggleGroup, + ToggleGroupItem, } from '@patternfly/react-core'; import { SelectVariant } from '@patternfly/react-core/deprecated'; import DropdownSelect from '../../../components/DropdownSelect/DropdownSelect'; import { FilterIcon, SearchIcon } from '@patternfly/react-icons'; import { global_BackgroundColor_100 } from '@patternfly/react-tokens'; import Hide from '../../../components/Hide/Hide'; -import { FilterData, RepositoryParamsResponse } from '../../../services/Content/ContentApi'; +import { + FilterData, + ContentOrigin, + RepositoryParamsResponse, +} from '../../../services/Content/ContentApi'; import { useQueryClient } from 'react-query'; import { REPOSITORY_PARAMS_KEY } from '../../../services/Content/ContentQueries'; import useDebounce from '../../../Hooks/useDebounce'; @@ -33,6 +39,8 @@ interface Props { atLeastOneRepoChecked: boolean; numberOfReposChecked: number; deleteCheckedRepos: () => void; + setContentOrigin: (origin: ContentOrigin) => void; + contentOrigin: ContentOrigin; } const useStyles = createUseStyles({ @@ -60,6 +68,8 @@ const ContentListFilters = ({ atLeastOneRepoChecked, numberOfReposChecked, deleteCheckedRepos, + setContentOrigin, + contentOrigin, }: Props) => { const classes = useStyles(); const { rbac } = useAppContext(); @@ -73,11 +83,13 @@ const ContentListFilters = ({ const [selectedVersions, setSelectedVersions] = useState([]); const [selectedArches, setSelectedArches] = useState([]); const [selectedStatuses, setSelectedStatuses] = useState([]); + const isRedHatRepository = contentOrigin === ContentOrigin.REDHAT; const { distribution_arches = [], distribution_versions = [] } = queryClient.getQueryData(REPOSITORY_PARAMS_KEY) || {}; const clearFilters = () => { + setFilterType('Name/URL'); setSearchQuery(''); setSelectedVersions([]); setSelectedArches([]); @@ -260,17 +272,45 @@ const ContentListFilters = ({ + + + { + if (contentOrigin !== ContentOrigin.EXTERNAL) { + setContentOrigin(ContentOrigin.EXTERNAL); + // clearFilters(); //This resets the filters when changing Origins if desired. + } + }} + /> + { + if (contentOrigin !== ContentOrigin.REDHAT) { + setContentOrigin(ContentOrigin.REDHAT); + // clearFilters();//This resets the filters when changing Origins if desired. + } + }} + /> + +