quran/.next/server/chunks/86262.js

exports.id = 86262;
exports.ids = [86262];
exports.modules = {

/***/ 86161:
/***/ ((module) => {

// Exports
module.exports = {
	"container": "CompleteSignupForm_container__WWUVf",
	"title": "CompleteSignupForm_title__nNTvk",
	"strong": "CompleteSignupForm_strong__XIUxt",
	"emailSent": "CompleteSignupForm_emailSent__Nlle8"
};


/***/ }),

/***/ 57361:
/***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => {

"use strict";
/* harmony export */ __webpack_require__.d(__webpack_exports__, {
/* harmony export */   "Z": () => (__WEBPACK_DEFAULT_EXPORT__)
/* harmony export */ });
/* harmony import */ var lodash_capitalize__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(59969);
/* harmony import */ var lodash_capitalize__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(lodash_capitalize__WEBPACK_IMPORTED_MODULE_0__);
/* harmony import */ var types_FormField__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(3840);


/**
 * Transform FormField to be FormBuilderFormField
 *
 * FormField and FormBuilderFormField are the same except, FormBuilderFormField is not tied to errorId and translationId
 *   - Previously FormBuilder was tied to common.json, next-translate.
 *   - and it's also tied to ErrorMessageId
 *   - and the `label` is also less flexible because it's tied to `field` value
 *
 * This function help to transform FormField to FormBuilderFormField for common use case.
 * But when we need a more flexible use case, we can use FormBuilderFormField directly. Without using this helper function
 *
 * check ./FormBuilderTypes.ts for more info
 *
 * Note that this function expect the `t` translate function to be used with `common.json`. And expect `form.$field`  and `validation.$errorId` to exist.
 *
 * @param {FormField} formField
 * @returns {FormBuilderFormField} formBuilderFormField
 */ const buildFormBuilderFormField = (formField, t)=>{
    return {
        ...formField,
        ...formField.rules && {
            rules: formField.rules.map((rule)=>({
                    type: rule.type,
                    value: rule.value,
                    errorMessage: t(`common:validation.${rule.errorId}`, {
                        field: lodash_capitalize__WEBPACK_IMPORTED_MODULE_0___default()(formField.field),
                        ...rule.errorExtraParams
                    })
                }))
        },
        ...formField.label && {
            label: formField.type === types_FormField__WEBPACK_IMPORTED_MODULE_1__/* .FormFieldType.Checkbox */ .E.Checkbox ? formField.label : t(`form.${formField.label}`)
        },
        ...formField.defaultValue && {
            defaultValue: formField.defaultValue
        },
        ...formField.placeholder && {
            placeholder: formField.placeholder
        }
    };
};
/* harmony default export */ const __WEBPACK_DEFAULT_EXPORT__ = (buildFormBuilderFormField);


/***/ }),

