draft(projects): add related repo links

README.md

@@ -1,4 +1,9 @@
 # <img src="./apps/web/public/dashwise-icon.svg" alt="Dashwise icon" width="32" /> dashwise: Your Homelab, in one place
+
+---
+
+[Extension](https://github.com/dashwise-homelab/chrome) · [Integrations](https://github.com/dashwise-homelab/integrations) · [Frame Companion](https://github.com/dashwise-homelab/framecompanion)
+
 I've been self hosting for a while but did not find a dashboard that suits my needs and that I like the look of.
 This is my attempt to solving that.
 

apps/web/src/components/dashboard/QuickLaunchPopover.tsx

@@ -38,6 +38,24 @@ const quickLinks = [
   },
 ];
 
+const companionRepos = [
+  {
+    href: "https://github.com/dashwise-homelab/chrome",
+    label: "Extension",
+    icon: "mdi:google-chrome",
+  },
+  {
+    href: "https://github.com/dashwise-homelab/integrations",
+    label: "Integrations",
+    icon: "fa6-solid:plug",
+  },
+  {
+    href: "https://github.com/dashwise-homelab/framecompanion",
+    label: "Frame Companion",
+    icon: "teenyicons:screen-solid",
+  },
+];
+
 export default function QuickLaunchPopover() {
   return (
     <Popover>
@@ -144,6 +162,33 @@ export default function QuickLaunchPopover() {
             </a>
           </PopoverClose>
         </div>
+
+        <h2 className="mt-4 text-lg font-semibold">Companion repositories</h2>
+        <div className="grid grid-cols-2 gap-2 sm:grid-cols-3">
+          {companionRepos.map((item) => (
+            <PopoverClose asChild key={item.href}>
+              <a
+                href={item.href}
+                target="_blank"
+                rel="noreferrer"
+                className="group grid min-h-24 justify-items-center justify-center items-center rounded-2xl p-3 transition hover:-translate-y-0.5 hover:bg-white/10"
+              >
+                <div className="flex items-start justify-between gap-2">
+                  <Icon
+                    icon={item.icon}
+                    width={24}
+                    className="text-foreground/80 transition-colors group-hover:text-primary"
+                  />
+                </div>
+                <div className="space-y-1">
+                  <p className="text-center text-sm font-semibold leading-tight">
+                    {item.label}
+                  </p>
+                </div>
+              </a>
+            </PopoverClose>
+          ))}
+        </div>
       </PopoverContent>
     </Popover>
   );