chore(deps): bump @tiptap/react from 2.27.2 to 3.23.6 in /sites/partners (#6322)

Author: dependabot[bot]

sites/partners/package.json

@@ -34,12 +34,10 @@
     "@bloom-housing/ui-seeds": "3.4.1",
     "@heroicons/react": "^2.2.0",
     "@mapbox/mapbox-sdk": "^0.13.0",
-    "@tiptap/core": "^2.24.0",
-    "@tiptap/extension-character-count": "^2.24.0",
-    "@tiptap/extension-link": "^2.24.0",
-    "@tiptap/pm": "^2.24.0",
-    "@tiptap/react": "^2.24.0",
-    "@tiptap/starter-kit": "^2.24.0",
+    "@tiptap/core": "^3.23.6",
+    "@tiptap/extension-character-count": "^3.23.6",
+    "@tiptap/react": "^3.23.6",
+    "@tiptap/starter-kit": "^3.23.6",
     "ag-grid-community": "^26.0.0",
     "autoprefixer": "^10.3.4",
     "axios": "^1.15.0",

sites/partners/src/components/listings/PaperListingForm/index.tsx

@@ -200,14 +200,14 @@ const ListingForm = ({
   const whatToExpectEditor = useEditor({
     extensions: [...EditorExtensions, CharacterCountExtension.configure()],
     content: listing?.whatToExpect || selectedJurisdictionData?.whatToExpect,
-    immediatelyRender: true,
+    immediatelyRender: false,
   })
 
   const whatToExpectAdditionalDetailsEditor = useEditor({
     extensions: [...EditorExtensions, CharacterCountExtension.configure()],
     content:
       listing?.whatToExpectAdditionalText || selectedJurisdictionData?.whatToExpectAdditionalText,
-    immediatelyRender: true,
+    immediatelyRender: false,
   })
 
   const { data: properties, loading: propertiesLoading } = usePropertiesList({
@@ -230,26 +230,31 @@ const ListingForm = ({
         marketingTypeChoice === MarketingTypeEnum.comingSoon &&
         !!selectedJurisdictionData.whatToExpectUnderConstruction
       ) {
-        whatToExpectEditor.commands.setContent(
+        whatToExpectEditor?.commands.setContent(
           selectedJurisdictionData.whatToExpectUnderConstruction
         )
-        whatToExpectAdditionalDetailsEditor.commands.clearContent()
+        whatToExpectAdditionalDetailsEditor?.commands.clearContent()
         return
       }
 
       if (!editMode) {
         if (!whatToExpectEditor?.storage.characterCount.characters()) {
-          whatToExpectEditor.commands.setContent(selectedJurisdictionData.whatToExpect)
+          whatToExpectEditor?.commands.setContent(selectedJurisdictionData.whatToExpect)
         }
         if (!whatToExpectAdditionalDetailsEditor?.storage.characterCount.characters()) {
-          whatToExpectAdditionalDetailsEditor.commands.setContent(
+          whatToExpectAdditionalDetailsEditor?.commands.setContent(
             selectedJurisdictionData.whatToExpectAdditionalText
           )
         }
       }
     }
     //eslint-disable-next-line
-  }, [selectedJurisdictionData, marketingTypeChoice])
+  }, [
+    selectedJurisdictionData,
+    marketingTypeChoice,
+    whatToExpectEditor,
+    whatToExpectAdditionalDetailsEditor,
+  ])
 
   const enableUnitGroups = doJurisdictionsHaveFeatureFlagOn(
     FeatureFlagEnum.enableUnitGroups,
@@ -369,12 +374,10 @@ const ListingForm = ({
     async (formData: FormListing, continueEditing: boolean) => {
       if (!loading) {
         try {
-          setLoading(true)
           clearErrors()
           const successful = await formMethods.trigger()
 
           if (whatToExpectEditor?.storage.characterCount.characters() > CHARACTER_LIMIT) {
-            setLoading(false)
             setAlert("form")
             return
           }
@@ -385,7 +388,6 @@ const ListingForm = ({
             whatToExpectAdditionalDetailsEditor?.storage.characterCount.characters() >
             CHARACTER_LIMIT
           ) {
-            setLoading(false)
             setAlert("form")
             return
           }
@@ -431,6 +433,8 @@ const ListingForm = ({
             formData.scheduledPublishAt = null
           }
 
+          setLoading(true)
+
           if (successful) {
             const dataPipeline = new ListingDataPipeline(formData, {
               preferences: disableListingPreferences ? [] : preferences,
@@ -547,6 +551,8 @@ const ListingForm = ({
       addToast,
       enableUnitGroups,
       enableAutopublish,
+      whatToExpectEditor,
+      whatToExpectAdditionalDetailsEditor,
     ]
   )
   return (

sites/partners/src/components/listings/PaperListingForm/sections/ApplicationTypes.tsx

@@ -574,11 +574,6 @@ const ApplicationTypes = ({
                 name="referralSummary"
                 id="referralSummary"
                 maxLength={500}
-                defaultValue={
-                  methods?.referral?.externalReference
-                    ? methods.referral.externalReference
-                    : defaultReferralText
-                }
                 inputProps={{
                   value: methods?.referral
                     ? methods?.referral?.externalReference

sites/partners/src/components/shared/TextEditor.tsx

@@ -2,7 +2,7 @@ import React, { useCallback, useState } from "react"
 import Markdown from "markdown-to-jsx"
 import { EditorContent, Editor } from "@tiptap/react"
 import { StarterKit } from "@tiptap/starter-kit"
-import { Link as LinkExtension } from "@tiptap/extension-link"
+import { CharacterCount } from "@tiptap/extension-character-count"
 import BoldIcon from "@heroicons/react/16/solid/BoldIcon"
 import BulletListIcon from "@heroicons/react/16/solid/ListBulletIcon"
 import OrderedListIcon from "@heroicons/react/16/solid/NumberedListIcon"
@@ -14,48 +14,49 @@ import { t } from "@bloom-housing/ui-components"
 import styles from "./TextEditor.module.scss"
 
 export const EditorExtensions = [
+  CharacterCount,
   StarterKit.configure({
     heading: false,
     code: false,
     blockquote: false,
     codeBlock: false,
     italic: false,
-  }),
-  LinkExtension.configure({
-    openOnClick: true,
-    autolink: true,
-    defaultProtocol: "https",
-    protocols: [
-      "http",
-      "https",
-      { scheme: "mailto", optionalSlashes: true },
-      { scheme: "tel", optionalSlashes: true },
-    ],
-    isAllowedUri: (url, ctx) => {
-      try {
-        // construct URL
-        const parsedUrl = url.includes(":")
-          ? new URL(url)
-          : new URL(`${ctx.defaultProtocol}://${url}`)
+    link: {
+      openOnClick: true,
+      autolink: true,
+      defaultProtocol: "https",
+      protocols: [
+        "http",
+        "https",
+        { scheme: "mailto", optionalSlashes: true },
+        { scheme: "tel", optionalSlashes: true },
+      ],
+      isAllowedUri: (url, ctx) => {
+        try {
+          // construct URL
+          const parsedUrl = url.includes(":")
+            ? new URL(url)
+            : new URL(`${ctx.defaultProtocol}://${url}`)
 
-        // use default validation
-        if (!ctx.defaultValidate(parsedUrl.href)) {
-          return false
-        }
+          // use default validation
+          if (!ctx.defaultValidate(parsedUrl.href)) {
+            return false
+          }
+
+          const protocol = parsedUrl.protocol.replace(":", "")
 
-        const protocol = parsedUrl.protocol.replace(":", "")
+          // only allow protocols specified in ctx.protocols
+          const allowedProtocols = ctx.protocols.map((p) => (typeof p === "string" ? p : p.scheme))
 
-        // only allow protocols specified in ctx.protocols
-        const allowedProtocols = ctx.protocols.map((p) => (typeof p === "string" ? p : p.scheme))
+          if (!allowedProtocols.includes(protocol)) {
+            return false
+          }
 
-        if (!allowedProtocols.includes(protocol)) {
+          return true
+        } catch {
           return false
         }
-
-        return true
-      } catch {
-        return false
-      }
+      },
     },
   }),
 ]
@@ -77,15 +78,18 @@ const MenuBar = ({ editor }) => {
       return
     }
 
+    // Prepend https:// if the user typed a bare URL with no protocol.
+    const href = /^[a-z][a-z0-9+.-]*:/i.test(url) ? url : `https://${url}`
+
     // update link
     try {
-      editor?.chain().focus().extendMarkRange("link").setLink({ href: url }).run()
+      editor?.chain().focus().extendMarkRange("link").setLink({ href }).run()
     } catch (e) {
       alert(e.message)
     }
   }, [editor])
 
-  if (!editor) {
+  if (!editor || editor.isDestroyed) {
     return null
   }
 
@@ -245,24 +249,26 @@ export const TextEditor = ({
   label,
 }: TextEditorProps) => {
   const [errorState, setErrorState] = useState(error)
+  const [characterCount, setCharacterCount] = useState(
+    () => editor?.storage?.characterCount?.characters() ?? 0
+  )
 
   const labelId = `${editorId}Label`
 
-  if (!editor) {
+  if (!editor || editor.isDestroyed) {
     return null
   }
 
   editor.on("update", () => {
     if (errorState) setErrorState(false)
+    setCharacterCount(editor?.storage?.characterCount?.characters() ?? 0)
   })
 
   editor.on("create", () => {
     editor?.view.setProps({
       attributes: { "aria-labelledby": labelId, role: "textbox" },
     })
   })
-
-  const characterCount = editor?.storage?.characterCount?.characters()
   const overLimit = characterCount > characterLimit
 
   return (