From 6dcf15dd93c12c8e8b8247640bd4f3b330cac38f Mon Sep 17 00:00:00 2001 From: "Carina.Akaia.io" Date: Fri, 21 Jun 2024 14:43:47 +0400 Subject: [PATCH] wip --- .../donation/components/DonationBreakdown.tsx | 55 +++++++++---------- .../components/DonationConfirmation.tsx | 2 +- .../donation/components/DonationFlow.tsx | 9 ++- src/modules/donation/hooks/fees.ts | 13 +---- src/modules/donation/hooks/forms.ts | 10 +++- src/modules/donation/index.ts | 1 + src/modules/donation/models.ts | 1 + .../profile/components/ProfileLink.tsx | 37 +++++++++++++ src/modules/profile/index.ts | 1 + 9 files changed, 87 insertions(+), 42 deletions(-) create mode 100644 src/modules/profile/components/ProfileLink.tsx create mode 100644 src/modules/profile/index.ts diff --git a/src/modules/donation/components/DonationBreakdown.tsx b/src/modules/donation/components/DonationBreakdown.tsx index 7c5c5388..dfe118bf 100644 --- a/src/modules/donation/components/DonationBreakdown.tsx +++ b/src/modules/donation/components/DonationBreakdown.tsx @@ -1,6 +1,8 @@ import { UseFormReturn } from "react-hook-form"; +import { potlock } from "@/common/api/potlock"; import { Checkbox } from "@/common/ui/components"; +import { ProfileLink } from "@/modules/profile"; import { useDonationFees } from "../hooks/fees"; import { DonationInputs } from "../models"; @@ -13,8 +15,6 @@ export const DonationBreakdown: React.FC = ({ form, }) => { const values = form.watch(); - // !TODO: determine the source - const referrerId: undefined = undefined; const { projectAllocationAmount, @@ -54,7 +54,7 @@ export const DonationBreakdown: React.FC = ({ label: "Referral fees", amount: referrerFeeAmount, percentage: referrerFeePercent, - show: referrerId && referrerFeeAmount > 0, + show: values.referrerAccountId && referrerFeeAmount > 0, }, ]; @@ -94,36 +94,33 @@ export const DonationBreakdown: React.FC = ({
-
- - - -
+ {protocolFeeRecipientAccountId && ( +
+ + + +
+ )} -
- + {values.allocationStrategy === "pot" && ( +
+ -
+ +
+ )}
); diff --git a/src/modules/donation/components/DonationConfirmation.tsx b/src/modules/donation/components/DonationConfirmation.tsx index 93259194..48cfc019 100644 --- a/src/modules/donation/components/DonationConfirmation.tsx +++ b/src/modules/donation/components/DonationConfirmation.tsx @@ -52,7 +52,7 @@ export const DonationConfirmation: React.FC = ({ const totalAmountUsdDisplayValue = values.token === NEAR_TOKEN_DENOM ? totalNearAmountUsdDisplayValue : null; - console.table(values.token); + console.table(values); return ( <> diff --git a/src/modules/donation/components/DonationFlow.tsx b/src/modules/donation/components/DonationFlow.tsx index fa6e7364..ba65f7bf 100644 --- a/src/modules/donation/components/DonationFlow.tsx +++ b/src/modules/donation/components/DonationFlow.tsx @@ -1,5 +1,7 @@ import { createElement as h, useMemo } from "react"; +import { useSearchParams } from "next/navigation"; + import { dispatch } from "@/app/_store"; import { Button, @@ -27,7 +29,12 @@ export const DonationFlow: React.FC = ({ currentStep, ...props }) => { - const { form, onSubmit } = useDonationForm(props); + const searchParams = useSearchParams(); + + const { form, onSubmit } = useDonationForm({ + ...props, + referrerAccountId: searchParams.get("referrerId") ?? undefined, + }); const content = useMemo(() => { switch (currentStep) { diff --git a/src/modules/donation/hooks/fees.ts b/src/modules/donation/hooks/fees.ts index 9e0c1a42..ad165e27 100644 --- a/src/modules/donation/hooks/fees.ts +++ b/src/modules/donation/hooks/fees.ts @@ -1,6 +1,4 @@ -import { useRouter } from "next/router"; - -import { Pot, potlock } from "@/common/api/potlock"; +import { potlock } from "@/common/api/potlock"; import { TOTAL_FEE_BASIS_POINTS } from "@/modules/core/constants"; import { DonationInputs } from "../models"; @@ -23,18 +21,13 @@ export const basisPointsToPercent = (basisPoints: number) => basisPoints / 100; export const useDonationFees = ({ amount, + referrerAccountId, potAccountId, bypassProtocolFee, bypassChefFee, }: DonationFeeInputs): DonationFees => { const { data: potlockDonationConfig } = potlock.useDonationConfig(); - const { query: routeQuery } = useRouter(); - - const referrerId = Array.isArray(routeQuery.referrerId) - ? routeQuery.referrerId.at(0) - : routeQuery.referrerId; - const protocolFeeBasisPoints = potlockDonationConfig?.protocol_fee_basis_points ?? 0; @@ -53,7 +46,7 @@ export const useDonationFees = ({ TOTAL_FEE_BASIS_POINTS - (bypassProtocolFee ? 0 : protocolFeeBasisPoints) - (bypassChefFee ? 0 : chefFeeBasisPoints) - - (referrerId ? referralFeeBasisPoints : 0); + (referrerAccountId ? referralFeeBasisPoints : 0); return { projectAllocationAmount: diff --git a/src/modules/donation/hooks/forms.ts b/src/modules/donation/hooks/forms.ts index 5da735cc..3a5e4dfa 100644 --- a/src/modules/donation/hooks/forms.ts +++ b/src/modules/donation/hooks/forms.ts @@ -16,7 +16,14 @@ import { donationTokenSchema, } from "../models"; -export const useDonationForm = (params: DonationSubmissionInputs) => { +export type DonationFormParams = DonationSubmissionInputs & { + referrerAccountId?: string; +}; + +export const useDonationForm = ({ + referrerAccountId, + ...params +}: DonationFormParams) => { const form = useForm({ resolver: zodResolver(donationSchema), @@ -29,6 +36,7 @@ export const useDonationForm = (params: DonationSubmissionInputs) => { token: donationTokenSchema.parse(undefined), amount: 0.1, recipientAccountId: "accountId" in params ? params.accountId : undefined, + referrerAccountId, potAccountId: "potId" in params ? params.potId : undefined, potDistributionStrategy: diff --git a/src/modules/donation/index.ts b/src/modules/donation/index.ts index a4bc4500..0b03a1cf 100644 --- a/src/modules/donation/index.ts +++ b/src/modules/donation/index.ts @@ -14,6 +14,7 @@ export const useDonation = (props: DonationParameters) => { openDonationModal: useCallback( (event: React.MouseEvent) => { event.preventDefault(); + event.stopPropagation(); modal.show(props); }, diff --git a/src/modules/donation/models.ts b/src/modules/donation/models.ts index fcd35657..f7ea49de 100644 --- a/src/modules/donation/models.ts +++ b/src/modules/donation/models.ts @@ -87,6 +87,7 @@ export const donationSchema = object({ ), recipientAccountId: string().optional().describe("Recipient account id."), + referrerAccountId: string().optional().describe("Referrer account id."), potAccountId: string().optional().describe("Pot account id."), potDonationDistribution: array( diff --git a/src/modules/profile/components/ProfileLink.tsx b/src/modules/profile/components/ProfileLink.tsx new file mode 100644 index 00000000..ed190bb3 --- /dev/null +++ b/src/modules/profile/components/ProfileLink.tsx @@ -0,0 +1,37 @@ +import Image from "next/image"; +import Link from "next/link"; + +import { ByAccountId, potlock } from "@/common/api/potlock"; +import { cn } from "@/common/ui/utils"; + +export type ProfileLinkProps = ByAccountId & { className?: string }; + +export const ProfileLink: React.FC = ({ + accountId, + className, +}) => { + const { data: accountData } = potlock.useAccount({ accountId }); + + const accountSocialData = accountData?.near_social_profile_data; + + return ( + + {accountSocialData?.image?.url ? ( + {`${accountSocialData.name}'s + ) : ( + 🌐 + )} + + {accountSocialData?.name ?? accountId} + + ); +}; diff --git a/src/modules/profile/index.ts b/src/modules/profile/index.ts new file mode 100644 index 00000000..13b0685f --- /dev/null +++ b/src/modules/profile/index.ts @@ -0,0 +1 @@ +export { ProfileLink } from "./components/ProfileLink";