@live-change/user-frontend 0.9.38 → 0.9.40

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.
@@ -4,9 +4,9 @@
4
4
  :to="{ name: 'user:profile', params: { user: owner } }"
5
5
  v-ripple
6
6
  :class="inline ? inlineClass : blockClass">
7
- <Image v-if="userData?.image" :image="userData.image" class="mr-2 rounded-full"
7
+ <Image v-if="userData?.image" :image="userData.image" class="mr-2 rounded-full inline"
8
8
  :style="imageStyle"/>
9
- <img v-else :src="identiconUrl" class="mr-2 rounded-full" :style="imageStyle" domResize />
9
+ <img v-else :src="identiconUrl" class="mr-2 rounded-full inline" :style="imageStyle" domResize />
10
10
  <span class="text-ellipsis whitespace-nowrap overflow-hidden"
11
11
  :class="[ ownerType === 'user_User' ? 'font-medium' : 'font-italic' ]">
12
12
  {{ name }}
@@ -20,9 +20,9 @@
20
20
  </span>
21
21
  </span>
22
22
  <span v-else :class="inline ? inlineClass : blockClass">
23
- <Image v-if="userData?.image" :image="userData.image" class="mr-2 rounded-full"
23
+ <Image v-if="userData?.image" :image="userData.image" class="mr-2 rounded-full inline"
24
24
  :style="imageStyle"/>
25
- <img v-else :src="identiconUrl" class="mr-2 rounded-full" :style="imageStyle" domResize />
25
+ <img v-else :src="identiconUrl" class="mr-2 rounded-full inline" :style="imageStyle" domResize />
26
26
  <span class="text-ellipsis whitespace-nowrap overflow-hidden"
27
27
  :class="[ ownerType === 'user_User' ? 'font-medium' : 'font-italic' ]">
28
28
  {{ name }}
@@ -12,8 +12,9 @@
12
12
  class="mr-0 rounded-full border-1 border-surface-400 dark:border-surface-600 w-12 max-w-none" />
13
13
  </span>
14
14
  </a>
15
- <div class="align-items-center flex-grow-1 justify-content-between hidden absolute w-full md:w-auto bg-surface-0
16
- right-0 top-full z-5 shadow">
15
+ <div class="align-items-center flex-grow-1 justify-content-between hidden absolute w-full md:w-auto
16
+ bg-surface-0 dark:bg-surface-950 dark:border-1 dark:border-surface-800
17
+ right-0 top-full z-5 shadow">
17
18
  <loading-zone suspense>
18
19
  <template v-slot:loading>
19
20
  <div class="flex items-center justify-center top-0 left-0 notifications-loading">
@@ -3,8 +3,9 @@
3
3
  <li>
4
4
  <router-link :to="{ name: 'user:identification' }"
5
5
  v-ripple
6
- class="flex px-6 py-2 items-center text-surface-600 hover:text-surface-900
7
- hover:bg-surface-100
6
+ class="flex px-6 py-2 items-center
7
+ text-surface-600 hover:text-surface-900 hover:bg-surface-100
8
+ dark:text-surface-400 dark:hover:text-surface-100 dark:hover:bg-surface-800
8
9
  font-medium border-round cursor-pointer transition-colors transition-duration-150 p-ripple no-underline"
9
10
  >
10
11
  <i class="pi pi-user mr-3"></i>
@@ -14,7 +15,9 @@
14
15
  <li v-if="!client.user">
15
16
  <router-link :to="{ name: 'user:signUpEmail' }"
16
17
  v-ripple
17
- class="flex px-6 py-2 items-center text-surface-600 hover:text-surface-900 hover:bg-surface-100
18
+ class="flex px-6 py-2 items-center
19
+ text-surface-600 hover:text-surface-900 hover:bg-surface-100
20
+ dark:text-surface-400 dark:hover:text-surface-100 dark:hover:bg-surface-800
18
21
  font-medium border-round cursor-pointer p-ripple no-underline
19
22
  transition-colors duration-300 ease-in-out"
20
23
  >
@@ -25,7 +28,9 @@
25
28
  <li v-if="!client.user">
