dave/coolify
1
0
Fork 0
Code Issues Pull Requests Actions 2 Packages Projects Releases Wiki Activity

fix: realtime connection check

Browse Source
This commit is contained in:
Andras Bacsai
2024-03-26 13:25:10 +01:00
parent d931241edc
commit d077e0c83c
7 changed files with 83 additions and 84 deletions
Download Patch File Download Diff File Expand all files Collapse all files

52
resources/views/livewire/layout-popups.blade.php
View File

@@ -1,13 +1,52 @@
<div x-data="{
popups: {
sponsorship: true,
notification: true
notification: true,
realtime: false,
},
init() {
this.popups.sponsorship = localStorage.getItem('popupSponsorship') !== 'false';
this.popups.notification = localStorage.getItem('popupNotification') !== 'false';
this.popups.realtime = localStorage.getItem('popupRealtime');
let checkNumber = 1;
let checkPusherInterval = null;
if (!this.popups.realtime) {
checkPusherInterval = setInterval(() => {
if (window.Echo && window.Echo.connector.pusher.connection.state !== 'connected') {
checkNumber++;
if (checkNumber > 4) {
this.popups.realtime = true;
console.error(
'Coolify could not connect to its real-time service. This will cause unusual problems on the UI if not fixed! Please check the related documentation (https://coolify.io/docs/cloudflare/tunnels) or get help on Discord (https://coollabs.io/discord).)'
);
clearInterval(checkPusherInterval);
}
}
}, 1000);
}
}
}">
@auth
<span x-show="popups.realtime === true">
<x-popup>
<x-slot:title>
<span class="font-bold text-left text-red-500">WARNING: </span>Realtime Error?!
</x-slot:title>
<x-slot:description>
<span>Coolify could not connect to its real-time service.<br>This will cause unusual problems on the UI
if
not fixed! <br><br>Please check the
related <a class="underline" href='https://coolify.io/docs/cloudflare/tunnels'
target='_blank'>documentation</a> or get
help on <a class="underline" href='https://coollabs.io/discord' target='_blank'>Discord</a>. </span>
</x-slot:description>
<x-slot:button-text @click="disableRealtime()">
Acknowledge & Disable This Popup
</x-slot:button-text>
</x-popup>
</span>
@endauth
<span x-show="popups.sponsorship">
<x-popup>
<x-slot:title>
@@ -20,7 +59,8 @@
<x-slot:description>
<span>Please
consider donating on <a href="https://github.com/sponsors/coollabsio"
class="text-xs underline dark:text-white">GitHub</a> or <a href="https://opencollective.com/coollabsio"
class="text-xs underline dark:text-white">GitHub</a> or <a
href="https://opencollective.com/coollabsio"
class="text-xs underline dark:text-white">OpenCollective</a>.<br><br></span>
<span>It enables us to keep creating features without paywalls, ensuring our work remains free and
open.</span>
@@ -35,7 +75,8 @@
<div><span class="font-bold text-red-500">WARNING:</span> The number of active servers exceeds the limit
covered by your payment. If not resolved, some of your servers <span class="font-bold text-red-500">will
be deactivated</span>. Visit <a href="{{ route('subscription.show') }}"
class="underline dark:text-white">/subscription</a> to update your subscription or remove some servers.
class="underline dark:text-white">/subscription</a> to update your subscription or remove some
servers.
</div>
</x-banner>
@endif
@@ -70,8 +111,13 @@
function disableSponsorship() {
localStorage.setItem('popupSponsorship', false);
}
function disableNotification() {
localStorage.setItem('popupNotification', false);
}
function disableRealtime() {
localStorage.setItem('popupRealtime', 'disabled');
}
</script>
</div>

48
resources/views/livewire/realtime-connection.blade.php
View File

@@ -1,48 +0,0 @@
<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(
'Coolify 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 documentation (https://coolify.io/docs/cloudflare/tunnels) or get help on Discord (https://coollabs.io/discord).)'
);
clearInterval(checkPusherInterval);
}
} else {
console.log('Coolify Realtime Service is connected!');
clearInterval(checkPusherInterval);
}
} else {
@if ($isNotificationEnabled)
$wire.showNotification = true;
@endif
console.error(
'Coolify 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 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 dark:text-white border border-red-500 border-dashed rounded alert-error bg-coolgray-200">
<span><span class="font-bold text-left text-red-500">WARNING: </span>Coolify 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 <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>