chore (client): replace password strength checker

2024-06-28 15:54:05 +09:00 · 2024-06-28 15:54:05 +09:00 · 2e65ac6ffb
commit 2e65ac6ffb
parent af7c8ec732
33 changed files with 84 additions and 51 deletions
--- a/locales/ar-SA.yml
+++ b/locales/ar-SA.yml
@ -446,7 +446,7 @@ tooShort: "قصير جدًا"
 tooLong: "طويل جدًا"
 weakPassword: "الكلمة السرية ضعيفة"
 normalPassword: "الكلمة السرية جيدة"
-strongPassword: "الكلمة السرية قوية"
+veryStrongPassword: "الكلمة السرية قوية"
 passwordMatched: "التطابق صحيح!"
 passwordNotMatched: "غير متطابقتان"
 signinWith: "الولوج عبر {x}"
--- a/locales/bg-BG.yml
+++ b/locales/bg-BG.yml
@ -586,7 +586,7 @@ unavailable: Не е свободно
 tooShort: Твърде кратко
 tooLong: Твърде дълго
 weakPassword: Слаба парола
-strongPassword: Силна парола
+veryStrongPassword: Силна парола
 passwordMatched: Съвпада
 passwordNotMatched: Не съвпада
 signinWith: Вход с {x}
--- a/locales/bn-BD.yml
+++ b/locales/bn-BD.yml
@ -462,7 +462,7 @@ tooShort: "খুব ছোট"
 tooLong: "খুব বড়"
 weakPassword: "দুর্বল পাসওয়ার্ড"
 normalPassword: "সাধারণ পাসওয়ার্ড"
-strongPassword: "শক্তিশালী পাসওয়ার্ড"
+veryStrongPassword: "শক্তিশালী পাসওয়ার্ড"
 passwordMatched: "মিলেছে"
 passwordNotMatched: "মিলেনি"
 signinWith: "{x} এর সাহায্যে সাইন ইন করুন"
--- a/locales/ca-ES.yml
+++ b/locales/ca-ES.yml
@ -1091,7 +1091,7 @@ usernameInvalidFormat: Pots fer servir lletres en majúscules o minúscules, nom
 tooShort: Massa curt
 tooLong: Massa llarg
 weakPassword: Contrasenya amb seguretat feble
-strongPassword: Contrasenya amb seguretat forta
+veryStrongPassword: Contrasenya amb seguretat forta
 passwordMatched: Coincidències
 signinWith: Inicia sessió com {x}
 signinFailed: No es pot iniciar sessió. El nom d'usuari o la contrasenya són incorrectes.
--- a/locales/cs-CZ.yml
+++ b/locales/cs-CZ.yml
@ -401,7 +401,7 @@ tooShort: "Příliš krátké"
 tooLong: "Příliš dlouhé"
 weakPassword: "Slabé heslo"
 normalPassword: "Dobré heslo"
-strongPassword: "Silné heslo"
+veryStrongPassword: "Silné heslo"
 passwordMatched: "Hesla se schodují"
 passwordNotMatched: "Hesla se neschodují"
 signinWith: "Přihlásit se s {x}"
--- a/locales/de-DE.yml
+++ b/locales/de-DE.yml
@ -480,7 +480,7 @@ tooShort: "Zu kurz"
 tooLong: "Zu lang"
 weakPassword: "Schwaches Passwort"
 normalPassword: "Durchschnittliches Passwort"
-strongPassword: "Starkes Passwort"
+veryStrongPassword: "Starkes Passwort"
 passwordMatched: "Stimmt überein"
 passwordNotMatched: "Stimmt nicht überein"
 signinWith: "Mit {x} anmelden"
--- a/locales/el-GR.yml
+++ b/locales/el-GR.yml
@ -677,7 +677,7 @@ checking: Έλεγχος...
 invitationCode: Κωδικός πρόσκλησης
 normalPassword: Μέτριος κωδικός
 weakPassword: Αδύναμος κωδικός
