From f72b46cff3b37e2f5bed7b86fd3e55284e86e45c Mon Sep 17 00:00:00 2001 From: dvankeke Date: Tue, 12 May 2026 09:57:17 +0200 Subject: [PATCH] fix: removed legacy workload components --- src/components/CatalogAddChartCard.tsx | 79 ---- src/components/NewChartModal.test.tsx | 370 ------------------ src/components/NewChartModal.tsx | 335 ---------------- .../WorkloadCatalogsOverviewPage.tsx | 41 +- src/redux/otomiApi.ts | 9 - 5 files changed, 1 insertion(+), 833 deletions(-) delete mode 100644 src/components/CatalogAddChartCard.tsx delete mode 100644 src/components/NewChartModal.test.tsx delete mode 100644 src/components/NewChartModal.tsx diff --git a/src/components/CatalogAddChartCard.tsx b/src/components/CatalogAddChartCard.tsx deleted file mode 100644 index 274ceafc8..000000000 --- a/src/components/CatalogAddChartCard.tsx +++ /dev/null @@ -1,79 +0,0 @@ -import { Box, Tooltip, Typography, useTheme } from '@mui/material' -import React from 'react' -import { makeStyles } from 'tss-react/mui' - -const useStyles = makeStyles()((theme) => { - return { - root: { - display: 'flex', - alignItems: 'center', - justifyContent: 'space-between', - textAlign: 'center', - paddingLeft: theme.spacing(1), - paddingRight: theme.spacing(1), - paddingBottom: theme.spacing(2), - paddingTop: theme.spacing(2), - backgroundColor: 'transparent', - border: `1px dashed #9B9B9B`, - margin: '5px', - maxHeight: '200px', - height: '58px', - '&:hover': { - cursor: 'pointer', - }, - }, - img: { - height: '32px', - width: '32px', - }, - chip: { - height: '20px', - fontSize: '0.65rem', - border: 'none', - borderRadius: '5px', - }, - chipDark: { - color: 'rgb(174, 192, 245)', - backgroundColor: 'lch(77.7 28.7 275 / 0.12)', - }, - chipLight: { - color: '#696970', - backgroundColor: 'rgba(0, 0, 0, 0.08)', - }, - link: { - display: 'flex', - marginLeft: '5px', - alignItems: 'center', - }, - title: { - textAlign: 'center', - verticalAlign: 'middle', - color: theme.palette.text.primary, - fontWeight: 'bold', - fontSize: '1rem', - textTransform: 'capitalize', - marginLeft: theme.spacing(1), - marginRight: theme.spacing(1), - }, - } -}) - -interface Props { - openNewChartModal: () => void -} - -export default function ({ openNewChartModal }: Props): React.ReactElement { - const { classes, cx } = useStyles() - const theme = useTheme() - const isLight = theme.palette.mode === 'light' - - return ( - - - - + Add Helm chart - - - - ) -} diff --git a/src/components/NewChartModal.test.tsx b/src/components/NewChartModal.test.tsx deleted file mode 100644 index 11c10830e..000000000 --- a/src/components/NewChartModal.test.tsx +++ /dev/null @@ -1,370 +0,0 @@ -import React from 'react' -import { fireEvent, render, screen, waitFor } from '@testing-library/react' -import '@testing-library/jest-dom' -import userEvent from '@testing-library/user-event' -import { useSession } from 'providers/Session' -import { useGetHelmChartContentQuery } from 'redux/otomiApi' -import NewChartModal, { checkDirectoryName } from './NewChartModal' - -// Mock the redux hook -jest.mock('redux/otomiApi', () => ({ - useGetHelmChartContentQuery: jest.fn(), -})) -const mockedUseGetHelmChartContentQuery = useGetHelmChartContentQuery as jest.Mock - -// Mock the session provider -jest.mock('providers/Session', () => ({ - useSession: jest.fn(), -})) -const mockedUseSession = useSession as jest.Mock - -// Mock the DefaultLogo component -jest.mock('../assets/akamai-logo-rgb-waveOnly', () => ({ - __esModule: true, - default: () =>
, -})) - -describe('NewChartModal Component', () => { - const mockChartDirectories = ['existing-chart'] - const mockHandleClose = jest.fn() - const mockHandleCancel = jest.fn() - const mockHandleAction = jest.fn() - - const mockProps = { - title: 'Add New Chart', - open: true, - handleClose: mockHandleClose, - handleCancel: mockHandleCancel, - cancelButtonText: 'Cancel', - handleAction: mockHandleAction, - actionButtonText: 'Submit', - chartDirectories: mockChartDirectories, - } - - const mockHelmChartData = { - values: { - name: 'test-chart', - description: 'A test chart', - version: '1.0.0', - appVersion: '1.0.0', - icon: 'https://example.com/icon.png', - }, - } - - beforeEach(() => { - jest.clearAllMocks() - // Default mock implementation - mockedUseSession.mockReturnValue({ - settings: { cluster: { domainSuffix: 'example.com' } }, - }) - const mockUseGetHelmChartContentQuery = jest.fn().mockReturnValue({ - data: null, - isLoading: false, - isFetching: false, - }) - mockedUseGetHelmChartContentQuery.mockImplementation(mockUseGetHelmChartContentQuery) - }) - - describe('checkDirectoryName helper function', () => { - it('should return error message if directory name already exists', () => { - const result = checkDirectoryName('existing-chart', mockChartDirectories) - expect(result).toBe('Directory name already exists.') - }) - - it('should return error message if directory name contains invalid characters', () => { - const invalidNames = [ - 'test chart', // space - 'test/chart', // slash - 'test:chart', // colon - 'test&chart', // ampersand - '..', // just dots - '-test', // leading dash - 'test-', // trailing dash - ] - - invalidNames.forEach((name) => { - const result = checkDirectoryName(name, mockChartDirectories) - expect(result).toBe( - 'Invalid directory name. Avoid spaces, special characters or leading, trailing dots and dashes.', - ) - }) - }) - - it('should return empty string for valid directory name', () => { - const result = checkDirectoryName('valid-chart-name', mockChartDirectories) - expect(result).toBe('') - }) - }) - - describe('Component Rendering', () => { - it('should render the modal with header when noHeader is not provided', () => { - render() - expect(screen.getByText('Add New Chart')).toBeInTheDocument() - }) - - it('should not render header when noHeader is true', () => { - render() - expect(screen.queryByText('Add New Chart')).not.toBeInTheDocument() - }) - - it('should render the form fields', () => { - render() - - expect(screen.getByLabelText('Git Repository URL')).toBeInTheDocument() - expect(screen.getByLabelText('Name')).toBeInTheDocument() - expect(screen.getByLabelText('Description')).toBeInTheDocument() - expect(screen.getByLabelText('App Version')).toBeInTheDocument() - expect(screen.getByLabelText('Version')).toBeInTheDocument() - expect(screen.getByLabelText('Icon URL (optional)')).toBeInTheDocument() - expect(screen.getByLabelText('Target Directory Name')).toBeInTheDocument() - expect(screen.getByLabelText('Allow teams to use this chart')).toBeInTheDocument() - }) - - it('should render the default logo when no icon is provided', () => { - render() - expect(screen.getByTestId('default-logo')).toBeInTheDocument() - }) - }) - - describe('User Interactions', () => { - it('should update gitRepositoryUrl when user types in the URL field', async () => { - render() - - const urlInput = screen.getByLabelText('Git Repository URL') - await userEvent.type(urlInput, 'https://github.com/test/repo/blob/main/Chart.yaml') - - expect(urlInput).toHaveValue('https://github.com/test/repo/blob/main/Chart.yaml') - }) - - it('should trigger handleCancel when clicking the cancel button', () => { - render() - - const cancelButton = screen.getByText('Cancel') - fireEvent.click(cancelButton) - - expect(mockHandleCancel).toHaveBeenCalledTimes(1) - }) - - it('should set helm chart URL when clicking Get details button', async () => { - mockedUseGetHelmChartContentQuery.mockImplementation(({ url }) => ({ - data: url ? mockHelmChartData : null, - isLoading: false, - isFetching: false, - })) - - render() - - const urlInput = screen.getByLabelText('Git Repository URL') - await userEvent.type(urlInput, 'https://github.com/test/repo/blob/main/Chart.yaml') - - const getDetailsButton = screen.getByText('Get details') - fireEvent.click(getDetailsButton) - - // Wait for the useEffect to update the form fields - await waitFor(() => { - expect(screen.getByLabelText('Name')).toHaveValue('test-chart') - expect(screen.getByLabelText('Description')).toHaveValue('A test chart') - expect(screen.getByLabelText('Version')).toHaveValue('1.0.0') - expect(screen.getByLabelText('App Version')).toHaveValue('1.0.0') - expect(screen.getByLabelText('Icon URL (optional)')).toHaveValue('https://example.com/icon.png') - expect(screen.getByLabelText('Target Directory Name')).toHaveValue('test-chart') - }) - }) - - it('should show error when helm chart data has an error', async () => { - const mockError = 'Error fetching helm chart content.' - mockedUseGetHelmChartContentQuery.mockImplementation(({ url }) => ({ - data: url ? { error: mockError } : null, - isLoading: false, - isFetching: false, - })) - - render() - - const urlInput = screen.getByLabelText('Git Repository URL') - await userEvent.type(urlInput, 'https://github.com/invalid/invalid/blob/invalid/Chart.yaml') - - const getDetailsButton = screen.getByText('Get details') - fireEvent.click(getDetailsButton) - - await waitFor(() => { - expect(screen.getByText(mockError)).toBeInTheDocument() - }) - }) - - it('should toggle allowTeams when checkbox is clicked', async () => { - render() - - const checkbox = screen.getByLabelText('Allow teams to use this chart') - - // Default is checked - expect(checkbox).toBeChecked() - - // Click to uncheck - await userEvent.click(checkbox) - expect(checkbox).not.toBeChecked() - - // Click to check again - await userEvent.click(checkbox) - expect(checkbox).toBeChecked() - }) - - it('should display directory name error when invalid directory name is entered', async () => { - // Set up with successful chart data retrieval - mockedUseGetHelmChartContentQuery.mockImplementation(({ url }) => ({ - data: url ? mockHelmChartData : null, - isLoading: false, - isFetching: false, - })) - - render() - - // First get chart details to enable the field - const urlInput = screen.getByLabelText('Git Repository URL') - await userEvent.type(urlInput, 'https://github.com/test/repo/blob/main/Chart.yaml') - - const getDetailsButton = screen.getByText('Get details') - fireEvent.click(getDetailsButton) - - // Wait for fields to update - await waitFor(() => { - expect(screen.getByLabelText('Target Directory Name')).toHaveValue('test-chart') - }) - - // Now change to an invalid directory name - const dirNameInput = screen.getByLabelText('Target Directory Name') - await userEvent.clear(dirNameInput) - await userEvent.type(dirNameInput, 'test chart') - - expect( - screen.getByText( - 'Invalid directory name. Avoid spaces, special characters or leading, trailing dots and dashes.', - ), - ).toBeInTheDocument() - }) - - it('should display directory exists error when using an existing directory name', async () => { - // Set up with successful chart data retrieval - mockedUseGetHelmChartContentQuery.mockImplementation(({ url }) => ({ - data: url ? mockHelmChartData : null, - isLoading: false, - isFetching: false, - })) - - render() - - // First get chart details to enable the field - const urlInput = screen.getByLabelText('Git Repository URL') - await userEvent.type(urlInput, 'https://github.com/test/repo/blob/main/Chart.yaml') - - const getDetailsButton = screen.getByText('Get details') - fireEvent.click(getDetailsButton) - - // Wait for fields to update - await waitFor(() => { - expect(screen.getByLabelText('Target Directory Name')).toHaveValue('test-chart') - }) - - // Now change to an existing directory name - const dirNameInput = screen.getByLabelText('Target Directory Name') - await userEvent.clear(dirNameInput) - await userEvent.type(dirNameInput, 'existing-chart') - - expect(screen.getByText('Directory name already exists.')).toBeInTheDocument() - }) - }) - - describe('Form Submission', () => { - it('should call handleAction with correct values when form is valid and submitted', async () => { - // Set up with successful chart data retrieval - mockedUseGetHelmChartContentQuery.mockImplementation(({ url }) => ({ - data: url ? mockHelmChartData : null, - isLoading: false, - isFetching: false, - })) - - render() - - // Fill form - const urlInput = screen.getByLabelText('Git Repository URL') - await userEvent.type(urlInput, 'https://github.com/test/repo/blob/main/Chart.yaml') - - const getDetailsButton = screen.getByText('Get details') - fireEvent.click(getDetailsButton) - - // Wait for fields to update and form to be valid - await waitFor(() => { - expect(screen.getByLabelText('Name')).toHaveValue('test-chart') - }) - - // Submit form - const submitButton = screen.getByText('Submit') - expect(submitButton).not.toBeDisabled() - fireEvent.click(submitButton) - - expect(mockHandleAction).toHaveBeenCalledWith({ - gitRepositoryUrl: 'https://github.com/test/repo/blob/main/Chart.yaml', - chartTargetDirName: 'test-chart', - chartIcon: 'https://example.com/icon.png', - allowTeams: true, - }) - }) - - it('should disable submit button when form is invalid', () => { - render() - - // Form is invalid initially without any data - const submitButton = screen.getByText('Submit') - expect(submitButton).toBeDisabled() - }) - }) - - describe('Loading States', () => { - it('should show loading state for the Get details button', () => { - mockedUseGetHelmChartContentQuery.mockImplementation(() => ({ - data: null, - isLoading: true, - isFetching: false, - })) - - render() - - const getDetailsButton = screen.getByText('Get details') - fireEvent.click(getDetailsButton) - - // Check loading state logic - the actual visual component might be implemented differently - // depending on how LoadingButton works in the codebase - expect(mockedUseGetHelmChartContentQuery).toHaveBeenCalled() - }) - - it('should show loading state for the Submit button when submitting', async () => { - // Set up with successful chart data retrieval - mockedUseGetHelmChartContentQuery.mockImplementation(({ url }) => ({ - data: url ? mockHelmChartData : null, - isLoading: false, - isFetching: false, - })) - - render() - - // Fill form - const urlInput = screen.getByLabelText('Git Repository URL') - await userEvent.type(urlInput, 'https://github.com/test/repo/blob/main/Chart.yaml') - - const getDetailsButton = screen.getByText('Get details') - fireEvent.click(getDetailsButton) - - // Wait for fields to update - await waitFor(() => { - expect(screen.getByLabelText('Name')).toHaveValue('test-chart') - }) - - // Submit form - const submitButton = screen.getByText('Submit') - fireEvent.click(submitButton) - - // Button should be disabled during submission - expect(submitButton).toBeDisabled() - }) - }) -}) diff --git a/src/components/NewChartModal.tsx b/src/components/NewChartModal.tsx deleted file mode 100644 index 67747df31..000000000 --- a/src/components/NewChartModal.tsx +++ /dev/null @@ -1,335 +0,0 @@ -import React, { useEffect, useState } from 'react' -import { - Box, - Button, - ButtonPropsColorOverrides, - Checkbox, - FormControlLabel, - Modal, - TextField, - Typography, - styled, -} from '@mui/material' -import { LoadingButton } from '@mui/lab' -// eslint-disable-next-line import/no-unresolved -import { OverridableStringUnion } from '@mui/types' -import { useGetHelmChartContentQuery } from 'redux/otomiApi' -import { isEmpty } from 'lodash' -import { useSession } from 'providers/Session' -import DefaultLogo from '../assets/akamai-logo-rgb-waveOnly' - -// styles ---------------------------------------------------------------- -const ModalBox = styled(Box)(({ theme }) => ({ - position: 'absolute', - top: '50%', - left: '50%', - transform: 'translate(-50%, -50%)', - width: 700, - maxHeight: '90%', - overflowY: 'auto', - backgroundColor: theme.palette.background.paper, - boxShadow: - 'rgb(0 0 0 / 20%) 0px 11px 15px -7px, rgb(0 0 0 / 14%) 0px 24px 38px 3px, rgb(0 0 0 / 12%) 0px 9px 46px 8px', - borderRadius: 16, - padding: 0, - // Hide scrollbar - '-ms-overflow-style': 'none' /* Internet Explorer 10+ */, - 'scrollbar-width': 'none' /* Firefox */, - '&::-webkit-scrollbar': { - display: 'none' /* Safari and Chrome */, - }, -})) - -const ModalHeader = styled('div')({ - display: 'flex', - justifyContent: 'space-between', - alignItems: 'center', - paddingBottom: '20px', - paddingLeft: '32px', - paddingTop: '32px', - paddingRight: '32px', - borderBottom: '1px dashed rgba(145, 158, 171, 0.24)', -}) - -const ModalContent = styled('div')({ - padding: '32px', -}) - -const ModalFooter = styled('div')({ - borderTop: '1px dashed rgba(145, 158, 171, 0.24)', - display: 'flex', - justifyContent: 'flex-end', - padding: '20px', - paddingRight: '30px', -}) - -// helper functions ----------------------------------------------------- -export const checkDirectoryName = (directoryName: string, chartDirectories: string[]) => { - if (!directoryName) return 'Directory name is required.' - if (chartDirectories.includes(directoryName.toLowerCase())) return 'Directory name already exists.' - // Regex to validate directory names by checking: - // 1. Names consisting **only** of dots (`.`) → Invalid (e.g., "..", "..."). - // 2. Presence of special characters: `\ / : * ? " < > | # % & { } $ ! ` ~` or whitespace → Invalid. - // 3. Names starting (`^-`) or ending (`-$`) with a hyphen → Invalid. - const invalidDirNamePattern = /[\\/:*?"<>|#%&{}$!`~\s]|^\.+$|^-|-$/ - if (invalidDirNamePattern.test(directoryName)) - return 'Invalid directory name. Avoid spaces, special characters or leading, trailing dots and dashes.' - return '' -} - -const checkGitRepositoryUrl = (url: string, urlError: string) => { - // Regex to validate Git URLs by checking: - // 1. Optional "http(s)://". - // 2. Matches "github.com", "gitlab.com", or "bitbucket.org". - // 3. Ensures repository owner and name in the URL path. - // 4. Matches "blob", "raw", or "src" for content retrieval. - // 5. Validates file path after content type. - // 6. Ensures ending with "Chart.yaml". - const gitRepositoryUrlRegex = - /^(https?:\/\/)?(github\.com|gitlab\.com|bitbucket\.org)\/.+\/.+\/(blob|raw|src|-\/(?:blob|raw))\/.+\/Chart\.yaml$/ - - const errorText = urlError || (url && !url.match(gitRepositoryUrlRegex) ? 'Invalid URL format.' : '') - return errorText -} - -// interface and component ----------------------------------------------- -interface Props { - title?: string - noHeader?: boolean - open: boolean - handleClose: () => void - handleCancel?: () => void - cancelButtonText?: string - handleAction?: (values: NewChartValues) => void - actionButtonText?: string - actionButtonColor?: OverridableStringUnion< - 'inherit' | 'error' | 'primary' | 'secondary' | 'success' | 'info' | 'warning', - ButtonPropsColorOverrides - > - actionButtonEndIcon?: React.ReactElement - actionButtonFrontIcon?: React.ReactElement - chartDirectories: string[] -} - -interface NewChartValues { - gitRepositoryUrl: string - chartTargetDirName: string - chartIcon?: string - allowTeams: boolean -} - -export default function NewChartModal({ - title, - noHeader, - open, - handleClose, - handleCancel, - cancelButtonText, - handleAction, - actionButtonText, - actionButtonColor, - actionButtonEndIcon, - actionButtonFrontIcon, - chartDirectories, -}: Props) { - const { - settings: { cluster }, - } = useSession() - const [helmChartUrl, setHelmChartUrl] = useState('') - const [gitRepositoryUrl, setGitRepositoryUrl] = useState('') - const [chartName, setChartName] = useState('') - const [chartDescription, setChartDescription] = useState('') - const [chartAppVersion, setChartAppVersion] = useState('') - const [chartVersion, setChartVersion] = useState('') - const [chartIcon, setChartIcon] = useState('') - const [chartTargetDirName, setChartTargetDirName] = useState('') - const [allowTeams, setAllowTeams] = useState(true) - // Indicates that Get details passed. - const [connectionTested, setConnectionTested] = useState(false) - // Error state for the URL input. - const [urlError, setUrlError] = useState('') - // Loading state for the Add Chart button. - const [isLoading, setIsLoading] = useState(false) - - const { - data: helmChartData, - isLoading: isLoadingHelmChartContent, - isFetching: isFetchingHelmChartContent, - } = useGetHelmChartContentQuery({ url: helmChartUrl }, { skip: !helmChartUrl }) - - useEffect(() => { - if (helmChartData?.error) { - const { error } = helmChartData as { error: string } - setConnectionTested(false) - setUrlError(error) - } else { - setConnectionTested(true) - setUrlError(null) - } - if (!isEmpty(helmChartData?.values)) { - const { values } = helmChartData as { - values: { name: string; description: string; version: string; appVersion: string; icon: string } - } - setChartName(values.name) - setChartDescription(values.description) - setChartVersion(values.version) - setChartAppVersion(values.appVersion) - setChartIcon(values.icon || '') - setChartTargetDirName(values.name) - setConnectionTested(true) - } else setConnectionTested(false) - }, [helmChartData]) - - const handleUrlChange = (e: React.ChangeEvent) => { - const repoUrl = e.target.value - setHelmChartUrl('') - setGitRepositoryUrl(repoUrl) - setConnectionTested(false) - setUrlError(null) - } - - const handleSubmit = () => { - setIsLoading(true) - handleAction({ - gitRepositoryUrl: helmChartUrl, - chartTargetDirName, - chartIcon, - allowTeams, - }) - } - - // Form is valid when connection is tested, required fields are filled, and no error exists. - const isFormValid = - connectionTested && - chartName?.trim() !== '' && - chartAppVersion?.trim() !== '' && - chartVersion?.trim() !== '' && - gitRepositoryUrl?.trim() !== '' && - !checkDirectoryName(chartTargetDirName, chartDirectories) && - !urlError - - // Temp solution to style disabled state, cannot be done with styled components. - const disabledSx = { - '& .MuiInputBase-root.Mui-disabled': { - backgroundColor: '#58585833', - }, - '& .MuiFormLabel-root.Mui-disabled': { - color: '#6b6b6b !important', - }, - } - - return ( - - - {!noHeader && ( - - {title} - - )} - - - {/* Helper text */} - - Provide a git repository URL pointing to a Chart.yaml file. - - {/* Row for the GitHub URL input and Get details button */} - - - setHelmChartUrl(gitRepositoryUrl)} - loading={isLoadingHelmChartContent || isFetchingHelmChartContent} - disabled={!gitRepositoryUrl || !!checkGitRepositoryUrl(gitRepositoryUrl, urlError)} - > - Get details - - - {/* Read-only fields for the fetched chart data. */} - - - - - {/* Icon URL field with preview image next to it */} - - setChartIcon(e.target.value)} - fullWidth - disabled={!connectionTested} - sx={disabledSx} - /> - - {chartIcon ? ( - Icon preview - ) : ( - - )} - - - setChartTargetDirName(e.target.value)} - fullWidth - disabled={!connectionTested} - sx={disabledSx} - error={Boolean(checkDirectoryName(chartTargetDirName, chartDirectories))} - helperText={helmChartUrl && checkDirectoryName(chartTargetDirName, chartDirectories)} - /> - - {`The Helm chart will be added at: `} - - {`https://gitea.${cluster.domainSuffix}/otomi/charts/${chartTargetDirName}`} - - - setAllowTeams(e.target.checked)} color='primary' /> - } - label='Allow teams to use this chart' - /> - - - - - - {actionButtonText} - - - - - ) -} diff --git a/src/pages/catalogs/team-overview/WorkloadCatalogsOverviewPage.tsx b/src/pages/catalogs/team-overview/WorkloadCatalogsOverviewPage.tsx index 7ed279b54..d6685313a 100644 --- a/src/pages/catalogs/team-overview/WorkloadCatalogsOverviewPage.tsx +++ b/src/pages/catalogs/team-overview/WorkloadCatalogsOverviewPage.tsx @@ -4,7 +4,6 @@ import PaperLayout from 'layouts/Paper' import React, { useCallback, useEffect, useState } from 'react' import { makeStyles } from 'tss-react/mui' import { - useCreateWorkloadCatalogMutation, useGetAllAplCatalogsQuery, useGetAplCatalogsChartsQuery, useRefreshAplCatalogCacheMutation, @@ -17,8 +16,6 @@ import { useTranslation } from 'react-i18next' import { LoadingButton } from '@mui/lab' import CatalogCard from '../../../components/CatalogCard' import TableToolbar from '../../../components/TableToolbar' -import CatalogAddChartCard from '../../../components/CatalogAddChartCard' -import NewChartModal from '../../../components/NewChartModal' // -- Styles ------------------------------------------------------------- @@ -64,28 +61,19 @@ const developerCatalogInfo = [ ] // ---- JSX ------------------------------------------------------------- -interface NewChartValues { - gitRepositoryUrl: string - chartTargetDirName: string - chartIcon?: string - allowTeams: boolean -} -export default function (Props): React.ReactElement { +export default function (): React.ReactElement { const { t } = useTranslation() const { classes, cx } = useStyles() const [filterName, setFilterName] = useState('') - const [openNewChartModal, setOpenNewChartModal] = useState(false) const [catalogFilterName, setCatalogFilterName] = useState('') const [filteredCatalog, setFilteredCatalog] = useState([]) const [chartCatalog, setChartCatalog] = useState([]) const [expanded, setExpanded] = useState(false) const { user, oboTeamId } = useSession() - const { isPlatformAdmin } = user const { enqueueSnackbar } = useSnackbar() - const [createWorkloadCatalog] = useCreateWorkloadCatalogMutation() const { data: allCatalogs, isLoading: isCatalogsLoading, @@ -157,19 +145,6 @@ export default function (Props): React.ReactElement { if (!isFetchingCatalogs) refetchCatalogs() }, [isDirty]) - const addChart = async (data: NewChartValues) => { - try { - const result = await createWorkloadCatalog({ body: data }).unwrap() - setCatalogFilterName((prev) => prev) - if (result) enqueueSnackbar('Chart successfully added', { variant: 'success' }) - else enqueueSnackbar('Error adding chart', { variant: 'error' }) - - setOpenNewChartModal(false) - } catch (error) { - enqueueSnackbar('Error adding chart', { variant: 'error' }) - } - } - const isCatalogSwitchLoading = !!catalogFilterName && (isChartCatalogLoading || isChartCatalogFetching) if (isCatalogsLoading || isFetchingCatalogs) return @@ -286,11 +261,6 @@ export default function (Props): React.ReactElement { ) : ( <> - {isPlatformAdmin && oboTeamId === 'admin' && ( - - setOpenNewChartModal(true)} /> - - )} {oboTeamId !== 'admin' && filteredCatalog.length === 0 && ( - addChart(handleActionValues)} - handleClose={() => setOpenNewChartModal(false)} - chartDirectories={filteredCatalog?.map((item) => item.name) || []} - /> ) } diff --git a/src/redux/otomiApi.ts b/src/redux/otomiApi.ts index f2952d5ee..39da1687b 100644 --- a/src/redux/otomiApi.ts +++ b/src/redux/otomiApi.ts @@ -446,9 +446,6 @@ const injectedRtkApi = api.injectEndpoints({ getHelmChartContent: build.query({ query: (queryArg) => ({ url: `/v1/helmChartContent`, params: { url: queryArg.url } }), }), - createWorkloadCatalog: build.mutation({ - query: (queryArg) => ({ url: `/v1/createWorkloadCatalog`, method: 'POST', body: queryArg.body }), - }), getTeamWorkloads: build.query({ query: (queryArg) => ({ url: `/v1/teams/${queryArg.teamId}/workloads` }), }), @@ -5456,11 +5453,6 @@ export type GetHelmChartContentApiArg = { /** URL of the helm chart */ url?: string } -export type CreateWorkloadCatalogApiResponse = /** status 200 Successfully updated a team workload catalog */ object -export type CreateWorkloadCatalogApiArg = { - /** Workload catalog object that contains updated values */ - body: object -} export type GetTeamWorkloadsApiResponse = /** status 200 Successfully obtained team workloads configuration */ { id?: string teamId?: string @@ -7025,7 +7017,6 @@ export const { useGetAllWorkloadsQuery, useGetWorkloadCatalogMutation, useGetHelmChartContentQuery, - useCreateWorkloadCatalogMutation, useGetTeamWorkloadsQuery, useCreateWorkloadMutation, useDeleteWorkloadMutation,