cozy-harvest-lib 12.2.0 → 12.3.0

package/CHANGELOG.md

@@ -3,6 +3,25 @@
 All notable changes to this project will be documented in this file.
 See [Conventional Commits](https://conventionalcommits.org) for commit guidelines.
 
+# [12.3.0](https://github.com/cozy/cozy-libs/compare/cozy-harvest-lib@12.2.0...cozy-harvest-lib@12.3.0) (2023-01-17)
+
+
+### Bug Fixes
+
+* **harvest:** Add missing props for ConfigurationTab ([b80b961](https://github.com/cozy/cozy-libs/commit/b80b961e4643e4b246686961e7001f61e04f31ac))
+* **harvest:** Add missing translation for launchTrigger lastSync format ([b8fe298](https://github.com/cozy/cozy-libs/commit/b8fe298a514fccefb396ed2211a785d32b4901e1))
+* **harvest:** WithRouter now handles route even without baseRoute ([6486e7f](https://github.com/cozy/cozy-libs/commit/6486e7ffa1ca61551ee8f59aed3e350b559f093e))
+
+
+### Features
+
+* **harvest:** Add `/config` route on routerV4 and remove tabs ([79c6947](https://github.com/cozy/cozy-libs/commit/79c694721e23678238b3a06c06601ebf476314f1))
+* **harvest:** Add `configure` option in LaunchTriggerAlert menu ([a3be41c](https://github.com/cozy/cozy-libs/commit/a3be41c0816b10166cfaabdeadfd53df6e72ec92))
+
+
+
+
+
 # [12.2.0](https://github.com/cozy/cozy-libs/compare/cozy-harvest-lib@12.1.0...cozy-harvest-lib@12.2.0) (2023-01-11)
 
 

package/dist/components/AccountModalWithoutTabs/FovV4Router/AccountModalContentWrapper.js

@@ -0,0 +1,38 @@
+import React from 'react';
+import DialogContent from '@material-ui/core/DialogContent';
+import useBreakpoints from 'cozy-ui/transpiled/react/hooks/useBreakpoints';
+import FlowProvider from '../../FlowProvider';
+import TriggerError from '../TriggerError';
+
+var AccountModalContentWrapper = function AccountModalContentWrapper(_ref) {
+  var children = _ref.children,
+      trigger = _ref.trigger,
+      account = _ref.account,
+      konnector = _ref.konnector;
+
+  var _useBreakpoints = useBreakpoints(),
+      isMobile = _useBreakpoints.isMobile;
+
+  return /*#__PURE__*/React.createElement(DialogContent, {
+    className: isMobile ? 'u-p-0' : 'u-pt-0'
+  }, /*#__PURE__*/React.createElement(FlowProvider, {
+    initialTrigger: trigger,
+    konnector: konnector
+  }, function (_ref2) {
+    var flow = _ref2.flow;
+    return /*#__PURE__*/React.createElement(React.Fragment, null, /*#__PURE__*/React.createElement(TriggerError, {
+      flow: flow,
+      konnector: konnector,
+      account: account,
+      trigger: trigger
+    }), React.Children.map(children, function (child) {
+      return /*#__PURE__*/React.isValidElement(child) ? /*#__PURE__*/React.cloneElement(child, {
+        flow: flow,
+        trigger: trigger,
+        account: account
+      }) : null;
+    }));
+  }));
+};
+
+export default AccountModalContentWrapper;

package/dist/components/AccountModalWithoutTabs/FovV4Router/AccountModalWithoutTabs.js

@@ -0,0 +1,68 @@
+import _objectWithoutProperties from "@babel/runtime/helpers/objectWithoutProperties";
+var _excluded = ["data"];
+import React from 'react';
+import PropTypes from 'prop-types';
+import DialogContent from '@material-ui/core/DialogContent';
+import { useQuery, isQueryLoading } from 'cozy-client';
+import Spinner from 'cozy-ui/transpiled/react/Spinner';
+import { buildAccountQueryById } from '../../../connections/accounts';
+import { withMountPointProps } from '../../MountPointContext';
+import { getMatchingTrigger } from '../helpers';
+import AccountModalHeader from '../AccountModalHeader';
+import Error from '../Error';
+
+var AccountModalWithoutTabs = function AccountModalWithoutTabs(_ref) {
+  var accountsAndTriggers = _ref.accountsAndTriggers,
+      konnector = _ref.konnector,
+      accountId = _ref.accountId,
+      children = _ref.children;
+  var matchingTrigger = getMatchingTrigger(accountsAndTriggers, accountId);
+  var matchingAccountId = matchingTrigger ? accountId : undefined;
+
+  var _buildAccountQueryByI = buildAccountQueryById(matchingAccountId),
+      definition = _buildAccountQueryByI.definition,
+      options = _buildAccountQueryByI.options;
+
+  var _useQuery = useQuery(definition, options),
+      accounts = _useQuery.data,
+      accountQueryResult = _objectWithoutProperties(_useQuery, _excluded);
+
+  var isLoading = isQueryLoading(accountQueryResult) || accountQueryResult.hasMore;
+  var isError = !isLoading && (!matchingTrigger || !accounts || (accounts === null || accounts === void 0 ? void 0 : accounts.length) === 0);
+  var account = accounts === null || accounts === void 0 ? void 0 : accounts[0];
+  return /*#__PURE__*/React.createElement(React.Fragment, null, /*#__PURE__*/React.createElement(AccountModalHeader, {
+    konnector: konnector,
+    account: account,
+    accountsAndTriggers: accountsAndTriggers
+  }), (isError || isLoading) && /*#__PURE__*/React.createElement(DialogContent, {
+    className: "u-pb-2"
+  }, isError && /*#__PURE__*/React.createElement(Error, {
+    accountId: accountId,
+    accountsAndTriggers: accountsAndTriggers,
+    trigger: matchingTrigger,
+    lastError: accountQueryResult.lastError
+  }), isLoading && /*#__PURE__*/React.createElement(Spinner, {
+    className: "u-flex u-flex-justify-center",
+    size: "xxlarge"
+  })), !isError && !isLoading && React.Children.map(children, function (child) {
+    return /*#__PURE__*/React.isValidElement(child) ? /*#__PURE__*/React.cloneElement(child, {
+      trigger: matchingTrigger,
+      account: account,
+      konnector: konnector
+    }) : null;
+  }));
+};
+
+AccountModalWithoutTabs.propTypes = {
+  konnector: PropTypes.object.isRequired,
+
+  /**
+   * @type {{ account: 'io.cozy.accounts', trigger: 'io.cozy.triggers' }[]} - An array of objects containing an account and its associated trigger
+   */
+  accountsAndTriggers: PropTypes.arrayOf(PropTypes.shape({
+    account: PropTypes.object.isRequired,
+    trigger: PropTypes.object.isRequired
+  })).isRequired,
+  accountId: PropTypes.string.isRequired
+};
+export default withMountPointProps(AccountModalWithoutTabs);

package/dist/components/KonnectorConfiguration/ConfigurationTab/index.js

@@ -278,7 +278,7 @@ var ConfigurationTab = function ConfigurationTab(_ref2) {
 
 ConfigurationTab.propTypes = {
   konnector: PropTypes.object.isRequired,
-  account: PropTypes.object.isRequired,
+  account: PropTypes.object,
   error: PropTypes.object,
   flow: PropTypes.object,
   addAccount: PropTypes.func.isRequired,

package/dist/components/KonnectorConfiguration/DataTab/index.js

@@ -27,6 +27,7 @@ var styles = {
 };
 export var DataTab = function DataTab(_ref) {
   var konnector = _ref.konnector,
+      konnectorRoot = _ref.konnectorRoot,
       trigger = _ref.trigger,
       client = _ref.client,
       flow = _ref.flow,
@@ -56,6 +57,7 @@ export var DataTab = function DataTab(_ref) {
       maintenanceMessages = _useMaintenanceStatus2.messages;
 
   return /*#__PURE__*/React.createElement("div", null, flag('harvest.inappconnectors.enabled') && /*#__PURE__*/React.createElement(React.Fragment, null, /*#__PURE__*/React.createElement(LaunchTriggerCard, {
+    konnectorRoot: konnectorRoot,
     flow: flow,
     disabled: isInMaintenance
   }), isMobile && /*#__PURE__*/React.createElement(Divider, {
@@ -90,7 +92,10 @@ export var DataTab = function DataTab(_ref) {
 };
 DataTab.propTypes = {
   konnector: PropTypes.object.isRequired,
+  konnectorRoot: PropTypes.string,
   trigger: PropTypes.object.isRequired,
-  client: PropTypes.object.isRequired
+  client: PropTypes.object.isRequired,
+  flow: PropTypes.object,
+  account: PropTypes.object
 };
 export default withClient(DataTab);

package/dist/components/Routes/RoutesV4.js

@@ -7,11 +7,17 @@ import NewAccountModal from '../NewAccountModal';
 import EditAccountModal from '../EditAccountModal';
 import KonnectorSuccess from '../KonnectorSuccess';
 import HarvestModalRoot from '../HarvestModalRoot';
+import AccountModalWithoutTabs from '../AccountModalWithoutTabs/FovV4Router/AccountModalWithoutTabs';
+import AccountModalContentWrapper from '../AccountModalWithoutTabs/FovV4Router/AccountModalContentWrapper';
+import DataTab from '../KonnectorConfiguration/DataTab';
+import ConfigurationTab from '../KonnectorConfiguration/ConfigurationTab';
+import withAdaptiveRouter from '../hoc/withRouter';
 
 var RoutesV4 = function RoutesV4(_ref) {
   var konnectorRoot = _ref.konnectorRoot,
       konnectorWithTriggers = _ref.konnectorWithTriggers,
       accountsAndTriggers = _ref.accountsAndTriggers,
+      historyAction = _ref.historyAction,
       onSuccess = _ref.onSuccess,
       onDismiss = _ref.onDismiss;
   return /*#__PURE__*/React.createElement(Switch, null, /*#__PURE__*/React.createElement(Route, {
@@ -23,11 +29,51 @@ var RoutesV4 = function RoutesV4(_ref) {
         konnector: konnectorWithTriggers
       });
     }
-  }), /*#__PURE__*/React.createElement(Route, {
+  }), flag('harvest.inappconnectors.enabled') ? /*#__PURE__*/React.createElement(React.Fragment, null, /*#__PURE__*/React.createElement(Route, {
     path: "".concat(konnectorRoot, "/accounts/:accountId"),
     exact: true,
     render: function render(_ref2) {
       var match = _ref2.match;
+      return /*#__PURE__*/React.createElement(AccountModalWithoutTabs, {
+        konnector: konnectorWithTriggers,
+        accountId: match.params.accountId,
+        accountsAndTriggers: accountsAndTriggers,
+        showNewAccountButton: !konnectorWithTriggers.clientSide,
+        showAccountSelection: !konnectorWithTriggers.clientSide,
+        onDismiss: onDismiss
+      }, /*#__PURE__*/React.createElement(AccountModalContentWrapper, null, /*#__PURE__*/React.createElement(DataTab, {
+        konnectorRoot: "".concat(konnectorRoot, "/accounts/").concat(match.params.accountId),
+        konnector: konnectorWithTriggers,
+        showNewAccountButton: !konnectorWithTriggers.clientSide,
+        onDismiss: onDismiss
+      })));
+    }
+  }), /*#__PURE__*/React.createElement(Route, {
+    path: "".concat(konnectorRoot, "/accounts/:accountId/config"),
+    exact: true,
+    render: function render(_ref3) {
+      var match = _ref3.match;
+      return /*#__PURE__*/React.createElement(AccountModalWithoutTabs, {
+        konnector: konnectorWithTriggers,
+        accountId: match.params.accountId,
+        accountsAndTriggers: accountsAndTriggers,
+        showNewAccountButton: !konnectorWithTriggers.clientSide,
+        showAccountSelection: !konnectorWithTriggers.clientSide,
+        onDismiss: onDismiss
+      }, /*#__PURE__*/React.createElement(AccountModalContentWrapper, null, /*#__PURE__*/React.createElement(ConfigurationTab, {
+        konnector: konnectorWithTriggers,
+        showNewAccountButton: !konnectorWithTriggers.clientSide,
+        onAccountDeleted: onDismiss,
+        addAccount: function addAccount() {
+          return historyAction("".concat(konnectorRoot, "/new"), 'replace');
+        }
+      })));
+    }
+  })) : /*#__PURE__*/React.createElement(Route, {
+    path: "".concat(konnectorRoot, "/accounts/:accountId"),
+    exact: true,
+    render: function render(_ref4) {
+      var match = _ref4.match;
       return /*#__PURE__*/React.createElement(AccountModal, {
         konnector: konnectorWithTriggers,
         accountId: match.params.accountId,
@@ -40,8 +86,8 @@ var RoutesV4 = function RoutesV4(_ref) {
   }), /*#__PURE__*/React.createElement(Route, {
     path: "".concat(konnectorRoot, "/accounts/:accountId/edit"),
     exact: true,
-    render: function render(_ref3) {
-      var match = _ref3.match;
+    render: function render(_ref5) {
+      var match = _ref5.match;
       return /*#__PURE__*/React.createElement(EditAccountModal, {
         konnector: konnectorWithTriggers,
         accountId: match.params.accountId,
@@ -67,8 +113,8 @@ var RoutesV4 = function RoutesV4(_ref) {
   }), !flag('harvest.inappconnectors.enabled') && /*#__PURE__*/React.createElement(Route, {
     path: "".concat(konnectorRoot, "/accounts/:accountId/success"),
     exact: true,
-    render: function render(_ref4) {
-      var match = _ref4.match;
+    render: function render(_ref6) {
+      var match = _ref6.match;
       return /*#__PURE__*/React.createElement(KonnectorSuccess, {
         konnector: konnectorWithTriggers,
         accountId: match.params.accountId,
@@ -82,4 +128,4 @@ var RoutesV4 = function RoutesV4(_ref) {
   }));
 };
 
-export default RoutesV4;
+export default withAdaptiveRouter(RoutesV4);

package/dist/components/Routes/RoutesV6.js

@@ -1,5 +1,5 @@
 import React from 'react';
-import { Routes, Route, Navigate, useParams } from 'react-router-dom';
+import { Routes, Route, Navigate, useParams, useNavigate } from 'react-router-dom';
 import flag from 'cozy-flags';
 import { ViewerModal } from '../../datacards/ViewerModal';
 import AccountModal from '../AccountModal';
@@ -22,6 +22,7 @@ var RoutesV6 = function RoutesV6(_ref) {
       accountsAndTriggers = _ref.accountsAndTriggers,
       onSuccess = _ref.onSuccess,
       onDismiss = _ref.onDismiss;
+  var navigate = useNavigate();
   return /*#__PURE__*/React.createElement(Routes, null, /*#__PURE__*/React.createElement(Route, {
     path: "/",
     element: /*#__PURE__*/React.createElement(HarvestModalRoot, {
@@ -59,7 +60,12 @@ var RoutesV6 = function RoutesV6(_ref) {
     element: /*#__PURE__*/React.createElement(AccountModalContentWrapper, null, /*#__PURE__*/React.createElement(ConfigurationTab, {
       konnector: konnectorWithTriggers,
       showNewAccountButton: !konnectorWithTriggers.clientSide,
-      onDismiss: onDismiss
+      onAccountDeleted: onDismiss,
+      addAccount: function addAccount() {
+        return navigate('new', {
+          replace: true
+        });
+      }
     }))
   })) : /*#__PURE__*/React.createElement(Route, {
     path: "accounts/:accountId",

package/dist/components/cards/LaunchTriggerAlert.js

@@ -1,5 +1,6 @@
 import _slicedToArray from "@babel/runtime/helpers/slicedToArray";
 import React, { useRef, useState, useEffect } from 'react';
+import PropTypes from 'prop-types';
 import ActionMenu, { ActionMenuItem } from 'cozy-ui/transpiled/react/ActionMenu';
 import Alert from 'cozy-ui/transpiled/react/Alert';
 import Button from 'cozy-ui/transpiled/react/Buttons';
@@ -10,17 +11,29 @@ import Spinner from 'cozy-ui/transpiled/react/Spinner';
 import Snackbar from 'cozy-ui/transpiled/react/Snackbar';
 import DotsIcon from 'cozy-ui/transpiled/react/Icons/Dots';
 import SyncIcon from 'cozy-ui/transpiled/react/Icons/Sync';
+import GearIcon from 'cozy-ui/transpiled/react/Icons/Gear';
 import { getLastSuccessDate, getKonnectorSlug } from '../../helpers/triggers';
 import { isRunnable } from '../../helpers/konnectors';
 import { useFlowState } from '../../models/withConnectionFlow';
 import { SUCCESS } from '../../models/flowEvents';
+import withAdaptiveRouter from '../hoc/withRouter';
 import KonnectorIcon from '../KonnectorIcon';
 import { makeLabel } from './helpers';
+var styles = {
+  // tricks to put 48px wide button inside 32px height container
+  // without enlarging the container
+  iconButtonWrapper: {
+    height: 32,
+    width: 46
+  }
+};
 export var LaunchTriggerAlert = function LaunchTriggerAlert(_ref) {
   var flow = _ref.flow,
       f = _ref.f,
       t = _ref.t,
-      disabled = _ref.disabled;
+      disabled = _ref.disabled,
+      konnectorRoot = _ref.konnectorRoot,
+      historyAction = _ref.historyAction;
 
   var _useState = useState(false),
       _useState2 = _slicedToArray(_useState, 2),
@@ -53,6 +66,7 @@ export var LaunchTriggerAlert = function LaunchTriggerAlert(_ref) {
     }
   }, [status]);
   return /*#__PURE__*/React.createElement(React.Fragment, null, /*#__PURE__*/React.createElement(Alert, {
+    className: "u-pr-half",
     color: "var(--paperBackground)",
     icon: running ? /*#__PURE__*/React.createElement(Spinner, {
       className: "u-flex",
@@ -71,15 +85,17 @@ export var LaunchTriggerAlert = function LaunchTriggerAlert(_ref) {
           autoSuccessTimer: false
         });
       }
-    }), /*#__PURE__*/React.createElement(IconButton, {
+    }), /*#__PURE__*/React.createElement("div", {
+      className: "u-flex u-flex-items-center",
+      style: styles.iconButtonWrapper
+    }, /*#__PURE__*/React.createElement(IconButton, {
       ref: anchorRef,
       onClick: function onClick() {
         return setShowOptions(true);
-      },
-      className: "u-p-half"
+      }
     }, /*#__PURE__*/React.createElement(Icon, {
       icon: DotsIcon
-    })), showOptions && /*#__PURE__*/React.createElement(ActionMenu, {
+    }))), showOptions && /*#__PURE__*/React.createElement(ActionMenu, {
       anchorElRef: anchorRef,
       autoclose: true,
       onClose: function onClose() {
@@ -95,7 +111,14 @@ export var LaunchTriggerAlert = function LaunchTriggerAlert(_ref) {
         });
         setShowOptions(false);
       }
-    }, t('card.launchTrigger.button.label'))))
+    }, t('card.launchTrigger.button.label')), /*#__PURE__*/React.createElement(ActionMenuItem, {
+      left: /*#__PURE__*/React.createElement(Icon, {
+        icon: GearIcon
+      }),
+      onClick: function onClick() {
+        return historyAction("".concat(konnectorRoot, "/config"), 'push');
+      }
+    }, t('card.launchTrigger.configure'))))
   }, /*#__PURE__*/React.createElement(Typography, {
     variant: "caption"
   }, makeLabel({
@@ -118,4 +141,15 @@ export var LaunchTriggerAlert = function LaunchTriggerAlert(_ref) {
     }
   }, t('card.launchTrigger.success'))));
 };
-export default LaunchTriggerAlert;
+LaunchTriggerAlert.defaultProps = {
+  konnectorRoot: ''
+};
+LaunchTriggerAlert.propTypes = {
+  flow: PropTypes.object,
+  f: PropTypes.function,
+  t: PropTypes.function,
+  disabled: PropTypes.bool,
+  konnectorRoot: PropTypes.string,
+  historyAction: PropTypes.function
+};
+export default withAdaptiveRouter(LaunchTriggerAlert);

package/dist/components/hoc/withRouter.js

@@ -23,7 +23,8 @@ export var historyAction = function historyAction(props, historyOrNavigate) {
       });
     }
 
-    var segments = '/'.concat(baseRoute.split('/').concat(route.split('/')).filter(Boolean).join('/'));
+    var splitBaseRoute = (baseRoute === null || baseRoute === void 0 ? void 0 : baseRoute.split('/')) || [];
+    var segments = '/'.concat(splitBaseRoute.concat(route.split('/')).filter(Boolean).join('/'));
     return historyOrNavigate[method](segments);
   };
 };

package/dist/components/hoc/withRouter.spec.js

@@ -74,4 +74,12 @@ describe('historyAction', function () {
     expect(historyMock.replace).toHaveBeenCalledWith('/base/route/one/two');
     historyMock.replace.mockReset();
   });
+  it('should handle even if no base route', function () {
+    setup({
+      baseRoute: undefined,
+      route: '/one'
+    });
+    expect(historyMock.replace).toHaveBeenCalledWith('/one');
+    historyMock.replace.mockReset();
+  });
 });

package/dist/locales/en.json

@@ -77,6 +77,7 @@
       "button": {
         "label": "Run again now"
       },
+      "configure": "Configure",
       "success": "Successful synchronization",
       "error": "An error occured.",
       "frequency": {
@@ -92,6 +93,7 @@
         "syncing": "Data recovery…",
         "unknown": "Unknown",
         "afterSomeTimes": "Sync. %{times} ago",
+        "format": "MM/DD/YYYY",
         "justNow": "Sync. just now"
       }
     },

package/dist/locales/fr.json

@@ -77,6 +77,7 @@
       "button": {
         "label": "Mettre à jour"
       },
+      "configure": "Configurer",
       "success": "Synchronisation réussie",
       "error": "Une erreur est survenue.",
       "frequency": {
@@ -92,6 +93,7 @@
         "syncing": "Récupération des données…",
         "unknown": "Indéterminée",
         "afterSomeTimes": "Sync. il y a %{times}",
+        "format": "DD/MM/YYYY",
         "justNow": "Sync. à l'instant"
       }
     },

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "cozy-harvest-lib",
-  "version": "12.2.0",
+  "version": "12.3.0",
   "description": "Provides logic, modules and components for Cozy's harvest applications.",
   "main": "dist/index.js",
   "author": "Cozy",
@@ -88,5 +88,5 @@
     "react-router-dom": ">=4.3.1"
   },
   "sideEffects": false,
-  "gitHead": "53527f83fa5f4cacc7202f90e4afe22a43b24311"
+  "gitHead": "b33303f0e197336675f8b4817576de6c353e6015"
 }

package/src/components/AccountModalWithoutTabs/FovV4Router/AccountModalContentWrapper.jsx

@@ -0,0 +1,40 @@
+import React from 'react'
+import DialogContent from '@material-ui/core/DialogContent'
+
+import useBreakpoints from 'cozy-ui/transpiled/react/hooks/useBreakpoints'
+
+import FlowProvider from '../../FlowProvider'
+import TriggerError from '../TriggerError'
+
+const AccountModalContentWrapper = ({
+  children,
+  trigger,
+  account,
+  konnector
+}) => {
+  const { isMobile } = useBreakpoints()
+
+  return (
+    <DialogContent className={isMobile ? 'u-p-0' : 'u-pt-0'}>
+      <FlowProvider initialTrigger={trigger} konnector={konnector}>
+        {({ flow }) => (
+          <>
+            <TriggerError
+              flow={flow}
+              konnector={konnector}
+              account={account}
+              trigger={trigger}
+            />
+            {React.Children.map(children, child =>
+              React.isValidElement(child)
+                ? React.cloneElement(child, { flow, trigger, account })
+                : null
+            )}
+          </>
+        )}
+      </FlowProvider>
+    </DialogContent>
+  )
+}
+
+export default AccountModalContentWrapper

package/src/components/AccountModalWithoutTabs/FovV4Router/AccountModalWithoutTabs.jsx

@@ -0,0 +1,88 @@
+import React from 'react'
+import PropTypes from 'prop-types'
+import DialogContent from '@material-ui/core/DialogContent'
+
+import { useQuery, isQueryLoading } from 'cozy-client'
+import Spinner from 'cozy-ui/transpiled/react/Spinner'
+
+import { buildAccountQueryById } from '../../../connections/accounts'
+import { withMountPointProps } from '../../MountPointContext'
+import { getMatchingTrigger } from '../helpers'
+import AccountModalHeader from '../AccountModalHeader'
+import Error from '../Error'
+
+const AccountModalWithoutTabs = ({
+  accountsAndTriggers,
+  konnector,
+  accountId,
+  children
+}) => {
+  const matchingTrigger = getMatchingTrigger(accountsAndTriggers, accountId)
+  const matchingAccountId = matchingTrigger ? accountId : undefined
+
+  const { definition, options } = buildAccountQueryById(matchingAccountId)
+  const { data: accounts, ...accountQueryResult } = useQuery(
+    definition,
+    options
+  )
+
+  const isLoading =
+    isQueryLoading(accountQueryResult) || accountQueryResult.hasMore
+
+  const isError =
+    !isLoading && (!matchingTrigger || !accounts || accounts?.length === 0)
+
+  const account = accounts?.[0]
+
+  return (
+    <>
+      <AccountModalHeader
+        konnector={konnector}
+        account={account}
+        accountsAndTriggers={accountsAndTriggers}
+      />
+      {(isError || isLoading) && (
+        <DialogContent className="u-pb-2">
+          {isError && (
+            <Error
+              accountId={accountId}
+              accountsAndTriggers={accountsAndTriggers}
+              trigger={matchingTrigger}
+              lastError={accountQueryResult.lastError}
+            />
+          )}
+          {isLoading && (
+            <Spinner className="u-flex u-flex-justify-center" size="xxlarge" />
+          )}
+        </DialogContent>
+      )}
+      {!isError &&
+        !isLoading &&
+        React.Children.map(children, child =>
+          React.isValidElement(child)
+            ? React.cloneElement(child, {
+                trigger: matchingTrigger,
+                account,
+                konnector
+              })
+            : null
+        )}
+    </>
+  )
+}
+
+AccountModalWithoutTabs.propTypes = {
+  konnector: PropTypes.object.isRequired,
+  /**
+   * @type {{ account: 'io.cozy.accounts', trigger: 'io.cozy.triggers' }[]} - An array of objects containing an account and its associated trigger
+   */
+  accountsAndTriggers: PropTypes.arrayOf(
+    PropTypes.shape({
+      account: PropTypes.object.isRequired,
+      trigger: PropTypes.object.isRequired
+    })
+  ).isRequired,
+  accountId: PropTypes.string.isRequired
+}
+
+export default withMountPointProps(AccountModalWithoutTabs)

package/src/components/KonnectorConfiguration/ConfigurationTab/index.jsx

@@ -233,7 +233,7 @@ const ConfigurationTab = ({
 
 ConfigurationTab.propTypes = {
   konnector: PropTypes.object.isRequired,
-  account: PropTypes.object.isRequired,
+  account: PropTypes.object,
   error: PropTypes.object,
   flow: PropTypes.object,
   addAccount: PropTypes.func.isRequired,

package/src/components/KonnectorConfiguration/DataTab/index.jsx

@@ -26,7 +26,14 @@ const styles = {
   }
 }
 
-export const DataTab = ({ konnector, trigger, client, flow, account }) => {
+export const DataTab = ({
+  konnector,
+  konnectorRoot,
+  trigger,
+  client,
+  flow,
+  account
+}) => {
   const { isMobile } = useBreakpoints()
   const flowState = flow.getState()
   const { error } = flowState
@@ -51,7 +58,11 @@ export const DataTab = ({ konnector, trigger, client, flow, account }) => {
     <div>
       {flag('harvest.inappconnectors.enabled') && (
         <>
-          <LaunchTriggerCard flow={flow} disabled={isInMaintenance} />
+          <LaunchTriggerCard
+            konnectorRoot={konnectorRoot}
+            flow={flow}
+            disabled={isInMaintenance}
+          />
           {isMobile && <Divider style={styles.divider} />}
         </>
       )}
@@ -90,8 +101,11 @@ export const DataTab = ({ konnector, trigger, client, flow, account }) => {
 
 DataTab.propTypes = {
   konnector: PropTypes.object.isRequired,
+  konnectorRoot: PropTypes.string,
   trigger: PropTypes.object.isRequired,
-  client: PropTypes.object.isRequired
+  client: PropTypes.object.isRequired,
+  flow: PropTypes.object,
+  account: PropTypes.object
 }
 
 export default withClient(DataTab)

package/src/components/Routes/RoutesV4.jsx

@@ -9,11 +9,17 @@ import NewAccountModal from '../NewAccountModal'
 import EditAccountModal from '../EditAccountModal'
 import KonnectorSuccess from '../KonnectorSuccess'
 import HarvestModalRoot from '../HarvestModalRoot'
+import AccountModalWithoutTabs from '../AccountModalWithoutTabs/FovV4Router/AccountModalWithoutTabs'
+import AccountModalContentWrapper from '../AccountModalWithoutTabs/FovV4Router/AccountModalContentWrapper'
+import DataTab from '../KonnectorConfiguration/DataTab'
+import ConfigurationTab from '../KonnectorConfiguration/ConfigurationTab'
+import withAdaptiveRouter from '../hoc/withRouter'
 
 const RoutesV4 = ({
   konnectorRoot,
   konnectorWithTriggers,
   accountsAndTriggers,
+  historyAction,
   onSuccess,
   onDismiss
 }) => {
@@ -29,20 +35,74 @@ const RoutesV4 = ({
           />
         )}
       />
-      <Route
-        path={`${konnectorRoot}/accounts/:accountId`}
-        exact
-        render={({ match }) => (
-          <AccountModal
-            konnector={konnectorWithTriggers}
-            accountId={match.params.accountId}
-            accountsAndTriggers={accountsAndTriggers}
-            onDismiss={onDismiss}
-            showNewAccountButton={!konnectorWithTriggers.clientSide}
-            showAccountSelection={!konnectorWithTriggers.clientSide}
+      {flag('harvest.inappconnectors.enabled') ? (
+        <>
+          <Route
+            path={`${konnectorRoot}/accounts/:accountId`}
+            exact
+            render={({ match }) => (
+              <AccountModalWithoutTabs
+                konnector={konnectorWithTriggers}
+                accountId={match.params.accountId}
+                accountsAndTriggers={accountsAndTriggers}
+                showNewAccountButton={!konnectorWithTriggers.clientSide}
+                showAccountSelection={!konnectorWithTriggers.clientSide}
+                onDismiss={onDismiss}
+              >
+                <AccountModalContentWrapper>
+                  <DataTab
+                    konnectorRoot={`${konnectorRoot}/accounts/${match.params.accountId}`}
+                    konnector={konnectorWithTriggers}
+                    showNewAccountButton={!konnectorWithTriggers.clientSide}
+                    onDismiss={onDismiss}
+                  />
+                </AccountModalContentWrapper>
+              </AccountModalWithoutTabs>
+            )}
           />
-        )}
-      />
+          <Route
+            path={`${konnectorRoot}/accounts/:accountId/config`}
+            exact
+            render={({ match }) => (
+              <AccountModalWithoutTabs
+                konnector={konnectorWithTriggers}
+                accountId={match.params.accountId}
+                accountsAndTriggers={accountsAndTriggers}
+                showNewAccountButton={!konnectorWithTriggers.clientSide}
+                showAccountSelection={!konnectorWithTriggers.clientSide}
+                onDismiss={onDismiss}
+              >
+                <AccountModalContentWrapper>
+                  <ConfigurationTab
+                    konnector={konnectorWithTriggers}
+                    showNewAccountButton={!konnectorWithTriggers.clientSide}
+                    onAccountDeleted={onDismiss}
+                    addAccount={() =>
+                      historyAction(`${konnectorRoot}/new`, 'replace')
+                    }
+                  />
+                </AccountModalContentWrapper>
+              </AccountModalWithoutTabs>
+            )}
+          />
+        </>
+      ) : (
+        <Route
+          path={`${konnectorRoot}/accounts/:accountId`}
+          exact
+          render={({ match }) => (
+            <AccountModal
+              konnector={konnectorWithTriggers}
+              accountId={match.params.accountId}
+              accountsAndTriggers={accountsAndTriggers}
+              onDismiss={onDismiss}
+              showNewAccountButton={!konnectorWithTriggers.clientSide}
+              showAccountSelection={!konnectorWithTriggers.clientSide}
+            />
+          )}
+        />
+      )}
+
       <Route
         path={`${konnectorRoot}/accounts/:accountId/edit`}
         exact
@@ -91,4 +151,4 @@ const RoutesV4 = ({
   )
 }
 
-export default RoutesV4
+export default withAdaptiveRouter(RoutesV4)

package/src/components/Routes/RoutesV6.jsx

@@ -1,5 +1,11 @@
 import React from 'react'
-import { Routes, Route, Navigate, useParams } from 'react-router-dom'
+import {
+  Routes,
+  Route,
+  Navigate,
+  useParams,
+  useNavigate
+} from 'react-router-dom'
 
 import flag from 'cozy-flags'
 
@@ -25,6 +31,8 @@ const RoutesV6 = ({
   onSuccess,
   onDismiss
 }) => {
+  const navigate = useNavigate()
+
   return (
     <Routes>
       <Route
@@ -85,7 +93,8 @@ const RoutesV6 = ({
                 <ConfigurationTab
                   konnector={konnectorWithTriggers}
                   showNewAccountButton={!konnectorWithTriggers.clientSide}
-                  onDismiss={onDismiss}
+                  onAccountDeleted={onDismiss}
+                  addAccount={() => navigate('new', { replace: true })}
                 />
               </AccountModalContentWrapper>
             }

package/src/components/cards/LaunchTriggerAlert.jsx

@@ -1,4 +1,5 @@
 import React, { useRef, useState, useEffect } from 'react'
+import PropTypes from 'prop-types'
 
 import ActionMenu, { ActionMenuItem } from 'cozy-ui/transpiled/react/ActionMenu'
 import Alert from 'cozy-ui/transpiled/react/Alert'
@@ -10,15 +11,30 @@ import Spinner from 'cozy-ui/transpiled/react/Spinner'
 import Snackbar from 'cozy-ui/transpiled/react/Snackbar'
 import DotsIcon from 'cozy-ui/transpiled/react/Icons/Dots'
 import SyncIcon from 'cozy-ui/transpiled/react/Icons/Sync'
+import GearIcon from 'cozy-ui/transpiled/react/Icons/Gear'
 
 import { getLastSuccessDate, getKonnectorSlug } from '../../helpers/triggers'
 import { isRunnable } from '../../helpers/konnectors'
 import { useFlowState } from '../../models/withConnectionFlow'
 import { SUCCESS } from '../../models/flowEvents'
+import withAdaptiveRouter from '../hoc/withRouter'
 import KonnectorIcon from '../KonnectorIcon'
 import { makeLabel } from './helpers'
 
-export const LaunchTriggerAlert = ({ flow, f, t, disabled }) => {
+const styles = {
+  // tricks to put 48px wide button inside 32px height container
+  // without enlarging the container
+  iconButtonWrapper: { height: 32, width: 46 }
+}
+
+export const LaunchTriggerAlert = ({
+  flow,
+  f,
+  t,
+  disabled,
+  konnectorRoot,
+  historyAction
+}) => {
   const [showSuccessSnackbar, setShowSuccessSnackbar] = useState(false)
   const { trigger, running, expectingTriggerLaunch, status } =
     useFlowState(flow)
@@ -38,6 +54,7 @@ export const LaunchTriggerAlert = ({ flow, f, t, disabled }) => {
   return (
     <>
       <Alert
+        className="u-pr-half"
         color="var(--paperBackground)"
         icon={
           running ? (
@@ -59,13 +76,17 @@ export const LaunchTriggerAlert = ({ flow, f, t, disabled }) => {
                 label={t('card.launchTrigger.button.label')}
                 onClick={() => launch({ autoSuccessTimer: false })}
               />
-              <IconButton
-                ref={anchorRef}
-                onClick={() => setShowOptions(true)}
-                className="u-p-half"
+              <div
+                className="u-flex u-flex-items-center"
+                style={styles.iconButtonWrapper}
               >
-                <Icon icon={DotsIcon} />
-              </IconButton>
+                <IconButton
+                  ref={anchorRef}
+                  onClick={() => setShowOptions(true)}
+                >
+                  <Icon icon={DotsIcon} />
+                </IconButton>
+              </div>
               {showOptions && (
                 <ActionMenu
                   anchorElRef={anchorRef}
@@ -83,6 +104,14 @@ export const LaunchTriggerAlert = ({ flow, f, t, disabled }) => {
                       {t('card.launchTrigger.button.label')}
                     </ActionMenuItem>
                   )}
+                  <ActionMenuItem
+                    left={<Icon icon={GearIcon} />}
+                    onClick={() =>
+                      historyAction(`${konnectorRoot}/config`, 'push')
+                    }
+                  >
+                    {t('card.launchTrigger.configure')}
+                  </ActionMenuItem>
                 </ActionMenu>
               )}
             </>
@@ -116,4 +145,17 @@ export const LaunchTriggerAlert = ({ flow, f, t, disabled }) => {
   )
 }
 
-export default LaunchTriggerAlert
+LaunchTriggerAlert.defaultProps = {
+  konnectorRoot: ''
+}
+
+LaunchTriggerAlert.propTypes = {
+  flow: PropTypes.object,
+  f: PropTypes.function,
+  t: PropTypes.function,
+  disabled: PropTypes.bool,
+  konnectorRoot: PropTypes.string,
+  historyAction: PropTypes.function
+}
+
+export default withAdaptiveRouter(LaunchTriggerAlert)

package/src/components/hoc/withRouter.jsx

@@ -16,8 +16,9 @@ export const historyAction = (props, historyOrNavigate) => (route, method) => {
     return historyOrNavigate(path, { replace: method === 'replace' })
   }
 
+  const splitBaseRoute = baseRoute?.split('/') || []
   const segments = '/'.concat(
-    baseRoute.split('/').concat(route.split('/')).filter(Boolean).join('/')
+    splitBaseRoute.concat(route.split('/')).filter(Boolean).join('/')
   )
 
   return historyOrNavigate[method](segments)

package/src/components/hoc/withRouter.spec.jsx

@@ -48,4 +48,10 @@ describe('historyAction', () => {
     expect(historyMock.replace).toHaveBeenCalledWith('/base/route/one/two')
     historyMock.replace.mockReset()
   })
+
+  it('should handle even if no base route', () => {
+    setup({ baseRoute: undefined, route: '/one' })
+    expect(historyMock.replace).toHaveBeenCalledWith('/one')
+    historyMock.replace.mockReset()
+  })
 })

package/src/locales/en.json

@@ -77,6 +77,7 @@
       "button": {
         "label": "Run again now"
       },
+      "configure": "Configure",
       "success": "Successful synchronization",
       "error": "An error occured.",
       "frequency": {
@@ -92,6 +93,7 @@
         "syncing": "Data recovery…",
         "unknown": "Unknown",
         "afterSomeTimes": "Sync. %{times} ago",
+        "format": "MM/DD/YYYY",
         "justNow": "Sync. just now"
       }
     },

package/src/locales/fr.json

@@ -77,6 +77,7 @@
       "button": {
         "label": "Mettre à jour"
       },
+      "configure": "Configurer",
       "success": "Synchronisation réussie",
       "error": "Une erreur est survenue.",
       "frequency": {
@@ -92,6 +93,7 @@
         "syncing": "Récupération des données…",
         "unknown": "Indéterminée",
         "afterSomeTimes": "Sync. il y a %{times}",
+        "format": "DD/MM/YYYY",
         "justNow": "Sync. à l'instant"
       }
     },