-strongPassword: Δυνατός κωδικός
+veryStrongPassword: Δυνατός κωδικός
 signinWith: Συνδεθείτε με {x}
 tapSecurityKey: Βάλτε το κλειδί ασφάλειας
 signinFailed: Αδυναμία σύνδεσης. Το όνομα μέλους ή ο κωδικός είναι λάθος.
--- a/locales/en-US.yml
+++ b/locales/en-US.yml
@ -514,8 +514,9 @@ usernameInvalidFormat: "You can use upper- and lowercase letters, numbers, and u
 tooShort: "Too short"
 tooLong: "Too long"
 weakPassword: "Weak password"
-normalPassword: "Average password"
-strongPassword: "Strong password"
+normalPassword: "Medium password"
+strongPassword: "Good password"
+veryStrongPassword: "Great password"
 passwordMatched: "Matches"
 passwordNotMatched: "Does not match"
 signinWith: "Sign in with {x}"
--- a/locales/es-ES.yml
+++ b/locales/es-ES.yml
@ -465,7 +465,7 @@ tooShort: "Demasiado corto"
 tooLong: "Demasiado largo"
 weakPassword: "Contraseña débil"
 normalPassword: "Buena contraseña"
-strongPassword: "Muy buena contraseña"
+veryStrongPassword: "Muy buena contraseña"
 passwordMatched: "Correcto"
 passwordNotMatched: "Las contraseñas no son las mismas"
 signinWith: "Inicie sesión con {x}"
--- a/locales/fi.yml
+++ b/locales/fi.yml
@ -569,7 +569,7 @@ tooShort: Liian lyhyt
 tooLong: Liian pitkä
 weakPassword: Heikko salasana
 normalPassword: Kohtalainen salasana
-strongPassword: Vahva salasana
+veryStrongPassword: Vahva salasana
 passwordMatched: Vastaa
 signinWith: Kirjaudu sisään {x}
 signinFailed: Ei voitu kirjautua sisään. Annettu käyttäjänimi tai salasana virheellinen.
--- a/locales/fr-FR.yml
+++ b/locales/fr-FR.yml
@ -468,7 +468,7 @@ tooShort: "Trop court"
 tooLong: "Trop long"
 weakPassword: "Mot de passe faible"
 normalPassword: "Mot de passe acceptable"
-strongPassword: "Mot de passe fort"
+veryStrongPassword: "Mot de passe fort"
 passwordMatched: "Les mots de passe correspondent"
 passwordNotMatched: "Les mots de passe ne correspondent pas"
 signinWith: "Se connecter avec {x}"
--- a/locales/id-ID.yml
+++ b/locales/id-ID.yml
@ -464,7 +464,7 @@ tooShort: "Terlalu pendek"
 tooLong: "Terlalu panjang"
 weakPassword: "Kata sandi lemah"
 normalPassword: "Kata sandi baik"
-strongPassword: "Kata sandi kuat"
+veryStrongPassword: "Kata sandi kuat"
 passwordMatched: "Kata sandi sama"
 passwordNotMatched: "Kata sandi tidak sama"
 signinWith: "Masuk dengan {x}"
--- a/locales/it-IT.yml
+++ b/locales/it-IT.yml
@ -454,7 +454,7 @@ tooShort: "Troppo breve"
 tooLong: "Troppo lungo"
 weakPassword: "Password debole"
 normalPassword: "Password buona"
-strongPassword: "Password forte"
+veryStrongPassword: "Password forte"
 passwordMatched: "Corretta"
 passwordNotMatched: "Le password non corrispondono"
 signinWith: "Accedi con {x}"
--- a/locales/ja-JP.yml
+++ b/locales/ja-JP.yml
@ -465,7 +465,7 @@ tooShort: "短すぎます"
 tooLong: "長すぎます"
 weakPassword: "弱いパスワード"
 normalPassword: "普通のパスワード"
-strongPassword: "強いパスワード"
+veryStrongPassword: "強いパスワード"
 passwordMatched: "一致しました"
 passwordNotMatched: "一致していません"
 signinWith: "{x}でログイン"
