@paris-ias/list 1.0.136 → 1.0.138

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

@@ -1,14 +1,9 @@
 <template>
-  <v-row
-    v-ripple
-    no-gutters
-    class="cursor-pointer highlight-on-hover my-2"
-    @click="$router.push(localePath('/activities/events/' + item.slug[locale]))"
-  >
+  <v-row v-ripple no-gutters class="cursor-pointer highlight-on-hover my-2">
     <v-col v-if="mdAndUp" cols="1">
       <MiscAtomsDateStamp
         v-if="item.start"
-        :loading="$stores['events'].loading"
+        :loading="isLoading"
         :date-start="item.start"
         :date-stop="item.stop"
         class="pr-6 mt-md-2"
@@ -17,14 +12,11 @@
     <v-col v-if="mdAndUp" cols="1">
       <MiscAtomsImageContainer
         cover
-        :loading="$stores.events.loading"
+        :loading="isLoading"
         :src="
           item && item.image && item.image.url ? item.image.url : '/default.png'
         "
         :ratio="1 / 1"
-        :name="item.name"
-        :slug="item.slug && item.slug[locale]"
-        link="events-slug"
         :width="80"
       />
     </v-col>
@@ -63,25 +55,26 @@
         :value="`${highlightAndTruncate(
           85,
           item.summary,
