How to show/hide Modal based on a cookie

I’m trying to put a simple modal up when a user first visits. The standard one about cookies being used and when they click agree the modal goes away.

I created a cookie, I created the modal. I have bound the value of the cookie to the modal button and defaulted it to 0. I have an “on click” action for the modal button that sets the cookie value to 1.

Then I have a show/hide on the modal to show when cookie is 0 and hide when cookie is 1.

If I set the modal to auto show it always comes up no matter what and when I turn auto show off the modal never comes up. Code below. Please help!

<div class="modal fade" id="modal2" is="dmx-bs4-modal" tabindex="-1" role="dialog" dmx-hide="cookies1.data.agree == 1" dmx-show="cookies1.data.agree != 1">

<button type="button" class="btn btn-dark" data-dismiss="modal" style="border-radius: 3px;" dmx-on:click="cookies1.set('agree',1,{expires: 180})" dmx-bind:value="cookies1.data.agree.default(0)">AGREE</button>