@sowell/quasar-app-extension-auth 0.4.8 → 0.4.10

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (11) hide show
  1. package/package.json +1 -1
  2. package/src/components/dialogs/Message.vue +4 -1
  3. package/src/components/dialogs/SendEmail.vue +3 -0
  4. package/src/components/dialogs/WebSendEmail.vue +6 -3
  5. package/src/components/dialogs/sw-info-dialog.vue +10 -3
  6. package/src/components/pages/Auth.vue +2 -0
  7. package/src/components/pages/AuthReporter.vue +2 -0
  8. package/src/components/pages/OtpValidation.vue +8 -3
  9. package/src/components/pages/ResetPassword.vue +8 -2
  10. package/src/components/pages/WebAuth.vue +15 -4
  11. package/src/components/pages/WebResetPassword.vue +9 -3
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@sowell/quasar-app-extension-auth",
3
- "version": "0.4.8",
3
+ "version": "0.4.10",
4
4
  "description": "A Quasar app extension to manage Authentication",
5
5
  "main": "src/index.js",
6
6
  "repository": "https://github.com/sowell-ai/quasar.extension.auth",
package/src/components/dialogs/Message.vue CHANGED
@@ -1,5 +1,5 @@
1
1
  <template>
2
- <q-card style="max-width: 343px; border-radius: 10px; background: #f4f5f6">
2
+ <q-card style="max-width: 343px; border-radius: 10px; background: #f4f5f6" data-testid="feedback-dialog">
3
3
  <q-card-section class="text-center q-mt-lg">
4
4
  <img
5
5
  v-if="emailSended"
@@ -23,11 +23,13 @@
23
23
  class="text-subtitle1 q-mt-sm q-mb-md text-center text-dark"
24
24
  style="font-size: 24px; font-weight: 600"
25
25
  data-cy="resetErrorMessage"
26
+ data-testid="header-dialog"
26
27
  >
27
28
  {{ messageTitle }}
28
29
  </div>
29
30
  <div
30
31
  data-cy="resetMessage"
32
+ data-testid="message-dialog"
31
33
  class="text-subtitle1 q-mt-sm text-center"
32
34
  style="font-size: 16px; font-weight: 400"
33
35
  >
@@ -57,6 +59,7 @@
57
59
  />
58
60
  <slot>
59
61
  <q-btn
62
+ data-testid="close-btn"
60
63
  class="q-mt-md full-width"
61
64
  unelevated
62
65
  style="background: #fff"
package/src/components/dialogs/SendEmail.vue CHANGED
@@ -2,6 +2,7 @@
2
2
  <q-card
3
3
  class="row justify-center full-height q-pl-sm q-pr-sm"
4
4
  style="background: #f4f5f6"
5
+ data-testid="ask-password-change-form"
5
6
  >
6
7
  <q-page class="column" style="max-width: 447px">
7
8
  <q-card-section>
@@ -40,6 +41,7 @@
40
41
  </div>
41
42
  </div>
42
43
  <q-input
44
+ data-testid="email-input"
43
45
  v-model="email"
44
46
  dense
45
47
  borderless
@@ -56,6 +58,7 @@
56
58
  <q-space class="mobile" />
57
59
  <q-card-actions class="q-ml-lg q-mr-lg q-mb-lg row justify-center">
58
60
  <q-btn
61
+ data-testid="submit-btn"
59
62
  color="primary"
60
63
  :icon="icons.ionPaperPlaneOutline"
61
64
  style="max-width: 330px"
package/src/components/dialogs/WebSendEmail.vue CHANGED
@@ -1,5 +1,5 @@
1
1
  <template>
2
- <q-card>
2
+ <q-card data-testid="ask-password-change-form">
3
3
  <q-page class="row bg-white">
4
4
  <div class="col-6 q-pa-xl row justify-center center">
5
5
  <div class="left-side full-width full-height">
@@ -22,6 +22,7 @@
22
22
  {{ $t("auth.email") }}
23
23
  </div>
24
24
  <q-input
25
+ data-testid="email-input"
25
26
  v-model="email"
26
27
  dense
27
28
  outlined
@@ -31,6 +32,7 @@
31
32
  />
32
33
  <div class="q-mt-lg row justify-between items-center">
33
34
  <q-btn
35
+ data-testid="submit-btn"
34
36
  color="primary"
35
37
  :icon-right="icons.ionPaperPlaneOutline"
36
38
  style="max-width: 330px"
@@ -46,6 +48,7 @@
46
48
  />
47
49
 
48
50
  <q-btn
51
+ data-testid="back-btn"
49
52
  color="primary"
50
53
  style="max-width: 330px"
51
54
  data-cy="close_send_email"
