Update access control layout

[Misha Bragin]

Update the layout of the Access Controls tab:

1. Table view. Impotant notes:

• If there are more than 2 ports in the list, display the rest as +N (e.g., +5 like in the screenshot)
• Port ranges are not supported yet - no need to implement

2. Add rule popup
   
   When add description clicked:
   

Important notes:

• When one arrow is selected in either direction, then paint it in blue. If both selected - green. See screenshots above.
• Port ranges are not supported yet - no need to implement

3. Rule view:

With add description clicked

• Port ranges are not supported yet - no need to implement

[Sarooj bukhari]

Can I ask you to do somehting additional? We need a validation for ports.
I will ask the backend guy to do the validation on the API but we need to do it in the UI as well.
Port should be in range (0;65535]
65535 inclusive but 0 is not valid

[Sarooj bukhari]

When protocol ALL is selected - disable ports. We can't control ports in this case
When protocol ALL is selected - set the arrows to Bi-directional meaning the green arrow between the source and destination

[Sarooj bukhari]

No port is required on TCP and UDP

[Sarooj bukhari]

on reverser direction swap destination with source