Upload 11 files

.env.local

@@ -0,0 +1 @@
+GEMINI_API_KEY=PLACEHOLDER_API_KEY

.gitignore

@@ -0,0 +1,24 @@
+# Logs
+logs
+*.log
+npm-debug.log*
+yarn-debug.log*
+yarn-error.log*
+pnpm-debug.log*
+lerna-debug.log*
+
+node_modules
+dist
+dist-ssr
+*.local
+
+# Editor directories and files
+.vscode/*
+!.vscode/extensions.json
+.idea
+.DS_Store
+*.suo
+*.ntvs*
+*.njsproj
+*.sln
+*.sw?

App.tsx

@@ -0,0 +1,99 @@
+
+import React, { useState, useEffect } from 'react';
+import ChatInterface from './components/ChatInterface';
+import { LanguageProvider } from './contexts/LanguageContext';
+import LanguageSelector from './components/LanguageSelector';
+import FeedbackPage from './components/FeedbackPage';
+import UserFeedbackAnalysisPage from './components/UserFeedbackAnalysisPage';
+import { Review } from './types';
+
+function App() {
+  const [page, setPage] = useState<'chat' | 'feedback' | 'userexperience'>('chat');
+  
+  // Initialize reviews from localStorage
+  const [reviews, setReviews] = useState<Review[]>(() => {
+    try {
+      const storedReviews = window.localStorage.getItem('emotimate-reviews');
+      return storedReviews ? JSON.parse(storedReviews) : [];
+    } catch (error) {
+      console.error("Error reading reviews from localStorage", error);
+      return [];
+    }
+  });
+
+  // Save reviews to localStorage whenever they change
+  useEffect(() => {
+    try {
+      window.localStorage.setItem('emotimate-reviews', JSON.stringify(reviews));
+    } catch (error) {
+      console.error("Error saving reviews to localStorage", error);
+    }
+  }, [reviews]);
+
+  const handleAddReview = (review: Omit<Review, 'id' | 'date'>) => {
+    const newReview: Review = {
+      ...review,
+      id: `User-${Math.random().toString(36).substr(2, 4).toUpperCase()}`,
+      date: new Date().toLocaleDateString('en-US', { month: 'short', day: 'numeric', year: 'numeric' }),
+    };
+    setReviews(prev => [...prev, newReview]);
+  };
+  
+  const handleDeleteReview = (reviewId: string) => {
+    setReviews(prev => prev.filter(review => review.id !== reviewId));
+  };
+
+  const buttonClasses = "text-sm sm:text-base text-slate-600 hover:text-blue-600 font-medium transition-colors px-3 py-2 rounded-lg hover:bg-slate-200";
+
+  return (
+    <LanguageProvider>
+      <div className="flex flex-col h-screen bg-slate-100 font-sans">
+        <header className="w-full bg-white shadow-md px-4 py-3 sm:p-4 z-10">
+          <div className="max-w-4xl mx-auto flex justify-between items-center">
+            <h1 className="text-xl sm:text-2xl font-bold bg-gradient-to-r from-blue-500 to-violet-500 text-transparent bg-clip-text">EmotiMate</h1>
+            <div className="flex items-center gap-2 sm:gap-4">
+              {page === 'chat' && (
+                <>
+                  <LanguageSelector />
+                  <button onClick={() => setPage('feedback')} className={buttonClasses} aria-label="Go to feedback page">
+                    Feedback
+                  </button>
+                  <button onClick={() => setPage('userexperience')} className={buttonClasses} aria-label="Go to user experience page">
+                    User Experience
+                  </button>
+                </>
+              )}
+              {page === 'feedback' && (
+                <>
+                  <button onClick={() => setPage('userexperience')} className={buttonClasses} aria-label="Go to user experience page">
+                    User Experience
+                  </button>
+                  <button onClick={() => setPage('chat')} className={buttonClasses} aria-label="Go back to home page">
+                    Home
+                  </button>
+                </>
+              )}
+              {page === 'userexperience' && (
+                <>
+                  <button onClick={() => setPage('feedback')} className={buttonClasses} aria-label="Go to feedback page">
+                    Feedback
+                  </button>
+                   <button onClick={() => setPage('chat')} className={buttonClasses} aria-label="Go back to home page">
+                    Home
+                  </button>
+                </>
+              )}
+            </div>
+          </div>
+        </header>
+        <main className="flex-grow overflow-auto custom-scrollbar">
+          {page === 'chat' && <ChatInterface />}
+          {page === 'feedback' && <FeedbackPage onGoHome={() => setPage('chat')} onAddReview={handleAddReview} />}
+          {page === 'userexperience' && <UserFeedbackAnalysisPage reviews={reviews} onDeleteReview={handleDeleteReview} />}
+        </main>
+      </div>
+    </LanguageProvider>
+  );
+}
+
+export default App;

README.md

@@ -1,3 +1,14 @@
----
-license: gemma
----
+# Run and deploy your AI Studio app
+
+This contains everything you need to run your app locally.
+
+## Run Locally
+
+**Prerequisites:**  Node.js
+
+
+1. Install dependencies:
+   `npm install`
+2. Set the `GEMINI_API_KEY` in [.env.local](.env.local) to your Gemini API key
+3. Run the app:
+   `npm run dev`

index.html

@@ -0,0 +1,49 @@
+<!DOCTYPE html>
+<html lang="en">
+  <head>
+    <meta charset="UTF-8" />
+    <link rel="icon" type="image/svg+xml" href="/favicon.svg" />
+    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
+    <title>EmotiMate</title>
+    <script src="https://cdn.tailwindcss.com"></script>
+    <style>
+      /* For custom scrollbar styling */
+      .custom-scrollbar::-webkit-scrollbar {
+        width: 8px;
+      }
+      .custom-scrollbar::-webkit-scrollbar-track {
+        background: #f1f5f9; /* slate-100 */
+      }
+      .custom-scrollbar::-webkit-scrollbar-thumb {
+        background: #94a3b8; /* slate-400 */
+        border-radius: 10px;
+      }
+      .custom-scrollbar::-webkit-scrollbar-thumb:hover {
+        background: #64748b; /* slate-500 */
+      }
+      /* Utility to permanently hide scrollbars */
+      .hide-scrollbar::-webkit-scrollbar {
+        display: none;
+      }
+      .hide-scrollbar {
+        -ms-overflow-style: none;  /* IE and Edge */
+        scrollbar-width: none;  /* Firefox */
+      }
+    </style>
+  <script type="importmap">
+{
+  "imports": {
+    "react-dom/": "https://esm.sh/react-dom@^19.1.0/",
+    "react/": "https://esm.sh/react@^19.1.0/",
+    "react": "https://esm.sh/react@^19.1.0",
+    "@google/genai": "https://esm.sh/@google/genai@^1.11.0"
+  }
+}
+</script>
+<link rel="stylesheet" href="/index.css">
+</head>
+  <body class="bg-slate-100">
+    <div id="root"></div>
+    <script type="module" src="/index.tsx"></script>
+  </body>
+</html>

