cozy · zatteo · Jun 5, 2025 · Jun 5, 2025 · Jun 5, 2025 · Jun 5, 2025
@@ -1,23 +1,56 @@
 {
     "baseDir": "./build",
+    "pathLabels": {
+        "chunkId": "[\\d-]+"
+    },
     "files": [
         {
-            "path": "**/contacts.<hash>.js"
+            "path": "intent/static/js/<chunkId>.<hash>.js"
         },
         {
-            "path": "**/contacts.<hash>.min.css"
+            "path": "intent/static/js/cozy.<hash>.js"
         },
         {
-            "path": "app-contacts.<hash>.min.css"
+            "path": "intent/static/js/intents.<hash>.js"
         },
         {
-            "path": "services/**/*.js"
+            "path": "intent/static/js/lib-router.<hash>.js"
+        },
+        {
+            "path": "intent/static/js/lib-react.<hash>.js"
+        },
+        {
+            "path": "intent/static/css/cozy.<hash>.css"
+        },
+        {
+            "path": "intent/static/css/intents.<hash>.css"
+        },
+        {
+            "path": "static/js/<chunkId>.<hash>.js"
+        },
+        {
+            "path": "static/js/cozy.<hash>.js"
         },
         {
-            "path": "vendors-contatcs.<hash>.<hash>.min.css"
+            "path": "static/js/main.<hash>.js"
         },
         {
-            "path": "img/icon.<hash>.svg"
+            "path": "static/js/lib-react.<hash>.js"
+        },
+        {
+            "path": "static/js/lib-router.<hash>.js"
+        },
+        {
+            "path": "static/css/cozy.<hash>.css"
+        },
+        {
+            "path": "static/css/main.<hash>.css"
+        },
+        {
+            "path": "static/svg/*.<hash>.svg"
+        },
+        {
+            "path": "services/**/*.js"
         }
     ],
     "groups": [
@@ -28,7 +61,7 @@
             "path": "**/*.css"
         },
         {
-            "path": "img/*.*"
+            "path": "**/*.{png,svg,ico}"
         }
     ],
     "reportOutput": ["github"]

@@ -13,10 +13,7 @@ module.exports = {
     '^.+\\.jsx?$': 'babel-jest',
     '^.+\\.webapp$': '<rootDir>/json-transformer.js'
   },
-  testEnvironment: 'jest-environment-jsdom-sixteen',
+  testEnvironment: 'jsdom',
   resolver: '<rootDir>/resolver.js',
-  testURL: 'http://localhost',
-  globals: {
-    __DEVELOPMENT__: false
-  }
+  testURL: 'http://localhost'
 }
@@ -3,7 +3,7 @@
   "editor": "Cozy",
   "name_prefix": "Twake",
   "slug": "contacts",
-  "icon": "icon.svg",
+  "icon": "assets/icon.svg",
   "type": "webapp",
   "description": "Contact manager for Twake Workplace",
   "category": "cozy",
