Proposed change
Current program end
2026-05-03
New program end
2026-09-01
+4 months · advisor-approved
I want preview. No change will be filed with SEVIS until you confirm.
Reset
Commit change →
Downstream effects
5 derived changes
{[
['Grace period', '60 days ends 2026-07-02', '60 days ends 2026-10-31', 'ok'],
['OPT earliest start', '2026-02-03 (90d before)', '2026-06-03 (shifted)', 'warn'],
['OPT latest start', '2026-08-02', '2026-11-30', 'ok'],
['SEVIS report', 'Program extension · due by 2026-05-03', 'Extended to 2026-09-01', 'info'],
['CPT eligibility', '4 CPT-eligible courses summer 2026', 'Remains eligible', 'ok'],
].map((r, i) => (
{r[0]}
{r[1]}
{r[2]}
{r[3] === 'ok' ? 'safe' : r[3] === 'warn' ? 'review' : 'report'}
))}
Risk signal impact
i20-expiring
cleared
+ new: opt-window-shift
);
}
// ---------- BATCH I-20 ----------
function BatchI20Mockup() {
const steps = ['Select', 'Review & sign', 'Generate PDFs', 'Ready for pickup'];
return (
{steps.map((s, i) => (
))}
45 students selected · pre-departure window · spring break 2026
Filter
Sign all 45 travel endorsements
|
Student |
Program |
Last signature |
Travel window |
Page 2 text |
Status |
{[
['Ming Chen', 'MS Computer Science', '2025-03-11', 'Mar 14 – Apr 4', '12-mo · OK', 'Signed · Ready'],
['Aditya Singh', 'PhD Chemistry', '2024-12-02', 'Mar 14 – Mar 28', '12-mo · OK', 'Signed · Ready'],
['Priya Iyer', 'MBA', '2025-04-18', 'Mar 15 – Mar 29', '12-mo · OK', 'Signed · Ready'],
['Jin Park', 'PhD Economics', '2025-02-07', 'Mar 16 – Apr 12', '12-mo · OK', 'Signed · Ready'],
['Liam O\'Brien', 'MS Data Science', '2024-09-14', 'Mar 14 – Mar 23', 'Expires mid-trip', 'Needs review'],
['Fatima Al-Sayed', 'PhD Biology', '2025-03-02', 'Mar 14 – Apr 3', '12-mo · OK', 'Signed · Ready'],
].map((r, i) => (
|
{r[0]} |
{r[1]} |
{r[2]} |
{r[3]} |
{r[4]} |
{r[5]} |
))}
Showing 6 of 45
Generated PDFs will be available in ~90s · audit-logged
);
}
// ---------- AUDIT TRAIL ----------
function AuditMockup() {
const rows = [
['2026-04-16 08:14:02', '10.24.19.88', 'P. Raman', 'Signed travel endorsement', 'Ming Chen · N0031290045'],
['2026-04-16 08:11:47', '10.24.19.88', 'P. Raman', 'Approved CPT', 'Rohan Mehta · N0038821104 · ECON 498'],
['2026-04-16 08:04:21', '10.24.19.88', 'P. Raman', 'Viewed student record', 'Yuki Tanaka · N0045612388'],
['2026-04-15 17:42:09', '10.24.19.44', 'M. Delacroix', 'Filed termination report', 'Jian Li · N0034567890 · unauthorized-employment'],
['2026-04-15 15:22:36', '10.24.19.44', 'M. Delacroix', 'Issued I-20', 'Sara Okonkwo · N0049110023 · Initial'],
['2026-04-15 14:18:02', '10.24.19.88', 'P. Raman', 'Batch signed 42 endorsements', 'Pre-departure spring 2026'],
['2026-04-15 11:03:58', '10.24.19.12', 'D. Watanabe', 'Updated program dates', 'Yuki Tanaka · N0045612388 · +4mo'],
['2026-04-14 16:31:14', '10.24.19.44', 'M. Delacroix', 'Auto-assigned to DSO queue', '12 new arrivals'],
];
return (
Filter · all DSOs
Range · last 30 days
Action · all
Export PDF
Export CSV
| Timestamp |
IP |
Actor |
Action |
Target |
{rows.map((r, i) => (
| {r[0]} |
{r[1]} |
{r[2]} |
{r[3]} |
{r[4]} |
))}
Showing 8 of 1,284 entries · AY 2025–26 · SHA-256 integrity verified
);
}
// ---------- NEW ARRIVALS ----------
function NewArrivalsMockup() {
return (
{[
['Issued', '214', 'I-20s'],
['In transit', '57', 'not yet arrived'],
['Arrived', '128', 'awaiting check-in'],
['Registered', '89', 'active in SEVIS'],
['Window open', '23', 'days remaining'],
].map(([l, n, s], i) => (
))}
Initial registration · 30-day federal window
Day 7 of 30
| Student | Program | Arrival | Check-in | SEVIS registered | Days left |
|---|
{[
['Sara Okonkwo', 'PhD Public Health', '2026-04-09', 'Complete', '—', 8, 'warn'],
['Takeshi Yamamoto', 'MS Civil Eng', '2026-04-10', 'Complete', 'Active', 0, 'ok'],
['Diya Chatterjee', 'PhD Physics', '2026-04-11', 'Complete', '—', 9, 'warn'],
['Lee Min-jun', 'MBA', '2026-04-12', 'Scheduled 04-17', '—', 11, ''],
['Ngozi Adebayo', 'MS Biotech', '2026-04-13', 'Complete', 'Active', 0, 'ok'],
['Raúl Vázquez', 'PhD History', '2026-04-14', 'No-show', '—', 4, 'crit'],
].map((r, i) => (
| {r[0]} |
{r[1]} |
{r[2]} |
{r[3]} |
{r[4]} |
{r[5] === 0 ? 'Registered' : `${r[5]}d`} |
))}
);
}
// ---------- REQUESTS INBOX ----------
function RequestsMockup() {
return (
All requests · 388 awaiting DSO
{[
['Rohan Mehta', 'CPT · Summer 2026', 'high', 'on', '2h'],
['Naledi Mokoena', 'STEM OPT extension', 'high', '', '4h'],
['Ming Chen', 'Travel signature', 'med', '', '1d'],
['Fatima Al-Sayed', 'Program extension', 'high', '', '1d'],
['Liam O\'Brien', 'Reduced course load', 'med', '', '2d'],
['Jin Park', 'Travel signature', 'low', '', '3d'],
].map((r, i) => (
{r[1]}
Submitted {r[4]} ago
))}
RM
Rohan Mehta · CPT request
MS Computer Science · submitted 2h ago · 3 documents attached
Priority
Employer · Grafton Capital, New York NY
Role · Quantitative Analyst Intern (Summer 2026)
Dates · 2026-05-19 → 2026-08-15 · 20hrs/wk academic year, 40hrs/wk summer
Course link · ECON 498 · Directed Research · Department confirmed
Summary: First CPT · eligible (completed 1 academic year) · offer letter, course syllabus, faculty advisor approval on file. Course map validates directly with ECON 498 spring-26 enrollment. Ready to authorize.
Approve and issue I-20
Request more info
Decline
);
}
function Mockup({ kind }) {
switch (kind) {
case 'overview': return
;
case 'sevis': return
;
case 'drawer': return
;
case 'whatif': return
;
case 'batch': return
;
case 'audit': return
;
case 'arrivals': return
;
case 'requests': return
;
default: return
;
}
}
const mockupStyleTag = () => ;
Object.assign(window, { Mockup, mockupStyleTag });