feat(modal): Code review feedback

components/ui/modal/Modal.tsx

@@ -9,28 +9,28 @@ import {
 import React from "react";
 
 interface ModalProps {
-  title: string;
-  body: React.ReactNode;
-  closeText?: string;
-  actionText?: string;
-  onAction?: () => void;
+  modalTitle: string;
+  modalBody: React.ReactNode;
+  closeButtonLabel?: string;
+  actionButtonLabel?: string;
+  onAction: () => void;
   isOpen: boolean;
   onOpenChange: (isOpen: boolean) => void;
   isDismissable?: boolean;
+  isKeyboardDismissDisabled?: boolean;
+  hideCloseButton?: boolean;
 }
 
 export const Modal: React.FC<ModalProps> = ({
-  title,
+  modalTitle,
+  modalBody,
+  closeButtonLabel,
+  actionButtonLabel,
+  onAction,
   isOpen,
   onOpenChange,
-  body,
-  closeText,
-  actionText,
-  onAction,
   isDismissable,
 }) => {
-  const hasActionButton = actionText && onAction;
-
   return (
     <>
       <ModalContainer
@@ -44,17 +44,17 @@ export const Modal: React.FC<ModalProps> = ({
         <ModalContent>
           {(onClose) => (
             <>
-              <ModalHeader className="flex flex-col gap-1">{title}</ModalHeader>
-              <ModalBody>{body}</ModalBody>
+              <ModalHeader className="flex flex-col gap-1">
+                {modalTitle}
+              </ModalHeader>
+              <ModalBody>{modalBody}</ModalBody>
               <ModalFooter>
                 <Button color="danger" variant="light" onPress={onClose}>
-                  {closeText && closeText}
+                  {closeButtonLabel}
+                </Button>
+                <Button color="primary" onPress={onAction}>
+                  {actionButtonLabel}
                 </Button>
-                {hasActionButton && (
-                  <Button color="primary" onPress={onAction}>
-                    {actionText}
-                  </Button>
-                )}
               </ModalFooter>
             </>
           )}

components/ui/modal/ModalWrap.tsx

@@ -6,38 +6,38 @@ import React from "react";
 import { Modal } from "@/components";
 
 interface ModalWrapProps {
-  title: string;
-  body: React.ReactNode;
-  closeText?: string;
-  actionText?: string;
-  onAction?: () => void;
-  triggerText?: string;
+  modalTitle: string;
+  modalBody: React.ReactNode;
+  closeButtonLabel?: string;
+  actionButtonLabel?: string;
+  onAction: () => void;
+  openButtonLabel?: string;
   isDismissable?: boolean;
 }
 
 export const ModalWrap: React.FC<ModalWrapProps> = ({
-  title,
-  body,
-  closeText = "Close",
-  actionText = "Save",
+  modalTitle,
+  modalBody,
+  closeButtonLabel = "Close",
+  actionButtonLabel = "Save",
   onAction,
+  openButtonLabel = "Open",
   isDismissable = true,
-  triggerText = "Open",
 }) => {
   const { isOpen, onOpen, onClose, onOpenChange } = useDisclosure();
   const closeOnAction = () => {
-    onAction && onAction();
+    onAction?.();
     onClose();
   };
 
   return (
     <>
-      <Button onPress={onOpen}>{triggerText}</Button>
+      <Button onPress={onOpen}>{openButtonLabel}</Button>
       <Modal
-        title={title}
-        body={body}
-        closeText={closeText}
-        actionText={actionText}
+        modalTitle={modalTitle}
+        modalBody={modalBody}
+        closeButtonLabel={closeButtonLabel}
+        actionButtonLabel={actionButtonLabel}
         onAction={closeOnAction}
         isDismissable={isDismissable}
         isOpen={isOpen}