diff --git a/package.json b/package.json index 729c7f4..910d0d6 100644 --- a/package.json +++ b/package.json @@ -7,6 +7,7 @@ "@testing-library/react": "^12.1.2", "@testing-library/user-event": "^13.5.0", "react": "^17.0.2", + "react-csv-reader": "^3.4.0", "react-dom": "^17.0.2", "react-scripts": "5.0.0", "web-vitals": "^2.1.2" diff --git a/src/App.css b/src/App.css index 74b5e05..29c2fa5 100644 --- a/src/App.css +++ b/src/App.css @@ -1,5 +1,6 @@ .App { text-align: center; + font-size: xx-small; } .App-logo { @@ -20,7 +21,7 @@ flex-direction: column; align-items: center; justify-content: center; - font-size: calc(10px + 2vmin); + font-size: calc(8px + 1vmin); color: white; } diff --git a/src/App.js b/src/App.js index 3784575..6594476 100644 --- a/src/App.js +++ b/src/App.js @@ -1,22 +1,37 @@ import logo from './logo.svg'; import './App.css'; +import Table from './Table.js'; +import CSVReader from 'react-csv-reader' +import { useState } from 'react'; +import { transactionPrices, calculateTotal , filterMultiples } from './filter.js'; function App() { + let [dataSet, setDataSet] = useState([]); + let [tableSet, setTableSet] = useState([]); + let [tableHeaders, setTableHeaders] = useState([]); + let [pricesSet, setPricesSet] = useState([]); + let [total, setTotal] = useState(0); + + function importCSV(data) { + setDataSet(data); + setTableHeaders(data.shift()); + setTableSet(data); + setTotal(calculateTotal(data)); + setPricesSet(Object.entries(filterMultiples(transactionPrices(data)))); + //setPricesSet(Object.entries(transactionPrices(data))); + } + return (
- logo

- Edit src/App.js and save to reload. + Import a .csv file using the button below

- - Learn React - + +

Total : {total} eur

+

Volume of transactions at different prices (Verified transactions only)

+ +
); diff --git a/src/Table.js b/src/Table.js new file mode 100644 index 0000000..0f9bcc9 --- /dev/null +++ b/src/Table.js @@ -0,0 +1,15 @@ +import { useState } from 'react'; + +function Entry({strings}) { + return {strings.map((string, index) => )}; +} + +function Headers({strings}) { + return {strings.map((string) => )}; +} + +function Table({headers, rows=[]}) { + return
{string}
{string}
{rows.map((row, index) => )}
; +} + +export default Table; diff --git a/src/filter.js b/src/filter.js new file mode 100644 index 0000000..733519e --- /dev/null +++ b/src/filter.js @@ -0,0 +1,41 @@ +export function transactionPrices(data, filterOK=true) { + let transactionPrices = {}; + data.forEach((transaction) => { + const price = Number(transaction[3].replace(',','.')); + if (!filterOK || transaction[7] === "OK") + transactionPrices[price] = transactionPrices[price] ? transactionPrices[price] + 1 : 1; + }); + return transactionPrices; +} + +export function calculateTotal(data, filterOK=true) { + let total = 0; + data.forEach((transaction) => { + const price = Number(transaction[3].replace(',','.')); + if (!filterOK || transaction[7] === "OK") + total += price; + }); + return total; +} + +export function filterMultiples(prices, multiples=[3.5]) { + let sales = {}; + Object.entries(prices).forEach((pair) => { + const price = Number(pair[0]); + const amount = pair[1]; + let dealt = false; // Ugly loop exit + //console.log(price,amount); + for (let i in multiples) { + let multiple = multiples[i]; + if (price % multiple === 0) { + const quantity = price/multiple*amount; + sales[multiple] = sales[multiple] ? sales[multiple] + quantity : quantity; + dealt = true; + break; + } + } + if (!dealt) sales[price] = sales[price] ? sales[price] + 1 : 1 ; + }); + console.log(multiples); + return sales; +} diff --git a/src/index.css b/src/index.css index ec2585e..b1dc87f 100644 --- a/src/index.css +++ b/src/index.css @@ -1,4 +1,5 @@ body { + font-size: xx-small; margin: 0; font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', 'Roboto', 'Oxygen', 'Ubuntu', 'Cantarell', 'Fira Sans', 'Droid Sans', 'Helvetica Neue',