refactor: move web utils to packages

admin/core/components/authentication/auth-banner.tsx

@@ -1,11 +1,11 @@
 import { FC } from "react";
 import { Info, X } from "lucide-react";
 // plane constants
-import { TAuthErrorInfo } from "@plane/constants";
+import { TAdminAuthErrorInfo } from "@plane/constants";
 
 type TAuthBanner = {
-  bannerData: TAuthErrorInfo | undefined;
-  handleBannerData?: (bannerData: TAuthErrorInfo | undefined) => void;
+  bannerData: TAdminAuthErrorInfo | undefined;
+  handleBannerData?: (bannerData: TAdminAuthErrorInfo | undefined) => void;
 };
 
 export const AuthBanner: FC<TAuthBanner> = (props) => {

admin/core/components/login/sign-in-form.tsx

@@ -4,7 +4,7 @@ import { FC, useEffect, useMemo, useState } from "react";
 import { useSearchParams } from "next/navigation";
 import { Eye, EyeOff } from "lucide-react";
 // plane internal packages
-import { API_BASE_URL, EAdminAuthErrorCodes, TAuthErrorInfo } from "@plane/constants";
+import { API_BASE_URL, EAdminAuthErrorCodes, TAdminAuthErrorInfo } from "@plane/constants";
 import { AuthService } from "@plane/services";
 import { Button, Input, Spinner } from "@plane/ui";
 // components
@@ -54,7 +54,7 @@ export const InstanceSignInForm: FC = (props) => {
   const [csrfToken, setCsrfToken] = useState<string | undefined>(undefined);
   const [formData, setFormData] = useState<TFormData>(defaultFromData);
   const [isSubmitting, setIsSubmitting] = useState(false);
-  const [errorInfo, setErrorInfo] = useState<TAuthErrorInfo | undefined>(undefined);
+  const [errorInfo, setErrorInfo] = useState<TAdminAuthErrorInfo | undefined>(undefined);
 
   const handleFormChange = (key: keyof TFormData, value: string | boolean) =>
     setFormData((prev) => ({ ...prev, [key]: value }));

admin/core/lib/auth-helpers.tsx

@@ -3,7 +3,7 @@ import Image from "next/image";
 import Link from "next/link";
 import { KeyRound, Mails } from "lucide-react";
 // plane packages
-import { SUPPORT_EMAIL, EAdminAuthErrorCodes, TAuthErrorInfo } from "@plane/constants";
+import { SUPPORT_EMAIL, EAdminAuthErrorCodes, TAdminAuthErrorInfo } from "@plane/constants";
 import { TGetBaseAuthenticationModeProps, TInstanceAuthenticationModes } from "@plane/types";
 import { resolveGeneralTheme } from "@plane/utils";
 // components
@@ -89,7 +89,7 @@ const errorCodeMessages: {
 export const authErrorHandler = (
   errorCode: EAdminAuthErrorCodes,
   email?: string | undefined
-): TAuthErrorInfo | undefined => {
+): TAdminAuthErrorInfo | undefined => {
   const bannerAlertErrorCodes = [
     EAdminAuthErrorCodes.ADMIN_ALREADY_EXIST,
     EAdminAuthErrorCodes.REQUIRED_ADMIN_EMAIL_PASSWORD_FIRST_NAME,

packages/constants/src/auth.ts

@@ -69,11 +69,12 @@ export enum EErrorAlertType {
 
 export type TAuthErrorInfo = {
   type: EErrorAlertType;
-  code: EAdminAuthErrorCodes;
+  code: EAuthErrorCodes;
   title: string;
-  message: any;
+  message: React.ReactNode;
 };
 
+
 export enum EAdminAuthErrorCodes {
   // Admin
   ADMIN_ALREADY_EXIST = "5150",
@@ -87,6 +88,13 @@ export enum EAdminAuthErrorCodes {
   ADMIN_USER_DEACTIVATED = "5190",
 }
 
+export type TAdminAuthErrorInfo = {
+  type: EErrorAlertType;
+  code: EAdminAuthErrorCodes;
+  title: string;
+  message: React.ReactNode;
+};
+
 export enum EAuthErrorCodes {
   // Global
   INSTANCE_NOT_CONFIGURED = "5000",

packages/constants/src/endpoints.ts

@@ -1,28 +1,26 @@
 export const API_BASE_URL = process.env.NEXT_PUBLIC_API_BASE_URL || "";
-export const API_BASE_PATH = process.env.NEXT_PUBLIC_API_BASE_PATH || "/";
+export const API_BASE_PATH = process.env.NEXT_PUBLIC_API_BASE_PATH || "";
 export const API_URL = encodeURI(`${API_BASE_URL}${API_BASE_PATH}`);
 // God Mode Admin App Base Url
 export const ADMIN_BASE_URL = process.env.NEXT_PUBLIC_ADMIN_BASE_URL || "";
-export const ADMIN_BASE_PATH = process.env.NEXT_PUBLIC_ADMIN_BASE_PATH || "/";
+export const ADMIN_BASE_PATH = process.env.NEXT_PUBLIC_ADMIN_BASE_PATH || "";
 export const GOD_MODE_URL = encodeURI(`${ADMIN_BASE_URL}${ADMIN_BASE_PATH}`);
 // Publish App Base Url
 export const SPACE_BASE_URL = process.env.NEXT_PUBLIC_SPACE_BASE_URL || "";
-export const SPACE_BASE_PATH = process.env.NEXT_PUBLIC_SPACE_BASE_PATH || "/";
+export const SPACE_BASE_PATH = process.env.NEXT_PUBLIC_SPACE_BASE_PATH || "";
 export const SITES_URL = encodeURI(`${SPACE_BASE_URL}${SPACE_BASE_PATH}`);
 // Live App Base Url
 export const LIVE_BASE_URL = process.env.NEXT_PUBLIC_LIVE_BASE_URL || "";
-export const LIVE_BASE_PATH = process.env.NEXT_PUBLIC_LIVE_BASE_PATH || "/";
+export const LIVE_BASE_PATH = process.env.NEXT_PUBLIC_LIVE_BASE_PATH || "";
 export const LIVE_URL = encodeURI(`${LIVE_BASE_URL}${LIVE_BASE_PATH}`);
 // Web App Base Url
 export const WEB_BASE_URL = process.env.NEXT_PUBLIC_WEB_BASE_URL || "";
-export const WEB_BASE_PATH = process.env.NEXT_PUBLIC_WEB_BASE_PATH || "/";
+export const WEB_BASE_PATH = process.env.NEXT_PUBLIC_WEB_BASE_PATH || "";
 export const WEB_URL = encodeURI(`${WEB_BASE_URL}${WEB_BASE_PATH}`);
 // plane website url
-export const WEBSITE_URL =
-  process.env.NEXT_PUBLIC_WEBSITE_URL || "https://plane.so";
+export const WEBSITE_URL = process.env.NEXT_PUBLIC_WEBSITE_URL || "https://plane.so";
 // support email
-export const SUPPORT_EMAIL =
-  process.env.NEXT_PUBLIC_SUPPORT_EMAIL || "support@plane.so";
+export const SUPPORT_EMAIL = process.env.NEXT_PUBLIC_SUPPORT_EMAIL || "support@plane.so";
 // marketing links
 export const MARKETING_PRICING_PAGE_LINK = "https://plane.so/pricing";
 export const MARKETING_CONTACT_US_PAGE_LINK = "https://plane.so/contact";

web/ce/constants/estimates.ts → packages/constants/src/estimates.ts

@@ -1,4 +1,4 @@
-// types
+// plane imports
 import { TEstimateSystems } from "@plane/types";
 
 export const MAX_ESTIMATE_POINT_INPUT_LENGTH = 20;

packages/constants/src/index.ts

@@ -5,6 +5,7 @@ export * from "./endpoints";
 export * from "./file";
 export * from "./filter";
 export * from "./graph";
+export * from "./icons";
 export * from "./instance";
 export * from "./issue";
 export * from "./metadata";
@@ -21,7 +22,7 @@ export * from "./module";
 export * from "./project";
 export * from "./views";
 export * from "./themes";
-export * from "./inbox";
+export * from "./intake";
 export * from "./profile";
 export * from "./workspace-drafts";
 export * from "./label";
@@ -33,4 +34,5 @@ export * from "./emoji";
 export * from "./subscription";
 export * from "./settings";
 export * from "./icon";
+export * from "./estimates";
 export * from "./analytics";

packages/constants/src/inbox.ts → packages/constants/src/intake.ts

@@ -95,3 +95,32 @@ export const INBOX_ISSUE_SORT_BY_OPTIONS = [
     i18n_label: "common.sort.desc",
   },
 ];
+
+export enum EPastDurationFilters {
+  TODAY = "today",
+  YESTERDAY = "yesterday",
+  LAST_7_DAYS = "last_7_days",
+  LAST_30_DAYS = "last_30_days",
+}
+
+export const PAST_DURATION_FILTER_OPTIONS: {
+  name: string;
+  value: string;
+}[] = [
+  {
+    name: "Today",
+    value: EPastDurationFilters.TODAY,
+  },
+  {
+    name: "Yesterday",
+    value: EPastDurationFilters.YESTERDAY,
+  },
+  {
+    name: "Last 7 days",
+    value: EPastDurationFilters.LAST_7_DAYS,
+  },
+  {
+    name: "Last 30 days",
+    value: EPastDurationFilters.LAST_30_DAYS,
+  },
+];

packages/constants/src/state.ts

@@ -1,4 +1,5 @@
 "use client"
+
 export type TStateGroups = "backlog" | "unstarted" | "started" | "completed" | "cancelled";
 
 export type TDraggableData = {

packages/editor/src/core/helpers/parser.ts

@@ -0,0 +1,89 @@
+// plane imports
+import { TDocumentPayload, TDuplicateAssetData, TDuplicateAssetResponse } from "@plane/types";
+import { TEditorAssetType } from "@plane/types/src/enums";
+// local imports
+import { convertHTMLDocumentToAllFormats } from "./yjs-utils";
+
+/**
+ * @description function to extract all image assets from HTML content
+ * @param htmlContent
+ * @returns {string[]} array of image asset sources
+ */
+export const extractImageAssetsFromHTMLContent = (htmlContent: string): string[] => {
+  // create a DOM parser
+  const parser = new DOMParser();
+  // parse the HTML string into a DOM document
+  const doc = parser.parseFromString(htmlContent, "text/html");
+  // get all image components
+  const imageComponents = doc.querySelectorAll("image-component");
+  // collect all unique image sources
+  const imageSources = new Set<string>();
+  // extract sources from image components
+  imageComponents.forEach((component) => {
+    const src = component.getAttribute("src");
+    if (src) imageSources.add(src);
+  });
+  return Array.from(imageSources);
+};
+
+/**
+ * @description function to replace image assets in HTML content with new IDs
+ * @param props
+ * @returns {string} HTML content with replaced image assets
+ */
+export const replaceImageAssetsInHTMLContent = (props: {
+  htmlContent: string;
+  assetMap: Record<string, string>;
+}): string => {
+  const { htmlContent, assetMap } = props;
+  // create a DOM parser
+  const parser = new DOMParser();
+  // parse the HTML string into a DOM document
+  const doc = parser.parseFromString(htmlContent, "text/html");
+  // replace sources in image components
+  const imageComponents = doc.querySelectorAll("image-component");
+  imageComponents.forEach((component) => {
+    const oldSrc = component.getAttribute("src");
+    if (oldSrc && assetMap[oldSrc]) {
+      component.setAttribute("src", assetMap[oldSrc]);
+    }
+  });
+  // serialize the document back into a string
+  return doc.body.innerHTML;
+};
+
+export const getEditorContentWithReplacedImageAssets = async (props: {
+  descriptionHTML: string;
+  entityId: string;
+  entityType: TEditorAssetType;
+  projectId: string | undefined;
+  variant: "rich" | "document";
+  duplicateAssetService: (params: TDuplicateAssetData) => Promise<TDuplicateAssetResponse>;
+}): Promise<TDocumentPayload> => {
+  const { descriptionHTML, entityId, entityType, projectId, variant, duplicateAssetService } = props;
+  let replacedDescription = descriptionHTML;
+  // step 1: extract image assets from the description
+  const imageAssets = extractImageAssetsFromHTMLContent(descriptionHTML);
+  if (imageAssets.length !== 0) {
+    // step 2: duplicate the image assets
+    const duplicateAssetsResponse = await duplicateAssetService({
+      entity_id: entityId,
+      entity_type: entityType,
+      project_id: projectId,
+      asset_ids: imageAssets,
+    });
+    if (Object.keys(duplicateAssetsResponse ?? {}).length > 0) {
+      // step 3: replace the image assets in the description
+      replacedDescription = replaceImageAssetsInHTMLContent({
+        htmlContent: descriptionHTML,
+        assetMap: duplicateAssetsResponse,
+      });
+    }
+  }
+  // step 4: convert the description to the document payload
+  const documentPayload = convertHTMLDocumentToAllFormats({
+    document_html: replacedDescription,
+    variant,
+  });
+  return documentPayload;
+};

packages/editor/src/core/helpers/yjs-utils.ts

@@ -3,6 +3,7 @@ import { generateHTML, generateJSON } from "@tiptap/html";
 import { prosemirrorJSONToYDoc, yXmlFragmentToProseMirrorRootNode } from "y-prosemirror";
 import * as Y from "yjs";
 // extensions
+import { TDocumentPayload } from "@plane/types";
 import {
   CoreEditorExtensionsWithoutProps,
   DocumentEditorExtensionsWithoutProps,
@@ -140,3 +141,50 @@ export const getAllDocumentFormatsFromDocumentEditorBinaryData = (
     contentHTML,
   };
 };
+
+type TConvertHTMLDocumentToAllFormatsArgs = {
+  document_html: string;
+  variant: "rich" | "document";
+};
+
+/**
+ * @description Converts HTML content to all supported document formats (JSON, HTML, and binary)
+ * @param {TConvertHTMLDocumentToAllFormatsArgs} args - Arguments containing HTML content and variant type
+ * @param {string} args.document_html - The HTML content to convert
+ * @param {"rich" | "document"} args.variant - The type of editor variant to use for conversion
+ * @returns {TDocumentPayload} Object containing the document in all supported formats
+ * @throws {Error} If an invalid variant is provided
+ */
+export const convertHTMLDocumentToAllFormats = (args: TConvertHTMLDocumentToAllFormatsArgs): TDocumentPayload => {
+  const { document_html, variant } = args;
+
+  let allFormats: TDocumentPayload;
+
+  if (variant === "rich") {
+    // Convert HTML to binary format for rich text editor
+    const contentBinary = getBinaryDataFromRichTextEditorHTMLString(document_html);
+    // Generate all document formats from the binary data
+    const { contentBinaryEncoded, contentHTML, contentJSON } =
+      getAllDocumentFormatsFromRichTextEditorBinaryData(contentBinary);
+    allFormats = {
+      description: contentJSON,
+      description_html: contentHTML,
+      description_binary: contentBinaryEncoded,
+    };
+  } else if (variant === "document") {
+    // Convert HTML to binary format for document editor
+    const contentBinary = getBinaryDataFromDocumentEditorHTMLString(document_html);
+    // Generate all document formats from the binary data
+    const { contentBinaryEncoded, contentHTML, contentJSON } =
+      getAllDocumentFormatsFromDocumentEditorBinaryData(contentBinary);
+    allFormats = {
+      description: contentJSON,
+      description_html: contentHTML,
+      description_binary: contentBinaryEncoded,
+    };
+  } else {
+    throw new Error(`Invalid variant provided: ${variant}`);
+  }
+
+  return allFormats;
+};

packages/editor/src/core/plugins/drag-handle.ts

@@ -1,7 +1,6 @@
 import { Fragment, Slice, Node, Schema } from "@tiptap/pm/model";
 import { NodeSelection } from "@tiptap/pm/state";
-// @ts-expect-error __serializeForClipboard's is not exported
-import { __serializeForClipboard, EditorView } from "@tiptap/pm/view";
+import { EditorView } from "@tiptap/pm/view";
 // constants
 import { CORE_EXTENSIONS } from "@/constants/extension";
 // extensions
@@ -417,7 +416,7 @@ const handleNodeSelection = (
     }
 
     const slice = view.state.selection.content();
-    const { dom, text } = __serializeForClipboard(view, slice);
+    const { dom, text } = view.serializeForClipboard(slice);
 
     if (event instanceof DragEvent && event.dataTransfer) {
       event.dataTransfer.clearData();