Policy Playground Layout Updates

[pickjasmine]

Changes the playground to match the updated prototypes/the OPA Rego playground.

[alexashley]

Not sure the best way to describe this (or what the right behavior is), but the resize corner in the policy editor causes the parent widget to expand or contract. But on the playground, the resize doesn't affect the parent container at all:

Also I probably missed it, but is there a way to do trigger another evaluation? The only thing I could see to do was re-select a policy or resource.

[pickjasmine]

Not sure the best way to describe this (or what the right behavior is), but the resize corner in the policy editor causes the parent widget to expand or contract. But on the playground, the resize doesn't affect the parent container at all:

I believe this is because the playground is using flex for the layout but the policy creation page is using flexbox. I think it would be better to be constrained to the parent container, do you agree? I will make an issue to update them to match.

Also I probably missed it, but is there a way to do trigger another evaluation? The only thing I could see to do was re-select a policy or resource.

Yeah, searching for a new policy or resource is the only way right now. I can add back the button to reset the playground or clear the policy/resource, but I figured once the user is able to edit the policy or resource fields then having the current screen would be the cleanest UI. I do have some ideas around adding a copy button to the blocks of code, so it could be a good place to add another button to remove the selected policy/resource

[alexashley]

@pickjasmine I agree it makes sense to limit them to the parent container, and also maybe to set resize: none to remove the ability to change the textarea size (since it's already as big as it can get and can only be made smaller).

[pickjasmine]

@pickjasmine I agree it makes sense to limit them to the parent container, and also maybe to set resize: none to remove the ability to change the textarea size (since it's already as big as it can get and can only be made smaller).

I will add the resize: none for now. I tried to copy the overflow/scrolling behavior that the playground has, but because the way the syntax highlighting is done I will have to spend some time figuring out if that behavior is possible.

[alexashley]