feat(web): add Book a Call button to sidebar and docs navbar (#1441)

Author: msukkari

docs/docs.json

@@ -231,8 +231,8 @@
     "navbar": {
         "primary": {
             "type": "button",
-            "label": "GitHub",
-            "href": "https://github.com/sourcebot-dev/sourcebot"
+            "label": "Book a Call",
+            "href": "https://calendly.com/michael-sourcebot/sourcebot-call?utm_source=docs"
         }
     },
     "footer": {

packages/web/src/app/(app)/@sidebar/components/bookACallSidebarButton.tsx

@@ -0,0 +1,32 @@
+import {
+    SidebarMenu,
+    SidebarMenuButton,
+    SidebarMenuItem,
+} from "@/components/ui/sidebar"
+import { Phone } from "lucide-react"
+
+const BOOK_A_CALL_BASE_URL = "https://calendly.com/michael-sourcebot/sourcebot-call"
+
+interface BookACallSidebarButtonProps {
+    // When the deployment is the public "ask GitHub" app, attribute bookings
+    // to `public-app` so they can be told apart from self-hosted instances.
+    isAskGhEnabled: boolean
+}
+
+export function BookACallSidebarButton({ isAskGhEnabled }: BookACallSidebarButtonProps) {
+    const utmSource = isAskGhEnabled ? "public-app" : "app"
+    const href = `${BOOK_A_CALL_BASE_URL}?utm_source=${utmSource}`
+
+    return (
+        <SidebarMenu>
+            <SidebarMenuItem>
+                <SidebarMenuButton asChild tooltip="Book a Call">
+                    <a href={href} target="_blank" rel="noopener noreferrer">
+                        <Phone className="h-4 w-4" />
+                        <span>Book a Call</span>
+                    </a>
+                </SidebarMenuButton>
+            </SidebarMenuItem>
+        </SidebarMenu>
+    )
+}

packages/web/src/app/(app)/@sidebar/components/defaultSidebar/index.tsx

@@ -14,6 +14,7 @@ import { RepoVisitHistory } from "./repoVisitHistory";
 import { getAuthContext, withAuth } from "@/middleware/withAuth";
 import { sew } from "@/middleware/sew";
 import { hasEntitlement, isValidLicenseActive } from "@/lib/entitlements";
+import { env } from "@sourcebot/shared";
 
 const SIDEBAR_CHAT_LIMIT = 30;
 export const SIDEBAR_REPO_VISITS_LIMIT = 10;
@@ -57,6 +58,7 @@ export async function DefaultSidebar() {
             session={session}
             collapsible="icon"
             isValidLicenseActive={licenseActive}
+            isAskGhEnabled={env.EXPERIMENT_ASK_GH_ENABLED === 'true'}
             headerContent={
                 <Nav
                     isSettingsNotificationVisible={isSettingsNotificationVisible}

packages/web/src/app/(app)/@sidebar/components/settingsSidebar/index.tsx

@@ -6,6 +6,7 @@ import { SidebarBase } from "../sidebarBase";
 import { Nav } from "./nav";
 import { SettingsSidebarHeader } from "./header";
 import { isValidLicenseActive } from "@/lib/entitlements";
+import { env } from "@sourcebot/shared";
 
 export async function SettingsSidebar() {
     const session = await auth();
@@ -22,6 +23,7 @@ export async function SettingsSidebar() {
             session={session}
             collapsible="none"
             isValidLicenseActive={licenseActive}
+            isAskGhEnabled={env.EXPERIMENT_ASK_GH_ENABLED === 'true'}
             headerContent={<SettingsSidebarHeader />}
         >
             <Nav groups={sidebarNavGroups} />

packages/web/src/app/(app)/@sidebar/components/sidebarBase.tsx

@@ -45,6 +45,7 @@ import { KeyboardShortcutHint } from "@/app/components/keyboardShortcutHint";
 import { Tooltip, TooltipContent, TooltipTrigger } from "@/components/ui/tooltip";
 import { Separator } from "@/components/ui/separator";
 import { WhatsNewSidebarButton } from "./whatsNewSidebarButton";
+import { BookACallSidebarButton } from "./bookACallSidebarButton";
 import { UpgradeButton } from "./upgradeButton";
 import { useIsMobile } from "@/hooks/use-mobile";
 
@@ -58,9 +59,10 @@ interface SidebarBaseProps {
     headerContent: ReactNode;
     children: ReactNode;
     isValidLicenseActive: boolean;
+    isAskGhEnabled: boolean;
 }
 
-export function SidebarBase({ session, collapsible = "icon", headerContent, children, isValidLicenseActive }: SidebarBaseProps) {
+export function SidebarBase({ session, collapsible = "icon", headerContent, children, isValidLicenseActive, isAskGhEnabled }: SidebarBaseProps) {
     const [isScrolled, setIsScrolled] = useState(false);
     const contentRef = useRef<HTMLDivElement>(null);
     const isMobile = useIsMobile();
@@ -118,6 +120,7 @@ export function SidebarBase({ session, collapsible = "icon", headerContent, chil
                         <CollapseSidebarButton />
                     }
                     <WhatsNewSidebarButton />
+                    <BookACallSidebarButton isAskGhEnabled={isAskGhEnabled} />
                     {session ? (
                         <MeControlDropdownMenu session={session} />
                     ) : (