mirror of
https://github.com/MODSetter/SurfSense.git
synced 2026-05-04 21:32:39 +02:00
Remove all search spaces sheet and dropdown option
This commit is contained in:
CREDO23
parent
73a57589ac
commit
4ace7d09a0
10 changed files with 13 additions and 296 deletions
|
|
@ -1,7 +1,6 @@
|
|||
export { CreateSearchSpaceDialog } from "./dialogs";
|
||||
export { Header } from "./header";
|
||||
export { IconRail, NavIcon, SearchSpaceAvatar } from "./icon-rail";
|
||||
export { AllSearchSpacesSheet } from "./sheets";
|
||||
export { LayoutShell } from "./shell";
|
||||
export {
|
||||
ChatListItem,
|
||||
|
|
|
|||
|
|
@ -1,241 +0,0 @@
|
|||
"use client";
|
||||
|
||||
import {
|
||||
Calendar,
|
||||
MoreHorizontal,
|
||||
Search,
|
||||
Settings,
|
||||
Share2,
|
||||
Trash2,
|
||||
UserCheck,
|
||||
Users,
|
||||
} from "lucide-react";
|
||||
import { useTranslations } from "next-intl";
|
||||
import { useState } from "react";
|
||||
import {
|
||||
AlertDialog,
|
||||
AlertDialogAction,
|
||||
AlertDialogCancel,
|
||||
AlertDialogContent,
|
||||
AlertDialogDescription,
|
||||
AlertDialogFooter,
|
||||
AlertDialogHeader,
|
||||
AlertDialogTitle,
|
||||
} from "@/components/ui/alert-dialog";
|
||||
import { Badge } from "@/components/ui/badge";
|
||||
import { Button } from "@/components/ui/button";
|
||||
import {
|
||||
DropdownMenu,
|
||||
DropdownMenuContent,
|
||||
DropdownMenuItem,
|
||||
DropdownMenuSeparator,
|
||||
DropdownMenuTrigger,
|
||||
} from "@/components/ui/dropdown-menu";
|
||||
import {
|
||||
Sheet,
|
||||
SheetContent,
|
||||
SheetDescription,
|
||||
SheetHeader,
|
||||
SheetTitle,
|
||||
} from "@/components/ui/sheet";
|
||||
import type { SearchSpace } from "../../types/layout.types";
|
||||
|
||||
function formatDate(dateString: string): string {
|
||||
return new Date(dateString).toLocaleDateString("en-US", {
|
||||
year: "numeric",
|
||||
month: "short",
|
||||
day: "numeric",
|
||||
});
|
||||
}
|
||||
|
||||
interface AllSearchSpacesSheetProps {
|
||||
open: boolean;
|
||||
onOpenChange: (open: boolean) => void;
|
||||
searchSpaces: SearchSpace[];
|
||||
onSearchSpaceSelect: (id: number) => void;
|
||||
onCreateNew?: () => void;
|
||||
onSettings?: (id: number) => void;
|
||||
onDelete?: (id: number) => void;
|
||||
}
|
||||
|
||||
export function AllSearchSpacesSheet({
|
||||
open,
|
||||
onOpenChange,
|
||||
searchSpaces,
|
||||
onSearchSpaceSelect,
|
||||
onCreateNew,
|
||||
onSettings,
|
||||
onDelete,
|
||||
}: AllSearchSpacesSheetProps) {
|
||||
const t = useTranslations("searchSpace");
|
||||
const tCommon = useTranslations("common");
|
||||
|
||||
const [spaceToDelete, setSpaceToDelete] = useState<SearchSpace | null>(null);
|
||||
|
||||
const handleSelect = (id: number) => {
|
||||
onSearchSpaceSelect(id);
|
||||
onOpenChange(false);
|
||||
};
|
||||
|
||||
const handleSettings = (e: React.MouseEvent, space: SearchSpace) => {
|
||||
e.stopPropagation();
|
||||
onOpenChange(false);
|
||||
onSettings?.(space.id);
|
||||
};
|
||||
|
||||
const handleDeleteClick = (e: React.MouseEvent, space: SearchSpace) => {
|
||||
e.stopPropagation();
|
||||
setSpaceToDelete(space);
|
||||
};
|
||||
|
||||
const confirmDelete = () => {
|
||||
if (spaceToDelete) {
|
||||
onDelete?.(spaceToDelete.id);
|
||||
setSpaceToDelete(null);
|
||||
}
|
||||
};
|
||||
|
||||
return (
|
||||
<>
|
||||
<Sheet open={open} onOpenChange={onOpenChange}>
|
||||
<SheetContent side="right" className="w-full sm:max-w-md">
|
||||
<SheetHeader>
|
||||
<div className="flex items-center gap-3">
|
||||
<div className="flex h-10 w-10 shrink-0 items-center justify-center rounded-lg bg-primary/10">
|
||||
<Search className="h-5 w-5 text-primary" />
|
||||
</div>
|
||||
<div className="flex flex-col gap-0.5">
|
||||
<SheetTitle>{t("all_search_spaces")}</SheetTitle>
|
||||
<SheetDescription>
|
||||
{t("search_spaces_count", { count: searchSpaces.length })}
|
||||
</SheetDescription>
|
||||
</div>
|
||||
</div>
|
||||
</SheetHeader>
|
||||
|
||||
<div className="flex flex-1 flex-col gap-3 overflow-y-auto px-4 pb-4">
|
||||
{searchSpaces.length === 0 ? (
|
||||
<div className="flex flex-1 flex-col items-center justify-center gap-4 py-12 text-center">
|
||||
<div className="flex h-16 w-16 items-center justify-center rounded-full bg-muted">
|
||||
<Search className="h-8 w-8 text-muted-foreground" />
|
||||
</div>
|
||||
<div className="flex flex-col gap-1">
|
||||
<p className="font-medium">{t("no_search_spaces")}</p>
|
||||
<p className="text-sm text-muted-foreground">{t("create_first_search_space")}</p>
|
||||
</div>
|
||||
{onCreateNew && (
|
||||
<Button onClick={onCreateNew} className="mt-2">
|
||||
{t("create_button")}
|
||||
</Button>
|
||||
)}
|
||||
</div>
|
||||
) : (
|
||||
searchSpaces.map((space) => (
|
||||
<button
|
||||
key={space.id}
|
||||
type="button"
|
||||
onClick={() => handleSelect(space.id)}
|
||||
className="flex w-full flex-col gap-2 rounded-lg border p-4 text-left transition-colors hover:bg-accent hover:border-accent-foreground/20"
|
||||
>
|
||||
<div className="flex items-start justify-between gap-2">
|
||||
<div className="flex flex-1 flex-col gap-1">
|
||||
<span className="font-medium leading-tight">{space.name}</span>
|
||||
{space.description && (
|
||||
<span className="text-sm text-muted-foreground line-clamp-2">
|
||||
{space.description}
|
||||
</span>
|
||||
)}
|
||||
</div>
|
||||
|
||||
<div className="flex shrink-0 items-center gap-2">
|
||||
{space.memberCount > 1 && (
|
||||
<Badge variant="outline" className="shrink-0">
|
||||
<Share2 className="mr-1 h-3 w-3" />
|
||||
{tCommon("shared")}
|
||||
</Badge>
|
||||
)}
|
||||
|
||||
{space.isOwner && (
|
||||
<DropdownMenu>
|
||||
<DropdownMenuTrigger asChild>
|
||||
<Button
|
||||
variant="ghost"
|
||||
size="icon"
|
||||
className="h-6 w-6 shrink-0"
|
||||
onClick={(e) => e.stopPropagation()}
|
||||
>
|
||||
<MoreHorizontal className="h-4 w-4" />
|
||||
</Button>
|
||||
</DropdownMenuTrigger>
|
||||
<DropdownMenuContent align="end">
|
||||
<DropdownMenuItem onClick={(e) => handleSettings(e, space)}>
|
||||
<Settings className="mr-2 h-4 w-4" />
|
||||
{tCommon("settings")}
|
||||
</DropdownMenuItem>
|
||||
<DropdownMenuSeparator />
|
||||
<DropdownMenuItem
|
||||
onClick={(e) => handleDeleteClick(e, space)}
|
||||
className="text-destructive focus:text-destructive"
|
||||
>
|
||||
<Trash2 className="mr-2 h-4 w-4" />
|
||||
{tCommon("delete")}
|
||||
</DropdownMenuItem>
|
||||
</DropdownMenuContent>
|
||||
</DropdownMenu>
|
||||
)}
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div className="flex items-center gap-4 text-xs text-muted-foreground">
|
||||
<span className="flex items-center gap-1">
|
||||
{space.isOwner ? (
|
||||
<UserCheck className="h-3.5 w-3.5" />
|
||||
) : (
|
||||
<Users className="h-3.5 w-3.5" />
|
||||
)}
|
||||
{t("members_count", { count: space.memberCount })}
|
||||
</span>
|
||||
{space.createdAt && (
|
||||
<span className="flex items-center gap-1">
|
||||
<Calendar className="h-3.5 w-3.5" />
|
||||
{formatDate(space.createdAt)}
|
||||
</span>
|
||||
)}
|
||||
</div>
|
||||
</button>
|
||||
))
|
||||
)}
|
||||
</div>
|
||||
|
||||
{searchSpaces.length > 0 && onCreateNew && (
|
||||
<div className="border-t p-4">
|
||||
<Button onClick={onCreateNew} variant="outline" className="w-full">
|
||||
{t("create_new_search_space")}
|
||||
</Button>
|
||||
</div>
|
||||
)}
|
||||
</SheetContent>
|
||||
</Sheet>
|
||||
|
||||
<AlertDialog open={!!spaceToDelete} onOpenChange={(open) => !open && setSpaceToDelete(null)}>
|
||||
<AlertDialogContent>
|
||||
<AlertDialogHeader>
|
||||
<AlertDialogTitle>{t("delete_title")}</AlertDialogTitle>
|
||||
<AlertDialogDescription>
|
||||
{t("delete_confirm", { name: spaceToDelete?.name ?? "" })}
|
||||
</AlertDialogDescription>
|
||||
</AlertDialogHeader>
|
||||
<AlertDialogFooter>
|
||||
<AlertDialogCancel>{tCommon("cancel")}</AlertDialogCancel>
|
||||
<AlertDialogAction
|
||||
onClick={confirmDelete}
|
||||
className="bg-destructive text-destructive-foreground hover:bg-destructive/90"
|
||||
>
|
||||
{tCommon("delete")}
|
||||
</AlertDialogAction>
|
||||
</AlertDialogFooter>
|
||||
</AlertDialogContent>
|
||||
</AlertDialog>
|
||||
</>
|
||||
);
|
||||
}
|
||||
|
|
@ -1 +0,0 @@
|
|||
export { AllSearchSpacesSheet } from "./AllSearchSpacesSheet";
|
||||
|
|
@ -40,7 +40,6 @@ interface LayoutShellProps {
|
|||
user: User;
|
||||
onSettings?: () => void;
|
||||
onManageMembers?: () => void;
|
||||
onSeeAllSearchSpaces?: () => void;
|
||||
onUserSettings?: () => void;
|
||||
onLogout?: () => void;
|
||||
pageUsage?: PageUsage;
|
||||
|
|
@ -77,7 +76,6 @@ export function LayoutShell({
|
|||
user,
|
||||
onSettings,
|
||||
onManageMembers,
|
||||
onSeeAllSearchSpaces,
|
||||
onUserSettings,
|
||||
onLogout,
|
||||
pageUsage,
|
||||
|
|
@ -132,7 +130,6 @@ export function LayoutShell({
|
|||
user={user}
|
||||
onSettings={onSettings}
|
||||
onManageMembers={onManageMembers}
|
||||
onSeeAllSearchSpaces={onSeeAllSearchSpaces}
|
||||
onUserSettings={onUserSettings}
|
||||
onLogout={onLogout}
|
||||
pageUsage={pageUsage}
|
||||
|
|
@ -181,7 +178,6 @@ export function LayoutShell({
|
|||
user={user}
|
||||
onSettings={onSettings}
|
||||
onManageMembers={onManageMembers}
|
||||
onSeeAllSearchSpaces={onSeeAllSearchSpaces}
|
||||
onUserSettings={onUserSettings}
|
||||
onLogout={onLogout}
|
||||
pageUsage={pageUsage}
|
||||
|
|
|
|||
|
|
@ -40,7 +40,6 @@ interface MobileSidebarProps {
|
|||
user: User;
|
||||
onSettings?: () => void;
|
||||
onManageMembers?: () => void;
|
||||
onSeeAllSearchSpaces?: () => void;
|
||||
onUserSettings?: () => void;
|
||||
onLogout?: () => void;
|
||||
pageUsage?: PageUsage;
|
||||
|
|
@ -80,7 +79,6 @@ export function MobileSidebar({
|
|||
user,
|
||||
onSettings,
|
||||
onManageMembers,
|
||||
onSeeAllSearchSpaces,
|
||||
onUserSettings,
|
||||
onLogout,
|
||||
pageUsage,
|
||||
|
|
@ -141,15 +139,14 @@ export function MobileSidebar({
|
|||
onNoteDelete={onNoteDelete}
|
||||
onAddNote={onAddNote}
|
||||
onViewAllNotes={onViewAllNotes}
|
||||
user={user}
|
||||
onSettings={onSettings}
|
||||
onManageMembers={onManageMembers}
|
||||
onSeeAllSearchSpaces={onSeeAllSearchSpaces}
|
||||
onUserSettings={onUserSettings}
|
||||
onLogout={onLogout}
|
||||
pageUsage={pageUsage}
|
||||
className="w-full border-none"
|
||||
/>
|
||||
user={user}
|
||||
onSettings={onSettings}
|
||||
onManageMembers={onManageMembers}
|
||||
onUserSettings={onUserSettings}
|
||||
onLogout={onLogout}
|
||||
pageUsage={pageUsage}
|
||||
className="w-full border-none"
|
||||
/>
|
||||
</div>
|
||||
</SheetContent>
|
||||
</Sheet>
|
||||
|
|
|
|||
|
|
@ -44,7 +44,6 @@ interface SidebarProps {
|
|||
user: User;
|
||||
onSettings?: () => void;
|
||||
onManageMembers?: () => void;
|
||||
onSeeAllSearchSpaces?: () => void;
|
||||
onUserSettings?: () => void;
|
||||
onLogout?: () => void;
|
||||
pageUsage?: PageUsage;
|
||||
|
|
@ -72,7 +71,6 @@ export function Sidebar({
|
|||
user,
|
||||
onSettings,
|
||||
onManageMembers,
|
||||
onSeeAllSearchSpaces,
|
||||
onUserSettings,
|
||||
onLogout,
|
||||
pageUsage,
|
||||
|
|
@ -103,7 +101,6 @@ export function Sidebar({
|
|||
isCollapsed={isCollapsed}
|
||||
onSettings={onSettings}
|
||||
onManageMembers={onManageMembers}
|
||||
onSeeAllSearchSpaces={onSeeAllSearchSpaces}
|
||||
/>
|
||||
<div className="">
|
||||
<SidebarCollapseButton
|
||||
|
|
|
|||
|
|
@ -1,6 +1,6 @@
|
|||
"use client";
|
||||
|
||||
import { ChevronsUpDown, LayoutGrid, Settings, Users } from "lucide-react";
|
||||
import { ChevronsUpDown, Settings, Users } from "lucide-react";
|
||||
import { useTranslations } from "next-intl";
|
||||
import { Button } from "@/components/ui/button";
|
||||
import {
|
||||
|
|
@ -18,7 +18,6 @@ interface SidebarHeaderProps {
|
|||
isCollapsed?: boolean;
|
||||
onSettings?: () => void;
|
||||
onManageMembers?: () => void;
|
||||
onSeeAllSearchSpaces?: () => void;
|
||||
className?: string;
|
||||
}
|
||||
|
||||
|
|
@ -27,7 +26,6 @@ export function SidebarHeader({
|
|||
isCollapsed,
|
||||
onSettings,
|
||||
onManageMembers,
|
||||
onSeeAllSearchSpaces,
|
||||
className,
|
||||
}: SidebarHeaderProps) {
|
||||
const t = useTranslations("sidebar");
|
||||
|
|
@ -59,11 +57,6 @@ export function SidebarHeader({
|
|||
<Settings className="mr-2 h-4 w-4" />
|
||||
{t("search_space_settings")}
|
||||
</DropdownMenuItem>
|
||||
<DropdownMenuSeparator />
|
||||
<DropdownMenuItem onClick={onSeeAllSearchSpaces}>
|
||||
<LayoutGrid className="mr-2 h-4 w-4" />
|
||||
{t("see_all_search_spaces")}
|
||||
</DropdownMenuItem>
|
||||
</DropdownMenuContent>
|
||||
</DropdownMenu>
|
||||
</div>
|
||||
|
|
|
|||
Loading…
Add table
Add a link
Reference in a new issue