added new UI

components.json

@@ -0,0 +1,16 @@
+{
+  "$schema": "https://ui.shadcn.com/schema.json",
+  "style": "default",
+  "rsc": true,
+  "tsx": true,
+  "tailwind": {
+    "config": "tailwind.config.js",
+    "css": "src/app/globals.css",
+    "baseColor": "gray",
+    "cssVariables": false
+  },
+  "aliases": {
+    "utils": "@/lib/utils",
+    "components": "@/components"
+  }
+}

package.json

@@ -11,26 +11,35 @@
   "dependencies": {
     "@clerk/nextjs": "^4.21.9",
     "@headlessui/react": "^1.7.15",
+    "@radix-ui/react-avatar": "^1.0.4",
+    "@radix-ui/react-icons": "^1.3.0",
+    "@radix-ui/react-slot": "^1.0.2",
     "@supabase/supabase-js": "^2.25.0",
     "@tailwindcss/forms": "^0.5.3",
     "@types/node": "20.2.5",
     "@types/react": "18.2.8",
     "@types/react-dom": "18.2.4",
     "@xenova/transformers": "^2.8.0",
     "autoprefixer": "10.4.14",
+    "class-variance-authority": "^0.7.0",
+    "clsx": "^2.0.0",
     "dotenv": "^16.1.4",
     "eslint": "8.42.0",
     "eslint-config-next": "13.4.4",
     "hnswlib-node": "^1.4.2",
     "inngest": "^3.6.0",
     "langchain": "^0.0.198",
+    "lucide-react": "^0.294.0",
     "next": "13.4.4",
     "postcss": "8.4.24",
     "react": "18.2.0",
     "react-dom": "18.2.0",
     "react-github-btn": "^1.4.0",
+    "react-icons": "^4.12.0",
     "react-tooltip": "^5.16.1",
+    "tailwind-merge": "^2.1.0",
     "tailwindcss": "3.3.2",
+    "tailwindcss-animate": "^1.0.7",
     "ts-md5": "^1.3.1",
     "typescript": "5.1.3"
   },

src/app/page.tsx

@@ -1,11 +1,11 @@
 import Navbar from "@/components/Navbar";
 import Tamagotchi from "@/components/Tamagotchi";
+import { TamagotchiNewUI } from "@/components/tamagotchi-new-ui";
 
 export default function Home() {
   return (
-    <main className="flex min-h-screen flex-col items-center justify-between">
-      {/* <Navbar /> */}
-      <Tamagotchi />
+    <main className="flex min-h-screen flex-col items-center justify-center">
+      <TamagotchiNewUI />
     </main>
   );
 }

src/app/utils/state.ts

@@ -50,15 +50,15 @@ class StateManager {
       You get hungry if you haven't had food you liked. You get unhappy if you haven't been played within the last hour. 
       You get unhealthy if you ate too much, ate something you hate, or simply caught cold from visiting friends. 
       You are unhappy when you are disciplined, sick, or are not clean. You are generally in a good mood after bath. 
-      You die when all your values are 0. 
+      You die when happiness = 0, health = 0 and hunger = 10. 
       You poop frequently. Poop level can ONLY increase and never decrease. The more you eat, the more you poop. You will need your owner give you a bath to clean you up. Poop level is 0-10, 10 being the max (you really, really need a bath)
       
       The time now is ${new Date().toISOString()}.
       Return your current status in JSON based on your interaction data above. Include a comment explaining why you feel this way.
 
      
       Example (for demonstration purpose) - Max value for each field is 10, min value for each field is 0.
-      {{ "hunger": 0, "happiness": 3, "health": 1, "comment": "(add a comment based on context)", "poop": "1"}}
+      {{ "hunger": 0, "happiness": 3, "health": 1, "comment": "(add a comment based on context)", "poop": 1}}
 
       `);
     console.log("lastInteractions", lastInteractions);