fix(frontend): origin address info leak

Currently, frontend loads device images from third-party domain
https://www.zigbee2mqtt.io/, leaking potentially sensitive information,
as the address might be externally routable IPv6 address, etc.

We need to remove crossorigin="anonymous" to stop sending Origin header,
and add referer="no-referer" referrer policy to stop sending Origin
header. Note that as <image> elements don't support refererpolicy
attribute, we have to add document-wide policy. Which is a good idea,
as it also prevents leaks when following links.

Author: WGH-

src/components/device-image/DeviceImage.tsx

@@ -21,7 +21,7 @@ export function DeviceImage(props: Readonly<DeviceImageProps>) {
 
     if (type === 'svg') {
         return (
-            <Suspense fallback={<image crossOrigin={'anonymous'} {...rest} href={genericDevice} />}>
+            <Suspense fallback={<image {...rest} href={genericDevice} />}>
                 <ErrorBoundary>
                     <LazyImage type="svg" device={device} {...rest} />
                 </ErrorBoundary>

src/components/device-image/LazyImage.tsx

@@ -15,7 +15,7 @@ export function LazyImage(props: Readonly<LazyImageProps>) {
         srcList: AVAILABLE_GENERATORS.map((fn) => fn(device)).filter(Boolean) as string[],
     });
     if (type === 'svg') {
-        return <image crossOrigin={'anonymous'} {...rest} href={src} />;
+        return <image {...rest} href={src} />;
     }
-    return <img alt="" crossOrigin={'anonymous'} src={src} />;
+    return <img alt="" src={src} />;
 }

src/components/settings-page/index.tsx

@@ -66,7 +66,6 @@ const rows = [
         <div className="col">
             <a target="_blank" rel="noopener noreferrer" href="https://www.buymeacoffee.com/nurikk">
                 <img
-                    crossOrigin="anonymous"
                     src="https://img.buymeacoffee.com/button-api/?text=Thanks for frontend&emoji=🍺&slug=nurikk&button_colour=FFDD00&font_colour=000000&font_family=Arial&outline_colour=000000&coffee_colour=ffffff"
                 />
             </a>
@@ -76,7 +75,6 @@ const rows = [
         <div className="col">
             <a target="_blank" rel="noopener noreferrer" href="https://www.buymeacoffee.com/koenkk">
                 <img
-                    crossOrigin="anonymous"
                     src="https://img.buymeacoffee.com/button-api/?text=Thanks for zigbee2mqtt&emoji=☕&slug=koenkk&button_colour=FFDD00&font_colour=000000&font_family=Arial&outline_colour=000000&coffee_colour=ffffff"
                 />
             </a>

src/index.html

@@ -5,6 +5,7 @@
     <meta charset="UTF-8">
     <meta name="viewport" content="width=device-width, initial-scale=1">
     <meta name="robots" content="noindex">
+    <meta name="referrer" content="no-referrer">
 
     <title>Zigbee2MQTT</title>