From 245f7111215c37808db5334c3f32b412a3bdfe07 Mon Sep 17 00:00:00 2001 From: eshark9312 Date: Mon, 12 Jun 2023 17:28:45 -0700 Subject: [PATCH] lint:fix --- .../BuyMembershipFormModal.tsx | 201 +++++++++--------- .../BuyMembershipModal/BuyMembershipModal.tsx | 2 +- .../BuyMembershipSignModal.tsx | 4 +- .../UpdateMembershipFormModal.tsx | 200 +++++++++-------- .../modals/UpdateMembershipModal/types.ts | 4 +- 5 files changed, 217 insertions(+), 194 deletions(-) diff --git a/packages/ui/src/memberships/modals/BuyMembershipModal/BuyMembershipFormModal.tsx b/packages/ui/src/memberships/modals/BuyMembershipModal/BuyMembershipFormModal.tsx index 5cfe1eb728..817fef2523 100644 --- a/packages/ui/src/memberships/modals/BuyMembershipModal/BuyMembershipFormModal.tsx +++ b/packages/ui/src/memberships/modals/BuyMembershipModal/BuyMembershipFormModal.tsx @@ -56,7 +56,6 @@ import { } from '../../model/validation' import { Member } from '../../types' - interface BuyMembershipFormModalProps { onClose: () => void onSubmit: (params: MemberFormFields) => void @@ -148,7 +147,14 @@ export const BuyMembershipForm = ({ }, }) - const [handle, isReferred, isValidator, referrer, captchaToken, stashAccountSelect] = form.watch(['handle', 'isReferred', 'isValidator', 'referrer', 'captchaToken', 'stashAccountSelect']) + const [handle, isReferred, isValidator, referrer, captchaToken, stashAccountSelect] = form.watch([ + 'handle', + 'isReferred', + 'isValidator', + 'referrer', + 'captchaToken', + 'stashAccountSelect', + ]) useEffect(() => { if (handle) { @@ -162,28 +168,28 @@ export const BuyMembershipForm = ({ } }, [data?.membershipsConnection.totalCount]) - const isFormValid = !isUploading && form.formState.isValid && ( !isValidator || stashAccounts?.length > 1 ) + const isFormValid = !isUploading && form.formState.isValid && (!isValidator || stashAccounts?.length > 1) const isDisabled = type === 'onBoarding' && process.env.REACT_APP_CAPTCHA_SITE_KEY ? !captchaToken || !isFormValid : !isFormValid const addStashAccount = () => { - const accountSelection = stashAccountSelect as Account; - setStashAccounts((prevStashAccounts)=>[...prevStashAccounts,accountSelection]) + const accountSelection = stashAccountSelect as Account + setStashAccounts((prevStashAccounts) => [...prevStashAccounts, accountSelection]) form?.setValue('stashAccountSelect' as keyof MemberFormFields, undefined) } - const removeStashAccount = (index:number) => { - setStashAccounts((prevAccounts)=>prevAccounts.filter((account,ind)=>ind!==index)) + const removeStashAccount = (index: number) => { + setStashAccounts((prevAccounts) => prevAccounts.filter((account, ind) => ind !== index)) } - useEffect(()=>{ - const accountSelection = stashAccountSelect as Account; - if (stashAccounts.some((account)=>account === accountSelection)) { + useEffect(() => { + const accountSelection = stashAccountSelect as Account + if (stashAccounts.some((account) => account === accountSelection)) { setIsAccountAdded(true) } else { setIsAccountAdded(false) } - },[stashAccountSelect]) + }, [stashAccountSelect]) return ( <> @@ -268,82 +274,88 @@ export const BuyMembershipForm = ({ {type === 'general' && ( <> - - - - - - - {isValidator && ( - <> - - - - - - - - - - - - {isAccountAdded && ( - - - - This stash account is already added to the list. - - - ) - } - {stashAccounts.length < 2 && ( - - - - You should add at least 1 stash account. - - - ) - } - - - {stashAccounts.map((stashAccount, index)=>{ - if(index !== 0){ - return( + + + + + + + {isValidator && ( + <> - - - {removeStashAccount(index)} - }> - - + + + + + + + - ) - } - })} - - - - - - - : {'Unverified'} ! - - - - )} + {isAccountAdded && ( + + + + + + + This stash account is already added to the list. + + )} + {stashAccounts.length < 2 && ( + + + + + + + You should add at least 1 stash account. + + )} + + {stashAccounts.map((stashAccount, index) => { + if (index !== 0) { + return ( + + + + + { + removeStashAccount(index) + }} + > + + + + + + ) + } + })} + + + + + + + : {'Unverified'} ! + + + + )} )} @@ -400,14 +412,13 @@ export const BuyMembershipForm = ({ { - stashAccounts.length > 1 && ( - stashAccounts.map((account, index)=>{ - if(index !== 0){ - form?.register('stashAccounts[' + (index - 1) + ']' as keyof MemberFormFields) - form?.setValue('stashAccounts[' + (index - 1) + ']' as keyof MemberFormFields, account as Account) + stashAccounts.length > 1 && + stashAccounts.map((account, index) => { + if (index !== 0) { + form?.register(('stashAccounts[' + (index - 1) + ']') as keyof MemberFormFields) + form?.setValue(('stashAccounts[' + (index - 1) + ']') as keyof MemberFormFields, account as Account) } }) - ) const values = form.getValues() uploadAvatarAndSubmit({ ...values, externalResources: { ...definedValues(values.externalResources) } }) }} @@ -453,11 +464,11 @@ interface PaddingProps { } const BtnWrapper = styled.div` - padding-right : ${({ pr }) => ( pr ? pr + 'px' : '0px')}; - padding-left : ${({ pl }) => ( pl ? pl + 'px' : '0px')}; - padding-top : ${({ pt }) => ( pt ? pt + 'px' : '0px')}; - padding-bottom: ${({ pb }) => ( pb ? pb + 'px' : '0px')}; - width : ${({ width }) => ( width ? width + 'px' : '0px')}; - display : flex; - justify-content : end; + padding-right: ${({ pr }) => (pr ? pr + 'px' : '0px')}; + padding-left: ${({ pl }) => (pl ? pl + 'px' : '0px')}; + padding-top: ${({ pt }) => (pt ? pt + 'px' : '0px')}; + padding-bottom: ${({ pb }) => (pb ? pb + 'px' : '0px')}; + width: ${({ width }) => (width ? width + 'px' : '0px')}; + display: flex; + justify-content: end; ` diff --git a/packages/ui/src/memberships/modals/BuyMembershipModal/BuyMembershipModal.tsx b/packages/ui/src/memberships/modals/BuyMembershipModal/BuyMembershipModal.tsx index 7361fb341c..e3fc6b1b49 100644 --- a/packages/ui/src/memberships/modals/BuyMembershipModal/BuyMembershipModal.tsx +++ b/packages/ui/src/memberships/modals/BuyMembershipModal/BuyMembershipModal.tsx @@ -34,7 +34,7 @@ export const BuyMembershipModal = () => { const transaction = api.tx.members.buyMembership(toMemberTransactionParams(state.context.form)) const { form } = state.context const service = state.children.transaction - + return ( | undefined initialSigner?: Account service: ActorRef - bondValidatorAcc?: Boolean + bondValidatorAcc?: boolean } export const BuyMembershipSignModal = ({ @@ -130,7 +130,7 @@ export const BuyMembershipSignModal = ({ void onSubmit: (params: WithNullableValues) => void @@ -83,7 +82,7 @@ export const UpdateMembershipFormModal = ({ onClose, onSubmit, member }: Props) // const stashAccounts = member.stashAccounts ?? [] const [stashAccounts, setStashAccounts] = useState([{}]) const [isAccountAdded, setIsAccountAdded] = useState(true) - + const form = useForm({ resolver: useYupValidationResolver(UpdateMemberSchema), defaultValues: { @@ -94,8 +93,14 @@ export const UpdateMembershipFormModal = ({ onClose, onSubmit, member }: Props) context, mode: 'onChange', }) - - const [controllerAccount, rootAccount, handle, stashAccountSelect, isValidator] = form.watch(['controllerAccount', 'rootAccount', 'handle', 'stashAccountSelect', 'isValidator']) + + const [controllerAccount, rootAccount, handle, stashAccountSelect, isValidator] = form.watch([ + 'controllerAccount', + 'rootAccount', + 'handle', + 'stashAccountSelect', + 'isValidator', + ]) useEffect(() => { form.trigger('handle') @@ -108,26 +113,29 @@ export const UpdateMembershipFormModal = ({ onClose, onSubmit, member }: Props) const filterRoot = useCallback(filterAccount(controllerAccount), [controllerAccount]) const filterController = useCallback(filterAccount(rootAccount), [rootAccount]) - const canUpdate = form.formState.isValid && hasAnyEdits(form.getValues(), getUpdateMemberFormInitial(member)) && ( !isValidator || stashAccounts?.length > 1 ) + const canUpdate = + form.formState.isValid && + hasAnyEdits(form.getValues(), getUpdateMemberFormInitial(member)) && + (!isValidator || stashAccounts?.length > 1) const addStashAccount = () => { - const accountSelection = stashAccountSelect as Account; - setStashAccounts((prevStashAccounts)=>[...prevStashAccounts,accountSelection]) + const accountSelection = stashAccountSelect as Account + setStashAccounts((prevStashAccounts) => [...prevStashAccounts, accountSelection]) form?.setValue('stashAccountSelect' as keyof UpdateMemberForm, undefined) } - const removeStashAccount = (index:number) => { - setStashAccounts((prevAccounts)=>prevAccounts.filter((account,ind)=>ind!==index)) + const removeStashAccount = (index: number) => { + setStashAccounts((prevAccounts) => prevAccounts.filter((account, ind) => ind !== index)) } - useEffect(()=>{ - const accountSelection = stashAccountSelect as Account; - if (stashAccounts.some((account)=>account === accountSelection)) { + useEffect(() => { + const accountSelection = stashAccountSelect as Account + if (stashAccounts.some((account) => account === accountSelection)) { setIsAccountAdded(true) } else { setIsAccountAdded(false) } - },[stashAccountSelect]) + }, [stashAccountSelect]) return ( @@ -189,80 +197,85 @@ export const UpdateMembershipFormModal = ({ onClose, onSubmit, member }: Props) - + {isValidator && ( - <> - - - - - - - - - - - - {isAccountAdded && ( - - - - This stash account is already added to the list. - - - ) - } - {stashAccounts.length < 2 && ( - - - - You should add at least 1 stash account. - - - ) - } - - - {stashAccounts.map((stashAccount, index)=>{ - if(index !== 0){ - return( - + <> + + + + + + + + + + + + {isAccountAdded && ( - - - {removeStashAccount(index)} - }> - - - + + + + + + This stash account is already added to the list. - ) - } - })} - - - - - - - : {'Unverified'} ! - - - - )} - + )} + {stashAccounts.length < 2 && ( + + + + + + + You should add at least 1 stash account. + + )} + + {stashAccounts.map((stashAccount, index) => { + if (index !== 0) { + return ( + + + + + { + removeStashAccount(index) + }} + > + + + + + + ) + } + })} + + + + + + + : {'Unverified'} ! + + + + )} @@ -271,14 +284,13 @@ export const UpdateMembershipFormModal = ({ onClose, onSubmit, member }: Props) disabled: !canUpdate || isUploading, label: isUploading ? : 'Save changes', onClick: () => { - stashAccounts.length > 1 && ( - stashAccounts.map((account, index)=>{ - if(index !== 0){ - form?.register('stashAccounts[' + (index - 1) + ']' as keyof UpdateMemberForm) - form?.setValue('stashAccounts[' + (index - 1) + ']' as keyof UpdateMemberForm, account as Account) + stashAccounts.length > 1 && + stashAccounts.map((account, index) => { + if (index !== 0) { + form?.register(('stashAccounts[' + (index - 1) + ']') as keyof UpdateMemberForm) + form?.setValue(('stashAccounts[' + (index - 1) + ']') as keyof UpdateMemberForm, account as Account) } }) - ) uploadAvatarAndSubmit(form.getValues()) }, }} @@ -310,11 +322,11 @@ interface PaddingProps { } const BtnWrapper = styled.div` - padding-right : ${({ pr }) => ( pr ? pr + 'px' : '0px')}; - padding-left : ${({ pl }) => ( pl ? pl + 'px' : '0px')}; - padding-top : ${({ pt }) => ( pt ? pt + 'px' : '0px')}; - padding-bottom: ${({ pb }) => ( pb ? pb + 'px' : '0px')}; - width : ${({ width }) => ( width ? width + 'px' : '0px')}; - display : flex; - justify-content : end; + padding-right: ${({ pr }) => (pr ? pr + 'px' : '0px')}; + padding-left: ${({ pl }) => (pl ? pl + 'px' : '0px')}; + padding-top: ${({ pt }) => (pt ? pt + 'px' : '0px')}; + padding-bottom: ${({ pb }) => (pb ? pb + 'px' : '0px')}; + width: ${({ width }) => (width ? width + 'px' : '0px')}; + display: flex; + justify-content: end; ` diff --git a/packages/ui/src/memberships/modals/UpdateMembershipModal/types.ts b/packages/ui/src/memberships/modals/UpdateMembershipModal/types.ts index c797125ac8..41ad0a88b8 100644 --- a/packages/ui/src/memberships/modals/UpdateMembershipModal/types.ts +++ b/packages/ui/src/memberships/modals/UpdateMembershipModal/types.ts @@ -9,7 +9,7 @@ export interface UpdateMemberForm { rootAccount?: Account controllerAccount?: Account externalResources: Record - isValidator? : boolean - stashAccountSelect? : Account + isValidator?: boolean + stashAccountSelect?: Account stashAccounts: Account[] }