namirasoft-account-react 1.5.4 → 1.5.6

package/src/pages/NSAVerificationPage.module.css

@@ -1,32 +1,32 @@
-.nsa_verification_container {
-	background-color: #FFF;
-	border: 1px solid #A1A4B0;
-	backdrop-filter: blur(5px);
-	border-radius: 8px;
-	width: 100%;
-	max-width: 594px;
-	padding: 16px;
-	color: #141B5C !important;
-	display: flex;
-	flex-direction: column;
-	gap: 16px;
-	align-items: center;
-}
-
-.nsa_verification_container p {
-	text-align: center;
-}
-
-.nsa_verification_vector {
-	width: 224px;
-	height: 224px;
-}
-
-.nsa_resend_button {
-	border: 0;	
-	outline: 0;
-	background: none;
-	color: #141B5C;
-	font-size: 16px;
-	font-weight: 500;
+.nsa_verification_container {
+	background-color: #FFF;
+	border: 1px solid #A1A4B0;
+	backdrop-filter: blur(5px);
+	border-radius: 8px;
+	width: 100%;
+	max-width: 594px;
+	padding: 16px;
+	color: #141B5C !important;
+	display: flex;
+	flex-direction: column;
+	gap: 16px;
+	align-items: center;
+}
+
+.nsa_verification_container p {
+	text-align: center;
+}
+
+.nsa_verification_vector {
+	width: 224px;
+	height: 224px;
+}
+
+.nsa_resend_button {
+	border: 0;	
+	outline: 0;
+	background: none;
+	color: #141B5C;
+	font-size: 16px;
+	font-weight: 500;
 }

package/src/pages/NSAVerificationPage.tsx

@@ -1,187 +1,187 @@
-import React, { createRef, ReactNode } from "react";
-import { IBaseComponentProps, NSRouterMakerProps, NSBoxString } from 'namirasoft-site-react';
-import { NSSection, NSSpace, NSSpaceSizeType, NSButtonBlue } from 'namirasoft-site-react';
-import { NSARouterMakerProps } from '../NSARouterMakerProps';
-import Styles from './NSAVerificationPage.module.css';
-import { BaseServer } from "namirasoft-core";
-
-export interface NSAVerificationPageProps extends IBaseComponentProps, NSRouterMakerProps, NSARouterMakerProps
-{
-    contact_type: string;
-    contact_value_name: string;
-    getContactValue: (checkErrors: boolean) => string;
-    onRequest: (address: string) => Promise<void>;
-    onVerify: (code: string) => Promise<void>;
-    onFinished: () => void;
-    onChange?: () => void;
-    children?: ReactNode;
-}
-
-export interface NSAVerificationPageState
-{
-    isSendCode: boolean;
-}
-
-export class NSAVerificationPage extends React.Component<NSAVerificationPageProps, NSAVerificationPageState>
-{
-    private NSButtonBlue_Verify = createRef<NSButtonBlue>();
-    private NSBoxString_Code = createRef<NSBoxString>();
-    constructor(props: NSAVerificationPageProps)
-    {
-        super(props);
-        this.state = { isSendCode: false };
-        this.onRequest = this.onRequest.bind(this);
-        this.onVerify = this.onVerify.bind(this);
-    }
-    private async onRequest(onFinshied: () => void)
-    {
-        try
-        {
-            this.props.onRequest(this.props.getContactValue(true)).then(() =>
-            {
-                this.setState({ isSendCode: true });
-                this.props.notifier.onSuccess(`Verification code has been sent successfully.`);
-                onFinshied();
-            }).catch(onFinshied);
-        } catch (error)
-        {
-            this.props.notifier.onError(error as Error);
-            onFinshied();
-        }
-    }
-    private async onVerify(onFinshied: () => void)
-    {
-        try
-        {
-            let code = this.NSBoxString_Code.current?.getValue() ?? "";
-            this.props.onVerify(code).then(() =>
-            {
-                this.props.notifier.onSuccess("Verification has been done successfully.");
-                this.props.notifier.onSuccess("Redirecting ...", 2000);
-                setTimeout(() =>
-                {
-                    this.props.onFinished();
-                    onFinshied();
-                }, 2000);
-            }).catch(e =>
-            {
-                onFinshied();
-                if (BaseServer.isErrorCode(e, 410) || BaseServer.isErrorCode(e, 404))
-                    this.setState({ isSendCode: false });
-            });
-        } catch (error)
-        {
-            this.props.notifier.onError(error as Error);
-            onFinshied();
-        }
-    }
-    override componentDidMount(): void
-    {
-        let code = this.props.url.getQuery("code", false, true) ?? "";
-        if (code)
-        {
-            this.setState({ isSendCode: true }, () =>
-            {
-                this.NSBoxString_Code.current?.setValue(code, () =>
-                {
-                    this.NSButtonBlue_Verify.current?.performClick();
-                });
-            });
-        }
-    }
-    override render()
-    {
-        return (
-            <NSSection>
-                <div
-                    className={`${Styles.nsa_verification_container} ${this.props.classList?.join(" ") ?? ""}`}
-                    style={this.props.style}
-                >
-                    <img
-                        src={"https://static.namirasoft.com/image/concept/verification/purple.png"}
-                        alt={'verification vector'}
-                        className={Styles.nsa_verification_vector}
-                    />
-                    <div className='m-0'>
-                        <p className='m-2'>Type: {this.props.contact_type}</p>
-                        {
-                            ((this.state.isSendCode || !this.props.children) && this.props.getContactValue(false)) &&
-                            <p className='m-2'>{this.props.contact_value_name}: {this.props.getContactValue(false)}</p>
-                        }
-                        {
-                            this.props.children &&
-                            <div style={{ display: this.state.isSendCode ? "none" : undefined }}>
-                                {this.props.children}
-                            </div>
-                        }
-                    </div>
-                    {
-                        this.state.isSendCode ?
-                            <>
-                                <p style={{ margin: 0 }}>
-                                    Please enter the code you received
-                                </p>
-                                <NSBoxString
-                                    ref={this.NSBoxString_Code}
-                                    title='Verification Code'
-                                    placeholder='Enter the code'
-                                    hideHeader={true}
-                                    required={true}
-                                    min_length={6}
-                                    max_length={6}
-                                    input={{ style: { fontSize: '24px', fontWeight: "bold", textAlign: "center" } }}
-                                />
-                            </>
-                            :
-                            <>
-                                {
-                                    this.props.onChange &&
-                                    <>
-                                        <button
-                                            onClick={this.props.onChange}
-                                            className={Styles.nsa_resend_button}
-                                            style={{ marginTop: "8px" }}
-                                        >Change {this.props.contact_value_name}</button>
-                                        <NSSpace size={NSSpaceSizeType.NANO} />
-                                    </>
-                                }
-                                <NSButtonBlue
-                                    title='Send Code'
-                                    onClick={{
-                                        action: (onFinished) =>
-                                        {
-                                            this.onRequest(onFinished);
-                                        },
-                                    }}
-                                />
-                            </>
-                    }
-                </div>
-                <NSSpace size={NSSpaceSizeType.NORMAL}></NSSpace>
-                {
-                    this.state.isSendCode &&
-                    <>
-                        <NSButtonBlue
-                            ref={this.NSButtonBlue_Verify}
-                            title="Verify"
-                            onClick={{
-                                action: (onFinished) =>
-                                {
-                                    this.onVerify(onFinished);
-                                },
-                            }}
-                        />
-                        <NSSpace size={NSSpaceSizeType.SMALL}></NSSpace>
-                        <button
-                            onClick={() =>
-                            {
-                                this.setState(prev => ({ ...prev, isSendCode: false }));
-                            }}
-                            className={Styles.nsa_resend_button}
-                        >Resend Code</button>
-                    </>
-                }
-            </NSSection>
-        );
-    }
+import React, { createRef, ReactNode } from "react";
+import { IBaseComponentProps, NSRouterMakerProps, NSBoxString } from 'namirasoft-site-react';
+import { NSSection, NSSpace, NSSpaceSizeType, NSButtonBlue } from 'namirasoft-site-react';
+import { NSARouterMakerProps } from '../NSARouterMakerProps';
+import Styles from './NSAVerificationPage.module.css';
+import { BaseServer } from "namirasoft-core";
+
+export interface NSAVerificationPageProps extends IBaseComponentProps, NSRouterMakerProps, NSARouterMakerProps
+{
+    contact_type: string;
+    contact_value_name: string;
+    getContactValue: (checkErrors: boolean) => string;
+    onRequest: (address: string) => Promise<void>;
+    onVerify: (code: string) => Promise<void>;
+    onFinished: () => void;
+    onChange?: () => void;
+    children?: ReactNode;
+}
+
+export interface NSAVerificationPageState
+{
+    isSendCode: boolean;
+}
+
+export class NSAVerificationPage extends React.Component<NSAVerificationPageProps, NSAVerificationPageState>
+{
+    private NSButtonBlue_Verify = createRef<NSButtonBlue>();
+    private NSBoxString_Code = createRef<NSBoxString>();
+    constructor(props: NSAVerificationPageProps)
+    {
+        super(props);
+        this.state = { isSendCode: false };
+        this.onRequest = this.onRequest.bind(this);
+        this.onVerify = this.onVerify.bind(this);
+    }
+    private async onRequest(onFinshied: () => void)
+    {
+        try
+        {
+            this.props.onRequest(this.props.getContactValue(true)).then(() =>
+            {
+                this.setState({ isSendCode: true });
+                this.props.notifier.onSuccess(`Verification code has been sent successfully.`);
+                onFinshied();
+            }).catch(onFinshied);
+        } catch (error)
+        {
+            this.props.notifier.onError(error as Error);
+            onFinshied();
+        }
+    }
+    private async onVerify(onFinshied: () => void)
+    {
+        try
+        {
+            let code = this.NSBoxString_Code.current?.getValue() ?? "";
+            this.props.onVerify(code).then(() =>
+            {
+                this.props.notifier.onSuccess("Verification has been done successfully.");
+                this.props.notifier.onSuccess("Redirecting ...", 2000);
+                setTimeout(() =>
+                {
+                    this.props.onFinished();
+                    onFinshied();
+                }, 2000);
+            }).catch(e =>
+            {
+                onFinshied();
+                if (BaseServer.isErrorCode(e, 410) || BaseServer.isErrorCode(e, 404))
+                    this.setState({ isSendCode: false });
+            });
+        } catch (error)
+        {
+            this.props.notifier.onError(error as Error);
+            onFinshied();
+        }
+    }
+    override componentDidMount(): void
+    {
+        let code = this.props.url.getQuery("code", false, true) ?? "";
+        if (code)
+        {
+            this.setState({ isSendCode: true }, () =>
+            {
+                this.NSBoxString_Code.current?.setValue(code, () =>
+                {
+                    this.NSButtonBlue_Verify.current?.performClick();
+                });
+            });
+        }
+    }
+    override render()
+    {
+        return (
+            <NSSection>
+                <div
+                    className={`${Styles.nsa_verification_container} ${this.props.classList?.join(" ") ?? ""}`}
+                    style={this.props.style}
+                >
+                    <img
+                        src={"https://static.namirasoft.com/image/concept/verification/purple.png"}
+                        alt={'verification vector'}
+                        className={Styles.nsa_verification_vector}
+                    />
+                    <div className='m-0'>
+                        <p className='m-2'>Type: {this.props.contact_type}</p>
+                        {
+                            ((this.state.isSendCode || !this.props.children) && this.props.getContactValue(false)) &&
+                            <p className='m-2'>{this.props.contact_value_name}: {this.props.getContactValue(false)}</p>
+                        }
+                        {
+                            this.props.children &&
+                            <div style={{ display: this.state.isSendCode ? "none" : undefined }}>
+                                {this.props.children}
+                            </div>
+                        }
+                    </div>
+                    {
+                        this.state.isSendCode ?
+                            <>
+                                <p style={{ margin: 0 }}>
+                                    Please enter the code you received
+                                </p>
+                                <NSBoxString
+                                    ref={this.NSBoxString_Code}
+                                    title='Verification Code'
+                                    placeholder='Enter the code'
+                                    hideHeader={true}
+                                    required={true}
+                                    min_length={6}
+                                    max_length={6}
+                                    input={{ style: { fontSize: '24px', fontWeight: "bold", textAlign: "center" } }}
+                                />
+                            </>
+                            :
+                            <>
+                                {
+                                    this.props.onChange &&
+                                    <>
+                                        <button
+                                            onClick={this.props.onChange}
+                                            className={Styles.nsa_resend_button}
+                                            style={{ marginTop: "8px" }}
+                                        >Change {this.props.contact_value_name}</button>
+                                        <NSSpace size={NSSpaceSizeType.NANO} />
+                                    </>
+                                }
+                                <NSButtonBlue
+                                    title='Send Code'
+                                    onClick={{
+                                        action: (onFinished) =>
+                                        {
+                                            this.onRequest(onFinished);
+                                        },
+                                    }}
+                                />
+                            </>
+                    }
+                </div>
+                <NSSpace size={NSSpaceSizeType.NORMAL}></NSSpace>
+                {
+                    this.state.isSendCode &&
+                    <>
+                        <NSButtonBlue
+                            ref={this.NSButtonBlue_Verify}
+                            title="Verify"
+                            onClick={{
+                                action: (onFinished) =>
+                                {
+                                    this.onVerify(onFinished);
+                                },
+                            }}
+                        />
+                        <NSSpace size={NSSpaceSizeType.SMALL}></NSSpace>
+                        <button
+                            onClick={() =>
+                            {
+                                this.setState(prev => ({ ...prev, isSendCode: false }));
+                            }}
+                            className={Styles.nsa_resend_button}
+                        >Resend Code</button>
+                    </>
+                }
+            </NSSection>
+        );
+    }
 }

package/src/pages/PaymentRequired.tsx

@@ -1,77 +1,77 @@
-import { Component, cloneElement } from "react";
-import { IBaseComponentProps, LinkOperation, NSBox, NSButtonGreen, NSLabel, NSLoading, NSPanel, NSRow, NSSection } from "namirasoft-site-react";
-import { EncodingOperation } from "namirasoft-core";
-import { SubscriptionValidation } from "namirasoft-payment";
-import { NSARouterMakerProps } from "../NSARouterMakerProps";
-
-export interface PaymentRequiredProps extends IBaseComponentProps, NSARouterMakerProps
-{
-	tilte: string;
-	description: string;
-	action: string;
-	payment_offer_url: string;
-	Validation: () => Promise<SubscriptionValidation>;
-	children: JSX.Element;
-}
-
-interface PaymentRequiredState
-{
-	subscribed: boolean | null;
-}
-
-export class PaymentRequired extends Component<PaymentRequiredProps, PaymentRequiredState>
-{
-	constructor(props: PaymentRequiredProps)
-	{
-		super(props);
-		this.state = { subscribed: null };
-	}
-	override componentDidMount(): void
-	{
-		this.props.Validation().then(res =>
-		{
-			this.setState({ subscribed: res.subscribed });
-		}).catch(() => { });
-	}
-	override render()
-	{
-		if (this.state.subscribed == null)
-		{
-			let layout = this.props.renderer.renderOnNSALayout(this.props, <NSLoading />)
-			return cloneElement(layout, { key: "loading" });
-		}
-		if (!this.state.subscribed)
-		{
-			let section = <NSSection>
-				<NSPanel>
-					<NSRow
-						style={{
-							width: NSBox.width.double
-						}}
-					>
-						<NSLabel
-							title={this.props.tilte}
-							description={this.props.description}
-						>
-						</NSLabel>
-						<NSButtonGreen
-							title={this.props.action}
-							onClick={{
-								action: () =>
-								{
-                                    let callback = EncodingOperation.Base64Encode(window.location.href);
-                                    let link = this.props.payment_offer_url + "?callback=" + callback;
-                                    LinkOperation.open(link);
-								},
-								showLoading: false
-							}}
-						></NSButtonGreen>
-					</NSRow>
-				</NSPanel>
-			</NSSection>;
-			let layout = this.props.renderer.renderOnNSALayout(this.props, section)
-			return cloneElement(layout, { key: "payment-required" });
-		}
-		return this.props.children;
-	}
+import { Component, cloneElement } from "react";
+import { IBaseComponentProps, LinkOperation, NSBox, NSButtonGreen, NSLabel, NSLoading, NSPanel, NSRow, NSSection } from "namirasoft-site-react";
+import { EncodingOperation } from "namirasoft-core";
+import { SubscriptionValidation } from "namirasoft-payment";
+import { NSARouterMakerProps } from "../NSARouterMakerProps";
+
+export interface PaymentRequiredProps extends IBaseComponentProps, NSARouterMakerProps
+{
+	tilte: string;
+	description: string;
+	action: string;
+	payment_offer_url: string;
+	Validation: () => Promise<SubscriptionValidation>;
+	children: JSX.Element;
+}
+
+interface PaymentRequiredState
+{
+	subscribed: boolean | null;
+}
+
+export class PaymentRequired extends Component<PaymentRequiredProps, PaymentRequiredState>
+{
+	constructor(props: PaymentRequiredProps)
+	{
+		super(props);
+		this.state = { subscribed: null };
+	}
+	override componentDidMount(): void
+	{
+		this.props.Validation().then(res =>
+		{
+			this.setState({ subscribed: res.subscribed });
+		}).catch(() => { });
+	}
+	override render()
+	{
+		if (this.state.subscribed == null)
+		{
+			let layout = this.props.renderer.renderOnNSALayout(this.props, <NSLoading />)
+			return cloneElement(layout, { key: "loading" });
+		}
+		if (!this.state.subscribed)
+		{
+			let section = <NSSection>
+				<NSPanel>
+					<NSRow
+						style={{
+							width: NSBox.width.double
+						}}
+					>
+						<NSLabel
+							title={this.props.tilte}
+							description={this.props.description}
+						>
+						</NSLabel>
+						<NSButtonGreen
+							title={this.props.action}
+							onClick={{
+								action: () =>
+								{
+                                    let callback = EncodingOperation.Base64Encode(window.location.href);
+                                    let link = this.props.payment_offer_url + "?callback=" + callback;
+                                    LinkOperation.open(link);
+								},
+								showLoading: false
+							}}
+						></NSButtonGreen>
+					</NSRow>
+				</NSPanel>
+			</NSSection>;
+			let layout = this.props.renderer.renderOnNSALayout(this.props, section)
+			return cloneElement(layout, { key: "payment-required" });
+		}
+		return this.props.children;
+	}
 }