perf: merge Translate Popup/Selected shortcut

This commit is contained in:
Gabe Yuan
2023-11-28 13:36:40 +08:00
parent 52ca4306fd
commit 7d3972d3a8
8 changed files with 21 additions and 106 deletions

View File

@@ -3,12 +3,7 @@ import Stack from "@mui/material/Stack";
import TextField from "@mui/material/TextField";
import MenuItem from "@mui/material/MenuItem";
import { useI18n } from "../../hooks/I18n";
import {
OPT_TRANS_ALL,
OPT_LANGS_FROM,
OPT_LANGS_TO,
DEFAULT_TRANSEL_SHORTCUT,
} from "../../config";
import { OPT_TRANS_ALL, OPT_LANGS_FROM, OPT_LANGS_TO } from "../../config";
import ShortcutInput from "./ShortcutInput";
import FormControlLabel from "@mui/material/FormControlLabel";
import Switch from "@mui/material/Switch";
@@ -44,20 +39,12 @@ export default function Tranbox() {
[updateTranbox]
);
const handleShortcutTransel = useCallback(
(val) => {
updateTranbox({ transelShortcut: val });
},
[updateTranbox]
);
const {
transOpen,
translator,
fromLang,
toLang,
tranboxShortcut,
transelShortcut = DEFAULT_TRANSEL_SHORTCUT,
btnOffsetX,
btnOffsetY,
hideTranBtn = false,
@@ -160,12 +147,6 @@ export default function Tranbox() {
onChange={handleShortcutInput}
label={i18n("trigger_tranbox_shortcut")}
/>
<ShortcutInput
value={transelShortcut}
onChange={handleShortcutTransel}
label={i18n("trigger_transel_shortcut")}
/>
</Stack>
</Box>
);

View File

@@ -4,11 +4,7 @@ import TranBox from "./TranBox";
import { shortcutRegister } from "../../libs/shortcut";
import { sleep } from "../../libs/utils";
import { isGm } from "../../libs/client";
import {
MSG_TRANSLATE_SELECTED,
MSG_OPEN_TRANBOX,
DEFAULT_TRANSEL_SHORTCUT,
} from "../../config";
import { MSG_OPEN_TRANBOX, DEFAULT_TRANBOX_SHORTCUT } from "../../config";
export default function Slection({ tranboxSetting, transApis }) {
const [showBox, setShowBox] = useState(false);
@@ -30,11 +26,12 @@ export default function Slection({ tranboxSetting, transApis }) {
setShowBox(true);
};
const handleTranSelected = useCallback(() => {
const handleTranbox = useCallback(() => {
setShowBtn(false);
const selectedText = window.getSelection()?.toString()?.trim() || "";
if (!selectedText) {
setShowBox((pre) => !pre);
return;
}
@@ -66,44 +63,21 @@ export default function Slection({ tranboxSetting, transApis }) {
useEffect(() => {
const clearShortcut = shortcutRegister(
tranboxSetting.tranboxShortcut,
() => {
setShowBox((pre) => !pre);
}
tranboxSetting.tranboxShortcut || DEFAULT_TRANBOX_SHORTCUT,
handleTranbox
);
return () => {
clearShortcut();
};
}, [tranboxSetting.tranboxShortcut]);
}, [tranboxSetting.tranboxShortcut, handleTranbox]);
useEffect(() => {
const clearShortcut = shortcutRegister(
tranboxSetting.transelShortcut || DEFAULT_TRANSEL_SHORTCUT,
handleTranSelected
);
window.addEventListener(MSG_OPEN_TRANBOX, handleTranbox);
return () => {
clearShortcut();
window.removeEventListener(MSG_OPEN_TRANBOX, handleTranbox);
};
}, [tranboxSetting.transelShortcut, handleTranSelected]);
useEffect(() => {
window.addEventListener(MSG_TRANSLATE_SELECTED, handleTranSelected);
return () => {
window.removeEventListener(MSG_TRANSLATE_SELECTED, handleTranSelected);
};
}, [handleTranSelected]);
useEffect(() => {
const handleOpenTranbox = () => {
setShowBox((pre) => !pre);
};
window.addEventListener(MSG_OPEN_TRANBOX, handleOpenTranbox);
return () => {
window.removeEventListener(MSG_OPEN_TRANBOX, handleOpenTranbox);
};
}, []);
}, [handleTranbox]);
useEffect(() => {
if (!isGm) {
@@ -117,16 +91,9 @@ export default function Slection({ tranboxSetting, transApis }) {
GM.registerMenuCommand(
"Translate Selected Text (Alt+S)",
(event) => {
handleTranSelected();
handleTranbox();
},
"S"
),
GM.registerMenuCommand(
"Open Translate Popup (Alt+B)",
(event) => {
setShowBox((pre) => !pre);
},
"B"
)
);
@@ -138,7 +105,7 @@ export default function Slection({ tranboxSetting, transApis }) {
} catch (err) {
console.log("[registerMenuCommand]", err);
}
}, [handleTranSelected]);
}, [handleTranbox]);
return (
<>