1/** @jsxImportSource https://esm.sh/react@18.2.0 */
2import React, { useEffect, useState } from "https://esm.sh/react@18.2.0";
3import { MCPServerConfig } from "../../shared/types.ts";
4import useMCPClients from "../hooks/useMCPClients.tsx";
1/** @jsxImportSource https://esm.sh/react@19 */
2import fcsdk from 'https://esm.sh/@farcaster/frame-sdk'
3import { useQuery } from 'https://esm.sh/@tanstack/react-query@5'
4import { AudioLines, Mic, MicOff, LoaderCircle } from 'https://esm.sh/lucide-react@0.510.0'
5import { NavLink, Route, Routes, useNavigate, useParams } from 'https://esm.sh/react-router@7'
6import { use, useEffect, useRef, useState } from 'https://esm.sh/react@19'
7
8import { Button, Input, Section, ShareButton, Sheet } from '../components/ui.tsx'
19 usePublish, // Publish the local tracks
20 useRemoteUsers, // Retrieve the list of remote users
21} from 'https://esm.sh/agora-rtc-react'
22import AgoraRTC, { AgoraRTCProvider } from 'https://esm.sh/agora-rtc-react'
23
24const client = AgoraRTC.createClient({ mode: 'live', codec: 'vp8', role: 'host' })
1/** @jsxImportSource https://esm.sh/react */
2import { render } from 'https://deno.land/x/resvg_wasm/mod.ts'
3import { Hono } from 'npm:hono'
1/** @jsxImportSource https://esm.sh/react@19 */
2import fcsdk from 'https://esm.sh/@farcaster/frame-sdk'
3import { useQuery } from 'https://esm.sh/@tanstack/react-query@5'
4import { LoaderCircle, Mic, MicOff } from 'https://esm.sh/lucide-react@0.510.0'
5import { NavLink, Route, Routes, useNavigate, useParams } from 'https://esm.sh/react-router@7'
6import { useEffect, useRef, useState } from 'https://esm.sh/react@19'
7
8import { Button, Input, Section, ShareButton } from '../components/ui.tsx'
1/** @jsxImportSource https://esm.sh/react@19 */
2import fcsdk from 'https://esm.sh/@farcaster/frame-sdk'
3import { NavLink, Route, Routes } from 'https://esm.sh/react-router@7'
4import { useEffect, useState } from 'https://esm.sh/react@19'
5
6import { Analytics } from "./components/Analytics.tsx"
1/** @jsxImportSource https://esm.sh/react@19 */
2import fcsdk from 'https://esm.sh/@farcaster/frame-sdk'
3import { useLocation } from 'https://esm.sh/react-router@7'
4import { useEffect, useState } from 'https://esm.sh/react@19'
5
6import { sendAnalyticsEvent } from '../util/supabase.ts'
1/** @jsxImportSource https://esm.sh/react@18.2.0 */
2import { renderToString } from "npm:react-dom@18.2.0/server";
3
4/*
5📁 main.tsx
6*/
7import React from "npm:react";
8import TodoApp from "./TodoApp.tsx";
9
24 dangerouslySetInnerHTML={{
25 __html: `
26 import React from "npm:react";
27 // Use esm.sh client build for hydrateRoot
28 import { hydrateRoot } from "https://esm.sh/react-dom@18.2.0/client";
29 import TodoApp from "./TodoApp.tsx";
30 hydrateRoot(document.getElementById("root"), React.createElement(TodoApp));
31 `,
32 }}
1/** @jsxImportSource https://esm.sh/react@18.2.0 */
2import { renderToString } from "npm:react-dom@18.2.0/server";
3
4// TodoApp.tsx
5"use client"; // opt into client‑side interactivity
6import { useEffect, useState } from "npm:react";
7
8interface Todo {
25 }, []);
26
27 const add = async (e: React.FormEvent) => {
28 e.preventDefault();
29 await fetch("/api/todos", {
24
25 <script type="module">
26 import React, { useState, useEffect } from 'https://esm.sh/react@18.2.0?deps=react@18.2.0';
27 import ReactDOM from 'https://esm.sh/react-dom@18.2.0/client?deps=react@18.2.0,react-dom@18.2.0';
28
29 function App() {
212 }
213
214 const root = ReactDOM.createRoot(document.getElementById('root'));
215 root.render(React.createElement(App));
216 </script>
217</body>
13- `backend/index.ts` - Main Hono server with API endpoints
14- `frontend/index.html` - Main HTML template
15- `frontend/index.tsx` - React frontend application
16- `shared/types.ts` - Shared TypeScript types
17
