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

remirror instances commented out to avoid prosemirror conflicts

Browse Source
This commit is contained in:
Palanikannan1437 2023-08-02 23:00:47 +05:30
parent 6ea15ced02
commit dd5ff737d1
10 changed files with 214 additions and 213 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

5
apps/app/components/command-palette/command-pallette.tsx
View File

@ -49,7 +49,7 @@ export const CommandPalette: React.FC = () => {
workspaceSlug && projectId && issueId ? ISSUE_DETAILS(issueId as string) : null,
workspaceSlug && projectId && issueId
? () =>
issuesService.retrieve(workspaceSlug as string, projectId as string, issueId as string)
issuesService.retrieve(workspaceSlug as string, projectId as string, issueId as string)
: null
);
@ -81,7 +81,8 @@ export const CommandPalette: React.FC = () => {
if (
!(e.target instanceof HTMLTextAreaElement) &&
!(e.target instanceof HTMLInputElement) &&
!(e.target as Element).classList?.contains("remirror-editor")
// !(e.target as Element).classList?.contains("remirror-editor") &&
!(e.target as Element).closest(".tiptap-editor-container")
) {
if ((ctrlKey || metaKey) && keyPressed === "k") {
e.preventDefault();

26
apps/app/components/core/feeds.tsx
View File

@ -16,7 +16,7 @@ import { Icon } from "components/ui";
import { renderShortDateWithYearFormat, timeAgo } from "helpers/date-time.helper";
import { addSpaceIfCamelCase } from "helpers/string.helper";
// types
import RemirrorRichTextEditor from "components/rich-text-editor";
// import RemirrorRichTextEditor from "components/rich-text-editor";
const activityDetails: {
[key: string]: {
@ -250,18 +250,18 @@ export const Feeds: React.FC<any> = ({ activities }) => {
Commented {timeAgo(activity.created_at)}
</p>
</div>
<div className="issue-comments-section p-0">
<RemirrorRichTextEditor
value={
activity.new_value && activity.new_value !== ""
? activity.new_value
: activity.old_value
}
editable={false}
noBorder
customClassName="text-xs border border-custom-border-200 bg-custom-background-100"
/>
</div>
{/* <div className="issue-comments-section p-0"> */}
{/* <RemirrorRichTextEditor */}
{/* value={ */}
{/* activity.new_value && activity.new_value !== "" */}
{/* ? activity.new_value */}
{/* : activity.old_value */}
{/* } */}
{/* editable={false} */}
{/* noBorder */}
{/* customClassName="text-xs border border-custom-border-200 bg-custom-background-100" */}
{/* /> */}
{/* </div> */}
</div>
</div>
</div>

48
apps/app/components/core/modals/gpt-assistant-modal.tsx
View File

@ -32,17 +32,17 @@ type FormData = {
task: string;
};
const RemirrorRichTextEditor = dynamic(() => import("components/rich-text-editor"), {
ssr: false,
});
import { IRemirrorRichTextEditor } from "components/rich-text-editor";
const WrappedRemirrorRichTextEditor = forwardRef<IRemirrorRichTextEditor, IRemirrorRichTextEditor>(
(props, ref) => <RemirrorRichTextEditor {...props} forwardedRef={ref} />
);
WrappedRemirrorRichTextEditor.displayName = "WrappedRemirrorRichTextEditor";
// const RemirrorRichTextEditor = dynamic(() => import("components/rich-text-editor"), {
// ssr: false,
// });
//
// import { IRemirrorRichTextEditor } from "components/rich-text-editor";
//
// const WrappedRemirrorRichTextEditor = forwardRef<IRemirrorRichTextEditor, IRemirrorRichTextEditor>(
// (props, ref) => <RemirrorRichTextEditor {...props} forwardedRef={ref} />
// );
//
// WrappedRemirrorRichTextEditor.displayName = "WrappedRemirrorRichTextEditor";
export const GptAssistantModal: React.FC<Props> = ({
isOpen,
@ -150,19 +150,19 @@ export const GptAssistantModal: React.FC<Props> = ({
isOpen ? "block" : "hidden"
}`}
>
{((content && content !== "") || (htmlContent && htmlContent !== "<p></p>")) && (
<div className="remirror-section text-sm">
Content:
<WrappedRemirrorRichTextEditor
value={htmlContent ?? <p>{content}</p>}
customClassName="-m-3"
noBorder
borderOnFocus={false}
editable={false}
ref={editorRef}
/>
</div>
)}
{/* {((content && content !== "") || (htmlContent && htmlContent !== "<p></p>")) && ( */}
{/* <div className="remirror-section text-sm"> */}
{/* Content: */}
{/* <WrappedRemirrorRichTextEditor */}
{/* value={htmlContent ?? <p>{content}</p>} */}
{/* customClassName="-m-3" */}
{/* noBorder */}
{/* borderOnFocus={false} */}
{/* editable={false} */}
{/* ref={editorRef} */}
{/* /> */}
{/* </div> */}
{/* )} */}
{response !== "" && (
<div className="page-block-section text-sm">
Response:

60
apps/app/components/issues/comment/add-comment.tsx
View File

@ -18,23 +18,23 @@ import type { ICurrentUserResponse, IIssueComment } from "types";
// fetch-keys
import { PROJECT_ISSUES_ACTIVITY } from "constants/fetch-keys";
const RemirrorRichTextEditor = dynamic(() => import("components/rich-text-editor"), {
ssr: false,
loading: () => (
<Loader className="mb-5">
<Loader.Item height="12rem" width="100%" />
</Loader>
),
});
import { IRemirrorRichTextEditor } from "components/rich-text-editor";
const WrappedRemirrorRichTextEditor = React.forwardRef<
IRemirrorRichTextEditor,
IRemirrorRichTextEditor
>((props, ref) => <RemirrorRichTextEditor {...props} forwardedRef={ref} />);
WrappedRemirrorRichTextEditor.displayName = "WrappedRemirrorRichTextEditor";
// const RemirrorRichTextEditor = dynamic(() => import("components/rich-text-editor"), {
// ssr: false,
// loading: () => (
// <Loader className="mb-5">
// <Loader.Item height="12rem" width="100%" />
// </Loader>
// ),
// });
// import { IRemirrorRichTextEditor } from "components/rich-text-editor";
//
// const WrappedRemirrorRichTextEditor = React.forwardRef<
// IRemirrorRichTextEditor,
// IRemirrorRichTextEditor
// >((props, ref) => <RemirrorRichTextEditor {...props} forwardedRef={ref} />);
//
// WrappedRemirrorRichTextEditor.displayName = "WrappedRemirrorRichTextEditor";
//
const defaultValues: Partial<IIssueComment> = {
comment_json: "",
comment_html: "",
@ -98,19 +98,19 @@ export const AddComment: React.FC<Props> = ({ issueId, user, disabled = false })
<div>
<form onSubmit={handleSubmit(onSubmit)}>
<div className="issue-comments-section">
<Controller
name="comment_json"
control={control}
render={({ field: { value } }) => (
<WrappedRemirrorRichTextEditor
value={value}
onJSONChange={(jsonValue) => setValue("comment_json", jsonValue)}
onHTMLChange={(htmlValue) => setValue("comment_html", htmlValue)}
placeholder="Enter your comment..."
ref={editorRef}
/>
)}
/>
{/* <Controller */}
{/* name="comment_json" */}
{/* control={control} */}
{/* render={({ field: { value } }) => ( */}
{/* <WrappedRemirrorRichTextEditor */}
{/* value={value} */}
{/* onJSONChange={(jsonValue) => setValue("comment_json", jsonValue)} */}
{/* onHTMLChange={(htmlValue) => setValue("comment_html", htmlValue)} */}
{/* placeholder="Enter your comment..." */}
{/* ref={editorRef} */}
{/* /> */}
{/* )} */}
{/* /> */}
<SecondaryButton type="submit" disabled={isSubmitting || disabled} className="mt-2">
{isSubmitting ? "Adding..." : "Comment"}

36
apps/app/components/issues/comment/comment-card.tsx
View File

@ -16,17 +16,17 @@ import { timeAgo } from "helpers/date-time.helper";
// types
import type { IIssueComment } from "types";
const RemirrorRichTextEditor = dynamic(() => import("components/rich-text-editor"), { ssr: false });
import { IRemirrorRichTextEditor } from "components/rich-text-editor";
const WrappedRemirrorRichTextEditor = React.forwardRef<
IRemirrorRichTextEditor,
IRemirrorRichTextEditor
>((props, ref) => <RemirrorRichTextEditor {...props} forwardedRef={ref} />);
WrappedRemirrorRichTextEditor.displayName = "WrappedRemirrorRichTextEditor";
// const RemirrorRichTextEditor = dynamic(() => import("components/rich-text-editor"), { ssr: false });
//
// import { IRemirrorRichTextEditor } from "components/rich-text-editor";
//
// const WrappedRemirrorRichTextEditor = React.forwardRef<
// IRemirrorRichTextEditor,
// IRemirrorRichTextEditor
// >((props, ref) => <RemirrorRichTextEditor {...props} forwardedRef={ref} />);
//
// WrappedRemirrorRichTextEditor.displayName = "WrappedRemirrorRichTextEditor";
//
type Props = {
comment: IIssueComment;
onSubmit: (comment: IIssueComment) => void;
@ -132,13 +132,13 @@ export const CommentCard: React.FC<Props> = ({ comment, onSubmit, handleCommentD
</div>
</form>
<div className={`${isEditing ? "hidden" : ""}`}>
<WrappedRemirrorRichTextEditor
value={comment.comment_html}
editable={false}
noBorder
customClassName="text-xs border border-custom-border-200 bg-custom-background-100"
ref={showEditorRef}
/>
{/* <WrappedRemirrorRichTextEditor */}
{/* value={comment.comment_html} */}
{/* editable={false} */}
{/* noBorder */}
{/* customClassName="text-xs border border-custom-border-200 bg-custom-background-100" */}
{/* ref={showEditorRef} */}
{/* /> */}
<CommentReaction projectId={comment.project} commentId={comment.id} />
</div>

63
apps/app/components/issues/main-content.tsx
View File

@ -50,11 +50,11 @@ export const IssueMainContent: React.FC<Props> = ({
workspaceSlug && projectId && issueDetails?.parent ? SUB_ISSUES(issueDetails.parent) : null,
workspaceSlug && projectId && issueDetails?.parent
? () =>
issuesService.subIssues(
workspaceSlug as string,
projectId as string,
issueDetails.parent ?? ""
)
issuesService.subIssues(
workspaceSlug as string,
projectId as string,
issueDetails.parent ?? ""
)
: null
);
const siblingIssuesList = siblingIssues?.sub_issues.filter((i) => i.id !== issueDetails.id);
@ -97,9 +97,8 @@ export const IssueMainContent: React.FC<Props> = ({
<CustomMenu.MenuItem
key={issue.id}
renderAs="a"
href={`/${workspaceSlug}/projects/${projectId as string}/issues/${
issue.id
}`}
href={`/${workspaceSlug}/projects/${projectId as string}/issues/${issue.id
}`}
className="flex items-center gap-2 py-2"
>
<LayerDiagonalIcon className="h-4 w-4" />
@ -130,30 +129,30 @@ export const IssueMainContent: React.FC<Props> = ({
isAllowed={memberRole.isMember || memberRole.isOwner || !uneditable}
/>
<IssueReaction workspaceSlug={workspaceSlug} issueId={issueId} projectId={projectId} />
<div className="mt-2 space-y-2">
<SubIssuesList parentIssue={issueDetails} user={user} disabled={uneditable} />
</div>
</div>
<div className="flex flex-col gap-3 py-3">
<h3 className="text-lg">Attachments</h3>
<div className="grid grid-cols-1 gap-3 sm:grid-cols-2 xl:grid-cols-3 2xl:grid-cols-4">
<IssueAttachmentUpload disabled={uneditable} />
<IssueAttachments />
</div>
</div>
<div className="space-y-5 pt-3">
<h3 className="text-lg text-custom-text-100">Comments/Activity</h3>
<IssueActivitySection
issueId={(archivedIssueId as string) ?? (issueId as string)}
user={user}
/>
<AddComment
issueId={(archivedIssueId as string) ?? (issueId as string)}
user={user}
disabled={uneditable}
/>
{/* <IssueReaction workspaceSlug={workspaceSlug} issueId={issueId} projectId={projectId} /> */}
{/**/}
{/* <div className="mt-2 space-y-2"> */}
{/* <SubIssuesList parentIssue={issueDetails} user={user} disabled={uneditable} /> */}
{/* </div> */}
{/* </div> */}
{/* <div className="flex flex-col gap-3 py-3"> */}
{/* <h3 className="text-lg">Attachments</h3> */}
{/* <div className="grid grid-cols-1 gap-3 sm:grid-cols-2 xl:grid-cols-3 2xl:grid-cols-4"> */}
{/* <IssueAttachmentUpload disabled={uneditable} /> */}
{/* <IssueAttachments /> */}
{/* </div> */}
{/* </div> */}
{/* <div className="space-y-5 pt-3"> */}
{/* <h3 className="text-lg text-custom-text-100">Comments/Activity</h3> */}
{/* <IssueActivitySection */}
{/* issueId={(archivedIssueId as string) ?? (issueId as string)} */}
{/* user={user} */}
{/* /> */}
{/* <AddComment */}
{/* issueId={(archivedIssueId as string) ?? (issueId as string)} */}
{/* user={user} */}
{/* disabled={uneditable} */}
{/* /> */}
</div>
</>
);

122
apps/app/components/pages/create-update-block-inline.tsx
View File

@ -39,22 +39,22 @@ const defaultValues = {
description_html: null,
};
const RemirrorRichTextEditor = dynamic(() => import("components/rich-text-editor"), {
ssr: false,
loading: () => (
<Loader className="mx-4 mt-6">
<Loader.Item height="100px" width="100%" />
</Loader>
),
});
import { IRemirrorRichTextEditor } from "components/rich-text-editor";
const WrappedRemirrorRichTextEditor = React.forwardRef<
IRemirrorRichTextEditor,
IRemirrorRichTextEditor
>((props, ref) => <RemirrorRichTextEditor {...props} forwardedRef={ref} />);
WrappedRemirrorRichTextEditor.displayName = "WrappedRemirrorRichTextEditor";
// const RemirrorRichTextEditor = dynamic(() => import("components/rich-text-editor"), {
// ssr: false,
// loading: () => (
// <Loader className="mx-4 mt-6">
// <Loader.Item height="100px" width="100%" />
// </Loader>
// ),
// });
// import { IRemirrorRichTextEditor } from "components/rich-text-editor";
//
// const WrappedRemirrorRichTextEditor = React.forwardRef<
// IRemirrorRichTextEditor,
// IRemirrorRichTextEditor
// >((props, ref) => <RemirrorRichTextEditor {...props} forwardedRef={ref} />);
//
// WrappedRemirrorRichTextEditor.displayName = "WrappedRemirrorRichTextEditor";
export const CreateUpdateBlockInline: React.FC<Props> = ({
handleClose,
@ -296,51 +296,51 @@ export const CreateUpdateBlockInline: React.FC<Props> = ({
/>
</div>
<div className="page-block-section relative -mt-2 text-custom-text-200">
<Controller
name="description"
control={control}
render={({ field: { value } }) => {
if (!data)
return (
<WrappedRemirrorRichTextEditor
value={{
type: "doc",
content: [{ type: "paragraph" }],
}}
onJSONChange={(jsonValue) => setValue("description", jsonValue)}
onHTMLChange={(htmlValue) => setValue("description_html", htmlValue)}
placeholder="Write something..."
customClassName="text-sm"
noBorder
borderOnFocus={false}
ref={editorRef}
/>
);
else if (!value || !watch("description_html"))
return (
<div className="h-32 w-full flex items-center justify-center text-custom-text-200 text-sm" />
);
return (
<WrappedRemirrorRichTextEditor
value={
value && value !== "" && Object.keys(value).length > 0
? value
: watch("description_html") && watch("description_html") !== ""
? watch("description_html")
: { type: "doc", content: [{ type: "paragraph" }] }
}
onJSONChange={(jsonValue) => setValue("description", jsonValue)}
onHTMLChange={(htmlValue) => setValue("description_html", htmlValue)}
placeholder="Write something..."
customClassName="text-sm"
noBorder
borderOnFocus={false}
ref={editorRef}
/>
);
}}
/>
{/* <Controller */}
{/* name="description" */}
{/* control={control} */}
{/* render={({ field: { value } }) => { */}
{/* if (!data) */}
{/* return ( */}
{/* <WrappedRemirrorRichTextEditor */}
{/* value={{ */}
{/* type: "doc", */}
{/* content: [{ type: "paragraph" }], */}
{/* }} */}
{/* onJSONChange={(jsonValue) => setValue("description", jsonValue)} */}
{/* onHTMLChange={(htmlValue) => setValue("description_html", htmlValue)} */}
{/* placeholder="Write something..." */}
{/* customClassName="text-sm" */}
{/* noBorder */}
{/* borderOnFocus={false} */}
{/* ref={editorRef} */}
{/* /> */}
{/* ); */}
{/* else if (!value || !watch("description_html")) */}
{/* return ( */}
{/* <div className="h-32 w-full flex items-center justify-center text-custom-text-200 text-sm" /> */}
{/* ); */}
{/**/}
{/* return ( */}
{/* <WrappedRemirrorRichTextEditor */}
{/* value={ */}
{/* value && value !== "" && Object.keys(value).length > 0 */}
{/* ? value */}
{/* : watch("description_html") && watch("description_html") !== "" */}
{/* ? watch("description_html") */}
{/* : { type: "doc", content: [{ type: "paragraph" }] } */}
{/* } */}
{/* onJSONChange={(jsonValue) => setValue("description", jsonValue)} */}
{/* onHTMLChange={(htmlValue) => setValue("description_html", htmlValue)} */}
{/* placeholder="Write something..." */}
{/* customClassName="text-sm" */}
{/* noBorder */}
{/* borderOnFocus={false} */}
{/* ref={editorRef} */}
{/* /> */}
{/* ); */}
{/* }} */}
{/* /> */}
<div className="m-2 mt-6 flex">
<button
type="button"

16
apps/app/components/pages/page-form.tsx
View File

@ -17,14 +17,14 @@ type Props = {
};
// rich-text-editor
const RemirrorRichTextEditor = dynamic(() => import("components/rich-text-editor"), {
ssr: false,
loading: () => (
<Loader>
<Loader.Item height="12rem" width="100%" />
</Loader>
),
});
// const RemirrorRichTextEditor = dynamic(() => import("components/rich-text-editor"), {
// ssr: false,
// loading: () => (
// <Loader>
// <Loader.Item height="12rem" width="100%" />
// </Loader>
// ),
// });
const defaultValues = {
name: "",

40
apps/app/components/pages/single-page-block.tsx
View File

@ -19,7 +19,7 @@ import useOutsideClickDetector from "hooks/use-outside-click-detector";
// components
import { GptAssistantModal } from "components/core";
import { CreateUpdateBlockInline } from "components/pages";
import RemirrorRichTextEditor, { IRemirrorRichTextEditor } from "components/rich-text-editor";
// import RemirrorRichTextEditor, { IRemirrorRichTextEditor } from "components/rich-text-editor";
// ui
import { CustomMenu, TextArea } from "components/ui";
// icons
@ -48,12 +48,12 @@ type Props = {
user: ICurrentUserResponse | undefined;
};
const WrappedRemirrorRichTextEditor = React.forwardRef<
IRemirrorRichTextEditor,
IRemirrorRichTextEditor
>((props, ref) => <RemirrorRichTextEditor {...props} forwardedRef={ref} />);
// const WrappedRemirrorRichTextEditor = React.forwardRef<
// IRemirrorRichTextEditor,
// IRemirrorRichTextEditor
// >((props, ref) => <RemirrorRichTextEditor {...props} forwardedRef={ref} />);
WrappedRemirrorRichTextEditor.displayName = "WrappedRemirrorRichTextEditor";
// WrappedRemirrorRichTextEditor.displayName = "WrappedRemirrorRichTextEditor";
export const SinglePageBlock: React.FC<Props> = ({
block,
@ -456,20 +456,20 @@ export const SinglePageBlock: React.FC<Props> = ({
/>
</div>
{showBlockDetails
? block.description_html.length > 7 && (
<WrappedRemirrorRichTextEditor
value={block.description_html}
customClassName="text-sm"
noBorder
borderOnFocus={false}
/>
)
: block.description_stripped.length > 0 && (
<p className="mt-3 text-sm font-normal text-custom-text-200 h-5 truncate">
{block.description_stripped}
</p>
)}
{/* {showBlockDetails */}
{/* ? block.description_html.length > 7 && ( */}
{/* <WrappedRemirrorRichTextEditor */}
{/* value={block.description_html} */}
{/* customClassName="text-sm" */}
{/* noBorder */}
{/* borderOnFocus={false} */}
{/* /> */}
{/* ) */}
{/* : block.description_stripped.length > 0 && ( */}
{/* <p className="mt-3 text-sm font-normal text-custom-text-200 h-5 truncate"> */}
{/* {block.description_stripped} */}
{/* </p> */}
{/* )} */}
</div>
</div>
<GptAssistantModal

11
apps/app/package.json
View File

@ -11,6 +11,8 @@
"dependencies": {
"@blueprintjs/core": "^4.16.3",
"@blueprintjs/popover2": "^1.13.3",
"@emotion/react": "^11.11.1",
"@emotion/styled": "^11.11.0",
"@headlessui/react": "^1.7.3",
"@heroicons/react": "^2.0.12",
"@jitsu/nextjs": "^3.1.5",
@ -23,12 +25,12 @@
"@nivo/line": "0.80.0",
"@nivo/pie": "0.80.0",
"@nivo/scatterplot": "0.80.0",
"@remirror/core": "^2.0.11",
"@remirror/extension-react-tables": "^2.2.11",
"@remirror/pm": "^2.0.3",
"@remirror/react": "^2.0.24",
"@sentry/nextjs": "^7.36.0",
"@tailwindcss/typography": "^0.5.9",
"@tiptap/extension-placeholder": "^2.0.4",
"@tiptap/pm": "^2.0.4",
"@tiptap/react": "^2.0.4",
"@tiptap/starter-kit": "^2.0.4",
"@types/lodash.debounce": "^4.0.7",
"@types/react-datepicker": "^4.8.0",
"axios": "^1.1.3",
@ -48,7 +50,6 @@
"react-dropzone": "^14.2.3",
"react-hook-form": "^7.38.0",
"react-markdown": "^8.0.7",
"remirror": "^2.0.23",
"swr": "^2.1.3",
"tlds": "^1.238.0",
"uuid": "^9.0.0"