Update external resources usage (#384)

* update externalResources * Update CHANGELOG.md --------- Co-authored-by: Mikhail Volkov <[email protected]>
VolkovLabs · Jan 9, 2025 · f836225 · f836225
1 parent e437cf2
commit f836225
Show file tree

Hide file tree

Showing 3 changed files with 11 additions and 3 deletions.
diff --git a/CHANGELOG.md b/CHANGELOG.md
@@ -5,6 +5,7 @@
 ### Features / Enhancements
 
 - Added context.grafana.refresh (#387)
+- Updated external resources usage (#384)
 
 ## 5.6.0 (2024-12-15)
 

diff --git a/package-lock.json b/package-lock.json
diff --git a/src/components/TextPanel/TextPanel.tsx b/src/components/TextPanel/TextPanel.tsx
@@ -85,11 +85,18 @@ export const TextPanel: React.FC<Props> = ({
     [data.series, frameIndex, options.renderMode]
   );
 
+  /**
+   * External Resources; use memo to prevent endless call to resources
+   */
+  const externalResources = useMemo(() => {
+    return options.externalStyles.map((resource) => ({ ...resource, url: replaceVariables(resource.url) }));
+  }, [options.externalStyles, replaceVariables]);
+
   /**
    * External Styles
    */
   useExternalResources({
-    items: options.externalStyles.map((resource) => ({ ...resource, url: replaceVariables(resource.url) })),
+    items: externalResources,
     type: ResourceType.STYLES,
   });