229 lines
12 KiB
PHP
229 lines
12 KiB
PHP
<div x-data="{
|
|
popups: {
|
|
notification: true,
|
|
realtime: false,
|
|
},
|
|
reminders: {
|
|
notification: { compact: false }, // MapleDeploy branding: sponsorship reminder removed
|
|
},
|
|
reminderCollapseAfter: 10000,
|
|
isDevelopment: {{ isDev() ? 'true' : 'false' }},
|
|
init() {
|
|
this.popups.notification = this.shouldShowMonthlyPopup('popupNotification');
|
|
this.popups.realtime = localStorage.getItem('popupRealtime');
|
|
|
|
if (this.popups.notification) {
|
|
this.scheduleReminderCollapse('notification');
|
|
}
|
|
|
|
let checkNumber = 1;
|
|
let checkPusherInterval = null;
|
|
let checkReconnectInterval = null;
|
|
|
|
if (!this.popups.realtime) {
|
|
checkPusherInterval = setInterval(() => {
|
|
if (window.Echo) {
|
|
if (window.Echo.connector.pusher.connection.state === 'connected') {
|
|
this.popups.realtime = false;
|
|
} else {
|
|
checkNumber++;
|
|
if (checkNumber > 5) {
|
|
this.popups.realtime = true;
|
|
console.error(
|
|
'MapleDeploy could not connect to its real-time service. This will cause unusual problems on the UI if not fixed! Please contact support at support@mapledeploy.ca.'
|
|
); // MapleDeploy branding
|
|
}
|
|
|
|
}
|
|
}
|
|
}, 2000);
|
|
}
|
|
},
|
|
scheduleReminderCollapse(reminder) {
|
|
setTimeout(() => {
|
|
if (reminder === 'notification') {
|
|
this.reminders.notification.compact = true;
|
|
}
|
|
}, this.reminderCollapseAfter);
|
|
},
|
|
shouldShowMonthlyPopup(storageKey) {
|
|
const disabledTimestamp = localStorage.getItem(storageKey);
|
|
|
|
// If never disabled, show the popup
|
|
if (!disabledTimestamp || disabledTimestamp === 'false') {
|
|
return true;
|
|
}
|
|
|
|
// If disabled timestamp is not a valid number, show the popup
|
|
const disabledTime = parseInt(disabledTimestamp);
|
|
if (isNaN(disabledTime)) {
|
|
return true;
|
|
}
|
|
|
|
const now = new Date();
|
|
const disabledDate = new Date(disabledTime);
|
|
|
|
{{-- if (this.isDevelopment) {
|
|
// In development: check if 10 seconds have passed
|
|
const timeDifference = now.getTime() - disabledDate.getTime();
|
|
const tenSecondsInMs = 10 * 1000;
|
|
return timeDifference >= tenSecondsInMs;
|
|
} else { --}}
|
|
// In production: check if we're in a different month or year
|
|
const isDifferentMonth = now.getMonth() !== disabledDate.getMonth() ||
|
|
now.getFullYear() !== disabledDate.getFullYear();
|
|
return isDifferentMonth;
|
|
{{-- } --}}
|
|
}
|
|
}"> {{-- MapleDeploy branding: sponsorship reminder listener removed --}}
|
|
@auth
|
|
<span x-show="popups.realtime === true">
|
|
@if (!isCloud())
|
|
<x-popup>
|
|
<x-slot:customActions>
|
|
<div
|
|
class="relative mx-auto flex w-full max-w-2xl flex-col gap-5 overflow-hidden rounded-2xl border border-red-200 bg-white p-5 shadow-modal sm:p-6 dark:border-red-500/20 dark:bg-surface">
|
|
<button type="button" aria-label="Dismiss real-time connection warning"
|
|
class="absolute top-3 right-3 flex size-7 items-center justify-center rounded-full text-neutral-400 transition-colors hover:bg-neutral-100 hover:text-black dark:text-fg-faint dark:hover:bg-white/[0.07] dark:hover:text-fg"
|
|
@click="bannerVisible=false;disableRealtime()">
|
|
<x-reicon name="x" class="size-3.5" />
|
|
</button>
|
|
|
|
<div class="flex items-start gap-4 pr-8">
|
|
<div
|
|
class="hidden size-12 shrink-0 items-center justify-center rounded-xl border border-red-200 bg-red-50 text-red-600 sm:flex dark:border-red-500/20 dark:bg-red-500/10 dark:text-red-400">
|
|
<x-reicon name="alert-triangle" class="size-6" />
|
|
</div>
|
|
<div class="min-w-0">
|
|
<h2 class="text-[15px]! leading-5! font-semibold! text-black dark:text-fg">
|
|
Cannot connect to real-time service
|
|
</h2>
|
|
{{-- MapleDeploy branding: support links updated --}}
|
|
<p class="mt-1 text-[12px] leading-5 text-neutral-500 dark:text-fg-dim">
|
|
This will cause unusual problems on the UI. Please contact
|
|
<a class="font-medium text-coollabs underline decoration-coollabs/30 underline-offset-2 transition-colors hover:text-coollabs-100 dark:text-warning dark:decoration-warning/30 dark:hover:text-warning/90"
|
|
href="mailto:support@mapledeploy.ca">MapleDeploy support</a>
|
|
for help.
|
|
</p>
|
|
</div>
|
|
</div>
|
|
|
|
<div class="flex flex-col gap-2 sm:flex-row sm:items-center sm:justify-end">
|
|
{{-- MapleDeploy branding: Coolify docs link removed --}}
|
|
<button type="button"
|
|
class="button h-9 justify-center bg-red-600! text-white! ring-1 ring-red-600/25 hover:bg-red-700! sm:min-w-40 dark:bg-red-500! dark:ring-red-500/30 dark:hover:bg-red-400!"
|
|
@click="bannerVisible=false;disableRealtime()">
|
|
Acknowledge & disable
|
|
</button>
|
|
</div>
|
|
</div>
|
|
</x-slot:customActions>
|
|
</x-popup>
|
|
@endif
|
|
</span>
|
|
@endauth
|
|
{{-- MapleDeploy branding: Coolify sponsorship popup removed --}}
|
|
@if (request()->query->get('cancelled'))
|
|
<x-banner>
|
|
<div class="flex items-center gap-2">
|
|
<svg class="w-5 h-5 text-red-500 shrink-0" fill="currentColor" viewBox="0 0 20 20">
|
|
<path fill-rule="evenodd"
|
|
d="M10 18a8 8 0 100-16 8 8 0 000 16zM8.707 7.293a1 1 0 00-1.414 1.414L8.586 10l-1.293 1.293a1 1 0 101.414 1.414L10 11.414l1.293 1.293a1 1 0 001.414-1.414L11.414 10l1.293-1.293a1 1 0 00-1.414-1.414L10 8.586 8.707 7.293z"
|
|
clip-rule="evenodd" />
|
|
</svg>
|
|
<span><span class="font-bold text-red-500">Subscription Error.</span> Something went wrong. Please try
|
|
again or <a class="underline dark:text-white"
|
|
href="{{ config('constants.urls.contact') }}" target="_blank">contact support</a>.</span>
|
|
</div>
|
|
</x-banner>
|
|
@endif
|
|
@if (request()->query->get('success'))
|
|
<span x-init="$nextTick(() => window.toast('Welcome onboard!', {
|
|
type: 'success',
|
|
description: 'Your subscription has been activated. It could take a few seconds before it is fully active.',
|
|
persistent: true,
|
|
}))"></span>
|
|
@endif
|
|
@if (currentTeam()->subscriptionPastOverDue())
|
|
<x-banner :closable=false>
|
|
<div><span class="font-bold text-red-500">WARNING:</span> Your subscription is in over-due. If your
|
|
latest
|
|
payment is not paid within a week, all automations <span class="font-bold text-red-500">will
|
|
be deactivated</span>. Visit <a href="{{ route('subscription.show') }}" {{ wireNavigate() }}
|
|
class="underline dark:text-white">/subscription</a> to check your subscription status or pay
|
|
your
|
|
invoice (or check your email for the invoice).
|
|
</div>
|
|
</x-banner>
|
|
@endif
|
|
@if (currentTeam()->serverOverflow())
|
|
<x-banner :closable=false>
|
|
<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') }}" {{ wireNavigate() }}
|
|
class="underline dark:text-white">/subscription</a> to update your subscription or remove some
|
|
servers.
|
|
</div>
|
|
</x-banner>
|
|
@endif
|
|
@if (!currentTeam()->isAnyNotificationEnabled())
|
|
<span x-show="popups.notification">
|
|
<x-popup>
|
|
<x-slot:customActions>
|
|
<div class="relative mx-auto flex w-full flex-col overflow-hidden rounded-2xl border border-neutral-200 bg-white shadow-modal transition-all duration-300 dark:border-white/[0.1] dark:bg-surface"
|
|
:class="reminders.notification.compact ? 'max-w-sm gap-3 p-4' : 'max-w-2xl gap-5 p-5 sm:p-6'">
|
|
<button type="button" aria-label="Dismiss notifications reminder"
|
|
class="absolute top-3 right-3 flex size-7 items-center justify-center rounded-full text-neutral-400 transition-colors hover:bg-neutral-100 hover:text-black dark:text-fg-faint dark:hover:bg-white/[0.07] dark:hover:text-fg"
|
|
@click="bannerVisible=false;disableNotification()">
|
|
<x-reicon name="x" class="size-3.5" />
|
|
</button>
|
|
|
|
<div class="flex items-start gap-4 pr-8">
|
|
<div x-show="!reminders.notification.compact" x-transition.opacity
|
|
class="hidden size-12 shrink-0 items-center justify-center rounded-xl border border-amber-200 bg-amber-50 text-amber-700 sm:flex dark:border-warning/20 dark:bg-warning/10 dark:text-warning">
|
|
<x-reicon name="alert-triangle" class="size-6" />
|
|
</div>
|
|
<div class="min-w-0">
|
|
<h2 class="text-[15px]! leading-5! font-semibold! text-black dark:text-fg">
|
|
No notifications enabled
|
|
</h2>
|
|
<p x-show="!reminders.notification.compact" x-transition.opacity
|
|
class="mt-1 text-[12px] leading-5 text-neutral-500 dark:text-fg-dim">
|
|
Enable at least one notification channel so you receive important alerts.
|
|
Visit
|
|
<a href="{{ route('notifications.email') }}" {{ wireNavigate() }}
|
|
class="font-medium text-coollabs underline decoration-coollabs/30 underline-offset-2 transition-colors hover:text-coollabs-100 dark:text-warning dark:decoration-warning/30 dark:hover:text-warning/90">notifications</a>
|
|
to get started.
|
|
</p>
|
|
</div>
|
|
</div>
|
|
|
|
<div class="flex flex-col gap-2 sm:flex-row sm:items-center sm:justify-end">
|
|
<a href="{{ route('notifications.email') }}" {{ wireNavigate() }}
|
|
class="button h-9 justify-center sm:min-w-28">
|
|
Open notifications
|
|
</a>
|
|
<button x-show="!reminders.notification.compact" x-transition.opacity type="button"
|
|
class="button h-9 justify-center sm:min-w-32"
|
|
@click="bannerVisible=false;disableNotification()">
|
|
Accept and close
|
|
</button>
|
|
</div>
|
|
</div>
|
|
</x-slot:customActions>
|
|
</x-popup>
|
|
</span>
|
|
@endif
|
|
<script>
|
|
// MapleDeploy branding: disableSponsorship() removed (popup removed)
|
|
|
|
function disableNotification() {
|
|
// Store current timestamp instead of just 'false'
|
|
localStorage.setItem('popupNotification', Date.now().toString());
|
|
}
|
|
|
|
function disableRealtime() {
|
|
localStorage.setItem('popupRealtime', 'disabled');
|
|
}
|
|
</script>
|
|
</div>
|