feat(harvest): Add LaunchTriggerAlert

its purpose is to replace old LaunchTriggerCard. For now they have
the same behavior, only the style changes

packages/cozy-harvest-lib/src/components/cards/LaunchTriggerAlert.jsx

@@ -0,0 +1,58 @@
+import React from 'react'
+
+import Alert from 'cozy-ui/transpiled/react/Alert'
+import Button from 'cozy-ui/transpiled/react/Buttons'
+import Typography from 'cozy-ui/transpiled/react/Typography'
+import Spinner from 'cozy-ui/transpiled/react/Spinner'
+
+import KonnectorIcon from '../KonnectorIcon'
+import { getLastSuccessDate, getKonnectorSlug } from '../../helpers/triggers'
+import { isRunnable } from '../../helpers/konnectors'
+import { useFlowState } from '../../models/withConnectionFlow'
+import { makeLabel } from './helpers'
+
+export const LaunchTriggerAlert = ({ flow, f, t, disabled }) => {
+  const { trigger, running, expectingTriggerLaunch } = useFlowState(flow)
+  const { launch, konnector } = flow
+  const lastSuccessDate = getLastSuccessDate(trigger)
+  const isKonnectorRunnable = isRunnable({ win: window, konnector })
+
+  return (
+    <Alert
+      color="var(--paperBackground)"
+      icon={
+        running ? (
+          <Spinner className="u-flex" noMargin />
+        ) : (
+          <KonnectorIcon
+            className="u-w-1 u-h-1"
+            konnectorSlug={getKonnectorSlug(trigger)}
+          />
+        )
+      }
+      action={
+        isKonnectorRunnable && (
+          <Button
+            variant="text"
+            size="small"
+            disabled={running || disabled}
+            label={t('card.launchTrigger.button.label')}
+            onClick={() => launch({ autoSuccessTimer: false })}
+          />
+        )
+      }
+    >
+      <Typography variant="caption">
+        {makeLabel({
+          t,
+          f,
+          running,
+          expectingTriggerLaunch,
+          lastSuccessDate
+        })}
+      </Typography>
+    </Alert>
+  )
+}
+
+export default LaunchTriggerAlert

packages/cozy-harvest-lib/src/components/cards/helpers.js

@@ -0,0 +1,13 @@
+export const makeLabel = ({
+  t,
+  f,
+  running,
+  expectingTriggerLaunch,
+  lastSuccessDate
+}) => {
+  return running || expectingTriggerLaunch
+    ? t('card.launchTrigger.lastSync.syncing')
+    : lastSuccessDate
+    ? f(lastSuccessDate, t('card.launchTrigger.lastSync.format'))
+    : t('card.launchTrigger.lastSync.unknown')
+}

packages/cozy-harvest-lib/src/components/cards/helpers.spec.js

@@ -0,0 +1,85 @@
+import get from 'lodash/get'
+
+import enLocales from '../../locales/en.json'
+import { makeLabel } from './helpers'
+
+const t = x => get(enLocales, x)
+const f = x => x
+
+describe('makeLabel', () => {
+  describe('it should return "Running…"', () => {
+    it('when running is true', () => {
+      const res = makeLabel({
+        t,
+        f,
+        running: true,
+        expectingTriggerLaunch: false,
+        lastSuccessDate: '2021'
+      })
+
+      expect(res).toBe('Running…')
+    })
+
+    it('when runggin and expectingTriggerLaunch are true', () => {
+      const res = makeLabel({
+        t,
+        f,
+        running: true,
+        expectingTriggerLaunch: true,
+        lastSuccessDate: '2021'
+      })
+
+      expect(res).toBe('Running…')
+    })
+
+    it('when expectingTriggerLaunch is true', () => {
+      const res = makeLabel({
+        t,
+        f,
+        running: false,
+        expectingTriggerLaunch: true,
+        lastSuccessDate: '2021'
+      })
+
+      expect(res).toBe('Running…')
+    })
+
+    it('when lastSuccessDate is null', () => {
+      const res = makeLabel({
+        t,
+        f,
+        running: true,
+        expectingTriggerLaunch: true,
+        lastSuccessDate: null
+      })
+
+      expect(res).toBe('Running…')
+    })
+  })
+
+  describe('when running and expectingTriggerLaunch are false', () => {
+    it('should return lastSuccessDate if defined', () => {
+      const res = makeLabel({
+        t,
+        f,
+        running: false,
+        expectingTriggerLaunch: false,
+        lastSuccessDate: '2021'
+      })
+
+      expect(res).toBe('2021')
+    })
+
+    it('should return "Unknown" if lastSuccessDate is null', () => {
+      const res = makeLabel({
+        t,
+        f,
+        running: false,
+        expectingTriggerLaunch: false,
+        lastSuccessDate: null
+      })
+
+      expect(res).toBe('Unknown')
+    })
+  })
+})