"use strict";
var __importDefault = (this && this.__importDefault) || function (mod) {
    return (mod && mod.__esModule) ? mod : { "default": mod };
};
Object.defineProperty(exports, "__esModule", { value: true });
exports.NewUserSessionEmail = void 0;
const jsx_runtime_1 = require("react/jsx-runtime");
const components_1 = require("@react-email/components");
// @ts-ignore
const constant_1 = require("@abtnode/constant");
// @ts-ignore
const dayjs_1 = __importDefault(require("@abtnode/util/lib/dayjs"));
const ua_parser_js_1 = __importDefault(require("ua-parser-js"));
const footer_1 = __importDefault(require("../_components/footer"));
const layout_1 = __importDefault(require("../_components/layout"));
const header_1 = __importDefault(require("../_components/header"));
const style_1 = require("../_libs/style");
const ufo_1 = require("ufo");
const contentWrapperStyle = {
    margin: '0 auto 20px auto',
    backgroundColor: '#ffffff',
    padding: '20px 16px',
};
const deviceCardStyle = {
    borderRadius: '12px',
    padding: '16px',
    margin: '16px 0',
    border: '1px solid #e5e7eb',
};
const deviceInfoRowStyle = {
    paddingBottom: '12px',
};
const deviceInfoLabelStyle = {
    color: '#6b7280',
    fontSize: '14px',
    marginBottom: '6px',
    display: 'block',
    margin: '0',
};
const deviceInfoValueStyle = {
    color: '#111827',
    fontSize: '16px',
    fontWeight: '500',
    display: 'block',
    margin: '0',
    marginTop: '4px',
};
const NewUserSessionEmail = ({ userSession, appInfo, locale = 'en', userInfo, poweredBy, signatureConfig, theme, }) => {
    var _a, _b, _c, _d, _e;
    const fontFamily = ((_a = theme === null || theme === void 0 ? void 0 : theme.typography) === null || _a === void 0 ? void 0 : _a.fontFamily) || 'HelveticaNeue,Helvetica,Arial,sans-serif';
    const h1FontFamily = ((_c = (_b = theme === null || theme === void 0 ? void 0 : theme.typography) === null || _b === void 0 ? void 0 : _b.h1) === null || _c === void 0 ? void 0 : _c.fontFamily) || fontFamily;
    const main = {
        fontFamily,
    };
    const parser = new ua_parser_js_1.default(userSession.ua);
    const device = parser.getDevice();
    const browser = parser.getBrowser();
    const os = parser.getOS();
    const deviceName = device.model || device.type || os.name || 'Unknown Device';
    const browserName = browser.name ? `${browser.name} ${browser.version || ''}`.trim() : 'Unknown Browser';
    const locationInfo = userSession.lastLoginIp;
    const translations = {
        en: {
            title: 'You are logged in on a new device',
            greeting: `Hello, ${(userInfo === null || userInfo === void 0 ? void 0 : userInfo.fullName) || 'User'}`,
            description: 'We detected that your account was logged in on a new device:',
            device: 'Device',
            browser: 'Browser',
            location: 'Location',
            loginTime: 'Time',
            securityNote: 'Security Check:',
            securityTip1: 'If this was you, you can safely ignore this email.',
            securityTip2: 'If you did not recognize this login activity, please immediately protect your account or contact us.',
            manageButton: 'Manage Sessions',
        },
        zh: {
            title: '你在一个新的设备上登录了',
            greeting: `您好，${(userInfo === null || userInfo === void 0 ? void 0 : userInfo.fullName) || '用户'}`,
            description: '我们检测到您的账户在一个新设备上登录：',
            device: '设备',
            browser: '浏览器',
            location: '位置',
            loginTime: '时间',
            securityNote: '安全提示：',
            securityTip1: '如果这是您本人的操作，您可以忽略此邮件。',
            securityTip2: '如果您不认识此登录活动，请立即保护您的账户或联系我们。',
            manageButton: '管理会话',
        },
    };
    const translation = translations[locale] || translations.en;
    const subject = `[${appInfo.title}] ${translation.title}`;
    const manageSessionUrl = (0, ufo_1.joinURL)(appInfo.url, constant_1.WELLKNOWN_SERVICE_PATH_PREFIX, '/user/settings#session');
    const buttonColor = ((_e = (_d = theme === null || theme === void 0 ? void 0 : theme.palette) === null || _d === void 0 ? void 0 : _d.primary) === null || _e === void 0 ? void 0 : _e.main) || '#1976d2';
    const buttonStyle = {
        backgroundColor: buttonColor,
        color: '#ffffff',
        padding: '12px 24px',
        borderRadius: '8px',
        textDecoration: 'none',
        fontWeight: '500',
        fontSize: '15px',
        display: 'inline-block',
        border: 'none',
        cursor: 'pointer',
        textAlign: 'center',
    };
    return ((0, jsx_runtime_1.jsxs)(layout_1.default, { mainStyle: main, subject: subject, theme: theme, children: [(0, jsx_runtime_1.jsx)(components_1.Preview, { children: subject }), (0, jsx_runtime_1.jsx)(header_1.default, { appInfo: appInfo }), (0, jsx_runtime_1.jsxs)(components_1.Section, { style: contentWrapperStyle, children: [(0, jsx_runtime_1.jsx)(components_1.Heading, { style: (0, style_1.getH1Style)(h1FontFamily), children: translation.title }), (0, jsx_runtime_1.jsx)(components_1.Text, { style: { fontSize: '16px', lineHeight: '24px', margin: '0 0 8px 0' }, children: translation.greeting }), (0, jsx_runtime_1.jsx)(components_1.Text, { style: { fontSize: '14px', lineHeight: '22px', color: '#666', margin: '0 0 16px 0' }, children: translation.description }), (0, jsx_runtime_1.jsx)(components_1.Section, { style: deviceCardStyle, children: (0, jsx_runtime_1.jsx)("table", { style: { width: '100%' }, children: (0, jsx_runtime_1.jsxs)("tbody", { children: [(0, jsx_runtime_1.jsx)("tr", { children: (0, jsx_runtime_1.jsxs)("td", { style: deviceInfoRowStyle, children: [(0, jsx_runtime_1.jsxs)(components_1.Text, { style: deviceInfoLabelStyle, children: ["\uD83D\uDCBB ", translation.device] }), (0, jsx_runtime_1.jsx)(components_1.Text, { style: deviceInfoValueStyle, children: deviceName })] }) }), (0, jsx_runtime_1.jsx)("tr", { children: (0, jsx_runtime_1.jsxs)("td", { style: deviceInfoRowStyle, children: [(0, jsx_runtime_1.jsxs)(components_1.Text, { style: deviceInfoLabelStyle, children: ["\uD83C\uDF10 ", translation.browser] }), (0, jsx_runtime_1.jsx)(components_1.Text, { style: deviceInfoValueStyle, children: browserName })] }) }), (0, jsx_runtime_1.jsx)("tr", { children: (0, jsx_runtime_1.jsxs)("td", { style: deviceInfoRowStyle, children: [(0, jsx_runtime_1.jsxs)(components_1.Text, { style: deviceInfoLabelStyle, children: ["\uD83D\uDCCD ", translation.location] }), (0, jsx_runtime_1.jsx)(components_1.Text, { style: deviceInfoValueStyle, children: locationInfo })] }) }), (0, jsx_runtime_1.jsx)("tr", { children: (0, jsx_runtime_1.jsxs)("td", { children: [(0, jsx_runtime_1.jsxs)(components_1.Text, { style: deviceInfoLabelStyle, children: ["\uD83D\uDD50 ", translation.loginTime] }), (0, jsx_runtime_1.jsx)(components_1.Text, { style: deviceInfoValueStyle, children: (0, dayjs_1.default)(userSession.updatedAt).utc().format('YYYY-MM-DD HH:mm:ss [UTC]') })] }) })] }) }) }), (0, jsx_runtime_1.jsx)(components_1.Section, { style: { margin: '16px 0 0 0', textAlign: 'center' }, children: (0, jsx_runtime_1.jsx)(components_1.Button, { href: manageSessionUrl, style: buttonStyle, children: translation.manageButton }) }), (0, jsx_runtime_1.jsxs)(components_1.Text, { style: { fontSize: '14px', lineHeight: '22px', color: '#333', margin: '16px 0 0 0' }, children: [(0, jsx_runtime_1.jsx)("strong", { children: translation.securityNote }), (0, jsx_runtime_1.jsx)("br", {}), translation.securityTip1, (0, jsx_runtime_1.jsx)("br", {}), translation.securityTip2] })] }), (0, jsx_runtime_1.jsx)(footer_1.default, { showCopyright: false, poweredBy: poweredBy, showBlocklet: true, appInfo: appInfo, locale: locale, userInfo: userInfo, signatureConfig: signatureConfig, fontFamily: fontFamily })] }));
};
exports.NewUserSessionEmail = NewUserSessionEmail;
exports.default = exports.NewUserSessionEmail;
