feat: New Discord notification UI

This commit is contained in:
peaklabs-dev
2024-12-09 16:38:25 +01:00
parent c27e2e328f
commit 5210218a45
2 changed files with 94 additions and 40 deletions

View File

@@ -2,6 +2,7 @@
namespace App\Livewire\Notifications; namespace App\Livewire\Notifications;
use App\Models\DiscordNotificationSettings;
use App\Models\Team; use App\Models\Team;
use App\Notifications\Test; use App\Notifications\Test;
use Livewire\Attributes\Validate; use Livewire\Attributes\Validate;
@@ -11,6 +12,8 @@ class Discord extends Component
{ {
public Team $team; public Team $team;
public DiscordNotificationSettings $settings;
#[Validate(['boolean'])] #[Validate(['boolean'])]
public bool $discordEnabled = false; public bool $discordEnabled = false;
@@ -18,27 +21,43 @@ class Discord extends Component
public ?string $discordWebhookUrl = null; public ?string $discordWebhookUrl = null;
#[Validate(['boolean'])] #[Validate(['boolean'])]
public bool $discordNotificationsTest = false; public bool $deploymentSuccessDiscordNotifications = false;
#[Validate(['boolean'])] #[Validate(['boolean'])]
public bool $discordNotificationsDeployments = false; public bool $deploymentFailureDiscordNotifications = true;
#[Validate(['boolean'])] #[Validate(['boolean'])]
public bool $discordNotificationsStatusChanges = false; public bool $statusChangeDiscordNotifications = false;
#[Validate(['boolean'])] #[Validate(['boolean'])]
public bool $discordNotificationsDatabaseBackups = false; public bool $backupSuccessDiscordNotifications = false;
#[Validate(['boolean'])] #[Validate(['boolean'])]
public bool $discordNotificationsScheduledTasks = false; public bool $backupFailureDiscordNotifications = true;
#[Validate(['boolean'])] #[Validate(['boolean'])]
public bool $discordNotificationsServerDiskUsage = false; public bool $scheduledTaskSuccessDiscordNotifications = false;
#[Validate(['boolean'])]
public bool $scheduledTaskFailureDiscordNotifications = true;
#[Validate(['boolean'])]
public bool $dockerCleanupDiscordNotifications = false;
#[Validate(['boolean'])]
public bool $serverDiskUsageDiscordNotifications = true;
#[Validate(['boolean'])]
public bool $serverReachableDiscordNotifications = false;
#[Validate(['boolean'])]
public bool $serverUnreachableDiscordNotifications = true;
public function mount() public function mount()
{ {
try { try {
$this->team = auth()->user()->currentTeam(); $this->team = auth()->user()->currentTeam();
$this->settings = $this->team->discordNotificationSettings;
$this->syncData(); $this->syncData();
} catch (\Throwable $e) { } catch (\Throwable $e) {
return handleError($e, $this); return handleError($e, $this);
@@ -49,25 +68,38 @@ class Discord extends Component
{ {
if ($toModel) { if ($toModel) {
$this->validate(); $this->validate();
$this->team->discord_enabled = $this->discordEnabled; $this->settings->discord_enabled = $this->discordEnabled;
$this->team->discord_webhook_url = $this->discordWebhookUrl; $this->settings->discord_webhook_url = $this->discordWebhookUrl;
$this->team->discord_notifications_test = $this->discordNotificationsTest;
$this->team->discord_notifications_deployments = $this->discordNotificationsDeployments; $this->settings->deployment_success_discord_notifications = $this->deploymentSuccessDiscordNotifications;
$this->team->discord_notifications_status_changes = $this->discordNotificationsStatusChanges; $this->settings->deployment_failure_discord_notifications = $this->deploymentFailureDiscordNotifications;
$this->team->discord_notifications_database_backups = $this->discordNotificationsDatabaseBackups; $this->settings->status_change_discord_notifications = $this->statusChangeDiscordNotifications;
$this->team->discord_notifications_scheduled_tasks = $this->discordNotificationsScheduledTasks; $this->settings->backup_success_discord_notifications = $this->backupSuccessDiscordNotifications;
$this->team->discord_notifications_server_disk_usage = $this->discordNotificationsServerDiskUsage; $this->settings->backup_failure_discord_notifications = $this->backupFailureDiscordNotifications;
$this->team->save(); $this->settings->scheduled_task_success_discord_notifications = $this->scheduledTaskSuccessDiscordNotifications;
$this->settings->scheduled_task_failure_discord_notifications = $this->scheduledTaskFailureDiscordNotifications;
$this->settings->docker_cleanup_discord_notifications = $this->dockerCleanupDiscordNotifications;
$this->settings->server_disk_usage_discord_notifications = $this->serverDiskUsageDiscordNotifications;
$this->settings->server_reachable_discord_notifications = $this->serverReachableDiscordNotifications;
$this->settings->server_unreachable_discord_notifications = $this->serverUnreachableDiscordNotifications;
$this->settings->save();
refreshSession(); refreshSession();
} else { } else {
$this->discordEnabled = $this->team->discord_enabled; $this->discordEnabled = $this->settings->discord_enabled;
$this->discordWebhookUrl = $this->team->discord_webhook_url; $this->discordWebhookUrl = $this->settings->discord_webhook_url;
$this->discordNotificationsTest = $this->team->discord_notifications_test;
$this->discordNotificationsDeployments = $this->team->discord_notifications_deployments; $this->deploymentSuccessDiscordNotifications = $this->settings->deployment_success_discord_notifications;
$this->discordNotificationsStatusChanges = $this->team->discord_notifications_status_changes; $this->deploymentFailureDiscordNotifications = $this->settings->deployment_failure_discord_notifications;
$this->discordNotificationsDatabaseBackups = $this->team->discord_notifications_database_backups; $this->statusChangeDiscordNotifications = $this->settings->status_change_discord_notifications;
$this->discordNotificationsScheduledTasks = $this->team->discord_notifications_scheduled_tasks; $this->backupSuccessDiscordNotifications = $this->settings->backup_success_discord_notifications;
$this->discordNotificationsServerDiskUsage = $this->team->discord_notifications_server_disk_usage; $this->backupFailureDiscordNotifications = $this->settings->backup_failure_discord_notifications;
$this->scheduledTaskSuccessDiscordNotifications = $this->settings->scheduled_task_success_discord_notifications;
$this->scheduledTaskFailureDiscordNotifications = $this->settings->scheduled_task_failure_discord_notifications;
$this->dockerCleanupDiscordNotifications = $this->settings->docker_cleanup_discord_notifications;
$this->serverDiskUsageDiscordNotifications = $this->settings->server_disk_usage_discord_notifications;
$this->serverReachableDiscordNotifications = $this->settings->server_reachable_discord_notifications;
$this->serverUnreachableDiscordNotifications = $this->settings->server_unreachable_discord_notifications;
} }
} }

View File

@@ -3,7 +3,7 @@
Notifications | Coolify Notifications | Coolify
</x-slot> </x-slot>
<x-notification.navbar /> <x-notification.navbar />
<form wire:submit='submit' class="flex flex-col gap-4"> <form wire:submit='submit' class="flex flex-col gap-4 pb-4">
<div class="flex items-center gap-2"> <div class="flex items-center gap-2">
<h2>Discord</h2> <h2>Discord</h2>
<x-forms.button type="submit"> <x-forms.button type="submit">
@@ -12,7 +12,7 @@
@if ($discordEnabled) @if ($discordEnabled)
<x-forms.button class="normal-case dark:text-white btn btn-xs no-animation btn-primary" <x-forms.button class="normal-case dark:text-white btn btn-xs no-animation btn-primary"
wire:click="sendTestNotification"> wire:click="sendTestNotification">
Send Test Notifications Send Test Notification
</x-forms.button> </x-forms.button>
@endif @endif
</div> </div>
@@ -24,20 +24,42 @@
id="discordWebhookUrl" label="Webhook" /> id="discordWebhookUrl" label="Webhook" />
</form> </form>
@if ($discordEnabled) @if ($discordEnabled)
<h2 class="mt-4">Subscribe to events</h2> <h2 class="mt-8 mb-4">Notification Settings</h2>
<div class="w-64"> <p class="mb-4">
@if (isDev()) Select events for which you would like to receive Discord notifications.
<x-forms.checkbox instantSave="saveModel" id="discordNotificationsTest" label="Test" /> </p>
@endif <div class="flex flex-col gap-4 max-w-2xl">
<x-forms.checkbox instantSave="saveModel" id="discordNotificationsStatusChanges" <div class="border dark:border-coolgray-300 p-4 rounded-lg">
label="Container Status Changes" /> <h3 class="font-medium mb-3">Deployments</h3>
<x-forms.checkbox instantSave="saveModel" id="discordNotificationsDeployments" <div class="flex flex-col gap-1.5 pl-1">
label="Application Deployments" /> <x-forms.checkbox instantSave="saveModel" id="deploymentSuccessDiscordNotifications" label="Deployment Success" />
<x-forms.checkbox instantSave="saveModel" id="discordNotificationsDatabaseBackups" label="Backup Status" /> <x-forms.checkbox instantSave="saveModel" id="deploymentFailureDiscordNotifications" label="Deployment Failure" />
<x-forms.checkbox instantSave="saveModel" id="discordNotificationsScheduledTasks" <x-forms.checkbox instantSave="saveModel" helper="Send a notification when a container status changes. It will notify for Stopped and Restarted events of a container." id="statusChangeDiscordNotifications" label="Container Status Changes" />
label="Scheduled Tasks Status" /> </div>
<x-forms.checkbox instantSave="saveModel" id="discordNotificationsServerDiskUsage" </div>
label="Server Disk Usage" /> <div class="border dark:border-coolgray-300 p-4 rounded-lg">
</div> <h3 class="font-medium mb-3">Backups</h3>
<div class="flex flex-col gap-1.5 pl-1">
<x-forms.checkbox instantSave="saveModel" id="backupSuccessDiscordNotifications" label="Backup Success" />
<x-forms.checkbox instantSave="saveModel" id="backupFailureDiscordNotifications" label="Backup Failure" />
</div>
</div>
<div class="border dark:border-coolgray-300 p-4 rounded-lg">
<h3 class="font-medium mb-3">Scheduled Tasks</h3>
<div class="flex flex-col gap-1.5 pl-1">
<x-forms.checkbox instantSave="saveModel" id="scheduledTaskSuccessDiscordNotifications" label="Scheduled Task Success" />
<x-forms.checkbox instantSave="saveModel" id="scheduledTaskFailureDiscordNotifications" label="Scheduled Task Failure" />
</div>
</div>
<div class="border dark:border-coolgray-300 p-4 rounded-lg">
<h3 class="font-medium mb-3">Server</h3>
<div class="flex flex-col gap-1.5 pl-1">
<x-forms.checkbox instantSave="saveModel" helper="Send a notification when Docker Cleanup is run on a server." id="dockerCleanupDiscordNotifications" label="Docker Cleanup" />
<x-forms.checkbox instantSave="saveModel" helper="Send a notification when server disk usage is high." id="serverDiskUsageDiscordNotifications" label="Server Disk Usage" />
<x-forms.checkbox instantSave="saveModel" id="serverReachableDiscordNotifications" label="Server Reachable" />
<x-forms.checkbox instantSave="saveModel" id="serverUnreachableDiscordNotifications" label="Server Unreachable" />
</div>
</div>
</div>
@endif @endif
</div> </div>