Spaces:

Mistral-AI-Game-Jam
/

description-improv

Running

App Files Files Community

Felix Zieger commited on Jan 26

Commit

fe9a0c4

1 Parent(s): 1b620c7

v2

Browse files

Files changed (10) hide show

index.html +3 -3
public/favicon.ico +0 -0
public/og-image.png +0 -0
src/components/GameContainer.tsx +65 -32
src/components/HighScoreBoard.tsx +82 -19
src/components/game/GameOver.tsx +12 -0
src/components/game/ThemeSelector.tsx +146 -0
src/services/themeService.ts +26 -0
supabase/config.toml +3 -1
supabase/functions/generate-themed-word/index.ts +70 -0

index.html CHANGED Viewed

@@ -3,9 +3,9 @@
   <head>
     <meta charset="UTF-8" />
     <meta name="viewport" content="width=device-width, initial-scale=1.0" />
-    <title>word-duelers</title>
-    <meta name="description" content="Lovable Generated Project" />
-    <meta name="author" content="Lovable" />
     <meta property="og:image" content="/og-image.png" />
   </head>

   <head>
     <meta charset="UTF-8" />
     <meta name="viewport" content="width=device-width, initial-scale=1.0" />
+    <title>Think in Sync</title>
+    <meta name="description" content="A word puzzle game." />
+    <meta name="author" content="Team M1X" />
     <meta property="og:image" content="/og-image.png" />
   </head>

public/favicon.ico CHANGED Viewed

public/og-image.png CHANGED Viewed

src/components/GameContainer.tsx CHANGED Viewed

@@ -2,24 +2,27 @@ import { useState, KeyboardEvent, useEffect } from "react";
 import { getRandomWord } from "@/lib/words";
 import { motion } from "framer-motion";
 import { generateAIResponse, guessWord } from "@/services/mistralService";
 import { useToast } from "@/components/ui/use-toast";
 import { WelcomeScreen } from "./game/WelcomeScreen";
-import { WordDisplay } from "./game/WordDisplay";
 import { SentenceBuilder } from "./game/SentenceBuilder";
 import { GuessDisplay } from "./game/GuessDisplay";
 import { GameOver } from "./game/GameOver";
