[Weekly Progress Report] Improve UX of OpenWISP Monitoring.

[yashika jotwani]

Hello Everyone!

This thread will be used for tracking weekly progress for the GSoC'22 project Improve UX of OpenWISP Monitoring.

[May 30 -- June 3]

List of tasks that I have worked on:

• Initiated this issue [change] Change look of traffic charts #366, learned a good amount of stuff about charts and how they work, understood the approach but was stuck, later it was completed by Mentor Gangandeep and I learned most of the things from the approved PR.
  
• I have been working on Bridge Members Clickable, and I would improve the failing tests.
• I would start this soon. https://github.com/openwisp/openwisp-notifications/issues/238.

Task I will be working on next week:

• I will start working on my project according to the issues on my board.

Blockers:

• Currently, there are no blockers.

With regards

Yashika

[yashika jotwani]

[June 6 – June 11]

List of tasks I have worked on:

• Completed requested changes of  https://github.com/openwisp/openwisp-monitoring/pull/392, learned about tests.
• Opened and completed this https://github.com/openwisp/openwisp-notifications/pull/242

Task I will be working on next week:

• I will start working on the GSoC project and would start with this issue https://github.com/openwisp/openwisp-monitoring/issues/87

Blockers:

• Currently, there are no blockers.

With regards

Yashika

[yashika jotwani]

[June 13 – June 17]

List of tasks I have worked on:

• Working on this https://github.com/openwisp/openwisp-monitoring/issues/87
• Build visual mockups, explore, and decide what algorithm should work better, trying out different logics.

Task I will be working on next week:

• Would make a PR and description with images, GIFs, and an approach.
• Would try to complete this PR by this week with proper implementation and testing.

Blockers:

• Currently, there are no blockers.

With regards

Yashika

[Ajay Tripathi]

Hi,

> Build visual mockups, explore, and decide what algorithm should work better, trying out different logics

Best,
Ajay T.

[Ajay Tripathi]

Not sure why the text is missing in last mail, but I meant:

> Build visual mockups, explore, and decide what algorithm should work better, trying out different logics

Is it possible to please share the mockups here?

[yashika jotwani]

[June 20 – June 24]

List of tasks I have worked on:

• Working on this https://github.com/openwisp/openwisp-monitoring/issues/87

• Opened a PR https://github.com/openwisp/openwisp-monitoring/pull/397
• Changes discussed till now:

1. The Datapoints would have a single specific unit that has been updated by calculating the average of non-zero data points.
2. The Summary Circles have a different unit and if it has 0 value, the unit can be in Byte.
3. The Y-axis has the same unit as the datapoints have.

Task I will be working on next week:

• Would most probably test the PR on all possible cases.
• Start some implementation around the range of dates issue. https://github.com/openwisp/openwisp-monitoring/issues/26

Blockers:

• Currently, there are no blockers.

With regards

Yashika

[yashika jotwani]

List of tasks I have worked on:

• Worked a PR https://github.com/openwisp/openwisp-monitoring/pull/397
• Changes: 

1. Datapoints would have different units (B, KB, MB, GB, TB) that have been updated by calculating every value according to the range.
2. The Summary Circles have different units (B, KB, MB, GB, TB) and if it has 0 value, the unit can be in Byte.
3. General Traffic Chart on the dashboard shows the same behavior as other traffic charts.
4. Also takes care when the value is null shows (N/A).
5. The Y-axis has the same unit as the data points after calc the average.

• Added UI for the range of dates here :  [1st] and [2nd]. Would add the requested changes.
• Kanban board status: https://github.com/orgs/openwisp/projects/31
  

Task I will be working on next week:

• Would open the PR for this https://github.com/openwisp/openwisp-monitoring/issues/26.
• Complete the UI as requested and would start with the backend(grouping).
  

Blockers:

• Currently, there are no blockers.

With regards

Yashika

[yashika jotwani]

List of tasks I have worked on:

1. Worked on the requested changes on PR https://github.com/openwisp/openwisp-monitoring/pull/397.
2. Open a PR for the date range: https://github.com/openwisp/openwisp-monitoring/pull/410.

•   Updated the widget, and changed the UI, and added some conditions where users cannot select more than a year or day after today's dates.
•   Added the functionality where we can select the current 1 day, 3 days, 7 days, 1 week, and 1 year time from the widget itself.
•   Looked into some functionality for the custom date range and how can we implement that, and added the implementation flow in the flow chart. (attached image below).

       3. Kanban board status: https://github.com/orgs/openwisp/projects/31.

Task I will be working on next week:

• Would be working on the implementation of a custom date range picker in PR https://github.com/openwisp/openwisp-monitoring/pull/410.
• Would verify the flowchart from the mentors.

Blockers:

[yashika jotwani]

List of tasks I have worked on:

1. Working on a PR for the date range: https://github.com/openwisp/openwisp-monitoring/pull/410.

•  Added the functionality for the custom date range on the basis of the span between the start and end date,(need to improve that on the basis of dynamic grouping).
•  Wrote the logic for dynamic grouping, this would be in models so that the data sent is populated on the basis of grouping.
• Added the ajax call in the chart.html on the event apply.daterangepicker, views would have alerts to validate custom range.

       2. Kanban board status: https://github.com/orgs/openwisp/projects/31.

Task I will be working on next week:

• I would complete the discussed implementation, alerts, and dynamic grouping to be ready for review.
• would test it for various scenarios as per the discussed on the demo like start date greater and end and more.

Blockers:

• Currently, there are no blockers.

With regards

Yashika

[yashika jotwani]

[July 18 – June 22]

List of tasks I have worked on:

1. Worked on a PR for the date range: https://github.com/openwisp/openwisp-monitoring/pull/410.

