diff --git a/src/components/inputs/editor/Editor.tsx b/src/components/inputs/editor/Editor.tsx index b6cea48f..8e7949f3 100644 --- a/src/components/inputs/editor/Editor.tsx +++ b/src/components/inputs/editor/Editor.tsx @@ -103,6 +103,8 @@ export default function Editor(props: Props) { label: mention, }, }); + const transaction = editor.state.tr.insertText(" "); + editor.view.dispatch(transaction); } }, }); diff --git a/src/components/inputs/editor/LinkCard.tsx b/src/components/inputs/editor/LinkCard.tsx index b2e42a49..172a58c8 100644 --- a/src/components/inputs/editor/LinkCard.tsx +++ b/src/components/inputs/editor/LinkCard.tsx @@ -1,6 +1,12 @@ import Image from "next/image"; import useGetLinkMeta from "@/lib/hooks/useGetLinkMeta"; -import { Dispatch, SetStateAction, useEffect, useState } from "react"; +import { + Dispatch, + SetStateAction, + useCallback, + useEffect, + useState, +} from "react"; import { getHostname } from "@/lib/utils/text"; import Button from "@/components/actions/button/Button"; import Alert from "@/components/feedback/alert/Alert"; @@ -17,6 +23,8 @@ export default function LinkCard(props: Props) { const { status, data, error, isLoading, isFetching } = useGetLinkMeta(link); const [showImage, setShowIamge] = useState(true); + const onErrorImage = useCallback(() => setShowIamge(false), []); + useEffect(() => { if (data) { onAddLinkCard(data); @@ -37,7 +45,25 @@ export default function LinkCard(props: Props) { if (error) { return ( - +
+
+ + Could not get info about this link + + + {link} + +
+ +
); } @@ -57,7 +83,7 @@ export default function LinkCard(props: Props) { Link image setShowIamge(false)} + onError={onErrorImage} fill className="border-skin-base rounded-t-2xl border-b object-cover" />