@@ -124,8 +127,8 @@ export default defineComponent({
124
127
  .bg-image {
125
128
  display: none;
126
129
  }
127
- .center{
130
+ .center {
128
131
  width: 100%;
129
132
  }
130
133
  }
131
- </style>
134
+ </style>
package/src/components/dialogs/sw-info-dialog.vue CHANGED
@@ -1,5 +1,5 @@
1
1
  <template>
2
- <q-card>
2
+ <q-card data-testid="feedback-dialog">
3
3
  <q-card-section class="top">
4
4
  <div class="full-width button-close row justify-end">
5
5
  <q-btn
@@ -19,10 +19,16 @@
19
19
  </q-card-section>
20
20
 
21
21
  <q-card-section class="content q-pl-lg q-pr-lg">
22
- <h5 class="q-mt-sm q-mb-md text-center text-dark">
22
+ <h5
23
+ class="q-mt-sm q-mb-md text-center text-dark"
24
+ data-testid="header-dialog"
25
+ >
23
26
  {{ title }}
24
27
  </h5>
25
- <div class="text-subtitle1 q-mt-sm text-center text-dark">
28
+ <div
29
+ class="text-subtitle1 q-mt-sm text-center text-dark"
30
+ data-testid="message-dialog"
31
+ >
26
32
  {{ content }}
27
33
  </div>
28
34
  </q-card-section>
@@ -30,6 +36,7 @@
30
36
  <div>
31
37
  <slot>
32
38
  <q-btn
39
+ data-testid="close-btn"
33
40
  class="bg-white submitBtn"
34
41
  unelevated
35
42
  outline
package/src/components/pages/Auth.vue CHANGED
@@ -98,6 +98,7 @@
98
98
  class="q-mb-lg q-mt-xl text-primary"
99
99
  @click="forgottenPassword = true"
100
100
  data-cy="forgot-password"
101
+ data-testid="ask-password-change-btn"
101
102
  style="font-size: 16px; font-weight: 500; cursor: pointer"
102
103
  >
103
104
  {{ $t("auth.forgottenPassword") }}
@@ -143,6 +144,7 @@
143
144
  transition-show="fade"
144
145
  transition-hide="fade"
145
146
  persistent
147
+ data-testid="ask-password-change-modal"
146
148
  >
147
149
  <send-email @resetPassword="resetPassword" />
148
150
  </q-dialog>
package/src/components/pages/AuthReporter.vue CHANGED
@@ -99,6 +99,7 @@
99
99
  <div
100
100
  class="q-mb-xl q-mt-lg text-primary text-center"
101
101
  @click="forgottenPassword = true"
102
+ data-testid="ask-password-change-btn"
102
103
  data-cy="forgot-password"
103
104
  style="font-size: 14px; cursor: pointer; width: 350px"
104
105
  >
@@ -116,6 +117,7 @@
116
117
  transition-show="fade"
117
118
  transition-hide="fade"
118
119
  persistent
120
+ data-testid="ask-password-change-modal"
119
121
  >
120
122
  <send-email @resetPassword="resetPassword" />
121
123
  </q-dialog>
package/src/components/pages/OtpValidation.vue CHANGED
@@ -27,12 +27,17 @@
27
27
  >
28
28
  {{ $t("auth.subtitleOtpValidation") }}
29
29
  </div>
30
- <q-form class="column form" @submit="onSubmit">
30
+ <q-form
31
+ class="column form"
32
+ data-testid="otp-validation-form"
33
+ @submit="onSubmit"
34
+ >
31
35
  <div>
32
36
  <div class="q-mb-sm" style="font-size: 14px; font-weight: 600">
33
37
  {{ $t("auth.validationCode") }}
34
38
  </div>
35
39
  <q-input
40
+ data-testid="otp-input"
36
41
  v-model="otp"
37
42
  dense
38
43
  :borderless="isReporterUi"
@@ -46,6 +51,7 @@
46
51
  <q-space />
47
52
  <div class="row justify-between">
48
53
  <q-btn
54
+ data-testid="next-btn"
49
55
  :label="$t('auth.next')"
50
56
  color="primary"
51
57
  :loading="loading"
@@ -54,12 +60,11 @@
54
60
  class="submitBtn"
55
61
  data-cy="send-new-otp"
56
62
  :disable="canSubmit"
57
- @click="onSubmit"
58
63
  />
59
64
  <q-btn
65
+ data-testid="back-btn"
60
66
  :label="$t('auth.login')"
61
67
  text-color="primary"
62
- type="submit"
63
68
  no-caps
64
69
  data-cy="login-page"
65
70
  @click="() => router.push(LOCAL_LOGIN_ROUTE)"
package/src/components/pages/ResetPassword.vue CHANGED
@@ -24,12 +24,17 @@
24
24
  >
25
25
  {{ $t("auth.recommendPassword") }}
26
26
  </div>
27
- <q-form class="column form" @submit="onSubmit">
27
+ <q-form
28
+ class="column form"
29
+ @submit="onSubmit"
30
+ data-testid="reset-password-form"
31
+ >
28
32
  <div>
29
33
  <div class="q-mb-sm" style="font-size: 14px; font-weight: 600">
30
34
  {{ $t("auth.newPassword") }}
31
35
  </div>
32
36
  <q-input
37
+ data-testid="password-input"
33
38
  id="password"
34
39
  v-model="password"
35
40
  data-cy="reset-password"
@@ -47,6 +52,7 @@
47
52
  <q-space class="mobile" />
48
53
  <div>
49
54
  <q-btn
55
+ data-testid="submit-btn"
50
56
  :label="$t('common.register')"
51
57
  color="primary"
52
58
  :loading="loading"
@@ -100,7 +106,7 @@ export default defineComponent({
100
106
  validations,
101
107
  onSubmit,
102
108
  goToLoginPage,
103
- icons
109
+ icons,
104
110
  };
105
111
  },
106
112
  });
