diff --git a/src/app/page.tsx b/src/app/page.tsx index 2549e0a..cded5b1 100644 --- a/src/app/page.tsx +++ b/src/app/page.tsx @@ -6,6 +6,7 @@ import Link from 'next/link'; import { nanoid } from 'nanoid'; import { AuthButton } from '@/components/AuthButton'; import { AppSwitcher } from '@/components/AppSwitcher'; +import { EcosystemFooter } from '@/components/EcosystemFooter'; import { useAuthStore } from '@/stores/auth'; // Emoji options for avatars @@ -452,32 +453,7 @@ export default function HomePage() { {/* ── Ecosystem Footer ─────────────────────────────────────── */} - + ); } diff --git a/src/components/AppSwitcher.tsx b/src/components/AppSwitcher.tsx index 8006789..2544fca 100644 --- a/src/components/AppSwitcher.tsx +++ b/src/components/AppSwitcher.tsx @@ -14,63 +14,98 @@ export interface AppModule { const MODULES: AppModule[] = [ // Creating - { id: 'space', name: 'rSpace', badge: 'rS', color: 'bg-teal-300', emoji: '\u{1F3A8}', description: 'Real-time collaborative canvas', domain: 'rspace.online' }, - { id: 'notes', name: 'rNotes', badge: 'rN', color: 'bg-amber-300', emoji: '\u{1F4DD}', description: 'Group note-taking & knowledge capture', domain: 'rnotes.online' }, - { id: 'pubs', name: 'rPubs', badge: 'rP', color: 'bg-rose-300', emoji: '\u{1F4F0}', description: 'Collaborative publishing platform', domain: 'rpubs.online' }, + { id: 'space', name: 'rSpace', badge: 'rS', color: 'bg-teal-300', emoji: '🎨', description: 'Real-time collaborative canvas', domain: 'rspace.online' }, + { id: 'notes', name: 'rNotes', badge: 'rN', color: 'bg-amber-300', emoji: '📝', description: 'Group note-taking & knowledge capture', domain: 'rnotes.online' }, + { id: 'pubs', name: 'rPubs', badge: 'rP', color: 'bg-rose-300', emoji: '📰', description: 'Collaborative publishing platform', domain: 'rpubs.online' }, // Planning - { id: 'cal', name: 'rCal', badge: 'rC', color: 'bg-sky-300', emoji: '\u{1F4C5}', description: 'Collaborative scheduling & events', domain: 'rcal.online' }, - { id: 'trips', name: 'rTrips', badge: 'rT', color: 'bg-emerald-300', emoji: '\u2708\uFE0F', description: 'Group travel planning in real time', domain: 'rtrips.online' }, - { id: 'maps', name: 'rMaps', badge: 'rM', color: 'bg-green-300', emoji: '\u{1F5FA}\uFE0F', description: 'Collaborative real-time mapping', domain: 'rmaps.online' }, - // Discussing & Deciding - { id: 'inbox', name: 'rInbox', badge: 'rI', color: 'bg-indigo-300', emoji: '\u{1F4EC}', description: 'Private group messaging', domain: 'rinbox.online' }, - { id: 'choices', name: 'rChoices', badge: 'rCh', color: 'bg-fuchsia-300', emoji: '\u{1F500}', description: 'Collaborative decision making', domain: 'rchoices.online' }, - { id: 'vote', name: 'rVote', badge: 'rV', color: 'bg-violet-300', emoji: '\u{1F5F3}\uFE0F', description: 'Real-time polls & governance', domain: 'rvote.online' }, + { id: 'cal', name: 'rCal', badge: 'rC', color: 'bg-sky-300', emoji: '📅', description: 'Collaborative scheduling & events', domain: 'rcal.online' }, + { id: 'trips', name: 'rTrips', badge: 'rT', color: 'bg-emerald-300', emoji: '✈️', description: 'Group travel planning in real time', domain: 'rtrips.online' }, + { id: 'maps', name: 'rMaps', badge: 'rM', color: 'bg-green-300', emoji: '🗺️', description: 'Collaborative real-time mapping', domain: 'rmaps.online' }, + // Communicating + { id: 'chats', name: 'rChats', badge: 'rCh', color: 'bg-emerald-200', emoji: '💬', description: 'Real-time encrypted messaging', domain: 'rchats.online' }, + { id: 'inbox', name: 'rInbox', badge: 'rI', color: 'bg-indigo-300', emoji: '📬', description: 'Private group messaging', domain: 'rinbox.online' }, + { id: 'mail', name: 'rMail', badge: 'rMa', color: 'bg-blue-200', emoji: '✉️', description: 'Community email & newsletters', domain: 'rmail.online' }, + { id: 'forum', name: 'rForum', badge: 'rFo', color: 'bg-amber-200', emoji: '💭', description: 'Threaded community discussions', domain: 'rforum.online' }, + // Deciding + { id: 'choices', name: 'rChoices', badge: 'rCo', color: 'bg-fuchsia-300', emoji: '🔀', description: 'Collaborative decision making', domain: 'rchoices.online' }, + { id: 'vote', name: 'rVote', badge: 'rV', color: 'bg-violet-300', emoji: '🗳️', description: 'Real-time polls & governance', domain: 'rvote.online' }, // Funding & Commerce - { id: 'funds', name: 'rFunds', badge: 'rF', color: 'bg-lime-300', emoji: '\u{1F4B8}', description: 'Collaborative fundraising & grants', domain: 'rfunds.online' }, - { id: 'wallet', name: 'rWallet', badge: 'rW', color: 'bg-yellow-300', emoji: '\u{1F4B0}', description: 'Multi-chain crypto wallet', domain: 'rwallet.online' }, - { id: 'cart', name: 'rCart', badge: 'rCt', color: 'bg-orange-300', emoji: '\u{1F6D2}', description: 'Group commerce & shared shopping', domain: 'rcart.online' }, - { id: 'auctions', name: 'rAuctions', badge: 'rA', color: 'bg-red-300', emoji: '\u{1F528}', description: 'Live auction platform', domain: 'rauctions.online' }, - // Social & Sharing - { id: 'network', name: 'rNetwork', badge: 'rNe', color: 'bg-blue-300', emoji: '\u{1F310}', description: 'Community network & social graph', domain: 'rnetwork.online' }, - { id: 'files', name: 'rFiles', badge: 'rFi', color: 'bg-cyan-300', emoji: '\u{1F4C1}', description: 'Collaborative file storage', domain: 'rfiles.online' }, - { id: 'tube', name: 'rTube', badge: 'rTu', color: 'bg-pink-300', emoji: '\u{1F3AC}', description: 'Group video platform', domain: 'rtube.online' }, - { id: 'data', name: 'rData', badge: 'rD', color: 'bg-purple-300', emoji: '\u{1F4CA}', description: 'Analytics & insights dashboard', domain: 'rdata.online' }, + { id: 'funds', name: 'rFunds', badge: 'rF', color: 'bg-lime-300', emoji: '💸', description: 'Collaborative fundraising & grants', domain: 'rfunds.online' }, + { id: 'wallet', name: 'rWallet', badge: 'rW', color: 'bg-yellow-300', emoji: '💰', description: 'Multi-chain crypto wallet', domain: 'rwallet.online' }, + { id: 'cart', name: 'rCart', badge: 'rCt', color: 'bg-orange-300', emoji: '🛒', description: 'Group commerce & shared shopping', domain: 'rcart.online' }, + { id: 'auctions', name: 'rAuctions', badge: 'rA', color: 'bg-red-300', emoji: '🔨', description: 'Live auction platform', domain: 'rauctions.online' }, + { id: 'swag', name: 'rSwag', badge: 'rSw', color: 'bg-red-200', emoji: '👕', description: 'Community merch & swag store', domain: 'rswag.online' }, + // Social & Media + { id: 'photos', name: 'rPhotos', badge: 'rPh', color: 'bg-pink-200', emoji: '📸', description: 'Shared community photo albums', domain: 'rphotos.online' }, + { id: 'tube', name: 'rTube', badge: 'rTu', color: 'bg-pink-300', emoji: '🎬', description: 'Group video platform', domain: 'rtube.online' }, + { id: 'network', name: 'rNetwork', badge: 'rNe', color: 'bg-blue-300', emoji: '🌐', description: 'Community network & social graph', domain: 'rnetwork.online' }, + { id: 'socials', name: 'rSocials', badge: 'rSo', color: 'bg-sky-200', emoji: '📢', description: 'Social media management', domain: 'rsocials.online' }, + { id: 'files', name: 'rFiles', badge: 'rFi', color: 'bg-cyan-300', emoji: '📁', description: 'Collaborative file storage', domain: 'rfiles.online' }, + { id: 'data', name: 'rData', badge: 'rD', color: 'bg-purple-300', emoji: '📊', description: 'Analytics & insights dashboard', domain: 'rdata.online' }, + // Work & Productivity + { id: 'work', name: 'rWork', badge: 'rWo', color: 'bg-slate-300', emoji: '💼', description: 'Project & task management', domain: 'rwork.online' }, + // Identity & Infrastructure + { id: 'ids', name: 'rIDs', badge: 'rId', color: 'bg-emerald-300', emoji: '🔑', description: 'Passkey identity & zero-knowledge auth', domain: 'ridentity.online' }, + { id: 'stack', name: 'rStack', badge: 'r*', color: 'bg-gradient-to-br from-cyan-300 via-violet-300 to-rose-300', emoji: '📦', description: 'Open-source community infrastructure', domain: 'rstack.online' }, ]; const MODULE_CATEGORIES: Record = { - space: 'Creating', - notes: 'Creating', - pubs: 'Creating', - cal: 'Planning', - trips: 'Planning', - inbox: 'Discussing & Deciding', - choices: 'Discussing & Deciding', - vote: 'Discussing & Deciding', - funds: 'Funding & Commerce', - wallet: 'Funding & Commerce', - cart: 'Funding & Commerce', - auctions:'Funding & Commerce', - maps: 'Planning', - network: 'Social & Sharing', - files: 'Social & Sharing', - tube: 'Social & Sharing', - data: 'Social & Sharing', + space: 'Creating', + notes: 'Creating', + pubs: 'Creating', + cal: 'Planning', + trips: 'Planning', + maps: 'Planning', + chats: 'Communicating', + inbox: 'Communicating', + mail: 'Communicating', + forum: 'Communicating', + choices: 'Deciding', + vote: 'Deciding', + funds: 'Funding & Commerce', + wallet: 'Funding & Commerce', + cart: 'Funding & Commerce', + auctions: 'Funding & Commerce', + swag: 'Funding & Commerce', + photos: 'Social & Media', + tube: 'Social & Media', + network: 'Social & Media', + socials: 'Social & Media', + files: 'Social & Media', + data: 'Social & Media', + work: 'Work & Productivity', + ids: 'Identity & Infrastructure', + stack: 'Identity & Infrastructure', }; const CATEGORY_ORDER = [ 'Creating', 'Planning', - 'Discussing & Deciding', + 'Communicating', + 'Deciding', 'Funding & Commerce', - 'Social & Sharing', + 'Social & Media', + 'Work & Productivity', + 'Identity & Infrastructure', ]; +/** Build the URL for a module, using username subdomain if logged in */ +function getModuleUrl(m: AppModule, username: string | null): string { + if (!m.domain) return '#'; + if (username) { + // Generate . URL + return `https://${username}.${m.domain}`; + } + return `https://${m.domain}`; +} + interface AppSwitcherProps { current?: string; } export function AppSwitcher({ current = 'notes' }: AppSwitcherProps) { const [open, setOpen] = useState(false); + const [username, setUsername] = useState(null); const ref = useRef(null); useEffect(() => { @@ -83,6 +118,18 @@ export function AppSwitcher({ current = 'notes' }: AppSwitcherProps) { return () => document.removeEventListener('click', handleClick); }, []); + // Fetch current user's username for subdomain links + useEffect(() => { + fetch('/api/me') + .then((r) => r.json()) + .then((data) => { + if (data.authenticated && data.user?.username) { + setUsername(data.user.username); + } + }) + .catch(() => { /* not logged in */ }); + }, []); + const currentMod = MODULES.find((m) => m.id === current); // Group modules by category @@ -140,7 +187,7 @@ export function AppSwitcher({ current = 'notes' }: AppSwitcherProps) { } transition-colors`} > setOpen(false)} > diff --git a/src/components/EcosystemFooter.tsx b/src/components/EcosystemFooter.tsx new file mode 100644 index 0000000..ac513c6 --- /dev/null +++ b/src/components/EcosystemFooter.tsx @@ -0,0 +1,62 @@ +'use client'; + +const FOOTER_LINKS = [ + { name: 'rSpace', href: 'https://rspace.online' }, + { name: 'rNotes', href: 'https://rnotes.online' }, + { name: 'rPubs', href: 'https://rpubs.online' }, + { name: 'rCal', href: 'https://rcal.online' }, + { name: 'rTrips', href: 'https://rtrips.online' }, + { name: 'rMaps', href: 'https://rmaps.online' }, + { name: 'rChats', href: 'https://rchats.online' }, + { name: 'rInbox', href: 'https://rinbox.online' }, + { name: 'rMail', href: 'https://rmail.online' }, + { name: 'rForum', href: 'https://rforum.online' }, + { name: 'rChoices', href: 'https://rchoices.online' }, + { name: 'rVote', href: 'https://rvote.online' }, + { name: 'rFunds', href: 'https://rfunds.online' }, + { name: 'rWallet', href: 'https://rwallet.online' }, + { name: 'rCart', href: 'https://rcart.online' }, + { name: 'rAuctions', href: 'https://rauctions.online' }, + { name: 'rSwag', href: 'https://rswag.online' }, + { name: 'rPhotos', href: 'https://rphotos.online' }, + { name: 'rTube', href: 'https://rtube.online' }, + { name: 'rNetwork', href: 'https://rnetwork.online' }, + { name: 'rSocials', href: 'https://rsocials.online' }, + { name: 'rFiles', href: 'https://rfiles.online' }, + { name: 'rData', href: 'https://rdata.online' }, + { name: 'rWork', href: 'https://rwork.online' }, + { name: 'rIDs', href: 'https://ridentity.online' }, + { name: 'rStack', href: 'https://rstack.online' }, +]; + +interface EcosystemFooterProps { + current?: string; +} + +export function EcosystemFooter({ current }: EcosystemFooterProps) { + return ( + + ); +}