ClassroomCopilot/app
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

G1 surface homework in lesson planner UI

Browse Source
This commit is contained in:
kcar 2026-07-24 19:20:43 +01:00
parent c346493a34
commit 34ea1e3f08
8 changed files with 88 additions and 25 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

24
src/pages/timetable/LessonPlanDetailPage.tsx
View File

@ -39,6 +39,7 @@ interface LessonPlan {
year_group: string | null;
duration_minutes: number | null;
context_notes: string | null;
homework: string | null;
objectives: Objective[];
activities: Activity[];
is_public: boolean;
@ -88,6 +89,7 @@ const LessonPlanDetailPage: React.FC = () => {
const [yearGroup, setYearGroup] = useState('');
const [duration, setDuration] = useState('');
const [contextNotes, setContextNotes] = useState('');
const [homework, setHomework] = useState('');
const [isPublic, setIsPublic] = useState(false);
const [objectives, setObjectives] = useState<Objective[]>([]);
const [activities, setActivities] = useState<Activity[]>([]);
@ -110,6 +112,7 @@ const LessonPlanDetailPage: React.FC = () => {
setYearGroup(data.year_group || '');
setDuration(data.duration_minutes?.toString() || '');
setContextNotes(data.context_notes || '');
setHomework(data.homework || '');
setIsPublic(data.is_public || false);
setObjectives(data.objectives || []);
setActivities(data.activities || []);
@ -128,7 +131,7 @@ const LessonPlanDetailPage: React.FC = () => {
// ── Save ──────────────────────────────────────────────────────────────────
const save = useCallback(async (
overrides?: Partial<{ title: string; subject: string; year_group: string; duration_minutes: number | null; context_notes: string; is_public: boolean; objectives: Objective[]; activities: Activity[] }>
overrides?: Partial<{ title: string; subject: string; year_group: string; duration_minutes: number | null; context_notes: string; homework: string; is_public: boolean; objectives: Objective[]; activities: Activity[] }>
) => {
if (!accessToken || !planId) return;
setSaving(true);
@ -143,6 +146,7 @@ const LessonPlanDetailPage: React.FC = () => {
year_group: yearGroup || null,
duration_minutes: duration ? parseInt(duration, 10) : null,
context_notes: contextNotes || null,
homework: homework || '',
is_public: isPublic,
objectives,
activities,
@ -156,7 +160,7 @@ const LessonPlanDetailPage: React.FC = () => {
} finally {
setSaving(false);
}
}, [accessToken, planId, title, subject, yearGroup, duration, contextNotes, isPublic, objectives, activities]);
}, [accessToken, planId, title, subject, yearGroup, duration, contextNotes, homework, isPublic, objectives, activities]);
const scheduleAutoSave = useCallback(() => {
if (autoSaveTimer.current) clearTimeout(autoSaveTimer.current);
@ -359,6 +363,22 @@ const LessonPlanDetailPage: React.FC = () => {
/>
</Box>
{/* Homework */}
<Box sx={{ mb: 3 }}>
<Typography variant="subtitle2" fontWeight={600} sx={{ mb: 0.75 }}>
Homework
</Typography>
<TextField
value={homework}
onChange={e => { setHomework(e.target.value); scheduleAutoSave(); }}
multiline
minRows={2}
fullWidth
size="small"
placeholder="Homework to carry with this plan when assigned to a taught lesson…"
/>
</Box>
<Divider sx={{ mb: 3 }} />
{/* Objectives */}

2
src/pages/timetable/LessonPlansPage.tsx
View File

@ -21,6 +21,7 @@ interface PlanSummary {
duration_minutes: number | null;
objectives: { id: string; text: string; bloom_level?: string }[];
activities: { id: string; section: string; title: string }[];
homework: string | null;
is_public: boolean;
created_at: string;
updated_at: string;
@ -144,6 +145,7 @@ function PlanCard({ plan, onOpen, onDelete }: {
</Box>
<Typography variant="caption" color="text.secondary">
{objCount} objective{objCount !== 1 ? 's' : ''} · {actCount} activit{actCount !== 1 ? 'ies' : 'y'}
{plan.homework ? ' · homework set' : ''}
</Typography>
</CardContent>
<CardActions sx={{ pt: 0, px: 1.5, pb: 1.5, justifyContent: 'flex-end' }} onClick={e => e.stopPropagation()}>

6
src/pages/timetable/StudentLessonsPage.tsx
View File

@ -22,6 +22,7 @@ interface Lesson {
week_cycle: string;
day_of_week: string;
status: string;
homework: string | null;
teacher_name: string | null;
}
@ -95,6 +96,11 @@ function LessonCard({ lesson }: { lesson: Lesson }) {
sx={{ height: 16, fontSize: '0.65rem' }}
/>
</Box>
{lesson.homework && (
<Typography variant="caption" sx={{ color: 'primary.main', fontSize: '0.68rem', fontWeight: 600 }}>
Homework: {lesson.homework.length > 80 ? lesson.homework.slice(0, 80) + '…' : lesson.homework}
</Typography>
)}
{lesson.teacher_name && (
<Typography variant="caption" sx={{ color: 'text.secondary', fontSize: '0.68rem' }}>
{lesson.teacher_name}

24
src/pages/timetable/TaughtLessonsPage.tsx
View File

@ -30,6 +30,7 @@ interface Lesson {
day_of_week: string;
status: string;
lesson_plan: Record<string, any>;
homework: string | null;
notes: string | null;
whiteboard_room_id: string | null;
}
@ -76,16 +77,18 @@ const STATUS_COLORS: Record<string, 'default' | 'primary' | 'success' | 'error'
interface EditDialogProps {
lesson: Lesson | null;
onClose: () => void;
onSave: (id: string, updates: { notes?: string; status?: string }) => Promise<void>;
onSave: (id: string, updates: { homework?: string; notes?: string; status?: string }) => Promise<void>;
}
function LessonEditDialog({ lesson, onClose, onSave }: EditDialogProps) {
const [homework, setHomework] = useState('');
const [notes, setNotes] = useState('');
const [status, setStatus] = useState('planned');
const [saving, setSaving] = useState(false);
useEffect(() => {
if (lesson) {
setHomework(lesson.homework || '');
setNotes(lesson.notes || '');
setStatus(lesson.status || 'planned');
}
@ -94,7 +97,7 @@ function LessonEditDialog({ lesson, onClose, onSave }: EditDialogProps) {
const handleSave = async () => {
if (!lesson) return;
setSaving(true);
await onSave(lesson.id, { notes, status });
await onSave(lesson.id, { homework, notes, status });
setSaving(false);
onClose();
};
@ -127,6 +130,16 @@ function LessonEditDialog({ lesson, onClose, onSave }: EditDialogProps) {
<MenuItem value="substituted">Substituted</MenuItem>
</Select>
</FormControl>
<TextField
label="Homework"
value={homework}
onChange={e => setHomework(e.target.value)}
multiline
minRows={2}
fullWidth
size="small"
placeholder="Homework for this lesson…"
/>
<TextField
label="Notes"
value={notes}
@ -209,6 +222,11 @@ function LessonCard({ lesson, onEdit, onAssignPlan }: LessonCardProps) {
sx={{ height: 16, fontSize: '0.65rem' }}
/>
</Box>
{lesson.homework && (
<Typography variant="caption" sx={{ color: 'primary.main', fontSize: '0.68rem', fontWeight: 600, mt: 0.25 }}>
Homework: {lesson.homework.length > 80 ? lesson.homework.slice(0, 80) + '…' : lesson.homework}
</Typography>
)}
{lesson.notes && (
<Typography variant="caption" sx={{ color: 'text.secondary', fontSize: '0.68rem', fontStyle: 'italic', mt: 0.25 }}>
{lesson.notes.length > 80 ? lesson.notes.slice(0, 80) + '…' : lesson.notes}
@ -287,7 +305,7 @@ const TaughtLessonsPage: React.FC = () => {
}
};
const handleSaveLesson = async (id: string, updates: { notes?: string; status?: string }) => {
const handleSaveLesson = async (id: string, updates: { homework?: string; notes?: string; status?: string }) => {
if (!accessToken) return;
await fetch(`${API_BASE}/timetable/lessons/${id}`, {
method: 'PATCH',

44
src/utils/tldraw/cc-base/cc-graph/CCPlannedLessonNodeShapeUtil.tsx
View File

@ -29,106 +29,112 @@ export class CCPlannedLessonNodeShapeUtil extends CCBaseShapeUtil<CCPlannedLesso
renderContent = (shape: CCPlannedLessonNodeShape) => {
const styles = getNodeStyles(shape.type)
return (
<div style={styles.container}>
<NodeProperty
<NodeProperty
label="Subject Class"
value={shape.props.subject_class}
labelStyle={styles.property.label}
valueStyle={styles.property.value}
/>
<NodeProperty
<NodeProperty
label="Date"
value={shape.props.date}
labelStyle={styles.property.label}
valueStyle={styles.property.value}
/>
<NodeProperty
<NodeProperty
label="Start Time"
value={shape.props.start_time}
labelStyle={styles.property.label}
valueStyle={styles.property.value}
/>
<NodeProperty
<NodeProperty
label="End Time"
value={shape.props.end_time}
labelStyle={styles.property.label}
valueStyle={styles.property.value}
/>
<NodeProperty
<NodeProperty
label="Period Code"
value={shape.props.period_code}
labelStyle={styles.property.label}
valueStyle={styles.property.value}
/>
<NodeProperty
<NodeProperty
label="Year Group"
value={shape.props.year_group}
labelStyle={styles.property.label}
valueStyle={styles.property.value}
/>
<NodeProperty
<NodeProperty
label="Subject"
value={shape.props.subject}
labelStyle={styles.property.label}
valueStyle={styles.property.value}
/>
<NodeProperty
<NodeProperty
label="Teacher Code"
value={shape.props.teacher_code}
labelStyle={styles.property.label}
valueStyle={styles.property.value}
/>
<NodeProperty
<NodeProperty
label="Planning Status"
value={shape.props.planning_status}
labelStyle={styles.property.label}
valueStyle={styles.property.value}
/>
<NodeProperty
<NodeProperty
label="Homework"
value={shape.props.homework}
labelStyle={styles.property.label}
valueStyle={styles.property.value}
/>
<NodeProperty
label="Topic Code"
value={shape.props.topic_code}
labelStyle={styles.property.label}
valueStyle={styles.property.value}
/>
<NodeProperty
<NodeProperty
label="Topic Name"
value={shape.props.topic_name}
labelStyle={styles.property.label}
valueStyle={styles.property.value}
/>
<NodeProperty
<NodeProperty
label="Lesson Code"
value={shape.props.lesson_code}
labelStyle={styles.property.label}
valueStyle={styles.property.value}
/>
<NodeProperty
<NodeProperty
label="Lesson Name"
value={shape.props.lesson_name}
labelStyle={styles.property.label}
valueStyle={styles.property.value}
/>
<NodeProperty
<NodeProperty
label="Learning Statement Codes"
value={shape.props.learning_statement_codes}
labelStyle={styles.property.label}
valueStyle={styles.property.value}
/>
<NodeProperty
<NodeProperty
label="Learning Statements"
value={shape.props.learning_statements}
labelStyle={styles.property.label}
valueStyle={styles.property.value}
/>
<NodeProperty
<NodeProperty
label="Learning Resource Codes"
value={shape.props.learning_resource_codes}
labelStyle={styles.property.label}
valueStyle={styles.property.value}
/>
<NodeProperty
<NodeProperty
label="Learning Resources"
value={shape.props.learning_resources}
labelStyle={styles.property.label}
@ -137,4 +143,4 @@ export class CCPlannedLessonNodeShapeUtil extends CCBaseShapeUtil<CCPlannedLesso
</div>
)
}
}
}

10
src/utils/tldraw/cc-base/cc-graph/cc-graph-migrations.ts
View File

@ -5,7 +5,8 @@ import { CCGraphShape, GraphShapeType } from './cc-graph-types'
// Helper function to create version IDs for a shape type
const createVersions = (shapeType: GraphShapeType) => {
return createShapePropsMigrationIds(shapeType, {
Initial: 1 // All shapes start at version 1 as required by TLDraw
Initial: 1, // All shapes start at version 1 as required by TLDraw
AddPlannedLessonHomework: 2,
})
}
@ -21,6 +22,13 @@ const createMigrationSequence = (shapeType: GraphShapeType) => {
return props
},
},
...(shapeType === 'cc-planned-lesson-node' ? [{
id: versions.AddPlannedLessonHomework,
up: (props: CCGraphShape['props']) => ({
homework: '',
...props,
}),
}] : []),
],
})
}

2
src/utils/tldraw/cc-base/cc-graph/cc-graph-props.ts
View File

@ -199,6 +199,7 @@ export const ccGraphShapeProps = {
subject: T.string,
teacher_code: T.string,
planning_status: T.string,
homework: T.string,
topic_code: T.string,
topic_name: T.string,
lesson_code: T.string,
@ -560,6 +561,7 @@ export const getDefaultCCPlannedLessonNodeProps = () => ({
subject: '',
teacher_code: '',
planning_status: '',
homework: '',
topic_code: '',
topic_name: '',
lesson_code: '',

1
src/utils/tldraw/cc-base/cc-graph/cc-graph-types.ts
View File

@ -204,6 +204,7 @@ export type CCPlannedLessonNodeProps = CCGraphShapeProps & {
subject: string
teacher_code: string
planning_status: string
homework: string
topic_code: string
topic_name: string
lesson_code: string