•  Added the functionality for the custom date range on the basis of the span between the start and end date, with getting the data displayed on the x-axis between the start and end date.
•  Completed the functionality of the dynamic grouping, now the data is grouped for non-defined given custom range and displaced according to every chart.
•  Improve the PR for some bugs that are there on some requests made to the custom range.
•  Working: working demo is attached in the mail.

       2. Kanban board status: https://github.com/orgs/openwisp/projects/31.

Task I will be working on next week:

• Would work on cleaning the code, docs, and tests (if any) and would improve the PR based on mentors' reviews.
• When this would be in the testing, I would start working on the next issue https://github.com/openwisp/openwisp-monitoring/issues/27 [Zooming Graphs], as this depends on the current daterange feature.

Blockers:

• Currently, there are no blockers.

With regards

Yashika

[yashika jotwani]

[July 25 – June 29]

List of tasks I have worked on:

1. Worked on a PR for the date range: https://github.com/openwisp/openwisp-monitoring/pull/410.

• Made some UI improvements as suggested by the mentors.
•  Worked on some failing bugs on the requests that were made to the widget.
•  Fixing the daterangepicker to the dashboard, Updating the scripts used, and adding them in the project itself rather than adding links.
•  Did some research for  https://github.com/openwisp/openwisp-monitoring/issues/27 [Zooming Graphs] issue.

       2. Kanban board status: https://github.com/orgs/openwisp/projects/31.

Task I will be working on next week:

• Fix the dashboard, now has some errors with the scripts loading and the widget cannot access the daterangepicker function even though having scripts already on the page.
• Would create a lucid flowchart for the Zooming Graphs issue, and would get clear the idea and flow from the mentors.
• Would open a PR for Zooming Graphs with the initial implementation of the discussed workflow.

Blockers:

• Currently, there are no blockers.

With regards

Yashika

[yashika jotwani]

[1 Aug – 5 Aug]

List of tasks I have worked on:

1. Worked on a PR for the date range: https://github.com/openwisp/openwisp-monitoring/pull/410.

•  Made some UI improvements as suggested by the mentors.

•  Worked on the failing checks, removed timezone errors, and fixed the errors that occurred on the dashboard's widget.
•  Worked on https://github.com/openwisp/openwisp-monitoring/issues/27 [Zooming Graphs] issue locally.

       2. Kanban board status: https://github.com/orgs/openwisp/projects/31.

Task I will be working on next week:

• Would update  https://github.com/openwisp/openwisp-monitoring/pull/410, as per the review and stress testing, and get it merged.
• Would open a PR for Zooming Graphs, and tried something on codepen https://codepen.io/yashikajotwani12/pen/NWYMjgV.

Blockers:

• Currently, there are no blockers.

With regards

Yashika

[yashika jotwani]

[9 Aug – 13 Aug]

List of tasks I have worked on:

1. Worked on a PR for the date range: https://github.com/openwisp/openwisp-monitoring/pull/410.

•  Made some UI improvements suggested here https://github.com/openwisp/openwisp-monitoring/pull/410#pullrequestreview-1067080643.

•  Worked on coverage, worked on bugs that came during the review, and fixed the charts during refreshing or loading both on the dashboard and device page.

•  Worked on https://github.com/openwisp/openwisp-monitoring/issues/27 [Zooming Graphs] issue locally.

       2. Kanban board status: https://github.com/orgs/openwisp/projects/31.

Task I will be working on next week:

• Would update  https://github.com/openwisp/openwisp-monitoring/pull/410, as per the review and stress testing, and get it merged.

• Would open a PR for Zooming Graphs.

Blockers:

• Currently, there are no blockers.

With regards

Yashika

[yashika jotwani]

[15 Aug – 19 Aug]

List of tasks I have worked on:

1. Worked on a PR for the date range: https://github.com/openwisp/openwisp-monitoring/pull/410

1. 1. Solved the bug for the correct data loading for specified start and end dates.
   2. Worked on fixing the build.
2. Opened a PR for zooming https://github.com/openwisp/openwisp-monitoring/pull/432
   1. Zooming demo: https://user-images.githubusercontent.com/77020164/185146478-ee459d38-e987-46c1-8680-58579ae6a35d.mp4
   2. Worked on zooming functionality and it works.

       2. Kanban board status: https://github.com/orgs/openwisp/projects/31.

Task I will be working on next week:

• Would update https://github.com/openwisp/openwisp-monitoring/pull/410 for passing the build and getting this merged.

• Would update the zooming PR and look for any sliding event handler on plotly.

Blockers:

• Currently, there are no blockers.

With regards

Yashika

[yashika jotwani]

[22 Aug – 26 Aug] Project Report

List of tasks I have worked on:

1. Worked on the failing test for the PR(date range). I was blocked, I updated the tests and they were working fine individually but failing in running during all the tests.
2. Started working on API PR until I was blocked. I have made some research and started debugging the implementation with reference of my proposed solution.
3. Worked on the requested changes for the PR(date range): 
   Progress: -

• •  Changed the data query[Requested-changes].
  •  And some UI changes.

Task I will be working on next week:

• Would update https://github.com/openwisp/openwisp-monitoring/pull/410 for all requested changes and pass the failing build.

• Would update the zooming PR and look for any sliding event handler on plotly.

Blockers:

• I am working on the requested changes, and it might have some issues but I will work on it.
• I am not able to figure out how we can remove the CDN link from `chart.html` and successfully load the date range picker, I tried it multiple times but am stuck on that. As was suggested by Gagandeep to add all the `min.js` files locally and add them. It works on the `home` page but not loading on the `device` page.

[P.S.] : I was not able to attend the recent demo meet because I had urgent travelling on Wednesday, I tried to work but there was no stable internet connection. 

With regards

Yashika