Something went wrong. Try again.
My website. cameron.stream
Something went wrong. Try again.
2.0 kB · 60 lines
TSX
at main
12345678910111213141516171819202122232425262728293031323334353637383940414243444546474849505152535455565758596061import { getProfile, getSembleData, type SembleData } from "../data.ts";import { PageNav } from "./page-nav.tsx";
function publicUrl(value: string): URL | undefined { try { const url = new URL(value); return ["https:", "http:"].includes(url.protocol) ? url : undefined; } catch { return undefined; }}
function excerpt(description: string): string { const text = description.replace(/\s+/g, " ").trim(); if (text.length <= 300) return text; const end = text.lastIndexOf(" ", 300); return `${text.slice(0, end > 0 ? end : 300)}…`;}
// Read-only projection of Cameron's existing public Semble bookmarks, not contacts.export function LinksContent({ data }: { data: SembleData }) { const cards = data.cards.filter((card) => card.type === "URL" && publicUrl(card.url)); return ( <main> <header class="other-index-header"> <h1 class="page-title">Links</h1> <p class="page-subtitle"> Saved reading and interesting things from my public{" "} <a href="https://semble.so/profile/cameron.stream">Semble collection</a>. </p> </header> {!data.available ? ( <p role="status">The saved links could not be loaded right now. You can still browse them on Semble.</p> ) : cards.length === 0 ? ( <p>No saved links yet.</p> ) : ( <ul class="knowledge-page-list" aria-label="Saved links"> {cards.map((card) => ( <li key={card.id}> <a href={card.url}> <strong>{card.cardContent.title || publicUrl(card.url)!.hostname}</strong> <span>{excerpt(card.cardContent.description || publicUrl(card.url)!.hostname)}</span> </a> </li> ))} </ul> )} </main> );}
export async function Links() { const [profile, data] = await Promise.all([getProfile(), getSembleData(100)]); return ( <div> <PageNav profile={profile} active="other" /> <LinksContent data={data} /> </div> );}