Integrated into UI. need mobile view for chatpage

This commit is contained in:
James Ketr 2025-05-29 16:58:14 -07:00
parent c2601bf17a
commit 89b71a1428
3 changed files with 153 additions and 151 deletions

View File

@ -16,6 +16,7 @@ interface CandidateInfoProps {
candidate: Candidate; candidate: Candidate;
sx?: SxProps; sx?: SxProps;
action?: string; action?: string;
elevation?: number;
}; };
const CandidateInfo: React.FC<CandidateInfoProps> = (props: CandidateInfoProps) => { const CandidateInfo: React.FC<CandidateInfoProps> = (props: CandidateInfoProps) => {
@ -23,7 +24,7 @@ const CandidateInfo: React.FC<CandidateInfoProps> = (props: CandidateInfoProps)
const { const {
sx, sx,
action = '', action = '',
...rest elevation = 1
} = props; } = props;
const theme = useTheme(); const theme = useTheme();
const isMobile = useMediaQuery(theme.breakpoints.down('md')); const isMobile = useMediaQuery(theme.breakpoints.down('md'));
@ -33,7 +34,7 @@ const CandidateInfo: React.FC<CandidateInfoProps> = (props: CandidateInfoProps)
} }
return ( return (
<Card <Card
elevation={1} elevation={elevation}
sx={{ sx={{
display: "flex", display: "flex",
borderColor: 'transparent', borderColor: 'transparent',

View File

@ -25,9 +25,11 @@ import { Message } from 'components/Message';
import { DeleteConfirmation } from 'components/DeleteConfirmation'; import { DeleteConfirmation } from 'components/DeleteConfirmation';
import { CandidateSessionsResponse } from 'services/api-client'; import { CandidateSessionsResponse } from 'services/api-client';
import { CandidateInfo } from 'components/CandidateInfo'; import { CandidateInfo } from 'components/CandidateInfo';
import { useNavigate } from 'react-router-dom';
const CandidateChatPage = forwardRef<ConversationHandle, BackstoryPageProps>((props: BackstoryPageProps, ref) => { const CandidateChatPage = forwardRef<ConversationHandle, BackstoryPageProps>((props: BackstoryPageProps, ref) => {
const { apiClient, candidate } = useUser(); const { apiClient, candidate } = useUser();
const navigate = useNavigate();
const { const {
setSnack, setSnack,
submitQuery, submitQuery,
@ -150,14 +152,17 @@ const CandidateChatPage = forwardRef<ConversationHandle, BackstoryPageProps>((pr
} }
}, [chatSession]); }, [chatSession]);
return ( if (!candidate) {
<Box ref={ref} sx={{ width: "100%" }}> navigate('/find-a-candidate');
{ candidate && <CandidateInfo candidate={candidate} /> } }
<Grid container spacing={3}> return (
<Box ref={ref} sx={{ width: "100%", height: "100%", display: "flex", flexGrow: 1, flexDirection: "column" }}>
{candidate && <CandidateInfo elevation={4} candidate={candidate} sx={{ minHeight: "max-content" }} />}
< Box sx={{ display: "flex", mt: 1, gap: 1, height: "100%" }}>
{/* Sessions Sidebar */} {/* Sessions Sidebar */}
<Grid size={{ xs: 12, md: 4 }}> <Paper sx={{ p: 2, height: '100%', display: 'flex', flexDirection: 'column' }}>
<Paper sx={{ p: 2, height: '600px', display: 'flex', flexDirection: 'column' }}>
<Typography variant="h6" gutterBottom> <Typography variant="h6" gutterBottom>
Chat Sessions Chat Sessions
{sessions && ( {sessions && (
@ -181,7 +186,7 @@ const CandidateChatPage = forwardRef<ConversationHandle, BackstoryPageProps>((pr
<Box sx={{ flexGrow: 1, overflow: 'auto' }}> <Box sx={{ flexGrow: 1, overflow: 'auto' }}>
{sessions ? ( {sessions ? (
<List> <List>
{sessions.sessions.data.map((session : any) => ( {sessions.sessions.data.map((session: any) => (
<ListItem <ListItem
key={session.id} key={session.id}
// selected={chatSession?.id === session.id} // selected={chatSession?.id === session.id}
@ -225,11 +230,9 @@ const CandidateChatPage = forwardRef<ConversationHandle, BackstoryPageProps>((pr
</Box> </Box>
)} )}
</Paper> </Paper>
</Grid>
{/* Chat Interface */} {/* Chat Interface */}
<Grid size={{ xs: 12, md: 8 }}> <Paper sx={{ display: 'flex', flexDirection: 'column', flexGrow: 1 }}>
<Paper sx={{ height: '600px', display: 'flex', flexDirection: 'column' }}>
{chatSession?.id ? ( {chatSession?.id ? (
<> <>
{/* Messages Area */} {/* Messages Area */}
@ -308,8 +311,7 @@ const CandidateChatPage = forwardRef<ConversationHandle, BackstoryPageProps>((pr
</Box> </Box>
)} )}
</Paper> </Paper>
</Grid> </Box>
</Grid>
</Box> </Box>
); );
}); });

View File

@ -47,7 +47,6 @@ DO NOT make up a URL for an image or provide markdown syntax for embedding an im
Always use tools, <|resume|>, and <|context|> when possible. Be concise, and never make up information. If you do not know the answer, say so. Always use tools, <|resume|>, and <|context|> when possible. Be concise, and never make up information. If you do not know the answer, say so.
""" """
class CandidateChat(Agent): class CandidateChat(Agent):
""" """
CandidateChat Agent CandidateChat Agent