fix: fix copy bug

zzhzd · Mar 5, 2023 · 8346a7d · 8346a7d
1 parent 39eeddb
commit 8346a7d
Showing 1 changed file with 14 additions and 6 deletions.
diff --git a/src/components/MessageItem.tsx b/src/components/MessageItem.tsx
@@ -5,7 +5,7 @@ import MarkdownIt from 'markdown-it'
 import mdKatex from 'markdown-it-katex'
 import mdHighlight from 'markdown-it-highlightjs'
 import IconRefresh from './icons/Refresh'
-import { useClipboard } from 'solidjs-use'
+import { useClipboard,useEventListener } from 'solidjs-use'
 
 interface Props {
  role: ChatMessage['role']
@@ -23,13 +23,21 @@ export default ({ role, message, showRetry, onRetry }: Props) => {
  const [source, setSource] = createSignal('')
  const { copy, copied } = useClipboard({ source, copiedDuring: 1000 })
 
- window.addEventListener('click', (e) => {
+
+ useEventListener('click', (e) => {
  const el = e.target as HTMLElement
- if (el.matches('div > div.copy-btn') || el.matches('div.copy-btn > svg')) {
- copy(source())
- }
+ let code = null
+
+ if (el.matches('div > div.copy-btn')) {
+ code = decodeURIComponent(el.dataset.code!)
+ } else {
+ code = decodeURIComponent(el.parentElement?.dataset.code!)
+ } 
+ copy(code)
  })
 
+
+
  const htmlString = () => {
  const md = MarkdownIt().use(mdKatex).use(mdHighlight)
  const fence = md.renderer.rules.fence!
@@ -43,7 +51,7 @@ export default ({ role, message, showRetry, onRetry }: Props) => {
  setSource(token.content)
 
  return `<div relative>
- <div class="copy-btn absolute top-12px right-12px z-3 flex justify-center items-center border b-transparent w-8 h-8 p-2 bg-dark-300 op-90 transition-all group cursor-pointer">
+ <div data-code=${encodeURIComponent(token.content)} class="copy-btn absolute top-12px right-12px z-3 flex justify-center items-center border b-transparent w-8 h-8 p-2 bg-dark-300 op-90 transition-all group cursor-pointer">
  <svg xmlns="http:https://www.w3.org/2000/svg" width="1em" height="1em" viewBox="0 0 32 32"><path fill="currentColor" d="M28 10v18H10V10h18m0-2H10a2 2 0 0 0-2 2v18a2 2 0 0 0 2 2h18a2 2 0 0 0 2-2V10a2 2 0 0 0-2-2Z" /><path fill="currentColor" d="M4 18H2V4a2 2 0 0 1 2-2h14v2H4Z" /></svg>
  <div class="opacity-0 h-7 bg-black px-2.5 py-1 box-border text-xs c-white inline-flex justify-center items-center rounded absolute z-1 transition duration-600 whitespace-nowrap -top-8" group-hover:opacity-100>
  ${copied() ? 'Copied' : 'Copy'}