From 0ef129cf5666fd4f44cb5d3676431ee23e56e6c7 Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?Vin=C3=ADcius=20Azevedo?= Date: Mon, 8 Jul 2024 10:44:23 -0300 Subject: [PATCH 1/2] feat: signup button --- .gitignore | 3 +- .gitmodules | 4 +- README-CN.md | 2 +- README-DE.md | 2 +- README-JP.md | 2 +- README.md | 2 +- apps/builder/.env.self | 8 +- apps/cloud/package.json | 6 +- apps/cloud/src/page/user/SignUpPage.css | 29 ++ apps/cloud/src/page/user/signup.tsx | 161 ++++++++ apps/cloud/src/router/routerConfig.tsx | 9 + pnpm-lock.yaml | 511 +++++++++++++++++++----- 12 files changed, 632 insertions(+), 107 deletions(-) create mode 100644 apps/cloud/src/page/user/SignUpPage.css create mode 100644 apps/cloud/src/page/user/signup.tsx diff --git a/.gitignore b/.gitignore index f804817a83..e2c247506f 100644 --- a/.gitignore +++ b/.gitignore @@ -2,4 +2,5 @@ node_modules .idea .DS_Store .vscode -.turbo \ No newline at end of file +.turbo +run.sh diff --git a/.gitmodules b/.gitmodules index 1838ba497e..b9dffa90f7 100644 --- a/.gitmodules +++ b/.gitmodules @@ -1,7 +1,7 @@ [submodule "packages/illa-public-component"] path = packages/illa-public-component - url = https://github.com/illacloud/illa-public-component.git + url = https://github.com/viniciussousaazevedo/illa-public-component branch = beta [submodule "packages/illa-design"] path = packages/illa-design - url = https://github.com/illacloud/illa-design.git + url = https://github.com/viniciussousaazevedo/illa-design diff --git a/README-CN.md b/README-CN.md index 01c9d51da9..ad6630b1d4 100644 --- a/README-CN.md +++ b/README-CN.md @@ -44,7 +44,7 @@ 2. 🤖 **自动化支持:** 连接一切组件,并在 5 秒内实现自动化。 3. 🖥 **本地部署:** 支持Docker和k8s 4. 📝 **Page支持:** 创建内容丰富且 UI 友好的工具的基础。 -5. 🎨 **由 [ILLA Design](https://github.com/illacloud/illa-design) 提供支持:** 组件不应限制您的想象力。 +5. 🎨 **由 [ILLA Design](https://github.com/viniciussousaazevedo/illa-design) 提供支持:** 组件不应限制您的想象力。 ## 本地部署 diff --git a/README-DE.md b/README-DE.md index 80d7f76740..fbe0ad6d16 100644 --- a/README-DE.md +++ b/README-DE.md @@ -44,7 +44,7 @@ Sie können ILLA-Utilities auch manuell bereitstellen und selbst hosten [Docker, 2. 🤖 **Automatisierte Unterstützungt:** Verbinden Sie alles und automatisieren Sie es in 5 Sekunden 3. 🖥 **Selbst gehostet:** unterstützt Docker & k8s 4. 📝 **eitenunterstützung:** Die Basis für die Erstellung eines inhaltsreichen und UI-freundlichen Tools. -5. 🎨 ** [Angetrieben von ILLA Design](https://github.com/illacloud/illa-design):** : Komponenten sollten Ihre Fantasie nicht einschränken.. +5. 🎨 ** [Angetrieben von ILLA Design](https://github.com/viniciussousaazevedo/illa-design):** : Komponenten sollten Ihre Fantasie nicht einschränken.. ## Selbst gehostet diff --git a/README-JP.md b/README-JP.md index 92be403809..be24b4637e 100644 --- a/README-JP.md +++ b/README-JP.md @@ -46,7 +46,7 @@ 2. 🤖 **サポートの自動化:** すべてを接続して 5 秒で自動化します。 3. 🖥 **自己ホスト型:** Docker と k8s をサポート 4. 📝 **ページのサポート:** コンテンツが豊富で UI に適したツールを作成するための基盤。 -5. 🎨 **[ILLA Design](https://github.com/illacloud/illa-design) を利用:** コンポーネントによって想像力が制約されることはありません。 +5. 🎨 **[ILLA Design](https://github.com/viniciussousaazevedo/illa-design) を利用:** コンポーネントによって想像力が制約されることはありません。 ## Self-hosted ILLA CLI を使用すると、ILLA Builder を想像よりも速く展開できます。 [ここをクリック](https://docs.illacloud.com/self-hosted-deployment) 詳細については。 diff --git a/README.md b/README.md index 895bad1374..64ba4b1f11 100644 --- a/README.md +++ b/README.md @@ -47,7 +47,7 @@ You can also deploy and [self-host](https://docs.illacloud.com/self-hosted-deplo 2. 🤖 **Automate Support:** Connect everything and automate them in 5 seconds. 3. 🖥 **Self-hosted:** supports Docker & k8s 4. 📝 **Page Support:** The base of creating a content-rich and UI-friendly tool. -5. 🎨 **Powered by [ILLA Design](https://github.com/illacloud/illa-design):** Components should not constrain your imagination. +5. 🎨 **Powered by [ILLA Design](https://github.com/viniciussousaazevedo/illa-design):** Components should not constrain your imagination. ## Self-hosted diff --git a/apps/builder/.env.self b/apps/builder/.env.self index 23026ca3e8..74fa6e7aa8 100644 --- a/apps/builder/.env.self +++ b/apps/builder/.env.self @@ -1,2 +1,8 @@ +ILLA_API_BASE_URL=localhost:8000 ILLA_INSTANCE_ID=SELF_HOST_CLOUD -ILLA_APP_ENV=production \ No newline at end of file +ILLA_APP_VERSION=0.0.0 +ILLA_APP_ENV=development +ILLA_USE_HTTPS=false +ILLA_BUILDER_URL=http://localhost:8000/build +ILLA_CLOUD_URL=http://localhost:8000/cloud +ILLA_BASE_PATH=/build diff --git a/apps/cloud/package.json b/apps/cloud/package.json index debd2dca3a..10909b363b 100644 --- a/apps/cloud/package.json +++ b/apps/cloud/package.json @@ -14,6 +14,8 @@ "dependencies": { "@emotion/cache": "^11.10.5", "@emotion/core": "^11.0.0", + "@emotion/react": "^11.11.4", + "@emotion/styled": "^11.11.0", "@illa-design/react": "workspace:*", "@illa-design/table": "workspace:*", "@illa-public/avatar": "workspace:*", @@ -35,6 +37,8 @@ "@illa-public/user-data": "workspace:*", "@illa-public/user-role-utils": "workspace:*", "@illa-public/utils": "workspace:*", + "@mui/icons-material": "^5.14.18", + "@mui/material": "^5.15.21", "@reduxjs/toolkit": "^2.0.1", "axios": "^1.6.2", "dayjs": "^1.11.10", @@ -46,7 +50,7 @@ "react-hook-form": "^7.40.0", "react-i18next": "^13.5.0", "react-redux": "^9.0.4", - "react-router-dom": "^6.14.0", + "react-router-dom": "^6.16.0", "swr": "^2.2.4", "uuid": "^9.0.0" }, diff --git a/apps/cloud/src/page/user/SignUpPage.css b/apps/cloud/src/page/user/SignUpPage.css new file mode 100644 index 0000000000..fcd02d33d5 --- /dev/null +++ b/apps/cloud/src/page/user/SignUpPage.css @@ -0,0 +1,29 @@ +.signup-page-container { + display: flex; + flex-direction: column; + justify-content: center; + align-items: center; + height: 100vh; + background-color: #f0f2f5; + } + + .signup-title { + font-size: 36px; + font-weight: bold; + margin-bottom: 20px; + text-align: center; + } + + .signup-form-container { + background-color: #fff; + padding: 40px; + border-radius: 8px; + box-shadow: 0 4px 8px rgba(0, 0, 0, 0.1); + width: 400px; + } + + .button-container { + display: flex; + justify-content: center; + } + \ No newline at end of file diff --git a/apps/cloud/src/page/user/signup.tsx b/apps/cloud/src/page/user/signup.tsx new file mode 100644 index 0000000000..e19b76f31e --- /dev/null +++ b/apps/cloud/src/page/user/signup.tsx @@ -0,0 +1,161 @@ +import { FC, useState } from "react" +import { SubmitHandler, useForm } from "react-hook-form" +import { useTranslation } from "react-i18next" +import { useNavigate } from "react-router-dom" +import { Button, Input, Select, Space } from "@illa-design/react" +import "./SignUpPage.css" + +interface SignUpFields { + nickname: string + email: string + password: string + confirmPassword: string + role: string +} + +const SignUpPage: FC = () => { + const { t } = useTranslation() + const navigate = useNavigate() + const { + register, + handleSubmit, + watch, + formState: { errors }, + } = useForm() + const [loading, setLoading] = useState(false) + + const onSubmit: SubmitHandler = async (data) => { + setLoading(true) + try { + // Aqui você pode chamar a função para realizar o cadastro + console.log(data) + // Supondo que o cadastro foi bem-sucedido + navigate("/login") + } catch (error) { + // Tratar erro + console.error(error) + } finally { + setLoading(false) + } + } + + const password = watch("password") + + return ( +
+

Sign Up

+
+
+ +
+ + + register("nickname").onChange({ target: { value } }) + } + /> + {errors.nickname && ( + {errors.nickname.message} + )} +
+ +
+ + + register("email").onChange({ target: { value } }) + } + /> + {errors.email && ( + {errors.email.message} + )} +
+ +
+ + + register("password").onChange({ target: { value } }) + } + /> + {errors.password && ( + {errors.password.message} + )} +
+ +
+ + + value === password || + "Password and Password confirmation does not match", + })} + onChange={(value) => + register("confirmPassword").onChange({ target: { value } }) + } + /> + {errors.confirmPassword && ( + + {errors.confirmPassword.message} + + )} +
+ +
+ +