stackpress/cjs/session/views/signup.js

Incept is a content management framework.

"use strict";
var __importDefault = (this && this.__importDefault) || function (mod) {
    return (mod && mod.__esModule) ? mod : { "default": mod };
};
Object.defineProperty(exports, "__esModule", { value: true });
exports.Head = void 0;
exports.AuthSignupForm = AuthSignupForm;
exports.AuthSignupBody = AuthSignupBody;
exports.AuthSignupHead = AuthSignupHead;
exports.AuthSignupPage = AuthSignupPage;
const jsx_runtime_1 = require("react/jsx-runtime");
const r22n_1 = require("r22n");
const Control_1 = __importDefault(require("frui/form/Control"));
const Button_1 = __importDefault(require("frui/form/Button"));
const Input_1 = __importDefault(require("frui/field/Input"));
const Password_1 = __importDefault(require("frui/field/Password"));
const LayoutBlank_js_1 = __importDefault(require("../../view/layout/LayoutBlank.js"));
const hooks_js_1 = require("../../view/server/hooks.js");
function AuthSignupForm(props) {
    const { input, errors } = props;
    const { _ } = (0, r22n_1.useLanguage)();
    return ((0, jsx_runtime_1.jsxs)("form", { className: "auth-form", method: "post", children: [(0, jsx_runtime_1.jsx)(Control_1.default, { label: `${_('Name')}*`, error: errors.email, className: "control", children: (0, jsx_runtime_1.jsx)(Input_1.default, { name: "name", className: "field", error: !!errors.email, defaultValue: input.email, required: true }) }), (0, jsx_runtime_1.jsx)(Control_1.default, { label: _('Email Address'), error: errors.email, className: "control", children: (0, jsx_runtime_1.jsx)(Input_1.default, { name: "email", className: "field", error: !!errors.email, defaultValue: input.email }) }), (0, jsx_runtime_1.jsx)(Control_1.default, { label: _('Phone Number'), error: errors.phone, className: "control", children: (0, jsx_runtime_1.jsx)(Input_1.default, { name: "phone", className: "field", error: !!errors.phone, defaultValue: input.phone }) }), (0, jsx_runtime_1.jsx)(Control_1.default, { label: _('Username'), error: errors.username, className: "control", children: (0, jsx_runtime_1.jsx)(Input_1.default, { name: "username", className: "field", error: !!errors.username, defaultValue: input.username }) }), (0, jsx_runtime_1.jsx)(Control_1.default, { label: `${_('Password')}*`, error: errors.secret, className: "control", children: (0, jsx_runtime_1.jsx)(Password_1.default, { name: "secret", error: !!errors.secret, defaultValue: input.secret, required: true }) }), (0, jsx_runtime_1.jsx)("div", { className: "action", children: (0, jsx_runtime_1.jsx)(Button_1.default, { className: "submit", type: "submit", children: _('Sign Up') }) })] }));
}
function AuthSignupBody() {
    const { config, request, response } = (0, hooks_js_1.useServer)();
    const input = Object.assign(Object.assign({}, response.results), request.data());
    const base = config.path('auth.base', '/auth');
    const errors = response.errors();
    const { _ } = (0, r22n_1.useLanguage)();
    return ((0, jsx_runtime_1.jsx)("main", { className: "auth-signup-page auth-page", children: (0, jsx_runtime_1.jsxs)("div", { className: "container", children: [config.has('brand', 'logo') ? ((0, jsx_runtime_1.jsx)("img", { height: "50", alt: config.path('brand.name'), src: config.path('brand.logo'), className: "logo" })) : ((0, jsx_runtime_1.jsx)("h2", { className: "brand", children: config.path('brand.name') })), (0, jsx_runtime_1.jsxs)("section", { className: "auth-modal", children: [(0, jsx_runtime_1.jsxs)("header", { children: [(0, jsx_runtime_1.jsx)("i", { className: "fas fa-fw fa-user" }), (0, jsx_runtime_1.jsx)("h3", { className: "label", children: _('Sign Up') })] }), (0, jsx_runtime_1.jsx)(AuthSignupForm, { errors: errors, input: input }), (0, jsx_runtime_1.jsx)("footer", { children: (0, jsx_runtime_1.jsx)("a", { href: `${base}/signin`, children: _('Have an Account?') }) })] })] }) }));
}
function AuthSignupHead(props) {
    const { data, styles = [] } = props;
    const { favicon = '/favicon.ico' } = (data === null || data === void 0 ? void 0 : data.brand) || {};
    const { _ } = (0, r22n_1.useLanguage)();
    const mimetype = favicon.endsWith('.png')
        ? 'image/png'
        : favicon.endsWith('.svg')
            ? 'image/svg+xml'
            : 'image/x-icon';
    return ((0, jsx_runtime_1.jsxs)(jsx_runtime_1.Fragment, { children: [(0, jsx_runtime_1.jsx)("title", { children: _('Signup') }), favicon && (0, jsx_runtime_1.jsx)("link", { rel: "icon", type: mimetype, href: favicon }), (0, jsx_runtime_1.jsx)("link", { rel: "stylesheet", type: "text/css", href: "/styles/global.css" }), styles.map((href, index) => ((0, jsx_runtime_1.jsx)("link", { rel: "stylesheet", type: "text/css", href: href }, index)))] }));
}
function AuthSignupPage(props) {
    return ((0, jsx_runtime_1.jsx)(LayoutBlank_js_1.default, Object.assign({ head: false }, props, { children: (0, jsx_runtime_1.jsx)(AuthSignupBody, {}) })));
}
exports.Head = AuthSignupHead;
exports.default = AuthSignupPage;