Various Bugfixes

AppExamples/discord/discordweb/src/App.tsx

@@ -1,12 +1,9 @@
-import IframeComponent from './IframeComponent';
 import { Call } from './components/Call'
 
 function App() {
   return (
     <div className="bg-zinc-900 h-screen w-screen flex justify-center items-center">
-      <IframeComponent>
         <Call />
-      </IframeComponent>
     </div>
   );
 }

AppExamples/discord/discordweb/src/components/Call.tsx

@@ -1,3 +1,4 @@
+import messageStore from '../stores/messageStore'
 import Controls from './Controls'
 import Profile from './Profile'
 import discordStore, { userData } from '../stores/discordStore'
@@ -7,6 +8,7 @@ export const Call = () => {
     const [callData, setCallData] = useState<userData[]>([])
 
     useEffect(() => {
+        messageStore.sendMessageToParent('server', 'message', 'message', 'Helloooooo')
         const handleCallDataUpdate = (data: userData[]) => {
             setCallData(data)
             console.log('Callback data',data)

AppExamples/discord/discordweb/src/stores/messageStore.ts

@@ -7,6 +7,7 @@ class MessageStore {
 
   constructor() {
     this.initialize();
+    this.sendMessageToParent('server', 'message', undefined, 'Hello from the discord app!')
   }
 
   private initialize() {
@@ -75,9 +76,15 @@ class MessageStore {
     this.listeners = this.listeners.filter(listener => listener !== callback);
   }
 
-  public sendMessageToParent() {
+  public sendMessageToParent(app?: string, request?: string, type?: string, data?: any) {
+    const payload = {
+      app: app || 'discord',
+      type: type || 'message',
+      request: request || null,
+      data: data || null
+    };
     window.parent.postMessage(
-      { type: 'IFRAME_ACTION', payload: 'Some data from iframe' },
+      { type: 'IFRAME_ACTION', payload: payload },
       '*' // Use a specific origin if possible for security
     );
   }

DeskThing/src/views/web/index.tsx

@@ -20,14 +20,24 @@ const WebView: React.FC<WebViewProps> = ({ currentView }) => {
       if (event.origin != `http://${ip}:${port}`) return
 
       console.log('Received message from iframe:', event)
-    };
+      if (socket.is_ready()) {
+        const payload = event.data.payload
+        const data = {
+          app: payload.app || currentView,
+          type: payload.type || null,
+          request: payload.request || null,
+          data: payload.data || null,
+        };
+        socket.post(data);
+      }
+    }
 
     window.addEventListener('message', handleMessage);
 
     return () => {
       window.removeEventListener('message', handleMessage);
     };
-  }, []);
+  }, [currentView, ip, port, socket]);
 
   const sendMessageToIframe = (data: any) => {
     if (iframeRef.current && iframeRef.current.contentWindow) {
@@ -52,6 +62,7 @@ const WebView: React.FC<WebViewProps> = ({ currentView }) => {
 
   const handleTouchStart = () => {
     setSwipeVisible(true)
+    sendMessageToIframe({ type: 'message', data: 'hello' })
   }
 
   const handleTouchEnd = () => {

DeskThingServer/src/renderer/src/components/Dev/Apps.tsx

@@ -3,6 +3,7 @@ import { useAppStore, App } from '../../store/appStore'
 import { IconX, IconPause, IconPlay, IconDetails, IconPulsing } from '../icons'
 import DisplayAppData from '../Overlays/DisplayAppData'
 import RequestStoreInstance, { Request } from '../../store/requestStore'
+import AppRequestOverlay from '../Overlays/AppRequest'
 
 export type View = 'apps' | 'local' | 'web'
 
@@ -13,6 +14,8 @@ const Apps = (): JSX.Element => {
   const [enabled, setEnabled] = useState(false)
   const [appIndex, setAppIndex] = useState(-1)
   const [appsWithActiveRequests, setAppsWithActiveRequests] = useState<string[]>([])
+  const [currentRequest, setCurrentRequest] = useState<Request | null>(null)
+  const [displayRequest, setDisplayRequest] = useState(false)
   const [path, setPath] = useState('')
 
   const handleAddAndRunApp = (appName: string): void => {
@@ -63,12 +66,23 @@ const Apps = (): JSX.Element => {
   }, [])
 
   const handleRequestTrigger = (appName: string): void => {
-    RequestStoreInstance.triggerRequestDisplay(appName)
+    const request = RequestStoreInstance.getRequestByAppName(appName)
+    if (request) {
+      setCurrentRequest(request)
+      setDisplayRequest(true)
+    }
   }
 
   return (
     <div className="h-svh w-[100%] flex flex-col justify-between items-center">
       <div className="pt-5 w-full flex justify-center">
+        {displayRequest && currentRequest && app && (
+          <AppRequestOverlay
+            requestName={app.name}
+            request={currentRequest}
+            onClose={() => setDisplayRequest(false)}
+          />
+        )}
         {enabled && <DisplayAppData appIndex={appIndex} setEnabled={setEnabled} app={app} />}
         <div className="pt-5 w-full flex 2xl:flex-row 2xl:flex-wrap flex-col items-center gap-2">
           <p className="italic text-red-700 font-geistMono">