26
29
  <router-link :to="{ name: 'user:signInEmail' }"
27
30
  v-ripple
28
- class="flex px-6 py-2 items-center text-surface-600 hover:text-surface-900 hover:bg-surface-100
31
+ class="flex px-6 py-2 items-center
32
+ text-surface-600 hover:text-surface-900 hover:bg-surface-100
33
+ dark:text-surface-400 dark:hover:text-surface-100 dark:hover:bg-surface-800
29
34
  font-medium border-round cursor-pointer p-ripple no-underline
30
35
  transition-colors duration-300 ease-in-out"
31
36
  >
@@ -36,7 +41,9 @@
36
41
  <li v-if="client.user">
37
42
  <router-link :to="{ name: 'user:settings' }"
38
43
  v-ripple
39
- class="flex px-6 py-2 items-center text-surface-600 hover:text-surface-900 hover:bg-surface-100
44
+ class="flex px-6 py-2 items-center
45
+ text-surface-600 hover:text-surface-900 hover:bg-surface-100
46
+ dark:text-surface-400 dark:hover:text-surface-100 dark:hover:bg-surface-800
40
47
  font-medium border-round cursor-pointer p-ripple no-underline
41
48
  transition-colors duration-300 ease-in-out"
42
49
  >
@@ -47,7 +54,9 @@
47
54
  <li v-if="client.user">
48
55
  <router-link :to="{ name: 'user:signOut' }"
49
56
  v-ripple
50
- class="flex px-6 py-2 items-center text-surface-600 hover:text-surface-900 hover:bg-surface-100
57
+ class="flex px-6 py-2 items-center
58
+ text-surface-600 hover:text-surface-900 hover:bg-surface-100
59
+ dark:text-surface-400 dark:hover:text-surface-100 dark:hover:bg-surface-800
51
60
  font-medium border-round cursor-pointer p-ripple no-underline
52
61
  transition-colors duration-300 ease-in-out"
53
62
  >
@@ -2,7 +2,7 @@
2
2
  <a v-if="unreadNotificationsCount"
3
3
  v-ripple
4
4
  v-styleclass="{ selector: '@next', enterFromClass: 'hidden', leaveToClass: 'hidden', hideOnOutsideClick: true }"
5
- class="flex mx-0 pl-4 pr-6 pt-3 pb-2 items-center text-surface-500 dark:text-surface-400
5
+ class="flex mx-0 pl-4 pr-6 pt-4 pb-2 items-center text-surface-500 dark:text-surface-400
6
6
  hover:text-surface-900 hover:dark:text-surface-100 overflow-visible
7
7
  font-medium border-round cursor-pointer transition-colors transition-duration-150 p-ripple">
8
8
  <OverlayBadge v-if="unreadNotificationsCount?.count" :value="unreadNotificationsCount?.count ?? 0" size="small">
@@ -78,6 +78,7 @@
78
78
  import Portal from 'primevue/portal';
79
79
  import BaseInput from '@primevue/core/baseinput';
80
80
  import PasswordStyle from 'primevue/password/style';
81
+ import { useId } from 'vue';
81
82
 
