Add organizations, research groups and repo stats to projects

content/desktop.json

@@ -16,6 +16,7 @@
 				{ "label": "portfolio", "icon": "ph:briefcase-duotone", "open": { "page": "/portfolio" } },
 				{ "label": "projects", "icon": "ph:folder-open-duotone", "open": { "page": "/projects" } },
 				{ "label": "hackathons", "icon": "ph:trophy-duotone", "open": { "page": "/projects/hackathons" } },
+				{ "label": "research", "icon": "ph:microscope-duotone", "open": { "page": "/projects/research" } },
 				{ "label": "blog", "icon": "ph:notebook-duotone", "open": { "page": "/blog" } },
 				{ "label": "links", "icon": "ph:qr-code-duotone", "open": { "page": "/links" } }
 			]

content/projects/hackathons.json

@@ -37,10 +37,17 @@
 		"description": "A sustainability platform that helps users detect and report greenwashing, misleading environmental claims made by companies and products.",
 		"image": "/img/hoya26.png",
 		"tags": ["Svelte", "TypeScript", "Python", "Flask", "Tailwind", "Sustainability"],
-		"featured": true,
 		"event": { "name": "HoyaHax 2026", "university": "Georgetown University", "location": "Washington, D.C.", "year": "2026" },
 		"links": { "demo": "https://ethix.sirblob.co/", "code": "https://github.com/SirBlobby/Hoya26", "devpost": "https://devpost.com/software/ethix" }
 	},
+	{
+		"name": "groSharey",
+		"description": "Split grocery costs with your roommates: scan a receipt, let AI assign each item to whoever asked for it, and everyone sees exactly what they owe, with Venmo and PayPal payments and email reminders.",
+		"image": "/hacks/grosharey.png",
+		"tags": ["React", "TypeScript", "Expo", "Flask", "Python", "MongoDB", "Gemini", "ElevenLabs"],
+		"event": { "name": "Technica 2026", "university": "University of Maryland", "location": "College Park, MD", "year": "2026" },
+		"links": { "demo": "https://grosharey-frontend.vercel.app/", "code": "https://github.com/SirBlobby/GroSharey", "devpost": "https://devpost.com/software/cool_project" }
+	},
 	{
 		"name": "Food Decisive",
 		"description": "Ever felt the indecisiveness of choosing what to eat? Don't fret! Decide your next bite with Food Decisive.",
@@ -61,6 +68,7 @@
 	{
 		"name": "Fauxcall",
 		"description": "This product is perfect for situations where you are walking at night and you feel unsafe from someone. Fauxcall lets users create a convincing fake phone call to deter potential attackers and provide a quick escape mechanism.",
+		"image": "/hacks/fauxcall.png",
 		"tags": ["MongoDB", "Next.js", "Python", "React", "Sesame", "Skeleton", "Twilio"],
 		"event": { "name": "HooHacks 2025", "university": "University of Virginia", "location": "Charlottesville, VA", "year": "2025" },
 		"links": { "code": "https://github.com/SirBlobby/HooHacks-12", "devpost": "https://devpost.com/software/fauxcall" }

content/projects/opensource.json

@@ -6,8 +6,8 @@
 		"period": "2026 – Present",
 		"featured": true,
 		"tags": ["Rust", "SvelteKit", "Yjs", "Typst", "Self-Hosted"],
-		"image": "/projects/typstdrive.png",
+		"image": "/projects/typstdrive-editor.png",
-		"links": { "code": "https://github.com/SirBlobby/TypstDrive" }
+		"links": { "code": "https://github.com/SirBlobby/TypstDrive", "docs": "https://sirblobby.github.io/TypstDrive/" }
 	},
 	{
 		"name": "Typst Desktop",
@@ -23,14 +23,12 @@
 		"name": "Pkit",
 		"description": "CLI toolkit and utilities (Rust project), a small developer-focused CLI.",
 		"tags": ["Rust", "CLI"],
-		"image": "https://icons.veryicon.com/png/o/business/vscode-program-item-icon/rust-1.png",
 		"links": { "code": "https://github.com/dead-projects-inc/pkit-cli", "demo": "https://pkit.sirblob.co/" }
 	},
 	{
 		"name": "OBookLLM",
 		"description": "OBookLLM is a powerful, self-hosted, offline-capable alternative to NotebookLLM.",
 		"tags": ["Python", "LLM", "AI", "NotebookLLM"],
-		"image": "https://upload.wikimedia.org/wikipedia/commons/c/c3/Python-logo-notext.svg",
 		"links": { "code": "https://github.com/SirBlobby/OBookLLM" }
 	}
 ]

