@ape.swap/bonds-sdk 6.2.8 → 6.2.10

package/dist/views/ProjectView/components/BondStats/index.js

@@ -1,10 +1,9 @@
 import { jsxs, jsx } from 'theme-ui/jsx-runtime';
 import { useState, useEffect } from 'react';
 import { stripDate } from './utils.js';
-import { chartOptions, options } from './types.js';
+import { chartOptions } from './types.js';
 import CircularProgress from '../../../../components/CircularProgress/index.js';
-import { Chart, CategoryScale, LinearScale, PointElement, LineElement, Title, Tooltip, Legend } from 'chart.js';
-import { Line } from 'react-chartjs-2';
+import LineChart from './LineChart.js';
 import { getBalanceNumber } from '../../../../utils/getBalanceNumber.js';
 import { styles } from './styles.js';
 import useGetBondApiStats from '../../../../state/bondApiStats/useGetBondApiStats.js';
@@ -12,35 +11,18 @@ import Flex from '../../../../components/uikit-sdk/Flex/index.js';
 import { Link } from 'theme-ui';
 import MenuSelect from '../../../../components/MenuSelect/MenuSelect.js';
 
-Chart.register(CategoryScale, LinearScale, PointElement, LineElement, Title, Tooltip, Legend);
 const BondStats = ({ selectedBond }) => {
     const { data: bondStats } = useGetBondApiStats(selectedBond?.contractAddress?.[selectedBond?.chainId]);
     const [chartOption, setChartOption] = useState(chartOptions[0].value);
     const [salesCountChartData, setSalesCountChartData] = useState({
+        label: 'Sales Count',
         labels: [],
-        datasets: [
-            {
-                label: 'Sales Count',
-                data: [],
-                fill: true,
-                borderColor: '#6560C5',
-                backgroundColor: 'rgba(101, 96, 197, 0.9)',
-                tension: 0.4,
-            },
-        ],
+        data: [],
     });
     const [salesAmountChartData, setSalesAmountChartData] = useState({
+        label: 'Sales Amount $',
         labels: [],
-        datasets: [
-            {
-                label: 'Sales Amount (USD)',
-                data: [],
-                fill: true,
-                borderColor: '#6560C5',
-                backgroundColor: 'rgba(101, 96, 197, 0.9)',
-                tension: 0.4,
-            },
-        ],
+        data: [],
     });
     const maxTotalPayout = getBalanceNumber(selectedBond?.maxTotalPayout ?? '0', selectedBond.earnToken.decimals[selectedBond.chainId] ?? 18);
     const tokensRemaining = parseFloat(selectedBond?.tokensRemaining ?? '0');
@@ -60,28 +42,19 @@ const BondStats = ({ selectedBond }) => {
             }, {});
             const salesByDate = Object.values(countsByDate);
             const labels = Object.keys(countsByDate);
-            setSalesCountChartData({
-                labels: labels,
-                datasets: [
-                    {
-                        ...salesCountChartData.datasets[0],
-                        data: salesByDate.map((sale) => sale?.salesNum),
-                    },
-                ],
-            });
-            setSalesAmountChartData({
-                labels: labels,
-                datasets: [
-                    {
-                        ...salesAmountChartData.datasets[0],
-                        data: salesByDate.map((sale) => sale?.salesAmount),
-                    },
-                ],
-            });
+            setSalesCountChartData((prev) => ({
+                ...prev,
+                labels,
+                data: salesByDate.map((sale) => sale?.salesNum),
+            }));
+            setSalesAmountChartData((prev) => ({
+                ...prev,
+                labels,
+                data: salesByDate.map((sale) => sale?.salesAmount),
+            }));
         }
-        /* eslint-disable react-hooks/exhaustive-deps */
     }, [bondStats]);
-    return (jsxs(Flex, { sx: styles.bondStatsContainer, children: [jsxs(Flex, { sx: styles.titleContainer, children: [jsx(Flex, { sx: { fontSize: '22px' }, children: "Bond Stats" }), jsxs(Link, { href: `https://dashboard.ape.bond/bond/${selectedBond?.contractAddress?.[selectedBond?.chainId]}`, sx: styles.link, target: "_blank", rel: "noopener noreferrer", children: ["View More ", '>'] })] }), jsxs(Flex, { sx: styles.chartsContainer, children: [jsxs(Flex, { sx: styles.salesChart, children: [jsx(Flex, { sx: { width: '155px' }, children: jsx(MenuSelect, { selectedOption: chartOption, setOption: setChartOption, options: chartOptions }) }), jsx(Flex, { sx: { width: '100%', height: '100%', minHeight: '225px' }, children: chartOption === 'amount' ? (jsx(Line, { options: options, data: salesAmountChartData })) : (jsx(Line, { options: options, data: salesCountChartData })) })] }), bondStats?.percentageSold && (jsxs(Flex, { sx: styles.percentageSoldChart, children: [jsxs(Flex, { sx: { mb: '10px' }, children: [selectedBond.earnToken.symbol, " Sold"] }), jsx(CircularProgress, { value: bondStats?.percentageSold, size: 176, valueTemplate: `${bondStats?.percentageSold?.toFixed()}%`, valueColor: "#6560C5", rangeColor: "rgba(250, 250, 250, 0.05)", textColor: "#f6f6f6" }), jsxs(Flex, { sx: { fontSize: '14px', fontWeight: 500, color: 'textDisabledButton' }, children: [soldTokens, " / ", maxTotalPayout?.toLocaleString(), " ", selectedBond.earnToken.symbol] })] }))] })] }));
+    return (jsxs(Flex, { sx: styles.bondStatsContainer, children: [jsxs(Flex, { sx: styles.titleContainer, children: [jsx(Flex, { sx: { fontSize: '22px' }, children: "Bond Stats" }), jsxs(Link, { href: `https://dashboard.ape.bond/bond/${selectedBond?.contractAddress?.[selectedBond?.chainId]}`, sx: styles.link, target: "_blank", rel: "noopener noreferrer", children: ["View More ", '>'] })] }), jsxs(Flex, { sx: styles.chartsContainer, children: [jsxs(Flex, { sx: styles.salesChart, children: [jsx(Flex, { sx: { width: '155px' }, children: jsx(MenuSelect, { selectedOption: chartOption, setOption: setChartOption, options: chartOptions }) }), jsx(Flex, { sx: { width: '100%', height: '100%', minHeight: '225px' }, children: chartOption === 'amount' ? (jsx(LineChart, { labels: salesAmountChartData.labels, data: salesAmountChartData.data, valueLabel: salesAmountChartData.label })) : (jsx(LineChart, { labels: salesCountChartData.labels, data: salesCountChartData.data, valueLabel: salesCountChartData.label })) })] }), bondStats?.percentageSold && (jsxs(Flex, { sx: styles.percentageSoldChart, children: [jsxs(Flex, { sx: { mb: '10px' }, children: [selectedBond.earnToken.symbol, " Sold"] }), jsx(CircularProgress, { value: bondStats?.percentageSold, size: 176, valueTemplate: `${bondStats?.percentageSold?.toFixed()}%`, valueColor: "#6560C5", rangeColor: "rgba(250, 250, 250, 0.05)", textColor: "#f6f6f6" }), jsxs(Flex, { sx: { fontSize: '14px', fontWeight: 500, color: 'textDisabledButton', mt: '15px' }, children: [soldTokens, " / ", maxTotalPayout?.toLocaleString(), " ", selectedBond.earnToken.symbol] })] }))] })] }));
 };
 
 export { BondStats as default };

