<div x-data="{ showNotification: @entangle('showNotification') }"> @if ($checkConnection) @script <script> let checkPusherInterval = null; let checkNumber = 0; checkPusherInterval = setInterval(() => { if (window.Echo) { if (window.Echo.connector.pusher.connection.state !== 'connected') { checkNumber++; if (checkNumber > 4) { @if ($isNotificationEnabled) $wire.showNotification = true; @endif console.error( 'Last Hour Cloud could not connect to the new realtime service introduced in beta.154. This will cause unusual problems on the UI if not fixed! Please check the related upstream documentation (https://coolify.io/docs/cloudflare/tunnels) or get help on Discord (https://coollabs.io/discord).)' ); clearInterval(checkPusherInterval); } } else { console.log('Last Hour Cloud Realtime Service is connected!'); clearInterval(checkPusherInterval); } } else { @if ($isNotificationEnabled) $wire.showNotification = true; @endif console.error( 'Last Hour Cloud could not connect to the new realtime service introduced in beta.154. This will cause unusual problems on the UI if not fixed! Please check the related upstream documentation (https://coolify.io/docs/cloudflare/tunnels) or get help on Discord (https://coollabs.io/discord).)' ); clearInterval(checkPusherInterval); } }, 1000); </script> @endscript <div class="toast z-[9999]" x-cloak x-show="showNotification"> <div class="flex flex-col text-white border border-red-500 border-dashed rounded alert bg-coolgray-200"> <span><span class="font-bold text-left text-red-500">WARNING: </span>Last Hour Cloud could not connect to the new realtime service introduced in beta.154. <br>This will cause unusual problems on the UI if not fixed!<br><br>Please check the related upstream <a href='https://coolify.io/docs/cloudflare/tunnels' target='_blank'>documentation</a> or get help on <a href='https://coollabs.io/discord' target='_blank'>Discord</a>.</span> <x-forms.button class="bg-coolgray-400" wire:click='disable'>Acknowledge the problem and disable this popup</x-forms.button> </div> </div> @endif </div>