content/projects/organizations.json

@@ -0,0 +1,28 @@
+[
+	{
+		"name": "ARC - Autonomous Robotics Club",
+		"organization": "Secretary of ARC · Team Lead of the RAVC Team",
+		"description": "George Mason University's Autonomous Robotics Club, where members pick a project and build autonomous robots as a team, no experience required. Won the 2026 Raytheon Autonomous Vehicle Competition with a drone that launches from and lands on a moving ground vehicle, navigating with visual-inertial odometry (VIO) instead of GPS.",
+		"tags": ["Robotics", "Autonomous Vehicles", "Drones", "VIO", "Student Organization"],
+		"featured": true,
+		"awards": [{ "track": "2026 Raytheon Autonomous Vehicle Competition", "place": "1st Place" }],
+		"gallery": ["/organizations/arc-1.jpg", "/organizations/arc-2.jpg", "/organizations/arc-3.jpg"],
+		"links": {
+			"website": "https://gmu.autonomousrobotics.club/",
+			"article": "https://www.gmu.edu/news/2026-05/george-mason-students-fly-first-place-no-gps-no-grade-and-almost-no-problems"
+		},
+		"socials": [
+			{ "name": "GitHub", "icon": "mdi:github", "url": "https://github.com/ARC-GMU" },
+			{ "name": "Instagram", "icon": "mdi:instagram", "url": "https://www.instagram.com/arc.gmu/" },
+			{ "name": "LinkedIn", "icon": "mdi:linkedin", "url": "https://www.linkedin.com/company/arcgmu/" },
+			{ "name": "CREATE Lab", "icon": "ph:flask-duotone", "url": "https://create.autonomousrobotics.club/projects/autonomous-robotics-club" }
+		]
+	},
+	{
+		"name": "GMU Minecraft Club",
+		"organization": "President",
+		"description": "George Mason University's Minecraft club, bringing students together to play, build, and run community servers.",
+		"tags": ["Minecraft", "Community", "Gaming"],
+		"links": { "website": "https://gmmc.club/" }
+	}
+]

content/projects/packages.json

@@ -4,18 +4,18 @@
 		"description": "Selenium automation utilities for MCP workflows, packaged for reuse.",
 		"tags": ["TypeScript", "Selenium"],
 		"featured": true,
-		"links": { "package": "https://www.npmjs.com/package/@sirblob/mcp-selenium" }
+		"links": { "package": "https://www.npmjs.com/package/@sirblob/mcp-selenium", "code": "https://github.com/SirBlobby/mcp-selenium" }
 	},
 	{
 		"name": "PokemonTCGAPI",
 		"description": "Unofficial NPM package wrapper for the PokemonTCG API.",
 		"tags": ["TypeScript", "Node.js"],
-		"links": { "package": "https://www.npmjs.com/package/@bosstop/pokemontcgapi" }
+		"links": { "package": "https://www.npmjs.com/package/@bosstop/pokemontcgapi", "code": "https://github.com/SirBlobby/PokemonTCGAPI" }
 	},
 	{
 		"name": "MCSS TS API",
 		"description": "TypeScript API for MC Server Soft services, published to NPM.",
 		"tags": ["TypeScript", "Node.js"],
-		"links": { "package": "https://www.npmjs.com/package/@mcserversoft/mcss-api" }
+		"links": { "package": "https://www.npmjs.com/package/@mcserversoft/mcss-api", "code": "https://github.com/mcserversoft-community/mcss-api-js" }
 	}
 ]

content/projects/research.json

