\n {/* Header */}\n

\n Twtxt Feed Viewer\n

\n Enter a twtxt.txt URL to view the timeline\n

\n\n {/* Feed Input */}\n \n\n {/* Error Display */}\n {error && (\n

{error}

\n )}\n\n {/* Loading State */}\n {loading && (\n

Loading feed...

\n )}\n\n {/* Feed Display */}\n {feed && !loading && (\n

\n {/* Metadata */}\n {(feed.metadata.nickname || feed.metadata.description) && (\n

\n {feed.metadata.avatar && (\n $\"Avatar\"\n$ \n )}\n

\n {feed.metadata.nickname && (\n

\n {feed.metadata.nickname}\n

\n )}\n {feed.metadata.description && (\n

\n {feed.metadata.description}\n

\n )}\n

\n )}\n\n {/* Posts */}\n

\n {feed.posts.length === 0 ? (\n

No posts found in this feed.

\n ) : (\n feed.posts.map((post, index) => (\n \n ))\n )}\n

\n )}\n

\n );\n}",[],[184,191,198],{"_105":206,"_96":207,"_157":208,"_159":192,"_160":142,"_161":209,"_163":22,"_107":210,"_101":32,"_165":201,"_167":211,"_168":22,"_169":-5,"_170":212,"_99":213},"5a4b5b60-9422-11f0-9bf7-0224a6c84d84","FeedInput.tsx","5a4b5c14-9422-11f0-9bf7-0224a6c84d84",7,["D",1758153571309],"/** @jsxImportSource https://esm.sh/react@18.2.0 */\nimport React, { useState } from \"https://esm.sh/react@18.2.0?deps=react@18.2.0\";\n\ninterface FeedInputProps {\n onLoadFeed: (url: string) => void;\n loading: boolean;\n defaultUrl?: string;\n}\n\nexport default function FeedInput({ onLoadFeed, loading, defaultUrl = \"\" }: FeedInputProps) {\n const [url, setUrl] = useState(defaultUrl);\n\n const handleSubmit = (e: React.FormEvent) => {\n e.preventDefault();\n if (url.trim() && !loading) {\n onLoadFeed(url.trim());\n }\n };\n\n return (\n \n );\n}",[],[184,191,207],{"_105":215,"_96":216,"_157":217,"_159":192,"_160":142,"_161":218,"_163":22,"_107":219,"_101":32,"_165":201,"_167":220,"_168":22,"_169":-5,"_170":221,"_99":222},"66103344-9422-11f0-913a-0224a6c84d84","TweetCard.tsx","661033f8-9422-11f0-913a-0224a6c84d84",8,["D",1758153591052],"/** @jsxImportSource https://esm.sh/react@18.2.0 */\nimport React from \"https://esm.sh/react@18.2.0?deps=react@18.2.0\";\nimport type { TwtxtPost } from \"../../shared/types.ts\";\n\ninterface TweetCardProps {\n post: TwtxtPost;\n nickname?: string;\n avatar?: string;\n}\n\nexport default function TweetCard({ post, nickname, avatar }: TweetCardProps) {\n const formatDate = (date: Date) => {\n const now = new Date();\n const diffMs = now.getTime() - date.getTime();\n const diffMins = Math.floor(diffMs / (1000 * 60));\n const diffHours = Math.floor(diffMs / (1000 * 60 * 60));\n const diffDays = Math.floor(diffMs / (1000 * 60 * 60 * 24));\n\n if (diffMins < 1) return \"now\";\n if (diffMins < 60) return `${diffMins}m`;\n if (diffHours < 24) return `${diffHours}h`;\n if (diffDays < 7) return `${diffDays}d`;\n \n return date.toLocaleDateString();\n };\n\n const formatText = (text: string) => {\n // Simple link detection and formatting\n const urlRegex = /(https?:\\/\\/[^\\s]+)/g;\n const parts = text.split(urlRegex);\n \n return parts.map((part, index) => {\n if (urlRegex.test(part)) {\n return (\n \n {part}\n \n );\n }\n return part;\n });\n };\n\n return (\n

\n {/* Avatar */}\n

\n {avatar ? (\n \n ) : (\n

\n \n {nickname ? nickname.charAt(0).toUpperCase() : \"?\"}\n \n

\n )}\n

\n\n {/* Content */}\n

\n {/* Header */}\n

\n {nickname && (\n \n {nickname}\n \n )}\n \n {formatDate(post.date)}\n \n

\n\n {/* Text */}\n

\n {formatText(post.text)}\n

\n\n {/* Timestamp */}\n

\n {post.date.toLocaleString()}\n

\n );\n}",[],[184,191,216],[184,191],{"_105":225,"_96":226,"_157":227,"_159":185,"_160":142,"_161":186,"_163":119,"_107":228,"_101":32,"_165":229,"_167":230,"_168":22,"_169":-5,"_170":231,"_99":232},"42e90256-9422-11f0-a6d5-0224a6c84d84","index.html","42e90314-9422-11f0-a6d5-0224a6c84d84",["D",1758153532073],"file","\n\n\n \n \n Twtxt Feed Viewer\n \n \n \n\n\n

