From d1524b84d31160c396a93e7b8d61d56cd7f15dab Mon Sep 17 00:00:00 2001 From: victorAnumudu Date: Thu, 17 Apr 2025 13:19:53 +0100 Subject: [PATCH] removed unresolved packages --- src/components/CustomCounter.jsx | 7 +- src/components/home/HomeCom.jsx | 4 - src/components/home/Widget1.jsx | 352 +++++++++++++++---------------- src/components/home/Widget2.jsx | 272 ++++++++++++------------ src/helpers/formatNumber.js | 4 +- 5 files changed, 318 insertions(+), 321 deletions(-) diff --git a/src/components/CustomCounter.jsx b/src/components/CustomCounter.jsx index a9fa37d..1431b21 100644 --- a/src/components/CustomCounter.jsx +++ b/src/components/CustomCounter.jsx @@ -29,11 +29,12 @@ // export default CustomCounter; -import React from 'react'; -import CountUp from 'react-countup'; +// import React from 'react'; +// import CountUp from 'react-countup'; const CustomCounter = ({ targetNumber, timeInSeconds }) => { - return ; + // return ; + return targetNumber }; export default CustomCounter; \ No newline at end of file diff --git a/src/components/home/HomeCom.jsx b/src/components/home/HomeCom.jsx index 9f129b6..e6314f0 100644 --- a/src/components/home/HomeCom.jsx +++ b/src/components/home/HomeCom.jsx @@ -5,8 +5,6 @@ import CustomCounter from '../../components/CustomCounter' import Icons from '../../components/Icons' import TableWrapper from '../../components/tableWrapper/TableWrapper' import Avatar from '../../assets/user_avatar.jpg' -import { Widget1 } from './Widget1' -import { Widget2 } from './Widget2' import formatNumber from '../../helpers/formatNumber' import queryKeys from '../../services/queryKeys' @@ -37,7 +35,6 @@ export default function HomeCom() {

Loans

-
{/*

{dashData?.loans?.currency_text}

*/}

{dashData?.loans?.currency_text}

