fixed btach parsing

chronologic · Nov 7, 2023 · e4dc01b · e4dc01b
1 parent 0146c30
commit e4dc01b
Show file tree

Hide file tree

Showing 5 changed files with 37 additions and 6 deletions.
diff --git a/src/components/BatchTx/BatchCsv.tsx b/src/components/BatchTx/BatchCsv.tsx
@@ -3,11 +3,13 @@ import { Input, Typography } from 'antd';
 import styled from 'styled-components';
 
 import { useBatchParser } from './useBatchParser';
+import { useBatchConfig } from './useBatchConfig';
 
 const { TextArea } = Input;
 
 function BatchCsv() {
   const { rawInput, setRawInput } = useBatchParser();
+  const { selectedDelimiter } = useBatchConfig();
 
   const handleChange = useCallback(
     (e) => {
@@ -18,7 +20,7 @@ function BatchCsv() {
 
   return (
     <Container>
-      <Typography.Title level={4}>Paste CSV data</Typography.Title>
+      <Typography.Title level={4}>Paste {selectedDelimiter?.fileType || ''} data</Typography.Title>
       <TextArea rows={5} placeholder="Paste transactions here" value={rawInput} onChange={handleChange} />
     </Container>
   );

diff --git a/src/components/BatchTx/BatchPreview.tsx b/src/components/BatchTx/BatchPreview.tsx
@@ -10,17 +10,27 @@ function BatchPreview() {
   const { parsedTxs } = useBatchParser();
 
   const tableColumns = useMemo(() => {
-    return selectedColumns.map((col) => ({
+    const dynamicCols = selectedColumns.map((col) => ({
       title: col.label,
       key: col.name,
       dataIndex: col.name,
       render: (field: IParsedColumn) => <span>{field?.formattedValue}</span>,
     }));
+    const allCols = [
+      {
+        title: 'ID',
+        key: 'id',
+        dataIndex: 'id',
+      },
+      ...dynamicCols,
+    ];
+    return allCols;
   }, [selectedColumns]);
 
   const rowsWithKey = useMemo(() => {
     return parsedTxs.map((row, index) => ({
       key: index,
+      id: index + 1,
       ...row,
     }));
   }, [parsedTxs]);

diff --git a/src/components/BatchTx/BatchTotalAmount.tsx b/src/components/BatchTx/BatchTotalAmount.tsx
@@ -28,13 +28,22 @@ function BatchTotalAmount() {
 
   return (
     <Container>
-      <Typography.Title level={4}>
-        Total Amount: {utils.formatUnits(totalAmount, decimals)} {assetType}
+      <Typography.Title level={4} className="title">
+        Total{' '}
+        <b>
+          {utils.formatUnits(totalAmount, decimals)} {assetType}
+        </b>{' '}
+        in <b>{parsedTxs.length}</b> txs
       </Typography.Title>
     </Container>
   );
 }
 
-const Container = styled.div``;
+const Container = styled.div`
+  .title {
+    font-weight: normal;
+    text-align: left;
+  }
+`;
 
 export default BatchTotalAmount;
diff --git a/src/components/BatchTx/useBatchConfig.tsx b/src/components/BatchTx/useBatchConfig.tsx
@@ -30,6 +30,7 @@ interface IBatchDelimiterConfig {
   name: BatchDelimiter;
   label: string;
   symbol: string;
+  fileType: string;
 }
 
 const batchNetworks: {
@@ -92,11 +93,13 @@ const batchDelimiters: {
     name: 'tab',
     label: 'Tab',
     symbol: '\t',
+    fileType: 'TSV',
   },
   comma: {
     name: 'comma',
     label: 'Comma',
     symbol: ',',
+    fileType: 'CSV',
   },
 };
 

diff --git a/src/components/BatchTx/useBatchParser.ts b/src/components/BatchTx/useBatchParser.ts
@@ -44,7 +44,14 @@ const useBatchParser = (): IBatchParserHook => {
   const state = useBatchParserStore();
   const { columns, selectedColumns, selectedDelimiter, selectedAsset, isValidConfig } = useBatchConfig();
 
-  const setRawInput = useCallback((rawInput: string) => useBatchParserStore.setState({ rawInput }), []);
+  const setRawInput = useCallback((input: string) => {
+    const rawInput = input
+      .split('\n')
+      .map((row) => row.trim())
+      .filter(Boolean)
+      .join('\n');
+    useBatchParserStore.setState({ rawInput });
+  }, []);
 
   useEffect(() => {
     if (!isValidConfig || !state.rawInput) {