replaced all read-only instances

2023-10-02 16:35:54 +05:30 · 2023-10-02 16:35:54 +05:30 · 51e281592f
commit 51e281592f
parent de07f63089
5 changed files with 44 additions and 75 deletions
--- a/packages/editor/core/src/ui/index.tsx
+++ b/packages/editor/core/src/ui/index.tsx
@ -6,8 +6,8 @@ import { DeleteImage } from '@/types/delete-image';
 import { getEditorClassNames } from '@/lib/utils';
 import { EditorProps } from '@tiptap/pm/view';
 import { useEditor } from './hooks/useEditor';
-import { EditorContainer } from '@/ui/editor-container';
-import { EditorContentWrapper } from '@/ui/editor-content';
+import { EditorContainer } from '@/ui/components/editor-container';
+import { EditorContentWrapper } from '@/ui/components/editor-content';

 interface ICoreEditor {
  value: string;
--- a/space/components/issues/peek-overview/comment/comment-detail-card.tsx
+++ b/space/components/issues/peek-overview/comment/comment-detail-card.tsx
@ -9,7 +9,7 @@ import { Menu, Transition } from "@headlessui/react";
 // lib
 import { useMobxStore } from "lib/mobx/store-provider";
 // components
-import { RichTextEditorWithRef } from "@plane/rich-text-editor";
+import { LiteReadOnlyEditorWithRef, LiteTextEditorWithRef } from "@plane/lite-text-editor";

 import { CommentReactions } from "components/issues/peek-overview";
 // icons
@ -103,7 +103,7 @@ export const CommentCard: React.FC<Props> = observer((props) => {
                control={control}
                name="comment_html"
                render={({ field: { onChange, value } }) => (
-                  <RichTextEditorWithRef
+                  <LiteTextEditorWithRef
                    uploadFile={fileService.getUploadFileFunction(workspaceSlug)}
                    deleteFile={fileService.deleteImage}
                    ref={editorRef}
@ -135,12 +135,9 @@ export const CommentCard: React.FC<Props> = observer((props) => {
            </div>
          </form>
          <div className={`${isEditing ? "hidden" : ""}`}>
-            <RichTextEditorWithRef
-              uploadFile={fileService.getUploadFileFunction(workspaceSlug)}
-              deleteFile={fileService.deleteImage}
+            <LiteReadOnlyEditorWithRef
              ref={showEditorRef}
              value={comment.comment_html}
-              editable={false}
              customClassName="text-xs border border-custom-border-200 bg-custom-background-100"
            />
            <CommentReactions commentId={comment.id} projectId={comment.project} />
--- a/space/components/issues/peek-overview/issue-details.tsx
+++ b/space/components/issues/peek-overview/issue-details.tsx
@ -1,43 +1,28 @@
 import { IssueReactions } from "components/issues/peek-overview";
-import { RichTextEditor } from "@plane/rich-text-editor";
-import { useRouter } from "next/router";
+import { RichReadOnlyEditor } from "@plane/rich-text-editor";
 // types
 import { IIssue } from "types/issue";
-// services
-import fileService from "@/services/file.service";

 type Props = {
  issueDetails: IIssue;
 };

-export const PeekOverviewIssueDetails: React.FC<Props> = ({ issueDetails }) => {
-  const router = useRouter();
-  const { workspace_slug } = router.query;
-
-  return (
-    <div className="space-y-2">
-      <h6 className="font-medium text-custom-text-200">
-        {issueDetails.project_detail.identifier}-{issueDetails.sequence_id}
-      </h6>
-      <h4 className="break-words text-2xl font-semibold">{issueDetails.name}</h4>
-      {issueDetails.description_html !== "" && issueDetails.description_html !== "<p></p>" && (
-        <RichTextEditor
-          uploadFile={fileService.getUploadFileFunction(workspace_slug as string)}
-          deleteFile={fileService.deleteImage}
-          value={
-            !issueDetails.description_html ||
-            issueDetails.description_html === "" ||
-            (typeof issueDetails.description_html === "object" &&
-              Object.keys(issueDetails.description_html).length === 0)
-              ? "<p></p>"
-              : issueDetails.description_html
-          }
-          customClassName="p-3 min-h-[50px] shadow-sm"
-          debouncedUpdatesEnabled={false}
-          editable={false}
-        />
-      )}
-      <IssueReactions />
-    </div>
-  );
-};
+export const PeekOverviewIssueDetails: React.FC<Props> = ({ issueDetails }) => (
+  <div className="space-y-2">
+    <h6 className="font-medium text-custom-text-200">
+      {issueDetails.project_detail.identifier}-{issueDetails.sequence_id}
+    </h6>
+    <h4 className="break-words text-2xl font-semibold">{issueDetails.name}</h4>
+    {issueDetails.description_html !== "" && issueDetails.description_html !== "<p></p>" && (
+      <RichReadOnlyEditor
+        value={!issueDetails.description_html ||
+          issueDetails.description_html === "" ||
+          (typeof issueDetails.description_html === "object" &&
+            Object.keys(issueDetails.description_html).length === 0)
+          ? "<p></p>"
+          : issueDetails.description_html}
+        customClassName="p-3 min-h-[50px] shadow-sm" />
+    )}
+    <IssueReactions />
+  </div>
+);
--- a/web/components/core/modals/gpt-assistant-modal.tsx
+++ b/web/components/core/modals/gpt-assistant-modal.tsx
@ -11,11 +11,9 @@ import useUserAuth from "hooks/use-user-auth";
 // ui
 import { Input, PrimaryButton, SecondaryButton } from "components/ui";
 // components
-import { RichTextEditor, RichTextEditorWithRef } from "@plane/rich-text-editor";
+import { RichReadOnlyEditor, RichReadOnlyEditorWithRef } from "@plane/rich-text-editor";
 // types
 import { IIssue, IPageBlock } from "types";
-// services
-import fileService from "@/services/file.service";

 type Props = {
  isOpen: boolean;
@ -136,21 +134,17 @@ export const GptAssistantModal: React.FC<Props> = ({

  return (
    <div
-      className={`absolute ${inset} z-20 w-full space-y-4 rounded-[10px] border border-custom-border-200 bg-custom-background-100 p-4 shadow ${
-        isOpen ? "block" : "hidden"
-      }`}
+      className={`absolute ${inset} z-20 w-full space-y-4 rounded-[10px] border border-custom-border-200 bg-custom-background-100 p-4 shadow ${isOpen ? "block" : "hidden"
+        }`}
    >
      {((content && content !== "") || (htmlContent && htmlContent !== "<p></p>")) && (
        <div className="text-sm">
          Content:
-          <RichTextEditorWithRef
-            uploadFile={fileService.getUploadFileFunction(workspaceSlug as string)}
-            deleteFile={fileService.deleteImage}
+          <RichReadOnlyEditorWithRef
            value={htmlContent ?? `<p>${content}</p>`}
            customClassName="-m-3"
            noBorder
            borderOnFocus={false}
-            editable={false}
            ref={editorRef}
          />
        </div>
@ -158,14 +152,11 @@ export const GptAssistantModal: React.FC<Props> = ({
      {response !== "" && (
        <div className="page-block-section text-sm">
          Response:
-          <RichTextEditor
-            uploadFile={fileService.getUploadFileFunction(workspaceSlug as string)}
-            deleteFile={fileService.deleteImage}
+          <RichReadOnlyEditor
            value={`<p>${response}</p>`}
            customClassName="-mx-3 -my-3"
            noBorder
            borderOnFocus={false}
-            editable={false}
          />
        </div>
      )}
@ -179,11 +170,10 @@ export const GptAssistantModal: React.FC<Props> = ({
        type="text"
        name="task"
        register={register}
-        placeholder={`${
-          content && content !== ""
-            ? "Tell AI what action to perform on this content..."
-            : "Ask AI anything..."
-        }`}
+        placeholder={`${content && content !== ""
+          ? "Tell AI what action to perform on this content..."
+          : "Ask AI anything..."
+          }`}
        autoComplete="off"
      />
      <div className={`flex gap-2 ${response === "" ? "justify-end" : "justify-between"}`}>
@ -219,8 +209,8 @@ export const GptAssistantModal: React.FC<Props> = ({
            {isSubmitting
              ? "Generating response..."
              : response === ""
-              ? "Generate response"
-              : "Generate again"}
+                ? "Generate response"
+                : "Generate again"}
          </PrimaryButton>
        </div>
      </div>
--- a/web/pages/[workspaceSlug]/me/profile/activity.tsx
+++ b/web/pages/[workspaceSlug]/me/profile/activity.tsx
@ -9,7 +9,7 @@ import userService from "services/user.service";
 import { WorkspaceAuthorizationLayout } from "layouts/auth-layout";
 // components
 import { ActivityIcon, ActivityMessage } from "components/core";
-import { RichTextEditor } from "@plane/rich-text-editor";
+import { RichReadOnlyEditor } from "@plane/rich-text-editor";
 // icons
 import { ArrowTopRightOnSquareIcon, ChatBubbleLeftEllipsisIcon } from "@heroicons/react/24/outline";
 // ui
@ -98,9 +98,7 @@ const ProfileActivity = () => {
                              </p>
                            </div>
                            <div className="issue-comments-section p-0">
-                              <RichTextEditor
-                                uploadFile={fileService.getUploadFileFunction(workspaceSlug as string)}
-                                deleteFile={fileService.deleteImage}
+                              <RichReadOnlyEditor
                                value={
                                  activityItem?.new_value !== ""
                                    ? activityItem.new_value
@ -109,7 +107,6 @@ const ProfileActivity = () => {
                                customClassName="text-xs border border-custom-border-200 bg-custom-background-100"
                                noBorder
                                borderOnFocus={false}
-                                editable={false}
                              />
                            </div>
                          </div>
@ -120,11 +117,11 @@ const ProfileActivity = () => {

                  const message =
                    activityItem.verb === "created" &&
-                    activityItem.field !== "cycles" &&
-                    activityItem.field !== "modules" &&
-                    activityItem.field !== "attachment" &&
-                    activityItem.field !== "link" &&
-                    activityItem.field !== "estimate" ? (
+                      activityItem.field !== "cycles" &&
+                      activityItem.field !== "modules" &&
+                      activityItem.field !== "attachment" &&
+                      activityItem.field !== "link" &&
+                      activityItem.field !== "estimate" ? (
                      <span className="text-custom-text-200">
                        created{" "}
                        <Link
@ -183,7 +180,7 @@ const ProfileActivity = () => {
                              <div className="min-w-0 flex-1 py-4 border-b border-custom-border-200">
                                <div className="text-sm text-custom-text-200 break-words">
                                  {activityItem.field === "archived_at" &&
-                                  activityItem.new_value !== "restore" ? (
+                                    activityItem.new_value !== "restore" ? (
                                    <span className="text-gray font-medium">Plane</span>
                                  ) : activityItem.actor_detail.is_bot ? (
                                    <span className="text-gray font-medium">