Servers table switch to ag-grid by ocket8888 · Pull Request #4769 · apache/trafficcontrol

ocket8888 · 2020-06-09T17:06:27Z

What does this PR (Pull Request) do?

This PR fixes Improve performance (pagination and search) of TP's tables #4354 and fixes Improve TP search query #2624 and fixes TP: [RFE] addition of "NOT" (!) operator in search fields #2326

Switches the "/servers" table from jQuery datatables to agGrid, increasing load speed by a factor of about 14.

The new tables have a superset of the functionality of the old tables.

Which Traffic Control components are affected by this PR?

Traffic Portal

What is the best way to verify this PR?

Run Traffic Portal - preferably with a whole ton of servers so you can be impressed by the lightning fast load speed (at least compared to the jQuery data tables).

If #4747 isn't merged yet then you'll need to be using a version of TO that doesn't include the changes from #4700 .

The following criteria are ALL met by this PR

This PR includes tests OR I have explained why tests are unnecessary
This PR includes documentation OR I have explained why documentation is unnecessary
This PR includes an update to CHANGELOG.md OR such an update is not necessary
This PR includes any and all required license headers
This PR ensures that database migration sequence is correct OR this PR does not include a database migration
This PR DOES NOT FIX A SERIOUS SECURITY VULNERABILITY

mitchell852 · 2020-06-16T14:26:51Z

after getting this, i cleared local storage and it works now. maybe this is because your work is in progress?

mitchell852 · 2020-06-16T14:39:51Z

Not sure why "Clear Updates" is disabled.

ocket8888 · 2020-06-16T14:45:40Z

"Clear Server Updates" is meant to be disabled when the server isn't a cache server and/or doesn't have pending updates. "Queue Server Updates" is meant to be disabled when the server isn't a cache server and/or does have pending updates. Just to be clear about the intended behavior, because the old context menu would hide those options instead of disabling them.

Clearly, though, that's a cache server, and it looks like it has updates pending. So something's probably wrong.

mitchell852

A couple suggestions:

add a global search if it's not too hard. i think there is value in the ability to do a quick search across all columns. and the less functionality lost, the easier the transition to the new grid. plus, i think it might help getting the TP tests to pass.
i've found that some people don't like pagination or they like to adjust the number of rows in a page. maybe infinite scroll would be cool or at least a way to adjust pagination counts.
cdn column is empty but i think you know that.

otherwise, very cool!

mitchell852 · 2020-06-16T15:05:33Z

Clearly, though, that's a cache server, and it looks like it has updates pending. So something's probably wrong.

yeah, something is weird there. it's a cache server and updPending=true so "clear updates" should be an option. i looked at the logic and it seemed right so not sure:

            <button type="button" ng-click="clearServerUpdates(server, $event)" ng-disabled="!isCache(server) || !server.updPending">Clear Server Updates</button>

mitchell852 · 2020-06-16T17:31:01Z

Maybe in order to get this merged sooner rather than later. just focus on these 3 things i found:

cdn column is empty
clear updates context menu is disabled
ensure that this is not a problem:

other stuff can be added in a subsequent PR:

global search
infinite scrolling maybe?

ocket8888 · 2020-06-16T17:54:44Z

"cdn column is empty" is already fixed. Might not have pushed it.
"Failed to load stored column state: one or more columns not found" is also not a real problem. I think that's actually related to the cdns thing. It saved column state with a "cdn" column, and the fix was to make it a "cdnName" column. So you need to clear your local storage. Nobody who didn't use it while it was still in a pull request should see that error.

mitchell852

couple more things

mitchell852 · 2020-06-16T21:32:00Z

nit: the context menu doesn't close when you select 'open in new tab" or "navigate to fqdn" or "show charts". basically anything that opens a new window/tab

ocket8888 · 2020-06-16T22:32:21Z

That should be fixed now

* Added ag-grid tables to TP * Fixed build issues * Replaced servers table with agGrid * Switch to tabs * Started setting up context menu support * Added some context menu functionality, fixed some styling * Put styling in the stylesheet; added server delete to context menu * Moved menu outside of panel * Added server status update to context menu * Added queue updates to context menu * Added clear updates to context menu; added disabled menuitem styling * Fixed a type error, finished context menu * Removed unused things, general clean-up and re-organization * added CSV export * Rolled back changes to source of AngularJS * Fixed menuitem button styling * table now saves sort, filter, and column state * table now saves column sizes * Rolled back inneffectual browserify changes * fixes server TP tests to work with ag-grid * fixes broken TP ds test * adds a new super controller for the *servers tables * Fixed blank CDNs column * Fixed incorrect update pending label icon * Removed unused coldef properties, removed unused gridOptions property * Fixed broken 'show charts' button in servers table context menu * Fixed context menu not closing when certain actions were selected Co-authored-by: Jeremy Mitchell <mitchell852@gmail.com> (cherry picked from commit e5d7dc8)

