feat: remove ExcalidrawEmbeddableElement.validated flag (#7539)

packages/excalidraw/element/Hyperlink.tsx

@@ -39,7 +39,6 @@ import "./Hyperlink.scss";
 import { trackEvent } from "../analytics";
 import { useAppProps, useExcalidrawAppState } from "../components/App";
 import { isEmbeddableElement } from "./typeChecks";
-import { ShapeCache } from "../scene/ShapeCache";
 
 const CONTAINER_WIDTH = 320;
 const SPACE_BOTTOM = 85;
@@ -64,6 +63,7 @@ export const Hyperlink = ({
   setAppState,
   onLinkOpen,
   setToast,
+  updateEmbedValidationStatus,
 }: {
   element: NonDeletedExcalidrawElement;
   setAppState: React.Component<any, AppState>["setState"];
@@ -71,6 +71,10 @@ export const Hyperlink = ({
   setToast: (
     toast: { message: string; closable?: boolean; duration?: number } | null,
   ) => void;
+  updateEmbedValidationStatus: (
+    element: ExcalidrawEmbeddableElement,
+    status: boolean,
+  ) => void;
 }) => {
   const appState = useExcalidrawAppState();
   const appProps = useAppProps();
@@ -98,9 +102,9 @@ export const Hyperlink = ({
       }
       if (!link) {
         mutateElement(element, {
-          validated: false,
           link: null,
         });
+        updateEmbedValidationStatus(element, false);
         return;
       }
 
@@ -110,10 +114,9 @@ export const Hyperlink = ({
         }
         element.link && embeddableLinkCache.set(element.id, element.link);
         mutateElement(element, {
-          validated: false,
           link,
         });
-        ShapeCache.delete(element);
+        updateEmbedValidationStatus(element, false);
       } else {
         const { width, height } = element;
         const embedLink = getEmbedLink(link);
@@ -142,10 +145,9 @@ export const Hyperlink = ({
                     : height,
               }
             : {}),
-          validated: true,
           link,
         });
-        ShapeCache.delete(element);
+        updateEmbedValidationStatus(element, true);
         if (embeddableLinkCache.has(element.id)) {
           embeddableLinkCache.delete(element.id);
         }
@@ -159,6 +161,7 @@ export const Hyperlink = ({
     appProps.validateEmbeddable,
     appState.activeEmbeddable,
     setAppState,
+    updateEmbedValidationStatus,
   ]);
 
   useLayoutEffect(() => {

packages/excalidraw/element/newElement.ts

@@ -136,13 +136,9 @@ export const newElement = (
 export const newEmbeddableElement = (
   opts: {
     type: "embeddable";
-    validated: ExcalidrawEmbeddableElement["validated"];
   } & ElementConstructorOpts,
 ): NonDeleted<ExcalidrawEmbeddableElement> => {
-  return {
-    ..._newElementBase<ExcalidrawEmbeddableElement>("embeddable", opts),
-    validated: opts.validated,
-  };
+  return _newElementBase<ExcalidrawEmbeddableElement>("embeddable", opts);
 };
 
 export const newIframeElement = (

packages/excalidraw/element/types.ts

@@ -88,14 +88,6 @@ export type ExcalidrawEllipseElement = _ExcalidrawElementBase & {
 export type ExcalidrawEmbeddableElement = _ExcalidrawElementBase &
   Readonly<{
     type: "embeddable";
-    /**
-     * indicates whether the embeddable src (url) has been validated for rendering.
-     * null value indicates that the validation is pending. We reset the
-     * value on each restore (or url change) so that we can guarantee
-     * the validation came from a trusted source (the editor). Also because we
-     * may not have access to host-app supplied url validator during restore.
-     */
-    validated: boolean | null;
   }>;
 
 export type ExcalidrawIframeElement = _ExcalidrawElementBase &