add sleep widget

App/src/App.tsx

@@ -4,7 +4,7 @@ import VerticalCarousel from './components/VerticalCarousel'
 import { useEffect, useState } from 'react'
 import Container from './components/Container'
 import { generateWidgets } from './utils/generateWidgets'
-import { CategoryType } from './types/Categories'
+import { CategoryList, CategoryType } from './types/Categories'
 import AnalyzingVoice from './components/categories/AnalyzingVoice'
 import Initialization from './Initialization'
 import { CONFIG } from './config'
@@ -95,7 +95,7 @@ function generateConfig(): Promise<React.ReactNode[]> {
                 "Content-Type": "application/json"
             },
             body: JSON.stringify({
-                topics: [CategoryType.EXERCISE, CategoryType.SOCIAL, CategoryType.FOOD, CategoryType.WATER],
+                topics: CategoryList,
                 count: 3
             })
         })

App/src/components/categories/Exercise.tsx

@@ -27,7 +27,7 @@ const Exercise = (props: ExerciseProps) => {
 
 
     return (
-        <div className="flex flex-col justify-center items-center h-full bg-purple-400">
+        <div className="flex flex-col justify-center items-center h-full bg-teal-300">
             <div ref={personRef} className="pb-8">{props.exercise}</div>
             <div ref={exerciseRef} className="flex justify-center items-center">
                 <GiWeightLiftingUp size={148} />

App/src/components/categories/Sleep.tsx

@@ -0,0 +1,53 @@
+import { useEffect, useRef } from "react";
+import { gsap } from "gsap";
+import { FaBed } from "react-icons/fa";
+
+interface SleepProps {
+    sleep: string;
+}
+
+/*
+* handle the category animations within this component
+*/
+
+const Sleep = (props: SleepProps) => {
+    const sleepRef = useRef<HTMLDivElement>(null);
+    const eatRef = useRef<HTMLDivElement>(null);
+
+    useEffect(() => {
+        const sleepElement = sleepRef.current;
+        const eatElement = eatRef.current;
+
+        if (sleepElement && eatElement) {
+            gsap.fromTo(sleepElement, { scale: 0 }, { scale: 1, duration: 1, ease: "elastic.out(1, 0.3)" });
+
+            const shakeAnimation = () => {
+                return gsap.fromTo(eatElement, 
+                    { rotation: -10 }, 
+                    { rotation: 10, duration: 0.1, yoyo: true, repeat: 2, ease: "power1.inOut" }
+                );
+            };
+
+            const repeatShake = async () => {
+                while (true) {
+                    await shakeAnimation().then(() => new Promise(resolve => gsap.delayedCall(1, resolve)));
+                }
+            };
+
+            repeatShake();
+        }
+    }, []);
+
+    return (
+        <div className="flex justify-center items-center h-full bg-green-300">
+            <div>
+                <div ref={sleepRef} className="pb-8">{props.sleep}</div>
+                <div ref={eatRef} className="flex justify-center items-center">
+                    <FaBed size={148} />
+                </div>
+            </div>
+        </div>
+    );
+}
+
+export default Sleep;

App/src/types/Categories.ts

@@ -3,11 +3,13 @@ export enum CategoryType {
     SOCIAL = "social",
     FOOD = "food",
     WATER = "water",
+    SLEEP = "sleep",
 }
 
 export const CategoryList = [
     CategoryType.EXERCISE,
     CategoryType.SOCIAL,
     CategoryType.FOOD,
     CategoryType.WATER,
+    CategoryType.SLEEP
 ]

App/src/utils/generateWidgets.tsx

@@ -1,21 +1,17 @@
-import { CategoryType } from "../types/Categories";
+import { CategoryList, CategoryType } from "../types/Categories";
 import Exercise from "../components/categories/Exercise";
 import Food from "../components/categories/Food";
 import Social from "../components/categories/Social";
 import Water from "../components/categories/Water";
 import Widget from "../components/Widget";
+import Sleep from "../components/categories/Sleep";
 import Affirmation from "../components/categories/Affirmation";
 import EndCard from "../components/categories/EndCard"
 import { Affirmations } from "./constants";
 
 export interface Widget {
-    config: {
-        [CategoryType.EXERCISE]: string[];
-        [CategoryType.SOCIAL]: string[];
-        [CategoryType.FOOD]: string[];
-        [CategoryType.WATER]: string[];
-    },
-    numberOfWidgets: number;
+    config: Record<CategoryType, string[]>,
+    numberOfWidgets: number
 }
 
 /* this is the most simiplified version of what the generated code could be
@@ -27,35 +23,47 @@ export const generateWidgets = (props: Widget): React.ReactNode[] => {
     const widgets: React.ReactNode[] = [];
 
     for (let i = 0; i < props.numberOfWidgets; i++) {
-        const task = Math.floor(Math.random() * (4 + 1));
+        const task = Math.floor(Math.random() * (CategoryList.length + 1));
 
         if (task === 0) {
             if (props.config[CategoryType.EXERCISE].length === 0) {
+                i--;
                 continue;
             }
-            const content = props.config[CategoryType.EXERCISE].splice(0,1)
+            const content = props.config[CategoryType.EXERCISE].splice(0, 1)
             widgets.push(<Widget><Exercise exercise={content[0]} /></Widget>);
         }
         else if (task === 1) {
             if (props.config[CategoryType.SOCIAL].length === 0) {
+                i--;
                 continue;
             }
-            const content = props.config[CategoryType.SOCIAL].splice(0,1)
+            const content = props.config[CategoryType.SOCIAL].splice(0, 1)
             widgets.push(<Widget><Social social={content[0]} /></Widget>);
         }
         else if (task === 2) {
             if (props.config[CategoryType.FOOD].length === 0) {
+                i--;
                 continue;
             }
-            const content = props.config[CategoryType.FOOD].splice(0,1)
+            const content = props.config[CategoryType.FOOD].splice(0, 1)
             widgets.push(<Widget><Food food={content[0]} /></Widget>);
         }
         else if (task === 3) {
             if (props.config[CategoryType.WATER].length === 0) {
+                i--;
                 continue;
             }
-            const content = props.config[CategoryType.WATER].splice(0,1)
+            const content = props.config[CategoryType.WATER].splice(0, 1)
             widgets.push(<Widget><Water drink={content[0]} /></Widget>);
+        }else if (task === 4) {
+            if (props.config[CategoryType.SLEEP].length === 0) {
+                i--;
+                continue;
+            }
+            const content = props.config[CategoryType.SLEEP].splice(0, 1)
+            widgets.push(<Widget><Sleep sleep={content[0]} /></Widget>);
+
         }
         else {
             const index = Math.floor(Math.random() * Affirmations.length);

Server/main.py

@@ -10,7 +10,7 @@
 CORS(app)
 model = whisper.load_model("tiny")
 
-goal_categories = ['exercise', 'food', 'water', 'social']
+goal_categories = ['exercise', 'food', 'water', 'social', "sleep"]
 sentence_classifier = pipeline("zero-shot-classification", model="facebook/bart-large-mnli")
 goal_status_pipe = pipeline("sentiment-analysis", model="distilbert/distilbert-base-uncased-finetuned-sst-2-english")
 
@@ -49,6 +49,18 @@
         "Take a group class (cooking, art, etc.)",
         "Participate in a community sports league"
     ],
+    "sleep": [
+        "Go to bed early",
+        "No caffeine after 10am",
+        "Clean your bedsheets and make your bed",
+        "Put your phone away early",
+        "Read 20 pages of a book before bed",
+        "Try a weighted blanket",
+        "Get up earlier",
+        "Stretch before bed",
+        "Avoid high intensity exercises before bed",
+        "Take some melatonin supplements"
+    ],
     "food": [
         "Eat a salad",
         "Try a new recipe",
@@ -96,7 +108,7 @@ def suggest():
         return Response("Invalid argument", status=400)
 
     # Whitelist topics
-    topics = filter(lambda x: x in goal_categories, topics)
+    topics = list(filter(lambda x: x in goal_categories, topics))
 
     if not topics or not count:
         return Response("Invalid argument", status=400)