diff --git a/components/CopyButton.tsx b/components/CopyButton.tsx index fd196bf..1571093 100644 --- a/components/CopyButton.tsx +++ b/components/CopyButton.tsx @@ -1,4 +1,4 @@ -import { useState, useCallback, FC, ReactNode, useEffect } from 'react'; +import React, { useState, useCallback, FC, ReactNode, useEffect } from 'react'; import Button, { ButtonProps } from '@mui/material/Button'; import Snackbar from '@mui/material/Snackbar'; import Alert, { AlertColor } from '@mui/material/Alert'; diff --git a/components/DatetimeToTimestamp.tsx b/components/DatetimeToTimestamp.tsx index 9bdc2f6..3ccd2f9 100644 --- a/components/DatetimeToTimestamp.tsx +++ b/components/DatetimeToTimestamp.tsx @@ -70,7 +70,7 @@ export function DatetimeToTimestamp() { }, [dateValue, selectedZone, unit, performConversion]); const handleUnitChange = useCallback( - (e: SelectChangeEvent) => { + (e: SelectChangeEvent) => { const newUnit = e.target.value; setUnit(newUnit); if (result) { @@ -80,7 +80,7 @@ export function DatetimeToTimestamp() { [dateValue, selectedZone, result, performConversion], ); - const handleZoneChange = useCallback((e: SelectChangeEvent) => { + const handleZoneChange = useCallback((e: SelectChangeEvent) => { setSelectedZone(e.target.value); }, []); @@ -129,8 +129,10 @@ export function DatetimeToTimestamp() { value={result} fullWidth variant="outlined" - InputProps={{ - readOnly: true, + slotProps={{ + input: { + readOnly: true, + }, }} /> diff --git a/components/Navbar.tsx b/components/Navbar.tsx index f306c3f..0b50059 100644 --- a/components/Navbar.tsx +++ b/components/Navbar.tsx @@ -88,10 +88,12 @@ function Navbar({ items = [] }: NavbarProps) { anchorEl={anchorEl} open={isMenuOpen} onClose={handleMenuClose} - PaperProps={{ - style: { - maxHeight: 48 * 4.5, - width: '20ch', + slotProps={{ + paper: { + style: { + maxHeight: 48 * 4.5, + width: '20ch', + }, }, }} > diff --git a/components/TimestampExecution.tsx b/components/TimestampExecution.tsx index 279562a..a912131 100644 --- a/components/TimestampExecution.tsx +++ b/components/TimestampExecution.tsx @@ -1,22 +1,12 @@ -import { useEffect, useState, useCallback } from 'react'; +import { useEffect, useState, useCallback, JSX } from 'react'; import CopyButton from './CopyButton'; import { Button, Paper, Typography, Stack, Box } from '@mui/material'; /** * 时间戳显示和执行组件 - * - * @component - * @example - * ```jsx - * - * ``` - * - * @returns {JSX.Element} 时间戳组件 */ -export function TimestampExecution() { - const [currentTimestamp, setCurrentTimestamp] = useState(() => - Math.floor(Date.now()), - ); +export function TimestampExecution(): JSX.Element { + const [currentTimestamp, setCurrentTimestamp] = useState(() => Math.floor(Date.now())); const [showMilliseconds, setShowMilliseconds] = useState(true); const [isRunningTimestamp, setIsRunningTimestamp] = useState(true); @@ -45,19 +35,12 @@ export function TimestampExecution() { setIsRunningTimestamp((prev) => !prev); }, []); - const unitButtonLabel = showMilliseconds - ? '切换为秒显示' - : '切换为毫秒显示'; - const toggleButtonLabel = isRunningTimestamp - ? '停止时间戳自动更新' - : '开始时间戳自动更新'; + const unitButtonLabel = showMilliseconds ? '切换为秒显示' : '切换为毫秒显示'; + const toggleButtonLabel = isRunningTimestamp ? '停止时间戳自动更新' : '开始时间戳自动更新'; const toggleButtonText = isRunningTimestamp ? '停止' : '开始'; return ( - + ) => { + (e: SelectChangeEvent) => { const newZone = e.target.value; setSelectedZone(newZone); if (timestampResult) { @@ -96,7 +96,7 @@ export function TimestampToDatetime() { ); const handleUnitChange = useCallback( - (e: SelectChangeEvent) => { + (e: SelectChangeEvent) => { const newUnit = e.target.value; setUnit(newUnit); if (timestampResult) { @@ -150,8 +150,10 @@ export function TimestampToDatetime() { value={timestampResult} fullWidth variant="outlined" - InputProps={{ - readOnly: true, + slotProps={{ + input: { + readOnly: true, + }, }} /> diff --git a/entrypoints/popup/App.css b/entrypoints/popup/App.css index 4ac0fca..96d0316 100644 --- a/entrypoints/popup/App.css +++ b/entrypoints/popup/App.css @@ -147,7 +147,6 @@ body { .nav-collapse-content .nav-link { padding: 12px 20px; - border-bottom: 1px solid #f8f9fa; width: 100%; text-align: left; box-sizing: border-box; diff --git a/tsconfig.json b/tsconfig.json index 263e7b8..5231664 100644 --- a/tsconfig.json +++ b/tsconfig.json @@ -49,7 +49,8 @@ "hooks/**/*", ".wxt/types/**/*.ts", ".wxt/types/*.d.ts", - "components" + "components", + "eslint.config.ts" ], - "exclude": ["node_modules", ".wxt", "eslint.config.ts"] + "exclude": ["node_modules", ".wxt"] } diff --git a/utils/messages.tsx b/utils/messages.tsx index c1d8e06..c9f3b97 100644 --- a/utils/messages.tsx +++ b/utils/messages.tsx @@ -41,7 +41,7 @@ interface ProtocolMap { 'popup:ready': () => void; // --- Content 相关 --- - 'content:save-tracke-events': (event) => boolean; + 'content:save-tracke-events': (event: unknown) => boolean; 'content:start-recording': () => { ok: boolean; error?: string }; 'content:stop-recording': () => { ok: boolean }; 'content:check-status': () => boolean; diff --git a/utils/recordUtils.tsx b/utils/recordUtils.tsx index 18c7ba0..7f13962 100644 --- a/utils/recordUtils.tsx +++ b/utils/recordUtils.tsx @@ -21,7 +21,8 @@ export const downloadHtmlInBackground = (events: unknown[]) => { @@ -59,7 +62,7 @@ export const downloadHtmlInBackground = (events: unknown[]) => { url: reader.result as string, filename: `replay-${Date.now()}.html`, saveAs: true, - }); + }).then(r => console.log(r)); }; reader.readAsDataURL(blob); };