diff --git a/src/components/FloatingToolbar/index.jsx b/src/components/FloatingToolbar/index.jsx index 43fcebc..1c592f4 100644 --- a/src/components/FloatingToolbar/index.jsx +++ b/src/components/FloatingToolbar/index.jsx @@ -4,13 +4,14 @@ import ConversationCard from '../ConversationCard' import PropTypes from 'prop-types' import { defaultConfig, getUserConfig } from '../../config.mjs' import { config as toolsConfig } from '../../content-script/selection-tools' -import { setElementPositionInViewport } from '../../utils' +import { isMobile, setElementPositionInViewport } from '../../utils' import Draggable from 'react-draggable' import { useClampWindowSize } from '../../hooks/use-clamp-window-size' const logo = Browser.runtime.getURL('logo.png') function FloatingToolbar(props) { + const [selection, setSelection] = useState(props.selection) const [prompt, setPrompt] = useState(props.prompt) const [triggered, setTriggered] = useState(props.triggered) const [config, setConfig] = useState(defaultConfig) @@ -40,6 +41,19 @@ function FloatingToolbar(props) { } }, [config]) + useEffect(() => { + if (isMobile()) { + const selectionListener = () => { + const currentSelection = window.getSelection()?.toString() + if (currentSelection) setSelection(currentSelection) + } + document.addEventListener('selectionchange', selectionListener) + return () => { + document.removeEventListener('selectionchange', selectionListener) + } + } + }, []) + if (!render) return
if (triggered) { @@ -101,7 +115,7 @@ function FloatingToolbar(props) { className: 'gpt-selection-toolbar-button', title: toolConfig.label, onClick: async () => { - setPrompt(await toolConfig.genPrompt(props.selection)) + setPrompt(await toolConfig.genPrompt(selection)) setTriggered(true) }, }), diff --git a/src/utils/is-mobile.mjs b/src/utils/is-mobile.mjs index be3e1fa..a3c8170 100644 --- a/src/utils/is-mobile.mjs +++ b/src/utils/is-mobile.mjs @@ -1,6 +1,6 @@ // https://stackoverflow.com/questions/11381673/detecting-a-mobile-browser -export async function isMobile() { +export function isMobile() { if (navigator.userAgentData) return navigator.userAgentData.mobile let check = false ;(function (a) {