mirror of
https://github.com/danny-avila/LibreChat.git
synced 2025-12-17 08:50:15 +01:00
* chore: update package version to 0.7.416 * chore: Update Role.js imports order * refactor: move updateTagsInConvo to tags route, add RBAC for tags * refactor: add updateTagsInConvoOptions * fix: loading state for bookmark form * refactor: update primaryText class in TitleButton component * refactor: remove duplicate bookmarks and theming * refactor: update EditIcon component to use React.forwardRef * refactor: add _id field to tConversationTagSchema * refactor: remove promises * refactor: move mutation logic from BookmarkForm -> BookmarkEditDialog * refactor: update button class in BookmarkForm component * fix: conversation mutations and add better logging to useConversationTagMutation * refactor: update logger message in BookmarkEditDialog component * refactor: improve UI consistency in BookmarkNav and NewChat components * refactor: update logger message in BookmarkEditDialog component * refactor: Add tags prop to BookmarkForm component * refactor: Update BookmarkForm to avoid tag mutation if the tag already exists; also close dialog on submission programmatically * refactor: general role helper function to support updating access permissions for different permission types * refactor: Update getLatestText function to handle undefined values in message.content * refactor: Update useHasAccess hook to handle null role values for authenticated users * feat: toggle bookmarks access * refactor: Update PromptsCommand to handle access permissions for prompts * feat: updateConversationSelector * refactor: rename `vars` to `tagToDelete` for clarity * fix: prevent recreation of deleted tags in BookmarkMenu on Item Click * ci: mock updateBookmarksAccess function * ci: mock updateBookmarksAccess function
68 lines
1.7 KiB
TypeScript
68 lines
1.7 KiB
TypeScript
import { useState } from 'react';
|
|
import { MenuItem } from '@headlessui/react';
|
|
import { BookmarkFilledIcon, BookmarkIcon } from '@radix-ui/react-icons';
|
|
import type { FC } from 'react';
|
|
import { Spinner } from '~/components/svg';
|
|
import { cn } from '~/utils';
|
|
|
|
type MenuItemProps = {
|
|
tag: string | React.ReactNode;
|
|
selected: boolean;
|
|
count?: number;
|
|
handleSubmit: (tag?: string) => void;
|
|
icon?: React.ReactNode;
|
|
};
|
|
|
|
const BookmarkItem: FC<MenuItemProps> = ({ tag, selected, handleSubmit, icon, ...rest }) => {
|
|
const [isLoading, setIsLoading] = useState(false);
|
|
const clickHandler = async () => {
|
|
if (tag === 'New Bookmark') {
|
|
handleSubmit();
|
|
return;
|
|
}
|
|
|
|
setIsLoading(true);
|
|
handleSubmit(tag as string);
|
|
setIsLoading(false);
|
|
};
|
|
|
|
const breakWordStyle: React.CSSProperties = {
|
|
wordBreak: 'break-word',
|
|
overflowWrap: 'anywhere',
|
|
};
|
|
|
|
const renderIcon = () => {
|
|
if (icon != null) {
|
|
return icon;
|
|
}
|
|
if (isLoading) {
|
|
return <Spinner className="size-4" />;
|
|
}
|
|
if (selected) {
|
|
return <BookmarkFilledIcon className="size-4" />;
|
|
}
|
|
return <BookmarkIcon className="size-4" />;
|
|
};
|
|
|
|
return (
|
|
<MenuItem
|
|
aria-label={tag as string}
|
|
className={cn(
|
|
'group flex w-full gap-2 rounded-lg p-2.5 text-sm text-text-primary transition-colors duration-200',
|
|
selected ? 'bg-surface-hover' : 'data-[focus]:bg-surface-hover',
|
|
)}
|
|
{...rest}
|
|
as="button"
|
|
onClick={clickHandler}
|
|
>
|
|
<div className="flex grow items-center justify-between gap-2">
|
|
<div className="flex items-center gap-2">
|
|
{renderIcon()}
|
|
<div style={breakWordStyle}>{tag}</div>
|
|
</div>
|
|
</div>
|
|
</MenuItem>
|
|
);
|
|
};
|
|
|
|
export default BookmarkItem;
|