82
83
  export default {
83
84
  name: 'Password',
@@ -224,6 +225,12 @@
224
225
  inject: {
225
226
  $pcFluid: { default: null }
226
227
  },
228
+ setup() {
229
+ const uid = useId()
230
+ return {
231
+ uid
232
+ }
233
+ },
227
234
  data() {
228
235
  return {
229
236
  overlayVisible: false,
@@ -453,7 +460,7 @@
453
460
  return this.promptLabel || this.$primevue.config.locale.passwordPrompt;
454
461
  },
455
462
  overlayUniqueId() {
456
- return this.$id + '_overlay';
463
+ return this.uid + '_overlay';
457
464
  }
458
465
  },
459
466
  watch: {
@@ -60,8 +60,9 @@ import { client as useClient } from '@live-change/vue3-ssr'
60
60
 
61
61
  export function installUserRedirects(router, app, config) {
62
62
  const client = useClient(app._context)
63
- if(typeof window === 'undefined') return
64
- router.beforeEach(async (to, from) => {
63
+ router.afterEach(async (to, from) => {
64
+ console.log("AFTER EACH", to, from)
65
+ if(typeof window === 'undefined') return
65
66
  if(to?.matched.find(m => m?.meta.signedIn)) {
66
67
  if(!client.value.user) {
67
68
  console.log("REDIRECT TO LOGIN BECAUSE PAGE REQUIRES LOGIN!")
@@ -72,15 +73,12 @@ export function installUserRedirects(router, app, config) {
72
73
  query: to.query,
73
74
  hash: to.hash
74
75
  })
76
+ setTimeout(() => {
77
+ router.push({ name: 'user:signInEmail' })
78
+ }, 50)
75
79
  return { name: 'user:signInEmail' }
76
80
  }
77
81
  }
78
- if(to?.matched.find(m => m?.meta.signedOut)) {
79
- if(client.value.user) {
80
- console.log("REDIRECT TO USER INDEX BECAUSE PAGE REQUIRES LOGOUT!")
81
- return { name: 'user:settings' }
82
- }
83
- }
84
82
  if(to && to.name === 'user:signInEmail' && from?.matched.find(m => m?.meta.saveForSignIn)) {
85
83
  console.log("SAVE FOR LOGIN", from)
86
84
  localStorage.redirectAfterSignIn = JSON.stringify({
@@ -91,6 +89,14 @@ export function installUserRedirects(router, app, config) {
91
89
  })
92
90
  }
93
91
  })
92
+ router.beforeEach(async (to, from) => {
93
+ if(to?.matched.find(m => m?.meta.signedOut)) {
94
+ if(client.value.user) {
95
+ console.log("REDIRECT TO USER INDEX BECAUSE PAGE REQUIRES LOGOUT!")
96
+ return { name: 'user:settings' }
97
+ }
98
+ }
99
+ })
94
100
  }
95
101
 
96
102
  export function createRouter(app, config) {
@@ -1,7 +1,11 @@
1
1
  <template>
2
- <div class="flex relative lg:static bg-surface-50 dark:bg-surface-950" style="height: calc(100vh - 88px)">
3
- <div id="settings-menu" class="bg-surface-0 hidden flex-shrink-0 absolute left-0 h-full
4
- top-0 z-1 border-r-1 border-r-surface-300 dark:border-r-surface-750 select-none md:static md:block" style="width:280px">
2
+ <div class="flex relative lg:static bg-surface-50 dark:bg-surface-950"
3
+ style="height: calc(100vh - 88px)">
4
+ <div id="settings-menu"
5
+ class="bg-surface-0 dark:bg-surface-950 flex-shrink-0 absolute left-0 h-full
6
+ top-0 z-1 border-r-1 border-r-surface-300 dark:border-r-surface-700 select-none
7
+ hidden md:static md:block"
8
+ style="width:280px">
5
9
  <SettingsMenu />
6
10
  </div>
7
11
 
@@ -1,10 +1,11 @@
1
1
  <template>
2
2
  <li class="block">
3
3
  <router-link :to="{ name }"
4
- :class="route.name == name ? 'text-blue-500' : 'text-700'"
4
+ :class="route.name == name ? 'text-primary-500 dark:text-primary-300' : 'text-surface-700 dark:text-surface-300'"
5
5
  v-ripple
6
- class="flex align-items-center cursor-pointer p-3 hover:surface-100
7
- border-round transition-colors transition-duration-150 p-ripple no-underline">
6
+ class="flex align-items-center cursor-pointer p-3
7
+ hover:bg-surface-100 dark:hover:bg-surface-800
8
+ rounded-border transition-colors transition-duration-150 p-ripple no-underline">
8
9
  <i class="pi mr-2" :class="'pi-'+icon"></i>
9
10
  <span class="font-medium">{{ label }}</span>
10
11
  </router-link>
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@live-change/user-frontend",
3
- "version": "0.9.38",
3
+ "version": "0.9.40",
4
4
  "scripts": {
5
5
  "memDev": "node --inspect --expose-gc server/start.js memDev --enableSessions --initScript ./init.js --dbAccess",
6
6
  "localDevInit": "rm tmp.db; node server/start.js localDev --enableSessions --initScript ./init.js",
@@ -22,29 +22,29 @@
22
22
  },
23
23
  "type": "module",
24
24
  "dependencies": {
25
- "@live-change/cli": "^0.9.38",
26
- "@live-change/dao": "^0.9.38",
27
- "@live-change/dao-vue3": "^0.9.38",
28
- "@live-change/dao-websocket": "^0.9.38",
29
- "@live-change/email-service": "^0.9.38",
30
- "@live-change/framework": "^0.9.38",
31
- "@live-change/identicon-service": "^0.9.38",
32
- "@live-change/image-frontend": "^0.9.38",
33
- "@live-change/message-authentication-service": "^0.9.38",
34
- "@live-change/notification-service": "^0.9.38",
35
- "@live-change/password-authentication-service": "^0.9.38",
36
- "@live-change/pattern": "^0.9.38",
37
- "@live-change/secret-code-service": "^0.9.38",
38
- "@live-change/secret-link-service": "^0.9.38",
39
- "@live-change/security-frontend": "^0.9.38",
40
- "@live-change/security-service": "^0.9.38",
41
- "@live-change/session-service": "^0.9.38",
42
- "@live-change/timer-service": "^0.9.38",
43
- "@live-change/upload-service": "^0.9.38",
44
- "@live-change/user-identification-service": "^0.9.38",
45
- "@live-change/user-service": "^0.9.38",
46
- "@live-change/vue3-components": "^0.9.38",
47
- "@live-change/vue3-ssr": "^0.9.38",
25
+ "@live-change/cli": "^0.9.40",
26
+ "@live-change/dao": "^0.9.40",
27
+ "@live-change/dao-vue3": "^0.9.40",
28
+ "@live-change/dao-websocket": "^0.9.40",
29
+ "@live-change/email-service": "^0.9.40",
30
+ "@live-change/framework": "^0.9.40",
31
+ "@live-change/identicon-service": "^0.9.40",
32
+ "@live-change/image-frontend": "^0.9.40",
33
+ "@live-change/message-authentication-service": "^0.9.40",
34
+ "@live-change/notification-service": "^0.9.40",
35
+ "@live-change/password-authentication-service": "^0.9.40",
36
+ "@live-change/pattern": "^0.9.40",
37
+ "@live-change/secret-code-service": "^0.9.40",
38
+ "@live-change/secret-link-service": "^0.9.40",
39
+ "@live-change/security-frontend": "^0.9.40",
40
+ "@live-change/security-service": "^0.9.40",
41
+ "@live-change/session-service": "^0.9.40",
42
+ "@live-change/timer-service": "^0.9.40",
43
+ "@live-change/upload-service": "^0.9.40",
44
+ "@live-change/user-identification-service": "^0.9.40",
45
+ "@live-change/user-service": "^0.9.40",
46
+ "@live-change/vue3-components": "^0.9.40",
47
+ "@live-change/vue3-ssr": "^0.9.40",
48
48
  "@vueuse/core": "^12.3.0",
49
49
  "codeceptjs-assert": "^0.0.5",
50
50
  "codeceptjs-video-helper": "0.1.3",
@@ -65,7 +65,7 @@
65
65
  "wtfnode": "^0.9.1"
66
66
  },
67
67
  "devDependencies": {
68
- "@live-change/codeceptjs-helper": "^0.9.38",
68
+ "@live-change/codeceptjs-helper": "^0.9.40",
69
69
  "codeceptjs": "^3.6.10",
70
70
  "generate-password": "1.7.1",
71
71
  "playwright": "1.49.1",
@@ -76,5 +76,5 @@
76
76
  "author": "Michał Łaszczewski <michal@laszczewski.pl>",
77
77
  "license": "BSD-3-Clause",
78
78
  "description": "",
79
- "gitHead": "9b2e398863273d9bc51b54df30b498a2da154c98"
79
+ "gitHead": "d25366854a7a30557fd8f8e428a2e02cabb5b323"
80
80
  }