Added delete confirmation
This commit is contained in:
parent
ddf6d996c4
commit
895589c235
@ -180,6 +180,7 @@ const App = () => {
|
||||
{...{
|
||||
type: "chat",
|
||||
prompt: "What would you like to know about James?",
|
||||
resetLabel: "chat",
|
||||
sessionId,
|
||||
connectionBase,
|
||||
setSnack,
|
||||
|
||||
@ -487,7 +487,7 @@ const Controls = ({ sessionId, setSnack, connectionBase }: ControlsParams) => {
|
||||
<SystemInfoComponent systemInfo={systemInfo} />
|
||||
</AccordionActions>
|
||||
</Accordion>
|
||||
<Button startIcon={<ResetIcon />} onClick={() => { reset(["history"], "History cleared."); }}>Clear Backstory History</Button>
|
||||
<Button startIcon={<ResetIcon />} onClick={() => { reset(["history"], "History cleared."); }}>Delete Backstory History</Button>
|
||||
<Button onClick={() => { reset(["rags", "tools", "system_prompt", "message_history_length"], "Default settings restored.") }}>Reset system prompt, tunables, and RAG to defaults</Button>
|
||||
</div>);
|
||||
}
|
||||
|
||||
@ -3,10 +3,8 @@ import TextField from '@mui/material/TextField';
|
||||
import Typography from '@mui/material/Typography';
|
||||
import Tooltip from '@mui/material/Tooltip';
|
||||
import Button from '@mui/material/Button';
|
||||
import IconButton from '@mui/material/IconButton';
|
||||
import Box from '@mui/material/Box';
|
||||
import SendIcon from '@mui/icons-material/Send';
|
||||
import ResetIcon from '@mui/icons-material/RestartAlt';
|
||||
import { SxProps, Theme } from '@mui/material';
|
||||
import PropagateLoader from "react-spinners/PropagateLoader";
|
||||
|
||||
@ -14,6 +12,7 @@ import { Message, MessageList, MessageData } from './Message';
|
||||
import { SetSnackType } from './Snack';
|
||||
import { ContextStatus } from './ContextStatus';
|
||||
import { useAutoScrollToBottom } from './AutoScroll';
|
||||
import { DeleteConfirmation } from './DeleteConfirmation';
|
||||
|
||||
import './Conversation.css';
|
||||
|
||||
@ -498,18 +497,10 @@ const Conversation = forwardRef<ConversationHandle, ConversationProps>(({
|
||||
}
|
||||
|
||||
<Box key="jobActions" sx={{ display: "flex", justifyContent: "center", flexDirection: "row" }}>
|
||||
<IconButton
|
||||
sx={{ display: "flex", margin: 'auto 0px' }}
|
||||
size="large"
|
||||
edge="start"
|
||||
color="inherit"
|
||||
disabled={sessionId === undefined || processingMessage !== undefined}
|
||||
onClick={() => { reset(); resetAction && resetAction(); }}
|
||||
>
|
||||
<Tooltip title={resetLabel || "Reset"} >
|
||||
<ResetIcon />
|
||||
</Tooltip>
|
||||
</IconButton>
|
||||
<DeleteConfirmation
|
||||
label={resetLabel || "all data"}
|
||||
disabled={sessionId === undefined || processingMessage !== undefined || filteredConversation.findIndex(m => m.role !== 'content') === -1}
|
||||
onDelete={() => { reset(); resetAction && resetAction(); }} />
|
||||
<Tooltip title={actionLabel || "Send"}>
|
||||
<span style={{ display: "flex", flexGrow: 1 }}>
|
||||
<Button
|
||||
|
||||
88
frontend/src/DeleteConfirmation.tsx
Normal file
88
frontend/src/DeleteConfirmation.tsx
Normal file
@ -0,0 +1,88 @@
|
||||
import React, { useState } from 'react';
|
||||
import {
|
||||
IconButton,
|
||||
Dialog,
|
||||
DialogActions,
|
||||
DialogContent,
|
||||
DialogContentText,
|
||||
DialogTitle,
|
||||
Button,
|
||||
useMediaQuery,
|
||||
Tooltip,
|
||||
} from '@mui/material';
|
||||
import { useTheme } from '@mui/material/styles';
|
||||
import ResetIcon from '@mui/icons-material/History';
|
||||
|
||||
interface DeleteConfirmationProps {
|
||||
onDelete: () => void,
|
||||
disabled?: boolean,
|
||||
label?: string,
|
||||
color?: "inherit" | "default" | "primary" | "secondary" | "error" | "info" | "success" | "warning" | undefined
|
||||
};
|
||||
|
||||
const DeleteConfirmation = (props : DeleteConfirmationProps) => {
|
||||
const { onDelete, disabled, label, color } = props;
|
||||
const [open, setOpen] = useState(false);
|
||||
const theme = useTheme();
|
||||
const fullScreen = useMediaQuery(theme.breakpoints.down('md'));
|
||||
|
||||
const handleClickOpen = () => {
|
||||
setOpen(true);
|
||||
};
|
||||
|
||||
const handleClose = () => {
|
||||
setOpen(false);
|
||||
};
|
||||
|
||||
const handleConfirmReset = () => {
|
||||
onDelete();
|
||||
setOpen(false);
|
||||
};
|
||||
|
||||
return (
|
||||
<>
|
||||
<Tooltip title={label ? `Reset ${label}` : "Reset"} >
|
||||
<IconButton
|
||||
aria-label="reset"
|
||||
onClick={handleClickOpen}
|
||||
color={ color || "inherit" }
|
||||
sx={{ display: "flex", margin: 'auto 0px' }}
|
||||
size="large"
|
||||
edge="start"
|
||||
disabled={disabled}
|
||||
>
|
||||
<ResetIcon />
|
||||
</IconButton>
|
||||
</Tooltip>
|
||||
|
||||
<Dialog
|
||||
fullScreen={fullScreen}
|
||||
open={open}
|
||||
onClose={handleClose}
|
||||
aria-labelledby="responsive-dialog-title"
|
||||
>
|
||||
<DialogTitle id="responsive-dialog-title">
|
||||
{"Confirm Reset"}
|
||||
</DialogTitle>
|
||||
<DialogContent>
|
||||
<DialogContentText>
|
||||
This action will permanently reset { label ? label.toLocaleLowerCase() : "all data" } without the ability to recover it.
|
||||
Are you sure you want to continue?
|
||||
</DialogContentText>
|
||||
</DialogContent>
|
||||
<DialogActions>
|
||||
<Button autoFocus onClick={handleClose}>
|
||||
Cancel
|
||||
</Button>
|
||||
<Button onClick={handleConfirmReset} color="error" variant="contained">
|
||||
Reset { label || "Everything" }
|
||||
</Button>
|
||||
</DialogActions>
|
||||
</Dialog>
|
||||
</>
|
||||
);
|
||||
}
|
||||
|
||||
export {
|
||||
DeleteConfirmation
|
||||
};
|
||||
@ -119,12 +119,6 @@ const ResumeBuilder: React.FC<ResumeBuilderProps> = ({
|
||||
setHasJobDescription(true);
|
||||
}
|
||||
|
||||
/* If there is more than one message, it is user: "...JOB_DESCRIPTION...", assistant: "...stored..."
|
||||
* which means a resume has been generated. */
|
||||
if (reduced.length > 1) {
|
||||
setHasResume(true);
|
||||
}
|
||||
|
||||
/* Filter out any messages which the server injected for state management */
|
||||
reduced = reduced.filter(m => m.display !== "hide");
|
||||
|
||||
@ -253,6 +247,7 @@ const ResumeBuilder: React.FC<ResumeBuilderProps> = ({
|
||||
actionLabel: "Generate Resume",
|
||||
prompt: "Paste a job description, then click Generate...",
|
||||
multiline: true,
|
||||
resetLabel: `job description${hasFacts ? ", resume, and fact check" : hasResume ? " and resume" : ""}`,
|
||||
messageFilter: filterJobDescriptionMessages,
|
||||
resetAction: resetJobDescription,
|
||||
onResponse: jobResponse,
|
||||
@ -269,6 +264,7 @@ const ResumeBuilder: React.FC<ResumeBuilderProps> = ({
|
||||
type: "job_description",
|
||||
actionLabel: "Send",
|
||||
prompt: "Ask a question about this job description...",
|
||||
resetLabel: `job description${hasFacts ? ", resume, and fact check" : hasResume ? " and resume" : ""}`,
|
||||
messageFilter: filterJobDescriptionMessages,
|
||||
defaultPrompts: jobDescriptionQuestions,
|
||||
resetAction: resetJobDescription,
|
||||
@ -279,7 +275,7 @@ const ResumeBuilder: React.FC<ResumeBuilderProps> = ({
|
||||
}}
|
||||
/>
|
||||
}
|
||||
}, [connectionBase, filterJobDescriptionMessages, hasJobDescription, sessionId, setSnack, jobResponse, resetJobDescription]);
|
||||
}, [connectionBase, filterJobDescriptionMessages, hasJobDescription, sessionId, setSnack, jobResponse, resetJobDescription, hasFacts, hasResume]);
|
||||
|
||||
/**
|
||||
* Renders the resume view with loading indicator
|
||||
@ -299,6 +295,7 @@ const ResumeBuilder: React.FC<ResumeBuilderProps> = ({
|
||||
actionLabel: "Fact Check",
|
||||
multiline: true,
|
||||
type: "resume",
|
||||
resetLabel: `job description${hasFacts ? ", resume, and fact check" : hasResume ? " and resume" : ""}`,
|
||||
messageFilter: filterResumeMessages,
|
||||
onResponse: resumeResponse,
|
||||
resetAction: resetResume,
|
||||
@ -314,6 +311,7 @@ const ResumeBuilder: React.FC<ResumeBuilderProps> = ({
|
||||
type: "resume",
|
||||
actionLabel: "Send",
|
||||
prompt: "Ask a question about this job resume...",
|
||||
resetLabel: `job description${hasFacts ? ", resume, and fact check" : hasResume ? " and resume" : ""}`,
|
||||
messageFilter: filterResumeMessages,
|
||||
defaultPrompts: resumeQuestions,
|
||||
resetAction: resetResume,
|
||||
@ -324,7 +322,7 @@ const ResumeBuilder: React.FC<ResumeBuilderProps> = ({
|
||||
}}
|
||||
/>
|
||||
}
|
||||
}, [connectionBase, filterResumeMessages, hasFacts, sessionId, setSnack, resumeResponse, resetResume]);
|
||||
}, [connectionBase, filterResumeMessages, hasFacts, sessionId, setSnack, resumeResponse, resetResume, hasResume]);
|
||||
|
||||
/**
|
||||
* Renders the fact check view
|
||||
@ -342,6 +340,7 @@ const ResumeBuilder: React.FC<ResumeBuilderProps> = ({
|
||||
type: "fact_check",
|
||||
actionLabel: "Send",
|
||||
prompt: "Ask a question about any discrepencies...",
|
||||
resetLabel: `job description${hasFacts ? ", resume, and fact check" : hasResume ? " and resume" : ""}`,
|
||||
messageFilter: filterFactsMessages,
|
||||
defaultPrompts: factsQuestions,
|
||||
resetAction: resetFacts,
|
||||
@ -351,7 +350,7 @@ const ResumeBuilder: React.FC<ResumeBuilderProps> = ({
|
||||
setSnack,
|
||||
}}
|
||||
/>
|
||||
}, [connectionBase, sessionId, setSnack, factsResponse, filterFactsMessages, resetFacts]);
|
||||
}, [connectionBase, sessionId, setSnack, factsResponse, filterFactsMessages, resetFacts, hasResume, hasFacts]);
|
||||
|
||||
/**
|
||||
* Gets the appropriate content based on active state for Desktop
|
||||
|
||||
@ -579,8 +579,8 @@ class WebServer:
|
||||
case "history":
|
||||
reset_map = {
|
||||
"job_description": ("job_description", "resume", "fact_check"),
|
||||
"resume": ("resume", "fact_check"),
|
||||
"fact_check": ("fact_check",),
|
||||
"resume": ("job_description", "resume", "fact_check"),
|
||||
"fact_check": ("job_description", "resume", "fact_check"),
|
||||
"chat": ("chat",),
|
||||
}
|
||||
resets = reset_map.get(session_type, ())
|
||||
|
||||
Loading…
x
Reference in New Issue
Block a user