-type GameState = "welcome" | "showing-word" | "building-sentence" | "showing-guess" | "game-over";
 export const GameContainer = () => {
   const [gameState, setGameState] = useState<GameState>("welcome");
   const [currentWord, setCurrentWord] = useState<string>("");
   const [sentence, setSentence] = useState<string[]>([]);
   const [playerInput, setPlayerInput] = useState<string>("");
   const [isAiThinking, setIsAiThinking] = useState(false);
   const [aiGuess, setAiGuess] = useState<string>("");
   const [successfulRounds, setSuccessfulRounds] = useState<number>(0);
   const [totalWords, setTotalWords] = useState<number>(0);
   const { toast } = useToast();
   useEffect(() => {
@@ -27,8 +30,6 @@ export const GameContainer = () => {
       if (e.key === 'Enter') {
         if (gameState === 'welcome') {
           handleStart();
-        } else if (gameState === 'showing-word') {
-          handleContinue();
         } else if (gameState === 'game-over' || gameState === 'showing-guess') {
           const correct = isGuessCorrect();
           if (correct) {
@@ -45,12 +46,27 @@ export const GameContainer = () => {
   }, [gameState, aiGuess, currentWord]);
   const handleStart = () => {
-    const word = getRandomWord();
-    setCurrentWord(word);
-    setGameState("showing-word");
-    setSuccessfulRounds(0);
-    setTotalWords(0);
-    console.log("Game started with word:", word);
   };
   const handlePlayerWord = async (e: React.FormEvent) => {
@@ -82,12 +98,21 @@ export const GameContainer = () => {
   };
   const handleMakeGuess = async () => {
-    if (sentence.length === 0) return;
     setIsAiThinking(true);
     try {
-      const finalSentence = sentence.join(' ');
-      const guess = await guessWord(finalSentence);
       setAiGuess(guess);
       setGameState("showing-guess");
     } catch (error) {
@@ -104,12 +129,27 @@ export const GameContainer = () => {
   const handleNextRound = () => {
     if (handleGuessComplete()) {
-      const word = getRandomWord();
-      setCurrentWord(word);
-      setGameState("showing-word");
-      setSentence([]);
-      setAiGuess("");
-      console.log("Next round started with word:", word);
     } else {
       setGameState("game-over");
     }
@@ -120,13 +160,10 @@ export const GameContainer = () => {
     setSentence([]);
     setAiGuess("");
     setCurrentWord("");
     setSuccessfulRounds(0);
     setTotalWords(0);
-  };
-  const handleContinue = () => {
-    setGameState("building-sentence");
-    setSentence([]);
   };
   const isGuessCorrect = () => {
@@ -143,7 +180,7 @@ export const GameContainer = () => {
   const getAverageWordsPerRound = () => {
     if (successfulRounds === 0) return 0;
-    return totalWords / (successfulRounds + 1); // The total words include the ones in the failed last round, so we also count it in the denominator
   };
   return (
@@ -155,12 +192,8 @@ export const GameContainer = () => {
       >
         {gameState === "welcome" ? (
           <WelcomeScreen onStart={handleStart} />
-        ) : gameState === "showing-word" ? (
-          <WordDisplay
-            currentWord={currentWord}
-            successfulRounds={successfulRounds}
-            onContinue={handleContinue}
-          />
         ) : gameState === "building-sentence" ? (
           <SentenceBuilder
             currentWord={currentWord}

 import { getRandomWord } from "@/lib/words";
 import { motion } from "framer-motion";
 import { generateAIResponse, guessWord } from "@/services/mistralService";
+import { getThemedWord } from "@/services/themeService";
 import { useToast } from "@/components/ui/use-toast";
 import { WelcomeScreen } from "./game/WelcomeScreen";
+import { ThemeSelector } from "./game/ThemeSelector";
 import { SentenceBuilder } from "./game/SentenceBuilder";
 import { GuessDisplay } from "./game/GuessDisplay";
 import { GameOver } from "./game/GameOver";
+type GameState = "welcome" | "theme-selection" | "building-sentence" | "showing-guess" | "game-over";
 export const GameContainer = () => {
   const [gameState, setGameState] = useState<GameState>("welcome");
   const [currentWord, setCurrentWord] = useState<string>("");
+  const [currentTheme, setCurrentTheme] = useState<string>("standard");
   const [sentence, setSentence] = useState<string[]>([]);
   const [playerInput, setPlayerInput] = useState<string>("");
   const [isAiThinking, setIsAiThinking] = useState(false);
   const [aiGuess, setAiGuess] = useState<string>("");
   const [successfulRounds, setSuccessfulRounds] = useState<number>(0);
   const [totalWords, setTotalWords] = useState<number>(0);
+  const [usedWords, setUsedWords] = useState<string[]>([]);
   const { toast } = useToast();
   useEffect(() => {
       if (e.key === 'Enter') {
         if (gameState === 'welcome') {
           handleStart();
         } else if (gameState === 'game-over' || gameState === 'showing-guess') {
           const correct = isGuessCorrect();
           if (correct) {
   }, [gameState, aiGuess, currentWord]);
   const handleStart = () => {
+    setGameState("theme-selection");
+  };
+  const handleThemeSelect = async (theme: string) => {
+    setCurrentTheme(theme);
+    try {
+      const word = theme === "standard" ? getRandomWord() : await getThemedWord(theme, usedWords);
+      setCurrentWord(word);
+      setGameState("building-sentence");
+      setSuccessfulRounds(0);
+      setTotalWords(0);
+      setUsedWords([word]); // Initialize used words with the first word
+      console.log("Game started with word:", word, "theme:", theme);
+    } catch (error) {
+      console.error('Error getting themed word:', error);
+      toast({
+        title: "Error",
+        description: "Failed to get a word for the selected theme. Please try again.",
+        variant: "destructive",
+      });
+    }
   };
   const handlePlayerWord = async (e: React.FormEvent) => {
   };
   const handleMakeGuess = async () => {
     setIsAiThinking(true);
     try {
+      // Add the current input to the sentence if it exists
+      let finalSentence = sentence;
+      if (playerInput.trim()) {
+        finalSentence = [...sentence, playerInput.trim()];
+        setSentence(finalSentence);
+        setPlayerInput("");
+        setTotalWords(prev => prev + 1);
+      }
+      if (finalSentence.length === 0) return;
+      const sentenceString = finalSentence.join(' ');
+      const guess = await guessWord(sentenceString);
       setAiGuess(guess);
       setGameState("showing-guess");
     } catch (error) {
   const handleNextRound = () => {
     if (handleGuessComplete()) {
+      const getNewWord = async () => {
+        try {
+          const word = currentTheme === "standard" ?
+            getRandomWord() :
+            await getThemedWord(currentTheme, usedWords);
+          setCurrentWord(word);
+          setGameState("building-sentence");
+          setSentence([]);
+          setAiGuess("");
+          setUsedWords(prev => [...prev, word]); // Add new word to used words
+          console.log("Next round started with word:", word, "theme:", currentTheme);
+        } catch (error) {
+          console.error('Error getting new word:', error);
+          toast({
+            title: "Error",
+            description: "Failed to get a new word. Please try again.",
+            variant: "destructive",
+          });
+        }
+      };
+      getNewWord();
     } else {
       setGameState("game-over");
     }
     setSentence([]);
     setAiGuess("");
     setCurrentWord("");
+    setCurrentTheme("standard");
     setSuccessfulRounds(0);
     setTotalWords(0);
+    setUsedWords([]); // Reset used words when starting over
   };
   const isGuessCorrect = () => {
   const getAverageWordsPerRound = () => {
     if (successfulRounds === 0) return 0;
+    return totalWords / (successfulRounds + 1);
   };
   return (
       >
         {gameState === "welcome" ? (
           <WelcomeScreen onStart={handleStart} />
+        ) : gameState === "theme-selection" ? (
+          <ThemeSelector onThemeSelect={handleThemeSelect} />
         ) : gameState === "building-sentence" ? (
           <SentenceBuilder
             currentWord={currentWord}

src/components/HighScoreBoard.tsx CHANGED Viewed

@@ -1,4 +1,4 @@
-import { useState } from "react";
 import { Button } from "@/components/ui/button";
 import { Input } from "@/components/ui/input";
 import { supabase } from "@/integrations/supabase/client";
@@ -36,7 +36,8 @@ interface HighScoreBoardProps {
   onPlayAgain: () => void;
 }
-const ITEMS_PER_PAGE = 10;
 const getRankMedal = (rank: number) => {
   switch (rank) {
@@ -55,7 +56,6 @@ export const HighScoreBoard = ({
   currentScore,
   avgWordsPerRound,
   onClose,
-  onPlayAgain,
 }: HighScoreBoardProps) => {
   const [playerName, setPlayerName] = useState("");
   const [isSubmitting, setIsSubmitting] = useState(false);
@@ -107,18 +107,55 @@ export const HighScoreBoard = ({
     setIsSubmitting(true);
     try {
-      const { error } = await supabase.from("high_scores").insert({
-        player_name: playerName.trim(),
-        score: currentScore,
-        avg_words_per_round: avgWordsPerRound,
-      });
-      if (error) throw error;
-      toast({
-        title: "Success!",
-        description: "Your score has been recorded",
-      });
       setHasSubmitted(true);
       await refetch();
@@ -135,7 +172,14 @@ export const HighScoreBoard = ({
     }
   };
-  const totalPages = highScores ? Math.ceil(highScores.length / ITEMS_PER_PAGE) : 0;
   const startIndex = (currentPage - 1) * ITEMS_PER_PAGE;
   const paginatedScores = highScores?.slice(startIndex, startIndex + ITEMS_PER_PAGE);
@@ -151,6 +195,19 @@ export const HighScoreBoard = ({
     }
   };
   return (
     <div className="space-y-6">
       <div className="text-center">
@@ -167,6 +224,7 @@ export const HighScoreBoard = ({
             placeholder="Enter your name"
             value={playerName}
             onChange={(e) => setPlayerName(e.target.value)}
             className="flex-1"
           />
           <Button
@@ -222,7 +280,10 @@ export const HighScoreBoard = ({
               <PaginationPrevious
                 onClick={handlePreviousPage}
                 className={currentPage === 1 ? "pointer-events-none opacity-50" : ""}
-              />
             </PaginationItem>
             {Array.from({ length: totalPages }, (_, i) => i + 1).map((page) => (
               <PaginationItem key={page}>
@@ -238,17 +299,19 @@ export const HighScoreBoard = ({
               <PaginationNext
                 onClick={handleNextPage}
                 className={currentPage === totalPages ? "pointer-events-none opacity-50" : ""}
-              />
             </PaginationItem>
           </PaginationContent>
         </Pagination>
       )}
-      <div className="flex justify-end gap-4">
         <Button variant="outline" onClick={onClose}>
-          Close
         </Button>
-        <Button onClick={onPlayAgain}>Play Again</Button>
       </div>
     </div>
   );

+import { useEffect, useState } from "react";
 import { Button } from "@/components/ui/button";
 import { Input } from "@/components/ui/input";
 import { supabase } from "@/integrations/supabase/client";
   onPlayAgain: () => void;
 }
+const ITEMS_PER_PAGE = 5;
+const MAX_PAGES = 4;
 const getRankMedal = (rank: number) => {
   switch (rank) {
   currentScore,
   avgWordsPerRound,
   onClose,
 }: HighScoreBoardProps) => {
   const [playerName, setPlayerName] = useState("");
   const [isSubmitting, setIsSubmitting] = useState(false);
     setIsSubmitting(true);
     try {
+      // Check if player already exists
+      const { data: existingScores } = await supabase
+        .from("high_scores")
+        .select("*")
+        .eq("player_name", playerName.trim());
+      const existingScore = existingScores?.[0];
+      if (existingScore) {
+        // Only update if the new score is better
+        if (currentScore > existingScore.score) {
+          const { error } = await supabase
+            .from("high_scores")
+            .update({
+              score: currentScore,
+              avg_words_per_round: avgWordsPerRound,
+            })
+            .eq("id", existingScore.id);
+          if (error) throw error;
+          toast({
+            title: "New High Score!",
+            description: `You beat your previous record of ${existingScore.score} rounds!`,
+          });
+        } else {
+          toast({
+            title: "Score Not Updated",
+            description: `Your current score (${currentScore}) is not higher than your best score (${existingScore.score})`,
+            variant: "destructive",
+          });
+          setIsSubmitting(false);
+          return;
+        }
+      } else {
+        // Insert new score
+        const { error } = await supabase.from("high_scores").insert({
+          player_name: playerName.trim(),
+          score: currentScore,
+          avg_words_per_round: avgWordsPerRound,
+        });
+        if (error) throw error;
+        toast({
+          title: "Success!",
+          description: "Your score has been recorded",
+        });
+      }
       setHasSubmitted(true);
       await refetch();
     }
   };
+  const handleKeyDown = async (e: React.KeyboardEvent<HTMLInputElement>) => {
+    if (e.key === 'Enter') {
+      e.preventDefault();
+      await handleSubmitScore();
+    }
+  };
+  const totalPages = highScores ? Math.min(Math.ceil(highScores.length / ITEMS_PER_PAGE), MAX_PAGES) : 0;
   const startIndex = (currentPage - 1) * ITEMS_PER_PAGE;
   const paginatedScores = highScores?.slice(startIndex, startIndex + ITEMS_PER_PAGE);
     }
   };
+  useEffect(() => {
+    const handleKeyDown = (e: KeyboardEvent) => {
+      if (e.key === 'ArrowLeft') {
+        handlePreviousPage();
+      } else if (e.key === 'ArrowRight') {
+        handleNextPage();
+      }
+    };
+    window.addEventListener('keydown', handleKeyDown);
+    return () => window.removeEventListener('keydown', handleKeyDown);
+  }, [currentPage, totalPages]);
   return (
     <div className="space-y-6">
       <div className="text-center">
             placeholder="Enter your name"
             value={playerName}
             onChange={(e) => setPlayerName(e.target.value)}
+            onKeyDown={handleKeyDown}
             className="flex-1"
           />
           <Button
               <PaginationPrevious
                 onClick={handlePreviousPage}
                 className={currentPage === 1 ? "pointer-events-none opacity-50" : ""}
+              >
+                <span className="hidden sm:inline">Previous</span>
+                <span className="text-xs text-muted-foreground ml-1">←</span>
+              </PaginationPrevious>
             </PaginationItem>
             {Array.from({ length: totalPages }, (_, i) => i + 1).map((page) => (
               <PaginationItem key={page}>
               <PaginationNext
                 onClick={handleNextPage}
                 className={currentPage === totalPages ? "pointer-events-none opacity-50" : ""}
+              >
+                <span className="hidden sm:inline">Next</span>
+                <span className="text-xs text-muted-foreground ml-1">→</span>
+              </PaginationNext>
             </PaginationItem>
           </PaginationContent>
         </Pagination>
       )}
+      <div className="flex justify-end">
         <Button variant="outline" onClick={onClose}>
+          Close <span className="text-xs text-muted-foreground ml-1">Esc</span>
         </Button>
       </div>
     </div>
   );

src/components/game/GameOver.tsx CHANGED Viewed

@@ -1,5 +1,6 @@
 import { Button } from "@/components/ui/button";
 import { motion } from "framer-motion";
 interface GameOverProps {
   successfulRounds: number;
@@ -10,6 +11,17 @@ export const GameOver = ({
   successfulRounds,
   onPlayAgain,
 }: GameOverProps) => {
   return (
     <motion.div
       initial={{ opacity: 0 }}

 import { Button } from "@/components/ui/button";
 import { motion } from "framer-motion";
+import { useEffect } from "react";
 interface GameOverProps {
   successfulRounds: number;
   successfulRounds,
   onPlayAgain,
 }: GameOverProps) => {
+  useEffect(() => {
+    const handleKeyPress = (e: KeyboardEvent) => {
+      if (e.key.toLowerCase() === 'enter') {
+        onPlayAgain();
+      }
+    };
+    window.addEventListener('keydown', handleKeyPress);
+    return () => window.removeEventListener('keydown', handleKeyPress);
+  }, [onPlayAgain]);
   return (
     <motion.div
       initial={{ opacity: 0 }}

src/components/game/ThemeSelector.tsx ADDED Viewed

	@@ -0,0 +1,146 @@

+import { useState, useEffect, useRef } from "react";
+import { Button } from "@/components/ui/button";
+import { Input } from "@/components/ui/input";
+import { motion } from "framer-motion";
+type Theme = "standard" | "sports" | "food" | "custom";
+interface ThemeSelectorProps {
+  onThemeSelect: (theme: string) => void;
+}
+export const ThemeSelector = ({ onThemeSelect }: ThemeSelectorProps) => {
+  const [selectedTheme, setSelectedTheme] = useState<Theme>("standard");
+  const [customTheme, setCustomTheme] = useState("");
+  const [isGenerating, setIsGenerating] = useState(false);
+  const inputRef = useRef<HTMLInputElement>(null);
+  useEffect(() => {
+    const handleKeyPress = (e: KeyboardEvent) => {
+      if (e.target instanceof HTMLInputElement) return; // Ignore when typing in input
+      switch(e.key.toLowerCase()) {
+        case 'a':
+          setSelectedTheme("standard");
+          break;
+        case 'b':
+          setSelectedTheme("sports");
+          break;
+        case 'c':
+          setSelectedTheme("food");
+          break;
+        case 'd':
+          e.preventDefault(); // Prevent 'd' from being entered in the input
+          setSelectedTheme("custom");
+          break;
+        case 'enter':
+          if (selectedTheme !== "custom" || customTheme.trim()) {
+            handleSubmit();
+          }
+          break;
+      }
+    };
+    window.addEventListener('keydown', handleKeyPress);
+    return () => window.removeEventListener('keydown', handleKeyPress);
+  }, [selectedTheme, customTheme]);
+  useEffect(() => {
+    if (selectedTheme === "custom") {
+      setTimeout(() => {
+        inputRef.current?.focus();
+      }, 100);
+    }
+  }, [selectedTheme]);
+  const handleSubmit = async () => {
+    if (selectedTheme === "custom" && !customTheme.trim()) return;
+    setIsGenerating(true);
+    try {
+      await onThemeSelect(selectedTheme === "custom" ? customTheme : selectedTheme);
+    } finally {
+      setIsGenerating(false);
+    }
+  };
+  const handleInputKeyPress = (e: React.KeyboardEvent<HTMLInputElement>) => {
+    if (e.key === 'Enter' && customTheme.trim()) {
+      handleSubmit();
+    }
+  };
+  return (
+    <motion.div
+      initial={{ opacity: 0 }}
+      animate={{ opacity: 1 }}
+      className="space-y-6"
+    >
+      <div className="text-center space-y-2">
+        <h2 className="text-2xl font-bold text-gray-900">Choose a Theme</h2>
+        <p className="text-gray-600">Select a theme for your word-guessing adventure</p>
+      </div>
+      <div className="space-y-4">
+        <Button
+          variant={selectedTheme === "standard" ? "default" : "outline"}
+          className="w-full justify-between"
+          onClick={() => setSelectedTheme("standard")}
+        >
+          Standard <span className="text-sm opacity-50">Press A</span>
+        </Button>
+        <Button
+          variant={selectedTheme === "sports" ? "default" : "outline"}
+          className="w-full justify-between"
+          onClick={() => setSelectedTheme("sports")}
+        >
+          Sports <span className="text-sm opacity-50">Press B</span>
+        </Button>
+        <Button
+          variant={selectedTheme === "food" ? "default" : "outline"}
+          className="w-full justify-between"
+          onClick={() => setSelectedTheme("food")}
+        >
+          Food <span className="text-sm opacity-50">Press C</span>
+        </Button>
+        <Button
+          variant={selectedTheme === "custom" ? "default" : "outline"}
+          className="w-full justify-between"
+          onClick={() => setSelectedTheme("custom")}
+        >
+          Choose your theme <span className="text-sm opacity-50">Press D</span>
+        </Button>
+        {selectedTheme === "custom" && (
+          <motion.div
+            initial={{ opacity: 0, height: 0 }}
+            animate={{ opacity: 1, height: "auto" }}
+            exit={{ opacity: 0, height: 0 }}
+            transition={{ duration: 0.2 }}
+          >
+            <Input
+              ref={inputRef}
+              type="text"
+              placeholder="Enter a theme (e.g., Animals, Movies)"
+              value={customTheme}
+              onChange={(e) => setCustomTheme(e.target.value)}
+              onKeyPress={handleInputKeyPress}
+              className="w-full"
+            />
+          </motion.div>
+        )}
+      </div>
+      <Button
+        onClick={handleSubmit}
+        className="w-full"
+        disabled={selectedTheme === "custom" && !customTheme.trim() || isGenerating}
+      >
+        {isGenerating ? "Generating themed words..." : "Continue ⏎"}
+      </Button>
+    </motion.div>
+  );
+};

src/services/themeService.ts ADDED Viewed

	@@ -0,0 +1,26 @@

+import { supabase } from "@/integrations/supabase/client";
+export const getThemedWord = async (theme: string, usedWords: string[] = []): Promise<string> => {
+  if (theme === "standard") {
+    throw new Error("Standard theme should use the words list");
+  }
+  console.log('Getting themed word for:', theme, 'excluding:', usedWords);
+  const { data, error } = await supabase.functions.invoke('generate-themed-word', {
+    body: { theme, usedWords }
+  });
+  if (error) {
+    console.error('Error generating themed word:', error);
+    throw error;
+  }
+  if (!data?.word) {
+    console.error('No word generated in response:', data);
+    throw new Error('No word generated');
+  }
+  console.log('Generated themed word:', data.word);
+  return data.word;
+};

supabase/config.toml CHANGED Viewed

@@ -4,4 +4,6 @@ enabled = true
 [analytics]
 enabled = false
 [realtime]
-enabled = false

 [analytics]
 enabled = false
 [realtime]
+enabled = false
+[functions.generate-themed-word]
+verify_jwt = false

supabase/functions/generate-themed-word/index.ts ADDED Viewed

	@@ -0,0 +1,70 @@

+import "https://deno.land/x/[email protected]/mod.ts";
+import { serve } from "https://deno.land/[email protected]/http/server.ts";
+import { Mistral } from 'npm:@mistralai/mistralai';
+const corsHeaders = {
+  'Access-Control-Allow-Origin': '*',
+  'Access-Control-Allow-Headers': 'authorization, x-client-info, apikey, content-type',
+};
+serve(async (req) => {
+  if (req.method === 'OPTIONS') {
+    return new Response(null, { headers: corsHeaders });
+  }
+  try {
+    const { theme, usedWords = [] } = await req.json();
+    console.log('Generating word for theme:', theme, 'excluding:', usedWords);
+    const client = new Mistral({
+      apiKey: Deno.env.get('MISTRAL_API_KEY'),
+    });
+    const response = await client.chat.complete({
+      model: "mistral-large-latest",
+      messages: [
+        {
+          role: "system",
+          content: `You are helping generate words for a word-guessing game. Generate a single word related to the theme "${theme}".
+          The word should be:
+          - A single word (no spaces or hyphens)
+          - Common enough that people would know it
+          - Specific enough to be interesting
+          - Related to the theme "${theme}"
+          - Between 4 and 12 letters
+          - A noun
+          - NOT be any of these previously used words: ${usedWords.join(', ')}
+          Respond with just the word in UPPERCASE, nothing else.`
+        }
+      ],
+      maxTokens: 10,
+      temperature: 0.9
+    });
+    const word = response.choices[0].message.content.trim();
+    console.log('Generated word:', word);
+    return new Response(
+      JSON.stringify({ word }),
+      {
+        headers: {
+          ...corsHeaders,
+          'Content-Type': 'application/json'
+        }
+      }
+    );
+  } catch (error) {
+    console.error('Error generating themed word:', error);
+    return new Response(
+      JSON.stringify({ error: error.message }),
+      {
+        status: 500,
+        headers: {
+          ...corsHeaders,
+          'Content-Type': 'application/json'
+        }
+      }
+    );
+  }
+});