feat(search): add organizations facet support

datagouv-components/src/components/Search/Filter/OrganizationFacetFilter.vue

@@ -0,0 +1,46 @@
+<template>
+  <SearchableSelect
+    :model-value="selectedOption"
+    :options="options"
+    :loading="loading"
+    :label="t('Organisation')"
+    :placeholder="t('Toutes les organisations')"
+    :get-option-id="(opt) => opt.value"
+    :display-value="(opt) => opt.label"
+    :multiple="false"
+    @update:model-value="emit('update:modelValue', $event?.value ?? undefined)"
+  />
+</template>
+
+<script setup lang="ts">
+import { computed } from 'vue'
+import type { FacetItem } from '../../../types/search'
+import { useTranslation } from '../../../composables/useTranslation'
+import SearchableSelect from '../../Form/SearchableSelect.vue'
+
+const props = defineProps<{
+  modelValue: string | undefined
+  facets?: FacetItem[]
+  loading?: boolean
+}>()
+
+const emit = defineEmits<{
+  'update:modelValue': [value: string | undefined]
+}>()
+
+const { t } = useTranslation()
+
+// organization_id_with_name facet name format: "org-slug|Org Display Name"
+const options = computed(() =>
+  (props.facets ?? [])
+    .map((f) => {
+      const [id = '', ...labelParts] = f.name.split('|')
+      return { value: id, label: labelParts.join('|') }
+    })
+    .filter(o => o.value !== '' && o.label !== ''),
+)
+
+const selectedOption = computed(() =>
+  options.value.find(o => o.value === props.modelValue) ?? null,
+)
+</script>

datagouv-components/src/components/Search/GlobalSearch.vue

@@ -152,6 +152,13 @@
                 :loading="searchResultsStatus === 'pending'"
                 :style="{ order: getOrder('type') }"
               />
+              <OrganizationFacetFilter
+                v-if="isEnabled('organization_facet')"
+                v-model="organizationId"
+                :facets="getFacets('organization_id_with_name')"
+                :loading="searchResultsStatus === 'pending'"
+                :style="{ order: getOrder('organization_facet') }"
+              />
               <slot
                 name="filters"
                 :is-enabled="isEnabled"
@@ -397,6 +404,7 @@ import LastUpdateRangeFilter from './Filter/LastUpdateRangeFilter.vue'
 import ProducerTypeFilter from './Filter/ProducerTypeFilter.vue'
 import DatasetBadgeFilter from './Filter/DatasetBadgeFilter.vue'
 import ReuseTypeFilter from './Filter/ReuseTypeFilter.vue'