--- a/locales/ja-KS.yml
+++ b/locales/ja-KS.yml
@ -435,7 +435,7 @@ tooShort: "短すぎやろ！"
 tooLong: "長すぎやろ！"
 weakPassword: "へぼいパスワード"
 normalPassword: "普通のパスワード"
-strongPassword: "ええ感じのパスワード"
+veryStrongPassword: "ええ感じのパスワード"
 passwordMatched: "よし！一致や！"
 passwordNotMatched: "一致しとらんで？"
 signinWith: "{x}でログイン"
--- a/locales/ko-KR.yml
+++ b/locales/ko-KR.yml
@ -442,7 +442,7 @@ tooShort: "너무 짧습니다"
 tooLong: "너무 깁니다"
 weakPassword: "약한 비밀번호"
 normalPassword: "좋은 비밀번호"
-strongPassword: "강한 비밀번호"
+veryStrongPassword: "강한 비밀번호"
 passwordMatched: "일치합니다"
 passwordNotMatched: "일치하지 않습니다"
 signinWith: "{x}로 로그인"
--- a/locales/nl-NL.yml
+++ b/locales/nl-NL.yml
@ -576,7 +576,7 @@ quoteAttached: Quote
 noMessagesYet: Nog geen berichten
 weakPassword: Zwak wachtwoord
 normalPassword: Middelmatig wachtwoord
-strongPassword: Sterk wachtwoord
+veryStrongPassword: Sterk wachtwoord
 onlyOneFileCanBeAttached: Je kan maar één bestand toevoegen aan je bericht
 invitationCode: Uitnodigingscode
 checking: Controleren...
--- a/locales/no-NO.yml
+++ b/locales/no-NO.yml
@ -571,7 +571,7 @@ youHaveNoGroups: Du har ingen grupper
 noHistory: Ingen historikk er tilgjengelig
 aboutX: Om {x}
 signinHistory: Innloggings-historikk
-strongPassword: Sterkt passord
+veryStrongPassword: Sterkt passord
 noFollowRequests: Du har ingen utestående følgeforespørsler
 openImageInNewTab: Åpne bilder i ny fane
 dashboard: Dashbord
--- a/locales/pl-PL.yml
+++ b/locales/pl-PL.yml
@ -454,7 +454,7 @@ tooShort: "Zbyt krótka"
 tooLong: "Zbyt długa"
 weakPassword: "Słabe hasło"
 normalPassword: "Dobre hasło"
-strongPassword: "Silne hasło"
+veryStrongPassword: "Silne hasło"
 passwordMatched: "Pasuje"
 passwordNotMatched: "Hasła nie pasują do siebie"
 signinWith: "Zaloguj się z {x}"
--- a/locales/ro-RO.yml
+++ b/locales/ro-RO.yml
@ -464,7 +464,7 @@ tooShort: "Prea scurt"
 tooLong: "Prea lung"
 weakPassword: "Parolă slabă"
 normalPassword: "Parolă medie"
-strongPassword: "Parolă puternică"
+veryStrongPassword: "Parolă puternică"
 passwordMatched: "Se potrivește!"
 passwordNotMatched: "Nu se potrivește"
 signinWith: "Autentifică-te cu {x}"
--- a/locales/ru-RU.yml
+++ b/locales/ru-RU.yml
@ -460,7 +460,7 @@ tooShort: "Слишком короткий"
 tooLong: "Слишком длинный"
 weakPassword: "Слабый пароль"
 normalPassword: "Годный пароль"
-strongPassword: "Надёжный пароль"
+veryStrongPassword: "Надёжный пароль"
 passwordMatched: "Совпали"
 passwordNotMatched: "Не совпадают"
 signinWith: "Использовать {x} для входа"
--- a/locales/sk-SK.yml
+++ b/locales/sk-SK.yml
@ -461,7 +461,7 @@ tooShort: "Príliš krátke"
 tooLong: "Príliš dlhé"
 weakPassword: "Slabé heslo"
 normalPassword: "Dobré heslo"
