Skip to content

fixed org delete + added chat menu to header #235

New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Merged
carhartlewis merged 3 commits into from
Mar 31, 2025
Merged

fixed org delete + added chat menu to header #235

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
3 commits
Select commit Hold shift + click to select a range
5720168
Add AssistantButton component and integrate into Header
carhartlewis Mar 31, 2025
c853c12
Enhance delete organization action and layout adjustments
carhartlewis Mar 31, 2025
a979935
Merge branch 'main' of github.com:trycompai/comp into lewis/ui-fixes
carhartlewis Mar 31, 2025
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
79 changes: 41 additions & 38 deletions apps/app/src/actions/organization/delete-organization-action.ts
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -5,46 +5,49 @@
import { db } from "@bubba/db";
import { authActionClient } from "../safe-action";
import { deleteOrganizationSchema } from "../schema";
import { revalidatePath, revalidateTag } from "next/cache";

type DeleteOrganizationResult = {
success: boolean;
redirect?: string;
success: boolean;
redirect?: string;
};

export const deleteOrganizationAction = authActionClient
.schema(deleteOrganizationSchema)
.metadata({
name: "delete-organization",
track: {
event: "delete-organization",
channel: "server",
},
})
.action(async ({ parsedInput, ctx }): Promise<DeleteOrganizationResult> => {
const { id } = parsedInput;
const { user } = ctx;

if (!id) {
throw new Error("Invalid user input");
}

if (!user.organizationId) {
throw new Error("Invalid organization input");
}

try {
await db.$transaction(async () => {
await db.organization.delete({
where: { id: user.organizationId },
});
});

return {
success: true,
};
} catch (error) {
return {
success: false,
};
}
});
.schema(deleteOrganizationSchema)
.metadata({
name: "delete-organization",
track: {
event: "delete-organization",
channel: "server",
},
})
.action(async ({ parsedInput, ctx }): Promise<DeleteOrganizationResult> => {
const { id } = parsedInput;
const { user } = ctx;

if (!id) {
throw new Error("Invalid user input");
}

if (!user.organizationId) {
throw new Error("Invalid organization input");
}

try {
await db.$transaction(async () => {
await db.organization.delete({
where: { id: user.organizationId },
});
});

revalidatePath(`/${user.organizationId}`);

return {
success: true,
};
} catch (error) {
return {
success: false,
};
}
});
Comment on lines 10 to +53

@coderabbitai coderabbitai Bot Mar 31, 2025

Copy link
Copy Markdown

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

💡 Verification agent

🧩 Analysis chain

Inconsistent indentation throughout the file

The file uses tabs for indentation while most modern JavaScript/TypeScript projects use spaces. This appears inconsistent with the other files in the codebase.

Consider standardizing on either tabs or spaces throughout the project for consistent code style.

Let's check the project's indentation style:

🏁 Script executed:

#!/bin/bash
# Check for tab indentation in TypeScript files
rg "^\t" --type ts --count | sort -nr | head -5
# Check for space indentation in TypeScript files
rg "^  " --type ts --count | sort -nr | head -5

Length of output: 475

Indentation Standardization Required

The repository-wide analysis confirms that we have mixed indentation styles. The file apps/app/src/actions/organization/delete-organization-action.ts is using tabs for indentation, while several other TypeScript files (e.g., those found in packages/utils/) use spaces. To avoid potential merge conflicts and improve code consistency, standardizing on a single indentation style (preferably spaces, as commonly adopted in modern JavaScript/TypeScript projects) is recommended.

  • File under review: Uses tabs.
  • Other examples: Files like packages/utils/src/index.ts, packages/utils/src/format.ts, etc., use spaces.

Please update the file to align with the predominant project style and consider enforcing this with an automated formatter.

