EPMRPP-91757 || modal and toggle fix

reportportal · Jul 29, 2024 · a33f706 · a33f706
1 parent cca6ff5
commit a33f706
Show file tree

Hide file tree

Showing 4 changed files with 13 additions and 8 deletions.
diff --git a/src/components/modal/modal.stories.tsx b/src/components/modal/modal.stories.tsx
@@ -15,13 +15,13 @@ const meta: Meta<typeof Modal> = {
     children: 'Some modal content',
     okButton: {
       type: 'submit',
-      children: 'Login',
+      text: 'Login',
       onClick: () => {
         console.log('Logged in successfully');
       },
     },
     cancelButton: {
-      children: 'Cancel',
+      text: 'Cancel',
     },
   },
 };

diff --git a/src/components/modal/modal.tsx b/src/components/modal/modal.tsx
@@ -30,8 +30,8 @@ interface ModalProps {
   size?: ModalSize;
   overlay?: ModalOverlay;
   allowCloseOutside?: boolean;
-  okButton?: ButtonProps;
-  cancelButton?: ButtonProps;
+  okButton?: ButtonProps & { text: string };
+  cancelButton?: ButtonProps & { text: string };
   scrollable?: boolean;
   withoutFooter?: boolean;
   CustomFooter?: FC<{ closeHandler: () => void }>;

diff --git a/src/components/modal/modalFooter/modalFooter.tsx b/src/components/modal/modalFooter/modalFooter.tsx
@@ -10,8 +10,8 @@ export type ModalSize = 'default' | 'small' | 'large';
 interface ModalFooterProps {
   closeHandler: MouseEventHandler<HTMLButtonElement>;
   footerNode?: ReactNode;
-  okButton?: ButtonProps;
-  cancelButton?: ButtonProps;
+  okButton?: ButtonProps & { text: string };
+  cancelButton?: ButtonProps & { text: string };
   size?: ModalSize;
 }
 
@@ -33,12 +33,16 @@ export const ModalFooter: FC<ModalFooterProps> = ({
               adjustWidthOn={size === 'small' ? 'parent' : 'content'}
               onClick={closeHandler}
               {...cancelButton}
-            />
+            >
+              {cancelButton.text}
+            </Button>
           </div>
         )}
         {okButton && (
           <div className={cx('button-container')}>
-            <Button adjustWidthOn={size === 'small' ? 'parent' : 'content'} {...okButton} />
+            <Button adjustWidthOn={size === 'small' ? 'parent' : 'content'} {...okButton}>
+              {okButton.text}
+            </Button>
           </div>
         )}
       </div>

diff --git a/src/components/toggle/toggle.module.scss b/src/components/toggle/toggle.module.scss
@@ -10,6 +10,7 @@
   @include font-scale();
   color: var(--rp-ui-base-almost-black);
   cursor: pointer;
+  width: 32px;
 }
 
 .children-container {