...

1 files changed, 49 insertions, 22 deletions

diff --git a/FrontEnd/src/views/common/dialog/DialogContainer.tsx b/FrontEnd/src/views/common/dialog/DialogContainer.tsx
index b0a87ea5..afee2669 100644
--- a/FrontEnd/src/views/common/dialog/DialogContainer.tsx
+++ b/FrontEnd/src/views/common/dialog/DialogContainer.tsx
@@ -2,11 +2,11 @@ import { ComponentProps, Ref, ReactNode } from "react";
 import classNames from "classnames";
 
 import { ThemeColor, Text, useC } from "../common";
-import { ButtonRow } from "../button";
+import { ButtonRow, ButtonRowV2 } from "../button";
 
 import "./DialogContainer.css";
 
-interface DialogContainerProps {
+interface DialogContainerBaseProps {
   className?: string;
   title: Text;
   titleColor?: ThemeColor;
@@ -14,25 +14,37 @@ interface DialogContainerProps {
   titleRef?: Ref<HTMLDivElement>;
   bodyContainerClassName?: string;
   bodyContainerRef?: Ref<HTMLDivElement>;
-  buttons: ComponentProps<typeof ButtonRow>["buttons"];
   buttonsClassName?: string;
   buttonsContainerRef?: ComponentProps<typeof ButtonRow>["containerRef"];
   children: ReactNode;
 }
 
-export default function DialogContainer({
-  className,
-  title,
-  titleColor,
-  titleClassName,
-  titleRef,
-  bodyContainerClassName,
-  bodyContainerRef,
-  buttons,
-  buttonsClassName,
-  buttonsContainerRef,
-  children,
-}: DialogContainerProps) {
+interface DialogContainerWithButtonsProps extends DialogContainerBaseProps {
+  buttons: ComponentProps<typeof ButtonRow>["buttons"];
+}
+
+interface DialogContainerWithButtonsV2Props extends DialogContainerBaseProps {
+  buttonsV2: ComponentProps<typeof ButtonRowV2>["buttons"];
+}
+
+type DialogContainerProps =
+  | DialogContainerWithButtonsProps
+  | DialogContainerWithButtonsV2Props;
+
+export default function DialogContainer(props: DialogContainerProps) {
+  const {
+    className,
+    title,
+    titleColor,
+    titleClassName,
+    titleRef,
+    bodyContainerClassName,
+    bodyContainerRef,
+    buttonsClassName,
+    buttonsContainerRef,
+    children,
+  } = props;
+
   const c = useC();
 
   return (
@@ -57,12 +69,27 @@ export default function DialogContainer({
         {children}
       </div>
       <hr className="cru-dialog-container-hr" />
-      <ButtonRow
-        containerRef={buttonsContainerRef}
-        className={classNames("cru-dialog-container-button-row", buttonsClassName)}
-        buttons={buttons}
-        buttonsClassName="cru-dialog-container-button"
-      />
+      {"buttons" in props ? (
+        <ButtonRow
+          containerRef={buttonsContainerRef}
+          className={classNames(
+            "cru-dialog-container-button-row",
+            buttonsClassName,
+          )}
+          buttons={props.buttons}
+          buttonsClassName="cru-dialog-container-button"
+        />
+      ) : (
+        <ButtonRowV2
+          containerRef={buttonsContainerRef}
+          className={classNames(
+            "cru-dialog-container-button-row",
+            buttonsClassName,
+          )}
+          buttons={props.buttonsV2}
+          buttonsClassName="cru-dialog-container-button"
+        />
+      )}
     </div>
   );
 }