File size: 3,488 Bytes
f0743f4 | 1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 54 55 56 57 58 59 60 61 62 63 64 65 66 67 68 69 70 71 72 73 74 75 76 77 78 79 80 81 82 83 84 85 86 87 88 89 90 91 92 93 94 95 96 97 98 99 100 101 102 103 104 105 106 107 108 109 110 111 112 113 114 115 116 117 118 119 120 121 122 | import React, { useRef, Dispatch, SetStateAction } from 'react';
import { TConversationTag } from 'librechat-data-provider';
import { OGDialogTemplate, OGDialog, Button, Spinner, useToastContext } from '@librechat/client';
import { useConversationTagMutation } from '~/data-provider';
import { NotificationSeverity } from '~/common';
import BookmarkForm from './BookmarkForm';
import { useLocalize } from '~/hooks';
import { logger } from '~/utils';
type BookmarkEditDialogProps = {
open: boolean;
setOpen: Dispatch<SetStateAction<boolean>>;
tags?: string[];
setTags?: (tags: string[]) => void;
context: string;
bookmark?: TConversationTag;
conversationId?: string;
children?: React.ReactNode;
triggerRef?: React.RefObject<HTMLButtonElement>;
};
const BookmarkEditDialog = ({
open,
setOpen,
tags,
setTags,
context,
bookmark,
children,
triggerRef,
conversationId,
}: BookmarkEditDialogProps) => {
const localize = useLocalize();
const formRef = useRef<HTMLFormElement>(null);
const { showToast } = useToastContext();
const mutation = useConversationTagMutation({
context,
tag: bookmark?.tag,
options: {
onSuccess: (_data, vars) => {
showToast({
message: bookmark
? localize('com_ui_bookmarks_update_success')
: localize('com_ui_bookmarks_create_success'),
});
setOpen(false);
logger.log('tag_mutation', 'tags before setting', tags);
if (setTags && vars.addToConversation === true) {
const newTags = [...(tags || []), vars.tag].filter(
(tag) => tag !== undefined,
) as string[];
setTags(newTags);
logger.log('tag_mutation', 'tags after', newTags);
if (vars.tag == null || vars.tag === '') {
return;
}
setTimeout(() => {
const tagElement = document.getElementById(vars.tag ?? '');
console.log('tagElement', tagElement);
if (!tagElement) {
return;
}
tagElement.focus();
}, 5);
}
},
onError: () => {
showToast({
message: bookmark
? localize('com_ui_bookmarks_update_error')
: localize('com_ui_bookmarks_create_error'),
severity: NotificationSeverity.ERROR,
});
},
},
});
const handleSubmitForm = () => {
if (formRef.current) {
formRef.current.dispatchEvent(new Event('submit', { cancelable: true, bubbles: true }));
}
};
return (
<OGDialog open={open} onOpenChange={setOpen} triggerRef={triggerRef}>
{children}
<OGDialogTemplate
title={bookmark ? localize('com_ui_bookmarks_edit') : localize('com_ui_bookmarks_new')}
showCloseButton={false}
className="w-11/12 md:max-w-2xl"
main={
<BookmarkForm
tags={tags}
setOpen={setOpen}
mutation={mutation}
conversationId={conversationId}
bookmark={bookmark}
formRef={formRef}
/>
}
buttons={
<Button
variant="submit"
type="submit"
disabled={mutation.isLoading}
onClick={handleSubmitForm}
className="text-white"
>
{mutation.isLoading ? <Spinner /> : localize('com_ui_save')}
</Button>
}
/>
</OGDialog>
);
};
export default BookmarkEditDialog;
|