add support for custom and other remote icons

public/icons

@@ -0,0 +1 @@
+../config/icons

src/components/services/item.jsx

@@ -1,30 +1,41 @@
 import Image from "next/future/image";
-import { useState } from "react";
+import { Disclosure } from "@headlessui/react";
-import { Disclosure, Transition } from "@headlessui/react";
 
 import Status from "./status";
 import Widget from "./widget";
 import Docker from "./widgets/service/docker";
 
+function resolveIcon(icon) {
+  if (icon.startsWith("http")) {
+    return `/api/proxy?url=${encodeURIComponent(icon)}`;
+  } else if (icon.startsWith("/")) {
+    return `/icons${icon}`;
+  } else {
+    if (icon.endsWith(".png")) {
+      return `https://cdn.jsdelivr.net/gh/walkxcode/dashboard-icons/png/${icon}`;
+    } else {
+      return `https://cdn.jsdelivr.net/gh/walkxcode/dashboard-icons/png/${icon}.png`;
+    }
+  }
+}
+
 export default function Item({ service }) {
   return (
     <li key={service.name} className="">
       <Disclosure>
         <div className="transition-all h-15 overflow-hidden mb-3 cursor-pointer p-1 rounded-md font-medium text-theme-700 hover:text-theme-800 dark:text-theme-200 dark:hover:text-theme-300 shadow-md shadow-theme-900/10 dark:shadow-theme-900/40 bg-white/50 hover:bg-theme-300/10 dark:bg-white/5 dark:hover:bg-white/10">
           <div className="flex">
-            <div
+            {service.icon && (
-              onClick={() => {
+              <div
-                window.open(service.href, "_blank").focus();
+                onClick={() => {
-              }}
+                  window.open(service.href, "_blank").focus();
-              className="flex-shrink-0 flex items-center justify-center w-12 "
+                }}
-            >
+                className="flex-shrink-0 flex items-center justify-center w-12 "
-              <Image
+              >
-                src={`https://cdn.jsdelivr.net/gh/walkxcode/dashboard-icons/png/${service.icon}`}
+                <Image src={resolveIcon(service.icon)} width={32} height={32} alt="logo" />
-                width={32}
+              </div>
-                height={32}
+            )}
-                alt="logo"
+
-              />
-            </div>
             <div
               onClick={() => {
                 window.open(service.href, "_blank").focus();