From f5ef52c6a98a23656db56483d975d106b6160e57 Mon Sep 17 00:00:00 2001
From: doubleface <christophe@cozycloud.cc>
Date: Tue, 7 Jun 2022 16:42:58 +0200
Subject: [PATCH 1/4] feat: Add BI webview reconnection

A "reconnect" button is now visible when trying to update credentials of
a bi webview connector or any oauth connector.

An addition in io-cozy-account_types secrets is neededed : the
reconnect_endpoint as documented in
https://docs.cozy.io/en/cozy-stack/konnectors-workflow/#reconnect
---
 .../src/components/EditAccountModal.jsx       |   2 +
 .../src/components/OAuthForm.jsx              |  11 +-
 .../src/components/OAuthForm.spec.js          |   5 +-
 .../src/components/OAuthWindow.jsx            |   6 +-
 .../src/components/TriggerManager.jsx         |   4 +-
 .../__snapshots__/OAuthForm.spec.js.snap      |  13 ++
 .../cozy-harvest-lib/src/helpers/oauth.js     |  21 ++-
 .../src/helpers/oauth.spec.js                 |  15 ++
 packages/cozy-harvest-lib/src/locales/en.json |   3 +
 packages/cozy-harvest-lib/src/locales/fr.json |   3 +
 .../src/services/biWebView.js                 |  34 +++-
 .../src/services/biWebView.spec.js            | 151 +++++++++++++++++-
 .../src/services/budget-insight.js            |   4 +-
 13 files changed, 253 insertions(+), 19 deletions(-)

diff --git a/packages/cozy-harvest-lib/src/components/EditAccountModal.jsx b/packages/cozy-harvest-lib/src/components/EditAccountModal.jsx
index 3c9dde842b..c0e40c4101 100644
--- a/packages/cozy-harvest-lib/src/components/EditAccountModal.jsx
+++ b/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>
     )
diff --git a/packages/cozy-harvest-lib/src/components/OAuthForm.jsx b/packages/cozy-harvest-lib/src/components/OAuthForm.jsx
index db1f36f661..b1dbddcaa9 100644
--- a/packages/cozy-harvest-lib/src/components/OAuthForm.jsx
+++ b/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}
           />
         )}
       </>
diff --git a/packages/cozy-harvest-lib/src/components/OAuthForm.spec.js b/packages/cozy-harvest-lib/src/components/OAuthForm.spec.js
index c3bf0b4076..11c43cc782 100644
--- a/packages/cozy-harvest-lib/src/components/OAuthForm.spec.js
+++ b/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(
diff --git a/packages/cozy-harvest-lib/src/components/OAuthWindow.jsx b/packages/cozy-harvest-lib/src/components/OAuthWindow.jsx
index 946213cef4..2c1756b8f3 100644
--- a/packages/cozy-harvest-lib/src/components/OAuthWindow.jsx
+++ b/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 })
   }
diff --git a/packages/cozy-harvest-lib/src/components/TriggerManager.jsx b/packages/cozy-harvest-lib/src/components/TriggerManager.jsx
index 5f57b6cd77..18e615529a 100644
--- a/packages/cozy-harvest-lib/src/components/TriggerManager.jsx
+++ b/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}
           />
