@live-change/user-frontend 0.9.127 → 0.9.129

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.
@@ -25,17 +25,10 @@
25
25
  </li>
26
26
  <li v-for="account in accounts"
27
27
  class="flex flex-row items-center justify-between mb-2">
28
- <div v-if="account.accountType.accountType === 'google'"
29
- class="flex flex-row items-center">
30
- <i class="pi pi-google mr-2"></i>
31
- <span class="block text-surface-900 dark:text-surface-0 font-medium text-lg">{{ account.email }}</span>
32
- </div>
33
- <div v-else-if="account.accountType.accountType === 'linkedin'"
34
- class="flex flex-row items-center">
35
- <i class="pi pi-linkedin mr-2"></i>
36
- <span class="block text-surface-900 dark:text-surface-0 font-medium text-lg">{{ account.name }}</span>
37
- </div>
38
- <pre v-else>{{ account }}</pre>
28
+ <InjectComponent
29
+ :request="{ name: 'connectedAccountItem', accountType: account.accountType.accountType }"
30
+ :defaultComponent="UnknownAccountItem"
31
+ :props="{ account }" />
39
32
  <Button class="p-button-text p-button-plain p-button-rounded mr-1" icon="pi pi-times"
40
33
  v-if="canDelete"
41
34
  @click="event => disconnectAccount(event, account, account.email)" />
@@ -43,7 +36,7 @@
43
36
 
44
37
  </ul>
45
38
 
46
- <div class="flex flex-row flex-wrap">
39
+ <div class="flex flex-row flex-wrap">
47
40
  <router-link v-for="contactType in contactsTypes"
48
41
  :to="{ name: 'user:connect-'+contactType.contactType }" class="mr-2 no-underline block mb-1">
49
42
  <Button v-if="contactType.contactType === 'email'"
@@ -52,10 +45,12 @@
52
45
  :label="'Add '+contactType.contactType" icon="pi pi-phone" id="connect" />
53
46
  <Button v-else :label="'Add '+contactType.contactType" icon="pi pi-envelope" id="connect" />
54
47
  </router-link>
55
- <router-link v-for="accountType in accountTypes"
56
- :to="{ name: 'user:connect-'+accountType.accountType }" class="mr-2 no-underline block mb-1">
57
- <Button v :label="'Add '+accountType.accountType" icon="pi pi-google" id="connect" />
58
- </router-link>
48
+ <template v-for="accountType in accountTypes">
49
+ <router-link v-if="connectAccountRoute(accountType)"
50
+ :to="connectAccountRoute(accountType)" class="mr-2 no-underline block mb-1">
51
+ <Button v :label="'Add '+accountType.accountType" icon="pi pi-google" id="connect" />
52
+ </router-link>
53
+ </template>
59
54
 
60
55
  </div>
61
56
  </div>
@@ -66,6 +61,15 @@
66
61
  <script setup>
67
62
  import Button from "primevue/button"
68
63
 
64
+ import { provideComponent, InjectComponent } from '@live-change/vue3-components'
65
+ import GoogleAccountItem from './accountTypes/GoogleAccountItem.vue'
66
+ import LinkedinAccountItem from './accountTypes/LinkedinAccountItem.vue'
67
+
68
+ provideComponent({ name: 'connectedAccountItem', accountType: 'google' }, GoogleAccountItem)
69
+ provideComponent({ name: 'connectedAccountItem', accountType: 'linkedin' }, LinkedinAccountItem)
70
+ import UnknownAccountItem from './accountTypes/UnknownAccountItem.vue'
71
+
72
+
69
73
  import { ref, onMounted, onUnmounted, inject, computed } from 'vue'
70
74
  import ConfirmPopup from 'primevue/confirmpopup'
71
75
  import Toast from 'primevue/toast'
@@ -77,6 +81,9 @@
77
81
  onMounted(() => isMounted.value = true)
78
82
  onUnmounted(() => isMounted.value = false)
79
83
 
84
+ import { useRouter } from 'vue-router'
85
+ const router = useRouter()
86
+
80
87
  import { formatPhoneNumber } from '../phone/phoneNumber.js'
81
88
 
82
89
  const workingZone = inject('workingZone')
@@ -155,6 +162,13 @@
155
162
  const allAccountsCount = computed(() => contacts.value?.length + accounts.value?.length )
156
163
  const canDelete = computed(() => allAccountsCount.value > 1 )
157
164
 
165
+ function connectAccountRoute(accountType) {
166
+ const route = { name: 'user:connect-'+accountType.accountType }
167
+ /// Check if the route is registered in the router
168
+ const routeExists = router.getRoutes().find(r => r.name === route.name)
169
+ return routeExists ? route : null
170
+ }
171
+
158
172
  </script>
159
173
 
160
174
  <style>
