726 lines
21 KiB
TypeScript
726 lines
21 KiB
TypeScript
import dayjs from "dayjs";
|
||
import { mutate } from "swr";
|
||
import { useEffect, useState } from "react";
|
||
import { useLockFn } from "ahooks";
|
||
import { useTranslation } from "react-i18next";
|
||
import { useSortable } from "@dnd-kit/sortable";
|
||
import { CSS } from "@dnd-kit/utilities";
|
||
import {
|
||
Box,
|
||
Typography,
|
||
LinearProgress,
|
||
IconButton,
|
||
keyframes,
|
||
MenuItem,
|
||
Menu,
|
||
CircularProgress,
|
||
} from "@mui/material";
|
||
import { RefreshRounded, DragIndicatorRounded } from "@mui/icons-material";
|
||
import { useLoadingCache, useSetLoadingCache } from "@/services/states";
|
||
import {
|
||
viewProfile,
|
||
readProfileFile,
|
||
updateProfile,
|
||
saveProfileFile,
|
||
getNextUpdateTime,
|
||
} from "@/services/cmds";
|
||
import { showNotice } from "@/services/noticeService";
|
||
import { GroupsEditorViewer } from "@/components/profile/groups-editor-viewer";
|
||
import { RulesEditorViewer } from "@/components/profile/rules-editor-viewer";
|
||
import { EditorViewer } from "@/components/profile/editor-viewer";
|
||
import { ProfileBox } from "./profile-box";
|
||
import parseTraffic from "@/utils/parse-traffic";
|
||
import { ConfirmViewer } from "@/components/profile/confirm-viewer";
|
||
import { open } from "@tauri-apps/plugin-shell";
|
||
import { ProxiesEditorViewer } from "./proxies-editor-viewer";
|
||
const round = keyframes`
|
||
from { transform: rotate(0deg); }
|
||
to { transform: rotate(360deg); }
|
||
`;
|
||
|
||
interface Props {
|
||
id: string;
|
||
selected: boolean;
|
||
activating: boolean;
|
||
itemData: IProfileItem;
|
||
onSelect: (force: boolean) => void;
|
||
onEdit: () => void;
|
||
onSave?: (prev?: string, curr?: string) => void;
|
||
onDelete: () => void;
|
||
}
|
||
|
||
export const ProfileItem = (props: Props) => {
|
||
const { selected, activating, itemData, onSelect, onEdit, onSave, onDelete } =
|
||
props;
|
||
const {
|
||
attributes,
|
||
listeners,
|
||
setNodeRef,
|
||
transform,
|
||
transition,
|
||
isDragging,
|
||
} = useSortable({ id: props.id });
|
||
|
||
const { t } = useTranslation();
|
||
const [anchorEl, setAnchorEl] = useState<any>(null);
|
||
const [position, setPosition] = useState({ left: 0, top: 0 });
|
||
const loadingCache = useLoadingCache();
|
||
const setLoadingCache = useSetLoadingCache();
|
||
|
||
// 新增状态：是否显示下次更新时间
|
||
const [showNextUpdate, setShowNextUpdate] = useState(false);
|
||
const [nextUpdateTime, setNextUpdateTime] = useState("");
|
||
|
||
const { uid, name = "Profile", extra, updated = 0, option } = itemData;
|
||
|
||
// 获取下次更新时间的函数
|
||
const fetchNextUpdateTime = useLockFn(async (forceRefresh = false) => {
|
||
if (itemData.option?.update_interval && itemData.option.update_interval > 0) {
|
||
try {
|
||
console.log(`尝试获取配置 ${itemData.uid} 的下次更新时间`);
|
||
|
||
// 如果需要强制刷新，先触发Timer.refresh()
|
||
if (forceRefresh) {
|
||
// 这里可以通过一个新的API来触发刷新，但目前我们依赖patch_profile中的刷新
|
||
console.log(`强制刷新定时器任务`);
|
||
}
|
||
|
||
const nextUpdate = await getNextUpdateTime(itemData.uid);
|
||
console.log(`获取到下次更新时间结果:`, nextUpdate);
|
||
|
||
if (nextUpdate) {
|
||
const nextUpdateDate = dayjs(nextUpdate * 1000);
|
||
const now = dayjs();
|
||
|
||
// 如果已经过期，显示"更新失败"
|
||
if (nextUpdateDate.isBefore(now)) {
|
||
setNextUpdateTime(t("Last Update failed"));
|
||
} else {
|
||
// 否则显示剩余时间
|
||
const diffMinutes = nextUpdateDate.diff(now, 'minute');
|
||
|
||
if (diffMinutes < 60) {
|
||
if (diffMinutes <= 0) {
|
||
setNextUpdateTime(`${t("Next Up")} <1m`);
|
||
} else {
|
||
setNextUpdateTime(`${t("Next Up")} ${diffMinutes}m`);
|
||
}
|
||
} else {
|
||
const hours = Math.floor(diffMinutes / 60);
|
||
const mins = diffMinutes % 60;
|
||
setNextUpdateTime(`${t("Next Up")} ${hours}h ${mins}m`);
|
||
}
|
||
}
|
||
} else {
|
||
console.log(`返回的下次更新时间为空`);
|
||
setNextUpdateTime(t("No schedule"));
|
||
}
|
||
} catch (err) {
|
||
console.error(`获取下次更新时间出错:`, err);
|
||
setNextUpdateTime(t("Unknown"));
|
||
}
|
||
} else {
|
||
console.log(`该配置未设置更新间隔或间隔为0`);
|
||
setNextUpdateTime(t("Auto update disabled"));
|
||
}
|
||
});
|
||
|
||
// 切换显示模式的函数
|
||
const toggleUpdateTimeDisplay = (e: React.MouseEvent) => {
|
||
e.stopPropagation();
|
||
|
||
if (!showNextUpdate) {
|
||
fetchNextUpdateTime();
|
||
}
|
||
|
||
setShowNextUpdate(!showNextUpdate);
|
||
};
|
||
|
||
// 当组件加载或更新间隔变化时更新下次更新时间
|
||
useEffect(() => {
|
||
if (showNextUpdate) {
|
||
fetchNextUpdateTime();
|
||
}
|
||
}, [showNextUpdate, itemData.option?.update_interval, updated]);
|
||
|
||
// 订阅定时器更新事件
|
||
useEffect(() => {
|
||
// 处理定时器更新事件 - 这个事件专门用于通知定时器变更
|
||
const handleTimerUpdate = (event: any) => {
|
||
const updatedUid = event.payload as string;
|
||
|
||
// 只有当更新的是当前配置时才刷新显示
|
||
if (updatedUid === itemData.uid && showNextUpdate) {
|
||
console.log(`收到定时器更新事件: uid=${updatedUid}`);
|
||
setTimeout(() => {
|
||
fetchNextUpdateTime(true);
|
||
}, 1000);
|
||
}
|
||
};
|
||
|
||
// 只注册定时器更新事件监听
|
||
window.addEventListener('verge://timer-updated', handleTimerUpdate as EventListener);
|
||
|
||
return () => {
|
||
// 清理事件监听
|
||
window.removeEventListener('verge://timer-updated', handleTimerUpdate as EventListener);
|
||
};
|
||
}, [showNextUpdate, itemData.uid]);
|
||
|
||
// local file mode
|
||
// remote file mode
|
||
// remote file mode
|
||
const hasUrl = !!itemData.url;
|
||
const hasExtra = !!extra; // only subscription url has extra info
|
||
const hasHome = !!itemData.home; // only subscription url has home page
|
||
|
||
const { upload = 0, download = 0, total = 0 } = extra ?? {};
|
||
const from = parseUrl(itemData.url);
|
||
const description = itemData.desc;
|
||
const expire = parseExpire(extra?.expire);
|
||
const progress = Math.min(
|
||
Math.round(((download + upload) * 100) / (total + 0.01)) + 1,
|
||
100,
|
||
);
|
||
|
||
const loading = loadingCache[itemData.uid] ?? false;
|
||
|
||
// interval update fromNow field
|
||
const [, setRefresh] = useState({});
|
||
useEffect(() => {
|
||
if (!hasUrl) return;
|
||
|
||
let timer: any = null;
|
||
|
||
const handler = () => {
|
||
const now = Date.now();
|
||
const lastUpdate = updated * 1000;
|
||
// 大于一天的不管
|
||
if (now - lastUpdate >= 24 * 36e5) return;
|
||
|
||
const wait = now - lastUpdate >= 36e5 ? 30e5 : 5e4;
|
||
|
||
timer = setTimeout(() => {
|
||
setRefresh({});
|
||
handler();
|
||
}, wait);
|
||
};
|
||
|
||
handler();
|
||
|
||
return () => {
|
||
if (timer) clearTimeout(timer);
|
||
};
|
||
}, [hasUrl, updated]);
|
||
|
||
const [fileOpen, setFileOpen] = useState(false);
|
||
const [rulesOpen, setRulesOpen] = useState(false);
|
||
const [proxiesOpen, setProxiesOpen] = useState(false);
|
||
const [groupsOpen, setGroupsOpen] = useState(false);
|
||
const [mergeOpen, setMergeOpen] = useState(false);
|
||
const [scriptOpen, setScriptOpen] = useState(false);
|
||
const [confirmOpen, setConfirmOpen] = useState(false);
|
||
|
||
const onOpenHome = () => {
|
||
setAnchorEl(null);
|
||
open(itemData.home ?? "");
|
||
};
|
||
|
||
const onEditInfo = () => {
|
||
setAnchorEl(null);
|
||
onEdit();
|
||
};
|
||
|
||
const onEditFile = () => {
|
||
setAnchorEl(null);
|
||
setFileOpen(true);
|
||
};
|
||
|
||
const onEditRules = () => {
|
||
setAnchorEl(null);
|
||
setRulesOpen(true);
|
||
};
|
||
|
||
const onEditProxies = () => {
|
||
setAnchorEl(null);
|
||
setProxiesOpen(true);
|
||
};
|
||
|
||
const onEditGroups = () => {
|
||
setAnchorEl(null);
|
||
setGroupsOpen(true);
|
||
};
|
||
|
||
const onEditMerge = () => {
|
||
setAnchorEl(null);
|
||
setMergeOpen(true);
|
||
};
|
||
|
||
const onEditScript = () => {
|
||
setAnchorEl(null);
|
||
setScriptOpen(true);
|
||
};
|
||
|
||
const onForceSelect = () => {
|
||
setAnchorEl(null);
|
||
onSelect(true);
|
||
};
|
||
|
||
const onOpenFile = useLockFn(async () => {
|
||
setAnchorEl(null);
|
||
try {
|
||
await viewProfile(itemData.uid);
|
||
} catch (err: any) {
|
||
showNotice('error', err?.message || err.toString());
|
||
}
|
||
});
|
||
|
||
/// 0 不使用任何代理
|
||
/// 1 使用订阅好的代理
|
||
/// 2 至少使用一个代理，根据订阅，如果没订阅，默认使用系统代理
|
||
const onUpdate = useLockFn(async (type: 0 | 1 | 2): Promise<void> => {
|
||
setAnchorEl(null);
|
||
setLoadingCache((cache) => ({ ...cache, [itemData.uid]: true }));
|
||
|
||
// 根据类型设置初始更新选项
|
||
const option: Partial<IProfileOption> = {};
|
||
if (type === 0) {
|
||
option.with_proxy = false;
|
||
option.self_proxy = false;
|
||
} else if (type === 2) {
|
||
if (itemData.option?.self_proxy) {
|
||
option.with_proxy = false;
|
||
option.self_proxy = true;
|
||
} else {
|
||
option.with_proxy = true;
|
||
option.self_proxy = false;
|
||
}
|
||
}
|
||
|
||
try {
|
||
// 调用后端更新（后端会自动处理回退逻辑）
|
||
await updateProfile(itemData.uid, option);
|
||
|
||
// 更新成功，刷新列表
|
||
showNotice('success', t("Update subscription successfully"));
|
||
mutate("getProfiles");
|
||
} catch (err: any) {
|
||
// 更新完全失败（包括后端的回退尝试）
|
||
// 不需要做处理，后端会通过事件通知系统发送错误
|
||
} finally {
|
||
setLoadingCache((cache) => ({ ...cache, [itemData.uid]: false }));
|
||
}
|
||
});
|
||
|
||
const urlModeMenu = (
|
||
hasHome ? [{ label: "Home", handler: onOpenHome, disabled: false }] : []
|
||
).concat([
|
||
{ label: "Select", handler: onForceSelect, disabled: false },
|
||
{ label: "Edit Info", handler: onEditInfo, disabled: false },
|
||
{ label: "Edit File", handler: onEditFile, disabled: false },
|
||
{
|
||
label: "Edit Rules",
|
||
handler: onEditRules,
|
||
disabled: !option?.rules,
|
||
},
|
||
{
|
||
label: "Edit Proxies",
|
||
handler: onEditProxies,
|
||
disabled: !option?.proxies,
|
||
},
|
||
{
|
||
label: "Edit Groups",
|
||
handler: onEditGroups,
|
||
disabled: !option?.groups,
|
||
},
|
||
{
|
||
label: "Extend Config",
|
||
handler: onEditMerge,
|
||
disabled: !option?.merge,
|
||
},
|
||
{
|
||
label: "Extend Script",
|
||
handler: onEditScript,
|
||
disabled: !option?.script,
|
||
},
|
||
{ label: "Open File", handler: onOpenFile, disabled: false },
|
||
{ label: "Update", handler: () => onUpdate(0), disabled: false },
|
||
{ label: "Update via proxy", handler: () => onUpdate(2), disabled: false },
|
||
{
|
||
label: "Delete",
|
||
handler: () => {
|
||
setAnchorEl(null);
|
||
setConfirmOpen(true);
|
||
},
|
||
disabled: false,
|
||
},
|
||
]);
|
||
const fileModeMenu = [
|
||
{ label: "Select", handler: onForceSelect, disabled: false },
|
||
{ label: "Edit Info", handler: onEditInfo, disabled: false },
|
||
{ label: "Edit File", handler: onEditFile, disabled: false },
|
||
{
|
||
label: "Edit Rules",
|
||
handler: onEditRules,
|
||
disabled: !option?.rules,
|
||
},
|
||
{
|
||
label: "Edit Proxies",
|
||
handler: onEditProxies,
|
||
disabled: !option?.proxies,
|
||
},
|
||
{
|
||
label: "Edit Groups",
|
||
handler: onEditGroups,
|
||
disabled: !option?.groups,
|
||
},
|
||
{
|
||
label: "Extend Config",
|
||
handler: onEditMerge,
|
||
disabled: !option?.merge,
|
||
},
|
||
{
|
||
label: "Extend Script",
|
||
handler: onEditScript,
|
||
disabled: !option?.script,
|
||
},
|
||
{ label: "Open File", handler: onOpenFile, disabled: false },
|
||
{
|
||
label: "Delete",
|
||
handler: () => {
|
||
setAnchorEl(null);
|
||
setConfirmOpen(true);
|
||
},
|
||
disabled: false,
|
||
},
|
||
];
|
||
|
||
const boxStyle = {
|
||
height: 26,
|
||
display: "flex",
|
||
alignItems: "center",
|
||
justifyContent: "space-between",
|
||
};
|
||
|
||
// 监听自动更新事件
|
||
useEffect(() => {
|
||
const handleUpdateStarted = (event: CustomEvent) => {
|
||
if (event.detail.uid === itemData.uid) {
|
||
setLoadingCache((cache) => ({ ...cache, [itemData.uid]: true }));
|
||
}
|
||
};
|
||
|
||
const handleUpdateCompleted = (event: CustomEvent) => {
|
||
if (event.detail.uid === itemData.uid) {
|
||
setLoadingCache((cache) => ({ ...cache, [itemData.uid]: false }));
|
||
// 更新完成后刷新显示
|
||
if (showNextUpdate) {
|
||
fetchNextUpdateTime();
|
||
}
|
||
}
|
||
};
|
||
|
||
// 注册事件监听
|
||
window.addEventListener('profile-update-started', handleUpdateStarted as EventListener);
|
||
window.addEventListener('profile-update-completed', handleUpdateCompleted as EventListener);
|
||
|
||
return () => {
|
||
// 清理事件监听
|
||
window.removeEventListener('profile-update-started', handleUpdateStarted as EventListener);
|
||
window.removeEventListener('profile-update-completed', handleUpdateCompleted as EventListener);
|
||
};
|
||
}, [itemData.uid, showNextUpdate]);
|
||
|
||
return (
|
||
<Box
|
||
sx={{
|
||
position: "relative",
|
||
transform: CSS.Transform.toString(transform),
|
||
transition,
|
||
zIndex: isDragging ? "calc(infinity)" : undefined,
|
||
}}
|
||
>
|
||
<ProfileBox
|
||
aria-selected={selected}
|
||
onClick={() => onSelect(false)}
|
||
onContextMenu={(event) => {
|
||
const { clientX, clientY } = event;
|
||
setPosition({ top: clientY, left: clientX });
|
||
setAnchorEl(event.currentTarget);
|
||
event.preventDefault();
|
||
}}
|
||
>
|
||
{activating && (
|
||
<Box
|
||
sx={{
|
||
position: "absolute",
|
||
display: "flex",
|
||
justifyContent: "center",
|
||
alignItems: "center",
|
||
top: 10,
|
||
left: 10,
|
||
right: 10,
|
||
bottom: 2,
|
||
zIndex: 10,
|
||
backdropFilter: "blur(2px)",
|
||
}}
|
||
>
|
||
<CircularProgress color="inherit" size={20} />
|
||
</Box>
|
||
)}
|
||
<Box position="relative">
|
||
<Box sx={{ display: "flex", justifyContent: "start" }}>
|
||
<Box
|
||
ref={setNodeRef}
|
||
sx={{ display: "flex", margin: "auto 0" }}
|
||
{...attributes}
|
||
{...listeners}
|
||
>
|
||
<DragIndicatorRounded
|
||
sx={[
|
||
{ cursor: "move", marginLeft: "-6px" },
|
||
({ palette: { text } }) => {
|
||
return { color: text.primary };
|
||
},
|
||
]}
|
||
/>
|
||
</Box>
|
||
|
||
<Typography
|
||
width="calc(100% - 36px)"
|
||
sx={{ fontSize: "18px", fontWeight: "600", lineHeight: "26px" }}
|
||
variant="h6"
|
||
component="h2"
|
||
noWrap
|
||
title={name}
|
||
>
|
||
{name}
|
||
</Typography>
|
||
</Box>
|
||
|
||
{/* only if has url can it be updated */}
|
||
{hasUrl && (
|
||
<IconButton
|
||
title={t("Refresh")}
|
||
sx={{
|
||
position: "absolute",
|
||
p: "3px",
|
||
top: -1,
|
||
right: -5,
|
||
animation: loading ? `1s linear infinite ${round}` : "none",
|
||
}}
|
||
size="small"
|
||
color="inherit"
|
||
disabled={loading}
|
||
onClick={(e) => {
|
||
e.stopPropagation();
|
||
onUpdate(1);
|
||
}}
|
||
>
|
||
<RefreshRounded color="inherit" />
|
||
</IconButton>
|
||
)}
|
||
</Box>
|
||
{/* the second line show url's info or description */}
|
||
<Box sx={boxStyle}>
|
||
{
|
||
<>
|
||
{description ? (
|
||
<Typography
|
||
noWrap
|
||
title={description}
|
||
sx={{ fontSize: "14px" }}
|
||
>
|
||
{description}
|
||
</Typography>
|
||
) : (
|
||
hasUrl && (
|
||
<Typography noWrap title={`${t("From")} ${from}`}>
|
||
{from}
|
||
</Typography>
|
||
)
|
||
)}
|
||
{hasUrl && (
|
||
<Box sx={{ display: "flex", justifyContent: "flex-end", ml: "auto" }}>
|
||
<Typography
|
||
noWrap
|
||
component="span"
|
||
fontSize={14}
|
||
textAlign="right"
|
||
title={showNextUpdate ? t("Click to show last update time") : `${t("Update Time")}: ${parseExpire(updated)}\n${t("Click to show next update")}`}
|
||
sx={{
|
||
cursor: "pointer",
|
||
display: "inline-block",
|
||
borderBottom: "1px dashed transparent",
|
||
transition: "all 0.2s",
|
||
"&:hover": {
|
||
borderBottomColor: "primary.main",
|
||
color: "primary.main",
|
||
}
|
||
}}
|
||
onClick={toggleUpdateTimeDisplay}
|
||
>
|
||
{showNextUpdate
|
||
? nextUpdateTime
|
||
: (updated > 0 ? dayjs(updated * 1000).fromNow() : "")}
|
||
</Typography>
|
||
</Box>
|
||
)}
|
||
</>
|
||
}
|
||
</Box>
|
||
{/* the third line show extra info or last updated time */}
|
||
{hasExtra ? (
|
||
<Box sx={{ ...boxStyle, fontSize: 14 }}>
|
||
<span title={t("Used / Total")}>
|
||
{parseTraffic(upload + download)} / {parseTraffic(total)}
|
||
</span>
|
||
<span title={t("Expire Time")}>{expire}</span>
|
||
</Box>
|
||
) : (
|
||
<Box sx={{ ...boxStyle, fontSize: 12, justifyContent: "flex-end" }}>
|
||
<span title={t("Update Time")}>{parseExpire(updated)}</span>
|
||
</Box>
|
||
)}
|
||
<LinearProgress
|
||
variant="determinate"
|
||
value={progress}
|
||
style={{ opacity: total > 0 ? 1 : 0 }}
|
||
/>
|
||
</ProfileBox>
|
||
|
||
<Menu
|
||
open={!!anchorEl}
|
||
anchorEl={anchorEl}
|
||
onClose={() => setAnchorEl(null)}
|
||
anchorPosition={position}
|
||
anchorReference="anchorPosition"
|
||
transitionDuration={225}
|
||
MenuListProps={{ sx: { py: 0.5 } }}
|
||
onContextMenu={(e) => {
|
||
setAnchorEl(null);
|
||
e.preventDefault();
|
||
}}
|
||
>
|
||
{(hasUrl ? urlModeMenu : fileModeMenu).map((item) => (
|
||
<MenuItem
|
||
key={item.label}
|
||
onClick={item.handler}
|
||
disabled={item.disabled}
|
||
sx={[
|
||
{
|
||
minWidth: 120,
|
||
},
|
||
(theme) => {
|
||
return {
|
||
color:
|
||
item.label === "Delete"
|
||
? theme.palette.error.main
|
||
: undefined,
|
||
};
|
||
},
|
||
]}
|
||
dense
|
||
>
|
||
{t(item.label)}
|
||
</MenuItem>
|
||
))}
|
||
</Menu>
|
||
{fileOpen && (
|
||
<EditorViewer
|
||
open={true}
|
||
initialData={readProfileFile(uid)}
|
||
language="yaml"
|
||
schema="clash"
|
||
onSave={async (prev, curr) => {
|
||
await saveProfileFile(uid, curr ?? "");
|
||
onSave && onSave(prev, curr);
|
||
}}
|
||
onClose={() => setFileOpen(false)}
|
||
/>
|
||
)}
|
||
{rulesOpen && (
|
||
<RulesEditorViewer
|
||
groupsUid={option?.groups ?? ""}
|
||
mergeUid={option?.merge ?? ""}
|
||
profileUid={uid}
|
||
property={option?.rules ?? ""}
|
||
open={true}
|
||
onSave={onSave}
|
||
onClose={() => setRulesOpen(false)}
|
||
/>
|
||
)}
|
||
{proxiesOpen && (
|
||
<ProxiesEditorViewer
|
||
profileUid={uid}
|
||
property={option?.proxies ?? ""}
|
||
open={true}
|
||
onSave={onSave}
|
||
onClose={() => setProxiesOpen(false)}
|
||
/>
|
||
)}
|
||
{groupsOpen && (
|
||
<GroupsEditorViewer
|
||
mergeUid={option?.merge ?? ""}
|
||
proxiesUid={option?.proxies ?? ""}
|
||
profileUid={uid}
|
||
property={option?.groups ?? ""}
|
||
open={true}
|
||
onSave={onSave}
|
||
onClose={() => {
|
||
setGroupsOpen(false);
|
||
}}
|
||
/>
|
||
)}
|
||
{mergeOpen && (
|
||
<EditorViewer
|
||
open={true}
|
||
initialData={readProfileFile(option?.merge ?? "")}
|
||
language="yaml"
|
||
schema="clash"
|
||
onSave={async (prev, curr) => {
|
||
await saveProfileFile(option?.merge ?? "", curr ?? "");
|
||
onSave && onSave(prev, curr);
|
||
}}
|
||
onClose={() => setMergeOpen(false)}
|
||
/>
|
||
)}
|
||
{scriptOpen && (
|
||
<EditorViewer
|
||
open={true}
|
||
initialData={readProfileFile(option?.script ?? "")}
|
||
language="javascript"
|
||
onSave={async (prev, curr) => {
|
||
await saveProfileFile(option?.script ?? "", curr ?? "");
|
||
onSave && onSave(prev, curr);
|
||
}}
|
||
onClose={() => setScriptOpen(false)}
|
||
/>
|
||
)}
|
||
|
||
<ConfirmViewer
|
||
title={t("Confirm deletion")}
|
||
message={t("This operation is not reversible")}
|
||
open={confirmOpen}
|
||
onClose={() => setConfirmOpen(false)}
|
||
onConfirm={() => {
|
||
onDelete();
|
||
setConfirmOpen(false);
|
||
}}
|
||
/>
|
||
</Box>
|
||
);
|
||
};
|
||
|
||
function parseUrl(url?: string) {
|
||
if (!url) return "";
|
||
const regex = /https?:\/\/(.+?)\//;
|
||
const result = url.match(regex);
|
||
return result ? result[1] : "local file";
|
||
}
|
||
|
||
function parseExpire(expire?: number) {
|
||
if (!expire) return "-";
|
||
return dayjs(expire * 1000).format("YYYY-MM-DD");
|
||
}
|