mitchell852 reviewed Jun 9, 2020

View reviewed changes

Comment thread traffic_portal/grunt/browserify2.js Outdated

mitchell852 reviewed Jun 9, 2020

View reviewed changes

Comment thread traffic_portal/grunt/copy.js

mitchell852 reviewed Jun 9, 2020

View reviewed changes

Comment thread traffic_portal/grunt/copy.js

ocket8888 added improvement The functionality exists but it could be improved in some way. low impact affects only a small portion of a CDN, and cannot itself break one performance impacts/improves/measures performance Traffic Portal v1 related to Traffic Portal version 1 labels Jun 9, 2020

ocket8888 marked this pull request as ready for review June 10, 2020 00:07

mitchell852 reviewed Jun 16, 2020

View reviewed changes

Comment thread traffic_portal/app/src/common/modules/table/servers/TableServersController.js

ocket8888 added 14 commits June 16, 2020 14:23

Added ag-grid tables to TP

e378928

Fixed build issues

d481904

Replaced servers table with agGrid

6285be1

Switch to tabs

321a479

Started setting up context menu support

866a1aa

Added some context menu functionality, fixed some styling

e7b993b

Put styling in the stylesheet; added server delete to context menu

73934aa

Moved menu outside of panel

666cb54

Added server status update to context menu

93c9805

Added queue updates to context menu

ba6127b

Added clear updates to context menu; added disabled menuitem styling

7d17b68

Fixed a type error, finished context menu

5eafc48

Removed unused things, general clean-up and re-organization

4d80a94

added CSV export

a6aaaac

ocket8888 and others added 7 commits June 16, 2020 14:23

Rolled back changes to source of AngularJS

936d5e9

Fixed menuitem button styling

6893f85

table now saves sort, filter, and column state

8982d00

table now saves column sizes

b8b7eb6

Rolled back inneffectual browserify changes

e3df429

fixes server TP tests to work with ag-grid

54bb16e

fixes broken TP ds test

7cf8e98

ocket8888 force-pushed the ag-grid-tables branch from fb95edd to 7cf8e98 Compare June 16, 2020 20:23

mitchell852 and others added 5 commits June 16, 2020 14:49

adds a new super controller for the *servers tables

c011cde

Fixed blank CDNs column

6c22fdd

Fixed incorrect update pending label icon

9be0f62

Removed unused coldef properties, removed unused gridOptions property

74eaf9a

Fixed broken 'show charts' button in servers table context menu

bc70950

mitchell852 reviewed Jun 16, 2020

View reviewed changes

Comment thread traffic_portal/app/src/common/modules/table/servers/TableServersController.js Outdated

Comment thread traffic_portal/app/src/common/modules/table/servers/TableServersController.js

Fixed context menu not closing when certain actions were selected

3418938

mitchell852 reviewed Jun 16, 2020

View reviewed changes

Comment thread traffic_portal/package.json

mitchell852 self-assigned this Jun 17, 2020

mitchell852 merged commit e5d7dc8 into apache:master Jun 17, 2020

ocket8888 deleted the ag-grid-tables branch June 17, 2020 01:42

Conversation

ocket8888 commented Jun 9, 2020 • edited Loading Uh oh! There was an error while loading. Please reload this page.

Uh oh!

What does this PR (Pull Request) do?

Which Traffic Control components are affected by this PR?

What is the best way to verify this PR?

The following criteria are ALL met by this PR

Uh oh!

Uh oh!

Uh oh!

Uh oh!

mitchell852 commented Jun 16, 2020 • edited Loading Uh oh! There was an error while loading. Please reload this page.

Uh oh!

Uh oh!

mitchell852 commented Jun 16, 2020

Uh oh!

ocket8888 commented Jun 16, 2020

Uh oh!

mitchell852 left a comment • edited Loading Uh oh! There was an error while loading. Please reload this page.

Uh oh!

Choose a reason for hiding this comment

Uh oh!

mitchell852 commented Jun 16, 2020

Uh oh!

Uh oh!

mitchell852 commented Jun 16, 2020 • edited Loading Uh oh! There was an error while loading. Please reload this page.

Uh oh!

Uh oh!

ocket8888 commented Jun 16, 2020

Uh oh!

mitchell852 left a comment

Choose a reason for hiding this comment

Uh oh!

Uh oh!

Uh oh!

mitchell852 commented Jun 16, 2020

Uh oh!

ocket8888 commented Jun 16, 2020

Uh oh!

Uh oh!

Reviewers

Assignees

Labels

Projects

Milestone

Development

Uh oh!

2 participants

ocket8888 commented Jun 9, 2020 •

edited

Loading

mitchell852 commented Jun 16, 2020 •

edited

Loading

mitchell852 left a comment •

edited

Loading

mitchell852 commented Jun 16, 2020 •

edited

Loading