diff --git a/apps/app/components/pages/single-page-block.tsx b/apps/app/components/pages/single-page-block.tsx index 213edd5ef..7f01811db 100644 --- a/apps/app/components/pages/single-page-block.tsx +++ b/apps/app/components/pages/single-page-block.tsx @@ -8,16 +8,19 @@ import { mutate } from "swr"; // react-hook-form import { Controller, useForm } from "react-hook-form"; +// react-beautiful-dnd +import { Draggable } from "react-beautiful-dnd"; // services import pagesService from "services/pages.service"; import issuesService from "services/issues.service"; +import aiService from "services/ai.service"; // hooks import useToast from "hooks/use-toast"; // components import { GptAssistantModal } from "components/core"; import { CreateUpdateBlockInline } from "components/pages"; // ui -import { CustomMenu, Input, Loader } from "components/ui"; +import { CustomMenu, Loader } from "components/ui"; // icons import { LayerDiagonalIcon } from "components/icons"; import { ArrowPathIcon } from "@heroicons/react/20/solid"; @@ -34,7 +37,6 @@ import { copyTextToClipboard } from "helpers/string.helper"; import { IIssue, IPageBlock, IProject } from "types"; // fetch-keys import { PAGE_BLOCKS_LIST } from "constants/fetch-keys"; -import { Draggable } from "react-beautiful-dnd"; type Props = { block: IPageBlock; @@ -54,6 +56,7 @@ const RemirrorRichTextEditor = dynamic(() => import("components/rich-text-editor export const SinglePageBlock: React.FC = ({ block, projectDetails, index }) => { const [isSyncing, setIsSyncing] = useState(false); const [createBlockForm, setCreateBlockForm] = useState(false); + const [iAmFeelingLucky, setIAmFeelingLucky] = useState(false); const [gptAssistantModal, setGptAssistantModal] = useState(false); @@ -164,6 +167,44 @@ export const SinglePageBlock: React.FC = ({ block, projectDetails, index }); }; + const handelAutoGenerateDescription = async () => { + if (!workspaceSlug || !projectId) return; + + setIAmFeelingLucky(true); + + aiService + .createGptTask(workspaceSlug as string, projectId as string, { + prompt: block.name, + task: "Generate a proper description for this issue in context of a project management software.", + }) + .then((res) => { + if (res.response === "") + setToastAlert({ + type: "error", + title: "Error!", + message: + "Block title isn't informative enough to generate the description. Please try with a different title.", + }); + else handleAiAssistance(res.response_html); + }) + .catch((err) => { + if (err.status === 429) + setToastAlert({ + type: "error", + title: "Error!", + message: + "You have reached the maximum number of requests of 50 requests per month per user.", + }); + else + setToastAlert({ + type: "error", + title: "Error!", + message: "Some error occurred. Please try again.", + }); + }) + .finally(() => setIAmFeelingLucky(false)); + }; + const handleAiAssistance = async (response: string) => { if (!workspaceSlug || !projectId) return; @@ -287,6 +328,22 @@ export const SinglePageBlock: React.FC = ({ block, projectDetails, index )} +