From ca33bb0b08ffe778462736c9801e22ab1c1f6624 Mon Sep 17 00:00:00 2001
From: David Corbitt <davidlcorbitt@gmail.com>
Date: Tue, 8 Aug 2023 14:27:14 -0700
Subject: [PATCH] Add beta to logged calls

---
 app/src/components/nav/AppShell.tsx |  2 +-
 app/src/components/nav/IconLink.tsx | 22 +++++++++++++++-------
 2 files changed, 16 insertions(+), 8 deletions(-)

diff --git a/app/src/components/nav/AppShell.tsx b/app/src/components/nav/AppShell.tsx
index 2527b9e..cd56de2 100644
--- a/app/src/components/nav/AppShell.tsx
+++ b/app/src/components/nav/AppShell.tsx
@@ -52,7 +52,7 @@ const NavSidebar = () => {
           <>
             <ProjectMenu />
             <Divider />
-            <IconLink icon={IoStatsChartOutline} label="Logged Calls" href="/logged-calls" />
+            <IconLink icon={IoStatsChartOutline} label="Logged Calls" href="/logged-calls" beta/>
             <IconLink icon={RiFlaskLine} label="Experiments" href="/experiments" />
             {env.NEXT_PUBLIC_SHOW_DATA && (
               <IconLink icon={RiDatabase2Line} label="Data" href="/data" />
diff --git a/app/src/components/nav/IconLink.tsx b/app/src/components/nav/IconLink.tsx
index 8ae56f8..6613392 100644
--- a/app/src/components/nav/IconLink.tsx
+++ b/app/src/components/nav/IconLink.tsx
@@ -3,17 +3,25 @@ import Link, { type LinkProps } from "next/link";
 import { type IconType } from "react-icons";
 import NavSidebarOption from "./NavSidebarOption";
 
-type IconLinkProps = BoxProps & LinkProps & { label?: string; icon: IconType; href: string };
+type IconLinkProps = BoxProps &
+  LinkProps & { label?: string; icon: IconType; href: string; beta?: boolean };
 
-const IconLink = ({ icon, label, href, color, ...props }: IconLinkProps) => {
+const IconLink = ({ icon, label, href, color, beta, ...props }: IconLinkProps) => {
   return (
     <Link href={href} style={{ width: "100%" }}>
       <NavSidebarOption activeHrefPattern={href}>
-        <HStack w="full" p={2} color={color} justifyContent="start" {...props}>
-          <Icon as={icon} boxSize={6} mr={2} />
-          <Text fontSize="sm" display={{ base: "none", md: "block" }}>
-            {label}
-          </Text>
+        <HStack w="full" justifyContent="space-between" p={2} color={color} {...props}>
+          <HStack w="full" justifyContent="start">
+            <Icon as={icon} boxSize={6} mr={2} />
+            <Text fontSize="sm" display={{ base: "none", md: "block" }}>
+              {label}
+            </Text>
+          </HStack>
+          {beta && (
+            <Text fontSize="xs" ml={2} fontWeight="bold" color="orange.400">
+              BETA
+            </Text>
+          )}
         </HStack>
       </NavSidebarOption>
     </Link>