improve: replace long line of words with clipboard button (#95)

* improve: replace long line of words with clipboard button

* change module path

src/routes/alert-rule.tsx

@@ -2,6 +2,7 @@ import { deleteAlertRules } from "@/api/alert-rule"
 import { swrFetcher } from "@/api/api"
 import { ActionButtonGroup } from "@/components/action-button-group"
 import { AlertRuleCard } from "@/components/alert-rule"
+import { CopyButton } from "@/components/copy-button"
 import { HeaderButtonGroup } from "@/components/header-button-group"
 import { NotificationTab } from "@/components/notification-tab"
 import { Checkbox } from "@/components/ui/checkbox"
@@ -87,11 +88,7 @@ export default function AlertRulePage() {
             header: t("Rules"),
             cell: ({ row }) => {
                 const s = row.original
-                return (
-                    <div className="max-w-48 whitespace-normal break-words">
-                        {JSON.stringify(s.rules)}
-                    </div>
-                )
+                return <CopyButton text={JSON.stringify(s.rules)} />
             },
         },
         {

src/routes/cron.tsx

@@ -1,6 +1,7 @@
 import { swrFetcher } from "@/api/api"
 import { deleteCron, runCron } from "@/api/cron"
 import { ActionButtonGroup } from "@/components/action-button-group"
+import { CopyButton } from "@/components/copy-button"
 import { CronCard } from "@/components/cron"
 import { HeaderButtonGroup } from "@/components/header-button-group"
 import { Checkbox } from "@/components/ui/checkbox"
@@ -86,7 +87,7 @@ export default function CronPage() {
             accessorKey: "command",
             cell: ({ row }) => {
                 const s = row.original
-                return <div className="max-w-48 whitespace-normal break-words">{s.command}</div>
+                return <CopyButton text={s.command} />
             },
         },
         {

src/routes/notification.tsx

@@ -1,6 +1,7 @@
 import { swrFetcher } from "@/api/api"
 import { deleteNotification } from "@/api/notification"
 import { ActionButtonGroup } from "@/components/action-button-group"
+import { CopyButton } from "@/components/copy-button"
 import { HeaderButtonGroup } from "@/components/header-button-group"
 import { NotificationTab } from "@/components/notification-tab"
 import { NotifierCard } from "@/components/notifier"
@@ -93,7 +94,7 @@ export default function NotificationPage() {
             accessorFn: (row) => row.url,
             cell: ({ row }) => {
                 const s = row.original
-                return <div className="max-w-64 whitespace-normal break-words">{s.url}</div>
+                return <CopyButton text={s.url} />
             },
         },
         {

src/routes/server.tsx

@@ -1,6 +1,7 @@
 import { swrFetcher } from "@/api/api"
 import { deleteServer, forceUpdateServer } from "@/api/server"
 import { ActionButtonGroup } from "@/components/action-button-group"
+import { CopyButton } from "@/components/copy-button"
 import { HeaderButtonGroup } from "@/components/header-button-group"
 import { InstallCommandsMenu } from "@/components/install-commands"
 import { NoteMenu } from "@/components/note-menu"
@@ -121,6 +122,14 @@ export default function ServerPage() {
                 return <NoteMenu note={{ private: s.note, public: s.public_note }} />
             },
         },
+        {
+            id: "uuid",
+            header: "UUID",
+            cell: ({ row }) => {
+                const s = row.original
+                return <CopyButton text={s.uuid} />
+            },
+        },
         {
             id: "actions",
             header: t("Actions"),