fix: tiptap editor export fixes (#2001)
This commit is contained in:
sriram veeraghanta
GitHub
parent
b2e5760391
commit
c65bbf865d
9 changed files with 77 additions and 107 deletions
|
|
@ -1,12 +1,7 @@
|
|||
import React, { useCallback, useEffect, useState } from "react";
|
||||
|
||||
import { useRouter } from "next/router";
|
||||
|
||||
import { mutate } from "swr";
|
||||
|
||||
import { SparklesIcon } from "@heroicons/react/24/outline";
|
||||
|
||||
// react-hook-form
|
||||
import { Controller, useForm } from "react-hook-form";
|
||||
// services
|
||||
import pagesService from "services/pages.service";
|
||||
|
|
@ -16,13 +11,12 @@ import aiService from "services/ai.service";
|
|||
import useToast from "hooks/use-toast";
|
||||
// components
|
||||
import { GptAssistantModal } from "components/core";
|
||||
// ui
|
||||
import { TipTapEditor } from "components/tiptap";
|
||||
import { PrimaryButton, SecondaryButton, TextArea } from "components/ui";
|
||||
// types
|
||||
import { ICurrentUserResponse, IPageBlock } from "types";
|
||||
// fetch-keys
|
||||
import { PAGE_BLOCKS_LIST } from "constants/fetch-keys";
|
||||
import Tiptap, { ITiptapRichTextEditor } from "components/tiptap";
|
||||
|
||||
type Props = {
|
||||
handleClose: () => void;
|
||||
|
|
@ -39,12 +33,6 @@ const defaultValues = {
|
|||
description_html: null,
|
||||
};
|
||||
|
||||
const TiptapEditor = React.forwardRef<ITiptapRichTextEditor, ITiptapRichTextEditor>(
|
||||
(props, ref) => <Tiptap {...props} forwardedRef={ref} />
|
||||
);
|
||||
|
||||
TiptapEditor.displayName = "TiptapEditor";
|
||||
|
||||
export const CreateUpdateBlockInline: React.FC<Props> = ({
|
||||
handleClose,
|
||||
data,
|
||||
|
|
@ -231,9 +219,9 @@ export const CreateUpdateBlockInline: React.FC<Props> = ({
|
|||
description:
|
||||
!data.description || data.description === ""
|
||||
? {
|
||||
type: "doc",
|
||||
content: [{ type: "paragraph" }],
|
||||
}
|
||||
type: "doc",
|
||||
content: [{ type: "paragraph" }],
|
||||
}
|
||||
: data.description,
|
||||
description_html: data.description_html ?? "<p></p>",
|
||||
});
|
||||
|
|
@ -291,7 +279,7 @@ export const CreateUpdateBlockInline: React.FC<Props> = ({
|
|||
render={({ field: { value, onChange } }) => {
|
||||
if (!data)
|
||||
return (
|
||||
<TiptapEditor
|
||||
<TipTapEditor
|
||||
workspaceSlug={workspaceSlug as string}
|
||||
ref={editorRef}
|
||||
value={"<p></p>"}
|
||||
|
|
@ -311,7 +299,7 @@ export const CreateUpdateBlockInline: React.FC<Props> = ({
|
|||
);
|
||||
|
||||
return (
|
||||
<TiptapEditor
|
||||
<TipTapEditor
|
||||
workspaceSlug={workspaceSlug as string}
|
||||
ref={editorRef}
|
||||
value={
|
||||
|
|
@ -334,8 +322,9 @@ export const CreateUpdateBlockInline: React.FC<Props> = ({
|
|||
<div className="m-2 mt-6 flex">
|
||||
<button
|
||||
type="button"
|
||||
className={`flex items-center gap-1 rounded px-1.5 py-1 text-xs hover:bg-custom-background-80 ${iAmFeelingLucky ? "cursor-wait bg-custom-background-90" : ""
|
||||
}`}
|
||||
className={`flex items-center gap-1 rounded px-1.5 py-1 text-xs hover:bg-custom-background-80 ${
|
||||
iAmFeelingLucky ? "cursor-wait bg-custom-background-90" : ""
|
||||
}`}
|
||||
onClick={handleAutoGenerateDescription}
|
||||
disabled={iAmFeelingLucky}
|
||||
>
|
||||
|
|
@ -367,8 +356,8 @@ export const CreateUpdateBlockInline: React.FC<Props> = ({
|
|||
? "Updating..."
|
||||
: "Update block"
|
||||
: isSubmitting
|
||||
? "Adding..."
|
||||
: "Add block"}
|
||||
? "Adding..."
|
||||
: "Add block"}
|
||||
</PrimaryButton>
|
||||
</div>
|
||||
</form>
|
||||
|
|
|
|||
|
|
@ -19,6 +19,7 @@ import useOutsideClickDetector from "hooks/use-outside-click-detector";
|
|||
// components
|
||||
import { GptAssistantModal } from "components/core";
|
||||
import { CreateUpdateBlockInline } from "components/pages";
|
||||
import { TipTapEditor } from "components/tiptap";
|
||||
// ui
|
||||
import { CustomMenu, TextArea } from "components/ui";
|
||||
// icons
|
||||
|
|
@ -38,7 +39,6 @@ import { copyTextToClipboard } from "helpers/string.helper";
|
|||
import { ICurrentUserResponse, IIssue, IPageBlock, IProject } from "types";
|
||||
// fetch-keys
|
||||
import { PAGE_BLOCKS_LIST } from "constants/fetch-keys";
|
||||
import Tiptap, { ITiptapRichTextEditor } from "components/tiptap";
|
||||
|
||||
type Props = {
|
||||
block: IPageBlock;
|
||||
|
|
@ -48,13 +48,6 @@ type Props = {
|
|||
user: ICurrentUserResponse | undefined;
|
||||
};
|
||||
|
||||
const TiptapEditor = React.forwardRef<
|
||||
ITiptapRichTextEditor,
|
||||
ITiptapRichTextEditor
|
||||
>((props, ref) => <Tiptap {...props} forwardedRef={ref} />);
|
||||
|
||||
TiptapEditor.displayName = "TiptapEditor";
|
||||
|
||||
export const SinglePageBlock: React.FC<Props> = ({
|
||||
block,
|
||||
projectDetails,
|
||||
|
|
@ -328,8 +321,9 @@ export const SinglePageBlock: React.FC<Props> = ({
|
|||
</div>
|
||||
) : (
|
||||
<div
|
||||
className={`group relative w-full rounded bg-custom-background-80 text-custom-text-200 ${snapshot.isDragging ? "bg-custom-background-100 p-4 shadow" : ""
|
||||
}`}
|
||||
className={`group relative w-full rounded bg-custom-background-80 text-custom-text-200 ${
|
||||
snapshot.isDragging ? "bg-custom-background-100 p-4 shadow" : ""
|
||||
}`}
|
||||
ref={provided.innerRef}
|
||||
{...provided.draggableProps}
|
||||
>
|
||||
|
|
@ -343,8 +337,9 @@ export const SinglePageBlock: React.FC<Props> = ({
|
|||
</button>
|
||||
<div
|
||||
ref={actionSectionRef}
|
||||
className={`absolute top-4 right-2 hidden items-center gap-2 bg-custom-background-80 pl-4 group-hover:!flex ${isMenuActive ? "!flex" : ""
|
||||
}`}
|
||||
className={`absolute top-4 right-2 hidden items-center gap-2 bg-custom-background-80 pl-4 group-hover:!flex ${
|
||||
isMenuActive ? "!flex" : ""
|
||||
}`}
|
||||
>
|
||||
{block.issue && block.sync && (
|
||||
<div className="flex flex-shrink-0 cursor-default items-center gap-1 rounded py-1 px-1.5 text-xs">
|
||||
|
|
@ -358,8 +353,9 @@ export const SinglePageBlock: React.FC<Props> = ({
|
|||
)}
|
||||
<button
|
||||
type="button"
|
||||
className={`flex items-center gap-1 rounded px-1.5 py-1 text-xs hover:bg-custom-background-90 ${iAmFeelingLucky ? "cursor-wait" : ""
|
||||
}`}
|
||||
className={`flex items-center gap-1 rounded px-1.5 py-1 text-xs hover:bg-custom-background-90 ${
|
||||
iAmFeelingLucky ? "cursor-wait" : ""
|
||||
}`}
|
||||
onClick={handleAutoGenerateDescription}
|
||||
disabled={iAmFeelingLucky}
|
||||
>
|
||||
|
|
@ -455,18 +451,19 @@ export const SinglePageBlock: React.FC<Props> = ({
|
|||
|
||||
{showBlockDetails
|
||||
? block.description_html.length > 7 && (
|
||||
<TiptapEditor
|
||||
workspaceSlug={workspaceSlug as string}
|
||||
value={block.description_html}
|
||||
customClassName="text-sm min-h-[150px]"
|
||||
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>
|
||||
)}
|
||||
<TipTapEditor
|
||||
workspaceSlug={workspaceSlug as string}
|
||||
value={block.description_html}
|
||||
customClassName="text-sm min-h-[150px]"
|
||||
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
|
||||
|
|
|
|||
Loading…
Add table
Add a link
Reference in a new issue