Merge pull request #2249 from hollaex/develop

Develop
hollaex · Jul 7, 2023 · ebba6f4 · ebba6f4
2 parents 5bd0dca + 2b27129
commit ebba6f4
Show file tree

Hide file tree

Showing 4 changed files with 115 additions and 84 deletions.
diff --git a/web/src/containers/Admin/AdminFinancials/Balances.js b/web/src/containers/Admin/AdminFinancials/Balances.js
@@ -1,57 +1,54 @@
-import React, { useEffect, useState } from 'react';
-import { message, Table, Button, Spin } from 'antd';
-import { requestUserBalancesDownload } from '../User/actions';
+import React, { useState } from 'react';
 import MultiFilter from './TableFilter';
 import { getExchangeBalances } from './action';
-import { Link } from 'react-router';
 
-const columns = [
-	{
-		title: 'User Id',
-		dataIndex: 'user_id',
-		key: 'user_id',
-		render: (user_id, data) => {
-			return (
-				<div className="d-flex">
-					<Button className="ant-btn green-btn ant-tooltip-open ant-btn-primary">
-						<Link to={`/admin/user?id=${data.User.id}`}>
-							{data.User.id}
-						</Link>
-					</Button>
-				</div>
-			);
-		},
-	},
-	{
-		title: 'Currency',
-		dataIndex: 'symbol',
-		key: 'symbol',
-	},
-	{
-		title: 'Available Balance',
-		dataIndex: 'available',
-		key: 'available',
-		render: (available, data) => {
-			return (
-				<div>
-					{parseFloat(data.available)}
-				</div>
-			);
-		},
-	},
-	{
-		title: 'Total Balance',
-		dataIndex: 'balance',
-		key: 'balance',
-		render: (balance, data) => {
-			return (
-				<div>
-					{parseFloat(data.balance)}
-				</div>
-			);
-		},
-	},
-];
+// const columns = [
+// 	{
+// 		title: 'User Id',
+// 		dataIndex: 'user_id',
+// 		key: 'user_id',
+// 		render: (user_id, data) => {
+// 			return (
+// 				<div className="d-flex">
+// 					<Button className="ant-btn green-btn ant-tooltip-open ant-btn-primary">
+// 						<Link to={`/admin/user?id=${data.User.id}`}>
+// 							{data.User.id}
+// 						</Link>
+// 					</Button>
+// 				</div>
+// 			);
+// 		},
+// 	},
+// 	{
+// 		title: 'Currency',
+// 		dataIndex: 'symbol',
+// 		key: 'symbol',
+// 	},
+// 	{
+// 		title: 'Available Balance',
+// 		dataIndex: 'available',
+// 		key: 'available',
+// 		render: (available, data) => {
+// 			return (
+// 				<div>
+// 					{parseFloat(data.available)}
+// 				</div>
+// 			);
+// 		},
+// 	},
+// 	{
+// 		title: 'Total Balance',
+// 		dataIndex: 'balance',
+// 		key: 'balance',
+// 		render: (balance, data) => {
+// 			return (
+// 				<div>
+// 					{parseFloat(data.balance)}
+// 				</div>
+// 			);
+// 		},
+// 	},
+// ];
 
 const filterFields = [
 	{
@@ -85,46 +82,37 @@ const filterOptions = [
 ];
 
 const Balances = () => {
-	const [userData, setUserData] = useState([]);
 	const [isLoading, setIsLoading] = useState(false);
 
-	useEffect(() => {
-		setIsLoading(true);
-		getBalances();
-	}, []);
+	// useEffect(() => {
+	// 	setIsLoading(true);
+	// 	getBalances();
+	// }, []);
 
-	const getBalances = async (values = {}) => {
-		try {
-			const res = await getExchangeBalances(values);
-			if (res && res.data) {
-				setUserData(res.data);
-				setIsLoading(false);
-			}
-		} catch (error) {
-			message.error(error.data.message);
-			setIsLoading(false);
-		}
-	};
 
-	const requestDownload = (params = {}) => {
-		return requestUserBalancesDownload({ ...params, format: 'all' });
+	const requestDownload = (fieldValues = {}) => {
+		return getExchangeBalances({ ...fieldValues, format: 'all' });
 	};
 
 	return (
 		<div className="asset-exchange-wallet-wrapper">
 			<div className="header-txt">Exchange balances</div>
+			<div style={{ color: '#ccc', marginTop: 5 }}>In this section you can download all current balances of the users. Apply the filters and click download to proceed. Please note that this function could take some time to complete. </div>
 			<div className="wallet-filter-wrapper mt-4">
 				<MultiFilter
 					fields={filterFields}
 					filterOptions={filterOptions}
-					onHandle={getBalances}
+					onHandle={() => {}}
 					setIsLoading={setIsLoading}
 					isLoading={isLoading}
+					buttonText={'Download'}
+					alwaysEnabled = {true}
+					onDownload={requestDownload}
 				/>
 			</div>
-			<div className="mt-5">
+			{/* <div className="mt-5">
 				<span
-					onClick={requestDownload}
+					onClick={() => { requestDownload(); }}
 					className="mb-2 underline-text cursor-pointer"
 				>
 					Download below CSV table
@@ -134,7 +122,7 @@ const Balances = () => {
 						<Table columns={columns} dataSource={userData} />
 					</Spin>
 				</div>
-			</div>
+			</div> */}
 		</div>
 	);
 };

diff --git a/web/src/containers/Admin/AdminFinancials/TableFilter.js b/web/src/containers/Admin/AdminFinancials/TableFilter.js
@@ -134,6 +134,9 @@ const MultiFilter = ({
 	coins,
 	setIsLoading,
 	isLoading,
+	buttonText = null,
+	alwaysEnabled = false,
+	onDownload = null
 }) => {
 	const [options, setOptions] = useState(filterOptions);
 	const [fieldsData, setFieldsData] = useState([]);
@@ -232,7 +235,8 @@ const MultiFilter = ({
 				obj = { ...obj, [name]: filterData[name] };
 			}
 		});
-		onHandle(obj);
+		if (!onDownload) onHandle(obj);
+		else onDownload(obj);
 	};
 
 	return (
@@ -270,15 +274,16 @@ const MultiFilter = ({
 						: 'filter-button green-btn'
 				}
 				disabled={
-					isLoading ||
+					!alwaysEnabled && 
+					(isLoading ||
 					Object.keys(filterData).length === 0 ||
 					!Object.values(filterData)
 						.map((field) => field === '')
-						.filter((item) => !item)?.length
+						.filter((item) => !item)?.length)
 				}
 				onClick={onHandleSearch}
 			>
-				Search
+				{buttonText || 'Search'}
 			</Button>
 		</div>
 	);

diff --git a/web/src/containers/Admin/AdminFinancials/Wallet.js b/web/src/containers/Admin/AdminFinancials/Wallet.js
@@ -1,8 +1,7 @@
 import React, { useEffect, useState } from 'react';
 import { message, Table, Button, Spin } from 'antd';
-import { requestUsersDownload } from '../User/actions';
 import MultiFilter from './TableFilter';
-import { getExchangeWallet } from './action';
+import { getExchangeWallet, getExchangeWalletCsv } from './action';
 
 const columns = [
 	{
@@ -106,6 +105,7 @@ const filterOptions = [
 const Wallet = () => {
 	const [userData, setUserData] = useState([]);
 	const [isLoading, setIsLoading] = useState(false);
+	const [queryValues, setQueryValues] = useState({});
 
 	useEffect(() => {
 		setIsLoading(true);
@@ -114,6 +114,7 @@ const Wallet = () => {
 
 	const getWallet = async (values = {}) => {
 		try {
+			setQueryValues(values);
 			const res = await getExchangeWallet(values);
 			if (res && res.data) {
 				setUserData(res.data);
@@ -125,8 +126,8 @@ const Wallet = () => {
 		}
 	};
 
-	const requestDownload = (params = {}) => {
-		return requestUsersDownload({ ...params, format: 'csv' });
+	const requestDownload = () => {
+		return getExchangeWalletCsv({ ...queryValues, format: 'csv' });
 	};
 
 	return (
@@ -143,7 +144,7 @@ const Wallet = () => {
 			</div>
 			<div className="mt-5">
 				<span
-					onClick={requestDownload}
+					onClick={(e) => { requestDownload(); }}
 					className="mb-2 underline-text cursor-pointer"
 				>
 					Download below CSV table

diff --git a/web/src/containers/Admin/AdminFinancials/action.js b/web/src/containers/Admin/AdminFinancials/action.js
@@ -2,6 +2,7 @@ import axios from 'axios';
 import { HOLLAEX_NETWORK_API_URL } from 'config';
 import querystring from 'query-string';
 import { requestAuthenticated, requestDashAuthenticated } from 'utils';
+import moment from 'moment';
 
 export const storeMint = (values) => {
 	const options = {
@@ -123,8 +124,44 @@ export const getExchangeWallet = (values) => {
 	return requestAuthenticated(`/admin/user/wallet?${queryValues}`);
 };
 
+export const getExchangeWalletCsv = (values) => {
+	const queryValues =
+		values && Object.keys(values).length ? querystring.stringify(values) : '';
+	return axios({
+		method: 'GET',
+		url: `/admin/user/wallet?${queryValues}`,
+		})
+		.then((res) => {
+			const url = window.URL.createObjectURL(new Blob([res.data]));
+			const link = document.createElement('a');
+			link.href = url;
+			link.setAttribute(
+				'download',
+				`wallets_${moment().format('YYYY-MM-DD')}.csv`
+			);
+			document.body.appendChild(link);
+			link.click();
+		})
+		.catch((err) => {});
+};
+
 export const getExchangeBalances = (values) => {
 	const queryValues =
 		values && Object.keys(values).length ? querystring.stringify(values) : '';
-	return requestAuthenticated(`/admin/balances?${queryValues}`);
+	return axios({
+		method: 'GET',
+		url: `/admin/balances?${queryValues}`,
+		})
+		.then((res) => {
+			const url = window.URL.createObjectURL(new Blob([res.data]));
+			const link = document.createElement('a');
+			link.href = url;
+			link.setAttribute(
+				'download',
+				`balances_${moment().format('YYYY-MM-DD')}.csv`
+			);
+			document.body.appendChild(link);
+			link.click();
+		})
+		.catch((err) => {});
 };