feat: 2746 add recurrent transfer feature for hive

ios/Podfile.lock

@@ -20,7 +20,7 @@ PODS:
   - boost (1.76.0)
   - BugsnagReactNative (7.19.0):
     - React-Core
-  - BVLinearGradient (2.6.2):
+  - BVLinearGradient (2.8.3):
     - React-Core
   - CocoaAsyncSocket (7.6.5)
   - DoubleConversion (1.1.6)
@@ -998,7 +998,7 @@ SPEC CHECKSUMS:
   AppCenterReactNativeShared: f395caeabde0dc3a11609dbcb737d0f14cd40e79
   boost: a7c83b31436843459a1961bfd74b96033dc77234
   BugsnagReactNative: fa312f53a83ca21c0afdfeaec98a9c5eeb8fc4ed
-  BVLinearGradient: 34a999fda29036898a09c6a6b728b0b4189e1a44
+  BVLinearGradient: 880f91a7854faff2df62518f0281afb1c60d49a3
   CocoaAsyncSocket: 065fd1e645c7abab64f7a6a2007a48038fdc6a99
   DoubleConversion: 5189b271737e1565bdce30deb4a08d647e3f5f54
   FBLazyVector: a6454570f573a0f6f1d397e5a95c13e8e45d1700
@@ -1112,4 +1112,4 @@ SPEC CHECKSUMS:
 
 PODFILE CHECKSUM: 6b212d63236c21489948e9b73b59fcff2feeeb08
 
-COCOAPODS: 1.11.3
+COCOAPODS: 1.13.0

package.json

@@ -126,7 +126,7 @@
     "react-native-iphone-x-helper": "Norcy/react-native-iphone-x-helper",
     "react-native-keyboard-aware-scroll-view": "^0.9.1",
     "react-native-level-fs": "^3.0.0",
-    "react-native-linear-gradient": "^2.4.2",
+    "react-native-linear-gradient": "^2.8.3",
     "react-native-media-controls": "^2.3.0",
     "react-native-modal": "13.0.1",
     "react-native-modal-dropdown": "^1.0.2",
@@ -220,11 +220,6 @@
       "git add"
     ]
   },
-  "husky": {
-    "hooks": {
-      "pre-commit": "lint-staged"
-    }
-  },
   "jest": {
     "preset": "react-native"
   },

reactotron-config.ts

@@ -15,3 +15,8 @@ const reactotron = Reactotron.setAsyncStorageHandler(AsyncStorage) // AsyncStora
   .connect(); // let's connect!
 
 export default reactotron;
+
+export const log = (...rest) => {
+  Reactotron.log(...rest);
+  console.log(...rest);
+};

src/components/settingsItem/view/settingsItemView.js