@@ -0,0 +1,20 @@
1
+ <template>
2
+ <div class="flex flex-row items-center">
3
+ <i class="pi pi-google mr-2"></i>
4
+ <span class="block text-surface-900 dark:text-surface-0 font-medium text-lg">{{ account.email }}</span>
5
+ </div>
6
+ </template>
7
+
8
+ <script setup>
9
+ import { toRefs, computed, defineProps } from 'vue'
10
+
11
+ const props = defineProps({
12
+ account: {
13
+ type: Object,
14
+ required: true
15
+ }
16
+ })
17
+
18
+ const { account } = toRefs(props)
19
+
20
+ </script>
@@ -0,0 +1,19 @@
1
+ <template>
2
+ <div class="flex flex-row items-center">
3
+ <i class="pi pi-linkedin mr-2"></i>
4
+ <span class="block text-surface-900 dark:text-surface-0 font-medium text-lg">{{ account.name }}</span>
5
+ </div>
6
+ </template>
7
+
8
+ <script setup>
9
+ import { toRefs, computed, defineProps } from 'vue'
10
+
11
+ const props = defineProps({
12
+ account: {
13
+ type: Object,
14
+ required: true
15
+ }
16
+ })
17
+
18
+ const { account } = toRefs(props)
19
+ </script>
@@ -0,0 +1,25 @@
1
+ <template>
2
+ <div class="flex flex-row items-center">
3
+ <i class="pi pi-question-circle mr-2"></i>
4
+ <span class="block text-surface-900 dark:text-surface-0 font-medium text-lg">{{ cleanAccountInfo }}</span>
5
+ </div>
6
+ </template>
7
+
8
+ <script setup>
9
+ import { toRefs, computed, defineProps } from 'vue'
10
+
11
+ const props = defineProps({
12
+ account: {
13
+ type: Object,
14
+ required: true
15
+ }
16
+ })
17
+
18
+ const { account } = toRefs(props)
19
+
20
+ const cleanAccountInfo = computed(() => {
21
+ if(!account.value) return "Unknown account"
22
+ const { accountType, ...rest } = account.value
23
+ return { ...rest, accountType: accountType.accountType }
24
+ })
25
+ </script>
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@live-change/user-frontend",
3
- "version": "0.9.127",
3
+ "version": "0.9.129",
4
4
  "scripts": {
5
5
  "memDev": "tsx --inspect --expose-gc server/start.js memDev --enableSessions --initScript ./init.js --dbAccess",
6
6
  "localDevInit": "tsx server/start.js localDev --enableSessions --initScript ./init.js --dbAccess",
@@ -36,29 +36,29 @@
36
36
  },
37
37
  "type": "module",
38
38
  "dependencies": {
39
- "@live-change/cli": "^0.9.127",
40
- "@live-change/dao": "^0.9.127",
41
- "@live-change/dao-vue3": "^0.9.127",
42
- "@live-change/dao-websocket": "^0.9.127",
43
- "@live-change/email-service": "^0.9.127",
44
- "@live-change/framework": "^0.9.127",
45
- "@live-change/identicon-service": "^0.9.127",
46
- "@live-change/image-frontend": "^0.9.127",
47
- "@live-change/message-authentication-service": "^0.9.127",
48
- "@live-change/notification-service": "^0.9.127",
49
- "@live-change/password-authentication-service": "^0.9.127",
50
- "@live-change/pattern": "^0.9.127",
51
- "@live-change/secret-code-service": "^0.9.127",
52
- "@live-change/secret-link-service": "^0.9.127",
53
- "@live-change/security-frontend": "^0.9.127",
54
- "@live-change/security-service": "^0.9.127",
55
- "@live-change/session-service": "^0.9.127",
56
- "@live-change/timer-service": "^0.9.127",
57
- "@live-change/upload-service": "^0.9.127",
58
- "@live-change/user-identification-service": "^0.9.127",
59
- "@live-change/user-service": "^0.9.127",
60
- "@live-change/vue3-components": "^0.9.127",
61
- "@live-change/vue3-ssr": "^0.9.127",
39
+ "@live-change/cli": "^0.9.129",
40
+ "@live-change/dao": "^0.9.129",
41
+ "@live-change/dao-vue3": "^0.9.129",
42
+ "@live-change/dao-websocket": "^0.9.129",
43
+ "@live-change/email-service": "^0.9.129",
44
+ "@live-change/framework": "^0.9.129",
45
+ "@live-change/identicon-service": "^0.9.129",
46
+ "@live-change/image-frontend": "^0.9.129",
47
+ "@live-change/message-authentication-service": "^0.9.129",
48
+ "@live-change/notification-service": "^0.9.129",
49
+ "@live-change/password-authentication-service": "^0.9.129",
50
+ "@live-change/pattern": "^0.9.129",
51
+ "@live-change/secret-code-service": "^0.9.129",
52
+ "@live-change/secret-link-service": "^0.9.129",
53
+ "@live-change/security-frontend": "^0.9.129",
54
+ "@live-change/security-service": "^0.9.129",
55
+ "@live-change/session-service": "^0.9.129",
56
+ "@live-change/timer-service": "^0.9.129",
57
+ "@live-change/upload-service": "^0.9.129",
58
+ "@live-change/user-identification-service": "^0.9.129",
59
+ "@live-change/user-service": "^0.9.129",
60
+ "@live-change/vue3-components": "^0.9.129",
61
+ "@live-change/vue3-ssr": "^0.9.129",
62
62
  "@vueuse/core": "^12.3.0",
63
63
  "codeceptjs-assert": "^0.0.5",
64
64
  "codeceptjs-video-helper": "0.1.3",
@@ -79,7 +79,7 @@
79
79
  "wtfnode": "^0.9.1"
80
80
  },
81
81
  "devDependencies": {
82
- "@live-change/codeceptjs-helper": "^0.9.127",
82
+ "@live-change/codeceptjs-helper": "^0.9.129",
83
83
  "codeceptjs": "^3.6.10",
84
84
  "generate-password": "1.7.1",
85
85
  "playwright": "1.49.1",
@@ -90,5 +90,5 @@
90
90
  "author": "Michał Łaszczewski <michal@laszczewski.pl>",
91
91
  "license": "BSD-3-Clause",
92
92
  "description": "",
93
- "gitHead": "acd85c886f4086b2d559eb40b5343f05d64ff294"
93
+ "gitHead": "243c2cc85e556cd6f4de4cf65ae4bf8cb8d584a6"
94
94
  }