protect the api

src/app/interface/bottom-bar/index.tsx

@@ -17,7 +17,16 @@ export function BottomBar() {
 
   const allStatus = Object.values(panelGenerationStatus)
   const remainingImages = allStatus.reduce((acc, s) => (acc + (s ? 1 : 0)), 0)
-    
+  
+  /*
+  const handleUpscale = () => {
+    startTransition(() => {
+      we are blocked here, because we don't know the render id
+      also  we will have to store a state about the 
+    })
+  }
+  */
+
   const handleShare = async () => {
     const dataUrl = await pageToImage()
     // console.log("dataUrl:", dataUrl)

src/app/interface/panel/index.tsx

@@ -35,6 +35,8 @@ export function Panel({
   const panels = useStore(state => state.panels)
   const prompt = panels[panel] || ""
 
+  const setRenderedIds = useStore(state => state.setRenderedIds)
+
   const captions = useStore(state => state.captions)
   const caption = captions[panel] || ""
 
@@ -61,6 +63,8 @@ export function Panel({
 
     // important: update the status, and clear the scene
     setGeneratingImages(panel, true)
+
+    // just to empty it
     setRendered(getInitialRenderedScene())
 
     setTimeout(() => {
@@ -79,6 +83,7 @@ export function Panel({
       if (newRendered) {
         // console.log("newRendered:", newRendered)
         setRendered(renderedRef.current = newRendered)
+        // addRenderedScene(newRendered)
 
         // but we are still loading!
       } else {

src/app/main.tsx

@@ -122,7 +122,7 @@ export default function Main() {
         fonts.actionman.className
       )}>
         <div className={cn(
-          `text-center text-xl text-stone-600 w-[70%]`,
+          `text-center text-xl text-stone-700 w-[70%]`,
           isGeneratingStory ? ``: `scale-0 opacity-0`,
           `transition-all duration-300 ease-in-out`,
         )}>

src/app/store/index.ts

@@ -6,6 +6,7 @@ import { FontName } from "@/lib/fonts"
 import { Preset, PresetName, defaultPreset, getPreset, getRandomPreset } from "@/app/engine/presets"
 import { LayoutName, defaultLayout, getRandomLayoutName, getRandomLayoutNames } from "../layouts"
 import html2canvas from "html2canvas"
+import { RenderedScene } from "@/types"
 
 export const useStore = create<{
   prompt: string