HN Notifier

\n \n \n \n \n );\n}",[],[235,242,249],{"_104":258,"_95":259,"_156":260,"_158":243,"_159":141,"_160":261,"_162":22,"_106":262,"_100":263,"_165":187,"_167":264,"_168":22,"_169":-5,"_170":265,"_98":266},"3f877afe-f8a8-11ef-aa4a-569c3dd06744","Input.tsx","6eacb144-f85a-11ef-94ee-569c3dd06744",1539,["D",1741058697574],172,"/** @jsxImportSource https://esm.sh/react@18.2.0 */\nimport { ErrorBoundary } from \"https://esm.sh/react-error-boundary\";\nimport React, { useState } from \"https://esm.sh/react@18.2.0\";\nimport { useUrls } from \"https://esm.town/v/nbbaier/hn_notifier/frontend/components/ItemContext.tsx\";\n\ninterface InputProps {\n placeholder?: string;\n initialValue?: string;\n onSubmit?: (url: string) => void;\n}\n\nconst InputComponent: React.FC = ({\n placeholder = \"Enter a Hacker News URL\",\n initialValue = \"\",\n onSubmit,\n}) => {\n const [url, setUrl] = useState(initialValue);\n const { saveUrl, isLoading } = useUrls();\n\n const handleSubmit = async (e: React.FormEvent) => {\n e.preventDefault(); // Prevent the default form submission\n\n try {\n // Extract the ID from the URL\n const idParam = new URL(url).searchParams.get(\"id\");\n\n if (!idParam) {\n console.error(\"Invalid URL: missing id parameter\");\n return;\n }\n\n const id = parseInt(idParam, 10);\n\n if (isNaN(id)) {\n console.error(\"Invalid ID: not a number\");\n return;\n }\n\n // Save the URL using the context function\n console.log(\"saving:\", id);\n await saveUrl(id);\n\n // Clear the input field\n setUrl(\"\");\n\n // Call the onSubmit callback if provided\n if (onSubmit) {\n onSubmit(url);\n }\n } catch (error) {\n console.error(\"Error submitting URL:\", error);\n }\n };\n\n return (\n \n );\n};\n\nexport default InputComponent;",[],[235,242,259],{"_104":268,"_95":269,"_156":270,"_158":243,"_159":141,"_160":271,"_162":22,"_106":272,"_100":273,"_165":187,"_167":274,"_168":22,"_169":-5,"_170":275,"_98":276},"0bdfaf5a-f8b2-11ef-8be9-569c3dd06744","ItemContext.tsx","25633b7a-f887-11ef-92e9-569c3dd06744",1632,["D",1741062905876],64,"/** @jsxImportSource https://esm.sh/react@18.2.0 */\nimport React, { createContext, type ReactNode, useContext, useEffect, useState } from \"https://esm.sh/react@18.2.0\";\nimport { $api } from \"https://esm.town/v/nbbaier/hn_notifier/backend/fetchClient.ts\";\nimport type { DBItem } from \"https://esm.town/v/nbbaier/hn_notifier/shared/types.ts\";\n\ninterface ItemsContextType {\n items: DBItem[];\n isLoading: boolean;\n saveUrl: (id: number) => Promise;\n unfollowUrl: (id: number) => Promise;\n fetchUrls: () => Promise;\n}\n\nconst ItemsContext = createContext({\n items: [],\n isLoading: false,\n saveUrl: async () => {\n throw new Error(\"saveUrl function not implemented\");\n },\n unfollowUrl: async () => {\n throw new Error(\"unfollowUrl function not implemented\");\n },\n fetchUrls: async () => {\n throw new Error(\"fetchUrls function not implemented\");\n },\n});\n\ninterface ItemsProviderProps {\n children: ReactNode;\n}\n\nexport const ItemsProvider: React.FC = ({ children }) => {\n const [items, setItems] = useState([]);\n const [isLoading, setIsLoading] = useState(false);\n\n // Function to fetch URLs that can be called from components\n const fetchUrls = async (): Promise => {\n setIsLoading(true);\n try {\n const { data, error } = await $api(\"/list\");\n if (data) {\n setItems(data);\n } else {\n setItems([]);\n }\n } catch (error) {\n console.error(\"Failed to fetch items:\", error);\n setItems([]);\n } finally {\n setIsLoading(false);\n }\n };\n\n useEffect(() => {\n fetchUrls();\n }, []);\n\n const saveUrl = async (id: number): Promise => {\n setIsLoading(true);\n try {\n const { data, error } = await $api<{ hnId: number }>(\"/follow\", {\n method: \"POST\",\n headers: {\n \"Content-Type\": \"application/json\",\n },\n body: JSON.stringify({ id }),\n });\n\n if (data) console.log(`Post ${data.hnId} successfully followed`);\n\n await fetchUrls(); // Refresh the list after saving\n } catch (error) {\n console.error(\"Failed to add item:\", error);\n } finally {\n setIsLoading(false);\n }\n };\n\n const unfollowUrl = async (id: number): Promise => {\n setIsLoading(true);\n try {\n const { data, error } = await $api(`/unfollow/${id}`);\n await fetchUrls(); // Refresh the list after unfollowing\n } catch (error) {\n console.error(\"Failed to unfollow item:\", error);\n } finally {\n setIsLoading(false);\n }\n };\n\n const contextValue: ItemsContextType = {\n items,\n isLoading,\n saveUrl,\n unfollowUrl,\n fetchUrls,\n };\n\n return (\n \n {children}\n \n );\n};\n\nexport const useUrls = (): ItemsContextType => {\n const context = useContext(ItemsContext);\n\n if (context === undefined) {\n throw new Error(\"useUrls must be used within an ItemsProvider\");\n }\n\n return context;\n};",[],[235,242,269],{"_104":278,"_95":279,"_156":280,"_158":243,"_159":141,"_160":101,"_162":22,"_106":281,"_100":282,"_165":187,"_167":283,"_168":22,"_169":-5,"_170":284,"_98":285},"6efcabec-1761-11f0-9de7-569c3dd06744","ListSection.tsx","7d0319fe-f86e-11ef-a67c-569c3dd06744",["D",1744436768969],185,"/** @jsxImportSource https://esm.sh/react@18.2.0 */\nimport type React from \"https://esm.sh/react@18.2.0\";\nimport { useState } from \"https://esm.sh/react@18.2.0\";\nimport { useUrls } from \"https://esm.town/v/nbbaier/hn_notifier/frontend/components/ItemContext.tsx\";\nimport { HN_BASE_URL } from \"https://esm.town/v/nbbaier/hn_notifier/shared/utils.ts\";\n\ninterface SectionProps {\n type: \"stories\" | \"comments\";\n}\n\nconst Section: React.FC = ({ type }) => {\n const [isOpen, setIsOpen] = useState(true); // Default to collapsed\n const { items, unfollowUrl, isLoading } = useUrls();\n\n // Filter items based on type if needed\n // This is a placeholder - adjust the filtering logic based on your actual data structure\n const filteredUrls = items.filter((item) => {\n if (type === \"stories\") {\n return item.type === \"story\"; // Assuming there's an is_comment field\n }\n return item.type === \"comment\";\n });\n\n return (\n

