@plteam/chat-ui/dist/views/leftContainer/ThreadRenameDialog.js

CUI Kit is a free and open-source library for creating AI assistant chat interfaces, built with React, Material UI, and TypeScript

import * as React from 'react';
import Dialog from '@mui/material/Dialog';
import DialogContent from '@mui/material/DialogContent';
import DialogTitle from '@mui/material/DialogTitle';
import DialogActions from '@mui/material/DialogActions';
import TextField from '@mui/material/TextField';
import { useObserverValue } from '../hooks/useObserverValue';
import { useHistoryContext } from '../core/history/HistoryContext';
const ThreadRenameDialog = () => {
    const { slots, slotProps, locale, internal, apiRef } = useHistoryContext();
    const renameItem = useObserverValue(internal?.model.renameItem);
    const [title, setTitle] = React.useState('');
    React.useEffect(() => {
        if (renameItem) {
            setTitle(renameItem.title);
        }
    }, [renameItem?.id]);
    const handleClose = () => {
        if (internal) {
            internal.model.renameItem.value = undefined;
        }
    };
    const handleSave = () => {
        const newTitle = title.trim();
        if (renameItem && newTitle && newTitle !== renameItem.title) {
            const oldTitle = renameItem.title;
            internal?.model.rename(renameItem.id, newTitle);
            apiRef.current?.onThreadRenamed?.({ thread: renameItem, oldTitle, newTitle });
        }
        handleClose();
    };
    const handleKeyDown = (e) => {
        if (e.key === 'Enter') {
            e.preventDefault();
            handleSave();
        }
    };
    return (React.createElement(Dialog, { fullWidth: true, maxWidth: "sm", open: !!renameItem, onClose: handleClose },
        React.createElement(DialogTitle, null, locale.threadRenameTitle),
        React.createElement(DialogContent, null,
            React.createElement(TextField, { autoFocus: true, fullWidth: true, label: locale.threadRenameLabel, margin: "dense", value: title, onChange: (e) => setTitle(e.target.value), onKeyDown: handleKeyDown })),
        React.createElement(DialogActions, null,
            React.createElement(slots.baseButton, { onClick: handleClose, ...slotProps.baseButton }, locale.cancel),
            React.createElement(slots.baseButton, { color: "primary", onClick: handleSave, ...slotProps.baseButton }, locale.save))));
};
export default ThreadRenameDialog;