feat: add a button to generate panel url inside webhook url input

Author: x0sina

dashboard/public/statics/locales/en.json

@@ -248,6 +248,9 @@
         "webhookUrl": "Webhook URL",
         "webhookUrlPlaceholder": "https://your-domain.com/webhook",
         "webhookUrlDescription": "URL where Telegram will send updates",
+        "usePanelUrl": "Use Current Panel URL",
+        "usePanelUrlDescription": "Automatically insert your current panel URL into the webhook field for easy setup",
+        "panelUrlApplied": "Panel URL applied to webhook field",
         "webhookSecret": "Webhook Secret",
         "webhookSecretPlaceholder": "Enter webhook secret",
         "webhookSecretDescription": "Secret token for webhook security",

dashboard/public/statics/locales/fa.json

@@ -155,6 +155,9 @@
         "webhookUrl": "آدرس Webhook",
         "webhookUrlPlaceholder": "https://your-domain.com/webhook",
         "webhookUrlDescription": "آدرسی که تلگرام به‌روزرسانی‌ها را ارسال می‌کند",
+        "usePanelUrl": "استفاده از آدرس پنل فعلی",
+        "usePanelUrlDescription": "آدرس پنل فعلی خود را به طور خودکار در فیلد webhook وارد کنید",
+        "panelUrlApplied": "آدرس پنل در فیلد webhook اعمال شد",
         "webhookSecret": "رمز Webhook",
         "webhookSecretPlaceholder": "رمز webhook را وارد کنید",
         "webhookSecretDescription": "توکن مخفی برای امنیت webhook",

dashboard/public/statics/locales/ru.json

@@ -248,6 +248,9 @@
         "webhookUrl": "URL Webhook",
         "webhookUrlPlaceholder": "https://your-domain.com/webhook",
         "webhookUrlDescription": "URL, на который Telegram будет отправлять обновления",
+        "usePanelUrl": "Использовать текущий URL панели",
+        "usePanelUrlDescription": "Автоматически вставить текущий URL панели в поле webhook для удобной настройки",
+        "panelUrlApplied": "URL панели применен к полю webhook",
         "webhookSecret": "Секрет Webhook",
         "webhookSecretPlaceholder": "Введите секрет webhook",
         "webhookSecretDescription": "Секретный токен для безопасности webhook",

dashboard/public/statics/locales/zh.json

@@ -226,6 +226,9 @@
         "webhookUrl": "Webhook URL",
         "webhookUrlPlaceholder": "https://your-domain.com/webhook",
         "webhookUrlDescription": "Telegram 发送更新的 URL",
+        "usePanelUrl": "使用当前面板 URL",
+        "usePanelUrlDescription": "自动将当前面板 URL 插入到 webhook 字段中以便轻松设置",
+        "panelUrlApplied": "面板 URL 已应用到 webhook 字段",
         "webhookSecret": "Webhook 密钥",
         "webhookSecretPlaceholder": "输入 webhook 密钥",
         "webhookSecretDescription": "用于 webhook 安全的秘密令牌",

dashboard/src/pages/_dashboard.settings.telegram.tsx

@@ -10,9 +10,11 @@ import { PasswordInput } from '@/components/ui/password-input'
 import { Switch } from '@/components/ui/switch'
 import { Separator } from '@/components/ui/separator'
 import { Select, SelectContent, SelectItem, SelectTrigger, SelectValue } from '@/components/ui/select'
-import { Bot, Webhook, Shield, Globe, Smartphone, Send, Users, Settings } from 'lucide-react'
+import { Bot, Webhook, Shield, Globe, Smartphone, Send, Users, Settings, RefreshCcw } from 'lucide-react'
 import { useSettingsContext } from './_dashboard.settings'
 import { toast } from 'sonner'
+import { Popover, PopoverContent, PopoverTrigger } from '@/components/ui/popover'
+import { useState } from 'react'
 
 // Telegram settings validation schema
 const telegramSettingsSchema = z.object({
@@ -58,6 +60,13 @@ const telegramSettingsSchema = z.object({
 
 type TelegramSettingsForm = z.infer<typeof telegramSettingsSchema>
 
+// Helper function to get current panel URL
+const getCurrentPanelUrl = () => {
+  const protocol = window.location.protocol
+  const host = window.location.host
+  return `${protocol}//${host}`
+}
+
 // Helper to map frontend Telegram form data to backend payload
 function mapTelegramFormToPayload(data: TelegramSettingsForm) {
   const mapped = {
@@ -76,6 +85,7 @@ function mapTelegramFormToPayload(data: TelegramSettingsForm) {
 export default function TelegramSettings() {
   const { t } = useTranslation()
   const { settings, isLoading, error, updateSettings, isSaving } = useSettingsContext()
+  const [popoverOpen, setPopoverOpen] = useState(false)
 
   const form = useForm<TelegramSettingsForm>({
     resolver: zodResolver(telegramSettingsSchema),
@@ -295,9 +305,38 @@ export default function TelegramSettings() {
                             <Webhook className="h-4 w-4" />
                             {t('settings.telegram.general.webhookUrl')}
                           </FormLabel>
-                          <FormControl>
-                            <Input type="url" placeholder={t('settings.telegram.general.webhookUrlPlaceholder')} {...field} className="font-mono" />
-                          </FormControl>
+                          <div className="relative">
+                            <FormControl>
+                              <Input type="url" placeholder={t('settings.telegram.general.webhookUrlPlaceholder')} {...field} className="font-mono pr-10" />
+                            </FormControl>
+                            <Popover open={popoverOpen} onOpenChange={setPopoverOpen}>
+                              <PopoverTrigger asChild>
+                                <Button
+                                  type="button"
+                                  variant="ghost"
+                                  size="icon"
+                                  className="absolute right-1 top-1/2 h-8 w-8 -translate-y-1/2 hover:bg-accent"
+                                  onClick={(e) => {
+                                    e.preventDefault()
+                                    const currentUrl = getCurrentPanelUrl()
+                                    field.onChange(currentUrl)
+                                    toast.success(t('settings.telegram.general.panelUrlApplied'))
+                                    setPopoverOpen(false)
+                                  }}
+                                  onMouseEnter={() => setPopoverOpen(true)}
+                                  onMouseLeave={() => setPopoverOpen(false)}
+                                >
+                                  <RefreshCcw className="h-3 w-3" />
+                                </Button>
+                              </PopoverTrigger>
+                              <PopoverContent className="w-80" side="top" align="end">
+                                <div className="space-y-2">
+                                  <p className="text-sm font-medium">{t('settings.telegram.general.usePanelUrl')}</p>
+                                  <p className="text-xs text-muted-foreground">{t('settings.telegram.general.usePanelUrlDescription')}</p>
+                                </div>
+                              </PopoverContent>
+                            </Popover>
+                          </div>
                           <FormDescription className="text-sm text-muted-foreground">
                             {t('settings.telegram.general.webhookUrlDescription')}
                             <br />