\n setIsOpen(!isOpen)}\n onKeyDown={(e) => {\n if (e.key === \"Enter\" || e.key === \" \") {\n setIsOpen(!isOpen);\n }\n }}\n >\n {type.charAt(0).toUpperCase() + type.slice(1)}\n \n \n <>\n \n \n \n \n \n \n\n {isOpen && ( // Conditional rendering based on state\n <>\n {isLoading && (\n

\n )}\n

\n \n \n {url.title || `${HN_BASE_URL}?id=${url.id}`}\n \n {`${HN_BASE_URL}?id=${url.id}`}\n \n

\n {url.comments}\n

\n await unfollowUrl(url.id)}\n className=\"px-2 btn btn-sm btn-ghost text-neutral-900 hover:text-red-600\"\n disabled={isLoading}\n >\n \n \n \n \n

\n \n ))}\n {filteredUrls.length === 0 && !isLoading && (\n

\n No {type} to display\n

\n )}\n

\n \n )}\n

\n );\n};\n\nexport default Section;\n",[],[235,242,279],[235,242],{"_104":288,"_95":289,"_156":290,"_158":236,"_159":141,"_160":291,"_162":118,"_106":292,"_100":293,"_165":294,"_167":295,"_168":22,"_169":-5,"_170":296,"_98":297},"3ee4d69e-f891-11ef-b20d-569c3dd06744","favicon.svg","04f9b060-f618-11ef-bcdf-569c3dd06744",1446,["D",1741048818081],6,"file","",[],[235,289],{"_104":299,"_95":300,"_156":301,"_158":236,"_159":141,"_160":302,"_162":118,"_106":303,"_100":304,"_165":294,"_167":305,"_168":22,"_169":-5,"_170":306,"_98":307},"f88cf6fc-011b-11f0-b663-569c3dd06744","index.html","817cda0c-f601-11ef-a77a-569c3dd06744",1844,["D",1741988009414],87,"\n\n \n \n \n HN Notifier\n \n \n \n \n \n \n \n