@@ -1,14 +1,31 @@
 [
 	{
-		"name": "Astroswarm",
+		"name": "Autonomous Swarm Robotics Center",
-		"organization": "CREATE Lab",
+		"shortName": "ASRC",
+		"lab": { "name": "CREATE Lab", "url": "https://create.autonomousrobotics.club/" },
+		"institution": "George Mason University",
+		"role": "Undergraduate Research Assistant",
 		"period": "May 2026 – Present",
-		"description": "A visual coding game that turns swarm control into a playable simulator, generating trial data at scale on which algorithms best defend a target. Part of a research program on controlling robot fleets with one operator.",
+		"description": "Research group working on swarm robotics, with a focus on emergent behaviors and controlling robot fleets with one operator.",
+		"focus": ["Swarm Robotics", "Emergent Behavior", "Multi-Robot Control", "ROS"],
+		"links": [
+			{ "label": "CREATE Lab", "url": "https://create.autonomousrobotics.club/" },
+			{ "label": "GitHub", "url": "https://github.com/GMU-ASRC" },
+			{ "label": "My Profile", "url": "https://create.autonomousrobotics.club/team/gagan-manjunatha" }
+		],
+		"projects": [
+			{
+				"name": "Astroswarm",
+				"period": "May 2026 – Present",
+				"description": "A visual coding game that turns swarm control into a playable simulator, generating trial data at scale on which algorithms best defend a target.",
 				"tags": ["Python", "ROS", "Swarm Robotics"],
 				"featured": true,
 				"links": {
 					"demo": "https://astroswarm.autonomousrobotics.club/",
+					"code": "https://github.com/GMU-ASRC/astro-swarm",
 					"article": "https://cec.gmu.edu/news/2026-07/new-art-herding-robots"
 				}
 			}
 		]
+	}
+]

src/lib/components/projects/ProjectEntry.svelte

@@ -1,16 +1,28 @@
 <script lang="ts">
 	import Icon from '@iconify/svelte';
 	import type { Project, ProjectCategory } from '#lib/content';
+	import type { RepoStats } from '#lib/github/types';
 	import LinkButton from '#lib/components/ui/LinkButton.svelte';
 	import Tag from '#lib/components/ui/Tag.svelte';
 
