@paris-ias/list 1.0.137 → 1.0.138

package/dist/runtime/components/news/DenseItem.vue

@@ -1,53 +1,60 @@
 <template>
-  <v-row v-ripple no-gutters class="cursor-pointer highlight-on-hover my-2">
-    <v-col v-if="mdAndUp" align-self="center" cols="1">
-      <MiscAtomsImageContainer
-        cover
-        :loading="$stores.news.loading"
-        :src="
-          item && item.image && item.image.url ? item.image.url : '/default.png'
-        "
-        :ratio="1 / 1"
-        width="80px"
-      />
-    </v-col>
-    <v-col align-self="start" class="text-h5 dense px-2 paragraph">
-      <v-skeleton-loader v-if="rootStore.loading" type="heading" />
-      <template v-else>
-        <v-skeleton-loader
-          v-if="rootStore.loading"
-          :type="
-            ['chip', 'chip@2', 'chip@3', 'chip@4', 'chip@4', 'chip@4'][
-              ['xs', 'sm', 'md', 'lg', 'xl', 'xxl'].indexOf(name || 'md')
-            ]
+  <NuxtLink
+    v-if="pathPrefix"
+    :to="pathPrefix"
+    class="text-decoration-none text-black"
+  >
+    <v-row v-ripple no-gutters class="cursor-pointer highlight-on-hover my-2">
+      <v-col v-if="mdAndUp" align-self="center" cols="1">
+        <MiscAtomsImageContainer
+          cover
+          :loading="isLoading"
+          :src="
+            item && item.image && item.image.url
+              ? item.image.url
+              : '/default.png'
           "
+          :ratio="1 / 1"
+          width="80px"
         />
-
+      </v-col>
+      <v-col align-self="start" class="text-h5 dense px-2 paragraph">
+        <v-skeleton-loader v-if="isLoading" type="heading" />
         <template v-else>
-          <v-chip
-            class="ma-2"
-            style="background-color: white; color: black"
-            size="small"
-            variant="outlined"
-          >
-            {{ $t(eventCategory) }}
-          </v-chip>
-          <MiscMoleculesChipContainer :items="item.tags" size="small" />
+          <v-skeleton-loader
+            v-if="isLoading"
+            :type="
+              ['chip', 'chip@2', 'chip@3', 'chip@4', 'chip@4', 'chip@4'][
+                ['xs', 'sm', 'md', 'lg', 'xl', 'xxl'].indexOf(name || 'md')
+              ]
+            "
+          />
+
+          <template v-else>
+            <v-chip
+              class="ma-2"
+              style="background-color: white; color: black"
+              size="small"
+              variant="outlined"
+            >
+              {{ $t(eventCategory) }}
+            </v-chip>
+            <MiscMoleculesChipContainer :items="item.tags || []" size="small" />
+          </template>
+          <div
+            v-html="
+              $rootStore.search.length
+                ? highlightAndTruncate(
+                    300,
+                    item.name,
+                    $rootStore.search.split(' '),
+                  )
+                : item.name
+            "
+          />
         </template>
-        <div
-          v-html="
-            $rootStore.search.length
-              ? highlightAndTruncate(
-                  300,
-                  item.name,
-                  $rootStore.search.split(' '),
-                )
-              : item.name
-          "
-        />
-      </template>
-    </v-col>
-  </v-row>
+      </v-col> </v-row
+  ></NuxtLink>
 </template>
 
 <script setup>
