// Retro CRT mode (read-only auto-typed pages)
const { useState: useStateR, useEffect: useEffectR, useRef: useRefR } = React;
function RetroMode({ tweaks }) {
const P = window.PORTFOLIO;
const [page, setPage] = useStateR(0);
const [now, setNow] = useStateR(new Date());
useEffectR(() => {
const i = setInterval(() => setNow(new Date()), 1000);
return () => clearInterval(i);
}, []);
const pages = [
{
title: "WHOAMI",
content: () => (
<>
{window.ASCII_PORTRAIT}
AAKASH JOSHI
// {P.role} — {P.location}
════════════════════════════════════════════════{"\n\n"}
{P.bio}{"\n\n"}
> tagline: {P.tagline}{"\n\n"}
════════════════════════════════════════════════{"\n"}
> status : AVAILABLE FOR HIRE{"\n"}
> clearance: PUBLIC{"\n"}
> node : pa-univ-01.tgm{"\n"}
)
},
{
title: "PROJECTS.LST",
content: () => (
// PROJECTS.LST
{P.projects.length} entries — sorted by recency
════════════════════════════════════════════════════════════════{"\n\n"}
{P.projects.map((p, i) => (
[{(i+1).toString().padStart(2,'0')}] {p.name} {p.tag} /{p.year}{"\n"}
{" "}{p.summary}{"\n"}
{" "}stack: {p.stack.join(" · ")}{"\n\n"}
))}
)
},
{
title: "SKILLS.MTX",
content: () => (
// SKILLS.MTX
proficiency matrix · auto-generated
════════════════════════════════════════════════════════════════{"\n\n"}
{P.skillsLevels.map(s => {
const filled = Math.round(s.level / 5);
const bar = "█".repeat(filled) + "░".repeat(20 - filled);
return (
{s.name}
[{bar}] {s.level}%
);
})}
{"\n"}
════════════════════════════════════════════════════════════════{"\n\n"}
{Object.entries(P.skills).map(([cat, items]) => (
[{cat}] {items.join(" · ")}{"\n\n"}
))}
)
},
{
title: "HISTORY.LOG",
content: () => (
// HISTORY.LOG
experience · education · certifications
════════════════════════════════════════════════════════════════{"\n\n"}
[ EXPERIENCE ]{"\n\n"}
{P.experience.map(e => (
{e.period} {e.role} @ {e.company}{"\n"}
{e.bullets.map((b,i) => ▶ {b}
)}
{"\n"}
))}
[ EDUCATION ]{"\n\n"}
{P.education.map(e => (
{e.period} {e.degree}{"\n"}
{" "}@ {e.school} — GPA {e.gpa}{"\n\n"}
))}
[ CERTIFICATIONS ]{"\n\n"}
{P.certs.map(c =>
✓ {c.name} [{c.status}]
)}
)
},
{
title: "POSTS.IDX",
content: () => (
// POSTS.IDX
{P.posts.length} entries — write-ups & notes
════════════════════════════════════════════════════════════════{"\n\n"}
{P.posts.map((p, i) => (
[{(i+1).toString().padStart(2,'0')}] {p.date} {p.title}{"\n"}
{" "}tag: {p.tag} read: {p.read}{"\n\n"}
))}
)
},
{
title: "CONTACT.SH",
content: () => (
// CONTACT.SH
secure channels open
════════════════════════════════════════════════════════════════{"\n\n"}
$ cat ./channels{"\n\n"}
github → github.com/Aakash1337{"\n"}
linkedin → linkedin · aakash-joshi{"\n"}
email → via linkedin{"\n"}
resume → ./resume.pdf [
download]{"\n\n"}
════════════════════════════════════════════════════════════════{"\n\n"}
$ echo "thanks for reading"{"\n"}
thanks for reading.{"\n\n"}
)
}
];
// Keyboard nav
useEffectR(() => {
const onKey = (e) => {
if (e.key === 'ArrowRight' || e.key === ' ' || e.key === 'PageDown') {
e.preventDefault();
setPage(p => Math.min(pages.length - 1, p + 1));
} else if (e.key === 'ArrowLeft' || e.key === 'PageUp') {
e.preventDefault();
setPage(p => Math.max(0, p - 1));
} else if (e.key >= '1' && e.key <= String(pages.length)) {
setPage(parseInt(e.key) - 1);
}
};
window.addEventListener('keydown', onKey);
return () => window.removeEventListener('keydown', onKey);
}, []);
const themeClass = tweaks.retroColor || 'amber';
return (
TGM-OS v4.2 // {pages[page].title}
{now.toISOString().slice(0,19).replace('T',' ')}
{pages[page].content()}
{(page+1).toString().padStart(2,'0')} / {pages.length.toString().padStart(2,'0')}
[← / →] [1-{pages.length}]
);
}
window.RetroMode = RetroMode;