From 52bf75ef436320e798329d17f38f1330ae9df2cd Mon Sep 17 00:00:00 2001
From: Quang Manh Truong <106559523+manhtruongwang@users.noreply.github.com>
Date: Mon, 10 Mar 2025 01:39:22 +0700
Subject: [PATCH 1/2] Update Toast.tsx to support padding for modal

---
 src/containers/Toast.tsx | 3 ++-
 1 file changed, 2 insertions(+), 1 deletion(-)

diff --git a/src/containers/Toast.tsx b/src/containers/Toast.tsx
index 7c267b4..94f192d 100644
--- a/src/containers/Toast.tsx
+++ b/src/containers/Toast.tsx
@@ -14,6 +14,7 @@ export type IConfigToast = {
   textBody?: string;
   titleStyle?: StyleProp<TextStyle>;
   textBodyStyle?: StyleProp<TextStyle>;
+  paddingTop?: number;
   onPress?: () => void;
   onShow?: () => void;
   onHide?: () => void;
@@ -90,7 +91,7 @@ export class Toast extends React.Component<IProps, IState> {
     const { isDark, config: configGeneral } = this.props;
     return (
       <SafeAreaInsetsContext.Consumer>
-        {(insets) => <ToastRender {...data} isDark={isDark} paddingTop={insets?.top} configGeneral={configGeneral} onClose={this._closedHandler} />}
+        {(insets) => <ToastRender {...data} isDark={isDark} paddingTop={data.paddingTop ?? insets?.top} configGeneral={configGeneral} onClose={this._closedHandler} />}
       </SafeAreaInsetsContext.Consumer>
     );
   }

From cad0b45278fa629505017c2e1a43bcb6ebd5b1a4 Mon Sep 17 00:00:00 2001
From: manhtruongwang <manhowls@icloud.com>
Date: Mon, 10 Mar 2025 02:18:17 +0700
Subject: [PATCH 2/2] Rename package and update author information; enhance
 Dialog component with cancel and confirm button support

---
 README.md                 | 66 +++++++++++++++++++++++++++------------
 package.json              | 12 +++----
 src/containers/Dialog.tsx | 51 ++++++++++++++++++++++++++++--
 3 files changed, 101 insertions(+), 28 deletions(-)

diff --git a/README.md b/README.md
index d6c6b0d..51fa92e 100644
--- a/README.md
+++ b/README.md
@@ -1,23 +1,23 @@
-# react-native-alert-notification
+# react-native-alert-dialog
 
 ## Example Dialog Box
 
-|                                                                             Theme Light                                                                              |                                                                             Theme Dark                                                                             |
-| :------------------------------------------------------------------------------------------------------------------------------------------------------------------: | :----------------------------------------------------------------------------------------------------------------------------------------------------------------: |
-| <img src="https://github.com/CodingByJerez/react-native-alert-notification/blob/master/.github/images/dialog-light.gif?raw=true" height="350" alt="Dialogs light" /> | <img src="https://github.com/CodingByJerez/react-native-alert-notification/blob/master/.github/images/dialog-dark.gif?raw=true" height="350" alt="Dialogs Dark" /> |
+|                                                                           Theme Light                                                                           |                                                                          Theme Dark                                                                           |
+| :-------------------------------------------------------------------------------------------------------------------------------------------------------------: | :-----------------------------------------------------------------------------------------------------------------------------------------------------------: |
+| <img src="https://github.com/manhtruongwang/react-native-toast-dialog/blob/master/.github/images/dialog-light.gif?raw=true" height="350" alt="Dialogs light" /> | <img src="https://github.com/manhtruongwang/react-native-toast-dialog/blob/master/.github/images/dialog-dark.gif?raw=true" height="350" alt="Dialogs Dark" /> |
 
 ## Example Toast Notification
 
-|                                                                            Theme Light                                                                             |                                                                            Theme Dark                                                                            |
-| :----------------------------------------------------------------------------------------------------------------------------------------------------------------: | :--------------------------------------------------------------------------------------------------------------------------------------------------------------: |
-| <img src="https://github.com/CodingByJerez/react-native-alert-notification/blob/master/.github/images/toast-light.gif?raw=true" height="350" alt="toasts light" /> | <img src="https://github.com/CodingByJerez/react-native-alert-notification/blob/master/.github/images/toast-dark.gif?raw=true" height="350" alt="toasts Dark" /> |
+|                                                                          Theme Light                                                                          |                                                                         Theme Dark                                                                          |
+| :-----------------------------------------------------------------------------------------------------------------------------------------------------------: | :---------------------------------------------------------------------------------------------------------------------------------------------------------: |
+| <img src="https://github.com/manhtruongwang/react-native-toast-dialog/blob/master/.github/images/toast-light.gif?raw=true" height="350" alt="toasts light" /> | <img src="https://github.com/manhtruongwang/react-native-toast-dialog/blob/master/.github/images/toast-dark.gif?raw=true" height="350" alt="toasts Dark" /> |
 
 ## Installation
 
 ### - Installing:
 
 ```sh
-yarn add react-native-alert-notification
+yarn add react-native-alert-dialog
 ```
 
 ### - Installing dependencies:
@@ -43,7 +43,7 @@ import { ALERT_TYPE, Dialog, AlertNotificationRoot, Toast } from 'react-native-a
 
 <AlertNotificationRoot>
   <View>
-    // dialog box
+    // dialog box with single button
     <Button
       title={'dialog box'}
       onPress={() =>
@@ -55,6 +55,21 @@ import { ALERT_TYPE, Dialog, AlertNotificationRoot, Toast } from 'react-native-a
         })
       }
     />
