added doom

package-lock.json

@@ -44,7 +44,6 @@
         "next": "13.4.10",
         "pick": "^0.0.1",
         "postcss": "8.4.26",
-        "qs": "^6.11.2",
         "react": "18.2.0",
         "react-circular-progressbar": "^2.1.0",
         "react-day-picker": "^8.8.0",
@@ -4835,20 +4834,6 @@
         "node": ">=6"
       }
     },
-    "node_modules/qs": {
-      "version": "6.11.2",
-      "resolved": "https://registry.npmjs.org/qs/-/qs-6.11.2.tgz",
-      "integrity": "sha512-tDNIz22aBzCDxLtVH++VnTfzxlfeK5CbqohpSqpJgj1Wg/cQbStNAz3NuqCs5vV+pjBsK4x4pN9HlVh7rcYRiA==",
-      "dependencies": {
-        "side-channel": "^1.0.4"
-      },
-      "engines": {
-        "node": ">=0.6"
-      },
-      "funding": {
-        "url": "https://github.com/sponsors/ljharb"
-      }
-    },
     "node_modules/queue-microtask": {
       "version": "1.2.3",
       "resolved": "https://registry.npmjs.org/queue-microtask/-/queue-microtask-1.2.3.tgz",

package.json

@@ -45,7 +45,6 @@
     "next": "13.4.10",
     "pick": "^0.0.1",
     "postcss": "8.4.26",
-    "qs": "^6.11.2",
     "react": "18.2.0",
     "react-circular-progressbar": "^2.1.0",
     "react-day-picker": "^8.8.0",

src/app/games/doom.ts

@@ -0,0 +1,27 @@
+import { Game } from "./types"
+
+const initialSituation = [
+  `looking at building on Mars, with multiple moons in the sky`,
+].join(", ")
+
+const initialActionnables = [
+  "gun",
+  "person",
+  "door",
+  "laser",
+  "window",
+  "box"
+]
+
+export const game: Game = {
+  title: "Doom",
+  type: "doom",
+  initialSituation,
+  initialActionnables,
+  getScenePrompt: (situation?: string) => [
+    `Screenshot from Doom`,
+    situation || initialSituation,
+    `first person, beautiful, unreal engine`
+  ]
+}
+

src/app/games/dungeon.ts

@@ -55,5 +55,5 @@ export const game: Game = {
     situation || initialSituation,
     `medieval`,
     `unreal engine`,
-  ].join(", ")
+  ]
 }

src/app/games/index.ts

@@ -3,8 +3,9 @@ import { GameType } from "./types"
 import { game as pirates } from "./pirates"
 import { game as city } from "./city"
 import { game as dungeon } from "./dungeon"
+import { game as doom } from "./doom"
 
-export const games = { pirates, city, dungeon }
+export const games = { pirates, city, dungeon, doom }
 
 export const defaultGame: GameType = "pirates"
 

src/app/games/types.ts

@@ -1,4 +1,4 @@
-export type GameType = 'pirates' | 'city' | 'dungeon'
+export type GameType = 'pirates' | 'city' | 'dungeon' | 'doom'
 
 export interface Scene {
   actionnables: string[]
@@ -10,5 +10,5 @@ export interface Game {
   type: GameType
   initialSituation: string
   initialActionnables: string[]
-  getScenePrompt: (situation?: string) => string | string[]
+  getScenePrompt: (situation?: string) => string[]
 }

src/app/main.tsx

@@ -1,7 +1,7 @@
 "use client"
 
 import { useEffect, useRef, useState, useTransition } from "react"
-import qs from "qs"
+import { useSearchParams } from 'next/navigation'
 
 import { ImageRenderer } from "@/components/business/image-renderer"
 
@@ -30,9 +30,11 @@ export default function Main() {
     maskBase64: "",
     segments:[]
   })
-  const urlParams = qs.parse(window.location.search.slice(1))
-  console.log("urlParams:", urlParams)
-  const ref = useRef<GameType>(`${urlParams?.game as any}` as GameType)
+  const searchParams = useSearchParams()
+ 
+  const requestedGame = (searchParams.get('game') as GameType) || defaultGame
+  console.log("requestedGame:", requestedGame)
+  const gameRef = useRef<GameType>(requestedGame)
   const [situation, setSituation] = useState("")
   const [scene, setScene] = useState("")
   const [dialogue, setDialogue] = useState("")
@@ -47,13 +49,14 @@ export default function Main() {
 
       // console.log(`getting agent..`)
       // note: we use a ref so that it can be changed in the background
-      const type = ref?.current
+      const type = gameRef?.current
+      console.log("type:", type)
       const game = getGame(type)
 
       // console.log(`rendering scene..`)
       const newRendered = await render(
         // SCENE PROMPT
-        [...game.getScenePrompt(nextSituation)].join(", "),
+        game.getScenePrompt(nextSituation).join(", "),
 
         // ACTIONNABLES
         (Array.isArray(nextActionnables) && nextActionnables.length
@@ -63,7 +66,7 @@ export default function Main() {
       )
 
       // detect if something changed in the background
-      if (type !== ref?.current) {
+      if (type !== gameRef?.current) {
         console.log("agent type changed! reloading scene")
         setTimeout(() => { loadNextScene() }, 0)
         return
@@ -94,7 +97,7 @@ export default function Main() {
 
     await startTransition(async () => {
 
-      const game = getGame(ref.current)
+      const game = getGame(gameRef.current)
 
       let newDialogue = ""
       try {
@@ -131,9 +134,9 @@ export default function Main() {
         <div className="flex flex-row items-center space-x-3">
           <label className="flex">Select a story:</label>
           <Select
-            defaultValue={defaultGame}
+            defaultValue={gameRef.current}
             onValueChange={(value) => {
-              ref.current = value as GameType
+              gameRef.current = value as GameType
               setRendered({
                 assetUrl: "", 
                 error: "",