-strongPassword: "Silné heslo"
+veryStrongPassword: "Silné heslo"
 passwordMatched: "Heslá sú rovnaké"
 passwordNotMatched: "Heslá nie sú rovnaké"
 signinWith: "Prihlásiť sa použitím {x}"
--- a/locales/sv-SE.yml
+++ b/locales/sv-SE.yml
@ -381,7 +381,7 @@ noMessagesYet: Inga meddelande ännu
 newMessageExists: Det finns inga nya meddelanden
 weakPassword: Svagt lösenord
 normalPassword: Dugligt lösenord
-strongPassword: Starkt lösenord
+veryStrongPassword: Starkt lösenord
 passwordMatched: Matchar
 passwordNotMatched: Matchar inte
 signinWith: Logga in med {x}
--- a/locales/th-TH.yml
+++ b/locales/th-TH.yml
@ -452,7 +452,7 @@ tooShort: "สั้นเกินไปนะ"
 tooLong: "ยาวเกินไปนะ"
 weakPassword: "รหัสผ่าน แย่มาก"
 normalPassword: "รหัสผ่านปกติ"
-strongPassword: "รหัสผ่านรัดกุมมาก"
+veryStrongPassword: "รหัสผ่านรัดกุมมาก"
 passwordMatched: "ถูกต้อง!"
 passwordNotMatched: "ไม่ถูกต้อง"
 signinWith: "ลงชื่อเข้าใช้ด้วย {x}"
--- a/locales/tr-TR.yml
+++ b/locales/tr-TR.yml
@ -521,7 +521,7 @@ newMessageExists: Yeni mesaj yok
 invitations: Davetler
 invitationCode: Davet kodu
 signinWith: '{x} ile giriş yap'
-strongPassword: Güçlü şifre
+veryStrongPassword: Güçlü şifre
 passwordNotMatched: Uyuşmuyor
 signinFailed: Giriş yapılamadı. Şifre ve ya kullanıcı adı yanlış.
 tapSecurityKey: Güvenlik anahtarınıza dokunun
--- a/locales/uk-UA.yml
+++ b/locales/uk-UA.yml
@ -460,7 +460,7 @@ tooShort: "Занадто короткий"
 tooLong: "Занадто довгий"
 weakPassword: "Слабкий пароль"
 normalPassword: "Достатній пароль"
-strongPassword: "Міцний пароль"
+veryStrongPassword: "Міцний пароль"
 passwordMatched: "Все вірно"
 passwordNotMatched: "Паролі не співпадають"
 signinWith: "Увійти за допомогою {x}"
--- a/locales/vi-VN.yml
+++ b/locales/vi-VN.yml
@ -462,7 +462,7 @@ tooShort: "Quá ngắn"
 tooLong: "Quá dài"
 weakPassword: "Mật khẩu yếu"
 normalPassword: "Mật khẩu tạm được"
-strongPassword: "Mật khẩu mạnh"
+veryStrongPassword: "Mật khẩu mạnh"
 passwordMatched: "Trùng khớp"
 passwordNotMatched: "Không trùng khớp"
 signinWith: "Đăng nhập bằng {x}"
--- a/locales/zh-CN.yml
+++ b/locales/zh-CN.yml
@ -450,7 +450,7 @@ tooShort: "太短"
 tooLong: "太长"
 weakPassword: "密码强度：弱"
 normalPassword: "密码强度：中等"
-strongPassword: "密码强度：强"
+veryStrongPassword: "密码强度：强"
 passwordMatched: "密码一致"
 passwordNotMatched: "密码不一致"
 signinWith: "以 {x} 登录"
--- a/locales/zh-TW.yml
+++ b/locales/zh-TW.yml
@ -448,7 +448,7 @@ tooShort: "過短"
 tooLong: "過長"
 weakPassword: "密碼強度過弱"
 normalPassword: "密碼強度普通"
