Skip to content

Commit c038379

Browse files
J43furaJ43fura
authored
fix password min length suggestion (#2107)
* fix password min length suggestion * add hasMinLength function in password.ts
1 parent 7ba9adf commit c038379

File tree

3 files changed

+33
-35
lines changed

3 files changed

+33
-35
lines changed

‎frontend/src/components/auth/EmailAuth.vue‎

Lines changed: 11 additions & 13 deletions
Original file line numberDiff line numberDiff line change
@@ -78,35 +78,35 @@
7878
<p class="mt-2">{{ $t('auth.suggestions') }}</p>
7979
<ul class="pl-2 ml-2 mt-0" style="line-height: 1.5">
8080
<li>
81-
<i v-if="passwordHasLowerCase" class="pi pi-check-square"></i>
82-
<i v-else class="pi pi-stop"></i>
81+
<i v-if="passwordHasLowerCase" class="pi pi-check-square" />
82+
<i v-else class="pi pi-stop" />
8383
{{ $t('auth.suggestion_lowercase') }}
8484
</li>
8585
<li>
86-
<i v-if="passwordHasUpperCase" class="pi pi-check-square"></i>
87-
<i v-else class="pi pi-stop"></i>
86+
<i v-if="passwordHasUpperCase" class="pi pi-check-square" />
87+
<i v-else class="pi pi-stop" />
8888
{{ $t('auth.suggestion_uppercase') }}
8989
</li>
9090
<li>
91-
<i v-if="passwordHasNumber" class="pi pi-check-square"></i>
92-
<i v-else class="pi pi-stop"></i>
91+
<i v-if="passwordHasNumber" class="pi pi-check-square" />
92+
<i v-else class="pi pi-stop" />
9393
{{ $t('auth.suggestion_numeric') }}
9494
</li>
9595
<li>
9696
<i
9797
v-if="passwordHasSpecialCharacter"
9898
class="pi pi-check-square"
99-
></i>
100-
<i v-else class="pi pi-stop"></i>
99+
/>
100+
<i v-else class="pi pi-stop" />
101101
{{
102102
$t('auth.suggestion_special_character', {
103103
characters: SPECIAL_CHARACTERS,
104104
})
105105
}}
106106
</li>
107107
<li>
108-
<i v-if="passwordHasMinLength" class="pi pi-check-square"></i>
109-
<i v-else class="pi pi-stop"></i>
108+
<i v-if="passwordHasMinLength" class="pi pi-check-square" />
109+
<i v-else class="pi pi-stop" />
110110
{{ $t('auth.suggestion_min_chars', PASSWORD_MIN_LENGTH) }}
111111
</li>
112112
</ul>
@@ -284,9 +284,7 @@ const passwordHasUpperCase = computed(() => hasUpperCase(password.value));
284284
const passwordHasSpecialCharacter = computed(() =>
285285
hasSpecialChar(password.value),
286286
);
287-
const passwordHasMinLength = computed(
288-
() => password.value.length >= PASSWORD_MIN_LENGTH,
289-
);
287+
const passwordHasMinLength = computed(() => hasMinLength(password.value));
290288
291289
const isLoading = ref(false);
292290

‎frontend/src/pages/account/settings.vue‎

Lines changed: 19 additions & 22 deletions
Original file line numberDiff line numberDiff line change
@@ -45,42 +45,36 @@
4545
<p class="mt-2">{{ $t('auth.suggestions') }}</p>
4646
<ul class="pl-2 ml-2 mt-0" style="line-height: 1.5">
4747
<li>
48-
<i
49-
v-if="passwordHasLowerCase"
50-
class="pi pi-check-square"
51-
></i>
52-
<i v-else class="pi pi-stop"></i>
48+
<i v-if="passwordHasLowerCase" class="pi pi-check-square" />
49+
<i v-else class="pi pi-stop" />
5350
{{ $t('auth.suggestion_lowercase') }}
5451
</li>
5552
<li>
56-
<i
57-
v-if="passwordHasUpperCase"
58-
class="pi pi-check-square"
59-
></i>
60-
<i v-else class="pi pi-stop"></i>
53+
<i v-if="passwordHasUpperCase" class="pi pi-check-square" />
54+
<i v-else class="pi pi-stop" />
6155
{{ $t('auth.suggestion_uppercase') }}
6256
</li>
6357
<li>
64-
<i v-if="passwordHasNumber" class="pi pi-check-square"></i>
65-
<i v-else class="pi pi-stop"></i>
58+
<i v-if="passwordHasNumber" class="pi pi-check-square" />
59+
<i v-else class="pi pi-stop" />
6660
{{ $t('auth.suggestion_numeric') }}
6761
</li>
6862
<li>
69-
<i v-if="passwordHasSpecial" class="pi pi-check-square"></i>
70-
<i v-else class="pi pi-stop"></i>
63+
<i
64+
v-if="passwordHasSpecialCharacter"
65+
class="pi pi-check-square"
66+
/>
67+
<i v-else class="pi pi-stop" />
7168
{{
7269
$t('auth.suggestion_special_character', {
7370
characters: SPECIAL_CHARACTERS,
7471
})
7572
}}
7673
</li>
7774
<li>
78-
<i
79-
v-if="passwordInput.length >= 8"
80-
class="pi pi-check-square"
81-
></i>
82-
<i v-else class="pi pi-stop"></i>
83-
{{ $t('auth.suggestion_min_chars') }}
75+
<i v-if="passwordHasMinLength" class="pi pi-check-square" />
76+
<i v-else class="pi pi-stop" />
77+
{{ $t('auth.suggestion_min_chars', PASSWORD_MIN_LENGTH) }}
8478
</li>
8579
</ul>
8680
</template>
@@ -155,8 +149,8 @@
155149
</template>
156150

157151
<script setup lang="ts">
158-
import { AcceptNewsLetter } from '~/utils/extras';
159152
import type { UserAttributes } from '@supabase/supabase-js';
153+
import { AcceptNewsLetter } from '~/utils/extras';
160154
161155
import { isInvalidEmail } from '@/utils/email';
162156
import {
@@ -200,7 +194,10 @@ const disableUpdateButton = computed(
200194
const passwordHasLowerCase = computed(() => hasLowerCase(passwordInput.value));
201195
const passwordHasUpperCase = computed(() => hasUpperCase(passwordInput.value));
202196
const passwordHasNumber = computed(() => hasNumber(passwordInput.value));
203-
const passwordHasSpecial = computed(() => hasSpecialChar(passwordInput.value));
197+
const passwordHasSpecialCharacter = computed(() =>
198+
hasSpecialChar(passwordInput.value),
199+
);
200+
const passwordHasMinLength = computed(() => hasMinLength(passwordInput.value));
204201
205202
function showWarning() {
206203
showDeleteModal.value = true;

‎frontend/src/utils/password.ts‎

Lines changed: 3 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -25,5 +25,8 @@ export const hasNumber = (password: string) =>
2525
export const hasSpecialChar = (password: string) =>
2626
Boolean(password) && SPECIAL_CHAR_PATTERN.test(password);
2727

28+
export const hasMinLength = (password: string) =>
29+
Boolean(password) && password.length >= PASSWORD_MIN_LENGTH;
30+
2831
export const isInvalidPassword = (password: string) =>
2932
!STRONG_PASSWORD_REGEX.test(password);

0 commit comments

Comments
 (0)