2 changes: 1 addition & 1 deletion apps/app/src/app/[locale]/(app)/(dashboard)/[orgId]/layout.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -40,7 +40,7 @@ export default async function Layout({
<UserProvider data={session.user}>
<SidebarProvider initialIsCollapsed={isCollapsed}>
<AnimatedLayout sidebar={<Sidebar />} isCollapsed={isCollapsed}>
<div className="p-4">
<div className="mx-4 md:ml-[95px] md:mr-10 pb-8">
<Header />
<main>{children}</main>
</div>
Expand Down
32 changes: 32 additions & 0 deletions apps/app/src/components/ai/chat-button.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -0,0 +1,32 @@
"use client";

import { Button } from "@bubba/ui/button";
import { useMediaQuery } from "@bubba/ui/hooks"
import { useQueryState } from "nuqs";


export function AssistantButton() {
const isDesktop = useMediaQuery("(min-width: 768px)");
const [, setAssistantOpen] = useQueryState("assistant", {
history: "push",
parse: (value) => value === "true",
serialize: (value) => value.toString(),
});

if (!isDesktop) {
return null;
}

return (
<Button
variant="outline"
className="relative min-w-[250px] w-full justify-start text-sm text-muted-foreground sm:pr-12 md:w-40 lg:w-64 border-0 p-0 hover:bg-transparent font-normal no-drag"
onClick={() => setAssistantOpen(true)}
>
<span className="ml-4 md:ml-0">Ask Comp AI a question...</span>
<kbd className="pointer-events-none absolute right-1.5 top-1.5 hidden h-5 select-none items-center gap-1 border bg-accent px-1.5 font-mono text-[10px] font-medium opacity-100 sm:flex">
<span className="text-xs">⌘</span>K
</kbd>
</Button>
);
}
93 changes: 48 additions & 45 deletions apps/app/src/components/header.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -7,53 +7,56 @@ import Link from "next/link";
import { Suspense } from "react";
import { FeedbackForm } from "./feedback-form";
import { MobileMenu } from "./mobile-menu";
import { NotificationCenter } from "./notification-center";

import { auth } from "@/auth";
import { redirect } from "next/navigation";
import { AssistantButton } from "./ai/chat-button";

export async function Header() {
const t = await getI18n();
const session = await auth();
const user = session?.user;
const currentOrganizationId = user?.organizationId;
const hasAccess = user?.isAdmin;

if (!currentOrganizationId) {
redirect("/");
}

return (
<header className="-ml-4 -mr-4 md:m-0 z-10 px-4 md:px-0 md:border-b-[1px] flex justify-between pt-4 pb-2 md:pb-4 items-center todesktop:sticky todesktop:top-0 todesktop:bg-background todesktop:border-none sticky md:static top-0 backdrop-filter backdrop-blur-xl md:backdrop-filter md:backdrop-blur-none bg-opacity-70">
<MobileMenu
organizationId={currentOrganizationId}
isAdmin={hasAccess ?? false}
/>

<div className="flex space-x-2 ml-auto">
<div className="hidden md:flex gap-2">
<FeedbackForm />
<Button
asChild
variant="outline"
className="rounded-full font-normal h-[32px] p-0 px-3 text-xs text-muted-foreground gap-2 items-center"
>
<Link
href="https://discord.gg/compai"
target="_blank"
className="flex gap-2"
>
<Icons.Discord className="h-4 w-4" />
{t("header.discord.button")}
</Link>
</Button>
</div>

{/* <NotificationCenter /> */}

<Suspense fallback={<Skeleton className="h-8 w-8 rounded-full" />}>
<UserMenu />
</Suspense>
</div>
</header>
);
const t = await getI18n();
const session = await auth();
const user = session?.user;
const currentOrganizationId = user?.organizationId;
const hasAccess = user?.isAdmin;

if (!currentOrganizationId) {
redirect("/");
}

return (
<header className="-ml-4 -mr-4 md:m-0 z-10 px-4 md:px-0 md:border-b-[1px] flex justify-between pt-4 pb-2 md:pb-4 items-center todesktop:sticky todesktop:top-0 todesktop:bg-background todesktop:border-none sticky md:static top-0 backdrop-filter backdrop-blur-xl md:backdrop-filter md:backdrop-blur-none bg-opacity-70">
<MobileMenu
organizationId={currentOrganizationId}
isAdmin={hasAccess ?? false}
/>

<AssistantButton />

<div className="flex space-x-2 ml-auto">
<div className="hidden md:flex gap-2">
<FeedbackForm />
<Button
asChild
variant="outline"
className="rounded-full font-normal h-[32px] p-0 px-3 text-xs text-muted-foreground gap-2 items-center"
>
<Link
href="https://discord.gg/compai"
target="_blank"
className="flex gap-2"
>
<Icons.Discord className="h-4 w-4" />
{t("header.discord.button")}
</Link>
</Button>
</div>

{/* <NotificationCenter /> */}

<Suspense fallback={<Skeleton className="h-8 w-8 rounded-full" />}>
<UserMenu />
</Suspense>
</div>
</header>
);
}
38 changes: 19 additions & 19 deletions apps/app/src/components/sidebar-logo.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -5,26 +5,26 @@ import { cn } from "@bubba/ui/cn";
import Link from "next/link";

interface SidebarLogoProps {
isCollapsed: boolean;
organizationId: string;
isCollapsed: boolean;
organizationId: string;
}

export function SidebarLogo({ isCollapsed, organizationId }: SidebarLogoProps) {
return (
<div
className={cn(
"transition-all duration-300 flex items-center",
isCollapsed ? "w-full justify-center scale-110 transform-gpu" : "ml-2",
)}
>
<Link href={`/${organizationId}`}>
<Icons.Logo
className={cn(
"transition-transform duration-300",
isCollapsed && "scale-110",
)}
/>
</Link>
</div>
);
return (
<div
className={cn(
"transition-all duration-300 flex items-center",
)}
>
<Link href={`/${organizationId}`}>
<Icons.Logo
width={45}
height={45}
className={cn(
"transition-transform duration-300",
)}
/>
</Link>
</div>
);
}