Skip to content

Commit

Permalink
Create pool bugs and fixes (#2550)
Browse files Browse the repository at this point in the history
* Bug fixes and add proposal link

* Fix ratings creating empty value
  • Loading branch information
kattylucy authored Dec 4, 2024
1 parent d912f29 commit aecd231
Show file tree
Hide file tree
Showing 8 changed files with 68 additions and 896 deletions.
21 changes: 15 additions & 6 deletions centrifuge-app/src/pages/IssuerCreatePool/PoolDetailsSection.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -138,7 +138,7 @@ export const PoolDetailsSection = () => {
<FileUpload
file={field.value}
onFileChange={(file) => form.setFieldValue('issuerLogo', file)}
accept="image/*"
accept="image/png, image/jpeg, image/jpg"
fileTypeText="SVG, PNG, or JPG (max. 1MB; 480x480px)"
label="Issuer logo"
/>
Expand All @@ -164,7 +164,7 @@ export const PoolDetailsSection = () => {
/>
)}
</Field>
<Field name="issuerShortDescription" validate={!isTestEnv && validate.issuerShortDescription}>
<Field name="issuerShortDescription" validate={validate.issuerShortDescription}>
{({ field, meta, form }: FieldProps) => (
<FieldWithErrorMessage
name="issuerShortDescription"
Expand All @@ -181,10 +181,10 @@ export const PoolDetailsSection = () => {
</Field>
</Grid>
<Box gridColumn="span 2">
<Field name="issuerDescription" validate={!isTestEnv && validate.issuerDescription}>
<Field name="issuerDescription" validate={validate.issuerDescription}>
{({ field, meta, form }: FieldProps) => (
<FieldWithErrorMessage
validate={!isTestEnv && validate.issuerDescription}
validate={validate.issuerDescription}
name="issuerDescription"
as={TextAreaInput}
label="Overview page description (max. 3000 characters)*"
Expand All @@ -202,13 +202,15 @@ export const PoolDetailsSection = () => {
label="Website URL"
placeholder="www.example.com"
isUrl
validate={validate.websiteNotRequired()}
/>
<FieldWithErrorMessage
name="forum"
as={TextInput}
label="Governance forum"
placeholder="www.example.com"
isUrl
validate={validate.websiteNotRequired()}
/>
<FieldWithErrorMessage
name="email"
Expand Down Expand Up @@ -275,7 +277,14 @@ export const PoolDetailsSection = () => {
<Box mt={4} mb={3}>
<Text variant="heading2">Service analysis</Text>
<StyledGrid gridTemplateColumns={['1fr', '1fr 1fr']} gap={3} mt={3}>
<FieldWithErrorMessage name="reportUrl" as={TextInput} label="Report URL" placeholder="Type here..." isUrl />
<FieldWithErrorMessage
name="reportUrl"
as={TextInput}
label="Report URL"
placeholder="Type here..."
isUrl
validate={validate.websiteNotRequired()}
/>
<FieldWithErrorMessage
name="reportAuthorName"
as={TextInput}
Expand All @@ -298,7 +307,7 @@ export const PoolDetailsSection = () => {
}}
label="Reviewer avatar"
placeholder="Choose file"
accept="image/*"
accept="image/png, image/jpeg, image/jpg"
small
/>
)}
Expand Down
23 changes: 3 additions & 20 deletions centrifuge-app/src/pages/IssuerCreatePool/PoolSetupSection.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -57,6 +57,8 @@ export const PoolSetupSection = () => {
const form = useFormikContext<PoolMetadataInput>()
const { values } = form

console.log(values)

return (
<Box>
<Text variant="heading2" fontWeight={700}>
Expand Down Expand Up @@ -410,26 +412,7 @@ export const PoolSetupSection = () => {
)}
{values.onboardingExperience === 'external' && (
<Box>
{values.tranches.map((tranche, index) => (
<Field key={index} name={`onboarding.tranches.${tranche.tokenName}`}>
{({ field, meta }: FieldProps) => (
<Box mb={4}>
<FieldWithErrorMessage
{...field}
as={TextInput}
name={`onboarding.tranches.${tranche.tokenName}`}
value={field.value}
label={<Text variant="heading4">Onboarding URL {tranche.tokenName}</Text>}
isUrl
placeholder="www.example.com"
onChange={(e: React.ChangeEvent<HTMLInputElement>) =>
form.setFieldValue(`onboarding.tranches.${tranche.tokenName}`, e.target.value)
}
/>
</Box>
)}
</Field>
))}
<Field as={TextInput} name="onboarding.externalOnboardingUrl" label="External onboarding URL" />
<TaxDocument />
</Box>
)}
Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -297,7 +297,7 @@ export const PoolStructureSection = () => {
placeholder={getTrancheName(index)}
maxLength={30}
name={`tranches.${index}.tokenName`}
disabled={values.tranches.length === 1}
disabled
value={getTrancheName(index)}
onChange={(e: React.ChangeEvent<HTMLInputElement>) => handleTrancheNameChange(e, index, form)}
/>
Expand All @@ -312,7 +312,7 @@ export const PoolStructureSection = () => {
<Tooltips type="minimumInvestment" label={<Text variant="heading4">Min. investment*</Text>} />
}
placeholder="0.00"
currency={values.currency}
currency={values.assetDenomination}
errorMessage={meta.touched ? meta.error : undefined}
onChange={(value) => form.setFieldValue(field.name, value)}
onBlur={() => form.setFieldTouched(field.name, true)}
Expand Down Expand Up @@ -358,8 +358,8 @@ export const PoolStructureSection = () => {
as={NumberInput}
placeholder="0.00"
symbol="%"
name={`tranches.${index}.interestRate`}
validate={validate.interestRate}
name={`tranches.${index}.apyPercentage`}
validate={validate.apyPercentage}
/>
</Box>
</Grid>
Expand Down Expand Up @@ -392,7 +392,7 @@ export const PoolStructureSection = () => {
/>
}
placeholder="0.00"
currency={values.currency}
currency={values.assetDenomination}
errorMessage={meta.touched ? meta.error : undefined}
onChange={(value) => form.setFieldValue(field.name, value)}
onBlur={() => form.setFieldTouched(field.name, true)}
Expand All @@ -402,7 +402,7 @@ export const PoolStructureSection = () => {
</Box>
<Box width="227px">
<Field name={`tranches.${index}.apy`}>
{({ field, form }: FieldProps) => (
{({ field }: FieldProps) => (
<TextInput
{...field}
label={
Expand Down
47 changes: 26 additions & 21 deletions centrifuge-app/src/pages/IssuerCreatePool/index.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -33,7 +33,6 @@ import { Dec } from '../../../src/utils/Decimal'
import { useCreatePoolFee } from '../../../src/utils/useCreatePoolFee'
import { usePoolCurrencies } from '../../../src/utils/useCurrencies'
import { useIsAboveBreakpoint } from '../../../src/utils/useIsAboveBreakpoint'
import { usePools } from '../../../src/utils/usePools'
import { config } from '../../config'
import { PoolDetailsSection } from './PoolDetailsSection'
import { PoolSetupSection } from './PoolSetupSection'
Expand All @@ -42,6 +41,8 @@ import { CreatePoolValues, initialValues, PoolFee } from './types'
import { pinFileIfExists, pinFiles } from './utils'
import { validateValues } from './validate'

const PROPOSAL_URL = 'https://centrifuge.subsquare.io/democracy/referenda'

const StyledBox = styled(Box)`
padding: 48px 80px 0px 80px;
@media (max-width: ${({ theme }) => theme.breakpoints.S}) {
Expand All @@ -61,7 +62,7 @@ const stepFields: { [key: number]: string[] } = {
'issuerShortDescription',
'issuerDescription',
],
3: ['investmentDetails', 'liquidityDetails'],
3: ['assetOriginators', 'adminMultisig'],
}

const txMessage = {
Expand All @@ -79,7 +80,6 @@ const IssuerCreatePoolPage = () => {
const currencies = usePoolCurrencies()
const centrifuge = useCentrifuge()
const api = useCentrifugeApi()
const pools = usePools()
const { poolCreationType } = useDebugFlags()
const consts = useCentrifugeConsts()
const { chainDecimals } = useCentrifugeConsts()
Expand All @@ -95,7 +95,7 @@ const IssuerCreatePoolPage = () => {
const [createdModal, setCreatedModal] = useState(false)
const [preimageHash, setPreimageHash] = useState('')
const [isPreimageDialogOpen, setIsPreimageDialogOpen] = useState(false)
const [createdPoolId, setCreatedPoolId] = useState('')
const [proposalId, setProposalId] = useState(null)

useEffect(() => {
if (createType === 'notePreimage') {
Expand All @@ -106,6 +106,7 @@ const IssuerCreatePoolPage = () => {
const event = events.find(({ event }) => api.events.preimage.Noted.is(event))
const parsedEvent = event?.toJSON() as any
if (!parsedEvent) return false
console.info('Preimage hash: ', parsedEvent.event.data[0])
setPreimageHash(parsedEvent.event.data[0])
setIsPreimageDialogOpen(true)
})
Expand All @@ -115,16 +116,6 @@ const IssuerCreatePoolPage = () => {
}
}, [centrifuge, createType])

useEffect(() => {
if (createdPoolId && pools?.find((p) => p.id === createdPoolId)) {
// Redirecting only when we find the newly created pool in the data from usePools
// Otherwise the Issue Overview page will throw an error when it can't find the pool
// It can take a second for the new data to come in after creating the pool
navigate(`/issuer/${createdPoolId}`)
}
// eslint-disable-next-line react-hooks/exhaustive-deps
}, [pools, createdPoolId])

const { execute: createProxies, isLoading: createProxiesIsPending } = useCentrifugeTransaction(
`${txMessage[createType]} 1/2`,
(cent) => {
Expand Down Expand Up @@ -236,11 +227,16 @@ const IssuerCreatePoolPage = () => {
setIsMultisigDialogOpen(true)
}
const [, , , , poolId] = args
console.log(poolId, result)
if (createType === 'immediate') {
setCreatedPoolId(poolId)
navigate(`/pools/${poolId}`)
} else {
setCreatedModal(true)
const event = result.events.find(({ event }) => api.events.democracy.Proposed.is(event))
if (event) {
const eventData = event.toHuman() as any
const proposalId = eventData.event.data.proposalIndex.replace(/\D/g, '')
setCreatedModal(true)
setProposalId(proposalId)
}
}
},
}
Expand Down Expand Up @@ -286,7 +282,9 @@ const IssuerCreatePoolPage = () => {
}

// Pool ratings
if (values.poolRatings) {
if (values.poolRatings[0].agency === '') {
metadataValues.poolRatings = []
} else {
const newRatingReports = await Promise.all(
values.poolRatings.map((rating) => pinFileIfExists(centrifuge, rating.reportFile ?? null))
)
Expand All @@ -300,8 +298,6 @@ const IssuerCreatePoolPage = () => {
reportFile: pinnedReport ? { uri: pinnedReport.uri, mime: rating.reportFile?.type ?? '' } : null,
}
})

metadataValues.poolRatings = ratings
}

// Tranches
Expand Down Expand Up @@ -433,6 +429,12 @@ const IssuerCreatePoolPage = () => {
}))
}, [values, step])

Check warning on line 430 in centrifuge-app/src/pages/IssuerCreatePool/index.tsx

View workflow job for this annotation

GitHub Actions / build-app

React Hook useEffect has a missing dependency: 'checkStepCompletion'. Either include it or remove the dependency array

Check warning on line 430 in centrifuge-app/src/pages/IssuerCreatePool/index.tsx

View workflow job for this annotation

GitHub Actions / ff-prod / build-app

React Hook useEffect has a missing dependency: 'checkStepCompletion'. Either include it or remove the dependency array

const isCreatePoolEnabled =
values.assetOriginators.length > 0 &&
values.assetOriginators[0] !== '' &&
values.adminMultisig.signers.length > 0 &&
values.adminMultisig.signers[0] !== ''

return (
<>
<PreimageHashDialog
Expand Down Expand Up @@ -495,6 +497,7 @@ const IssuerCreatePoolPage = () => {
small
onClick={handleNextStep}
loading={createProxiesIsPending || transactionIsPending || form.isSubmitting}
disabled={step === 3 && !isCreatePoolEnabled} // Disable the button if on step 3 and conditions aren't met
>
{step === 3 ? 'Create pool' : 'Next'}
</Button>
Expand All @@ -514,7 +517,9 @@ const IssuerCreatePoolPage = () => {
<Button onClick={() => setCreatedModal(false)} variant="inverted" style={{ width: 140, marginRight: 16 }}>
Close
</Button>
<Button style={{ width: 160 }}>See proposal</Button>
<Button style={{ width: 160 }} onClick={() => navigate(`${PROPOSAL_URL}/${proposalId}`)}>
See proposal
</Button>
</Box>
</Box>
</Dialog>
Expand Down
Loading

0 comments on commit aecd231

Please sign in to comment.