-strongPassword: "密碼強度高"
+veryStrongPassword: "密碼強度高"
 passwordMatched: "密碼一致"
 passwordNotMatched: "密碼不一致"
 signinWith: "以{x}登錄"
--- a/packages/client/package.json
+++ b/packages/client/package.json
@ -43,6 +43,7 @@
 		"chartjs-chart-matrix": "2.0.1",
 		"chartjs-plugin-gradient": "0.6.1",
 		"chartjs-plugin-zoom": "2.0.1",
+		"check-password-strength": "2.0.10",
 		"city-timezones": "1.2.1",
 		"compare-versions": "6.1.0",
 		"cropperjs": "2.0.0-rc.0",
@ -76,7 +77,6 @@
 		"seedrandom": "3.0.5",
 		"stringz": "2.1.0",
 		"swiper": "11.1.4",
-		"syuilo-password-strength": "0.0.1",
 		"textarea-caret": "3.1.0",
 		"throttle-debounce": "5.0.2",
 		"tinycolor2": "1.6.0",
--- a/packages/client/src/components/MkSignup.vue
+++ b/packages/client/src/components/MkSignup.vue
@ -179,23 +179,29 @@
 				<template #prefix><i :class="icon('ph-lock')"></i></template>
 				<template #caption>
 					<span
-						v-if="passwordStrength == 'low'"
+						v-if="passwordStrength === 'Weak'"
 						style="color: var(--error)"
-						><i :class="icon('ph-warning ph-fw')"></i>
+						><i :class="icon('ph-seal-warning ph-fw')"></i>
 						{{ i18n.ts.weakPassword }}</span
 					>
 					<span
-						v-if="passwordStrength == 'medium'"
+						v-if="passwordStrength === 'Medium'"
 						style="color: var(--warn)"
-						><i :class="icon('ph-check ph-fw')"></i>
+						><i :class="icon('ph-warning ph-fw')"></i>
 						{{ i18n.ts.normalPassword }}</span
 					>
 					<span
-						v-if="passwordStrength == 'high'"
+						v-if="passwordStrength === 'Good'"
 						style="color: var(--success)"
 						><i :class="icon('ph-check ph-fw')"></i>
 						{{ i18n.ts.strongPassword }}</span
 					>
+					<span
+						v-if="passwordStrength === 'Great'"
+						style="color: var(--success)"
+						><i :class="icon('ph-checks ph-fw')"></i>
+						{{ i18n.ts.veryStrongPassword }}</span
+					>
 				</template>
 			</MkInput>
 			<MkInput
@ -273,7 +279,7 @@
 <script lang="ts" setup>
 import { computed, ref } from "vue";

-import getPasswordStrength from "syuilo-password-strength";
+import { passwordStrength as checkPasswordStrength } from "check-password-strength";
 import { toUnicode } from "punycode/";
 import MkButton from "./MkButton.vue";
 import MkInput from "./form/input.vue";
@ -333,7 +339,7 @@ const emailState = ref<
 	| "unavailable"
 	| "error"
 >(null);
-const passwordStrength = ref<"" | "low" | "medium" | "high">("");
+const passwordStrength = ref<"" | "Weak" | "Medium" | "Good" | "Great">("");
 const passwordRetypeState = ref<null | "match" | "not-match">(null);
 const submitting = ref(false);
 const ToSAgreement = ref(false);
@ -423,15 +429,42 @@ function onChangeEmail(): void {
 		});
 }

