[VO-1186] feat: Add menu item for legal notice & terms of service

package.json

@@ -58,17 +58,18 @@
     "@sentry/react": "7.101.1",
     "classnames": "2.3.1",
     "cozy-bar": "^15.0.0",
-    "cozy-client": "^48.25.0",
+    "cozy-client": "^51.1.0",
     "cozy-device-helper": "^3.0.0",
+    "cozy-devtools": "^1.2.1",
     "cozy-doctypes": "1.83.7",
     "cozy-flags": "^3.2.2",
     "cozy-harvest-lib": "^26.0.0",
-    "cozy-intent": "2.7.0",
+    "cozy-intent": "2.29.1",
     "cozy-interapp": "0.7.7",
     "cozy-keys-lib": "6.0.0",
     "cozy-realtime": "4.6.0",
     "cozy-sharing": "^15.0.0",
-    "cozy-stack-client": "^48.16.0",
+    "cozy-stack-client": "^51.0.0",
     "cozy-ui": "^111.12.0",
     "piwik-react-router": "0.12.1",
     "prop-types": "15.8.1",

src/components/App.jsx

@@ -8,7 +8,7 @@ import Sprite from 'cozy-ui/transpiled/react/Icon/Sprite'
 import useBreakpoints from 'cozy-ui/transpiled/react/providers/Breakpoints'
 import { Layout, Main } from 'cozy-ui/transpiled/react/Layout'
 import { RealTimeQueries } from 'cozy-client'
-import CozyDevtools from 'cozy-client/dist/devtools'
+import CozyDevtools from 'cozy-devtools'
 import flag from 'cozy-flags'
 import { BarComponent } from 'cozy-bar'
 

src/components/Premium/PremiumProvider.spec.jsx

@@ -34,15 +34,13 @@ describe('PremiumProvider', () => {
       isLoaded: true,
       context: {
         data: {
-          attributes: {
-            enable_premium_links: enablePremiumLinks,
-            manager_url: 'http://mycozy.cloud'
-          }
+          enable_premium_links: enablePremiumLinks,
+          manager_url: 'http://mycozy.cloud'
         }
       },
       instance: {
         data: {
-          attributes: { uuid: hasUuid ? '1223' : null }
+          uuid: hasUuid ? '1223' : null
         }
       }
     })

src/components/Profile/TrackingSection.jsx