package/dist/views/ProjectView/components/BondStats/index.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.js","sources":["../../../../../src/views/ProjectView/components/BondStats/index.tsx"],"sourcesContent":["import React, { useEffect, useState } from 'react'\nimport { stripDate } from './utils'\nimport { ChartData, chartOptions, options } from './types'\nimport CircularProgress from '../../../../components/CircularProgress'\nimport {\n  CategoryScale,\n  Chart as ChartJS,\n  Legend,\n  LinearScale,\n  LineElement,\n  PointElement,\n  Title,\n  Tooltip,\n} from 'chart.js'\nimport { Line } from 'react-chartjs-2'\nimport { getBalanceNumber } from '../../../../utils/getBalanceNumber'\nimport { styles } from './styles'\nimport { BondsData } from '../../../../types/bonds'\nimport useGetBondApiStats from '../../../../state/bondApiStats/useGetBondApiStats'\nimport Flex from '../../../../components/uikit-sdk/Flex'\nimport { Link } from 'theme-ui'\nimport MenuSelect from '../../../../components/MenuSelect/MenuSelect'\n\nChartJS.register(CategoryScale, LinearScale, PointElement, LineElement, Title, Tooltip, Legend)\n\nconst BondStats = ({ selectedBond }: { selectedBond: BondsData }) => {\n  const { data: bondStats } = useGetBondApiStats(selectedBond?.contractAddress?.[selectedBond?.chainId])\n  const [chartOption, setChartOption] = useState<string>(chartOptions[0].value)\n  const [salesCountChartData, setSalesCountChartData] = useState<ChartData>({\n    labels: [],\n    datasets: [\n      {\n        label: 'Sales Count',\n        data: [],\n        fill: true,\n        borderColor: '#6560C5',\n        backgroundColor: 'rgba(101, 96, 197, 0.9)',\n        tension: 0.4,\n      },\n    ],\n  })\n  const [salesAmountChartData, setSalesAmountChartData] = useState<ChartData>({\n    labels: [],\n    datasets: [\n      {\n        label: 'Sales Amount (USD)',\n        data: [],\n        fill: true,\n        borderColor: '#6560C5',\n        backgroundColor: 'rgba(101, 96, 197, 0.9)',\n        tension: 0.4,\n      },\n    ],\n  })\n\n  const maxTotalPayout = getBalanceNumber(\n    selectedBond?.maxTotalPayout ?? '0',\n    selectedBond.earnToken.decimals[selectedBond.chainId] ?? 18,\n  )\n  const tokensRemaining = parseFloat(selectedBond?.tokensRemaining ?? '0')\n  const soldTokens = Math.floor(maxTotalPayout - tokensRemaining)?.toLocaleString()\n\n  useEffect(() => {\n    if (bondStats) {\n      const reversedData = [...bondStats.Sales].reverse()\n      const countsByDate: { [key: string]: { salesNum: number; salesAmount: number } } = reversedData.reduce<{\n        [dateStr: string]: { salesNum: number; salesAmount: number }\n      }>((acc, item) => {\n        const dateStr = stripDate(item?.createdAt)\n\n        if (!acc[dateStr]) {\n          acc[dateStr] = { salesNum: 0, salesAmount: 0 }\n        }\n        const dollarValue = item?.dollarValue || 0\n        acc[dateStr].salesNum += 1\n        acc[dateStr].salesAmount += Math.round(dollarValue)\n\n        return acc\n      }, {})\n\n      const salesByDate = Object.values(countsByDate)\n      const labels = Object.keys(countsByDate)\n\n      setSalesCountChartData({\n        labels: labels,\n        datasets: [\n          {\n            ...salesCountChartData.datasets[0],\n            data: salesByDate.map((sale) => sale?.salesNum),\n          },\n        ],\n      })\n      setSalesAmountChartData({\n        labels: labels,\n        datasets: [\n          {\n            ...salesAmountChartData.datasets[0],\n            data: salesByDate.map((sale) => sale?.salesAmount),\n          },\n        ],\n      })\n    }\n    /* eslint-disable react-hooks/exhaustive-deps */\n  }, [bondStats])\n\n  return (\n    <Flex sx={styles.bondStatsContainer}>\n      <Flex sx={styles.titleContainer}>\n        <Flex sx={{ fontSize: '22px' }}>Bond Stats</Flex>\n        <Link\n          href={`https://dashboard.ape.bond/bond/${selectedBond?.contractAddress?.[selectedBond?.chainId]}`}\n          sx={styles.link}\n          target=\"_blank\"\n          rel=\"noopener noreferrer\"\n        >\n          View More {'>'}\n        </Link>\n      </Flex>\n      <Flex sx={styles.chartsContainer}>\n        <Flex sx={styles.salesChart}>\n          <Flex sx={{ width: '155px' }}>\n            <MenuSelect selectedOption={chartOption} setOption={setChartOption} options={chartOptions} />\n          </Flex>\n          <Flex sx={{ width: '100%', height: '100%', minHeight: '225px' }}>\n            {chartOption === 'amount' ? (\n              <Line options={options} data={salesAmountChartData} />\n            ) : (\n              <Line options={options} data={salesCountChartData} />\n            )}\n          </Flex>\n        </Flex>\n        {bondStats?.percentageSold && (\n          <Flex sx={styles.percentageSoldChart}>\n            <Flex sx={{ mb: '10px' }}>{selectedBond.earnToken.symbol} Sold</Flex>\n            <CircularProgress\n              value={bondStats?.percentageSold}\n              size={176}\n              valueTemplate={`${bondStats?.percentageSold?.toFixed()}%`}\n              valueColor=\"#6560C5\"\n              rangeColor=\"rgba(250, 250, 250, 0.05)\"\n              textColor=\"#f6f6f6\"\n            />\n            <Flex sx={{ fontSize: '14px', fontWeight: 500, color: 'textDisabledButton' }}>\n              {soldTokens} / {maxTotalPayout?.toLocaleString()} {selectedBond.earnToken.symbol}\n            </Flex>\n          </Flex>\n        )}\n      </Flex>\n    </Flex>\n  )\n}\n\nexport default BondStats\n"],"names":["ChartJS","_jsxs","_jsx"],"mappings":"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"}
+{"version":3,"file":"index.js","sources":["../../../../../src/views/ProjectView/components/BondStats/index.tsx"],"sourcesContent":["import React, { useEffect, useState } from 'react'\nimport { stripDate } from './utils'\nimport { ChartData, chartOptions } from './types'\nimport CircularProgress from '../../../../components/CircularProgress'\nimport LineChart from './LineChart'\nimport { getBalanceNumber } from '../../../../utils/getBalanceNumber'\nimport { styles } from './styles'\nimport { BondsData } from '../../../../types/bonds'\nimport useGetBondApiStats from '../../../../state/bondApiStats/useGetBondApiStats'\nimport Flex from '../../../../components/uikit-sdk/Flex'\nimport { Link } from 'theme-ui'\nimport MenuSelect from '../../../../components/MenuSelect/MenuSelect'\n\nconst BondStats = ({ selectedBond }: { selectedBond: BondsData }) => {\n  const { data: bondStats } = useGetBondApiStats(selectedBond?.contractAddress?.[selectedBond?.chainId])\n  const [chartOption, setChartOption] = useState<string>(chartOptions[0].value)\n  const [salesCountChartData, setSalesCountChartData] = useState<ChartData>({\n    label: 'Sales Count',\n    labels: [],\n    data: [],\n  })\n  const [salesAmountChartData, setSalesAmountChartData] = useState<ChartData>({\n    label: 'Sales Amount $',\n    labels: [],\n    data: [],\n  })\n\n  const maxTotalPayout = getBalanceNumber(\n    selectedBond?.maxTotalPayout ?? '0',\n    selectedBond.earnToken.decimals[selectedBond.chainId] ?? 18,\n  )\n  const tokensRemaining = parseFloat(selectedBond?.tokensRemaining ?? '0')\n  const soldTokens = Math.floor(maxTotalPayout - tokensRemaining)?.toLocaleString()\n\n  useEffect(() => {\n    if (bondStats) {\n      const reversedData = [...bondStats.Sales].reverse()\n      const countsByDate: { [key: string]: { salesNum: number; salesAmount: number } } = reversedData.reduce<{\n        [dateStr: string]: { salesNum: number; salesAmount: number }\n      }>((acc, item) => {\n        const dateStr = stripDate(item?.createdAt)\n\n        if (!acc[dateStr]) {\n          acc[dateStr] = { salesNum: 0, salesAmount: 0 }\n        }\n        const dollarValue = item?.dollarValue || 0\n        acc[dateStr].salesNum += 1\n        acc[dateStr].salesAmount += Math.round(dollarValue)\n\n        return acc\n      }, {})\n\n      const salesByDate = Object.values(countsByDate)\n      const labels = Object.keys(countsByDate)\n\n      setSalesCountChartData((prev) => ({\n        ...prev,\n        labels,\n        data: salesByDate.map((sale) => sale?.salesNum),\n      }))\n      setSalesAmountChartData((prev) => ({\n        ...prev,\n        labels,\n        data: salesByDate.map((sale) => sale?.salesAmount),\n      }))\n    }\n  }, [bondStats])\n\n  return (\n    <Flex sx={styles.bondStatsContainer}>\n      <Flex sx={styles.titleContainer}>\n        <Flex sx={{ fontSize: '22px' }}>Bond Stats</Flex>\n        <Link\n          href={`https://dashboard.ape.bond/bond/${selectedBond?.contractAddress?.[selectedBond?.chainId]}`}\n          sx={styles.link}\n          target=\"_blank\"\n          rel=\"noopener noreferrer\"\n        >\n          View More {'>'}\n        </Link>\n      </Flex>\n      <Flex sx={styles.chartsContainer}>\n        <Flex sx={styles.salesChart}>\n          <Flex sx={{ width: '155px' }}>\n            <MenuSelect selectedOption={chartOption} setOption={setChartOption} options={chartOptions} />\n          </Flex>\n          <Flex sx={{ width: '100%', height: '100%', minHeight: '225px' }}>\n            {chartOption === 'amount' ? (\n              <LineChart\n                labels={salesAmountChartData.labels}\n                data={salesAmountChartData.data}\n                valueLabel={salesAmountChartData.label}\n              />\n            ) : (\n              <LineChart\n                labels={salesCountChartData.labels}\n                data={salesCountChartData.data}\n                valueLabel={salesCountChartData.label}\n              />\n            )}\n          </Flex>\n        </Flex>\n        {bondStats?.percentageSold && (\n          <Flex sx={styles.percentageSoldChart}>\n            <Flex sx={{ mb: '10px' }}>{selectedBond.earnToken.symbol} Sold</Flex>\n            <CircularProgress\n              value={bondStats?.percentageSold}\n              size={176}\n              valueTemplate={`${bondStats?.percentageSold?.toFixed()}%`}\n              valueColor=\"#6560C5\"\n              rangeColor=\"rgba(250, 250, 250, 0.05)\"\n              textColor=\"#f6f6f6\"\n            />\n            <Flex sx={{ fontSize: '14px', fontWeight: 500, color: 'textDisabledButton', mt: '15px' }}>\n              {soldTokens} / {maxTotalPayout?.toLocaleString()} {selectedBond.earnToken.symbol}\n            </Flex>\n          </Flex>\n        )}\n      </Flex>\n    </Flex>\n  )\n}\n\nexport default BondStats\n"],"names":["_jsxs","_jsx"],"mappings":"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"}

