root/clash-verge-rev
1
0
Fork 0
mirror of https://github.com/clash-verge-rev/clash-verge-rev.git synced 2026-01-29 08:45:41 +08:00
Code Issues Packages Projects Releases Wiki Activity

refactor: connection components

Browse Source
This commit is contained in:
Slinetrac
2025-10-14 21:33:36 +08:00
parent 778d506be7
commit 8dbe3f8c48
1 changed files with 91 additions and 88 deletions
Download Patch File Download Diff File Expand all files Collapse all files

9
src/components/connection/connection-table.tsx
View File

@@ -6,8 +6,8 @@ import {
} from "@mui/x-data-grid"; } from "@mui/x-data-grid";
import dayjs from "dayjs"; import dayjs from "dayjs";
import { useLocalStorage } from "foxact/use-local-storage"; import { useLocalStorage } from "foxact/use-local-storage";
import { t } from "i18next";
import { useEffect, useMemo, useState } from "react"; import { useEffect, useMemo, useState } from "react";
import { useTranslation } from "react-i18next";
import parseTraffic from "@/utils/parse-traffic"; import parseTraffic from "@/utils/parse-traffic";
import { truncateStr } from "@/utils/truncate-str"; import { truncateStr } from "@/utils/truncate-str";
@@ -19,6 +19,7 @@ interface Props {
export const ConnectionTable = (props: Props) => { export const ConnectionTable = (props: Props) => {
const { connections, onShowDetail } = props; const { connections, onShowDetail } = props;
const { t } = useTranslation();
const apiRef = useGridApiRef(); const apiRef = useGridApiRef();
useEffect(() => { useEffect(() => {
const PATCH_FLAG_KEY = "__clashPatchedPublishEvent" as const; const PATCH_FLAG_KEY = "__clashPatchedPublishEvent" as const;
@@ -152,7 +153,8 @@ export const ConnectionTable = (props: Props) => {
{}, {},
); );
const [columns] = useState<GridColDef[]>([ const columns = useMemo<GridColDef[]>(() => {
return [
{ {
field: "host", field: "host",
headerName: t("Host"), headerName: t("Host"),
@@ -238,7 +240,8 @@ export const ConnectionTable = (props: Props) => {
width: columnWidths["type"] || 160, width: columnWidths["type"] || 160,
minWidth: 100, minWidth: 100,
}, },
]); ];
}, [columnWidths, t]);
const handleColumnResize = (params: GridColumnResizeParams) => { const handleColumnResize = (params: GridColumnResizeParams) => {
const { colDef, width } = params; const { colDef, width } = params;