+const passwordStrengthOptions = [
+	{
+		id: 0,
+		value: "Weak",
+		minDiversity: 0,
+		minLength: 0,
+	},
+	{
+		id: 1,
+		value: "Medium",
+		minDiversity: 2,
+		minLength: 8,
+	},
+	{
+		id: 2,
+		value: "Good",
+		minDiversity: 3,
+		minLength: 16,
+	},
+	{
+		id: 3,
+		value: "Great",
+		minDiversity: 4,
+		minLength: 32,
+	},
+];
+
 function onChangePassword(): void {
 	if (password.value === "") {
 		passwordStrength.value = "";
 		return;
 	}
-
-	const strength = getPasswordStrength(password.value);
-	passwordStrength.value =
-		strength > 0.7 ? "high" : strength > 0.3 ? "medium" : "low";
+	passwordStrength.value = checkPasswordStrength(
+		password.value,
+		passwordStrengthOptions,
+	).value;
 }

 function onChangePasswordRetype(): void {
--- a/pnpm-lock.yaml
+++ b/pnpm-lock.yaml
@ -598,6 +598,9 @@ importers:
      chartjs-plugin-zoom:
        specifier: 2.0.1
        version: 2.0.1(chart.js@4.4.3)
+      check-password-strength:
+        specifier: 2.0.10
+        version: 2.0.10
      city-timezones:
        specifier: 1.2.1
        version: 1.2.1
@ -697,9 +700,6 @@ importers:
      swiper:
        specifier: 11.1.4
        version: 11.1.4
-      syuilo-password-strength:
-        specifier: 0.0.1
-        version: 0.0.1
      textarea-caret:
        specifier: 3.1.0
        version: 3.1.0
@ -3635,6 +3635,9 @@ packages:
    peerDependencies:
      chart.js: '>=3.2.0'

+  check-password-strength@2.0.10:
+    resolution: {integrity: sha512-HRM5ICPmtnNtLnTv2QrfVkq1IxI9z3bzYpDJ1k5ixwD9HtJGHuv265R6JmHOV6r8wLhQMlULnIUVpkrC2yaiCw==}
+
  cheerio@0.22.0:
    resolution: {integrity: sha512-8/MzidM6G/TgRelkzDG13y3Y9LxBjCb+8yOEZ9+wwq5gVF2w2pV0wmHvjfT0RvuxGyR7UEuK36r+yYMbT4uKgA==}
    engines: {node: '>= 0.6'}
@ -7511,9 +7514,6 @@ packages:
    resolution: {integrity: sha512-7SNMJKtQBJlwBUp1jxFT7bXya71cnINXPCYJ2AVhlQE4MKL7o2QiPdAXbMdWRiLeykQ2rx+7TNrnoGzvzhO+eA==}
    engines: {node: '>=10.0.0'}

-  syuilo-password-strength@0.0.1:
-    resolution: {integrity: sha512-g9rPT3V1Q4WjWFZ/t5BdGC1mT/FpYnsLdBl+M5e6MlRkuE1RSR+R43wcY/3mKI59B9KEr+vxdWCuWNMD3oNHKA==}
-
  tabbable@6.2.0:
    resolution: {integrity: sha512-Cat63mxsVJlzYvN51JmVXIgNoUokrIaT2zLclCXjRd8boZ0004U4KCs/sToJ75C6sdlByWxpYnb5Boif1VSFew==}

@ -11413,6 +11413,8 @@ snapshots:
      chart.js: 4.4.3
      hammerjs: 2.0.8

+  check-password-strength@2.0.10: {}
+
  cheerio@0.22.0:
    dependencies:
      css-select: 1.2.0
@ -15952,8 +15954,6 @@ snapshots:
    dependencies:
      moment: 2.30.1

-  syuilo-password-strength@0.0.1: {}
-
  tabbable@6.2.0: {}

  tapable@2.2.1: {}
--- a/renovate.json
+++ b/renovate.json
@ -30,7 +30,6 @@
 		{"matchManagers": ["npm"], "matchPackageNames": ["mfm-js"], "automerge": false},
 		{"matchManagers": ["npm"], "matchPackageNames": ["rndstr"], "automerge": false},
 		{"matchManagers": ["npm"], "matchPackageNames": ["summaly"], "automerge": false},
-		{"matchManagers": ["npm"], "matchPackageNames": ["syuilo-password-strength"], "automerge": false},
 		{"matchManagers": ["npm"], "matchPackageNames": ["xev"], "automerge": false}
 	]
 }