mirror of
https://github.com/Buriburizaem0n/admin-frontend-domain.git
synced 2026-09-19 09:40:13 +00:00
feat: server transfer rotation
This commit is contained in:
+1
-1
@@ -20,7 +20,7 @@ export default tseslint.config(
|
||||
rules: {
|
||||
...reactHooks.configs.recommended.rules,
|
||||
"@typescript-eslint/no-explicit-any": "off",
|
||||
"react-refresh/only-export-components": ["warn", { allowConstantExport: true }],
|
||||
"react-refresh/only-export-components": "off",
|
||||
indent: ["error", 4],
|
||||
},
|
||||
},
|
||||
|
||||
Generated
+1933
-20
File diff suppressed because it is too large
Load Diff
+6
-1
@@ -10,6 +10,7 @@
|
||||
"lint": "eslint .",
|
||||
"lint:fix": "eslint --fix .",
|
||||
"format": "prettier --write .",
|
||||
"test": "vitest run",
|
||||
"preview": "vite preview"
|
||||
},
|
||||
"dependencies": {
|
||||
@@ -65,6 +66,8 @@
|
||||
},
|
||||
"devDependencies": {
|
||||
"@eslint/js": "^9.37.0",
|
||||
"@testing-library/dom": "^10.4.1",
|
||||
"@testing-library/react": "^16.3.2",
|
||||
"@types/node": "^24.7.0",
|
||||
"@types/react": "^19.2.2",
|
||||
"@types/react-dom": "^19.2.1",
|
||||
@@ -74,11 +77,13 @@
|
||||
"eslint-plugin-react-hooks": "^7.0.0",
|
||||
"eslint-plugin-react-refresh": "^0.4.23",
|
||||
"globals": "^16.4.0",
|
||||
"jsdom": "^29.1.1",
|
||||
"postcss": "8.4.24",
|
||||
"swagger-typescript-api": "^13.2.15",
|
||||
"tailwindcss": "3.4.19",
|
||||
"typescript": "~5.9.3",
|
||||
"typescript-eslint": "^8.46.0",
|
||||
"vite": "^7.1.9"
|
||||
"vite": "^7.1.9",
|
||||
"vitest": "^4.1.7"
|
||||
}
|
||||
}
|
||||
|
||||
+11
-2
@@ -1,5 +1,6 @@
|
||||
import {
|
||||
ModelBatchMoveServerForm,
|
||||
ModelBatchMoveServerResult,
|
||||
ModelServer,
|
||||
ModelServerConfigForm,
|
||||
ModelServerForm,
|
||||
@@ -16,8 +17,16 @@ export const deleteServer = async (id: number[]): Promise<void> => {
|
||||
return fetcher<void>(FetcherMethod.POST, "/api/v1/batch-delete/server", id)
|
||||
}
|
||||
|
||||
export const batchMoveServer = async (data: ModelBatchMoveServerForm): Promise<void> => {
|
||||
return fetcher<void>(FetcherMethod.POST, "/api/v1/batch-move/server", data)
|
||||
// batchMoveServer kicks off one ServerTransfer per id and returns a per-id
|
||||
// result. The dashboard previously returned void from this endpoint; the new
|
||||
// response shape carries the transfer ID for callers that want to subscribe
|
||||
// to /ws/transfer for state changes, plus structured non-pending statuses
|
||||
// (permission_denied, already_transferring, server_not_found, same_owner)
|
||||
// that the UI can render without parsing prose error messages.
|
||||
export const batchMoveServer = async (
|
||||
data: ModelBatchMoveServerForm,
|
||||
): Promise<ModelBatchMoveServerResult[]> => {
|
||||
return fetcher<ModelBatchMoveServerResult[]>(FetcherMethod.POST, "/api/v1/batch-move/server", data)
|
||||
}
|
||||
|
||||
export const forceUpdateServer = async (id: number[]): Promise<ModelServerTaskResponse> => {
|
||||
|
||||
@@ -0,0 +1,15 @@
|
||||
import { ModelServerTransfer } from "@/types"
|
||||
|
||||
import { FetcherMethod, fetcher } from "./api"
|
||||
|
||||
export const getServerTransfers = async (): Promise<ModelServerTransfer[]> => {
|
||||
return fetcher<ModelServerTransfer[]>(FetcherMethod.GET, "/api/v1/transfer", null)
|
||||
}
|
||||
|
||||
export const cancelServerTransfer = async (id: number): Promise<ModelServerTransfer> => {
|
||||
return fetcher<ModelServerTransfer>(FetcherMethod.POST, `/api/v1/transfer/${id}/cancel`)
|
||||
}
|
||||
|
||||
export const retryServerTransfer = async (id: number): Promise<ModelServerTransfer> => {
|
||||
return fetcher<ModelServerTransfer>(FetcherMethod.POST, `/api/v1/transfer/${id}/retry`)
|
||||
}
|
||||
@@ -36,7 +36,7 @@ import { ModelAlertRule } from "@/types"
|
||||
import { triggerModes } from "@/types"
|
||||
import { zodResolver } from "@hookform/resolvers/zod"
|
||||
import { useEffect, useState } from "react"
|
||||
import { useForm } from "react-hook-form"
|
||||
import { useForm, useWatch } from "react-hook-form"
|
||||
import { useTranslation } from "react-i18next"
|
||||
import { toast } from "sonner"
|
||||
import { KeyedMutator } from "swr"
|
||||
@@ -50,13 +50,15 @@ interface AlertRuleCardProps {
|
||||
mutate: KeyedMutator<ModelAlertRule[]>
|
||||
}
|
||||
|
||||
const cycleUnitSchema = z.enum(["hour", "day", "week", "month", "year"])
|
||||
|
||||
const ruleSchema = z.object({
|
||||
type: z.string(),
|
||||
min: z.number().optional(),
|
||||
max: z.number().optional(),
|
||||
cycle_start: z.string().optional(),
|
||||
cycle_interval: z.number().optional(),
|
||||
cycle_unit: z.enum(["hour", "day", "week", "month", "year"]).optional(),
|
||||
cycle_unit: cycleUnitSchema.optional(),
|
||||
duration: z.number().optional(),
|
||||
cover: z.number().int().min(0),
|
||||
ignore: z.record(z.string(), z.boolean()).optional(),
|
||||
@@ -71,7 +73,7 @@ const alertRuleFormSchema = z.object({
|
||||
try {
|
||||
JSON.parse(val)
|
||||
return true
|
||||
} catch (e) {
|
||||
} catch {
|
||||
return false
|
||||
}
|
||||
},
|
||||
@@ -92,28 +94,30 @@ const alertRuleFormSchema = z.object({
|
||||
export const AlertRuleCard: React.FC<AlertRuleCardProps> = ({ data, mutate }) => {
|
||||
const { t } = useTranslation()
|
||||
|
||||
type AlertRuleFormData = z.infer<typeof alertRuleFormSchema>
|
||||
type AlertRuleEntry = z.output<typeof ruleSchema>
|
||||
type AlertRuleFormInput = z.input<typeof alertRuleFormSchema>
|
||||
type AlertRuleFormData = z.output<typeof alertRuleFormSchema>
|
||||
|
||||
const form = useForm({
|
||||
resolver: zodResolver(alertRuleFormSchema) as any,
|
||||
const form = useForm<AlertRuleFormInput, unknown, AlertRuleFormData>({
|
||||
resolver: zodResolver(alertRuleFormSchema),
|
||||
defaultValues: data
|
||||
? {
|
||||
...data,
|
||||
rules_raw: JSON.stringify(data.rules),
|
||||
fail_trigger_tasks_raw: conv.arrToStr(data.fail_trigger_tasks),
|
||||
recover_trigger_tasks_raw: conv.arrToStr(data.recover_trigger_tasks),
|
||||
}
|
||||
...data,
|
||||
rules_raw: JSON.stringify(data.rules),
|
||||
fail_trigger_tasks_raw: conv.arrToStr(data.fail_trigger_tasks),
|
||||
recover_trigger_tasks_raw: conv.arrToStr(data.recover_trigger_tasks),
|
||||
}
|
||||
: {
|
||||
name: "",
|
||||
rules_raw: "",
|
||||
rules: [],
|
||||
fail_trigger_tasks: [],
|
||||
fail_trigger_tasks_raw: "",
|
||||
recover_trigger_tasks: [],
|
||||
recover_trigger_tasks_raw: "",
|
||||
notification_group_id: 0,
|
||||
trigger_mode: 0,
|
||||
},
|
||||
name: "",
|
||||
rules_raw: "",
|
||||
rules: [],
|
||||
fail_trigger_tasks: [],
|
||||
fail_trigger_tasks_raw: "",
|
||||
recover_trigger_tasks: [],
|
||||
recover_trigger_tasks_raw: "",
|
||||
notification_group_id: 0,
|
||||
trigger_mode: 0,
|
||||
},
|
||||
resetOptions: {
|
||||
keepDefaultValues: false,
|
||||
},
|
||||
@@ -124,14 +128,16 @@ export const AlertRuleCard: React.FC<AlertRuleCardProps> = ({ data, mutate }) =>
|
||||
// 结构化规则编辑状态:从已有数据或 rules_raw 初始化
|
||||
const initialRules = (() => {
|
||||
try {
|
||||
if (data?.rules) return data.rules as any[]
|
||||
if (data?.rules) return data.rules
|
||||
const raw = form.getValues("rules_raw")
|
||||
return raw ? JSON.parse(raw) : []
|
||||
if (!raw) return []
|
||||
const parsed: unknown = JSON.parse(raw)
|
||||
return z.array(ruleSchema).parse(parsed)
|
||||
} catch {
|
||||
return []
|
||||
}
|
||||
})()
|
||||
const [rulesUI, setRulesUI] = useState<any[]>(initialRules)
|
||||
const [rulesUI, setRulesUI] = useState<AlertRuleEntry[]>(initialRules)
|
||||
|
||||
// 同步到 rules_raw(提交仍走 JSON 字符串)
|
||||
useEffect(() => {
|
||||
@@ -140,17 +146,22 @@ export const AlertRuleCard: React.FC<AlertRuleCardProps> = ({ data, mutate }) =>
|
||||
} catch {
|
||||
// ignore
|
||||
}
|
||||
}, [rulesUI])
|
||||
}, [form, rulesUI])
|
||||
|
||||
const rulesRaw = useWatch({ control: form.control, name: "rules_raw" })
|
||||
|
||||
const onSubmit = async (values: AlertRuleFormData) => {
|
||||
values.rules = JSON.parse(values.rules_raw)
|
||||
values.rules = z.array(ruleSchema).parse(JSON.parse(values.rules_raw))
|
||||
values.fail_trigger_tasks = conv.strToArr(values.fail_trigger_tasks_raw).map(Number)
|
||||
values.recover_trigger_tasks = conv.strToArr(values.recover_trigger_tasks_raw).map(Number)
|
||||
const { rules_raw, ...requiredFields } = values
|
||||
const requiredFields = { ...values }
|
||||
delete (requiredFields as Record<string, unknown>).rules_raw
|
||||
try {
|
||||
data?.id
|
||||
? await updateAlertRule(data.id, requiredFields)
|
||||
: await createAlertRule(requiredFields)
|
||||
if (data?.id) {
|
||||
await updateAlertRule(data.id, requiredFields)
|
||||
} else {
|
||||
await createAlertRule(requiredFields)
|
||||
}
|
||||
} catch (e) {
|
||||
console.error(e)
|
||||
toast(t("Error"), {
|
||||
@@ -185,7 +196,7 @@ export const AlertRuleCard: React.FC<AlertRuleCardProps> = ({ data, mutate }) =>
|
||||
</DialogHeader>
|
||||
<Form {...form}>
|
||||
<form
|
||||
onSubmit={form.handleSubmit(onSubmit as any)}
|
||||
onSubmit={form.handleSubmit(onSubmit)}
|
||||
className="space-y-2 my-2"
|
||||
>
|
||||
<FormField
|
||||
@@ -358,9 +369,9 @@ export const AlertRuleCard: React.FC<AlertRuleCardProps> = ({ data, mutate }) =>
|
||||
...next[idx],
|
||||
min: e.target.value
|
||||
? Number(
|
||||
e.target
|
||||
.value,
|
||||
)
|
||||
e.target
|
||||
.value,
|
||||
)
|
||||
: undefined,
|
||||
}
|
||||
setRulesUI(next)
|
||||
@@ -381,9 +392,9 @@ export const AlertRuleCard: React.FC<AlertRuleCardProps> = ({ data, mutate }) =>
|
||||
...next[idx],
|
||||
max: e.target.value
|
||||
? Number(
|
||||
e.target
|
||||
.value,
|
||||
)
|
||||
e.target
|
||||
.value,
|
||||
)
|
||||
: undefined,
|
||||
}
|
||||
setRulesUI(next)
|
||||
@@ -445,8 +456,8 @@ export const AlertRuleCard: React.FC<AlertRuleCardProps> = ({ data, mutate }) =>
|
||||
try {
|
||||
return r.ignore
|
||||
? JSON.stringify(
|
||||
r.ignore,
|
||||
)
|
||||
r.ignore,
|
||||
)
|
||||
: ""
|
||||
} catch {
|
||||
return ""
|
||||
@@ -457,8 +468,8 @@ export const AlertRuleCard: React.FC<AlertRuleCardProps> = ({ data, mutate }) =>
|
||||
try {
|
||||
const obj = e.target.value
|
||||
? JSON.parse(
|
||||
e.target.value,
|
||||
)
|
||||
e.target.value,
|
||||
)
|
||||
: undefined
|
||||
next[idx] = {
|
||||
...next[idx],
|
||||
@@ -512,9 +523,9 @@ export const AlertRuleCard: React.FC<AlertRuleCardProps> = ({ data, mutate }) =>
|
||||
cycle_interval: e.target
|
||||
.value
|
||||
? Number(
|
||||
e.target
|
||||
.value,
|
||||
)
|
||||
e.target
|
||||
.value,
|
||||
)
|
||||
: undefined,
|
||||
}
|
||||
setRulesUI(next)
|
||||
@@ -531,7 +542,10 @@ export const AlertRuleCard: React.FC<AlertRuleCardProps> = ({ data, mutate }) =>
|
||||
const next = [...rulesUI]
|
||||
next[idx] = {
|
||||
...next[idx],
|
||||
cycle_unit: val,
|
||||
cycle_unit:
|
||||
cycleUnitSchema.parse(
|
||||
val,
|
||||
),
|
||||
}
|
||||
setRulesUI(next)
|
||||
}}
|
||||
@@ -603,7 +617,7 @@ export const AlertRuleCard: React.FC<AlertRuleCardProps> = ({ data, mutate }) =>
|
||||
<FormControl>
|
||||
<Textarea
|
||||
className="resize-y"
|
||||
value={form.watch("rules_raw")}
|
||||
value={rulesRaw}
|
||||
onChange={(e) => {
|
||||
// 同步到结构化编辑器
|
||||
form.setValue("rules_raw", e.target.value, {
|
||||
@@ -630,7 +644,7 @@ export const AlertRuleCard: React.FC<AlertRuleCardProps> = ({ data, mutate }) =>
|
||||
placeholder={t("Search")}
|
||||
options={ngroupList}
|
||||
onValueChange={field.onChange}
|
||||
defaultValue={field.value.toString()}
|
||||
defaultValue={String(field.value ?? "")}
|
||||
/>
|
||||
</FormControl>
|
||||
<FormMessage />
|
||||
|
||||
@@ -33,8 +33,9 @@ export const BatchMoveServerIcon: React.FC<BatchMoveServerIconProps> = ({
|
||||
const [toUserId, setToUserId] = useState<number | undefined>(undefined)
|
||||
|
||||
const onSubmit = async () => {
|
||||
let results
|
||||
try {
|
||||
await batchMoveServer({
|
||||
results = await batchMoveServer({
|
||||
ids: serverIds,
|
||||
to_user: toUserId!,
|
||||
})
|
||||
@@ -45,7 +46,30 @@ export const BatchMoveServerIcon: React.FC<BatchMoveServerIconProps> = ({
|
||||
})
|
||||
return
|
||||
}
|
||||
toast(t("Done"))
|
||||
|
||||
// The backend now responds per-server; render a structured summary
|
||||
// instead of "Done" so the operator can see which ids hit a snag
|
||||
// (DisableCommandExecute / already_transferring / etc). Pending ids
|
||||
// remain async — watching /ws/transfer or the Transfers page will
|
||||
// surface their terminal state.
|
||||
const pending = results.filter((r) => r.status === "pending").length
|
||||
const denied = results.filter((r) => r.status === "permission_denied").length
|
||||
const dup = results.filter((r) => r.status === "already_transferring").length
|
||||
const missing = results.filter((r) => r.status === "server_not_found").length
|
||||
const same = results.filter((r) => r.status === "same_owner").length
|
||||
const tooOld = results.filter((r) => r.status === "agent_too_old").length
|
||||
|
||||
const parts: string[] = []
|
||||
if (pending) parts.push(t("Transfer.PendingCount", { count: pending }))
|
||||
if (denied) parts.push(t("Transfer.PermissionDeniedCount", { count: denied }))
|
||||
if (dup) parts.push(t("Transfer.AlreadyTransferringCount", { count: dup }))
|
||||
if (missing) parts.push(t("Transfer.ServerNotFoundCount", { count: missing }))
|
||||
if (same) parts.push(t("Transfer.SameOwnerCount", { count: same }))
|
||||
if (tooOld) parts.push(t("Transfer.AgentTooOldCount", { count: tooOld }))
|
||||
|
||||
toast(t("Transfer.BatchSubmitted"), {
|
||||
description: parts.join(" · ") || t("Done"),
|
||||
})
|
||||
setOpen(false)
|
||||
}
|
||||
|
||||
|
||||
+29
-24
@@ -63,33 +63,34 @@ const cronFormSchema = z.object({
|
||||
notification_group_id: z.coerce.number().int(),
|
||||
})
|
||||
|
||||
type CronFormData = z.infer<typeof cronFormSchema>
|
||||
type CronFormInput = z.input<typeof cronFormSchema>
|
||||
type CronFormData = z.output<typeof cronFormSchema>
|
||||
|
||||
export const CronCard: React.FC<CronCardProps> = ({ data, mutate }) => {
|
||||
const { t } = useTranslation()
|
||||
const form = useForm<CronFormData>({
|
||||
resolver: zodResolver(cronFormSchema as any),
|
||||
const form = useForm<CronFormInput, unknown, CronFormData>({
|
||||
resolver: zodResolver(cronFormSchema),
|
||||
defaultValues: data
|
||||
? {
|
||||
task_type: data.task_type ?? 0,
|
||||
name: data.name ?? "",
|
||||
scheduler: data.scheduler ?? "",
|
||||
command: (data as any).command ?? "",
|
||||
servers: data.servers ?? [],
|
||||
cover: data.cover ?? 0,
|
||||
push_successful: (data as any).push_successful ?? false,
|
||||
notification_group_id: data.notification_group_id ?? 0,
|
||||
}
|
||||
task_type: data.task_type ?? 0,
|
||||
name: data.name ?? "",
|
||||
scheduler: data.scheduler ?? "",
|
||||
command: data.command ?? "",
|
||||
servers: data.servers ?? [],
|
||||
cover: data.cover ?? 0,
|
||||
push_successful: data.push_successful ?? false,
|
||||
notification_group_id: data.notification_group_id ?? 0,
|
||||
}
|
||||
: {
|
||||
task_type: 0,
|
||||
name: "",
|
||||
scheduler: "",
|
||||
command: "",
|
||||
servers: [],
|
||||
cover: 0,
|
||||
push_successful: false,
|
||||
notification_group_id: 0,
|
||||
},
|
||||
task_type: 0,
|
||||
name: "",
|
||||
scheduler: "",
|
||||
command: "",
|
||||
servers: [],
|
||||
cover: 0,
|
||||
push_successful: false,
|
||||
notification_group_id: 0,
|
||||
},
|
||||
resetOptions: {
|
||||
keepDefaultValues: false,
|
||||
},
|
||||
@@ -99,7 +100,11 @@ export const CronCard: React.FC<CronCardProps> = ({ data, mutate }) => {
|
||||
|
||||
const onSubmit = async (values: CronFormData) => {
|
||||
try {
|
||||
data?.id ? await updateCron(data.id, values) : await createCron(values)
|
||||
if (data?.id) {
|
||||
await updateCron(data.id, values)
|
||||
} else {
|
||||
await createCron(values)
|
||||
}
|
||||
} catch (e) {
|
||||
console.error(e)
|
||||
toast(t("Error"), {
|
||||
@@ -267,7 +272,7 @@ export const CronCard: React.FC<CronCardProps> = ({ data, mutate }) => {
|
||||
placeholder="Search..."
|
||||
options={ngroupList}
|
||||
onValueChange={field.onChange}
|
||||
defaultValue={field.value.toString()}
|
||||
defaultValue={String(field.value ?? "")}
|
||||
/>
|
||||
</FormControl>
|
||||
<FormMessage />
|
||||
@@ -282,7 +287,7 @@ export const CronCard: React.FC<CronCardProps> = ({ data, mutate }) => {
|
||||
<FormControl>
|
||||
<div className="flex items-center gap-2">
|
||||
<Checkbox
|
||||
checked={field.value}
|
||||
checked={field.value === true}
|
||||
onCheckedChange={field.onChange}
|
||||
/>
|
||||
<Label className="text-sm">
|
||||
|
||||
+58
-45
@@ -67,45 +67,46 @@ const ddnsFormSchema = z.object({
|
||||
webhook_headers: asOptionalField(z.string()),
|
||||
})
|
||||
|
||||
type DDNSFormData = z.infer<typeof ddnsFormSchema>
|
||||
type DDNSFormInput = z.input<typeof ddnsFormSchema>
|
||||
type DDNSFormData = z.output<typeof ddnsFormSchema>
|
||||
|
||||
export const DDNSCard: React.FC<DDNSCardProps> = ({ data, providers, mutate }) => {
|
||||
const { t } = useTranslation()
|
||||
const form = useForm<DDNSFormData>({
|
||||
resolver: zodResolver(ddnsFormSchema as any),
|
||||
const form = useForm<DDNSFormInput, unknown, DDNSFormData>({
|
||||
resolver: zodResolver(ddnsFormSchema),
|
||||
defaultValues: data
|
||||
? {
|
||||
max_retries: data.max_retries ?? 3,
|
||||
enable_ipv4: (data as any).enable_ipv4 ?? false,
|
||||
enable_ipv6: (data as any).enable_ipv6 ?? false,
|
||||
name: data.name ?? "",
|
||||
provider: data.provider ?? "dummy",
|
||||
domains: data.domains ?? [],
|
||||
domains_raw: conv.arrToStr(data.domains ?? []),
|
||||
access_id: (data as any).access_id ?? "",
|
||||
access_secret: (data as any).access_secret ?? "",
|
||||
webhook_url: (data as any).webhook_url ?? "",
|
||||
webhook_method: (data as any).webhook_method,
|
||||
webhook_request_type: (data as any).webhook_request_type,
|
||||
webhook_request_body: (data as any).webhook_request_body ?? "",
|
||||
webhook_headers: (data as any).webhook_headers ?? "",
|
||||
}
|
||||
max_retries: data.max_retries ?? 3,
|
||||
enable_ipv4: data.enable_ipv4 ?? false,
|
||||
enable_ipv6: data.enable_ipv6 ?? false,
|
||||
name: data.name ?? "",
|
||||
provider: data.provider ?? "dummy",
|
||||
domains: data.domains ?? [],
|
||||
domains_raw: conv.arrToStr(data.domains ?? []),
|
||||
access_id: data.access_id ?? "",
|
||||
access_secret: data.access_secret ?? "",
|
||||
webhook_url: data.webhook_url ?? "",
|
||||
webhook_method: data.webhook_method,
|
||||
webhook_request_type: data.webhook_request_type,
|
||||
webhook_request_body: data.webhook_request_body ?? "",
|
||||
webhook_headers: data.webhook_headers ?? "",
|
||||
}
|
||||
: {
|
||||
max_retries: 3,
|
||||
enable_ipv4: false,
|
||||
enable_ipv6: false,
|
||||
name: "",
|
||||
provider: "dummy",
|
||||
domains: [],
|
||||
domains_raw: "",
|
||||
access_id: "",
|
||||
access_secret: "",
|
||||
webhook_url: "",
|
||||
webhook_method: undefined,
|
||||
webhook_request_type: undefined,
|
||||
webhook_request_body: "",
|
||||
webhook_headers: "",
|
||||
},
|
||||
max_retries: 3,
|
||||
enable_ipv4: false,
|
||||
enable_ipv6: false,
|
||||
name: "",
|
||||
provider: "dummy",
|
||||
domains: [],
|
||||
domains_raw: "",
|
||||
access_id: "",
|
||||
access_secret: "",
|
||||
webhook_url: "",
|
||||
webhook_method: undefined,
|
||||
webhook_request_type: undefined,
|
||||
webhook_request_body: "",
|
||||
webhook_headers: "",
|
||||
},
|
||||
resetOptions: {
|
||||
keepDefaultValues: false,
|
||||
},
|
||||
@@ -116,7 +117,11 @@ export const DDNSCard: React.FC<DDNSCardProps> = ({ data, providers, mutate }) =
|
||||
const onSubmit = async (values: DDNSFormData) => {
|
||||
try {
|
||||
values.domains = conv.strToArr(values.domains_raw)
|
||||
data?.id ? await updateDDNSProfile(data.id, values) : await createDDNSProfile(values)
|
||||
if (data?.id) {
|
||||
await updateDDNSProfile(data.id, values)
|
||||
} else {
|
||||
await createDDNSProfile(values)
|
||||
}
|
||||
} catch (e) {
|
||||
console.error(e)
|
||||
toast(t("Error"), {
|
||||
@@ -227,15 +232,23 @@ export const DDNSCard: React.FC<DDNSCardProps> = ({ data, providers, mutate }) =
|
||||
<FormField
|
||||
control={form.control}
|
||||
name="max_retries"
|
||||
render={({ field }) => (
|
||||
<FormItem>
|
||||
<FormLabel>{t("MaximumRetryAttempts")}</FormLabel>
|
||||
<FormControl>
|
||||
<Input type="number" placeholder="3" {...field} />
|
||||
</FormControl>
|
||||
<FormMessage />
|
||||
</FormItem>
|
||||
)}
|
||||
render={({ field }) => {
|
||||
const { value, ...fieldProps } = field
|
||||
return (
|
||||
<FormItem>
|
||||
<FormLabel>{t("MaximumRetryAttempts")}</FormLabel>
|
||||
<FormControl>
|
||||
<Input
|
||||
type="number"
|
||||
placeholder="3"
|
||||
value={String(value ?? "")}
|
||||
{...fieldProps}
|
||||
/>
|
||||
</FormControl>
|
||||
<FormMessage />
|
||||
</FormItem>
|
||||
)
|
||||
}}
|
||||
/>
|
||||
<FormField
|
||||
control={form.control}
|
||||
@@ -351,7 +364,7 @@ export const DDNSCard: React.FC<DDNSCardProps> = ({ data, providers, mutate }) =
|
||||
<FormControl>
|
||||
<div className="flex items-center gap-2">
|
||||
<Checkbox
|
||||
checked={field.value}
|
||||
checked={field.value === true}
|
||||
onCheckedChange={field.onChange}
|
||||
/>
|
||||
<Label className="text-sm">
|
||||
@@ -371,7 +384,7 @@ export const DDNSCard: React.FC<DDNSCardProps> = ({ data, providers, mutate }) =
|
||||
<FormControl>
|
||||
<div className="flex items-center gap-2">
|
||||
<Checkbox
|
||||
checked={field.value}
|
||||
checked={field.value === true}
|
||||
onCheckedChange={field.onChange}
|
||||
/>
|
||||
<Label className="text-sm">
|
||||
|
||||
+83
-72
@@ -37,7 +37,7 @@ import {
|
||||
import { ColumnDef } from "@tanstack/react-table"
|
||||
import { Row, flexRender } from "@tanstack/react-table"
|
||||
import { File, Folder } from "lucide-react"
|
||||
import { HTMLAttributes, JSX, useEffect, useRef, useState } from "react"
|
||||
import { HTMLAttributes, JSX, useCallback, useEffect, useRef, useState } from "react"
|
||||
import { useTranslation } from "react-i18next"
|
||||
import { toast } from "sonner"
|
||||
|
||||
@@ -59,6 +59,10 @@ interface FMProps {
|
||||
wsUrl: string
|
||||
}
|
||||
|
||||
type VirtualizedTableRowProps = HTMLAttributes<HTMLTableRowElement> & {
|
||||
"data-index"?: number | string
|
||||
}
|
||||
|
||||
const arraysEqual = (a: Uint8Array, b: Uint8Array) => {
|
||||
if (a.length !== b.length) return false
|
||||
for (let i = 0; i < a.length; i++) {
|
||||
@@ -67,16 +71,12 @@ const arraysEqual = (a: Uint8Array, b: Uint8Array) => {
|
||||
return true
|
||||
}
|
||||
|
||||
const FMComponent: React.FC<FMProps & JSX.IntrinsicElements["div"]> = ({ wsUrl, ...props }) => {
|
||||
export const FMComponent: React.FC<FMProps & JSX.IntrinsicElements["div"]> = ({ wsUrl, ...props }) => {
|
||||
const { t } = useTranslation()
|
||||
const fmRef = useRef<HTMLDivElement>(null)
|
||||
const wsRef = useRef<WebSocket | null>(null)
|
||||
|
||||
useEffect(() => {
|
||||
return () => {
|
||||
wsRef.current?.close()
|
||||
}
|
||||
}, [])
|
||||
const tRef = useRef(t)
|
||||
tRef.current = t
|
||||
|
||||
const [dOpen, setdOpen] = useState(false)
|
||||
const [uOpen, setuOpen] = useState(false)
|
||||
@@ -120,9 +120,8 @@ const FMComponent: React.FC<FMProps & JSX.IntrinsicElements["div"]> = ({ wsUrl,
|
||||
]
|
||||
|
||||
const tableRowComponent = (rows: Row<FMEntry>[]) =>
|
||||
function getTableRow(props: HTMLAttributes<HTMLTableRowElement>) {
|
||||
// @ts-expect-error data-index is a valid attribute
|
||||
const index = props["data-index"]
|
||||
function getTableRow(props: VirtualizedTableRowProps) {
|
||||
const index = Number(props["data-index"])
|
||||
const row = rows[index]
|
||||
|
||||
if (!row) return null
|
||||
@@ -160,6 +159,65 @@ const FMComponent: React.FC<FMProps & JSX.IntrinsicElements["div"]> = ({ wsUrl,
|
||||
}
|
||||
}
|
||||
|
||||
useEffect(() => {
|
||||
worker.onmessage = async (event: MessageEvent<FMWorkerData>) => {
|
||||
switch (event.data.type) {
|
||||
case FMWorkerOpcode.Error: {
|
||||
console.error("Error from worker", event.data.error)
|
||||
break
|
||||
}
|
||||
case FMWorkerOpcode.Progress: {
|
||||
handleReady.current = true
|
||||
break
|
||||
}
|
||||
case FMWorkerOpcode.Result: {
|
||||
handleReady.current = false
|
||||
|
||||
if (event.data.blob && event.data.fileName) {
|
||||
const url = URL.createObjectURL(event.data.blob)
|
||||
const anchor = document.createElement("a")
|
||||
anchor.href = url
|
||||
anchor.download = event.data.fileName
|
||||
anchor.click()
|
||||
URL.revokeObjectURL(url)
|
||||
}
|
||||
|
||||
firstChunk.current = true
|
||||
if (dOpen) setdOpen(false)
|
||||
break
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
const handleBeforeUnload = () => {
|
||||
worker.postMessage({
|
||||
operation: 3,
|
||||
})
|
||||
}
|
||||
|
||||
window.addEventListener("beforeunload", handleBeforeUnload)
|
||||
return () => {
|
||||
window.removeEventListener("beforeunload", handleBeforeUnload)
|
||||
}
|
||||
}, [dOpen])
|
||||
|
||||
const [currentPath, setPath] = useState("")
|
||||
const currentPathRef = useRef(currentPath)
|
||||
currentPathRef.current = currentPath
|
||||
|
||||
const listFile = useCallback(() => {
|
||||
const prefix = new Int8Array([FMOpcode.List])
|
||||
const pathMsg = new TextEncoder().encode(currentPathRef.current)
|
||||
|
||||
const msg = new Int8Array(prefix.length + pathMsg.length)
|
||||
msg.set(prefix)
|
||||
msg.set(pathMsg, prefix.length)
|
||||
|
||||
wsRef.current?.send(msg)
|
||||
}, [])
|
||||
|
||||
// The WebSocket initialization must not depend on listFile or currentPath,
|
||||
// otherwise navigating directories triggers a disconnect and reconnect.
|
||||
useEffect(() => {
|
||||
const url = new URL(wsUrl, window.location.origin)
|
||||
url.protocol = url.protocol.replace("http", "ws")
|
||||
@@ -174,8 +232,8 @@ const FMComponent: React.FC<FMProps & JSX.IntrinsicElements["div"]> = ({ wsUrl,
|
||||
}
|
||||
ws.onerror = (e) => {
|
||||
console.error(e)
|
||||
toast("Websocket" + " " + t("Error"), {
|
||||
description: t("Results.UnExpectedError"),
|
||||
toast("Websocket" + " " + tRef.current("Error"), {
|
||||
description: tRef.current("Results.UnExpectedError"),
|
||||
})
|
||||
}
|
||||
ws.onmessage = async (e: MessageEvent<ArrayBufferLike>) => {
|
||||
@@ -186,7 +244,6 @@ const FMComponent: React.FC<FMProps & JSX.IntrinsicElements["div"]> = ({ wsUrl,
|
||||
const errMsg = new TextDecoder("utf-8").decode(errBytes)
|
||||
throw new Error(errMsg)
|
||||
}
|
||||
|
||||
if (firstChunk.current) {
|
||||
if (arraysEqual(identifier, FMIdentifier.file)) {
|
||||
worker.postMessage({
|
||||
@@ -204,7 +261,7 @@ const FMComponent: React.FC<FMProps & JSX.IntrinsicElements["div"]> = ({ wsUrl,
|
||||
setuOpen(false)
|
||||
listFile()
|
||||
} else {
|
||||
throw new Error(t("Results.UnknownIdentifier"))
|
||||
throw new Error(tRef.current("Results.UnknownIdentifier"))
|
||||
}
|
||||
} else {
|
||||
await waitForHandleReady()
|
||||
@@ -216,74 +273,27 @@ const FMComponent: React.FC<FMProps & JSX.IntrinsicElements["div"]> = ({ wsUrl,
|
||||
}
|
||||
} catch (error) {
|
||||
console.error("Error processing received data:", error)
|
||||
toast("FM" + " " + t("Error"), {
|
||||
description: t("Results.UnExpectedError"),
|
||||
toast("FM" + " " + tRef.current("Error"), {
|
||||
description: tRef.current("Results.UnExpectedError"),
|
||||
})
|
||||
setdOpen(false)
|
||||
setuOpen(false)
|
||||
}
|
||||
}
|
||||
}, [wsUrl])
|
||||
|
||||
useEffect(() => {
|
||||
worker.onmessage = async (event: MessageEvent<FMWorkerData>) => {
|
||||
switch (event.data.type) {
|
||||
case FMWorkerOpcode.Error: {
|
||||
console.error("Error from worker", event.data.error)
|
||||
break
|
||||
}
|
||||
case FMWorkerOpcode.Progress: {
|
||||
handleReady.current = true
|
||||
break
|
||||
}
|
||||
case FMWorkerOpcode.Result: {
|
||||
handleReady.current = false
|
||||
|
||||
if (event.data.blob && event.data.fileName) {
|
||||
const url = URL.createObjectURL(event.data.blob)
|
||||
const anchor = document.createElement("a")
|
||||
anchor.href = url
|
||||
anchor.download = event.data.fileName
|
||||
anchor.click()
|
||||
URL.revokeObjectURL(url)
|
||||
}
|
||||
|
||||
firstChunk.current = true
|
||||
if (dOpen) setdOpen(false)
|
||||
break
|
||||
}
|
||||
return () => {
|
||||
ws.close()
|
||||
if (wsRef.current === ws) {
|
||||
wsRef.current = null
|
||||
}
|
||||
}
|
||||
}, [listFile, wsUrl])
|
||||
|
||||
const handleBeforeUnload = () => {
|
||||
worker.postMessage({
|
||||
operation: 3,
|
||||
})
|
||||
}
|
||||
|
||||
window.addEventListener("beforeunload", handleBeforeUnload)
|
||||
return () => {
|
||||
window.removeEventListener("beforeunload", handleBeforeUnload)
|
||||
}
|
||||
}, [worker, dOpen])
|
||||
|
||||
const [currentPath, setPath] = useState("")
|
||||
useEffect(() => {
|
||||
if (wsRef.current && wsRef.current.readyState === WebSocket.OPEN) {
|
||||
listFile()
|
||||
}
|
||||
}, [wsRef.current, currentPath])
|
||||
|
||||
const listFile = () => {
|
||||
const prefix = new Int8Array([FMOpcode.List])
|
||||
const pathMsg = new TextEncoder().encode(currentPath)
|
||||
|
||||
const msg = new Int8Array(prefix.length + pathMsg.length)
|
||||
msg.set(prefix)
|
||||
msg.set(pathMsg, prefix.length)
|
||||
|
||||
wsRef.current?.send(msg)
|
||||
}
|
||||
}, [currentPath, listFile])
|
||||
|
||||
const downloadFile = (basename: string) => {
|
||||
currentBasename.current = basename
|
||||
@@ -331,9 +341,10 @@ const FMComponent: React.FC<FMProps & JSX.IntrinsicElements["div"]> = ({ wsUrl,
|
||||
onClick={async () => {
|
||||
try {
|
||||
await copyToClipboard(formatPath(currentPath))
|
||||
} catch (error: any) {
|
||||
} catch (error) {
|
||||
const description = error instanceof Error ? error.message : t("Results.UnExpectedError")
|
||||
toast("FM" + " " + t("Error"), {
|
||||
description: error.message,
|
||||
description,
|
||||
})
|
||||
console.error("copy error: ", error)
|
||||
}
|
||||
|
||||
@@ -49,6 +49,7 @@ const pages = [
|
||||
{ href: "/dashboard/ddns", label: i18next.t("DDNS") },
|
||||
{ href: "/dashboard/nat", label: i18next.t("NATT") },
|
||||
{ href: "/dashboard/server-group", label: i18next.t("Group") },
|
||||
{ href: "/dashboard/transfer", label: i18next.t("Transfer.Title") },
|
||||
]
|
||||
|
||||
export default function Header() {
|
||||
@@ -248,6 +249,15 @@ export default function Header() {
|
||||
<Link to="/dashboard/server-group">{t("Group")}</Link>
|
||||
</NzNavigationMenuLink>
|
||||
</NavigationMenuItem>
|
||||
<NavigationMenuItem>
|
||||
<NzNavigationMenuLink
|
||||
asChild
|
||||
active={location.pathname === "/dashboard/transfer"}
|
||||
className={navigationMenuTriggerStyle()}
|
||||
>
|
||||
<Link to="/dashboard/transfer">{t("Transfer.Title")}</Link>
|
||||
</NzNavigationMenuLink>
|
||||
</NavigationMenuItem>
|
||||
</>
|
||||
)}
|
||||
</div>
|
||||
@@ -385,8 +395,7 @@ const useInterval = (callback: () => void, delay?: number | null) => {
|
||||
function Overview() {
|
||||
const { t } = useTranslation()
|
||||
const profile = useMainStore((store) => store.profile)
|
||||
const timeOption = DateTime.TIME_SIMPLE
|
||||
timeOption.hour12 = true
|
||||
const timeOption = { ...DateTime.TIME_SIMPLE, hour12: true }
|
||||
const [timeString, setTimeString] = useState(
|
||||
DateTime.now().setLocale("en-US").toLocaleString(timeOption),
|
||||
)
|
||||
|
||||
@@ -146,23 +146,23 @@ const generateCommand = (
|
||||
const env = envParts.join(" ")
|
||||
|
||||
const envWinParts = [
|
||||
`$env:NZ_SERVER=\"${install_host}\";`,
|
||||
`$env:NZ_TLS=\"${tls || false}\";`,
|
||||
`$env:NZ_CLIENT_SECRET=\"${agent_secret}\";`,
|
||||
`$env:NZ_SERVER="${install_host}";`,
|
||||
`$env:NZ_TLS="${tls || false}";`,
|
||||
`$env:NZ_CLIENT_SECRET="${agent_secret}";`,
|
||||
]
|
||||
if (uuid) envWinParts.push(`$env:NZ_UUID=\"${uuid}\";`)
|
||||
if (uuid) envWinParts.push(`$env:NZ_UUID="${uuid}";`)
|
||||
const env_win = envWinParts.join("")
|
||||
|
||||
switch (type) {
|
||||
case OSTypes.Linux:
|
||||
case OSTypes.macOS: {
|
||||
return `curl -L https://raw.githubusercontent.com/nezhahq/scripts/main/agent/install.sh -o agent.sh && chmod +x agent.sh && env ${env} ./agent.sh`
|
||||
}
|
||||
case OSTypes.Windows: {
|
||||
return `${env_win} [Net.ServicePointManager]::SecurityProtocol = [Net.SecurityProtocolType]::Ssl3 -bor [Net.SecurityProtocolType]::Tls -bor [Net.SecurityProtocolType]::Tls11 -bor [Net.SecurityProtocolType]::Tls12;set-ExecutionPolicy RemoteSigned;Invoke-WebRequest https://raw.githubusercontent.com/nezhahq/scripts/main/agent/install.ps1 -OutFile C:\install.ps1;powershell.exe C:\install.ps1`
|
||||
}
|
||||
default: {
|
||||
throw new Error(`Unknown OS: ${type}`)
|
||||
}
|
||||
case OSTypes.Linux:
|
||||
case OSTypes.macOS: {
|
||||
return `curl -L https://raw.githubusercontent.com/nezhahq/scripts/main/agent/install.sh -o agent.sh && chmod +x agent.sh && env ${env} ./agent.sh`
|
||||
}
|
||||
case OSTypes.Windows: {
|
||||
return `${env_win} [Net.ServicePointManager]::SecurityProtocol = [Net.SecurityProtocolType]::Ssl3 -bor [Net.SecurityProtocolType]::Tls -bor [Net.SecurityProtocolType]::Tls11 -bor [Net.SecurityProtocolType]::Tls12;set-ExecutionPolicy RemoteSigned;Invoke-WebRequest https://raw.githubusercontent.com/nezhahq/scripts/main/agent/install.ps1 -OutFile C:\\install.ps1;powershell.exe C:\\install.ps1`
|
||||
}
|
||||
default: {
|
||||
throw new Error(`Unknown OS: ${type}`)
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
+39
-26
@@ -46,27 +46,28 @@ const natFormSchema = z.object({
|
||||
domain: z.string(),
|
||||
})
|
||||
|
||||
type NatFormData = z.infer<typeof natFormSchema>
|
||||
type NatFormInput = z.input<typeof natFormSchema>
|
||||
type NatFormData = z.output<typeof natFormSchema>
|
||||
|
||||
export const NATCard: React.FC<NATCardProps> = ({ data, mutate }) => {
|
||||
const { t } = useTranslation()
|
||||
const form = useForm<NatFormData>({
|
||||
resolver: zodResolver(natFormSchema as any),
|
||||
const form = useForm<NatFormInput, unknown, NatFormData>({
|
||||
resolver: zodResolver(natFormSchema),
|
||||
defaultValues: data
|
||||
? {
|
||||
name: data.name ?? "",
|
||||
enabled: (data as any).enabled ?? false,
|
||||
server_id: data.server_id ?? 0,
|
||||
host: data.host ?? "",
|
||||
domain: data.domain ?? "",
|
||||
}
|
||||
name: data.name ?? "",
|
||||
enabled: data.enabled ?? false,
|
||||
server_id: data.server_id ?? 0,
|
||||
host: data.host ?? "",
|
||||
domain: data.domain ?? "",
|
||||
}
|
||||
: {
|
||||
name: "",
|
||||
enabled: false,
|
||||
server_id: 0,
|
||||
host: "",
|
||||
domain: "",
|
||||
},
|
||||
name: "",
|
||||
enabled: false,
|
||||
server_id: 0,
|
||||
host: "",
|
||||
domain: "",
|
||||
},
|
||||
resetOptions: {
|
||||
keepDefaultValues: false,
|
||||
},
|
||||
@@ -76,7 +77,11 @@ export const NATCard: React.FC<NATCardProps> = ({ data, mutate }) => {
|
||||
|
||||
const onSubmit = async (values: NatFormData) => {
|
||||
try {
|
||||
data?.id ? await updateNAT(data.id, values) : await createNAT(values)
|
||||
if (data?.id) {
|
||||
await updateNAT(data.id, values)
|
||||
} else {
|
||||
await createNAT(values)
|
||||
}
|
||||
} catch (e) {
|
||||
console.error(e)
|
||||
toast(t("Error"), {
|
||||
@@ -119,15 +124,23 @@ export const NATCard: React.FC<NATCardProps> = ({ data, mutate }) => {
|
||||
<FormField
|
||||
control={form.control}
|
||||
name="server_id"
|
||||
render={({ field }) => (
|
||||
<FormItem>
|
||||
<FormLabel>{t("Server")} ID</FormLabel>
|
||||
<FormControl>
|
||||
<Input type="number" placeholder="1" {...field} />
|
||||
</FormControl>
|
||||
<FormMessage />
|
||||
</FormItem>
|
||||
)}
|
||||
render={({ field }) => {
|
||||
const { value, ...fieldProps } = field
|
||||
return (
|
||||
<FormItem>
|
||||
<FormLabel>{t("Server")} ID</FormLabel>
|
||||
<FormControl>
|
||||
<Input
|
||||
type="number"
|
||||
placeholder="1"
|
||||
value={String(value ?? "")}
|
||||
{...fieldProps}
|
||||
/>
|
||||
</FormControl>
|
||||
<FormMessage />
|
||||
</FormItem>
|
||||
)
|
||||
}}
|
||||
/>
|
||||
<FormField
|
||||
control={form.control}
|
||||
@@ -169,7 +182,7 @@ export const NATCard: React.FC<NATCardProps> = ({ data, mutate }) => {
|
||||
<FormControl>
|
||||
<div className="flex items-center gap-2">
|
||||
<Checkbox
|
||||
checked={field.value}
|
||||
checked={field.value === true}
|
||||
onCheckedChange={field.onChange}
|
||||
/>
|
||||
<Label className="text-sm">{t("Enable")}</Label>
|
||||
|
||||
@@ -48,13 +48,13 @@ export const NotificationGroupCard: React.FC<NotificationGroupCardProps> = ({ da
|
||||
resolver: zodResolver(notificationGroupFormSchema),
|
||||
defaultValues: data
|
||||
? {
|
||||
name: data.group.name,
|
||||
notifications: data.notifications,
|
||||
}
|
||||
name: data.group.name,
|
||||
notifications: data.notifications,
|
||||
}
|
||||
: {
|
||||
name: "",
|
||||
notifications: [],
|
||||
},
|
||||
name: "",
|
||||
notifications: [],
|
||||
},
|
||||
resetOptions: {
|
||||
keepDefaultValues: false,
|
||||
},
|
||||
@@ -64,9 +64,11 @@ export const NotificationGroupCard: React.FC<NotificationGroupCardProps> = ({ da
|
||||
|
||||
const onSubmit = async (values: z.infer<typeof notificationGroupFormSchema>) => {
|
||||
try {
|
||||
data?.group.id
|
||||
? await updateNotificationGroup(data.group.id, values)
|
||||
: await createNotificationGroup(values)
|
||||
if (data?.group.id) {
|
||||
await updateNotificationGroup(data.group.id, values)
|
||||
} else {
|
||||
await createNotificationGroup(values)
|
||||
}
|
||||
} catch (e) {
|
||||
console.error(e)
|
||||
toast(t("Error"), {
|
||||
|
||||
+36
-29
@@ -62,33 +62,36 @@ const notificationFormSchema = z.object({
|
||||
|
||||
export const NotifierCard: React.FC<NotifierCardProps> = ({ data, mutate }) => {
|
||||
const { t } = useTranslation()
|
||||
type notificationFormData = z.infer<typeof notificationFormSchema>
|
||||
type NotificationFormInput = z.input<typeof notificationFormSchema>
|
||||
type NotificationFormData = z.output<typeof notificationFormSchema>
|
||||
type NotificationDefaults = ModelNotification & Partial<Pick<NotificationFormData, "skip_check">>
|
||||
const notificationDefaults: NotificationDefaults | undefined = data
|
||||
|
||||
const form = useForm({
|
||||
resolver: zodResolver(notificationFormSchema) as any,
|
||||
const form = useForm<NotificationFormInput, unknown, NotificationFormData>({
|
||||
resolver: zodResolver(notificationFormSchema),
|
||||
defaultValues: data
|
||||
? {
|
||||
name: data.name ?? "",
|
||||
url: data.url ?? "",
|
||||
request_method: data.request_method ?? 1,
|
||||
request_type: data.request_type ?? 1,
|
||||
request_header: data.request_header ?? "",
|
||||
request_body: data.request_body ?? "",
|
||||
verify_tls: (data as any).verify_tls ?? false,
|
||||
skip_check: (data as any).skip_check ?? false,
|
||||
format_metric_units: (data as any).format_metric_units ?? false,
|
||||
}
|
||||
name: data.name ?? "",
|
||||
url: data.url ?? "",
|
||||
request_method: data.request_method ?? 1,
|
||||
request_type: data.request_type ?? 1,
|
||||
request_header: data.request_header ?? "",
|
||||
request_body: data.request_body ?? "",
|
||||
verify_tls: data.verify_tls ?? false,
|
||||
skip_check: notificationDefaults?.skip_check ?? false,
|
||||
format_metric_units: data.format_metric_units ?? false,
|
||||
}
|
||||
: {
|
||||
name: "",
|
||||
url: "",
|
||||
request_method: 1,
|
||||
request_type: 1,
|
||||
request_header: "",
|
||||
request_body: "",
|
||||
verify_tls: false,
|
||||
skip_check: false,
|
||||
format_metric_units: false,
|
||||
},
|
||||
name: "",
|
||||
url: "",
|
||||
request_method: 1,
|
||||
request_type: 1,
|
||||
request_header: "",
|
||||
request_body: "",
|
||||
verify_tls: false,
|
||||
skip_check: false,
|
||||
format_metric_units: false,
|
||||
},
|
||||
resetOptions: {
|
||||
keepDefaultValues: false,
|
||||
},
|
||||
@@ -96,9 +99,13 @@ export const NotifierCard: React.FC<NotifierCardProps> = ({ data, mutate }) => {
|
||||
|
||||
const [open, setOpen] = useState(false)
|
||||
|
||||
const onSubmit = async (values: notificationFormData) => {
|
||||
const onSubmit = async (values: NotificationFormData) => {
|
||||
try {
|
||||
data?.id ? await updateNotification(data.id, values) : await createNotification(values)
|
||||
if (data?.id) {
|
||||
await updateNotification(data.id, values)
|
||||
} else {
|
||||
await createNotification(values)
|
||||
}
|
||||
} catch (e) {
|
||||
console.error(e)
|
||||
toast(t("Error"), {
|
||||
@@ -127,7 +134,7 @@ export const NotifierCard: React.FC<NotifierCardProps> = ({ data, mutate }) => {
|
||||
</DialogHeader>
|
||||
<Form {...form}>
|
||||
<form
|
||||
onSubmit={form.handleSubmit(onSubmit as any)}
|
||||
onSubmit={form.handleSubmit(onSubmit)}
|
||||
className="space-y-2 my-2"
|
||||
>
|
||||
<FormField
|
||||
@@ -254,7 +261,7 @@ export const NotifierCard: React.FC<NotifierCardProps> = ({ data, mutate }) => {
|
||||
<FormControl>
|
||||
<div className="flex items-center gap-2">
|
||||
<Checkbox
|
||||
checked={field.value}
|
||||
checked={field.value === true}
|
||||
onCheckedChange={field.onChange}
|
||||
/>
|
||||
<Label className="text-sm">
|
||||
@@ -274,7 +281,7 @@ export const NotifierCard: React.FC<NotifierCardProps> = ({ data, mutate }) => {
|
||||
<FormControl>
|
||||
<div className="flex items-center gap-2">
|
||||
<Checkbox
|
||||
checked={field.value}
|
||||
checked={field.value === true}
|
||||
onCheckedChange={field.onChange}
|
||||
/>
|
||||
<Label className="text-sm">
|
||||
@@ -294,7 +301,7 @@ export const NotifierCard: React.FC<NotifierCardProps> = ({ data, mutate }) => {
|
||||
<FormControl>
|
||||
<div className="flex items-center gap-2">
|
||||
<Checkbox
|
||||
checked={field.value}
|
||||
checked={field.value === true}
|
||||
onCheckedChange={field.onChange}
|
||||
/>
|
||||
<Label className="text-sm">
|
||||
|
||||
@@ -49,7 +49,7 @@ const agentConfigSchema = z.object({
|
||||
try {
|
||||
JSON.parse(val)
|
||||
return true
|
||||
} catch (e) {
|
||||
} catch {
|
||||
return false
|
||||
}
|
||||
},
|
||||
@@ -66,7 +66,7 @@ const agentConfigSchema = z.object({
|
||||
try {
|
||||
JSON.parse(val)
|
||||
return true
|
||||
} catch (e) {
|
||||
} catch {
|
||||
return false
|
||||
}
|
||||
},
|
||||
@@ -129,7 +129,7 @@ export const ServerConfigCard = ({ sid, menuItem = false, ...props }: ServerConf
|
||||
}
|
||||
}
|
||||
if (open) fetchData()
|
||||
}, [open])
|
||||
}, [open, sid, t])
|
||||
|
||||
const form = useForm({
|
||||
resolver: zodResolver(agentConfigSchema) as any,
|
||||
|
||||
@@ -48,13 +48,13 @@ export const ServerGroupCard: React.FC<ServerGroupCardProps> = ({ data, mutate }
|
||||
resolver: zodResolver(serverGroupFormSchema),
|
||||
defaultValues: data
|
||||
? {
|
||||
name: data.group.name,
|
||||
servers: data.servers,
|
||||
}
|
||||
name: data.group.name,
|
||||
servers: data.servers,
|
||||
}
|
||||
: {
|
||||
name: "",
|
||||
servers: [],
|
||||
},
|
||||
name: "",
|
||||
servers: [],
|
||||
},
|
||||
resetOptions: {
|
||||
keepDefaultValues: false,
|
||||
},
|
||||
@@ -64,9 +64,11 @@ export const ServerGroupCard: React.FC<ServerGroupCardProps> = ({ data, mutate }
|
||||
|
||||
const onSubmit = async (values: z.infer<typeof serverGroupFormSchema>) => {
|
||||
try {
|
||||
data?.group.id
|
||||
? await updateServerGroup(data.group.id, values)
|
||||
: await createServerGroup(values)
|
||||
if (data?.group.id) {
|
||||
await updateServerGroup(data.group.id, values)
|
||||
} else {
|
||||
await createServerGroup(values)
|
||||
}
|
||||
} catch (e) {
|
||||
console.error(e)
|
||||
toast(t("Error"), {
|
||||
|
||||
+12
-11
@@ -51,7 +51,7 @@ import { ModelServer } from "@/types"
|
||||
import { zodResolver } from "@hookform/resolvers/zod"
|
||||
import { HelpCircle } from "lucide-react"
|
||||
import { useState } from "react"
|
||||
import { useForm } from "react-hook-form"
|
||||
import { useForm, useWatch } from "react-hook-form"
|
||||
import { useTranslation } from "react-i18next"
|
||||
import { toast } from "sonner"
|
||||
import { KeyedMutator } from "swr"
|
||||
@@ -94,7 +94,7 @@ const serverFormSchema = z.object({
|
||||
try {
|
||||
JSON.parse(val)
|
||||
return true
|
||||
} catch (e) {
|
||||
} catch {
|
||||
return false
|
||||
}
|
||||
},
|
||||
@@ -120,6 +120,7 @@ export const ServerCard: React.FC<ServerCardProps> = ({ data, mutate }) => {
|
||||
keepDefaultValues: false,
|
||||
},
|
||||
})
|
||||
const enableDDNS = useWatch({ control: form.control, name: "enable_ddns" })
|
||||
|
||||
const [open, setOpen] = useState(false)
|
||||
|
||||
@@ -278,7 +279,7 @@ export const ServerCard: React.FC<ServerCardProps> = ({ data, mutate }) => {
|
||||
</FormItem>
|
||||
)}
|
||||
/>
|
||||
{form.watch("enable_ddns") ? (
|
||||
{enableDDNS ? (
|
||||
<>
|
||||
<FormField
|
||||
control={form.control}
|
||||
@@ -467,7 +468,7 @@ export const ServerCard: React.FC<ServerCardProps> = ({ data, mutate }) => {
|
||||
?.startDate
|
||||
? new Date(
|
||||
publicNoteObj.billingDataMod!.startDate!,
|
||||
).toLocaleDateString()
|
||||
).toLocaleDateString()
|
||||
: "YYYY-MM-DD"}
|
||||
</Button>
|
||||
</PopoverTrigger>
|
||||
@@ -492,7 +493,7 @@ export const ServerCard: React.FC<ServerCardProps> = ({ data, mutate }) => {
|
||||
?.startDate
|
||||
? new Date(
|
||||
publicNoteObj.billingDataMod!.startDate!,
|
||||
)
|
||||
)
|
||||
: undefined
|
||||
}
|
||||
onSelect={(d) => {
|
||||
@@ -559,17 +560,17 @@ export const ServerCard: React.FC<ServerCardProps> = ({ data, mutate }) => {
|
||||
{publicNoteObj.billingDataMod
|
||||
?.endDate
|
||||
? publicNoteObj
|
||||
.billingDataMod
|
||||
?.endDate ===
|
||||
.billingDataMod
|
||||
?.endDate ===
|
||||
"0000-00-00T23:59:59+08:00"
|
||||
? t(
|
||||
"PublicNote.NoExpiry",
|
||||
)
|
||||
"PublicNote.NoExpiry",
|
||||
)
|
||||
: new Date(
|
||||
publicNoteObj
|
||||
.billingDataMod
|
||||
?.endDate as string,
|
||||
).toLocaleDateString()
|
||||
).toLocaleDateString()
|
||||
: "YYYY-MM-DD"}
|
||||
</Button>
|
||||
</PopoverTrigger>
|
||||
@@ -600,7 +601,7 @@ export const ServerCard: React.FC<ServerCardProps> = ({ data, mutate }) => {
|
||||
publicNoteObj
|
||||
.billingDataMod
|
||||
?.endDate as string,
|
||||
)
|
||||
)
|
||||
: undefined
|
||||
}
|
||||
onSelect={(d) => {
|
||||
|
||||
+28
-25
@@ -80,28 +80,28 @@ export const ServiceCard: React.FC<ServiceCardProps> = ({ data, mutate }) => {
|
||||
resolver: zodResolver(serviceFormSchema) as any,
|
||||
defaultValues: data
|
||||
? {
|
||||
...data,
|
||||
fail_trigger_tasks_raw: conv.arrToStr(data.fail_trigger_tasks),
|
||||
recover_trigger_tasks_raw: conv.arrToStr(data.recover_trigger_tasks),
|
||||
skip_servers_raw: conv.recordToStrArr(data.skip_servers ? data.skip_servers : {}),
|
||||
}
|
||||
...data,
|
||||
fail_trigger_tasks_raw: conv.arrToStr(data.fail_trigger_tasks),
|
||||
recover_trigger_tasks_raw: conv.arrToStr(data.recover_trigger_tasks),
|
||||
skip_servers_raw: conv.recordToStrArr(data.skip_servers ? data.skip_servers : {}),
|
||||
}
|
||||
: {
|
||||
type: 1,
|
||||
cover: 0,
|
||||
display_index: 0,
|
||||
name: "",
|
||||
target: "",
|
||||
max_latency: 0.0,
|
||||
min_latency: 0.0,
|
||||
duration: 30,
|
||||
notification_group_id: 0,
|
||||
fail_trigger_tasks: [],
|
||||
fail_trigger_tasks_raw: "",
|
||||
recover_trigger_tasks: [],
|
||||
recover_trigger_tasks_raw: "",
|
||||
skip_servers: {},
|
||||
skip_servers_raw: [],
|
||||
},
|
||||
type: 1,
|
||||
cover: 0,
|
||||
display_index: 0,
|
||||
name: "",
|
||||
target: "",
|
||||
max_latency: 0.0,
|
||||
min_latency: 0.0,
|
||||
duration: 30,
|
||||
notification_group_id: 0,
|
||||
fail_trigger_tasks: [],
|
||||
fail_trigger_tasks_raw: "",
|
||||
recover_trigger_tasks: [],
|
||||
recover_trigger_tasks_raw: "",
|
||||
skip_servers: {},
|
||||
skip_servers_raw: [],
|
||||
},
|
||||
resetOptions: {
|
||||
keepDefaultValues: false,
|
||||
},
|
||||
@@ -113,11 +113,14 @@ export const ServiceCard: React.FC<ServiceCardProps> = ({ data, mutate }) => {
|
||||
values.skip_servers = conv.arrToRecord(values.skip_servers_raw)
|
||||
values.fail_trigger_tasks = conv.strToArr(values.fail_trigger_tasks_raw).map(Number)
|
||||
values.recover_trigger_tasks = conv.strToArr(values.recover_trigger_tasks_raw).map(Number)
|
||||
const { skip_servers_raw, ...requiredFields } = values
|
||||
const requiredFields = { ...values }
|
||||
delete (requiredFields as Record<string, unknown>).skip_servers_raw
|
||||
try {
|
||||
data?.id
|
||||
? await updateService(data.id, requiredFields)
|
||||
: await createService(requiredFields)
|
||||
if (data?.id) {
|
||||
await updateService(data.id, requiredFields)
|
||||
} else {
|
||||
await createService(requiredFields)
|
||||
}
|
||||
} catch (e) {
|
||||
console.error(e)
|
||||
toast(t("Error"), {
|
||||
|
||||
+56
-47
@@ -14,7 +14,15 @@ import { FitAddon } from "@xterm/addon-fit"
|
||||
import { Terminal } from "@xterm/xterm"
|
||||
import "@xterm/xterm/css/xterm.css"
|
||||
import { Terminal as TerminalIcon } from "lucide-react"
|
||||
import { JSX, forwardRef, useEffect, useImperativeHandle, useRef, useState } from "react"
|
||||
import {
|
||||
JSX,
|
||||
forwardRef,
|
||||
useCallback,
|
||||
useEffect,
|
||||
useImperativeHandle,
|
||||
useRef,
|
||||
useState,
|
||||
} from "react"
|
||||
import { useTranslation } from "react-i18next"
|
||||
import { useParams } from "react-router-dom"
|
||||
import { toast } from "sonner"
|
||||
@@ -28,7 +36,7 @@ interface XtermProps {
|
||||
setClose: React.Dispatch<React.SetStateAction<boolean>>
|
||||
}
|
||||
|
||||
const XtermComponent = forwardRef<HTMLDivElement, XtermProps & JSX.IntrinsicElements["div"]>(
|
||||
export const XtermComponent = forwardRef<HTMLDivElement, XtermProps & JSX.IntrinsicElements["div"]>(
|
||||
({ wsUrl, setClose, ...props }, ref) => {
|
||||
const terminalIdRef = useRef<HTMLDivElement>(null)
|
||||
const terminalRef = useRef<Terminal | null>(null)
|
||||
@@ -43,42 +51,10 @@ const XtermComponent = forwardRef<HTMLDivElement, XtermProps & JSX.IntrinsicElem
|
||||
}
|
||||
}, [])
|
||||
|
||||
useEffect(() => {
|
||||
return () => {
|
||||
wsRef.current?.close()
|
||||
terminalRef.current?.dispose()
|
||||
}
|
||||
}, [])
|
||||
|
||||
useEffect(() => {
|
||||
terminalRef.current = new Terminal({
|
||||
cursorBlink: true,
|
||||
fontSize: 16,
|
||||
})
|
||||
const url = new URL(wsUrl, window.location.origin)
|
||||
url.protocol = url.protocol.replace("http", "ws")
|
||||
const ws = new WebSocket(url)
|
||||
wsRef.current = ws
|
||||
ws.binaryType = "arraybuffer"
|
||||
ws.onopen = () => {
|
||||
onResize()
|
||||
}
|
||||
ws.onclose = () => {
|
||||
terminalRef.current?.dispose()
|
||||
setClose(true)
|
||||
}
|
||||
ws.onerror = (e) => {
|
||||
console.error(e)
|
||||
toast("Websocket error", {
|
||||
description: "View console for details.",
|
||||
})
|
||||
}
|
||||
}, [wsUrl])
|
||||
|
||||
const fitAddon = useRef(new FitAddon()).current
|
||||
const sendResize = useRef(false)
|
||||
|
||||
const doResize = () => {
|
||||
const doResize = useCallback(() => {
|
||||
if (!terminalIdRef.current) return
|
||||
|
||||
fitAddon.fit()
|
||||
@@ -100,9 +76,9 @@ const XtermComponent = forwardRef<HTMLDivElement, XtermProps & JSX.IntrinsicElem
|
||||
|
||||
wsRef.current?.send(msg)
|
||||
}
|
||||
}
|
||||
}, [fitAddon])
|
||||
|
||||
const onResize = async () => {
|
||||
const onResize = useCallback(async () => {
|
||||
if (sendResize.current) return
|
||||
|
||||
sendResize.current = true
|
||||
@@ -114,22 +90,55 @@ const XtermComponent = forwardRef<HTMLDivElement, XtermProps & JSX.IntrinsicElem
|
||||
} finally {
|
||||
sendResize.current = false
|
||||
}
|
||||
}
|
||||
}, [doResize])
|
||||
|
||||
useEffect(() => {
|
||||
if (!wsRef.current || !terminalIdRef.current || !terminalRef.current) return
|
||||
const attachAddon = new AttachAddon(wsRef.current)
|
||||
terminalRef.current.loadAddon(attachAddon)
|
||||
terminalRef.current.loadAddon(fitAddon)
|
||||
terminalRef.current.open(terminalIdRef.current)
|
||||
const container = terminalIdRef.current
|
||||
if (!container) return
|
||||
|
||||
const terminal = new Terminal({
|
||||
cursorBlink: true,
|
||||
fontSize: 16,
|
||||
})
|
||||
const url = new URL(wsUrl, window.location.origin)
|
||||
url.protocol = url.protocol.replace("http", "ws")
|
||||
const ws = new WebSocket(url)
|
||||
ws.binaryType = "arraybuffer"
|
||||
|
||||
terminalRef.current = terminal
|
||||
wsRef.current = ws
|
||||
|
||||
const attachAddon = new AttachAddon(ws)
|
||||
terminal.loadAddon(attachAddon)
|
||||
terminal.loadAddon(fitAddon)
|
||||
terminal.open(container)
|
||||
window.addEventListener("resize", onResize)
|
||||
|
||||
ws.onopen = () => {
|
||||
onResize()
|
||||
}
|
||||
ws.onclose = () => {
|
||||
terminal.dispose()
|
||||
setClose(true)
|
||||
}
|
||||
ws.onerror = (e) => {
|
||||
console.error(e)
|
||||
toast("Websocket error", {
|
||||
description: "View console for details.",
|
||||
})
|
||||
}
|
||||
|
||||
return () => {
|
||||
window.removeEventListener("resize", onResize)
|
||||
if (wsRef.current) {
|
||||
wsRef.current.close()
|
||||
}
|
||||
ws.onopen = null
|
||||
ws.onclose = null
|
||||
ws.onerror = null
|
||||
ws.close()
|
||||
terminal.dispose()
|
||||
if (wsRef.current === ws) wsRef.current = null
|
||||
if (terminalRef.current === terminal) terminalRef.current = null
|
||||
}
|
||||
}, [wsRef.current, terminalRef.current, terminalIdRef.current])
|
||||
}, [fitAddon, onResize, setClose, wsUrl])
|
||||
|
||||
return <div ref={terminalIdRef} {...props} />
|
||||
},
|
||||
|
||||
@@ -35,8 +35,8 @@ const FormField = <
|
||||
TFieldValues extends FieldValues = FieldValues,
|
||||
TName extends FieldPath<TFieldValues> = FieldPath<TFieldValues>,
|
||||
>({
|
||||
...props
|
||||
}: ControllerProps<TFieldValues, TName>) => {
|
||||
...props
|
||||
}: ControllerProps<TFieldValues, TName>) => {
|
||||
return (
|
||||
<FormFieldContext.Provider value={{ name: props.name }}>
|
||||
<Controller {...props} />
|
||||
|
||||
@@ -1,7 +1,7 @@
|
||||
import { cn } from "@/lib/utils"
|
||||
import { InputHTMLAttributes, forwardRef } from "react"
|
||||
|
||||
export interface InputProps extends InputHTMLAttributes<HTMLInputElement> {}
|
||||
export type InputProps = InputHTMLAttributes<HTMLInputElement>
|
||||
|
||||
const Input = forwardRef<HTMLInputElement, InputProps>(({ className, type, ...props }, ref) => {
|
||||
return (
|
||||
|
||||
@@ -53,60 +53,60 @@ export const IconButton = forwardRef<HTMLButtonElement, IconButtonProps>((props,
|
||||
>
|
||||
{(() => {
|
||||
switch (props.icon) {
|
||||
case "clipboard": {
|
||||
return <Clipboard />
|
||||
}
|
||||
case "check": {
|
||||
return <Check />
|
||||
}
|
||||
case "edit": {
|
||||
return <Edit2 />
|
||||
}
|
||||
case "trash": {
|
||||
return <Trash2 />
|
||||
}
|
||||
case "plus": {
|
||||
return <Plus />
|
||||
}
|
||||
case "terminal": {
|
||||
return <Terminal />
|
||||
}
|
||||
case "update": {
|
||||
return <CircleArrowUp />
|
||||
}
|
||||
case "folder-closed": {
|
||||
return <FolderClosed />
|
||||
}
|
||||
case "play": {
|
||||
return <Play />
|
||||
}
|
||||
case "download": {
|
||||
return <Download />
|
||||
}
|
||||
case "upload": {
|
||||
return <Upload />
|
||||
}
|
||||
case "menu": {
|
||||
return <Menu />
|
||||
}
|
||||
case "ban": {
|
||||
return <BanIcon />
|
||||
}
|
||||
case "expand": {
|
||||
return <Expand />
|
||||
}
|
||||
case "cog": {
|
||||
return <CogIcon />
|
||||
}
|
||||
case "minus": {
|
||||
return <Minus />
|
||||
}
|
||||
case "user-pen": {
|
||||
return <UserPen />
|
||||
}
|
||||
case "more": {
|
||||
return <MoreHorizontal />
|
||||
}
|
||||
case "clipboard": {
|
||||
return <Clipboard />
|
||||
}
|
||||
case "check": {
|
||||
return <Check />
|
||||
}
|
||||
case "edit": {
|
||||
return <Edit2 />
|
||||
}
|
||||
case "trash": {
|
||||
return <Trash2 />
|
||||
}
|
||||
case "plus": {
|
||||
return <Plus />
|
||||
}
|
||||
case "terminal": {
|
||||
return <Terminal />
|
||||
}
|
||||
case "update": {
|
||||
return <CircleArrowUp />
|
||||
}
|
||||
case "folder-closed": {
|
||||
return <FolderClosed />
|
||||
}
|
||||
case "play": {
|
||||
return <Play />
|
||||
}
|
||||
case "download": {
|
||||
return <Download />
|
||||
}
|
||||
case "upload": {
|
||||
return <Upload />
|
||||
}
|
||||
case "menu": {
|
||||
return <Menu />
|
||||
}
|
||||
case "ban": {
|
||||
return <BanIcon />
|
||||
}
|
||||
case "expand": {
|
||||
return <Expand />
|
||||
}
|
||||
case "cog": {
|
||||
return <CogIcon />
|
||||
}
|
||||
case "minus": {
|
||||
return <Minus />
|
||||
}
|
||||
case "user-pen": {
|
||||
return <UserPen />
|
||||
}
|
||||
case "more": {
|
||||
return <MoreHorizontal />
|
||||
}
|
||||
}
|
||||
})()}
|
||||
</Button>
|
||||
|
||||
@@ -140,7 +140,6 @@ export const MultiSelect = forwardRef<HTMLButtonElement, MultiSelectProps>(
|
||||
animation = 0,
|
||||
maxCount = 3,
|
||||
modalPopover = false,
|
||||
asChild = false,
|
||||
className,
|
||||
...props
|
||||
},
|
||||
|
||||
@@ -158,9 +158,9 @@ export function DataTable<TData, TValue>({
|
||||
{...{
|
||||
style: header.column.getCanSort()
|
||||
? {
|
||||
cursor: "pointer",
|
||||
userSelect: "none",
|
||||
}
|
||||
cursor: "pointer",
|
||||
userSelect: "none",
|
||||
}
|
||||
: {},
|
||||
onClick:
|
||||
header.column.getToggleSortingHandler(),
|
||||
|
||||
+10
-10
@@ -1,6 +1,6 @@
|
||||
import { getProfile, login as loginRequest } from "@/api/user"
|
||||
import { AuthContextProps } from "@/types"
|
||||
import { createContext, useContext, useEffect, useMemo } from "react"
|
||||
import { createContext, useCallback, useContext, useEffect, useMemo } from "react"
|
||||
import { useTranslation } from "react-i18next"
|
||||
import { useNavigate } from "react-router-dom"
|
||||
import { toast } from "sonner"
|
||||
@@ -25,15 +25,15 @@ export const AuthProvider = ({ children }: { children: React.ReactNode }) => {
|
||||
const user = await getProfile()
|
||||
user.role = user.role || 0
|
||||
setProfile(user)
|
||||
} catch (error: any) {
|
||||
} catch {
|
||||
setProfile(undefined)
|
||||
}
|
||||
})()
|
||||
}, [])
|
||||
}, [setProfile])
|
||||
|
||||
const navigate = useNavigate()
|
||||
|
||||
const login = async (username: string, password: string) => {
|
||||
const login = useCallback(async (username: string, password: string) => {
|
||||
try {
|
||||
await loginRequest(username, password)
|
||||
const user = await getProfile()
|
||||
@@ -48,9 +48,9 @@ export const AuthProvider = ({ children }: { children: React.ReactNode }) => {
|
||||
toast(msg || t("NetworkError"))
|
||||
}
|
||||
}
|
||||
}
|
||||
}, [navigate, setProfile, t])
|
||||
|
||||
const loginOauth2 = async () => {
|
||||
const loginOauth2 = useCallback(async () => {
|
||||
try {
|
||||
const user = await getProfile()
|
||||
user.role = user.role || 0
|
||||
@@ -61,9 +61,9 @@ export const AuthProvider = ({ children }: { children: React.ReactNode }) => {
|
||||
} finally {
|
||||
window.history.replaceState({}, document.title, window.location.pathname)
|
||||
}
|
||||
}
|
||||
}, [navigate, setProfile])
|
||||
|
||||
const logout = () => {
|
||||
const logout = useCallback(() => {
|
||||
document.cookie.split(";").forEach(function (c) {
|
||||
document.cookie = c
|
||||
.replace(/^ +/, "")
|
||||
@@ -71,7 +71,7 @@ export const AuthProvider = ({ children }: { children: React.ReactNode }) => {
|
||||
})
|
||||
setProfile(undefined)
|
||||
navigate("/dashboard/login", { replace: true })
|
||||
}
|
||||
}, [navigate, setProfile])
|
||||
|
||||
const value = useMemo(
|
||||
() => ({
|
||||
@@ -80,7 +80,7 @@ export const AuthProvider = ({ children }: { children: React.ReactNode }) => {
|
||||
loginOauth2,
|
||||
logout,
|
||||
}),
|
||||
[profile],
|
||||
[profile, login, loginOauth2, logout],
|
||||
)
|
||||
return <AuthContext.Provider value={value}>{children}</AuthContext.Provider>
|
||||
}
|
||||
|
||||
+11
-14
@@ -1,19 +1,16 @@
|
||||
import { useEffect, useState } from "react"
|
||||
import { useCallback, useSyncExternalStore } from "react"
|
||||
|
||||
export function useMediaQuery(query: string) {
|
||||
const [value, setValue] = useState(false)
|
||||
const subscribe = useCallback(
|
||||
(callback: () => void) => {
|
||||
const result = matchMedia(query)
|
||||
result.addEventListener("change", callback)
|
||||
return () => result.removeEventListener("change", callback)
|
||||
},
|
||||
[query],
|
||||
)
|
||||
|
||||
useEffect(() => {
|
||||
function onChange(event: MediaQueryListEvent) {
|
||||
setValue(event.matches)
|
||||
}
|
||||
const getSnapshot = useCallback(() => matchMedia(query).matches, [query])
|
||||
|
||||
const result = matchMedia(query)
|
||||
result.addEventListener("change", onChange)
|
||||
setValue(result.matches)
|
||||
|
||||
return () => result.removeEventListener("change", onChange)
|
||||
}, [query])
|
||||
|
||||
return value
|
||||
return useSyncExternalStore(subscribe, getSnapshot, () => false)
|
||||
}
|
||||
|
||||
@@ -54,7 +54,7 @@ export const NotificationProvider: React.FC<NotificationProviderProps> = ({
|
||||
setNotifier(undefined)
|
||||
}
|
||||
})()
|
||||
}, [location.pathname])
|
||||
}, [location.pathname, setNotifier, setNotifierGroup, withNotifier, withNotifierGroup])
|
||||
|
||||
const value: NotificationContextProps = useMemo(
|
||||
() => ({
|
||||
|
||||
@@ -54,7 +54,7 @@ export const ServerProvider: React.FC<ServerProviderProps> = ({
|
||||
setServer(undefined)
|
||||
}
|
||||
})()
|
||||
}, [location.pathname])
|
||||
}, [location.pathname, setServer, setServerGroup, withServer, withServerGroup])
|
||||
|
||||
const value: ServerContextProps = useMemo(
|
||||
() => ({
|
||||
|
||||
+11
-10
@@ -5,18 +5,19 @@ import { useEffect, useState } from "react"
|
||||
export default function useTerminal(serverId?: number) {
|
||||
const [terminal, setTerminal] = useState<ModelCreateTerminalResponse | null>(null)
|
||||
|
||||
async function fetchTerminal() {
|
||||
try {
|
||||
const response = await createTerminal(serverId!)
|
||||
setTerminal(response)
|
||||
} catch (error) {
|
||||
console.error("Failed to fetch terminal:", error)
|
||||
}
|
||||
}
|
||||
|
||||
useEffect(() => {
|
||||
if (!serverId) return
|
||||
fetchTerminal()
|
||||
let cancelled = false
|
||||
createTerminal(serverId)
|
||||
.then((response) => {
|
||||
if (!cancelled) setTerminal(response)
|
||||
})
|
||||
.catch((error) => {
|
||||
console.error("Failed to fetch terminal:", error)
|
||||
})
|
||||
return () => {
|
||||
cancelled = true
|
||||
}
|
||||
}, [serverId])
|
||||
|
||||
return terminal
|
||||
|
||||
+37
-37
@@ -15,53 +15,53 @@ onmessage = async function (event) {
|
||||
const { operation, arrayBuffer, fileName } = event.data
|
||||
|
||||
switch (operation) {
|
||||
case Operation.WriteHeader: {
|
||||
const dataView = new DataView(arrayBuffer)
|
||||
expectedLength = Number(dataView.getBigUint64(4, false))
|
||||
receivedLength = 0
|
||||
case Operation.WriteHeader: {
|
||||
const dataView = new DataView(arrayBuffer)
|
||||
expectedLength = Number(dataView.getBigUint64(4, false))
|
||||
receivedLength = 0
|
||||
|
||||
// Create a new temporary file
|
||||
root = await navigator.storage.getDirectory()
|
||||
draftHandle = await root.getFileHandle(fileName, { create: true })
|
||||
accessHandle = await draftHandle.createSyncAccessHandle()
|
||||
// Create a new temporary file
|
||||
root = await navigator.storage.getDirectory()
|
||||
draftHandle = await root.getFileHandle(fileName, { create: true })
|
||||
accessHandle = await draftHandle.createSyncAccessHandle()
|
||||
|
||||
// Inform that file handle is created
|
||||
const dataChunk = arrayBuffer.slice(12)
|
||||
receivedLength += dataChunk.byteLength
|
||||
accessHandle.write(dataChunk, { at: 0 })
|
||||
const progress = "got handle"
|
||||
postMessage({ type: 1, progress: progress })
|
||||
break
|
||||
// Inform that file handle is created
|
||||
const dataChunk = arrayBuffer.slice(12)
|
||||
receivedLength += dataChunk.byteLength
|
||||
accessHandle.write(dataChunk, { at: 0 })
|
||||
const progress = "got handle"
|
||||
postMessage({ type: 1, progress: progress })
|
||||
break
|
||||
}
|
||||
case Operation.WriteChunks: {
|
||||
if (!accessHandle) {
|
||||
throw new Error("accessHandle is undefined")
|
||||
}
|
||||
case Operation.WriteChunks: {
|
||||
if (!accessHandle) {
|
||||
throw new Error("accessHandle is undefined")
|
||||
}
|
||||
|
||||
accessHandle.write(arrayBuffer, { at: receivedLength })
|
||||
receivedLength += arrayBuffer.byteLength
|
||||
accessHandle.write(arrayBuffer, { at: receivedLength })
|
||||
receivedLength += arrayBuffer.byteLength
|
||||
|
||||
if (receivedLength === expectedLength) {
|
||||
accessHandle.flush()
|
||||
accessHandle.close()
|
||||
if (receivedLength === expectedLength) {
|
||||
accessHandle.flush()
|
||||
accessHandle.close()
|
||||
|
||||
const fileBlob = await draftHandle.getFile()
|
||||
const blob = new Blob([fileBlob], { type: "application/octet-stream" })
|
||||
const fileBlob = await draftHandle.getFile()
|
||||
const blob = new Blob([fileBlob], { type: "application/octet-stream" })
|
||||
|
||||
postMessage({ type: 2, blob: blob, fileName: fileName })
|
||||
}
|
||||
break
|
||||
postMessage({ type: 2, blob: blob, fileName: fileName })
|
||||
}
|
||||
case Operation.DeleteFiles: {
|
||||
for await (const [name, handle] of root.entries()) {
|
||||
if (handle.kind === "file") {
|
||||
await root.removeEntry(name)
|
||||
} else if (handle.kind === "directory") {
|
||||
await root.removeEntry(name, { recursive: true })
|
||||
}
|
||||
break
|
||||
}
|
||||
case Operation.DeleteFiles: {
|
||||
for await (const [name, handle] of root.entries()) {
|
||||
if (handle.kind === "file") {
|
||||
await root.removeEntry(name)
|
||||
} else if (handle.kind === "directory") {
|
||||
await root.removeEntry(name, { recursive: true })
|
||||
}
|
||||
break
|
||||
}
|
||||
break
|
||||
}
|
||||
}
|
||||
} catch (error) {
|
||||
if (error instanceof Error) postMessage({ type: 0, error: error.message })
|
||||
|
||||
@@ -136,6 +136,9 @@
|
||||
"EditServerGroup": "Edit Server Group",
|
||||
"CreateServerGroup": "Create Server Group",
|
||||
"User": "User",
|
||||
"Owner": "Owner",
|
||||
"GlobalAgent": "Global Agent",
|
||||
"UnknownUser": "Unknown user (#{{id}})",
|
||||
"WAF": "Web Application Firewall",
|
||||
"SiteName": "Site Name",
|
||||
"DashboardOriginalHost": "Agent connecting address [domain name/IP:port]",
|
||||
@@ -255,5 +258,35 @@
|
||||
"ClipboardWriteFailed": "Clipboard write failed",
|
||||
"PastedFromClipboard": "Pasted from clipboard",
|
||||
"ClipboardReadFailed": "Clipboard read failed",
|
||||
"FormatMetricUnits": "Format Metric Units"
|
||||
"FormatMetricUnits": "Format Metric Units",
|
||||
"Status": "Status",
|
||||
"ServerID": "Server ID",
|
||||
"CreatedAt": "Created At",
|
||||
"BatchMoveServer": "Batch Move Server Owner",
|
||||
"Servers": "Servers",
|
||||
"ToUser": "To User",
|
||||
"Move": "Move",
|
||||
"Transfer": {
|
||||
"Title": "Server Transfers",
|
||||
"PageHint": "Tracks ownership transfers initiated from the batch-move action. Pending entries can be cancelled; terminal entries can be retried.",
|
||||
"From": "From",
|
||||
"To": "To",
|
||||
"Initiator": "Initiator",
|
||||
"LastError": "Last Error",
|
||||
"Retry": "Retry",
|
||||
"CancelRequested": "Cancellation requested",
|
||||
"RetryRequested": "Retry requested",
|
||||
"BatchSubmitted": "Batch transfer submitted",
|
||||
"PendingCount": "{{count}} pending",
|
||||
"PermissionDeniedCount": "{{count}} permission denied",
|
||||
"AlreadyTransferringCount": "{{count}} already transferring",
|
||||
"ServerNotFoundCount": "{{count}} not found",
|
||||
"SameOwnerCount": "{{count}} already owned by target",
|
||||
"AgentTooOldCount": "{{count}} agent too old (upgrade required)",
|
||||
"StatusPending": "Pending",
|
||||
"StatusVerified": "Verified",
|
||||
"StatusFailed": "Failed",
|
||||
"StatusTimeout": "Timeout",
|
||||
"StatusCancelled": "Cancelled"
|
||||
}
|
||||
}
|
||||
|
||||
@@ -146,6 +146,9 @@
|
||||
"EditNotifierGroup": "编辑通知分组",
|
||||
"CreateNotifierGroup": "创建通知分组",
|
||||
"User": "用户",
|
||||
"Owner": "所属用户",
|
||||
"GlobalAgent": "全局 Agent",
|
||||
"UnknownUser": "未知用户 (#{{id}})",
|
||||
"WAF": "Web应用防火墙",
|
||||
"SiteName": "站点名称",
|
||||
"Language": "语言",
|
||||
@@ -255,5 +258,35 @@
|
||||
"ClipboardWriteFailed": "无法写入剪贴板",
|
||||
"PastedFromClipboard": "已从剪贴板粘贴",
|
||||
"ClipboardReadFailed": "无法读取剪贴板",
|
||||
"FormatMetricUnits": "格式化数据单位"
|
||||
"FormatMetricUnits": "格式化数据单位",
|
||||
"Status": "状态",
|
||||
"ServerID": "服务器 ID",
|
||||
"CreatedAt": "创建时间",
|
||||
"BatchMoveServer": "批量转移服务器所有者",
|
||||
"Servers": "服务器",
|
||||
"ToUser": "目标用户",
|
||||
"Move": "转移",
|
||||
"Transfer": {
|
||||
"Title": "服务器转移",
|
||||
"PageHint": "跟踪由批量转移操作发起的所有权转移。待处理条目可以取消;已终止条目可以重试。",
|
||||
"From": "源用户",
|
||||
"To": "目标用户",
|
||||
"Initiator": "发起者",
|
||||
"LastError": "最近错误",
|
||||
"Retry": "重试",
|
||||
"CancelRequested": "已请求取消",
|
||||
"RetryRequested": "已请求重试",
|
||||
"BatchSubmitted": "批量转移已提交",
|
||||
"PendingCount": "{{count}} 个待处理",
|
||||
"PermissionDeniedCount": "{{count}} 个权限不足",
|
||||
"AlreadyTransferringCount": "{{count}} 个正在转移中",
|
||||
"ServerNotFoundCount": "{{count}} 个未找到",
|
||||
"SameOwnerCount": "{{count}} 个已属于目标用户",
|
||||
"AgentTooOldCount": "{{count}} 个 agent 版本过低(需升级)",
|
||||
"StatusPending": "待处理",
|
||||
"StatusVerified": "已验证",
|
||||
"StatusFailed": "已失败",
|
||||
"StatusTimeout": "已超时",
|
||||
"StatusCancelled": "已取消"
|
||||
}
|
||||
}
|
||||
|
||||
@@ -138,6 +138,9 @@
|
||||
"EditNotifierGroup": "編輯通知分組",
|
||||
"CreateNotifierGroup": "建立通知分組",
|
||||
"User": "使用者",
|
||||
"Owner": "所屬使用者",
|
||||
"GlobalAgent": "全域 Agent",
|
||||
"UnknownUser": "未知使用者 (#{{id}})",
|
||||
"WAF": "Web應用防火牆",
|
||||
"SiteName": "網站名稱",
|
||||
"Language": "語言",
|
||||
@@ -186,5 +189,35 @@
|
||||
"Option": "選項",
|
||||
"Value": "值",
|
||||
"Preview": "預覽",
|
||||
"FormatMetricUnits": "格式化資料單位"
|
||||
"FormatMetricUnits": "格式化資料單位",
|
||||
"Status": "狀態",
|
||||
"ServerID": "伺服器 ID",
|
||||
"CreatedAt": "建立時間",
|
||||
"BatchMoveServer": "批次轉移伺服器擁有者",
|
||||
"Servers": "伺服器",
|
||||
"ToUser": "目標使用者",
|
||||
"Move": "轉移",
|
||||
"Transfer": {
|
||||
"Title": "伺服器轉移",
|
||||
"PageHint": "追蹤由批次轉移操作發起的擁有權轉移。待處理項目可以取消;已終止項目可以重試。",
|
||||
"From": "來源使用者",
|
||||
"To": "目標使用者",
|
||||
"Initiator": "發起者",
|
||||
"LastError": "最近錯誤",
|
||||
"Retry": "重試",
|
||||
"CancelRequested": "已請求取消",
|
||||
"RetryRequested": "已請求重試",
|
||||
"BatchSubmitted": "批次轉移已提交",
|
||||
"PendingCount": "{{count}} 個待處理",
|
||||
"PermissionDeniedCount": "{{count}} 個權限不足",
|
||||
"AlreadyTransferringCount": "{{count}} 個正在轉移中",
|
||||
"ServerNotFoundCount": "{{count}} 個未找到",
|
||||
"SameOwnerCount": "{{count}} 個已屬於目標使用者",
|
||||
"AgentTooOldCount": "{{count}} 個 agent 版本過舊(需升級)",
|
||||
"StatusPending": "待處理",
|
||||
"StatusVerified": "已驗證",
|
||||
"StatusFailed": "已失敗",
|
||||
"StatusTimeout": "已逾時",
|
||||
"StatusCancelled": "已取消"
|
||||
}
|
||||
}
|
||||
|
||||
@@ -27,6 +27,7 @@ import NotificationPage from "./routes/notification"
|
||||
import OnlineUserPage from "./routes/online-user"
|
||||
import ProfilePage from "./routes/profile"
|
||||
import SettingsPage from "./routes/settings"
|
||||
import TransferPage from "./routes/transfer"
|
||||
import UserPage from "./routes/user"
|
||||
import WAFPage from "./routes/waf"
|
||||
|
||||
@@ -146,6 +147,10 @@ const router = createBrowserRouter([
|
||||
path: "/dashboard/settings/online-user",
|
||||
element: <OnlineUserPage />,
|
||||
},
|
||||
{
|
||||
path: "/dashboard/transfer",
|
||||
element: <TransferPage />,
|
||||
},
|
||||
],
|
||||
},
|
||||
])
|
||||
|
||||
@@ -165,9 +165,9 @@ export default function AlertRulePage() {
|
||||
{header.isPlaceholder
|
||||
? null
|
||||
: flexRender(
|
||||
header.column.columnDef.header,
|
||||
header.getContext(),
|
||||
)}
|
||||
header.column.columnDef.header,
|
||||
header.getContext(),
|
||||
)}
|
||||
</TableHead>
|
||||
)
|
||||
})}
|
||||
|
||||
+12
-12
@@ -110,15 +110,15 @@ export default function CronPage() {
|
||||
<div className="max-w-48 whitespace-normal break-words">
|
||||
{(() => {
|
||||
switch (s.cover) {
|
||||
case 0: {
|
||||
return <span>{t("IgnoreAll")}</span>
|
||||
}
|
||||
case 1: {
|
||||
return <span>{t("CoverAll")}</span>
|
||||
}
|
||||
case 2: {
|
||||
return <span>{t("OnAlert")}</span>
|
||||
}
|
||||
case 0: {
|
||||
return <span>{t("IgnoreAll")}</span>
|
||||
}
|
||||
case 1: {
|
||||
return <span>{t("CoverAll")}</span>
|
||||
}
|
||||
case 2: {
|
||||
return <span>{t("OnAlert")}</span>
|
||||
}
|
||||
}
|
||||
})()}
|
||||
</div>
|
||||
@@ -233,9 +233,9 @@ export default function CronPage() {
|
||||
{header.isPlaceholder
|
||||
? null
|
||||
: flexRender(
|
||||
header.column.columnDef.header,
|
||||
header.getContext(),
|
||||
)}
|
||||
header.column.columnDef.header,
|
||||
header.getContext(),
|
||||
)}
|
||||
</TableHead>
|
||||
)
|
||||
})}
|
||||
|
||||
+3
-3
@@ -170,9 +170,9 @@ export default function DDNSPage() {
|
||||
{header.isPlaceholder
|
||||
? null
|
||||
: flexRender(
|
||||
header.column.columnDef.header,
|
||||
header.getContext(),
|
||||
)}
|
||||
header.column.columnDef.header,
|
||||
header.getContext(),
|
||||
)}
|
||||
</TableHead>
|
||||
)
|
||||
})}
|
||||
|
||||
@@ -39,7 +39,7 @@ function Login() {
|
||||
if (oauth2) {
|
||||
loginOauth2()
|
||||
}
|
||||
}, [window.location.search])
|
||||
}, [loginOauth2])
|
||||
|
||||
const form = useForm<z.infer<typeof formSchema>>({
|
||||
resolver: zodResolver(formSchema),
|
||||
@@ -56,7 +56,7 @@ function Login() {
|
||||
async function loginWith(provider: string) {
|
||||
try {
|
||||
const redirectUrl = await getOauth2RedirectURL(provider, Oauth2RequestType.LOGIN)
|
||||
window.location.href = redirectUrl.redirect!
|
||||
window.location.assign(redirectUrl.redirect!)
|
||||
} catch (error: any) {
|
||||
toast.error(error.message)
|
||||
}
|
||||
@@ -108,14 +108,14 @@ function Login() {
|
||||
</form>
|
||||
{settingData?.config?.oauth2_providers &&
|
||||
settingData?.config?.oauth2_providers.length > 0 && (
|
||||
<section className="flex items-center my-3 w-full">
|
||||
<Separator className="flex-1" />
|
||||
<div className="flex justify-center text-xs text-muted-foreground w-full max-w-[100px]">
|
||||
<section className="flex items-center my-3 w-full">
|
||||
<Separator className="flex-1" />
|
||||
<div className="flex justify-center text-xs text-muted-foreground w-full max-w-[100px]">
|
||||
OAuth2
|
||||
</div>
|
||||
<Separator className="flex-1" />
|
||||
</section>
|
||||
)}
|
||||
</div>
|
||||
<Separator className="flex-1" />
|
||||
</section>
|
||||
)}
|
||||
</Form>
|
||||
<div className="mt-3 flex flex-col gap-3">
|
||||
{settingData?.config?.oauth2_providers?.map((p: string) => (
|
||||
|
||||
+3
-3
@@ -153,9 +153,9 @@ export default function NATPage() {
|
||||
{header.isPlaceholder
|
||||
? null
|
||||
: flexRender(
|
||||
header.column.columnDef.header,
|
||||
header.getContext(),
|
||||
)}
|
||||
header.column.columnDef.header,
|
||||
header.getContext(),
|
||||
)}
|
||||
</TableHead>
|
||||
)
|
||||
})}
|
||||
|
||||
@@ -146,9 +146,9 @@ export default function NotificationGroupPage() {
|
||||
{header.isPlaceholder
|
||||
? null
|
||||
: flexRender(
|
||||
header.column.columnDef.header,
|
||||
header.getContext(),
|
||||
)}
|
||||
header.column.columnDef.header,
|
||||
header.getContext(),
|
||||
)}
|
||||
</TableHead>
|
||||
)
|
||||
})}
|
||||
|
||||
@@ -161,9 +161,9 @@ export default function NotificationPage() {
|
||||
{header.isPlaceholder
|
||||
? null
|
||||
: flexRender(
|
||||
header.column.columnDef.header,
|
||||
header.getContext(),
|
||||
)}
|
||||
header.column.columnDef.header,
|
||||
header.getContext(),
|
||||
)}
|
||||
</TableHead>
|
||||
)
|
||||
})}
|
||||
|
||||
@@ -264,9 +264,9 @@ export default function OnlineUserPage() {
|
||||
{header.isPlaceholder
|
||||
? null
|
||||
: flexRender(
|
||||
header.column.columnDef.header,
|
||||
header.getContext(),
|
||||
)}
|
||||
header.column.columnDef.header,
|
||||
header.getContext(),
|
||||
)}
|
||||
</TableHead>
|
||||
)
|
||||
})}
|
||||
|
||||
@@ -26,12 +26,12 @@ export default function ProfilePage() {
|
||||
})
|
||||
window.history.replaceState({}, document.title, window.location.pathname)
|
||||
}
|
||||
}, [window.location.search])
|
||||
}, [setProfile])
|
||||
|
||||
const bindO2 = async (provider: string) => {
|
||||
try {
|
||||
const redirectUrl = await getOauth2RedirectURL(provider, Oauth2RequestType.BIND)
|
||||
window.location.href = redirectUrl.redirect!
|
||||
window.location.assign(redirectUrl.redirect!)
|
||||
} catch (error: any) {
|
||||
toast.error(error.message)
|
||||
}
|
||||
|
||||
+6
-4
@@ -22,6 +22,12 @@ export default function Root() {
|
||||
}
|
||||
}, [settingData?.config?.custom_code_dashboard])
|
||||
|
||||
useEffect(() => {
|
||||
if (settingData?.config?.language && !localStorage.getItem("language")) {
|
||||
i18n.changeLanguage(settingData?.config?.language)
|
||||
}
|
||||
}, [settingData?.config?.language])
|
||||
|
||||
if (error) {
|
||||
throw error
|
||||
}
|
||||
@@ -30,10 +36,6 @@ export default function Root() {
|
||||
return null
|
||||
}
|
||||
|
||||
if (settingData?.config?.language && !localStorage.getItem("language")) {
|
||||
i18n.changeLanguage(settingData?.config?.language)
|
||||
}
|
||||
|
||||
return (
|
||||
<ThemeProvider defaultTheme="system" storageKey="vite-ui-theme">
|
||||
<section className="text-sm mx-auto h-full flex flex-col justify-between">
|
||||
|
||||
@@ -145,9 +145,9 @@ export default function ServerGroupPage() {
|
||||
{header.isPlaceholder
|
||||
? null
|
||||
: flexRender(
|
||||
header.column.columnDef.header,
|
||||
header.getContext(),
|
||||
)}
|
||||
header.column.columnDef.header,
|
||||
header.getContext(),
|
||||
)}
|
||||
</TableHead>
|
||||
)
|
||||
})}
|
||||
|
||||
+35
-3
@@ -99,6 +99,38 @@ export default function ServerPage() {
|
||||
)
|
||||
},
|
||||
},
|
||||
{
|
||||
id: "owner",
|
||||
header: t("Owner"),
|
||||
// Backend Server.MarshalJSON always emits owner.id; username is
|
||||
// omitted for uid=0 (legacy global agent secret) and for users
|
||||
// that no longer exist. Render uid=0 as "Global Agent" and a
|
||||
// missing username as "Unknown user (#id)" so deleted-user rows
|
||||
// stay debuggable instead of silently appearing ownerless.
|
||||
accessorFn: (row) => {
|
||||
if (!row.owner) return ""
|
||||
if (row.owner.id === 0) return t("GlobalAgent")
|
||||
return row.owner.username || t("UnknownUser", { id: row.owner.id })
|
||||
},
|
||||
cell: ({ row }) => {
|
||||
const owner = row.original.owner
|
||||
if (!owner) {
|
||||
return <span className="text-muted-foreground">-</span>
|
||||
}
|
||||
if (owner.id === 0) {
|
||||
return <span>{t("GlobalAgent")}</span>
|
||||
}
|
||||
const label = owner.username || t("UnknownUser", { id: owner.id })
|
||||
return (
|
||||
<div
|
||||
className="max-w-32 whitespace-normal break-words"
|
||||
title={`uid=${owner.id}`}
|
||||
>
|
||||
{label}
|
||||
</div>
|
||||
)
|
||||
},
|
||||
},
|
||||
{
|
||||
id: "ip",
|
||||
header: "IP",
|
||||
@@ -260,9 +292,9 @@ export default function ServerPage() {
|
||||
{header.isPlaceholder
|
||||
? null
|
||||
: flexRender(
|
||||
header.column.columnDef.header,
|
||||
header.getContext(),
|
||||
)}
|
||||
header.column.columnDef.header,
|
||||
header.getContext(),
|
||||
)}
|
||||
</TableHead>
|
||||
)
|
||||
})}
|
||||
|
||||
@@ -90,12 +90,12 @@ export default function ServicePage() {
|
||||
<div className="max-w-48 whitespace-normal break-words">
|
||||
{(() => {
|
||||
switch (s.cover) {
|
||||
case 0: {
|
||||
return <span>{t("CoverAll")}</span>
|
||||
}
|
||||
case 1: {
|
||||
return <span>{t("IgnoreAll")}</span>
|
||||
}
|
||||
case 0: {
|
||||
return <span>{t("CoverAll")}</span>
|
||||
}
|
||||
case 1: {
|
||||
return <span>{t("IgnoreAll")}</span>
|
||||
}
|
||||
}
|
||||
})()}
|
||||
</div>
|
||||
@@ -199,9 +199,9 @@ export default function ServicePage() {
|
||||
{header.isPlaceholder
|
||||
? null
|
||||
: flexRender(
|
||||
header.column.columnDef.header,
|
||||
header.getContext(),
|
||||
)}
|
||||
header.column.columnDef.header,
|
||||
header.getContext(),
|
||||
)}
|
||||
</TableHead>
|
||||
)
|
||||
})}
|
||||
|
||||
@@ -76,19 +76,19 @@ export default function SettingsPage() {
|
||||
resolver: zodResolver(settingFormSchema) as any,
|
||||
defaultValues: config
|
||||
? {
|
||||
...config.config,
|
||||
user_template:
|
||||
...config.config,
|
||||
user_template:
|
||||
config.config?.user_template ||
|
||||
Object.keys(config.frontend_templates?.filter((t) => !t.is_admin) || {})[0] ||
|
||||
"user-dist",
|
||||
}
|
||||
}
|
||||
: {
|
||||
ip_change_notification_group_id: 0,
|
||||
cover: 1,
|
||||
site_name: "",
|
||||
language: "",
|
||||
user_template: "user-dist",
|
||||
},
|
||||
ip_change_notification_group_id: 0,
|
||||
cover: 1,
|
||||
site_name: "",
|
||||
language: "",
|
||||
user_template: "user-dist",
|
||||
},
|
||||
resetOptions: {
|
||||
keepDefaultValues: false,
|
||||
},
|
||||
|
||||
@@ -0,0 +1,262 @@
|
||||
import { swrFetcher } from "@/api/api"
|
||||
import { cancelServerTransfer, retryServerTransfer } from "@/api/transfer"
|
||||
import { Button } from "@/components/ui/button"
|
||||
import { Badge } from "@/components/ui/badge"
|
||||
import {
|
||||
Table,
|
||||
TableBody,
|
||||
TableCell,
|
||||
TableHead,
|
||||
TableHeader,
|
||||
TableRow,
|
||||
} from "@/components/ui/table"
|
||||
import { useAuth } from "@/hooks/useAuth"
|
||||
import {
|
||||
ModelServerTransfer,
|
||||
ModelServerTransferStatus,
|
||||
ModelServerTransferStatusCancelled,
|
||||
ModelServerTransferStatusFailed,
|
||||
ModelServerTransferStatusPending,
|
||||
ModelServerTransferStatusTimeout,
|
||||
ModelServerTransferStatusVerified,
|
||||
} from "@/types"
|
||||
import { useCallback, useEffect, useMemo, useRef } from "react"
|
||||
import { useTranslation } from "react-i18next"
|
||||
import { toast } from "sonner"
|
||||
import useSWR from "swr"
|
||||
|
||||
// Map status enum to a label key + a Badge variant. Centralised here so the
|
||||
// table cell and any future drawer agree. Verified is "secondary" because
|
||||
// the row is no longer actionable; Failed/Timeout use "destructive" to draw
|
||||
// the operator's attention. Cancelled is "outline" — soft signal, expected.
|
||||
const statusMeta: Record<
|
||||
ModelServerTransferStatus,
|
||||
{ key: string; variant: "default" | "secondary" | "destructive" | "outline" }
|
||||
> = {
|
||||
[ModelServerTransferStatusPending]: { key: "Transfer.StatusPending", variant: "default" },
|
||||
[ModelServerTransferStatusVerified]: { key: "Transfer.StatusVerified", variant: "secondary" },
|
||||
[ModelServerTransferStatusFailed]: { key: "Transfer.StatusFailed", variant: "destructive" },
|
||||
[ModelServerTransferStatusTimeout]: { key: "Transfer.StatusTimeout", variant: "destructive" },
|
||||
[ModelServerTransferStatusCancelled]: { key: "Transfer.StatusCancelled", variant: "outline" },
|
||||
}
|
||||
|
||||
export default function TransferPage() {
|
||||
const { t } = useTranslation()
|
||||
const { profile } = useAuth()
|
||||
const isAdmin = profile?.role === 0
|
||||
const callerID = profile?.id
|
||||
const { data, mutate, error } = useSWR<ModelServerTransfer[]>(
|
||||
"/api/v1/transfer",
|
||||
swrFetcher,
|
||||
)
|
||||
|
||||
useEffect(() => {
|
||||
if (error) {
|
||||
toast(t("Error"), {
|
||||
description: t("Results.UnExpectedError", { error: error.message }),
|
||||
})
|
||||
}
|
||||
}, [error, t])
|
||||
|
||||
// Live updates: subscribe to /ws/transfer and patch the SWR cache on each
|
||||
// pushed event. We don't refetch on every event because the WS payload IS
|
||||
// the latest row — refetching would just cost a round trip.
|
||||
//
|
||||
// Reconnect contract: the original implementation opened the socket once
|
||||
// and never reconnected, so a dashboard restart, deploy, or transient
|
||||
// network blip silently froze this view — rows stayed Pending forever
|
||||
// even after the agent had reconnected and the backend had transitioned
|
||||
// them, and operators only discovered it on a hard refresh. Reconnect
|
||||
// with capped exponential backoff (1s → 30s) and trigger a SWR revalidate
|
||||
// on each open so any transitions that broadcast while we were offline
|
||||
// are reconciled.
|
||||
const wsRef = useRef<WebSocket | null>(null)
|
||||
useEffect(() => {
|
||||
let cancelled = false
|
||||
let reconnectTimer: ReturnType<typeof setTimeout> | null = null
|
||||
let backoffMs = 1000
|
||||
const maxBackoffMs = 30000
|
||||
|
||||
const connect = () => {
|
||||
if (cancelled) return
|
||||
const proto = window.location.protocol === "https:" ? "wss:" : "ws:"
|
||||
const ws = new WebSocket(`${proto}//${window.location.host}/api/v1/ws/transfer`)
|
||||
wsRef.current = ws
|
||||
|
||||
ws.onopen = () => {
|
||||
backoffMs = 1000
|
||||
// Backfill anything the broker fanned out while we were
|
||||
// reconnecting — the broker drops events for full subscribers
|
||||
// and there is no replay on the wire.
|
||||
mutate()
|
||||
}
|
||||
ws.onmessage = (ev) => {
|
||||
try {
|
||||
const t: ModelServerTransfer = JSON.parse(ev.data)
|
||||
mutate((prev) => {
|
||||
const list = prev ?? []
|
||||
const idx = list.findIndex((x) => x.id === t.id)
|
||||
if (idx === -1) return [t, ...list]
|
||||
const next = list.slice()
|
||||
next[idx] = t
|
||||
return next
|
||||
}, false)
|
||||
} catch (e) {
|
||||
// Malformed payload — log and keep the socket open; a refetch
|
||||
// on next mount will re-sync. Closing the WS would be louder
|
||||
// than the actual problem.
|
||||
console.error("transfer ws parse failed", e)
|
||||
}
|
||||
}
|
||||
const scheduleReconnect = () => {
|
||||
if (cancelled) return
|
||||
if (reconnectTimer !== null) return
|
||||
const delay = backoffMs
|
||||
backoffMs = Math.min(backoffMs * 2, maxBackoffMs)
|
||||
reconnectTimer = setTimeout(() => {
|
||||
reconnectTimer = null
|
||||
connect()
|
||||
}, delay)
|
||||
}
|
||||
ws.onclose = scheduleReconnect
|
||||
ws.onerror = () => {
|
||||
// onerror fires before onclose and may not produce a close
|
||||
// event in every browser when the handshake is rejected.
|
||||
// Force-close so onclose's reconnect path runs deterministically.
|
||||
ws.close()
|
||||
}
|
||||
}
|
||||
|
||||
connect()
|
||||
|
||||
return () => {
|
||||
cancelled = true
|
||||
if (reconnectTimer !== null) {
|
||||
clearTimeout(reconnectTimer)
|
||||
reconnectTimer = null
|
||||
}
|
||||
const ws = wsRef.current
|
||||
wsRef.current = null
|
||||
if (ws) {
|
||||
// Detach handlers so the close we trigger here doesn't bounce
|
||||
// into a reconnect attempt against an unmounted component.
|
||||
ws.onopen = null
|
||||
ws.onmessage = null
|
||||
ws.onclose = null
|
||||
ws.onerror = null
|
||||
ws.close()
|
||||
}
|
||||
}
|
||||
}, [mutate])
|
||||
|
||||
const onCancel = useCallback(
|
||||
async (id: number) => {
|
||||
try {
|
||||
await cancelServerTransfer(id)
|
||||
toast(t("Transfer.CancelRequested"))
|
||||
mutate()
|
||||
} catch (e: unknown) {
|
||||
const msg = e instanceof Error ? e.message : String(e)
|
||||
toast(t("Error"), { description: msg })
|
||||
}
|
||||
},
|
||||
[mutate, t],
|
||||
)
|
||||
|
||||
const onRetry = useCallback(
|
||||
async (id: number) => {
|
||||
try {
|
||||
await retryServerTransfer(id)
|
||||
toast(t("Transfer.RetryRequested"))
|
||||
mutate()
|
||||
} catch (e: unknown) {
|
||||
const msg = e instanceof Error ? e.message : String(e)
|
||||
toast(t("Error"), { description: msg })
|
||||
}
|
||||
},
|
||||
[mutate, t],
|
||||
)
|
||||
|
||||
const rows = useMemo(() => data ?? [], [data])
|
||||
|
||||
return (
|
||||
<div className="px-3">
|
||||
<h1 className="mt-6 text-2xl font-semibold">{t("Transfer.Title")}</h1>
|
||||
<p className="text-sm text-muted-foreground mt-1 max-w-2xl">
|
||||
{t("Transfer.PageHint")}
|
||||
</p>
|
||||
<Table className="mt-6">
|
||||
<TableHeader>
|
||||
<TableRow>
|
||||
<TableHead>ID</TableHead>
|
||||
<TableHead>{t("ServerID")}</TableHead>
|
||||
<TableHead>{t("Transfer.From")}</TableHead>
|
||||
<TableHead>{t("Transfer.To")}</TableHead>
|
||||
<TableHead>{t("Transfer.Initiator")}</TableHead>
|
||||
<TableHead>{t("Status")}</TableHead>
|
||||
<TableHead>{t("Transfer.LastError")}</TableHead>
|
||||
<TableHead>{t("CreatedAt")}</TableHead>
|
||||
<TableHead>{t("Actions")}</TableHead>
|
||||
</TableRow>
|
||||
</TableHeader>
|
||||
<TableBody>
|
||||
{rows.length === 0 ? (
|
||||
<TableRow>
|
||||
<TableCell colSpan={9} className="h-24 text-center">
|
||||
{t("NoResults")}
|
||||
</TableCell>
|
||||
</TableRow>
|
||||
) : (
|
||||
rows.map((row) => {
|
||||
const meta = statusMeta[row.status]
|
||||
const isPending = row.status === ModelServerTransferStatusPending
|
||||
const isTerminalRevert =
|
||||
row.status === ModelServerTransferStatusFailed ||
|
||||
row.status === ModelServerTransferStatusTimeout ||
|
||||
row.status === ModelServerTransferStatusCancelled
|
||||
return (
|
||||
<TableRow key={row.id}>
|
||||
<TableCell>{row.id}</TableCell>
|
||||
<TableCell>{row.server_id}</TableCell>
|
||||
<TableCell>{row.from_user_id}</TableCell>
|
||||
<TableCell>{row.to_user_id}</TableCell>
|
||||
<TableCell>{row.initiator_id}</TableCell>
|
||||
<TableCell>
|
||||
<Badge variant={meta.variant}>{t(meta.key)}</Badge>
|
||||
</TableCell>
|
||||
<TableCell className="max-w-xs truncate" title={row.last_error}>
|
||||
{row.last_error || "-"}
|
||||
</TableCell>
|
||||
<TableCell>
|
||||
{new Date(row.created_at).toLocaleString()}
|
||||
</TableCell>
|
||||
<TableCell className="space-x-2">
|
||||
{isPending &&
|
||||
(isAdmin || row.from_user_id === callerID) && (
|
||||
<Button
|
||||
size="sm"
|
||||
variant="outline"
|
||||
onClick={() => onCancel(row.id)}
|
||||
>
|
||||
{t("Cancel")}
|
||||
</Button>
|
||||
)}
|
||||
{isTerminalRevert && isAdmin && (
|
||||
<Button
|
||||
size="sm"
|
||||
variant="outline"
|
||||
onClick={() => onRetry(row.id)}
|
||||
>
|
||||
{t("Transfer.Retry")}
|
||||
</Button>
|
||||
)}
|
||||
</TableCell>
|
||||
</TableRow>
|
||||
)
|
||||
})
|
||||
)}
|
||||
</TableBody>
|
||||
</Table>
|
||||
</div>
|
||||
)
|
||||
}
|
||||
+3
-3
@@ -139,9 +139,9 @@ export default function UserPage() {
|
||||
{header.isPlaceholder
|
||||
? null
|
||||
: flexRender(
|
||||
header.column.columnDef.header,
|
||||
header.getContext(),
|
||||
)}
|
||||
header.column.columnDef.header,
|
||||
header.getContext(),
|
||||
)}
|
||||
</TableHead>
|
||||
)
|
||||
})}
|
||||
|
||||
+3
-3
@@ -283,9 +283,9 @@ export default function WAFPage() {
|
||||
{header.isPlaceholder
|
||||
? null
|
||||
: flexRender(
|
||||
header.column.columnDef.header,
|
||||
header.getContext(),
|
||||
)}
|
||||
header.column.columnDef.header,
|
||||
header.getContext(),
|
||||
)}
|
||||
</TableHead>
|
||||
)
|
||||
})}
|
||||
|
||||
@@ -0,0 +1,88 @@
|
||||
import { act, fireEvent, render, screen, waitFor } from "@testing-library/react"
|
||||
import { afterEach, beforeEach, expect, test, vi } from "vitest"
|
||||
|
||||
const toastCalls: Array<{ title: string; description: string }> = []
|
||||
vi.mock("sonner", () => ({
|
||||
toast: (title: string, opts?: { description?: string }) => {
|
||||
toastCalls.push({ title, description: opts?.description ?? "" })
|
||||
},
|
||||
}))
|
||||
|
||||
vi.mock("react-i18next", () => ({
|
||||
useTranslation: () => ({
|
||||
t: (key: string, vars?: Record<string, unknown>) => {
|
||||
if (vars && typeof vars.count === "number") {
|
||||
return `${key}=${vars.count}`
|
||||
}
|
||||
return key
|
||||
},
|
||||
}),
|
||||
initReactI18next: { type: "3rdParty", init: () => undefined },
|
||||
Trans: ({ children }: { children?: React.ReactNode }) => children ?? null,
|
||||
}))
|
||||
|
||||
const batchMoveServer = vi.fn()
|
||||
vi.mock("@/api/server", () => ({
|
||||
batchMoveServer: (...args: unknown[]) => batchMoveServer(...args),
|
||||
}))
|
||||
|
||||
import { BatchMoveServerIcon } from "@/components/batch-move-server-icon"
|
||||
|
||||
beforeEach(() => {
|
||||
toastCalls.length = 0
|
||||
batchMoveServer.mockReset()
|
||||
})
|
||||
|
||||
afterEach(() => {
|
||||
document.body.innerHTML = ""
|
||||
})
|
||||
|
||||
async function openDialogAndSubmit(serverIds: number[], toUser: number) {
|
||||
render(<BatchMoveServerIcon serverIds={serverIds} />)
|
||||
await act(async () => {
|
||||
fireEvent.click(screen.getByRole("button"))
|
||||
})
|
||||
const userInput = await screen.findByPlaceholderText("User ID")
|
||||
await act(async () => {
|
||||
fireEvent.change(userInput, { target: { value: String(toUser) } })
|
||||
})
|
||||
const submit = screen.getByRole("button", { name: "Move" })
|
||||
await act(async () => {
|
||||
fireEvent.click(submit)
|
||||
})
|
||||
await waitFor(() => expect(toastCalls.length).toBeGreaterThan(0))
|
||||
}
|
||||
|
||||
test("BatchMoveServer toast surfaces agent_too_old count so operator sees the failure", async () => {
|
||||
batchMoveServer.mockResolvedValueOnce([
|
||||
{ server_id: 1, status: "agent_too_old", error: "agent build older than v1.18.0" },
|
||||
{ server_id: 2, status: "pending", transfer_id: 99 },
|
||||
])
|
||||
|
||||
await openDialogAndSubmit([1, 2], 300)
|
||||
|
||||
expect(batchMoveServer).toHaveBeenCalledOnce()
|
||||
const summary = toastCalls[toastCalls.length - 1]
|
||||
expect(summary, "submission must surface a toast").toBeDefined()
|
||||
expect(summary.description, "toast must include the agent_too_old count").toContain(
|
||||
"Transfer.AgentTooOldCount=1",
|
||||
)
|
||||
expect(summary.description).toContain("Transfer.PendingCount=1")
|
||||
})
|
||||
|
||||
test("BatchMoveServer toast does not show Done fallback when every server is agent_too_old", async () => {
|
||||
batchMoveServer.mockResolvedValueOnce([
|
||||
{ server_id: 1, status: "agent_too_old", error: "older than v1.18.0" },
|
||||
{ server_id: 2, status: "agent_too_old", error: "older than v1.18.0" },
|
||||
])
|
||||
|
||||
await openDialogAndSubmit([1, 2], 300)
|
||||
|
||||
const summary = toastCalls[toastCalls.length - 1]
|
||||
expect(summary).toBeDefined()
|
||||
expect(
|
||||
summary.description,
|
||||
"all-failed batch must NOT collapse to a generic Done label — operator would think it succeeded",
|
||||
).toContain("Transfer.AgentTooOldCount=2")
|
||||
expect(summary.description).not.toBe("Done")
|
||||
})
|
||||
@@ -0,0 +1,246 @@
|
||||
import { act, render, waitFor } from "@testing-library/react"
|
||||
import { afterEach, beforeEach, expect, test, vi } from "vitest"
|
||||
|
||||
type DivProps = React.ComponentPropsWithoutRef<"div"> & { asChild?: boolean }
|
||||
type ButtonProps = React.ComponentPropsWithoutRef<"button"> & {
|
||||
asChild?: boolean
|
||||
size?: string
|
||||
variant?: string
|
||||
}
|
||||
type IconButtonProps = ButtonProps & { icon?: string }
|
||||
type SentWebSocketData = string | ArrayBufferLike | Blob | ArrayBufferView
|
||||
|
||||
vi.mock("../components/ui/button", () => ({
|
||||
Button: (props: ButtonProps) => {
|
||||
const { asChild, size, variant, ...buttonProps } = props
|
||||
void asChild
|
||||
void size
|
||||
void variant
|
||||
return <button {...buttonProps} />
|
||||
},
|
||||
}))
|
||||
vi.mock("../components/ui/input", () => ({
|
||||
Input: (props: React.ComponentPropsWithoutRef<"input">) => <input {...props} />,
|
||||
}))
|
||||
vi.mock("../components/ui/table", () => ({
|
||||
Table: (props: React.ComponentPropsWithoutRef<"table">) => <table {...props} />,
|
||||
TableHeader: (props: React.ComponentPropsWithoutRef<"thead">) => <thead {...props} />,
|
||||
TableBody: (props: React.ComponentPropsWithoutRef<"tbody">) => <tbody {...props} />,
|
||||
TableRow: (props: React.ComponentPropsWithoutRef<"tr">) => <tr {...props} />,
|
||||
TableCell: (props: React.ComponentPropsWithoutRef<"td">) => <td {...props} />,
|
||||
TableHead: (props: React.ComponentPropsWithoutRef<"th">) => <th {...props} />,
|
||||
}))
|
||||
vi.mock("../components/ui/dropdown-menu", () => ({
|
||||
DropdownMenu: (props: DivProps) => <div {...props} />,
|
||||
DropdownMenuTrigger: (props: DivProps) => <div {...props} />,
|
||||
DropdownMenuContent: (props: DivProps) => <div {...props} />,
|
||||
DropdownMenuItem: (props: DivProps) => <div {...props} />,
|
||||
}))
|
||||
vi.mock("../components/ui/alert-dialog", () => ({
|
||||
AlertDialog: (props: DivProps) => <div {...props} />,
|
||||
AlertDialogTrigger: (props: DivProps) => <div {...props} />,
|
||||
AlertDialogContent: (props: DivProps) => <div {...props} />,
|
||||
AlertDialogHeader: (props: DivProps) => <div {...props} />,
|
||||
AlertDialogFooter: (props: DivProps) => <div {...props} />,
|
||||
AlertDialogTitle: (props: DivProps) => <div {...props} />,
|
||||
AlertDialogDescription: (props: DivProps) => <div {...props} />,
|
||||
AlertDialogCancel: (props: DivProps) => <div {...props} />,
|
||||
AlertDialogAction: (props: DivProps) => <div {...props} />,
|
||||
}))
|
||||
vi.mock("../components/ui/drawer", () => ({
|
||||
Drawer: (props: DivProps) => <div {...props} />,
|
||||
DrawerContent: (props: DivProps) => <div {...props} />,
|
||||
DrawerHeader: (props: DivProps) => <div {...props} />,
|
||||
DrawerTitle: (props: DivProps) => <div {...props} />,
|
||||
DrawerTrigger: (props: DivProps) => <div {...props} />,
|
||||
}))
|
||||
vi.mock("../components/xui/overlayless-sheet", () => ({
|
||||
Sheet: (props: DivProps) => <div {...props} />,
|
||||
SheetContent: (props: DivProps) => <div {...props} />,
|
||||
SheetDescription: (props: DivProps) => <div {...props} />,
|
||||
SheetHeader: (props: DivProps) => <div {...props} />,
|
||||
SheetTitle: (props: DivProps) => <div {...props} />,
|
||||
SheetTrigger: (props: DivProps) => <div {...props} />,
|
||||
}))
|
||||
vi.mock("../components/xui/filepath", () => ({
|
||||
Filepath: () => <div data-testid="filepath" />,
|
||||
}))
|
||||
vi.mock("../components/xui/icon-button", () => ({
|
||||
IconButton: (props: IconButtonProps) => {
|
||||
const { asChild, icon, size, variant, ...buttonProps } = props
|
||||
void asChild
|
||||
void icon
|
||||
void size
|
||||
void variant
|
||||
return <button {...buttonProps} />
|
||||
},
|
||||
}))
|
||||
vi.mock("../components/xui/virtulized-data-table", () => ({
|
||||
DataTable: () => <div data-testid="data-table" />,
|
||||
}))
|
||||
vi.mock("lucide-react", () => ({
|
||||
File: () => <div data-testid="file-icon" />,
|
||||
Folder: () => <div data-testid="folder-icon" />,
|
||||
}))
|
||||
|
||||
const translate = (key: string) => key
|
||||
|
||||
vi.mock("react-i18next", () => ({
|
||||
useTranslation: () => ({ t: translate }),
|
||||
initReactI18next: { type: "3rdParty", init: () => {} },
|
||||
}))
|
||||
|
||||
vi.mock("sonner", () => ({ toast: vi.fn() }))
|
||||
vi.mock("@/lib/utils", () => ({
|
||||
copyToClipboard: vi.fn(),
|
||||
fm: {
|
||||
parseFMList: async (buf: ArrayBufferLike) => {
|
||||
const view = new DataView(buf)
|
||||
const pathLength = view.getUint32(4, false)
|
||||
const pathBytes = new Uint8Array(buf, 8, pathLength)
|
||||
|
||||
return { path: new TextDecoder().decode(pathBytes), fmList: [] }
|
||||
},
|
||||
},
|
||||
fmWorker: new Worker(""),
|
||||
formatPath: (path: string) => path,
|
||||
}))
|
||||
|
||||
import { FMComponent } from "../components/fm"
|
||||
|
||||
const webSockets: MockWebSocket[] = []
|
||||
|
||||
class MockWebSocket extends EventTarget implements WebSocket {
|
||||
static readonly CONNECTING = 0
|
||||
static readonly OPEN = 1
|
||||
static readonly CLOSING = 2
|
||||
static readonly CLOSED = 3
|
||||
|
||||
readonly CONNECTING = MockWebSocket.CONNECTING
|
||||
readonly OPEN = MockWebSocket.OPEN
|
||||
readonly CLOSING = MockWebSocket.CLOSING
|
||||
readonly CLOSED = MockWebSocket.CLOSED
|
||||
readonly bufferedAmount = 0
|
||||
readonly extensions = ""
|
||||
readonly protocol = ""
|
||||
readonly url: string
|
||||
|
||||
binaryType: BinaryType = "arraybuffer"
|
||||
onclose: ((this: WebSocket, ev: CloseEvent) => unknown) | null = null
|
||||
onerror: ((this: WebSocket, ev: Event) => unknown) | null = null
|
||||
onmessage: ((this: WebSocket, ev: MessageEvent) => unknown) | null = null
|
||||
onopen: ((this: WebSocket, ev: Event) => unknown) | null = null
|
||||
readyState = MockWebSocket.CONNECTING
|
||||
sent: SentWebSocketData[] = []
|
||||
|
||||
constructor(url: string | URL) {
|
||||
super()
|
||||
this.url = url.toString()
|
||||
webSockets.push(this)
|
||||
}
|
||||
|
||||
addEventListener<K extends keyof WebSocketEventMap>(
|
||||
type: K,
|
||||
listener: (this: WebSocket, ev: WebSocketEventMap[K]) => unknown,
|
||||
options?: boolean | AddEventListenerOptions,
|
||||
): void
|
||||
addEventListener(
|
||||
type: string,
|
||||
listener: EventListenerOrEventListenerObject | null,
|
||||
options?: boolean | AddEventListenerOptions,
|
||||
): void {
|
||||
super.addEventListener(type, listener, options)
|
||||
}
|
||||
|
||||
removeEventListener<K extends keyof WebSocketEventMap>(
|
||||
type: K,
|
||||
listener: (this: WebSocket, ev: WebSocketEventMap[K]) => unknown,
|
||||
options?: boolean | EventListenerOptions,
|
||||
): void
|
||||
removeEventListener(
|
||||
type: string,
|
||||
listener: EventListenerOrEventListenerObject | null,
|
||||
options?: boolean | EventListenerOptions,
|
||||
): void {
|
||||
super.removeEventListener(type, listener, options)
|
||||
}
|
||||
|
||||
close(): void {
|
||||
this.readyState = MockWebSocket.CLOSED
|
||||
}
|
||||
|
||||
open(): void {
|
||||
this.readyState = MockWebSocket.OPEN
|
||||
this.onopen?.call(this, new Event("open"))
|
||||
}
|
||||
|
||||
send(data: SentWebSocketData): void {
|
||||
this.sent.push(data)
|
||||
}
|
||||
}
|
||||
|
||||
beforeEach(() => {
|
||||
webSockets.length = 0
|
||||
globalThis.WebSocket = MockWebSocket
|
||||
})
|
||||
|
||||
afterEach(() => {
|
||||
vi.clearAllMocks()
|
||||
})
|
||||
|
||||
const encodeFileNameMessage = (path: string) => {
|
||||
const identifier = new Uint8Array([0x4e, 0x5a, 0x46, 0x4e])
|
||||
const pathBytes = new TextEncoder().encode(path)
|
||||
const payload = new Uint8Array(identifier.length + 4 + pathBytes.length)
|
||||
payload.set(identifier, 0)
|
||||
new DataView(payload.buffer).setUint32(identifier.length, pathBytes.length, false)
|
||||
payload.set(pathBytes, identifier.length + 4)
|
||||
return payload.buffer
|
||||
}
|
||||
|
||||
const encodeCompleteMessage = () => new Uint8Array([0x4e, 0x5a, 0x55, 0x50]).buffer
|
||||
|
||||
const decodeListPath = (data: SentWebSocketData) => {
|
||||
if (!ArrayBuffer.isView(data)) return null
|
||||
|
||||
const bytes = new Uint8Array(data.buffer, data.byteOffset, data.byteLength)
|
||||
if (bytes[0] !== 0) return null
|
||||
|
||||
return new TextDecoder().decode(bytes.slice(1))
|
||||
}
|
||||
|
||||
test("FM websocket lifecycle reuses the socket on path changes", async () => {
|
||||
const { unmount } = render(<FMComponent wsUrl="/ws/file/test" />)
|
||||
|
||||
await waitFor(() => {
|
||||
expect(webSockets).toHaveLength(1)
|
||||
})
|
||||
|
||||
const socket = webSockets[0]
|
||||
act(() => {
|
||||
socket.open()
|
||||
})
|
||||
|
||||
await act(async () => {
|
||||
await socket.onmessage?.call(
|
||||
socket,
|
||||
new MessageEvent("message", { data: encodeFileNameMessage("/new/path") }),
|
||||
)
|
||||
})
|
||||
|
||||
await waitFor(() => {
|
||||
expect(webSockets).toHaveLength(1)
|
||||
expect(decodeListPath(socket.sent[socket.sent.length - 1])).toBe("/new/path")
|
||||
})
|
||||
|
||||
socket.sent.length = 0
|
||||
await act(async () => {
|
||||
await socket.onmessage?.call(socket, new MessageEvent("message", { data: encodeCompleteMessage() }))
|
||||
})
|
||||
|
||||
expect(webSockets).toHaveLength(1)
|
||||
expect(decodeListPath(socket.sent[socket.sent.length - 1])).toBe("/new/path")
|
||||
|
||||
unmount()
|
||||
expect(socket.readyState).toBe(MockWebSocket.CLOSED)
|
||||
})
|
||||
@@ -0,0 +1,36 @@
|
||||
class TestWorker implements Worker {
|
||||
onmessage: ((this: Worker, ev: MessageEvent) => unknown) | null = null
|
||||
onmessageerror: ((this: Worker, ev: MessageEvent) => unknown) | null = null
|
||||
onerror: ((this: AbstractWorker, ev: ErrorEvent) => unknown) | null = null
|
||||
|
||||
addEventListener(): void {}
|
||||
removeEventListener(): void {}
|
||||
dispatchEvent(): boolean {
|
||||
return true
|
||||
}
|
||||
postMessage(): void {}
|
||||
terminate(): void {}
|
||||
}
|
||||
|
||||
class TestResizeObserver implements ResizeObserver {
|
||||
observe(): void {}
|
||||
unobserve(): void {}
|
||||
disconnect(): void {}
|
||||
}
|
||||
|
||||
class TestIntersectionObserver implements IntersectionObserver {
|
||||
readonly root: Element | Document | null = null
|
||||
readonly rootMargin = ""
|
||||
readonly thresholds: ReadonlyArray<number> = []
|
||||
|
||||
observe(): void {}
|
||||
unobserve(): void {}
|
||||
disconnect(): void {}
|
||||
takeRecords(): IntersectionObserverEntry[] {
|
||||
return []
|
||||
}
|
||||
}
|
||||
|
||||
globalThis.Worker = TestWorker
|
||||
globalThis.ResizeObserver = TestResizeObserver
|
||||
globalThis.IntersectionObserver = TestIntersectionObserver
|
||||
@@ -0,0 +1,103 @@
|
||||
import { render } from "@testing-library/react"
|
||||
import { afterEach, beforeEach, expect, test, vi } from "vitest"
|
||||
|
||||
vi.mock("sonner", () => ({ toast: () => undefined }))
|
||||
|
||||
vi.mock("@/lib/utils", () => ({
|
||||
sleep: () => Promise.resolve(),
|
||||
cn: (...args: unknown[]) => args.filter(Boolean).join(" "),
|
||||
}))
|
||||
|
||||
const attachAddonInstances: { ws: WebSocket }[] = []
|
||||
vi.mock("@xterm/addon-attach", () => ({
|
||||
AttachAddon: class {
|
||||
ws: WebSocket
|
||||
constructor(ws: WebSocket) {
|
||||
this.ws = ws
|
||||
attachAddonInstances.push(this)
|
||||
}
|
||||
activate() {}
|
||||
dispose() {}
|
||||
},
|
||||
}))
|
||||
|
||||
vi.mock("@xterm/addon-fit", () => ({
|
||||
FitAddon: class {
|
||||
activate() {}
|
||||
dispose() {}
|
||||
fit() {}
|
||||
proposeDimensions() {
|
||||
return { rows: 24, cols: 80 }
|
||||
}
|
||||
},
|
||||
}))
|
||||
|
||||
vi.mock("@xterm/xterm", () => ({
|
||||
Terminal: class {
|
||||
loadAddon() {}
|
||||
open() {}
|
||||
dispose() {}
|
||||
},
|
||||
}))
|
||||
|
||||
class FakeWebSocket {
|
||||
static instances: FakeWebSocket[] = []
|
||||
url: string
|
||||
binaryType = "arraybuffer"
|
||||
onopen: ((ev: Event) => unknown) | null = null
|
||||
onclose: ((ev: Event) => unknown) | null = null
|
||||
onerror: ((ev: Event) => unknown) | null = null
|
||||
onmessage: ((ev: MessageEvent) => unknown) | null = null
|
||||
readyState = 0
|
||||
closeCalls = 0
|
||||
|
||||
constructor(url: string | URL) {
|
||||
this.url = url.toString()
|
||||
FakeWebSocket.instances.push(this)
|
||||
}
|
||||
|
||||
close() {
|
||||
this.closeCalls += 1
|
||||
this.readyState = 3
|
||||
}
|
||||
|
||||
send() {}
|
||||
addEventListener() {}
|
||||
removeEventListener() {}
|
||||
dispatchEvent() {
|
||||
return true
|
||||
}
|
||||
}
|
||||
|
||||
beforeEach(() => {
|
||||
FakeWebSocket.instances = []
|
||||
attachAddonInstances.length = 0
|
||||
;(globalThis as { WebSocket: typeof WebSocket }).WebSocket =
|
||||
FakeWebSocket as unknown as typeof WebSocket
|
||||
})
|
||||
|
||||
afterEach(() => {
|
||||
vi.clearAllMocks()
|
||||
})
|
||||
|
||||
test("XtermComponent closes the previous WebSocket and re-attaches xterm when wsUrl changes", async () => {
|
||||
const { XtermComponent } = await import("../components/terminal")
|
||||
const noop = () => undefined
|
||||
|
||||
const { rerender } = render(
|
||||
<XtermComponent wsUrl="/api/v1/ws/terminal/session-1" setClose={noop} />,
|
||||
)
|
||||
|
||||
expect(FakeWebSocket.instances).toHaveLength(1)
|
||||
const firstSocket = FakeWebSocket.instances[0]
|
||||
expect(attachAddonInstances).toHaveLength(1)
|
||||
expect(attachAddonInstances[0].ws).toBe(firstSocket as unknown as WebSocket)
|
||||
|
||||
rerender(<XtermComponent wsUrl="/api/v1/ws/terminal/session-2" setClose={noop} />)
|
||||
|
||||
expect(FakeWebSocket.instances).toHaveLength(2)
|
||||
const secondSocket = FakeWebSocket.instances[1]
|
||||
expect(firstSocket.closeCalls).toBeGreaterThanOrEqual(1)
|
||||
expect(attachAddonInstances).toHaveLength(2)
|
||||
expect(attachAddonInstances[1].ws).toBe(secondSocket as unknown as WebSocket)
|
||||
})
|
||||
@@ -0,0 +1,139 @@
|
||||
import { act, render, screen, waitFor } from "@testing-library/react"
|
||||
import { afterEach, beforeEach, expect, test, vi } from "vitest"
|
||||
|
||||
const toastCalls: Array<{ title: string; description: string }> = []
|
||||
vi.mock("sonner", () => ({
|
||||
toast: (title: string, opts?: { description?: string }) => {
|
||||
toastCalls.push({ title, description: opts?.description ?? "" })
|
||||
},
|
||||
}))
|
||||
|
||||
vi.mock("react-i18next", () => ({
|
||||
useTranslation: () => ({
|
||||
t: (key: string) => key,
|
||||
}),
|
||||
initReactI18next: { type: "3rdParty", init: () => undefined },
|
||||
Trans: ({ children }: { children?: React.ReactNode }) => children ?? null,
|
||||
}))
|
||||
|
||||
const cancelServerTransfer = vi.fn()
|
||||
const retryServerTransfer = vi.fn()
|
||||
vi.mock("@/api/transfer", () => ({
|
||||
cancelServerTransfer: (...args: unknown[]) => cancelServerTransfer(...args),
|
||||
retryServerTransfer: (...args: unknown[]) => retryServerTransfer(...args),
|
||||
}))
|
||||
|
||||
const swrFetcher = vi.fn()
|
||||
vi.mock("@/api/api", () => ({
|
||||
swrFetcher: (...args: unknown[]) => swrFetcher(...args),
|
||||
}))
|
||||
|
||||
vi.mock("swr", () => ({
|
||||
default: (_key: string, _fetcher: unknown) => ({
|
||||
data: mockedRows,
|
||||
mutate: vi.fn(),
|
||||
error: undefined,
|
||||
}),
|
||||
}))
|
||||
|
||||
let mockProfile: { id: number; role: number } | undefined
|
||||
vi.mock("@/hooks/useAuth", () => ({
|
||||
useAuth: () => ({ profile: mockProfile }),
|
||||
}))
|
||||
vi.mock("@/hooks/useMainStore", () => ({
|
||||
useMainStore: (selector?: (s: { profile?: { id: number; role: number } }) => unknown) => {
|
||||
const store = { profile: mockProfile }
|
||||
return selector ? selector(store) : store
|
||||
},
|
||||
}))
|
||||
|
||||
import type { ModelServerTransfer } from "@/types"
|
||||
|
||||
let mockedRows: ModelServerTransfer[] = []
|
||||
|
||||
beforeEach(() => {
|
||||
toastCalls.length = 0
|
||||
cancelServerTransfer.mockReset()
|
||||
retryServerTransfer.mockReset()
|
||||
mockedRows = []
|
||||
mockProfile = undefined
|
||||
})
|
||||
|
||||
afterEach(() => {
|
||||
document.body.innerHTML = ""
|
||||
})
|
||||
|
||||
function makeRow(overrides: Partial<ModelServerTransfer>): ModelServerTransfer {
|
||||
return {
|
||||
id: 1,
|
||||
server_id: 10,
|
||||
from_user_id: 100,
|
||||
to_user_id: 200,
|
||||
initiator_id: 100,
|
||||
status: 0,
|
||||
last_error: "",
|
||||
acked_at: "",
|
||||
created_at: "2024-01-01T00:00:00Z",
|
||||
updated_at: "2024-01-01T00:00:00Z",
|
||||
...overrides,
|
||||
} as ModelServerTransfer
|
||||
}
|
||||
|
||||
async function renderPage() {
|
||||
const { default: TransferPage } = await import("@/routes/transfer")
|
||||
await act(async () => {
|
||||
render(<TransferPage />)
|
||||
})
|
||||
await waitFor(() => {
|
||||
expect(screen.getByText("Transfer.Title")).toBeTruthy()
|
||||
})
|
||||
}
|
||||
|
||||
test("non-admin member who is the FromUserID sees Cancel for pending rows but NOT Retry for terminal rows", async () => {
|
||||
mockProfile = { id: 100, role: 1 }
|
||||
mockedRows = [
|
||||
makeRow({ id: 1, status: 0, from_user_id: 100 }),
|
||||
makeRow({ id: 2, status: 2, from_user_id: 100 }),
|
||||
makeRow({ id: 3, status: 4, from_user_id: 100 }),
|
||||
]
|
||||
|
||||
await renderPage()
|
||||
|
||||
expect(screen.queryAllByRole("button", { name: "Cancel" }).length).toBeGreaterThan(0)
|
||||
expect(
|
||||
screen.queryAllByRole("button", { name: "Transfer.Retry" }),
|
||||
"Retry is admin-only on the backend; rendering it for members produces guaranteed permission_denied on click",
|
||||
).toHaveLength(0)
|
||||
})
|
||||
|
||||
test("non-admin member who is only the ToUserID or InitiatorID sees neither Cancel nor Retry", async () => {
|
||||
mockProfile = { id: 200, role: 1 }
|
||||
mockedRows = [
|
||||
makeRow({ id: 1, status: 0, from_user_id: 100, to_user_id: 200 }),
|
||||
makeRow({ id: 2, status: 3, from_user_id: 100, to_user_id: 200 }),
|
||||
]
|
||||
|
||||
await renderPage()
|
||||
|
||||
expect(
|
||||
screen.queryAllByRole("button", { name: "Cancel" }),
|
||||
"backend cancelServerTransfer rejects non-admins that are not the FromUserID; UI must not pretend it works",
|
||||
).toHaveLength(0)
|
||||
expect(
|
||||
screen.queryAllByRole("button", { name: "Transfer.Retry" }),
|
||||
"backend retryServerTransfer is admin-only; non-admin must not see the button",
|
||||
).toHaveLength(0)
|
||||
})
|
||||
|
||||
test("admin sees both Cancel for pending and Retry for terminal", async () => {
|
||||
mockProfile = { id: 1, role: 0 }
|
||||
mockedRows = [
|
||||
makeRow({ id: 1, status: 0 }),
|
||||
makeRow({ id: 2, status: 2 }),
|
||||
]
|
||||
|
||||
await renderPage()
|
||||
|
||||
expect(screen.queryAllByRole("button", { name: "Cancel" }).length).toBe(1)
|
||||
expect(screen.queryAllByRole("button", { name: "Transfer.Retry" }).length).toBe(1)
|
||||
})
|
||||
+52
-1
@@ -1,4 +1,3 @@
|
||||
/* eslint-disable */
|
||||
/* tslint:disable */
|
||||
/*
|
||||
* ---------------------------------------------------------------
|
||||
@@ -193,6 +192,46 @@ export interface ModelBatchMoveServerForm {
|
||||
to_user: number
|
||||
}
|
||||
|
||||
// ModelServerTransferStatus mirrors model.ServerTransferStatus in nezha. The
|
||||
// values are stable iota numbers; do NOT renumber without coordinating with
|
||||
// the backend or every existing transfer row will be misread.
|
||||
export const ModelServerTransferStatusPending = 0
|
||||
export const ModelServerTransferStatusVerified = 1
|
||||
export const ModelServerTransferStatusFailed = 2
|
||||
export const ModelServerTransferStatusTimeout = 3
|
||||
export const ModelServerTransferStatusCancelled = 4
|
||||
export type ModelServerTransferStatus = 0 | 1 | 2 | 3 | 4
|
||||
|
||||
// ModelBatchMoveServerResultStatus enumerates the per-server outcomes of
|
||||
// /batch-move/server. Mirrors model.BatchMoveServerResultStatus.
|
||||
export type ModelBatchMoveServerResultStatus =
|
||||
| "pending"
|
||||
| "permission_denied"
|
||||
| "already_transferring"
|
||||
| "server_not_found"
|
||||
| "same_owner"
|
||||
| "agent_too_old"
|
||||
|
||||
export interface ModelBatchMoveServerResult {
|
||||
server_id: number
|
||||
status: ModelBatchMoveServerResultStatus
|
||||
transfer_id?: number
|
||||
error?: string
|
||||
}
|
||||
|
||||
export interface ModelServerTransfer {
|
||||
id: number
|
||||
created_at: string
|
||||
updated_at: string
|
||||
server_id: number
|
||||
from_user_id: number
|
||||
to_user_id: number
|
||||
initiator_id: number
|
||||
status: ModelServerTransferStatus
|
||||
last_error?: string
|
||||
acked_at?: string
|
||||
}
|
||||
|
||||
export interface ModelCreateFMResponse {
|
||||
session_id: string
|
||||
}
|
||||
@@ -500,6 +539,14 @@ export interface ModelSensorTemperature {
|
||||
temperature?: number
|
||||
}
|
||||
|
||||
// ModelServerOwner mirrors model.ServerOwnerInfo from the backend. Server.id
|
||||
// is always present; username is omitted for the legacy uid=0 pseudo-owner
|
||||
// and for users that no longer exist in the User table.
|
||||
export interface ModelServerOwner {
|
||||
id: number
|
||||
username?: string
|
||||
}
|
||||
|
||||
export interface ModelServer {
|
||||
created_at: string
|
||||
/** DDNS配置 */
|
||||
@@ -518,6 +565,10 @@ export interface ModelServer {
|
||||
/** 管理员可见备注 */
|
||||
note: string
|
||||
override_ddns_domains?: Record<string, string[]>
|
||||
/** Owner identity from model.Server.MarshalJSON. Always present for
|
||||
* current backends; optional here for compatibility with older
|
||||
* dashboards that pre-date the owner field. */
|
||||
owner?: ModelServerOwner
|
||||
/** 公开备注 */
|
||||
public_note: string
|
||||
state: ModelHostState
|
||||
|
||||
+2
-2
@@ -16,7 +16,7 @@ export const AgentConfigSchema = z.object({
|
||||
try {
|
||||
JSON.parse(val)
|
||||
return true
|
||||
} catch (e) {
|
||||
} catch {
|
||||
return false
|
||||
}
|
||||
},
|
||||
@@ -33,7 +33,7 @@ export const AgentConfigSchema = z.object({
|
||||
try {
|
||||
JSON.parse(val)
|
||||
return true
|
||||
} catch (e) {
|
||||
} catch {
|
||||
return false
|
||||
}
|
||||
},
|
||||
|
||||
@@ -0,0 +1,14 @@
|
||||
import { defineConfig, mergeConfig } from "vitest/config"
|
||||
|
||||
import viteConfig from "./vite.config.ts"
|
||||
|
||||
export default mergeConfig(
|
||||
viteConfig,
|
||||
defineConfig({
|
||||
test: {
|
||||
environment: "jsdom",
|
||||
globals: true,
|
||||
setupFiles: ["./src/test/setup.ts"],
|
||||
},
|
||||
}),
|
||||
)
|
||||
Reference in New Issue
Block a user