@qlover/create-app 1.0.2 → 2.0.0

package/dist/templates/react-app/src/pages/auth/LoginPage.tsx

@@ -1,166 +0,0 @@
-import { UserOutlined, LockOutlined, GoogleOutlined } from '@ant-design/icons';
-import { login18n } from '@config/i18n/login18n';
-import { I } from '@config/IOCIdentifier';
-import { Form, Input, Button } from 'antd';
-import { useState } from 'react';
-import { LocaleLink } from '@/uikit/components/LocaleLink';
-import { useI18nInterface } from '@/uikit/hooks/useI18nInterface';
-import { useIOC } from '@/uikit/hooks/useIOC';
-
-interface LoginFormData {
-  email: string;
-  password: string;
-}
-
-export default function LoginPage() {
-  const tt = useI18nInterface(login18n);
-  const logger = useIOC(I.Logger);
-  const userService = useIOC(I.UserServiceInterface);
-  const AppConfig = useIOC(I.AppConfig);
-  const routeService = useIOC(I.RouteServiceInterface);
-
-  const [loading, setLoading] = useState(false);
-
-  const handleLogin = async (values: LoginFormData) => {
-    try {
-      setLoading(true);
-      await userService.login({
-        username: values.email,
-        password: values.password
-      });
-      routeService.replaceToHome();
-    } catch (error) {
-      logger.error(error);
-    } finally {
-      setLoading(false);
-    }
-  };
-
-  return (
-    <div
-      data-testid="LoginPage"
-      className="flex min-h-screen text-xs1 bg-primary"
-    >
-      {/* Left side - Brand section */}
-      <div className="hidden lg:flex lg:w-1/2 bg-secondary p-12 flex-col">
-        <div className="flex items-center gap-3 mb-12">
-          <div className="w-10 h-10 bg-brand rounded-lg"></div>
-          <span className="text-2xl font-semibold text-text">
-            {AppConfig.appName}
-          </span>
-        </div>
-        <h1 className="text-4xl font-bold text-text mb-4">{tt.welcome}</h1>
-        <p className="text-text-secondary text-lg mb-8">{tt.subtitle}</p>
-        <div className="space-y-4">
-          <FeatureItem icon="🎯" text={tt.featureAiPaths} />
-          <FeatureItem icon="🎯" text={tt.featureSmartRecommendations} />
-          <FeatureItem icon="📊" text={tt.featureProgressTracking} />
-        </div>
-      </div>
-
-      {/* Right side - Login form */}
-      <div className="w-full lg:w-1/2 p-8 sm:p-12 flex items-center justify-center">
-        <div className="w-full max-w-[420px]">
-          <h2 className="text-2xl font-semibold mb-2 text-text">{tt.title2}</h2>
-          <p className="text-text-secondary mb-8">{tt.subtitle}</p>
-
-          <Form
-            name="login"
-            initialValues={{
-              email: AppConfig.loginUser,
-              password: AppConfig.loginPassword
-            }}
-            onFinish={handleLogin}
-            layout="vertical"
-            className="space-y-4"
-          >
-            <Form.Item
-              name="email"
-              rules={[{ required: true, message: tt.emailRequired }]}
-            >
-              <Input
-                prefix={<UserOutlined className="text-text-tertiary" />}
-                placeholder={tt.email}
-                title={tt.emailTitle}
-                className="h-12 text-base bg-secondary border-border"
-              />
-            </Form.Item>
-
-            <Form.Item
-              name="password"
-              rules={[{ required: true, message: tt.passwordRequired }]}
-            >
-              <Input.Password
-                prefix={<LockOutlined />}
-                placeholder={tt.password}
-                title={tt.passwordTitle}
-                className="h-12 text-base"
-              />
-            </Form.Item>
-
-            <div className="flex justify-end">
-              <a
-                href="#"
-                className="text-brand hover:text-brand-hover"
-                title={tt.forgotPasswordTitle}
-              >
-                {tt.forgotPassword}
-              </a>
-            </div>
-
-            <Form.Item>
-              <Button
-                data-testid="LoginButton"
-                type="primary"
-                htmlType="submit"
-                loading={loading}
-                title={tt.buttonTitle}
-                className="w-full h-12 text-base"
-              >
-                {tt.button}
-              </Button>
-            </Form.Item>
-
-            <div className="text-center text-text-tertiary my-4">
-              {tt.continueWith}
-            </div>
-
-            <Button
-              icon={<GoogleOutlined />}
-              className="w-full h-12 text-base"
-              title={tt.withGoogleTitle}
-            >
-              {tt.withGoogle}
-            </Button>
-
-            <div className="text-center mt-6">
-              <span className="text-text-tertiary">{tt.noAccount} </span>
-              <LocaleLink
-                href="/register"
-                className="text-brand hover:text-brand-hover"
-                title={tt.createAccountTitle}
-              >
-                {tt.createAccount}
-              </LocaleLink>
-            </div>
-          </Form>
-        </div>
-      </div>
-    </div>
-  );
-}
-
-// Helper component for feature items
-function FeatureItem({ icon, text }: { icon: string; text: string }) {
-  return (
-    <div
-      data-testid="FeatureItem"
-      className="flex items-center gap-3 text-text"
-    >
-      <div className="w-8 h-8 bg-elevated rounded-lg flex items-center justify-center">
-        {icon}
-      </div>
-      <span>{text}</span>
-    </div>
-  );
-}