-          $rootStore.search.split(' ')
+          $rootStore.search.split(' '),
         )}`"
       />
     </v-col>
 
     <v-col align-self="center" cols="auto">
-      <EventsBadges :item />
+      <EventsBadges :item :pathPrefix />
     </v-col>
   </v-row>
 </template>
 
 <script setup>
-import { useLocalePath, useI18n, useNuxtApp } from "#imports"
+import { useI18n, useNuxtApp, computed } from "#imports"
 import { useDisplay } from "vuetify"
+import { useRootStore } from "../../stores/root"
 const { $rootStore } = useNuxtApp()
-const { smAndDown, mdAndUp, lgAndUp } = useDisplay()
+const { smAndDown, mdAndUp } = useDisplay()
 
 const { locale } = useI18n()
-const localePath = useLocalePath()
+const rootStore = useRootStore()
 const props = defineProps({
   item: {
     type: Object,
@@ -91,5 +84,22 @@ const props = defineProps({
     type: Number,
     required: true,
   },
+  pathPrefix: {
+    type: String,
+    required: true,
+  },
+  loading: {
+    type: Boolean,
+    required: false,
+    default: false,
+  },
 })
+
+const isLoading = computed(() => props.loading)
 </script>
+<!-- <NuxtLink
+    v-if="item && item.slug"
+    :to="pathPrefix"
+    class="text-decoration-none text-black"
+  >
+  </NuxtLink> -->

package/dist/runtime/components/events/ExpandedItem.vue

@@ -5,6 +5,10 @@
 <script lang="ts" setup>
 const props = defineProps({
   item: { type: Object, required: true },
+  pathPrefix: {
+    type: String,
+    required: true,
+  },
 })
 </script>
 

package/dist/runtime/components/events/RelatedItem.vue

@@ -1,21 +1,12 @@
 <template>
-  <v-sheet
-    :to="
-      localePath({
-        name: 'activities-events-slug',
-        params: { slug: item.name },
-      })
-    "
-  >
+  <v-sheet>
     <v-row>
       <v-col v-if="lgAndUp" cols="3">
         <MiscAtomsImageContainer
           cover
           :src="item.image"
           :ratio="1 / 1"
-          :link="item.name"
           :loading="rootStore.loading"
-          name="activities-events-slug"
         />
       </v-col>
       <v-col cols="12" lg="9">
@@ -36,11 +27,11 @@
 <script setup>
 import { useDisplay } from "vuetify"
 import { useRootStore } from "../../stores/root"
-import { useLocalePath } from "#imports"
 
-const localePath = useLocalePath()
 const rootStore = useRootStore()
 const { lgAndUp } = useDisplay()
 
-const props = defineProps({ item: { type: Object, required: true } })
+const props = defineProps({
+  item: { type: Object, required: true },
+})
 </script>

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

@@ -1,10 +1,11 @@
 <template>
   <v-divider v-if="index > 0" />
+
   <v-row class="py-8 px-6 highlight-on-hover" no-gutters>
     <v-col cols="12" md="1">
       <MiscAtomsDateStamp
         v-if="item.start"
-        :loading="$stores['events'].loading"
+        :loading="isLoading"
         :date-start="item.start"
         :date-stop="item.stop"
         class="pr-6 mt-md-2"
@@ -14,7 +15,7 @@
       <v-row no-gutters>
         <v-col cols="12" class="pr-lg-6">
           <v-skeleton-loader
-            v-if="rootStore.loading || $stores['events'].loading"
+            v-if="isLoading"
             :type="
               [
                 'heading, subtitle, text@6,subtitle, text,  ossein,  button, button',
@@ -28,18 +29,9 @@
           />
 
           <div v-else>
-            <nuxt-link
-              v-if="item.name"
-              :to="
-                localePath({
-                  name: 'activities-events-slug',
-                  params: { slug: item.slug[locale] },
-                })
-              "
-              class="text-h4 text-black text-wrap mt-4"
-            >
+            <div v-if="item.name" class="text-h4 text-black text-wrap mt-4">
               {{ item.name }}
-            </nuxt-link>
+            </div>
             <div class="mt-2 text-h6 text-overline font-weight-black">
               {{ $t("list.filters.events.category." + item.category) }}
             </div>
@@ -69,7 +61,7 @@
       >
         <v-col cols="12">
           <v-skeleton-loader
-            v-if="rootStore.loading || $stores['events'].loading"
+            v-if="isLoading"
             :type="
               ['article, heading, text, heading, text, button, button'][
                 ['md'].indexOf(name || 'md')
@@ -86,9 +78,7 @@
     <v-col cols="12" md="4">
       <MiscAtomsImageContainer
         cover
-        :slug="item.slug[locale]"
-        link="activities-events-slug"
-        :loading="$stores['events'].loading"
+        :loading="isLoading"
         :src="item.image && item.image.url ? item.image : '/default.png'"
         :ratio="1 / 1"
       />
@@ -99,11 +89,10 @@
 <script setup>
 import { useDisplay } from "vuetify"
 import { useRootStore } from "../../stores/root"
-import { useNuxtApp, useI18n, useLocalePath } from "#imports"
+import { useNuxtApp, computed } from "#imports"
 
-const { locale } = useI18n()
 const { name, mdAndDown, lgAndUp } = useDisplay()
-const localePath = useLocalePath()
+
 const rootStore = useRootStore()
 const { $stores } = useNuxtApp()
 const props = defineProps({
@@ -115,5 +104,16 @@ const props = defineProps({
     type: Number,
     required: true,
   },
+  pathPrefix: {
+    type: String,
+    required: true,
+  },
+  loading: {
+    type: Boolean,
+    required: false,
+    default: false,
+  },
 })
+
+const isLoading = computed(() => rootStore.loading || props.loading)
 </script>

package/dist/runtime/components/events/SlidingItem.vue

@@ -1,65 +1,57 @@
 <template>
-  <v-sheet v-motion class="d-flex sliding-item flex-md-row flex-column px-6">
-    <MiscAtomsDateStamp
-      :date-start="item.start"
-      :date-stop="item.stop"
-      :loading="loading"
-      class="mr-4 mb-6 mb-md-0"
-      style="min-width: 70px"
-    />
-    <div
-      class="d-flex flex-column"
-      :style="
-        'min-width:' +
-        [250, 300, 350, 380, 430, 460][
-          ['xs', 'sm', 'md', 'lg', 'xl', 'xxl'].indexOf(name || 'md')
-        ] +
-        'px!important;'
-      "
-    >
-      <MiscAtomsImageContainer
-        cover
-        :ratio="1"
-        :src="item.image"
-        link="activities-events-slug"
-        :slug="item.id"
+  <NuxtLink
+    v-if="item && item.slug"
+    :to="pathPrefix"
+    class="text-decoration-none text-black"
+  >
+    <v-sheet v-motion class="d-flex sliding-item flex-md-row flex-column px-6">
+      <MiscAtomsDateStamp
+        :date-start="item.start"
+        :date-stop="item.stop"
         :loading="loading"
-        :to="
-          localePath({
-            name: 'activities-events-slug',
-            params: { slug: item.slug[locale] },
-          })
-        "
-        style="cursor: pointer"
+        class="mr-4 mb-6 mb-md-0"
+        style="min-width: 70px"
       />
-      <nuxt-link
-        class="mt-6 pl-0 text-h6 text-md-h5 font-weight-medium sliding-item-title cursor-pointer"
-        :to="
-          localePath({
-            name: 'activities-events-slug',
-            params: { slug: item.slug[locale] },
-          })
+      <div
+        class="d-flex flex-column"
+        :style="
+          'min-width:' +
+          [250, 300, 350, 380, 430, 460][
+            ['xs', 'sm', 'md', 'lg', 'xl', 'xxl'].indexOf(name || 'md')
+          ] +
+          'px!important;'
         "
       >
-        <div class="text-overline text-uppercase">
-          {{ $t(item.category) }}
+        <MiscAtomsImageContainer
+          cover
+          :ratio="1"
+          :src="item.image"
+          :loading="loading"
+        />
+        <div
+          class="mt-6 pl-0 text-h6 text-md-h5 font-weight-medium sliding-item-title cursor-pointer"
+        >
+          <div class="text-overline text-uppercase">
+            {{ $t(item.category) }}
+          </div>
+          {{ item.name }}
         </div>
-        {{ item.name }}
-      </nuxt-link>
-    </div>
-  </v-sheet>
+      </div>
+    </v-sheet></NuxtLink
+  >
 </template>
 <script setup>
 import { useDisplay } from "vuetify"
-import { useLocalePath, useI18n } from "#imports"
-const { locale } = useI18n()
 
 const { name } = useDisplay()
-const localePath = useLocalePath()
 
 defineProps({
   item: { type: Object, required: true },
   loading: { type: Boolean, required: true, default: false },
+  pathPrefix: {
+    type: String,
+    required: true,
+  },
 })
 </script>
 <style lang="scss"></style>

package/dist/runtime/components/events/View.vue

@@ -330,7 +330,7 @@ const panel = ref(["presentation"])
 
 function redirectToMap(long, lat) {
   router.push(
-    `https://www.openstreetmap.org/?mlat=${lat}&mlon=${long}#map=19/${lat}/${long}`
+    `https://www.openstreetmap.org/?mlat=${lat}&mlon=${long}#map=19/${lat}/${long}`,
   )
 }
 </script>

