feat: 添加剪切板监听模式 (#92)

pot-app · May 17, 2023 · 3d30f4f · 3d30f4f
1 parent a83be17
commit 3d30f4f
Showing 1 changed file with 56 additions and 2 deletions.
diff --git a/src/windows/Translator/components/TopBar/index.jsx b/src/windows/Translator/components/TopBar/index.jsx
@@ -1,9 +1,13 @@
+import PodcastsRoundedIcon from '@mui/icons-material/PodcastsRounded';
 import PushPinRoundedIcon from '@mui/icons-material/PushPinRounded';
 import CancelRoundedIcon from '@mui/icons-material/CancelRounded';
+import { Box, IconButton, Tooltip } from '@mui/material';
+import { listen, emit } from '@tauri-apps/api/event';
+import { readText } from '@tauri-apps/api/clipboard';
 import React, { useState, useEffect } from 'react';
 import { appWindow } from '@tauri-apps/api/window';
-import { Box, IconButton } from '@mui/material';
-import { listen } from '@tauri-apps/api/event';
+import { toast, Toaster } from 'react-hot-toast';
+import { useTheme } from '@mui/material/styles';
 import { invoke } from '@tauri-apps/api/tauri';
 import { get } from '../../../main';
 import './style.css';
@@ -17,6 +21,10 @@ let unlisten = listen('tauri://blur', () => {
 export default function TopBar() {
     const [pined, setPined] = useState(get('default_pined') ?? true);
     const [ismacos, setIsmacos] = useState(false);
+    const [listenCopy, setListenCopy] = useState(false);
+    const [int, setInt] = useState();
+    const [currentClipboard, setCurrentClipboard] = useState('');
+    const theme = useTheme();
 
     useEffect(() => {
         invoke('is_macos').then((v) => {
@@ -36,6 +44,7 @@ export default function TopBar() {
 
     return (
         <Box className={ismacos ? 'topbar-macos' : 'topbar'}>
+            <Toaster />
             <Box>
                 <IconButton
                     className='topbar-button'
@@ -58,6 +67,51 @@ export default function TopBar() {
                 >
                     <PushPinRoundedIcon color={pined ? 'primary' : ''} />
                 </IconButton>
+                <IconButton
+                    className='topbar-button'
+                    style={{ marginLeft: 8 }}
+                    onClick={() => {
+                        if (!listenCopy) {
+                            if (!pined) {
+                                appWindow.setAlwaysOnTop(true).then((_) => {
+                                    unlisten.then((f) => {
+                                        f();
+                                    });
+                                });
+                                setPined(true);
+                            }
+                            setListenCopy(true);
+                            setInt(
+                                setInterval(async () => {
+                                    const text = await readText();
+                                    if (text != currentClipboard) {
+                                        setCurrentClipboard(text);
+                                        emit('new_selection', text);
+                                    }
+                                }, 200)
+                            );
+                            toast.success('开始监听剪切板...', {
+                                style: {
+                                    background: theme.palette.background.default,
+                                    color: theme.palette.text.primary,
+                                },
+                            });
+                        } else {
+                            setListenCopy(false);
+                            clearInterval(int);
+                            toast.success('停止监听剪切板', {
+                                style: {
+                                    background: theme.palette.background.default,
+                                    color: theme.palette.text.primary,
+                                },
+                            });
+                        }
+                    }}
+                >
+                    <Tooltip title='剪切板监听模式'>
+                        <PodcastsRoundedIcon color={listenCopy ? 'primary' : ''} />
+                    </Tooltip>
+                </IconButton>
             </Box>
             {ismacos ? (
                 <></>