From 6b173535b9dd84240606d19b713303892183bcaa Mon Sep 17 00:00:00 2001 From: Tanin Pewluangsawat <70503441+TaninDean@users.noreply.github.com> Date: Sun, 14 May 2023 19:44:30 +0700 Subject: [PATCH] [ Gb-77 ] Add register page and login with email and password (#5) * Add the base login and register page * add style to input block * Add method to handler login and register * add package sha1 to check compromised password * Fix wrong from label * Fix bug if compromised password the account still created * fix: Correct the function call syntax * fix: Check the password and confirm password match * fix: Update the wording for username to be name-surname --------- Co-authored-by: Siratee K --- package.json | 2 + src/router/index.ts | 6 ++ src/sha1.d.ts | 1 + src/views/Register.vue | 123 +++++++++++++++++++++++++++++++++++++++++ src/views/SignIn.vue | 60 ++++++++++++++++++++ yarn.lock | 25 +++++++++ 6 files changed, 217 insertions(+) create mode 100644 src/sha1.d.ts create mode 100644 src/views/Register.vue diff --git a/package.json b/package.json index d6b56d7..e31664b 100644 --- a/package.json +++ b/package.json @@ -16,11 +16,13 @@ "lint": "vue-cli-service lint" }, "dependencies": { + "@types/sha1": "^1.1.3", "axios": "^0.23.0", "core-js": "^3.6.5", "dotenv": "^10.0.0", "firebase": "^8.6.2", "firebaseui": "^4.8.0", + "sha1": "^1.1.1", "vue": "^2.6.11", "vue-class-component": "^7.2.3", "vue-material": "^1.0.0-beta-15", diff --git a/src/router/index.ts b/src/router/index.ts index e4afaf8..d9b5bd9 100644 --- a/src/router/index.ts +++ b/src/router/index.ts @@ -10,6 +10,7 @@ import TagDetailView from "@/views/Tag/TagDetailView.vue"; import Account from "@/views/Account/Account.vue"; import LinkAccount from "@/views/Account/LinkAccount.vue"; import PageNotFound from "@/views/PageNotFound.vue"; +import Register from "@/views/Register.vue" Vue.use(VueRouter); @@ -24,6 +25,11 @@ const routes: Array = [ name: "SignIn", component: SignIn, }, + { + path: "/register", + name: "Register", + component: Register, + }, { path: "/home", name: "HomePage", diff --git a/src/sha1.d.ts b/src/sha1.d.ts new file mode 100644 index 0000000..f954b0a --- /dev/null +++ b/src/sha1.d.ts @@ -0,0 +1 @@ +declare module 'sha1'; \ No newline at end of file diff --git a/src/views/Register.vue b/src/views/Register.vue new file mode 100644 index 0000000..9f1a3d0 --- /dev/null +++ b/src/views/Register.vue @@ -0,0 +1,123 @@ + + + + + diff --git a/src/views/SignIn.vue b/src/views/SignIn.vue index a609987..ae6c9f0 100644 --- a/src/views/SignIn.vue +++ b/src/views/SignIn.vue @@ -8,6 +8,32 @@

Sign in to GarnBarn

+
+
+
+
+ + +
+
+ + +
+
+
+
Don't have an account?Register
+
+
+ Forgot your password? +
+
+ +
+
+
+
+

or

+
@@ -23,6 +49,9 @@ import { Component, Vue } from "vue-property-decorator"; @Component export default class SignIn extends Vue { + email = ''; + password = ''; + mounted(): void { let firebaseAuthInstance: firebase.auth.Auth = firebase.auth(); let uiConfig: any = { @@ -33,6 +62,18 @@ export default class SignIn extends Vue { let ui = new firebaseUi.auth.AuthUI(firebaseAuthInstance); ui.start("#firebaseui-auth-container", uiConfig); } + + login(): void { + firebase + .auth() + .signInWithEmailAndPassword(this.email, this.password) + .then(() => { + this.$router.push('/home') + }) + .catch((error) => { + alert(error.message); + }); + } } @@ -66,4 +107,23 @@ hr.rounded { border-top: 2px solid #bbb; border-radius: 5px; } + +.forget-password { + text-align: right; + margin-bottom: 0.25rem; +} + +.password { + margin: 0.25rem; +} + +p { + margin-block-start: 1rem; + margin-block-end: 0em; +} + +.or { + font-size: 1.5rem; + font-weight: 500; +} diff --git a/yarn.lock b/yarn.lock index ac9e05d..5cfdb87 100644 --- a/yarn.lock +++ b/yarn.lock @@ -2341,6 +2341,13 @@ "@types/mime" "^1" "@types/node" "*" +"@types/sha1@^1.1.3": + version "1.1.3" + resolved "https://registry.yarnpkg.com/@types/sha1/-/sha1-1.1.3.tgz#d4cc37f17d093c524382d90326ba7274ef4637a8" + integrity sha512-bXfx/6xrPu1l6pLItGRMPX00lhnJavpj2qiQeLHflXvL2Ix97aC8FTF2/pQoqukRzcCwKyN3csZvOLzamIoaSA== + dependencies: + "@types/node" "*" + "@types/sinonjs__fake-timers@^6.0.2": version "6.0.4" resolved "https://registry.yarnpkg.com/@types/sinonjs__fake-timers/-/sinonjs__fake-timers-6.0.4.tgz#0ecc1b9259b76598ef01942f547904ce61a6a77d" @@ -4373,6 +4380,11 @@ chardet@^0.7.0: resolved "https://registry.yarnpkg.com/chardet/-/chardet-0.7.0.tgz#90094849f0937f2eedc2425d0d28a9e5f0cbad9e" integrity sha512-mT8iDcrh03qDGRRmoA2hmBJnxpllMR+0/0qlzjqZES6NdiWDcZkCNAk4rPFZ9Q85r27unkiNNg8ZOiwZXBHwcA== +"charenc@>= 0.0.1": + version "0.0.2" + resolved "https://registry.yarnpkg.com/charenc/-/charenc-0.0.2.tgz#c0a1d2f3a7092e03774bfa83f14c0fc5790a8667" + integrity sha512-yrLQ/yVUFXkzg7EDQsPieE/53+0RlaWTs+wBrvW36cyilJ2SaDWfl4Yj7MtLTXleV9uEKefbAGUPv2/iWSooRA== + check-more-types@^2.24.0: version "2.24.0" resolved "https://registry.yarnpkg.com/check-more-types/-/check-more-types-2.24.0.tgz#1420ffb10fd444dcfc79b43891bbfffd32a84600" @@ -5016,6 +5028,11 @@ cross-spawn@^7.0.0, cross-spawn@^7.0.3: shebang-command "^2.0.0" which "^2.0.1" +"crypt@>= 0.0.1": + version "0.0.2" + resolved "https://registry.yarnpkg.com/crypt/-/crypt-0.0.2.tgz#88d7ff7ec0dfb86f713dc87bbb42d044d3e6c41b" + integrity sha512-mCxBlsHFYh9C+HVpiEacem8FEBnMXgU9gy4zmNC+SXAZNB/1idgp/aulFJ4FgCi7GPEVbfyng092GqL2k2rmow== + crypto-browserify@^3.0.0, crypto-browserify@^3.11.0: version "3.12.0" resolved "https://registry.yarnpkg.com/crypto-browserify/-/crypto-browserify-3.12.0.tgz#396cf9f3137f03e4b8e532c58f698254e00f80ec" @@ -12445,6 +12462,14 @@ sha.js@^2.4.0, sha.js@^2.4.8, sha.js@~2.4.4: inherits "^2.0.1" safe-buffer "^5.0.1" +sha1@^1.1.1: + version "1.1.1" + resolved "https://registry.yarnpkg.com/sha1/-/sha1-1.1.1.tgz#addaa7a93168f393f19eb2b15091618e2700f848" + integrity sha512-dZBS6OrMjtgVkopB1Gmo4RQCDKiZsqcpAQpkV/aaj+FCrCg8r4I4qMkDPQjBgLIxlmu9k4nUbWq6ohXahOneYA== + dependencies: + charenc ">= 0.0.1" + crypt ">= 0.0.1" + shallow-clone@^3.0.0: version "3.0.1" resolved "https://registry.yarnpkg.com/shallow-clone/-/shallow-clone-3.0.1.tgz#8f2981ad92531f55035b01fb230769a40e02efa3"