package/dist/runtime/components/fellowships/Badges.vue

@@ -23,29 +23,33 @@
 </template>
 
 <script setup>
-import { getLocalizedDate } from "../../composables/useUtils";
-import { computed } from "#imports";
+import { getLocalizedDate } from "../../composables/useUtils"
+import { computed } from "#imports"
 
 const props = defineProps({
   item: { type: Object, required: true },
   view: { type: Boolean, required: false, default: false },
-});
+  pathPrefix: {
+    type: String,
+    required: true,
+  },
+})
 
 const registrationStatus = computed(() => {
-  const currentDate = new Date();
-  const startDate = new Date(props.item.applicationStart);
-  const endDate = new Date(props.item.applicationStop);
+  const currentDate = new Date()
+  const startDate = new Date(props.item.applicationStart)
+  const endDate = new Date(props.item.applicationStop)
   switch (true) {
     case currentDate < startDate:
-      return 0;
+      return 0
     case currentDate > startDate && currentDate < endDate:
-      return 1;
+      return 1
     case currentDate > startDate && currentDate > endDate:
-      return 2;
+      return 2
     default:
-      return false;
+      return false
   }
-});
+})
 </script>
 
 <style lang="scss" scoped></style>

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

@@ -1,14 +1,9 @@
 <template>
-  <v-row
-    v-ripple
-    no-gutters
-    class="cursor-pointer highlight-on-hover"
-    @click="
-      $router.push(localePath('/activities/fellowships/' + item.slug[locale]))
-    "
-  >
+  <v-row v-ripple no-gutters class="cursor-pointer highlight-on-hover">
     <v-col align-self="center" cols="8" class="text-h5 dense">
+      <v-skeleton-loader v-if="isLoading" type="heading" />
       <div
+        v-else
         v-html="
           $rootStore.search.length
             ? highlightAndTruncate(300, item.name, $rootStore.search.split(' '))
@@ -18,7 +13,9 @@
       <FellowshipsBadges :item="item" />
     </v-col>
     <v-col align-self="center" cols="4">
+      <v-skeleton-loader v-if="isLoading" type="chip@3" class="mt-2" />
       <MiscMoleculesChipContainer