index.tsx

@@ -0,0 +1,16 @@
+
+import React from 'react';
+import ReactDOM from 'react-dom/client';
+import App from './App';
+
+const rootElement = document.getElementById('root');
+if (!rootElement) {
+  throw new Error("Could not find root element to mount to");
+}
+
+const root = ReactDOM.createRoot(rootElement);
+root.render(
+  <React.StrictMode>
+    <App />
+  </React.StrictMode>
+);

metadata.json

@@ -0,0 +1,7 @@
+{
+  "name": "EmotiMate",
+  "description": "An emotionally intelligent AI assistant for supportive and empathetic conversations. Engage via voice or text to receive supportive suggestions and mindfulness exercises in a safe, non-judgmental space.",
+  "requestFramePermissions": [
+    "microphone"
+  ]
+}

package.json

@@ -0,0 +1,21 @@
+{
+  "name": "emotimate",
+  "private": true,
+  "version": "0.0.0",
+  "type": "module",
+  "scripts": {
+    "dev": "vite",
+    "build": "vite build",
+    "preview": "vite preview"
+  },
+  "dependencies": {
+    "react-dom": "^19.1.0",
+    "react": "^19.1.0",
+    "@google/genai": "^1.11.0"
+  },
+  "devDependencies": {
+    "@types/node": "^22.14.0",
+    "typescript": "~5.7.2",
+    "vite": "^6.2.0"
+  }
+}

tsconfig.json

@@ -0,0 +1,30 @@
+{
+  "compilerOptions": {
+    "target": "ES2020",
+    "experimentalDecorators": true,
+    "useDefineForClassFields": false,
+    "module": "ESNext",
+    "lib": ["ES2020", "DOM", "DOM.Iterable"],
+    "skipLibCheck": true,
+
+    /* Bundler mode */
+    "moduleResolution": "bundler",
+    "allowImportingTsExtensions": true,
+    "isolatedModules": true,
+    "moduleDetection": "force",
+    "noEmit": true,
+    "allowJs": true,
+    "jsx": "react-jsx",
+
+    /* Linting */
+    "strict": true,
+    "noUnusedLocals": true,
+    "noUnusedParameters": true,
+    "noFallthroughCasesInSwitch": true,
+    "noUncheckedSideEffectImports": true,
+
+    "paths": {
+      "@/*" :  ["./*"]
+    }
+  }
+}

types.ts

@@ -0,0 +1,14 @@
+export interface Message {
+  id: string;
+  text: string;
+  sender: 'user' | 'ai';
+  suggestions?: string[];
+}
+
+export interface Review {
+  id: string;
+  date: string;
+  lang: string;
+  rating: number;
+  comments: string;
+}

vite.config.ts

@@ -0,0 +1,17 @@
+import path from 'path';
+import { defineConfig, loadEnv } from 'vite';
+
+export default defineConfig(({ mode }) => {
+    const env = loadEnv(mode, '.', '');
+    return {
+      define: {
+        'process.env.API_KEY': JSON.stringify(env.GEMINI_API_KEY),
+        'process.env.GEMINI_API_KEY': JSON.stringify(env.GEMINI_API_KEY)
+      },
+      resolve: {
+        alias: {
+          '@': path.resolve(__dirname, '.'),
+        }
+      }
+    };
+});