refactor: 移除 MUI sx 样式和未使用的 GlobalSnackbar 引用
This commit is contained in:
@@ -1,13 +1,13 @@
|
|||||||
import { SyntheticEvent, useEffect, useMemo, useState } from 'react';
|
import { SyntheticEvent, useEffect, useMemo, useState } from 'react';
|
||||||
import { Settings, RefreshCw, GripVertical } from 'lucide-react';
|
import { GripVertical, RefreshCw, Settings } from 'lucide-react';
|
||||||
import {
|
import {
|
||||||
DndContext,
|
|
||||||
closestCenter,
|
closestCenter,
|
||||||
PointerSensor,
|
DndContext,
|
||||||
|
type DragEndEvent,
|
||||||
KeyboardSensor,
|
KeyboardSensor,
|
||||||
|
PointerSensor,
|
||||||
useSensor,
|
useSensor,
|
||||||
useSensors,
|
useSensors,
|
||||||
type DragEndEvent,
|
|
||||||
} from '@dnd-kit/core';
|
} from '@dnd-kit/core';
|
||||||
import {
|
import {
|
||||||
arrayMove,
|
arrayMove,
|
||||||
@@ -19,6 +19,7 @@ import {
|
|||||||
import { CSS } from '@dnd-kit/utilities';
|
import { CSS } from '@dnd-kit/utilities';
|
||||||
import type { PageType, StorageSchema } from '@/types/storage';
|
import type { PageType, StorageSchema } from '@/types/storage';
|
||||||
import { storageUtil } from '@/utils/chromeStorage';
|
import { storageUtil } from '@/utils/chromeStorage';
|
||||||
|
import type { PaletteColorKey } from '@/config/features';
|
||||||
import {
|
import {
|
||||||
getAllFeatureKeys,
|
getAllFeatureKeys,
|
||||||
getDefaultPageOrder,
|
getDefaultPageOrder,
|
||||||
@@ -29,7 +30,6 @@ import GlobalSnackbar, { useSnackbarState } from '@/components/GlobalSnackbar';
|
|||||||
import PageErrorBoundary from '@/components/PageErrorBoundary';
|
import PageErrorBoundary from '@/components/PageErrorBoundary';
|
||||||
import PageHeader from '@/components/PageHeader';
|
import PageHeader from '@/components/PageHeader';
|
||||||
import { useTranslation } from 'react-i18next';
|
import { useTranslation } from 'react-i18next';
|
||||||
import type { PaletteColorKey } from '@/config/features';
|
|
||||||
|
|
||||||
const PALETTE_COLORS: Record<PaletteColorKey, string> = {
|
const PALETTE_COLORS: Record<PaletteColorKey, string> = {
|
||||||
primary: '#1976d2',
|
primary: '#1976d2',
|
||||||
@@ -322,7 +322,6 @@ export default function App() {
|
|||||||
iconColor="#1976d2"
|
iconColor="#1976d2"
|
||||||
title="应用设置"
|
title="应用设置"
|
||||||
subtitle="针对不同窗口类型独立配置 Dashboard 中显示的功能及其排序"
|
subtitle="针对不同窗口类型独立配置 Dashboard 中显示的功能及其排序"
|
||||||
sx={{ marginBottom: '1rem' }}
|
|
||||||
/>
|
/>
|
||||||
{/* Tab 与恢复按钮同行 */}
|
{/* Tab 与恢复按钮同行 */}
|
||||||
<div className="flex items-end justify-between border-b-0">
|
<div className="flex items-end justify-between border-b-0">
|
||||||
|
|||||||
@@ -2,7 +2,6 @@ import { useEffect, useMemo, useState } from 'react';
|
|||||||
import { Button } from '@/components/ui/button';
|
import { Button } from '@/components/ui/button';
|
||||||
import { useLazyTranslation } from '@/utils/useLazyTranslation';
|
import { useLazyTranslation } from '@/utils/useLazyTranslation';
|
||||||
import { formatByteSize } from '@/utils/textStatistics';
|
import { formatByteSize } from '@/utils/textStatistics';
|
||||||
import { useSnackbar } from '@/components/GlobalSnackbar';
|
|
||||||
import CopyButton from '@/components/CopyButton';
|
import CopyButton from '@/components/CopyButton';
|
||||||
import TextInputArea from '@/components/TextInputArea';
|
import TextInputArea from '@/components/TextInputArea';
|
||||||
import { validateJson } from '@/utils/jsonFormatter';
|
import { validateJson } from '@/utils/jsonFormatter';
|
||||||
@@ -44,7 +43,6 @@ export default function JsonConvertSection({
|
|||||||
convertButtonKey = 'convertButton',
|
convertButtonKey = 'convertButton',
|
||||||
}: JsonConvertSectionProps) {
|
}: JsonConvertSectionProps) {
|
||||||
const { t } = useLazyTranslation('jsonFormat');
|
const { t } = useLazyTranslation('jsonFormat');
|
||||||
const { showMessage } = useSnackbar();
|
|
||||||
|
|
||||||
const [input, setInput] = useState('');
|
const [input, setInput] = useState('');
|
||||||
const [error, setError] = useState<string | null>(null);
|
const [error, setError] = useState<string | null>(null);
|
||||||
@@ -134,7 +132,7 @@ export default function JsonConvertSection({
|
|||||||
{t('jsonFormat:formattedSize')}: {formatByteSize(result.outputBytes)}
|
{t('jsonFormat:formattedSize')}: {formatByteSize(result.outputBytes)}
|
||||||
</span>
|
</span>
|
||||||
</div>
|
</div>
|
||||||
<CopyButton text={result.output} showMessage={showMessage} />
|
<CopyButton text={result.output} />
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
{/* 转换内容 */}
|
{/* 转换内容 */}
|
||||||
|
|||||||
@@ -25,7 +25,6 @@ export default function JsonDiffInput({
|
|||||||
onChange={onChange}
|
onChange={onChange}
|
||||||
placeholder={placeholder}
|
placeholder={placeholder}
|
||||||
minRows={8}
|
minRows={8}
|
||||||
autoResize={false}
|
|
||||||
externalError={error ?? undefined}
|
externalError={error ?? undefined}
|
||||||
showClear={true}
|
showClear={true}
|
||||||
/>
|
/>
|
||||||
|
|||||||
@@ -3,12 +3,11 @@ import { Button } from '@/components/ui/button';
|
|||||||
import { useLazyTranslation } from '@/utils/useLazyTranslation';
|
import { useLazyTranslation } from '@/utils/useLazyTranslation';
|
||||||
import {
|
import {
|
||||||
formatJson,
|
formatJson,
|
||||||
validateJson,
|
|
||||||
type JsonFormatOptions,
|
type JsonFormatOptions,
|
||||||
type JsonFormatResult,
|
type JsonFormatResult,
|
||||||
|
validateJson,
|
||||||
} from '@/utils/jsonFormatter';
|
} from '@/utils/jsonFormatter';
|
||||||
import { formatByteSize } from '@/utils/textStatistics';
|
import { formatByteSize } from '@/utils/textStatistics';
|
||||||
import { useSnackbar } from '@/components/GlobalSnackbar';
|
|
||||||
import CopyButton from '@/components/CopyButton';
|
import CopyButton from '@/components/CopyButton';
|
||||||
import SwitchButtonGroup from '@/components/SwitchButtonGroup';
|
import SwitchButtonGroup from '@/components/SwitchButtonGroup';
|
||||||
|
|
||||||
@@ -23,7 +22,6 @@ const INDENT_OPTIONS = [2, 4, 6, 8] as const;
|
|||||||
*/
|
*/
|
||||||
export default function JsonFormatSection() {
|
export default function JsonFormatSection() {
|
||||||
const { t } = useLazyTranslation('jsonFormat');
|
const { t } = useLazyTranslation('jsonFormat');
|
||||||
const { showMessage } = useSnackbar();
|
|
||||||
|
|
||||||
const [input, setInput] = useState('');
|
const [input, setInput] = useState('');
|
||||||
const [error, setError] = useState<string | null>(null);
|
const [error, setError] = useState<string | null>(null);
|
||||||
@@ -80,7 +78,6 @@ export default function JsonFormatSection() {
|
|||||||
value={indentSize}
|
value={indentSize}
|
||||||
onChange={(v) => setIndentSize(v)}
|
onChange={(v) => setIndentSize(v)}
|
||||||
options={INDENT_OPTIONS.map((size) => ({ value: size, label: String(size) }))}
|
options={INDENT_OPTIONS.map((size) => ({ value: size, label: String(size) }))}
|
||||||
sx={{ width: 'auto', marginBottom: 0, flexShrink: 0 }}
|
|
||||||
size="small"
|
size="small"
|
||||||
/>
|
/>
|
||||||
|
|
||||||
@@ -145,7 +142,7 @@ export default function JsonFormatSection() {
|
|||||||
{t('jsonFormat:formattedSize')}: {formatByteSize(result.formattedBytes)}
|
{t('jsonFormat:formattedSize')}: {formatByteSize(result.formattedBytes)}
|
||||||
</span>
|
</span>
|
||||||
</div>
|
</div>
|
||||||
<CopyButton text={result.formatted} showMessage={showMessage} />
|
<CopyButton text={result.formatted} />
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
{/* 格式化内容 */}
|
{/* 格式化内容 */}
|
||||||
|
|||||||
+1
-4
@@ -1,8 +1,7 @@
|
|||||||
import { useCallback, useMemo, useState } from 'react';
|
import { useCallback, useMemo, useState } from 'react';
|
||||||
import { Key } from 'lucide-react';
|
import { Key } from 'lucide-react';
|
||||||
import { useSnackbar } from '@/components/GlobalSnackbar';
|
|
||||||
import PageHeader from '@/components/PageHeader';
|
import PageHeader from '@/components/PageHeader';
|
||||||
import { stringifyJson, parseJwt } from '@/utils/jwt';
|
import { parseJwt, stringifyJson } from '@/utils/jwt';
|
||||||
import CopyButton from '@/components/CopyButton';
|
import CopyButton from '@/components/CopyButton';
|
||||||
import TextInputArea from '@/components/TextInputArea';
|
import TextInputArea from '@/components/TextInputArea';
|
||||||
import { useLazyTranslation } from '@/utils/useLazyTranslation';
|
import { useLazyTranslation } from '@/utils/useLazyTranslation';
|
||||||
@@ -40,7 +39,6 @@ const Section = ({ title, content, color }: SectionProps) => {
|
|||||||
};
|
};
|
||||||
|
|
||||||
export default function Index() {
|
export default function Index() {
|
||||||
const { showMessage } = useSnackbar();
|
|
||||||
const { t } = useLazyTranslation('jwt');
|
const { t } = useLazyTranslation('jwt');
|
||||||
const [jwtInput, setJwtInput] = useState('');
|
const [jwtInput, setJwtInput] = useState('');
|
||||||
|
|
||||||
@@ -75,7 +73,6 @@ export default function Index() {
|
|||||||
}}
|
}}
|
||||||
allowCopy={true}
|
allowCopy={true}
|
||||||
showClear={true}
|
showClear={true}
|
||||||
showMessage={showMessage}
|
|
||||||
externalError={result?.error}
|
externalError={result?.error}
|
||||||
/>
|
/>
|
||||||
|
|
||||||
|
|||||||
@@ -28,15 +28,9 @@ export default function Index() {
|
|||||||
subtitle={t('qrCode:pageSubtitle')}
|
subtitle={t('qrCode:pageSubtitle')}
|
||||||
icon={<QrCode />}
|
icon={<QrCode />}
|
||||||
iconColor={qrCodePageStyles.primaryColor}
|
iconColor={qrCodePageStyles.primaryColor}
|
||||||
sx={{ marginBottom: '0.625rem' }}
|
|
||||||
/>
|
/>
|
||||||
|
|
||||||
<SwitchButtonGroup
|
<SwitchButtonGroup value={qrCode.mode} options={modeOptions} onChange={qrCode.setMode} />
|
||||||
value={qrCode.mode}
|
|
||||||
options={modeOptions}
|
|
||||||
onChange={qrCode.setMode}
|
|
||||||
sx={{ marginBottom: '0.75rem' }}
|
|
||||||
/>
|
|
||||||
|
|
||||||
{qrCode.mode === 'generate' ? <GeneratePanel /> : <ParsePanel />}
|
{qrCode.mode === 'generate' ? <GeneratePanel /> : <ParsePanel />}
|
||||||
</div>
|
</div>
|
||||||
|
|||||||
@@ -52,7 +52,6 @@ export default function Index() {
|
|||||||
minRows={8}
|
minRows={8}
|
||||||
maxRows={15}
|
maxRows={15}
|
||||||
showClear={false}
|
showClear={false}
|
||||||
sx={{ marginBottom: '0.75rem' }}
|
|
||||||
/>
|
/>
|
||||||
|
|
||||||
{/* 统计结果展示区域 */}
|
{/* 统计结果展示区域 */}
|
||||||
|
|||||||
@@ -77,7 +77,6 @@ export default function Index() {
|
|||||||
{ value: 's', label: t('timestamp:unitS') },
|
{ value: 's', label: t('timestamp:unitS') },
|
||||||
]}
|
]}
|
||||||
onChange={(v) => setUnit(v as 'ms' | 's')}
|
onChange={(v) => setUnit(v as 'ms' | 's')}
|
||||||
sx={{ width: 'auto', marginBottom: 0, flexShrink: 0 }}
|
|
||||||
size="small"
|
size="small"
|
||||||
/>
|
/>
|
||||||
|
|
||||||
|
|||||||
Reference in New Issue
Block a user