+        v-else
         :items="[
           $t('list.filters.fellowships.fellowshipType.' + item.fellowshipType),
           ...(props.item && props.item.disciplines
@@ -32,10 +29,11 @@
 </template>
 
 <script setup>
-import { useLocalePath, useI18n, useNuxtApp } from "#imports"
+import { useNuxtApp } from "#imports"
+import { useRootStore } from "../../stores/root"
+import { computed } from "#imports"
 const { $rootStore } = useNuxtApp()
-const { locale } = useI18n()
-const localePath = useLocalePath()
+
 const props = defineProps({
   item: {
     type: Object,
@@ -45,5 +43,18 @@ const props = defineProps({
     type: Number,
     required: true,
   },
+
+  pathPrefix: {
+    type: String,
+    required: true,
+  },
+  loading: {
+    type: Boolean,
+    required: false,
+    default: false,
+  },
 })
+
+const rootStore = useRootStore()
+const isLoading = computed(() => rootStore.loading || props.loading)
 </script>

package/dist/runtime/components/fellowships/ExpandedItem.vue

@@ -2,6 +2,13 @@
   <div></div>
 </template>
 
-<script lang="ts" setup></script>
+<script lang="ts" setup>
+defineProps({
+  pathPrefix: {
+    type: String,
+    required: true,
+  },
+})
+</script>
 
 <style></style>

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

@@ -1,19 +1,12 @@
 <template>
   <v-col cols="12" md="6" class="highlight-on-hover">
     <div v-ripple class="border-thin pa-6">
-      <FellowshipsBadges :item="item" />
+      <FellowshipsBadges :item :pathPrefix />
       <div class="d-flex">
-        <nuxt-link
-          :to="
-            localePath({
-              name: 'activities-fellowships-slug',
-              params: { slug: item.slug[locale] },
-            })
-          "
-          class="text-h4 text-black text-wrap mt-4 pb-4"
-        >
+        <v-skeleton-loader v-if="isLoading" type="heading" />
+        <div v-else class="text-h4 text-black text-wrap mt-4 pb-4">
           {{ item.name }}
-        </nuxt-link>
+        </div>
       </div>
       <div
         class="text-wrap clamped-text d-flex"
@@ -24,9 +17,12 @@
           ]
         "
       >
-        <MDC v-if="item.description" :value="item.description" />
+        <v-skeleton-loader v-if="isLoading" type="text@4" />
+        <MDC v-else-if="item.description" :value="item.description" />
       </div>
+      <v-skeleton-loader v-if="isLoading" type="chip@3" class="mt-2" />
       <MiscMoleculesChipContainer
+        v-else
         :items="[
           $t('list.filters.fellowships.fellowshipType.' + item.fellowshipType),
           ...(props.item && props.item.disciplines
@@ -41,11 +37,10 @@
 
 <script setup>
 import { useDisplay } from "vuetify"
-import { useLocalePath, useI18n } from "#imports"
+import { computed } from "#imports"
+import { useRootStore } from "../../stores/root"
 
 const { name } = useDisplay()
-const localePath = useLocalePath()
-const { locale } = useI18n()
 
 const props = defineProps({
   item: {
@@ -56,7 +51,19 @@ const props = defineProps({
     type: Number,
     required: true,
   },
+  pathPrefix: {
+    type: String,
+    required: true,
+  },
+  loading: {
+    type: Boolean,
+    required: false,
+    default: false,
+  },
 })
+
+const rootStore = useRootStore()
+const isLoading = computed(() => rootStore.loading || props.loading)
 </script>
 
 <style lang="scss"></style>

package/dist/runtime/components/fellowships/View.vue

@@ -10,7 +10,7 @@
           <!--   FELLOWSHIP IMAGE -->
           <MiscAtomsImageContainer
             contain
-            :loading
+            :loading="loading"
             :src="item.image"
             :ratio="1 / 1"
           />
@@ -131,7 +131,7 @@
               :items="item.fellows || []"
               type="people"
               lazy
-              :loading
+              :loading="loading"
             >
               <div :class="mdAndUp ? 'text-h5' : 'text-h6'">
                 {{ $t("this-fellowship-alumni") }}

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

@@ -1,14 +1,34 @@
 <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="avatar, text@6" />
+      <template v-else>
+        <div class="text-h6">{{ item.name || item.filename }}</div>
+        <div v-if="item.description" class="text-body-2 mt-1">
+          <MDC :value="item.description" />
+        </div>
+      </template>
+    </v-col>
+  </v-row>
+  <v-divider />
 </template>
 
 <script setup>
-defineProps({
-  item: {
-    type: Object,
-    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/files/ExpandedItem.vue

@@ -10,6 +10,10 @@ const props = defineProps({
     type: Object,
     required: true,
   },
+  pathPrefix: {
+    type: String,
+    required: true,
+  },
 })
 </script>
 

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

@@ -1,14 +1,34 @@
 <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="avatar, text@8, button" />
+      <template v-else>
+        <div class="text-h6">{{ item.name || item.filename }}</div>
+        <div v-if="item.description" class="mt-2">
+          <MDC :value="item.description" />
+        </div>
+      </template>
+    </v-col>
+  </v-row>
+  <v-divider />
 </template>
 
 <script setup>
-defineProps({
-  item: {
-    type: Object,
-    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/files/View.vue

@@ -3,9 +3,9 @@
 </template>
 
 <script setup>
-import { useNuxtApp } from "#imports";
+import { useNuxtApp } from "#imports"
 
-const { $stores } = useNuxtApp();
+const { $stores } = useNuxtApp()
 defineProps({
   item: {
     type: Object,
@@ -16,7 +16,7 @@ defineProps({
     required: false,
     default: false,
   },
-});
+})
 
-$stores.files.loading = false;
+$stores.files.loading = false
 </script>