@datagouv/components-next 0.0.7 → 0.0.9

package/src/functions/dates.ts

@@ -2,84 +2,91 @@ import { useI18n } from 'vue-i18n'
 
 const SECONDS_IN_A_DAY = 3600 * 24
 
-export function formatDate(date: Date | string | null, options: Intl.DateTimeFormatOptions = {}) {
-  if (!date) {
-    return ''
-  }
-  date = new Date(date)
-  if (!('dateStyle' in options)) {
-    options.dateStyle = 'long'
-  }
-  const { locale } = useI18n()
-  return new Intl.DateTimeFormat(locale.value, options).format(date)
-}
+export function useFormatDate() {
+  const { t, locale } = useI18n()
 
-/**
- * Format date as relative from now.
- * It displays "today" or Intl.RelativeTimeFormat content, based on date.
- */
-export const formatFromNow = (date: Date | string | null) => {
-  if (!date) {
-    return ''
+  const formatDate = (date: Date | string | null, options: Intl.DateTimeFormatOptions = {}) => {
+    if (!date) {
+      return ''
+    }
+    date = new Date(date)
+    if (!('dateStyle' in options)) {
+      options.dateStyle = 'long'
+    }
+    return new Intl.DateTimeFormat(locale.value, options).format(date)
   }
-  const { t, locale } = useI18n()
-  if (!('RelativeTimeFormat' in Intl)) {
-    return t('on {date}', { date: formatDate(date) })
+
+  /**
+   * Format date as relative from now.
+   * It displays "today" or Intl.RelativeTimeFormat content, based on date.
+   */
+  const formatFromNow = (date: Date | string | null) => {
+    if (!date) {
+      return ''
+    }
+    if (!('RelativeTimeFormat' in Intl)) {
+      return t('le {date}', { date: formatDate(date) })
+    }
+    const today = new Date()
+    today.setHours(0)
+    today.setMinutes(0)
+    today.setSeconds(0)
+    const dateWithoutTime = new Date(date)
+    dateWithoutTime.setHours(0)
+    dateWithoutTime.setMinutes(0)
+    dateWithoutTime.setSeconds(0)
+    // Get the diff in second between today and the provided date
+    const diff = Math.round((dateWithoutTime.getTime() - today.getTime()) / 1000)
+    const units: Array<{ unit: Intl.RelativeTimeFormatUnit, seconds: number, changeAfter: number }> = [
+      {
+        unit: 'day',
+        seconds: SECONDS_IN_A_DAY,
+        changeAfter: 30,
+      },
+      {
+        unit: 'month',
+        seconds: SECONDS_IN_A_DAY * 30,
+        changeAfter: 12,
+      },
+      {
+        unit: 'year',
+        seconds: SECONDS_IN_A_DAY * 365,
+        changeAfter: Infinity,
+      },
+    ]
+    const correctUnit = units.find((unit) => {
+      const diffInUnit = Math.abs(diff / unit.seconds)
+      return diffInUnit < unit.changeAfter
+    })!
+    return new Intl.RelativeTimeFormat(locale.value, { numeric: 'auto' }).format(Math.round(diff / correctUnit?.seconds), correctUnit?.unit)
   }
-  const today = new Date()
-  today.setHours(0)
-  today.setMinutes(0)
-  today.setSeconds(0)
-  const dateWithoutTime = new Date(date)
-  dateWithoutTime.setHours(0)
-  dateWithoutTime.setMinutes(0)
-  dateWithoutTime.setSeconds(0)
-  // Get the diff in second between today and the provided date
-  const diff = Math.round((dateWithoutTime.getTime() - today.getTime()) / 1000)
-  const units: Array<{ unit: Intl.RelativeTimeFormatUnit, seconds: number, changeAfter: number }> = [
-    {
-      unit: 'day',
-      seconds: SECONDS_IN_A_DAY,
-      changeAfter: 30,
-    },
-    {
-      unit: 'month',
-      seconds: SECONDS_IN_A_DAY * 30,
-      changeAfter: 12,
-    },
-    {
-      unit: 'year',
-      seconds: SECONDS_IN_A_DAY * 365,
-      changeAfter: Infinity,
-    },
-  ]
-  const correctUnit = units.find((unit) => {
-    const diffInUnit = Math.abs(diff / unit.seconds)
-    return diffInUnit < unit.changeAfter
-  })!
-  return new Intl.RelativeTimeFormat(locale.value, { numeric: 'auto' }).format(Math.round(diff / correctUnit?.seconds), correctUnit?.unit)
-}
 
-/**
- * Format date relative form now if date is less than a month ago.
- * Otherwise, show a formatted date.
- */
-export const formatRelativeIfRecentDate = (date: Date | string | null, options: Intl.DateTimeFormatOptions = {}) => {
-  if (!date) {
-    return ''
+  /**
+   * Format date relative form now if date is less than a month ago.
+   * Otherwise, show a formatted date.
+   */
+  const formatRelativeIfRecentDate = (date: Date | string | null, options: Intl.DateTimeFormatOptions = {}) => {
+    if (!date) {
+      return ''
+    }
+    const today = new Date()
+    today.setHours(0)
+    today.setMinutes(0)
+    today.setSeconds(0)
+    const dateWithoutTime = new Date(date)
+    dateWithoutTime.setHours(0)
+    dateWithoutTime.setMinutes(0)
+    dateWithoutTime.setSeconds(0)
+    const diff = Math.abs(dateWithoutTime.getTime() - today.getTime())
+    if (Math.round(diff / (SECONDS_IN_A_DAY * 30)) >= 1) {
+      return t('le {date}', { date: formatDate(date, options) })
+    }
+    return formatFromNow(date)
   }
-  const { t } = useI18n()
-  const today = new Date()
-  today.setHours(0)
-  today.setMinutes(0)
-  today.setSeconds(0)
-  const dateWithoutTime = new Date(date)
-  dateWithoutTime.setHours(0)
-  dateWithoutTime.setMinutes(0)
-  dateWithoutTime.setSeconds(0)
-  const diff = Math.abs(dateWithoutTime.getTime() - today.getTime())
-  if (Math.round(diff / (SECONDS_IN_A_DAY * 30)) >= 1) {
-    return t('on {date}', { date: formatDate(date, options) })
+
+  return {
+    formatDate,
+    formatFromNow,
+    formatRelativeIfRecentDate,
   }
-  return formatFromNow(date)
 }

package/src/functions/helpers.ts

@@ -1,16 +1,17 @@
 import { useI18n } from 'vue-i18n'
 
 export const filesize = (val: number) => {
-  const { t } = useI18n()
-  const suffix = t('B')
+  const { t, locale } = useI18n()
+  const suffix = t('o')
+  const formatter = new Intl.NumberFormat(locale.value, { minimumFractionDigits: 1, maximumFractionDigits: 1 })
   const units = ['', 'K', 'M', 'G', 'T', 'P', 'E', 'Z']
   for (const unit of units) {
     if (Math.abs(val) < 1024.0) {
-      return `${val.toFixed(1)}${unit}${suffix}`
+      return `${formatter.format(val)} ${unit}${suffix}`.trim()
     }
     val /= 1024.0
   }
-  return `${val.toFixed(1)}Y${suffix}`
+  return `${formatter.format(val)} Y${suffix}`.trim()
 }
 
 export const summarize = (val: number, fractionDigits = 0) => {

package/src/functions/organizations.ts

@@ -27,12 +27,12 @@ export function getOrganizationTypes(): Array<{ type: OrganizationTypes | UserTy
   const { t } = useI18n()
   return [{
     type: PUBLIC_SERVICE,
-    label: t('Public service'),
+    label: t('Service public'),
     icon: RiBankLine,
   },
   {
     type: LOCAL_AUTHORITY,
-    label: t('Local authority'),
+    label: t('Collectivité territoriale'),
     icon: RiGovernmentLine,
   },
   {
@@ -42,17 +42,17 @@ export function getOrganizationTypes(): Array<{ type: OrganizationTypes | UserTy
   },
   {
     type: COMPANY,
-    label: t('Company'),
+    label: t('Entreprise'),
     icon: RiBuilding2Line,
   },
   {
     type: OTHER,
-    label: t('Other'),
+    label: t('Autre'),
     icon: null,
   },
   {
     type: USER,
-    label: t('User'),
+    label: t('Utilisateur'),
     icon: RiUserLine,
   }]
 }

package/src/functions/resources.ts

@@ -1,6 +1,7 @@
 import { readonly, type Component } from 'vue'
 
 import { useI18n } from 'vue-i18n'
+import { RiEarthLine, RiMap2Line } from '@remixicon/vue'
 import Archive from '../components/Icons/Archive.vue'
 import Code from '../components/Icons/Code.vue'
 import Documentation from '../components/Icons/Documentation.vue'
@@ -29,7 +30,6 @@ export function getResourceFormatIcon(format: string): Component | null {
     case 'gpx':
     case 'shx':
     case 'ovr':
-    case 'geojson':
     case 'gpkg':
     case 'grib2':
     case 'dbf':
@@ -63,10 +63,19 @@ export function getResourceFormatIcon(format: string): Component | null {
     case 'xls':
     case 'xlsx':
     case 'parquet':
+    case 'csv.gz':
       return Table
+    case 'geojson':
+      return RiMap2Line
+    case 'ogc:wfs':
+    case 'ogc:wms':
+    case 'wfs':
+    case 'wms':
+      return RiEarthLine
     case 'png':
     case 'jpg':
     case 'jpeg':
+    case 'svg':
       return Image
     default:
       return null
@@ -84,16 +93,36 @@ export const getResourceLabel = (type: ResourceType) => {
   const { t } = useI18n()
   switch (type) {
     case 'main':
-      return t('Main file')
+      return t('Fichier principal') // TODO: manage the plural case
     case 'documentation':
       return t('Documentation')
     case 'update':
-      return t('Update')
+      return t('Mise à jour')
     case 'api':
       return t('API')
     case 'code':
-      return t('Source code')
+      return t('Code source')
     case 'other':
-      return t('Other')
+      return t('Autre')
+  }
+}
+
+export const OGC_SERVICES_FORMATS = ['wfs', 'wms']
+
+export const detectOgcService = (resource: Resource) => {
+  // Detect OGC Services either based on format or a URL with GetCapabilities and known REQUEST type
+  // Return the format if found else false
+  if (resource.format) {
+    const format = resource.format.replace(/^ogc:/, '')
+    if (OGC_SERVICES_FORMATS.includes(format))
+      return format
+  }
+  const url = resource.url.toLowerCase()
+  if (url.includes('request=getcapabilities')) {
+    for (const format of OGC_SERVICES_FORMATS)
+      if (url.includes(`service=${format}`)) {
+        return format
+      }
   }
+  return false
 }

package/src/functions/schemas.ts

@@ -27,7 +27,7 @@ export type Schema = {
   name?: string | null
   url?: string | null
   version?: string | null
-} | null
+}
 
 export interface ValidataError {
   code: string
@@ -63,8 +63,9 @@ export async function getCatalog(): Promise<SchemaResponseData> {
   })
 }
 
-export function findSchemaInCatalog(catalog: Array<RegisteredSchema>, schema: Schema): RegisteredSchema | null {
-  return catalog.find(registeredSchema => schema?.name === registeredSchema.name) || null
+export function findSchemaInCatalog(catalog: Array<RegisteredSchema>, schema: Schema | null): RegisteredSchema | null {
+  if (!schema) return null
+  return catalog.find(registeredSchema => schema.name === registeredSchema.name) || null
 }
 
 export function getSchemaDocumentation(name: string): string {

package/src/functions/tabularApi.ts

@@ -10,7 +10,7 @@ export type SortConfig = {
  * Call Tabular-api to get table content
  */
 export function getData(config: PluginConfig, id: string, page: number, sortConfig?: SortConfig) {
-  let url = `${config.tabularApiUrl}/api/resources/${id}/data/?page=${page}&page_size=${config.tabularApiPageSize || 20}`
+  let url = `${config.tabularApiUrl}/api/resources/${id}/data/?page=${page}&page_size=${config.tabularApiPageSize || 15}`
   if (sortConfig) {
     url = url + `&${sortConfig.column}__sort=${sortConfig.type}`
   }

package/src/main.ts

@@ -1,9 +1,9 @@
 import type { App, Plugin } from 'vue'
 import type { Badge, Badges } from './types/badges'
-import type { Dataset, DatasetV2, NewDataset, Quality, Rel } from './types/datasets'
-import type { NewDataservice, Dataservice } from './types/dataservices'
+import type { Dataset, DatasetV2, DatasetV2WithFullObject, NewDataset, Quality, Rel } from './types/datasets'
+import type { NewDataservice, Dataservice, DataserviceAccessAudience, DataserviceAccessAudienceCondition, DataserviceAccessAudienceType } from './types/dataservices'
 import type { Frequency, Frequencies } from './types/frequency'
-import type { Granularity, Granularities } from './types/granularity'
+import type { Granularity, Granularities, SpatialZone } from './types/granularity'
 import type { Harvest } from './types/harvest'
 import type { License } from './types/licenses'
 import type { Member, MemberRole, NewOrganization, Organization } from './types/organizations'
@@ -37,6 +37,7 @@ import Placeholder from './components/Placeholder.vue'
 import ReadMore from './components/ReadMore.vue'
 import ResourceAccordion from './components/ResourceAccordion/ResourceAccordion.vue'
 import ResourceIcon from './components/ResourceAccordion/ResourceIcon.vue'
+import Swagger from './components/ResourceAccordion/Swagger.client.vue'
 import ReuseCard from './components/ReuseCard.vue'
 import SimpleBanner from './components/SimpleBanner.vue'
 import StatBox from './components/StatBox.vue'
@@ -63,7 +64,11 @@ export type {
   CommunityResource,
   Dataset,
   DatasetV2,
+  DatasetV2WithFullObject,
   Dataservice,
+  DataserviceAccessAudience,
+  DataserviceAccessAudienceCondition,
+  DataserviceAccessAudienceType,
   NewDataservice,
   FileResourceFileType,
   Frequency,
@@ -90,6 +95,7 @@ export type {
   ReuseTopic,
   ReuseType,
   Site,
+  SpatialZone,
   TopicV2,
   User,
   Weight,
@@ -104,14 +110,6 @@ const datagouv: Plugin<PluginConfig> = {
       options.textClamp = textClamp.default
     }
 
-    if (options.i18n) {
-      const frMessages = await import('../dist/locales/fr.js')
-      const enMessages = await import('../dist/locales/en.js')
-
-      options.i18n.global.mergeLocaleMessage('en', enMessages.default)
-      options.i18n.global.mergeLocaleMessage('fr', frMessages.default)
-    }
-
     app.provide(configKey, options)
   },
 }
@@ -144,4 +142,5 @@ export {
   ReuseCard,
   SimpleBanner,
   StatBox,
+  Swagger,
 }

package/src/types/badges.ts

@@ -1,5 +1,5 @@
 export type Badge = {
-  kind: string;
-};
+  kind: string
+}
 
-export type Badges = Array<Badge>;
+export type Badges = Array<Badge>

package/src/types/contact_point.ts

@@ -1,7 +1,7 @@
 export type ContactPoint = {
-  id: string;
-  name: string;
-  contact_form?: string;
-  email?: string;
-  role: string;
+  id: string
+  name: string
+  contact_form?: string
+  email?: string
+  role: 'contact' | 'creator' | 'publisher'
 }

package/src/types/dataservices.ts

@@ -29,6 +29,12 @@ export type BaseDataservice = Owned & {
 
 export type NewDataservice = Omit<BaseDataservice, keyof OwnedWithId> & OwnedWithId
 
+export type DataserviceAccessAudienceCondition = 'yes' | 'no' | 'under_condition'
+
+export type DataserviceAccessAudienceType = 'local_authority_and_administration' | 'company_and_association' | 'private'
+
+export type DataserviceAccessAudience = { role: DataserviceAccessAudienceType, condition: DataserviceAccessAudienceCondition }
+
 export type Dataservice = Owned & {
   acronym: string
   archived_at: string | null
@@ -50,14 +56,22 @@ export type Dataservice = Owned & {
   machine_documentation_url: string | null
   technical_documentation_url: string | null
   business_documentation_url: string | null
-  extras: Record<string, any>
+  extras: Record<string, unknown>
   format: string
   harvest: Harvest
   id: string
   access_type: 'open' | 'restricted' | 'open_with_account'
+  access_audiences: Array<DataserviceAccessAudience>
   license: string | null
   metadata_modified_at: string
-  metrics: { discussions: number, followers: number, reuses: number, views: number }
+  metrics: {
+    discussions: number
+    discussions_open: number
+    followers: number
+    reuses: number
+    views: number
+  }
+  permissions: { edit: boolean, delete: boolean }
   private: boolean
   rate_limiting: string
   self_api_url: string

package/src/types/datasets.ts

@@ -1,8 +1,12 @@
+import type { GeoJsonObject } from 'geojson'
 import type { Badges } from './badges'
 import type { Harvest } from './harvest'
 import type { Owned, OwnedWithId } from './owned'
 import type { Resource } from './resources'
 import type { ContactPoint } from './contact_point'
+import type { License } from './licenses'
+import type { Frequency } from './frequency'
+import type { Granularity, SpatialZone } from './granularity'
 
 export type Quality = {
   all_resources_available: boolean
@@ -39,9 +43,10 @@ export type BaseDataset = Owned & {
     granularity?: string
   } | null
   contact_points: Array<ContactPoint>
+  featured: boolean
 }
 
-export type NewDataset = Omit<BaseDataset, keyof OwnedWithId> & OwnedWithId
+export type NewDataset = Omit<BaseDataset, keyof OwnedWithId | 'featured'> & OwnedWithId
 
 export type Rel = {
   rel: string
@@ -65,16 +70,29 @@ export type Dataset = BaseDataset & {
   quality: Quality
   metrics: {
     discussions: number
+    discussions_open: number
     followers: number
     resources_downloads: number
     reuses: number
     views: number
   }
   harvest: Harvest
-  extras: Record<string, any>
+  extras: Record<string, unknown>
+  permissions: { edit: boolean, edit_resources: boolean, delete: boolean }
+
 }
 
 export type DatasetV2 = Owned & Omit<Dataset, 'resources' | 'community_resources'> & {
   resources: Rel
   community_resources: Rel
 }
+
+export type DatasetV2WithFullObject = Omit<DatasetV2, 'license' | 'frequency' | 'spatial'> & {
+  license: License
+  frequency: Frequency
+  spatial: {
+    zones?: Array<SpatialZone>
+    granularity?: Granularity
+    geom?: GeoJsonObject
+  } | null
+}

package/src/types/frequency.ts

@@ -1,6 +1,6 @@
 export type Frequency = {
-  id: string;
-  label: string;
-};
-  
-export type Frequencies = Array<Frequency>;
+  id: string
+  label: string
+}
+
+export type Frequencies = Array<Frequency>

package/src/types/granularity.ts

@@ -1,6 +1,14 @@
 export type Granularity = {
-  id: string;
-  name: string;
-};
+  id: string
+  name: string
+}
 
-export type Granularities = Array<Granularity>;
+export type Granularities = Array<Granularity>
+
+export type SpatialZone = {
+  code: string
+  id: string
+  level: string
+  name: string
+  uri: string
+}

package/src/types/harvest.ts

@@ -1,3 +1,3 @@
 export type Harvest = Record<string, any> & {
-  backend?: string;
-} | null;
+  backend?: string
+} | null

package/src/types/licenses.ts

@@ -1,9 +1,9 @@
 export type License = {
-  alternate_titles: Array<string>;
-  alternate_urls: Array<string>;
-  flags: Array<string>;
-  id: string;
-  maintainer: string | null;
-  title: string;
-  url: string;
-};
+  alternate_titles: Array<string>
+  alternate_urls: Array<string>
+  flags: Array<string>
+  id: string
+  maintainer: string | null
+  title: string
+  url: string
+}

package/src/types/organizations.ts

@@ -5,7 +5,9 @@ export type MemberRole = 'admin' | 'editor'
 
 export type Member = {
   role: MemberRole
+  label: string
   user: User
+  since: string | null
 }
 
 export type NewOrganization = {
@@ -23,15 +25,19 @@ export type Organization = NewOrganization & {
   last_modified: string
   last_update: string
   deleted: string | null
+  // eslint-disable-next-line @typescript-eslint/no-explicit-any
   extras: Record<string, any>
   logo_thumbnail: string
   members: Array<Member>
   metrics: {
     dataservices: number
+    dataservices_by_months: Record<string, number>
     datasets: number
+    datasets_by_months: Record<string, number>
     followers: number
     members: number
     reuses: number
+    reuses_by_months: Record<string, number>
     views: number
   }
   page: string

package/src/types/resources.ts

@@ -28,10 +28,10 @@ export type Resource = {
   mime: string
   internal: Record<string, unknown>
   last_modified: string
-  latest: string
+  latest: string // permalien stable
   preview_url: string
-  schema: Schema
+  schema: Schema | null
   url: string
 }
 
-export type CommunityResource = Owned & Resource & { dataset: Omit<Dataset, 'resources' | 'community_resources'> }
+export type CommunityResource = Owned & Resource & { dataset: Omit<Dataset, 'resources' | 'community_resources'>, permissions: { edit: boolean, delete: boolean } }

package/src/types/reuses.ts

@@ -21,7 +21,7 @@ export type Reuse = BaseReuse & {
   datasets: Array<Dataset>
   archived: string | null
   deleted: string | null
-  extras: Record<string, any>
+  extras: Record<string, unknown>
   featured: boolean
   id: string
   image: string | null
@@ -30,12 +30,14 @@ export type Reuse = BaseReuse & {
   metrics: {
     datasets: number
     discussions: number
+    discussions_open: number
     followers: number
     views: number
   }
   slug: string
   page: string
   uri: string
+  permissions: { edit: boolean, delete: boolean }
 }
 
 export type ReuseType = {

package/src/types/site.ts

@@ -4,6 +4,7 @@ export type Site = {
   metrics: {
     'dataservices': number
     'datasets': number
+    'datasets_visits_by_months': Record<string, number>
     'discussions': number
     'followers': number
     'harvesters': number
@@ -17,7 +18,14 @@ export type Site = {
     'organizations': number
     'public-service': number
     'resources': number
+    'resources_downloads_by_months': Record<string, number>
     'reuses': number
     'users': number
+    'users_by_months': Record<string, number>
+    'datasets_by_months': Record<string, number>
+    'harvesters_by_months': Record<string, number>
+    'reuses_by_months': Record<string, number>
+    'organizations_by_months': Record<string, number>
+    'discussions_by_months': Record<string, number>
   }
 }

package/src/types/ui.ts

@@ -1,3 +1,3 @@
-export type WellType = "primary" | "secondary";
+export type WellType = 'primary' | 'secondary'
 
-export type Weight = "light" | "regular" | "semi-bold" | "bold" | "heavy";
+export type Weight = 'light' | 'regular' | 'semi-bold' | 'bold' | 'heavy'