diff --git a/packages/dnb-eufemia/src/components/form-label/FormLabel.tsx b/packages/dnb-eufemia/src/components/form-label/FormLabel.tsx index 9b8374598c0..702263e1a87 100644 --- a/packages/dnb-eufemia/src/components/form-label/FormLabel.tsx +++ b/packages/dnb-eufemia/src/components/form-label/FormLabel.tsx @@ -139,7 +139,7 @@ export default function FormLabel(localProps: FormLabelAllProps) { forElem?.closest('.dnb-input__border--root') || forElem?.closest('.dnb-input__border') - if (target) { + if (target && ref.current) { const elem = ref.current const buttonEnter = () => { @@ -166,20 +166,21 @@ export default function FormLabel(localProps: FormLabelAllProps) { const leave = () => { target.classList.remove('hover') - elem - .querySelector('button') - ?.removeEventListener?.('mouseenter', buttonEnter) + const button = elem.querySelector('button') + button?.removeEventListener?.('mouseenter', buttonEnter) } - elem?.addEventListener?.('mouseenter', enter) - elem?.addEventListener?.('mouseleave', leave) + elem.addEventListener('mouseenter', enter) + elem.addEventListener('mouseleave', leave) return () => { - elem?.removeEventListener?.('mouseenter', enter) - elem?.removeEventListener?.('mouseleave', leave) - elem - .querySelector('button') - ?.removeEventListener?.('mouseleave', buttonLeave) + if (elem) { + elem.removeEventListener('mouseenter', enter) + elem.removeEventListener('mouseleave', leave) + + const button = elem.querySelector('button') + button?.removeEventListener?.('mouseleave', buttonLeave) + } } } }, [forId, ref]) diff --git a/packages/dnb-eufemia/src/components/upload/UploadFileListCell.tsx b/packages/dnb-eufemia/src/components/upload/UploadFileListCell.tsx index 6dbc6e1755b..8de4f53a3a0 100644 --- a/packages/dnb-eufemia/src/components/upload/UploadFileListCell.tsx +++ b/packages/dnb-eufemia/src/components/upload/UploadFileListCell.tsx @@ -131,6 +131,7 @@ const UploadFileListCell = ({ variant="tertiary" onClick={onDeleteHandler} icon_position="left" + disabled={isLoading} > {deleteButtonText} diff --git a/packages/dnb-eufemia/src/components/upload/__tests__/UploadFileListCell.test.tsx b/packages/dnb-eufemia/src/components/upload/__tests__/UploadFileListCell.test.tsx index 45a0184f6ab..2549306ead0 100644 --- a/packages/dnb-eufemia/src/components/upload/__tests__/UploadFileListCell.test.tsx +++ b/packages/dnb-eufemia/src/components/upload/__tests__/UploadFileListCell.test.tsx @@ -322,6 +322,21 @@ describe('UploadFileListCell', () => { ).toBeInTheDocument() }) + it('renders the delete button as disabled when loading state', () => { + render( + + ) + const element = screen.getByRole('button') + + expect(element).toBeDisabled() + }) + it('does not render the loading state when not loading', () => { render(