feat: handle transfer request notification (#846)

Author: nicolaskempf57

components/Notifications/NotificationsList.vue

@@ -6,15 +6,19 @@
     >
       <NotificationsMembershipRequest
         v-if="notification.details.class === 'MembershipRequestNotificationDetails'"
-        :notification
+        :notification="notification as MembershipRequestNotification"
+      />
+      <NotificationsTransferRequest
+        v-if="notification.details.class === 'TransferRequestNotificationDetails'"
+        :notification="notification as TransferRequestNotification"
       />
     </div>
   </div>
 </template>
 
 <script setup lang="ts">
 import type { DeepReadonly } from 'vue'
-import type { UserNotification } from '~/types/notifications'
+import type { MembershipRequestNotification, TransferRequestNotification, UserNotification } from '~/types/notifications'
 
 defineProps<{
   notifications: DeepReadonly<Array<UserNotification>>

components/Notifications/TransferRequest.vue

@@ -0,0 +1,67 @@
+<template>
+  <div class="p-3 flex gap-3 relative hover:bg-gray-some">
+    <div class="flex-none">
+      <RiSendPlaneLine class="size-4" />
+    </div>
+    <div class="flex-1">
+      <p class="m-0 text-xs font-bold">
+        <NuxtLink
+          class="after:absolute after:inset-0 bg-none"
+          :to="details.link"
+        >
+          {{ $t(`Demande de transfert`) }}
+        </NuxtLink>
+      </p>
+      <p class="m-0 text-xs">
+        {{ $t('de {source}', { source: details.sourceName }) }}
+      </p>
+      <p class="m-0 text-xs">
+        {{ $t('à {recipient}', { recipient: details.recipientName }) }}
+      </p>
+    </div>
+    <div class="flex-none flex m-0 gap-1.5">
+      <p class="m-0 text-xs">
+        {{ formatDate(notification.created_at) }}
+      </p>
+      <div
+        v-if="!notification.handled_at"
+        class="size-2 rounded-full bg-danger mt-0.5"
+      />
+    </div>
+  </div>
+</template>
+
+<script setup lang="ts">
+import { useFormatDate } from '@datagouv/components-next'
+import { RiSendPlaneLine } from '@remixicon/vue'
+import type { DeepReadonly } from 'vue'
+import type { TransferRequestNotification } from '~/types/notifications'
+
+const props = defineProps<{
+  notification: DeepReadonly<TransferRequestNotification>
+}>()
+
+const user = useMe()
+
+const details = computed(() => {
+  const recipient = props.notification.details.transfer_recipient
+  const source = props.notification.details.transfer_owner
+  const sourceName = 'first_name' in source ? `${source.first_name} ${source.last_name}` : source.name
+  const subject = props.notification.details.transfer_subject
+  const subjectPath = `${subject.class.toLowerCase()}s`
+  if ('first_name' in recipient) {
+    return {
+      link: user.value.id === recipient.id ? `/admin/me/${subjectPath}` : `/admin/users/${recipient.id}/${subjectPath}`,
+      recipientName: `${recipient.first_name} ${recipient.last_name}`,
+      sourceName,
+    }
+  }
+  return {
+    link: `/admin/organizations/${recipient.id}/${subjectPath}`,
+    recipientName: recipient.name,
+    sourceName,
+  }
+})
+
+const { formatDate } = useFormatDate()
+</script>

datagouv-components/src/main.ts

@@ -3,16 +3,16 @@ import type { Activity, ActivityKey } from './types/activity.js'
 import type { PaginatedArray } from './types/api.js'
 import type { ContactPoint, ContactPointRole } from './types/contact_point.js'
 import type { Badge, Badges, TranslatedBadge } from './types/badges'
-import type { Dataset, DatasetV2, DatasetV2WithFullObject, NewDataset, Quality, Rel } from './types/datasets'
-import type { NewDataservice, Dataservice } from './types/dataservices'
+import type { DatasetReference, Dataset, DatasetV2, DatasetV2WithFullObject, NewDataset, Quality, Rel } from './types/datasets'
+import type { DataserviceReference, NewDataservice, Dataservice } from './types/dataservices'
 import type { AccessType, AccessAudience, AccessAudienceCondition, AccessAudienceType, WithAccessType, AccessTypeForm } from './types/access_types'
 import type { Frequency, Frequencies } from './types/frequency'
 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, OrganizationOrSuggest, OrganizationReference, OrganizationSuggest } from './types/organizations'
 import type { Owned, OwnedWithId } from './types/owned'
-import type { NewReuse, Reuse, ReuseTopic, ReuseType } from './types/reuses'
+import type { ReuseReference, NewReuse, Reuse, ReuseTopic, ReuseType } from './types/reuses'
 import type { RegisteredSchema, Schema, SchemaDetails, SchemaField, SchemaPath, SchemaPublicationMode, SchemaResponseData, SchemaVersion, ValidataError } from './types/schemas'
 import type { TopicV2, TopicElement, TopicElementClass, TopicElementRel } from './types/topics'
 import type { CommunityResource, FileResourceFileType, RemoteResourceFileType, ResourceFileType, ResourceType, Resource } from './types/resources'
@@ -111,9 +111,11 @@ export type {
   CommunityResource,
   ContactPoint,
   ContactPointRole,
+  DatasetReference,
   Dataset,
   DatasetV2,
   DatasetV2WithFullObject,
+  DataserviceReference,
   Dataservice,
   NewDataservice,
   FileResourceFileType,
@@ -145,6 +147,7 @@ export type {
   Resource,
   ResourceFileType,
   ResourceType,
+  ReuseReference,
   Reuse,
   ReuseTopic,
   ReuseType,

datagouv-components/src/types/dataservices.ts

@@ -2,27 +2,29 @@ import type { Harvest } from './harvest'
 import type { Owned, OwnedWithId } from './owned'
 import type { ContactPoint } from './contact_point'
 import type { WithAccessType } from './access_types'
+import type { DatasetReference } from './datasets'
+
+export type DataserviceReference = {
+  class: 'Dataservice'
+  id: string
+  title: string
+  self_api_url: string
+  self_web_url: string
+}
 
 export type BaseDataservice = Owned & WithAccessType & {
   acronym: string
   availability: number | null
   base_api_url: string | null
-  datasets: Array<{
-    class: string
-    id: string
-    acronym: string
-    page: string
-    title: string
-    uri: string
-  }>
+  datasets: Array<DatasetReference>
   description: string
   machine_documentation_url: string | null
   technical_documentation_url: string | null
   business_documentation_url: string | null
   license: string | null
   private: boolean
   rate_limiting: string
-  title: string
+  title: DataserviceReference['title']
   contact_points: Array<ContactPoint>
 }
 
@@ -50,7 +52,7 @@ export type Dataservice = Owned & WithAccessType & {
   extras: Record<string, unknown>
   format: string
   harvest: Harvest
-  id: string
+  id: DataserviceReference['id']
   license: string | null
   metadata_modified_at: string
   metrics: {
@@ -63,8 +65,8 @@ export type Dataservice = Owned & WithAccessType & {
   permissions: { edit: boolean, delete: boolean }
   private: boolean
   rate_limiting: string
-  self_api_url: string
-  self_web_url: string
+  self_api_url: DataserviceReference['self_api_url']
+  self_web_url: DataserviceReference['self_web_url']
   slug: string
   tags: Array<string>
   title: string

datagouv-components/src/types/datasets.ts

@@ -23,9 +23,18 @@ export type Quality = {
   update_fulfilled_in_time: boolean
 }
 
-export type BaseDataset = Owned & WithAccessType & {
-  title: string
+export type DatasetReference = {
+  class: 'Dataset'
+  id: string
   acronym: string
+  page: string
+  title: string
+  uri: string
+}
+
+export type BaseDataset = Owned & WithAccessType & {
+  title: DatasetReference['title']
+  acronym: DatasetReference['acronym']
   archived: boolean
   description: string
   description_short: string
@@ -58,10 +67,10 @@ export type Rel = {
 }
 
 export type Dataset = BaseDataset & {
-  id: string
+  id: DatasetReference['id']
   badges: Badges
   deleted: string | null
-  page: string
+  page: DatasetReference['page']
   resources: Array<Resource>
   community_resources: Array<Resource>
   created_at: string
@@ -71,7 +80,7 @@ export type Dataset = BaseDataset & {
     created_at_internal: string
     last_modified_internal: string
   }
-  uri: string
+  uri: DatasetReference['uri']
   slug: string
   quality: Quality
   metrics: {

datagouv-components/src/types/reuses.ts

@@ -3,8 +3,17 @@ import type { Dataset } from './datasets'
 import type { Badges } from './badges'
 import type { Dataservice } from './dataservices'
 
-export type BaseReuse = Owned & {
+export type ReuseReference = {
+  class: 'Reuse'
+  id: string
   title: string
+  image: string | null
+  uri: string
+  page: string
+}
+
+export type BaseReuse = Owned & {
+  title: ReuseReference['title']
   description: string
   tags: Array<string> | null
   datasets: Array<Dataset | string>
@@ -25,8 +34,8 @@ export type Reuse = BaseReuse & {
   deleted: string | null
   extras: Record<string, unknown>
   featured: boolean
-  id: string
-  image: string | null
+  id: ReuseReference['id']
+  image: ReuseReference['image']
   image_thumbnail: string | null
   last_modified: string
   metrics: {
@@ -37,8 +46,8 @@ export type Reuse = BaseReuse & {
     views: number
   }
   slug: string
-  page: string
-  uri: string
+  page: ReuseReference['page']
+  uri: ReuseReference['uri']
   permissions: { edit: boolean, delete: boolean }
 }
 

types/notifications.ts

@@ -1,19 +1,28 @@
-import type { Organization, User } from '@datagouv/components-next'
+import type { DataserviceReference, DatasetReference, OrganizationReference, ReuseReference, UserReference } from '@datagouv/components-next'
 
 export type CommonNotification = {
   created_at: string
   handled_at: string | null
   id: string
   last_modified: string
-  user: User
+  user: UserReference
 }
 
 export type MembershipRequestNotification = CommonNotification & {
   details: {
     class: 'MembershipRequestNotificationDetails'
-    request_organization: Organization
-    request_user: User
+    request_organization: OrganizationReference
+    request_user: UserReference
   }
 }
 
-export type UserNotification = MembershipRequestNotification
+export type TransferRequestNotification = CommonNotification & {
+  details: {
+    class: 'TransferRequestNotificationDetails'
+    transfer_owner: OrganizationReference | UserReference
+    transfer_recipient: OrganizationReference | UserReference
+    transfer_subject: DatasetReference | DataserviceReference | ReuseReference
+  }
+}
+
+export type UserNotification = MembershipRequestNotification | TransferRequestNotification

types/types.d.ts

@@ -102,7 +102,6 @@ export type MultiSelectOption = {
 
 export type UserSuggest = Omit<User, 'avatar' | 'avatar_thumbnail' | 'roles' | 'pages'> & { avatar_url: string | null }
 export type DatasetSuggest = Pick<Dataset, 'acronym' | 'id' | 'slug' | 'title' | 'page'> & { image_url: string | null }
-export type DatasetReference = Dataservice['datasets'][0]
 export type SpatialZone = {
   code: string
   id: string