1/** @jsxImportSource https://esm.sh/react@19.0.0 */
2
3type StatusBadgeProps = {
1/** @jsxImportSource https://esm.sh/react@19.1.0 */
2import { useContext, useState } from "https://esm.sh/react@19.1.0";
3import { ATProtoContext } from "../context.ts";
4import { RunForm } from "./RunForm.tsx";
1/** @jsxImportSource https://esm.sh/react@19.0.0 */
2
3import { Skeleton } from "../Loading.tsx";
1/** @jsxImportSource https://esm.sh/react@18.2.0 */
2import React, { useState, useEffect } from "https://esm.sh/react@18.2.0";
3import { createRoot } from "https://esm.sh/react-dom@18.2.0/client";
4
5interface AttendanceRecord {
1/** @jsxImportSource https://esm.sh/react@18.2.0 */
2import React, { useState, useEffect, useRef } from "https://esm.sh/react@18.2.0";
3import { createRoot } from "https://esm.sh/react-dom@18.2.0/client";
4
5function App() {
1import { useState, useEffect } from "https://esm.sh/react@18.2.0?dev";
2import { fetchProjectFiles } from "../utils/api.ts";
3
1import { useChat } from "https://esm.sh/@ai-sdk/react?dev&deps=react@18.2.0&react-dom@18.2.0";
2import React, { useCallback, useMemo, useRef, useState } from "https://esm.sh/react@18.2.0?dev";
3import { playBellSound } from "../utils/soundEffects.ts";
4
99 }, [stop, pendingMessageId, soundEnabled]);
100
101 React.useEffect(() => {
102 customStopRef.current = handleStop;
103 }, [handleStop]);
104
105 React.useEffect(() => {
106 (window as any).customStopRef = customStopRef;
107 }, []);
1- [ ] Give it a tool to make an HTTP request to its own endpoint to test things!
2- [ ] Get React Router working on the client & move off localstorage for storing page state
3- [ ] When it hits the max number of steps, detect that and give the user a button (or instructions on how) to get it to continue (neverstew mentioned this)
4- [ ] Make it look good
183- **Imports:** Use `https://esm.sh` for npm and Deno dependencies to ensure compatibility on server and browser
184- **Storage Strategy:** Only use backend storage if explicitly required; prefer simple static client-side sites
185- **React Configuration:** When using React libraries, pin versions with `?deps=react@18.2.0,react-dom@18.2.0` and start the file with `/** @jsxImportSource https://esm.sh/react@18.2.0 */`
186- Ensure all React dependencies and sub-dependencies are pinned to the same version
187- **Styling:** Default to using TailwindCSS via `<script src="https://cdn.twind.style" crossorigin></script>` unless otherwise specified
188
269 - Always run table creation before querying
270
2713. **React Configuration:**
272 - All React dependencies must be pinned to 18.2.0
273 - Always include `@jsxImportSource https://esm.sh/react@18.2.0` at the top of React files
274 - Rendering issues often come from mismatched React versions
275
2764. **File Handling:**
46
47OpenTownie is built with:
48- React frontend with TypeScript
49- Hono API server backend
50- Tailwind CSS for styling