package/src/components/pages/WebAuth.vue CHANGED
@@ -105,6 +105,7 @@
105
105
  />
106
106
  <div
107
107
  class="cursor-pointer text-primary text-subtitle2"
108
+ data-testid="ask-password-change-btn"
108
109
  data-cy="forgot-password"
109
110
  @click="forgottenPassword = true"
110
111
  >
@@ -140,6 +141,7 @@
140
141
  transition-show="fade"
141
142
  transition-hide="fade"
142
143
  persistent
144
+ data-testid="ask-password-change-modal"
143
145
  >
144
146
  <web-send-email @resetPassword="resetPassword" />
145
147
  </q-dialog>
@@ -151,14 +153,15 @@
151
153
  :isOtp="isOtp"
152
154
  >
153
155
  <q-btn
156
+ :data-testid="infoDialog.canGoNext ? 'next-btn' : 'close-btn'"
154
157
  v-if="isOtp"
155
158
  class="bg-white submitBtn"
156
159
  unelevated
157
160
  outline
158
161
  no-caps
159
- :label="$t('auth.next')"
162
+ :label="infoDialog.canGoNext ? $t('auth.next') : $t('auth.close')"
160
163
  color="primary"
161
- @click="goToOtpValidation"
164
+ @click="handleInfoDialog"
162
165
  v-close-popup
163
166
  />
164
167
  </sw-info-dialog>
@@ -245,6 +248,7 @@ export default defineComponent({
245
248
  await authState.resetPassword(data).then(() => {
246
249
  localStorage.setItem("emailResetPassword", email);
247
250
  infoDialog.value = {
251
+ canGoNext: true,
248
252
  title: t("auth.mailVerificationTitle"),
249
253
  content:
250
254
  IS_OTP.toLowerCase() === "y"
@@ -259,11 +263,12 @@ export default defineComponent({
259
263
  isNotification.value = false;
260
264
 
261
265
  infoDialog.value = {
266
+ canGoNext: false,
262
267
  title: t("auth.userNotFoundTitle"),
263
268
  content: t("auth.userNotFoundSubtitle"),
264
269
  image: "userNotFound",
265
270
  };
266
-
271
+
267
272
  isNotification.value = true;
268
273
  }
269
274
  }
@@ -273,6 +278,12 @@ export default defineComponent({
273
278
  onSubmit("SoWell");
274
279
  };
275
280
 
281
+ const handleInfoDialog = () => {
282
+ if (infoDialog.value.canGoNext) {
283
+ goToOtpValidation()
284
+ }
285
+ }
286
+
276
287
  return {
277
288
  email,
278
289
  infoDialog,
@@ -289,7 +300,7 @@ export default defineComponent({
289
300
  WELCOME_SUBTITLE,
290
301
  WELCOME_TITLE,
291
302
  isSubmitBtnDisabled,
292
- goToOtpValidation,
303
+ handleInfoDialog,
293
304
  retypeEmail,
294
305
  onSubmit,
295
306
  icons,
package/src/components/pages/WebResetPassword.vue CHANGED
@@ -26,12 +26,17 @@
26
26
  >
27
27
  {{ $t("auth.recommendPassword") }}
28
28
  </div>
29
- <q-form class="column form" @submit="onSubmit">
29
+ <q-form
30
+ class="column form"
31
+ @submit="onSubmit"
32
+ data-testid="reset-password-form"
33
+ >
30
34
  <div>
31
35
  <div class="q-mb-sm" style="font-size: 14px; font-weight: 600">
32
36
  {{ $t("auth.newPassword") }}
33
37
  </div>
34
38
  <q-input
39
+ data-testid="password-input"
35
40
  id="password"
36
41
  v-model="password"
37
42
  data-cy="reset-password"
@@ -58,6 +63,7 @@
58
63
  <q-space class="mobile" />
59
64
  <div>
60
65
  <q-btn
66
+ data-testid="submit-btn"
61
67
  :label="$t('common.register')"
62
68
  color="primary"
63
69
  :loading="loading"
@@ -103,7 +109,7 @@ export default defineComponent({
103
109
  canSubmit,
104
110
  onSubmit,
105
111
  goToLoginPage,
106
- icons
112
+ icons,
107
113
  } = useResetPassword();
108
114
 
109
115
  return {
@@ -115,7 +121,7 @@ export default defineComponent({
115
121
  showPassword,
116
122
  goToLoginPage,
117
123
  onSubmit,
118
- icons
124
+ icons,
119
125
  };
120
126
  },
121
127
  });