github/plane
0
0
Fork 1
mirror of https://github.com/makeplane/plane synced 2024-06-14 14:31:34 +00:00
Code Issues Packages Projects Releases Wiki Activity

Enter key behaviour added for Comments

Browse Source
This commit is contained in:
Palanikannan1437 2023-10-03 19:51:23 +05:30
parent fc8284d458
commit ff29c1c87e
7 changed files with 25 additions and 15 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

6
packages/editor/lite-text-editor/src/ui/extensions/enter-key-extension.tsx
View File

@ -1,12 +1,14 @@
import { Extension } from '@tiptap/core';
export const EnterKeyExtension = Extension.create({
export const EnterKeyExtension = (onEnterKeyPress?: () => void) => Extension.create({
name: 'enterKey',
addKeyboardShortcuts() {
return {
'Enter': () => {
console.log('Submit comment');
if (onEnterKeyPress) {
onEnterKeyPress();
}
return true;
},
}

4
packages/editor/lite-text-editor/src/ui/extensions/index.tsx
View File

@ -1,5 +1,5 @@
import { EnterKeyExtension } from "./enter-key-extension";
export const LiteTextEditorExtensions = () => [
EnterKeyExtension,
export const LiteTextEditorExtensions = (onEnterKeyPress?: () => void) => [
EnterKeyExtension(onEnterKeyPress),
];

6
packages/editor/lite-text-editor/src/ui/index.tsx
View File

@ -30,7 +30,8 @@ interface ILiteTextEditor {
key: string;
label: "Private" | "Public";
}[]
}
};
onEnterKeyPress?: (e?: any) => void;
}
interface LiteTextEditorProps extends ILiteTextEditor {
@ -57,6 +58,7 @@ const LiteTextEditor = ({
customClassName,
forwardedRef,
commentAccessSpecifier,
onEnterKeyPress
}: LiteTextEditorProps) => {
const editor = useEditor({
onChange,
@ -68,7 +70,7 @@ const LiteTextEditor = ({
uploadFile,
deleteFile,
forwardedRef,
extensions: LiteTextEditorExtensions(),
extensions: LiteTextEditorExtensions(onEnterKeyPress),
});
const editorClassNames = getEditorClassNames({ noBorder, borderOnFocus, customClassName });

9
space/components/issues/peek-overview/comment/add-comment.tsx
View File

@ -11,7 +11,7 @@ import { SecondaryButton } from "components/ui";
// types
import { Comment } from "types/issue";
// components
import { RichTextEditorWithRef } from "@plane/rich-text-editor";
import { LiteTextEditorWithRef } from "@plane/lite-text-editor";
// service
import fileService from "@/services/file.service";
@ -71,7 +71,12 @@ export const AddComment: React.FC<Props> = observer((props) => {
name="comment_html"
control={control}
render={({ field: { value, onChange } }) => (
<RichTextEditorWithRef
<LiteTextEditorWithRef
onEnterKeyPress={(e) => {
userStore.requiredLogin(() => {
handleSubmit(onSubmit)(e);
});
}}
uploadFile={fileService.getUploadFileFunction(workspace_slug as string)}
deleteFile={fileService.deleteImage}
ref={editorRef}

13
space/components/issues/peek-overview/comment/comment-detail-card.tsx
View File

@ -104,6 +104,7 @@ export const CommentCard: React.FC<Props> = observer((props) => {
name="comment_html"
render={({ field: { onChange, value } }) => (
<LiteTextEditorWithRef
onEnterKeyPress={handleSubmit(handleCommentUpdate)}
uploadFile={fileService.getUploadFileFunction(workspaceSlug)}
deleteFile={fileService.deleteImage}
ref={editorRef}
@ -149,7 +150,7 @@ export const CommentCard: React.FC<Props> = observer((props) => {
<Menu as="div" className="relative w-min text-left">
<Menu.Button
type="button"
onClick={() => {}}
onClick={() => { }}
className="relative grid place-items-center rounded p-1 text-custom-text-200 hover:text-custom-text-100 outline-none cursor-pointer hover:bg-custom-background-80"
>
<EllipsisVerticalIcon className="h-5 w-5 text-custom-text-200 duration-300" />
@ -173,9 +174,8 @@ export const CommentCard: React.FC<Props> = observer((props) => {
onClick={() => {
setIsEditing(true);
}}
className={`w-full select-none truncate rounded px-1 py-1.5 text-left text-custom-text-200 hover:bg-custom-background-80 ${
active ? "bg-custom-background-80" : ""
}`}
className={`w-full select-none truncate rounded px-1 py-1.5 text-left text-custom-text-200 hover:bg-custom-background-80 ${active ? "bg-custom-background-80" : ""
}`}
>
Edit
</button>
@ -188,9 +188,8 @@ export const CommentCard: React.FC<Props> = observer((props) => {
<button
type="button"
onClick={handleDelete}
className={`w-full select-none truncate rounded px-1 py-1.5 text-left text-custom-text-200 hover:bg-custom-background-80 ${
active ? "bg-custom-background-80" : ""
}`}
className={`w-full select-none truncate rounded px-1 py-1.5 text-left text-custom-text-200 hover:bg-custom-background-80 ${active ? "bg-custom-background-80" : ""
}`}
>
Delete
</button>

1
web/components/issues/comment/add-comment.tsx
View File

@ -80,6 +80,7 @@ export const AddComment: React.FC<Props> = ({
control={control}
render={({ field: { onChange: onCommentChange, value: commentValue } }) => (
<LiteTextEditorWithRef
onEnterKeyPress={handleSubmit(handleAddComment)}
uploadFile={fileService.getUploadFileFunction(workspaceSlug as string)}
deleteFile={fileService.deleteImage}
ref={editorRef}

1
web/components/issues/comment/comment-card.tsx
View File

@ -113,6 +113,7 @@ export const CommentCard: React.FC<Props> = ({
>
<div>
<LiteTextEditorWithRef
onEnterKeyPress={handleSubmit(onEnter)}
uploadFile={fileService.getUploadFileFunction(workspaceSlug as string)}
deleteFile={fileService.deleteImage}
ref={editorRef}