From 70ff90347c00e1ea876f309b234a71f1d6d6f056 Mon Sep 17 00:00:00 2001 From: WaDadidou Date: Fri, 20 Dec 2024 15:56:48 -0500 Subject: [PATCH] feat(rakki): Replace placeholders with contract values --- packages/screens/Rakki/RakkiScreen.tsx | 8 ++-- .../components/BuyTickets/BuyTicketsModal.tsx | 34 +++++++++-------- packages/screens/Rakki/components/GameBox.tsx | 33 ++++++++-------- packages/screens/Rakki/components/Help.tsx | 38 +++++++++++++++---- .../screens/Rakki/components/PrizeInfo.tsx | 20 ++++------ packages/screens/Rakki/utils.ts | 23 +++++++++++ 6 files changed, 101 insertions(+), 55 deletions(-) create mode 100644 packages/screens/Rakki/utils.ts diff --git a/packages/screens/Rakki/RakkiScreen.tsx b/packages/screens/Rakki/RakkiScreen.tsx index 2901aba5d..46324c8db 100644 --- a/packages/screens/Rakki/RakkiScreen.tsx +++ b/packages/screens/Rakki/RakkiScreen.tsx @@ -18,8 +18,6 @@ import { sectionLabelCStyle } from "@/screens/Rakki/styles"; import { ScreenFC } from "@/utils/navigation"; import { layout } from "@/utils/style/layout"; -// TODO: replace all placeholders text with real values - export const RakkiScreen: ScreenFC<"Rakki"> = () => { const networkId = useSelectedNetworkId(); const { height } = useMaxResolution(); @@ -65,7 +63,11 @@ export const RakkiScreen: ScreenFC<"Rakki"> = () => { networkId={networkId} style={{ marginTop: layout.spacing_x4 }} /> - + { if (!selectedWallet?.address) { throw new Error("No wallet with valid address selected"); @@ -166,11 +182,7 @@ export const BuyTicketsModal: FC<{ ]} gradientType="yellow" > - {prettyPrice( - networkId, - info.config.ticket_price.amount, - info.config.ticket_price.denom, - )} + {prettyTicketPrice} @@ -236,11 +248,7 @@ export const BuyTicketsModal: FC<{ Total price - {prettyPrice( - networkId, - totalPrice.toString(), - info.config.ticket_price.denom, - )} + {prettyTotalPrice} @@ -286,11 +294,7 @@ export const BuyTicketsModal: FC<{ }, ]} > - {prettyPrice( - networkId, - ticketDenomBalance, - info.config.ticket_price.denom, - )} + {prettyAvailableBalance} )} diff --git a/packages/screens/Rakki/components/GameBox.tsx b/packages/screens/Rakki/components/GameBox.tsx index cafd4bd61..4f5816567 100644 --- a/packages/screens/Rakki/components/GameBox.tsx +++ b/packages/screens/Rakki/components/GameBox.tsx @@ -2,6 +2,8 @@ import Long from "long"; import { FC } from "react"; import { StyleProp, View } from "react-native"; +import { netCurrentPrizeAmount } from "./../utils"; + import { BrandText } from "@/components/BrandText"; import { Box, BoxStyle } from "@/components/boxes/Box"; import { Info } from "@/contracts-clients/rakki/Rakki.types"; @@ -23,16 +25,21 @@ export const GameBox: FC<{ const { ticketsCount: userTicketsCount } = useRakkiTicketsCountByUser( selectedWallet?.userId, ); - const totalPrizeAmount = Long.fromString(info.config.ticket_price.amount).mul( - info.current_tickets_count, - ); const userAmount = userTicketsCount ? Long.fromString(info.config.ticket_price.amount).mul(userTicketsCount) : 0; - const feePrizeAmount = totalPrizeAmount - .mul(info.config.fee_per10k) - .div(10000); - const winnerPrizeAmount = totalPrizeAmount.sub(feePrizeAmount); + + const prettyCurrentPrizeAmount = prettyPrice( + networkId, + netCurrentPrizeAmount(info), + info.config.ticket_price.denom, + ); + const prettyUserTicketsPriceAmount = prettyPrice( + networkId, + userAmount.toString(), + info.config.ticket_price.denom, + ); + return ( Prize Pot @@ -90,11 +93,7 @@ export const GameBox: FC<{ Your tickets {userTicketsCount !== null ? ( ) : ( diff --git a/packages/screens/Rakki/components/Help.tsx b/packages/screens/Rakki/components/Help.tsx index eff27df9a..27dd1d1eb 100644 --- a/packages/screens/Rakki/components/Help.tsx +++ b/packages/screens/Rakki/components/Help.tsx @@ -1,10 +1,14 @@ import { FC } from "react"; import { StyleProp, View, ViewStyle } from "react-native"; +import { grossMaxPrizeAmount, netMaxPrizeAmount } from "../utils"; + import { BrandText } from "@/components/BrandText"; import { TertiaryBox } from "@/components/boxes/TertiaryBox"; import { GridList } from "@/components/layout/GridList"; +import { Info } from "@/contracts-clients/rakki/Rakki.types"; import { gameBoxLabelCStyle } from "@/screens/Rakki/styles"; +import { prettyPrice } from "@/utils/coins"; import { neutral33, neutral77 } from "@/utils/style/colors"; import { fontMedium10, @@ -18,12 +22,31 @@ interface HelpBoxDefinition { description: string; } -export const Help: FC<{ style?: StyleProp }> = ({ style }) => { +export const Help: FC<{ + info: Info; + networkId: string; + style?: StyleProp; +}> = ({ info, style, networkId }) => { + const prettyTicketPrice = prettyPrice( + networkId, + info.config.ticket_price.amount, + info.config.ticket_price.denom, + ); + const prettyNetMaxPrize = prettyPrice( + networkId, + netMaxPrizeAmount(info), + info.config.ticket_price.denom, + ); + const prettyMaxPrize = prettyPrice( + networkId, + grossMaxPrizeAmount(info), + info.config.ticket_price.denom, + ); + const helpBoxes: HelpBoxDefinition[] = [ { title: "Buy Tickets", - description: - "Prices are $10 USDC per ticket.\nGamblers can buy multiple tickets.", + description: `Prices are ${prettyTicketPrice} per ticket.\nGamblers can buy multiple tickets.`, }, { title: "Wait for the Draw", @@ -32,15 +55,15 @@ export const Help: FC<{ style?: StyleProp }> = ({ style }) => { }, { title: "Check for Prizes", - description: - "Once the cashprize pool is reached, the winner receive the $10,000 transaction directly!", + description: `Once the cashprize pool is reached, the winner receive the ${prettyNetMaxPrize} transaction directly!`, }, ]; + return ( How to Play RAKKi - {`When the community lottery pool reaches the 10k USDC amount, only one will be the winner!\nSimple!`} + {`When the community lottery pool reaches the ${prettyMaxPrize} amount, only one will be the winner!\nSimple!`} @@ -51,7 +74,7 @@ export const Help: FC<{ style?: StyleProp }> = ({ style }) => { data={helpBoxes} renderItem={({ item, index }, width) => { return ( - + }> = ({ style }) => { letterSpacing: -(12 * 0.01), textAlign: "left", padding: layout.spacing_x1_5, - height: 56, }, ]} > diff --git a/packages/screens/Rakki/components/PrizeInfo.tsx b/packages/screens/Rakki/components/PrizeInfo.tsx index 97884b3a7..7704f73c4 100644 --- a/packages/screens/Rakki/components/PrizeInfo.tsx +++ b/packages/screens/Rakki/components/PrizeInfo.tsx @@ -1,7 +1,8 @@ -import Long from "long"; import { FC } from "react"; import { StyleProp, View, ViewStyle } from "react-native"; +import { netMaxPrizeAmount } from "../utils"; + import { BrandText } from "@/components/BrandText"; import { GradientText } from "@/components/gradientText"; import { Info } from "@/contracts-clients/rakki/Rakki.types"; @@ -19,13 +20,12 @@ export const PrizeInfo: FC<{ networkId: string; style?: StyleProp; }> = ({ info, networkId, style }) => { - const totalPrizeAmount = Long.fromString(info.config.ticket_price.amount).mul( - info.config.max_tickets, + const prettyMaxPrizeAmount = prettyPrice( + networkId, + netMaxPrizeAmount(info), + info.config.ticket_price.denom, ); - const feePrizeAmount = totalPrizeAmount - .mul(info.config.fee_per10k) - .div(10000); - const winnerPrizeAmount = totalPrizeAmount.sub(feePrizeAmount); + return ( - {prettyPrice( - networkId, - winnerPrizeAmount.toString(), - info.config.ticket_price.denom, - )} + {prettyMaxPrizeAmount} + Long.fromString(info.config.ticket_price.amount).mul(ticketsCount); + +const netPrizeAmount = (info: Info, ticketsCount: number) => { + const feePrizeAmount = grossTicketsPrizeAmount(info, ticketsCount) + .mul(info.config.fee_per10k) + .div(10000); + // Net prize amount + return grossTicketsPrizeAmount(info, ticketsCount).sub(feePrizeAmount); +}; + +export const netCurrentPrizeAmount = (info: Info) => + netPrizeAmount(info, info.current_tickets_count).toString(); + +export const netMaxPrizeAmount = (info: Info) => + netPrizeAmount(info, info.config.max_tickets).toString(); + +export const grossMaxPrizeAmount = (info: Info) => + grossTicketsPrizeAmount(info, info.config.max_tickets).toString();