\n\n",[],[184,226],{"_105":234,"_96":235,"_157":236,"_159":185,"_160":142,"_161":237,"_163":119,"_107":238,"_101":32,"_165":201,"_167":239,"_168":22,"_169":-5,"_170":240,"_99":241},"471b3290-9422-11f0-ba6b-0224a6c84d84","index.tsx","471b331c-9422-11f0-ba6b-0224a6c84d84",5,["D",1758153539117],"/** @jsxImportSource https://esm.sh/react@18.2.0 */\nimport React from \"https://esm.sh/react@18.2.0?deps=react@18.2.0\";\nimport { createRoot } from \"https://esm.sh/react-dom@18.2.0/client?deps=react@18.2.0,react-dom@18.2.0\";\nimport App from \"./components/App.tsx\";\n\nconst root = createRoot(document.getElementById(\"root\")!);\nroot.render();",[],[184,235],[184],{"_105":244,"_96":245,"_157":246,"_159":-5,"_160":142,"_161":247,"_163":119,"_107":248,"_101":32,"_165":166,"_167":-5,"_168":22,"_169":-5,"_170":249,"_99":258},"23212098-9422-11f0-b612-0224a6c84d84","shared","f364007b-e27a-4c41-9f8b-caf91758d5bd",2,["D",1758153478746],[250],{"_105":251,"_96":252,"_157":253,"_159":246,"_160":142,"_161":247,"_163":22,"_107":254,"_101":32,"_165":201,"_167":255,"_168":22,"_169":-5,"_170":256,"_99":257},"232114f4-9422-11f0-b612-0224a6c84d84","types.ts","23211710-9422-11f0-b612-0224a6c84d84",["D",1758153478746],"export interface TwtxtPost {\n timestamp: string;\n text: string;\n date: Date;\n}\n\nexport interface TwtxtFeed {\n metadata: {\n nickname?: string;\n avatar?: string;\n description?: string;\n };\n posts: TwtxtPost[];\n}\n\nexport interface FeedResponse {\n success: boolean;\n feed?: TwtxtFeed;\n error?: string;\n}",[],[245,252],[245],{"_105":260,"_96":261,"_157":262,"_159":-5,"_160":142,"_161":176,"_163":22,"_107":263,"_101":32,"_165":229,"_167":264,"_168":22,"_169":-5,"_170":265,"_99":266},"20b837a6-9422-11f0-ac36-0224a6c84d84","README.md","20b8388c-9422-11f0-ac36-0224a6c84d84",["D",1758153474715],"# Twtxt Feed Viewer\n\nA clean, minimal web application for viewing twtxt.txt feeds in a beautiful card-based timeline format.\n\n## Features\n\n- Enter any twtxt.txt feed URL\n- Clean, responsive card-based design\n- Parses RFC3339 timestamps and metadata\n- Mobile-friendly interface using Tailwind CSS\n\n## Project Structure\n\n```\n├── backend/\n│ └── index.ts # Main HTTP server with CORS proxy\n├── frontend/\n│ ├── index.html # Main HTML template\n│ ├── index.tsx # React frontend entry point\n│ └── components/\n│ ├── App.tsx # Main app component\n│ ├── FeedInput.tsx # URL input component\n│ └── TweetCard.tsx # Individual tweet card component\n├── shared/\n│ └── types.ts # Shared TypeScript types\n└── README.md\n```\n\n## Usage\n\n1. Enter a twtxt.txt feed URL in the input field\n2. Click \"Load Feed\" to fetch and display the timeline\n3. View posts in a clean, card-based format with timestamps\n\n## Twtxt Format\n\nSupports the standard twtxt format:\n- RFC3339 timestamps followed by TAB character\n- UTF-8 encoded with LF line separators\n- Metadata parsing (nickname, avatar, description)\n- One status update per line",[],[261],"files",[154,172,182,189,196,205,214,224,233,243,250,259],"counts",{"_271":32,"_272":176,"_273":32,"_274":275},"pulls","branches","forks","envVars",{"_276":32,"_277":32},"count","emptyCount","contents",[],{"_105":173,"_96":174,"_157":117,"_159":158,"_160":142,"_161":102,"_163":119,"_107":281,"_101":176,"_165":177,"_167":178,"_168":22,"_169":97,"_99":282},["D",1758153594979],[156,174],"upstreamProject","upstreamBranch","emptyEnvVars","isNew","flags",[],"routes/_app.x.$handle.$name.branch.$branch.version.$version.code.$",{"_94":95,"_96":97,"_98":44,"_101":102,"_99":100,"_103":291,"_152":296,"_267":333,"_229":334,"_278":336,"_337":-5,"_338":-5,"_339":-5,"_340":-5,"_341":342},{"_105":106,"_96":97,"_107":292,"_109":-5,"_110":22,"_111":112,"_113":-5,"_114":-5,"_14":115,"_116":117,"_118":119,"_120":119,"_121":-5,"_122":32,"_16":123,"_124":125,"_126":125,"_127":128,"_129":128,"_130":128,"_131":125,"_132":125,"_23":293,"_136":294,"_139":295,"_151":22},["D",1758153298412],{"_94":95,"_134":135},{"_94":95,"_138":135,"_14":115},{"_101":141,"_96":44,"_105":142,"_143":106,"_144":-5,"_145":-5,"_146":-5,"_147":-5,"_148":-5,"_149":97,"_150":95},[297,303,324,330],{"_105":155,"_96":156,"_157":158,"_159":-5,"_160":142,"_161":162,"_163":119,"_107":164,"_101":32,"_165":166,"_167":-5,"_168":22,"_169":-5,"_170":298,"_99":302},[299],{"_105":173,"_96":174,"_157":117,"_159":158,"_160":142,"_161":102,"_163":119,"_107":175,"_101":176,"_165":177,"_167":178,"_168":22,"_169":97,"_170":300,"_99":301},[],[156,174],[156],{"_105":183,"_96":184,"_157":185,"_159":-5,"_160":142,"_161":186,"_163":119,"_107":187,"_101":32,"_165":166,"_167":-5,"_168":22,"_169":-5,"_170":304,"_99":323},[305,317,320],{"_105":190,"_96":191,"_157":192,"_159":185,"_160":142,"_161":193,"_163":119,"_107":194,"_101":32,"_165":166,"_167":-5,"_168":22,"_169":-5,"_170":306,"_99":316},[307,310,313],{"_105":197,"_96":198,"_157":199,"_159":192,"_160":142,"_161":193,"_163":22,"_107":200,"_101":32,"_165":201,"_167":202,"_168":22,"_169":-5,"_170":308,"_99":309},[],[184,191,198],{"_105":206,"_96":207,"_157":208,"_159":192,"_160":142,"_161":209,"_163":22,"_107":210,"_101":32,"_165":201,"_167":211,"_168":22,"_169":-5,"_170":311,"_99":312},[],[184,191,207],{"_105":215,"_96":216,"_157":217,"_159":192,"_160":142,"_161":218,"_163":22,"_107":219,"_101":32,"_165":201,"_167":220,"_168":22,"_169":-5,"_170":314,"_99":315},[],[184,191,216],[184,191],{"_105":225,"_96":226,"_157":227,"_159":185,"_160":142,"_161":186,"_163":119,"_107":228,"_101":32,"_165":229,"_167":230,"_168":22,"_169":-5,"_170":318,"_99":319},[],[184,226],{"_105":234,"_96":235,"_157":236,"_159":185,"_160":142,"_161":237,"_163":119,"_107":238,"_101":32,"_165":201,"_167":239,"_168":22,"_169":-5,"_170":321,"_99":322},[],[184,235],[184],{"_105":244,"_96":245,"_157":246,"_159":-5,"_160":142,"_161":247,"_163":119,"_107":248,"_101":32,"_165":166,"_167":-5,"_168":22,"_169":-5,"_170":325,"_99":329},[326],{"_105":251,"_96":252,"_157":253,"_159":246,"_160":142,"_161":247,"_163":22,"_107":254,"_101":32,"_165":201,"_167":255,"_168":22,"_169":-5,"_170":327,"_99":328},[],[245,252],[245],{"_105":260,"_96":261,"_157":262,"_159":-5,"_160":142,"_161":176,"_163":22,"_107":263,"_101":32,"_165":229,"_167":264,"_168":22,"_169":-5,"_170":331,"_99":332},[],[261],[297,299,303,305,307,310,313,317,320,324,326,330],{"_105":173,"_96":174,"_157":117,"_159":158,"_160":142,"_161":102,"_163":119,"_107":281,"_101":176,"_165":177,"_167":178,"_168":22,"_169":97,"_99":335},[156,174],[],"upstream","pull","ahead","behind","templates",[],"actionData","errors"]

nbbaier

twtxt-feed