diff --git a/packages/cozy-harvest-lib/src/components/__snapshots__/OAuthForm.spec.js.snap b/packages/cozy-harvest-lib/src/components/__snapshots__/OAuthForm.spec.js.snap
index 89d19a0799..d4092bf1d5 100644
--- a/packages/cozy-harvest-lib/src/components/__snapshots__/OAuthForm.spec.js.snap
+++ b/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>
+`;
diff --git a/packages/cozy-harvest-lib/src/helpers/oauth.js b/packages/cozy-harvest-lib/src/helpers/oauth.js
index 0b9ffeb13f..c6a6394377 100644
--- a/packages/cozy-harvest-lib/src/helpers/oauth.js
+++ b/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 }
diff --git a/packages/cozy-harvest-lib/src/helpers/oauth.spec.js b/packages/cozy-harvest-lib/src/helpers/oauth.spec.js
index 1a51800994..a9c9f81a26 100644
--- a/packages/cozy-harvest-lib/src/helpers/oauth.spec.js
+++ b/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
diff --git a/packages/cozy-harvest-lib/src/locales/en.json b/packages/cozy-harvest-lib/src/locales/en.json
index 54da77e2c4..818fcf7aec 100644
--- a/packages/cozy-harvest-lib/src/locales/en.json
+++ b/packages/cozy-harvest-lib/src/locales/en.json
@@ -386,6 +386,9 @@
     }
   },
   "oauth": {
+    "reconnect": {
+      "label": "Reconnect"
+    },
     "connect": {
       "label": "Connect"
     },
diff --git a/packages/cozy-harvest-lib/src/locales/fr.json b/packages/cozy-harvest-lib/src/locales/fr.json
index 14c815dcce..6cfcafe719 100644
--- a/packages/cozy-harvest-lib/src/locales/fr.json
+++ b/packages/cozy-harvest-lib/src/locales/fr.json
@@ -386,6 +386,9 @@
     }
   },
   "oauth": {
+    "reconnect": {
+      "label": "Se reconnecter"
+    },
     "connect": {
       "label": "Connecter"
     },
diff --git a/packages/cozy-harvest-lib/src/services/biWebView.js b/packages/cozy-harvest-lib/src/services/biWebView.js
index cc46681be8..d6dc11a2e8 100644
--- a/packages/cozy-harvest-lib/src/services/biWebView.js
+++ b/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
+    }
+  }
 }
 
 /**
diff --git a/packages/cozy-harvest-lib/src/services/biWebView.spec.js b/packages/cozy-harvest-lib/src/services/biWebView.spec.js
index e6fd526be0..186d18e3bb 100644
--- a/packages/cozy-harvest-lib/src/services/biWebView.spec.js
+++ b/packages/cozy-harvest-lib/src/services/biWebView.spec.js
@@ -4,7 +4,8 @@ import {
   checkBIConnection,
   isBiWebViewConnector,
   fetchContractSynchronizationUrl,
-  refreshContracts
+  refreshContracts,
+  fetchExtraOAuthUrlParams
 } from './biWebView'
 import ConnectionFlow from '../models/ConnectionFlow'
 import { waitForRealtimeEvent } from './jobUtils'
@@ -314,3 +315,151 @@ describe('refreshContracts', () => {
     })
   })
 })
+
+describe('fetchExtraOAuthUrlParams', () => {
+  it('should asynchroneously fetch BI token', async () => {
+    const client = new CozyClient({
+      uri: 'http://testcozy.mycozy.cloud'
+    })
+    client.stackClient.jobs.create = jest.fn().mockReturnValue({
+      data: {
+        attributes: {
+          _id: 'job-id-1337'
+        }
+      }
+    })
+    waitForRealtimeEvent.mockImplementation(async () => {
+      sleep(2)
+      return {
+        data: {
+          result: {
+            code: 'bi-temporary-access-token-123'
+          }
+        }
+      }
+    })
+    const result = await fetchExtraOAuthUrlParams({
+      client,
+      konnector,
+      account
+    })
+    expect(result).toMatchObject({ token: 'bi-temporary-access-token-123' })
+  })
+
+  it('should add id_connector param for mono bankId', async () => {
+    const client = new CozyClient({
+      uri: 'http://testcozy.mycozy.cloud'
+    })
+    client.stackClient.jobs.create = jest.fn().mockReturnValue({
+      data: {
+        attributes: {
+          _id: 'job-id-1337'
+        }
+      }
+    })
+    waitForRealtimeEvent.mockImplementation(async () => {
+      sleep(2)
+      return {
+        data: {
+          result: {
+            biBankId: 12
+          }
+        }
+      }
+    })
+    const result = await fetchExtraOAuthUrlParams({
+      client,
+      konnector,
+      account
+    })
+    expect(result).toMatchObject({ id_connector: 12 })
+  })
+
+  it('should add id_connector param for multiple bank ids', async () => {
+    const client = new CozyClient({
+      uri: 'http://testcozy.mycozy.cloud'
+    })
+    client.stackClient.jobs.create = jest.fn().mockReturnValue({
+      data: {
+        attributes: {
+          _id: 'job-id-1337'
+        }
+      }
+    })
+    waitForRealtimeEvent.mockImplementation(async () => {
+      sleep(2)
+      return {
+        data: {
+          result: {
+            biBankIds: [1, 2, 3, 4]
+          }
+        }
+      }
+    })
+    const result = await fetchExtraOAuthUrlParams({
+      client,
+      konnector,
+      account
+    })
+    expect(result).toMatchObject({ id_connector: [1, 2, 3, 4] })
+  })
+
+  it('should fetch reconnect params if any connection id in the account', async () => {
+    const client = new CozyClient({
+      uri: 'http://testcozy.mycozy.cloud'
+    })
+    client.stackClient.jobs.create = jest.fn().mockReturnValue({
+      data: {
+        attributes: {
+          _id: 'job-id-1337'
+        }
+      }
+    })
+    waitForRealtimeEvent.mockImplementation(async () => {
+      sleep(2)
+      return {
+        data: {
+          result: {
+            code: 'bi-temporary-access-token-12'
+          }
+        }
+      }
+    })
+    const result = await fetchExtraOAuthUrlParams({
+      client,
+      konnector,
+      account: { ...account, data: { auth: { bi: { connId: 15 } } } }
+    })
+    expect(result).toMatchObject({
+      connection_id: 15,
+      code: 'bi-temporary-access-token-12'
+    })
+  })
+
+  it('should not add connection_id param if not connection_id', async () => {
+    const client = new CozyClient({
+      uri: 'http://testcozy.mycozy.cloud'
+    })
+    client.stackClient.jobs.create = jest.fn().mockReturnValue({
+      data: {
+        attributes: {
+          _id: 'job-id-1337'
+        }
+      }
+    })
+    waitForRealtimeEvent.mockImplementation(async () => {
+      sleep(2)
+      return {
+        data: {
+          result: {}
+        }
+      }
+    })
+    const result = await fetchExtraOAuthUrlParams({
+      client,
+      konnector,
+      account
+    })
+    expect(result).not.toHaveProperty('connection_id')
+  })
+})
diff --git a/packages/cozy-harvest-lib/src/services/budget-insight.js b/packages/cozy-harvest-lib/src/services/budget-insight.js
index 927682c316..69d356371a 100644
--- a/packages/cozy-harvest-lib/src/services/budget-insight.js
+++ b/packages/cozy-harvest-lib/src/services/budget-insight.js
@@ -33,8 +33,8 @@ const DECOUPLED_ERROR = 'decoupled'
 const ADDITIONAL_INFORMATION_NEEDED_ERROR = 'additionalInformationNeeded'
 const TEMP_TOKEN_TIMOUT_S = 60
 
-const getBIConnectionIdFromAccount = account =>
-  get(account, 'data.auth.bi.connId')
+export const getBIConnectionIdFromAccount = account =>
+  account?.data?.auth?.bi?.connId
 
 const getBIIdFromContract = bankAccount => bankAccount.vendorId
 

From 88a220eb177fae997e15411208b5518735075096 Mon Sep 17 00:00:00 2001
From: Thiriot Christophe <doubleface@users.noreply.github.com>
Date: Wed, 8 Jun 2022 16:23:51 +0200
Subject: [PATCH 2/4] Update
 packages/cozy-harvest-lib/src/services/biWebView.spec.js

Co-authored-by: Quentin Valmori <quentin.valmori@gmail.com>
---
 packages/cozy-harvest-lib/src/services/biWebView.spec.js | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/packages/cozy-harvest-lib/src/services/biWebView.spec.js b/packages/cozy-harvest-lib/src/services/biWebView.spec.js
index 186d18e3bb..4bdd590034 100644
--- a/packages/cozy-harvest-lib/src/services/biWebView.spec.js
+++ b/packages/cozy-harvest-lib/src/services/biWebView.spec.js
@@ -317,7 +317,7 @@ describe('refreshContracts', () => {
 })
 
 describe('fetchExtraOAuthUrlParams', () => {
-  it('should asynchroneously fetch BI token', async () => {
+  it('should asynchronously fetch BI token', async () => {
     const client = new CozyClient({
       uri: 'http://testcozy.mycozy.cloud'
     })

From ea18b54fa6c6f98642c4e2e55006a60e41a80d6c Mon Sep 17 00:00:00 2001
From: doubleface <christophe@cozycloud.cc>
Date: Wed, 8 Jun 2022 16:31:47 +0200
Subject: [PATCH 3/4] fix: Small fixes after review

---
 .../src/components/OAuthForm.jsx              | 10 ++++---
 .../src/components/OAuthForm.spec.js          |  2 +-
 .../cozy-harvest-lib/src/helpers/oauth.js     | 28 +++++++++++++------
 .../src/helpers/oauth.spec.js                 |  2 +-
 .../src/services/biWebView.js                 | 17 +++++++++++
 5 files changed, 44 insertions(+), 15 deletions(-)

diff --git a/packages/cozy-harvest-lib/src/components/OAuthForm.jsx b/packages/cozy-harvest-lib/src/components/OAuthForm.jsx
index b1dbddcaa9..6a8a575664 100644
--- a/packages/cozy-harvest-lib/src/components/OAuthForm.jsx
+++ b/packages/cozy-harvest-lib/src/components/OAuthForm.jsx
@@ -20,14 +20,12 @@ export class OAuthForm extends PureComponent {
     this.handleOAuthCancel = this.handleOAuthCancel.bind(this)
     this.handleExtraParams = this.handleExtraParams.bind(this)
     this.state = {
-      initialValues: null,
       showingOAuthModal: false
     }
   }
 
   componentDidMount() {
     const { account, konnector, flow, client } = this.props
-    this.setState({ initialValues: account ? account.oauth : null })
 
     const konnectorPolicy = findKonnectorPolicy(konnector)
 
@@ -79,6 +77,8 @@ export class OAuthForm extends PureComponent {
       flowState.running ||
       (needExtraParams && !extraParams)
 
+    const buttonLabel = reconnect ? 'oauth.reconnect.label' : 'oauth.connect.label'
+
     return (
       <>
         <Button
@@ -86,7 +86,7 @@ export class OAuthForm extends PureComponent {
           busy={isBusy}
           disabled={isBusy}
           extension="full"
-          label={t(`oauth.${reconnect ? 'reconnect' : 'connect'}.label`)}
+          label={t(buttonLabel)}
           onClick={this.handleConnect}
         />
         {showOAuthWindow && (
@@ -112,7 +112,9 @@ OAuthForm.propTypes = {
   /** Success callback, takes account as parameter */
   onSuccess: PropTypes.func,
   /** Translation function */
-  t: PropTypes.func.isRequired
+  t: PropTypes.func.isRequired,
+  /** Is it a reconnection or not */
+  reconnect: PropTypes.bool
 }
 
 export default compose(translate(), withConnectionFlow())(OAuthForm)
diff --git a/packages/cozy-harvest-lib/src/components/OAuthForm.spec.js b/packages/cozy-harvest-lib/src/components/OAuthForm.spec.js
index 11c43cc782..36f78d6c9f 100644
--- a/packages/cozy-harvest-lib/src/components/OAuthForm.spec.js
+++ b/packages/cozy-harvest-lib/src/components/OAuthForm.spec.js
@@ -29,7 +29,7 @@ describe('OAuthForm', () => {
     expect(component).toMatchSnapshot()
   })
 
-  it('should render reconnect button when update', () => {
+  it('should render reconnect button when updating an account', () => {
     const component = shallow(
       <OAuthForm
         flowState={{}}
diff --git a/packages/cozy-harvest-lib/src/helpers/oauth.js b/packages/cozy-harvest-lib/src/helpers/oauth.js
index c6a6394377..f125a413bf 100644
--- a/packages/cozy-harvest-lib/src/helpers/oauth.js
+++ b/packages/cozy-harvest-lib/src/helpers/oauth.js
@@ -100,6 +100,9 @@ export const handleOAuthResponse = (options = {}) => {
  * @param  {string} redirectSlug The app we want to redirect the user on after the end of the flow
  * @param  {string} nonce unique nonce string
  * @param  {Object} extraParams some extra parameters to add to the query string
+ * @param  {Boolean} reconnect Are we trying to reconnect an existing account ?
+ * @param  {io.cozy.accounts} account targeted account if any
+ * @returns {String} final OAuth url string
  */
 export const getOAuthUrl = ({
   cozyUrl,
@@ -114,7 +117,12 @@ export const getOAuthUrl = ({
 }) => {
   const startOrReconnect = reconnect ? 'reconnect' : 'start'
   const accountIdParam = reconnect ? account._id + '/' : ''
-  let oAuthUrl = `${cozyUrl}/accounts/${accountType}/${accountIdParam}${startOrReconnect}?state=${oAuthStateKey}&nonce=${nonce}`
+  const oAuthUrl = new URL(
+    `${cozyUrl}/accounts/${accountType}/${accountIdParam}${startOrReconnect}`
+  )
+  oAuthUrl.searchParams.set('state', oAuthStateKey)
+  oAuthUrl.searchParams.set('nonce', nonce)
+
   if (
     oAuthConf.scope !== undefined &&
     oAuthConf.scope !== null &&
@@ -123,19 +131,19 @@ export const getOAuthUrl = ({
     const urlScope = Array.isArray(oAuthConf.scope)
       ? oAuthConf.scope.join('+')
       : oAuthConf.scope
-    oAuthUrl += `&scope=${urlScope}`
+    oAuthUrl.searchParams.set('scope', urlScope)
   }
   if (redirectSlug) {
-    oAuthUrl += `&slug=${redirectSlug}`
+    oAuthUrl.searchParams.set('slug', redirectSlug)
   }
 
   if (extraParams) {
-    for (const key in extraParams) {
-      oAuthUrl += `&${key}=${extraParams[key]}`
-    }
+    Object.entries(extraParams).forEach(([key, value]) =>
+      oAuthUrl.searchParams.set(key, value)
+    )
   }
 
-  return oAuthUrl
+  return oAuthUrl.toString()
 }
 
 const getAppSlug = client => {
@@ -149,8 +157,10 @@ const getAppSlug = client => {
  * @param  {string} domain    Cozy domain
  * @param  {Object} konnector
  * @param  {string} redirectSlug The app we want to redirect the user on after the end of the flow
- * @return {Object}           Object containing: `oAuthUrl` (URL of cozy stack
- * OAuth endpoint) and `oAuthStateKey` (localStorage key)
+ * @param  {Object} extraParams some extra parameters to add to the query string
+ * @param  {Boolean} reconnect Are we trying to reconnect an existing account ?
+ * @param  {io.cozy.accounts} account targetted account if any
+ * @return {Object}           Object containing: `oAuthUrl` (URL of cozy stack OAuth endpoint) and `oAuthStateKey` (localStorage key)
  */
 export const prepareOAuth = (
   client,
diff --git a/packages/cozy-harvest-lib/src/helpers/oauth.spec.js b/packages/cozy-harvest-lib/src/helpers/oauth.spec.js
index a9c9f81a26..b3370cdb1d 100644
--- a/packages/cozy-harvest-lib/src/helpers/oauth.spec.js
+++ b/packages/cozy-harvest-lib/src/helpers/oauth.spec.js
@@ -50,7 +50,7 @@ describe('Oauth helper', () => {
         oAuthConf: { scope: ['thescope', 'thescope2'] }
       })
       expect(url).toEqual(
-        'https://cozyurl/accounts/testslug/start?state=statekey&nonce=1234&scope=thescope+thescope2'
+        'https://cozyurl/accounts/testslug/start?state=statekey&nonce=1234&scope=thescope%2Bthescope2'
       )
     })
     it('should use redirectSlug if present', () => {
diff --git a/packages/cozy-harvest-lib/src/services/biWebView.js b/packages/cozy-harvest-lib/src/services/biWebView.js
index d6dc11a2e8..fcf324b479 100644
--- a/packages/cozy-harvest-lib/src/services/biWebView.js
+++ b/packages/cozy-harvest-lib/src/services/biWebView.js
@@ -190,6 +190,15 @@ export const onBIAccountCreation = async ({
   return updatedAccount
 }
 
+/**
+ * Create OAuth extra parameters specific to reconnect webview
+ *
+ * @param {Number} options.biBankId - Connector bank id (compatible with non webview bi connectors)
+ * @param {Array<Number>} options.biBankIds - connector bank ids (for webview connectors)
+ * @param {String} options.token - BI temporary token
+ * @param {Number} options.connId - BI bi connection id
+ * @return {Object}
+ */
 const getReconnectExtraOAuthUrlParams = async ({
   biBankId,
   biBankIds,
@@ -203,6 +212,14 @@ const getReconnectExtraOAuthUrlParams = async ({
   }
 }
 
+/**
+ * Create OAuth extra parameters
+ *
+ * @param {CozyClient} options.client - CozyClient instance
+ * @param {io.cozy.konnectors} options.konnector connector manifest content
+ * @param {io.cozy.accounts} options.account The account content
+ * @return {Promise<Object>}
+ */
 export const fetchExtraOAuthUrlParams = async ({
   client,
   konnector,

From 752449d8385d92e06fd1eb2353c66073789d225a Mon Sep 17 00:00:00 2001
From: doubleface <christophe@cozycloud.cc>
Date: Thu, 9 Jun 2022 09:26:10 +0200
Subject: [PATCH 4/4] docs: Add missing proptypes

---
 packages/cozy-harvest-lib/src/components/OAuthWindow.jsx    | 6 +++++-
 packages/cozy-harvest-lib/src/components/TriggerManager.jsx | 4 +++-
 2 files changed, 8 insertions(+), 2 deletions(-)

diff --git a/packages/cozy-harvest-lib/src/components/OAuthWindow.jsx b/packages/cozy-harvest-lib/src/components/OAuthWindow.jsx
index 2c1756b8f3..beb6459296 100644
--- a/packages/cozy-harvest-lib/src/components/OAuthWindow.jsx
+++ b/packages/cozy-harvest-lib/src/components/OAuthWindow.jsx
@@ -173,7 +173,11 @@ OAuthWindow.propTypes = {
   an account id */
   onCancel: PropTypes.func,
   /** The app we want to redirect the user on, after the OAuth flow. It used by the stack */
-  redirectSlug: PropTypes.string
+  redirectSlug: PropTypes.string,
+  /** Is it a reconnection or not */
+  reconnect: PropTypes.bool,
+  /** Existing account */
+  account: PropTypes.object
 }
 
 export default translate()(withClient(OAuthWindow))
diff --git a/packages/cozy-harvest-lib/src/components/TriggerManager.jsx b/packages/cozy-harvest-lib/src/components/TriggerManager.jsx
index 18e615529a..ed3fda0ca3 100644
--- a/packages/cozy-harvest-lib/src/components/TriggerManager.jsx
+++ b/packages/cozy-harvest-lib/src/components/TriggerManager.jsx
@@ -446,7 +446,9 @@ DumbTriggerManager.propTypes = {
   flow: PropTypes.object,
   flowState: PropTypes.object,
   // Used to inject a component around OAuthForm, and so customize the UI from the app
-  OAuthFormWrapperComp: PropTypes.node
+  OAuthFormWrapperComp: PropTypes.node,
+  /** Is it a reconnection or not */
+  reconnect: PropTypes.bool,
 }
 
 const TriggerManager = compose(