feat: Add BI webview reconnection

packages/cozy-harvest-lib/src/components/EditAccountModal.jsx

@@ -95,8 +95,10 @@ const DumbEditAccountModal = withRouter(
               showError={true}
               onVaultDismiss={redirectToAccount}
               fieldOptions={fieldOptions}
+              reconnect={fromReconnect}
             />
           )}
+          <div className="u-mb-2" />
         </DialogContent>
       </Dialog>
     )

packages/cozy-harvest-lib/src/components/OAuthForm.jsx

@@ -72,30 +72,31 @@ export class OAuthForm extends PureComponent {
   }
 
   render() {
-    const { konnector, t, flowState } = this.props
-    const { initialValues, showOAuthWindow, needExtraParams, extraParams } =
-      this.state
+    const { konnector, t, flowState, reconnect, account } = this.props
+    const { showOAuthWindow, needExtraParams, extraParams } = this.state
     const isBusy =
       showOAuthWindow === true ||
       flowState.running ||
       (needExtraParams && !extraParams)
 
-    return initialValues ? null : (
+    return (
       <>
         <Button
           className="u-mt-1"
           busy={isBusy}
           disabled={isBusy}
           extension="full"
-          label={t('oauth.connect.label')}
+          label={t(`oauth.${reconnect ? 'reconnect' : 'connect'}.label`)}
           onClick={this.handleConnect}
         />
         {showOAuthWindow && (
           <OAuthWindow
             extraParams={extraParams}
             konnector={konnector}
+            reconnect={reconnect}
             onSuccess={this.handleAccountId}
             onCancel={this.handleOAuthCancel}
+            account={account}
           />
         )}
       </>

packages/cozy-harvest-lib/src/components/OAuthForm.spec.js

@@ -29,16 +29,17 @@ describe('OAuthForm', () => {
     expect(component).toMatchSnapshot()
   })
 
-  it('should not render button when update', () => {
+  it('should render reconnect button when update', () => {
     const component = shallow(
       <OAuthForm
         flowState={{}}
         account={{ oauth: { access_token: '1234abcd' } }}
         konnector={fixtures.konnector}
+        reconnect={true}
         t={t}
       />
     ).getElement()
-    expect(component).toBeNull()
+    expect(component).toMatchSnapshot()
   })
   it('should call policy fetchExtraOAuthUrlParams with proper params', () => {
     shallow(

packages/cozy-harvest-lib/src/components/OAuthWindow.jsx

@@ -45,7 +45,7 @@ export class OAuthWindow extends PureComponent {
   }
 
   componentDidMount() {
-    const { client, konnector, redirectSlug, extraParams } = this.props
+    const { client, konnector, redirectSlug, extraParams, reconnect, account } = this.props
     this.realtime = new CozyRealtime({ client })
     this.realtime.subscribe(
       'notified',
@@ -57,7 +57,9 @@ export class OAuthWindow extends PureComponent {
       client,
       konnector,
       redirectSlug,
-      extraParams
+      extraParams,
+      reconnect,
+      account
     )
     this.setState({ oAuthStateKey, oAuthUrl, succeed: false })
   }

packages/cozy-harvest-lib/src/components/TriggerManager.jsx

@@ -320,7 +320,8 @@ export class DumbTriggerManager extends Component {
       flow,
       flowState,
       client,
-      OAuthFormWrapperComp
+      OAuthFormWrapperComp,
+      reconnect
     } = this.props
 
     const submitting = flowState.running
@@ -345,6 +346,7 @@ export class DumbTriggerManager extends Component {
             client={client}
             flow={flow}
             account={account}
+            reconnect={reconnect}
             konnector={konnector}
             onSuccess={this.handleOAuthAccountId}
           />

packages/cozy-harvest-lib/src/components/__snapshots__/OAuthForm.spec.js.snap

@@ -12,3 +12,16 @@ exports[`OAuthForm should render 1`] = `
   />
 </React.Fragment>
 `;
+
+exports[`OAuthForm should render reconnect button when update 1`] = `
+<React.Fragment>
+  <DefaultButton
+    busy={true}
+    className="u-mt-1"
+    disabled={true}
+    extension="full"
+    label="oauth.reconnect.label"
+    onClick={[Function]}
+  />
+</React.Fragment>
+`;

packages/cozy-harvest-lib/src/helpers/oauth.js

@@ -108,9 +108,13 @@ export const getOAuthUrl = ({
   oAuthConf = {},
   nonce,
   redirectSlug,
-  extraParams
+  extraParams,
+  reconnect,
+  account
 }) => {
-  let oAuthUrl = `${cozyUrl}/accounts/${accountType}/start?state=${oAuthStateKey}&nonce=${nonce}`
+  const startOrReconnect = reconnect ? 'reconnect' : 'start'
+  const accountIdParam = reconnect ? account._id + '/' : ''
+  let oAuthUrl = `${cozyUrl}/accounts/${accountType}/${accountIdParam}${startOrReconnect}?state=${oAuthStateKey}&nonce=${nonce}`
   if (
     oAuthConf.scope !== undefined &&
     oAuthConf.scope !== null &&
@@ -148,7 +152,14 @@ const getAppSlug = client => {
  * @return {Object}           Object containing: `oAuthUrl` (URL of cozy stack
  * OAuth endpoint) and `oAuthStateKey` (localStorage key)
  */
-export const prepareOAuth = (client, konnector, redirectSlug, extraParams) => {
+export const prepareOAuth = (
+  client,
+  konnector,
+  redirectSlug,
+  extraParams,
+  reconnect = false,
+  account
+) => {
   const { oauth } = konnector
   const accountType = konnectors.getAccountType(konnector)
 
@@ -168,7 +179,9 @@ export const prepareOAuth = (client, konnector, redirectSlug, extraParams) => {
     oAuthConf: oauth,
     nonce: Date.now(),
     redirectSlug: redirectSlug || getAppSlug(client),
-    extraParams
+    extraParams,
+    reconnect,
+    account
   })
 
   return { oAuthStateKey, oAuthUrl }

packages/cozy-harvest-lib/src/helpers/oauth.spec.js

@@ -76,6 +76,21 @@ describe('Oauth helper', () => {
         'https://cozyurl/accounts/testslug/start?state=statekey&nonce=1234&token=thetoken&id_connector=40'
       )
     })
+    it('should return reconnect url with account id if reconnect', () => {
+      const url = getOAuthUrl({
+        ...defaultConf,
+        oAuthConf: {},
+        account: { _id: 'accountid' },
+        reconnect: true,
+        extraParams: {
+          code: 'thecode',
+          connection_id: 12345
+        }
+      })
+      expect(url).toEqual(
+        'https://cozyurl/accounts/testslug/accountid/reconnect?state=statekey&nonce=1234&code=thecode&connection_id=12345'
+      )
+    })
   })
   describe('handleOAuthResponse', () => {
     let originalLocation

packages/cozy-harvest-lib/src/locales/en.json

@@ -386,6 +386,9 @@
     }
   },
   "oauth": {
+    "reconnect": {
+      "label": "Reconnect"
+    },
     "connect": {
       "label": "Connect"
     },

packages/cozy-harvest-lib/src/locales/fr.json

@@ -386,6 +386,9 @@
     }
   },
   "oauth": {
+    "reconnect": {
+      "label": "Se reconnecter"
+    },
     "connect": {
       "label": "Connecter"
     },

packages/cozy-harvest-lib/src/services/biWebView.js

@@ -13,7 +13,8 @@ import {
   saveBIConfig,
   findAccountWithBiConnection,
   convertBIErrortoKonnectorJobError,
-  isBudgetInsightConnector
+  isBudgetInsightConnector,
+  getBIConnectionIdFromAccount
 } from './budget-insight'
 import { KonnectorJobError } from '../helpers/konnectors'
 import { waitForRealtimeEvent } from './jobUtils'
@@ -189,6 +190,19 @@ export const onBIAccountCreation = async ({
   return updatedAccount
 }
 
+const getReconnectExtraOAuthUrlParams = async ({
+  biBankId,
+  biBankIds,
+  token,
+  connId
+}) => {
+  return {
+    id_connector: biBankId || biBankIds,
+    code: token,
+    connection_id: connId
+  }
+}
+
 export const fetchExtraOAuthUrlParams = async ({
   client,
   konnector,
@@ -204,7 +218,23 @@ export const fetchExtraOAuthUrlParams = async ({
     account
   })
 
-  return { id_connector: biBankId || biBankIds, token }
+  const connId = getBIConnectionIdFromAccount(account)
+
+  const isReconnect = Boolean(connId)
+
+  if (isReconnect) {
+    return getReconnectExtraOAuthUrlParams({
+      biBankId,
+      biBankIds,
+      token,
+      connId
+    })
+  } else {
+    return {
+      id_connector: biBankId || biBankIds,
+      token
+    }
+  }
 }
 
 /**