namirasoft-account-react 1.4.115 → 1.4.117

package/dist/App.js

@@ -10,9 +10,9 @@ var __awaiter = (this && this.__awaiter) || function (thisArg, _arguments, P, ge
 import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-runtime";
 import { NSALayout, NSASectionTabs, NSAVerificationPage } from "./main";
 export function App(props) {
-    return (_jsx(_Fragment, { children: _jsxs(NSALayout, Object.assign({}, props, { scope: "Namirasoft Job Arranger Console", logo: "", background: "", header: "", notifications: [], children: [_jsx(NSASectionTabs, {}), _jsx(NSAVerificationPage, Object.assign({}, props, { contact_type: "Email", contact_value_name: "Email", getContactValue: () => "myname@example.com", onVerify: (code) => __awaiter(this, void 0, void 0, function* () {
+    return (_jsx(_Fragment, { children: _jsxs(NSALayout, Object.assign({}, props, { scope: "Namirasoft Job Arranger Console", logo: "", background: "", header: "", notifications: [], children: [_jsx(NSASectionTabs, {}), _jsx(NSAVerificationPage, Object.assign({}, props, { contact_type: "Email", contact_value_name: "Email", getContactValue: () => "myname@example.com", onRequest: () => __awaiter(this, void 0, void 0, function* () { }), onVerify: (code) => __awaiter(this, void 0, void 0, function* () {
                         console.log(code);
-                    }), onSend: () => __awaiter(this, void 0, void 0, function* () { }) }))] })) }));
+                    }), onFinished: () => { } }))] })) }));
 }
 ;
 //# sourceMappingURL=App.js.map

package/dist/App.js.map

@@ -1 +1 @@
-{"version":3,"file":"App.js","sourceRoot":"","sources":["../src/App.tsx"],"names":[],"mappings":";;;;;;;;;;AACA,OAAO,EAAE,SAAS,EAAE,cAAc,EAAE,mBAAmB,EAAE,MAAM,QAAQ,CAAC;AAMxE,MAAM,UAAU,GAAG,CAAC,KAAe;IAElC,OAAO,CACN,4BACC,MAAC,SAAS,oBAAK,KAAK,IACnB,KAAK,EAAE,iCAAiC,EACxC,IAAI,EAAE,EAAE,EACR,UAAU,EAAE,EAAE,EACd,MAAM,EAAE,EAAE,EACV,aAAa,EAAE,EAAE,aAEjB,KAAC,cAAc,KAAG,EAClB,KAAC,mBAAmB,oBACf,KAAK,IACT,YAAY,EAAC,OAAO,EACpB,kBAAkB,EAAC,OAAO,EAC1B,eAAe,EAAE,GAAG,EAAE,CAAC,oBAAoB,EAC3C,QAAQ,EAAE,CAAO,IAAI,EAAE,EAAE;wBAExB,OAAO,CAAC,GAAG,CAAC,IAAI,CAAC,CAAA;oBAClB,CAAC,CAAA,EACD,MAAM,EAAE,GAAS,EAAE,gDAAG,CAAC,CAAA,IACtB,KACU,GACX,CACH,CAAC;AACH,CAAC;AAAA,CAAC"}
+{"version":3,"file":"App.js","sourceRoot":"","sources":["../src/App.tsx"],"names":[],"mappings":";;;;;;;;;;AACA,OAAO,EAAE,SAAS,EAAE,cAAc,EAAE,mBAAmB,EAAE,MAAM,QAAQ,CAAC;AAMxE,MAAM,UAAU,GAAG,CAAC,KAAe;IAElC,OAAO,CACN,4BACC,MAAC,SAAS,oBAAK,KAAK,IACnB,KAAK,EAAE,iCAAiC,EACxC,IAAI,EAAE,EAAE,EACR,UAAU,EAAE,EAAE,EACd,MAAM,EAAE,EAAE,EACV,aAAa,EAAE,EAAE,aAEjB,KAAC,cAAc,KAAG,EAClB,KAAC,mBAAmB,oBACf,KAAK,IACT,YAAY,EAAC,OAAO,EACpB,kBAAkB,EAAC,OAAO,EAC1B,eAAe,EAAE,GAAG,EAAE,CAAC,oBAAoB,EAC3C,SAAS,EAAE,GAAS,EAAE,gDAAG,CAAC,CAAA,EAC1B,QAAQ,EAAE,CAAO,IAAI,EAAE,EAAE;wBAExB,OAAO,CAAC,GAAG,CAAC,IAAI,CAAC,CAAA;oBAClB,CAAC,CAAA,EACD,UAAU,EAAE,GAAG,EAAE,GAAG,CAAC,IACpB,KACU,GACX,CACH,CAAC;AACH,CAAC;AAAA,CAAC"}

package/dist/pages/NSAVerificationPage.d.ts

@@ -1,15 +1,17 @@
 import { IBaseComponentProps, INSRouterProps } from 'namirasoft-site-react';
 import { ReactNode } from "react";
-export interface INSAVerificationPageProps extends IBaseComponentProps, INSRouterProps {
+import { INSARouterProps } from '../INSARouterProps';
+export interface INSAVerificationPageProps extends IBaseComponentProps, INSRouterProps, INSARouterProps {
     contact_type: string;
     contact_value_name: string;
     getContactValue: () => string;
-    onSend: () => Promise<void>;
+    onRequest: (address: string) => Promise<void>;
     onVerify: (code: string) => Promise<void>;
+    onFinished: () => void;
     children?: ReactNode;
 }
 export interface NSAVerificationPageState {
-    values: string;
+    code: string;
     isSendCode: boolean;
 }
 export declare function NSAVerificationPage(props: INSAVerificationPageProps): import("react/jsx-runtime").JSX.Element;

package/dist/pages/NSAVerificationPage.js

@@ -10,28 +10,34 @@ var __awaiter = (this && this.__awaiter) || function (thisArg, _arguments, P, ge
 import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-runtime";
 import Styles from './NSAVerificationPage.module.css';
 import { NSABoxOTP } from '../components/NSABoxOTP';
-import { useState } from "react";
+import { useEffect, useState } from "react";
 import { NSSection, NSSpace, NSSpaceSizeType, NSButtonBlue } from 'namirasoft-site-react';
 export function NSAVerificationPage(props) {
-    var _a;
+    var _a, _b;
+    let code = (_a = props.url.getQuery("code")) !== null && _a !== void 0 ? _a : "";
+    useEffect(() => {
+        if (code)
+            onVerify();
+    }, []);
     const [state, setState] = useState({
-        values: "",
-        isSendCode: false
+        code,
+        isSendCode: code.length > 0
     });
     function onChanged(event, index) {
         const newValue = event.target.value;
-        setState(prevState => (Object.assign(Object.assign({}, prevState), { values: state.values + newValue })));
+        setState(prevState => (Object.assign(Object.assign({}, prevState), { code: state.code + newValue })));
         if (/^\d?$/.test(event.target.value)) {
-            const updatedValues = [...state.values];
+            const updatedValues = [...state.code];
             updatedValues[index] = newValue;
-            setState(prevState => (Object.assign(Object.assign({}, prevState), { values: updatedValues.join("") })));
+            setState(prevState => (Object.assign(Object.assign({}, prevState), { code: updatedValues.join("") })));
         }
     }
-    function onSend() {
+    function onRequest() {
         return __awaiter(this, void 0, void 0, function* () {
             try {
-                yield props.onSend();
+                yield props.onRequest(props.getContactValue());
                 setState(prevState => (Object.assign(Object.assign({}, prevState), { isSendCode: true })));
+                props.notifier.onSuccess(`Verification code has been sent successfully.`);
             }
             catch (error) {
                 props.notifier.onError(error);
@@ -41,16 +47,19 @@ export function NSAVerificationPage(props) {
     function onVerify() {
         return __awaiter(this, void 0, void 0, function* () {
             try {
-                yield props.onVerify(state.values);
+                yield props.onVerify(state.code);
+                props.notifier.onSuccess("Verification has been successfully done.");
+                props.onFinished();
             }
             catch (error) {
                 props.notifier.onError(error);
             }
         });
     }
-    return (_jsx(_Fragment, { children: _jsxs(NSSection, { center_items: true, children: [_jsxs("div", { className: `${Styles.nsa_verification_container} ${(_a = props.classList) === null || _a === void 0 ? void 0 : _a.join(" ")}`, style: props.style, children: [_jsx("img", { src: "https://static.namirasoft.com/image/concept/verification/purple.png", alt: 'verification vector', className: Styles.nsa_verification_vector }), _jsxs("div", { className: 'm-0', children: [_jsxs("p", { className: 'm-2', children: ["Type: ", props.contact_type] }), props.children && !state.isSendCode ? props.children : _jsxs("p", { className: 'm-2', children: [props.contact_value_name, ": ", props.getContactValue()] })] }), state.isSendCode ?
+    return (_jsx(_Fragment, { children: _jsxs(NSSection, { center_items: true, children: [_jsxs("div", { className: `${Styles.nsa_verification_container} ${(_b = props.classList) === null || _b === void 0 ? void 0 : _b.join(" ")}`, style: props.style, children: [_jsx("img", { src: "https://static.namirasoft.com/image/concept/verification/purple.png", alt: 'verification vector', className: Styles.nsa_verification_vector }), _jsxs("div", { className: 'm-0', children: [_jsxs("p", { className: 'm-2', children: ["Type: ", props.contact_type] }), (props.children && !state.isSendCode) &&
+                                    _jsxs("p", { className: 'm-2', children: [props.contact_value_name, ": ", props.getContactValue()] }), _jsx("div", { style: { display: props.children && !state.isSendCode ? "none" : undefined }, children: props.children })] }), state.isSendCode ?
                             _jsxs(_Fragment, { children: [_jsxs("p", { children: ["Please enter code sent to ", props.getContactValue()] }), _jsx(NSABoxOTP, { onChanged: onChanged })] }) :
-                            _jsx(_Fragment, { children: _jsx(NSButtonBlue, { onClick: onSend, title: 'Send Code' }) })] }), _jsx(NSSpace, { size: NSSpaceSizeType.NORMAL }), state.isSendCode &&
+                            _jsx(_Fragment, { children: _jsx(NSButtonBlue, { onClick: onRequest, title: 'Send Code' }) })] }), _jsx(NSSpace, { size: NSSpaceSizeType.NORMAL }), state.isSendCode &&
                     _jsxs(_Fragment, { children: [_jsx(NSButtonBlue, { title: "Verify", onClick: () => onVerify() }), _jsx(NSSpace, { size: NSSpaceSizeType.SMALL }), _jsx("button", { onClick: () => {
                                     setState(prevState => (Object.assign(Object.assign({}, prevState), { isSendCode: false })));
                                 }, className: Styles.nsa_resend_button, children: "Resend Code" })] })] }) }));

package/dist/pages/NSAVerificationPage.js.map

@@ -1 +1 @@
-{"version":3,"file":"NSAVerificationPage.js","sourceRoot":"","sources":["../../src/pages/NSAVerificationPage.tsx"],"names":[],"mappings":";;;;;;;;;;AAAA,OAAO,MAAM,MAAM,kCAAkC,CAAC;AAEtD,OAAO,EAAE,SAAS,EAAE,MAAM,yBAAyB,CAAC;AACpD,OAAc,EAAa,QAAQ,EAAE,MAAM,OAAO,CAAC;AACnD,OAAO,EAAE,SAAS,EAAE,OAAO,EAAE,eAAe,EAAE,YAAY,EAAE,MAAM,uBAAuB,CAAC;AAkB1F,MAAM,UAAU,mBAAmB,CAAC,KAAgC;;IAEnE,MAAM,CAAC,KAAK,EAAE,QAAQ,CAAC,GAAG,QAAQ,CAA2B;QAC5D,MAAM,EAAE,EAAE;QACV,UAAU,EAAE,KAAK;KACjB,CAAC,CAAC;IAEH,SAAS,SAAS,CAAC,KAA0C,EAAE,KAAa;QAE3E,MAAM,QAAQ,GAAG,KAAK,CAAC,MAAM,CAAC,KAAK,CAAC;QACpC,QAAQ,CAAC,SAAS,CAAC,EAAE,CAAC,iCAAM,SAAS,KAAE,MAAM,EAAE,KAAK,CAAC,MAAM,GAAG,QAAQ,IAAG,CAAC,CAAC;QAC3E,IAAI,OAAO,CAAC,IAAI,CAAC,KAAK,CAAC,MAAM,CAAC,KAAK,CAAC,EACpC,CAAC;YACA,MAAM,aAAa,GAAG,CAAC,GAAG,KAAK,CAAC,MAAM,CAAC,CAAC;YACxC,aAAa,CAAC,KAAK,CAAC,GAAG,QAAQ,CAAC;YAChC,QAAQ,CAAC,SAAS,CAAC,EAAE,CAAC,iCAAM,SAAS,KAAE,MAAM,EAAE,aAAa,CAAC,IAAI,CAAC,EAAE,CAAC,IAAG,CAAC,CAAA;QAC1E,CAAC;IACF,CAAC;IAED,SAAe,MAAM;;YAEpB,IACA,CAAC;gBACA,MAAM,KAAK,CAAC,MAAM,EAAE,CAAC;gBACrB,QAAQ,CAAC,SAAS,CAAC,EAAE,CAAC,iCAAM,SAAS,KAAE,UAAU,EAAE,IAAI,IAAG,CAAC,CAAA;YAC5D,CAAC;YAAC,OAAO,KAAK,EACd,CAAC;gBACA,KAAK,CAAC,QAAQ,CAAC,OAAO,CAAC,KAAc,CAAC,CAAC;YACxC,CAAC;QACF,CAAC;KAAA;IAED,SAAe,QAAQ;;YAEtB,IACA,CAAC;gBACA,MAAM,KAAK,CAAC,QAAQ,CAAC,KAAK,CAAC,MAAM,CAAC,CAAC;YACpC,CAAC;YAAC,OAAO,KAAK,EACd,CAAC;gBACA,KAAK,CAAC,QAAQ,CAAC,OAAO,CAAC,KAAc,CAAC,CAAC;YACxC,CAAC;QACF,CAAC;KAAA;IAED,OAAO,CACN,4BACC,MAAC,SAAS,IAAC,YAAY,EAAE,IAAI,aAC5B,eACC,SAAS,EAAE,GAAG,MAAM,CAAC,0BAA0B,IAAI,MAAA,KAAK,CAAC,SAAS,0CAAE,IAAI,CAAC,GAAG,CAAC,EAAE,EAC/E,KAAK,EAAE,KAAK,CAAC,KAAK,aAElB,cACC,GAAG,EAAE,qEAAqE,EAC1E,GAAG,EAAE,qBAAqB,EAC1B,SAAS,EAAE,MAAM,CAAC,uBAAuB,GACxC,EACF,eAAK,SAAS,EAAC,KAAK,aACnB,aAAG,SAAS,EAAC,KAAK,uBAAQ,KAAK,CAAC,YAAY,IAAK,EAEhD,KAAK,CAAC,QAAQ,IAAI,CAAC,KAAK,CAAC,UAAU,CAAC,CAAC,CAAC,KAAK,CAAC,QAAQ,CAAC,CAAC,CAAC,aAAG,SAAS,EAAC,KAAK,aAAE,KAAK,CAAC,kBAAkB,QAAI,KAAK,CAAC,eAAe,EAAE,IAAK,IAE/H,EAEL,KAAK,CAAC,UAAU,CAAC,CAAC;4BACjB,8BACC,sDAA8B,KAAK,CAAC,eAAe,EAAE,IAAK,EAC1D,KAAC,SAAS,IAAC,SAAS,EAAE,SAAS,GAAI,IACjC,CAAC,CAAC;4BACL,4BACC,KAAC,YAAY,IAAC,OAAO,EAAE,MAAM,EAAE,KAAK,EAAC,WAAW,GAAG,GACjD,IAEA,EACN,KAAC,OAAO,IAAC,IAAI,EAAE,eAAe,CAAC,MAAM,GAAY,EAEhD,KAAK,CAAC,UAAU;oBAChB,8BACC,KAAC,YAAY,IAAC,KAAK,EAAC,QAAQ,EAAC,OAAO,EAAE,GAAG,EAAE,CAAC,QAAQ,EAAE,GAAI,EAC1D,KAAC,OAAO,IAAC,IAAI,EAAE,eAAe,CAAC,KAAK,GAAY,EAChD,iBAAQ,OAAO,EAAE,GAAG,EAAE;oCAErB,QAAQ,CAAC,SAAS,CAAC,EAAE,CAAC,iCAAM,SAAS,KAAE,UAAU,EAAE,KAAK,IAAG,CAAC,CAAA;gCAC7D,CAAC,EAAE,SAAS,EAAE,MAAM,CAAC,iBAAiB,4BAAsB,IAC1D,IAEO,GACV,CACH,CAAC;AACH,CAAC"}
+{"version":3,"file":"NSAVerificationPage.js","sourceRoot":"","sources":["../../src/pages/NSAVerificationPage.tsx"],"names":[],"mappings":"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"}

package/package.json

@@ -8,7 +8,7 @@
     "framework": "npm",
     "application": "package",
     "private": false,
-    "version": "1.4.115",
+    "version": "1.4.117",
     "author": "Amir Abolhasani",
     "license": "MIT",
     "main": "./dist/main.js",

package/src/App.tsx

@@ -22,11 +22,12 @@ export function App(props: AppProps)
 					contact_type="Email"
 					contact_value_name="Email"
 					getContactValue={() => "myname@example.com"}
+					onRequest={async () => { }}
 					onVerify={async (code) =>
 					{
 						console.log(code)
 					}}
-					onSend={async () => { }}
+					onFinished={() => { }}
 				/>
 			</NSALayout >
 		</>

package/src/pages/NSAVerificationPage.tsx

@@ -1,50 +1,60 @@
 import Styles from './NSAVerificationPage.module.css';
 import { IBaseComponentProps, INSRouterProps } from 'namirasoft-site-react';
 import { NSABoxOTP } from '../components/NSABoxOTP';
-import React, { ReactNode, useState } from "react";
+import React, { ReactNode, useEffect, useState } from "react";
 import { NSSection, NSSpace, NSSpaceSizeType, NSButtonBlue } from 'namirasoft-site-react';
+import { INSARouterProps } from '../INSARouterProps';
 
-export interface INSAVerificationPageProps extends IBaseComponentProps, INSRouterProps
+export interface INSAVerificationPageProps extends IBaseComponentProps, INSRouterProps, INSARouterProps
 {
 	contact_type: string;
 	contact_value_name: string;
 	getContactValue: () => string;
-	onSend: () => Promise<void>;
+	onRequest: (address: string) => Promise<void>;
 	onVerify: (code: string) => Promise<void>;
+	onFinished: () => void;
 	children?: ReactNode;
 }
 
 export interface NSAVerificationPageState
 {
-	values: string;
+	code: string;
 	isSendCode: boolean;
 }
 
 export function NSAVerificationPage(props: INSAVerificationPageProps) 
 {
+	let code = props.url.getQuery("code") ?? "";
+	useEffect(() =>
+	{
+		if (code)
+			onVerify();
+	}, []);
+
 	const [state, setState] = useState<NSAVerificationPageState>({
-		values: "",
-		isSendCode: false
+		code,
+		isSendCode: code.length > 0
 	});
 
 	function onChanged(event: React.ChangeEvent<HTMLInputElement>, index: number): void
 	{
 		const newValue = event.target.value;
-		setState(prevState => ({ ...prevState, values: state.values + newValue }));
+		setState(prevState => ({ ...prevState, code: state.code + newValue }));
 		if (/^\d?$/.test(event.target.value))
 		{
-			const updatedValues = [...state.values];
+			const updatedValues = [...state.code];
 			updatedValues[index] = newValue;
-			setState(prevState => ({ ...prevState, values: updatedValues.join("") }))
+			setState(prevState => ({ ...prevState, code: updatedValues.join("") }))
 		}
 	}
 
-	async function onSend()
+	async function onRequest()
 	{
 		try
 		{
-			await props.onSend();
+			await props.onRequest(props.getContactValue());
 			setState(prevState => ({ ...prevState, isSendCode: true }))
+			props.notifier.onSuccess(`Verification code has been sent successfully.`);
 		} catch (error)
 		{
 			props.notifier.onError(error as Error);
@@ -55,7 +65,9 @@ export function NSAVerificationPage(props: INSAVerificationPageProps)
 	{
 		try
 		{
-			await props.onVerify(state.values);
+			await props.onVerify(state.code);
+			props.notifier.onSuccess("Verification has been successfully done.");
+			props.onFinished();
 		} catch (error)
 		{
 			props.notifier.onError(error as Error);
@@ -77,8 +89,12 @@ export function NSAVerificationPage(props: INSAVerificationPageProps)
 					<div className='m-0'>
 						<p className='m-2'>Type: {props.contact_type}</p>
 						{
-							props.children && !state.isSendCode ? props.children : <p className='m-2'>{props.contact_value_name}: {props.getContactValue()}</p>
+							(props.children && !state.isSendCode) &&
+							<p className='m-2'>{props.contact_value_name}: {props.getContactValue()}</p>
 						}
+						<div style={{ display: props.children && !state.isSendCode ? "none" : undefined }}>
+							{props.children}
+						</div >
 					</div>
 					{
 						state.isSendCode ?
@@ -87,7 +103,7 @@ export function NSAVerificationPage(props: INSAVerificationPageProps)
 								<NSABoxOTP onChanged={onChanged} />
 							</> :
 							<>
-								<NSButtonBlue onClick={onSend} title='Send Code' />
+								<NSButtonBlue onClick={onRequest} title='Send Code' />
 							</>
 					}
 				</div>