UI struggles with ICMP entries in VPC ACLs

[NuxRo]

Cloudstack 4.19rc4

It seems like the UI is having problems displaying the ICMP types and codes in VPC ACLs.
It will accept the ICMP type and code, however it will not list them properly for some entries and it will "forget" the values, eg if you want to edit an ICMP ACL the fields will be missing their values.
This doesn't happen for eg TCP entries.

This is a UI issue, cmk returns a nicely formatted json with all the correct data.

PS: a similar problem extends to isolated network egress rules and public IP firewall rules, the UI doesn't handle ICMP correctly, although the rules are ultimately correct in Cloudstack/DB.

vpc-acl-icmp.mp4

[rajujith]

@NuxRo This appears to be an issue across the UI, not all input values are displayed later on.

[weizhouapache]

@NuxRo
I think this has been resolved by #8293

to be clear, this code snippet in the file ui/src/views/network/AclListRulesTab.vue

should I backport to 4.18/4.19 ?

[weizhouapache]

fixed via #8589