Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

fix: update desmos proposals type display [web-desmos] #1310

Merged
merged 5 commits into from
Nov 1, 2023
Merged

fix: update desmos proposals type display [web-desmos] #1310

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
5 commits
Select commit Hold shift + click to select a range
cb2310a
update: display more than one proposal type
MonikaCat Nov 1, 2023
f49eafb
update proposal overview type handle
MonikaCat Nov 1, 2023
e334bfd
check if content is array
MonikaCat Nov 1, 2023
361ac1e
fix: lint
MonikaCat Nov 1, 2023
4fd05a3
add changeset entry
MonikaCat Nov 1, 2023
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
5 changes: 5 additions & 0 deletions .changeset/cuddly-turtles-search.md
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -0,0 +1,5 @@
---
'web-desmos': major
---

update desmos proposals type display
98 changes: 55 additions & 43 deletions apps/web-desmos/src/screens/proposal_details/components/overview/index.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -26,10 +26,14 @@ const Overview: FC<{ className?: string; overview: OverviewType }> = ({ classNam
const { classes, cx } = useStyles();
const { t } = useAppTranslation('proposals');

const type =
R.pathOr('', [0, '@type'], overview.content) === ''
? getProposalType(R.pathOr('', ['@type'], overview.content))
: getProposalType(R.pathOr('', [0, '@type'], overview.content));
const types: string[] = [];
Copy link
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Because this is used as a dependency of the useCallback hook, I would recommend using useMemo here or the callback will be created every time (not only this line but all the types definition)

if (Array.isArray(overview.content)) {
overview.content.forEach((type: string) => {
types.push(getProposalType(R.pathOr('', ['@type'], type)));
});
} else {
types.push(getProposalType(R.pathOr('', ['@type'], overview.content)));
}

const { address: proposerAddress, name: proposerName } = useProfileRecoil(overview.proposer);
const { name: recipientName } = useProfileRecoil(overview?.content?.recipient);
Expand All @@ -47,45 +51,49 @@ const Overview: FC<{ className?: string; overview: OverviewType }> = ({ classNam

const getExtraDetails = useCallback(() => {
let extraDetails = null;
if (type === 'parameterChangeProposal') {
extraDetails = (
<>
<Typography variant="body1" className="label">
{t('changes')}
</Typography>
<ParamsChange changes={R.pathOr([], ['changes'], overview.content)} />
</>
);
} else if (type === 'softwareUpgradeProposal') {
extraDetails = (
<>
<Typography variant="body1" className="label">
{t('plan')}
</Typography>
<SoftwareUpgrade
height={R.pathOr('0', ['plan', 'height'], overview.content)}
info={R.pathOr('', ['plan', 'info'], overview.content)}
name={R.pathOr('', ['plan', 'name'], overview.content)}
/>
</>
);
} else if (type === 'communityPoolSpendProposal') {
extraDetails = (
<>
<Typography variant="body1" className="label">
{t('content')}
</Typography>
<CommunityPoolSpend
recipient={overview?.content?.recipient}
recipientMoniker={recipientMoniker}
amountRequested={parsedAmountRequested}
/>
</>
);
}
types.forEach((type: string) => {
if (type === 'parameterChangeProposal') {
extraDetails = (
Copy link
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

So this loop will set extraDetails depending of the last value of the types array, not sure of logic but just to confirm that this is expected

<>
<Typography variant="body1" className="label">
{t('changes')}
</Typography>
<ParamsChange changes={R.pathOr([], ['changes'], overview.content)} />
</>
);
}
if (type === 'softwareUpgradeProposal') {
extraDetails = (
<>
<Typography variant="body1" className="label">
{t('plan')}
</Typography>
<SoftwareUpgrade
height={R.pathOr('0', ['plan', 'height'], overview.content)}
info={R.pathOr('', ['plan', 'info'], overview.content)}
name={R.pathOr('', ['plan', 'name'], overview.content)}
/>
</>
);
}
if (type === 'communityPoolSpendProposal') {
extraDetails = (
<>
<Typography variant="body1" className="label">
{t('content')}
</Typography>
<CommunityPoolSpend
recipient={overview?.content?.recipient}
recipientMoniker={recipientMoniker}
amountRequested={parsedAmountRequested}
/>
</>
);
}
});

return extraDetails;
}, [overview.content, parsedAmountRequested, recipientMoniker, t, type]);
}, [overview.content, parsedAmountRequested, recipientMoniker, t, types]);

const extra = getExtraDetails();

Expand All @@ -101,8 +109,12 @@ const Overview: FC<{ className?: string; overview: OverviewType }> = ({ classNam
<Typography variant="body1" className="label">
{t('type')}
</Typography>
<Typography variant="body1" className="value">
{t(type)}
<Typography variant="body1">
Copy link
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Maybe we can remove this parent typography since it is already used inside the loop

{types.map((type) => (
<Typography variant="body1" className="value">
Copy link
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Because inside of a loop, we have to add a key prop here

{t(type)}
</Typography>
))}
</Typography>
<Typography variant="body1" className="label">
{t('proposer')}
Expand Down
Loading