@@ -32,9 +32,7 @@ export const TrackingSection = () => {
       name="tracking"
       type="checkbox"
       title={t('ProfileView.tracking.title')}
-      label={t('ProfileView.tracking.label', {
-        version: instance?.tos ? `-${instance.tos}` : '-201711'
-      })}
+      label={t('ProfileView.tracking.label')}
       value={Boolean(instance.tracking)}
       onChange={handleChange}
       submitting={mutationStatus === 'loading'}

src/components/Sidebar.spec.tsx

@@ -21,6 +21,16 @@ jest.mock('components/Premium/PremiumProvider', () => ({
   usePremium: jest.fn(() => ({ isPremium: false }))
 }))
 
+jest.mock('cozy-client', () => ({
+  ...jest.requireActual('cozy-client'),
+  __esModule: true,
+  useInstanceInfo: jest.fn(() => ({
+    isLoaded: true,
+    instance: { data: {} },
+    diskUsage: { data: { used: 100, quota: 200 } }
+  }))
+}))
+
 describe('Sidebar', () => {
   const setup = (): void => {
     render(

src/components/Sidebar.tsx

@@ -12,7 +12,11 @@ import PeopleIcon from 'cozy-ui/transpiled/react/Icons/People'
 import EmailIcon from 'cozy-ui/transpiled/react/Icons/Email'
 import Typography from 'cozy-ui/transpiled/react/Typography'
 import flag from 'cozy-flags'
+import ContractIcon from 'cozy-ui/transpiled/react/Icons/Contract'
 import { useI18n } from 'cozy-ui/transpiled/react/providers/I18n'
+import { useInstanceInfo } from 'cozy-client'
+import JusticeIcon from 'cozy-ui/transpiled/react/Icons/Justice'
+import { makeDiskInfos } from 'cozy-client/dist/models/instance'
 
 import styles from 'components/Sidebar.styl'
 import { MenuItemAnchor } from 'components/menu/MenuItemAnchor'
@@ -21,15 +25,20 @@ import { MenuItemNavLink } from 'components/menu/MenuItemNavLink'
 import { MenuList } from 'components/menu/MenuList'
 import { isFlagshipApp } from 'cozy-device-helper'
 import { routes } from 'constants/routes'
-import { useDiskPercentage } from 'hooks/useDiskPercentage'
 import { useLogout } from 'hooks/useLogout'
 import { SubscriptionMenuItem } from 'components/Subscription/SubscriptionMenuItem'
 
 export const Sidebar = (): JSX.Element => {
   const logout = useLogout()
-  const percent = useDiskPercentage()
+
   const { t } = useI18n()
 
+  const { isLoaded, instance, diskUsage } = useInstanceInfo()
+
+  const percent = isLoaded
+    ? makeDiskInfos(diskUsage.data.used, diskUsage.data.quota).percentUsage
+    : ''
+
   return (
     <nav role="navigation" className={styles.Sidebar}>
       {(isFlagshipApp() || flag('settings.flagship-mode')) && (
@@ -106,6 +115,22 @@ export const Sidebar = (): JSX.Element => {
           primary={t('Nav.contact_support')}
           icon={EmailIcon}
         />
+        {instance.data.legal_notice_url && (
+          <MenuItemAnchor
+            primary={t('Nav.legal_notice')}
+            href={instance.data.legal_notice_url}
+            target="_blank"
+            icon={JusticeIcon}
+          />
+        )}
+        <MenuItemAnchor
+          primary={t('Nav.terms_of_service')}
+          href={`https://files.cozycloud.cc/TOS${
+            instance.data.tos ? `-${instance.data.tos}` : '-201711'
+          }.pdf`}
+          target="_blank"
+          icon={ContractIcon}
+        />
         <MenuItemButton
           primary={t('Nav.primary_logout')}
           icon={Logout}

src/components/Storage/StorageProgress.jsx

@@ -17,8 +17,8 @@ const StorageProgress = () => {
   const { diskUsage } = useInstanceInfo()
 
   const { humanDiskQuota, humanDiskUsage, percentUsage } = makeDiskInfos(
-    diskUsage?.data?.attributes?.used,
-    diskUsage?.data?.attributes?.quota
+    diskUsage.data?.used,
+    diskUsage.data?.quota
   )
 
   return (

src/components/Subscription/SubscriptionStorageItem.jsx

@@ -18,8 +18,8 @@ const SubscriptionStorageItem = () => {
   const { diskUsage } = useInstanceInfo()
 
   const { humanDiskQuota } = makeDiskInfos(
-    diskUsage?.data?.attributes?.used,
-    diskUsage?.data?.attributes?.quota
+    diskUsage.data?.used,
+    diskUsage.data?.quota
   )
 
   return (

src/declaration.d.ts

@@ -0,0 +1,6 @@
+declare module 'cozy-client/dist/models/instance' {
+  export function makeDiskInfos(
+    usage: number | string,
+    quota?: number | string
+  ): import('cozy-client/types/models/instance').DiskInfos
+}

src/locales/de.json

@@ -148,7 +148,7 @@
     },
     "tracking": {
       "title": "Hilf uns, unser Produkt zu verbessern",
-      "label": "Autorisiere Cozy Cloud, anonyme Nutzungsdaten zu sammeln, um unser Produkt zu verbessern. </br>[Über Cozy Verpflichtungen informiert werden](https://files.cozycloud.cc/TOS%{version}.pdf)"
+      "label": "Autorisiere Cozy Cloud, anonyme Nutzungsdaten zu sammeln, um unser Produkt zu verbessern."
     },
     "export": {
       "title": "Meine Daten",

src/locales/de_DE.json

@@ -148,7 +148,7 @@
     },
     "tracking": {
       "title": "Hilf uns, unser Produkt zu verbessern",
-      "label": "Erlaube es Cozy Cloud, anonyme Nutzungsdaten zur Verbesserung des Dienstes zu sammeln.<br/>[Sei informiert über Cozys Verpflichtungen](https://files.cozycloud.cc/TOS%{version}.pdf)"
+      "label": "Erlaube es Cozy Cloud, anonyme Nutzungsdaten zur Verbesserung des Dienstes zu sammeln."
     },
     "export": {
       "title": "Meine Daten",

src/locales/en.json

@@ -100,7 +100,9 @@
     "secondary_used": "%{percent}% used",
     "sessions": "Web connections",
     "storage": "Storage",
-    "contact_support": "Contact us"
+    "contact_support": "Contact us",
+    "terms_of_service": "Terms of Service",
+    "legal_notice": "Legal notice"
   },
   "loading": {
     "loading": "Loading"
@@ -185,7 +187,7 @@
     },
     "tracking": {
       "title": "Help us to improve our product",
-      "label": "Authorize Cozy Cloud to get anonymously your usage data to improve our product.<br/>[Be informed about Cozy commitments](https://files.cozycloud.cc/TOS%{version}.pdf)"
+      "label": "Authorize Cozy Cloud to get anonymously your usage data to improve our product."
     },
     "move": {
       "button": "Move my Cozy"

src/locales/es.json

@@ -148,7 +148,7 @@
     },
     "tracking": {
       "title": "Ayúdenos a mejorar nuestro producto",
-      "label": "Autorizar Cozy Cloud a adquirir anónimamente sus datos de uso para mejorar nuestro producto. [Manténgase informado sobre los compromisis de Cozy](https://files.cozycloud.cc/TOS%{version}.pdf)"
+      "label": "Autorizar Cozy Cloud a adquirir anónimamente sus datos de uso para mejorar nuestro producto."
     },
     "move": {
       "button": "Desplazar mi Cozy"

src/locales/fr.json

@@ -100,7 +100,9 @@
     "secondary_used": "%{percent}% utilisé",
     "sessions": "Connexions web",
     "storage": "Stockage",
-    "contact_support": "Nous contacter"
+    "contact_support": "Nous contacter",
+    "terms_of_service": "Conditions générales d’utilisation",
+    "legal_notice": "Mentions légales"
   },
   "loading": {
     "loading": "Chargement"
@@ -185,7 +187,7 @@
     },
     "tracking": {
       "title": "Nous aider à améliorer notre produit",
-      "label": "Autoriser Cozy à récupérer anonymement vos usages pour améliorer notre produit.<br/>[Soyez informé des engagements de Cozy](https://files.cozycloud.cc/TOS%{version}.pdf)"
+      "label": "Autoriser Cozy à récupérer anonymement vos usages pour améliorer notre produit."
     },
     "move": {
       "button": "Déménager mon Cozy"

src/locales/ja.json

@@ -148,7 +148,7 @@
     },
     "tracking": {
       "title": "製品の改善にご協力ください",
-      "label": "製品を改善するために、Cozy クラウドが使用状況のデータを匿名で取得する権限を与えます。<br/>[Cozy のコミットメントについて](https://files.cozycloud.cc/TOS%{version}.pdf)"
+      "label": "製品を改善するために、Cozy クラウドが使用状況のデータを匿名で取得する権限を与えます."
     },
     "export": {
       "title": "自分のデータ",

src/locales/nl_NL.json

@@ -184,7 +184,7 @@
     },
     "tracking": {
       "title": "Help mee ons product te verbeteren",
-      "label": "Geef Cozy Cloud toestemming om anonieme gebruiksgegevens te verzamelen voor het verbeteren van ons product.<br/>[Lees meer over Cozy's privacywaarborg](https://files.cozycloud.cc/TOS%{version}.pdf)"
+      "label": "Geef Cozy Cloud toestemming om anonieme gebruiksgegevens te verzamelen voor het verbeteren van ons product."
     },
     "move": {
       "button": "Cozy verplaatsen"