/** @jsxImportSource https://esm.sh/react */ import { useEffect, useReducer, useState } from "https://esm.sh/react"; import { hydrateRoot } from "https://esm.sh/react-dom/client"; import { renderToString } from "https://esm.sh/react-dom/server"; import { hnSearch } from "https://esm.town/v/stevekrouse/hnSearch"; import About from "https://esm.town/v/vawogbemi/whoIsHiringAbout"; import Home from "https://esm.town/v/vawogbemi/whoIsHiringHome"; function App() { const tabs = { "/": "Home", "/about": "About" }; const [activeTab, setActiveTab] = useState("/"); const reducer = (state: { query: string; story: string; page: string; loading: boolean; }, action: { type: string; value: string | boolean }) => { switch (action.type) { case "query": return { ...state, query: action.value }; case "story": return { ...state, story: action.value }; case "page": return { ...state, page: action.value }; case "loading": return { ...state, loading: action.value }; default: return state; } }; const [state, dispatch] = useReducer(reducer, { query: "", story: "", page: "1", loading: true, }); const [stories, setStories] = useState<{ date: string; objectID: string }[]>([]); const [pages, setPages] = useState([]); const [comments, setComments] = useState<{ author: string; comment_text: string; objectID: string }>([]); const fetchStories = async () => { try { const response = await fetch("/api/stories"); if (!response.ok) throw new Error("Failed to fetch dates"); const data = await response.json(); setStories(data); dispatch({ type: "story", value: data[0].objectID }); } catch (err) { } }; const fetchComments = async (query, story, page) => { try { const response = await fetch(`/api/comments?query=${query}&story=${story}&page=${page}`); if (!response.ok) throw new Error("Failed to fetch happy hours"); const data = await response.json(); setPages(Array.from({ length: Math.ceil(data.nbHits / data.hitsPerPage) }, (_, i) => i + 1)); setComments(data.hits); } catch (err) { } }; useEffect(() => { fetchStories(); }, []); useEffect(() => { try { dispatch({ type: "loading", value: true }); const response = fetchComments(state.query, state.story, state.page); dispatch({ type: "loading", value: false }); } catch (err) { } }, [state.story, state.page]); return ( <>

{Object.entries(tabs).map(([link, title]) => ( (e.preventDefault(), setActiveTab(link))} > {title === "Home" ?

: title} ))}

{activeTab == "/" ? (

<> Date <> Page <> Search (dispatch({ type: "query", value: e.target.value }), dispatch({ type: "page", value: "1" }))} />

{!state.loading && (

{comments.map((comment) => (

{comment.author}

))}

)}

) : } ); } if (typeof document !== "undefined") { hydrateRoot(document.getElementById("root"), ); } export default async function(req: Request): Promise { const url = new URL(req.url); if (url.pathname === "/api/stories") { const storySearch = await hnSearch({ search_by_date: true, query: "", numericFilters: `created_at_i>${Math.floor(Date.now() / 1000) - 60 * 60 * 24 * 7 * 52}`, tags: "story,author_whoishiring", }); return new Response( JSON.stringify( storySearch.hits.filter((story, index) => story.title.startsWith("Ask HN: Who is hiring?")).map(( story, number, ) => ({ date: story.title.slice(24, -1), objectID: story.objectID })), ), { headers: { "Content-Type": "application/json" }, }, ); } if (url.pathname === "/api/comments") { const params = url.searchParams; const query = params.get("search"); const story = params.get("story"); const page = parseInt(params.get("page")); const commentSearch = await hnSearch({ query: query, tags: `comment, story_${story}`, page: page - 1, }); return new Response( JSON.stringify( commentSearch, ), { headers: { "Content-Type": "application/json" }, }, ); } return new Response( renderToString(

, ), { headers: { "content-type": "text/html", }, }, ); }