@@ -16,9 +16,9 @@
   },
   "default_locale": "en",
   "screenshots": [
-    "screenshots/fr/screenshot01.png",
-    "screenshots/fr/screenshot02.png",
-    "screenshots/fr/screenshot03.png"
+    "assets/screenshots/fr/screenshot01.png",
+    "assets/screenshots/fr/screenshot02.png",
+    "assets/screenshots/fr/screenshot03.png"
   ],
   "routes": {
     "/": {

@@ -8,19 +8,19 @@
     "lint": "yarn lint:js && yarn lint:styles",
     "lint:js": "eslint '{src,test}/**/*.{js,jsx}'",
     "lint:styles": "stylint src/styles --config ./.stylintrc",
-    "build": "cozy-scripts build --browser --barV7 false",
-    "watch": "cozy-scripts watch --browser --barV7 false",
-    "start": "cozy-scripts start --browser --barV7 false",
+    "build": "rsbuild build",
+    "watch": "rsbuild build --watch --mode development",
+    "start": "rsbuild dev",
+    "analyze": "RSDOCTOR=true yarn build",
     "cozyPublish": "cozy-app-publish --token $REGISTRY_TOKEN --build-dir 'build/' --prepublish downcloud --postpublish mattermost",
-    "test": "cozy-scripts test",
+    "test": "env NODE_ENV='test' jest",
     "stack:docker:dev": "docker run --rm -it -p 8080:8080 -p 5984:5984 -e COZY_DISABLE_CSP=1 -v \"$(pwd)/build\":/data/cozy-app/app cozy/cozy-app-dev",
     "stack:docker:prod": "docker run --rm -it -p 8080:8080 -p 5984:5984 -v \"$(pwd)/build\":/data/cozy-app/app cozy/cozy-app-dev",
     "fixtures": "ACH import fixtures/contacts.json",
     "fixtures:drop": "ACH drop io.cozy.contacts io.cozy.contacts.groups",
     "fixtures:massive": "ACH import fixtures/massiveContacts.json",
     "services:autoDefineLabels": "cozy-konnector-dev -m manifest.webapp build/services/autoDefineLabels/contacts.js",
-    "services:keepIndexFullNameAndDisplayNameUpToDate": "cozy-konnector-dev -m manifest.webapp build/services/keepIndexFullNameAndDisplayNameUpToDate/contacts.js",
-    "postinstall": "patch-package"
+    "services:keepIndexFullNameAndDisplayNameUpToDate": "cozy-konnector-dev -m manifest.webapp build/services/keepIndexFullNameAndDisplayNameUpToDate/contacts.js"
   },
   "repository": {
     "type": "git",
@@ -36,6 +36,7 @@
   "devDependencies": {
     "@babel/eslint-parser": "^7.19.1",
     "@babel/polyfill": "7.12.1",
+    "@rsbuild/core": "^1.3.22",
     "@testing-library/jest-dom": "5.16.5",
     "@testing-library/react": "13.4.0",
     "@testing-library/react-hooks": "8.0.1",
@@ -44,9 +45,8 @@
     "babel-preset-cozy-app": "^2.1.0",
     "browser-resolve": "^2.0.0",
     "bundlemon": "3.1.0",
-    "cozy-app-publish": "^0.34.0",
+    "cozy-app-publish": "^0.41.0",
     "cozy-jobs-cli": "^2.3.2",
-    "cozy-scripts": "^8.3.0",
     "eslint": "^8.35.0",
     "eslint-config-cozy-app": "^6.1.0",
     "eslint-config-prettier": "^8.6.0",
@@ -69,6 +69,7 @@
     "react-hot-loader": "4.13.0",
     "react-test-renderer": "18.2.0",
     "replace": "1.2.1",
+    "rsbuild-config-cozy-app": "^0.5.0",
     "stylint": "2.0.0",
     "typescript": "^4.9.5"
    <
E377
span class='blob-code-inner blob-code-marker ' data-code-marker=" ">  },
@@ -93,16 +94,14 @@
     "cozy-search": "^0.6.0",
     "cozy-sharing": "^25.4.0",
     "cozy-tsconfig": "^1.8.1",
-    "cozy-ui": "^124.2.0",
+    "cozy-ui": "^125.0.0",
     "cozy-vcard": "^0.2.18",
     "final-form": "4.20.9",
     "final-form-arrays": "3.1.0",
     "fuse.js": "6.4.6",
     "lodash": "4.17.21",
     "node-fetch": "2.6.7",
     "npm-run-all": "4.1.5",
-    "patch-package": "^8.0.0",
-    "postinstall-postinstall": "^2.1.0",
     "react": "18.2.0",
     "react-final-form": "6.5.9",
     "react-final-form-arrays": "3.1.4",

@@ -0,0 +1,10 @@
+import { defineConfig } from '@rsbuild/core'
+import { getRsbuildConfig } from 'rsbuild-config-cozy-app'
+
+const config = getRsbuildConfig({
+  title: 'Twake Contacts',
+  hasServices: true,
+  hasIntents: true
+})
+
+export default defineConfig(config)
@@ -14,9 +14,12 @@ import { useBreakpoints } from 'cozy-ui/transpiled/react/providers/Breakpoints'
 import ContactsSelectionBar from './layout/ContactsSelectionBar'
 import { ModalManager } from '../helpers/modalManager'
 
+import { useIntentBackdrop } from '@/components/Hooks/useIntentBackdrop'
+
 const AppLayout = ({ withTopBar }) => {
   const client = useClient()
   const { isMobile } = useBreakpoints()
+  useIntentBackdrop()
 
   return (
     <Layout monoColumn withTopBar={withTopBar}>

@@ -2,12 +2,13 @@ import React, { PureComponent } from 'react'
 
 import Spinner from 'cozy-ui/transpiled/react/Spinner'
 
-import '../../styles/spinner.styl'
+import styles from '@/styles/spinner.styl'
+
 class SpinnerContact extends PureComponent {
   render() {
     const { size, loadingType } = this.props
     return (
-      <div className="spinner" data-testid="contactSpinner">
+      <div className={styles['spinner']} data-testid="contactSpinner">
         <Spinner size={size} loadingType={loadingType} middle={true} />
       </div>
     )

@@ -1,3 +1,4 @@
+import cx from 'classnames'
 import uniqueId from 'lodash/uniqueId'
 import PropTypes from 'prop-types'
 import React, { useState } from 'react'
@@ -15,6 +16,8 @@ import FieldInputWrapper from '../Form/FieldInputWrapper'
 import HasValueCondition from '../Form/HasValueCondition'
 import ContactAddressModal from '../Modals/ContactAddressModal'
 
+import styles from '@/styles/contactForm.styl'
+
 const ContactFieldInput = ({
   name,
   labelProps,
@@ -41,7 +44,13 @@ const ContactFieldInput = ({
   }
 
   return (
-    <div className="contact-form-field__wrapper u-flex u-flex-column-s">
+    <div
+      className={cx(
+        styles['contact-form-field__wrapper'],
+        'u-flex',
+        'u-flex-column-s'
+      )}
+    >
       <Field
         {...propsUpdated}
         id={id}

@@ -11,17 +11,19 @@ import { useI18n } from 'cozy-ui/transpiled/react/providers/I18n'
 import ContactFormFieldArrayItem from './ContactFormFieldArrayItem'
 import { addField } from '../../../helpers/fields'
 
+import styles from '@/styles/contactForm.styl'
+
 const ContactFormField = ({ name, icon, isArray, renderInput }) => {
   const { t } = useI18n()
 
   return (
-    <Media align="top" className="contact-form-field">
+    <Media align="top" className={styles['contact-form-field']}>
       <Img>
         {icon ? (
           <Icon
             icon={icon}
             color="var(--iconTextColor)"
-            className="contact-form-field__icon"
+            className={styles['contact-form-field__icon']}
           />
         ) : (
           <div className="u-w-1 u-mr-2" />

@@ -7,6 +7,8 @@ import ListItemIcon from 'cozy-ui/transpiled/react/ListItemIcon'
 
 import { removeField } from '../../../helpers/fields'
 
+import styles from '@/styles/contactForm.styl'
+
 const ContactFormFieldArrayItem = ({
   fields,
   index,
@@ -21,7 +23,7 @@ const ContactFormFieldArrayItem = ({
       {renderInput(`${nameWithIndex}.${name}`)}
 
       {showRemove && (
-        <ListItemIcon className="contact-form-field__delete-icon">
+        <ListItemIcon className={styles['contact-form-field__delete-icon']}>
           <IconButton
             aria-label="delete"
             color="error"

@@ -5,27 +5,31 @@ exports[`ContactGroupList should match the contact snapshot 1`] = `
   className="TwakeTheme--light-normal u-dc"
 >
   <div
-    className="u-mb-2"
+    className="styles__o-layout___3TSz9 styles__o-layout-2panes___1CDQw styles__o-layout-topbar___2SHWi"
   >
-    <h3
-      className="u-title-h2 u-mt-1-half u-mb-1"
+    <div
+      className="u-mb-2"
     >
-      Foo
-    </h3>
-    <ol
-      className="u-nolist u-m-0 u-p-0"
-    >
-      <li
-        className="u-dib u-slateGrey u-fz-small u-p-half u-mr-half u-w-auto u-maw-6 u-bg-paleGrey u-ellipsis"
+      <h3
+        className="u-title-h2 u-mt-1-half u-mb-1"
       >
-        The A Team
-      </li>
-      <li
-        className="u-dib u-slateGrey u-fz-small u-p-half u-mr-half u-w-auto u-maw-6 u-bg-paleGrey u-ellipsis"
+        Foo
+      </h3>
+      <ol
+        className="u-nolist u-m-0 u-p-0"
       >
-        The B Team
-      </li>
-    </ol>
+        <li
+          className="u-dib u-slateGrey u-fz-small u-p-half u-mr-half u-w-auto u-maw-6 u-bg-paleGrey u-ellipsis"
+        >
+          The A Team
+        </li>
+        <li
+          className="u-dib u-slateGrey u-fz-small u-p-half u-mr-half u-w-auto u-maw-6 u-bg-paleGrey u-ellipsis"
+        >
+          The B Team
+        </li>
+      </ol>
+    </div>
   </div>
 </div>
 `;