@@ -73,6 +80,11 @@ const props = defineProps({
     type: String,
     required: true,
   },
+  loading: {
+    type: Boolean,
+    required: false,
+    default: false,
+  },
 })
 const eventCategory = computed(() => {
   if (props.item.category) {
@@ -81,4 +93,6 @@ const eventCategory = computed(() => {
     return "list.filters.news.category.others"
   }
 })
+
+const isLoading = computed(() => props.loading)
 </script>

package/dist/runtime/components/news/RowsItem.vue

@@ -6,7 +6,7 @@
         cover
         :src="item.image.url ? item.image : '/default.png'"
         :ratio="1 / 1"
-        :loading="$stores.news.loading"
+        :loading="isLoading"
       >
         <v-chip class="ma-2" style="background-color: white; color: black">
           {{ $t(eventCategory) }}
@@ -15,7 +15,7 @@
     </v-col>
     <v-col cols="12" md="8" lg="4" class="pl-md-6">
       <v-skeleton-loader
-        v-if="rootStore.loading || $stores['news'].loading"
+        v-if="isLoading"
         :type="
           [
             'heading, subtitle, text@5, ossein, button',
@@ -44,7 +44,7 @@
         </div>
         <MiscMoleculesChipContainer
           v-if="item.tags && item.tags.length"
-          :items="item.tags"
+          :items="item.tags || []"
           class="mt-4"
         />
         <template v-if="mdAndDown">
@@ -74,10 +74,7 @@
     </v-col>
 
     <v-col v-if="lgAndUp" cols="12" lg="5">
-      <v-skeleton-loader
-        v-if="rootStore.loading || $stores.news.loading"
-        type="text@8, ossein, button"
-      />
+      <v-skeleton-loader v-if="isLoading" type="text@8, ossein, button" />
 
       <template v-else>
         <div
@@ -140,6 +137,11 @@ const props = defineProps({
     type: String,
     required: true,
   },
+  loading: {
+    type: Boolean,
+    required: false,
+    default: false,
+  },
 })
 
 const processedSummary = computed(() => {
@@ -155,6 +157,8 @@ function replaceMarkdownLinksWithSlug(markdownText, slugPath) {
     return `[${text}](${slugPath}?redirect=${encodedUrl})`
   })
 }
+
+const isLoading = computed(() => rootStore.loading || props.loading)
 </script>
 
 <style></style>

package/dist/runtime/components/people/DenseItem.vue

@@ -1,14 +1,9 @@
 <template>
-  <v-row
-    v-ripple
-    no-gutters
-    class="cursor-pointer highlight-on-hover my-2"
-    @click="$router.push(pathPrefix)"
-  >
+  <v-row v-ripple no-gutters class="cursor-pointer highlight-on-hover my-2">
     <v-col v-if="mdAndUp" cols="1">
       <MiscAtomsImageContainer
         cover
-        :loading="$stores.people.loading"
+        :loading="isLoading"
         :src="
           item && item.image && item.image.url ? item.image.url : '/default.png'
         "
@@ -17,7 +12,7 @@
       />
     </v-col>
     <v-col align-self="start" class="text-h6 dense px-2">
-      <v-skeleton-loader v-if="rootStore.loading" type="heading" />
+      <v-skeleton-loader v-if="isLoading" type="heading" />
       <div v-else class="d-flex text-h5 align-center">
         <span
           v-html="
@@ -72,7 +67,14 @@ const props = defineProps({
     type: String,
     required: true,
   },
+  loading: {
+    type: Boolean,
+    required: false,
+    default: false,
+  },
 })
+
+const isLoading = computed(() => props.loading)
 </script>
 <style>
 .paragraph{max-width:83ch!important}

package/dist/runtime/components/people/RowsItem.vue

@@ -7,7 +7,7 @@
     <v-col v-if="mdAndUp" cols="12" md="3">
       <MiscAtomsImageContainer
         cover
-        :loading="$stores.people.loading"
+        :loading="isLoading"
         :src="item.image.url ? item.image : '/default.png'"
         :ratio="1 / 1"
       />
@@ -15,7 +15,7 @@
 
     <v-col cols="12" md="8">
       <v-skeleton-loader
-        v-if="$stores.people.loading"
+        v-if="isLoading"
         :type="
           [
             'heading, subtitle, text@5',
@@ -53,9 +53,11 @@
 <script setup>
 import { useDisplay } from "vuetify"
 import { useLocalePath, computed } from "#imports"
+import { useRootStore } from "../../stores/root"
 
 const { name, mdAndUp } = useDisplay()
 const localePath = useLocalePath()
+const rootStore = useRootStore()
 const props = defineProps({
   item: {
     type: Object,
@@ -65,6 +67,11 @@ const props = defineProps({
     type: Number,
     required: true,
   },
+  loading: {
+    type: Boolean,
+    required: false,
+    default: false,
+  },
 })
 const lineClamp = computed(() => {
   let base = [5, 6, 3, 6, 8, 10][
@@ -80,4 +87,6 @@ const lineClamp = computed(() => {
 
   return base
 })
+
+const isLoading = computed(() => rootStore.loading || props.loading)
 </script>

package/dist/runtime/components/projects/DenseItem.vue

@@ -8,7 +8,7 @@
     <v-col v-if="mdAndUp" align-self="center" cols="1">
       <MiscAtomsImageContainer
         cover
-        :loading="$stores.projects.loading"
+        :loading="isLoading"
         :src="
           item && item.image && item.image.url ? item.image.url : '/default.png'
         "
@@ -17,7 +17,7 @@
       />
     </v-col>
     <v-col align-self="center" class="text-h5 dense pl-2">
-      <v-skeleton-loader v-if="rootStore.loading" type="heading" />
+      <v-skeleton-loader v-if="isLoading" type="heading" />
       <span
         v-else
         v-html="
@@ -27,14 +27,14 @@
         "
       />
       <v-skeleton-loader
-        v-if="rootStore.loading"
+        v-if="isLoading"
         :type="
           ['chip', 'chip@2', 'chip@3', 'chip@4', 'chip@4', 'chip@4'][
             ['xs', 'sm', 'md', 'lg', 'xl', 'xxl'].indexOf(name || 'md')
           ]
         "
       />
-      <MiscMoleculesChipContainer :items="item.tags" size="small" />
+      <MiscMoleculesChipContainer :items="item.tags || []" size="small" />
 
       <MDC
         v-if="item.summary"
@@ -68,6 +68,11 @@ const props = defineProps({
     type: String,
     required: true,
   },
+  loading: {
+    type: Boolean,
+    required: false,
+    default: false,
+  },
 })
 const eventCategory = computed(() => {
   if (props.item.category) {
@@ -76,4 +81,6 @@ const eventCategory = computed(() => {
     return "list.filters.news.category.others"
   }
 })
+
+const isLoading = computed(() => props.loading)
 </script>

package/dist/runtime/components/projects/RowsItem.vue

@@ -4,7 +4,7 @@
       <MiscAtomsImageContainer
         contain
         :src="item.image"
-        :loading="$stores.projects.loading"
+        :loading="isLoading"
         :ratio="1 / 1"
       />
     </v-col>
@@ -19,7 +19,7 @@
       @click="router.push(pathPrefix)"
     >
       <v-skeleton-loader
-        v-if="rootStore.loading"
+        v-if="isLoading"
         type="heading,ossein,text@8,ossein,button,button"
       />
 
@@ -75,7 +75,7 @@
 <script setup>
 import { useDisplay } from "vuetify"
 import { useRootStore } from "../../stores/root"
-import { useRouter, useI18n } from "#imports"
+import { useRouter, useI18n, computed } from "#imports"
 
 const { locale } = useI18n()
 
@@ -96,7 +96,14 @@ const props = defineProps({
     type: String,
     required: true,
   },
+  loading: {
+    type: Boolean,
+    required: false,
+    default: false,
+  },
 })
+
+const isLoading = computed(() => rootStore.loading || props.loading)
 </script>
 
 <style lang="scss"></style>

package/dist/runtime/components/publications/DenseItem.vue

@@ -8,7 +8,7 @@
     <v-col v-if="mdAndUp" cols="1" class="align-center">
       <MiscAtomsImageContainer
         cover
-        :loading="$stores.people.loading"
+        :loading="isLoading"
         :src="
           item && item.image && item.image.url ? item.image.url : '/default.png'
         "
@@ -19,7 +19,7 @@
     <v-col class="pl-2">
       <div class="inline-flex flex-row flex-wrap">
         <v-skeleton-loader
-          v-if="rootStore.loading"
+          v-if="isLoading"
           :type="
             ['chip', 'chip@2', 'chip@3', 'chip@4', 'chip@4', 'chip@4'][
               ['xs', 'sm', 'md', 'lg', 'xl', 'xxl'].indexOf(name || 'md')
@@ -47,11 +47,11 @@
           </v-chip>
           <MiscMoleculesChipContainer
             v-if="item.tags && item.tags.length"
-            :items="item.tags"
+            :items="item.tags || []"
             size="small"
           />
         </template>
-        <v-skeleton-loader v-if="rootStore.loading" type="heading" />
+        <v-skeleton-loader v-if="isLoading" type="heading" />
         <span
           v-else
           class="text-h5 dense paragraph"
@@ -76,10 +76,9 @@
 <script setup>
 import { useDisplay } from "vuetify"
 import { useRootStore } from "../../stores/root"
-import { computed, useNuxtApp, useI18n } from "#imports"
+import { computed, useI18n } from "#imports"
 const rootStore = useRootStore()
 
-const { $stores } = useNuxtApp()
 const { name, mdAndUp } = useDisplay()
 const { locale } = useI18n()
 const props = defineProps({
@@ -95,11 +94,15 @@ const props = defineProps({
     type: String,
     required: true,
   },
+  loading: {
+    type: Boolean,
+    required: false,
+    default: false,
+  },
 })
 
 const eventCategory = computed(() => {
   if (props.item.category) {
-    console.log("props.item.category: ", props.item.category)
     return "list.filters.publications.category." + props.item.category
   } else {
     return false
@@ -107,10 +110,11 @@ const eventCategory = computed(() => {
 })
 const eventType = computed(() => {
   if (props.item.type) {
-    console.log("props.item.type: ", props.item.type)
     return "list.filters.publications.type." + props.item.type
   } else {
     return false
   }
 })
+
+const isLoading = computed(() => props.loading)
 </script>

package/dist/runtime/components/publications/RowsItem.vue

@@ -3,7 +3,7 @@
     <MiscAtomsImageContainer
       contain
       :src="item.image.url ? item.image : '/default.png'"
-      :loading="$stores.publications.loading"
+      :loading="isLoading"
       :ratio="1 / 1"
     />
   </v-col>
@@ -19,7 +19,7 @@
   >
     <div>
       <v-skeleton-loader
-        v-if="$stores.publications.loading"
+        v-if="isLoading"
         type="heading,ossein,text@8,ossein,button,button"
       />
 
@@ -77,10 +77,11 @@
 
 <script setup>
 import { useDisplay } from "vuetify"
-import { useNuxtApp, useI18n, useRouter } from "#imports"
+import { useRouter, computed } from "#imports"
+import { useRootStore } from "../../stores/root"
 
 const { name } = useDisplay()
-const { $stores } = useNuxtApp()
+const rootStore = useRootStore()
 const router = useRouter()
 const props = defineProps({
   item: {
@@ -94,7 +95,14 @@ const props = defineProps({
     type: String,
     required: true,
   },
+  loading: {
+    type: Boolean,
+    required: false,
+    default: false,
+  },
 })
+
+const isLoading = computed(() => rootStore.loading || props.loading)
 </script>
 
 <style lang="scss"></style>

package/dist/runtime/components/tags/RowsItem.vue

@@ -1,18 +1,31 @@
 <template>
-  {{ item }}
+  <v-row
+    class="highlight-on-hover pa-3"
+    no-gutters
+    @click="$router.push(pathPrefix)"
+  >
+    <v-col cols="12" class="px-6">
+      <v-skeleton-loader v-if="isLoading" type="heading, text@6" />
+      <template v-else>
+        <div class="text-h6">{{ item.name }}</div>
+      </template>
+    </v-col>
+  </v-row>
+  <v-divider />
 </template>
 
 <script setup>
-defineProps({
-  item: {
-    type: Object,
-    required: true,
-  },
-  pathPrefix: {
-    type: String,
-    required: true,
-  },
+import { computed } from "#imports"
+import { useRootStore } from "../../stores/root"
+
+const rootStore = useRootStore()
+const props = defineProps({
+  item: { type: Object, required: true },
+  pathPrefix: { type: String, required: true },
+  loading: { type: Boolean, default: false },
 })
+
+const isLoading = computed(() => rootStore.loading || props.loading)
 </script>
 
 <style></style>

package/dist/runtime/components/users/DenseItem.vue

@@ -1,18 +1,32 @@
 <template>
-  {{ item }}
+  <v-row
+    class="my-2 highlight-on-hover"
+    no-gutters
+    @click="$router.push(pathPrefix)"
+  >
+    <v-col cols="12" class="px-4">
+      <v-skeleton-loader v-if="isLoading" type="heading, text@6" />
+      <template v-else>
+        <div class="text-h6">{{ item.name }}</div>
+        <div v-if="item.email" class="text-body-2 mt-1">{{ item.email }}</div>
+      </template>
+    </v-col>
+  </v-row>
+  <v-divider />
 </template>
 
 <script setup>
-defineProps({
-  item: {
-    type: Object,
-    required: true,
-  },
-  pathPrefix: {
-    type: String,
-    required: true,
-  },
+import { computed } from "#imports"
+import { useRootStore } from "../../stores/root"
+
+const rootStore = useRootStore()
+const props = defineProps({
+  item: { type: Object, required: true },
+  pathPrefix: { type: String, required: true },
+  loading: { type: Boolean, default: false },
 })
+
+const isLoading = computed(() => rootStore.loading || props.loading)
 </script>
 
 <style></style>

package/dist/runtime/components/users/RowsItem.vue

@@ -1,18 +1,32 @@
 <template>
-  {{ item }}
+  <v-row
+    class="highlight-on-hover pa-3"
+    no-gutters
+    @click="$router.push(pathPrefix)"
+  >
+    <v-col cols="12" class="px-6">
+      <v-skeleton-loader v-if="isLoading" type="heading, text@8, button" />
+      <template v-else>
+        <div class="text-h6">{{ item.name }}</div>
+        <div v-if="item.email" class="text-body-2 mt-1">{{ item.email }}</div>
+      </template>
+    </v-col>
+  </v-row>
+  <v-divider />
 </template>
 
 <script setup>
-defineProps({
-  item: {
-    type: Object,
-    required: true,
-  },
-  pathPrefix: {
-    type: String,
-    required: true,
-  },
+import { computed } from "#imports"
+import { useRootStore } from "../../stores/root"
+
+const rootStore = useRootStore()
+const props = defineProps({
+  item: { type: Object, required: true },
+  pathPrefix: { type: String, required: true },
+  loading: { type: Boolean, default: false },
 })
+
+const isLoading = computed(() => rootStore.loading || props.loading)
 </script>
 
 <style></style>

package/dist/runtime/composables/useUtils.js

@@ -49,7 +49,7 @@ export const formatDateValue = (date, locale) => {
 export const highlightAndTruncate = (stop, text, query) => {
   try {
     if (!text) {
-      return "toto";
+      return "";
     }
     if (query?.length && query[0]?.length) {
       if (text.length > stop) {

package/dist/runtime/plugins/pinia.js

@@ -1,6 +1,6 @@
 import { createDynamicStore } from "../stores/factory.js";
 import { useRootStore } from "../stores/root.js";
-import { defineNuxtPlugin, useAppConfig } from "#app";
+import { defineNuxtPlugin, useAppConfig } from "#imports";
 export default defineNuxtPlugin(async (nuxtApp) => {
   const appConfig = useAppConfig();
   const moduleImports = {
@@ -107,6 +107,8 @@ export default defineNuxtPlugin(async (nuxtApp) => {
   const stores = {};
   const queries = {};
   const models = {};
+  const rootStore = useRootStore();
+  rootStore.setLoading(true);
   const builtFilters = await import("../public/filters.json");
   console.log("INITIALIZING STORES");
   await Promise.all(
@@ -125,7 +127,8 @@ export default defineNuxtPlugin(async (nuxtApp) => {
       }
     })
   );
-  const rootStore = useRootStore();
+  console.log(" STORES LOADED");
+  rootStore.setLoading(false);
   nuxtApp.provide("models", models);
   nuxtApp.provide("rootStore", rootStore);
   nuxtApp.provide("stores", stores);