', "")
// Remove the closing div tag
.slice(0, -6)
)
diff --git a/src/components/Header/ContactModal/ContactVerificationModal.tsx b/src/components/Header/ContactModal/ContactVerificationModal.tsx
index b0676fc74..fb4345f28 100644
--- a/src/components/Header/ContactModal/ContactVerificationModal.tsx
+++ b/src/components/Header/ContactModal/ContactVerificationModal.tsx
@@ -43,7 +43,12 @@ export const ContactVerificationModal = ({
const [mobile, setMobile] = useState
("")
const handleSendOtp = async ({ mobile: mobileInput }: ContactProps) => {
- await sendContactOtp({ mobile: mobileInput }) // Non-2xx responses will be caught by axios and thrown as error
+ try {
+ await sendContactOtp({ mobile: mobileInput }) // Non-2xx responses will be caught by axios and thrown as error
+ } catch (e) {
+ // Needed for react-hook-form to reset isSubmitting
+ return
+ }
successToast({
id: "send-otp-success",
description: `OTP sent to ${mobileInput}`,
@@ -52,7 +57,12 @@ export const ContactVerificationModal = ({
}
const handleVerifyOtp = async ({ otp }: ContactOtpProps) => {
- await verifyContactOtp({ mobile, otp })
+ try {
+ await verifyContactOtp({ mobile, otp })
+ } catch (e) {
+ // Needed for react-hook-form to reset isSubmitting
+ return
+ }
onClose()
successToast({
id: "verify-otp-success",
diff --git a/src/components/MediaCreationModal/MediaCreationModal.tsx b/src/components/MediaCreationModal/MediaCreationModal.tsx
index a5e0c7fba..0eaa97df8 100644
--- a/src/components/MediaCreationModal/MediaCreationModal.tsx
+++ b/src/components/MediaCreationModal/MediaCreationModal.tsx
@@ -21,13 +21,12 @@ import _ from "lodash"
import { useEffect, useState } from "react"
import { FileRejection } from "react-dropzone"
import { BiCheckCircle, BiSolidErrorCircle } from "react-icons/bi"
-import { useParams } from "react-router-dom"
import { Attachment } from "components/Attachment"
import { useCreateMultipleMedia } from "hooks/mediaHooks/useCreateMultipleMedia"
-import { getMediaLabels } from "utils/media"
+import { getMediaDirectoryName, getMediaLabels } from "utils/media"
import { MediaDirectoryParams } from "types/folders"
import { MediaFolderTypes } from "types/media"
@@ -280,12 +279,6 @@ const MediaUploadFailedDropzone = ({
)
}
-interface MediaCreationModalProps {
- onClose: () => void
- onProceed: () => void
- variant: MediaFolderTypes
-}
-
interface MediaCreationRouteParams
extends Omit<
MediaDirectoryParams,
@@ -295,14 +288,25 @@ interface MediaCreationRouteParams
mediaDirectoryName?: string
}
+interface MediaCreationModalProps {
+ params: MediaCreationRouteParams
+ onClose: () => void
+ onProceed: () => void
+ variant: MediaFolderTypes
+}
+
export const MediaCreationModal = ({
+ params,
onClose,
onProceed,
variant,
}: MediaCreationModalProps) => {
const { onClose: onModalClose } = useDisclosure()
- const params = useParams()
- const { siteName, mediaDirectoryName } = params
+ const { siteName, mediaDirectoryName: rawMediaDirectoryName } = params
+ const mediaDirectoryName = `${getMediaDirectoryName(
+ rawMediaDirectoryName || "",
+ { splitOn: "/" }
+ )}`
const {
mutateAsync: uploadFiles,
diff --git a/src/components/media/MediaModal.jsx b/src/components/media/MediaModal.jsx
index a922837dd..0bbf6f889 100644
--- a/src/components/media/MediaModal.jsx
+++ b/src/components/media/MediaModal.jsx
@@ -9,7 +9,7 @@ import { MediaAltText } from "components/media/MediaAltText"
import MediasSelectModal from "components/media/MediasSelectModal"
import { MediaCreationModal } from "components/MediaCreationModal/MediaCreationModal"
-import { getMediaDirectoryName } from "utils"
+import { getMediaDirectoryName } from "utils/media"
const MediaModal = ({ onClose, onProceed, type, showAltTextModal = false }) => {
const {
diff --git a/src/components/media/MediasSelectModal.jsx b/src/components/media/MediasSelectModal.jsx
index b3d3cf57c..cc98c1158 100644
--- a/src/components/media/MediasSelectModal.jsx
+++ b/src/components/media/MediasSelectModal.jsx
@@ -41,9 +41,9 @@ import { FilePreviewCard, MediaDirectoryCard } from "layouts/Media/components"
import mediaStyles from "styles/isomer-cms/pages/Media.module.scss"
-import { getMediaLabels } from "utils/media"
+import { getMediaDirectoryName, getMediaLabels } from "utils/media"
-import { deslugifyDirectory, getMediaDirectoryName } from "utils"
+import { deslugifyDirectory } from "utils"
const filterMediaByFileName = (medias, filterTerm) =>
medias.filter((media) =>
@@ -135,9 +135,10 @@ const MediasSelectModal = ({
size="6xl"
scrollBehavior="inside"
closeOnOverlayClick={false}
+ isCentered
>
-
+
diff --git a/src/hooks/directoryHooks/useDeleteDirectoryHook.jsx b/src/hooks/directoryHooks/useDeleteDirectoryHook.jsx
index 9b52d7bdc..1d9b7504e 100644
--- a/src/hooks/directoryHooks/useDeleteDirectoryHook.jsx
+++ b/src/hooks/directoryHooks/useDeleteDirectoryHook.jsx
@@ -11,9 +11,10 @@ import {
import { ServicesContext } from "contexts/ServicesContext"
+import { getMediaDirectoryName } from "utils/media"
import { useSuccessToast, useErrorToast } from "utils/toasts"
-import { DEFAULT_RETRY_MSG, getMediaDirectoryName } from "utils"
+import { DEFAULT_RETRY_MSG } from "utils"
// eslint-disable-next-line import/prefer-default-export
export function useDeleteDirectoryHook(params, queryParams) {
diff --git a/src/hooks/directoryHooks/useUpdateDirectoryHook.jsx b/src/hooks/directoryHooks/useUpdateDirectoryHook.jsx
index 619c2d741..1dcad0dad 100644
--- a/src/hooks/directoryHooks/useUpdateDirectoryHook.jsx
+++ b/src/hooks/directoryHooks/useUpdateDirectoryHook.jsx
@@ -10,9 +10,10 @@ import {
import { ServicesContext } from "contexts/ServicesContext"
+import { getMediaDirectoryName } from "utils/media"
import { useSuccessToast, useErrorToast } from "utils/toasts"
-import { DEFAULT_RETRY_MSG, getMediaDirectoryName } from "utils"
+import { DEFAULT_RETRY_MSG } from "utils"
import { extractUpdateDirectoryInfo } from "./utils"
diff --git a/src/hooks/directoryHooks/utils.ts b/src/hooks/directoryHooks/utils.ts
index d305d8998..0f98900e1 100644
--- a/src/hooks/directoryHooks/utils.ts
+++ b/src/hooks/directoryHooks/utils.ts
@@ -1,5 +1,6 @@
+import { getMediaDirectoryName } from "utils/media"
+
import { DirectoryInfoProps, DirectoryInfoReturn } from "types/directory"
-import { getMediaDirectoryName } from "utils"
export function extractCreateDirectoryInfo({
data,
diff --git a/src/layouts/EditPage/EditPage.tsx b/src/layouts/EditPage/EditPage.tsx
index 2034cf659..c89785a09 100644
--- a/src/layouts/EditPage/EditPage.tsx
+++ b/src/layouts/EditPage/EditPage.tsx
@@ -35,6 +35,7 @@ import {
FormSGIframe,
Iframe,
IsomerImage,
+ Instagram,
} from "layouts/components/Editor/extensions"
import { isEmbedCodeValid } from "utils/allowedHTML"
@@ -78,6 +79,7 @@ export const EditPage = () => {
FormSG,
FormSGDiv,
FormSGIframe,
+ Instagram,
Markdown,
BubbleMenu.configure({
pluginKey: "linkBubble",
@@ -85,6 +87,9 @@ export const EditPage = () => {
BubbleMenu.configure({
pluginKey: "tableBubble",
}),
+ BubbleMenu.configure({
+ pluginKey: "imageBubble",
+ }),
Table.configure({
resizable: false,
}),
diff --git a/src/layouts/Login/LoginPage.tsx b/src/layouts/Login/LoginPage.tsx
index 0e7ed1b57..0fcd8b3af 100644
--- a/src/layouts/Login/LoginPage.tsx
+++ b/src/layouts/Login/LoginPage.tsx
@@ -105,7 +105,12 @@ const LoginContent = (): JSX.Element => {
const handleSendOtp = async ({ email: emailInput }: LoginProps) => {
const trimmedEmail = emailInput.trim()
- await sendLoginOtp({ email: trimmedEmail }) // Non-2xx responses will be caught by axios and thrown as error
+ try {
+ await sendLoginOtp({ email: trimmedEmail }) // Non-2xx responses will be caught by axios and thrown as error
+ } catch (e) {
+ // Needed for react-hook-form to reset isSubmitting
+ return
+ }
successToast({
id: "send-otp-success",
description: `OTP sent to ${trimmedEmail}`,
@@ -114,7 +119,12 @@ const LoginContent = (): JSX.Element => {
}
const handleVerifyOtp = async ({ otp }: OtpProps) => {
- await verifyLoginOtp({ email, otp })
+ try {
+ await verifyLoginOtp({ email, otp })
+ } catch (e) {
+ // Needed for react-hook-form to reset isSubmitting
+ return
+ }
history.replace("/sites")
}
diff --git a/src/layouts/ReviewRequest/components/Comments/SendCommentForm.tsx b/src/layouts/ReviewRequest/components/Comments/SendCommentForm.tsx
index 97799196c..29a166b99 100644
--- a/src/layouts/ReviewRequest/components/Comments/SendCommentForm.tsx
+++ b/src/layouts/ReviewRequest/components/Comments/SendCommentForm.tsx
@@ -39,6 +39,7 @@ export const SendCommentForm = ({
const {
mutateAsync: updateNotifications,
error: updateNotificationsError,
+ isLoading: isUpddatingComments,
} = useUpdateComments()
const queryClient = useQueryClient()
@@ -62,7 +63,7 @@ export const SendCommentForm = ({