\n \n \n",[],[235,300],{"_104":309,"_95":310,"_156":311,"_158":236,"_159":141,"_160":312,"_162":118,"_106":313,"_100":314,"_165":187,"_167":315,"_168":22,"_169":-5,"_170":316,"_98":317},"72a1a90c-f892-11ef-844d-569c3dd06744","index.tsx","b09bee86-f601-11ef-85b7-569c3dd06744",1447,["D",1741049334381],4,"/** @jsxImportSource https://esm.sh/react@18.2.0 */\nimport { createRoot } from \"https://esm.sh/react-dom@18.2.0/client\";\nimport { App } from \"https://esm.town/v/nbbaier/hn_notifier/frontend/components/App.tsx\";\n\nconst root = document.getElementById(\"root\");\nif (!root) {\n throw new Error(\"No root element found\");\n}\n\ncreateRoot(root).render();",[],[235,310],[235],{"_104":320,"_95":321,"_156":322,"_158":-5,"_159":141,"_160":323,"_162":118,"_106":324,"_100":164,"_165":166,"_167":-5,"_168":22,"_169":-5,"_170":325,"_98":346},"b14528c8-f617-11ef-9ab6-569c3dd06744","shared","88149506-f617-11ef-8cb6-569c3dd06744",706,["D",1740776709044],[326,336],{"_104":327,"_95":328,"_156":329,"_158":322,"_159":141,"_160":330,"_162":118,"_106":331,"_100":332,"_165":187,"_167":333,"_168":22,"_169":-5,"_170":334,"_98":335},"f6279ec2-1713-11f0-b479-569c3dd06744","types.ts","04689eea-f5ff-11ef-b4ed-569c3dd06744",1865,["D",1744403494999],10,"export type DBItem = {\n\tid: number;\n\ttitle: string;\n\tcomments: number;\n\ttype: \"story\" | \"comment\" | \"poll\" | \"pollopt\" | \"job\";\n};\n\nexport type HNAPIResponse = {\n\tauthor: string;\n\tchildren: HNAPIResponse[];\n\tcreated_at: string;\n\tcreated_at_i: number;\n\tid: number;\n\toptions: number[];\n\tparent_id: number | null;\n\tpoints: number;\n\tstory_id: number;\n\ttext: string | null;\n\ttitle: string | null;\n\ttype: \"story\" | \"comment\" | \"poll\" | \"pollopt\" | \"job\";\n\turl: string;\n};\n",[],[321,328],{"_104":337,"_95":338,"_156":339,"_158":322,"_159":141,"_160":340,"_162":118,"_106":341,"_100":342,"_165":187,"_167":343,"_168":22,"_169":-5,"_170":344,"_98":345},"0f7ff70a-1761-11f0-80c1-569c3dd06744","utils.ts","1f421046-f9e4-11ef-985b-569c3dd06744",1866,["D",1744436608768],3,"import { betterFetch } from \"https://esm.sh/@better-fetch/fetch@1.1.15\";\nimport type {\n\tHNAPIResponse,\n\tDBItem,\n} from \"https://esm.town/v/nbbaier/hn_notifier/shared/types.ts\";\n\n/**\n * Base URL for Hacker News item pages\n */\nexport const HN_BASE_URL = \"https://news.ycombinator.com/item\";\n\n/**\n * Base URL for the Hacker News Algolia API\n */\nexport const HN_API_URL = \"https://hn.algolia.com/api/v1/items\";\n\n/**\n * Counts the total number of child comments in a Hacker News item\n * @param item - The Hacker News item to count children for\n * @returns The total number of child comments\n */\nexport function countAllChildren(item: HNAPIResponse): number {\n\tconst stack: HNAPIResponse[] = [item];\n\tlet count = 0;\n\n\twhile (stack.length > 0) {\n\t\tconst current = stack.pop();\n\n\t\tif (current.children && current.children.length > 0) {\n\t\t\tcount += current.children.length;\n\t\t\tstack.push(...current.children);\n\t\t}\n\t}\n\n\treturn count;\n}\n\n/**\n * Fetches a Hacker News item by its ID using the Algolia API\n * @param id - The ID of the Hacker News item to fetch\n * @returns A promise that resolves to the Hacker News item data\n */\nexport async function getHNItem(id: number) {\n\treturn await betterFetch(`${HN_API_URL}/${id}`);\n}\n\n/**\n * Retrieves the title of a story that a comment belongs to\n * @param storyId - The ID of the story to get the title for\n * @returns A promise that resolves to an object containing the story title or an error\n */\nexport async function getHNCommentStoryTitle(storyId: number): Promise<{\n\tdata: { storyTitle: string } | null;\n\terror: {\n\t\tmessage?: string | undefined;\n\t\tstatus: number;\n\t\tstatusText: string;\n\t} | null;\n}> {\n\tconst { data, error } = await getHNItem(storyId);\n\n\tlet newData: { storyTitle: string };\n\n\tif (data) {\n\t\tconst { title } = data;\n\t\tnewData = { storyTitle: title || \"\" };\n\t}\n\n\treturn { data: newData || null, error };\n}\n\n/**\n * Creates a database item from Hacker News API response data\n * @param id - The ID of the Hacker News item\n * @param data - The Hacker News API response data\n * @returns A promise that resolves to a formatted database item\n */\nexport async function createDBItem(\n\tid: number,\n\tdata: HNAPIResponse,\n): Promise {\n\tconst comments = countAllChildren(data);\n\n\tif (data.type === \"comment\") {\n\t\tlet title = \"\";\n\t\tif (data.story_id) {\n\t\t\tconst { data: storyTitleData, error } = await getHNCommentStoryTitle(\n\t\t\t\tdata.story_id,\n\t\t\t);\n\t\t\tif (!error && storyTitleData) {\n\t\t\t\ttitle = `Comment on ${storyTitleData.storyTitle}`;\n\t\t\t}\n\t\t}\n\t\treturn { id, title, comments, type: \"comment\" };\n\t}\n\n\treturn {\n\t\tid,\n\t\ttitle: data.title || \"\",\n\t\tcomments,\n\t\ttype: data.type,\n\t};\n}\n",[],[321,338],[321],{"_104":348,"_95":349,"_156":350,"_158":-5,"_159":141,"_160":351,"_162":22,"_106":352,"_100":353,"_165":187,"_167":354,"_168":22,"_169":-5,"_170":355,"_98":356},"582fe30e-f964-11ef-a452-569c3dd06744","getTree.ts","ea9b3706-f88e-11ef-8612-569c3dd06744",1827,["D",1741139484326],17,"import createFileTree from \"https://esm.town/v/nbbaier/createFileTree\";\nimport { tableName } from \"https://esm.town/v/nbbaier/hn_notifier/backend/database/migrations.ts\";\nimport * as db from \"https://esm.town/v/nbbaier/hn_notifier/backend/database/queries.ts\";\nimport type { DBItem } from \"https://esm.town/v/nbbaier/hn_notifier/shared/types.ts\";\nimport sqliteRowsToObject from \"https://esm.town/v/nbbaier/sqliteRowsToObject\";\nimport { sqlite } from \"https://esm.town/v/std/sqlite?v=6\";\n\nconst id = 2;\nconst data = await db.getItem(id);\n\nconst res = await sqlite.execute({\n sql: `SELECT * FROM ${tableName} WHERE id = ?`,\n args: [id],\n});\n\nconsole.log(sqliteRowsToObject(res)[0], data);",[],[349],"files",[153,172,180,191,202,212,222,233,240,247,257,267,277,287,298,308,319,326,336,347],"counts",{"_361":32,"_362":164,"_363":164,"_364":32},"pulls","branches","forks","envVars","contents",[],{"_104":223,"_95":224,"_156":116,"_158":157,"_159":141,"_160":120,"_162":118,"_106":368,"_100":226,"_165":227,"_167":228,"_168":22,"_169":229,"_98":369},["D",1744393974202],[155,224],"upstreamProject","upstreamBranch","emptyEnvVars","isNew","flags",[],"routes/_app.x.$handle.$name.branch.$branch.version.$version.code.$",{"_93":94,"_95":96,"_97":43,"_100":101,"_98":99,"_102":378,"_151":383,"_357":444,"_294":445,"_365":447,"_448":-5,"_449":22,"_450":-5,"_451":-5,"_452":-5,"_453":454},{"_104":105,"_95":96,"_106":379,"_108":-5,"_109":22,"_110":111,"_112":-5,"_113":-5,"_14":114,"_115":116,"_117":118,"_119":120,"_121":32,"_16":122,"_123":124,"_125":124,"_126":127,"_128":127,"_129":127,"_130":124,"_131":124,"_23":380,"_135":381,"_138":382,"_150":22},["D",1740540524461],{"_93":94,"_133":134},{"_93":94,"_137":134},{"_100":140,"_95":43,"_104":141,"_142":105,"_143":-5,"_144":-5,"_145":-5,"_146":-5,"_147":-5,"_148":96,"_149":94},[384,405,432,441],{"_104":154,"_95":155,"_156":157,"_158":-5,"_159":141,"_160":161,"_162":118,"_106":163,"_100":164,"_165":166,"_167":-5,"_168":22,"_169":-5,"_170":385,"_98":404},[386,395,398,401],{"_104":173,"_95":174,"_156":175,"_158":157,"_159":141,"_160":176,"_162":118,"_106":177,"_100":178,"_165":166,"_167":-5,"_168":22,"_169":-5,"_170":387,"_98":394},[388,391],{"_104":181,"_95":182,"_156":183,"_158":175,"_159":141,"_160":184,"_162":118,"_106":185,"_100":186,"_165":187,"_167":188,"_168":22,"_169":-5,"_170":389,"_98":390},[],[155,174,182],{"_104":192,"_95":193,"_156":194,"_158":175,"_159":141,"_160":195,"_162":118,"_106":196,"_100":197,"_165":187,"_167":198,"_168":22,"_169":-5,"_170":392,"_98":393},[],[155,174,193],[155,174],{"_104":203,"_95":204,"_156":205,"_158":157,"_159":141,"_160":206,"_162":118,"_106":207,"_100":208,"_165":187,"_167":209,"_168":22,"_169":-5,"_170":396,"_98":397},[],[155,204],{"_104":213,"_95":214,"_156":215,"_158":157,"_159":141,"_160":216,"_162":118,"_106":217,"_100":218,"_165":187,"_167":219,"_168":22,"_169":-5,"_170":399,"_98":400},[],[155,214],{"_104":223,"_95":224,"_156":116,"_158":157,"_159":141,"_160":120,"_162":118,"_106":225,"_100":226,"_165":227,"_167":228,"_168":22,"_169":229,"_170":402,"_98":403},[],[155,224],[155],{"_104":234,"_95":235,"_156":236,"_158":-5,"_159":141,"_160":237,"_162":118,"_106":238,"_100":164,"_165":166,"_167":-5,"_168":22,"_169":-5,"_170":406,"_98":431},[407,422,425,428],{"_104":241,"_95":242,"_156":243,"_158":236,"_159":141,"_160":244,"_162":118,"_106":245,"_100":164,"_165":166,"_167":-5,"_168":22,"_169":-5,"_170":408,"_98":421},[409,412,415,418],{"_104":248,"_95":249,"_156":250,"_158":243,"_159":141,"_160":251,"_162":22,"_106":252,"_100":253,"_165":187,"_167":254,"_168":22,"_169":-5,"_170":410,"_98":411},[],[235,242,249],{"_104":258,"_95":259,"_156":260,"_158":243,"_159":141,"_160":261,"_162":22,"_106":262,"_100":263,"_165":187,"_167":264,"_168":22,"_169":-5,"_170":413,"_98":414},[],[235,242,259],{"_104":268,"_95":269,"_156":270,"_158":243,"_159":141,"_160":271,"_162":22,"_106":272,"_100":273,"_165":187,"_167":274,"_168":22,"_169":-5,"_170":416,"_98":417},[],[235,242,269],{"_104":278,"_95":279,"_156":280,"_158":243,"_159":141,"_160":101,"_162":22,"_106":281,"_100":282,"_165":187,"_167":283,"_168":22,"_169":-5,"_170":419,"_98":420},[],[235,242,279],[235,242],{"_104":288,"_95":289,"_156":290,"_158":236,"_159":141,"_160":291,"_162":118,"_106":292,"_100":293,"_165":294,"_167":295,"_168":22,"_169":-5,"_170":423,"_98":424},[],[235,289],{"_104":299,"_95":300,"_156":301,"_158":236,"_159":141,"_160":302,"_162":118,"_106":303,"_100":304,"_165":294,"_167":305,"_168":22,"_169":-5,"_170":426,"_98":427},[],[235,300],{"_104":309,"_95":310,"_156":311,"_158":236,"_159":141,"_160":312,"_162":118,"_106":313,"_100":314,"_165":187,"_167":315,"_168":22,"_169":-5,"_170":429,"_98":430},[],[235,310],[235],{"_104":320,"_95":321,"_156":322,"_158":-5,"_159":141,"_160":323,"_162":118,"_106":324,"_100":164,"_165":166,"_167":-5,"_168":22,"_169":-5,"_170":433,"_98":440},[434,437],{"_104":327,"_95":328,"_156":329,"_158":322,"_159":141,"_160":330,"_162":118,"_106":331,"_100":332,"_165":187,"_167":333,"_168":22,"_169":-5,"_170":435,"_98":436},[],[321,328],{"_104":337,"_95":338,"_156":339,"_158":322,"_159":141,"_160":340,"_162":118,"_106":341,"_100":342,"_165":187,"_167":343,"_168":22,"_169":-5,"_170":438,"_98":439},[],[321,338],[321],{"_104":348,"_95":349,"_156":350,"_158":-5,"_159":141,"_160":351,"_162":22,"_106":352,"_100":353,"_165":187,"_167":354,"_168":22,"_169":-5,"_170":442,"_98":443},[],[349],[384,386,388,391,395,398,401,405,407,409,412,415,418,422,425,428,432,434,437,441],{"_104":223,"_95":224,"_156":116,"_158":157,"_159":141,"_160":120,"_162":118,"_106":368,"_100":226,"_165":227,"_167":228,"_168":22,"_169":229,"_98":446},[155,224],[],"upstream","showCompareCallout","pull","ahead","behind","templates",[],"actionData","errors"]