mirror of
https://github.com/crocofied/CoreControl.git
synced 2025-12-17 15:36:50 +00:00
Empty Notifications View
This commit is contained in:
parent
1e93f84b24
commit
947cec0d7a
@ -4,7 +4,7 @@ import { useState } from 'react';
|
|||||||
import AddNotification from '@/components/dialogues/AddNotification';
|
import AddNotification from '@/components/dialogues/AddNotification';
|
||||||
import DeleteNotification from '@/components/dialogues/DeleteNotification';
|
import DeleteNotification from '@/components/dialogues/DeleteNotification';
|
||||||
import useNotifications from '@/hooks/useNotifications';
|
import useNotifications from '@/hooks/useNotifications';
|
||||||
import { Plus, Trash2, Play } from 'lucide-react';
|
import { Plus, Trash2, Play, Bell } from 'lucide-react';
|
||||||
|
|
||||||
export const NotificationSettings = ({ onError, onSuccess }: { onError: (message: string) => void, onSuccess: (message: string) => void }) => {
|
export const NotificationSettings = ({ onError, onSuccess }: { onError: (message: string) => void, onSuccess: (message: string) => void }) => {
|
||||||
const { loadNotifications, notifications } = useNotifications();
|
const { loadNotifications, notifications } = useNotifications();
|
||||||
@ -23,33 +23,46 @@ export const NotificationSettings = ({ onError, onSuccess }: { onError: (message
|
|||||||
Add Provider
|
Add Provider
|
||||||
</button>
|
</button>
|
||||||
</div>
|
</div>
|
||||||
<div className='overflow-x-auto pt-4'>
|
{ notifications && notifications.length > 0 ? (
|
||||||
<table className='table table-zebra table-pin-cols'>
|
<div className="rounded-xl overflow-hidden border border-base-200 mt-4">
|
||||||
<thead>
|
<div className='overflow-x-auto'>
|
||||||
<tr>
|
<table className='table table-zebra table-pin-cols'>
|
||||||
<th>#</th>
|
<thead>
|
||||||
<th>Name</th>
|
<tr>
|
||||||
<th>Type</th>
|
<th>#</th>
|
||||||
<th className='w-24 text-center'>Actions</th>
|
<th>Name</th>
|
||||||
</tr>
|
<th>Type</th>
|
||||||
</thead>
|
<th className='w-24 text-center'>Actions</th>
|
||||||
<tbody>
|
|
||||||
{notifications.map((notification: any) => (
|
|
||||||
<tr key={notification.id}>
|
|
||||||
<td>{notification.id}</td>
|
|
||||||
<td>{notification.name}</td>
|
|
||||||
<td>{notification.type}</td>
|
|
||||||
<td>
|
|
||||||
<div className='flex items-center gap-2'>
|
|
||||||
<button className='btn btn-sm btn-success'><Play className='w-4 h-4' /></button>
|
|
||||||
<button className='btn btn-sm btn-error' onClick={() => {setDeleteNotificationId(notification.id); (document.getElementById('delete_notification') as HTMLDialogElement)?.showModal()}}><Trash2 className='w-4 h-4' /></button>
|
|
||||||
</div>
|
|
||||||
</td>
|
|
||||||
</tr>
|
</tr>
|
||||||
))}
|
</thead>
|
||||||
</tbody>
|
<tbody>
|
||||||
</table>
|
{notifications.map((notification: any) => (
|
||||||
</div>
|
<tr key={notification.id}>
|
||||||
|
<td>{notification.id}</td>
|
||||||
|
<td>{notification.name}</td>
|
||||||
|
<td>{notification.type}</td>
|
||||||
|
<td>
|
||||||
|
<div className='flex items-center gap-2'>
|
||||||
|
<button className='btn btn-sm btn-success'><Play className='w-4 h-4' /></button>
|
||||||
|
<button className='btn btn-sm btn-error' onClick={() => {setDeleteNotificationId(notification.id); (document.getElementById('delete_notification') as HTMLDialogElement)?.showModal()}}><Trash2 className='w-4 h-4' /></button>
|
||||||
|
</div>
|
||||||
|
</td>
|
||||||
|
</tr>
|
||||||
|
))}
|
||||||
|
</tbody>
|
||||||
|
</table>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
) : (
|
||||||
|
<div className='pt-4'>
|
||||||
|
<div className="flex flex-col items-center justify-center py-12 bg-base-300 rounded-xl">
|
||||||
|
<div className="bg-base-100 p-4 rounded-full mb-4">
|
||||||
|
<Bell className="h-8 w-8 text-base-content/50" />
|
||||||
|
</div>
|
||||||
|
<p className="text-base-content/70 mb-4">No notification providers have been added yet.</p>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
)}
|
||||||
<AddNotification onNotificationAdded={loadNotifications} onSuccess={onSuccess} onError={onError} />
|
<AddNotification onNotificationAdded={loadNotifications} onSuccess={onSuccess} onError={onError} />
|
||||||
{deleteNotificationId && (
|
{deleteNotificationId && (
|
||||||
<DeleteNotification notificationId={deleteNotificationId} onNotificationDeleted={loadNotifications} onError={onError} onSuccess={onSuccess} />
|
<DeleteNotification notificationId={deleteNotificationId} onNotificationDeleted={loadNotifications} onError={onError} onSuccess={onSuccess} />
|
||||||
|
|||||||
Loading…
x
Reference in New Issue
Block a user