diff --git a/src/pages/home.tsx b/src/pages/home.tsx
index e489573..08b4a4d 100644
--- a/src/pages/home.tsx
+++ b/src/pages/home.tsx
@@ -8,11 +8,12 @@ import { useLoadApps } from "@/hooks/useLoadApps";
import { useSettings } from "@/hooks/useSettings";
import { SetupBanner } from "@/components/SetupBanner";
import { isPreviewOpenAtom } from "@/atoms/viewAtoms";
-import { useState, useEffect } from "react";
+import { useState, useEffect, useCallback } from "react";
import { useStreamChat } from "@/hooks/useStreamChat";
import { HomeChatInput } from "@/components/chat/HomeChatInput";
import { usePostHog } from "posthog-js/react";
import { PrivacyBanner } from "@/components/TelemetryBanner";
+import { INSPIRATION_PROMPTS } from "@/prompts/inspiration_prompts";
export default function HomePage() {
const [inputValue, setInputValue] = useAtom(homeChatInputValueAtom);
@@ -28,6 +29,22 @@ export default function HomePage() {
// Get the appId from search params
const appId = search.appId ? Number(search.appId) : null;
+ // State for random prompts
+ const [randomPrompts, setRandomPrompts] = useState<
+ typeof INSPIRATION_PROMPTS
+ >([]);
+
+ // Function to get random prompts
+ const getRandomPrompts = useCallback(() => {
+ const shuffled = [...INSPIRATION_PROMPTS].sort(() => 0.5 - Math.random());
+ return shuffled.slice(0, 5);
+ }, []);
+
+ // Initialize random prompts
+ useEffect(() => {
+ setRandomPrompts(getRandomPrompts());
+ }, [getRandomPrompts]);
+
// Redirect to app details page if appId is present
useEffect(() => {
if (appId) {
@@ -92,89 +109,59 @@ export default function HomePage() {
-
- {[
- {
- icon: (
-
- ),
- label: "TODO list app",
- },
- {
- icon: (
-
- ),
- label: "Landing Page",
- },
- {
- icon: (
-
- ),
- label: "Sign Up Form",
- },
- ].map((item, index) => (
-
diff --git a/src/prompts/inspiration_prompts.tsx b/src/prompts/inspiration_prompts.tsx
new file mode 100644
index 0000000..c159766
--- /dev/null
+++ b/src/prompts/inspiration_prompts.tsx
@@ -0,0 +1,326 @@
+export const INSPIRATION_PROMPTS = [
+ {
+ icon: (
+
+ ),
+ label: "TODO list app",
+ },
+ {
+ icon: (
+
+ ),
+ label: "Landing Page",
+ },
+ {
+ icon: (
+
+ ),
+ label: "Sign Up Form",
+ },
+ {
+ icon: (
+
+ ),
+ label: "Mood Journal & Tracker",
+ },
+ {
+ icon: (
+
+ ),
+ label: "Interactive Story Game",
+ },
+ {
+ icon: (
+
+ ),
+ label: "Recipe Finder & Meal Planner",
+ },
+ {
+ icon: (
+
+ ),
+ label: "Personal Finance Dashboard",
+ },
+ {
+ icon: (
+
+ ),
+ label: "Travel Memory Map",
+ },
+ {
+ icon: (
+
+ ),
+ label: "AI Writing Assistant",
+ },
+ {
+ icon: (
+
+ ),
+ label: "Emoji Translator",
+ },
+ {
+ icon: (
+
+ ),
+ label: "Habit Streak Tracker",
+ },
+ {
+ icon: (
+
+ ),
+ label: "Newsletter Creator",
+ },
+ {
+ icon: (
+
+ ),
+ label: "Music Discovery App",
+ },
+ {
+ icon: (
+
+ ),
+ label: "3D Portfolio Viewer",
+ },
+ {
+ icon: (
+
+ ),
+ label: "AI Image Generator",
+ },
+ {
+ icon: (
+
+ ),
+ label: "Pomodoro Focus Timer",
+ },
+ {
+ icon: (
+
+ ),
+ label: "Virtual Avatar Builder",
+ },
+];