feat(harvest): Use new LaunchTriggerAlert (behind flag)

flag is `harvest.inappconnectors.enabled` not very explicit but temporary, the time to dev the all feature
cozy · Dec 15, 2022 · 48c869a · 48c869a
1 parent 72b7635
commit 48c869a
Show file tree

Hide file tree

Showing 2 changed files with 28 additions and 3 deletions.
diff --git a/packages/cozy-harvest-lib/src/components/KonnectorConfiguration/DataTab/index.jsx b/packages/cozy-harvest-lib/src/components/KonnectorConfiguration/DataTab/index.jsx
@@ -1,8 +1,11 @@
 import React from 'react'
 import PropTypes from 'prop-types'
+
+import flag from 'cozy-flags'
 import { withClient } from 'cozy-client'
 import Stack from 'cozy-ui/transpiled/react/Stack'
 import useBreakpoints from 'cozy-ui/transpiled/react/hooks/useBreakpoints'
+import Divider from 'cozy-ui/transpiled/react/MuiCozyTheme/Divider'
 
 import * as konnectorsModel from '../../../helpers/konnectors'
 import KonnectorUpdateInfos from '../../../components/infos/KonnectorUpdateInfos'
@@ -16,6 +19,13 @@ import appLinksProps from '../../../components/KonnectorConfiguration/DataTab/ap
 import { useTrackPage } from '../../../components/hoc/tracking'
 import Datacards from '../../Datacards'
 
+const styles = {
+  divider: {
+    height: '12px',
+    backgroundColor: 'var(--defaultBackgroundColor)'
+  }
+}
+
 export const DataTab = ({ konnector, trigger, client, flow, account }) => {
   const { isMobile } = useBreakpoints()
   const flowState = flow.getState()
@@ -39,6 +49,12 @@ export const DataTab = ({ konnector, trigger, client, flow, account }) => {
 
   return (
     <div>
+      {flag('harvest.inappconnectors.enabled') && (
+        <>
+          <LaunchTriggerCard flow={flow} disabled={isInMaintenance} />
+          {isMobile && <Divider style={styles.divider} />}
+        </>
+      )}
       <div className={isMobile ? 'u-p-1' : 'u-pt-1 u-pb-1-half'}>
         <Stack>
           {isInMaintenance && (
@@ -52,7 +68,9 @@ export const DataTab = ({ konnector, trigger, client, flow, account }) => {
               isBlocking={hasTermsVersionMismatchError}
             />
           )}
-          <LaunchTriggerCard flow={flow} disabled={isInMaintenance} />
+          {!flag('harvest.inappconnectors.enabled') && (
+            <LaunchTriggerCard flow={flow} disabled={isInMaintenance} />
+          )}
           {appLinks.map(({ slug, ...otherProps }) => (
             <AppLinkCard key={slug} slug={slug} {...otherProps} />
           ))}

diff --git a/packages/cozy-harvest-lib/src/components/cards/LaunchTriggerCard.jsx b/packages/cozy-harvest-lib/src/components/cards/LaunchTriggerCard.jsx
@@ -1,6 +1,7 @@
 import React from 'react'
 import PropTypes from 'prop-types'
 
+import flag from 'cozy-flags'
 import Button from 'cozy-ui/transpiled/react/Button'
 import { Media, Img, Bd } from 'cozy-ui/transpiled/react/Media'
 import Card from 'cozy-ui/transpiled/react/Card'
@@ -10,6 +11,7 @@ import Info from 'cozy-ui/transpiled/react/Icons/Info'
 import Typography from 'cozy-ui/transpiled/react/Typography'
 import SyncIcon from 'cozy-ui/transpiled/react/Icons/Sync'
 
+import LaunchTriggerAlert from './LaunchTriggerAlert'
 import * as triggers from '../../helpers/triggers'
 import { isRunnable } from '../../helpers/konnectors'
 import FlowProvider from '../FlowProvider'
@@ -106,6 +108,10 @@ export const DumbLaunchTriggerCard = ({ flow, className, f, t, disabled }) => {
   )
 }
 
+const DumbComponent = flag('harvest.inappconnectors.enabled')
+  ? LaunchTriggerAlert
+  : DumbLaunchTriggerCard
+
 /**
  * Shows the state of the trigger and provides the ability to
  * relaunch a trigger
@@ -114,7 +120,7 @@ export const DumbLaunchTriggerCard = ({ flow, className, f, t, disabled }) => {
  */
 const LaunchTriggerCard = props => {
   if (props.flow) {
-    return <DumbLaunchTriggerCard {...props} />
+    return <DumbComponent {...props} />
   }
 
   const normalizedProps = { ...props }
@@ -125,10 +131,11 @@ const LaunchTriggerCard = props => {
     )
     normalizedProps.flowProps = { initialTrigger: props.initialTrigger }
   }
+
   return (
     <FlowProvider {...normalizedProps.flowProps}>
       {({ flow }) => {
-        return <DumbLaunchTriggerCard {...props} flow={flow} />
+        return <DumbComponent {...props} flow={flow} />
       }}
     </FlowProvider>
   )