+    // dialog box with cancel & confirm buttons
+    <Button
+      title={'confirmation dialog'}
+      onPress={() =>
+        Dialog.show({
+          type: ALERT_TYPE.WARNING,
+          title: 'Confirm Action',
+          textBody: 'Are you sure you want to proceed with this action?',
+          cancelButton: 'Cancel',
+          confirmButton: 'Proceed',
+          onPressCancel: () => console.log('Action cancelled'),
+          onPressConfirm: () => console.log('Action confirmed'),
+        })
+      }
+    />
     // toast notification
     <Button
       title={'toast notification'}
@@ -63,6 +78,7 @@ import { ALERT_TYPE, Dialog, AlertNotificationRoot, Toast } from 'react-native-a
           type: ALERT_TYPE.SUCCESS,
           title: 'Success',
           textBody: 'Congrats! this is toast notification success',
+          paddingTop: 45, // custom top padding
         })
       }
     />
@@ -108,9 +124,13 @@ type IColors = {
 | type              | Defines the type ("Success", "Warning" or "Error") | true    |         | "SUCCESS", "DANGER", "WARNING" |
 | textBody          | The text body                                      |         |         | String                         |
 | button            | name button (for hide button: undefined)           |         |         | String                         |
+| cancelButton      | Text for cancel button in dual-button layout       |         |         | String                         |
+| confirmButton     | Text for confirm button in dual-button layout      |         |         | String                         |
 | autoClose         | Defines time auto close dialog box in ms           |         | face    | bool / number                  |
 | closeOnOverlayTap | allow close if click in overlay                    |         | true    | bool                           |
 | onPressButton     | (if not declared and isset button action is close) |         | String  | () => void                     |
+| onPressCancel     | Action when cancel button is pressed               |         |         | () => void                     |
+| onPressConfirm    | Action when confirm button is pressed              |         |         | () => void                     |
 | onShow            | action after end animation open                    |         |         | () => void                     |
 | onHide            | action after end animation close                   |         |         | () => void                     |
 
@@ -120,9 +140,13 @@ type IConfig = {
   title?: string;
   textBody?: string;
   button?: string;
+  cancelButton?: string;
+  confirmButton?: string;
   autoClose?: number | boolean;
   closeOnOverlayTap?: boolean;
   onPressButton?: () => void;
+  onPressCancel?: () => void;
+  onPressConfirm?: () => void;
   onShow?: () => void;
   onHide?: () => void;
 };
@@ -130,15 +154,16 @@ type IConfig = {
 
 ### Toast Notification Component
 
-| Name      | Description                                        | Require | Default | Type                           |
-| --------- | -------------------------------------------------- | ------- | ------- | ------------------------------ |
-| title     | The title text                                     |         |         | String                         |
-| type      | Defines the type ("Success", "Warning" or "Error") |         |         | "SUCCESS", "DANGER", "WARNING" |
-| textBody  | The text body                                      |         |         | String                         |
-| autoClose | Defines time auto close dialog box in ms           |         | 5000    | bool / number                  |
-| onPress   | action click in card                               |         |         | bool                           |
-| onShow    | event after end animation open                     |         |         | () => void                     |
-| onHide    | event after end animation close                    |         |         | () => void                     |
+| Name       | Description                                        | Require | Default | Type                           |
+| ---------- | -------------------------------------------------- | ------- | ------- | ------------------------------ |
+| title      | The title text                                     |         |         | String                         |
+| type       | Defines the type ("Success", "Warning" or "Error") |         |         | "SUCCESS", "DANGER", "WARNING" |
+| textBody   | The text body                                      |         |         | String                         |
+| autoClose  | Defines time auto close dialog box in ms           |         | 5000    | bool / number                  |
+| paddingTop | Specify custom top padding                         |         | 0       | number                         |
+| onPress    | action click in card                               |         |         | bool                           |
+| onShow     | event after end animation open                     |         |         | () => void                     |
+| onHide     | event after end animation close                    |         |         | () => void                     |
 
 ```ts
 type IConfig = {
@@ -146,6 +171,7 @@ type IConfig = {
   title?: string;
   textBody?: string;
   autoClose?: number | boolean;
+  paddingTop?: number;
   titleStyle?: StyleProp<TextStyle>;
   textBodyStyle?: StyleProp<TextStyle>;
   onPress?: () => void;
@@ -166,9 +192,9 @@ Toast.hide();
 
 ## Author
 
-Rodolphe Jerez | [https://codingbyjerez.com](https://codingbyjerez.com)
+Truong Quang Manh | [https://vietgigs.vn](https://vietgigs.vn)
 
-See the [contributing guide](CONTRIBUTING.md) to learn how to contribute to the repository and the development workflow.
+See the contributing guide to learn how to contribute to the repository and the development workflow.
 
 ## License
 
diff --git a/package.json b/package.json
index eb1fc8b..202d26f 100644
--- a/package.json
+++ b/package.json
@@ -1,8 +1,8 @@
 {
-  "name": "react-native-alert-notification",
+  "name": "react-native-alert-dialog",
   "version": "0.4.2",
-  "license": "MIT",
   "description": "Toast notification and dialog box notification for react native",
+  "license": "MIT",
   "main": "lib/commonjs/index",
   "module": "lib/module/index",
   "types": "lib/typescript/index.d.ts",
@@ -45,15 +45,15 @@
     "dialog",
     "modal"
   ],
-  "author": "Rodolphe Jerez <contact@codingbyjerez.com> (github.com/codingbyjerez)",
+  "author": "Truong Quang Manh <manhowls@gmail.com> (github.com/manhtruongwang)",
   "repository": {
     "type": "git",
-    "url": "https://github.com/CodingByJerez/react-native-alert-notification"
+    "url": "https://github.com/manhtruongwang/react-native-toast-dialog"
   },
   "bugs": {
-    "url": "https://github.com/CodingByJerez/react-native-alert-notification/issues"
+    "url": "https://github.com/manhtruongwang/react-native-toast-dialog/issues"
   },
-  "homepage": "https://github.com/CodingByJerez/react-native-alert-notification#readme",
+  "homepage": "https://github.com/manhtruongwang/react-native-toast-dialog#readme",
   "publishConfig": {
     "registry": "https://registry.npmjs.org/"
   },
diff --git a/src/containers/Dialog.tsx b/src/containers/Dialog.tsx
index a6afe15..253875d 100644
--- a/src/containers/Dialog.tsx
+++ b/src/containers/Dialog.tsx
@@ -8,9 +8,13 @@ export type IConfigDialog = {
   title?: string;
   textBody?: string;
   button?: string;
+  cancelButton?: string;
+  confirmButton?: string;
   autoClose?: number | boolean;
   closeOnOverlayTap?: boolean;
   onPressButton?: () => void;
+  onPressCancel?: () => void;
+  onPressConfirm?: () => void;
   onShow?: () => void;
   onHide?: () => void;
 };
@@ -178,7 +182,9 @@ export class Dialog extends React.Component<IProps, IState> {
    */
   private _buttonRender = (): JSX.Element => {
     const { styles } = this.state;
-    const { type, onPressButton, button } = this.state.config!;
+    const { type, onPressButton, button, cancelButton, confirmButton, onPressCancel, onPressConfirm } = this.state.config!;
+
+    // If using the legacy single button approach
     if (button) {
       return (
         <TouchableOpacity style={StyleSheet.flatten([styles.button, styles[type]])} onPress={onPressButton ?? this._close}>
@@ -186,6 +192,25 @@ export class Dialog extends React.Component<IProps, IState> {
         </TouchableOpacity>
       );
     }
+
+    // If using the new cancel/confirm buttons
+    if (cancelButton || confirmButton) {
+      return (
+        <View style={styles.buttonsContainer}>
+          {cancelButton && (
+            <TouchableOpacity style={StyleSheet.flatten([styles.button, styles.cancelButton])} onPress={onPressCancel ?? this._close}>
+              <Text style={styles.cancelButtonLabel}>{cancelButton}</Text>
+            </TouchableOpacity>
+          )}
+          {confirmButton && (
+            <TouchableOpacity style={StyleSheet.flatten([styles.button, styles[type]])} onPress={onPressConfirm ?? this._close}>
+              <Text style={styles.buttonLabel}>{confirmButton}</Text>
+            </TouchableOpacity>
+          )}
+        </View>
+      );
+    }
+
     return <></>;
   };
 
@@ -242,7 +267,13 @@ export class Dialog extends React.Component<IProps, IState> {
     const { visible, styles } = this.state;
     const { _OverlayCloseRender, _CardRender } = this;
     return (
-      <Modal transparent={true} visible={visible} animated={false} onShow={this._showModalHandler}>
+      <Modal
+        transparent={true}
+        supportedOrientations={['portrait', 'portrait-upside-down', 'landscape', 'landscape-left', 'landscape-right']}
+        visible={visible}
+        animated={false}
+        onShow={this._showModalHandler}
+      >
         <Animated.View style={StyleSheet.flatten([styles.backgroundContainer, { opacity: this._opacity }])} />
         <_OverlayCloseRender />
         <_CardRender />
@@ -287,6 +318,11 @@ const __styles = (isDark: boolean) =>
       textAlign: 'center',
       color: Color.get('label', isDark),
     },
+    buttonsContainer: {
+      flexDirection: 'row',
+      justifyContent: 'space-around',
+      marginTop: 12,
+    },
     button: {
       borderRadius: 50,
       height: 40,
@@ -295,6 +331,17 @@ const __styles = (isDark: boolean) =>
       alignItems: 'center',
       alignSelf: 'center',
       marginTop: 12,
+      marginHorizontal: 8,
+    },
+    cancelButton: {
+      backgroundColor: '#DDDDDD',
+      borderWidth: 1,
+      borderColor: '#CCCCCC',
+    },
+    cancelButtonLabel: {
+      color: isDark ? '#FFFFFF' : '#555555',
+      fontWeight: 'bold',
+      fontSize: 16,
     },
     buttonLabel: {
       color: '#fff',