apunkt/dograh
1
0
Fork 0
mirror of https://github.com/dograh-hq/dograh.git synced 2026-06-13 08:15:21 +02:00
Code Issues Projects Releases Packages Wiki Activity

feat(lead-gen): rename OBSERVE to MANAGE, add Credits & Billing link and Hire-an-Expert footer button

Browse source 
Co-Authored-By: Claude Opus 4.8 (1M context) <noreply@anthropic.com>
This commit is contained in:
Pritesh 2026-06-03 04:26:11 +05:30
parent 6cfd05ec04
commit a35baedbb0
1 changed files with 38 additions and 3 deletions
Download patch file Download diff file Expand all files Collapse all files

41
ui/src/components/layout/AppSidebar.tsx
View file

@ -19,6 +19,7 @@ import {
Phone,
Settings,
TrendingUp,
UserRound,
Workflow,
Wrench,
} from "lucide-react";
@ -52,6 +53,7 @@ import {
} from "@/components/ui/sidebar";
import { Tooltip, TooltipContent, TooltipTrigger } from "@/components/ui/tooltip";
import { useAppConfig } from "@/context/AppConfigContext";
import { useLeadForms } from "@/context/LeadFormsContext";
import { useTelephonyConfigWarnings } from "@/context/TelephonyConfigWarningsContext";
import { useLatestReleaseVersion } from "@/hooks/useLatestReleaseVersion";
import type { LocalUser } from "@/lib/auth";
@ -129,7 +131,7 @@ const NAV_SECTIONS: SidebarNavSection[] = [
],
},
{
label: "OBSERVE",
label: "MANAGE",
items: [
{
title: "Agent Runs",
@ -141,6 +143,11 @@ const NAV_SECTIONS: SidebarNavSection[] = [
url: "/reports",
icon: FileText,
},
{
title: "Credits & Billing",
url: "/billing",
icon: CircleDollarSign,
},
],
},
];
@ -158,6 +165,7 @@ export function AppSidebar() {
const { state, isMobile, setOpenMobile } = useSidebar();
const { provider, getSelectedTeam, logout, user } = useAuth();
const { config } = useAppConfig();
const { openHireExpert } = useLeadForms();
const { telnyxMissingWebhookPublicKeyCount } = useTelephonyConfigWarnings();
const hasTelephonyWarning = telnyxMissingWebhookPublicKeyCount > 0;
const isCollapsed = !isMobile && state === "collapsed";
@ -254,6 +262,31 @@ export function AppSidebar() {
);
};
// "Hire an Expert" CTA shown in the footer next to the user avatar.
// Expanded: icon + label. Collapsed: icon-only with a tooltip.
const hireExpertButton = isCollapsed ? (
<Tooltip>
<TooltipTrigger asChild>
<Button
size="icon"
className="h-8 w-8"
onClick={() => openHireExpert("sidebar")}
aria-label="Hire an Expert"
>
<UserRound className="h-4 w-4" />
</Button>
</TooltipTrigger>
<TooltipContent side="right">
<p>Hire an Expert</p>
</TooltipContent>
</Tooltip>
) : (
<Button size="sm" className="gap-2" onClick={() => openHireExpert("sidebar")}>
<UserRound className="h-4 w-4" />
Hire an Expert
</Button>
);
return (
<Sidebar collapsible="icon" className="border-r">
<SidebarHeader className="border-b px-2 py-3 notranslate" translate="no">
@ -367,7 +400,7 @@ export function AppSidebar() {
>
<div className="space-y-2">
{provider !== "stack" && (
<div className={cn("flex", isCollapsed ? "justify-center" : "justify-start")}>
<div className={cn("flex items-center", isCollapsed ? "flex-col gap-2" : "justify-between")}>
<DropdownMenu>
<DropdownMenuTrigger asChild>
<Button variant="ghost" size="icon" className="h-8 w-8 cursor-pointer rounded-full">
@ -401,11 +434,12 @@ export function AppSidebar() {
</DropdownMenuItem>
</DropdownMenuContent>
</DropdownMenu>
{hireExpertButton}
</div>
)}
{provider === "stack" && (
<div className={cn("flex", isCollapsed ? "justify-center" : "justify-start")}>
<div className={cn("flex items-center", isCollapsed ? "flex-col gap-2" : "justify-between")}>
<DropdownMenu>
<DropdownMenuTrigger asChild>
<Button variant="ghost" size="icon" className="h-8 w-8 cursor-pointer rounded-full">
@ -450,6 +484,7 @@ export function AppSidebar() {
</DropdownMenuItem>
</DropdownMenuContent>
</DropdownMenu>
{hireExpertButton}
</div>
)}