1/** @jsxImportSource https://esm.sh/react@18.2.0 */
2import React, { useState, useEffect } from "https://esm.sh/react@18.2.0";
3import { Contact } from "../../shared/types.ts";
4import ContactList from "./ContactList.tsx";
1/** @jsxImportSource https://esm.sh/react@18.2.0 */
2import React from "https://esm.sh/react@18.2.0";
3import { createRoot } from "https://esm.sh/react-dom@18.2.0/client";
4import App from "./components/App.tsx";
5
43
44- Backend: Hono, SQLite
45- Frontend: React, Tailwind CSS
46- Shared: TypeScript
1/** @jsxImportSource https://esm.sh/react@18.2.0 */
2import { useState } from "https://esm.sh/react@18.2.0";
3
4export default function GitHubPRAnalyzer() {
1/** @jsxImportSource https://esm.sh/react@18.2.0 */
2import React, { useState } from "https://esm.sh/react@18.2.0";
3import { User } from "../../shared/types.ts";
4
7}
8
9const LoginForm: React.FC<LoginFormProps> = ({ onLoginSuccess }) => {
10 const [email, setEmail] = useState("");
11 const [name, setName] = useState("");
13 const [error, setError] = useState<string | null>(null);
14
15 const handleSubmit = async (e: React.FormEvent) => {
16 e.preventDefault();
17
1/** @jsxImportSource https://esm.sh/react@18.2.0 */
2import React, { useState } from "https://esm.sh/react@18.2.0";
3import { User } from "../../shared/types.ts";
4
8}
9
10const Header: React.FC<HeaderProps> = ({ user, onLogout }) => {
11 const [menuOpen, setMenuOpen] = useState(false);
12
1/** @jsxImportSource https://esm.sh/react@18.2.0 */
2import React, { useState, useEffect } from "https://esm.sh/react@18.2.0";
3import Header from "./Header.tsx";
4import LoginForm from "./LoginForm.tsx";
17}
18
19const App: React.FC = () => {
20 const [user, setUser] = useState<User | null>(null);
21 const [token, setToken] = useState<string | null>(null);
1/** @jsxImportSource https://esm.sh/react@18.2.0 */
2import React from "https://esm.sh/react@18.2.0";
3import { createRoot } from "https://esm.sh/react-dom@18.2.0/client";
4import App from "./components/App.tsx";
5
19โ โโโ index.ts # Main API entry point
20โโโ frontend/
21โ โโโ components/ # React components
22โ โโโ index.html # Main HTML template
23โ โโโ index.tsx # Frontend entry point
27## Technologies Used
28
29- Frontend: React, TailwindCSS
30- Backend: Hono API framework
31- Database: SQLite
60 <input type="text" id="repo" name="repo" required
61 class="w-full px-4 py-2 border border-gray-300 rounded-md focus:ring-blue-500 focus:border-blue-500"
62 placeholder="e.g., react">
63 </div>
64 </div>