diff --git a/package-lock.json b/package-lock.json
index 8452e76beb69650d74607f66b0955a2ad70e8418..85646d7e0aa4f12a7203680f260d5f260478045f 100644
--- a/package-lock.json
+++ b/package-lock.json
@@ -17,6 +17,7 @@
"react": "^18.2.0",
"react-bootstrap": "^2.10.2",
"react-chartjs-2": "^5.2.0",
+ "react-datepicker": "^6.6.0",
"react-dom": "^18.2.0",
"react-scripts": "5.0.1",
"web-vitals": "^2.1.4"
@@ -2381,6 +2382,54 @@
"node": "^12.22.0 || ^14.17.0 || >=16.0.0"
}
},
+ "node_modules/@floating-ui/core": {
+ "version": "1.6.0",
+ "resolved": "https://registry.npmjs.org/@floating-ui/core/-/core-1.6.0.tgz",
+ "integrity": "sha512-PcF++MykgmTj3CIyOQbKA/hDzOAiqI3mhuoN44WRCopIs1sgoDoU4oty4Jtqaj/y3oDU6fnVSm4QG0a3t5i0+g==",
+ "dependencies": {
+ "@floating-ui/utils": "^0.2.1"
+ }
+ },
+ "node_modules/@floating-ui/dom": {
+ "version": "1.6.3",
+ "resolved": "https://registry.npmjs.org/@floating-ui/dom/-/dom-1.6.3.tgz",
+ "integrity": "sha512-RnDthu3mzPlQ31Ss/BTwQ1zjzIhr3lk1gZB1OC56h/1vEtaXkESrOqL5fQVMfXpwGtRwX+YsZBdyHtJMQnkArw==",
+ "dependencies": {
+ "@floating-ui/core": "^1.0.0",
+ "@floating-ui/utils": "^0.2.0"
+ }
+ },
+ "node_modules/@floating-ui/react": {
+ "version": "0.26.10",
+ "resolved": "https://registry.npmjs.org/@floating-ui/react/-/react-0.26.10.tgz",
+ "integrity": "sha512-sh6f9gVvWQdEzLObrWbJ97c0clJObiALsFe0LiR/kb3tDRKwEhObASEH2QyfdoO/ZBPzwxa9j+nYFo+sqgbioA==",
+ "dependencies": {
+ "@floating-ui/react-dom": "^2.0.0",
+ "@floating-ui/utils": "^0.2.0",
+ "tabbable": "^6.0.0"
+ },
+ "peerDependencies": {
+ "react": ">=16.8.0",
+ "react-dom": ">=16.8.0"
+ }
+ },
+ "node_modules/@floating-ui/react-dom": {
+ "version": "2.0.8",
+ "resolved": "https://registry.npmjs.org/@floating-ui/react-dom/-/react-dom-2.0.8.tgz",
+ "integrity": "sha512-HOdqOt3R3OGeTKidaLvJKcgg75S6tibQ3Tif4eyd91QnIJWr0NLvoXFpJA/j8HqkFSL68GDca9AuyWEHlhyClw==",
+ "dependencies": {
+ "@floating-ui/dom": "^1.6.1"
+ },
+ "peerDependencies": {
+ "react": ">=16.8.0",
+ "react-dom": ">=16.8.0"
+ }
+ },
+ "node_modules/@floating-ui/utils": {
+ "version": "0.2.1",
+ "resolved": "https://registry.npmjs.org/@floating-ui/utils/-/utils-0.2.1.tgz",
+ "integrity": "sha512-9TANp6GPoMtYzQdt54kfAyMmz1+osLlXdg2ENroU7zzrtflTLrrC/lgrIfaSe+Wu0b89GKccT7vxXA0MoAIO+Q=="
+ },
"node_modules/@humanwhocodes/config-array": {
"version": "0.11.14",
"resolved": "https://registry.npmjs.org/@humanwhocodes/config-array/-/config-array-0.11.14.tgz",
@@ -6323,6 +6372,14 @@
"wrap-ansi": "^7.0.0"
}
},
+ "node_modules/clsx": {
+ "version": "2.1.0",
+ "resolved": "https://registry.npmjs.org/clsx/-/clsx-2.1.0.tgz",
+ "integrity": "sha512-m3iNNWpd9rl3jvvcBnu70ylMdrXt8Vlq4HYadnU5fwcOtvkSQWPmj7amUcDT2qYI7risszBjI5AUIUox9D16pg==",
+ "engines": {
+ "node": ">=6"
+ }
+ },
"node_modules/co": {
"version": "4.6.0",
"resolved": "https://registry.npmjs.org/co/-/co-4.6.0.tgz",
@@ -15132,6 +15189,22 @@
"react": "^16.8.0 || ^17.0.0 || ^18.0.0"
}
},
+ "node_modules/react-datepicker": {
+ "version": "6.6.0",
+ "resolved": "https://registry.npmjs.org/react-datepicker/-/react-datepicker-6.6.0.tgz",
+ "integrity": "sha512-ERC0/Q4pPC9bNIcGUpdCbHc+oCxhkU3WI3UOGHkyJ3A9fqALCYpEmLc5S5xvAd7DuCDdbsyW97oRPM6pWWwjww==",
+ "dependencies": {
+ "@floating-ui/react": "^0.26.2",
+ "clsx": "^2.1.0",
+ "date-fns": "^3.3.1",
+ "prop-types": "^15.7.2",
+ "react-onclickoutside": "^6.13.0"
+ },
+ "peerDependencies": {
+ "react": "^16.9.0 || ^17 || ^18",
+ "react-dom": "^16.9.0 || ^17 || ^18"
+ }
+ },
"node_modules/react-dev-utils": {
"version": "12.0.1",
"resolved": "https://registry.npmjs.org/react-dev-utils/-/react-dev-utils-12.0.1.tgz",
@@ -15276,6 +15349,19 @@
"resolved": "https://registry.npmjs.org/react-lifecycles-compat/-/react-lifecycles-compat-3.0.4.tgz",
"integrity": "sha512-fBASbA6LnOU9dOU2eW7aQ8xmYBSXUIWr+UmF9b1efZBazGNO+rcXT/icdKnYm2pTwcRylVUYwW7H1PHfLekVzA=="
},
+ "node_modules/react-onclickoutside": {
+ "version": "6.13.0",
+ "resolved": "https://registry.npmjs.org/react-onclickoutside/-/react-onclickoutside-6.13.0.tgz",
+ "integrity": "sha512-ty8So6tcUpIb+ZE+1HAhbLROvAIJYyJe/1vRrrcmW+jLsaM+/powDRqxzo6hSh9CuRZGSL1Q8mvcF5WRD93a0A==",
+ "funding": {
+ "type": "individual",
+ "url": "https://github.com/Pomax/react-onclickoutside/blob/master/FUNDING.md"
+ },
+ "peerDependencies": {
+ "react": "^15.5.x || ^16.x || ^17.x || ^18.x",
+ "react-dom": "^15.5.x || ^16.x || ^17.x || ^18.x"
+ }
+ },
"node_modules/react-refresh": {
"version": "0.11.0",
"resolved": "https://registry.npmjs.org/react-refresh/-/react-refresh-0.11.0.tgz",
@@ -16915,6 +17001,11 @@
"resolved": "https://registry.npmjs.org/symbol-tree/-/symbol-tree-3.2.4.tgz",
"integrity": "sha512-9QNk5KwDF+Bvz+PyObkmSYjI5ksVUYtjW7AU22r2NKcfLJcXp96hkDWU3+XndOsUb+AQ9QhfzfCT2O+CNWT5Tw=="
},
+ "node_modules/tabbable": {
+ "version": "6.2.0",
+ "resolved": "https://registry.npmjs.org/tabbable/-/tabbable-6.2.0.tgz",
+ "integrity": "sha512-Cat63mxsVJlzYvN51JmVXIgNoUokrIaT2zLclCXjRd8boZ0004U4KCs/sToJ75C6sdlByWxpYnb5Boif1VSFew=="
+ },
"node_modules/tailwindcss": {
"version": "3.4.1",
"resolved": "https://registry.npmjs.org/tailwindcss/-/tailwindcss-3.4.1.tgz",
@@ -20141,6 +20232,46 @@
"resolved": "https://registry.npmjs.org/@eslint/js/-/js-8.57.0.tgz",
"integrity": "sha512-Ys+3g2TaW7gADOJzPt83SJtCDhMjndcDMFVQ/Tj9iA1BfJzFKD9mAUXT3OenpuPHbI6P/myECxRJrofUsDx/5g=="
},
+ "@floating-ui/core": {
+ "version": "1.6.0",
+ "resolved": "https://registry.npmjs.org/@floating-ui/core/-/core-1.6.0.tgz",
+ "integrity": "sha512-PcF++MykgmTj3CIyOQbKA/hDzOAiqI3mhuoN44WRCopIs1sgoDoU4oty4Jtqaj/y3oDU6fnVSm4QG0a3t5i0+g==",
+ "requires": {
+ "@floating-ui/utils": "^0.2.1"
+ }
+ },
+ "@floating-ui/dom": {
+ "version": "1.6.3",
+ "resolved": "https://registry.npmjs.org/@floating-ui/dom/-/dom-1.6.3.tgz",
+ "integrity": "sha512-RnDthu3mzPlQ31Ss/BTwQ1zjzIhr3lk1gZB1OC56h/1vEtaXkESrOqL5fQVMfXpwGtRwX+YsZBdyHtJMQnkArw==",
+ "requires": {
+ "@floating-ui/core": "^1.0.0",
+ "@floating-ui/utils": "^0.2.0"
+ }
+ },
+ "@floating-ui/react": {
+ "version": "0.26.10",
+ "resolved": "https://registry.npmjs.org/@floating-ui/react/-/react-0.26.10.tgz",
+ "integrity": "sha512-sh6f9gVvWQdEzLObrWbJ97c0clJObiALsFe0LiR/kb3tDRKwEhObASEH2QyfdoO/ZBPzwxa9j+nYFo+sqgbioA==",
+ "requires": {
+ "@floating-ui/react-dom": "^2.0.0",
+ "@floating-ui/utils": "^0.2.0",
+ "tabbable": "^6.0.0"
+ }
+ },
+ "@floating-ui/react-dom": {
+ "version": "2.0.8",
+ "resolved": "https://registry.npmjs.org/@floating-ui/react-dom/-/react-dom-2.0.8.tgz",
+ "integrity": "sha512-HOdqOt3R3OGeTKidaLvJKcgg75S6tibQ3Tif4eyd91QnIJWr0NLvoXFpJA/j8HqkFSL68GDca9AuyWEHlhyClw==",
+ "requires": {
+ "@floating-ui/dom": "^1.6.1"
+ }
+ },
+ "@floating-ui/utils": {
+ "version": "0.2.1",
+ "resolved": "https://registry.npmjs.org/@floating-ui/utils/-/utils-0.2.1.tgz",
+ "integrity": "sha512-9TANp6GPoMtYzQdt54kfAyMmz1+osLlXdg2ENroU7zzrtflTLrrC/lgrIfaSe+Wu0b89GKccT7vxXA0MoAIO+Q=="
+ },
"@humanwhocodes/config-array": {
"version": "0.11.14",
"resolved": "https://registry.npmjs.org/@humanwhocodes/config-array/-/config-array-0.11.14.tgz",
@@ -23063,6 +23194,11 @@
"wrap-ansi": "^7.0.0"
}
},
+ "clsx": {
+ "version": "2.1.0",
+ "resolved": "https://registry.npmjs.org/clsx/-/clsx-2.1.0.tgz",
+ "integrity": "sha512-m3iNNWpd9rl3jvvcBnu70ylMdrXt8Vlq4HYadnU5fwcOtvkSQWPmj7amUcDT2qYI7risszBjI5AUIUox9D16pg=="
+ },
"co": {
"version": "4.6.0",
"resolved": "https://registry.npmjs.org/co/-/co-4.6.0.tgz",
@@ -29198,6 +29334,18 @@
"integrity": "sha512-98iN5aguJyVSxp5U3CblRLH67J8gkfyGNbiK3c+l1QI/G4irHMPQw44aEPmjVag+YKTyQ260NcF82GTQ3bdscA==",
"requires": {}
},
+ "react-datepicker": {
+ "version": "6.6.0",
+ "resolved": "https://registry.npmjs.org/react-datepicker/-/react-datepicker-6.6.0.tgz",
+ "integrity": "sha512-ERC0/Q4pPC9bNIcGUpdCbHc+oCxhkU3WI3UOGHkyJ3A9fqALCYpEmLc5S5xvAd7DuCDdbsyW97oRPM6pWWwjww==",
+ "requires": {
+ "@floating-ui/react": "^0.26.2",
+ "clsx": "^2.1.0",
+ "date-fns": "^3.3.1",
+ "prop-types": "^15.7.2",
+ "react-onclickoutside": "^6.13.0"
+ }
+ },
"react-dev-utils": {
"version": "12.0.1",
"resolved": "https://registry.npmjs.org/react-dev-utils/-/react-dev-utils-12.0.1.tgz",
@@ -29308,6 +29456,12 @@
"resolved": "https://registry.npmjs.org/react-lifecycles-compat/-/react-lifecycles-compat-3.0.4.tgz",
"integrity": "sha512-fBASbA6LnOU9dOU2eW7aQ8xmYBSXUIWr+UmF9b1efZBazGNO+rcXT/icdKnYm2pTwcRylVUYwW7H1PHfLekVzA=="
},
+ "react-onclickoutside": {
+ "version": "6.13.0",
+ "resolved": "https://registry.npmjs.org/react-onclickoutside/-/react-onclickoutside-6.13.0.tgz",
+ "integrity": "sha512-ty8So6tcUpIb+ZE+1HAhbLROvAIJYyJe/1vRrrcmW+jLsaM+/powDRqxzo6hSh9CuRZGSL1Q8mvcF5WRD93a0A==",
+ "requires": {}
+ },
"react-refresh": {
"version": "0.11.0",
"resolved": "https://registry.npmjs.org/react-refresh/-/react-refresh-0.11.0.tgz",
@@ -30519,6 +30673,11 @@
"resolved": "https://registry.npmjs.org/symbol-tree/-/symbol-tree-3.2.4.tgz",
"integrity": "sha512-9QNk5KwDF+Bvz+PyObkmSYjI5ksVUYtjW7AU22r2NKcfLJcXp96hkDWU3+XndOsUb+AQ9QhfzfCT2O+CNWT5Tw=="
},
+ "tabbable": {
+ "version": "6.2.0",
+ "resolved": "https://registry.npmjs.org/tabbable/-/tabbable-6.2.0.tgz",
+ "integrity": "sha512-Cat63mxsVJlzYvN51JmVXIgNoUokrIaT2zLclCXjRd8boZ0004U4KCs/sToJ75C6sdlByWxpYnb5Boif1VSFew=="
+ },
"tailwindcss": {
"version": "3.4.1",
"resolved": "https://registry.npmjs.org/tailwindcss/-/tailwindcss-3.4.1.tgz",
diff --git a/package.json b/package.json
index be784e3adf3ff3545a44dd992b1ae6c7b55a5edd..9c911c05cef98e7b4fda63507bdada6d108461f2 100644
--- a/package.json
+++ b/package.json
@@ -12,6 +12,7 @@
"react": "^18.2.0",
"react-bootstrap": "^2.10.2",
"react-chartjs-2": "^5.2.0",
+ "react-datepicker": "^6.6.0",
"react-dom": "^18.2.0",
"react-scripts": "5.0.1",
"web-vitals": "^2.1.4"
diff --git a/src/component/DAOLineChart.js b/src/component/DAOLineChart.js
index f47cc2d2c57c9f77d5207203bb3df40dbcb72d10..65dc21db8f240595b73d23bfea1e8cd1d33ffdf7 100644
--- a/src/component/DAOLineChart.js
+++ b/src/component/DAOLineChart.js
@@ -28,6 +28,8 @@ function DAOLineChart(title, apiData, day) {
const data = labels.map(label => apiData[label] || 0);
+ console.log(data, labels, apiData)
+
const datas = {
labels,
datasets: [
diff --git a/src/component/Dashboard.js b/src/component/Dashboard.js
index 5082a2f2c351877c71d6034b2a3ccb958d0b654c..fd713081d4891bf346b8679d64c9854f3ebfd8b4 100644
--- a/src/component/Dashboard.js
+++ b/src/component/Dashboard.js
@@ -4,6 +4,9 @@ import PieChart from "./PieChart"
import VoteBarChart from "./VoteBarGraph"
import { ButtonGroup, Dropdown, DropdownButton } from 'react-bootstrap';
import { generateData, generatePieData} from "./FalseDataGenerator";
+import DatePicker from "react-datepicker";
+import "react-datepicker/dist/react-datepicker.css";
+import { setDate } from "date-fns";
const DashBoard = () => {
const [line, setLine] = useState('')
@@ -11,6 +14,8 @@ const DashBoard = () => {
const [pie, setPie] = useState('')
const [association, setAssociation] = useState([])
const [currentAsso, setCurrentAsso] = useState('')
+ const [currentPropo, setCurrentPropo] = useState('')
+ const [startDate, setStartDate] = useState(new Date());
const url = [ 'https://api.ghostnet.tzkt.io/v1/contracts/KT1QTwmF2eptKss2FWbT1rHP5wCERL16kihQ/storage',
'https://api.ghostnet.tzkt.io/v1/contracts/KT1ACcRhzuDzVKpwzjZTudcQchEijvj7b7cp/views/listAllAssociations',
@@ -52,12 +57,25 @@ const DashBoard = () => {
setBar(VoteBarChart('Nombre de propositions soumises au vote sur un mois glissant', asso.barData, "01/01/24"))
setPie('')
setCurrentAsso(asso)
+ }
+ const setDataDate = (date) => {
+ setStartDate(date)
+ let day = date.getDate()
+ if (day < 10) day = '0' + day
+ let month = date.getMonth() + 1
+ if (month < 10) month = '0' + month
+ let year = date.getFullYear() - 2000
+ const fullDate = day + '/' + month + '/' + year
+ console.log(fullDate)
+ setLine(DAOLineChart('Nombre de DAO token achetés sur un mois glissant', generateData(fullDate, 1000), fullDate))
+ setBar(VoteBarChart('Nombre de propositions soumises au vote sur un mois glissant', generateData(fullDate, 20), fullDate))
}
const setPieData = (propositions, propoName) => {
const proposition = propositions.find(propo => propo.nom === propoName)
- setPie(PieChart('Taux de yay, nay ou pass pour chaque proposition', proposition.pieData))
+ setPie(PieChart('Taux de yay, nay ou pass pour la proposition', proposition.pieData))
+ setCurrentPropo(proposition)
}
useEffect(() => {
@@ -83,7 +101,6 @@ const DashBoard = () => {
const showProposition = (propositions) => {
const result = []
for (let index in propositions){
- console.log(propositions[index])
const eventKey = `${propositions[index].nom}`
const label = `${propositions[index].nom}`
result.push(
@@ -97,9 +114,11 @@ const DashBoard = () => {
return (<>
<p>Liste des Associations</p>
+ {currentAsso && <p>Association actuelle: {currentAsso.nom}</p>}
<DropdownButton as={ButtonGroup} title="Pour l'association" id='association'>
{showAssociation()}
</DropdownButton>
+ {currentAsso && <DatePicker selected={startDate} onChange={(date) => setDataDate(date)} />}
<div className="d-flex justify-content-center align-items-center">
{line}
{bar}
@@ -107,6 +126,7 @@ const DashBoard = () => {
{(line !== '' & bar !== '') &&
<>
<p>Liste des propositions</p>
+ {currentPropo && <p>Proposition actuelle: {currentPropo.nom}</p>}
<DropdownButton as={ButtonGroup} title="Pour la proposition" id='proposition'>
{showProposition(currentAsso.propositions)}
</DropdownButton>