+import OrganizationFacetFilter from './Filter/OrganizationFacetFilter.vue'
 
 const props = withDefaults(defineProps<{
   config?: GlobalSearchConfig
@@ -499,6 +507,7 @@ const tagFilterRefs: Record<string, Ref<string | undefined>> = Object.fromEntrie
 // All filter values as a record
 const allFilters: Record<string, Ref<unknown>> = {
   organization: organizationId,
+  organization_facet: organizationId,
   organization_badge: organizationType,
   tag,
   format,

datagouv-components/src/composables/useStableQueryParams.ts

@@ -1,5 +1,5 @@
 import { ref, watch, type Ref } from 'vue'
-import type { SearchTypeConfig } from '../types/search'
+import { SearchFilterAliases, type SearchTypeConfig } from '../types/search'
 
 type FilterRefs = Record<string, Ref<unknown>>
 
@@ -46,7 +46,8 @@ export function useStableQueryParams(options: StableQueryParamsOptions) {
       if (filterRef) {
         const value = filterRef.value
         if (value !== undefined && value !== '' && value !== null) {
-          params[filterName as string] = value
+          const paramName = SearchFilterAliases[filterName as string] ?? filterName as string
+          params[paramName] = value
         }
       }
     }

datagouv-components/src/main.ts

@@ -24,7 +24,7 @@ import type { Weight, WellType } from './types/ui'
 import type { User, UserReference } from './types/users'
 import type { Report, ReportSubject, ReportReason } from './types/reports'
 import type { GlobalSearchConfig, SearchType, SortOption, TagFilterConfig, TagFilterValue, HiddenFilter, DatasetSearchFilters, DataserviceSearchFilters, ReuseSearchFilters, OrganizationSearchFilters, TopicSearchFilters } from './types/search'
-import { getDefaultDatasetConfig, getDefaultDataserviceConfig, getDefaultReuseConfig, getDefaultOrganizationConfig, getDefaultTopicConfig, getDefaultGlobalSearchConfig, defaultDatasetSortOptions, defaultDataserviceSortOptions, defaultReuseSortOptions, defaultOrganizationSortOptions } from './types/search'
+import { SearchFilterAliases, getDefaultDatasetConfig, getDefaultDataserviceConfig, getDefaultReuseConfig, getDefaultOrganizationConfig, getDefaultTopicConfig, getDefaultGlobalSearchConfig, defaultDatasetSortOptions, defaultDataserviceSortOptions, defaultReuseSortOptions, defaultOrganizationSortOptions } from './types/search'
 
 import ActivityList from './components/ActivityList/ActivityList.vue'
 import UserActivityList from './components/ActivityList/UserActivityList.vue'
@@ -227,6 +227,7 @@ export type {
 }
 
 export {
+  SearchFilterAliases,
   getDefaultDatasetConfig,
   getDefaultDataserviceConfig,
   getDefaultReuseConfig,

datagouv-components/src/types/search.ts

@@ -301,12 +301,17 @@ export type SortOption<Sort extends string> = {
   label: string
 }
 
+// UI filter keys that map to a different API param name
+export const SearchFilterAliases: Record<string, string> = {
+  organization_facet: 'organization',
+}
+
 export type DatasetSearchConfig = {
   class: 'datasets'
   name?: string
   hiddenFilters?: HiddenFilter<DatasetSearchFilters>[]
-  basicFilters?: (keyof DatasetSearchFilters)[]
-  advancedFilters?: (keyof DatasetSearchFilters)[]
+  basicFilters?: (keyof DatasetSearchFilters | keyof typeof SearchFilterAliases)[]
+  advancedFilters?: (keyof DatasetSearchFilters | keyof typeof SearchFilterAliases)[]
   sortOptions?: SortOption<DatasetSearchSort>[]
   tagFilters?: TagFilterConfig[]
 }
@@ -315,8 +320,8 @@ export type DataserviceSearchConfig = {
   class: 'dataservices'
   name?: string
   hiddenFilters?: HiddenFilter<DataserviceSearchFilters>[]
-  basicFilters?: (keyof DataserviceSearchFilters)[]
-  advancedFilters?: (keyof DataserviceSearchFilters)[]
+  basicFilters?: (keyof DataserviceSearchFilters | keyof typeof SearchFilterAliases)[]
+  advancedFilters?: (keyof DataserviceSearchFilters | keyof typeof SearchFilterAliases)[]
   sortOptions?: SortOption<DataserviceSearchSort>[]
   tagFilters?: TagFilterConfig[]
 }
@@ -325,8 +330,8 @@ export type ReuseSearchConfig = {
   class: 'reuses'
   name?: string
   hiddenFilters?: HiddenFilter<ReuseSearchFilters>[]
-  basicFilters?: (keyof ReuseSearchFilters)[]
-  advancedFilters?: (keyof ReuseSearchFilters)[]
+  basicFilters?: (keyof ReuseSearchFilters | keyof typeof SearchFilterAliases)[]
+  advancedFilters?: (keyof ReuseSearchFilters | keyof typeof SearchFilterAliases)[]
   sortOptions?: SortOption<ReuseSearchSort>[]
   tagFilters?: TagFilterConfig[]
 }
@@ -345,8 +350,8 @@ export type TopicSearchConfig = {
   class: 'topics'
   name?: string
   hiddenFilters?: HiddenFilter<TopicSearchFilters>[]
-  basicFilters?: (keyof TopicSearchFilters)[]
-  advancedFilters?: (keyof TopicSearchFilters)[]
+  basicFilters?: (keyof TopicSearchFilters | keyof typeof SearchFilterAliases)[]
+  advancedFilters?: (keyof TopicSearchFilters | keyof typeof SearchFilterAliases)[]
   sortOptions?: SortOption<TopicSearchSort>[]
   tagFilters?: TagFilterConfig[]
 }