From ff1c7dd0a747ce25c2d09a102b6f0964f1f00ef3 Mon Sep 17 00:00:00 2001 From: JF-Cozy Date: Thu, 30 Jan 2025 10:59:44 +0100 Subject: [PATCH] feat(Viewer): Add copyToClipboard on qualification click --- .../QualificationListItemContact.jsx | 16 +++++++++++++++- .../Qualifications/QualificationListItemDate.jsx | 11 ++++++++++- .../QualificationListItemInformation.jsx | 12 ++++++++++-- .../QualificationListItemOther.jsx | 11 ++++++++++- .../cozy-viewer/src/providers/DemoProvider.jsx | 5 ++++- 5 files changed, 49 insertions(+), 6 deletions(-) diff --git a/packages/cozy-viewer/src/Panel/Qualifications/QualificationListItemContact.jsx b/packages/cozy-viewer/src/Panel/Qualifications/QualificationListItemContact.jsx index cece72fe52..d280e2033b 100644 --- a/packages/cozy-viewer/src/Panel/Qualifications/QualificationListItemContact.jsx +++ b/packages/cozy-viewer/src/Panel/Qualifications/QualificationListItemContact.jsx @@ -5,6 +5,7 @@ import { getTranslatedNameForContact, formatContactValue } from 'cozy-client/dist/models/paper' +import { copyToClipboard } from 'cozy-ui/transpiled/react/ActionsMenu/Actions' import Icon from 'cozy-ui/transpiled/react/Icon' import IconButton from 'cozy-ui/transpiled/react/IconButton' import Dots from 'cozy-ui/transpiled/react/Icons/Dots' @@ -13,6 +14,7 @@ import ListItem from 'cozy-ui/transpiled/react/ListItem' import ListItemIcon from 'cozy-ui/transpiled/react/ListItemIcon' import ListItemSecondaryAction from 'cozy-ui/transpiled/react/ListItemSecondaryAction' import Spinner from 'cozy-ui/transpiled/react/Spinner' +import { useAlert } from 'cozy-ui/transpiled/react/providers/Alert' import { useI18n } from 'cozy-ui/transpiled/react/providers/I18n' import QualificationListItemText from './QualificationListItemText' @@ -23,6 +25,7 @@ const QualificationListItemContact = forwardRef( ({ file, isReadOnly, toggleActionsMenu }, ref) => { const { lang } = useI18n() const { contacts, isLoadingContacts } = useReferencedContactName(file) + const { showAlert } = useAlert() if (isLoadingContacts) { return ( @@ -41,6 +44,14 @@ const QualificationListItemContact = forwardRef( const formattedTitle = getTranslatedNameForContact({ lang }) const qualificationLabel = file.metadata.qualification.label + const handleClick = async () => { + if (!formattedValue) return + await copyToClipboard().action(undefined, { + showAlert, + copyValue: formattedValue + }) + } + return ( <> - + diff --git a/packages/cozy-viewer/src/Panel/Qualifications/QualificationListItemDate.jsx b/packages/cozy-viewer/src/Panel/Qualifications/QualificationListItemDate.jsx index 6d1a1508cd..5a8d635fa6 100644 --- a/packages/cozy-viewer/src/Panel/Qualifications/QualificationListItemDate.jsx +++ b/packages/cozy-viewer/src/Panel/Qualifications/QualificationListItemDate.jsx @@ -7,6 +7,7 @@ import { getTranslatedNameForDateMetadata, formatDateMetadataValue } from 'cozy-client/dist/models/paper' +import { copyToClipboard } from 'cozy-ui/transpiled/react/ActionsMenu/Actions' import Icon from 'cozy-ui/transpiled/react/Icon' import IconButton from 'cozy-ui/transpiled/react/IconButton' import CalendarIcon from 'cozy-ui/transpiled/react/Icons/Calendar' @@ -16,6 +17,7 @@ import ListItem from 'cozy-ui/transpiled/react/ListItem' import ListItemIcon from 'cozy-ui/transpiled/react/ListItemIcon' import ListItemSecondaryAction from 'cozy-ui/transpiled/react/ListItemSecondaryAction' import Typography from 'cozy-ui/transpiled/react/Typography' +import { useAlert } from 'cozy-ui/transpiled/react/providers/Alert' import { useI18n } from 'cozy-ui/transpiled/react/providers/I18n' import QualificationListItemText from './QualificationListItemText' @@ -28,6 +30,8 @@ const QualificationListItemDate = forwardRef( ref ) => { const { f, lang } = useI18n() + const { showAlert } = useAlert() + const { name, value } = formattedMetadataQualification const qualificationLabel = file.metadata.qualification.label const formattedTitle = getTranslatedNameForDateMetadata(name, { lang }) @@ -37,6 +41,11 @@ const QualificationListItemDate = forwardRef( }) const isExpirationDate = name === 'expirationDate' + const handleClick = async () => { + if (!value) return + await copyToClipboard().action(undefined, { showAlert, copyValue: value }) + } + return ( - + diff --git a/packages/cozy-viewer/src/Panel/Qualifications/QualificationListItemInformation.jsx b/packages/cozy-viewer/src/Panel/Qualifications/QualificationListItemInformation.jsx index 2e9aa55b01..1bce55d232 100644 --- a/packages/cozy-viewer/src/Panel/Qualifications/QualificationListItemInformation.jsx +++ b/packages/cozy-viewer/src/Panel/Qualifications/QualificationListItemInformation.jsx @@ -6,6 +6,7 @@ import { formatInformationMetadataValue, KNOWN_INFORMATION_METADATA_NAMES } from 'cozy-client/dist/models/paper' +import { copyToClipboard } from 'cozy-ui/transpiled/react/ActionsMenu/Actions' import Icon from 'cozy-ui/transpiled/react/Icon' import IconButton from 'cozy-ui/transpiled/react/IconButton' import BellIcon from 'cozy-ui/transpiled/react/Icons/Bell' @@ -20,11 +21,11 @@ import ListItem from 'cozy-ui/transpiled/react/ListItem' import ListItemIcon from 'cozy-ui/transpiled/react/ListItemIcon' import ListItemSecondaryAction from 'cozy-ui/transpiled/react/ListItemSecondaryAction' import MidEllipsis from 'cozy-ui/transpiled/react/MidEllipsis' +import { useAlert } from 'cozy-ui/transpiled/react/providers/Alert' import { useI18n } from 'cozy-ui/transpiled/react/providers/I18n' import QualificationListItemText from './QualificationListItemText' import IntentOpener from '../../components/IntentOpener' - const KNOWN_INFORMATION_METADATA_ICONS = [ NumberIcon, NumberIcon, @@ -49,6 +50,8 @@ const QualificationListItemInformation = forwardRef( ref ) => { const { lang } = useI18n() + const { showAlert } = useAlert() + const { name, value } = formattedMetadataQualification const qualificationLabel = file.metadata.qualification.label @@ -66,6 +69,11 @@ const QualificationListItemInformation = forwardRef( const titleComponent = formattedTitle === name ? : formattedTitle + const handleClick = async () => { + if (!value) return + await copyToClipboard().action(undefined, { showAlert, copyValue: value }) + } + return ( - + diff --git a/packages/cozy-viewer/src/Panel/Qualifications/QualificationListItemOther.jsx b/packages/cozy-viewer/src/Panel/Qualifications/QualificationListItemOther.jsx index 6042321648..b68dbc4a87 100644 --- a/packages/cozy-viewer/src/Panel/Qualifications/QualificationListItemOther.jsx +++ b/packages/cozy-viewer/src/Panel/Qualifications/QualificationListItemOther.jsx @@ -5,6 +5,7 @@ import { getTranslatedNameForOtherMetadata, formatOtherMetadataValue } from 'cozy-client/dist/models/paper' +import { copyToClipboard } from 'cozy-ui/transpiled/react/ActionsMenu/Actions' import Icon from 'cozy-ui/transpiled/react/Icon' import IconButton from 'cozy-ui/transpiled/react/IconButton' import Dots from 'cozy-ui/transpiled/react/Icons/Dots' @@ -14,6 +15,7 @@ import ListItem from 'cozy-ui/transpiled/react/ListItem' import ListItemIcon from 'cozy-ui/transpiled/react/ListItemIcon' import ListItemSecondaryAction from 'cozy-ui/transpiled/react/ListItemSecondaryAction' import MidEllipsis from 'cozy-ui/transpiled/react/MidEllipsis' +import { useAlert } from 'cozy-ui/transpiled/react/providers/Alert' import { useI18n } from 'cozy-ui/transpiled/react/providers/I18n' import QualificationListItemText from './QualificationListItemText' @@ -25,6 +27,8 @@ const QualificationListItemOther = forwardRef( ref ) => { const { lang } = useI18n() + const { showAlert } = useAlert() + const { name, value } = formattedMetadataQualification const qualificationLabel = file.metadata.qualification.label @@ -38,6 +42,11 @@ const QualificationListItemOther = forwardRef( name }) + const handleClick = async () => { + if (!value) return + await copyToClipboard().action(undefined, { showAlert, copyValue: value }) + } + return ( - + diff --git a/packages/cozy-viewer/src/providers/DemoProvider.jsx b/packages/cozy-viewer/src/providers/DemoProvider.jsx index f4bcfee869..8fc98c0f79 100644 --- a/packages/cozy-viewer/src/providers/DemoProvider.jsx +++ b/packages/cozy-viewer/src/providers/DemoProvider.jsx @@ -2,6 +2,7 @@ import React, { Fragment } from 'react' import { CozyProvider } from 'cozy-client' import CloudWallpaper from 'cozy-ui/docs/cloud-wallpaper.jpg' +import AlertProvider from 'cozy-ui/transpiled/react/providers/Alert' import { BreakpointsProvider } from 'cozy-ui/transpiled/react/providers/Breakpoints' import I18n from 'cozy-ui/transpiled/react/providers/I18n' @@ -102,7 +103,9 @@ const DemoProvider = ({ locales[lang]} lang={lang}> - {children} + + {children} +