From 1a3a0f549bc197e518eb0bb0785f38f50a3fff57 Mon Sep 17 00:00:00 2001
From: Tsu-ba-me <ynho.li.aa.e@gmail.com>
Date: Fri, 17 Feb 2023 23:22:01 -0500
Subject: [PATCH] fix(striker-ui): add scroll box in ConfirmDialog

---
 striker-ui/components/ConfirmDialog.tsx | 20 ++++++++++++++++++--
 striker-ui/types/ConfirmDialog.d.ts     |  2 ++
 2 files changed, 20 insertions(+), 2 deletions(-)

diff --git a/striker-ui/components/ConfirmDialog.tsx b/striker-ui/components/ConfirmDialog.tsx
index 31b3b83e..e68a6fb7 100644
--- a/striker-ui/components/ConfirmDialog.tsx
+++ b/striker-ui/components/ConfirmDialog.tsx
@@ -1,4 +1,4 @@
-import { Dialog as MUIDialog } from '@mui/material';
+import { Box, Dialog as MUIDialog, SxProps, Theme } from '@mui/material';
 import {
   ButtonHTMLAttributes,
   ElementType,
@@ -51,6 +51,8 @@ const ConfirmDialog = forwardRef<
       openInitially = false,
       proceedButtonProps = {},
       proceedColour: proceedColourKey = 'blue',
+      scrollContent: isScrollContent = false,
+      scrollBoxProps: { sx: scrollBoxSx, ...restScrollBoxProps } = {},
       titleText,
     },
     ref,
@@ -183,6 +185,18 @@ const ConfirmDialog = forwardRef<
         typeof content === 'string' ? <BodyText text={content} /> : content,
       [content],
     );
+    const combinedScrollBoxSx = useMemo<SxProps<Theme> | undefined>(
+      () =>
+        isScrollContent
+          ? {
+              maxHeight: '60vh',
+              overflowY: 'scroll',
+              padding: '.2em .4em',
+              ...scrollBoxSx,
+            }
+          : undefined,
+      [isScrollContent, scrollBoxSx],
+    );
 
     useImperativeHandle(
       ref,
@@ -210,7 +224,9 @@ const ConfirmDialog = forwardRef<
           onSubmit={contentContainerSubmitEventHandler}
           {...contentContainerProps}
         >
-          {contentElement}
+          <Box {...restScrollBoxProps} sx={combinedScrollBoxSx}>
+            {contentElement}
+          </Box>
           {actionAreaElement}
         </FlexBox>
       </MUIDialog>
diff --git a/striker-ui/types/ConfirmDialog.d.ts b/striker-ui/types/ConfirmDialog.d.ts
index 3ec64882..2103d3de 100644
--- a/striker-ui/types/ConfirmDialog.d.ts
+++ b/striker-ui/types/ConfirmDialog.d.ts
@@ -12,6 +12,8 @@ type ConfirmDialogOptionalProps = {
   openInitially?: boolean;
   proceedButtonProps?: ContainedButtonProps;
   proceedColour?: 'blue' | 'red';
+  scrollContent?: boolean;
+  scrollBoxProps?: import('@mui/material').BoxProps;
 };
 
 type ConfirmDialogProps = ConfirmDialogOptionalProps & {