Analysis worked!

This commit is contained in:
James Ketr 2025-06-05 16:27:18 -07:00
parent 1a13d41f28
commit b88949bb76

View File

@ -13,7 +13,8 @@ import {
Card,
CardContent,
useTheme,
LinearProgress
LinearProgress,
useMediaQuery
} from '@mui/material';
import ExpandMoreIcon from '@mui/icons-material/ExpandMore';
import CheckCircleIcon from '@mui/icons-material/CheckCircle';
@ -25,6 +26,8 @@ import { useAuth } from 'hooks/AuthContext';
import { BackstoryPageProps } from './BackstoryTab';
import { toCamelCase } from 'types/conversion';
import { Job } from 'types/types';
import { StyledMarkdown } from './StyledMarkdown';
import { Scrollable } from './Scrollable';
interface JobAnalysisProps extends BackstoryPageProps {
job: Job;
@ -40,8 +43,10 @@ const JobMatchAnalysis: React.FC<JobAnalysisProps> = (props: JobAnalysisProps) =
job,
candidate,
setSnack,
submitQuery
} = props
const { apiClient } = useAuth();
const backstoryProps = { setSnack, submitQuery };
const theme = useTheme();
const [requirements, setRequirements] = useState<{ requirement: string, domain: string }[]>([]);
const [skillMatches, setSkillMatches] = useState<SkillMatch[]>([]);
@ -51,6 +56,7 @@ const JobMatchAnalysis: React.FC<JobAnalysisProps> = (props: JobAnalysisProps) =
const [overallScore, setOverallScore] = useState<number>(0);
const [requirementsSession, setRequirementsSession] = useState<ChatSession | null>(null);
const [statusMessage, setStatusMessage] = useState<ChatMessage | null>(null);
const isMobile = useMediaQuery(theme.breakpoints.down('sm'));
// Handle accordion expansion
const handleAccordionChange = (panel: string) => (event: React.SyntheticEvent, isExpanded: boolean) => {
@ -299,24 +305,43 @@ const JobMatchAnalysis: React.FC<JobAnalysisProps> = (props: JobAnalysisProps) =
<Box>
<Paper elevation={3} sx={{ p: 3, mb: 4 }}>
<Grid container spacing={2}>
<Grid size={{ xs: 12 }} sx={{ textAlign: 'center', mb: 2 }}>
<Typography variant="h4" component="h1" gutterBottom>
Job Match Analysis
</Typography>
<Divider sx={{ mb: 2 }} />
</Grid>
<Grid size={{ xs: 12, md: 6 }}>
<Typography variant="h6" component="h2">
Job: {job.title}
</Typography>
</Grid>
<Grid size={{ xs: 12, md: 6 }}>
<Typography variant="h6" component="h2">
Candidate: {candidate.fullName}
</Typography>
</Grid>
<Box sx={{ display: "flex", flexDirection: isMobile ? "column" : "row" }}>
<Grid size={{ xs: 12, md: 6 }} sx={{ display: "flex", flexGrow: 1, flexDirection: "column" }}>
<Typography variant="h6" component="h2">
Company:
</Typography>
<Typography variant="body1" component="h2">
{job.company || "N/A"}
</Typography>
<Typography variant="h6" component="h2">
Job Title:
</Typography>
<Typography variant="body1" component="h2">
{job.title || "N/A"}
</Typography>
<Typography variant="h6" component="h2">
Backstory Job Summary:
</Typography>
<Typography variant="body1" component="h2">
{job.summary || "N/A"}
</Typography>
<Typography variant="caption">Job ID: {job.id}</Typography>
</Grid>
<Grid size={{ xs: 12, md: 6 }} sx={{ display: "flex", flexShrink: 1, flexDirection: "column" }}>
<Typography variant="h6" component="h2">
Job Description:
</Typography>
<Paper sx={{ p: 2, maxHeight: "22rem" }}>
<Scrollable sx={{ display: "flex", maxHeight: "100%" }}>
<StyledMarkdown content={job.description} {...backstoryProps} />
</Scrollable>
</Paper>
</Grid>
</Box>
<Grid size={{ xs: 12 }} sx={{ mt: 2 }}>
<Box sx={{ display: 'flex', alignItems: 'center', mb: 2 }}>