From 97d55c57a7582e100bca7eab7cce9d5e5fe9e00e Mon Sep 17 00:00:00 2001 From: Sadaqat Ali Date: Sun, 17 Apr 2022 14:39:34 +0500 Subject: [PATCH] added autovests checkbox --- .../beneficiarySelectionContent.tsx | 289 +++++++++--------- .../beneficiarySelectionContent/styles.ts | 8 +- src/config/locales/en-US.json | 1 + 3 files changed, 161 insertions(+), 137 deletions(-) diff --git a/src/components/beneficiarySelectionContent/beneficiarySelectionContent.tsx b/src/components/beneficiarySelectionContent/beneficiarySelectionContent.tsx index 3cdd6f8a1..64d4ceb88 100644 --- a/src/components/beneficiarySelectionContent/beneficiarySelectionContent.tsx +++ b/src/components/beneficiarySelectionContent/beneficiarySelectionContent.tsx @@ -1,5 +1,5 @@ import React, { useState, useEffect } from 'react'; -import { View, FlatList, Text } from 'react-native'; +import { View, FlatList, Text, TouchableOpacity } from 'react-native'; import { useIntl } from 'react-intl'; import { isArray, debounce } from 'lodash'; @@ -7,30 +7,39 @@ import styles from './styles'; import EStyleSheet from 'react-native-extended-stylesheet'; import { useAppDispatch, useAppSelector } from '../../hooks'; -import { BeneficiaryModal, FormInput, IconButton, TextButton } from '../../components'; +import { BeneficiaryModal, CheckBox, FormInput, IconButton, TextButton } from '../../components'; import { Beneficiary } from '../../redux/reducers/editorReducer'; import { lookupAccounts } from '../../providers/hive/dhive'; import { TEMP_BENEFICIARIES_ID } from '../../redux/constants/constants'; -import { removeBeneficiaries, setBeneficiaries as setBeneficiariesAction } from '../../redux/actions/editorActions'; +import { + removeBeneficiaries, + setBeneficiaries as setBeneficiariesAction, +} from '../../redux/actions/editorActions'; interface BeneficiarySelectionContentProps { - draftId:string; - setDisableDone:(value:boolean)=>void; + draftId: string; + setDisableDone: (value: boolean) => void; powerDown?: boolean; powerDownBeneficiaries?: Beneficiary[]; - handleSaveBeneficiary?:(beneficiaries: Beneficiary[]) => void; + handleSaveBeneficiary?: (beneficiaries: Beneficiary[]) => void; } -const BeneficiarySelectionContent = ({ draftId, setDisableDone, powerDown, powerDownBeneficiaries, handleSaveBeneficiary }:BeneficiarySelectionContentProps) => { +const BeneficiarySelectionContent = ({ + draftId, + setDisableDone, + powerDown, + powerDownBeneficiaries, + handleSaveBeneficiary, +}: BeneficiarySelectionContentProps) => { const intl = useIntl(); const dispatch = useAppDispatch(); - const beneficiariesMap = useAppSelector(state => state.editor.beneficiariesMap) - const username = useAppSelector(state=>state.account.currentAccount.name) + const beneficiariesMap = useAppSelector((state) => state.editor.beneficiariesMap); + const username = useAppSelector((state) => state.account.currentAccount.name); - const [beneficiaries, setBeneficiaries] = useState( - [{ account: username, weight: 10000, autoPowerUp: false}] - ); + const [beneficiaries, setBeneficiaries] = useState([ + { account: username, weight: 10000, autoPowerUp: false }, + ]); const [newUsername, setNewUsername] = useState(''); const [newWeight, setNewWeight] = useState(0); @@ -40,53 +49,54 @@ const BeneficiarySelectionContent = ({ draftId, setDisableDone, powerDown, power const [newEditable, setNewEditable] = useState(false); useEffect(() => { - if(powerDown){ + if (powerDown) { readPowerDownBeneficiaries(); } -}, [powerDownBeneficiaries]); + }, [powerDownBeneficiaries]); useEffect(() => { - if(draftId){ - readTempBeneficiaries(); - } + if (draftId) { + readTempBeneficiaries(); + } }, [draftId]); useEffect(() => { - setDisableDone(newEditable) - }, [newEditable]) + setDisableDone(newEditable); + }, [newEditable]); console.log('beneficiaries : ', beneficiaries); - - const readPowerDownBeneficiaries = () => { - const tempBeneficiaries = [{ account: username, weight: 10000, autoPowerUp: false}, ...powerDownBeneficiaries] - console.log('tempBeneficiaries in readPowerDownBeneficiaries: ', tempBeneficiaries); - - if (isArray(tempBeneficiaries) && tempBeneficiaries.length > 0) { - //weight correction algorithm. - let othersWeight = 0; - tempBeneficiaries.forEach((item, index) => { - if(index > 0){ - othersWeight += item.weight; - } - }); - tempBeneficiaries[0].weight = 10000 - othersWeight; - setBeneficiaries([...tempBeneficiaries]); - } - + const readPowerDownBeneficiaries = () => { + const tempBeneficiaries = [ + { account: username, weight: 10000, autoPowerUp: false }, + ...powerDownBeneficiaries, + ]; + console.log('tempBeneficiaries in readPowerDownBeneficiaries: ', tempBeneficiaries); + + if (isArray(tempBeneficiaries) && tempBeneficiaries.length > 0) { + //weight correction algorithm. + let othersWeight = 0; + tempBeneficiaries.forEach((item, index) => { + if (index > 0) { + othersWeight += item.weight; + } + }); + tempBeneficiaries[0].weight = 10000 - othersWeight; + + setBeneficiaries([...tempBeneficiaries]); + } }; const readTempBeneficiaries = async () => { - if(beneficiariesMap){ + if (beneficiariesMap) { const tempBeneficiaries = beneficiariesMap[draftId || TEMP_BENEFICIARIES_ID]; - - if (isArray(tempBeneficiaries) && tempBeneficiaries.length > 0) { + if (isArray(tempBeneficiaries) && tempBeneficiaries.length > 0) { //weight correction algorithm. let othersWeight = 0; tempBeneficiaries.forEach((item, index) => { - if(index > 0){ - othersWeight += item.weight + if (index > 0) { + othersWeight += item.weight; } }); tempBeneficiaries[0].weight = 10000 - othersWeight; @@ -96,36 +106,32 @@ const BeneficiarySelectionContent = ({ draftId, setDisableDone, powerDown, power } }; - - const _saveBeneficiaries = (value:Beneficiary[]) => { - if(handleSaveBeneficiary){ - handleSaveBeneficiary(value) - }else{ + const _saveBeneficiaries = (value: Beneficiary[]) => { + if (handleSaveBeneficiary) { + handleSaveBeneficiary(value); + } else { dispatch(setBeneficiariesAction(draftId || TEMP_BENEFICIARIES_ID, value)); } - } - + }; const _onSavePress = () => { - if(newEditable){ + if (newEditable) { beneficiaries.push({ - account:newUsername, - weight:newWeight, - autoPowerUp: newAutoPowerUp - }) + account: newUsername, + weight: newWeight, + autoPowerUp: newAutoPowerUp, + }); } _saveBeneficiaries(beneficiaries); _resetInputs(false); - } - + }; const _addAccount = () => { - - if(isUsernameValid && isWeightValid){ + if (isUsernameValid && isWeightValid) { beneficiaries.push({ - account:newUsername, - weight:newWeight, - }) + account: newUsername, + weight: newWeight, + }); setBeneficiaries([...beneficiaries]); } @@ -136,32 +142,26 @@ const BeneficiarySelectionContent = ({ draftId, setDisableDone, powerDown, power setNewEditable(true); }; - - - const _onWeightInputChange = (value:string) => { + const _onWeightInputChange = (value: string) => { let _value = (parseInt(value, 10) || 0) * 100; const _diff = _value - newWeight; const newAuthorWeight = beneficiaries[0].weight - _diff; - beneficiaries[0].weight = newAuthorWeight - - setNewWeight(_value) + beneficiaries[0].weight = newAuthorWeight; + + setNewWeight(_value); setIsWeightValid(_value >= 0 && newAuthorWeight >= 0); setBeneficiaries([...beneficiaries]); }; - const _lookupAccounts = debounce((username) => { - lookupAccounts(username).then((res) => { - const isValid = res.includes(username) - //check if username duplicates else lookup contacts, done here to avoid debounce and post call mismatch - const notExistAlready = !beneficiaries.find((item)=>item.account === username); - setIsUsernameValid(isValid && notExistAlready) + const isValid = res.includes(username); + //check if username duplicates else lookup contacts, done here to avoid debounce and post call mismatch + const notExistAlready = !beneficiaries.find((item) => item.account === username); + setIsUsernameValid(isValid && notExistAlready); }); - }, 1000) - - + }, 1000); const _onUsernameInputChange = (value) => { setNewUsername(value); @@ -169,9 +169,9 @@ const BeneficiarySelectionContent = ({ draftId, setDisableDone, powerDown, power }; const _resetInputs = (adjustWeight = true) => { - if(newWeight && adjustWeight){ + if (newWeight && adjustWeight) { beneficiaries[0].weight = beneficiaries[0].weight + newWeight; - setBeneficiaries([...beneficiaries]) + setBeneficiaries([...beneficiaries]); } setNewWeight(0); @@ -179,21 +179,26 @@ const BeneficiarySelectionContent = ({ draftId, setDisableDone, powerDown, power setIsWeightValid(false); setIsUsernameValid(false); setNewUsername(''); - - } - - + }; const _renderHeader = () => ( - + {powerDown && ( + + + {intl.formatMessage({ id: 'transfer.vests' })} + + + )} + + {intl.formatMessage({ id: 'beneficiary_modal.percent', })} - + {intl.formatMessage({ id: 'beneficiary_modal.username', @@ -201,14 +206,26 @@ const BeneficiarySelectionContent = ({ draftId, setDisableDone, powerDown, power - ) - + ); + const _handleCheckboxClick = (value, isCheck) => { + setNewAutoPowerUp(isCheck); + }; + const _renderCheckBox = ({ locked, isChecked }: { locked: boolean; isChecked: boolean }) => ( + + + + ); const _renderInput = () => { - return ( + {powerDown && _renderCheckBox({ locked: false, isChecked: false })} @@ -234,54 +251,55 @@ const BeneficiarySelectionContent = ({ draftId, setDisableDone, powerDown, power })} type="username" isFirstImage - returnKeyType='done' + returnKeyType="done" value={newUsername} onSubmitEditing={isWeightValid && isUsernameValid && _onSavePress} inputStyle={styles.usernameInput} wrapperStyle={styles.usernameFormInputWrapper} /> - - {isWeightValid && isUsernameValid ? ( - - ) : } + {isWeightValid && isUsernameValid ? ( + + ) : ( + + )} ); }; - const _renderFooter = () => ( <> - {newEditable && _renderInput()} - - + - - + - - ) - + ); const _renderItem = ({ item, index }) => { const _isCurrentUser = item.account === username; @@ -291,11 +309,11 @@ const BeneficiarySelectionContent = ({ draftId, setDisableDone, powerDown, power beneficiaries.splice(index, 1); setBeneficiaries([...beneficiaries]); _saveBeneficiaries(beneficiaries); - } - + }; return ( + {powerDown && _renderCheckBox({ locked: true, isChecked: item.autoPowerUp })} + /> @@ -318,32 +336,31 @@ const BeneficiarySelectionContent = ({ draftId, setDisableDone, powerDown, power /> {!_isCurrentUser ? ( - - ):( - + ) : ( + )} - ); }; return ( - {intl.formatMessage({id:'editor.beneficiaries'})} - - {_renderFooter()} + {intl.formatMessage({ id: 'editor.beneficiaries' })} + + {_renderFooter()} ); }; diff --git a/src/components/beneficiarySelectionContent/styles.ts b/src/components/beneficiarySelectionContent/styles.ts index 1ca481ad5..5dd948a54 100644 --- a/src/components/beneficiarySelectionContent/styles.ts +++ b/src/components/beneficiarySelectionContent/styles.ts @@ -55,5 +55,11 @@ export default EStyleSheet.create({ thumbSelectContainer:{ marginTop:12, }, - + checkBoxHeader: { + width: 50, + }, + checkBoxContainer: { + width: 50, + marginTop:12, + } }); diff --git a/src/config/locales/en-US.json b/src/config/locales/en-US.json index 1054a0b90..e09edb83d 100644 --- a/src/config/locales/en-US.json +++ b/src/config/locales/en-US.json @@ -614,6 +614,7 @@ "stop_information": "Are you sure want to stop?", "percent": "Percent", "auto_vests": "Auto Vests", + "vests": "Vests", "save": "SAVE", "percent_information": "Percent info", "next": "NEXT",