diff --git a/pkgs/webview-ui/app/src/components/noiseThumbnail/index.tsx b/pkgs/webview-ui/app/src/components/noiseThumbnail/index.tsx
index 77c1c4a1c..66c122bea 100644
--- a/pkgs/webview-ui/app/src/components/noiseThumbnail/index.tsx
+++ b/pkgs/webview-ui/app/src/components/noiseThumbnail/index.tsx
@@ -100,13 +100,12 @@ interface RndThumbnailProps {
   height?: number;
 }
 export const RndThumbnail = (props: RndThumbnailProps) => {
-  const { name } = props;
-  const seed = Array.from(name).reduce(
-    (acc, char) => acc + char.charCodeAt(0),
-    0,
-  ); // Seed from name
-  const imageSrc = generatePatternedImage(seed, props.width, props.height);
-  return <img src={imageSrc} alt={name} />;
+  const seed = () =>
+    Array.from(props.name).reduce((acc, char) => acc + char.charCodeAt(0), 0); // Seed from name
+  const imageSrc = () =>
+    generatePatternedImage(seed(), props.width, props.height);
+
+  return <img src={imageSrc()} alt={props.name} />;
 };
 
 export const RndThumbnailShow = () => {