disabled delete button

Altinn · Feb 24, 2025 · db717db · db717db
1 parent b2b0c50
commit db717db
Show file tree

Hide file tree

Showing 2 changed files with 22 additions and 8 deletions.
diff --git a/...end/packages/ux-editor/src/components/config/ExpressionContent/ExpressionContent.test.tsx b/...end/packages/ux-editor/src/components/config/ExpressionContent/ExpressionContent.test.tsx
@@ -58,12 +58,24 @@ describe('ExpressionContent', () => {
     const user = userEvent.setup();
     jest.spyOn(window, 'confirm').mockImplementation(() => true);
     const onDelete = jest.fn();
-    renderExpressionContent({ onDelete });
+    renderExpressionContent({ onDelete, expression: parsableLogicalExpression });
     const deleteButtonName = textMock('right_menu.expression_delete');
     const deleteButton = screen.getByRole('button', { name: deleteButtonName });
     await user.click(deleteButton);
     expect(onDelete).toHaveBeenCalledTimes(1);
   });
+
+  it('Show delete button when existing an expression', async () => {
+    renderExpressionContent({ expression: parsableLogicalExpression });
+    screen.getByRole('button', { name: textMock('right_menu.expression_delete') });
+  });
+
+  it('Do not show delete button if there is no expression', async () => {
+    renderExpressionContent();
+    expect(
+      screen.queryByRole('button', { name: textMock('right_menu.expression_delete') }),
+    ).not.toBeInTheDocument();
+  });
 });
 
 const renderExpressionContent = (props: Partial<ExpressionContentProps> = {}) => {

diff --git a/frontend/packages/ux-editor/src/components/config/ExpressionContent/ExpressionContent.tsx b/frontend/packages/ux-editor/src/components/config/ExpressionContent/ExpressionContent.tsx
@@ -48,13 +48,15 @@ export const ExpressionContent = ({
           {heading}
         </Paragraph>
       </legend>
-      <StudioDeleteButton
-        className={classes.deleteButton}
-        confirmMessage={t('right_menu.expressions_delete_confirm')}
-        onDelete={onDelete}
-        size='small'
-        title={t('right_menu.expression_delete')}
-      />
+      {expression && (
+        <StudioDeleteButton
+          className={classes.deleteButton}
+          confirmMessage={t('right_menu.expressions_delete_confirm')}
+          onDelete={onDelete}
+          size='small'
+          title={t('right_menu.expression_delete')}
+        />
+      )}
       <div className={classes.expressionWrapper}>
         <ExpressionWithTexts
           expression={expression}