Merge pull request #181 from palladians/feat/unmock-staking-chart

Feat/unmock staking chart
palladians · May 17, 2024 · 77bc611 · 77bc611
2 parents b001747 + 48c31f2
commit 77bc611
Show file tree

Hide file tree

Showing 4 changed files with 28 additions and 15 deletions.
diff --git a/apps/extension/e2e/create-wallet.spec.ts b/apps/extension/e2e/create-wallet.spec.ts
@@ -15,7 +15,6 @@ test("create new wallet", async ({ page, extensionId }) => {
   await onboardingPom.toggleMnemonicWritten()
   await onboardingPom.goNext()
   const confirmationIndex = await onboardingPom.getMnemonicConfirmationIndex()
-  console.log(">>>MW", mnemonicWords, confirmationIndex)
   await onboardingPom.fillMnemonicConfirmation(mnemonicWords[confirmationIndex])
   await onboardingPom.goNext()
   const pageTitle = page.getByText("All done!")

diff --git a/packages/features/src/staking/routes/staking-overview.tsx b/packages/features/src/staking/routes/staking-overview.tsx
@@ -1,16 +1,33 @@
 import { useAccount } from "@/common/hooks/use-account"
 import { useBlockchainSummary } from "@/common/hooks/use-blockchain-summary"
 
+import { useTransactions } from "@/common/hooks/use-transactions"
+import { mean, sum } from "rambda"
 import { StakingOverviewView } from "../views/staking-overview"
 
 export const StakingOverviewRoute = () => {
   const blockchainSummary = useBlockchainSummary()
   const account = useAccount()
+  const { data: transactions } = useTransactions()
+  const rewardsTransactions = transactions?.filter(
+    (tx) =>
+      tx.from === account.accountInfo.MINA.delegate &&
+      tx.to === account.accountInfo.MINA.publicKey,
+  )
+  const rewards = Array(6)
+    .fill({ amount: 0 })
+    .map((_, i) => ({ amount: rewardsTransactions?.[i]?.amount ?? 0 }))
   return (
     <StakingOverviewView
       account={account}
+      rewards={rewards}
       blockchainSummary={blockchainSummary}
       stakeDelegated={account.stakeDelegated}
+      stats={{
+        lastReward: rewardsTransactions[0]?.amount ?? 0,
+        avgReward: mean(rewardsTransactions.map((tx) => tx?.amount)) || 0,
+        totalReward: sum(rewardsTransactions.map((tx) => tx?.amount)),
+      }}
     />
   )
 }
diff --git a/packages/features/src/staking/views/staking-overview.tsx b/packages/features/src/staking/views/staking-overview.tsx
@@ -31,24 +31,19 @@ const EmptyState = ({ heading, button }: EmptyStateProps) => {
   )
 }
 
-const data = [
-  { amount: 80 },
-  { amount: 88 },
-  { amount: 44 },
-  { amount: 55 },
-  { amount: 92 },
-  { amount: 56 },
-]
-
 type StakingOverviewViewProps = {
   stakeDelegated: boolean
   blockchainSummary: ReturnType<typeof useBlockchainSummary>
   account: ReturnType<typeof useAccount>
+  rewards: { amount: number }[]
+  stats: { lastReward: number; avgReward: number; totalReward: number }
 }
 
 export const StakingOverviewView = ({
   stakeDelegated,
   account,
+  rewards,
+  stats,
 }: StakingOverviewViewProps) => (
   <AppLayout>
     <div className="card flex-1 flex-col bg-secondary rounded-t-none pb-6">
@@ -91,20 +86,23 @@ export const StakingOverviewView = ({
       <h2 className="text-2xl">Block rewards</h2>
       <div className="flex justify-between items-center">
         <div className="flex justify-center items-center flex-col">
-          <p className="text-2xl">-</p>
+          <p className="text-2xl">{stats.lastReward}</p>
           <h3 className="text-sm">Last reward</h3>
         </div>
         <div className="flex justify-center items-center flex-col">
-          <p className="text-2xl">-</p>
+          <p className="text-2xl">{stats.avgReward}</p>
           <h3 className="text-sm">Avg. reward</h3>
         </div>
         <div className="flex justify-center items-center flex-col">
-          <p className="text-2xl">-</p>
+          <p className="text-2xl">{stats.totalReward}</p>
           <h3 className="text-sm">Total reward</h3>
         </div>
       </div>
       <ResponsiveContainer width="100%" aspect={2.5}>
-        <BarChart data={data} margin={{ left: 0, top: 0, right: 0, bottom: 0 }}>
+        <BarChart
+          data={rewards}
+          margin={{ left: 0, top: 0, right: 0, bottom: 0 }}
+        >
           <Tooltip
             cursor={false}
             wrapperClassName="card"

diff --git a/packages/features/src/transactions/views/transactions.tsx b/packages/features/src/transactions/views/transactions.tsx
@@ -61,7 +61,6 @@ export const TransactionsView = ({
   const [currentFilter, setCurrentFilter] = useState(Filters.all)
   const showTransactions = transactions.length > 0 && !transactionsError
   const txs = transactions.map((tx) => structurizeTx(tx, fiatPrice))
-  console.log(">>>STRUCT", txs)
   const txsFiltered = txs.filter((tx) => {
     if (currentFilter === Filters.all) return true
     return (