Add ChatGPT component

app/Dockerfile

@@ -12,6 +12,8 @@ ARG DOTNETRC
 ARG PROLIFIC_API_KEY
 ARG AWS_ACCESS_KEY_ID
 ARG AWS_SECRET_ACCESS_KEY
+ARG APP_NAME
+ARG APP_ENV
 
 SHELL ["/bin/bash", "-c"]
 

app/docker-compose.yml

@@ -12,8 +12,13 @@ services:
     ports:
       - 3000:3000
       - 3032:3032
+    environment:
+      - APP_NAME=temp
+      - APP_ENV=dev
     volumes:
-      - ./webapp/src:/mephisto/app/webapp/src:cached
+#      - ./webapp/src:/mephisto/app/webapp/src:cached
+      - .:/mephisto/app:cached
+      - /mephisto/app/webapp/node_modules/
       - ./data:/mephisto/data:cached
       - ../mephisto:/mephisto/mephisto:cached
       - ../examples:/mephisto/examples:cached

app/webapp/package.json

@@ -6,7 +6,8 @@
   "scripts": {
     "dev": "webpack --mode development",
     "dev:watch": "webpack --mode development --watch",
-    "test": "cypress open"
+    "test": "cypress open",
+    "build": "webpack --mode production"
   },
   "keywords": [],
   "author": "",

app/webapp/src/app.jsx

@@ -28,6 +28,7 @@ function MainApp() {
     isPreview,
     isLoading,
     initialTaskData,
+    fullData,
     handleSubmit,
     handleMetadataSubmit,
     handleFatalError,
@@ -110,6 +111,7 @@ function MainApp() {
       <ErrorBoundary handleError={handleFatalError}>
         <BaseFrontend
           taskData={initialTaskData}
+          fullData={fullData}
           onSubmit={handleSubmit}
           isOnboarding={isOnboarding}
           onError={handleFatalError}

app/webapp/src/components/ChatGPT.jsx

@@ -0,0 +1,23 @@
+import React from "react";
+
+function ChatGPT({getAgentRegistration, fullData}) {
+    const getLink = (getAgentRegistration, fullData) => {
+        const agentData = getAgentRegistration();
+        const params = {
+            ...agentData,
+            provider: agentData.provider_type,
+            app_env: fullData?.app_env,
+            app_name: fullData?.app_name,
+        };
+        const url = process.env.NODE_ENV === "production" ? "https://gpt.mephisto.aufederal2022.com" : "https://dev.gpt.mephisto.aufederal2022.com";
+        return `${url}?${new URLSearchParams(params).toString()}`;
+    };
+
+    return (
+        <iframe
+            src={getLink(getAgentRegistration, fullData)}
+            width="100%" height="100%" frameBorder="0"></iframe>
+    );
+}
+
+export {ChatGPT};

app/webapp/src/components/core_components.jsx

@@ -7,6 +7,9 @@
  */
 
 import React from 'react';
+import {
+    ChatGPT,
+} from "./ChatGPT.jsx";
 
 function OnboardingComponent({onSubmit}) {
     return (
@@ -60,17 +63,11 @@ function Directions({children}) {
     );
 }
 
-function SimpleFrontend({taskData, isOnboarding, onSubmit, onError, getAgentRegistration}) {
+function SimpleFrontend({taskData, fullData, isOnboarding, onSubmit, onError, getAgentRegistration}) {
     const [answers, setAnswers] = React.useState({
         answer1: 'sample1',
         answer2: '',
     });
-    const getLink = (getAgentRegistration) => {
-        const agentData = getAgentRegistration();
-        const params = { ...agentData, provider: agentData.provider_type };
-        return `https://gpt.mephisto.aufederal2022.com?${new URLSearchParams(params).toString()}`;
-    };
-
     const handleInputChange = (event) => {
         const {name, value} = event.target;
         setAnswers({...answers, [name]: value});
@@ -97,9 +94,7 @@ function SimpleFrontend({taskData, isOnboarding, onSubmit, onError, getAgentRegi
                 </button>
             </div>
             <div className="p-4 col-span-6 h-96">
-                <iframe
-                    src={getLink(getAgentRegistration)}
-                    width="100%" height="100%" frameBorder="0"></iframe>
+                <ChatGPT fullData={fullData} getAgentRegistration={getAgentRegistration}/>
             </div>
         </div>
     );

mephisto/operations/worker_pool.py

@@ -5,6 +5,7 @@
 # LICENSE file in the root directory of this source tree.
 
 import time
+import os
 from functools import partial
 from dataclasses import dataclass, fields
 from prometheus_client import Histogram, Gauge, Counter  # type: ignore
@@ -35,7 +36,8 @@
 from mephisto.utils.logger_core import get_logger
 
 logger = get_logger(name=__name__)
-
+APP_NAME = os.getenv('APP_NAME', 'temp')
+APP_ENV = os.getenv('APP_ENV', 'dev')
 
 AGENT_DETAILS_COUNT = Counter(
     "agent_details_responses", "Responses to agent details requests", ["response"]
@@ -84,6 +86,8 @@ class AgentDetails:
     agent_id: Optional[str] = None
     init_task_data: Optional[Dict[str, Any]] = None
     failure_reason: Optional[str] = None
+    app_env: str = APP_ENV
+    app_name: str = APP_NAME
 
     def to_dict(self):
         return dict((field.name, getattr(self, field.name)) for field in fields(self))

mephisto/tools/scripts.py

@@ -42,6 +42,8 @@
 if TYPE_CHECKING:
     from mephisto.abstractions.database import MephistoDB
 
+APP_NAME = os.getenv('APP_NAME', 'temp')
+APP_ENV = os.getenv('APP_ENV', 'dev')
 
 def load_db_and_process_config(
     cfg: DictConfig, print_config=False
@@ -286,7 +288,11 @@ def build_custom_bundle(
                 "The script should be able to be ran with bash"
             )
 
-    webpack_complete = subprocess.call(["npm", "run", "dev"])
+    if APP_ENV == 'prod':
+        webpack_complete = subprocess.call(["npm", "run", "build"])
+    else:
+        webpack_complete = subprocess.call(["npm", "run", "dev"])
+
     if webpack_complete != 0:
         raise Exception(
             "Webpack appears to have failed to build your "

packages/mephisto-task/src/index.js

@@ -49,6 +49,7 @@ const useMephistoTask = function () {
     blockedReason: null,
     blockedExplanation: null,
     initialTaskData: null,
+    fullData: null,
     isOnboarding: null,
     loaded: false,
   };
@@ -120,6 +121,7 @@ const useMephistoTask = function () {
         mephistoWorkerId: workerId,
         mephistoAgentId: agentId,
         initialTaskData: dataPacket.data.init_task_data,
+        fullData: dataPacket.data,
         loaded: true,
       });
     }