Thread: [pgAdmin][RM3904] Replace charting library Flotr2 with ChartJS using React
[pgAdmin][RM3904] Replace charting library Flotr2 with ChartJS using React
From
Aditya Toshniwal
Date:
Hi Hackers,
Attached is the patch to:
1) Replace the chart library with Chart.js + ReactJS.
2) Add support for ReactJS in pgAdmin with webpack, package.json, linter and other changes.
3) Add support for testing React components with jasmine test cases. Test cases added.
Please review.
Thanks,
Aditya Toshniwal
pgAdmin hacker | Sr. Software Engineer | edbpostgres.com
"Don't Complain about Heat, Plant a TREE"
Attachment
Very nice. One quick issue that I immediately saw - if the dashboard is not the top-most tab when pgAdmin opens, then when you've selected something on the treeview and then click on the dashboard tab, the graphs don't populate until you select a different object.
I'll play some more tomorrow when I have more time.
Thanks!
On Thu, Jul 23, 2020 at 11:58 AM Aditya Toshniwal <aditya.toshniwal@enterprisedb.com> wrote:
Hi Hackers,Attached is the patch to:1) Replace the chart library with Chart.js + ReactJS.2) Add support for ReactJS in pgAdmin with webpack, package.json, linter and other changes.3) Add support for testing React components with jasmine test cases. Test cases added.Please review.--Thanks,Aditya ToshniwalpgAdmin hacker | Sr. Software Engineer | edbpostgres.com"Don't Complain about Heat, Plant a TREE"
Hi
Some further thoughts/comments:
- There should be a comment block in every source file, containing the copyright info etc.
- Looks like the "new-" in "new-dashboard-graphs" is probably a development artefact and should be removed?
- We should probably use .jsx as the extension for React JS files, to help editors (and our brains). I'm guessing in the future we may have some .tsx as well.
- Not sure why there's a package-lock.json file in there - we use Yarn :-)
On Thu, Jul 23, 2020 at 3:59 PM Dave Page <dpage@pgadmin.org> wrote:
Very nice. One quick issue that I immediately saw - if the dashboard is not the top-most tab when pgAdmin opens, then when you've selected something on the treeview and then click on the dashboard tab, the graphs don't populate until you select a different object.I'll play some more tomorrow when I have more time.Thanks!On Thu, Jul 23, 2020 at 11:58 AM Aditya Toshniwal <aditya.toshniwal@enterprisedb.com> wrote:Hi Hackers,Attached is the patch to:1) Replace the chart library with Chart.js + ReactJS.2) Add support for ReactJS in pgAdmin with webpack, package.json, linter and other changes.3) Add support for testing React components with jasmine test cases. Test cases added.Please review.--Thanks,Aditya ToshniwalpgAdmin hacker | Sr. Software Engineer | edbpostgres.com"Don't Complain about Heat, Plant a TREE"--
Re: [pgAdmin][RM3904] Replace charting library Flotr2 with ChartJS using React
From
Aditya Toshniwal
Date:
Hi Hackers,
Attached is the updated patch to resolve the raised concerns.
On Fri, Jul 24, 2020 at 5:37 PM Dave Page <dpage@pgadmin.org> wrote:
HiSome further thoughts/comments:- There should be a comment block in every source file, containing the copyright info etc.
Done
- Looks like the "new-" in "new-dashboard-graphs" is probably a development artefact and should be removed?
Yeah, missed that. Done.
- We should probably use .jsx as the extension for React JS files, to help editors (and our brains). I'm guessing in the future we may have some .tsx as well.
Umm. OK. Done.
- Not sure why there's a package-lock.json file in there - we use Yarn :-)
I'm not sure where the file came from. I checked my patch twice but no sign of package-lock. :P
On Thu, Jul 23, 2020 at 3:59 PM Dave Page <dpage@pgadmin.org> wrote:Very nice. One quick issue that I immediately saw - if the dashboard is not the top-most tab when pgAdmin opens, then when you've selected something on the treeview and then click on the dashboard tab, the graphs don't populate until you select a different object.I'll play some more tomorrow when I have more time.Thanks!On Thu, Jul 23, 2020 at 11:58 AM Aditya Toshniwal <aditya.toshniwal@enterprisedb.com> wrote:Hi Hackers,Attached is the patch to:1) Replace the chart library with Chart.js + ReactJS.2) Add support for ReactJS in pgAdmin with webpack, package.json, linter and other changes.3) Add support for testing React components with jasmine test cases. Test cases added.Please review.--Thanks,Aditya ToshniwalpgAdmin hacker | Sr. Software Engineer | edbpostgres.com"Don't Complain about Heat, Plant a TREE"----
Thanks,
Aditya Toshniwal
pgAdmin hacker | Sr. Software Engineer | edbpostgres.com
"Don't Complain about Heat, Plant a TREE"
Attachment
Re: [pgAdmin][RM3904] Replace charting library Flotr2 with ChartJS using React
From
Akshay Joshi
Date:
Thanks, patch applied.
On Mon, Jul 27, 2020 at 5:50 PM Aditya Toshniwal <aditya.toshniwal@enterprisedb.com> wrote:
Hi Hackers,Attached is the updated patch to resolve the raised concerns.On Fri, Jul 24, 2020 at 5:37 PM Dave Page <dpage@pgadmin.org> wrote:HiSome further thoughts/comments:- There should be a comment block in every source file, containing the copyright info etc.Done- Looks like the "new-" in "new-dashboard-graphs" is probably a development artefact and should be removed?Yeah, missed that. Done.- We should probably use .jsx as the extension for React JS files, to help editors (and our brains). I'm guessing in the future we may have some .tsx as well.Umm. OK. Done.- Not sure why there's a package-lock.json file in there - we use Yarn :-)I'm not sure where the file came from. I checked my patch twice but no sign of package-lock. :POn Thu, Jul 23, 2020 at 3:59 PM Dave Page <dpage@pgadmin.org> wrote:Very nice. One quick issue that I immediately saw - if the dashboard is not the top-most tab when pgAdmin opens, then when you've selected something on the treeview and then click on the dashboard tab, the graphs don't populate until you select a different object.I'll play some more tomorrow when I have more time.Thanks!On Thu, Jul 23, 2020 at 11:58 AM Aditya Toshniwal <aditya.toshniwal@enterprisedb.com> wrote:Hi Hackers,Attached is the patch to:1) Replace the chart library with Chart.js + ReactJS.2) Add support for ReactJS in pgAdmin with webpack, package.json, linter and other changes.3) Add support for testing React components with jasmine test cases. Test cases added.Please review.--Thanks,Aditya ToshniwalpgAdmin hacker | Sr. Software Engineer | edbpostgres.com"Don't Complain about Heat, Plant a TREE"------Thanks,Aditya ToshniwalpgAdmin hacker | Sr. Software Engineer | edbpostgres.com"Don't Complain about Heat, Plant a TREE"
Thanks & Regards
Akshay Joshi
pgAdmin Hacker | Sr. Software Architect
EDB PostgresMobile: +91 976-788-8246