add global settings context

will be useful going forward, and simplify widget props being passed around all over the place

src/components/services/group.jsx

@@ -2,7 +2,7 @@ import classNames from "classnames";
 
 import List from "components/services/list";
 
-export default function ServicesGroup({ services, target, layout }) {
+export default function ServicesGroup({ services, layout }) {
   return (
     <div
       key={services.name}
@@ -12,7 +12,7 @@ export default function ServicesGroup({ services, target, layout }) {
       )}
     >
       <h2 className="text-theme-800 dark:text-theme-300 text-xl font-medium">{services.name}</h2>
-      <List services={services.services} target={target} layout={layout} />
+      <List services={services.services} layout={layout} />
     </div>
   );
 }

src/components/services/item.jsx

@@ -1,10 +1,13 @@
 import Image from "next/future/image";
+import { useContext } from "react";
 import { Disclosure } from "@headlessui/react";
 
 import Status from "./status";
 import Widget from "./widget";
 import Docker from "./widgets/service/docker";
 
+import { SettingsContext } from "utils/settings-context";
+
 function resolveIcon(icon) {
   if (icon.startsWith("http")) {
     return `/api/proxy?url=${encodeURIComponent(icon)}`;
@@ -21,8 +24,9 @@ function resolveIcon(icon) {
   return `https://cdn.jsdelivr.net/gh/walkxcode/dashboard-icons/png/${icon}.png`;
 }
 
-export default function Item({ service, target = "_blank" }) {
+export default function Item({ service }) {
   const hasLink = service.href && service.href !== "#";
+  const { settings } = useContext(SettingsContext);
 
   return (
     <li key={service.name}>
@@ -37,7 +41,7 @@ export default function Item({ service, target = "_blank" }) {
               (hasLink ? (
                 <a
                   href={service.href}
-                  target={target}
+                  target={settings.target ?? "_blank"}
                   rel="noreferrer"
                   className="flex-shrink-0 flex items-center justify-center w-12 "
                 >
@@ -52,7 +56,7 @@ export default function Item({ service, target = "_blank" }) {
             {hasLink ? (
               <a
                 href={service.href}
-                target={target}
+                target={settings.target ?? "_blank"}
                 rel="noreferrer"
                 className="flex-1 flex items-center justify-between rounded-r-md "
               >

src/components/services/list.jsx

@@ -14,7 +14,7 @@ const columnMap = [
   "grid-cols-1 md:grid-cols-2 lg:grid-cols-8",
 ];
 
-export default function List({ services, target, layout }) {
+export default function List({ services, layout }) {
   return (
     <ul
       className={classNames(
@@ -23,7 +23,7 @@ export default function List({ services, target, layout }) {
       )}
     >
       {services.map((service) => (
-        <Item key={service.name} target={target} service={service} />
+        <Item key={service.name} service={service} />
       ))}
     </ul>
   );