From 1c38710308e9a105d1bdbc97dc83fa5c850ad972 Mon Sep 17 00:00:00 2001
From: Gri-ffin <gameshunter359@gmail.com>
Date: Tue, 2 Jan 2024 14:05:52 +0100
Subject: [PATCH] add social media links

---
 web/containers/Layout/Ribbon/index.tsx | 45 ++++++++++++++++++++++++++
 1 file changed, 45 insertions(+)

diff --git a/web/containers/Layout/Ribbon/index.tsx b/web/containers/Layout/Ribbon/index.tsx
index fa6d53193..1a63b1d44 100644
--- a/web/containers/Layout/Ribbon/index.tsx
+++ b/web/containers/Layout/Ribbon/index.tsx
@@ -11,6 +11,8 @@ import {
   SettingsIcon,
   MonitorIcon,
   LayoutGridIcon,
+  Twitter,
+  Github,
 } from 'lucide-react'
 
 import { twMerge } from 'tailwind-merge'
@@ -52,6 +54,23 @@ export default function RibbonNav() {
     },
   ]
 
+  const linksMenu = [
+    {
+      name: 'Twitter',
+      icon: (
+        <Twitter size={20} className="flex-shrink-0 text-muted-foreground" />
+      ),
+      link: 'https://twitter.com/janhq',
+    },
+    {
+      name: 'Github',
+      icon: (
+        <Github size={20} className="flex-shrink-0 text-muted-foreground" />
+      ),
+      link: 'https://github.com/janhq/jan',
+    },
+  ]
+
   const secondaryMenus = [
     {
       name: 'System Monitor',
@@ -118,6 +137,32 @@ export default function RibbonNav() {
           </div>
 
           <div>
+            <>
+              {linksMenu
+                .filter((link) => !!link)
+                .map((link, i) => {
+                  return (
+                    <div className="relative flex p-2" key={i}>
+                      <Tooltip>
+                        <TooltipTrigger>
+                          <a
+                            href={link.link}
+                            target="_blank"
+                            rel="noopener noreferrer"
+                            className="relative flex w-full flex-shrink-0 cursor-pointer items-center justify-center"
+                          >
+                            {link.icon}
+                          </a>
+                        </TooltipTrigger>
+                        <TooltipContent side="right" sideOffset={10}>
+                          <span>{link.name}</span>
+                          <TooltipArrow />
+                        </TooltipContent>
+                      </Tooltip>
+                    </div>
+                  )
+                })}
+            </>
             {secondaryMenus
               .filter((secondary) => !!secondary)
               .map((secondary, i) => {