Users nav (#400)

* Add filters-to-query util

* Add all users string

* Suppot filters in tabular layout

* Sync filters with collection presets

* Support filters in use-items composition

* Render users nav + use skeleton loader

* Add list-item-icon type to skeleton loader

* Fix missing loader indicator on table

* Cleanup has click check

* Dont route based on id

* Fix loading state in table

* Revert "Dont route based on id"

This reverts commit 6de7cbe1b801d5e5e267f09a6e77dc73dcc60a37.

* Fix table loading state

* Fix routing for users module

* Force role field to be fetched

* Add roles store

* Dont render avatar until user is known

* Speed up hydration absurd much

* Rely on roles store to prevent nav from loading

* Fix tests

src/utils/filters-to-query/filters-to-query.ts

@@ -0,0 +1,12 @@
+import { Filter } from '@/stores/collection-presets/types';
+
+export default function filtersToQuery(filters: readonly Filter[]) {
+	// eslint-disable-next-line @typescript-eslint/no-explicit-any
+	const query: Record<string, any> = {};
+
+	filters.forEach((filter) => {
+		query[`filter[${filter.field}][${filter.operator}]`] = filter.value;
+	});
+
+	return query;
+}

src/utils/filters-to-query/index.ts

@@ -0,0 +1,4 @@
+import filtersToQuery from './filters-to-query';
+
+export { filtersToQuery };
+export default filtersToQuery;

src/utils/filters-to-query/readme.md

@@ -0,0 +1,27 @@
+# Filters to Query
+
+Converts an array of filter objects to an Axios compatible object of query params.
+
+## Usage
+
+```ts
+const filters: Filter[] = [
+	{
+		field: 'title',
+		operator: 'contains',
+		value: 'directus',
+	},
+	{
+		field: 'author',
+		operator: 'eq',
+		value: 1,
+	},
+];
+
+filtersToQuery(filters);
+
+// {
+//   'filter[title][contains]': 'directus',
+//   'filter[author][eq]: 1
+// }
+```