/***/ 86262:
/***/ ((module, __webpack_exports__, __webpack_require__) => {

"use strict";
__webpack_require__.a(module, async (__webpack_handle_async_dependencies__, __webpack_async_result__) => { try {
__webpack_require__.r(__webpack_exports__);
/* harmony export */ __webpack_require__.d(__webpack_exports__, {
/* harmony export */   "default": () => (__WEBPACK_DEFAULT_EXPORT__)
/* harmony export */ });
/* harmony import */ var react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(20997);
/* harmony import */ var react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__);
/* harmony import */ var next_translate_useTranslation__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(60866);
/* harmony import */ var next_translate_useTranslation__WEBPACK_IMPORTED_MODULE_1___default = /*#__PURE__*/__webpack_require__.n(next_translate_useTranslation__WEBPACK_IMPORTED_MODULE_1__);
/* harmony import */ var swr__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(15941);
/* harmony import */ var _FormBuilder_buildFormBuilderFormField__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(57361);
/* harmony import */ var _FormBuilder_FormBuilder__WEBPACK_IMPORTED_MODULE_4__ = __webpack_require__(37013);
/* harmony import */ var _CompleteSignupForm_module_scss__WEBPACK_IMPORTED_MODULE_9__ = __webpack_require__(86161);
/* harmony import */ var _CompleteSignupForm_module_scss__WEBPACK_IMPORTED_MODULE_9___default = /*#__PURE__*/__webpack_require__.n(_CompleteSignupForm_module_scss__WEBPACK_IMPORTED_MODULE_9__);
/* harmony import */ var _EmailVerificationForm__WEBPACK_IMPORTED_MODULE_5__ = __webpack_require__(52501);
/* harmony import */ var _utils_auth_api__WEBPACK_IMPORTED_MODULE_6__ = __webpack_require__(37883);
/* harmony import */ var _utils_auth_apiPaths__WEBPACK_IMPORTED_MODULE_7__ = __webpack_require__(13830);
/* harmony import */ var _utils_eventLogger__WEBPACK_IMPORTED_MODULE_8__ = __webpack_require__(55943);
var __webpack_async_dependencies__ = __webpack_handle_async_dependencies__([swr__WEBPACK_IMPORTED_MODULE_2__, _FormBuilder_FormBuilder__WEBPACK_IMPORTED_MODULE_4__, _EmailVerificationForm__WEBPACK_IMPORTED_MODULE_5__, _utils_eventLogger__WEBPACK_IMPORTED_MODULE_8__]);
([swr__WEBPACK_IMPORTED_MODULE_2__, _FormBuilder_FormBuilder__WEBPACK_IMPORTED_MODULE_4__, _EmailVerificationForm__WEBPACK_IMPORTED_MODULE_5__, _utils_eventLogger__WEBPACK_IMPORTED_MODULE_8__] = __webpack_async_dependencies__.then ? (await __webpack_async_dependencies__)() : __webpack_async_dependencies__);










/**
 * If users' email is empty, return email verification form
 * otherwise, return normal user information form
 */ const CompleteSignupForm = ({ requiredFields  })=>{
    const { mutate  } = (0,swr__WEBPACK_IMPORTED_MODULE_2__.useSWRConfig)();
    const { t  } = next_translate_useTranslation__WEBPACK_IMPORTED_MODULE_1___default()("common");
    const onSubmit = (data)=>{
        (0,_utils_eventLogger__WEBPACK_IMPORTED_MODULE_8__/* .logFormSubmission */ .dz)("complete_signUp");
        (0,_utils_auth_api__WEBPACK_IMPORTED_MODULE_6__/* .completeSignup */ .kK)(data).then(()=>{
            // mutate the cache version of users/profile
            mutate((0,_utils_auth_apiPaths__WEBPACK_IMPORTED_MODULE_7__/* .makeUserProfileUrl */ .bo)());
        });
    };
    const emailFormField = requiredFields.find((field)=>field.field === "email");
    const isEmailRequired = !!emailFormField;
    if (isEmailRequired) {
        return /*#__PURE__*/ react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx(_EmailVerificationForm__WEBPACK_IMPORTED_MODULE_5__/* ["default"] */ .Z, {
            emailFormField: (0,_FormBuilder_buildFormBuilderFormField__WEBPACK_IMPORTED_MODULE_3__/* ["default"] */ .Z)({
                ...emailFormField,
                placeholder: t(`form.email`)
            }, t)
        });
    }
    return /*#__PURE__*/ (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsxs)("div", {
        className: (_CompleteSignupForm_module_scss__WEBPACK_IMPORTED_MODULE_9___default().container),
        children: [
            /*#__PURE__*/ react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx("h2", {
                className: (_CompleteSignupForm_module_scss__WEBPACK_IMPORTED_MODULE_9___default().title),
                children: t("complete-sign-up")
            }),
            /*#__PURE__*/ react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx(_FormBuilder_FormBuilder__WEBPACK_IMPORTED_MODULE_4__/* ["default"] */ .Z, {
                formFields: requiredFields.map((field)=>(0,_FormBuilder_buildFormBuilderFormField__WEBPACK_IMPORTED_MODULE_3__/* ["default"] */ .Z)({
                        ...field,
                        placeholder: t(`form.${field.field}`)
                    }, t)),
                onSubmit: onSubmit,
                actionText: t("submit")
            })
        ]
    });
};
/* harmony default export */ const __WEBPACK_DEFAULT_EXPORT__ = (CompleteSignupForm);

__webpack_async_result__();
} catch(e) { __webpack_async_result__(e); } });

/***/ }),