package/dist/views/ProjectView/components/BondStats/types.d.ts

@@ -1,44 +1,9 @@
-export declare const options: {
-    scales: {
-        y: {
-            grid: {
-                display: boolean;
-                color: string;
-                drawOnChartArea: boolean;
-            };
-            beginAtZero: boolean;
-        };
-        x: {
-            grid: {
-                display: boolean;
-                color: string;
-                drawOnChartArea: boolean;
-            };
-        };
-    };
-    plugins: {
-        legend: {
-            display: boolean;
-        };
-    };
-    pointRadius: number;
-    responsive: boolean;
-    maintainAspectRatio: boolean;
-};
-interface ChartDataset {
-    label: string;
-    data: number[];
-    fill: boolean;
-    borderColor: string;
-    backgroundColor: string;
-    tension: number;
-}
 export interface ChartData {
+    label: string;
     labels: string[];
-    datasets: ChartDataset[];
+    data: number[];
 }
 export declare const chartOptions: {
     label: string;
     value: string;
 }[];
-export {};

package/dist/views/ProjectView/components/BondStats/types.js

@@ -1,30 +1,3 @@
-const options = {
-    scales: {
-        y: {
-            grid: {
-                display: true,
-                color: 'rgba(250, 250, 250, 0.1)',
-                drawOnChartArea: true,
-            },
-            beginAtZero: true,
-        },
-        x: {
-            grid: {
-                display: true,
-                color: 'rgba(250, 250, 250, 0.1)',
-                drawOnChartArea: true,
-            },
-        },
-    },
-    plugins: {
-        legend: {
-            display: false,
-        },
-    },
-    pointRadius: 0,
-    responsive: true,
-    maintainAspectRatio: false,
-};
 const chartOptions = [
     {
         label: 'Sales Amount',
@@ -36,5 +9,5 @@ const chartOptions = [
     },
 ];
 
-export { chartOptions, options };
+export { chartOptions };
 //# sourceMappingURL=types.js.map

package/dist/views/ProjectView/components/BondStats/types.js.map

@@ -1 +1 @@
-{"version":3,"file":"types.js","sources":["../../../../../src/views/ProjectView/components/BondStats/types.ts"],"sourcesContent":["export const options = {\n  scales: {\n    y: {\n      grid: {\n        display: true,\n        color: 'rgba(250, 250, 250, 0.1)',\n        drawOnChartArea: true,\n      },\n      beginAtZero: true,\n    },\n    x: {\n      grid: {\n        display: true,\n        color: 'rgba(250, 250, 250, 0.1)',\n        drawOnChartArea: true,\n      },\n    },\n  },\n  plugins: {\n    legend: {\n      display: false,\n    },\n  },\n  pointRadius: 0,\n  responsive: true,\n  maintainAspectRatio: false,\n}\n\ninterface ChartDataset {\n  label: string\n  data: number[]\n  fill: boolean\n  borderColor: string\n  backgroundColor: string\n  tension: number\n}\n\nexport interface ChartData {\n  labels: string[]\n  datasets: ChartDataset[]\n}\n\nexport const chartOptions = [\n  {\n    label: 'Sales Amount',\n    value: 'amount',\n  },\n  {\n    label: 'Sales Count',\n    value: 'count',\n  },\n]\n"],"names":[],"mappings":"AAAO,MAAM,OAAO,GAAG;AACrB,IAAA,MAAM,EAAE;AACN,QAAA,CAAC,EAAE;AACD,YAAA,IAAI,EAAE;AACJ,gBAAA,OAAO,EAAE,IAAI;AACb,gBAAA,KAAK,EAAE,0BAA0B;AACjC,gBAAA,eAAe,EAAE,IAAI;AACtB,aAAA;AACD,YAAA,WAAW,EAAE,IAAI;AAClB,SAAA;AACD,QAAA,CAAC,EAAE;AACD,YAAA,IAAI,EAAE;AACJ,gBAAA,OAAO,EAAE,IAAI;AACb,gBAAA,KAAK,EAAE,0BAA0B;AACjC,gBAAA,eAAe,EAAE,IAAI;AACtB,aAAA;AACF,SAAA;AACF,KAAA;AACD,IAAA,OAAO,EAAE;AACP,QAAA,MAAM,EAAE;AACN,YAAA,OAAO,EAAE,KAAK;AACf,SAAA;AACF,KAAA;AACD,IAAA,WAAW,EAAE,CAAC;AACd,IAAA,UAAU,EAAE,IAAI;AAChB,IAAA,mBAAmB,EAAE,KAAK;;AAiBrB,MAAM,YAAY,GAAG;AAC1B,IAAA;AACE,QAAA,KAAK,EAAE,cAAc;AACrB,QAAA,KAAK,EAAE,QAAQ;AAChB,KAAA;AACD,IAAA;AACE,QAAA,KAAK,EAAE,aAAa;AACpB,QAAA,KAAK,EAAE,OAAO;AACf,KAAA;;;;;"}
+{"version":3,"file":"types.js","sources":["../../../../../src/views/ProjectView/components/BondStats/types.ts"],"sourcesContent":["export interface ChartData {\n  label: string\n  labels: string[]\n  data: number[]\n}\n\nexport const chartOptions = [\n  {\n    label: 'Sales Amount',\n    value: 'amount',\n  },\n  {\n    label: 'Sales Count',\n    value: 'count',\n  },\n]\n"],"names":[],"mappings":"AAMO,MAAM,YAAY,GAAG;AAC1B,IAAA;AACE,QAAA,KAAK,EAAE,cAAc;AACrB,QAAA,KAAK,EAAE,QAAQ;AAChB,KAAA;AACD,IAAA;AACE,QAAA,KAAK,EAAE,aAAa;AACpB,QAAA,KAAK,EAAE,OAAO;AACf,KAAA;;;;;"}

package/dist/views/YourBonds/components/UserBondRow/UserBondRow.js

@@ -27,6 +27,7 @@ import AbondModal from '../../../../components/CustomClaimModals/AbondModal.js';
 import OabondModal from '../../../../components/CustomClaimModals/OabondModal.js';
 import PmusdModal from '../../../../components/CustomClaimModals/PmusdModal.js';
 import More from '../../../../components/uikit-sdk/Svg/Icons/More.js';
+import PostClaimModal from '../../../../components/CustomClaimModals/PostClaimModal.js';
 
 const UserBondRow = ({ bill }) => {
     // Hooks
@@ -97,6 +98,7 @@ const UserBondRow = ({ bill }) => {
     const [openCircularModal] = useModal(jsx(AbondModal, {}), true, false, 'circularModal');
     const [openOABONDModal] = useModal(jsx(OabondModal, {}), true, false, 'oABONDModal');
     const [openPmusdModal] = useModal(jsx(PmusdModal, {}), true, false, 'pmUSDModal');
+    const [openPostClaimFlowModal] = useModal(jsx(PostClaimModal, { tokenSymbol: bill?.bond?.earnToken?.symbol, text: bill?.bond?.postClaimFlow?.text, imgUrl: bill?.bond?.postClaimFlow?.imgUrl, ctaUrl: bill?.bond?.postClaimFlow?.ctaUrl }), true, false, 'postClaimFlowModal');
     useEffect(() => {
         if (isConfirmed) {
             refetchUserBonds();
@@ -109,6 +111,9 @@ const UserBondRow = ({ bill }) => {
             if (bill?.bond?.earnToken.symbol.toLowerCase() === 'pmusd') {
                 openPmusdModal();
             }
+            if (bill?.bond?.postClaimFlow) {
+                openPostClaimFlowModal();
+            }
         }
         /* eslint-disable react-hooks/exhaustive-deps */
     }, [isConfirmed]);

package/dist/views/YourBonds/components/UserBondRow/UserBondRow.js.map

@@ -1 +1 @@
-{"version":3,"file":"UserBondRow.js","sources":["../../../../../src/views/YourBonds/components/UserBondRow/UserBondRow.tsx"],"sourcesContent":["import React, { useEffect, useState } from 'react'\nimport { Flex } from 'theme-ui'\nimport TokenInfoAndName from '../../../../components/TokenInfoAndName'\nimport { formatNumberSI } from '../../../../utils/formatNumber'\nimport Button from '../../../../components/uikit-sdk/Button/Button'\nimport TooltipBubble from '../../../../components/uikit-sdk/TooltipBubble'\nimport { UserBill } from '../../../../types/yourbonds'\nimport {\n  claimable,\n  getPendingVestingString,\n  getPercentageVested,\n  getTimeLeftForFullyVested,\n  pending,\n} from '../../../../utils/displayHelpers'\nimport { useChainId, useSwitchChain, useWriteContract } from 'wagmi'\nimport BOND_ABI from '../../../../config/abi/BOND_2_4_0.json'\nimport useModal from '../../../../hooks/useModal'\nimport YourBondsModal from '../../../YourBondsModal/YourBondsModal'\nimport { usePopups } from '../../../../state/popups/usePopups'\nimport { useMonitorTx } from '../../../../hooks/useMonitorTx'\nimport Tooltip from '../../../../components/Tooltip/Tooltip'\nimport track from '../../../../utils/track'\nimport { remove0xPrefix } from '../../../../utils/remove0xPrefix'\nimport { getTimePeriods } from '../../../../utils/getTimePeriods'\nimport { reportError } from '../../../../utils/reportError'\nimport { useSDKConfig } from '../../../../state/useSDKConfig'\nimport useEVMAccount from '../../../../hooks/accounts/useEVMAccount'\nimport useUserBonds from '../../../../state/bonds/useUserBonds'\nimport ProfitCard from '../ProfitCard/ProfitCard'\nimport ProgressBarWrapper from '../../../../components/ProgressBar/ProgressBarWrapper'\nimport ProgressBar from '../../../../components/ProgressBar/ProgressBar'\nimport { AbondModal, OabondModal, PmusdModal } from '../../../../components/CustomClaimModals'\nimport More from '../../../../components/uikit-sdk/Svg/Icons/More'\n\nconst UserBondRow = ({ bill }: { bill: UserBill }) => {\n  // Hooks\n  const userChainId = useChainId()\n  const SDKConfig = useSDKConfig()\n  const { address: account } = useEVMAccount()\n  const { switchChain } = useSwitchChain()\n  const { writeContractAsync } = useWriteContract()\n  const { addToastError } = usePopups()\n  const { refetch: refetchUserBonds } = useUserBonds()\n  const [onOpenPurchasedBond] = useModal(<YourBondsModal userBill={bill} />)\n\n  // State\n  const [claimTxHash, setClaimTxHash] = useState<string | null>(null)\n  const { isLoading: isConfirming, isSuccess: isConfirmed } = useMonitorTx(claimTxHash, bill?.bond?.chainId)\n  const [loadingTx, setLoadingTx] = useState(false)\n  const load = loadingTx || (isConfirming && !isConfirmed)\n\n  const handleClaim = async (billId: string, billAddress: string) => {\n    if (userChainId !== bill?.bond?.chainId) {\n      await switchChain({ chainId: bill?.bond?.chainId! })\n    }\n    const address: `0x${string}` = billAddress as `0x${string}`\n    try {\n      setLoadingTx(true)\n      const tx = await writeContractAsync({\n        address: address,\n        abi: BOND_ABI,\n        functionName: 'redeem',\n        args: [billId],\n        chain: userChainId as any,\n        account,\n      })\n      setLoadingTx(false)\n\n      if (tx) {\n        setClaimTxHash(tx)\n        track({\n          event: 'bond',\n          chain: bill?.bond?.chainId,\n          data: {\n            cat: 'claim',\n            bondType: bill?.bond?.billType,\n            address: remove0xPrefix(bill?.bond?.contractAddress?.[bill?.bond?.chainId]),\n            earnToken: bill?.bond?.earnToken.symbol,\n          },\n        })\n      }\n    } catch (error: any) {\n      setLoadingTx(false)\n      console.error('Claim failed:', error)\n      addToastError(error.message)\n      reportError({\n        apiUrl: SDKConfig?.urls?.apiV2,\n        error,\n        extraInfo: { type: 'claim', bill, error },\n        chainId: bill?.bond?.chainId,\n        account,\n      })\n    }\n  }\n\n  // Display Info\n  const earnTokenPrice = parseFloat(bill?.bond?.payoutTokenPrice ?? '0')\n  const vestingCliff = bill?.bond?.vestingCliff\n  const currentTime = Math.round(new Date().getTime() / 1000)\n  const purchaseTimestamp = parseInt(bill?.vestingStartTimestamp ?? '0')\n  const isPendingCliff = vestingCliff ? currentTime - purchaseTimestamp < vestingCliff : false\n  const cliffCountdown = getTimePeriods(purchaseTimestamp + (vestingCliff ?? 0) - currentTime, true)\n\n  // Modals\n  const [openCircularModal] = useModal(<AbondModal />, true, false, 'circularModal')\n  const [openOABONDModal] = useModal(<OabondModal />, true, false, 'oABONDModal')\n  const [openPmusdModal] = useModal(<PmusdModal />, true, false, 'pmUSDModal')\n\n  useEffect(() => {\n    if (isConfirmed) {\n      refetchUserBonds()\n      if (bill?.bond?.earnToken.symbol.toLowerCase() === 'abond') {\n        openCircularModal()\n      }\n      if (bill?.bond?.earnToken.symbol.toLowerCase() === 'oabond') {\n        openOABONDModal()\n      }\n      if (bill?.bond?.earnToken.symbol.toLowerCase() === 'pmusd') {\n        openPmusdModal()\n      }\n    }\n    /* eslint-disable react-hooks/exhaustive-deps */\n  }, [isConfirmed])\n\n  return (\n    <div className=\"your-bonds\" onClick={onOpenPurchasedBond}>\n      <div className=\"token-info-container\">\n        <TokenInfoAndName\n          tokenSymbol={bill?.bond?.earnToken?.symbol}\n          chain={bill?.bond?.chainId}\n          tag={bill?.bond?.tags?.[0]}\n          vestEnds={getTimeLeftForFullyVested(bill) > 0 ? `Ends in ${getPendingVestingString(bill)}` : `Fully Vested`}\n          isHotBond\n        />\n        <div className=\"tooltip-column\">\n          <TooltipBubble\n            className=\"tooltip-bubble\"\n            body={\n              <Tooltip\n                earnTokenContract={bill?.bond?.earnToken.address[bill?.bond.chainId] || ''}\n                earnTokenSymbol={bill?.bond?.earnToken.symbol || ''}\n                bondContract={bill?.address ?? ''}\n                projectLink={bill?.bond?.projectLink}\n                twitter={bill?.bond?.twitter}\n                chain={bill?.bond?.chainId!}\n                cgId={bill?.bond?.cgId}\n                dexscreener={bill?.bond?.dexscreener}\n              />\n            }\n            width=\"205px\"\n            placement=\"bottomRight\"\n            transformTip=\"translate(5%, 0%)\"\n          >\n            <Flex\n              sx={{\n                opacity: 0.8,\n              }}\n            >\n              <More width=\"25px\" />\n            </Flex>\n          </TooltipBubble>\n        </div>\n      </div>\n      <div className=\"your-bonds-columns-container\">\n        <Flex sx={{ width: '125px' }}>\n          <ProfitCard userBond={bill} />\n        </Flex>\n        <div className=\"your-bonds-content\">\n          <div className=\"your-bonds-content-title\">Claimable</div>\n          <div className=\"your-bonds-content-tokens-amount\">\n            {formatNumberSI(claimable(bill), 3)}\n            <div className=\"your-bonds-content-tokens-usd-amount\">\n              {`($${(claimable(bill) * earnTokenPrice).toFixed(2)})`}\n            </div>\n          </div>\n        </div>\n        <div className=\"your-bonds-content\">\n          <div className=\"your-bonds-content-title\">Pending</div>\n          <div className=\"your-bonds-content-tokens-amount\">\n            {formatNumberSI(pending(bill), 3)}\n            <div className=\"your-bonds-content-tokens-usd-amount\">\n              {`($${(pending(bill) * earnTokenPrice).toFixed(2)})`}\n            </div>\n          </div>\n        </div>\n        <div className=\"your-bonds-content hide-mobile\">\n          <ProgressBarWrapper\n            title={''}\n            value={<ProgressBar value={getPercentageVested(bill)} />}\n            style={{\n              width: '127px',\n              height: '25px',\n              flexDirection: 'column',\n              justifyContent: 'center',\n              display: ['none', 'none', 'none', 'flex'],\n            }}\n            showTooltip={true}\n            toolTip={\n              getTimeLeftForFullyVested(bill) > 0\n                ? `Fully vested in ${getPendingVestingString(bill)}.`\n                : `Fully Vested.`\n            }\n          />\n        </div>\n        <div className=\"your-bonds-column-button\">\n          <Button\n            className=\"button\"\n            disabled={claimable(bill) === 0 || load || isPendingCliff || bill.paused}\n            load={load}\n            onClick={(event) => {\n              event.stopPropagation()\n              handleClaim(bill.id, bill.address)\n            }}\n            fullWidth\n          >\n            {bill.paused\n              ? 'claims disabled'\n              : isPendingCliff\n                ? `Claimable in ${cliffCountdown.days !== 0 ? `${cliffCountdown.days} days` : cliffCountdown.hours !== 0 ? `${cliffCountdown.hours} hours` : `${cliffCountdown.minutes} mins`}`\n                : 'Claim'}\n          </Button>\n        </div>\n      </div>\n    </div>\n  )\n}\n\nexport default UserBondRow\n"],"names":["_jsx","_jsxs","Tooltip"],"mappings":"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"}
+{"version":3,"file":"UserBondRow.js","sources":["../../../../../src/views/YourBonds/components/UserBondRow/UserBondRow.tsx"],"sourcesContent":["import React, { useEffect, useState } from 'react'\nimport { Flex } from 'theme-ui'\nimport TokenInfoAndName from '../../../../components/TokenInfoAndName'\nimport { formatNumberSI } from '../../../../utils/formatNumber'\nimport Button from '../../../../components/uikit-sdk/Button/Button'\nimport TooltipBubble from '../../../../components/uikit-sdk/TooltipBubble'\nimport { UserBill } from '../../../../types/yourbonds'\nimport {\n  claimable,\n  getPendingVestingString,\n  getPercentageVested,\n  getTimeLeftForFullyVested,\n  pending,\n} from '../../../../utils/displayHelpers'\nimport { useChainId, useSwitchChain, useWriteContract } from 'wagmi'\nimport BOND_ABI from '../../../../config/abi/BOND_2_4_0.json'\nimport useModal from '../../../../hooks/useModal'\nimport YourBondsModal from '../../../YourBondsModal/YourBondsModal'\nimport { usePopups } from '../../../../state/popups/usePopups'\nimport { useMonitorTx } from '../../../../hooks/useMonitorTx'\nimport Tooltip from '../../../../components/Tooltip/Tooltip'\nimport track from '../../../../utils/track'\nimport { remove0xPrefix } from '../../../../utils/remove0xPrefix'\nimport { getTimePeriods } from '../../../../utils/getTimePeriods'\nimport { reportError } from '../../../../utils/reportError'\nimport { useSDKConfig } from '../../../../state/useSDKConfig'\nimport useEVMAccount from '../../../../hooks/accounts/useEVMAccount'\nimport useUserBonds from '../../../../state/bonds/useUserBonds'\nimport ProfitCard from '../ProfitCard/ProfitCard'\nimport ProgressBarWrapper from '../../../../components/ProgressBar/ProgressBarWrapper'\nimport ProgressBar from '../../../../components/ProgressBar/ProgressBar'\nimport { AbondModal, OabondModal, PmusdModal } from '../../../../components/CustomClaimModals'\nimport More from '../../../../components/uikit-sdk/Svg/Icons/More'\nimport PostClaimModal from '../../../../components/CustomClaimModals/PostClaimModal'\n\nconst UserBondRow = ({ bill }: { bill: UserBill }) => {\n  // Hooks\n  const userChainId = useChainId()\n  const SDKConfig = useSDKConfig()\n  const { address: account } = useEVMAccount()\n  const { switchChain } = useSwitchChain()\n  const { writeContractAsync } = useWriteContract()\n  const { addToastError } = usePopups()\n  const { refetch: refetchUserBonds } = useUserBonds()\n  const [onOpenPurchasedBond] = useModal(<YourBondsModal userBill={bill} />)\n\n  // State\n  const [claimTxHash, setClaimTxHash] = useState<string | null>(null)\n  const { isLoading: isConfirming, isSuccess: isConfirmed } = useMonitorTx(claimTxHash, bill?.bond?.chainId)\n  const [loadingTx, setLoadingTx] = useState(false)\n  const load = loadingTx || (isConfirming && !isConfirmed)\n\n  const handleClaim = async (billId: string, billAddress: string) => {\n    if (userChainId !== bill?.bond?.chainId) {\n      await switchChain({ chainId: bill?.bond?.chainId! })\n    }\n    const address: `0x${string}` = billAddress as `0x${string}`\n    try {\n      setLoadingTx(true)\n      const tx = await writeContractAsync({\n        address: address,\n        abi: BOND_ABI,\n        functionName: 'redeem',\n        args: [billId],\n        chain: userChainId as any,\n        account,\n      })\n      setLoadingTx(false)\n\n      if (tx) {\n        setClaimTxHash(tx)\n        track({\n          event: 'bond',\n          chain: bill?.bond?.chainId,\n          data: {\n            cat: 'claim',\n            bondType: bill?.bond?.billType,\n            address: remove0xPrefix(bill?.bond?.contractAddress?.[bill?.bond?.chainId]),\n            earnToken: bill?.bond?.earnToken.symbol,\n          },\n        })\n      }\n    } catch (error: any) {\n      setLoadingTx(false)\n      console.error('Claim failed:', error)\n      addToastError(error.message)\n      reportError({\n        apiUrl: SDKConfig?.urls?.apiV2,\n        error,\n        extraInfo: { type: 'claim', bill, error },\n        chainId: bill?.bond?.chainId,\n        account,\n      })\n    }\n  }\n\n  // Display Info\n  const earnTokenPrice = parseFloat(bill?.bond?.payoutTokenPrice ?? '0')\n  const vestingCliff = bill?.bond?.vestingCliff\n  const currentTime = Math.round(new Date().getTime() / 1000)\n  const purchaseTimestamp = parseInt(bill?.vestingStartTimestamp ?? '0')\n  const isPendingCliff = vestingCliff ? currentTime - purchaseTimestamp < vestingCliff : false\n  const cliffCountdown = getTimePeriods(purchaseTimestamp + (vestingCliff ?? 0) - currentTime, true)\n\n  // Modals\n  const [openCircularModal] = useModal(<AbondModal />, true, false, 'circularModal')\n  const [openOABONDModal] = useModal(<OabondModal />, true, false, 'oABONDModal')\n  const [openPmusdModal] = useModal(<PmusdModal />, true, false, 'pmUSDModal')\n  const [openPostClaimFlowModal] = useModal(\n    <PostClaimModal\n      tokenSymbol={bill?.bond?.earnToken?.symbol!}\n      text={bill?.bond?.postClaimFlow?.text!}\n      imgUrl={bill?.bond?.postClaimFlow?.imgUrl!}\n      ctaUrl={bill?.bond?.postClaimFlow?.ctaUrl!}\n    />,\n    true,\n    false,\n    'postClaimFlowModal',\n  )\n\n  useEffect(() => {\n    if (isConfirmed) {\n      refetchUserBonds()\n      if (bill?.bond?.earnToken.symbol.toLowerCase() === 'abond') {\n        openCircularModal()\n      }\n      if (bill?.bond?.earnToken.symbol.toLowerCase() === 'oabond') {\n        openOABONDModal()\n      }\n      if (bill?.bond?.earnToken.symbol.toLowerCase() === 'pmusd') {\n        openPmusdModal()\n      }\n      if (bill?.bond?.postClaimFlow) {\n        openPostClaimFlowModal()\n      }\n    }\n    /* eslint-disable react-hooks/exhaustive-deps */\n  }, [isConfirmed])\n\n  return (\n    <div className=\"your-bonds\" onClick={onOpenPurchasedBond}>\n      <div className=\"token-info-container\">\n        <TokenInfoAndName\n          tokenSymbol={bill?.bond?.earnToken?.symbol}\n          chain={bill?.bond?.chainId}\n          tag={bill?.bond?.tags?.[0]}\n          vestEnds={getTimeLeftForFullyVested(bill) > 0 ? `Ends in ${getPendingVestingString(bill)}` : `Fully Vested`}\n          isHotBond\n        />\n        <div className=\"tooltip-column\">\n          <TooltipBubble\n            className=\"tooltip-bubble\"\n            body={\n              <Tooltip\n                earnTokenContract={bill?.bond?.earnToken.address[bill?.bond.chainId] || ''}\n                earnTokenSymbol={bill?.bond?.earnToken.symbol || ''}\n                bondContract={bill?.address ?? ''}\n                projectLink={bill?.bond?.projectLink}\n                twitter={bill?.bond?.twitter}\n                chain={bill?.bond?.chainId!}\n                cgId={bill?.bond?.cgId}\n                dexscreener={bill?.bond?.dexscreener}\n              />\n            }\n            width=\"205px\"\n            placement=\"bottomRight\"\n            transformTip=\"translate(5%, 0%)\"\n          >\n            <Flex\n              sx={{\n                opacity: 0.8,\n              }}\n            >\n              <More width=\"25px\" />\n            </Flex>\n          </TooltipBubble>\n        </div>\n      </div>\n      <div className=\"your-bonds-columns-container\">\n        <Flex sx={{ width: '125px' }}>\n          <ProfitCard userBond={bill} />\n        </Flex>\n        <div className=\"your-bonds-content\">\n          <div className=\"your-bonds-content-title\">Claimable</div>\n          <div className=\"your-bonds-content-tokens-amount\">\n            {formatNumberSI(claimable(bill), 3)}\n            <div className=\"your-bonds-content-tokens-usd-amount\">\n              {`($${(claimable(bill) * earnTokenPrice).toFixed(2)})`}\n            </div>\n          </div>\n        </div>\n        <div className=\"your-bonds-content\">\n          <div className=\"your-bonds-content-title\">Pending</div>\n          <div className=\"your-bonds-content-tokens-amount\">\n            {formatNumberSI(pending(bill), 3)}\n            <div className=\"your-bonds-content-tokens-usd-amount\">\n              {`($${(pending(bill) * earnTokenPrice).toFixed(2)})`}\n            </div>\n          </div>\n        </div>\n        <div className=\"your-bonds-content hide-mobile\">\n          <ProgressBarWrapper\n            title={''}\n            value={<ProgressBar value={getPercentageVested(bill)} />}\n            style={{\n              width: '127px',\n              height: '25px',\n              flexDirection: 'column',\n              justifyContent: 'center',\n              display: ['none', 'none', 'none', 'flex'],\n            }}\n            showTooltip={true}\n            toolTip={\n              getTimeLeftForFullyVested(bill) > 0\n                ? `Fully vested in ${getPendingVestingString(bill)}.`\n                : `Fully Vested.`\n            }\n          />\n        </div>\n        <div className=\"your-bonds-column-button\">\n          <Button\n            className=\"button\"\n            disabled={claimable(bill) === 0 || load || isPendingCliff || bill.paused}\n            load={load}\n            onClick={(event) => {\n              event.stopPropagation()\n              handleClaim(bill.id, bill.address)\n            }}\n            fullWidth\n          >\n            {bill.paused\n              ? 'claims disabled'\n              : isPendingCliff\n                ? `Claimable in ${cliffCountdown.days !== 0 ? `${cliffCountdown.days} days` : cliffCountdown.hours !== 0 ? `${cliffCountdown.hours} hours` : `${cliffCountdown.minutes} mins`}`\n                : 'Claim'}\n          </Button>\n        </div>\n      </div>\n    </div>\n  )\n}\n\nexport default UserBondRow\n"],"names":["_jsx","_jsxs","Tooltip"],"mappings":"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"}

package/dist/views/YourBondsModal/components/Actions/Actions.js

@@ -18,6 +18,7 @@ import useModal from '../../../../hooks/useModal.js';
 import AbondModal from '../../../../components/CustomClaimModals/AbondModal.js';
 import OabondModal from '../../../../components/CustomClaimModals/OabondModal.js';
 import PmusdModal from '../../../../components/CustomClaimModals/PmusdModal.js';
+import PostClaimModal from '../../../../components/CustomClaimModals/PostClaimModal.js';
 
 const Actions = ({ userBill }) => {
     // Hooks
@@ -88,6 +89,7 @@ const Actions = ({ userBill }) => {
     const [openAbondModal] = useModal(jsx(AbondModal, {}), true, false, 'abondModal');
     const [openOabondModal] = useModal(jsx(OabondModal, {}), true, false, 'oAbondModal');
     const [openPmusdModal] = useModal(jsx(PmusdModal, {}), true, false, 'pmUSDModal');
+    const [openPostClaimFlowModal] = useModal(jsx(PostClaimModal, { tokenSymbol: userBill?.bond?.earnToken?.symbol, text: userBill?.bond?.postClaimFlow?.text, imgUrl: userBill?.bond?.postClaimFlow?.imgUrl, ctaUrl: userBill?.bond?.postClaimFlow?.ctaUrl }), true, false, 'postClaimFlowModal');
     useEffect(() => {
         if (isConfirmed) {
             refetchUserBonds();
@@ -100,6 +102,9 @@ const Actions = ({ userBill }) => {
             if (userBill?.bond?.earnToken.symbol.toLowerCase() === 'pmusd') {
                 openPmusdModal();
             }
+            if (userBill?.bond?.postClaimFlow) {
+                openPostClaimFlowModal();
+            }
         }
         /* eslint-disable react-hooks/exhaustive-deps */
     }, [isConfirmed]);

package/dist/views/YourBondsModal/components/Actions/Actions.js.map

@@ -1 +1 @@
-{"version":3,"file":"Actions.js","sources":["../../../../../src/views/YourBondsModal/components/Actions/Actions.tsx"],"sourcesContent":["import React, { useEffect, useState } from 'react'\nimport Button from '../../../../components/uikit-sdk/Button/Button'\nimport { claimable } from '../../../../utils/displayHelpers'\nimport { UserBill } from '../../../../types/yourbonds'\nimport { useChainId, useSwitchChain, useWriteContract } from 'wagmi'\nimport { useMonitorTx } from '../../../../hooks/useMonitorTx'\nimport useBondsData from '../../../../state/bonds/useBondsData'\nimport BOND_ABI from '../../../../config/abi/BOND_2_4_0.json'\nimport track from '../../../../utils/track'\nimport { remove0xPrefix } from '../../../../utils/remove0xPrefix'\nimport { reportError } from '../../../../utils/reportError'\nimport { useSDKConfig } from '../../../../state/useSDKConfig'\nimport useEVMAccount from '../../../../hooks/accounts/useEVMAccount'\nimport { usePopups } from '../../../../state/popups/usePopups'\nimport useUserBonds from '../../../../state/bonds/useUserBonds'\nimport { getTimePeriods } from '../../../../utils/getTimePeriods'\nimport useModal from '../../../../hooks/useModal'\nimport { AbondModal, OabondModal, PmusdModal } from '../../../../components/CustomClaimModals'\n\nconst Actions = ({ userBill }: { userBill?: UserBill }) => {\n  // Hooks\n  const { switchChainAsync } = useSwitchChain()\n  const { data: liveBonds } = useBondsData()\n  const SDKConfig = useSDKConfig()\n  const chainId = useChainId()\n  const { writeContractAsync } = useWriteContract()\n  const { address: account } = useEVMAccount()\n  const { addToastError } = usePopups()\n  const { refetch: refetchUserBonds } = useUserBonds()\n\n  // State\n  const [claimTxHash, setClaimTxHash] = useState<string | null>(null)\n  const [loadingTx, setLoadingTx] = useState(false)\n  const { isLoading, isSuccess: isConfirmed } = useMonitorTx(claimTxHash, userBill?.bond?.chainId)\n\n  // Static Data\n  const load = loadingTx || (isLoading && !isConfirmed)\n  const similarLiveBond = liveBonds?.find(\n    (bond) =>\n      !bond?.soldOut &&\n      !bond?.hide &&\n      bond?.earnToken?.symbol?.toLowerCase() === userBill?.bond?.earnToken?.symbol?.toLowerCase(),\n  )\n  const canPurchaseAgain = !!similarLiveBond\n  const vestingCliff = userBill?.bond?.vestingCliff\n  const currentTime = Math.round(new Date().getTime() / 1000)\n  const purchaseTimestamp = parseInt(userBill?.vestingStartTimestamp ?? '0')\n  const isPendingCliff = vestingCliff ? currentTime - purchaseTimestamp < vestingCliff : false\n  const cliffCountdown = getTimePeriods(purchaseTimestamp + (vestingCliff ?? 0) - currentTime, true)\n\n  const handleClaim = async (billId?: string, billAddress?: string) => {\n    const address: `0x${string}` = billAddress as `0x${string}`\n    try {\n      setLoadingTx(true)\n      const tx = await writeContractAsync({\n        address: address,\n        abi: BOND_ABI,\n        functionName: 'redeem',\n        args: [billId],\n        chain: chainId as any,\n        account: account,\n      }).catch()\n\n      if (tx) {\n        setClaimTxHash(tx)\n        track({\n          event: 'bond',\n          chain: userBill?.bond?.chainId,\n          data: {\n            cat: 'claim',\n            bondType: userBill?.bond?.billType,\n            address: remove0xPrefix(userBill?.bond?.contractAddress?.[userBill?.bond?.chainId]),\n            earnToken: userBill?.bond?.earnToken.symbol,\n          },\n        })\n      }\n      setLoadingTx(false)\n    } catch (error: any) {\n      console.error('Claim Failed:', error)\n      setLoadingTx(false)\n      addToastError(error.message)\n      reportError({\n        apiUrl: SDKConfig?.urls?.apiV2,\n        error,\n        extraInfo: { type: 'redeem', userBill, error },\n        chainId,\n        account,\n      })\n    }\n  }\n\n  // Modals\n  const [openAbondModal] = useModal(<AbondModal />, true, false, 'abondModal')\n  const [openOabondModal] = useModal(<OabondModal />, true, false, 'oAbondModal')\n  const [openPmusdModal] = useModal(<PmusdModal />, true, false, 'pmUSDModal')\n\n  useEffect(() => {\n    if (isConfirmed) {\n      refetchUserBonds()\n      if (userBill?.bond?.earnToken.symbol.toLowerCase() === 'abond') {\n        openAbondModal()\n      }\n      if (userBill?.bond?.earnToken.symbol.toLowerCase() === 'oabond') {\n        openOabondModal()\n      }\n      if (userBill?.bond?.earnToken.symbol.toLowerCase() === 'pmusd') {\n        openPmusdModal()\n      }\n    }\n    /* eslint-disable react-hooks/exhaustive-deps */\n  }, [isConfirmed])\n\n  return (\n    <>\n      <Button\n        variant=\"secondary\"\n        disabled={claimable(userBill) === 0 || load || !userBill || isPendingCliff}\n        load={load}\n        onClick={(event) => {\n          event.stopPropagation()\n          if (chainId !== userBill?.bond?.chainId) {\n            switchChainAsync({ chainId: userBill?.bond?.chainId! })\n              .then(() => {\n                handleClaim(userBill?.id, userBill?.address)\n              })\n              .catch()\n          } else {\n            handleClaim(userBill?.id, userBill?.address)\n          }\n        }}\n        sx={{ fontSize: '14px', width: '100%' }}\n      >\n        {isPendingCliff\n          ? `Claimable in ${cliffCountdown.days !== 0 ? `${cliffCountdown.days} days` : cliffCountdown.hours !== 0 ? `${cliffCountdown.hours} hours` : `${cliffCountdown.minutes} mins`}`\n          : 'Claim'}\n      </Button>\n      <Button\n        sx={{ fontSize: '14px', width: '100%' }}\n        onClick={() =>\n          canPurchaseAgain\n            ? (window.location.href = `/bonds?bondAddress=${similarLiveBond.contractAddress[similarLiveBond.chainId]}&bondChain=${similarLiveBond.chainId}`)\n            : null\n        }\n        disabled={!canPurchaseAgain}\n      >\n        {canPurchaseAgain ? 'Buy again' : 'sold out'}\n      </Button>\n    </>\n  )\n}\n\nexport default Actions\n"],"names":["_jsx","_jsxs","_Fragment"],"mappings":"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"}
+{"version":3,"file":"Actions.js","sources":["../../../../../src/views/YourBondsModal/components/Actions/Actions.tsx"],"sourcesContent":["import React, { useEffect, useState } from 'react'\nimport Button from '../../../../components/uikit-sdk/Button/Button'\nimport { claimable } from '../../../../utils/displayHelpers'\nimport { UserBill } from '../../../../types/yourbonds'\nimport { useChainId, useSwitchChain, useWriteContract } from 'wagmi'\nimport { useMonitorTx } from '../../../../hooks/useMonitorTx'\nimport useBondsData from '../../../../state/bonds/useBondsData'\nimport BOND_ABI from '../../../../config/abi/BOND_2_4_0.json'\nimport track from '../../../../utils/track'\nimport { remove0xPrefix } from '../../../../utils/remove0xPrefix'\nimport { reportError } from '../../../../utils/reportError'\nimport { useSDKConfig } from '../../../../state/useSDKConfig'\nimport useEVMAccount from '../../../../hooks/accounts/useEVMAccount'\nimport { usePopups } from '../../../../state/popups/usePopups'\nimport useUserBonds from '../../../../state/bonds/useUserBonds'\nimport { getTimePeriods } from '../../../../utils/getTimePeriods'\nimport useModal from '../../../../hooks/useModal'\nimport { AbondModal, OabondModal, PmusdModal } from '../../../../components/CustomClaimModals'\nimport PostClaimModal from '../../../../components/CustomClaimModals/PostClaimModal'\n\nconst Actions = ({ userBill }: { userBill?: UserBill }) => {\n  // Hooks\n  const { switchChainAsync } = useSwitchChain()\n  const { data: liveBonds } = useBondsData()\n  const SDKConfig = useSDKConfig()\n  const chainId = useChainId()\n  const { writeContractAsync } = useWriteContract()\n  const { address: account } = useEVMAccount()\n  const { addToastError } = usePopups()\n  const { refetch: refetchUserBonds } = useUserBonds()\n\n  // State\n  const [claimTxHash, setClaimTxHash] = useState<string | null>(null)\n  const [loadingTx, setLoadingTx] = useState(false)\n  const { isLoading, isSuccess: isConfirmed } = useMonitorTx(claimTxHash, userBill?.bond?.chainId)\n\n  // Static Data\n  const load = loadingTx || (isLoading && !isConfirmed)\n  const similarLiveBond = liveBonds?.find(\n    (bond) =>\n      !bond?.soldOut &&\n      !bond?.hide &&\n      bond?.earnToken?.symbol?.toLowerCase() === userBill?.bond?.earnToken?.symbol?.toLowerCase(),\n  )\n  const canPurchaseAgain = !!similarLiveBond\n  const vestingCliff = userBill?.bond?.vestingCliff\n  const currentTime = Math.round(new Date().getTime() / 1000)\n  const purchaseTimestamp = parseInt(userBill?.vestingStartTimestamp ?? '0')\n  const isPendingCliff = vestingCliff ? currentTime - purchaseTimestamp < vestingCliff : false\n  const cliffCountdown = getTimePeriods(purchaseTimestamp + (vestingCliff ?? 0) - currentTime, true)\n\n  const handleClaim = async (billId?: string, billAddress?: string) => {\n    const address: `0x${string}` = billAddress as `0x${string}`\n    try {\n      setLoadingTx(true)\n      const tx = await writeContractAsync({\n        address: address,\n        abi: BOND_ABI,\n        functionName: 'redeem',\n        args: [billId],\n        chain: chainId as any,\n        account: account,\n      }).catch()\n\n      if (tx) {\n        setClaimTxHash(tx)\n        track({\n          event: 'bond',\n          chain: userBill?.bond?.chainId,\n          data: {\n            cat: 'claim',\n            bondType: userBill?.bond?.billType,\n            address: remove0xPrefix(userBill?.bond?.contractAddress?.[userBill?.bond?.chainId]),\n            earnToken: userBill?.bond?.earnToken.symbol,\n          },\n        })\n      }\n      setLoadingTx(false)\n    } catch (error: any) {\n      console.error('Claim Failed:', error)\n      setLoadingTx(false)\n      addToastError(error.message)\n      reportError({\n        apiUrl: SDKConfig?.urls?.apiV2,\n        error,\n        extraInfo: { type: 'redeem', userBill, error },\n        chainId,\n        account,\n      })\n    }\n  }\n\n  // Modals\n  const [openAbondModal] = useModal(<AbondModal />, true, false, 'abondModal')\n  const [openOabondModal] = useModal(<OabondModal />, true, false, 'oAbondModal')\n  const [openPmusdModal] = useModal(<PmusdModal />, true, false, 'pmUSDModal')\n  const [openPostClaimFlowModal] = useModal(\n    <PostClaimModal\n      tokenSymbol={userBill?.bond?.earnToken?.symbol!}\n      text={userBill?.bond?.postClaimFlow?.text!}\n      imgUrl={userBill?.bond?.postClaimFlow?.imgUrl!}\n      ctaUrl={userBill?.bond?.postClaimFlow?.ctaUrl!}\n    />,\n    true,\n    false,\n    'postClaimFlowModal',\n  )\n\n  useEffect(() => {\n    if (isConfirmed) {\n      refetchUserBonds()\n      if (userBill?.bond?.earnToken.symbol.toLowerCase() === 'abond') {\n        openAbondModal()\n      }\n      if (userBill?.bond?.earnToken.symbol.toLowerCase() === 'oabond') {\n        openOabondModal()\n      }\n      if (userBill?.bond?.earnToken.symbol.toLowerCase() === 'pmusd') {\n        openPmusdModal()\n      }\n      if (userBill?.bond?.postClaimFlow) {\n        openPostClaimFlowModal()\n      }\n    }\n    /* eslint-disable react-hooks/exhaustive-deps */\n  }, [isConfirmed])\n\n  return (\n    <>\n      <Button\n        variant=\"secondary\"\n        disabled={claimable(userBill) === 0 || load || !userBill || isPendingCliff}\n        load={load}\n        onClick={(event) => {\n          event.stopPropagation()\n          if (chainId !== userBill?.bond?.chainId) {\n            switchChainAsync({ chainId: userBill?.bond?.chainId! })\n              .then(() => {\n                handleClaim(userBill?.id, userBill?.address)\n              })\n              .catch()\n          } else {\n            handleClaim(userBill?.id, userBill?.address)\n          }\n        }}\n        sx={{ fontSize: '14px', width: '100%' }}\n      >\n        {isPendingCliff\n          ? `Claimable in ${cliffCountdown.days !== 0 ? `${cliffCountdown.days} days` : cliffCountdown.hours !== 0 ? `${cliffCountdown.hours} hours` : `${cliffCountdown.minutes} mins`}`\n          : 'Claim'}\n      </Button>\n      <Button\n        sx={{ fontSize: '14px', width: '100%' }}\n        onClick={() =>\n          canPurchaseAgain\n            ? (window.location.href = `/bonds?bondAddress=${similarLiveBond.contractAddress[similarLiveBond.chainId]}&bondChain=${similarLiveBond.chainId}`)\n            : null\n        }\n        disabled={!canPurchaseAgain}\n      >\n        {canPurchaseAgain ? 'Buy again' : 'sold out'}\n      </Button>\n    </>\n  )\n}\n\nexport default Actions\n"],"names":["_jsx","_jsxs","_Fragment"],"mappings":"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"}

package/dist/views/YourBondsModal/components/LinkShare/utils.js

@@ -1,4 +1,3 @@
-import axios from 'axios';
 import { APEBOND } from '../../../../config/constants/variables.js';
 import { getTemplateHTML } from './templateImageShare.js';
 import { imageUrlToDataUri, renderHtmlToJpeg } from './htmlToJpeg.js';
@@ -33,9 +32,12 @@ async function generateImageFromTemplate(bondNFTData, link, apiUrl) {
                 const blob = await response.blob();
                 const formData = new FormData();
                 formData.append('file', blob, fileName);
-                await axios.post(`${apiUrl}/cloudinary/uploadFile`, formData, {
-                    headers: { 'Content-Type': 'multipart/form-data' },
+                const uploadResponse = await fetch(`${apiUrl}/cloudinary/uploadFile`, {
+                    method: 'POST',
+                    body: formData,
                 });
+                if (!uploadResponse.ok)
+                    throw new Error(`Upload failed with status ${uploadResponse.status}`);
             }
             catch (error) {
                 console.error('Error upload file to cloudinary', error);
@@ -51,14 +53,13 @@ function share(link) {
     linkElement.click();
 }
 async function checkImageExists(fileName) {
-    let existImg = true;
     try {
-        await axios.get(`https://res.cloudinary.com/dswmrqgwy/image/upload/v1/bond_share/${fileName}.jpg`);
+        const response = await fetch(`https://res.cloudinary.com/dswmrqgwy/image/upload/v1/bond_share/${fileName}.jpg`);
+        return response.ok;
     }
     catch {
-        existImg = false;
+        return false;
     }
-    return existImg;
 }
 
 export { generateImageFromTemplate };

package/dist/views/YourBondsModal/components/LinkShare/utils.js.map

@@ -1 +1 @@
-{"version":3,"file":"utils.js","sources":["../../../../../src/views/YourBondsModal/components/LinkShare/utils.ts"],"sourcesContent":["import axios from 'axios'\nimport { APEBOND } from '../../../../config/constants/variables'\nimport { UserBillNftData } from '../../../../types/yourbonds'\nimport { getTemplateHTML } from './templateImageShare'\nimport { imageUrlToDataUri, renderHtmlToJpeg } from './htmlToJpeg'\n\nfunction getTokenImageUrl(symbol: string) {\n  return `${APEBOND}/tokenImages/${symbol.toUpperCase()}.png`\n}\n\nfunction getPrincipalTokenSymbol(bondNFTData: UserBillNftData) {\n  if (bondNFTData.data?.payoutTokenData.address.toLowerCase() !== bondNFTData.data?.token0.address.toLowerCase())\n    return bondNFTData.data?.token0.symbol\n  return bondNFTData.data?.token1.symbol\n}\n\nexport async function generateImageFromTemplate(\n  bondNFTData: UserBillNftData | undefined,\n  link: string,\n  apiUrl: string,\n) {\n  if (bondNFTData && bondNFTData.data) {\n    const fileName = `bond_share_${bondNFTData?.data.billNftAddress?.toLowerCase()}_${bondNFTData?.chainId}_${bondNFTData?.tokenId}`\n    const existingImage = await checkImageExists(fileName)\n    if (existingImage) {\n      share(link)\n    } else {\n      try {\n        const [title, background, nft, payoutToken, principalToken] = await Promise.all([\n          imageUrlToDataUri('/images/bills/title.png'),\n          imageUrlToDataUri('/images/bills/bg.png'),\n          imageUrlToDataUri(bondNFTData.image),\n          imageUrlToDataUri(getTokenImageUrl(bondNFTData.data.payoutTokenData.symbol)),\n          imageUrlToDataUri(getTokenImageUrl(getPrincipalTokenSymbol(bondNFTData) ?? '')),\n        ])\n\n        const html = getTemplateHTML(bondNFTData, { title, background, nft, payoutToken, principalToken })\n        const dataImage = await renderHtmlToJpeg(html, 768, 768, 0.85)\n        const response = await fetch(dataImage)\n        const blob = await response.blob()\n        const formData = new FormData()\n        formData.append('file', blob, fileName)\n        await axios.post(`${apiUrl}/cloudinary/uploadFile`, formData, {\n          headers: { 'Content-Type': 'multipart/form-data' },\n        })\n      } catch (error) {\n        console.error('Error upload file to cloudinary', error)\n      }\n      share(link)\n    }\n  }\n}\n\nfunction share(link: string) {\n  const linkElement = document.createElement('a')\n  linkElement.href = link\n  linkElement.target = '_blank'\n  linkElement.click()\n}\n\nasync function checkImageExists(fileName: string) {\n  let existImg = true\n  try {\n    await axios.get(`https://res.cloudinary.com/dswmrqgwy/image/upload/v1/bond_share/${fileName}.jpg`)\n  } catch {\n    existImg = false\n  }\n\n  return existImg\n}\n"],"names":[],"mappings":"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"}
+{"version":3,"file":"utils.js","sources":["../../../../../src/views/YourBondsModal/components/LinkShare/utils.ts"],"sourcesContent":["import { APEBOND } from '../../../../config/constants/variables'\nimport { UserBillNftData } from '../../../../types/yourbonds'\nimport { getTemplateHTML } from './templateImageShare'\nimport { imageUrlToDataUri, renderHtmlToJpeg } from './htmlToJpeg'\n\nfunction getTokenImageUrl(symbol: string) {\n  return `${APEBOND}/tokenImages/${symbol.toUpperCase()}.png`\n}\n\nfunction getPrincipalTokenSymbol(bondNFTData: UserBillNftData) {\n  if (bondNFTData.data?.payoutTokenData.address.toLowerCase() !== bondNFTData.data?.token0.address.toLowerCase())\n    return bondNFTData.data?.token0.symbol\n  return bondNFTData.data?.token1.symbol\n}\n\nexport async function generateImageFromTemplate(\n  bondNFTData: UserBillNftData | undefined,\n  link: string,\n  apiUrl: string,\n) {\n  if (bondNFTData && bondNFTData.data) {\n    const fileName = `bond_share_${bondNFTData?.data.billNftAddress?.toLowerCase()}_${bondNFTData?.chainId}_${bondNFTData?.tokenId}`\n    const existingImage = await checkImageExists(fileName)\n    if (existingImage) {\n      share(link)\n    } else {\n      try {\n        const [title, background, nft, payoutToken, principalToken] = await Promise.all([\n          imageUrlToDataUri('/images/bills/title.png'),\n          imageUrlToDataUri('/images/bills/bg.png'),\n          imageUrlToDataUri(bondNFTData.image),\n          imageUrlToDataUri(getTokenImageUrl(bondNFTData.data.payoutTokenData.symbol)),\n          imageUrlToDataUri(getTokenImageUrl(getPrincipalTokenSymbol(bondNFTData) ?? '')),\n        ])\n\n        const html = getTemplateHTML(bondNFTData, { title, background, nft, payoutToken, principalToken })\n        const dataImage = await renderHtmlToJpeg(html, 768, 768, 0.85)\n        const response = await fetch(dataImage)\n        const blob = await response.blob()\n        const formData = new FormData()\n        formData.append('file', blob, fileName)\n        const uploadResponse = await fetch(`${apiUrl}/cloudinary/uploadFile`, {\n          method: 'POST',\n          body: formData,\n        })\n        if (!uploadResponse.ok) throw new Error(`Upload failed with status ${uploadResponse.status}`)\n      } catch (error) {\n        console.error('Error upload file to cloudinary', error)\n      }\n      share(link)\n    }\n  }\n}\n\nfunction share(link: string) {\n  const linkElement = document.createElement('a')\n  linkElement.href = link\n  linkElement.target = '_blank'\n  linkElement.click()\n}\n\nasync function checkImageExists(fileName: string) {\n  try {\n    const response = await fetch(`https://res.cloudinary.com/dswmrqgwy/image/upload/v1/bond_share/${fileName}.jpg`)\n    return response.ok\n  } catch {\n    return false\n  }\n}\n"],"names":[],"mappings":"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"}

package/package.json

@@ -3,7 +3,7 @@
   "description": "Ape Bond SDK",
   "author": "Ape Bond",
   "license": "MIT",
-  "version": "6.2.8",
+  "version": "6.2.10",
   "module": "dist/main.js",
   "type": "module",
   "types": "dist/main.d.ts",
@@ -112,21 +112,18 @@
     "@solana/wallet-adapter-react": "^0.15.39",
     "@solana/web3.js": "^1.98.4",
     "@tanstack/react-query": "^5.90.2",
-    "axios": "^1.8.2",
     "react": ">=17",
     "react-dom": ">=17",
     "wagmi": ">=2"
   },
   "dependencies": {
-    "@ape.swap/apeswap-lists": "4.8.4",
+    "@ape.swap/apeswap-lists": "4.8.6",
     "@emotion/react": "11.14.0",
     "@jup-ag/api": "6.0.45",
     "buffer": "6.0.3",
-    "chart.js": "4.5.0",
     "framer-motion": "11.18.2",
     "lightweight-charts": "4.2.3",
     "lodash-es": "4.17.23",
-    "react-chartjs-2": "5.3.0",
     "swiper": "12.1.2",
     "theme-ui": "0.17.2"
   },
@@ -147,7 +144,6 @@
     "@types/react": "18.3.28",
     "@types/react-dom": "18.3.7",
     "@vitejs/plugin-react": "4.7.0",
-    "axios": "1.16.0",
     "eslint": "9.39.4",
     "eslint-plugin-react": "7.37.5",
     "eslint-plugin-react-hooks": "5.2.0",