apunkt/dograh
1
0
Fork 0
mirror of https://github.com/dograh-hq/dograh.git synced 2026-07-04 10:52:17 +02:00
Code Issues Projects Releases Packages Wiki Activity

ui rezig, onboarding, billing, hire us & on prem cues

Browse source
This commit is contained in:
Pritesh 2026-06-11 10:37:43 +05:30
parent 0662a1770f
commit 0eddce6c83
55 changed files with 1108 additions and 629 deletions
Download patch file Download diff file Expand all files Collapse all files

8
ui/src/components/layout/AppLayout.tsx
View file

@ -19,7 +19,7 @@ function AppHeader() {
const { toggleSidebar } = useSidebar();
return (
<header className="sticky top-0 z-50 flex items-center justify-between border-b bg-background px-4 py-2">
<header className="sticky top-0 z-50 flex items-center justify-between border-b border-border/60 bg-background/70 px-4 py-2 backdrop-blur-md supports-[backdrop-filter]:bg-background/55">
<div className="flex items-center gap-3">
<Button variant="ghost" size="icon" onClick={toggleSidebar} aria-label="Open menu" className="md:hidden">
<Menu className="h-5 w-5" />
@ -120,7 +120,7 @@ const AppLayout: React.FC<AppLayoutProps> = ({
{!isWorkflowEditor && <AppHeader />}
{/* Optional header area for specific pages */}
{headerActions && (
<header className="sticky top-0 z-50 w-full border-b bg-background">
<header className="sticky top-0 z-50 w-full border-b border-border/60 bg-background/70 backdrop-blur-md supports-[backdrop-filter]:bg-background/55">
<div className="container mx-auto px-4 py-4">
<div className="flex items-center justify-center">
{headerActions}
@ -141,14 +141,14 @@ const AppLayout: React.FC<AppLayoutProps> = ({
)}
{/* Main content area */}
<main className="flex-1">
<main className="app-surface flex-1">
{children}
</main>
</SidebarInset>
</div>
</LeadFormsProvider>
) : (
<div className="flex-1 w-full">
<div className="app-surface w-full flex-1">
<BackendStatusBanner />
{children}
</div>

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

@ -27,6 +27,7 @@ import Link from "next/link";
import { usePathname, useRouter } from "next/navigation";
import React, { useRef } from "react";
import { BrandLogo } from "@/components/BrandLogo";
import ThemeToggle from "@/components/ThemeSwitcher";
import { Button } from "@/components/ui/button";
import {
@ -226,8 +227,8 @@ export function AppSidebar() {
asChild
tooltip={tooltip}
className={cn(
"hover:bg-accent hover:text-accent-foreground",
isItemActive && "bg-accent text-accent-foreground"
"transition-colors hover:bg-accent hover:text-accent-foreground",
isItemActive && "bg-cta/10 font-medium text-foreground hover:bg-cta/15"
)}
>
<Link
@ -236,7 +237,10 @@ export function AppSidebar() {
className={cn("relative", isCollapsed && "justify-center")}
translate="no"
>
<Icon className="h-4 w-4 shrink-0" />
{isItemActive && !isCollapsed && (
<span className="absolute inset-y-1 left-0 w-0.5 rounded-full bg-cta" aria-hidden />
)}
<Icon className={cn("h-4 w-4 shrink-0", isItemActive && "text-cta")} />
<span
className={cn("notranslate min-w-0 flex-1 truncate", isCollapsed && "sr-only")}
translate="no"
@ -288,16 +292,16 @@ export function AppSidebar() {
);
return (
<Sidebar collapsible="icon" className="border-r">
<Sidebar collapsible="icon" className="app-sidebar-surface border-r border-border/60">
<SidebarHeader className="border-b px-2 py-3 notranslate" translate="no">
<div className="flex items-center justify-between">
<div className={cn("flex items-center gap-2", isCollapsed && "hidden")}>
<Link
href="/"
className="notranslate flex items-center gap-2 px-2 text-xl font-bold"
className="notranslate flex items-center gap-2 px-1"
translate="no"
>
Dograh
<BrandLogo mark className="h-6" />
{versionInfo && (
<span
className="notranslate text-xs font-normal text-muted-foreground"
@ -321,7 +325,7 @@ export function AppSidebar() {
</a>
</TooltipTrigger>
<TooltipContent side="bottom">
<p>Latest: {latestRelease} — click to see the update guide</p>
<p>Latest: {latestRelease} - click to see the update guide</p>
</TooltipContent>
</Tooltip>
)}
@ -474,10 +478,6 @@ export function AppSidebar() {
<Settings className="mr-2 h-4 w-4" />
Platform Settings
</DropdownMenuItem>
<DropdownMenuItem onClick={() => router.push("/usage")} className="cursor-pointer">
<CircleDollarSign className="mr-2 h-4 w-4" />
Usage
</DropdownMenuItem>
<DropdownMenuItem onClick={() => logout()} className="cursor-pointer">
<LogOut className="mr-2 h-4 w-4" />
Sign out