Fixed HTMLcontent to only display on art view

js/packages/web/src/components/ArtContent/index.tsx

@@ -162,31 +162,31 @@ const HTMLContent = ({
   uri,
   animationUrl,
   className,
+  preview,
   style,
   files,
+  artView,
 }: {
   uri?: string;
   animationUrl?: string;
   className?: string;
+  preview?: boolean;
   style?: React.CSSProperties;
   files?: (MetadataFile | string)[];
+  artView?: boolean;
 }) => {
+  if (!artView){
+    return <CachedImageContent
+    uri={uri}
+    className={className}
+    preview={preview}
+    style={style}
+  />
+  }
   const htmlURL =
     files && files.length > 0 && typeof files[0] === 'string'
       ? files[0]
       : animationUrl;
-  const { isLoading } = useCachedImage(htmlURL || '', true);
-
-  if (isLoading) {
-    return (
-      <CachedImageContent
-        uri={uri}
-        className={className}
-        preview={false}
-        style={{ width: 300, ...style }}
-      />
-    );
-  }
   return (
     <iframe allow="accelerometer; autoplay; encrypted-media; gyroscope; picture-in-picture"
       sandbox="allow-scripts"
@@ -205,10 +205,10 @@ export const ArtContent = ({
   active,
   allowMeshRender,
   pubkey,
-
   uri,
   animationURL,
   files,
+  artView,
 }: {
   category?: MetadataCategory;
   className?: string;
@@ -223,6 +223,7 @@ export const ArtContent = ({
   uri?: string;
   animationURL?: string;
   files?: (MetadataFile | string)[];
+  artView?: boolean;
 }) => {
   const id = pubkeyToString(pubkey);
 
@@ -276,8 +277,10 @@ export const ArtContent = ({
         uri={uri}
         animationUrl={animationURL}
         className={className}
+        preview={preview}
         style={style}
         files={files}
+        artView={artView}
       />
     ) : (
       <CachedImageContent

js/packages/web/src/views/art/index.tsx

@@ -86,6 +86,7 @@ export const ArtView = () => {
               pubkey={id}
               active={true}
               allowMeshRender={true}
+              artView={true}
             />
           </Col>
           {/* <Divider /> */}