From 48ccde053b180087f4a8ee82c6ab029d36f88a2f Mon Sep 17 00:00:00 2001
From: Bot <bot@example.com>
Date: Thu, 16 Apr 2026 21:43:50 +0800
Subject: [PATCH] feat: specialized UI labels for Telegram notification type

---
 src/components/notifier.tsx | 56 ++++++++++++++++++++++---------------
 1 file changed, 34 insertions(+), 22 deletions(-)

diff --git a/src/components/notifier.tsx b/src/components/notifier.tsx
index 6004262..ce5e69b 100644
--- a/src/components/notifier.tsx
+++ b/src/components/notifier.tsx
@@ -164,6 +164,7 @@ export const NotifierCard: React.FC<NotifierCardProps> = ({ data, mutate }) => {
                                                 <SelectContent>
                                                     <SelectItem value="1">Webhook</SelectItem>
                                                     <SelectItem value="2">SMTP (Email)</SelectItem>
+                                                    <SelectItem value="3">Telegram</SelectItem>
                                                 </SelectContent>
                                             </Select>
                                             <FormMessage />
@@ -175,15 +176,18 @@ export const NotifierCard: React.FC<NotifierCardProps> = ({ data, mutate }) => {
                                     name="url"
                                     render={({ field }) => (
                                         <FormItem>
-                                            <FormLabel>{form.watch("type") == 2 ? "SMTP Server (host:port)" : "URL"}</FormLabel>
+                                            <FormLabel>
+                                                {form.watch("type") == 2 ? "SMTP Server (host:port)" : 
+                                                 form.watch("type") == 3 ? "Bot Token" : "URL"}
+                                            </FormLabel>
                                             <FormControl>
-                                                <Input {...field} />
+                                                <Input {...field} placeholder={form.watch("type") == 3 ? "123456:ABC-DEF" : ""} />
                                             </FormControl>
                                             <FormMessage />
                                         </FormItem>
                                     )}
                                 />
-                                {form.watch("type") != 2 && (
+                                {form.watch("type") != 2 && form.watch("type") != 3 && (
                                     <>
                                         <FormField
                                             control={form.control}
@@ -248,28 +252,17 @@ export const NotifierCard: React.FC<NotifierCardProps> = ({ data, mutate }) => {
                                     name="request_header"
                                     render={({ field }) => (
                                         <FormItem>
-                                            <FormLabel>{form.watch("type") == 2 ? "SMTP User:Pass" : t("RequestHeader")}</FormLabel>
+                                            <FormLabel>
+                                                {form.watch("type") == 2 ? "SMTP User:Pass" : 
+                                                 form.watch("type") == 3 ? "Chat ID" : t("RequestHeader")}
+                                            </FormLabel>
                                             <FormControl>
                                                 <Textarea
                                                     className="resize-y"
-                                                    placeholder={form.watch("type") == 2 ? "user:pass" : '{"User-Agent":"Nezha-Agent"}'}
-                                                    {...field}
-                                                />
-                                            </FormControl>
-                                            <FormMessage />
-                                        </FormItem>
-                                    )}
-                                />
-                                <FormField
-                                    control={form.control}
-                                    name="request_body"
-                                    render={({ field }) => (
-                                        <FormItem>
-                                            <FormLabel>{form.watch("type") == 2 ? "Recipient Email" : t("RequestBody")}</FormLabel>
-                                            <FormControl>
-                                                <Textarea
-                                                    className={form.watch("type") == 2 ? "resize-y" : "resize-y h-[240px]"}
-                                                    placeholder={form.watch("type") == 2 ? "target@example.com" : '...'}
+                                                    placeholder={
+                                                        form.watch("type") == 2 ? "user:pass" : 
+                                                        form.watch("type") == 3 ? "123456789" : '{"User-Agent":"Nezha-Agent"}'
+                                                    }
                                                     {...field}
                                                 />
                                             </FormControl>
@@ -277,6 +270,25 @@ export const NotifierCard: React.FC<NotifierCardProps> = ({ data, mutate }) => {
                                         </FormItem>
                                     )}
                                 />
+                                {form.watch("type") != 3 && (
+                                    <FormField
+                                        control={form.control}
+                                        name="request_body"
+                                        render={({ field }) => (
+                                            <FormItem>
+                                                <FormLabel>{form.watch("type") == 2 ? "Recipient Email" : t("RequestBody")}</FormLabel>
+                                                <FormControl>
+                                                    <Textarea
+                                                        className={form.watch("type") == 2 ? "resize-y" : "resize-y h-[240px]"}
+                                                        placeholder={form.watch("type") == 2 ? "target@example.com" : '...'}
+                                                        {...field}
+                                                    />
+                                                </FormControl>
+                                                <FormMessage />
+                                            </FormItem>
+                                        )}
+                                    />
+                                )}
                                 <FormField
                                     control={form.control}
                                     name="verify_tls"