-	let { project, category }: { project: Project; category: ProjectCategory } = $props();
+	let {
+		project,
+		category,
+		repoStats,
+		downloads
+	}: { project: Project; category: ProjectCategory; repoStats?: RepoStats; downloads?: number } = $props();
+
+	const downloadsLabel = $derived(
+		downloads === undefined ? '' : new Intl.NumberFormat('en-US', { notation: 'compact' }).format(downloads)
+	);
 
 	const linkButtons = $derived(
 		[
+			{ href: project.links.website, label: 'Website', icon: 'mdi:web' },
 			{ href: project.links.demo, label: 'View Demo', icon: 'mdi:open-in-new' },
 			{ href: project.links.package, label: 'View Package', icon: 'mdi:package-variant' },
 			{ href: project.links.code, label: 'View Code', icon: 'mdi:github' },
+			{ href: project.links.docs, label: 'Docs', icon: 'mdi:book-open-page-variant-outline' },
 			{ href: project.links.devpost, label: 'Devpost', icon: 'simple-icons:devpost' },
 			{ href: project.links.article, label: 'Article', icon: 'mdi:newspaper-variant-outline' }
 		].filter((button) => button.href)
@@ -33,6 +45,28 @@
 			{#if project.version}
 				<span class="badge version">v{project.version}</span>
 			{/if}
+			{#if repoStats && project.links.code}
+				<a class="repo-stat stars" href="{project.links.code}/stargazers" target="_blank" rel="noopener noreferrer" title="GitHub stars">
+					<Icon icon="mdi:star-outline" width="15" />
+					{repoStats.stars}
+				</a>
+				<a class="repo-stat forks" href="{project.links.code}/forks" target="_blank" rel="noopener noreferrer" title="GitHub forks">
+					<Icon icon="mdi:source-fork" width="15" />
+					{repoStats.forks}
+				</a>
+			{/if}
+			{#if downloads !== undefined && project.links.package}
+				<a
+					class="repo-stat downloads"
+					href={project.links.package}
+					target="_blank"
+					rel="noopener noreferrer"
+					title="{downloads.toLocaleString('en-US')} npm downloads"
+				>
+					<Icon icon="mdi:download" width="15" />
+					{downloadsLabel}
+				</a>
+			{/if}
 		</div>
 
 		{#if project.event}
@@ -78,10 +112,82 @@
 				{/each}
 			</div>
 		{/if}
+
+		{#if project.gallery?.length}
+			<div class="gallery" data-image-group>
+				{#each project.gallery as photo, index (photo)}
+					<a class="gallery-item" href={photo} target="_blank" rel="noopener noreferrer">
+						<img src={photo} alt="{project.name} photo {index + 1}" loading="lazy" />
+					</a>
+				{/each}
+			</div>
+		{/if}
+
+		{#if project.socials?.length}
+			<div class="socials">
+				{#each project.socials as social (social.url)}
+					<a class="social" href={social.url} target="_blank" rel="noopener noreferrer" title={social.name}>
+						<Icon icon={social.icon} width="16" />
+						<span>{social.name}</span>
+					</a>
+				{/each}
+			</div>
+		{/if}
 	</div>
 </article>
 
 <style>
+	.gallery {
+		display: grid;
+		grid-template-columns: repeat(auto-fill, minmax(140px, 1fr));
+		gap: 0.5rem;
+		max-width: 640px;
+		margin-top: 0.4rem;
+	}
+
+	.gallery-item {
+		display: block;
+		aspect-ratio: 4 / 3;
+		overflow: hidden;
+		border: 1px solid color-mix(in srgb, var(--foreground) 20%, transparent);
+		transition: border-color 0.15s ease;
+	}
+
+	.gallery-item:hover {
+		border-color: var(--accent);
+	}
+
+	.gallery-item img {
+		display: block;
+		width: 100%;
+		height: 100%;
+		object-fit: cover;
+		transition: transform 0.3s ease;
+	}
+
+	.gallery-item:hover img {
+		transform: scale(1.05);
+	}
+
+	.socials {
+		display: flex;
+		flex-wrap: wrap;
+		gap: 0.25rem 0.9rem;
+		margin-top: 0.2rem;
+	}
+
+	.social {
+		display: inline-flex;
+		align-items: center;
+		gap: 0.3rem;
+		color: var(--muted);
+		font-size: 0.8rem;
+	}
+
+	.social:hover {
+		color: var(--accent);
+	}
+
 	.project-entry {
 		display: grid;
 		grid-template-columns: 1fr;
@@ -153,6 +259,31 @@
 		background: var(--blue);
 	}
 
+	.repo-stat {
+		display: inline-flex;
+		align-items: center;
+		gap: 0.25rem;
+		padding: 0 0.45rem;
+		border: 1px solid color-mix(in srgb, var(--foreground) 25%, transparent);
+		font-size: 0.75rem;
+	}
+
+	.repo-stat.stars {
+		color: var(--yellow);
+	}
+
+	.repo-stat.forks {
+		color: var(--cyan);
+	}
+
+	.repo-stat.downloads {
+		color: var(--green);
+	}
+
+	.repo-stat:hover {
+		border-color: currentColor;
+	}
+
 	.event {
 		color: var(--blue);
 	}

src/lib/components/projects/ProjectNav.svelte

@@ -2,7 +2,7 @@
 	import { page } from '$app/state';
 	import { projectCategories } from '#lib/content';
 
-	const chipColors = ['magenta', 'orange', 'green', 'cyan'];
+	const chipColors = ['magenta', 'orange', 'green', 'cyan', 'yellow'];
 </script>
 
 <nav class="project-nav">

src/lib/components/research/ResearchGroup.svelte

@@ -0,0 +1,163 @@
+<script lang="ts">
+	import Icon from '@iconify/svelte';
+	import type { ProjectCategory, ResearchGroup } from '#lib/content';
+	import LinkButton from '#lib/components/ui/LinkButton.svelte';
+	import Tag from '#lib/components/ui/Tag.svelte';
+	import ProjectEntry from '#lib/components/projects/ProjectEntry.svelte';
+
+	let { group, category }: { group: ResearchGroup; category: ProjectCategory } = $props();
+
+	const linkIcons: Record<string, string> = {
+		GitHub: 'mdi:github',
+		'My Profile': 'mdi:account-circle-outline'
+	};
+</script>
+
+<section class="research-group">
+	<h2 class="group-title">{group.name}</h2>
+
+	<div class="path">
+		<span class="muted">~/</span>{group.institution}<span class="muted">/</span><a
+			href={group.lab.url}
+			target="_blank"
+			rel="noopener noreferrer">{group.lab.name}</a
+		><span class="muted">/</span><span class="current">{group.shortName}</span>
+	</div>
+
+	<div class="group-body">
+		<div class="badges">
+			<span class="badge group"><Icon icon={category.icon} width="15" /> Research Group</span>
+			<span class="badge short-name">{group.shortName}</span>
+		</div>
+
+		<div class="role">{group.role}</div>
+		<div class="muted">{group.period}</div>
+
+		<p>{group.description}</p>
+
+		<div class="tags">
+			{#each group.focus as area, index (area)}
+				<Tag label={area} colorIndex={index} />
+			{/each}
+		</div>
+
+		<div class="buttons">
+			{#each group.links as link (link.url)}
+				<LinkButton href={link.url} icon={linkIcons[link.label] ?? 'mdi:open-in-new'}>{link.label}</LinkButton>
+			{/each}
+		</div>
+	</div>
+
+	<div class="tree-label">
+		<span class="muted">$</span> ls ~/research/{group.shortName.toLowerCase()}/projects
+	</div>
+
+	<div class="project-tree">
+		{#each group.projects as project, index (project.name)}
+			<div class="tree-item">
+				<span class="branch">{index === group.projects.length - 1 ? '└──' : '├──'}</span>
+				<div class="tree-entry">
+					<ProjectEntry {project} {category} />
+				</div>
+			</div>
+		{/each}
+	</div>
+</section>
+
+<style>
+	.research-group {
+		padding: 1rem 0 1.5rem;
+		border-top: 1px dashed color-mix(in srgb, var(--foreground) 25%, transparent);
+	}
+
+	.group-title {
+		margin: 0;
+		color: var(--accent);
+		font-size: 1.1rem;
+		text-transform: uppercase;
+		letter-spacing: 0.05em;
+	}
+
+	.path {
+		margin: 0.25rem 0 0.75rem;
+		font-size: 0.85rem;
+	}
+
+	.path a {
+		color: var(--blue);
+	}
+
+	.path a:hover {
+		text-decoration: underline;
+	}
+
+	.current {
+		color: var(--green);
+	}
+
+	.group-body {
+		display: flex;
+		flex-direction: column;
+		gap: 0.4rem;
+	}
+
+	.badges,
+	.tags,
+	.buttons {
+		display: flex;
+		flex-wrap: wrap;
+		gap: 0.4rem;
+	}
+
+	.buttons {
+		margin-top: 0.4rem;
+	}
+
+	.badge {
+		display: inline-flex;
+		align-items: center;
+		gap: 0.3rem;
+		padding: 0 0.45rem;
+		color: var(--background);
+		font-size: 0.75rem;
+		font-weight: 700;
+		text-transform: uppercase;
+	}
+
+	.badge.group {
+		background: var(--green);
+	}
+
+	.badge.short-name {
+		background: var(--magenta);
+	}
+
+	.role {
+		color: var(--blue);
+	}
+
+	p {
+		margin: 0;
+	}
+
+	.tree-label {
+		margin: 1.5rem 0 0.25rem;
+		color: var(--foreground);
+	}
+
+	.tree-item {
+		display: grid;
+		grid-template-columns: auto 1fr;
+		gap: 0.5rem;
+	}
+
+	.branch {
+		padding-top: 1rem;
+		color: var(--muted);
+		white-space: pre;
+	}
+
+	.tree-entry {
+		min-width: 0;
+	}
+</style>

src/lib/content/index.ts

@@ -4,20 +4,24 @@ import leadershipData from '#content/leadership.json';
 import aboutData from '#content/about.json';
 import desktopData from '#content/desktop.json';
 import blogData from '#content/blog.json';
+import musicData from '#content/music.json';
 import openSourceData from '#content/projects/opensource.json';
 import packagesData from '#content/projects/packages.json';
 import hackathonsData from '#content/projects/hackathons.json';
 import researchData from '#content/projects/research.json';
+import organizationsData from '#content/projects/organizations.json';
 import type {
 	AboutContent,
 	BlogSettings,
 	DesktopContent,
 	Experience,
 	Leadership,
+	Playlist,
 	Profile,
 	Project,
 	ProjectCategory,
-	ProjectCategoryId
+	ProjectCategoryId,
+	ResearchGroup
 } from './types';
 
 export type * from './types';
@@ -28,6 +32,8 @@ export const leadership: Leadership[] = leadershipData;
 export const about: AboutContent = aboutData;
 export const desktop: DesktopContent = desktopData;
 export const blogSettings: BlogSettings = blogData;
+export const playlist: Playlist = musicData;
+export const researchGroups: ResearchGroup[] = researchData;
 
 function featuredFirst(projects: Project[]): Project[] {
 	return [...projects].sort((first, second) => Number(!!second.featured) - Number(!!first.featured));
@@ -60,7 +66,18 @@ export const projectCategories: ProjectCategory[] = [
 		title: 'Research',
 		icon: 'ph:microscope-duotone',
 		summary: 'Research roles, projects, and publications.',
-		projects: featuredFirst(researchData)
+		projects: featuredFirst(
+			researchGroups.flatMap((group) =>
+				group.projects.map((project) => ({ ...project, organization: project.organization ?? group.shortName }))
+			)
+		)
+	},
+	{
+		id: 'organizations',
+		title: 'Organizations',
+		icon: 'ph:users-three-duotone',
+		summary: 'Clubs and teams I lead and help run.',
+		projects: featuredFirst(organizationsData)
 	}
 ];
 

src/lib/content/types.ts

@@ -18,6 +18,7 @@ export interface Profile {
 	title: string;
 	email: string;
 	avatar: string;
+	photo?: string;
 	bio: string;
 	tagline: string;
 	education: Education;
@@ -55,6 +56,8 @@ export interface ProjectLinks {
 	devpost?: string;
 	package?: string;
 	article?: string;
+	docs?: string;
+	website?: string;
 }
 
 export interface HackathonEvent {
@@ -82,9 +85,29 @@ export interface Project {
 	event?: HackathonEvent;
 	awards?: Award[];
 	demoMayBeOffline?: boolean;
+	socials?: Social[];
+	gallery?: string[];
 }
 
-export type ProjectCategoryId = 'opensource' | 'packages' | 'hackathons' | 'research';
+export interface ResearchLab {
+	name: string;
+	url: string;
+}
+
+export interface ResearchGroup {
+	name: string;
+	shortName: string;
+	lab: ResearchLab;
+	institution: string;
+	role: string;
+	period: string;
+	description: string;
+	focus: string[];
+	links: LabeledLink[];
+	projects: Project[];
+}
+
+export type ProjectCategoryId = 'opensource' | 'packages' | 'hackathons' | 'research' | 'organizations';
 
 export interface ProjectCategory {
 	id: ProjectCategoryId;
@@ -113,6 +136,7 @@ export interface RatedTitle {
 }
 
 export interface AboutContent {
+	anilistUsername?: string;
 	hobbies: Hobby[];
 	games: Game[];
 	shows: RatedTitle[];
@@ -145,6 +169,10 @@ export interface DesktopContent {
 	startupCommand: string;
 }
 
+export interface Playlist {
+	videos: string[];
+}
+
 export interface BlogSettings {
 	name: string;
 	tagline: string;

src/lib/github/types.ts

@@ -0,0 +1,4 @@
+export interface RepoStats {
+	stars: number;
+	forks: number;
+}

src/lib/server/github.ts

@@ -0,0 +1,41 @@
+import type { RepoStats } from '#lib/github/types';
+
+const cacheDuration = 60 * 60 * 1000;
+const githubRepoPattern = /^https:\/\/github\.com\/([^/]+\/[^/#?]+)/;
+
+const statsCache = new Map<string, { stats: RepoStats; fetchedAt: number }>();
+
+function githubRepoPath(url: string): string | null {
+	const match = url.match(githubRepoPattern);
+	return match ? match[1].replace(/\.git$/, '') : null;
+}
+
+async function fetchRepoStats(repoPath: string): Promise<RepoStats | null> {
+	const cached = statsCache.get(repoPath);
+	if (cached && Date.now() - cached.fetchedAt < cacheDuration) return cached.stats;
+
+	try {
+		const response = await fetch(`https://api.github.com/repos/${repoPath}`, {
+			headers: { Accept: 'application/vnd.github+json', 'User-Agent': 'portfolio-website' }
+		});
+		if (!response.ok) return cached?.stats ?? null;
+
+		const repo = await response.json();
+		const stats: RepoStats = { stars: repo.stargazers_count, forks: repo.forks_count };
+		statsCache.set(repoPath, { stats, fetchedAt: Date.now() });
+		return stats;
+	} catch {
+		return cached?.stats ?? null;
+	}
+}
+
+export async function getRepoStats(codeUrls: string[]): Promise<Record<string, RepoStats>> {
+	const results = await Promise.all(
+		codeUrls.map(async (codeUrl) => {
+			const repoPath = githubRepoPath(codeUrl);
+			const stats = repoPath ? await fetchRepoStats(repoPath) : null;
+			return [codeUrl, stats] as const;
+		})
+	);
+	return Object.fromEntries(results.filter((result): result is readonly [string, RepoStats] => result[1] !== null));
+}

src/lib/server/npm.ts

@@ -0,0 +1,62 @@
+const cacheDuration = 60 * 60 * 1000;
+const dayDuration = 24 * 60 * 60 * 1000;
+const maxRangeDays = 540;
+const npmPackagePattern = /^https:\/\/www\.npmjs\.com\/package\/((?:@[^/]+\/)?[^/#?]+)/;
+
+const downloadsCache = new Map<string, { downloads: number; fetchedAt: number }>();
+
+function npmPackageName(url: string): string | null {
+	return url.match(npmPackagePattern)?.[1] ?? null;
+}
+
+function formatDate(date: Date): string {
+	return date.toISOString().slice(0, 10);
+}
+
+async function fetchCreatedDate(packageName: string): Promise<Date> {
+	const response = await fetch(`https://registry.npmjs.org/${packageName.replace('/', '%2f')}`);
+	if (!response.ok) throw new Error(`npm registry returned ${response.status} for ${packageName}`);
+	const metadata = await response.json();
+	return new Date(metadata.time.created);
+}
+
+async function fetchDownloadsBetween(packageName: string, start: Date, end: Date): Promise<number> {
+	const range = `${formatDate(start)}:${formatDate(end)}`;
+	const response = await fetch(`https://api.npmjs.org/downloads/point/${range}/${packageName}`);
+	if (!response.ok) throw new Error(`npm downloads returned ${response.status} for ${packageName}`);
+	const result = await response.json();
+	return result.downloads ?? 0;
+}
+
+async function fetchTotalDownloads(packageName: string): Promise<number | null> {
+	const cached = downloadsCache.get(packageName);
+	if (cached && Date.now() - cached.fetchedAt < cacheDuration) return cached.downloads;
+
+	try {
+		const today = new Date();
+		const rangeRequests: Promise<number>[] = [];
+		for (let rangeStart = await fetchCreatedDate(packageName); rangeStart <= today; ) {
+			const rangeEnd = new Date(Math.min(rangeStart.getTime() + (maxRangeDays - 1) * dayDuration, today.getTime()));
+			rangeRequests.push(fetchDownloadsBetween(packageName, rangeStart, rangeEnd));
+			rangeStart = new Date(rangeEnd.getTime() + dayDuration);
+		}
+
+		const downloads = (await Promise.all(rangeRequests)).reduce((total, count) => total + count, 0);
+		downloadsCache.set(packageName, { downloads, fetchedAt: Date.now() });
+		return downloads;
+	} catch (error) {
+		console.error(`npm download count failed for ${packageName}:`, error);
+		return cached?.downloads ?? null;
+	}
+}
+
+export async function getPackageDownloads(packageUrls: string[]): Promise<Record<string, number>> {
+	const results = await Promise.all(
+		packageUrls.map(async (packageUrl) => {
+			const packageName = npmPackageName(packageUrl);
+			const downloads = packageName ? await fetchTotalDownloads(packageName) : null;
+			return [packageUrl, downloads] as const;
+		})
+	);
+	return Object.fromEntries(results.filter((result): result is readonly [string, number] => result[1] !== null));
+}

src/lib/site/pages.ts

@@ -10,13 +10,13 @@ export interface SitePage {
 }
 
 export const sitePages: SitePage[] = [
-	{ name: 'about', path: '/about', title: 'About', description: 'Background, hobbies, games, shows and movies.', icon: 'ph:user-circle-duotone' },
+	{ name: 'about', path: '/about', title: 'About', description: 'Background, hobbies, games, shows, movies and anime.', icon: 'ph:user-circle-duotone' },
 	{ name: 'portfolio', path: '/portfolio', title: 'Portfolio', description: 'Profile, experience, skills and contact info.', icon: 'ph:briefcase-duotone' },
 	{
 		name: 'projects',
 		path: '/projects',
 		title: 'Projects',
-		description: 'Open source, packages, hackathons and research.',
+		description: 'Open source, packages, hackathons, research and organizations.',
 		icon: 'ph:folder-open-duotone',
 		children: projectCategories.map((category) => ({
 			name: category.id,

src/lib/terminal/commands/info.ts

@@ -59,7 +59,7 @@ export const infoCommands: Command[] = [
 	{
 		name: 'projects',
 		description: 'List projects, optionally by category',
-		usage: 'projects [opensource|packages|hackathons|research]',
+		usage: 'projects [opensource|packages|hackathons|research|organizations]',
 		argumentOptions: () => projectCategories.map((category) => category.id),
 		run: (args, context) => {
 			const categories = args[0] ? [findProjectCategory(args[0])] : projectCategories;

src/routes/projects/+page.svelte

@@ -10,12 +10,13 @@
 	function countLabel(id: string, count: number): string {
 		if (id === 'hackathons') return count === 1 ? 'event' : 'events';
 		if (id === 'packages') return 'published';
+		if (id === 'organizations') return count === 1 ? 'organization' : 'organizations';
 		return count === 1 ? 'project' : 'projects';
 	}
 </script>
 
 <div class="page">
-	<PageHeader command="ls ~/projects" title="My Project Universe" subtitle="Everything I build lives in one of four buckets. Pick a door." />
+	<PageHeader command="ls ~/projects" title="My Project Universe" subtitle="Everything I build lives in one of five buckets. Pick a door." />
 	<ProjectNav />
 
 	<div class="category-grid">
@@ -46,7 +47,7 @@
 <style>
 	.category-grid {
 		display: grid;
-		grid-template-columns: repeat(4, 1fr);
+		grid-template-columns: repeat(3, 1fr);
 		gap: 1rem;
 	}
 

src/routes/projects/[category]/+page.server.ts

@@ -0,0 +1,26 @@
+import { error } from '@sveltejs/kit';
+import { findProjectCategory, projectCategories } from '#lib/content';
+import { getRepoStats } from '#lib/server/github';
+import { getPackageDownloads } from '#lib/server/npm';
+import type { EntryGenerator, PageServerLoad } from './$types';
+
+const categoriesWithRepoStats = new Set(['opensource', 'packages']);
+const categoriesWithDownloads = new Set(['packages']);
+
+export const entries: EntryGenerator = () => projectCategories.map((category) => ({ category: category.id }));
+
+export const load: PageServerLoad = async ({ params }) => {
+	const category = findProjectCategory(params.category);
+	if (!category) error(404, 'Project category not found');
+
+	const codeUrls = categoriesWithRepoStats.has(category.id)
+		? category.projects.flatMap((project) => (project.links.code ? [project.links.code] : []))
+		: [];
+	const packageUrls = categoriesWithDownloads.has(category.id)
+		? category.projects.flatMap((project) => (project.links.package ? [project.links.package] : []))
+		: [];
+
+	const [repoStats, packageDownloads] = await Promise.all([getRepoStats(codeUrls), getPackageDownloads(packageUrls)]);
+
+	return { categoryId: category.id, repoStats, packageDownloads };
+};

src/routes/projects/[category]/+page.svelte

@@ -1,15 +1,17 @@
 <script lang="ts">
 	import type { PageProps } from './$types';
-	import { findProjectCategory } from '#lib/content';
+	import { findProjectCategory, researchGroups } from '#lib/content';
 	import PageHeader from '#lib/components/ui/PageHeader.svelte';
 	import ProjectNav from '#lib/components/projects/ProjectNav.svelte';
 	import ProjectEntry from '#lib/components/projects/ProjectEntry.svelte';
+	import ResearchGroup from '#lib/components/research/ResearchGroup.svelte';
 
 	let { data }: PageProps = $props();
 
 	const category = $derived(findProjectCategory(data.categoryId)!);
 	const awardCount = $derived(category.projects.filter((project) => project.awards?.length).length);
 	const featuredCount = $derived(category.projects.filter((project) => project.featured).length);
+	const isResearch = $derived(category.id === 'research');
 </script>
 
 <div class="page">
@@ -17,7 +19,10 @@
 	<ProjectNav />
 
 	<div class="stats">
-		<span>Total: <b class="total">{category.projects.length}</b></span>
+		{#if isResearch}
+			<span>Groups: <b class="total">{researchGroups.length}</b></span>
+		{/if}
+		<span>{isResearch ? 'Projects' : 'Total'}: <b class="total">{category.projects.length}</b></span>
 		{#if awardCount}
 			<span>Awards: <b class="awards">{awardCount}</b></span>
 		{/if}
@@ -26,9 +31,20 @@
 		{/if}
 	</div>
 
-	{#each category.projects as project (project.name)}
+	{#if isResearch}
-		<ProjectEntry {project} {category} />
+		{#each researchGroups as group (group.name)}
+			<ResearchGroup {group} {category} />
 		{/each}
+	{:else}
+		{#each category.projects as project (project.name)}
+			<ProjectEntry
+				{project}
+				{category}
+				repoStats={project.links.code ? data.repoStats[project.links.code] : undefined}
+				downloads={project.links.package ? data.packageDownloads[project.links.package] : undefined}
+			/>
+		{/each}
+	{/if}
 </div>
 
 <style>