/home/mrjunejune/zenbu: react_games/src/current.tsx annotate

annotate react_games/src/current.tsx @ 71:75de5903355c

Giagantic changes that update Dowa library to be more align with stb style array and hashmap. Updated Seobeo to be caching on server side instead of file level caching. Deleted bunch of things I don't really use.

author	June Park <parkjune1995@gmail.com>
date	Sun, 28 Dec 2025 20:34:22 -0800
parents	829623189a57
children

rev	line source
47 829623189a57 [Gara] Android commit. Bazelfied it. MrJuneJune <me@mrjunejune.com> parents: 44 diff changeset	1 import { CSSProperties, useReducer, useState, useRef, useEffect } from "react";
37 fb9bcd3145cb [ReactGames] Few games I made using react just to practice few things. MrJuneJune <me@mrjunejune.com> parents: diff changeset	2 import ReactDOM from "react-dom/client";
fb9bcd3145cb [ReactGames] Few games I made using react just to practice few things. MrJuneJune <me@mrjunejune.com> parents: diff changeset	3
44 0cfd7d9277b0 [ReactGame] 2048 MrJuneJune <me@mrjunejune.com> parents: 37 diff changeset	4 /**
47 829623189a57 [Gara] Android commit. Bazelfied it. MrJuneJune <me@mrjunejune.com> parents: 44 diff changeset	5 * CONFIGURATION
829623189a57 [Gara] Android commit. Bazelfied it. MrJuneJune <me@mrjunejune.com> parents: 44 diff changeset	6 * Replace this with your actual API key or fetch it from an environment variable.
44 0cfd7d9277b0 [ReactGame] 2048 MrJuneJune <me@mrjunejune.com> parents: 37 diff changeset	7 */
47 829623189a57 [Gara] Android commit. Bazelfied it. MrJuneJune <me@mrjunejune.com> parents: 44 diff changeset	8 const OPENAI_API_KEY = "YOUR_OPENAI_API_KEY_HERE";
44 0cfd7d9277b0 [ReactGame] 2048 MrJuneJune <me@mrjunejune.com> parents: 37 diff changeset	9
47 829623189a57 [Gara] Android commit. Bazelfied it. MrJuneJune <me@mrjunejune.com> parents: 44 diff changeset	10 interface ChatStyle {
829623189a57 [Gara] Android commit. Bazelfied it. MrJuneJune <me@mrjunejune.com> parents: 44 diff changeset	11 mainContainer: CSSProperties;
829623189a57 [Gara] Android commit. Bazelfied it. MrJuneJune <me@mrjunejune.com> parents: 44 diff changeset	12 sideBar: CSSProperties;
829623189a57 [Gara] Android commit. Bazelfied it. MrJuneJune <me@mrjunejune.com> parents: 44 diff changeset	13 sideBarItem: CSSProperties; // Added for hover/layout
829623189a57 [Gara] Android commit. Bazelfied it. MrJuneJune <me@mrjunejune.com> parents: 44 diff changeset	14 mainChat: CSSProperties;
829623189a57 [Gara] Android commit. Bazelfied it. MrJuneJune <me@mrjunejune.com> parents: 44 diff changeset	15 mainMessage: CSSProperties;
829623189a57 [Gara] Android commit. Bazelfied it. MrJuneJune <me@mrjunejune.com> parents: 44 diff changeset	16 messageBubble: CSSProperties; // Added for styling messages
829623189a57 [Gara] Android commit. Bazelfied it. MrJuneJune <me@mrjunejune.com> parents: 44 diff changeset	17 inputBar: CSSProperties;
37 fb9bcd3145cb [ReactGames] Few games I made using react just to practice few things. MrJuneJune <me@mrjunejune.com> parents: diff changeset	18 }
fb9bcd3145cb [ReactGames] Few games I made using react just to practice few things. MrJuneJune <me@mrjunejune.com> parents: diff changeset	19
47 829623189a57 [Gara] Android commit. Bazelfied it. MrJuneJune <me@mrjunejune.com> parents: 44 diff changeset	20 const STYLES: ChatStyle = {
829623189a57 [Gara] Android commit. Bazelfied it. MrJuneJune <me@mrjunejune.com> parents: 44 diff changeset	21 mainContainer: {
829623189a57 [Gara] Android commit. Bazelfied it. MrJuneJune <me@mrjunejune.com> parents: 44 diff changeset	22 display: "flex",
829623189a57 [Gara] Android commit. Bazelfied it. MrJuneJune <me@mrjunejune.com> parents: 44 diff changeset	23 backgroundColor: "#1e1e1e",
829623189a57 [Gara] Android commit. Bazelfied it. MrJuneJune <me@mrjunejune.com> parents: 44 diff changeset	24 color: "white",
829623189a57 [Gara] Android commit. Bazelfied it. MrJuneJune <me@mrjunejune.com> parents: 44 diff changeset	25 fontFamily: "sans-serif",
829623189a57 [Gara] Android commit. Bazelfied it. MrJuneJune <me@mrjunejune.com> parents: 44 diff changeset	26 height: "100vh",
829623189a57 [Gara] Android commit. Bazelfied it. MrJuneJune <me@mrjunejune.com> parents: 44 diff changeset	27 margin: 0,
829623189a57 [Gara] Android commit. Bazelfied it. MrJuneJune <me@mrjunejune.com> parents: 44 diff changeset	28 },
829623189a57 [Gara] Android commit. Bazelfied it. MrJuneJune <me@mrjunejune.com> parents: 44 diff changeset	29 sideBar: {
829623189a57 [Gara] Android commit. Bazelfied it. MrJuneJune <me@mrjunejune.com> parents: 44 diff changeset	30 width: "250px",
829623189a57 [Gara] Android commit. Bazelfied it. MrJuneJune <me@mrjunejune.com> parents: 44 diff changeset	31 height: "100vh",
829623189a57 [Gara] Android commit. Bazelfied it. MrJuneJune <me@mrjunejune.com> parents: 44 diff changeset	32 overflowY: "auto",
829623189a57 [Gara] Android commit. Bazelfied it. MrJuneJune <me@mrjunejune.com> parents: 44 diff changeset	33 backgroundColor: "#000000",
829623189a57 [Gara] Android commit. Bazelfied it. MrJuneJune <me@mrjunejune.com> parents: 44 diff changeset	34 borderRight: "1px solid #333",
829623189a57 [Gara] Android commit. Bazelfied it. MrJuneJune <me@mrjunejune.com> parents: 44 diff changeset	35 padding: "1rem",
829623189a57 [Gara] Android commit. Bazelfied it. MrJuneJune <me@mrjunejune.com> parents: 44 diff changeset	36 },
829623189a57 [Gara] Android commit. Bazelfied it. MrJuneJune <me@mrjunejune.com> parents: 44 diff changeset	37 sideBarItem: {
829623189a57 [Gara] Android commit. Bazelfied it. MrJuneJune <me@mrjunejune.com> parents: 44 diff changeset	38 padding: "10px",
829623189a57 [Gara] Android commit. Bazelfied it. MrJuneJune <me@mrjunejune.com> parents: 44 diff changeset	39 cursor: "pointer",
829623189a57 [Gara] Android commit. Bazelfied it. MrJuneJune <me@mrjunejune.com> parents: 44 diff changeset	40 backgroundColor: "#333",
829623189a57 [Gara] Android commit. Bazelfied it. MrJuneJune <me@mrjunejune.com> parents: 44 diff changeset	41 marginBottom: "5px",
829623189a57 [Gara] Android commit. Bazelfied it. MrJuneJune <me@mrjunejune.com> parents: 44 diff changeset	42 borderRadius: "5px",
829623189a57 [Gara] Android commit. Bazelfied it. MrJuneJune <me@mrjunejune.com> parents: 44 diff changeset	43 whiteSpace: "nowrap",
829623189a57 [Gara] Android commit. Bazelfied it. MrJuneJune <me@mrjunejune.com> parents: 44 diff changeset	44 overflow: "hidden",
829623189a57 [Gara] Android commit. Bazelfied it. MrJuneJune <me@mrjunejune.com> parents: 44 diff changeset	45 textOverflow: "ellipsis",
829623189a57 [Gara] Android commit. Bazelfied it. MrJuneJune <me@mrjunejune.com> parents: 44 diff changeset	46 },
829623189a57 [Gara] Android commit. Bazelfied it. MrJuneJune <me@mrjunejune.com> parents: 44 diff changeset	47 mainChat: {
829623189a57 [Gara] Android commit. Bazelfied it. MrJuneJune <me@mrjunejune.com> parents: 44 diff changeset	48 flex: 1,
829623189a57 [Gara] Android commit. Bazelfied it. MrJuneJune <me@mrjunejune.com> parents: 44 diff changeset	49 display: "flex",
829623189a57 [Gara] Android commit. Bazelfied it. MrJuneJune <me@mrjunejune.com> parents: 44 diff changeset	50 flexDirection: "column",
829623189a57 [Gara] Android commit. Bazelfied it. MrJuneJune <me@mrjunejune.com> parents: 44 diff changeset	51 backgroundColor: "#343541",
829623189a57 [Gara] Android commit. Bazelfied it. MrJuneJune <me@mrjunejune.com> parents: 44 diff changeset	52 height: "100vh",
829623189a57 [Gara] Android commit. Bazelfied it. MrJuneJune <me@mrjunejune.com> parents: 44 diff changeset	53 },
829623189a57 [Gara] Android commit. Bazelfied it. MrJuneJune <me@mrjunejune.com> parents: 44 diff changeset	54 mainMessage: {
829623189a57 [Gara] Android commit. Bazelfied it. MrJuneJune <me@mrjunejune.com> parents: 44 diff changeset	55 flex: 1,
829623189a57 [Gara] Android commit. Bazelfied it. MrJuneJune <me@mrjunejune.com> parents: 44 diff changeset	56 padding: "20px",
829623189a57 [Gara] Android commit. Bazelfied it. MrJuneJune <me@mrjunejune.com> parents: 44 diff changeset	57 overflowY: "auto",
44 0cfd7d9277b0 [ReactGame] 2048 MrJuneJune <me@mrjunejune.com> parents: 37 diff changeset	58 display: "flex",
0cfd7d9277b0 [ReactGame] 2048 MrJuneJune <me@mrjunejune.com> parents: 37 diff changeset	59 flexDirection: "column",
47 829623189a57 [Gara] Android commit. Bazelfied it. MrJuneJune <me@mrjunejune.com> parents: 44 diff changeset	60 gap: "15px",
829623189a57 [Gara] Android commit. Bazelfied it. MrJuneJune <me@mrjunejune.com> parents: 44 diff changeset	61 },
829623189a57 [Gara] Android commit. Bazelfied it. MrJuneJune <me@mrjunejune.com> parents: 44 diff changeset	62 messageBubble: {
829623189a57 [Gara] Android commit. Bazelfied it. MrJuneJune <me@mrjunejune.com> parents: 44 diff changeset	63 padding: "15px",
829623189a57 [Gara] Android commit. Bazelfied it. MrJuneJune <me@mrjunejune.com> parents: 44 diff changeset	64 borderRadius: "8px",
829623189a57 [Gara] Android commit. Bazelfied it. MrJuneJune <me@mrjunejune.com> parents: 44 diff changeset	65 lineHeight: "1.5",
829623189a57 [Gara] Android commit. Bazelfied it. MrJuneJune <me@mrjunejune.com> parents: 44 diff changeset	66 maxWidth: "800px",
829623189a57 [Gara] Android commit. Bazelfied it. MrJuneJune <me@mrjunejune.com> parents: 44 diff changeset	67 margin: "0 auto",
829623189a57 [Gara] Android commit. Bazelfied it. MrJuneJune <me@mrjunejune.com> parents: 44 diff changeset	68 width: "100%",
44 0cfd7d9277b0 [ReactGame] 2048 MrJuneJune <me@mrjunejune.com> parents: 37 diff changeset	69 },
47 829623189a57 [Gara] Android commit. Bazelfied it. MrJuneJune <me@mrjunejune.com> parents: 44 diff changeset	70 inputBar: {
829623189a57 [Gara] Android commit. Bazelfied it. MrJuneJune <me@mrjunejune.com> parents: 44 diff changeset	71 width: "100%",
829623189a57 [Gara] Android commit. Bazelfied it. MrJuneJune <me@mrjunejune.com> parents: 44 diff changeset	72 height: "100px",
829623189a57 [Gara] Android commit. Bazelfied it. MrJuneJune <me@mrjunejune.com> parents: 44 diff changeset	73 padding: "15px",
829623189a57 [Gara] Android commit. Bazelfied it. MrJuneJune <me@mrjunejune.com> parents: 44 diff changeset	74 backgroundColor: "#40414f",
829623189a57 [Gara] Android commit. Bazelfied it. MrJuneJune <me@mrjunejune.com> parents: 44 diff changeset	75 color: "white",
829623189a57 [Gara] Android commit. Bazelfied it. MrJuneJune <me@mrjunejune.com> parents: 44 diff changeset	76 border: "none",
829623189a57 [Gara] Android commit. Bazelfied it. MrJuneJune <me@mrjunejune.com> parents: 44 diff changeset	77 borderTop: "1px solid #555",
829623189a57 [Gara] Android commit. Bazelfied it. MrJuneJune <me@mrjunejune.com> parents: 44 diff changeset	78 fontSize: "16px",
829623189a57 [Gara] Android commit. Bazelfied it. MrJuneJune <me@mrjunejune.com> parents: 44 diff changeset	79 resize: "none",
829623189a57 [Gara] Android commit. Bazelfied it. MrJuneJune <me@mrjunejune.com> parents: 44 diff changeset	80 outline: "none",
44 0cfd7d9277b0 [ReactGame] 2048 MrJuneJune <me@mrjunejune.com> parents: 37 diff changeset	81 },
47 829623189a57 [Gara] Android commit. Bazelfied it. MrJuneJune <me@mrjunejune.com> parents: 44 diff changeset	82 };
829623189a57 [Gara] Android commit. Bazelfied it. MrJuneJune <me@mrjunejune.com> parents: 44 diff changeset	83
829623189a57 [Gara] Android commit. Bazelfied it. MrJuneJune <me@mrjunejune.com> parents: 44 diff changeset	84 type Chat = {
829623189a57 [Gara] Android commit. Bazelfied it. MrJuneJune <me@mrjunejune.com> parents: 44 diff changeset	85 id: string;
829623189a57 [Gara] Android commit. Bazelfied it. MrJuneJune <me@mrjunejune.com> parents: 44 diff changeset	86 title: string;
829623189a57 [Gara] Android commit. Bazelfied it. MrJuneJune <me@mrjunejune.com> parents: 44 diff changeset	87 createdAt: number;
829623189a57 [Gara] Android commit. Bazelfied it. MrJuneJune <me@mrjunejune.com> parents: 44 diff changeset	88 };
829623189a57 [Gara] Android commit. Bazelfied it. MrJuneJune <me@mrjunejune.com> parents: 44 diff changeset	89
829623189a57 [Gara] Android commit. Bazelfied it. MrJuneJune <me@mrjunejune.com> parents: 44 diff changeset	90 type ChatHistory = Chat[];
829623189a57 [Gara] Android commit. Bazelfied it. MrJuneJune <me@mrjunejune.com> parents: 44 diff changeset	91
829623189a57 [Gara] Android commit. Bazelfied it. MrJuneJune <me@mrjunejune.com> parents: 44 diff changeset	92 type Message = {
829623189a57 [Gara] Android commit. Bazelfied it. MrJuneJune <me@mrjunejune.com> parents: 44 diff changeset	93 id: string;
829623189a57 [Gara] Android commit. Bazelfied it. MrJuneJune <me@mrjunejune.com> parents: 44 diff changeset	94 role: 'user' \| 'assistant'; // Changed from 'author' to match OpenAI spec usually
829623189a57 [Gara] Android commit. Bazelfied it. MrJuneJune <me@mrjunejune.com> parents: 44 diff changeset	95 content: string; // Changed from 'message' to 'content'
829623189a57 [Gara] Android commit. Bazelfied it. MrJuneJune <me@mrjunejune.com> parents: 44 diff changeset	96 createdAt: number;
829623189a57 [Gara] Android commit. Bazelfied it. MrJuneJune <me@mrjunejune.com> parents: 44 diff changeset	97 };
829623189a57 [Gara] Android commit. Bazelfied it. MrJuneJune <me@mrjunejune.com> parents: 44 diff changeset	98
829623189a57 [Gara] Android commit. Bazelfied it. MrJuneJune <me@mrjunejune.com> parents: 44 diff changeset	99 type MainPage = {
829623189a57 [Gara] Android commit. Bazelfied it. MrJuneJune <me@mrjunejune.com> parents: 44 diff changeset	100 activeChatId: string \| null;
829623189a57 [Gara] Android commit. Bazelfied it. MrJuneJune <me@mrjunejune.com> parents: 44 diff changeset	101 chatHistory: ChatHistory;
829623189a57 [Gara] Android commit. Bazelfied it. MrJuneJune <me@mrjunejune.com> parents: 44 diff changeset	102 currentMessages: Message[];
829623189a57 [Gara] Android commit. Bazelfied it. MrJuneJune <me@mrjunejune.com> parents: 44 diff changeset	103 allChats: Record<string, Message[]>;
829623189a57 [Gara] Android commit. Bazelfied it. MrJuneJune <me@mrjunejune.com> parents: 44 diff changeset	104 sendMessageStatus: 'idle' \| 'inProgress' \| 'failed' \| 'success';
829623189a57 [Gara] Android commit. Bazelfied it. MrJuneJune <me@mrjunejune.com> parents: 44 diff changeset	105 };
829623189a57 [Gara] Android commit. Bazelfied it. MrJuneJune <me@mrjunejune.com> parents: 44 diff changeset	106
829623189a57 [Gara] Android commit. Bazelfied it. MrJuneJune <me@mrjunejune.com> parents: 44 diff changeset	107 // Expanded Actions
829623189a57 [Gara] Android commit. Bazelfied it. MrJuneJune <me@mrjunejune.com> parents: 44 diff changeset	108 type MainPageAction =
829623189a57 [Gara] Android commit. Bazelfied it. MrJuneJune <me@mrjunejune.com> parents: 44 diff changeset	109 \| { type: 'select_chat'; payload: { chatId: string } }
829623189a57 [Gara] Android commit. Bazelfied it. MrJuneJune <me@mrjunejune.com> parents: 44 diff changeset	110 \| { type: 'user_message_sent'; payload: { content: string; newChatId?: string } }
829623189a57 [Gara] Android commit. Bazelfied it. MrJuneJune <me@mrjunejune.com> parents: 44 diff changeset	111 \| { type: 'api_response_received'; payload: { content: string } }
829623189a57 [Gara] Android commit. Bazelfied it. MrJuneJune <me@mrjunejune.com> parents: 44 diff changeset	112 \| { type: 'api_error'; payload: { error: string } };
829623189a57 [Gara] Android commit. Bazelfied it. MrJuneJune <me@mrjunejune.com> parents: 44 diff changeset	113
829623189a57 [Gara] Android commit. Bazelfied it. MrJuneJune <me@mrjunejune.com> parents: 44 diff changeset	114 function mainPageDispatch(state: MainPage, action: MainPageAction): MainPage {
829623189a57 [Gara] Android commit. Bazelfied it. MrJuneJune <me@mrjunejune.com> parents: 44 diff changeset	115 switch (action.type) {
829623189a57 [Gara] Android commit. Bazelfied it. MrJuneJune <me@mrjunejune.com> parents: 44 diff changeset	116 case 'select_chat': {
829623189a57 [Gara] Android commit. Bazelfied it. MrJuneJune <me@mrjunejune.com> parents: 44 diff changeset	117 const { chatId } = action.payload;
829623189a57 [Gara] Android commit. Bazelfied it. MrJuneJune <me@mrjunejune.com> parents: 44 diff changeset	118 return {
829623189a57 [Gara] Android commit. Bazelfied it. MrJuneJune <me@mrjunejune.com> parents: 44 diff changeset	119 ...state,
829623189a57 [Gara] Android commit. Bazelfied it. MrJuneJune <me@mrjunejune.com> parents: 44 diff changeset	120 activeChatId: chatId,
829623189a57 [Gara] Android commit. Bazelfied it. MrJuneJune <me@mrjunejune.com> parents: 44 diff changeset	121 currentMessages: state.allChats[chatId] \|\| [],
829623189a57 [Gara] Android commit. Bazelfied it. MrJuneJune <me@mrjunejune.com> parents: 44 diff changeset	122 sendMessageStatus: 'idle',
829623189a57 [Gara] Android commit. Bazelfied it. MrJuneJune <me@mrjunejune.com> parents: 44 diff changeset	123 };
829623189a57 [Gara] Android commit. Bazelfied it. MrJuneJune <me@mrjunejune.com> parents: 44 diff changeset	124 }
44 0cfd7d9277b0 [ReactGame] 2048 MrJuneJune <me@mrjunejune.com> parents: 37 diff changeset	125
47 829623189a57 [Gara] Android commit. Bazelfied it. MrJuneJune <me@mrjunejune.com> parents: 44 diff changeset	126 case 'user_message_sent': {
829623189a57 [Gara] Android commit. Bazelfied it. MrJuneJune <me@mrjunejune.com> parents: 44 diff changeset	127 const { content, newChatId } = action.payload;
829623189a57 [Gara] Android commit. Bazelfied it. MrJuneJune <me@mrjunejune.com> parents: 44 diff changeset	128
829623189a57 [Gara] Android commit. Bazelfied it. MrJuneJune <me@mrjunejune.com> parents: 44 diff changeset	129 const newMessage: Message = {
829623189a57 [Gara] Android commit. Bazelfied it. MrJuneJune <me@mrjunejune.com> parents: 44 diff changeset	130 id: Date.now().toString(),
829623189a57 [Gara] Android commit. Bazelfied it. MrJuneJune <me@mrjunejune.com> parents: 44 diff changeset	131 role: 'user',
829623189a57 [Gara] Android commit. Bazelfied it. MrJuneJune <me@mrjunejune.com> parents: 44 diff changeset	132 content: content,
829623189a57 [Gara] Android commit. Bazelfied it. MrJuneJune <me@mrjunejune.com> parents: 44 diff changeset	133 createdAt: Date.now(),
829623189a57 [Gara] Android commit. Bazelfied it. MrJuneJune <me@mrjunejune.com> parents: 44 diff changeset	134 };
829623189a57 [Gara] Android commit. Bazelfied it. MrJuneJune <me@mrjunejune.com> parents: 44 diff changeset	135
829623189a57 [Gara] Android commit. Bazelfied it. MrJuneJune <me@mrjunejune.com> parents: 44 diff changeset	136 // If we are starting a brand new chat (no active ID)
829623189a57 [Gara] Android commit. Bazelfied it. MrJuneJune <me@mrjunejune.com> parents: 44 diff changeset	137 if (newChatId && !state.activeChatId) {
829623189a57 [Gara] Android commit. Bazelfied it. MrJuneJune <me@mrjunejune.com> parents: 44 diff changeset	138 const newChatMetadata: Chat = {
829623189a57 [Gara] Android commit. Bazelfied it. MrJuneJune <me@mrjunejune.com> parents: 44 diff changeset	139 id: newChatId,
829623189a57 [Gara] Android commit. Bazelfied it. MrJuneJune <me@mrjunejune.com> parents: 44 diff changeset	140 title: content.substring(0, 30) + (content.length > 30 ? "..." : ""),
829623189a57 [Gara] Android commit. Bazelfied it. MrJuneJune <me@mrjunejune.com> parents: 44 diff changeset	141 createdAt: Date.now()
829623189a57 [Gara] Android commit. Bazelfied it. MrJuneJune <me@mrjunejune.com> parents: 44 diff changeset	142 };
829623189a57 [Gara] Android commit. Bazelfied it. MrJuneJune <me@mrjunejune.com> parents: 44 diff changeset	143
829623189a57 [Gara] Android commit. Bazelfied it. MrJuneJune <me@mrjunejune.com> parents: 44 diff changeset	144 return {
829623189a57 [Gara] Android commit. Bazelfied it. MrJuneJune <me@mrjunejune.com> parents: 44 diff changeset	145 ...state,
829623189a57 [Gara] Android commit. Bazelfied it. MrJuneJune <me@mrjunejune.com> parents: 44 diff changeset	146 activeChatId: newChatId,
829623189a57 [Gara] Android commit. Bazelfied it. MrJuneJune <me@mrjunejune.com> parents: 44 diff changeset	147 sendMessageStatus: 'inProgress',
829623189a57 [Gara] Android commit. Bazelfied it. MrJuneJune <me@mrjunejune.com> parents: 44 diff changeset	148 chatHistory: [newChatMetadata, ...state.chatHistory],
829623189a57 [Gara] Android commit. Bazelfied it. MrJuneJune <me@mrjunejune.com> parents: 44 diff changeset	149 currentMessages: [newMessage],
829623189a57 [Gara] Android commit. Bazelfied it. MrJuneJune <me@mrjunejune.com> parents: 44 diff changeset	150 allChats: {
829623189a57 [Gara] Android commit. Bazelfied it. MrJuneJune <me@mrjunejune.com> parents: 44 diff changeset	151 ...state.allChats,
829623189a57 [Gara] Android commit. Bazelfied it. MrJuneJune <me@mrjunejune.com> parents: 44 diff changeset	152 [newChatId]: [newMessage]
829623189a57 [Gara] Android commit. Bazelfied it. MrJuneJune <me@mrjunejune.com> parents: 44 diff changeset	153 }
829623189a57 [Gara] Android commit. Bazelfied it. MrJuneJune <me@mrjunejune.com> parents: 44 diff changeset	154 };
829623189a57 [Gara] Android commit. Bazelfied it. MrJuneJune <me@mrjunejune.com> parents: 44 diff changeset	155 }
829623189a57 [Gara] Android commit. Bazelfied it. MrJuneJune <me@mrjunejune.com> parents: 44 diff changeset	156
829623189a57 [Gara] Android commit. Bazelfied it. MrJuneJune <me@mrjunejune.com> parents: 44 diff changeset	157 const chatId = state.activeChatId!;
829623189a57 [Gara] Android commit. Bazelfied it. MrJuneJune <me@mrjunejune.com> parents: 44 diff changeset	158 const updatedMessages = [...state.currentMessages, newMessage];
37 fb9bcd3145cb [ReactGames] Few games I made using react just to practice few things. MrJuneJune <me@mrjunejune.com> parents: diff changeset	159
47 829623189a57 [Gara] Android commit. Bazelfied it. MrJuneJune <me@mrjunejune.com> parents: 44 diff changeset	160 return {
829623189a57 [Gara] Android commit. Bazelfied it. MrJuneJune <me@mrjunejune.com> parents: 44 diff changeset	161 ...state,
829623189a57 [Gara] Android commit. Bazelfied it. MrJuneJune <me@mrjunejune.com> parents: 44 diff changeset	162 sendMessageStatus: 'inProgress',
829623189a57 [Gara] Android commit. Bazelfied it. MrJuneJune <me@mrjunejune.com> parents: 44 diff changeset	163 currentMessages: updatedMessages,
829623189a57 [Gara] Android commit. Bazelfied it. MrJuneJune <me@mrjunejune.com> parents: 44 diff changeset	164 allChats: {
829623189a57 [Gara] Android commit. Bazelfied it. MrJuneJune <me@mrjunejune.com> parents: 44 diff changeset	165 ...state.allChats,
829623189a57 [Gara] Android commit. Bazelfied it. MrJuneJune <me@mrjunejune.com> parents: 44 diff changeset	166 [chatId]: updatedMessages
829623189a57 [Gara] Android commit. Bazelfied it. MrJuneJune <me@mrjunejune.com> parents: 44 diff changeset	167 }
829623189a57 [Gara] Android commit. Bazelfied it. MrJuneJune <me@mrjunejune.com> parents: 44 diff changeset	168 };
829623189a57 [Gara] Android commit. Bazelfied it. MrJuneJune <me@mrjunejune.com> parents: 44 diff changeset	169 }
829623189a57 [Gara] Android commit. Bazelfied it. MrJuneJune <me@mrjunejune.com> parents: 44 diff changeset	170
829623189a57 [Gara] Android commit. Bazelfied it. MrJuneJune <me@mrjunejune.com> parents: 44 diff changeset	171 case 'api_response_received': {
829623189a57 [Gara] Android commit. Bazelfied it. MrJuneJune <me@mrjunejune.com> parents: 44 diff changeset	172 if (!state.activeChatId) return state;
829623189a57 [Gara] Android commit. Bazelfied it. MrJuneJune <me@mrjunejune.com> parents: 44 diff changeset	173
829623189a57 [Gara] Android commit. Bazelfied it. MrJuneJune <me@mrjunejune.com> parents: 44 diff changeset	174 const newMsg: Message = {
829623189a57 [Gara] Android commit. Bazelfied it. MrJuneJune <me@mrjunejune.com> parents: 44 diff changeset	175 id: Date.now().toString(),
829623189a57 [Gara] Android commit. Bazelfied it. MrJuneJune <me@mrjunejune.com> parents: 44 diff changeset	176 role: 'assistant',
829623189a57 [Gara] Android commit. Bazelfied it. MrJuneJune <me@mrjunejune.com> parents: 44 diff changeset	177 content: action.payload.content,
829623189a57 [Gara] Android commit. Bazelfied it. MrJuneJune <me@mrjunejune.com> parents: 44 diff changeset	178 createdAt: Date.now()
829623189a57 [Gara] Android commit. Bazelfied it. MrJuneJune <me@mrjunejune.com> parents: 44 diff changeset	179 };
829623189a57 [Gara] Android commit. Bazelfied it. MrJuneJune <me@mrjunejune.com> parents: 44 diff changeset	180
829623189a57 [Gara] Android commit. Bazelfied it. MrJuneJune <me@mrjunejune.com> parents: 44 diff changeset	181 const updatedMessages = [...state.currentMessages, newMsg];
829623189a57 [Gara] Android commit. Bazelfied it. MrJuneJune <me@mrjunejune.com> parents: 44 diff changeset	182
829623189a57 [Gara] Android commit. Bazelfied it. MrJuneJune <me@mrjunejune.com> parents: 44 diff changeset	183 return {
829623189a57 [Gara] Android commit. Bazelfied it. MrJuneJune <me@mrjunejune.com> parents: 44 diff changeset	184 ...state,
829623189a57 [Gara] Android commit. Bazelfied it. MrJuneJune <me@mrjunejune.com> parents: 44 diff changeset	185 sendMessageStatus: 'success',
829623189a57 [Gara] Android commit. Bazelfied it. MrJuneJune <me@mrjunejune.com> parents: 44 diff changeset	186 currentMessages: updatedMessages,
829623189a57 [Gara] Android commit. Bazelfied it. MrJuneJune <me@mrjunejune.com> parents: 44 diff changeset	187 allChats: {
829623189a57 [Gara] Android commit. Bazelfied it. MrJuneJune <me@mrjunejune.com> parents: 44 diff changeset	188 ...state.allChats,
829623189a57 [Gara] Android commit. Bazelfied it. MrJuneJune <me@mrjunejune.com> parents: 44 diff changeset	189 [state.activeChatId]: updatedMessages
829623189a57 [Gara] Android commit. Bazelfied it. MrJuneJune <me@mrjunejune.com> parents: 44 diff changeset	190 }
829623189a57 [Gara] Android commit. Bazelfied it. MrJuneJune <me@mrjunejune.com> parents: 44 diff changeset	191 };
829623189a57 [Gara] Android commit. Bazelfied it. MrJuneJune <me@mrjunejune.com> parents: 44 diff changeset	192 }
829623189a57 [Gara] Android commit. Bazelfied it. MrJuneJune <me@mrjunejune.com> parents: 44 diff changeset	193
829623189a57 [Gara] Android commit. Bazelfied it. MrJuneJune <me@mrjunejune.com> parents: 44 diff changeset	194 case 'api_error': {
829623189a57 [Gara] Android commit. Bazelfied it. MrJuneJune <me@mrjunejune.com> parents: 44 diff changeset	195 return {
829623189a57 [Gara] Android commit. Bazelfied it. MrJuneJune <me@mrjunejune.com> parents: 44 diff changeset	196 ...state,
829623189a57 [Gara] Android commit. Bazelfied it. MrJuneJune <me@mrjunejune.com> parents: 44 diff changeset	197 sendMessageStatus: 'failed'
829623189a57 [Gara] Android commit. Bazelfied it. MrJuneJune <me@mrjunejune.com> parents: 44 diff changeset	198 };
829623189a57 [Gara] Android commit. Bazelfied it. MrJuneJune <me@mrjunejune.com> parents: 44 diff changeset	199 }
829623189a57 [Gara] Android commit. Bazelfied it. MrJuneJune <me@mrjunejune.com> parents: 44 diff changeset	200
829623189a57 [Gara] Android commit. Bazelfied it. MrJuneJune <me@mrjunejune.com> parents: 44 diff changeset	201 default:
829623189a57 [Gara] Android commit. Bazelfied it. MrJuneJune <me@mrjunejune.com> parents: 44 diff changeset	202 return state;
44 0cfd7d9277b0 [ReactGame] 2048 MrJuneJune <me@mrjunejune.com> parents: 37 diff changeset	203 }
37 fb9bcd3145cb [ReactGames] Few games I made using react just to practice few things. MrJuneJune <me@mrjunejune.com> parents: diff changeset	204 }
44 0cfd7d9277b0 [ReactGame] 2048 MrJuneJune <me@mrjunejune.com> parents: 37 diff changeset	205
47 829623189a57 [Gara] Android commit. Bazelfied it. MrJuneJune <me@mrjunejune.com> parents: 44 diff changeset	206 const initialMainPage: MainPage = {
829623189a57 [Gara] Android commit. Bazelfied it. MrJuneJune <me@mrjunejune.com> parents: 44 diff changeset	207 activeChatId: null,
829623189a57 [Gara] Android commit. Bazelfied it. MrJuneJune <me@mrjunejune.com> parents: 44 diff changeset	208 chatHistory: [],
829623189a57 [Gara] Android commit. Bazelfied it. MrJuneJune <me@mrjunejune.com> parents: 44 diff changeset	209 currentMessages: [],
829623189a57 [Gara] Android commit. Bazelfied it. MrJuneJune <me@mrjunejune.com> parents: 44 diff changeset	210 allChats: {},
829623189a57 [Gara] Android commit. Bazelfied it. MrJuneJune <me@mrjunejune.com> parents: 44 diff changeset	211 sendMessageStatus: 'idle'
829623189a57 [Gara] Android commit. Bazelfied it. MrJuneJune <me@mrjunejune.com> parents: 44 diff changeset	212 };
44 0cfd7d9277b0 [ReactGame] 2048 MrJuneJune <me@mrjunejune.com> parents: 37 diff changeset	213
0cfd7d9277b0 [ReactGame] 2048 MrJuneJune <me@mrjunejune.com> parents: 37 diff changeset	214
47 829623189a57 [Gara] Android commit. Bazelfied it. MrJuneJune <me@mrjunejune.com> parents: 44 diff changeset	215 async function fetchOpenAICompletion(messages: Message[]) {
829623189a57 [Gara] Android commit. Bazelfied it. MrJuneJune <me@mrjunejune.com> parents: 44 diff changeset	216 const apiMessages = messages.map(m => ({
829623189a57 [Gara] Android commit. Bazelfied it. MrJuneJune <me@mrjunejune.com> parents: 44 diff changeset	217 role: m.role,
829623189a57 [Gara] Android commit. Bazelfied it. MrJuneJune <me@mrjunejune.com> parents: 44 diff changeset	218 content: m.content
829623189a57 [Gara] Android commit. Bazelfied it. MrJuneJune <me@mrjunejune.com> parents: 44 diff changeset	219 }));
37 fb9bcd3145cb [ReactGames] Few games I made using react just to practice few things. MrJuneJune <me@mrjunejune.com> parents: diff changeset	220
47 829623189a57 [Gara] Android commit. Bazelfied it. MrJuneJune <me@mrjunejune.com> parents: 44 diff changeset	221 try {
829623189a57 [Gara] Android commit. Bazelfied it. MrJuneJune <me@mrjunejune.com> parents: 44 diff changeset	222 const response = await fetch("https://api.openai.com/v1/chat/completions", {
829623189a57 [Gara] Android commit. Bazelfied it. MrJuneJune <me@mrjunejune.com> parents: 44 diff changeset	223 method: "POST",
829623189a57 [Gara] Android commit. Bazelfied it. MrJuneJune <me@mrjunejune.com> parents: 44 diff changeset	224 headers: {
829623189a57 [Gara] Android commit. Bazelfied it. MrJuneJune <me@mrjunejune.com> parents: 44 diff changeset	225 "Content-Type": "application/json",
829623189a57 [Gara] Android commit. Bazelfied it. MrJuneJune <me@mrjunejune.com> parents: 44 diff changeset	226 "Authorization": `Bearer ${OPENAI_API_KEY}`
829623189a57 [Gara] Android commit. Bazelfied it. MrJuneJune <me@mrjunejune.com> parents: 44 diff changeset	227 },
829623189a57 [Gara] Android commit. Bazelfied it. MrJuneJune <me@mrjunejune.com> parents: 44 diff changeset	228 body: JSON.stringify({
829623189a57 [Gara] Android commit. Bazelfied it. MrJuneJune <me@mrjunejune.com> parents: 44 diff changeset	229 model: "gpt-3.5-turbo", // or gpt-4
829623189a57 [Gara] Android commit. Bazelfied it. MrJuneJune <me@mrjunejune.com> parents: 44 diff changeset	230 messages: apiMessages,
829623189a57 [Gara] Android commit. Bazelfied it. MrJuneJune <me@mrjunejune.com> parents: 44 diff changeset	231 })
829623189a57 [Gara] Android commit. Bazelfied it. MrJuneJune <me@mrjunejune.com> parents: 44 diff changeset	232 });
37 fb9bcd3145cb [ReactGames] Few games I made using react just to practice few things. MrJuneJune <me@mrjunejune.com> parents: diff changeset	233
47 829623189a57 [Gara] Android commit. Bazelfied it. MrJuneJune <me@mrjunejune.com> parents: 44 diff changeset	234 if (!response.ok) {
829623189a57 [Gara] Android commit. Bazelfied it. MrJuneJune <me@mrjunejune.com> parents: 44 diff changeset	235 throw new Error(`API Error: ${response.statusText}`);
44 0cfd7d9277b0 [ReactGame] 2048 MrJuneJune <me@mrjunejune.com> parents: 37 diff changeset	236 }
47 829623189a57 [Gara] Android commit. Bazelfied it. MrJuneJune <me@mrjunejune.com> parents: 44 diff changeset	237
829623189a57 [Gara] Android commit. Bazelfied it. MrJuneJune <me@mrjunejune.com> parents: 44 diff changeset	238 const data = await response.json();
829623189a57 [Gara] Android commit. Bazelfied it. MrJuneJune <me@mrjunejune.com> parents: 44 diff changeset	239 return data.choices[0].message.content;
829623189a57 [Gara] Android commit. Bazelfied it. MrJuneJune <me@mrjunejune.com> parents: 44 diff changeset	240 } catch (error) {
829623189a57 [Gara] Android commit. Bazelfied it. MrJuneJune <me@mrjunejune.com> parents: 44 diff changeset	241 console.error(error);
829623189a57 [Gara] Android commit. Bazelfied it. MrJuneJune <me@mrjunejune.com> parents: 44 diff changeset	242 throw error;
44 0cfd7d9277b0 [ReactGame] 2048 MrJuneJune <me@mrjunejune.com> parents: 37 diff changeset	243 }
37 fb9bcd3145cb [ReactGames] Few games I made using react just to practice few things. MrJuneJune <me@mrjunejune.com> parents: diff changeset	244 }
fb9bcd3145cb [ReactGames] Few games I made using react just to practice few things. MrJuneJune <me@mrjunejune.com> parents: diff changeset	245
44 0cfd7d9277b0 [ReactGame] 2048 MrJuneJune <me@mrjunejune.com> parents: 37 diff changeset	246 function Current() {
47 829623189a57 [Gara] Android commit. Bazelfied it. MrJuneJune <me@mrjunejune.com> parents: 44 diff changeset	247 const [state, dispatch] = useReducer(mainPageDispatch, initialMainPage);
829623189a57 [Gara] Android commit. Bazelfied it. MrJuneJune <me@mrjunejune.com> parents: 44 diff changeset	248 const [inputValue, setInputValue] = useState("");
829623189a57 [Gara] Android commit. Bazelfied it. MrJuneJune <me@mrjunejune.com> parents: 44 diff changeset	249 const messagesEndRef = useRef<HTMLDivElement>(null);
37 fb9bcd3145cb [ReactGames] Few games I made using react just to practice few things. MrJuneJune <me@mrjunejune.com> parents: diff changeset	250
47 829623189a57 [Gara] Android commit. Bazelfied it. MrJuneJune <me@mrjunejune.com> parents: 44 diff changeset	251 // Auto-scroll to bottom when messages change
44 0cfd7d9277b0 [ReactGame] 2048 MrJuneJune <me@mrjunejune.com> parents: 37 diff changeset	252 useEffect(() => {
47 829623189a57 [Gara] Android commit. Bazelfied it. MrJuneJune <me@mrjunejune.com> parents: 44 diff changeset	253 messagesEndRef.current?.scrollIntoView({ behavior: "smooth" });
829623189a57 [Gara] Android commit. Bazelfied it. MrJuneJune <me@mrjunejune.com> parents: 44 diff changeset	254 }, [state.currentMessages]);
829623189a57 [Gara] Android commit. Bazelfied it. MrJuneJune <me@mrjunejune.com> parents: 44 diff changeset	255
829623189a57 [Gara] Android commit. Bazelfied it. MrJuneJune <me@mrjunejune.com> parents: 44 diff changeset	256 const handleSendMessage = async () => {
829623189a57 [Gara] Android commit. Bazelfied it. MrJuneJune <me@mrjunejune.com> parents: 44 diff changeset	257 if (!inputValue.trim()) return;
829623189a57 [Gara] Android commit. Bazelfied it. MrJuneJune <me@mrjunejune.com> parents: 44 diff changeset	258
829623189a57 [Gara] Android commit. Bazelfied it. MrJuneJune <me@mrjunejune.com> parents: 44 diff changeset	259 // 1. Determine if this is a new chat or existing
829623189a57 [Gara] Android commit. Bazelfied it. MrJuneJune <me@mrjunejune.com> parents: 44 diff changeset	260 const isNewChat = !state.activeChatId;
829623189a57 [Gara] Android commit. Bazelfied it. MrJuneJune <me@mrjunejune.com> parents: 44 diff changeset	261 const currentChatId = state.activeChatId \|\| crypto.randomUUID(); // Generate ID for new chat
829623189a57 [Gara] Android commit. Bazelfied it. MrJuneJune <me@mrjunejune.com> parents: 44 diff changeset	262
829623189a57 [Gara] Android commit. Bazelfied it. MrJuneJune <me@mrjunejune.com> parents: 44 diff changeset	263 const textToSend = inputValue;
829623189a57 [Gara] Android commit. Bazelfied it. MrJuneJune <me@mrjunejune.com> parents: 44 diff changeset	264 setInputValue(""); // Clear input immediately
829623189a57 [Gara] Android commit. Bazelfied it. MrJuneJune <me@mrjunejune.com> parents: 44 diff changeset	265
829623189a57 [Gara] Android commit. Bazelfied it. MrJuneJune <me@mrjunejune.com> parents: 44 diff changeset	266 // 2. Dispatch User Message (Optimistic UI)
829623189a57 [Gara] Android commit. Bazelfied it. MrJuneJune <me@mrjunejune.com> parents: 44 diff changeset	267 dispatch({
829623189a57 [Gara] Android commit. Bazelfied it. MrJuneJune <me@mrjunejune.com> parents: 44 diff changeset	268 type: 'user_message_sent',
829623189a57 [Gara] Android commit. Bazelfied it. MrJuneJune <me@mrjunejune.com> parents: 44 diff changeset	269 payload: { content: textToSend, newChatId: isNewChat ? currentChatId : undefined }
829623189a57 [Gara] Android commit. Bazelfied it. MrJuneJune <me@mrjunejune.com> parents: 44 diff changeset	270 });
829623189a57 [Gara] Android commit. Bazelfied it. MrJuneJune <me@mrjunejune.com> parents: 44 diff changeset	271
829623189a57 [Gara] Android commit. Bazelfied it. MrJuneJune <me@mrjunejune.com> parents: 44 diff changeset	272 try {
829623189a57 [Gara] Android commit. Bazelfied it. MrJuneJune <me@mrjunejune.com> parents: 44 diff changeset	273 // 3. Prepare context (include previous messages + new one)
829623189a57 [Gara] Android commit. Bazelfied it. MrJuneJune <me@mrjunejune.com> parents: 44 diff changeset	274 // Note: We reconstruct the array here because state update is async and might not be ready
829623189a57 [Gara] Android commit. Bazelfied it. MrJuneJune <me@mrjunejune.com> parents: 44 diff changeset	275 const contextMessages: Message[] = [
829623189a57 [Gara] Android commit. Bazelfied it. MrJuneJune <me@mrjunejune.com> parents: 44 diff changeset	276 ...(isNewChat ? [] : state.currentMessages),
829623189a57 [Gara] Android commit. Bazelfied it. MrJuneJune <me@mrjunejune.com> parents: 44 diff changeset	277 { id: 'temp', role: 'user', content: textToSend, createdAt: Date.now() }
829623189a57 [Gara] Android commit. Bazelfied it. MrJuneJune <me@mrjunejune.com> parents: 44 diff changeset	278 ];
829623189a57 [Gara] Android commit. Bazelfied it. MrJuneJune <me@mrjunejune.com> parents: 44 diff changeset	279
829623189a57 [Gara] Android commit. Bazelfied it. MrJuneJune <me@mrjunejune.com> parents: 44 diff changeset	280 // 4. Call API
829623189a57 [Gara] Android commit. Bazelfied it. MrJuneJune <me@mrjunejune.com> parents: 44 diff changeset	281 const aiResponse = await fetchOpenAICompletion(contextMessages);
829623189a57 [Gara] Android commit. Bazelfied it. MrJuneJune <me@mrjunejune.com> parents: 44 diff changeset	282
829623189a57 [Gara] Android commit. Bazelfied it. MrJuneJune <me@mrjunejune.com> parents: 44 diff changeset	283 // 5. Dispatch Success
829623189a57 [Gara] Android commit. Bazelfied it. MrJuneJune <me@mrjunejune.com> parents: 44 diff changeset	284 dispatch({ type: 'api_response_received', payload: { content: aiResponse } });
829623189a57 [Gara] Android commit. Bazelfied it. MrJuneJune <me@mrjunejune.com> parents: 44 diff changeset	285
829623189a57 [Gara] Android commit. Bazelfied it. MrJuneJune <me@mrjunejune.com> parents: 44 diff changeset	286 } catch (error) {
829623189a57 [Gara] Android commit. Bazelfied it. MrJuneJune <me@mrjunejune.com> parents: 44 diff changeset	287 dispatch({ type: 'api_error', payload: { error: 'Failed to fetch' } });
829623189a57 [Gara] Android commit. Bazelfied it. MrJuneJune <me@mrjunejune.com> parents: 44 diff changeset	288 alert("Failed to connect to OpenAI. Check API Key.");
829623189a57 [Gara] Android commit. Bazelfied it. MrJuneJune <me@mrjunejune.com> parents: 44 diff changeset	289 }
829623189a57 [Gara] Android commit. Bazelfied it. MrJuneJune <me@mrjunejune.com> parents: 44 diff changeset	290 };
829623189a57 [Gara] Android commit. Bazelfied it. MrJuneJune <me@mrjunejune.com> parents: 44 diff changeset	291
829623189a57 [Gara] Android commit. Bazelfied it. MrJuneJune <me@mrjunejune.com> parents: 44 diff changeset	292 const handleKeyDown = (e: React.KeyboardEvent) => {
829623189a57 [Gara] Android commit. Bazelfied it. MrJuneJune <me@mrjunejune.com> parents: 44 diff changeset	293 if (e.key === 'Enter' && !e.shiftKey) {
829623189a57 [Gara] Android commit. Bazelfied it. MrJuneJune <me@mrjunejune.com> parents: 44 diff changeset	294 e.preventDefault();
829623189a57 [Gara] Android commit. Bazelfied it. MrJuneJune <me@mrjunejune.com> parents: 44 diff changeset	295 handleSendMessage();
829623189a57 [Gara] Android commit. Bazelfied it. MrJuneJune <me@mrjunejune.com> parents: 44 diff changeset	296 }
829623189a57 [Gara] Android commit. Bazelfied it. MrJuneJune <me@mrjunejune.com> parents: 44 diff changeset	297 };
44 0cfd7d9277b0 [ReactGame] 2048 MrJuneJune <me@mrjunejune.com> parents: 37 diff changeset	298
0cfd7d9277b0 [ReactGame] 2048 MrJuneJune <me@mrjunejune.com> parents: 37 diff changeset	299 return (
47 829623189a57 [Gara] Android commit. Bazelfied it. MrJuneJune <me@mrjunejune.com> parents: 44 diff changeset	300 <div style={STYLES.mainContainer}>
829623189a57 [Gara] Android commit. Bazelfied it. MrJuneJune <me@mrjunejune.com> parents: 44 diff changeset	301 {/* Sidebar */}
829623189a57 [Gara] Android commit. Bazelfied it. MrJuneJune <me@mrjunejune.com> parents: 44 diff changeset	302 <div style={STYLES.sideBar}>
829623189a57 [Gara] Android commit. Bazelfied it. MrJuneJune <me@mrjunejune.com> parents: 44 diff changeset	303 <h3 style={{color: '#ececf1', marginBottom: '20px'}}>History</h3>
829623189a57 [Gara] Android commit. Bazelfied it. MrJuneJune <me@mrjunejune.com> parents: 44 diff changeset	304 <div
829623189a57 [Gara] Android commit. Bazelfied it. MrJuneJune <me@mrjunejune.com> parents: 44 diff changeset	305 style={{...STYLES.sideBarItem, border: '1px dashed #555'}}
829623189a57 [Gara] Android commit. Bazelfied it. MrJuneJune <me@mrjunejune.com> parents: 44 diff changeset	306 onClick={() => {
829623189a57 [Gara] Android commit. Bazelfied it. MrJuneJune <me@mrjunejune.com> parents: 44 diff changeset	307 // Reset to empty view for a new chat
829623189a57 [Gara] Android commit. Bazelfied it. MrJuneJune <me@mrjunejune.com> parents: 44 diff changeset	308 // We can achieve this by setting activeChatId to null locally if we wanted
829623189a57 [Gara] Android commit. Bazelfied it. MrJuneJune <me@mrjunejune.com> parents: 44 diff changeset	309 // But for this simple reducer, we can just reload the page or add a 'reset' action.
829623189a57 [Gara] Android commit. Bazelfied it. MrJuneJune <me@mrjunejune.com> parents: 44 diff changeset	310 // For now, let's just allow clicking existing ones.
829623189a57 [Gara] Android commit. Bazelfied it. MrJuneJune <me@mrjunejune.com> parents: 44 diff changeset	311 window.location.reload();
829623189a57 [Gara] Android commit. Bazelfied it. MrJuneJune <me@mrjunejune.com> parents: 44 diff changeset	312 }}
829623189a57 [Gara] Android commit. Bazelfied it. MrJuneJune <me@mrjunejune.com> parents: 44 diff changeset	313 >
829623189a57 [Gara] Android commit. Bazelfied it. MrJuneJune <me@mrjunejune.com> parents: 44 diff changeset	314 + New Chat
829623189a57 [Gara] Android commit. Bazelfied it. MrJuneJune <me@mrjunejune.com> parents: 44 diff changeset	315 </div>
829623189a57 [Gara] Android commit. Bazelfied it. MrJuneJune <me@mrjunejune.com> parents: 44 diff changeset	316
829623189a57 [Gara] Android commit. Bazelfied it. MrJuneJune <me@mrjunejune.com> parents: 44 diff changeset	317 {state.chatHistory.map((hist) => (
829623189a57 [Gara] Android commit. Bazelfied it. MrJuneJune <me@mrjunejune.com> parents: 44 diff changeset	318 <div
829623189a57 [Gara] Android commit. Bazelfied it. MrJuneJune <me@mrjunejune.com> parents: 44 diff changeset	319 key={hist.id}
829623189a57 [Gara] Android commit. Bazelfied it. MrJuneJune <me@mrjunejune.com> parents: 44 diff changeset	320 style={{
829623189a57 [Gara] Android commit. Bazelfied it. MrJuneJune <me@mrjunejune.com> parents: 44 diff changeset	321 ...STYLES.sideBarItem,
829623189a57 [Gara] Android commit. Bazelfied it. MrJuneJune <me@mrjunejune.com> parents: 44 diff changeset	322 backgroundColor: state.activeChatId === hist.id ? '#555' : '#333'
829623189a57 [Gara] Android commit. Bazelfied it. MrJuneJune <me@mrjunejune.com> parents: 44 diff changeset	323 }}
829623189a57 [Gara] Android commit. Bazelfied it. MrJuneJune <me@mrjunejune.com> parents: 44 diff changeset	324 onClick={() => dispatch({ type: 'select_chat', payload: { chatId: hist.id } })}
829623189a57 [Gara] Android commit. Bazelfied it. MrJuneJune <me@mrjunejune.com> parents: 44 diff changeset	325 >
829623189a57 [Gara] Android commit. Bazelfied it. MrJuneJune <me@mrjunejune.com> parents: 44 diff changeset	326 {hist.title}
829623189a57 [Gara] Android commit. Bazelfied it. MrJuneJune <me@mrjunejune.com> parents: 44 diff changeset	327 </div>
829623189a57 [Gara] Android commit. Bazelfied it. MrJuneJune <me@mrjunejune.com> parents: 44 diff changeset	328 ))}
829623189a57 [Gara] Android commit. Bazelfied it. MrJuneJune <me@mrjunejune.com> parents: 44 diff changeset	329 </div>
829623189a57 [Gara] Android commit. Bazelfied it. MrJuneJune <me@mrjunejune.com> parents: 44 diff changeset	330
829623189a57 [Gara] Android commit. Bazelfied it. MrJuneJune <me@mrjunejune.com> parents: 44 diff changeset	331 {/* Main Chat Area */}
829623189a57 [Gara] Android commit. Bazelfied it. MrJuneJune <me@mrjunejune.com> parents: 44 diff changeset	332 <div style={STYLES.mainChat}>
829623189a57 [Gara] Android commit. Bazelfied it. MrJuneJune <me@mrjunejune.com> parents: 44 diff changeset	333 <div style={STYLES.mainMessage}>
829623189a57 [Gara] Android commit. Bazelfied it. MrJuneJune <me@mrjunejune.com> parents: 44 diff changeset	334 {state.currentMessages.length === 0 && (
829623189a57 [Gara] Android commit. Bazelfied it. MrJuneJune <me@mrjunejune.com> parents: 44 diff changeset	335 <div style={{color: '#666', textAlign: 'center', marginTop: '40%'}}>
829623189a57 [Gara] Android commit. Bazelfied it. MrJuneJune <me@mrjunejune.com> parents: 44 diff changeset	336 Send a message to start...
829623189a57 [Gara] Android commit. Bazelfied it. MrJuneJune <me@mrjunejune.com> parents: 44 diff changeset	337 </div>
829623189a57 [Gara] Android commit. Bazelfied it. MrJuneJune <me@mrjunejune.com> parents: 44 diff changeset	338 )}
829623189a57 [Gara] Android commit. Bazelfied it. MrJuneJune <me@mrjunejune.com> parents: 44 diff changeset	339
829623189a57 [Gara] Android commit. Bazelfied it. MrJuneJune <me@mrjunejune.com> parents: 44 diff changeset	340 {state.currentMessages.map((msg) => (
829623189a57 [Gara] Android commit. Bazelfied it. MrJuneJune <me@mrjunejune.com> parents: 44 diff changeset	341 <div
829623189a57 [Gara] Android commit. Bazelfied it. MrJuneJune <me@mrjunejune.com> parents: 44 diff changeset	342 key={msg.id}
829623189a57 [Gara] Android commit. Bazelfied it. MrJuneJune <me@mrjunejune.com> parents: 44 diff changeset	343 style={{
829623189a57 [Gara] Android commit. Bazelfied it. MrJuneJune <me@mrjunejune.com> parents: 44 diff changeset	344 ...STYLES.messageBubble,
829623189a57 [Gara] Android commit. Bazelfied it. MrJuneJune <me@mrjunejune.com> parents: 44 diff changeset	345 backgroundColor: msg.role === 'assistant' ? '#444654' : 'transparent'
829623189a57 [Gara] Android commit. Bazelfied it. MrJuneJune <me@mrjunejune.com> parents: 44 diff changeset	346 }}
829623189a57 [Gara] Android commit. Bazelfied it. MrJuneJune <me@mrjunejune.com> parents: 44 diff changeset	347 >
829623189a57 [Gara] Android commit. Bazelfied it. MrJuneJune <me@mrjunejune.com> parents: 44 diff changeset	348 <strong style={{color: msg.role === 'assistant' ? '#10a37f' : '#ececf1'}}>
829623189a57 [Gara] Android commit. Bazelfied it. MrJuneJune <me@mrjunejune.com> parents: 44 diff changeset	349 {msg.role === 'assistant' ? 'AI' : 'You'}:
829623189a57 [Gara] Android commit. Bazelfied it. MrJuneJune <me@mrjunejune.com> parents: 44 diff changeset	350 </strong>
829623189a57 [Gara] Android commit. Bazelfied it. MrJuneJune <me@mrjunejune.com> parents: 44 diff changeset	351 <div style={{whiteSpace: 'pre-wrap', marginTop: '5px'}}>{msg.content}</div>
829623189a57 [Gara] Android commit. Bazelfied it. MrJuneJune <me@mrjunejune.com> parents: 44 diff changeset	352 </div>
829623189a57 [Gara] Android commit. Bazelfied it. MrJuneJune <me@mrjunejune.com> parents: 44 diff changeset	353 ))}
829623189a57 [Gara] Android commit. Bazelfied it. MrJuneJune <me@mrjunejune.com> parents: 44 diff changeset	354
829623189a57 [Gara] Android commit. Bazelfied it. MrJuneJune <me@mrjunejune.com> parents: 44 diff changeset	355 {state.sendMessageStatus === 'inProgress' && (
829623189a57 [Gara] Android commit. Bazelfied it. MrJuneJune <me@mrjunejune.com> parents: 44 diff changeset	356 <div style={{...STYLES.messageBubble, color: '#888'}}>AI is typing...</div>
829623189a57 [Gara] Android commit. Bazelfied it. MrJuneJune <me@mrjunejune.com> parents: 44 diff changeset	357 )}
829623189a57 [Gara] Android commit. Bazelfied it. MrJuneJune <me@mrjunejune.com> parents: 44 diff changeset	358 <div ref={messagesEndRef} />
829623189a57 [Gara] Android commit. Bazelfied it. MrJuneJune <me@mrjunejune.com> parents: 44 diff changeset	359 </div>
829623189a57 [Gara] Android commit. Bazelfied it. MrJuneJune <me@mrjunejune.com> parents: 44 diff changeset	360
829623189a57 [Gara] Android commit. Bazelfied it. MrJuneJune <me@mrjunejune.com> parents: 44 diff changeset	361 {/* Input Area */}
829623189a57 [Gara] Android commit. Bazelfied it. MrJuneJune <me@mrjunejune.com> parents: 44 diff changeset	362 <textarea
829623189a57 [Gara] Android commit. Bazelfied it. MrJuneJune <me@mrjunejune.com> parents: 44 diff changeset	363 style={STYLES.inputBar}
829623189a57 [Gara] Android commit. Bazelfied it. MrJuneJune <me@mrjunejune.com> parents: 44 diff changeset	364 placeholder="Send a message..."
829623189a57 [Gara] Android commit. Bazelfied it. MrJuneJune <me@mrjunejune.com> parents: 44 diff changeset	365 value={inputValue}
829623189a57 [Gara] Android commit. Bazelfied it. MrJuneJune <me@mrjunejune.com> parents: 44 diff changeset	366 onChange={(e) => setInputValue(e.target.value)}
829623189a57 [Gara] Android commit. Bazelfied it. MrJuneJune <me@mrjunejune.com> parents: 44 diff changeset	367 onKeyDown={handleKeyDown}
829623189a57 [Gara] Android commit. Bazelfied it. MrJuneJune <me@mrjunejune.com> parents: 44 diff changeset	368 disabled={state.sendMessageStatus === 'inProgress'}
829623189a57 [Gara] Android commit. Bazelfied it. MrJuneJune <me@mrjunejune.com> parents: 44 diff changeset	369 />
44 0cfd7d9277b0 [ReactGame] 2048 MrJuneJune <me@mrjunejune.com> parents: 37 diff changeset	370 </div>
0cfd7d9277b0 [ReactGame] 2048 MrJuneJune <me@mrjunejune.com> parents: 37 diff changeset	371 </div>
0cfd7d9277b0 [ReactGame] 2048 MrJuneJune <me@mrjunejune.com> parents: 37 diff changeset	372 );
0cfd7d9277b0 [ReactGame] 2048 MrJuneJune <me@mrjunejune.com> parents: 37 diff changeset	373 }
37 fb9bcd3145cb [ReactGames] Few games I made using react just to practice few things. MrJuneJune <me@mrjunejune.com> parents: diff changeset	374
fb9bcd3145cb [ReactGames] Few games I made using react just to practice few things. MrJuneJune <me@mrjunejune.com> parents: diff changeset	375 ReactDOM.createRoot(document.getElementById("root")!).render(<Current />);
47 829623189a57 [Gara] Android commit. Bazelfied it. MrJuneJune <me@mrjunejune.com> parents: 44 diff changeset	376
829623189a57 [Gara] Android commit. Bazelfied it. MrJuneJune <me@mrjunejune.com> parents: 44 diff changeset	377
829623189a57 [Gara] Android commit. Bazelfied it. MrJuneJune <me@mrjunejune.com> parents: 44 diff changeset	378 https://www.linkedin.com/in/drakewong/
829623189a57 [Gara] Android commit. Bazelfied it. MrJuneJune <me@mrjunejune.com> parents: 44 diff changeset	379 https://www.linkedin.com/in/dmitry-manannikov/

Mercurial

annotate react_games/src/current.tsx @ 71:75de5903355c