package/dist/templates/react-app/src/pages/auth/RegisterPage.tsx

@@ -1,226 +0,0 @@
-import { UserOutlined, LockOutlined, MailOutlined } from '@ant-design/icons';
-import { register18n } from '@config/i18n/register18n';
-import { IOCIdentifier } from '@config/IOCIdentifier';
-import { Form, Input, Button, Checkbox } from 'antd';
-import { useState } from 'react';
-import type { RegisterFormData } from '@/base/apis/userApi/UserApiType';
-import { useI18nInterface } from '@/uikit/hooks/useI18nInterface';
-import { useIOC } from '@/uikit/hooks/useIOC';
-
-export default function RegisterPage() {
-  const tt = useI18nInterface(register18n);
-  const AppConfig = useIOC(IOCIdentifier.AppConfig);
-  const userService = useIOC(IOCIdentifier.UserServiceInterface);
-  const routeService = useIOC(IOCIdentifier.RouteServiceInterface);
-  const logger = useIOC(IOCIdentifier.Logger);
-
-  const [loading, setLoading] = useState(false);
-  const [form] = Form.useForm();
-
-  const handleRegister = async (values: RegisterFormData) => {
-    try {
-      setLoading(true);
-      await userService.register(values);
-      routeService.replaceToHome();
-    } catch (error) {
-      logger.error(error);
-    } finally {
-      setLoading(false);
-    }
-  };
-
-  const handleLoginClick = (e: React.MouseEvent) => {
-    e.preventDefault();
-    routeService.gotoLogin();
-  };
-
-  return (
-    <div
-      data-testid="RegisterPage"
-      className="flex min-h-screen text-xs1 bg-primary"
-    >
-      {/* Left side - Brand section */}
-      <div className="hidden lg:flex lg:w-1/2 bg-secondary p-12 flex-col">
-        <div className="flex items-center gap-3 mb-12">
-          <div className="w-10 h-10 bg-brand rounded-lg"></div>
-          <span className="text-2xl font-semibold text-text">
-            {AppConfig.appName}
-          </span>
-        </div>
-        <h1 className="text-4xl font-bold text-text mb-4">{tt.title2}</h1>
-        <p className="text-text-secondary text-lg mb-8">{tt.subtitle}</p>
-        <div className="space-y-4">
-          <FeatureItem icon="🎯" text={tt.featurePersonalized} />
-          <FeatureItem icon="👨‍🏫" text={tt.featureSupport} />
-          <FeatureItem icon="👥" text={tt.featureCommunity} />
-        </div>
-      </div>
-
-      {/* Right side - Registration form */}
-      <div className="w-full lg:w-1/2 p-8 sm:p-12 flex items-center justify-center">
-        <div className="w-full max-w-[420px]">
-          <h2 className="text-2xl font-semibold mb-2 text-text">{tt.title2}</h2>
-          <p className="text-text-secondary mb-8">{tt.subtitle}</p>
-
-          <Form
-            form={form}
-            name="register"
-            onFinish={handleRegister}
-            layout="vertical"
-            className="space-y-4"
-          >
-            <Form.Item
-              name="username"
-              rules={[
-                {
-                  required: true,
-                  message: tt.usernameRequired
-                }
-              ]}
-            >
-              <Input
-                prefix={<UserOutlined className="text-text-tertiary" />}
-                placeholder={tt.username}
-                className="h-12 text-base bg-secondary border-border"
-              />
-            </Form.Item>
-
-            <Form.Item
-              name="email"
-              rules={[
-                {
-                  required: true,
-                  message: tt.emailRequired
-                },
-                {
-                  type: 'email',
-                  message: tt.emailRequired
-                }
-              ]}
-            >
-              <Input
-                prefix={<MailOutlined className="text-text-tertiary" />}
-                placeholder={tt.email}
-                className="h-12 text-base bg-secondary border-border"
-              />
-            </Form.Item>
-
-            <Form.Item
-              name="password"
-              rules={[
-                {
-                  required: true,
-                  message: tt.passwordRequired
-                }
-              ]}
-            >
-              <Input.Password
-                prefix={<LockOutlined />}
-                placeholder={tt.password}
-                className="h-12 text-base"
-              />
-            </Form.Item>
-
-            <Form.Item
-              name="confirmPassword"
-              dependencies={['password']}
-              rules={[
-                {
-                  required: true,
-                  message: tt.confirmPasswordRequired
-                },
-                ({ getFieldValue }) => ({
-                  validator(_, value) {
-                    if (!value || getFieldValue('password') === value) {
-                      return Promise.resolve();
-                    }
-                    return Promise.reject(tt.passwordMismatch);
-                  }
-                })
-              ]}
-            >
-              <Input.Password
-                prefix={<LockOutlined />}
-                placeholder={tt.confirmPassword}
-                className="h-12 text-base"
-              />
-            </Form.Item>
-
-            <Form.Item
-              name="agreeToTerms"
-              valuePropName="checked"
-              rules={[
-                {
-                  validator: (_, value) =>
-                    value
-                      ? Promise.resolve()
-                      : Promise.reject(new Error(tt.termsRequired))
-                }
-              ]}
-            >
-              <Checkbox>
-                <span className="text-text-secondary">
-                  {tt.termsPrefix}{' '}
-                  <a
-                    href="#"
-                    className="text-brand hover:text-brand-hover"
-                    target="_blank"
-                    rel="noopener noreferrer"
-                  >
-                    {tt.termsLink}
-                  </a>{' '}
-                  {tt.termsAnd}{' '}
-                  <a
-                    href="#"
-                    className="text-brand hover:text-brand-hover"
-                    target="_blank"
-                    rel="noopener noreferrer"
-                  >
-                    {tt.privacyLink}
-                  </a>
-                </span>
-              </Checkbox>
-            </Form.Item>
-
-            <Form.Item>
-              <Button
-                type="primary"
-                htmlType="submit"
-                loading={loading}
-                className="w-full h-12 text-base"
-              >
-                {tt.button}
-              </Button>
-            </Form.Item>
-
-            <div className="text-center mt-6">
-              <span className="text-text-tertiary">{tt.haveAccount} </span>
-              <a
-                href="#"
-                className="text-brand hover:text-brand-hover"
-                onClick={handleLoginClick}
-              >
-                {tt.loginLink}
-              </a>
-            </div>
-          </Form>
-        </div>
-      </div>
-    </div>
-  );
-}
-
-// Helper component for feature items
-function FeatureItem({ icon, text }: { icon: string; text: string }) {
-  return (
-    <div
-      data-testid="FeatureItem"
-      className="flex items-center gap-3 text-text"
-    >
-      <div className="w-8 h-8 bg-elevated rounded-lg flex items-center justify-center">
-        {icon}
-      </div>
-      <span>{text}</span>
-    </div>
-  );
-}

