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[]
}