Andreas/LibreChat
1
0
Fork 0
mirror of https://github.com/danny-avila/LibreChat.git synced 2026-01-01 16:18:51 +01:00
Code Issues Projects Releases Packages Wiki Activity Actions

refactor: update SharedLinks and ArchivedChats to use desktopOnly instead of hideOnMobile; remove unused DataTableColumnHeader component

Browse source
This commit is contained in:
Marco Beretta 2025-09-24 00:35:29 +02:00
parent 76b34775f0
commit a3de2245b1
No known key found for this signature in database
GPG key ID: D918033D8E74CC11
5 changed files with 9 additions and 74 deletions
Download patch file Download diff file Expand all files Collapse all files

4
client/src/components/Nav/SettingsTabs/Data/SharedLinks.tsx
View file

@ -44,7 +44,7 @@ const defaultSort: SortingState = [
type TableColumn<TData, TValue> = ColumnDef<TData, TValue> & {
meta?: {
className?: string;
hideOnMobile?: boolean;
desktopOnly?: boolean;
};
};
@ -253,7 +253,7 @@ export default function SharedLinks() {
},
meta: {
className: 'w-32 sm:w-40',
hideOnMobile: true,
desktopOnly: true,
},
enableSorting: true,
},

14
client/src/components/Nav/SettingsTabs/General/ArchivedChats.tsx
View file

@ -1,6 +1,6 @@
import { useState, useCallback, useMemo, useEffect } from 'react';
import { TrashIcon, ArchiveRestore } from 'lucide-react';
import type { ColumnDef, SortingState } from '@tanstack/react-table';
import type { SortingState } from '@tanstack/react-table';
import {
Button,
OGDialog,
@ -15,6 +15,7 @@ import {
useToastContext,
useMediaQuery,
DataTable,
type TableColumn,
} from '@librechat/client';
import type { ConversationListParams, TConversation } from 'librechat-data-provider';
import {
@ -44,15 +45,6 @@ const defaultSort: SortingState = [
},
];
type TableColumn<TData, TValue> = ColumnDef<TData, TValue> & {
meta?: {
size?: string | number;
mobileSize?: string | number;
minWidth?: string | number;
priority?: number;
};
};
export default function ArchivedChatsTable() {
const localize = useLocalize();
const isSmallScreen = useMediaQuery('(max-width: 768px)');
@ -298,7 +290,7 @@ export default function ArchivedChatsTable() {
},
meta: {
className: 'w-32 sm:w-40',
hideOnMobile: true,
desktopOnly: true,
},
enableSorting: true,
},

2
packages/client/src/components/DataTable/DataTable.types.ts
View file

@ -8,6 +8,8 @@ export type TableColumn<TData, TValue> = ColumnDef<TData, TValue> & {
mobileSize?: string | number;
minWidth?: string | number;
priority?: number;
className?: string;
desktopOnly?: boolean;
};
};

60
packages/client/src/components/DataTableColumnHeader.tsx
View file

@ -1,60 +0,0 @@
import { Column } from '@tanstack/react-table';
import { ArrowDownIcon, ArrowUpIcon, CaretSortIcon, EyeNoneIcon } from '@radix-ui/react-icons';
import {
DropdownMenu,
DropdownMenuContent,
DropdownMenuItem,
DropdownMenuSeparator,
DropdownMenuTrigger,
} from './DropdownMenu';
import { Button } from './Button';
import { cn } from '~/utils';
interface DataTableColumnHeaderProps<TData, TValue> extends React.HTMLAttributes<HTMLDivElement> {
column: Column<TData, TValue>;
title: string;
}
export function DataTableColumnHeader<TData, TValue>({
column,
title,
className = '',
}: DataTableColumnHeaderProps<TData, TValue>) {
if (!column.getCanSort()) {
return <div className={cn(className)}>{title}</div>;
}
return (
<div className={cn('flex items-center space-x-2', className)}>
<DropdownMenu>
<DropdownMenuTrigger asChild>
<Button variant="ghost" size="sm" className="-ml-3 h-8 data-[state=open]:bg-accent">
<span>{title}</span>
{column.getIsSorted() === 'desc' ? (
<ArrowDownIcon className="ml-2 h-4 w-4" />
) : column.getIsSorted() === 'asc' ? (
<ArrowUpIcon className="ml-2 h-4 w-4" />
) : (
<CaretSortIcon className="ml-2 h-4 w-4" />
)}
</Button>
</DropdownMenuTrigger>
<DropdownMenuContent align="start" className="z-[1001]">
<DropdownMenuItem onClick={() => column.toggleSorting(false)}>
<ArrowUpIcon className="mr-2 h-3.5 w-3.5 text-muted-foreground/70" />
Asc
</DropdownMenuItem>
<DropdownMenuItem onClick={() => column.toggleSorting(true)}>
<ArrowDownIcon className="mr-2 h-3.5 w-3.5 text-muted-foreground/70" />
Desc
</DropdownMenuItem>
<DropdownMenuSeparator />
<DropdownMenuItem onClick={() => column.toggleVisibility(false)}>
<EyeNoneIcon className="mr-2 h-3.5 w-3.5 text-muted-foreground/70" />
Hide
</DropdownMenuItem>
</DropdownMenuContent>
</DropdownMenu>
</div>
);
}

3
packages/client/src/components/index.ts
View file

@ -4,7 +4,8 @@ export * from './AlertDialog';
export * from './Breadcrumb';
export * from './Button';
export * from './Checkbox';
export * from './DataTableColumnHeader';
export * from './DataTable/DataTable.types';
export * from './Dialog';
export * from './DropdownMenu';
export * from './HoverCard';