package/dist/templates/react-app/src/pages/base/AboutPage.tsx

@@ -1,123 +0,0 @@
-import { aboutI18n } from '@config/i18n/aboutI18n';
-import {
-  Button,
-  Tooltip,
-  message,
-  notification,
-  Modal,
-  Drawer,
-  Popover,
-  Popconfirm,
-  Alert
-} from 'antd';
-import { useState } from 'react';
-import { useI18nInterface } from '@/uikit/hooks/useI18nInterface';
-
-export default function AboutPage() {
-  const [messageApi, contextHolder] = message.useMessage();
-  const [notificationApi, contextHolder2] = notification.useNotification();
-  const [isModalOpen, setIsModalOpen] = useState(false);
-  const [isDrawerOpen, setIsDrawerOpen] = useState(false);
-
-  const tt = useI18nInterface(aboutI18n);
-
-  const showMessage = () => {
-    messageApi.info(tt.messageTest, 2000);
-  };
-
-  const showNotification = () => {
-    notificationApi.open({
-      message: tt.notificationTitle,
-      description: tt.notificationDescription,
-      duration: 2000
-    });
-  };
-  const showNotification2 = () => {
-    notification.open({
-      message: tt.notificationTitle,
-      description: tt.notificationDescription,
-      duration: 2000
-    });
-  };
-
-  const showModal = () => {
-    setIsModalOpen(true);
-  };
-  const showMessage2 = () => {
-    message.info(tt.messageTest, 200);
-  };
-
-  const showDrawer = () => {
-    setIsDrawerOpen(true);
-  };
-
-  return (
-    <div
-      data-testid="AboutPage"
-      className="min-h-screen bg-primary py-6 flex flex-col justify-center sm:py-12"
-    >
-      {contextHolder}
-      {contextHolder2}
-      <div className="relative py-3 sm:max-w-xl sm:mx-auto">
-        <h1 className="text-2xl font-bold text-center text-text mb-8">
-          {tt.title}
-        </h1>
-
-        <div className="space-x-4 flex justify-center flex-wrap gap-4">
-          <Button onClick={showMessage}>{tt.btnMessage}</Button>
-          <Button onClick={showMessage2}>{tt.btnMessage2}</Button>
-
-          <Button onClick={showNotification}>{tt.btnNotification}</Button>
-
-          <Button onClick={showNotification2}>{tt.btnNotification2}</Button>
-
-          <Tooltip title={tt.tooltipText}>
-            <Button>{tt.btnTooltip}</Button>
-          </Tooltip>
-
-          <Modal
-            title={tt.modalTitle}
-            open={isModalOpen}
-            onOk={() => setIsModalOpen(false)}
-            onCancel={() => setIsModalOpen(false)}
-          >
-            <p>{tt.modalContent}</p>
-          </Modal>
-
-          <Button onClick={showModal}>{tt.btnModal}</Button>
-
-          <Drawer
-            title={tt.drawerTitle}
-            open={isDrawerOpen}
-            onClose={() => setIsDrawerOpen(false)}
-          >
-            <p>{tt.drawerContent}</p>
-          </Drawer>
-
-          <Button onClick={showDrawer}>{tt.btnDrawer}</Button>
-
-          <Popover content={tt.popoverContent} title={tt.popoverTitle}>
-            <Button>{tt.btnPopover}</Button>
-          </Popover>
-
-          <Popconfirm
-            title={tt.popconfirmTitle}
-            description={tt.popconfirmDesc}
-            okText={tt.okText}
-            cancelText={tt.cancelText}
-          >
-            <Button>{tt.btnPopconfirm}</Button>
-          </Popconfirm>
-
-          <Alert
-            message={tt.alertMessage}
-            type="warning"
-            showIcon
-            closable
-            className="mt-4"
-          />
-        </div>
-      </div>
-    </div>
-  );
-}