ExpandableOverlay - add migrateDialog (#2635)

Author: M-i-k-e-l

src/incubator/expandableOverlay/index.tsx

@@ -3,7 +3,8 @@ import React, {useCallback, useState, forwardRef, PropsWithChildren, useImperati
 import TouchableOpacity, {TouchableOpacityProps} from '../../components/touchableOpacity';
 import View from '../../components/view';
 import Modal, {ModalProps, ModalTopBarProps} from '../../components/modal';
-import Dialog, {DialogProps} from '../../components/dialog';
+import DialogOld, {DialogProps as DialogPropsOld} from '../../components/dialog';
+import DialogNew, {DialogProps as DialogPropsNew} from '../Dialog';
 import {Colors} from 'style';
 
 export interface ExpandableOverlayMethods {
@@ -33,7 +34,11 @@ export type ExpandableOverlayProps = TouchableOpacityProps &
     /**
      * The props to pass to the dialog expandable container
      */
-    dialogProps?: DialogProps;
+    dialogProps?: DialogPropsOld | DialogPropsNew;
+    /**
+     * Migrate the Dialog to DialogNew (make sure you use only new props in dialogProps)
+     */
+    migrateDialog?: boolean;
     /**
      * Whether to render a modal top bar (relevant only for modal)
      */
@@ -59,6 +64,7 @@ const ExpandableOverlay = (props: ExpandableOverlayProps, ref: any) => {
     useDialog,
     modalProps,
     dialogProps,
+    migrateDialog,
     showTopBar,
     topBarProps,
     renderCustomOverlay,
@@ -103,7 +109,9 @@ const ExpandableOverlay = (props: ExpandableOverlayProps, ref: any) => {
   };
 
   const renderDialog = () => {
+    const Dialog = migrateDialog ? DialogNew : DialogOld;
     return (
+      // @ts-expect-error
       <Dialog testID={`${testID}.overlay`} {...dialogProps} visible={visible} onDismiss={closeExpandable}>
         {expandableContent}
       </Dialog>