@paris-ias/list 1.0.172 → 1.0.173

package/dist/module.json

@@ -1,7 +1,7 @@
 {
   "name": "@paris-ias/list",
   "configKey": "list",
-  "version": "1.0.172",
+  "version": "1.0.173",
   "builder": {
     "@nuxt/module-builder": "0.8.4",
     "unbuild": "2.0.0"

package/dist/runtime/components/list/atoms/SortMenu.vue

@@ -37,7 +37,7 @@
         :key="key"
         :disabled="$stores[type].loading || key === currentSort"
         :active="key === currentSort"
-        active-class="bg-black text-white"
+        active-class="list-item-active"
         @click="
           rootStore.updateSort({
             type: type,
@@ -71,11 +71,15 @@ const props = defineProps({
   type: { type: String, default: "articles", required: true },
 })
 
-const currentSort = computed(() =>
-  $stores[props.type]?.currentSort
-    ? $stores[props.type]?.currentSort
-    : Object.keys($stores[props.type]?.sort).find(
-        (k) => $stores[props.type].sort[k]?.default,
-      ),
+const currentSort = computed(
+  () =>
+    rootStore?.sort ||
+    Object.keys($stores[props.type]?.sort).find(
+      (k) => $stores[props.type].sort[k]?.default,
+    ),
 )
 </script>
+
+<style>
+.list-item-active{background-color:#000!important;color:#fff!important}.list-item-active .v-list-item__overlay{opacity:0!important}
+</style>

package/dist/runtime/components/list/atoms/ViewMenu.vue

@@ -11,22 +11,24 @@
               x-large
               tile
               flat
-              :icon="'mdi-' + currentIcon"
+              :icon="'mdi-' + currentView.icon"
               :class="{ 'mt-3': isXsDisplay }"
               v-bind="mergeProps(menu, tooltip)"
             />
           </template>
         </template>
-        <div v-html="$t('list.view-mode') + $t('list.' + currentName)" />
+        <div v-html="$t('list.view-mode') + $t('list.' + currentView.name)" />
       </v-tooltip>
     </template>
     <v-list density="compact">
       <v-list-item
         v-for="(value, key, index) in items"
         :key="index"
-        :disabled="$stores[type].loading || (value.name || key) === currentName"
-        :active="(value.name || key) === currentName"
-        active-class="bg-black text-white"
+        :disabled="
+          $stores[type].loading || (value.name || key) === currentView.name
+        "
+        :active="(value.name || key) === currentView.name"
+        active-class="list-item-active"
         @click="updateView(value.name || key)"
       >
         <template #prepend>
@@ -44,9 +46,12 @@
 import { mergeProps } from "vue"
 import { useDisplay } from "vuetify"
 import { useRootStore } from "../../../stores/root"
-import { useNuxtApp, ref, useI18n, computed } from "#imports"
+import { useNuxtApp, useI18n, computed } from "#imports"
+
 const { locale } = useI18n()
 const { $stores } = useNuxtApp()
+const rootStore = useRootStore()
+const { xs: isXsDisplay } = useDisplay()
 
 const props = defineProps({
   type: {
@@ -55,33 +60,30 @@ const props = defineProps({
     required: true,
   },
 })
-const { xs: isXsDisplay } = useDisplay()
-
-const rootStore = useRootStore()
 
-const store = computed(() => $stores[props.type])
+const items = computed(() => $stores[props.type]?.views ?? {})
 
-const items = computed(() => store.value?.views ?? {})
+const currentView = computed(() => {
+  const store = $stores[props.type]
+  if (store?.view) return store.view
 
-const current = computed(() => store.value?.view ?? null)
-
-console.log("current", current.value)
-const defaultView = computed(() => {
-  const views = store.value?.views ?? {}
-  const key = Object.keys(views).find((k) => views[k]?.default === true)
-  return key ? views[key] : { name: "list", icon: "view-list" }
+  const views = store?.views ?? {}
+  const defaultKey = Object.keys(views).find((k) => views[k]?.default)
+  return defaultKey ? views[defaultKey] : { name: "list", icon: "view-list" }
 })
 
-const currentIcon = computed(
-  () => current.value?.icon ?? defaultView.value.icon,
-)
-const currentName = computed(
-  () => current.value?.name ?? defaultView.value.name,
-)
-
-const updateView = async (value) => {
+const updateView = (value) => {
   rootStore.updateView({ value, type: props.type, lang: locale.value })
 }
 </script>
 
-<style lang="scss"></style>
+<style>
+.list-item-active {
+  background-color: black !important;
+  color: white !important;
+}
+
+.list-item-active .v-list-item__overlay {
+  opacity: 0 !important;
+}
+</style>

package/dist/runtime/components/list/organisms/List.vue

@@ -162,7 +162,6 @@ watch(
   async (newVars, oldVars) => {
     if (newVars && JSON.stringify(newVars) !== JSON.stringify(oldVars)) {
       console.log("Variables changed, refreshing query, newVars: ", newVars)
-      console.log("start local loading from computed")
       rootStore.setLoading(true, props.type)
       await refresh()
       if (data.value) {

package/package.json

@@ -1,14 +1,14 @@
 {
   "license": "AGPL-3.0-only",
   "main": "./dist/module.mjs",
-  "version": "1.0.172",
+  "version": "1.0.173",
   "name": "@paris-ias/list",
   "repository": {
     "url": "git+https://github.com/IEA-Paris/list.git",
     "type": "git"
   },
   "dependencies": {
-    "@paris-ias/trees": "^2.0.38"
+    "@paris-ias/trees": "^2.0.39"
   },
   "description": "Paris IAS List Module",
   "peerDependencies": {