particle-os/debian-image-builder-frontend
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions

src: Fix function types

Browse source 
This updates types in several places to match their calls.
This commit is contained in:
regexowl 2025-08-15 15:21:38 +02:00
parent 28bf2fd24b
commit 801c0c8bee
27 changed files with 208 additions and 116 deletions
Download patch file Download diff file Expand all files Collapse all files

9
src/Components/Blueprints/BlueprintVersionFilter.tsx
View file

@ -32,10 +32,13 @@ const BlueprintVersionFilter: React.FC<blueprintVersionFilterProps> = ({
};
const onSelect = (
_event: React.MouseEvent<Element, MouseEvent> | undefined,
value: versionFilterType,
_event?: React.MouseEvent<Element, MouseEvent>,
value?: string | number,
) => {
dispatch(setBlueprintVersionFilter(value));
if (value === undefined) return;
const typedValue = value as versionFilterType;
dispatch(setBlueprintVersionFilter(typedValue));
if (onFilterChange) onFilterChange();
setIsOpen(false);
};

22
src/Components/Blueprints/BuildImagesButton.tsx
View file

@ -81,17 +81,21 @@ export const BuildImagesButton = ({ children }: BuildImagesButtonPropTypes) => {
);
const onSelect = (
_event: React.MouseEvent<Element, MouseEvent>,
itemId: number,
_event?: React.MouseEvent<Element, MouseEvent>,
itemId?: string | number,
) => {
const imageType = blueprintImageType?.[itemId];
if (itemId === undefined) return;
if (imageType && deselectedTargets.includes(imageType)) {
setDeselectedTargets(
deselectedTargets.filter((target) => target !== imageType),
);
} else if (imageType) {
setDeselectedTargets([...deselectedTargets, imageType]);
if (typeof itemId === 'number') {
const imageType = blueprintImageType?.[itemId];
if (imageType && deselectedTargets.includes(imageType)) {
setDeselectedTargets(
deselectedTargets.filter((target) => target !== imageType),
);
} else if (imageType) {
setDeselectedTargets([...deselectedTargets, imageType]);
}
}
};

8
src/Components/Blueprints/ImportBlueprintModal.tsx
View file

@ -35,6 +35,7 @@ import {
CustomRepository,
} from '../../store/imageBuilderApi';
import { wizardState } from '../../store/wizardSlice';
import { getErrorMessage } from '../../Utilities/getErrorMessage';
import { resolveRelPath } from '../../Utilities/path';
import {
mapExportRequestToState,
@ -69,10 +70,7 @@ export const ImportBlueprintModal: React.FunctionComponent<
const addNotification = useAddNotification();
const [importRepositories] = useBulkImportRepositoriesMutation();
const handleFileInputChange = (
_event: React.ChangeEvent<HTMLInputElement> | React.DragEvent<HTMLElement>,
file: File,
) => {
const handleFileInputChange = (_event: DropEvent, file: File) => {
setFileContent('');
setFilename(file.name);
};
@ -195,7 +193,7 @@ export const ImportBlueprintModal: React.FunctionComponent<
addNotification({
variant: 'warning',
title: 'File is not a valid blueprint',
description: error?.data?.error?.message,
description: getErrorMessage(error),
});
}
};

23
src/Components/CreateImageWizard/steps/FileSystem/components/FileSystemTable.tsx
View file

@ -176,12 +176,14 @@ const MountpointPrefix = ({ partition }: MountpointPrefixPropTypes) => {
const prefix = getPrefix(partition.mountpoint);
const suffix = getSuffix(partition.mountpoint);
const onSelect = (event: React.MouseEvent, selection: string) => {
setIsOpen(false);
const mountpoint = selection + (suffix.length > 0 ? '/' + suffix : '');
dispatch(
changePartitionMountpoint({ id: partition.id, mountpoint: mountpoint }),
);
const onSelect = (event?: React.MouseEvent, selection?: string | number) => {
if (selection && typeof selection === 'string') {
setIsOpen(false);
const mountpoint = selection + (suffix.length > 0 ? '/' + suffix : '');
dispatch(
changePartitionMountpoint({ id: partition.id, mountpoint: mountpoint }),
);
}
};
const onToggleClick = () => {
@ -313,8 +315,9 @@ const SizeUnit = ({ partition }: SizeUnitPropTypes) => {
const initialValue = useRef(partition).current;
const onSelect = (event: React.MouseEvent, selection: Units) => {
if (initialValue.unit === 'B' && selection === 'B') {
const onSelect = (event?: React.MouseEvent, selection?: string | number) => {
if (selection === undefined) return;
if (initialValue.unit === 'B' && selection === ('B' as Units)) {
dispatch(
changePartitionMinSize({
id: partition.id,
@ -322,7 +325,9 @@ const SizeUnit = ({ partition }: SizeUnitPropTypes) => {
}),
);
}
dispatch(changePartitionUnit({ id: partition.id, unit: selection }));
dispatch(
changePartitionUnit({ id: partition.id, unit: selection as Units }),
);
setIsOpen(false);
};

8
src/Components/CreateImageWizard/steps/ImageOutput/components/ArchSelect.tsx
View file

@ -22,11 +22,9 @@ const ArchSelect = () => {
const dispatch = useAppDispatch();
const [isOpen, setIsOpen] = useState(false);
const setArch = (
_event: React.MouseEvent,
selection: ImageRequest['architecture'],
) => {
dispatch(changeArchitecture(selection));
const setArch = (_event?: React.MouseEvent, selection?: string | number) => {
if (selection === undefined) return;
dispatch(changeArchitecture(selection as ImageRequest['architecture']));
setIsOpen(false);
};

10
src/Components/CreateImageWizard/steps/ImageOutput/components/ReleaseSelect.tsx
View file

@ -43,14 +43,18 @@ const ReleaseSelect = () => {
const releases = process.env.IS_ON_PREMISE ? ON_PREM_RELEASES : RELEASES;
const handleSelect = (_event: React.MouseEvent, selection: Distributions) => {
const handleSelect = (
_event?: React.MouseEvent,
selection?: string | number,
) => {
if (selection === undefined) return;
if (selection !== ('loader' as Distributions)) {
if (!isRhel(selection)) {
if (!isRhel(selection as Distributions)) {
dispatch(changeRegistrationType('register-later'));
} else {
dispatch(changeRegistrationType('register-now-rhc'));
}
dispatch(changeDistribution(selection));
dispatch(changeDistribution(selection as Distributions));
setIsOpen(false);
}
};

4
src/Components/CreateImageWizard/steps/Kernel/components/KernelName.tsx
View file

@ -73,8 +73,8 @@ const KernelName = () => {
}
};
const onSelect = (_event: React.MouseEvent, value: string) => {
if (value) {
const onSelect = (_event?: React.MouseEvent, value?: string | number) => {
if (value && typeof value === 'string') {
if (/custom kernel package/i.test(value)) {
if (!kernelOptions.some((kernel) => kernel === filterValue)) {
kernelOptions = [...kernelOptions, filterValue];

4
src/Components/CreateImageWizard/steps/Locale/components/KeyboardDropDown.tsx
View file

@ -65,8 +65,8 @@ const KeyboardDropDown = () => {
}
};
const onSelect = (_event: React.MouseEvent, value: string) => {
if (value) {
const onSelect = (_event?: React.MouseEvent, value?: string | number) => {
if (value && typeof value === 'string') {
setInputValue(value);
setFilterValue('');
setErrorText('');

4
src/Components/CreateImageWizard/steps/Locale/components/LanguagesDropDown.tsx
View file

@ -97,8 +97,8 @@ const LanguagesDropDown = () => {
}
};
const onSelect = (_event: React.MouseEvent, value: string) => {
if (value) {
const onSelect = (_event?: React.MouseEvent, value?: string | number) => {
if (value && typeof value === 'string') {
setInputValue('');
setFilterValue('');
dispatch(addLanguage(value));

12
src/Components/CreateImageWizard/steps/Oscap/components/PolicySelector.tsx
View file

@ -185,13 +185,13 @@ const PolicySelector = () => {
};
const handleSelect = (
_event: React.MouseEvent<Element, MouseEvent>,
selection: string,
_event?: React.MouseEvent<Element, MouseEvent>,
selection?: string | number,
) => {
if (selection) {
applyChanges(selection as unknown as ComplianceSelectOptionValueType);
setIsOpen(false);
}
if (selection === undefined) return;
applyChanges(selection as unknown as ComplianceSelectOptionValueType);
setIsOpen(false);
};
const complianceOptions = () => {

16
src/Components/CreateImageWizard/steps/Oscap/components/ProfileSelector.tsx
View file

@ -269,15 +269,15 @@ const ProfileSelector = () => {
};
const handleSelect = (
_event: React.MouseEvent<Element, MouseEvent>,
selection: string,
_event?: React.MouseEvent<Element, MouseEvent>,
selection?: string | number,
) => {
if (selection) {
setInputValue(selection);
setFilterValue('');
applyChanges(selection as unknown as OScapSelectOptionValueType);
setIsOpen(false);
}
if (selection === undefined) return;
setInputValue(selection as OScapSelectOptionValueType['profileID']);
setFilterValue('');
applyChanges(selection as unknown as OScapSelectOptionValueType);
setIsOpen(false);
};
const toggleOpenSCAP = (toggleRef: React.Ref<MenuToggleElement>) => (

31
src/Components/CreateImageWizard/steps/Packages/Packages.tsx
View file

@ -927,19 +927,34 @@ const Packages = () => {
}
};
const handleFilterToggleClick = (event: React.MouseEvent) => {
const id = event.currentTarget.id;
const handleFilterToggleClick = (
event:
| MouseEvent
| React.KeyboardEvent<Element>
| React.MouseEvent<HTMLElement, MouseEvent>,
_selected: boolean,
) => {
const id = (event.currentTarget as HTMLElement).id ?? '';
setCurrentlyRemovedPackages([]);
setPage(1);
setToggleSelected(id);
};
const handleSetPage = (_: React.MouseEvent, newPage: number) => {
const handleSetPage = (
_:
| MouseEvent
| React.MouseEvent<Element, MouseEvent>
| React.KeyboardEvent<Element>,
newPage: number,
) => {
setPage(newPage);
};
const handlePerPageSelect = (
_: React.MouseEvent,
_:
| MouseEvent
| React.MouseEvent<Element, MouseEvent>
| React.KeyboardEvent<Element>,
newPerPage: number,
newPage: number,
) => {
@ -985,11 +1000,15 @@ const Packages = () => {
setIsRepoModalOpen(!isRepoModalOpen);
};
const handleTabClick = (event: React.MouseEvent, tabIndex: Repos) => {
const handleTabClick = (
event?: React.MouseEvent,
tabIndex?: string | number,
) => {
if (tabIndex === undefined) return;
if (tabIndex !== activeTabKey) {
setCurrentlyRemovedPackages([]);
setPage(1);
setActiveTabKey(tabIndex);
setActiveTabKey(tabIndex as Repos);
}
};

13
src/Components/CreateImageWizard/steps/Registration/components/ActivationKeysList.tsx
View file

@ -32,6 +32,7 @@ import {
selectActivationKey,
selectRegistrationType,
} from '../../../../../store/wizardSlice';
import { getErrorMessage } from '../../../../../Utilities/getErrorMessage';
import sortfn from '../../../../../Utilities/sortfn';
import { useGetEnvironment } from '../../../../../Utilities/useGetEnvironment';
import { generateRandomId } from '../../../utilities/generateRandomId';
@ -84,7 +85,7 @@ const ActivationKeysList = () => {
if (filterValue) {
filteredKeys = activationKeys?.body
?.map((key) => key.name)
?.flatMap((key) => (key.name ? [key.name] : []))
.filter((keyName: string) =>
String(keyName).toLowerCase().includes(filterValue.toLowerCase()),
);
@ -127,7 +128,7 @@ const ActivationKeysList = () => {
addNotification({
variant: 'danger',
title: 'Error creating activation key',
description: error?.data?.error?.message,
description: getErrorMessage(error),
});
}
};
@ -165,8 +166,12 @@ const ActivationKeysList = () => {
setIsOpen(!isOpen);
};
const handleSelect = (_event: React.MouseEvent, selection: string) => {
setActivationKey(selection);
const handleSelect = (
_event?: React.MouseEvent,
selection?: string | number,
) => {
if (selection === undefined) return;
if (typeof selection === 'string') setActivationKey(selection);
};
const handleKeyDown = (event: React.KeyboardEvent) => {

5
src/Components/CreateImageWizard/steps/Repositories/Repositories.tsx
View file

@ -397,7 +397,10 @@ const Repositories = () => {
};
const handlePerPageSelect = (
_: React.MouseEvent,
_:
| MouseEvent
| React.MouseEvent<Element, MouseEvent>
| React.KeyboardEvent<Element>,
newPerPage: number,
newPage: number,
) => {

5
src/Components/CreateImageWizard/steps/Snapshot/components/Templates.tsx
View file

@ -67,7 +67,10 @@ const Templates = () => {
};
const handlePerPageSelect = (
_: React.MouseEvent,
_:
| MouseEvent
| React.MouseEvent<Element, MouseEvent>
| React.KeyboardEvent<Element>,
newPerPage: number,
newPage: number,
) => {

7
src/Components/CreateImageWizard/steps/TargetEnvironment/Aws/AwsSourcesSelect.tsx
View file

@ -47,7 +47,7 @@ export const AwsSourcesSelect = () => {
if (sources && filterValue) {
filteredSources = sources
.map((source) => source?.name)
.flatMap((source) => (source?.name ? [source.name] : []))
.filter((source: string) =>
String(source).toLowerCase().includes(filterValue.toLowerCase()),
);
@ -84,9 +84,10 @@ export const AwsSourcesSelect = () => {
};
const handleSelect = (
_event: React.MouseEvent<Element, MouseEvent>,
value: string,
_event?: React.MouseEvent<Element, MouseEvent>,
value?: string | number,
) => {
if (value === undefined) return;
const source = sources?.find((source) => source?.name === value);
dispatch(changeAwsSourceId(source?.id));
setIsOpen(false);

8
src/Components/CreateImageWizard/steps/TargetEnvironment/Azure/AzureHyperVSelect.tsx
View file

@ -20,8 +20,12 @@ export const AzureHyperVSelect = () => {
const dispatch = useAppDispatch();
const [isOpen, setIsOpen] = useState(false);
const handleSelect = (_event: React.MouseEvent, selection: 'V1' | 'V2') => {
dispatch(changeAzureHyperVGeneration(selection));
const handleSelect = (
_event?: React.MouseEvent,
selection?: string | number,
) => {
if (selection === undefined) return;
dispatch(changeAzureHyperVGeneration(selection as 'V1' | 'V2'));
setIsOpen(false);
};

5
src/Components/CreateImageWizard/steps/TargetEnvironment/Azure/AzureResourceGroups.tsx
View file

@ -85,9 +85,10 @@ export const AzureResourceGroups = () => {
};
const setResourceGroup = (
_event: React.MouseEvent<Element, MouseEvent>,
selection: string,
_event?: React.MouseEvent<Element, MouseEvent>,
selection?: string | number,
) => {
if (selection === undefined) return;
const resource =
resourceGroups.find((resource) => resource === selection) || '';
setIsOpen(false);

7
src/Components/CreateImageWizard/steps/TargetEnvironment/Azure/AzureSourcesSelect.tsx
View file

@ -79,7 +79,7 @@ export const AzureSourcesSelect = () => {
if (filterValue) {
filteredSources = rawSources?.data
?.map((source) => source?.name)
?.flatMap((source) => (source?.name ? [source.name] : []))
.filter((source: string) =>
String(source).toLowerCase().includes(filterValue.toLowerCase()),
);
@ -115,9 +115,10 @@ export const AzureSourcesSelect = () => {
};
const handleSelect = (
_event: React.MouseEvent<Element, MouseEvent>,
sourceName: string,
_event?: React.MouseEvent<Element, MouseEvent>,
sourceName?: string | number,
) => {
if (sourceName === undefined) return;
const sourceId = rawSources?.data?.find(
(source) => source?.name === sourceName,
)?.id;

4
src/Components/CreateImageWizard/steps/Timezone/components/TimezoneDropDown.tsx
View file

@ -73,8 +73,8 @@ const TimezoneDropDown = () => {
}
};
const onSelect = (_event: React.MouseEvent, value: string) => {
if (value) {
const onSelect = (_event?: React.MouseEvent, value?: string | number) => {
if (value && typeof value === 'string') {
setInputValue(value);
setFilterValue('');
setErrorText('');

44
src/Components/CreateImageWizard/steps/Users/components/UserInfo.tsx
View file

@ -51,9 +51,11 @@ const UserInfo = () => {
const tabComponentRef = React.useRef<any>();
const firstMount = React.useRef(true);
const onSelect = (event: React.MouseEvent, tabIndex: number) => {
setActiveTabKey(tabIndex);
setIndex(tabIndex);
const onSelect = (event?: React.MouseEvent, tabIndex?: string | number) => {
if (tabIndex && typeof tabIndex === 'number') {
setActiveTabKey(tabIndex);
setIndex(tabIndex);
}
};
const onAdd = () => {
@ -75,23 +77,25 @@ const UserInfo = () => {
}
}, [users.length]);
const onClose = (_event: React.MouseEvent, tabIndex: number) => {
if (
users[tabIndex].name === '' &&
users[tabIndex].password === '' &&
users[tabIndex].ssh_key === ''
) {
const nextTabIndex = calculateNewIndex(
tabIndex,
activeTabKey,
users.length,
);
setActiveTabKey(nextTabIndex);
setIndex(nextTabIndex);
dispatch(removeUser(tabIndex));
} else {
setShowRemoveUserModal(true);
setIndex(tabIndex);
const onClose = (_event: React.MouseEvent, tabIndex: string | number) => {
if (typeof tabIndex === 'number') {
if (
users[tabIndex].name === '' &&
users[tabIndex].password === '' &&
users[tabIndex].ssh_key === ''
) {
const nextTabIndex = calculateNewIndex(
tabIndex,
activeTabKey,
users.length,
);
setActiveTabKey(nextTabIndex);
setIndex(nextTabIndex);
dispatch(removeUser(tabIndex));
} else {
setShowRemoveUserModal(true);
setIndex(tabIndex);
}
}
};

29
src/Components/CreateImageWizard/validators.ts
View file

@ -8,20 +8,33 @@ export const isAwsAccountIdValid = (awsAccountId: string | undefined) => {
);
};
export const isAzureTenantGUIDValid = (azureTenantGUID: string) => {
return /^[0-9a-f]{8}-[0-9a-f]{4}-[1-5][0-9a-f]{3}-[89ab][0-9a-f]{3}-[0-9a-f]{12}$/i.test(
azureTenantGUID,
export const isAzureTenantGUIDValid = (azureTenantGUID: string | undefined) => {
return (
azureTenantGUID !== undefined &&
/^[0-9a-f]{8}-[0-9a-f]{4}-[1-5][0-9a-f]{3}-[89ab][0-9a-f]{3}-[0-9a-f]{12}$/i.test(
azureTenantGUID,
)
);
};
export const isAzureSubscriptionIdValid = (azureSubscriptionId: string) => {
return /^[0-9a-f]{8}-[0-9a-f]{4}-[1-5][0-9a-f]{3}-[89ab][0-9a-f]{3}-[0-9a-f]{12}$/i.test(
azureSubscriptionId,
export const isAzureSubscriptionIdValid = (
azureSubscriptionId: string | undefined,
) => {
return (
azureSubscriptionId !== undefined &&
/^[0-9a-f]{8}-[0-9a-f]{4}-[1-5][0-9a-f]{3}-[89ab][0-9a-f]{3}-[0-9a-f]{12}$/i.test(
azureSubscriptionId,
)
);
};
export const isAzureResourceGroupValid = (azureResourceGroup: string) => {
return /^[-\w._()]+[-\w_()]$/.test(azureResourceGroup);
export const isAzureResourceGroupValid = (
azureResourceGroup: string | undefined,
) => {
return (
azureResourceGroup !== undefined &&
/^[-\w._()]+[-\w_()]$/.test(azureResourceGroup)
);
};
export const isGcpEmailValid = (gcpShareWithAccount: string | undefined) => {

8
src/Components/ImagesTable/ImagesTableToolbar.tsx
View file

@ -42,7 +42,13 @@ interface imagesTableToolbarProps {
perPage: number;
page: number;
setPage: (page: number) => void;
onPerPageSelect: (event: React.MouseEvent, perPage: number) => void;
onPerPageSelect: (
event:
| MouseEvent
| React.MouseEvent<Element, MouseEvent>
| React.KeyboardEvent<Element>,
perPage: number,
) => void;
}
const ImagesTableToolbar: React.FC<imagesTableToolbarProps> = ({

2
src/Hooks/MutationNotifications/useMutationWithNotification.tsx
View file

@ -77,7 +77,7 @@ export function useMutationWithNotification<
description,
});
}
return err;
throw err;
}
};

18
src/Utilities/getErrorMessage.ts Normal file
View file

@ -0,0 +1,18 @@
/* eslint-disable @typescript-eslint/no-explicit-any */
export const getErrorMessage = (error: unknown) => {
if (
typeof error === 'object' &&
error !== null &&
'data' in error &&
typeof (error as any).data === 'object' &&
(error as any).data !== null &&
'error' in (error as any).data &&
typeof (error as any).data.error === 'object' &&
(error as any).data.error !== null &&
'message' in (error as any).data.error &&
typeof (error as any).data.error.message === 'string'
) {
return (error as any).data.error.message;
}
return 'Unknown error';
};

14
src/Utilities/useOnPremOpenSCAP.tsx
View file

@ -12,12 +12,14 @@ export const useOnPremOpenSCAPAvailable = () => {
const checkPackages = () => {
cockpit
.spawn(['rpm', '-qa', 'openscap-scanner', 'scap-security-guide'], {})
.then((res: string) => {
setPackagesAvailable(
res.includes('openscap-scanner') &&
res.includes('scap-security-guide'),
);
setIsLoading(false);
.then((res: string | Uint8Array<ArrayBufferLike>) => {
if (typeof res === 'string') {
setPackagesAvailable(
res.includes('openscap-scanner') &&
res.includes('scap-security-guide'),
);
setIsLoading(false);
}
})
.catch(() => {
setPackagesAvailable(false);

4
src/test/setup.ts
View file

@ -74,8 +74,8 @@ vi.mock('@unleash/proxy-client-react', () => ({
// remove DOM dump from the testing-library output
configure({
getElementError: (message: string) => {
const error = new Error(message);
getElementError: (message: string | null, _container: Element) => {
const error = new Error(message ?? '');
error.name = 'TestingLibraryElementError';
error.stack = '';
return error;