wip

js/desktop/src/features/particles/particle-list-view.tsx

@@ -1,4 +1,4 @@
-import { useMemo, useRef, useEffect, useCallback, memo } from "react";
+import { useMemo, useRef, useEffect, useCallback, memo, createElement } from "react";
 import { useNavigate } from "react-router-dom";
 import {
   Radio,
@@ -186,7 +186,9 @@ const StreamRow = memo(function StreamRow({
     ? getMessagePreview(latestChild)
     : particle.properties.name;
 
-  const TypeIcon = latestChild ? getParticleTypeIcon(latestChild) : Radio;
+  // Rendered via createElement below: a call-result used directly as a JSX tag
+  // is flagged as a dynamically-created component.
+  const typeIcon = latestChild ? getParticleTypeIcon(latestChild) : Radio;
 
   const videoThumbObjectId =
     latestChild &&
@@ -254,12 +256,12 @@ const StreamRow = memo(function StreamRow({
           </div>
         </div>
         <div className="flex items-center gap-1">
-          <TypeIcon
-            className={cn(
+          {createElement(typeIcon, {
+            className: cn(
               "size-3.5 shrink-0",
               isUnseen ? "text-foreground" : "text-muted-foreground",
-            )}
-          />
+            ),
+          })}
           <Small
             className={cn(
               "truncate",