From bb12830cb61fe9f60bbc23e0cc806dd1f0cac0a9 Mon Sep 17 00:00:00 2001
From: Javier Bueno <javierbueno@emurgo.io>
Date: Wed, 17 Jul 2024 23:25:01 +0200
Subject: [PATCH] merge develop

---
 .../src/components/legacy/Modal/Modal.tsx     |   5 +
 .../src/legacy/Catalyst/DownloadCatalyst.tsx  | 239 ++++++++++++++++++
 .../src/legacy/Catalyst/DownloadCatalyst.json |  58 +++++
 3 files changed, 302 insertions(+)
 create mode 100644 apps/wallet-mobile/src/legacy/Catalyst/DownloadCatalyst.tsx

diff --git a/apps/wallet-mobile/src/components/legacy/Modal/Modal.tsx b/apps/wallet-mobile/src/components/legacy/Modal/Modal.tsx
index 46eb8d69e7..a5a76d0502 100644
--- a/apps/wallet-mobile/src/components/legacy/Modal/Modal.tsx
+++ b/apps/wallet-mobile/src/components/legacy/Modal/Modal.tsx
@@ -101,6 +101,10 @@ const useStyles = () => {
       marginTop: 0,
     },
     container: {
+<<<<<<< Updated upstream
+=======
+      height: 350,
+>>>>>>> Stashed changes
       backgroundColor: color.bg_color_high,
       borderRadius: 4,
       ...atoms.px_xl,
@@ -112,6 +116,7 @@ const useStyles = () => {
       ...atoms.p_lg,
     },
     content: {
+      flex: 1,
       marginTop: 15,
     },
     withTitle: {
diff --git a/apps/wallet-mobile/src/legacy/Catalyst/DownloadCatalyst.tsx b/apps/wallet-mobile/src/legacy/Catalyst/DownloadCatalyst.tsx
new file mode 100644
index 0000000000..8c26522153
--- /dev/null
+++ b/apps/wallet-mobile/src/legacy/Catalyst/DownloadCatalyst.tsx
@@ -0,0 +1,239 @@
+import {useCatalyst} from '@yoroi/staking'
+import {useTheme} from '@yoroi/theme'
+import React from 'react'
+import {defineMessages, useIntl} from 'react-intl'
+import {Image, Linking, ScrollView, StyleSheet, TouchableOpacity, View, ViewProps} from 'react-native'
+import {SafeAreaView} from 'react-native-safe-area-context'
+
+import appstoreBadge from '../../assets/img/app-store-badge.png'
+import playstoreBadge from '../../assets/img/google-play-badge.png'
+import AppDownload from '../../assets/img/pic-catalyst-step1.png'
+import {Button, ProgressStep, Spacer, Text, useModal} from '../../components'
+import {Space} from '../../components/Space/Space'
+import {useSelectedWallet} from '../../features/WalletManager/common/hooks/useSelectedWallet'
+import globalMessages, {confirmationMessages} from '../../kernel/i18n/global-messages'
+import {useStakingInfo} from '../Dashboard/StakePoolInfos'
+import {Actions, Row} from './components'
+import {useCatalystCurrentFund} from './useCatalystCurrentFund'
+
+type Props = {
+  onNext: () => void
+}
+export const DownloadCatalyst = ({onNext}: Props) => {
+  const strings = useStrings()
+  const {wallet} = useSelectedWallet()
+  const {stakingInfo} = useStakingInfo(wallet, {suspense: true})
+  const {openModal} = useModal()
+  const styles = useStyles()
+  const {fund} = useCatalystCurrentFund()
+  const intl = useIntl()
+
+  const formatDate = React.useCallback(
+    (date: Date) =>
+      intl.formatDate(date, {
+        dateStyle: 'short',
+        timeStyle: 'medium',
+        hour12: false,
+      }),
+    [intl],
+  )
+
+  React.useEffect(() => {
+    if (stakingInfo?.status !== 'not-registered') {
+      openModal(strings.attention, <WarningModal />, 270)
+    }
+  }, [openModal, stakingInfo?.status, strings.attention])
+
+  const fundName = fund.info.fundName
+  const registrationStart = `${formatDate(fund.info.snapshotStart)}: ${strings.registrationStart}`
+  const votingStart = `${formatDate(fund.info.votingStart)}: ${strings.votingStart}`
+  const votingEnd = `${formatDate(fund.info.votingEnd)}: ${strings.votingEnd}`
+  const votingResults = `${formatDate(fund.info.tallyingEnd)}: ${strings.votingResults}`
+
+  return (
+    <SafeAreaView edges={['left', 'right', 'bottom']} style={styles.safeAreaView}>
+      <ProgressStep currentStep={1} totalSteps={6} />
+
+      <ScrollView bounces={false} contentContainerStyle={styles.contentContainer}>
+        <Spacer height={48} />
+
+        <Text>{strings.subTitle}</Text>
+
+        <Spacer height={48} />
+
+        <Image source={AppDownload} />
+
+        <Spacer height={48} />
+
+        <Row>
+          <AppStoreButton />
+
+          <Spacer width={16} />
+
+          <PlayStoreButton />
+        </Row>
+
+        <Spacer height={48} />
+
+        <Tip>
+          <Text>{strings.tip}</Text>
+
+          <Space height="lg" />
+
+          <Text style={styles.fundName}>{fundName} </Text>
+
+          <Text>{registrationStart}</Text>
+
+          <Text>{votingStart}</Text>
+
+          <Text>{votingEnd}</Text>
+
+          <Text>{votingResults}</Text>
+        </Tip>
+      </ScrollView>
+
+      <Actions>
+        <Button
+          shelleyTheme
+          onPress={onNext}
+          title={strings.continueButton}
+          //  disabled={fund.status.registration !== 'running'}
+        />
+      </Actions>
+    </SafeAreaView>
+  )
+}
+
+const WarningModal = () => {
+  const strings = useStrings()
+  const styles = useStyles()
+  const {closeModal} = useModal()
+
+  return (
+    <View style={styles.container}>
+      <Text style={styles.text}>{strings.stakingKeyNotRegistered}</Text>
+
+      <Space height="md" />
+
+      <Space fill />
+
+      <Button shelleyTheme title={strings.iUnderstandButton} onPress={closeModal} textStyles={styles.button} />
+    </View>
+  )
+}
+
+const Tip = (props: ViewProps) => {
+  const styles = useStyles()
+  return <View {...props} style={styles.tip} />
+}
+
+const PlayStoreButton = () => {
+  const {config} = useCatalyst()
+  const openPlayStore = async () => {
+    await Linking.openURL(config.apps.android)
+  }
+
+  return (
+    <TouchableOpacity onPress={() => openPlayStore()}>
+      <Image source={playstoreBadge} />
+    </TouchableOpacity>
+  )
+}
+
+const AppStoreButton = () => {
+  const {config} = useCatalyst()
+  const openAppStore = async () => {
+    await Linking.openURL(config.apps.ios)
+  }
+
+  return (
+    <TouchableOpacity onPress={() => openAppStore()}>
+      <Image source={appstoreBadge} />
+    </TouchableOpacity>
+  )
+}
+
+const messages = defineMessages({
+  subTitle: {
+    id: 'components.catalyst.step1.subTitle',
+    defaultMessage: '!!!Before you begin, make sure to download the Catalyst Voting App.',
+  },
+  stakingKeyNotRegistered: {
+    id: 'components.catalyst.step1.stakingKeyNotRegistered',
+    defaultMessage:
+      '!!!Catalyst voting rewards are sent to delegation accounts and your ' +
+      'wallet does not seem to have a registered delegation certificate. If ' +
+      'you want to receive voting rewards, you need to delegate your funds first.',
+  },
+  tip: {
+    id: 'components.catalyst.step1.tip',
+    defaultMessage:
+      '!!!Tip: Make sure you know how to take a screenshot with your device, ' +
+      'so that you can backup your catalyst QR code.',
+  },
+  registrationStart: {
+    id: 'catalyst.registration.start',
+    defaultMessage: '!!!Registration start',
+  },
+  votingStart: {
+    id: 'catalyst.voting.start',
+    defaultMessage: '!!!Voting start',
+  },
+  votingEnd: {
+    id: 'catalyst.voting.end',
+    defaultMessage: '!!!Voting end',
+  },
+  votingResults: {
+    id: 'catalyst.voting.results',
+    defaultMessage: '!!!Results',
+  },
+})
+
+const useStrings = () => {
+  const intl = useIntl()
+
+  return {
+    subTitle: intl.formatMessage(messages.subTitle),
+    stakingKeyNotRegistered: intl.formatMessage(messages.stakingKeyNotRegistered),
+    tip: intl.formatMessage(messages.tip),
+    continueButton: intl.formatMessage(confirmationMessages.commonButtons.continueButton),
+    iUnderstandButton: intl.formatMessage(confirmationMessages.commonButtons.iUnderstandButton),
+    attention: intl.formatMessage(globalMessages.attention),
+    registrationStart: intl.formatMessage(messages.registrationStart),
+    votingStart: intl.formatMessage(messages.votingStart),
+    votingEnd: intl.formatMessage(messages.votingEnd),
+    votingResults: intl.formatMessage(messages.votingResults),
+  }
+}
+
+const useStyles = () => {
+  const {color, atoms} = useTheme()
+  const styles = StyleSheet.create({
+    safeAreaView: {
+      flex: 1,
+      backgroundColor: color.gray_cmin,
+    },
+    container: {
+      ...atoms.px_lg,
+      flex: 1,
+    },
+    contentContainer: {
+      ...atoms.px_lg,
+      alignItems: 'center',
+    },
+    tip: {
+      ...atoms.px_xl,
+    },
+    fundName: {
+      ...atoms.body_1_lg_medium,
+    },
+    text: {
+      ...atoms.body_1_lg_regular,
+    },
+    button: {
+      ...atoms.button_1_lg,
+    },
+  })
+
+  return styles
+}
diff --git a/apps/wallet-mobile/translations/messages/src/legacy/Catalyst/DownloadCatalyst.json b/apps/wallet-mobile/translations/messages/src/legacy/Catalyst/DownloadCatalyst.json
index 4a11b7c613..921eab5291 100644
--- a/apps/wallet-mobile/translations/messages/src/legacy/Catalyst/DownloadCatalyst.json
+++ b/apps/wallet-mobile/translations/messages/src/legacy/Catalyst/DownloadCatalyst.json
@@ -4,13 +4,20 @@
     "defaultMessage": "!!!Intro",
     "file": "src/legacy/Catalyst/DownloadCatalyst.tsx",
     "start": {
+<<<<<<< Updated upstream
       "line": 149,
       "column": 9,
       "index": 4380
+=======
+      "line": 157,
+      "column": 12,
+      "index": 4453
+>>>>>>> Stashed changes
     },
     "end": {
       "line": 152,
       "column": 3,
+<<<<<<< Updated upstream
       "index": 4460
     }
   },
@@ -27,6 +34,9 @@
       "line": 156,
       "column": 3,
       "index": 4616
+=======
+      "index": 4595
+>>>>>>> Stashed changes
     }
   },
   {
@@ -36,12 +46,20 @@
     "start": {
       "line": 157,
       "column": 27,
+<<<<<<< Updated upstream
       "index": 4645
+=======
+      "index": 4624
+>>>>>>> Stashed changes
     },
     "end": {
       "line": 163,
       "column": 3,
+<<<<<<< Updated upstream
       "index": 4974
+=======
+      "index": 4953
+>>>>>>> Stashed changes
     }
   },
   {
@@ -51,12 +69,20 @@
     "start": {
       "line": 164,
       "column": 7,
+<<<<<<< Updated upstream
       "index": 4983
+=======
+      "index": 4962
+>>>>>>> Stashed changes
     },
     "end": {
       "line": 169,
       "column": 3,
+<<<<<<< Updated upstream
       "index": 5180
+=======
+      "index": 5164
+>>>>>>> Stashed changes
     }
   },
   {
@@ -66,12 +92,20 @@
     "start": {
       "line": 170,
       "column": 21,
+<<<<<<< Updated upstream
       "index": 5203
+=======
+      "index": 5187
+>>>>>>> Stashed changes
     },
     "end": {
       "line": 173,
       "column": 3,
+<<<<<<< Updated upstream
       "index": 5292
+=======
+      "index": 5276
+>>>>>>> Stashed changes
     }
   },
   {
@@ -81,12 +115,20 @@
     "start": {
       "line": 174,
       "column": 15,
+<<<<<<< Updated upstream
       "index": 5309
+=======
+      "index": 5293
+>>>>>>> Stashed changes
     },
     "end": {
       "line": 177,
       "column": 3,
+<<<<<<< Updated upstream
       "index": 5386
+=======
+      "index": 5370
+>>>>>>> Stashed changes
     }
   },
   {
@@ -96,12 +138,20 @@
     "start": {
       "line": 178,
       "column": 13,
+<<<<<<< Updated upstream
       "index": 5401
+=======
+      "index": 5385
+>>>>>>> Stashed changes
     },
     "end": {
       "line": 181,
       "column": 3,
+<<<<<<< Updated upstream
       "index": 5474
+=======
+      "index": 5458
+>>>>>>> Stashed changes
     }
   },
   {
@@ -111,12 +161,20 @@
     "start": {
       "line": 182,
       "column": 17,
+<<<<<<< Updated upstream
       "index": 5493
+=======
+      "index": 5477
+>>>>>>> Stashed changes
     },
     "end": {
       "line": 185,
       "column": 3,
+<<<<<<< Updated upstream
       "index": 5567
+=======
+      "index": 5551
+>>>>>>> Stashed changes
     }
   }
 ]
\ No newline at end of file