feat: Add favorite button

cozy · Oct 28, 2024 · 1af3f3e · 1af3f3e
1 parent 07ff4ea
commit 1af3f3e
Show file tree

Hide file tree

Showing 2 changed files with 34 additions and 0 deletions.
diff --git a/src/components/Modals/ContactInfoTitle.jsx b/src/components/Modals/ContactInfoTitle.jsx
@@ -3,15 +3,19 @@ import PropTypes from 'prop-types'
 import React from 'react'
 import { useNavigate } from 'react-router-dom'
 
+import { useClient } from 'cozy-client'
 import minilog from 'cozy-minilog'
 import Button from 'cozy-ui/transpiled/react/Buttons'
 import Grid from 'cozy-ui/transpiled/react/Grid'
 import Icon from 'cozy-ui/transpiled/react/Icon'
 import RenameIcon from 'cozy-ui/transpiled/react/Icons/Rename'
+import StarIcon from 'cozy-ui/transpiled/react/Icons/Star'
+import StarOutlineIcon from 'cozy-ui/transpiled/react/Icons/StarOutline'
 import TrashIcon from 'cozy-ui/transpiled/react/Icons/Trash'
 import { useAlert } from 'cozy-ui/transpiled/react/providers/Alert'
 import { useI18n } from 'cozy-ui/transpiled/react/providers/I18n'
 
+import { updateContact } from '../../connections/allContacts'
 import { updateContactGroups } from '../../helpers/groups'
 import ContactIdentity from '../ContactCard/ContactIdentity'
 import { fullContactPropTypes } from '../ContactPropTypes'
@@ -39,6 +43,7 @@ const ContactInfoTitle = ({ contact, allGroups }) => {
   const navigate = useNavigate()
   const { t } = useI18n()
   const { showAlert } = useAlert()
+  const client = useClient()
 
   const handleChange = async nextGroups => {
     try {
@@ -53,6 +58,20 @@ const ContactInfoTitle = ({ contact, allGroups }) => {
     await contact.groups.addById(createdGroup._id)
   }
 
+  const handleFavorite = () => {
+    updateContact({
+      client,
+      contact,
+      attributes: {
+        cozyMetadata: {
+          favorite: !contact.cozyMetadata?.favorite
+        }
+      }
+    })
+  }
+  const isFavorite = contact.cozyMetadata?.favorite ?? false
+  const favoriteIcon = isFavorite ? StarIcon : StarOutlineIcon
+
   const handleValue = get(contact, 'relationships.groups.data', [])
 
   return (
@@ -74,6 +93,16 @@ const ContactInfoTitle = ({ contact, allGroups }) => {
             menuPosition="fixed"
           />
         </Grid>
+        <Grid item>
+          <Button
+            className="u-miw-auto"
+            variant="secondary"
+            label={<Icon icon={favoriteIcon} size={12} />}
+            size="small"
+            onClick={handleFavorite}
+            aria-label={t('edit')}
+          />
+        </Grid>
         <Grid item>
           <Button
             className="u-miw-auto"

diff --git a/src/connections/allContacts.js b/src/connections/allContacts.js
@@ -38,6 +38,11 @@ export const importContact = async (client, attributes) => {
   return client.create(DOCTYPE_CONTACTS, attributes, null)
 }
 
+export const updateContact = ({ client, contact, attributes }) => {
+  const updatedContact = merge({}, contact, attributes)
+  return client.save(updatedContact)
+}
+
 const isContactSynced = contact => {
   return Object.keys(contact.cozyMetadata?.sync || {}).length > 0
 }