@@ -107,7 +107,7 @@ class SettingsItemView extends PureComponent {
 
     return (
       <View style={styles.wrapper}>
-        <Text style={[styles.text, titleStyle]}>{title}</Text>
+        {!!title && <Text style={[styles.text, titleStyle]}>{title}</Text>}
         {this._renderItem()}
       </View>
     );

src/components/tabbedPosts/services/tabbedPostsHelpers.ts

@@ -19,7 +19,7 @@ export const calculateTimeLeftForPostCheck = (firstPost: any) => {
 
 // filter posts that are not present in top 5 posts currently in list.
 export const filterLatestPosts = (fetchedPosts: any[], cachedPosts: any[]) => {
-  console.log('Comparing: ', fetchedPosts, cachedPosts);
+  // console.log('Comparing: ', fetchedPosts, cachedPosts);
 
   const latestPosts = [];
   fetchedPosts.forEach((post) => {

src/components/transferAccountSelector/transferAccountSelector.tsx

@@ -31,6 +31,7 @@ export interface TransferAccountSelectorProps {
   memo: string;
   setMemo: (value: string) => void;
   spkMarkets: Market[];
+  getRecurrentTransferOfUser: (username: string) => string;
 }
 
 const TransferAccountSelector = ({
@@ -50,6 +51,7 @@ const TransferAccountSelector = ({
   memo,
   setMemo,
   spkMarkets,
+  getRecurrentTransferOfUser,
 }: TransferAccountSelectorProps) => {
   const intl = useIntl();
   const destinationRef = useRef('');
@@ -91,10 +93,16 @@ const TransferAccountSelector = ({
           return;
         }
         const isValid = res.includes(username);
+
+
+        if (isValid) {
+          getRecurrentTransferOfUser(username);
+        }
+
         setIsUsernameValid(isValid);
       });
     }, 300),
-    [],
+    [getRecurrentTransferOfUser],
   );
 
   const _handleOnChange = (state: string, val: string) => {

src/components/transferAmountInputSection/transferAmountInputSection.tsx

@@ -1,4 +1,4 @@
-import React from 'react';
+import React, { useCallback, useEffect, useRef, useState } from 'react';
 import { useIntl } from 'react-intl';
 import { Text, TouchableOpacity, View } from 'react-native';
 import TextInput from '../textInput';
@@ -7,6 +7,8 @@ import { TransferFormItem } from '../transferFormItem';
 // Styles
 import styles from './transferAmountInputSectionStyles';
 import TransferTypes from '../../constants/transferTypes';
+import DropdownButton from '../dropdownButton';
+import { dateToFormatted } from '../../utils/time';
 
 export interface TransferAmountInputSectionProps {
   balance: number;
@@ -18,6 +20,10 @@ export interface TransferAmountInputSectionProps {
   setMemo: (value: string) => void;
   amount: string;
   setAmount: (value: string) => void;
+  recurrence: string;
+  setRecurrence: (value: string) => void;
+  executions: string;
+  setExecutions: (value: string) => void;
   hsTransfer: boolean;
   transferType: string;
   selectedAccount: any;
@@ -26,6 +32,24 @@ export interface TransferAmountInputSectionProps {
   disableMinimum?: boolean;
 }
 
+export const RECURRENCE_TYPES = [
+  {
+    key: 'daily',
+    hours: 24,
+    intlId: 'leaderboard.daily',
+  },
+  {
+    key: 'weekly',
+    hours: 168,
+    intlId: 'leaderboard.weekly',
+  },
+  {
+    key: 'monthly',
+    hours: 731,
+    intlId: 'leaderboard.monthly',
+  },
+];
+
 const TransferAmountInputSection = ({
   balance,
   getAccountsWithUsername,
@@ -36,46 +60,59 @@ const TransferAmountInputSection = ({
   setMemo,
   amount,
   setAmount,
-  transferType,
   fundType,
   disableMinimum,
+  transferType,
+  recurrence,
+  setRecurrence,
+  executions,
+  setExecutions,
+  startDate,
+  onNext,
 }) => {
   const intl = useIntl();
 
+  const dpRef = useRef();
+
   const _handleOnChange = (state, val) => {
-    let _amount = val.toString();
-    if (_amount.includes(',')) {
-      _amount = val.replace(',', '.');
+    let newValue = val.toString();
+
+    if (newValue.includes(',')) {
+      newValue = val.replace(',', '.');
     }
     if (state === 'amount') {
-      if (parseFloat(Number(_amount)) <= parseFloat(balance)) {
-        setAmount(_amount);
+      if (parseFloat(Number(newValue)) <= parseFloat(balance)) {
+        setAmount(newValue);
       }
-    }
-    if (state === 'destination') {
+    } else if (state === 'destination') {
       getAccountsWithUsername(val).then((res) => {
+        console.log(res);
+
         const isValid = res.includes(val);
 
         setIsUsernameValid(isValid);
       });
-      setDestination(_amount);
-    }
-    if (state === 'memo') {
-      setMemo(_amount);
+      setDestination(newValue);
+    } else if (state === 'memo') {
+      setMemo(newValue);
+    } else if (state === 'executions') {
+      setExecutions(val);
     }
   };
 
   const _renderInput = (placeholder, state, keyboardType, isTextArea) => (
     <TextInput
       style={[isTextArea ? styles.textarea : styles.input]}
-      onChangeText={(amount) => _handleOnChange(state, amount)}
+      onChangeText={(newVal) => _handleOnChange(state, newVal)}
       value={
         state === 'destination'
           ? destination
           : state === 'amount'
           ? amount
           : state === 'memo'
           ? memo
+          : state === 'executions'
+          ? executions
           : ''
       }
       placeholder={placeholder}
@@ -87,8 +124,38 @@ const TransferAmountInputSection = ({
     />
   );
 
+  const [recurrenceIndex, setRecurrenceIndex] = useState(
+    RECURRENCE_TYPES.findIndex((r) => r.hours === recurrence),
+  );
+
+  useEffect(() => {
+    const newSelectedIndex = RECURRENCE_TYPES.findIndex((r) => r.hours === +recurrence);
+
+    setRecurrenceIndex(newSelectedIndex);
+
+    if (newSelectedIndex > -1) {
+      setRecurrence(RECURRENCE_TYPES[newSelectedIndex].hours);
+    }
+
+    if (dpRef?.current) {
+      dpRef.current.select(newSelectedIndex);
+    }
+  }, [recurrence, dpRef]);
+
+  const _handleRecurrenceChange = useCallback((index: number) => {
+    setRecurrenceIndex(index);
+
+    setRecurrence(RECURRENCE_TYPES[index].hours);
+  }, []);
+
+  const _onDelete = () => {
+    onNext(true);
+  }
+
   const _renderDescription = (text) => <Text style={styles.description}>{text}</Text>;
-  const _renderCenterDescription = (text) => <Text style={styles.centerDescription}>{text}</Text>;
+  const _renderCenterDescription = (text, extraStyles = {}) => (
+    <Text style={[styles.centerDescription, extraStyles]}>{text}</Text>
+  );
 
   const amountLimitText = disableMinimum
     ? ''
@@ -105,6 +172,16 @@ const TransferAmountInputSection = ({
           { suffix: amountLimitText },
         )}
       </Text>
+
+      {startDate && startDate !== '' && (
+        <TouchableOpacity onPress={_onDelete}>
+          <Text style={[styles.sectionSubheading, styles.dangerDescription]}>
+            {intl.formatMessage({ id: 'transfer.delete_recurrent_transfer' }) +
+              dateToFormatted(startDate, 'LL')}
+          </Text>
+        </TouchableOpacity>
+      )}
+
       <TransferFormItem
         label={intl.formatMessage({ id: 'transfer.amount' })}
         rightComponent={() =>
@@ -124,8 +201,41 @@ const TransferAmountInputSection = ({
           </TouchableOpacity>
         )}
       />
+      {transferType === TransferTypes.RECURRENT_TRANSFER && (
+        <>
+          <TransferFormItem
+            label={intl.formatMessage({ id: 'transfer.recurrence' })}
+            rightComponent={() => (
+              <DropdownButton
+                dropdownButtonStyle={styles.dropdownButtonStyle}
+                rowTextStyle={styles.rowTextStyle}
+                style={styles.dropdown}
+                dropdownStyle={styles.dropdownStyle}
+                textStyle={styles.dropdownText}
+                options={RECURRENCE_TYPES.map((k) => intl.formatMessage({ id: k.intlId }))}
+                defaultText={intl.formatMessage({ id: 'transfer.recurrence_placeholder' })}
+                selectedOptionIndex={recurrenceIndex}
+                onSelect={(index) => _handleRecurrenceChange(index)}
+                dropdownRef={dpRef}
+              />
+            )}
+          />
+          <TransferFormItem
+            label={intl.formatMessage({ id: 'transfer.executions' })}
+            rightComponent={() =>
+              _renderInput(
+                intl.formatMessage({ id: 'transfer.executions_placeholder' }),
+                'executions',
+                'numeric',
+                false,
+              )
+            }
+          />
+        </>
+      )}
       {(transferType === TransferTypes.POINTS ||
         transferType === TransferTypes.TRANSFER_TOKEN ||
+        transferType === TransferTypes.RECURRENT_TRANSFER ||
         transferType === TransferTypes.TRANSFER_TO_SAVINGS ||
         transferType === TransferTypes.TRANSFER_ENGINE ||
         transferType === TransferTypes.TRANSFER_SPK ||
@@ -143,6 +253,7 @@ const TransferAmountInputSection = ({
           containerStyle={{ height: 80 }}
         />
       )}
+
       {(transferType === TransferTypes.POINTS || transferType === TransferTypes.TRANSFER_TOKEN) && (
         <TransferFormItem
           rightComponentStyle={styles.transferItemRightStyle}

src/components/transferAmountInputSection/transferAmountInputSectionStyles.ts

@@ -59,6 +59,10 @@ export default EStyleSheet.create({
     color: '$primaryBlack',
     fontWeight: '600',
   },
+  dangerDescription: {
+    color: 'red',
+    fontWeight: '700',
+  },
   transferItemContainer: {
     height: 20,
   },
@@ -82,4 +86,28 @@ export default EStyleSheet.create({
     fontWeight: '600',
     textAlign: 'left',
   },
+  dropdownText: {
+    fontSize: 14,
+    paddingLeft: 12,
+    paddingHorizontal: 14,
+    // color: '$primaryDarkGray',
+    color: '$primaryBlack',
+  },
+  dropdownStyle: {
+    marginTop: 15,
+    minWidth: 192,
+    width: 192,
+    maxHeight: 300,
+  },
+  dropdownButtonStyle: {
+    borderColor: '$borderColor',
+    borderWidth: 1,
+    height: 44,
+    width: '100%',
+    borderRadius: 8,
+  },
+  dropdown: {
+    flexGrow: 1,
+    width: 150,
+  },
 });

src/config/api.js

@@ -11,12 +11,12 @@ const api = axios.create({
 });
 
 api.interceptors.request.use((request) => {
-  console.log('Starting api Request', request);
+  // console.log('Starting api Request', request);
   return request;
 });
 
 api.interceptors.response.use((response) => {
-  console.log('Response:', response);
+  // console.log('Response:', response);
   return response;
 });