Skip to content

Commit 2c01148

Browse files
MaphikzaMaphikza
committed
Updating file name to transaction item styles
1 parent e94a9ee commit 2c01148

6 files changed

Lines changed: 7 additions & 540 deletions

File tree

‎src/components/relay-dashboard/totalEarning/TotalEarning.tsx‎

Lines changed: 0 additions & 376 deletions
Original file line numberDiff line numberDiff line change
@@ -80,379 +80,3 @@ export const TotalEarning: React.FC = () => {
8080
</NFTCard>
8181
);
8282
};
83-
84-
// import React, { useEffect, useMemo, useState } from 'react';
85-
// import { useTranslation } from 'react-i18next';
86-
// import { CaretDownOutlined, CaretUpOutlined } from '@ant-design/icons';
87-
// import { NFTCard } from '@app/components/relay-dashboard/common/NFTCard/NFTCard';
88-
// import { TotalEarningChart } from '@app/components/relay-dashboard/totalEarning/TotalEarningChart/TotalEarningChart';
89-
// import { useAppSelector } from '@app/hooks/reduxHooks';
90-
// import { getTotalEarning, TotalEarning as ITotalEarning } from '@app/api/earnings.api';
91-
// import { Dates } from '@app/constants/Dates';
92-
// import { formatNumberWithCommas, getCurrencyPrice } from '@app/utils/utils';
93-
// import { CurrencyTypeEnum } from '@app/interfaces/interfaces';
94-
// import * as S from './TotalEarning.styles';
95-
// import { BaseRow } from '@app/components/common/BaseRow/BaseRow';
96-
// import { BaseCol } from '@app/components/common/BaseCol/BaseCol';
97-
// import { useBitcoinRates } from '@app/hooks/useBitcoinRates';
98-
99-
// export const TotalEarning: React.FC = () => {
100-
// const { t } = useTranslation();
101-
// const [totalEarning, setTotalEarning] = useState<ITotalEarning | null>(null);
102-
// const { rates: bitcoinRates, isLoading, error } = useBitcoinRates();
103-
104-
// const userId = useAppSelector((state) => state.user.user?.id);
105-
106-
// useEffect(() => {
107-
// if (userId) {
108-
// getTotalEarning(userId, CurrencyTypeEnum.USD).then((res) => setTotalEarning(res));
109-
// }
110-
// }, [userId]);
111-
112-
// const { totalEarningData, days } = useMemo(() => {
113-
// const earningData = {
114-
// data: bitcoinRates.map((item) => item.usd_value),
115-
// };
116-
// const daysData = bitcoinRates.map((item) => Dates.getDate(item.date).format('L LTS'));
117-
118-
// return {
119-
// totalEarningData: earningData,
120-
// days: daysData,
121-
// };
122-
// }, [bitcoinRates]);
123-
124-
// const latestRate = bitcoinRates[bitcoinRates.length - 1]?.usd_value;
125-
// const previousRate = bitcoinRates[bitcoinRates.length - 2]?.usd_value;
126-
// const isIncreased = latestRate > previousRate;
127-
// const rateDifference = latestRate && previousRate ? ((latestRate - previousRate) / previousRate) * 100 : 0;
128-
129-
// if (isLoading) {
130-
// return <div>{t('common.loading')}</div>;
131-
// }
132-
133-
// if (error) {
134-
// return <div>{t('common.error')}: {error}</div>;
135-
// }
136-
137-
// return (
138-
// <BaseRow>
139-
// <BaseCol span={24}>
140-
// <S.Title level={2}>{t('nft.bitcoinPrice')}</S.Title>
141-
// </BaseCol>
142-
// <BaseCol span={24}>
143-
// <NFTCard isSider>
144-
// <BaseRow gutter={[14, 14]}>
145-
// <BaseCol span={24}>
146-
// <BaseRow wrap={false} justify="space-between">
147-
// <BaseCol>
148-
// <S.Title level={2}>{t('nft.bitcoinPrice')}</S.Title>
149-
// </BaseCol>
150-
// <BaseCol>
151-
// <S.ValueText $color={isIncreased ? 'success' : 'error'}>
152-
// {isIncreased ? <CaretUpOutlined /> : <CaretDownOutlined />}{' '}
153-
// {totalEarning && `${rateDifference.toFixed(2)}%`}
154-
// </S.ValueText>
155-
// </BaseCol>
156-
// </BaseRow>
157-
// </BaseCol>
158-
// <BaseCol span={24}>
159-
// <BaseRow wrap={false} justify="space-between" gutter={[20, 20]}>
160-
// <BaseCol>
161-
// <S.Text>{getCurrencyPrice(formatNumberWithCommas(latestRate ?? 0), CurrencyTypeEnum.USD)}</S.Text>
162-
// </BaseCol>
163-
// <BaseCol flex={1}>
164-
// <TotalEarningChart xAxisData={days} earningData={totalEarningData} />
165-
// </BaseCol>
166-
// </BaseRow>
167-
// </BaseCol>
168-
// </BaseRow>
169-
// </NFTCard>
170-
// </BaseCol>
171-
// </BaseRow>
172-
// );
173-
// };
174-
175-
// import React, { useEffect, useMemo, useState } from 'react';
176-
// import { useTranslation } from 'react-i18next';
177-
// import { CaretDownOutlined, CaretUpOutlined } from '@ant-design/icons';
178-
// import { NFTCard } from '@app/components/relay-dashboard/common/NFTCard/NFTCard';
179-
// import { TotalEarningChart } from '@app/components/relay-dashboard/totalEarning/TotalEarningChart/TotalEarningChart';
180-
// import { useAppSelector } from '@app/hooks/reduxHooks';
181-
// import {
182-
// getTotalEarning,
183-
// getBitcoinRatesForLast30Days,
184-
// TotalEarning as ITotalEarning,
185-
// Earning,
186-
// } from '@app/api/earnings.api';
187-
// import { Dates } from '@app/constants/Dates';
188-
// import { formatNumberWithCommas, getCurrencyPrice, getDifference } from '@app/utils/utils';
189-
// import { CurrencyTypeEnum } from '@app/interfaces/interfaces';
190-
// import * as S from './TotalEarning.styles';
191-
// import { BaseRow } from '@app/components/common/BaseRow/BaseRow';
192-
// import { BaseCol } from '@app/components/common/BaseCol/BaseCol';
193-
194-
// export const TotalEarning: React.FC = () => {
195-
// const [totalEarning, setTotalEarning] = useState<ITotalEarning | null>(null);
196-
// const [bitcoinRates, setBitcoinRates] = useState<Earning[]>([]);
197-
198-
// const userId = useAppSelector((state) => state.user.user?.id);
199-
200-
// const { t } = useTranslation();
201-
202-
// useEffect(() => {
203-
// if (userId) {
204-
// getTotalEarning(userId, CurrencyTypeEnum.USD).then((res) => setTotalEarning(res));
205-
// getBitcoinRatesForLast30Days().then((res) => {
206-
// console.log('Bitcoin rates:', res);
207-
// setBitcoinRates(res);
208-
// });
209-
// }
210-
// }, [userId]);
211-
212-
// const { totalEarningData, days } = useMemo(() => {
213-
// const earningData = {
214-
// data: bitcoinRates.map((item) => item.usd_value),
215-
// };
216-
// const daysData = bitcoinRates.map((item) => Dates.getDate(item.date).format('L LTS')); // Include time
217-
218-
// console.log('Chart data:', earningData);
219-
// console.log('Days:', daysData);
220-
221-
// return {
222-
// totalEarningData: earningData,
223-
// days: daysData,
224-
// };
225-
// }, [bitcoinRates]);
226-
227-
// // Determine if the current Bitcoin rate has increased compared to the previous rate
228-
// const latestRate = bitcoinRates[bitcoinRates.length - 1]?.usd_value;
229-
// const previousRate = bitcoinRates[bitcoinRates.length - 2]?.usd_value;
230-
// const isIncreased = latestRate > previousRate;
231-
// const rateDifference = latestRate && previousRate ? ((latestRate - previousRate) / previousRate) * 100 : 0;
232-
233-
// console.log(`latestRate: ${latestRate} previousRate: ${previousRate}`);
234-
// console.log(`Rate difference: ${rateDifference}`);
235-
236-
// return (
237-
// <NFTCard isSider>
238-
// <BaseRow gutter={[14, 14]}>
239-
// <BaseCol span={24}>
240-
// <BaseRow wrap={false} justify="space-between">
241-
// <BaseCol>
242-
// <S.Title level={2}>{t('nft.bitcoinPrice')}</S.Title>
243-
// </BaseCol>
244-
245-
// <BaseCol>
246-
// <S.ValueText $color={isIncreased ? 'success' : 'error'}>
247-
// {isIncreased ? <CaretUpOutlined /> : <CaretDownOutlined />}{' '}
248-
// {totalEarning && `${rateDifference.toFixed(2)}%`}
249-
// </S.ValueText>
250-
// </BaseCol>
251-
// </BaseRow>
252-
// </BaseCol>
253-
254-
// <BaseCol span={24}>
255-
// <S.Text>{getCurrencyPrice(formatNumberWithCommas(latestRate ?? 0), CurrencyTypeEnum.USD)}</S.Text>
256-
// </BaseCol>
257-
258-
// <BaseCol span={24}>
259-
// <BaseRow wrap={false} justify="space-between" gutter={[20, 20]}>
260-
// <BaseCol flex={1}>
261-
// <TotalEarningChart xAxisData={days} earningData={totalEarningData} />
262-
// </BaseCol>
263-
// </BaseRow>
264-
// </BaseCol>
265-
// </BaseRow>
266-
// </NFTCard>
267-
// );
268-
// };
269-
270-
// import React, { useEffect, useMemo, useState } from 'react';
271-
// import { useTranslation } from 'react-i18next';
272-
// import { CaretDownOutlined, CaretUpOutlined } from '@ant-design/icons';
273-
// import { NFTCard } from '@app/components/relay-dashboard/common/NFTCard/NFTCard';
274-
// import { TotalEarningChart } from '@app/components/relay-dashboard/totalEarning/TotalEarningChart/TotalEarningChart';
275-
// import { useAppSelector } from '@app/hooks/reduxHooks';
276-
// import {
277-
// getTotalEarning,
278-
// getBitcoinRatesForLast30Days,
279-
// TotalEarning as ITotalEarning,
280-
// Earning,
281-
// } from '@app/api/earnings.api';
282-
// import { Dates } from '@app/constants/Dates';
283-
// import { formatNumberWithCommas, getCurrencyPrice, getDifference } from '@app/utils/utils';
284-
// import { CurrencyTypeEnum } from '@app/interfaces/interfaces';
285-
// import * as S from './TotalEarning.styles';
286-
// import { BaseRow } from '@app/components/common/BaseRow/BaseRow';
287-
// import { BaseCol } from '@app/components/common/BaseCol/BaseCol';
288-
289-
// export const TotalEarning: React.FC = () => {
290-
// const [totalEarning, setTotalEarning] = useState<ITotalEarning | null>(null);
291-
// const [bitcoinRates, setBitcoinRates] = useState<Earning[]>([]);
292-
293-
// const userId = useAppSelector((state) => state.user.user?.id);
294-
295-
// const { t } = useTranslation();
296-
297-
// useEffect(() => {
298-
// if (userId) {
299-
// getTotalEarning(userId, CurrencyTypeEnum.USD).then((res) => setTotalEarning(res));
300-
// getBitcoinRatesForLast30Days().then((res) => {
301-
// console.log('Bitcoin rates:', res);
302-
// setBitcoinRates(res);
303-
// });
304-
// }
305-
// }, [userId]);
306-
307-
// const { totalEarningData, days } = useMemo(() => {
308-
// const earningData = {
309-
// data: bitcoinRates.map((item) => item.usd_value),
310-
// };
311-
// const daysData = bitcoinRates.map((item) => Dates.getDate(item.date).format('L LTS')); // Include time
312-
313-
// console.log('Chart data:', earningData);
314-
// console.log('Days:', daysData);
315-
316-
// return {
317-
// totalEarningData: earningData,
318-
// days: daysData,
319-
// };
320-
// }, [bitcoinRates]);
321-
322-
// // Determine if the current Bitcoin rate has increased compared to the previous rate
323-
// const latestRate = bitcoinRates[bitcoinRates.length - 1]?.usd_value;
324-
// const previousRate = bitcoinRates[bitcoinRates.length - 2]?.usd_value;
325-
// const isIncreased = latestRate > previousRate;
326-
// const rateDifference = latestRate && previousRate ? ((latestRate - previousRate) / previousRate) * 100 : 0;
327-
328-
// console.log(`latestRate: ${latestRate} previousRate: ${previousRate}`);
329-
// console.log(`Rate difference: ${rateDifference}`);
330-
331-
// return (
332-
// <NFTCard isSider>
333-
// <BaseRow gutter={[14, 14]}>
334-
// <BaseCol span={24}>
335-
// <BaseRow wrap={false} justify="space-between">
336-
// <BaseCol>
337-
// <S.Title level={2}>{t('nft.bitcoinPrice')}</S.Title>
338-
// </BaseCol>
339-
340-
// <BaseCol>
341-
// <S.ValueText $color={isIncreased ? 'success' : 'error'}>
342-
// {isIncreased ? <CaretUpOutlined /> : <CaretDownOutlined />}{' '}
343-
// {totalEarning && `${rateDifference.toFixed(2)}%`}
344-
// </S.ValueText>
345-
// </BaseCol>
346-
// </BaseRow>
347-
// </BaseCol>
348-
349-
// <BaseCol span={24}>
350-
// <BaseRow wrap={false} justify="space-between" gutter={[20, 20]}>
351-
// <BaseCol>
352-
// <S.Text>{getCurrencyPrice(formatNumberWithCommas(latestRate ?? 0), CurrencyTypeEnum.USD)}</S.Text>
353-
// </BaseCol>
354-
355-
// <BaseCol flex={1}>
356-
// <TotalEarningChart xAxisData={days} earningData={totalEarningData} />
357-
// </BaseCol>
358-
// </BaseRow>
359-
// </BaseCol>
360-
// </BaseRow>
361-
// </NFTCard>
362-
// );
363-
// };
364-
365-
// import React, { useEffect, useMemo, useState } from 'react';
366-
// import { useTranslation } from 'react-i18next';
367-
// import { CaretDownOutlined, CaretUpOutlined } from '@ant-design/icons';
368-
// import { NFTCard } from '@app/components/relay-dashboard/common/NFTCard/NFTCard';
369-
// import { TotalEarningChart } from '@app/components/relay-dashboard/totalEarning/TotalEarningChart/TotalEarningChart';
370-
// import { useAppSelector } from '@app/hooks/reduxHooks';
371-
// import {
372-
// getTotalEarning,
373-
// getBitcoinRatesForLast30Days,
374-
// TotalEarning as ITotalEarning,
375-
// Earning,
376-
// } from '@app/api/earnings.api';
377-
// import { Dates } from '@app/constants/Dates';
378-
// import { formatNumberWithCommas, getCurrencyPrice, getDifference } from '@app/utils/utils';
379-
// import { CurrencyTypeEnum } from '@app/interfaces/interfaces';
380-
// import * as S from './TotalEarning.styles';
381-
// import { BaseRow } from '@app/components/common/BaseRow/BaseRow';
382-
// import { BaseCol } from '@app/components/common/BaseCol/BaseCol';
383-
384-
// export const TotalEarning: React.FC = () => {
385-
// const [totalEarning, setTotalEarning] = useState<ITotalEarning | null>(null);
386-
// const [bitcoinRates, setBitcoinRates] = useState<Earning[]>([]);
387-
388-
// const userId = useAppSelector((state) => state.user.user?.id);
389-
390-
// const { t } = useTranslation();
391-
392-
// useEffect(() => {
393-
// if (userId) {
394-
// getTotalEarning(userId, CurrencyTypeEnum.USD).then((res) => setTotalEarning(res));
395-
// getBitcoinRatesForLast30Days().then((res) => {
396-
// console.log('Bitcoin rates:', res);
397-
// setBitcoinRates(res);
398-
// });
399-
// }
400-
// }, [userId]);
401-
402-
// const { totalEarningData, days } = useMemo(() => {
403-
// const earningData = {
404-
// data: bitcoinRates.map((item) => item.usd_value),
405-
// };
406-
// const daysData = bitcoinRates.map((item) => Dates.getDate(item.date).format('L LTS')); // Include time
407-
408-
// console.log('Chart data:', earningData);
409-
// console.log('Days:', daysData);
410-
411-
// return {
412-
// totalEarningData: earningData,
413-
// days: daysData,
414-
// };
415-
// }, [bitcoinRates]);
416-
417-
// // Determine if the current Bitcoin rate has increased compared to the previous rate
418-
// const latestRate = bitcoinRates[bitcoinRates.length - 1]?.usd_value;
419-
// const previousRate = bitcoinRates[bitcoinRates.length - 2]?.usd_value;
420-
// const isIncreased = latestRate > previousRate;
421-
// const rateDifference = latestRate && previousRate ? ((latestRate - previousRate) / previousRate) * 100 : 0;
422-
423-
// console.log(`latestRate: ${latestRate} previousRate: ${previousRate}`);
424-
// console.log(`Rate difference: ${rateDifference}`);
425-
426-
// return (
427-
// <NFTCard isSider>
428-
// <BaseRow gutter={[14, 14]}>
429-
// <BaseCol span={24}>
430-
// <BaseRow wrap={false} justify="space-between">
431-
// <BaseCol>
432-
// <S.Title level={2}>{t('nft.bitcoinPrice')}</S.Title>
433-
// </BaseCol>
434-
435-
// <BaseCol>
436-
// <S.ValueText $color={isIncreased ? 'success' : 'error'}>
437-
// {isIncreased ? <CaretUpOutlined /> : <CaretDownOutlined />}{' '}
438-
// {totalEarning && `${rateDifference.toFixed(2)}%`}
439-
// </S.ValueText>
440-
// </BaseCol>
441-
// </BaseRow>
442-
// </BaseCol>
443-
444-
// <BaseCol span={24}>
445-
// <BaseRow wrap={false} justify="space-between" gutter={[20, 20]}>
446-
// <BaseCol>
447-
// <S.Text>{getCurrencyPrice(formatNumberWithCommas(latestRate ?? 0), CurrencyTypeEnum.USD)}</S.Text>
448-
// </BaseCol>
449-
450-
// <BaseCol flex={1}>
451-
// <TotalEarningChart xAxisData={days} earningData={totalEarningData} />
452-
// </BaseCol>
453-
// </BaseRow>
454-
// </BaseCol>
455-
// </BaseRow>
456-
// </NFTCard>
457-
// );
458-
// };

0 commit comments

Comments
 (0)