Personal stats

.gitignore

@@ -75,6 +75,7 @@ tmp
 
 # environment variable files
 .env
+.env.*
 
 # executables
 *.apk

package.json

@@ -41,15 +41,18 @@
     "@wharfkit/web-renderer": "^1.2.5",
     "autoprefixer": "^10.4.16",
     "chart.js": "^4.4.3",
+    "firebase-admin": "^12.2.0",
     "postcss": "^8.4.33",
     "sass": "^1.77.5",
     "svelte": "^4.2.7",
     "svelte-check": "^3.6.0",
     "svelte-confetti": "^2.0.1",
+    "svelte-range-slider-pips": "^2.3.1",
     "svelte-sonner": "^0.3.24",
     "tailwindcss": "^3.4.1",
     "tslib": "^2.4.1",
     "typescript": "^5.0.0",
+    "uuid": "^10.0.0",
     "vite": "^5.0.3"
   },
   "type": "module"

src/lib/components/ApyChart.svelte

@@ -1,7 +1,7 @@
 <script lang="ts">
     import Chart from 'chart.js/auto';
     import {onMount} from "svelte";
-    import WharfService, {rexpool} from "$lib/wharf";
+    import WharfService, {rexpool} from "$lib/services/wharf";
 
 
     let clazz:string = '';
@@ -102,7 +102,7 @@
 </script>
 
 <section class="{clazz}">
-    <canvas bind:this={canvas} {width} {height}>
+    <canvas bind:this={canvas} {width} {height} />
 
 
 </section>

src/lib/components/ClaimRewards.svelte

@@ -1,5 +1,5 @@
 <script>
-    import WharfService, {eosBalance, rawRexBalance, rexBalance, unstakingBalances} from "$lib/wharf";
+    import WharfService, {eosBalance, rawRexBalance, rexBalance, unstakingBalances} from "$lib/services/wharf";
     import InfoRows from "$lib/components/InfoRows.svelte";
     import GlassBox from "$lib/components/GlassBox.svelte";
     import {commaNumber, readableNumber} from "$lib";

src/lib/components/EarnApyChart.svelte

@@ -1,7 +1,7 @@
 <script lang="ts">
     import Chart from 'chart.js/auto';
     import {onMount} from "svelte";
-    import WharfService, {rexpool, rexretpool} from "$lib/wharf";
+    import WharfService, {rexpool, rexretpool} from "$lib/services/wharf";
     import {commaNumber, readableNumber} from "$lib";
 
     export let amount:number = 100;
@@ -165,7 +165,7 @@
 <section class="{clazz} border border-white border-opacity-45 rounded p-2">
     <figure class="text-xs">Estimated yield over the next <b class="underline">{chartDurationReadable}</b> at this APY</figure>
     <section class="mt-1">
-        <canvas bind:this={canvas} {width} {height}>
+        <canvas bind:this={canvas} {width} {height} />
     </section>
     <input type="range" class="w-full h-0.5 mb-2 bg-white bg-opacity-20 rounded-lg appearance-none cursor-pointer range-sm" bind:value={chartDurationInDays} min="90" max={365*10} step="1"/>
     <section class="flex justify-between text-xs opacity-40">

src/lib/components/Navbar.svelte

@@ -1,7 +1,7 @@
 <script lang="ts">
     import {generateIdenteapot} from "@teapotlabs/identeapots";
     import { slide } from "svelte/transition";
-    import WharfService, {account} from "$lib/wharf";
+    import WharfService, {account} from "$lib/services/wharf";
 
     $: connected = !!$account;
     let identipot: string|undefined;

src/lib/components/Stake.svelte

@@ -1,5 +1,5 @@
 <script>
-    import WharfService, {account, eosBalance, rexpool, rexretpool} from "$lib/wharf";
+    import WharfService, {account, eosBalance, rexpool, rexretpool} from "$lib/services/wharf";
     import TokenInput from "$lib/components/TokenInput.svelte";
     import InfoRows from "$lib/components/InfoRows.svelte";
     import GlassBox from "$lib/components/GlassBox.svelte";
@@ -8,6 +8,7 @@
     import InfoBox from "$lib/components/InfoBox.svelte";
     import ApyChart from "$lib/components/ApyChart.svelte";
     import EarnApyChart from "$lib/components/EarnApyChart.svelte";
+    import UserHistory from "$lib/components/UserHistory.svelte";
 
     let amount = 0;
     $: apy = (() => {
@@ -31,6 +32,7 @@
 </script>
 
 <GlassBox class="mt-2 overflow-hidden">
+
     <figure class="bg-yellow-400 opacity-90 w-[200px] aspect-[4/4] rounded-full blur-[90px] absolute -top-[180px] -right-[100px] z-0"></figure>
     <section class="flex justify-center relative max-lg:flex-col">
 <!--        <section>-->

src/lib/components/Stats.svelte

@@ -1,10 +1,13 @@
 <script>
     import GlassBox from "$lib/components/GlassBox.svelte";
     import ApyChart from "$lib/components/ApyChart.svelte";
-    import WharfService, {eosPrice, rexpool, rexretpool} from "$lib/wharf";
+    import WharfService, {account, eosPrice, rexpool, rexretpool} from "$lib/services/wharf";
     import {readableNumber} from "$lib";
     import EOS from "$lib/svgs/EOS.svelte";
     import InfoBox from "$lib/components/InfoBox.svelte";
+    import {onMount} from "svelte";
+    import {HistoryService} from "$lib/services/history";
+    import UserHistory from "$lib/components/UserHistory.svelte";
 
     $: apy = (() => {
         if(!$rexpool) return 0;
@@ -16,11 +19,17 @@
         if(!$rexpool) return 0;
         return WharfService.getTotalStaked();
     })();
+
+
 </script>
 
 <GlassBox class="mt-2 overflow-hidden">
 
-    <section class="flex justify-between relative max-lg:flex-col">
+    {#if $account}
+        <UserHistory />
+    {/if}
+
+    <section class="flex justify-between relative max-lg:flex-col {$account ? 'mt-10' : ''}">
         <section class="max-lg:mt-4">
             <figure class="text-sm font-black">~Daily Yield</figure>
             <h1 class="text-yellow-300 text-3xl font-black -mt-1 text-shadow">{parseFloat(apy/365).toFixed(3)}%</h1>

src/lib/components/Unstake.svelte

@@ -1,5 +1,5 @@
 <script>
-    import WharfService, {rexBalance} from "$lib/wharf";
+    import WharfService, {rexBalance} from "$lib/services/wharf";
     import TokenInput from "$lib/components/TokenInput.svelte";
     import InfoRows from "$lib/components/InfoRows.svelte";
     import GlassBox from "$lib/components/GlassBox.svelte";
@@ -8,7 +8,12 @@
     import InfoBox from "$lib/components/InfoBox.svelte";
 
     let amount = 0;
-    $: rexBalanceAsEos = WharfService.convertRexToEos($rexBalance);
+    const smallestRex = WharfService.convertEosToRex(0.0001)
+    $: rexBalanceAsEos = (() => {
+        const bal = WharfService.convertRexToEos($rexBalance);
+        if(bal < smallestRex) return 0;
+        return parseFloat(bal.toFixed(4));
+    })();
     $: rexUnstaking = WharfService.convertEosToRex(amount);
 
     let twentyOneDaysFromNow = new Date();
@@ -27,7 +32,6 @@
 </script>
 
 <GlassBox class="mt-2 overflow-hidden">
-
     <TokenInput bind:amount={amount}
                 balance={rexBalanceAsEos}
                 suffix="staked"