namirasoft-account-react 1.3.78 → 1.3.80

package/src/components/NSAMessageDialog.module.css

@@ -1,63 +1,90 @@
-.nsa_message_icon {
-    cursor: pointer;
-}
-
-.nsa_message_title {
-    color: hsla(212, 100%, 51%, 1)
-}
-
-.nsa_message_item_title {
-    color: hsla(234, 64%, 22%, 1);
-    display: flex;
-    align-items: center;
-    gap: 8px;
-}
-
-.nsa_message_item_content {
-    color: hsla(234, 64%, 22%, 1);
-    margin: 0;
-}
-
-.nsa_message_item_dot_green {
-    width: 8px;
-    height: 8px;
-    background: hsla(157, 94%, 42%, 1);
-    border-radius: 50%;
-}
-
-.nsa_message_item_dot_gray {
-    width: 8px;
-    height: 8px;
-    background: hsla(228, 9%, 66%, 1);
-    border-radius: 50%;
-}
-
-.nsa_body_green {
-    background-color: hsla(157, 94%, 42%, 0.1);
-    padding: 16px;
-}
-
-.nsa_body_gray {
-    background-color: #fff;
-    padding: 16px;
-    box-shadow: 0px 2px 5px #e6e6e6;
-}
-
-.nsa_count {
-    position: absolute;
-    background: rgba(3, 119, 255, 1);
-    right: -5px;
-    top: -5px;
-    color: #fff;
-    width: 18px;
-    height: 18px;
-    border-radius: 50%;
-    display: flex;
-    justify-content: center;
-    align-items: center;
-}
-
-.nsa_parent_count {
-    position: relative;
-    width: max-content;
+.nsa_message_icon {
+    cursor: pointer;
+}
+
+.nsa_message_title {
+    color: hsla(212, 100%, 51%, 1)
+}
+
+.nsa_message_item_title {
+    color: hsla(234, 64%, 22%, 1);
+    display: flex;
+    align-items: center;
+    gap: 8px;
+}
+
+.nsa_message_item_content {
+    color: hsla(234, 64%, 22%, 1);
+    margin: 0;
+}
+
+.nsa_message_item_dot_green {
+    width: 8px;
+    height: 8px;
+    background: hsla(157, 94%, 42%, 1);
+    border-radius: 50%;
+}
+
+.nsa_message_item_dot_gray {
+    width: 8px;
+    height: 8px;
+    background: hsla(228, 9%, 66%, 1);
+    border-radius: 50%;
+}
+
+.nsa_body_green {
+    background-color: hsla(157, 94%, 42%, 0.1);
+    padding: 16px;
+}
+
+.nsa_body_gray {
+    background-color: #fff;
+    padding: 16px;
+    box-shadow: 0px 2px 5px #e6e6e6;
+}
+
+.nsa_count {
+    position: absolute;
+    background: rgba(3, 119, 255, 1);
+    right: -5px;
+    top: -5px;
+    color: #fff;
+    width: 18px;
+    height: 18px;
+    border-radius: 50%;
+    display: flex;
+    justify-content: center;
+    align-items: center;
+}
+
+.nsa_parent_count {
+    position: relative;
+    width: max-content;
+}
+
+.nsa_toast_body {
+    padding: 0 !important;
+}
+
+.nsa_toast_header {
+    padding: 16px !important;
+    display: flex;
+    justify-content: space-between !important;
+}
+
+.nsa_toast {
+
+    width: max-content;
+    max-width: 100vw;
+    border: 8px;
+    position: absolute;
+    top: 0;
+    right: 0;
+}
+.nsa_toast div{
+    width: 100% !important; 
+}
+
+.nsa_close_icon {
+    cursor: pointer;
 }

package/src/components/NSAMessageDialog.tsx

@@ -1,66 +1,84 @@
-import { Component } from 'react';
-import messageHeader from '../assets/images/icon-notification-header.png';
-import Styles from './NSAMessageDialog.module.css';
-import Toast from 'react-bootstrap/Toast';
-import { NSButtonBlue } from "namirasoft-site-react";
-
-export interface NSAMessageDialogProps
-{ }
-
-export interface NSAMessageDialogState
-{
-    show: boolean;
-}
-
-export class NSAMessageDialog extends Component<NSAMessageDialogProps, NSAMessageDialogState>
-{
-    constructor(props: NSAMessageDialogProps)
-    {
-        super(props);
-        this.state = { show: false };
-        this.show = this.show.bind(this);
-        this.hide = this.hide.bind(this);
-    }
-    show()
-    {
-        this.setState({ show: true });
-    }
-    hide()
-    {
-        this.setState({ show: false });
-    }
-    override render()
-    {
-        return (
-            <Toast show={this.state.show} onClose={this.hide}>
-                <Toast.Header>
-                    <div>
-                        <img
-                            src={messageHeader}
-                            alt="messageHeader"
-                            width={22}
-                        />
-                        <span className={`${Styles.nsa_message_title} ms-2`}>Mark All As Read</span>
-                    </div>
-                </Toast.Header>
-                <Toast.Body>
-                    <div className={Styles.nsa_body_green}>
-                        <h3 className={`${Styles.nsa_message_item_title} nsa_font_16_bold`}>
-                            <div className={`${Styles.nsa_message_item_dot_green}`}></div>
-                            You’ve Unlocked Our Gold Membership!</h3>
-                        <p className={`${Styles.nsa_message_item_content} nsa_font_13_normal`}>Learn More!</p>
-                    </div>
-                    <div className={Styles.nsa_body_gray}>
-                        <h3 className={`${Styles.nsa_message_item_title} nsa_font_16_bold`}>
-                            <div className={`${Styles.nsa_message_item_dot_gray}`}></div>
-                            You’ve Unlocked Our Gold Membership!</h3>
-                        <p className={`${Styles.nsa_message_item_content} nsa_font_13_normal`}>Learn More!</p>
-                    </div>
-                    <div className='p-3 mx-0 d-flex justify-content-center'>
-                        <NSButtonBlue onClick={() => { }} title='View All' />
-                    </div>
-                </Toast.Body>
-            </Toast>
-        );
-    }
+import { Component } from 'react';
+import MessageHeader from '../assets/images/icon-notification-header.png';
+import CloseToast from '../assets/images/icon-close.png';
+import Styles from './NSAMessageDialog.module.css';
+import Toast from 'react-bootstrap/Toast';
+import { NSButtonBlue } from "namirasoft-site-react";
+
+export interface NSAMessageDialogProps
+{ }
+
+export interface NSAMessageDialogState
+{
+    show: boolean;
+}
+
+export class NSAMessageDialog extends Component<NSAMessageDialogProps, NSAMessageDialogState>
+{
+    constructor(props: NSAMessageDialogProps)
+    {
+        super(props);
+        this.state = { show: false };
+        this.show = this.show.bind(this);
+        this.hide = this.hide.bind(this);
+    }
+    show()
+    {
+        this.setState({ show: true });
+    }
+    hide()
+    {
+        debugger
+        this.setState({ show: false });
+    }
+    override render()
+    {
+        return (
+            <>
+                {this.state.show &&
+                    <div className={Styles.nsa_toast}>
+                        <Toast show={this.state.show} onClose={this.hide}>
+                            <div className={Styles.nsa_toast_header}>
+                                <div>
+                                    <img
+                                        src={MessageHeader}
+                                        alt="MessageHeader"
+                                        width={22}
+                                    />
+                                    <span className={`${Styles.nsa_message_title} ms-2`}>Mark All As Read</span>
+                                </div>
+                                <div>
+                                    <img
+                                        src={CloseToast}
+                                        alt="Close"
+                                        width={18}
+                                        onClick={this.hide}
+                                        className={Styles.nsa_close_icon}
+                                    />
+                                </div>
+                            </div>
+                            <div className={Styles.nsa_toast_body}>
+                                <div className={Styles.nsa_body_green}>
+                                    <h3 className={`${Styles.nsa_message_item_title} nsa_font_16_bold`}>
+                                        <div className={`${Styles.nsa_message_item_dot_green}`}></div>
+                                        You’ve Unlocked Our Gold Membership!</h3>
+                                    <p className={`${Styles.nsa_message_item_content} nsa_font_13_normal`}>Learn More!</p>
+                                </div>
+                                <div className={Styles.nsa_body_gray}>
+                                    <h3 className={`${Styles.nsa_message_item_title} nsa_font_16_bold`}>
+                                        <div className={`${Styles.nsa_message_item_dot_gray}`}></div>
+                                        You’ve Unlocked Our Gold Membership!</h3>
+                                    <p className={`${Styles.nsa_message_item_content} nsa_font_13_normal`}>Learn More!</p>
+                                </div>
+                                <div className='p-3 mx-0 d-flex justify-content-center'>
+                                    <NSButtonBlue onClick={() => { }} title='View All' />
+                                </div>
+                            </div>
+                        </Toast>
+                    </div>
+                }
+
+            </>
+        );
+    }
 }

package/src/index.tsx

@@ -1,8 +1,8 @@
-import ReactDOM from 'react-dom/client';
-import './index.css';
-import { App } from './App';
-
-const root = ReactDOM.createRoot(
-    document.getElementById('root') as HTMLElement
-);
+import ReactDOM from 'react-dom/client';
+import './index.css';
+import { App } from './App';
+
+const root = ReactDOM.createRoot(
+    document.getElementById('root') as HTMLElement
+);
 root.render(<App />);

package/src/layouts/Actions.ts

@@ -1,93 +1,93 @@
-import { INSActionMenuProps } from "namirasoft-site-react";
-import { INSARouterProps } from "../INSARouterProps";
-import { IEntityInfo } from "../IEntityInfo";
-
-export class Actions
-{
-    static apply(handler: () => void): INSActionMenuProps
-    {
-        return {
-            id: "0",
-            menu_item: "Apply",
-            handler,
-            isActive() { return true; }
-        }
-    }
-    static new(props: INSARouterProps, entity: IEntityInfo<any>): INSActionMenuProps
-    {
-        return {
-            id: "1",
-            menu_item: "New",
-            handler: () =>
-            {
-                let link = props.url.getLink(entity.client.getNewURL(), {});
-                window.open(link, "_blank");
-            },
-            isActive() { return true; }
-        };
-    }
-    static view(props: INSARouterProps, entity: IEntityInfo<any>, getIDs: () => string[]): INSActionMenuProps
-    {
-        return {
-            id: "2",
-            menu_item: "View",
-            handler: () =>
-            {
-                let ids = getIDs();
-                let link = props.url.getLink(entity.client.getViewURL(ids[0]), {});
-                window.open(link, "_blank");
-            },
-            isActive() { return getIDs().length == 1; }
-        };
-    }
-    static viewHistory(getIDs: () => string[]): INSActionMenuProps
-    {
-        return {
-            id: "3",
-            menu_item: "View History",
-            handler: () =>
-            {
-                let link = "https://history.namirasoft.com/history/view?id=" + getIDs()[0];
-                window.open(link, "_blank");
-            },
-            isActive() { return getIDs().length == 1; }
-        };
-    }
-    static copy(props: INSARouterProps, entity: IEntityInfo<any>, getIDs: () => string[]): INSActionMenuProps
-    {
-        return {
-            id: "4",
-            menu_item: "Copy",
-            handler: () =>
-            {
-                let ids = getIDs();
-                let link = props.url.getLink(entity.client.getCopyURL(ids[0]), {});
-                window.open(link, "_blank");
-            },
-            isActive() { return getIDs().length == 1; }
-        };
-    }
-    static edit(props: INSARouterProps, entity: IEntityInfo<any>, getIDs: () => string[]): INSActionMenuProps
-    {
-        return {
-            id: "5",
-            menu_item: "Edit",
-            handler: () =>
-            {
-                let ids = getIDs();
-                let link = props.url.getLink(entity.client.getEditURL(ids[0]), {});
-                window.open(link, "_blank");
-            },
-            isActive() { return getIDs().length == 1; }
-        };
-    }
-    static delete(getIDs: () => string[], showDeleteModal: () => void): INSActionMenuProps
-    {
-        return {
-            id: "6",
-            menu_item: "Delete",
-            handler: showDeleteModal,
-            isActive() { return getIDs().length != 0; }
-        }
-    }
+import { INSActionMenuProps } from "namirasoft-site-react";
+import { INSARouterProps } from "../INSARouterProps";
+import { IEntityInfo } from "../IEntityInfo";
+
+export class Actions
+{
+    static apply(handler: () => void): INSActionMenuProps
+    {
+        return {
+            id: "0",
+            menu_item: "Apply",
+            handler,
+            isActive() { return true; }
+        }
+    }
+    static new(props: INSARouterProps, entity: IEntityInfo<any>): INSActionMenuProps
+    {
+        return {
+            id: "1",
+            menu_item: "New",
+            handler: () =>
+            {
+                let link = props.url.getLink(entity.client.getNewURL(), {});
+                window.open(link, "_blank");
+            },
+            isActive() { return true; }
+        };
+    }
+    static view(props: INSARouterProps, entity: IEntityInfo<any>, getIDs: () => string[]): INSActionMenuProps
+    {
+        return {
+            id: "2",
+            menu_item: "View",
+            handler: () =>
+            {
+                let ids = getIDs();
+                let link = props.url.getLink(entity.client.getViewURL(ids[0]), {});
+                window.open(link, "_blank");
+            },
+            isActive() { return getIDs().length == 1; }
+        };
+    }
+    static viewHistory(getIDs: () => string[]): INSActionMenuProps
+    {
+        return {
+            id: "3",
+            menu_item: "View History",
+            handler: () =>
+            {
+                let link = "https://history.namirasoft.com/history/view?id=" + getIDs()[0];
+                window.open(link, "_blank");
+            },
+            isActive() { return getIDs().length == 1; }
+        };
+    }
+    static copy(props: INSARouterProps, entity: IEntityInfo<any>, getIDs: () => string[]): INSActionMenuProps
+    {
+        return {
+            id: "4",
+            menu_item: "Copy",
+            handler: () =>
+            {
+                let ids = getIDs();
+                let link = props.url.getLink(entity.client.getCopyURL(ids[0]), {});
+                window.open(link, "_blank");
+            },
+            isActive() { return getIDs().length == 1; }
+        };
+    }
+    static edit(props: INSARouterProps, entity: IEntityInfo<any>, getIDs: () => string[]): INSActionMenuProps
+    {
+        return {
+            id: "5",
+            menu_item: "Edit",
+            handler: () =>
+            {
+                let ids = getIDs();
+                let link = props.url.getLink(entity.client.getEditURL(ids[0]), {});
+                window.open(link, "_blank");
+            },
+            isActive() { return getIDs().length == 1; }
+        };
+    }
+    static delete(getIDs: () => string[], showDeleteModal: () => void): INSActionMenuProps
+    {
+        return {
+            id: "6",
+            menu_item: "Delete",
+            handler: showDeleteModal,
+            isActive() { return getIDs().length != 0; }
+        }
+    }
 }