@directus/composables 11.0.0 → 11.1.0

package/dist/index.d.ts

@@ -113,6 +113,8 @@ type ComputedQuery = {
     search: Ref<Query['search']> | ComputedRef<Query['search']> | WritableComputedRef<Query['search']>;
     filter: Ref<Query['filter']> | ComputedRef<Query['filter']> | WritableComputedRef<Query['filter']>;
     page: Ref<Query['page']> | WritableComputedRef<Query['page']>;
+    /** System filter applied to total item count. */
+    filterSystem?: Ref<Query['filter']> | ComputedRef<Query['filter']> | WritableComputedRef<Query['filter']>;
     alias?: Ref<Query['alias']> | ComputedRef<Query['alias']> | WritableComputedRef<Query['alias']>;
     deep?: Ref<Query['deep']> | ComputedRef<Query['deep']> | WritableComputedRef<Query['deep']>;
 };

package/dist/index.js

@@ -345,13 +345,11 @@ function useGroupableParent(state = {}, options = {}, group = "item-group") {
 import { getEndpoint, moveInArray } from "@directus/utils";
 import axios from "axios";
 import { isEqual as isEqual2, throttle } from "lodash-es";
-import { computed as computed5, ref as ref5, unref, watch as watch3 } from "vue";
+import { computed as computed5, ref as ref5, toRef, unref, watch as watch3 } from "vue";
 function useItems(collection, query) {
   const api = useApi();
   const { primaryKeyField } = useCollection(collection);
-  const { fields, limit, sort, search, filter, page, alias: queryAlias, deep: queryDeep } = query;
-  const alias = queryAlias ?? ref5();
-  const deep = queryDeep ?? ref5();
+  const { fields, limit, sort, search, filter, page, filterSystem, alias, deep } = query;
   const endpoint = computed5(() => {
     if (!collection.value) return null;
     return getEndpoint(collection.value);
@@ -374,7 +372,7 @@ function useItems(collection, query) {
   let loadingTimeout = null;
   const fetchItems = throttle(getItems, 500);
   watch3(
-    [collection, limit, sort, search, filter, fields, page, alias, deep],
+    [collection, limit, sort, search, filter, fields, page, toRef(alias), toRef(deep)],
     async (after, before) => {
       if (isEqual2(after, before)) return;
       const [newCollection, newLimit, newSort, newSearch, newFilter] = after;
@@ -395,6 +393,14 @@ function useItems(collection, query) {
     },
     { deep: true, immediate: true }
   );
+  watch3(
+    [collection, toRef(filterSystem)],
+    async (after, before) => {
+      if (isEqual2(after, before)) return;
+      getTotalCount();
+    },
+    { deep: true, immediate: true }
+  );
   return {
     itemCount,
     totalCount,
@@ -419,9 +425,6 @@ function useItems(collection, query) {
     loadingTimeout = setTimeout(() => {
       loading.value = true;
     }, 150);
-    if (unref(totalCount) === null) {
-      getTotalCount();
-    }
     let fieldsToFetch = [...unref(fields) ?? []];
     if (!unref(fields)?.includes("*") && primaryKeyField.value && fieldsToFetch.includes(primaryKeyField.value.field) === false) {
       fieldsToFetch.push(primaryKeyField.value.field);
@@ -493,7 +496,8 @@ function useItems(collection, query) {
       };
       const response = await api.get(endpoint.value, {
         params: {
-          aggregate
+          aggregate,
+          filter: unref(filterSystem)
         },
         signal: existingRequests.total.signal
       });

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@directus/composables",
-  "version": "11.0.0",
+  "version": "11.1.0",
   "description": "Shared Vue composables for Directus use",
   "homepage": "https://directus.io",
   "repository": {
@@ -25,8 +25,8 @@
     "axios": "1.7.3",
     "lodash-es": "4.17.21",
     "nanoid": "5.0.7",
-    "@directus/constants": "12.0.0",
-    "@directus/utils": "12.0.0"
+    "@directus/utils": "12.0.0",
+    "@directus/constants": "12.0.0"
   },
   "devDependencies": {
     "@types/lodash-es": "4.17.12",
@@ -38,8 +38,8 @@
     "vue": "3.4.27",
     "@directus/extensions": "2.0.0",
     "@directus/sdk": "17.0.0",
-    "@directus/types": "12.0.0",
-    "@directus/tsconfig": "2.0.0"
+    "@directus/tsconfig": "2.0.0",
+    "@directus/types": "12.0.0"
   },
   "peerDependencies": {
     "vue": "^3.4"