Merge pull request #41 from bdhamithkumara/main

user input validate and meta data update

frontend/app/layout.js

@@ -13,8 +13,8 @@ const geistMono = Geist_Mono({
 });
 
 export const metadata = {
-  title: "Create Next App",
-  description: "Generated by create next app",
+  title: "LyricFlip",
+  description: "Play LyricFlip, the on-chain card game powered by Starknet! Guess songs from partial lyrics, explore genres & decades, wager tokens, and relive music nostalgia.",
 };
 
 export default function RootLayout({ children }) {

frontend/components/game/GameCard.jsx

@@ -1,6 +1,6 @@
 "use client";
 
-import React, { useState, useEffect } from "react";
+import React, { useState, useEffect , useRef } from "react";
 import { motion } from "framer-motion";
 import Confetti from "react-confetti";
 import { useGameStore } from "../../store/gameStore";
@@ -23,6 +23,7 @@ const GameCard = ({ lyricsSnippet, correctAnswer }) => {
   const [isFlipped, setIsFlipped] = useState(false);
   const [showReviveOption, setShowReviveOption] = useState(false);
   const [currentAnswer, setCurrentAnswer] = useState(correctAnswer);
+  const inputRef = useRef(null);
 
   // Update answer when new question loads
   useEffect(() => {
@@ -50,6 +51,11 @@ const GameCard = ({ lyricsSnippet, correctAnswer }) => {
   const handleSubmit = () => {
     if (gameStatus !== "playing") return;
 
+    if (guess.trim() === "") {
+      inputRef.current.focus(); 
+      return;
+    }
+
     if (guess.toLowerCase().trim() === currentAnswer.toLowerCase().trim()) {
       handleSuccess();
       setShowConfetti(true);
@@ -97,6 +103,10 @@ const GameCard = ({ lyricsSnippet, correctAnswer }) => {
     }
   };
 
+  const handleInputChange = (e) => {
+    setGuess(e.target.value);
+  };
+
   const handleKeyPress = (e) => {
     if (e.key === "Enter") {
       handleSubmit();
@@ -198,9 +208,10 @@ const GameCard = ({ lyricsSnippet, correctAnswer }) => {
 
       <div className="w-96 mx-auto p-4 mt-4 flex flex-col items-center">
         <input
+          ref={inputRef}
           type="text"
           value={guess}
-          onChange={(e) => setGuess(e.target.value)}
+          onChange={handleInputChange}
           onKeyPress={handleKeyPress}
           placeholder="Type your guess here"
           disabled={gameStatus !== "playing"}