@@ -46,7 +43,6 @@ export default function HomeCom() {

Payments

- {/* */}

{dashData?.payments?.currency_text}

{dashData?.payments?.text}

diff --git a/src/components/home/Widget1.jsx b/src/components/home/Widget1.jsx index 6bf0882..caa7fd1 100644 --- a/src/components/home/Widget1.jsx +++ b/src/components/home/Widget1.jsx @@ -1,187 +1,187 @@ -import {useEffect, useRef} from 'react' -import ApexCharts from 'apexcharts' +// import {useEffect, useRef} from 'react' +// import ApexCharts from 'apexcharts' -const Widget1 = ({chartHeight='50px'}) => { - const chartRef = useRef(null) +// const Widget1 = ({chartHeight='50px'}) => { +// const chartRef = useRef(null) - const {mode} = '' // to be replaced by theme mode value later +// const {mode} = '' // to be replaced by theme mode value later - useEffect(() => { - const chart = refreshChart() +// useEffect(() => { +// const chart = refreshChart() - return () => { - if (chart) { - chart.destroy() - } - } - // eslint-disable-next-line react-hooks/exhaustive-deps - }, [chartRef, mode]) +// return () => { +// if (chart) { +// chart.destroy() +// } +// } +// // eslint-disable-next-line react-hooks/exhaustive-deps +// }, [chartRef, mode]) - const refreshChart = () => { - if (!chartRef.current) { - return - } +// const refreshChart = () => { +// if (!chartRef.current) { +// return +// } - const chart = new ApexCharts(chartRef.current, chartOptions(chartHeight)) - if (chart) { - chart.render() - } +// const chart = new ApexCharts(chartRef.current, chartOptions(chartHeight)) +// if (chart) { +// chart.render() +// } - return chart - } +// return chart +// } - return ( -
- {/* end::Title */} -
-
- ) -} +// return ( +//
+// {/* end::Title */} +//
+//
+// ) +// } -const chartOptions = (chartHeight) => { - // const labelColor = getCSSVariableValue('--bs-gray-800') - // const strokeColor = getCSSVariableValue('--bs-gray-300') - const labelColor = '#e9e9e9' - const strokeColor = '#e3e3e3' - // const strokeColor = getCSSVariableValue('--bs-gray-300') as string +// const chartOptions = (chartHeight) => { +// // const labelColor = getCSSVariableValue('--bs-gray-800') +// // const strokeColor = getCSSVariableValue('--bs-gray-300') +// const labelColor = '#e9e9e9' +// const strokeColor = '#e3e3e3' +// // const strokeColor = getCSSVariableValue('--bs-gray-300') as string - return { - series: [ - { - name: 'Loans', - data: [15, 25, 15, 40, 20, 50], - }, - ], - grid: { - show: false, - padding: { - top: 0, - bottom: 0, - left: 0, - right: 0, - }, - }, - chart: { - fontFamily: 'inherit', - type: 'area', - height: chartHeight, - toolbar: { - show: false, - }, - zoom: { - enabled: false, - }, - sparkline: { - enabled: true, - }, - }, - plotOptions: {}, - legend: { - show: false, - }, - dataLabels: { - enabled: false, - }, - fill: { - type: 'gradient', - gradient: { - opacityFrom: 0.4, - opacityTo: 0, - stops: [20, 120, 120, 120], - }, - }, - stroke: { - curve: 'smooth', - show: true, - width: 3, - colors: ['#FFFFFF'], - }, - xaxis: { - categories: ['Feb', 'Mar', 'Apr', 'May', 'Jun', 'Jul'], - axisBorder: { - show: false, - }, - axisTicks: { - show: false, - }, - labels: { - show: false, - style: { - colors: labelColor, - fontSize: '12px', - }, - }, - crosshairs: { - show: false, - position: 'front', - stroke: { - color: strokeColor, - width: 1, - dashArray: 3, - }, - }, - tooltip: { - enabled: true, - formatter: undefined, - offsetY: 0, - style: { - fontSize: '12px', - }, - }, - }, - yaxis: { - min: 0, - max: 60, - labels: { - show: false, - style: { - colors: labelColor, - fontSize: '12px', - }, - }, - }, - states: { - normal: { - filter: { - type: 'none', - value: 0, - }, - }, - hover: { - filter: { - type: 'none', - value: 0, - }, - }, - active: { - allowMultipleDataPointsSelection: false, - filter: { - type: 'none', - value: 0, - }, - }, - }, - tooltip: { - style: { - fontSize: '12px', - }, - y: { - formatter: function (val) { - return '$' + val + ' thousand' - }, - }, - }, - colors: ['#ffffff'], - markers: { - colors: [labelColor], - strokeColors: [strokeColor], - strokeWidth: 3, - }, - } -} +// return { +// series: [ +// { +// name: 'Loans', +// data: [15, 25, 15, 40, 20, 50], +// }, +// ], +// grid: { +// show: false, +// padding: { +// top: 0, +// bottom: 0, +// left: 0, +// right: 0, +// }, +// }, +// chart: { +// fontFamily: 'inherit', +// type: 'area', +// height: chartHeight, +// toolbar: { +// show: false, +// }, +// zoom: { +// enabled: false, +// }, +// sparkline: { +// enabled: true, +// }, +// }, +// plotOptions: {}, +// legend: { +// show: false, +// }, +// dataLabels: { +// enabled: false, +// }, +// fill: { +// type: 'gradient', +// gradient: { +// opacityFrom: 0.4, +// opacityTo: 0, +// stops: [20, 120, 120, 120], +// }, +// }, +// stroke: { +// curve: 'smooth', +// show: true, +// width: 3, +// colors: ['#FFFFFF'], +// }, +// xaxis: { +// categories: ['Feb', 'Mar', 'Apr', 'May', 'Jun', 'Jul'], +// axisBorder: { +// show: false, +// }, +// axisTicks: { +// show: false, +// }, +// labels: { +// show: false, +// style: { +// colors: labelColor, +// fontSize: '12px', +// }, +// }, +// crosshairs: { +// show: false, +// position: 'front', +// stroke: { +// color: strokeColor, +// width: 1, +// dashArray: 3, +// }, +// }, +// tooltip: { +// enabled: true, +// formatter: undefined, +// offsetY: 0, +// style: { +// fontSize: '12px', +// }, +// }, +// }, +// yaxis: { +// min: 0, +// max: 60, +// labels: { +// show: false, +// style: { +// colors: labelColor, +// fontSize: '12px', +// }, +// }, +// }, +// states: { +// normal: { +// filter: { +// type: 'none', +// value: 0, +// }, +// }, +// hover: { +// filter: { +// type: 'none', +// value: 0, +// }, +// }, +// active: { +// allowMultipleDataPointsSelection: false, +// filter: { +// type: 'none', +// value: 0, +// }, +// }, +// }, +// tooltip: { +// style: { +// fontSize: '12px', +// }, +// y: { +// formatter: function (val) { +// return '$' + val + ' thousand' +// }, +// }, +// }, +// colors: ['#ffffff'], +// markers: { +// colors: [labelColor], +// strokeColors: [strokeColor], +// strokeWidth: 3, +// }, +// } +// } -export {Widget1} +// export {Widget1} diff --git a/src/components/home/Widget2.jsx b/src/components/home/Widget2.jsx index fb17931..2c5e4fc 100644 --- a/src/components/home/Widget2.jsx +++ b/src/components/home/Widget2.jsx @@ -1,147 +1,147 @@ -import {useEffect, useRef} from 'react' -import ApexCharts from 'apexcharts' +// import {useEffect, useRef} from 'react' +// import ApexCharts from 'apexcharts' -const Widget2 = ({chartHeight='100px'}) => { - const chartRef = useRef(null) +// const Widget2 = ({chartHeight='100px'}) => { +// const chartRef = useRef(null) - const {mode} = '' // to be replaced by theme mode value later +// const {mode} = '' // to be replaced by theme mode value later - useEffect(() => { - const chart = refreshChart() +// useEffect(() => { +// const chart = refreshChart() - return () => { - if (chart) { - chart.destroy() - } - } - // eslint-disable-next-line react-hooks/exhaustive-deps - }, [chartRef, mode]) +// return () => { +// if (chart) { +// chart.destroy() +// } +// } +// // eslint-disable-next-line react-hooks/exhaustive-deps +// }, [chartRef, mode]) - const refreshChart = () => { - if (!chartRef.current) { - return - } +// const refreshChart = () => { +// if (!chartRef.current) { +// return +// } - const chart = new ApexCharts(chartRef.current, chartOptions(chartHeight)) - if (chart) { - chart.render() - } +// const chart = new ApexCharts(chartRef.current, chartOptions(chartHeight)) +// if (chart) { +// chart.render() +// } - return chart - } +// return chart +// } - return ( -
- {/* end::Title */} -
-
- ) -} +// return ( +//
+// {/* end::Title */} +//
+//
+// ) +// } -const chartOptions = (chartHeight) => { - // const labelColor = getCSSVariableValue('--bs-gray-800') +// const chartOptions = (chartHeight) => { +// // const labelColor = getCSSVariableValue('--bs-gray-800') - return { - series: [ - { - name: 'Payments', - data: [1, 2.1, 1, 2.1, 4.1, 6.1, 4.1, 4.1, 2.1, 4.1, 2.1, 3.1, 1, 1, 2.1], - }, - ], - chart: { - fontFamily: 'inherit', - height: chartHeight, - type: 'bar', - toolbar: { - show: false, - }, - }, - grid: { - show: false, - padding: { - top: 0, - bottom: 0, - left: 0, - right: 0, - }, - }, - colors: ['#ffffff'], - plotOptions: { - bar: { - borderRadius: 2.5, - dataLabels: { - position: 'top', // top, center, bottom - }, - columnWidth: '20%', - }, - }, - dataLabels: { - enabled: false, - formatter: function (val) { - return val + '%' - }, - offsetY: -20, - style: { - fontSize: '12px', - colors: ['#304758'], - }, - }, - xaxis: { - labels: { - show: false, - }, - categories: [ - 'Jan', - 'Feb', - 'Mar', - 'Apr', - 'May', - 'Jun', - 'Jul', - 'Aug', - 'Sep', - 'Oct', - 'Nov', - 'Dec', - 'Jan', - 'Feb', - 'Mar', - ], - position: 'top', - axisBorder: { - show: false, - }, - axisTicks: { - show: false, - }, - crosshairs: { - show: false, - }, - tooltip: { - enabled: false, - }, - }, - yaxis: { - show: false, - axisBorder: { - show: false, - }, - axisTicks: { - show: false, - // background: labelColor, - }, - labels: { - show: false, - formatter: function (val) { - return val + '%' - }, - }, - }, - } - } +// return { +// series: [ +// { +// name: 'Payments', +// data: [1, 2.1, 1, 2.1, 4.1, 6.1, 4.1, 4.1, 2.1, 4.1, 2.1, 3.1, 1, 1, 2.1], +// }, +// ], +// chart: { +// fontFamily: 'inherit', +// height: chartHeight, +// type: 'bar', +// toolbar: { +// show: false, +// }, +// }, +// grid: { +// show: false, +// padding: { +// top: 0, +// bottom: 0, +// left: 0, +// right: 0, +// }, +// }, +// colors: ['#ffffff'], +// plotOptions: { +// bar: { +// borderRadius: 2.5, +// dataLabels: { +// position: 'top', // top, center, bottom +// }, +// columnWidth: '20%', +// }, +// }, +// dataLabels: { +// enabled: false, +// formatter: function (val) { +// return val + '%' +// }, +// offsetY: -20, +// style: { +// fontSize: '12px', +// colors: ['#304758'], +// }, +// }, +// xaxis: { +// labels: { +// show: false, +// }, +// categories: [ +// 'Jan', +// 'Feb', +// 'Mar', +// 'Apr', +// 'May', +// 'Jun', +// 'Jul', +// 'Aug', +// 'Sep', +// 'Oct', +// 'Nov', +// 'Dec', +// 'Jan', +// 'Feb', +// 'Mar', +// ], +// position: 'top', +// axisBorder: { +// show: false, +// }, +// axisTicks: { +// show: false, +// }, +// crosshairs: { +// show: false, +// }, +// tooltip: { +// enabled: false, +// }, +// }, +// yaxis: { +// show: false, +// axisBorder: { +// show: false, +// }, +// axisTicks: { +// show: false, +// // background: labelColor, +// }, +// labels: { +// show: false, +// formatter: function (val) { +// return val + '%' +// }, +// }, +// }, +// } +// } -export {Widget2} +// export {Widget2} diff --git a/src/helpers/formatNumber.js b/src/helpers/formatNumber.js index c1b6c57..c0b5016 100644 --- a/src/helpers/formatNumber.js +++ b/src/helpers/formatNumber.js @@ -1,6 +1,6 @@ const formatNumber = (number = 0) => { - // return new Intl.NumberFormat().format(number); - return number.toFixed(2); + return new Intl.NumberFormat().format(number); + // return number.toFixed(2); }; export default formatNumber \ No newline at end of file -- 2.34.1