feat: add URL paste handler (#2768)

* feat: Add URL paste handler

* Check if text highlighted for URL pasting
This commit is contained in:
Noah Alderton 2024-01-15 18:06:16 -08:00 committed by GitHub
parent 1fdb8b7b01
commit ff13d977e9
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
2 changed files with 23 additions and 15 deletions

View File

@ -15,20 +15,7 @@ export const handleEditorKeydownWithMarkdownShortcuts = (event: React.KeyboardEv
}
};
const styleHighlightedText = (editor: EditorRefActions, delimiter: string) => {
const cursorPosition = editor.getCursorPosition();
const selectedContent = editor.getSelectedContent();
if (selectedContent.startsWith(delimiter) && selectedContent.endsWith(delimiter)) {
editor.insertText(selectedContent.slice(delimiter.length, -delimiter.length));
const newContentLength = selectedContent.length - delimiter.length * 2;
editor.setCursorPosition(cursorPosition, cursorPosition + newContentLength);
} else {
editor.insertText(`${delimiter}${selectedContent}${delimiter}`);
editor.setCursorPosition(cursorPosition + delimiter.length, cursorPosition + delimiter.length + selectedContent.length);
}
};
const hyperlinkHighlightedText = (editor: EditorRefActions, url?: string) => {
export const hyperlinkHighlightedText = (editor: EditorRefActions, url?: string) => {
const cursorPosition = editor.getCursorPosition();
const selectedContent = editor.getSelectedContent();
const blankURL = "url";
@ -41,3 +28,16 @@ const hyperlinkHighlightedText = (editor: EditorRefActions, url?: string) => {
editor.setCursorPosition(newCursorStart, newCursorStart + url.length);
}
};
const styleHighlightedText = (editor: EditorRefActions, delimiter: string) => {
const cursorPosition = editor.getCursorPosition();
const selectedContent = editor.getSelectedContent();
if (selectedContent.startsWith(delimiter) && selectedContent.endsWith(delimiter)) {
editor.insertText(selectedContent.slice(delimiter.length, -delimiter.length));
const newContentLength = selectedContent.length - delimiter.length * 2;
editor.setCursorPosition(cursorPosition, cursorPosition + newContentLength);
} else {
editor.insertText(`${delimiter}${selectedContent}${delimiter}`);
editor.setCursorPosition(cursorPosition + delimiter.length, cursorPosition + delimiter.length + selectedContent.length);
}
};

View File

@ -6,6 +6,7 @@ import { useTranslation } from "react-i18next";
import useLocalStorage from "react-use/lib/useLocalStorage";
import { memoServiceClient } from "@/grpcweb";
import { TAB_SPACE_WIDTH, UNKNOWN_ID } from "@/helpers/consts";
import { isValidUrl } from "@/helpers/utils";
import { useGlobalStore, useResourceStore } from "@/store/module";
import { useMemoStore, useUserStore } from "@/store/v1";
import { MemoRelation, MemoRelation_Type } from "@/types/proto/api/v2/memo_relation_service";
@ -23,7 +24,7 @@ import TagSelector from "./ActionButton/TagSelector";
import Editor, { EditorRefActions } from "./Editor";
import RelationListView from "./RelationListView";
import ResourceListView from "./ResourceListView";
import { handleEditorKeydownWithMarkdownShortcuts } from "./handlers";
import { handleEditorKeydownWithMarkdownShortcuts, hyperlinkHighlightedText } from "./handlers";
interface Props {
className?: string;
@ -242,6 +243,13 @@ const MemoEditor = (props: Props) => {
if (event.clipboardData && event.clipboardData.files.length > 0) {
event.preventDefault();
await uploadMultiFiles(event.clipboardData.files);
} else if (
editorRef.current != null &&
editorRef.current.getSelectedContent().length != 0 &&
isValidUrl(event.clipboardData.getData("Text"))
) {
event.preventDefault();
hyperlinkHighlightedText(editorRef.current, event.clipboardData.getData("Text"));
}
};