/***/ 52501:
/***/ ((module, __webpack_exports__, __webpack_require__) => {

"use strict";
__webpack_require__.a(module, async (__webpack_handle_async_dependencies__, __webpack_async_result__) => { try {
/* harmony export */ __webpack_require__.d(__webpack_exports__, {
/* harmony export */   "Z": () => (__WEBPACK_DEFAULT_EXPORT__)
/* harmony export */ });
/* harmony import */ var react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(20997);
/* harmony import */ var react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__);
/* harmony import */ var react__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(16689);
/* harmony import */ var react__WEBPACK_IMPORTED_MODULE_1___default = /*#__PURE__*/__webpack_require__.n(react__WEBPACK_IMPORTED_MODULE_1__);
/* harmony import */ var next_translate_Trans__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(74137);
/* harmony import */ var next_translate_Trans__WEBPACK_IMPORTED_MODULE_2___default = /*#__PURE__*/__webpack_require__.n(next_translate_Trans__WEBPACK_IMPORTED_MODULE_2__);
/* harmony import */ var next_translate_useTranslation__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(60866);
/* harmony import */ var next_translate_useTranslation__WEBPACK_IMPORTED_MODULE_3___default = /*#__PURE__*/__webpack_require__.n(next_translate_useTranslation__WEBPACK_IMPORTED_MODULE_3__);
/* harmony import */ var swr__WEBPACK_IMPORTED_MODULE_4__ = __webpack_require__(15941);
/* harmony import */ var _FormBuilder_buildTranslatedErrorMessageByErrorId__WEBPACK_IMPORTED_MODULE_5__ = __webpack_require__(21485);
/* harmony import */ var _FormBuilder_FormBuilder__WEBPACK_IMPORTED_MODULE_6__ = __webpack_require__(37013);
/* harmony import */ var _CompleteSignupForm_module_scss__WEBPACK_IMPORTED_MODULE_14__ = __webpack_require__(86161);
/* harmony import */ var _CompleteSignupForm_module_scss__WEBPACK_IMPORTED_MODULE_14___default = /*#__PURE__*/__webpack_require__.n(_CompleteSignupForm_module_scss__WEBPACK_IMPORTED_MODULE_14__);
/* harmony import */ var _ResendEmailSection__WEBPACK_IMPORTED_MODULE_7__ = __webpack_require__(68205);
/* harmony import */ var _utils_auth_api__WEBPACK_IMPORTED_MODULE_8__ = __webpack_require__(37883);
/* harmony import */ var _utils_auth_apiPaths__WEBPACK_IMPORTED_MODULE_9__ = __webpack_require__(13830);
/* harmony import */ var _utils_eventLogger__WEBPACK_IMPORTED_MODULE_10__ = __webpack_require__(55943);
/* harmony import */ var types_ErrorMessageId__WEBPACK_IMPORTED_MODULE_11__ = __webpack_require__(99133);
/* harmony import */ var types_FieldRule__WEBPACK_IMPORTED_MODULE_12__ = __webpack_require__(98213);
/* harmony import */ var types_FormField__WEBPACK_IMPORTED_MODULE_13__ = __webpack_require__(3840);
var __webpack_async_dependencies__ = __webpack_handle_async_dependencies__([swr__WEBPACK_IMPORTED_MODULE_4__, _FormBuilder_FormBuilder__WEBPACK_IMPORTED_MODULE_6__, _ResendEmailSection__WEBPACK_IMPORTED_MODULE_7__, _utils_eventLogger__WEBPACK_IMPORTED_MODULE_10__]);
([swr__WEBPACK_IMPORTED_MODULE_4__, _FormBuilder_FormBuilder__WEBPACK_IMPORTED_MODULE_6__, _ResendEmailSection__WEBPACK_IMPORTED_MODULE_7__, _utils_eventLogger__WEBPACK_IMPORTED_MODULE_10__] = __webpack_async_dependencies__.then ? (await __webpack_async_dependencies__)() : __webpack_async_dependencies__);















const EmailVerificationForm = ({ emailFormField  })=>{
    const { 0: isSubmitted , 1: setIsSubmitted  } = (0,react__WEBPACK_IMPORTED_MODULE_1__.useState)(false);
    const { mutate  } = (0,swr__WEBPACK_IMPORTED_MODULE_4__.useSWRConfig)();
    const { 0: email , 1: setEmail  } = (0,react__WEBPACK_IMPORTED_MODULE_1__.useState)();
    const { t  } = next_translate_useTranslation__WEBPACK_IMPORTED_MODULE_3___default()("common");
    const { 0: forceRerenderKey , 1: setForceRerenderKey  } = (0,react__WEBPACK_IMPORTED_MODULE_1__.useState)(0);
    const onEmailSubmitted = (data)=>{
        (0,_utils_eventLogger__WEBPACK_IMPORTED_MODULE_10__/* .logFormSubmission */ .dz)("email_verification");
        (0,_utils_auth_api__WEBPACK_IMPORTED_MODULE_8__/* .requestVerificationCode */ .x8)(data.email);
        setIsSubmitted(true);
        setEmail(data.email);
    };
    const verificationCodeFormField = {
        field: "code",
        type: types_FormField__WEBPACK_IMPORTED_MODULE_13__/* .FormFieldType.Number */ .E.Number,
        placeholder: t("form.code"),
        rules: [
            {
                type: types_FieldRule__WEBPACK_IMPORTED_MODULE_12__/* .RuleType.Required */ .S.Required,
                value: true,
                errorMessage: (0,_FormBuilder_buildTranslatedErrorMessageByErrorId__WEBPACK_IMPORTED_MODULE_5__/* ["default"] */ .Z)(types_ErrorMessageId__WEBPACK_IMPORTED_MODULE_11__/* ["default"].RequiredField */ .Z.RequiredField, "code", t)
            }, 
        ]
    };
    const onVerificationCodeSubmitted = (data)=>{
        (0,_utils_eventLogger__WEBPACK_IMPORTED_MODULE_10__/* .logFormSubmission */ .dz)("verification_code");
        return (0,_utils_auth_api__WEBPACK_IMPORTED_MODULE_8__/* .completeSignup */ .kK)({
            email,
            verificationCode: data.code.toString()
        }).then(()=>{
            // mutate the cache version of users/profile
            mutate((0,_utils_auth_apiPaths__WEBPACK_IMPORTED_MODULE_9__/* .makeUserProfileUrl */ .bo)());
        }).catch(async (err)=>{
            const result = {
                errors: {
                    code: err?.message
                }
            };
            return result;
        });
    };
    const onResendEmailRequested = ()=>{
        (0,_utils_auth_api__WEBPACK_IMPORTED_MODULE_8__/* .requestVerificationCode */ .x8)(email);
        setForceRerenderKey((preVal)=>preVal + 1);
    };
    return /*#__PURE__*/ (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsxs)("div", {
        className: (_CompleteSignupForm_module_scss__WEBPACK_IMPORTED_MODULE_14___default().container),
        children: [
            /*#__PURE__*/ react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx("h2", {
                className: (_CompleteSignupForm_module_scss__WEBPACK_IMPORTED_MODULE_14___default().title),
                children: t("email-verification.email-verification")
            }),
            isSubmitted ? /*#__PURE__*/ (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsxs)(react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.Fragment, {
                children: [
                    /*#__PURE__*/ react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx("p", {
                        className: (_CompleteSignupForm_module_scss__WEBPACK_IMPORTED_MODULE_14___default().emailSent),
                        children: /*#__PURE__*/ react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx((next_translate_Trans__WEBPACK_IMPORTED_MODULE_2___default()), {
                            i18nKey: "common:email-verification.email-sent",
                            values: {
                                email
                            },
                            components: {
                                strong: /*#__PURE__*/ react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx("strong", {
                                    className: (_CompleteSignupForm_module_scss__WEBPACK_IMPORTED_MODULE_14___default().strong)
                                })
                            }
                        })
                    }),
                    /*#__PURE__*/ react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx(_FormBuilder_FormBuilder__WEBPACK_IMPORTED_MODULE_6__/* ["default"] */ .Z, {
                        formFields: [
                            verificationCodeFormField
                        ],
                        onSubmit: onVerificationCodeSubmitted,
                        actionText: t("common:email-verification.verify-code")
                    }),
                    /*#__PURE__*/ react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx(_ResendEmailSection__WEBPACK_IMPORTED_MODULE_7__/* ["default"] */ .Z, {
                        onResendButtonClicked: onResendEmailRequested
                    }, forceRerenderKey)
                ]
            }) : /*#__PURE__*/ react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx(_FormBuilder_FormBuilder__WEBPACK_IMPORTED_MODULE_6__/* ["default"] */ .Z, {
                formFields: [
                    emailFormField
                ],
                onSubmit: onEmailSubmitted,
                actionText: t("submit")
            })
        ]
    });
};
/* harmony default export */ const __WEBPACK_DEFAULT_EXPORT__ = (EmailVerificationForm);

__webpack_async_result__();
} catch(e) { __webpack_async_result__(e); } });

/***/ })

};
;
//# sourceMappingURL=86262.js.map