90 lines
4.7 KiB
Plaintext
90 lines
4.7 KiB
Plaintext
<div class="space-y-6">
|
|
<div class="sm:flex sm:items-center sm:justify-between">
|
|
<div>
|
|
<h1 class="text-3xl font-bold leading-tight tracking-tight text-gray-900">Notification Settings</h1>
|
|
<p class="mt-2 text-sm text-gray-600">Configure ntfy push notifications for your phone.</p>
|
|
</div>
|
|
</div>
|
|
|
|
<div class="rounded-xl bg-white shadow-sm ring-1 ring-gray-900/5 overflow-hidden">
|
|
<div class="px-6 py-5 border-b border-gray-200">
|
|
<h2 class="text-lg font-semibold text-gray-900 flex items-center gap-2">
|
|
<i class="fas fa-bell text-blue-500"></i>
|
|
ntfy Configuration
|
|
</h2>
|
|
<p class="mt-1 text-sm text-gray-500">
|
|
Install the <a href="https://ntfy.sh" class="text-blue-600 hover:underline" target="_blank" rel="noopener">ntfy app</a>
|
|
on your phone, subscribe to your topic, and enter the details below.
|
|
</p>
|
|
</div>
|
|
|
|
<div class="px-6 py-6">
|
|
<%= form_with model: @admin, url: admin_notifications_path, method: :patch, local: true, class: "space-y-6" do |f| %>
|
|
<div class="flex items-center gap-3">
|
|
<%= f.check_box :ntfy_enabled, class: "h-4 w-4 rounded border-gray-300 text-blue-600 focus:ring-blue-500" %>
|
|
<%= f.label :ntfy_enabled, "Enable ntfy notifications", class: "text-sm font-medium text-gray-700" %>
|
|
</div>
|
|
|
|
<div>
|
|
<%= f.label :ntfy_topic, "ntfy Topic", class: "block text-sm font-medium text-gray-700" %>
|
|
<p class="mt-1 text-xs text-gray-500">The topic name you subscribe to in the ntfy app. Treat this like a password.</p>
|
|
<%= f.text_field :ntfy_topic,
|
|
class: "mt-2 block w-full rounded-lg border-gray-300 shadow-sm focus:border-blue-500 focus:ring-blue-500 sm:text-sm py-2.5",
|
|
placeholder: "mysmsa-pio-your-secret-topic" %>
|
|
</div>
|
|
|
|
<div>
|
|
<%= f.label :ntfy_token, "Access Token (optional)", class: "block text-sm font-medium text-gray-700" %>
|
|
<p class="mt-1 text-xs text-gray-500">Required only if your ntfy server has access control enabled.</p>
|
|
<%= f.text_field :ntfy_token,
|
|
class: "mt-2 block w-full rounded-lg border-gray-300 shadow-sm focus:border-blue-500 focus:ring-blue-500 sm:text-sm py-2.5",
|
|
placeholder: "tk_..." %>
|
|
</div>
|
|
|
|
<div>
|
|
<%= f.label :ntfy_server_url, "ntfy Server URL", class: "block text-sm font-medium text-gray-700" %>
|
|
<p class="mt-1 text-xs text-gray-500">Leave blank to use the default (from NTFY_SERVER_URL env var or ntfy.sh).</p>
|
|
<%= f.text_field :ntfy_server_url,
|
|
class: "mt-2 block w-full rounded-lg border-gray-300 shadow-sm focus:border-blue-500 focus:ring-blue-500 sm:text-sm py-2.5",
|
|
placeholder: "https://ntfy.yourdomain.com" %>
|
|
</div>
|
|
|
|
<div class="pt-2">
|
|
<%= f.submit "Save Settings",
|
|
class: "inline-flex items-center gap-2 rounded-lg bg-blue-600 px-4 py-2.5 text-sm font-semibold text-white shadow-sm hover:bg-blue-500 transition-all" %>
|
|
</div>
|
|
<% end %>
|
|
</div>
|
|
</div>
|
|
|
|
<div class="rounded-xl bg-white shadow-sm ring-1 ring-gray-900/5 overflow-hidden">
|
|
<div class="px-6 py-5 border-b border-gray-200">
|
|
<h2 class="text-lg font-semibold text-gray-900 flex items-center gap-2">
|
|
<i class="fas fa-paper-plane text-green-500"></i>
|
|
Send Test Notification
|
|
</h2>
|
|
<p class="mt-1 text-sm text-gray-500">Sends a test push to your configured ntfy topic right now.</p>
|
|
</div>
|
|
<div class="px-6 py-6">
|
|
<%= button_to test_admin_notifications_path, method: :post,
|
|
class: "inline-flex items-center gap-2 rounded-lg bg-green-600 px-4 py-2.5 text-sm font-semibold text-white shadow-sm hover:bg-green-500 transition-all" do %>
|
|
<i class="fas fa-paper-plane"></i>
|
|
Send Test Notification
|
|
<% end %>
|
|
</div>
|
|
</div>
|
|
|
|
<div class="rounded-xl bg-blue-50 p-6 ring-1 ring-blue-900/5">
|
|
<h3 class="text-sm font-semibold text-blue-900 flex items-center gap-2">
|
|
<i class="fas fa-info-circle"></i>
|
|
How ntfy works
|
|
</h3>
|
|
<ul class="mt-3 space-y-2 text-sm text-blue-800">
|
|
<li class="flex gap-2"><i class="fas fa-check mt-1 text-xs"></i> Self-hosted ntfy server runs alongside this app in production.</li>
|
|
<li class="flex gap-2"><i class="fas fa-check mt-1 text-xs"></i> Each admin gets their own topic — subscribe in the ntfy app to receive pushes.</li>
|
|
<li class="flex gap-2"><i class="fas fa-check mt-1 text-xs"></i> Events: gateway offline/online, SMS failed/delivered, API key revoked.</li>
|
|
<li class="flex gap-2"><i class="fas fa-check mt-1 text-xs"></i> Notifications are sent asynchronously and retried on failure.</li>
|
|
</ul>
|
|
</div>
|
|
</div>
|