Add expiration panel #2294

PolariTOON · 2022-11-29T18:17:28Z

This will be on top of cozy/cozy-client#1274 and thus will need an update of cozy-client.
For consistency, cozy-harvest-lib should also be updated after cozy/cozy-libs#1893 is merged, but this is not required by this PR.

Demo link : https://polaritoon.github.io/cozy-ui/react/#!/Viewer

bundlemon · 2022-11-29T18:33:06Z

BundleMon

Unchanged files (2)

Status	Path	Size	Limits
✅	dist/cozy-ui.min.css	19.67KB	+5%
✅	dist/cozy-ui.utils.min.css	9.99KB	+5%

No change in files bundle size

Groups updated (1)

Status	Path	Size	Limits
✅	transpiled/react/**	548.53KB (+2.38KB +0.44%)	-

Final result: ✅

View report in BundleMon website ➡️

Current branch size history | Target branch size history

react/Viewer/Panel/QualificationListItemOther.jsx

react/Viewer/Panel/QualificationListItemDateAnnotation.jsx

react/Viewer/Panel/ExpirationLink.jsx

react/Viewer/Panel/Expiration.jsx

react/Viewer/Panel/getPanelBlocks.jsx

JF-Cozy · 2022-11-30T09:18:58Z

react/Viewer/Panel/Expiration.jsx

+
+  const handleClose = async () => {
+    setIsBusy(true)
+    await client.collection(FILES_DOCTYPE).updateMetadataAttribute(file.id, {


est-ce qu'on devrait pas plutôt faire un client.save() ici ? cc @paultranvan @Crash--

J'ai procédé de la manière que dans InformationEdit ou encore dans PageEdit.

Tu peux pas utiliser un save() pour mettre à jour ces infos là pour le moment.

Par contre, si l'app n'a pas de temps réel sur le io.cozy.files alors le fichier ne sera pas à jour dans le store de cozy-client.

Donc pour résumer :

est-ce qu'on devrait : oui

est-ce qu'on peut : non
;)

Pourquoi on peut pas ? 🤔

En passant par la droite.

je veux dire, pourquoi on peut pas faire client.save en passant donc le file qu'on refait "à la main" plutôt qu'en utilisant une méthode https://github.com/cozy/cozy-client/blob/master/packages/cozy-stack-client/src/FileCollection.js#L982 qui prend l'id du doc en arg. ?

Parce que c'est un point d'API spécifique pour mettre à jour ces informations...

On a déjà quelques if sur le update https://github.com/cozy/cozy-client/blob/master/packages/cozy-stack-client/src/FileCollection.js#L495-L518 mais il ne gère pas encore le updateMetadataAttribute

issue / PR welcome 😉

There is already at least one discussion about that cozy/cozy-client#650

I didn't see this PR, so I created an issue to link it: cozy/cozy-client#1277

PolariTOON · 2022-12-06T14:40:39Z

Link to a demo in the current state : https://polaritoon.github.io/cozy-ui/react/#!/Viewer

PolariTOON · 2022-12-07T15:06:18Z

@JF-Cozy This should be ready for another review.

JF-Cozy

modif à prendre en compte dans une autre PR dans les prochains jours, besoin de livraison rapide

JF-Cozy · 2022-12-07T15:14:14Z

package.json

@@ -90,7 +90,7 @@
    "babel-preset-cozy-app": "2.0.2",
    "browserslist-config-cozy": "0.4.0",
    "copyfiles": "2.4.1",
-    "cozy-client": "^33.0.0",
+    "cozy-client": "^34.4.0",


cozy-client est aussi en peerDep, il faudrait donc mettre à jour également là-bas, non ? Attention c'est un BC

Bien vu, j'ai indiqué le BC dans le premier commit.

JF-Cozy · 2022-12-07T15:15:14Z

react/Viewer/components/ExpirationAnnotation.jsx

+
+  if (isExpired(file)) {
+    return (
+      <Typography component="span" variant="inherit" color="error">


component="span" variant="inherit" vraiment nécessaire ?

component="span" c'est parce Typography est par défaut un élément p et donc chaque Typography s'afficherait un en dessous de l'autre
variant="inherit" c'est parce que Typography est par défaut en body1 et donc le texte ne serait pas de la bonne taille (selon l'endroit mettre un body2 peut aussi fonctionner mais inherit ça montre bien que l'on veut juste la même chose que le parent)
J'accorde que Typography perd pas mal de son intérêt ici. C'est aussi pour ça que j'étais parti sur un <span className="ui-error" /> initialement voir pas de composant du tout à certains autres endroits.

JF-Cozy · 2022-12-07T15:15:25Z

react/Viewer/components/ExpirationAnnotation.jsx

+  const expirationDate = computeExpirationDate(file)
+
+  return (
+    <Typography component="span" variant="inherit" className="u-warning">


idem component="span" variant="inherit"

JF-Cozy · 2022-12-07T15:16:03Z

react/Viewer/Panel/QualificationListItemDate.jsx

-          secondary={formattedDate}
+          secondary={
+            <>
+              <Typography component="span" variant="inherit">


idem component="span" variant="inherit" et partout sur la PR :p

JF-Cozy · 2022-12-07T15:17:07Z

react/Viewer/components/ExpirationAlert.jsx

+import { useI18n } from '../../I18n'
+import { formatLocallyDistanceToNow } from '../../I18n/format'
+
+const FILES_DOCTYPE = 'io.cozy.files'


à voir si on a n'a pas déjà des constantes quelque part, ici ou dans cozy-client...

Je ne vois pas d'endroit en particulier d'où il serait exporté, mais si un tel endroit n'existe pas, il faut avouer que ça serait sans doute bien de tout y centraliser plutôt que de redéfinir les constantes à chaque fois dans chaque lib / app.

N'allait pas trop loin dans la mutualisation, y a des trucs qui font sens, d'autres non. Le KISS impose de temps en temps de dupliquer du code, et y a rien de mal à ça. Importer une constante depuis un autre package qui définit déjà une autre constante (car on peut considérer io.cozy.files comme une constante déjà), ça n'a que très très peu d'intérêt. Voir aucun en fait ? 🤔

react/Viewer/components/ExpirationAlert.jsx

react/Viewer/Panel/Qualification.jsx

JF-Cozy · 2022-12-07T15:20:03Z

react/Viewer/Panel/Qualification.jsx

+      {isExpiringSoon(file) && !file?.metadata?.hideExpirationAlert && (
+        <ExpirationAlert file={file} />
+      )}
+      <List className={'u-pv-1'}>


u-pv-1 vraiment nécessaire ici ? Les styles sur les listes ont été bien revus... 🤔

Il était déjà là ! En l'état il est nécessaire parce qu'il assure que la liste n'est pas collée en haut et en bas du bloc. Je l'avais justement modifié initialement lorsque j'ai corrigé les problèmes de marges, mais je l'ai restauré depuis puisqu'on a dit qu'on repoussait la correction des problèmes de marges à plus tard !

JF-Cozy · 2022-12-07T15:20:41Z

react/Viewer/Readme.md

+      qualification: {
+        label: 'personal_sporting_licence'
+      }
+    }


on aurait pu mettre dans le même exemple que l'autre pour tout avoir au même endroit je pense

De quel autre exemple parles-tu ? Celui-ci existait déjà, j'ai juste rajouté des attributs supplémentaires.

`cozy-client` as been upgraded to to `34.4.0` to be able to use paper helpers BREAKING CHANGE: You need to update `cozy-client` to `>34.4.0`.

Including an expiration alert.

cozy-bot · 2022-12-07T17:35:01Z

🎉 This PR is included in version 78.0.0 🎉

The release is available on:

Your semantic-release bot 📦🚀

PolariTOON requested review from JF-Cozy, Merkur39 and Ldoppea as code owners November 29, 2022 18:17

This was referenced Nov 29, 2022

fix: Fixes various padding issues on KonnectorBlock cozy/cozy-libs#1893

Open

Add expiration annotation to cozy mespapiers lib cozy/cozy-libs#1894

Merged

Put expiration service on top of cozy client helpers cozy/mespapiers#330

Merged

JF-Cozy reviewed Nov 30, 2022

View reviewed changes

PolariTOON force-pushed the feat/add-expiration-panel branch 4 times, most recently from 10e9401 to e1f7408 Compare December 6, 2022 14:32

PolariTOON force-pushed the feat/add-expiration-panel branch 4 times, most recently from 554b444 to 5012c0f Compare December 7, 2022 14:53

JF-Cozy approved these changes Dec 7, 2022

View reviewed changes

PolariTOON added 7 commits December 7, 2022 17:37

feat: Update cozy-client to 34.4.0

18cd43d

`cozy-client` as been upgraded to to `34.4.0` to be able to use paper helpers BREAKING CHANGE: You need to update `cozy-client` to `>34.4.0`.

feat: Add an ExpirationAnnotation component

7705cae

feat: Add expiration annotations to date qualifications

763790d

feat: Add an ExpirationAlert component

36d019d

feat: Add the expiration alert to the qualification block

2afb445

fix: Require file prop in Qualification

27fff18

docs: Add an example of a file with many panel blocks in the viewer

a12d0d8

Including an expiration alert.

PolariTOON force-pushed the feat/add-expiration-panel branch from 5012c0f to a12d0d8 Compare December 7, 2022 16:52

PolariTOON merged commit 75a5d0b into master Dec 7, 2022

PolariTOON deleted the feat/add-expiration-panel branch December 7, 2022 17:12

cozy-bot added the released label Dec 7, 2022

Provide feedback

Saved searches

Use saved searches to filter your results more quickly

Add expiration panel #2294

Add expiration panel #2294

PolariTOON commented Nov 29, 2022 •

edited

Loading

bundlemon bot commented Nov 29, 2022 •

edited

Loading

JF-Cozy Nov 30, 2022

PolariTOON Nov 30, 2022

Crash-- Nov 30, 2022

paultranvan Nov 30, 2022

JF-Cozy Dec 1, 2022

JF-Cozy Dec 1, 2022

Crash-- Dec 1, 2022

paultranvan Dec 1, 2022

Crash-- Dec 1, 2022

paultranvan Dec 1, 2022

PolariTOON commented Dec 6, 2022

PolariTOON commented Dec 7, 2022

JF-Cozy left a comment

JF-Cozy Dec 7, 2022

PolariTOON Dec 7, 2022

JF-Cozy Dec 7, 2022

PolariTOON Dec 7, 2022

JF-Cozy Dec 7, 2022

JF-Cozy Dec 7, 2022

JF-Cozy Dec 7, 2022

PolariTOON Dec 7, 2022

Crash-- Dec 8, 2022

JF-Cozy Dec 7, 2022

PolariTOON Dec 7, 2022 •

edited

Loading

JF-Cozy Dec 7, 2022

PolariTOON Dec 7, 2022

cozy-bot commented Dec 7, 2022

Add expiration panel #2294

Add expiration panel #2294

Conversation

PolariTOON commented Nov 29, 2022 • edited Loading

bundlemon bot commented Nov 29, 2022 • edited Loading

BundleMon

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

PolariTOON commented Dec 6, 2022

PolariTOON commented Dec 7, 2022

JF-Cozy left a comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

PolariTOON Dec 7, 2022 • edited Loading

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

cozy-bot commented Dec 7, 2022

PolariTOON commented Nov 29, 2022 •

edited

Loading

bundlemon bot commented Nov 29, 2022 •

edited

Loading

PolariTOON Dec 7, 2022 •

edited

Loading