mirror of
https://github.com/crocofied/CoreControl.git
synced 2025-12-18 16:07:10 +00:00
Notification Name
This commit is contained in:
parent
807d4d6ca9
commit
65f8e16fbc
@ -62,6 +62,7 @@ export default function Settings() {
|
|||||||
const [emailSuccess, setEmailSuccess] = useState<boolean>(false)
|
const [emailSuccess, setEmailSuccess] = useState<boolean>(false)
|
||||||
|
|
||||||
const [notificationType, setNotificationType] = useState<string>("")
|
const [notificationType, setNotificationType] = useState<string>("")
|
||||||
|
const [notificationName, setNotificationName] = useState<string>("")
|
||||||
const [smtpHost, setSmtpHost] = useState<string>("")
|
const [smtpHost, setSmtpHost] = useState<string>("")
|
||||||
const [smtpPort, setSmtpPort] = useState<number>(0)
|
const [smtpPort, setSmtpPort] = useState<number>(0)
|
||||||
const [smtpSecure, setSmtpSecure] = useState<boolean>(false)
|
const [smtpSecure, setSmtpSecure] = useState<boolean>(false)
|
||||||
@ -168,6 +169,7 @@ export default function Settings() {
|
|||||||
const addNotification = async () => {
|
const addNotification = async () => {
|
||||||
try {
|
try {
|
||||||
const response = await axios.post("/api/notifications/add", {
|
const response = await axios.post("/api/notifications/add", {
|
||||||
|
name: notificationName,
|
||||||
type: notificationType,
|
type: notificationType,
|
||||||
smtpHost: smtpHost,
|
smtpHost: smtpHost,
|
||||||
smtpPort: smtpPort,
|
smtpPort: smtpPort,
|
||||||
@ -450,212 +452,220 @@ export default function Settings() {
|
|||||||
<AlertDialogContent>
|
<AlertDialogContent>
|
||||||
<AlertDialogTitle>Add Notification</AlertDialogTitle>
|
<AlertDialogTitle>Add Notification</AlertDialogTitle>
|
||||||
<AlertDialogDescription>
|
<AlertDialogDescription>
|
||||||
<Select value={notificationType} onValueChange={(value: string) => setNotificationType(value)}>
|
<div className="space-y-4">
|
||||||
<SelectTrigger className="w-full">
|
<Input
|
||||||
<SelectValue placeholder="Notification Type" />
|
type="text"
|
||||||
</SelectTrigger>
|
id="notificationName"
|
||||||
<SelectContent>
|
placeholder="Notification Name (optional)"
|
||||||
<SelectItem value="smtp">SMTP</SelectItem>
|
onChange={(e) => setNotificationName(e.target.value)}
|
||||||
<SelectItem value="telegram">Telegram</SelectItem>
|
/>
|
||||||
<SelectItem value="discord">Discord</SelectItem>
|
<Select value={notificationType} onValueChange={(value: string) => setNotificationType(value)}>
|
||||||
<SelectItem value="gotify">Gotify</SelectItem>
|
<SelectTrigger className="w-full">
|
||||||
<SelectItem value="ntfy">Ntfy</SelectItem>
|
<SelectValue placeholder="Notification Type" />
|
||||||
<SelectItem value="pushover">Pushover</SelectItem>
|
</SelectTrigger>
|
||||||
</SelectContent>
|
<SelectContent>
|
||||||
|
<SelectItem value="smtp">SMTP</SelectItem>
|
||||||
{notificationType === "smtp" && (
|
<SelectItem value="telegram">Telegram</SelectItem>
|
||||||
<div className="mt-4 space-y-4">
|
<SelectItem value="discord">Discord</SelectItem>
|
||||||
<div className="grid md:grid-cols-2 gap-4">
|
<SelectItem value="gotify">Gotify</SelectItem>
|
||||||
<div className="space-y-1.5">
|
<SelectItem value="ntfy">Ntfy</SelectItem>
|
||||||
<Label htmlFor="smtpHost">SMTP Host</Label>
|
<SelectItem value="pushover">Pushover</SelectItem>
|
||||||
<Input
|
</SelectContent>
|
||||||
type="text"
|
|
||||||
id="smtpHost"
|
|
||||||
placeholder="smtp.example.com"
|
|
||||||
onChange={(e) => setSmtpHost(e.target.value)}
|
|
||||||
/>
|
|
||||||
</div>
|
|
||||||
<div className="space-y-1.5">
|
|
||||||
<Label htmlFor="smtpPort">SMTP Port</Label>
|
|
||||||
<Input
|
|
||||||
type="number"
|
|
||||||
id="smtpPort"
|
|
||||||
placeholder="587"
|
|
||||||
onChange={(e) => setSmtpPort(Number(e.target.value))}
|
|
||||||
/>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
|
|
||||||
<div className="flex items-center space-x-2 pt-2 pb-4">
|
|
||||||
<Checkbox id="smtpSecure" onCheckedChange={(checked: any) => setSmtpSecure(checked)} />
|
|
||||||
<Label htmlFor="smtpSecure" className="text-sm font-medium leading-none">
|
|
||||||
Secure Connection (TLS/SSL)
|
|
||||||
</Label>
|
|
||||||
</div>
|
|
||||||
|
|
||||||
<div className="grid gap-4">
|
|
||||||
<div className="space-y-1.5">
|
|
||||||
<Label htmlFor="smtpUser">SMTP Username</Label>
|
|
||||||
<Input
|
|
||||||
type="text"
|
|
||||||
id="smtpUser"
|
|
||||||
placeholder="user@example.com"
|
|
||||||
onChange={(e) => setSmtpUsername(e.target.value)}
|
|
||||||
/>
|
|
||||||
</div>
|
|
||||||
|
|
||||||
<div className="space-y-1.5">
|
|
||||||
<Label htmlFor="smtpPass">SMTP Password</Label>
|
|
||||||
<Input
|
|
||||||
type="password"
|
|
||||||
id="smtpPass"
|
|
||||||
placeholder="••••••••"
|
|
||||||
onChange={(e) => setSmtpPassword(e.target.value)}
|
|
||||||
/>
|
|
||||||
</div>
|
|
||||||
|
|
||||||
|
{notificationType === "smtp" && (
|
||||||
|
<div className="mt-4 space-y-4">
|
||||||
<div className="grid md:grid-cols-2 gap-4">
|
<div className="grid md:grid-cols-2 gap-4">
|
||||||
<div className="space-y-1.5">
|
<div className="space-y-1.5">
|
||||||
<Label htmlFor="smtpFrom">From Address</Label>
|
<Label htmlFor="smtpHost">SMTP Host</Label>
|
||||||
<Input
|
<Input
|
||||||
type="email"
|
type="text"
|
||||||
id="smtpFrom"
|
id="smtpHost"
|
||||||
placeholder="noreply@example.com"
|
placeholder="smtp.example.com"
|
||||||
onChange={(e) => setSmtpFrom(e.target.value)}
|
onChange={(e) => setSmtpHost(e.target.value)}
|
||||||
|
/>
|
||||||
|
</div>
|
||||||
|
<div className="space-y-1.5">
|
||||||
|
<Label htmlFor="smtpPort">SMTP Port</Label>
|
||||||
|
<Input
|
||||||
|
type="number"
|
||||||
|
id="smtpPort"
|
||||||
|
placeholder="587"
|
||||||
|
onChange={(e) => setSmtpPort(Number(e.target.value))}
|
||||||
|
/>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<div className="flex items-center space-x-2 pt-2 pb-4">
|
||||||
|
<Checkbox id="smtpSecure" onCheckedChange={(checked: any) => setSmtpSecure(checked)} />
|
||||||
|
<Label htmlFor="smtpSecure" className="text-sm font-medium leading-none">
|
||||||
|
Secure Connection (TLS/SSL)
|
||||||
|
</Label>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<div className="grid gap-4">
|
||||||
|
<div className="space-y-1.5">
|
||||||
|
<Label htmlFor="smtpUser">SMTP Username</Label>
|
||||||
|
<Input
|
||||||
|
type="text"
|
||||||
|
id="smtpUser"
|
||||||
|
placeholder="user@example.com"
|
||||||
|
onChange={(e) => setSmtpUsername(e.target.value)}
|
||||||
/>
|
/>
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
<div className="space-y-1.5">
|
<div className="space-y-1.5">
|
||||||
<Label htmlFor="smtpTo">To Address</Label>
|
<Label htmlFor="smtpPass">SMTP Password</Label>
|
||||||
<Input
|
<Input
|
||||||
type="email"
|
type="password"
|
||||||
id="smtpTo"
|
id="smtpPass"
|
||||||
placeholder="admin@example.com"
|
placeholder="••••••••"
|
||||||
onChange={(e) => setSmtpTo(e.target.value)}
|
onChange={(e) => setSmtpPassword(e.target.value)}
|
||||||
|
/>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<div className="grid md:grid-cols-2 gap-4">
|
||||||
|
<div className="space-y-1.5">
|
||||||
|
<Label htmlFor="smtpFrom">From Address</Label>
|
||||||
|
<Input
|
||||||
|
type="email"
|
||||||
|
id="smtpFrom"
|
||||||
|
placeholder="noreply@example.com"
|
||||||
|
onChange={(e) => setSmtpFrom(e.target.value)}
|
||||||
|
/>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<div className="space-y-1.5">
|
||||||
|
<Label htmlFor="smtpTo">To Address</Label>
|
||||||
|
<Input
|
||||||
|
type="email"
|
||||||
|
id="smtpTo"
|
||||||
|
placeholder="admin@example.com"
|
||||||
|
onChange={(e) => setSmtpTo(e.target.value)}
|
||||||
|
/>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
)}
|
||||||
|
|
||||||
|
{notificationType === "telegram" && (
|
||||||
|
<div className="mt-4 space-y-2">
|
||||||
|
<div className="grid w-full items-center gap-1.5">
|
||||||
|
<Label htmlFor="telegramToken">Bot Token</Label>
|
||||||
|
<Input
|
||||||
|
type="text"
|
||||||
|
id="telegramToken"
|
||||||
|
placeholder=""
|
||||||
|
onChange={(e) => setTelegramToken(e.target.value)}
|
||||||
|
/>
|
||||||
|
</div>
|
||||||
|
<div className="grid w-full items-center gap-1.5">
|
||||||
|
<Label htmlFor="telegramChatId">Chat ID</Label>
|
||||||
|
<Input
|
||||||
|
type="text"
|
||||||
|
id="telegramChatId"
|
||||||
|
placeholder=""
|
||||||
|
onChange={(e) => setTelegramChatId(e.target.value)}
|
||||||
|
/>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
)}
|
||||||
|
|
||||||
|
{notificationType === "discord" && (
|
||||||
|
<div className="mt-4">
|
||||||
|
<div className="grid w-full items-center gap-1.5">
|
||||||
|
<Label htmlFor="discordWebhook">Webhook URL</Label>
|
||||||
|
<Input
|
||||||
|
type="text"
|
||||||
|
id="discordWebhook"
|
||||||
|
placeholder=""
|
||||||
|
onChange={(e) => setDiscordWebhook(e.target.value)}
|
||||||
|
/>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
)}
|
||||||
|
|
||||||
|
{notificationType === "gotify" && (
|
||||||
|
<div className="mt-4">
|
||||||
|
<div className="grid w-full items-center gap-1.5">
|
||||||
|
<Label htmlFor="gotifyUrl">Gotify URL</Label>
|
||||||
|
<Input
|
||||||
|
type="text"
|
||||||
|
id="gotifyUrl"
|
||||||
|
placeholder=""
|
||||||
|
onChange={(e) => setGotifyUrl(e.target.value)}
|
||||||
|
/>
|
||||||
|
<div className="grid w-full items-center gap-1.5">
|
||||||
|
<Label htmlFor="gotifyToken">Gotify Token</Label>
|
||||||
|
<Input
|
||||||
|
type="text"
|
||||||
|
id="gotifyToken"
|
||||||
|
placeholder=""
|
||||||
|
onChange={(e) => setGotifyToken(e.target.value)}
|
||||||
/>
|
/>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
)}
|
||||||
)}
|
|
||||||
|
|
||||||
{notificationType === "telegram" && (
|
{notificationType === "ntfy" && (
|
||||||
<div className="mt-4 space-y-2">
|
<div className="mt-4">
|
||||||
<div className="grid w-full items-center gap-1.5">
|
|
||||||
<Label htmlFor="telegramToken">Bot Token</Label>
|
|
||||||
<Input
|
|
||||||
type="text"
|
|
||||||
id="telegramToken"
|
|
||||||
placeholder=""
|
|
||||||
onChange={(e) => setTelegramToken(e.target.value)}
|
|
||||||
/>
|
|
||||||
</div>
|
|
||||||
<div className="grid w-full items-center gap-1.5">
|
|
||||||
<Label htmlFor="telegramChatId">Chat ID</Label>
|
|
||||||
<Input
|
|
||||||
type="text"
|
|
||||||
id="telegramChatId"
|
|
||||||
placeholder=""
|
|
||||||
onChange={(e) => setTelegramChatId(e.target.value)}
|
|
||||||
/>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
)}
|
|
||||||
|
|
||||||
{notificationType === "discord" && (
|
|
||||||
<div className="mt-4">
|
|
||||||
<div className="grid w-full items-center gap-1.5">
|
|
||||||
<Label htmlFor="discordWebhook">Webhook URL</Label>
|
|
||||||
<Input
|
|
||||||
type="text"
|
|
||||||
id="discordWebhook"
|
|
||||||
placeholder=""
|
|
||||||
onChange={(e) => setDiscordWebhook(e.target.value)}
|
|
||||||
/>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
)}
|
|
||||||
|
|
||||||
{notificationType === "gotify" && (
|
|
||||||
<div className="mt-4">
|
|
||||||
<div className="grid w-full items-center gap-1.5">
|
|
||||||
<Label htmlFor="gotifyUrl">Gotify URL</Label>
|
|
||||||
<Input
|
|
||||||
type="text"
|
|
||||||
id="gotifyUrl"
|
|
||||||
placeholder=""
|
|
||||||
onChange={(e) => setGotifyUrl(e.target.value)}
|
|
||||||
/>
|
|
||||||
<div className="grid w-full items-center gap-1.5">
|
<div className="grid w-full items-center gap-1.5">
|
||||||
<Label htmlFor="gotifyToken">Gotify Token</Label>
|
<Label htmlFor="ntfyUrl">Ntfy URL</Label>
|
||||||
<Input
|
<Input
|
||||||
type="text"
|
type="text"
|
||||||
id="gotifyToken"
|
id="ntfyUrl"
|
||||||
placeholder=""
|
placeholder=""
|
||||||
onChange={(e) => setGotifyToken(e.target.value)}
|
onChange={(e) => setNtfyUrl(e.target.value)}
|
||||||
|
/>
|
||||||
|
<div className="grid w-full items-center gap-1.5">
|
||||||
|
<Label htmlFor="ntfyToken">Ntfy Token</Label>
|
||||||
|
<Input
|
||||||
|
type="text"
|
||||||
|
id="ntfyToken"
|
||||||
|
placeholder=""
|
||||||
|
onChange={(e) => setNtfyToken(e.target.value)}
|
||||||
|
/>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
)}
|
||||||
|
|
||||||
|
{notificationType === "pushover" && (
|
||||||
|
<div className="mt-4 flex flex-col gap-2">
|
||||||
|
<div className="grid w-full items-center gap-1.5">
|
||||||
|
<Label htmlFor="pushoverUrl">Pushover URL</Label>
|
||||||
|
<Input
|
||||||
|
type="text"
|
||||||
|
id="pushoverUrl"
|
||||||
|
placeholder="e.g. https://api.pushover.net/1/messages.json"
|
||||||
|
onChange={(e) => setPushoverUrl(e.target.value)}
|
||||||
|
/>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<div className="grid w-full items-center gap-1.5">
|
||||||
|
<Label htmlFor="pushoverToken">Pushover Token</Label>
|
||||||
|
<Input
|
||||||
|
type="text"
|
||||||
|
id="pushoverToken"
|
||||||
|
placeholder="e.g. 1234567890"
|
||||||
|
onChange={(e) => setPushoverToken(e.target.value)}
|
||||||
|
/>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<div className="grid w-full items-center gap-1.5">
|
||||||
|
<Label htmlFor="pushoverUser">Pushover User</Label>
|
||||||
|
<Input
|
||||||
|
type="text"
|
||||||
|
id="pushoverUser"
|
||||||
|
placeholder="e.g. 1234567890"
|
||||||
|
onChange={(e) => setPushoverUser(e.target.value)}
|
||||||
/>
|
/>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
)}
|
||||||
)}
|
</Select>
|
||||||
|
</div>
|
||||||
{notificationType === "ntfy" && (
|
|
||||||
<div className="mt-4">
|
|
||||||
<div className="grid w-full items-center gap-1.5">
|
|
||||||
<Label htmlFor="ntfyUrl">Ntfy URL</Label>
|
|
||||||
<Input
|
|
||||||
type="text"
|
|
||||||
id="ntfyUrl"
|
|
||||||
placeholder=""
|
|
||||||
onChange={(e) => setNtfyUrl(e.target.value)}
|
|
||||||
/>
|
|
||||||
<div className="grid w-full items-center gap-1.5">
|
|
||||||
<Label htmlFor="ntfyToken">Ntfy Token</Label>
|
|
||||||
<Input
|
|
||||||
type="text"
|
|
||||||
id="ntfyToken"
|
|
||||||
placeholder=""
|
|
||||||
onChange={(e) => setNtfyToken(e.target.value)}
|
|
||||||
/>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
)}
|
|
||||||
|
|
||||||
{notificationType === "pushover" && (
|
|
||||||
<div className="mt-4 flex flex-col gap-2">
|
|
||||||
<div className="grid w-full items-center gap-1.5">
|
|
||||||
<Label htmlFor="pushoverUrl">Pushover URL</Label>
|
|
||||||
<Input
|
|
||||||
type="text"
|
|
||||||
id="pushoverUrl"
|
|
||||||
placeholder="e.g. https://api.pushover.net/1/messages.json"
|
|
||||||
onChange={(e) => setPushoverUrl(e.target.value)}
|
|
||||||
/>
|
|
||||||
</div>
|
|
||||||
|
|
||||||
<div className="grid w-full items-center gap-1.5">
|
|
||||||
<Label htmlFor="pushoverToken">Pushover Token</Label>
|
|
||||||
<Input
|
|
||||||
type="text"
|
|
||||||
id="pushoverToken"
|
|
||||||
placeholder="e.g. 1234567890"
|
|
||||||
onChange={(e) => setPushoverToken(e.target.value)}
|
|
||||||
/>
|
|
||||||
</div>
|
|
||||||
|
|
||||||
<div className="grid w-full items-center gap-1.5">
|
|
||||||
<Label htmlFor="pushoverUser">Pushover User</Label>
|
|
||||||
<Input
|
|
||||||
type="text"
|
|
||||||
id="pushoverUser"
|
|
||||||
placeholder="e.g. 1234567890"
|
|
||||||
onChange={(e) => setPushoverUser(e.target.value)}
|
|
||||||
/>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
)}
|
|
||||||
</Select>
|
|
||||||
</AlertDialogDescription>
|
</AlertDialogDescription>
|
||||||
<AlertDialogFooter>
|
<AlertDialogFooter>
|
||||||
<AlertDialogCancel>Cancel</AlertDialogCancel>
|
<AlertDialogCancel>Cancel</AlertDialogCancel>
|
||||||
@ -765,7 +775,7 @@ export default function Settings() {
|
|||||||
</div>
|
</div>
|
||||||
)}
|
)}
|
||||||
<div className="space-y-1">
|
<div className="space-y-1">
|
||||||
<h3 className="font-medium capitalize">{notification.type}</h3>
|
<h3 className="font-medium capitalize">{notification.name && notification.name !== "" ? notification.name : notification.type}</h3>
|
||||||
<p className="text-xs text-muted-foreground">
|
<p className="text-xs text-muted-foreground">
|
||||||
{notification.type === "smtp" && "Email notifications"}
|
{notification.type === "smtp" && "Email notifications"}
|
||||||
{notification.type === "telegram" && "Telegram bot alerts"}
|
{notification.type === "telegram" && "Telegram bot alerts"}
|
||||||
|
|||||||
Loading…
x
Reference in New Issue
Block a user