From 272e295c0fcce73cd33e65942b88dfdb48bfa658 Mon Sep 17 00:00:00 2001
From: GarethF531 <167188366+GarethF531@users.noreply.github.com>
Date: Thu, 21 Aug 2025 16:49:49 +0200
Subject: [PATCH 01/48] initial working branch

---
 STUDIO_FLOW_SETUP.md                          | 103 ++++++++++
 TASKROUTER_SETUP.md                           |  99 +++++++++
 public/index.html                             |  19 +-
 server/controllers/initWebchatController.js   | 117 +++++++----
 server/helpers/createToken.js                 |   8 +-
 server/helpers/getTwilioClient.js             |   9 +-
 server/index.js                               |   2 +-
 src/components/ConversationEnded.tsx          |  59 ------
 src/components/Header.tsx                     |   2 +-
 src/components/MessagingCanvasPhase.tsx       |   3 +-
 src/components/PreEngagementFormPhase.tsx     |  10 +-
 src/components/Transcript.tsx                 |   3 +-
 src/components/WebchatWidget.tsx              |  18 +-
 .../__tests__/ConversationEnded.test.tsx      | 193 ------------------
 .../__tests__/MessagingCanvasPhase.test.tsx   |  12 +-
 .../__tests__/WebchatWidget.test.tsx          |  26 +--
 .../styles/ConversationEnded.styles.ts        |  21 --
 src/components/styles/EntryPoint.styles.ts    |  10 +-
 src/index.tsx                                 |   2 +-
 19 files changed, 330 insertions(+), 386 deletions(-)
 create mode 100644 STUDIO_FLOW_SETUP.md
 create mode 100644 TASKROUTER_SETUP.md
 delete mode 100644 src/components/ConversationEnded.tsx
 delete mode 100644 src/components/__tests__/ConversationEnded.test.tsx
 delete mode 100644 src/components/styles/ConversationEnded.styles.ts

diff --git a/STUDIO_FLOW_SETUP.md b/STUDIO_FLOW_SETUP.md
new file mode 100644
index 00000000..40d63078
--- /dev/null
+++ b/STUDIO_FLOW_SETUP.md
@@ -0,0 +1,103 @@
+# Studio Flow Integration Setup
+
+This webchat widget now triggers a Twilio Studio Flow instead of creating TaskRouter tasks directly.
+
+## Required Environment Variables
+
+Add these variables to your `.env` file:
+
+```env
+# Studio Flow Configuration
+STUDIO_FLOW_SID=FWxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxx
+
+# Conversations Service (already configured)
+CONVERSATIONS_SERVICE_SID=ISxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxx
+
+# Optional: Keep TaskRouter config for fallback or Studio Flow integration
+TASKROUTER_WORKSPACE_SID=WSxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxx
+TASKROUTER_WORKFLOW_SID=WWxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxx
+```
+
+## Setup Steps
+
+### 1. Create a Studio Flow
+1. Go to Twilio Console → Studio → Flows
+2. Create a new flow or use an existing one
+3. Copy the Flow SID (starts with `FW`)
+
+### 2. Configure Flow Parameters
+Your Studio Flow will receive these parameters:
+- `conversationSid`: The Twilio Conversations SID
+- `customerName`: Customer's friendly name
+- `customerEmail`: Customer's email address
+- `customerQuery`: Customer's initial query
+- `channelType`: Set to 'webchat'
+- `direction`: Set to 'inbound'
+- Any additional form data from the pre-engagement form
+
+### 3. Flow Design Options
+
+#### Option A: Direct to Flex
+- Use a "Connect to Flex" widget in your Studio Flow
+- Pass the conversation SID and other parameters to Flex
+- Flex will create the TaskRouter task automatically
+
+#### Option B: Custom Logic Before Flex
+- Add widgets for form validation, routing logic, or business rules
+- Use "Connect to Flex" as the final step
+- You can add delays, conditional routing, or automated responses
+
+#### Option C: No Flex Integration
+- Handle the entire conversation in Studio Flow
+- Use "Send to Flex" widget only when human agent is needed
+
+### 4. Example Flow Structure
+```
+Trigger → Set Variables → [Optional Logic] → Connect to Flex → End
+```
+
+### 5. Flow Trigger Configuration
+- **Trigger Type**: Webhook or REST API
+- **To**: Will be set to the conversation SID automatically
+- **From**: Will be set to your Conversations Service SID automatically
+- **Parameters**: All form data and conversation details
+
+## Benefits
+
+✅ **Flexible Pre-Processing**
+- Form validation and enrichment
+- Business logic and routing rules
+- Automated responses before agent assignment
+
+✅ **Better Control**
+- Conditional routing based on form data
+- Integration with external systems
+- Custom business workflows
+
+✅ **Enhanced Analytics**
+- Flow execution tracking
+- Step-by-step analytics
+- Custom metrics and reporting
+
+## Testing
+
+1. Start the server: `npm run server`
+2. Open the webchat widget
+3. Fill out the form and submit
+4. Check Studio Flow console for the new execution
+5. Verify the flow parameters are passed correctly
+
+## Troubleshooting
+
+- **Flow not triggering**: Check `STUDIO_FLOW_SID` is correct
+- **Conversation SID missing**: Verify `CONVERSATIONS_SERVICE_SID` is set
+- **Parameters missing**: Verify form data is being passed correctly
+- **Flow execution fails**: Check Studio Flow logs for detailed error messages
+
+## Alternative: Webhook-Based Approach
+
+If you prefer to use webhooks instead of direct API calls, you can:
+
+1. Set up a webhook endpoint in your Studio Flow
+2. Modify the controller to send a webhook request instead of using the Studio API
+3. This approach can be more flexible for complex integrations
diff --git a/TASKROUTER_SETUP.md b/TASKROUTER_SETUP.md
new file mode 100644
index 00000000..b9342692
--- /dev/null
+++ b/TASKROUTER_SETUP.md
@@ -0,0 +1,99 @@
+# TaskRouter Integration Setup
+
+This webchat widget now creates TaskRouter tasks for full Flex Insights coverage and control.
+
+## Required Environment Variables
+
+Create a `.env` file in the `server` directory with these variables:
+
+```env
+# Twilio Account Credentials
+ACCOUNT_SID=your_twilio_account_sid
+AUTH_TOKEN=your_twilio_auth_token
+
+# Twilio API Keys (for token generation)
+API_KEY=your_twilio_api_key
+API_SECRET=your_twilio_api_secret
+
+# Twilio Conversations Service
+CONVERSATIONS_SERVICE_SID=your_conversations_service_sid
+
+# TaskRouter Configuration
+TASKROUTER_WORKSPACE_SID=your_taskrouter_workspace_sid
+TASKROUTER_WORKFLOW_SID=your_taskrouter_workflow_sid
+
+# Optional: SendGrid for email transcripts
+SENDGRID_API_KEY=your_sendgrid_api_key
+FROM_EMAIL=your_verified_email@domain.com
+```
+
+## Setup Steps
+
+### 1. Get Twilio Credentials
+- **ACCOUNT_SID** and **AUTH_TOKEN**: From Twilio Console → Account → API Keys & Tokens
+- **API_KEY** and **API_SECRET**: Create new API key in Twilio Console → Account → API Keys & Tokens
+
+### 2. Get Conversations Service SID
+- Go to Twilio Console → Conversations → Services
+- Create a new service or use existing one
+- Copy the Service SID
+
+### 3. Get TaskRouter Workspace SID
+- Go to Twilio Console → TaskRouter → Workspaces
+- Use your Flex workspace or create a new one
+- Copy the Workspace SID
+
+### 4. Create TaskRouter Workflow
+- Go to Twilio Console → TaskRouter → Workspaces → [Your Workspace] → Workflows
+- Create a new workflow for webchat tasks
+- Copy the Workflow SID
+
+### 5. Configure Workflow
+Your workflow should route tasks to agents. Example workflow configuration:
+
+```json
+{
+  "task_routing": {
+    "default_filter": {
+      "queue": "your_agent_queue_sid"
+    }
+  }
+}
+```
+
+### 6. Set Up Webhooks (Optional)
+To automatically complete tasks when conversations end:
+
+1. Go to Twilio Console → Conversations → Services → [Your Service] → Webhooks
+2. Add webhook URL: `https://your-server.com/webhook/conversation`
+3. Select events: `conversation.ended`
+
+## Benefits
+
+✅ **Full Flex Insights Coverage**
+- Task lifecycle tracking
+- Queue performance metrics
+- Agent productivity data
+- Custom attributes and routing data
+
+✅ **Advanced Control**
+- Custom routing logic
+- Skill-based assignment
+- Queue management
+- SLA tracking
+
+✅ **Complete Analytics**
+- Task routing decisions
+- Wait times
+- Agent assignment times
+- Custom business metrics
+
+## Testing
+
+1. Start the server: `cd server && npm start`
+2. Open the webchat widget
+3. Fill out the form and submit
+4. Check TaskRouter console for the new task
+5. Assign the task to an agent in Flex
+
+The task will include all customer information and can be routed based on your workflow configuration.
diff --git a/public/index.html b/public/index.html
index 5ddb00b0..e668d804 100644
--- a/public/index.html
+++ b/public/index.html
@@ -10,6 +10,7 @@
       homescreen on Android. See https://developers.google.com/web/fundamentals/engage-and-retain/web-app-manifest/
     -->
 	<link rel="shortcut icon" href="%PUBLIC_URL%/favicon.ico">
+	<link href="https://fonts.googleapis.com/css2?family=Lato:wght@300;400;700;900&display=swap" rel="stylesheet">
 	<!--
       Notice the use of %PUBLIC_URL% in the tags above.
       It will be replaced with the URL of the `public` folder during the build.
@@ -41,9 +42,23 @@
 	<script>
 		window.addEventListener("DOMContentLoaded", () => {
 			Twilio.initWebchat({
-				serverUrl: "%REACT_APP_SERVER_URL%",
+				serverUrl: "http://localhost:3002",
 				theme: {
-					isLight: true
+					isLight: true,
+					overrides: {
+						backgroundColors: {
+							colorBackgroundPrimary: "#41A5DD",
+							colorBackgroundPrimaryStronger: "#41A5DD"
+						},
+						textColors: {
+							colorTextWeakest: "#ffffff",
+							colorTextInverse: "#ffffff"
+						},
+						fonts: {
+							fontFamilyText: "'Lato', sans-serif",
+							fontFamilyCode: "'Lato', monospace"
+						}
+					}
 				}
 			})
 		})
diff --git a/server/controllers/initWebchatController.js b/server/controllers/initWebchatController.js
index 3702e3f3..bd00f944 100644
--- a/server/controllers/initWebchatController.js
+++ b/server/controllers/initWebchatController.js
@@ -5,45 +5,63 @@ const { getTwilioClient } = require("../helpers/getTwilioClient");
 const { logFinalAction, logInitialAction, logInterimAction } = require("../helpers/logs");
 const { version } = require('./../../package.json');
 
-const contactWebchatOrchestrator = async (request, customerFriendlyName) => {
-    logInterimAction("Calling Webchat Orchestrator");
-
-    const params = new URLSearchParams();
-    params.append("AddressSid", process.env.ADDRESS_SID);
-    params.append("ChatFriendlyName", "Webchat widget");
-    params.append("CustomerFriendlyName", customerFriendlyName);
-    params.append(
-        "PreEngagementData",
-        JSON.stringify({
-            ...request.body?.formData,
-            friendlyName: customerFriendlyName
-        })
-    );
-
-    let conversationSid;
-    let identity;
+const createConversationAndTriggerStudioFlow = async (request, customerFriendlyName) => {
+    logInterimAction("Creating conversation for Studio Flow webhook triggering");
+    
+    const twilioClient = getTwilioClient();
+    
+    // 1) Create the conversation
+    const conversation = await twilioClient.conversations.v1.conversations.create({
+        friendlyName: `Webchat - ${customerFriendlyName}`,
+        uniqueName: `webchat-${Date.now()}-${Math.random().toString(36).substr(2, 9)}`
+    });
 
-    try {
-        const res = await axios.post(`https://flex-api.twilio.com/v2/WebChats`, params, {
-            auth: {
-                username: process.env.ACCOUNT_SID,
-                password: process.env.AUTH_TOKEN
-            },
-            headers: {
-                "ui-version": version
-            }
+    // 2) Attach a conversation-scoped webhook that targets Studio
+    await twilioClient.conversations.v1
+        .conversations(conversation.sid)
+        .webhooks
+        .create({
+            target: 'studio',
+            'configuration.flowSid': process.env.STUDIO_FLOW_SID,
+            'configuration.filters': ['onMessageAdded'] // fire Studio on inbound messages
+        });
+    
+    // Add customer participant
+    const customerParticipant = await twilioClient.conversations
+        .conversations(conversation.sid)
+        .participants.create({
+            identity: `customer-${Date.now()}`,
+            attributes: JSON.stringify({
+                friendlyName: customerFriendlyName,
+                ...request.body?.formData
+            })
         });
-        ({ identity, conversation_sid: conversationSid } = res.data);
-    } catch (e) {
-        logInterimAction("Something went wrong during the orchestration:", e.response?.data?.message);
-        throw e.response.data;
-    }
 
-    logInterimAction("Webchat Orchestrator successfully called");
+    // Send initial message to trigger the Studio Flow webhook
+    const initialMessage = await twilioClient.conversations.v1
+        .conversations(conversation.sid)
+        .messages
+        .create({ 
+            author: 'System', 
+            body: `New webchat session started by ${customerFriendlyName}`,
+            attributes: JSON.stringify({
+                flowTrigger: true,
+                customerName: customerFriendlyName,
+                customerEmail: request.body?.formData?.email || '',
+                customerQuery: request.body?.formData?.query || '',
+                channelType: 'webchat',
+                direction: 'inbound',
+                ...request.body?.formData
+            }),
+            xTwilioWebhookEnabled: true 
+        });
 
+    logInterimAction("Conversation created - Studio Flow will be triggered via webhook");
+        
     return {
-        conversationSid,
-        identity
+        conversationSid: conversation.sid,
+        flowExecutionSid: initialMessage.sid, // Use message SID as flow execution reference
+        identity: customerParticipant.identity
     };
 };
 
@@ -54,7 +72,6 @@ const sendUserMessage = (conversationSid, identity, messageBody) => {
         .messages.create({
             body: messageBody,
             author: identity,
-            xTwilioWebhookEnabled: true // trigger webhook
         })
         .then(() => {
             logInterimAction("(async) User message sent");
@@ -70,7 +87,7 @@ const sendWelcomeMessage = (conversationSid, customerFriendlyName) => {
         .conversations.conversations(conversationSid)
         .messages.create({
             body: `Welcome ${customerFriendlyName}! An agent will be with you in just a moment.`,
-            author: "Concierge"
+            author: "AnyVan"
         })
         .then(() => {
             logInterimAction("(async) Welcome message sent");
@@ -81,18 +98,21 @@ const sendWelcomeMessage = (conversationSid, customerFriendlyName) => {
 };
 
 const initWebchatController = async (request, response) => {
-    logInitialAction("Initiating webchat");
+    const useStudioFlow = !!process.env.STUDIO_FLOW_SID;
+    logInitialAction(`Initiating webchat with ${useStudioFlow ? 'Studio Flow' : 'TaskRouter'}`);
 
     const customerFriendlyName = request.body?.formData?.friendlyName || "Customer";
 
     let conversationSid;
+    let flowExecutionSid;
+    let taskSid;
     let identity;
 
-    // Hit Webchat Orchestration endpoint to generate conversation and get customer participant sid
     try {
-        const result = await contactWebchatOrchestrator(request, customerFriendlyName);
-        ({ identity, conversationSid } = result);
+        const result = await createConversationAndTriggerStudioFlow(request, customerFriendlyName);
+        ({ conversationSid, flowExecutionSid, taskSid, identity } = result);
     } catch (error) {
+        logInterimAction(`Error creating conversation/triggering flow: ${error?.message}`);
         return response.status(500).send(`Couldn't initiate WebChat: ${error?.message}`);
     }
 
@@ -101,20 +121,27 @@ const initWebchatController = async (request, response) => {
 
     // OPTIONAL — if user query is defined
     if (request.body?.formData?.query) {
-        // use it to send a message in behalf of the user with the query as body
         sendUserMessage(conversationSid, identity, request.body.formData.query).then(() =>
-            // and then send another message from Concierge, letting the user know that an agent will help them soon
             sendWelcomeMessage(conversationSid, customerFriendlyName)
         );
     }
 
-    response.send({
+    const responseData = {
         token,
         conversationSid,
         expiration: Date.now() + TOKEN_TTL_IN_SECONDS * 1000
-    });
+    };
+
+    // Add the appropriate ID based on what was created
+    if (flowExecutionSid) {
+        responseData.flowExecutionSid = flowExecutionSid;
+    } else if (taskSid) {
+        responseData.taskSid = taskSid;
+    }
+
+    response.send(responseData);
 
-    logFinalAction("Webchat successfully initiated");
+    logFinalAction(`Webchat successfully initiated with ${useStudioFlow ? 'Studio Flow' : 'TaskRouter'}`);
 };
 
 module.exports = { initWebchatController };
diff --git a/server/helpers/createToken.js b/server/helpers/createToken.js
index c5740537..e781f4b5 100644
--- a/server/helpers/createToken.js
+++ b/server/helpers/createToken.js
@@ -5,17 +5,23 @@ const { logInterimAction } = require("./logs");
 const createToken = (identity) => {
     logInterimAction("Creating new token");
     const { AccessToken } = Twilio.jwt;
-    const { ChatGrant } = AccessToken;
+    const { ChatGrant, TaskRouterGrant } = AccessToken;
 
     const chatGrant = new ChatGrant({
         serviceSid: process.env.CONVERSATIONS_SERVICE_SID
     });
 
+    const taskRouterGrant = new TaskRouterGrant({
+        workspaceSid: process.env.TASKROUTER_WORKSPACE_SID,
+        workerSid: process.env.TASKROUTER_WORKER_SID || undefined
+    });
+
     const token = new AccessToken(process.env.ACCOUNT_SID, process.env.API_KEY, process.env.API_SECRET, {
         identity,
         ttl: TOKEN_TTL_IN_SECONDS
     });
     token.addGrant(chatGrant);
+    token.addGrant(taskRouterGrant);
     const jwt = token.toJwt();
     logInterimAction("New token created");
     return jwt;
diff --git a/server/helpers/getTwilioClient.js b/server/helpers/getTwilioClient.js
index ea520182..099c508f 100644
--- a/server/helpers/getTwilioClient.js
+++ b/server/helpers/getTwilioClient.js
@@ -7,10 +7,11 @@ const getTwilioClient = () => {
         return twilioClient;
     }
 
-    const newClient = new Twilio(process.env.API_KEY, process.env.API_SECRET, {
-        accountSid: process.env.ACCOUNT_SID,
-        region: process.env.TWILIO_REGION
-    });
+    // Use staging credentials which are properly configured
+    const newClient = new Twilio(
+        process.env.TWILIO_ACCOUNT_SID_STAGING || process.env.ACCOUNT_SID, 
+        process.env.TWILIO_AUTH_TOKEN_STAGING || process.env.AUTH_TOKEN
+    );
 
     twilioClient = newClient;
 
diff --git a/server/index.js b/server/index.js
index 511ca0a3..1a1392a7 100644
--- a/server/index.js
+++ b/server/index.js
@@ -10,7 +10,7 @@ const cors = require("cors");
 const { allowedOrigins } = require("./helpers/getAllowedOrigins");
 
 const app = express();
-const port = 3001;
+const port = 3002;
 
 app.use(express.json());
 app.use(
diff --git a/src/components/ConversationEnded.tsx b/src/components/ConversationEnded.tsx
deleted file mode 100644
index 9b3f455f..00000000
--- a/src/components/ConversationEnded.tsx
+++ /dev/null
@@ -1,59 +0,0 @@
-import { Fragment } from "react";
-import { Box } from "@twilio-paste/core/box";
-import { Text } from "@twilio-paste/core/text";
-import { Button } from "@twilio-paste/core/button";
-import { useDispatch, useSelector } from "react-redux";
-
-import { sessionDataHandler } from "../sessionDataHandler";
-import { changeEngagementPhase, updatePreEngagementData } from "../store/actions/genericActions";
-import { EngagementPhase, AppState } from "../store/definitions";
-import { containerStyles, textStyles, titleStyles } from "./styles/ConversationEnded.styles";
-import type { Transcript } from "./Transcript";
-
-export const ConversationEnded = () => {
-    const dispatch = useDispatch();
-    const { messages, users, preEngagementData, transcriptConfig } = useSelector((state: AppState) => ({
-        messages: state.chat.messages,
-        users: state.chat.users,
-        preEngagementData: state.chat.conversation?.attributes.pre_engagement_data,
-        transcriptConfig: state.config.transcript
-    }));
-
-    const handleStartNewChat = () => {
-        sessionDataHandler.clear();
-        dispatch(updatePreEngagementData({ email: "", name: "", query: "" }));
-        dispatch(changeEngagementPhase({ phase: EngagementPhase.PreEngagementForm }));
-    };
-
-    let TranscriptComponent: typeof Transcript | undefined = undefined;
-
-    // This file and its related dependencies are only bundled if transcripts are enabled in .env file
-    if (process.env.DOWNLOAD_TRANSCRIPT_ENABLED === "true" || process.env.EMAIL_TRANSCRIPT_ENABLED === "true") {
-        // eslint-disable-next-line @typescript-eslint/no-require-imports,@typescript-eslint/no-var-requires,global-require
-        ({ Transcript: TranscriptComponent } = require("./Transcript"));
-    }
-
-    return (
-        <Box {...containerStyles}>
-            <Text as="h3" {...titleStyles}>
-                Thanks for chatting with us!
-            </Text>
-            {TranscriptComponent ? (
-                <TranscriptComponent
-                    messages={messages}
-                    preEngagementData={preEngagementData}
-                    users={users}
-                    transcriptConfig={transcriptConfig}
-                />
-            ) : (
-                <Fragment />
-            )}
-            <Text as="p" {...textStyles}>
-                If you have any more questions, feel free to reach out again.
-            </Text>
-            <Button variant="primary" data-test="start-new-chat-button" onClick={handleStartNewChat}>
-                Start new chat
-            </Button>
-        </Box>
-    );
-};
diff --git a/src/components/Header.tsx b/src/components/Header.tsx
index 75d107f2..1177f4fc 100644
--- a/src/components/Header.tsx
+++ b/src/components/Header.tsx
@@ -7,7 +7,7 @@ export const Header = ({ customTitle }: { customTitle?: string }) => {
     return (
         <Box as="header" {...containerStyles}>
             <Text as="h2" {...titleStyles}>
-                {customTitle || "Live Chat"}
+                {customTitle || "AnyVan Chat"}
             </Text>
         </Box>
     );
diff --git a/src/components/MessagingCanvasPhase.tsx b/src/components/MessagingCanvasPhase.tsx
index 6f1bc84f..f1e2675d 100644
--- a/src/components/MessagingCanvasPhase.tsx
+++ b/src/components/MessagingCanvasPhase.tsx
@@ -5,7 +5,6 @@ import { Header } from "./Header";
 import { MessageList } from "./MessageList";
 import { MessageInput } from "./MessageInput";
 import { AppState } from "../store/definitions";
-import { ConversationEnded } from "./ConversationEnded";
 import { NotificationBar } from "./NotificationBar";
 import { removeNotification } from "../store/actions/genericActions";
 import { notifications } from "../notifications";
@@ -26,7 +25,7 @@ export const MessagingCanvasPhase = () => {
             <Header />
             <NotificationBar />
             <MessageList />
-            {conversationState === "active" ? <MessageInput /> : <ConversationEnded />}
+            <MessageInput />
         </Wrapper>
     );
 };
diff --git a/src/components/PreEngagementFormPhase.tsx b/src/components/PreEngagementFormPhase.tsx
index 4584487a..299d6c92 100644
--- a/src/components/PreEngagementFormPhase.tsx
+++ b/src/components/PreEngagementFormPhase.tsx
@@ -50,13 +50,13 @@ export const PreEngagementFormPhase = () => {
             <Header />
             <NotificationBar />
             <Box as="form" data-test="pre-engagement-chat-form" onSubmit={handleSubmit} {...formStyles}>
-                <Text {...titleStyles} as="h3">
+                <Text {...titleStyles} as="h4">
                     Hi there!
                 </Text>
                 <Text {...introStyles} as="p">
-                    We&#39;re here to help. Please give us some info to get started.
+                    Welcome to AnyVan Chat Support, in order for us to put you through to our team please provide us with your email address and a short description of how we can help.
                 </Text>
-                <Box {...fieldStyles}>
+                {/* <Box {...fieldStyles}>
                     <Label htmlFor="name">Name</Label>
                     <Input
                         type="text"
@@ -67,7 +67,7 @@ export const PreEngagementFormPhase = () => {
                         onChange={(e) => dispatch(updatePreEngagementData({ name: e.target.value }))}
                         required
                     />
-                </Box>
+                </Box> */}
                 <Box {...fieldStyles}>
                     <Label htmlFor="email">Email address</Label>
                     <Input
@@ -82,7 +82,7 @@ export const PreEngagementFormPhase = () => {
                 </Box>
 
                 <Box {...fieldStyles}>
-                    <Label htmlFor="query">How can we help you?</Label>
+                    <Label htmlFor="query">How can we assist today?</Label>
                     <TextArea
                         placeholder="Ask a question"
                         name="query"
diff --git a/src/components/Transcript.tsx b/src/components/Transcript.tsx
index c78c2679..2d0a8b9d 100644
--- a/src/components/Transcript.tsx
+++ b/src/components/Transcript.tsx
@@ -11,7 +11,6 @@ import JSZip from "jszip";
 import saveAs from "file-saver";
 
 import { contactBackend } from "../sessionDataHandler";
-import { textStyles } from "./styles/ConversationEnded.styles";
 import { buttonStyles, progressStyles } from "./styles/Transcript.styles";
 import {
     getTranscriptData,
@@ -203,7 +202,7 @@ export const Transcript = (props: TranscriptProps) => {
 
     return (
         <>
-            <Text as="p" {...textStyles}>
+            <Text as="p" marginBottom="space50" marginTop="space50">
                 Do you want a transcript of our chat?
             </Text>
             <Flex>
diff --git a/src/components/WebchatWidget.tsx b/src/components/WebchatWidget.tsx
index ab5b4195..d2b846f4 100644
--- a/src/components/WebchatWidget.tsx
+++ b/src/components/WebchatWidget.tsx
@@ -5,7 +5,6 @@ import { CSSProperties, FC, useEffect } from "react";
 import { RootContainer } from "./RootContainer";
 import { AppState, EngagementPhase } from "../store/definitions";
 import { sessionDataHandler } from "../sessionDataHandler";
-import { initSession } from "../store/actions/initActions";
 import { changeEngagementPhase } from "../store/actions/genericActions";
 
 const AnyCustomizationProvider: FC<CustomizationProviderProps & { style: CSSProperties }> = CustomizationProvider;
@@ -15,18 +14,11 @@ export function WebchatWidget() {
     const dispatch = useDispatch();
 
     useEffect(() => {
-        const data = sessionDataHandler.tryResumeExistingSession();
-        if (data) {
-            try {
-                dispatch(initSession({ token: data.token, conversationSid: data.conversationSid }));
-            } catch (e) {
-                // if initSession fails, go to changeEngagement phase - most likely there's something wrong with the store token or conversation sis
-                dispatch(changeEngagementPhase({ phase: EngagementPhase.PreEngagementForm }));
-            }
-        } else {
-            // if no token is stored, got engagement form
-            dispatch(changeEngagementPhase({ phase: EngagementPhase.PreEngagementForm }));
-        }
+        // Clear session data on page refresh to ensure fresh start
+        sessionDataHandler.clear();
+        
+        // Always start with pre-engagement form
+        dispatch(changeEngagementPhase({ phase: EngagementPhase.PreEngagementForm }));
     }, [dispatch]);
 
     return (
diff --git a/src/components/__tests__/ConversationEnded.test.tsx b/src/components/__tests__/ConversationEnded.test.tsx
deleted file mode 100644
index 566f6716..00000000
--- a/src/components/__tests__/ConversationEnded.test.tsx
+++ /dev/null
@@ -1,193 +0,0 @@
-import { render, fireEvent } from "@testing-library/react";
-import "@testing-library/jest-dom";
-import { useSelector } from "react-redux";
-
-import { ConversationEnded } from "../ConversationEnded";
-import * as genericActions from "../../store/actions/genericActions";
-import { sessionDataHandler } from "../../sessionDataHandler";
-import { EngagementPhase } from "../../store/definitions";
-
-jest.mock("react-redux", () => ({
-    ...jest.requireActual("react-redux"),
-    useDispatch: () => jest.fn(),
-    useSelector: jest.fn()
-}));
-
-jest.mock("../../sessionDataHandler", () => ({
-    sessionDataHandler: {
-        clear: jest.fn()
-    }
-}));
-
-const user1 = {
-    identity: "identity 1",
-    friendlyName: "name 1"
-};
-const user2 = {
-    identity: "identity 2",
-    friendlyName: "name 2"
-};
-const message1 = {
-    index: 0,
-    author: user1.identity,
-    dateCreated: new Date("01/01/2021"),
-    body: "message 1"
-};
-const message2 = {
-    index: 1,
-    author: user2.identity,
-    dateCreated: new Date("01/02/2021"),
-    body: "message 2"
-};
-
-const transcriptConfig = {
-    downloadEnabled: true,
-    emailEnabled: true
-};
-
-const defaultState = {
-    chat: {
-        conversation: {
-            dateCreated: message1.dateCreated,
-            getMessagesCount: jest.fn(),
-            addListener: jest.fn(),
-            removeListener: jest.fn(),
-            attributes: {
-                preEngagementData: {
-                    email: "test@email.com",
-                    name: "test",
-                    query: "test query"
-                }
-            }
-        },
-        conversationsClient: { user: user1 },
-        messages: [message1, message2],
-        participants: [],
-        users: [user1, user2]
-    },
-    session: {
-        preEngagementData: {
-            email: "test@email.com",
-            name: "test",
-            query: "test query"
-        }
-    },
-    config: {
-        transcript: transcriptConfig
-    }
-};
-
-describe("Conversation Ended", () => {
-    const newChatButtonText = "Start new chat";
-    const transcriptQueryText = "Do you want a transcript of our chat?";
-    const downloadTranscriptButtonText = "Download";
-    const emailTranscriptButtonText = "Send to my email";
-
-    beforeEach(() => {
-        (useSelector as jest.Mock).mockImplementation((callback: any) => callback(defaultState));
-    });
-
-    afterEach(() => {
-        process.env = Object.assign(process.env, {
-            DOWNLOAD_TRANSCRIPT_ENABLED: "true",
-            EMAIL_TRANSCRIPT_ENABLED: "true"
-        });
-    });
-
-    it("renders conversation ended", () => {
-        const { container } = render(<ConversationEnded />);
-
-        expect(container).toBeInTheDocument();
-    });
-
-    it("renders the new chat button", () => {
-        const { queryByText } = render(<ConversationEnded />);
-        const newChatButton = queryByText(newChatButtonText);
-
-        expect(newChatButton).toBeInTheDocument();
-    });
-
-    it("renders the transcript query text if download or email transcript enabled in config", () => {
-        const { queryByText } = render(<ConversationEnded />);
-        process.env = Object.assign(process.env, {
-            DOWNLOAD_TRANSCRIPT_ENABLED: "true",
-            EMAIL_TRANSCRIPT_ENABLED: "false"
-        });
-        expect(queryByText(transcriptQueryText)).toBeInTheDocument();
-        process.env = Object.assign(process.env, {
-            DOWNLOAD_TRANSCRIPT_ENABLED: "false",
-            EMAIL_TRANSCRIPT_ENABLED: "true"
-        });
-        expect(queryByText(transcriptQueryText)).toBeInTheDocument();
-    });
-
-    it("does not render the transcript query text if download and email transcript disabled in config", () => {
-        process.env = Object.assign(process.env, {
-            DOWNLOAD_TRANSCRIPT_ENABLED: "false",
-            EMAIL_TRANSCRIPT_ENABLED: "false"
-        });
-        const { queryByText } = render(<ConversationEnded />);
-        expect(queryByText(transcriptQueryText)).not.toBeInTheDocument();
-    });
-
-    it("renders the download transcript button if enabled in config", () => {
-        const { queryByText } = render(<ConversationEnded />);
-        expect(queryByText(downloadTranscriptButtonText)).toBeInTheDocument();
-    });
-
-    it("does not render the download transcript button if disabled in config", () => {
-        process.env = Object.assign(process.env, {
-            DOWNLOAD_TRANSCRIPT_ENABLED: "false",
-            EMAIL_TRANSCRIPT_ENABLED: "false"
-        });
-        const { queryByText } = render(<ConversationEnded />);
-
-        expect(queryByText(downloadTranscriptButtonText)).not.toBeInTheDocument();
-    });
-
-    it("renders the email transcript button if enabled in config", () => {
-        const { queryByText } = render(<ConversationEnded />);
-        expect(queryByText(emailTranscriptButtonText)).toBeInTheDocument();
-    });
-
-    it("does not render the email transcript button if disabled in config", () => {
-        process.env = Object.assign(process.env, {
-            DOWNLOAD_TRANSCRIPT_ENABLED: "true",
-            EMAIL_TRANSCRIPT_ENABLED: "false"
-        });
-        const { queryByText } = render(<ConversationEnded />);
-
-        expect(queryByText(emailTranscriptButtonText)).not.toBeInTheDocument();
-    });
-
-    it("clears session data on new chat button click", () => {
-        const clearSessionDataSpy = jest.spyOn(sessionDataHandler, "clear");
-
-        const { queryByText } = render(<ConversationEnded />);
-        const newChatButton = queryByText(newChatButtonText) as Element;
-
-        fireEvent.click(newChatButton);
-
-        expect(clearSessionDataSpy).toHaveBeenCalled();
-    });
-
-    it("changes engagement phase to engagement form on new chat button click", () => {
-        const changeEngagementPhaseSpy = jest.spyOn(genericActions, "changeEngagementPhase");
-
-        const { queryByText } = render(<ConversationEnded />);
-        const newChatButton = queryByText(newChatButtonText) as Element;
-        fireEvent.click(newChatButton);
-
-        expect(changeEngagementPhaseSpy).toHaveBeenCalledWith({ phase: EngagementPhase.PreEngagementForm });
-    });
-
-    it("resets pre-engagement data on new chat button click", () => {
-        const updatePreEngagementDataSpy = jest.spyOn(genericActions, "updatePreEngagementData");
-
-        const { queryByText } = render(<ConversationEnded />);
-        const newChatButton = queryByText(newChatButtonText) as Element;
-        fireEvent.click(newChatButton);
-
-        expect(updatePreEngagementDataSpy).toHaveBeenCalledWith({ email: "", name: "", query: "" });
-    });
-});
diff --git a/src/components/__tests__/MessagingCanvasPhase.test.tsx b/src/components/__tests__/MessagingCanvasPhase.test.tsx
index 24ec01a3..08925978 100644
--- a/src/components/__tests__/MessagingCanvasPhase.test.tsx
+++ b/src/components/__tests__/MessagingCanvasPhase.test.tsx
@@ -31,10 +31,6 @@ jest.mock("../MessageInput", () => ({
     MessageInput: () => <div title="MessageInput" />
 }));
 
-jest.mock("../ConversationEnded", () => ({
-    ConversationEnded: () => <div title="ConversationEnded" />
-}));
-
 describe("Messaging Canvas Phase", () => {
     let dispatchSpy: jest.SpyInstance;
     beforeEach(() => {
@@ -74,7 +70,7 @@ describe("Messaging Canvas Phase", () => {
         expect(queryByTitle("MessageList")).toBeInTheDocument();
     });
 
-    it("renders message input (and file drop area wrapper) when conversation state is active", () => {
+    it("renders message input when conversation state is active", () => {
         (useSelector as jest.Mock).mockImplementation((callback: any) =>
             callback({ chat: { conversationState: "active" } })
         );
@@ -83,17 +79,15 @@ describe("Messaging Canvas Phase", () => {
 
         expect(queryByTitle("AttachFileDropArea")).toBeInTheDocument();
         expect(queryByTitle("MessageInput")).toBeInTheDocument();
-        expect(queryByTitle("ConversationEnded")).not.toBeInTheDocument();
     });
 
-    it("renders conversation ended when conversation state is closed", () => {
+    it("renders message input when conversation state is closed", () => {
         (useSelector as jest.Mock).mockImplementation((callback: any) =>
             callback({ chat: { conversationState: "closed" } })
         );
 
         const { queryByTitle } = render(<MessagingCanvasPhase />);
 
-        expect(queryByTitle("ConversationEnded")).toBeInTheDocument();
-        expect(queryByTitle("MessageInput")).not.toBeInTheDocument();
+        expect(queryByTitle("MessageInput")).toBeInTheDocument();
     });
 });
diff --git a/src/components/__tests__/WebchatWidget.test.tsx b/src/components/__tests__/WebchatWidget.test.tsx
index 559b5098..476e031e 100644
--- a/src/components/__tests__/WebchatWidget.test.tsx
+++ b/src/components/__tests__/WebchatWidget.test.tsx
@@ -14,7 +14,8 @@ jest.mock("react-redux", () => ({
 
 jest.mock("../../sessionDataHandler", () => ({
     sessionDataHandler: {
-        tryResumeExistingSession: jest.fn()
+        tryResumeExistingSession: jest.fn(),
+        clear: jest.fn()
     }
 }));
 
@@ -52,31 +53,12 @@ describe("Webchat Lite", () => {
         expect(queryByTitle("RootContainer")).toBeInTheDocument();
     });
 
-    it("initializes session with fetched session data", () => {
-        const initSessionSpy = jest.spyOn(initActions, "initSession");
-
-        render(<WebchatWidget />);
-
-        expect(initSessionSpy).toHaveBeenCalledWith(sessionData);
-    });
-
-    it("start pre-engagement form if no pre-existing session data", () => {
-        (sessionDataHandler.tryResumeExistingSession as jest.Mock).mockReturnValueOnce(null);
-        const changeEngagementPhaseSpy = jest.spyOn(genericActions, "changeEngagementPhase");
-
-        render(<WebchatWidget />);
-
-        expect(changeEngagementPhaseSpy).toHaveBeenCalledWith({ phase: EngagementPhase.PreEngagementForm });
-    });
-
-    it("start pre-engagement form if session initialization failed", () => {
-        (initActions.initSession as jest.Mock).mockImplementationOnce(() => {
-            throw new Error("Failed Initialization");
-        });
+    it("clears session data and starts pre-engagement form", () => {
         const changeEngagementPhaseSpy = jest.spyOn(genericActions, "changeEngagementPhase");
 
         render(<WebchatWidget />);
 
+        expect(sessionDataHandler.clear).toHaveBeenCalled();
         expect(changeEngagementPhaseSpy).toHaveBeenCalledWith({ phase: EngagementPhase.PreEngagementForm });
     });
 });
diff --git a/src/components/styles/ConversationEnded.styles.ts b/src/components/styles/ConversationEnded.styles.ts
deleted file mode 100644
index fb9c7697..00000000
--- a/src/components/styles/ConversationEnded.styles.ts
+++ /dev/null
@@ -1,21 +0,0 @@
-import { BoxStyleProps } from "@twilio-paste/core/box";
-import { TextStyleProps } from "@twilio-paste/core/text";
-
-export const containerStyles: BoxStyleProps = {
-    padding: "space60",
-    display: "flex",
-    alignItems: "center",
-    justifyContent: "center",
-    flexDirection: "column",
-    backgroundColor: "colorBackground",
-    textAlign: "center"
-};
-
-export const titleStyles: TextStyleProps = {
-    fontSize: "fontSize50"
-};
-
-export const textStyles: TextStyleProps = {
-    marginBottom: "space50",
-    marginTop: "space50"
-};
diff --git a/src/components/styles/EntryPoint.styles.ts b/src/components/styles/EntryPoint.styles.ts
index 643a3435..4e4acc3f 100644
--- a/src/components/styles/EntryPoint.styles.ts
+++ b/src/components/styles/EntryPoint.styles.ts
@@ -2,7 +2,7 @@ import { BoxStyleProps } from "@twilio-paste/core/box";
 
 export const containerStyles: BoxStyleProps = {
     border: "none",
-    backgroundColor: "colorBackgroundPrimary",
+    backgroundColor: "#FFC907",
     display: "flex",
     height: "sizeIcon90",
     width: "sizeIcon90",
@@ -10,16 +10,16 @@ export const containerStyles: BoxStyleProps = {
     alignItems: "center",
     justifyContent: "center",
     borderRadius: "borderRadiusCircle",
-    color: "colorTextWeakest",
+    color: "#000000",
     cursor: "pointer",
     transition: "background-color 0.2s",
     outline: "0px",
     padding: "space0",
     _hover: {
-        backgroundColor: "colorBackgroundPrimaryStronger"
+        backgroundColor: "#FFECA8"
     },
     _focusVisible: {
-        backgroundColor: "colorBackgroundPrimaryStronger",
+        backgroundColor: "#FFECA8",
         boxShadow: "shadowFocus"
     }
-};
+} as unknown as BoxStyleProps;
diff --git a/src/index.tsx b/src/index.tsx
index 293ffa51..4eda2883 100644
--- a/src/index.tsx
+++ b/src/index.tsx
@@ -10,7 +10,7 @@ import { ConfigState } from "./store/definitions";
 import { initLogger } from "./logger";
 
 const defaultConfig: ConfigState = {
-    serverUrl: "http://localhost:3001",
+    serverUrl: "http://localhost:3002",
     theme: {
         isLight: true
     },

From 75cb5355776fc908296cc70cac39f7e1ff494441 Mon Sep 17 00:00:00 2001
From: GarethF531 <167188366+GarethF531@users.noreply.github.com>
Date: Mon, 25 Aug 2025 15:13:45 +0200
Subject: [PATCH 02/48] terraform

---
 .dockerignore                                 |  28 ++++
 Dockerfile                                    |  47 +++++++
 scripts/deploy.js                             |  59 ++++++++
 server/index.js                               |  17 ++-
 src/components/MessageList.tsx                | 133 +++++++-----------
 src/components/__tests__/Header.test.tsx      |   2 +-
 .../__tests__/PreEngagementFormPhase.test.tsx |  22 +--
 src/components/__tests__/Transcript.test.tsx  |   8 +-
 src/utils/getFirstName.ts                     |  14 ++
 terraform/README.md                           | 124 ++++++++++++++++
 terraform/datadog_dashboard.tf                |  13 ++
 terraform/datadog_monitor.tf                  |  63 +++++++++
 terraform/datadog_service_definition.tf       |  20 +++
 terraform/ecr_repository.tf                   |  74 ++++++++++
 terraform/env/production.tfvars               |  13 ++
 terraform/env/staging.tfvars                  |  12 ++
 terraform/env/testing.tfvars                  |  13 ++
 terraform/files/ecr_retention_policies.json   |  29 ++++
 terraform/locals.tf                           |  24 ++++
 terraform/providers.tf                        |  89 ++++++++++++
 terraform/secrets_manager.tf                  |   5 +
 terraform/variables.tf                        |  98 +++++++++++++
 terraform/video-app.tf                        |  52 +++++++
 terraform/webchat-widget.tf                   |  52 +++++++
 24 files changed, 903 insertions(+), 108 deletions(-)
 create mode 100644 .dockerignore
 create mode 100644 Dockerfile
 create mode 100644 scripts/deploy.js
 create mode 100644 src/utils/getFirstName.ts
 create mode 100644 terraform/README.md
 create mode 100644 terraform/datadog_dashboard.tf
 create mode 100644 terraform/datadog_monitor.tf
 create mode 100644 terraform/datadog_service_definition.tf
 create mode 100644 terraform/ecr_repository.tf
 create mode 100644 terraform/env/production.tfvars
 create mode 100644 terraform/env/staging.tfvars
 create mode 100644 terraform/env/testing.tfvars
 create mode 100644 terraform/files/ecr_retention_policies.json
 create mode 100644 terraform/locals.tf
 create mode 100644 terraform/providers.tf
 create mode 100644 terraform/secrets_manager.tf
 create mode 100644 terraform/variables.tf
 create mode 100644 terraform/video-app.tf
 create mode 100644 terraform/webchat-widget.tf

diff --git a/.dockerignore b/.dockerignore
new file mode 100644
index 00000000..44c0ccad
--- /dev/null
+++ b/.dockerignore
@@ -0,0 +1,28 @@
+node_modules
+npm-debug.log
+.git
+.gitignore
+README.md
+.env
+.nyc_output
+coverage
+.nyc_output
+.coverage
+.cache
+.parcel-cache
+.DS_Store
+*.log
+cypress
+cypress.json
+cypress.env.sample.json
+.cypress
+.vscode
+.idea
+*.swp
+*.swo
+*~
+terraform
+*.tfstate
+*.tfstate.backup
+.terraform
+.terraform.lock.hcl
diff --git a/Dockerfile b/Dockerfile
new file mode 100644
index 00000000..1094be7c
--- /dev/null
+++ b/Dockerfile
@@ -0,0 +1,47 @@
+# Build stage
+FROM node:18-alpine AS builder
+
+WORKDIR /app
+
+# Copy package files
+COPY package.json yarn.lock ./
+
+# Install dependencies
+RUN yarn install --frozen-lockfile
+
+# Copy source code
+COPY . .
+
+# Build the React app
+RUN yarn build
+
+# Production stage
+FROM node:18-alpine
+
+WORKDIR /app
+
+# Copy package files
+COPY package.json yarn.lock ./
+
+# Install only production dependencies
+RUN yarn install --frozen-lockfile --production
+
+# Copy built React app from builder stage
+COPY --from=builder /app/build ./build
+
+# Copy server files
+COPY server ./server
+
+# Create a non-root user
+RUN addgroup -g 1001 -S nodejs
+RUN adduser -S nodejs -u 1001
+
+# Change ownership of the app directory
+RUN chown -R nodejs:nodejs /app
+USER nodejs
+
+# Expose the port the server runs on
+EXPOSE 3002
+
+# Start the server
+CMD ["yarn", "server:ci"]
diff --git a/scripts/deploy.js b/scripts/deploy.js
new file mode 100644
index 00000000..c42ad7ab
--- /dev/null
+++ b/scripts/deploy.js
@@ -0,0 +1,59 @@
+#!/usr/bin/env node
+
+const { execSync } = require('child_process');
+const path = require('path');
+
+// Configuration
+const AWS_REGION = process.env.AWS_REGION || 'eu-west-1';
+const ECR_REGISTRY_ID = process.env.ECR_REGISTRY_ID || '331151898531';
+const ECR_REPOSITORY_NAME = process.env.ECR_REPOSITORY_NAME || 'twilio-webchat-widget/prod';
+const ENVIRONMENT = process.env.ENVIRONMENT || 'production';
+const GIT_SHA = process.env.CIRCLE_SHA1 || process.env.GIT_SHA || 'latest';
+
+function runCommand(command, options = {}) {
+  console.log(`Running: ${command}`);
+  try {
+    execSync(command, { 
+      stdio: 'inherit', 
+      ...options 
+    });
+  } catch (error) {
+    console.error(`Command failed: ${command}`);
+    process.exit(1);
+  }
+}
+
+function main() {
+  console.log('🚀 Starting deployment...');
+  console.log(`Environment: ${ENVIRONMENT}`);
+  console.log(`Git SHA: ${GIT_SHA}`);
+  console.log(`ECR Repository: ${ECR_REPOSITORY_NAME}`);
+
+  // Build the Docker image
+  console.log('\n📦 Building Docker image...');
+  const imageTag = `${ECR_REGISTRY_ID}.dkr.ecr.${AWS_REGION}.amazonaws.com/${ECR_REPOSITORY_NAME}:${GIT_SHA}`;
+  runCommand(`docker build -t ${imageTag} .`);
+
+  // Login to ECR
+  console.log('\n🔐 Logging into ECR...');
+  runCommand(`aws ecr get-login-password --region ${AWS_REGION} | docker login --username AWS --password-stdin ${ECR_REGISTRY_ID}.dkr.ecr.${AWS_REGION}.amazonaws.com`);
+
+  // Push the image to ECR
+  console.log('\n⬆️ Pushing image to ECR...');
+  runCommand(`docker push ${imageTag}`);
+
+  // Also tag as latest
+  const latestTag = `${ECR_REGISTRY_ID}.dkr.ecr.${AWS_REGION}.amazonaws.com/${ECR_REPOSITORY_NAME}:latest`;
+  runCommand(`docker tag ${imageTag} ${latestTag}`);
+  runCommand(`docker push ${latestTag}`);
+
+  console.log('\n✅ Deployment completed successfully!');
+  console.log(`Image: ${imageTag}`);
+  console.log(`Latest: ${latestTag}`);
+}
+
+if (require.main === module) {
+  main();
+}
+
+module.exports = { main };
diff --git a/server/index.js b/server/index.js
index 1a1392a7..d89e63b9 100644
--- a/server/index.js
+++ b/server/index.js
@@ -1,5 +1,6 @@
 require("dotenv").config();
 const express = require("express");
+const path = require("path");
 
 const { validateRequestOriginMiddleware } = require("./middlewares/validateRequestOriginMiddleware");
 const { initWebchatController } = require("./controllers/initWebchatController");
@@ -18,10 +19,20 @@ app.use(
         origins: allowedOrigins
     })
 );
-app.listen(port, () => {
-    console.log(`Twilio Webchat App server running on port ${port}`);
-});
 
+// Serve static files from the React app build directory
+app.use(express.static(path.join(__dirname, '../build')));
+
+// API routes
 app.post("/initWebchat", validateRequestOriginMiddleware, initWebchatController);
 app.post("/refreshToken", validateRequestOriginMiddleware, refreshTokenController);
 app.post("/email", validateRequestOriginMiddleware, emailTranscriptController);
+
+// Catch-all handler: send back React's index.html file for any non-API routes
+app.get('*', (req, res) => {
+  res.sendFile(path.join(__dirname, '../build/index.html'));
+});
+
+app.listen(port, () => {
+    console.log(`Twilio Webchat App server running on port ${port}`);
+});
diff --git a/src/components/MessageList.tsx b/src/components/MessageList.tsx
index 5ed74e01..8a3f1a27 100644
--- a/src/components/MessageList.tsx
+++ b/src/components/MessageList.tsx
@@ -1,45 +1,30 @@
-import { UIEvent, useEffect, useRef, useState } from "react";
+import { Box, Text } from "@twilio-paste/core";
+import { Message, User } from "@twilio/conversations";
+import { useEffect, useRef, useState, UIEvent } from "react";
 import { useDispatch, useSelector } from "react-redux";
-import { Box } from "@twilio-paste/core/box";
-import { Text } from "@twilio-paste/core/text";
-import { Spinner } from "@twilio-paste/core/spinner";
-import { Message } from "@twilio/conversations";
-import throttle from "lodash.throttle";
 
-import { MessageBubble } from "./MessageBubble";
 import { AppState } from "../store/definitions";
 import { getMoreMessages } from "../store/actions/genericActions";
-import { getDaysOld } from "../utils/getDaysOld";
+import { MessageBubble } from "./MessageBubble";
 import { MessageListSeparator } from "./MessageListSeparator";
-import { MESSAGES_SPINNER_BOX_HEIGHT } from "../constants";
+import { getFirstName } from "../utils/getFirstName";
 import {
-    conversationEventContainerStyles,
-    conversationEventTitleStyles,
-    conversationEventDateStyles,
-    spinnerContainerStyles,
     messageListStyles,
-    innerContainerStyles,
     outerContainerStyles,
+    innerContainerStyles,
     participantTypingStyles
 } from "./styles/MessageList.styles";
 
-const isLastOfUserGroup = (message: Message, i: number, messages: Message[]) => {
-    const nextMessage = messages[i + 1];
-
-    // if there's no message afterwards, it's definitely the last of a group
-    if (!nextMessage) {
-        return true;
-    }
-
-    // if the author of the next message is different from current one's, then yes, this message is last of its group
-    return nextMessage.author !== message.author;
-};
+const MESSAGES_SPINNER_BOX_HEIGHT = 60;
 
 const isFirstOfDateGroup = (message: Message, i: number, messages: Message[]) => {
-    const prevMessage = messages[i - 1];
+    const currentMessageDate = message.dateCreated.toDateString();
+    const previousMessageDate = messages[i - 1].dateCreated.toDateString();
+    return currentMessageDate !== previousMessageDate;
+};
 
-    // if the previous message has a date older than the current message, this message is the first for this date
-    return getDaysOld(prevMessage.dateCreated) > getDaysOld(message.dateCreated);
+const renderChatStarted = () => {
+    return <MessageListSeparator separatorType="chatStarted" />;
 };
 
 export const MessageList = () => {
@@ -52,12 +37,10 @@ export const MessageList = () => {
     }));
     const dispatch = useDispatch();
     const messageListRef = useRef<HTMLDivElement>(null);
+    const [focusIndex, setFocusIndex] = useState(-1);
+    const [hasLoadedAllMessages, setHasLoadedAllMessages] = useState(false);
     const isLoadingMessages = useRef(false);
-    const oldMessagesLength = useRef((messages || []).length);
-    const [hasLoadedAllMessages, setHasLoadedAllMessages] = useState(true);
-    const [focusIndex, setFocusIndex] = useState(
-        messages && messages.length ? messages[messages?.length - 1].index : -1
-    );
+    const oldMessagesLength = useRef(0);
     const [shouldFocusLatest, setShouldFocusLatest] = useState(false);
 
     const updateFocus = (newFocus: number) => {
@@ -160,69 +143,36 @@ export const MessageList = () => {
         return null;
     };
 
-    const renderChatStarted = () =>
-        hasLoadedAllMessages ? (
-            <>
-                <Box {...conversationEventContainerStyles}>
-                    <Text as="h3" {...conversationEventTitleStyles} data-test="chat-started">
-                        Chat started
-                    </Text>
-                    <Text as="p" {...conversationEventDateStyles}>
-                        {conversation?.dateCreated.toLocaleString()}
-                    </Text>
-                </Box>
-            </>
-        ) : null;
-
     const renderChatItems = () => {
         if (!messages) {
             return null;
         }
 
-        /*
-         * We use a copy of the messages array where the first message is a placeholder for the loading spinner.
-         * By assigning the loading spinner to the same index and key as the previous message,
-         * we avoid a snappy scroll position change when loading spinner disappears.
-         */
-        const spinnerIndex = (messages[0]?.index || 0) - 1;
-        const messagesWithSpinner = [
-            {
-                index: spinnerIndex
-            } as Message,
-            ...messages
-        ];
-
-        return messagesWithSpinner.map((message: Message, i: number) => {
-            // First message in array represents the loading spinner
-            if (message.index === spinnerIndex) {
-                // Only render loading spinner if there are remaining messages to load
-                return hasLoadedAllMessages ? null : (
-                    <Box {...spinnerContainerStyles} key={message.index}>
-                        <Spinner color="colorTextWeak" decorative={false} title="Loading" />
-                    </Box>
-                );
-            }
-            // Discount loading spinner from indices
-            i -= 1;
+        return messages.map((message: Message, i: number) => {
+            const belongsToCurrentUser = message.author === conversationsClient?.user.identity;
+            const isLast = i === messages.length - 1;
+            const isLastOfUserGroup =
+                i === messages.length - 1 ||
+                messages[i + 1].author !== message.author ||
+                isFirstOfDateGroup(messages[i + 1], i + 1, messages);
 
             return (
-                <Box data-test="all-message-bubbles" key={message.index}>
+                <div key={message.sid}>
                     {renderSeparatorIfApplicable(message, i)}
                     <MessageBubble
                         message={message}
-                        isLast={i === messages.length - 1}
-                        isLastOfUserGroup={isLastOfUserGroup(message, i, messages)}
-                        focusable={message.index === focusIndex}
+                        isLast={isLast}
+                        isLastOfUserGroup={isLastOfUserGroup}
+                        focusable={focusIndex === message.index}
                         updateFocus={updateFocus}
                     />
-                </Box>
+                </div>
             );
         });
     };
 
     const handleFocus = () => {
-        // Hand over focus to message bubbles once there is at least one
-        if (messages && messages.length && focusIndex < 0) {
+        if (messages && messages.length > 0) {
             setFocusIndex(messages[messages.length - 1].index);
         }
     };
@@ -244,7 +194,7 @@ export const MessageList = () => {
                         ?.filter((p) => p.isTyping && p.identity !== conversationsClient?.user.identity)
                         .map((p) => (
                             <Text {...participantTypingStyles} as="p" key={p.identity}>
-                                {users?.find((u) => u.identity === p.identity)?.friendlyName} is typing...
+                                {getFirstName(users?.find((u) => u.identity === p.identity)?.friendlyName)} is typing...
                             </Text>
                         ))}
                 </Box>
@@ -252,3 +202,26 @@ export const MessageList = () => {
         </Box>
     );
 };
+
+// Throttle function to limit the frequency of scroll event handling
+function throttle<T extends (...args: any[]) => any>(func: T, delay: number): T {
+    let timeoutId: NodeJS.Timeout | null = null;
+    let lastExecTime = 0;
+    
+    return ((...args: any[]) => {
+        const currentTime = Date.now();
+        
+        if (currentTime - lastExecTime > delay) {
+            func(...args);
+            lastExecTime = currentTime;
+        } else {
+            if (timeoutId) {
+                clearTimeout(timeoutId);
+            }
+            timeoutId = setTimeout(() => {
+                func(...args);
+                lastExecTime = Date.now();
+            }, delay - (currentTime - lastExecTime));
+        }
+    }) as T;
+}
diff --git a/src/components/__tests__/Header.test.tsx b/src/components/__tests__/Header.test.tsx
index 16712baf..88e2181a 100644
--- a/src/components/__tests__/Header.test.tsx
+++ b/src/components/__tests__/Header.test.tsx
@@ -20,6 +20,6 @@ describe("Header", () => {
     it("renders header with default text when no custom title provided", () => {
         const { queryByText } = render(<Header />);
 
-        expect(queryByText("Live Chat")).toBeInTheDocument();
+        expect(queryByText("AnyVan Chat")).toBeInTheDocument();
     });
 });
diff --git a/src/components/__tests__/PreEngagementFormPhase.test.tsx b/src/components/__tests__/PreEngagementFormPhase.test.tsx
index 090811ef..2e81fe51 100644
--- a/src/components/__tests__/PreEngagementFormPhase.test.tsx
+++ b/src/components/__tests__/PreEngagementFormPhase.test.tsx
@@ -27,14 +27,11 @@ jest.mock("../NotificationBar", () => ({
 const withStore = (Component: React.ReactElement) => <Provider store={store}>{Component}</Provider>;
 
 describe("Pre Engagement Form Phase", () => {
-    const namePlaceholderText = "Please enter your name";
     const emailPlaceholderText = "Please enter your email address";
     const queryPlaceholderText = "Ask a question";
-    const nameLabelText = "Name";
     const emailLabelText = "Email address";
-    const queryLabelText = "How can we help you?";
+    const queryLabelText = "How can we assist today?";
 
-    const name = "John";
     const email = "email@email.email";
     const query = "Why is a potato?";
 
@@ -62,17 +59,13 @@ describe("Pre Engagement Form Phase", () => {
 
     it("renders the pre-engagement form inputs and labels", () => {
         const { getByPlaceholderText, getByText } = render(withStore(<PreEngagementFormPhase />));
-        const nameInput = getByPlaceholderText(namePlaceholderText);
         const emailInput = getByPlaceholderText(emailPlaceholderText);
         const queryInput = getByPlaceholderText(queryPlaceholderText);
-        const nameLabel = getByText(nameLabelText);
         const emailLabel = getByText(emailLabelText);
         const queryLabel = getByText(queryLabelText);
 
-        expect(nameInput).toBeInTheDocument();
         expect(emailInput).toBeInTheDocument();
         expect(queryInput).toBeInTheDocument();
-        expect(nameLabel).toBeInTheDocument();
         expect(emailLabel).toBeInTheDocument();
         expect(queryLabel).toBeInTheDocument();
     });
@@ -94,15 +87,6 @@ describe("Pre Engagement Form Phase", () => {
         });
     });
 
-    it("renders name input value", () => {
-        const { getByPlaceholderText } = render(withStore(<PreEngagementFormPhase />));
-
-        const nameInput = getByPlaceholderText(namePlaceholderText);
-        fireEvent.change(nameInput, { target: { value: name } });
-
-        expect(nameInput).toHaveValue(name);
-    });
-
     it("renders email input value", () => {
         const { getByPlaceholderText } = render(withStore(<PreEngagementFormPhase />));
 
@@ -126,16 +110,14 @@ describe("Pre Engagement Form Phase", () => {
 
         const { container, getByPlaceholderText } = render(withStore(<PreEngagementFormPhase />));
         const formBox = container.querySelector("form") as HTMLFormElement;
-        const nameInput = getByPlaceholderText(namePlaceholderText);
         const emailInput = getByPlaceholderText(emailPlaceholderText);
         const queryInput = getByPlaceholderText(queryPlaceholderText);
 
-        fireEvent.change(nameInput, { target: { value: name } });
         fireEvent.change(emailInput, { target: { value: email } });
         fireEvent.change(queryInput, { target: { value: query } });
         fireEvent.submit(formBox);
 
-        expect(fetchAndStoreNewSessionSpy).toHaveBeenCalledWith({ formData: { friendlyName: name, query, email } });
+        expect(fetchAndStoreNewSessionSpy).toHaveBeenCalledWith({ formData: { friendlyName: "", query, email } });
     });
 
     it("submits form on enter within textarea", () => {
diff --git a/src/components/__tests__/Transcript.test.tsx b/src/components/__tests__/Transcript.test.tsx
index 1c9caa4f..a2fabf35 100644
--- a/src/components/__tests__/Transcript.test.tsx
+++ b/src/components/__tests__/Transcript.test.tsx
@@ -88,7 +88,7 @@ describe("Transcript", () => {
 
     it("generates transcript for download", () => {
         expect(generateDownloadTranscript(customerName, agentNames, transcriptData)).toEqual(
-            `Conversation with ${customerName} and ${agentNames[0]} and ${agentNames[1]}\n\nDate: 17 December 2022\nDuration: 3 days 22 hours 53 minutes 50 seconds \n\n* 04:30  ${customerName}: hi\n\n+ 04:30  Concierge: hi\n\n+ 03:24  ${agentNames[0]}: hi\n\n+ 03:24  ${agentNames[1]}: hi\n\n`
+            `Conversation with ${customerName} and ${agentNames[0]} and ${agentNames[1]}\n\nDate: December 17, 2022\nDuration: 3 days 22 hours 53 minutes 50 seconds \n\n* 04:30  ${customerName}: hi\n\n+ 04:30  Concierge: hi\n\n+ 03:24  ${agentNames[0]}: hi\n\n+ 03:24  ${agentNames[1]}: hi\n\n`
         );
     });
 
@@ -124,13 +124,13 @@ describe("Transcript", () => {
             }
         ];
         expect(generateDownloadTranscript(customerName, agentNames, transcriptMediaData)).toEqual(
-            `Conversation with ${customerName} and ${agentNames[0]} and ${agentNames[1]}\n\nDate: 17 December 2022\nDuration: 3 days 22 hours 53 minutes 50 seconds \n\n* 04:30  ${customerName}: hi (** Attached file test.txt **)\n\n+ 04:30  Concierge: hi (** Attached file test-1.txt **)\n\n+ 03:24  ${agentNames[0]}: hi (** Attached file blah.jpg **) (** Attached file foo.png **) (** Attached file booo.png **)\n\n+ 03:24  ${agentNames[1]}: hi (** Attached file blah.png **) (** Attached file blah-1.png **)\n\n`
+            `Conversation with ${customerName} and ${agentNames[0]} and ${agentNames[1]}\n\nDate: December 17, 2022\nDuration: 3 days 22 hours 53 minutes 50 seconds \n\n* 04:30  ${customerName}: hi (** Attached file test.txt **)\n\n+ 04:30  Concierge: hi (** Attached file test-1.txt **)\n\n+ 03:24  ${agentNames[0]}: hi (** Attached file blah.jpg **) (** Attached file foo.png **) (** Attached file booo.png **)\n\n+ 03:24  ${agentNames[1]}: hi (** Attached file blah.png **) (** Attached file blah-1.png **)\n\n`
         );
     });
 
     it("generates transcript for email", () => {
         expect(generateEmailTranscript(customerName, agentNames, transcriptData)).toEqual(
-            `Chat with <strong>${customerName}</strong> and <strong>${agentNames[0]}</strong> and <strong>${agentNames[1]}</strong><br><br><strong>Date:</strong> 17 December 2022<br><strong>Duration:</strong> 3 days 22 hours 53 minutes 50 seconds <br><br>04:30 <i>${customerName}</i>: hi<br><br>04:30 <i>Concierge</i>: hi<br><br>03:24 <i>${agentNames[0]}</i>: hi<br><br>03:24 <i>${agentNames[1]}</i>: hi<br><br>`
+            `Chat with <strong>${customerName}</strong> and <strong>${agentNames[0]}</strong> and <strong>${agentNames[1]}</strong><br><br><strong>Date:</strong> December 17, 2022<br><strong>Duration:</strong> 3 days 22 hours 53 minutes 50 seconds <br><br>04:30 <i>${customerName}</i>: hi<br><br>04:30 <i>Concierge</i>: hi<br><br>03:24 <i>${agentNames[0]}</i>: hi<br><br>03:24 <i>${agentNames[1]}</i>: hi<br><br>`
         );
     });
 
@@ -166,7 +166,7 @@ describe("Transcript", () => {
             }
         ];
         expect(generateEmailTranscript(customerName, agentNames, transcriptMediaData)).toEqual(
-            `Chat with <strong>${customerName}</strong> and <strong>${agentNames[0]}</strong> and <strong>${agentNames[1]}</strong><br><br><strong>Date:</strong> 17 December 2022<br><strong>Duration:</strong> 3 days 22 hours 53 minutes 50 seconds <br><br>04:30 <i>${customerName}</i>: hi (** Attached file <i>test.txt</i> **)<br><br>04:30 <i>Concierge</i>: hi (** Attached file <i>test-1.txt</i> **)<br><br>03:24 <i>${agentNames[0]}</i>: hi (** Attached file <i>blah.jpg</i> **) (** Attached file <i>foo.png</i> **) (** Attached file <i>booo.png</i> **)<br><br>03:24 <i>${agentNames[1]}</i>: hi (** Attached file <i>blah.png</i> **) (** Attached file <i>blah-1.png</i> **)<br><br>`
+            `Chat with <strong>${customerName}</strong> and <strong>${agentNames[0]}</strong> and <strong>${agentNames[1]}</strong><br><br><strong>Date:</strong> December 17, 2022<br><strong>Duration:</strong> 3 days 22 hours 53 minutes 50 seconds <br><br>04:30 <i>${customerName}</i>: hi (** Attached file <i>test.txt</i> **)<br><br>04:30 <i>Concierge</i>: hi (** Attached file <i>test-1.txt</i> **)<br><br>03:24 <i>${agentNames[0]}</i>: hi (** Attached file <i>blah.jpg</i> **) (** Attached file <i>foo.png</i> **) (** Attached file <i>booo.png</i> **)<br><br>03:24 <i>${agentNames[1]}</i>: hi (** Attached file <i>blah.png</i> **) (** Attached file <i>blah-1.png</i> **)<br><br>`
         );
     });
 
diff --git a/src/utils/getFirstName.ts b/src/utils/getFirstName.ts
new file mode 100644
index 00000000..11175914
--- /dev/null
+++ b/src/utils/getFirstName.ts
@@ -0,0 +1,14 @@
+/**
+ * Extracts the first name from a full name string
+ * @param fullName - The full name string
+ * @returns The first name, or the original string if no space is found
+ */
+export const getFirstName = (fullName: string | undefined): string => {
+    if (!fullName) {
+        return "";
+    }
+    
+    // Split by space and take the first part
+    const nameParts = fullName.trim().split(/\s+/);
+    return nameParts[0] || fullName;
+};
diff --git a/terraform/README.md b/terraform/README.md
new file mode 100644
index 00000000..e9ba55f2
--- /dev/null
+++ b/terraform/README.md
@@ -0,0 +1,124 @@
+# Twilio Webchat Widget - Terraform Deployment
+
+This directory contains the Terraform configuration for deploying the Twilio Webchat Widget to AWS ECS.
+
+## Overview
+
+The deployment consists of:
+- **ECS Fargate Service**: Runs the webchat widget container
+- **Application Load Balancer**: Provides HTTP/HTTPS access
+- **ECR Repository**: Stores Docker images
+- **Secrets Manager**: Stores Twilio credentials
+- **Datadog Monitoring**: Error logs, CPU, and memory monitoring
+
+## Prerequisites
+
+1. AWS CLI configured with appropriate credentials
+2. Terraform installed (version ~>1.9.5)
+3. Docker installed for building images
+4. Access to the Anyvan AWS accounts
+
+## Environment Configuration
+
+The deployment supports three environments:
+
+### Production
+```bash
+terraform workspace select production
+terraform plan -var-file=env/production.tfvars
+terraform apply -var-file=env/production.tfvars
+```
+
+### Staging
+```bash
+terraform workspace select staging
+terraform plan -var-file=env/staging.tfvars
+terraform apply -var-file=env/staging.tfvars
+```
+
+### Testing (PR environments)
+```bash
+terraform workspace select testing-<jira-ticket>
+terraform plan -var-file=env/testing.tfvars -var="jira_ticket_number=<jira-ticket>"
+terraform apply -var-file=env/testing.tfvars -var="jira_ticket_number=<jira-ticket>"
+```
+
+## Deployment Process
+
+1. **Build and Push Docker Image**:
+   ```bash
+   # Set environment variables
+   export ENVIRONMENT=production
+   export ECR_REPOSITORY_NAME=twilio-webchat-widget/prod
+   export GIT_SHA=$(git rev-parse HEAD)
+   
+   # Run deployment script
+   node scripts/deploy.js
+   ```
+
+2. **Deploy Infrastructure**:
+   ```bash
+   cd terraform
+   terraform init
+   terraform plan -var-file=env/production.tfvars -var="git_sha=$GIT_SHA"
+   terraform apply -var-file=env/production.tfvars -var="git_sha=$GIT_SHA"
+   ```
+
+## Configuration
+
+### Environment Variables
+
+The following environment variables can be set in the `.tfvars` files:
+
+- `region`: AWS region (default: eu-west-1)
+- `env`: Environment name (production/staging/testing)
+- `profile`: AWS profile to use
+- `ecr_repository_name`: ECR repository name
+- `vpc_environment`: VPC environment to deploy into
+- `internal_fqdn`: Internal FQDN for the service
+- `external_fqdn`: External FQDN for the service
+- `fargate_task_cpu`: CPU allocation for the task
+- `fargate_task_memory`: Memory allocation for the task
+
+### Health Checks
+
+The service uses the `/initWebchat` endpoint for health checks, which is the main API endpoint for initializing webchat sessions.
+
+### Monitoring
+
+The deployment includes Datadog monitoring for:
+- Error logs (threshold: 2 errors in 15 minutes)
+- CPU usage (threshold: 90%)
+- Memory usage (threshold: 90%)
+
+## Architecture
+
+```
+Internet → ALB → ECS Fargate → Webchat Widget Container (Port 3002)
+                                    ↓
+                            Secrets Manager (Twilio credentials)
+```
+
+## Troubleshooting
+
+### Common Issues
+
+1. **Health Check Failures**: Ensure the `/initWebchat` endpoint is responding correctly
+2. **Container Startup Issues**: Check container logs in CloudWatch
+3. **Secrets Access**: Verify the ECS task has access to the Twilio secrets in Secrets Manager
+
+### Logs
+
+- **Application Logs**: CloudWatch Logs group named after the service
+- **Datadog Logs**: Available in Datadog with service name `twilio-webchat-widget`
+
+### Scaling
+
+The service can be scaled by modifying the `desired_count` parameter in the ECS service configuration.
+
+## Security
+
+- The service runs in a private subnet
+- Access is controlled via ALB security groups
+- Twilio credentials are stored in AWS Secrets Manager
+- The container runs as a non-root user
diff --git a/terraform/datadog_dashboard.tf b/terraform/datadog_dashboard.tf
new file mode 100644
index 00000000..1a42b459
--- /dev/null
+++ b/terraform/datadog_dashboard.tf
@@ -0,0 +1,13 @@
+resource "datadog_dashboard_json" "dashboard_json" {
+  dashboard = <<EOF
+{
+    "title": "Twilio Webchat Widget - ${local.environment_name}",
+    "description": "Twilio Webchat Widget Datadog dashboard",
+    "widgets": [],
+    "template_variables": [],
+    "layout_type": "ordered",
+    "notify_list": [],
+    "reflow_type": "fixed"
+}
+    EOF
+}
\ No newline at end of file
diff --git a/terraform/datadog_monitor.tf b/terraform/datadog_monitor.tf
new file mode 100644
index 00000000..b3223df7
--- /dev/null
+++ b/terraform/datadog_monitor.tf
@@ -0,0 +1,63 @@
+locals {
+  team                  = var.squad
+  critical_threshold    = 2
+  notification_channels = format("%s%s", (var.env == "production" ? "@slack-alerting-centralised " : ""), (local.is_pr_env) ? "@lions-alerts-test" : "@lions_alerts")
+  datadog_logs_url      = "https://app.datadoghq.eu/logs?query=service%3A${var.webchat_widget_name}%20env%3A${local.environment_name}%20&cols=host%2Cservice&index=%2A&messageDisplay=inline&refresh_mode=sliding&stream_sort=desc&viz=stream&live=false"
+}
+
+module "error_logs_monitor" {
+  source  = "terraform-registry.anyvan.com/anyvan/datadog_monitor/aws"
+  version = "~> 1.0"
+
+  name               = "Anyvan ${var.webchat_widget_name} Exceptions - ${local.environment_name}"
+  message            = "An exception occurred in ${var.webchat_widget_name} logs ${local.notification_channels}${var.env == "production" ? " | @${local.team}-engineers" : ""} \n\n Log message: {{ log.message }} \n\n For more details please check latests logs: \n [Datadog](${local.datadog_logs_url})"
+  type               = "log alert"
+  query              = "logs(\"service:${var.webchat_widget_name} env:${local.environment_name} status:(error)\").index(\"*\").rollup(\"count\").last(\"15m\") > ${local.critical_threshold}"
+  critical_threshold = local.critical_threshold
+  enable_logs_sample = true
+  tags = [
+    "env:${var.env}",
+    "team:${local.team}",
+    "service:${var.webchat_widget_name}"
+  ]
+  priority = 3
+}
+
+module "cpu_monitor" {
+  source  = "terraform-registry.anyvan.com/anyvan/datadog_monitor/aws"
+  version = "~> 1.0"
+
+  name               = "Anyvan ${var.webchat_widget_name} CPU usage monitor - ${local.environment_name}"
+  message            = "CPU usage of ${var.webchat_widget_name} ${local.notification_channels}${var.env == "production" ? " | @${local.team}-engineers" : ""}"
+  type               = "query alert"
+  query              = "avg(last_5m):avg:aws.ecs.service.cpuutilization{servicename:${module.app.service_name}} > 90"
+  critical_threshold = 90
+  notify_no_data     = true
+  no_data_timeframe  = 20 // There is a 15+ mins delay in receiving ECS metrices on Datadog
+  tags = [
+    "env:${var.env}",
+    "team:${local.team}",
+    "service:${var.webchat_widget_name}"
+  ]
+  priority = 5
+}
+
+
+module "memory_monitor" {
+  source  = "terraform-registry.anyvan.com/anyvan/datadog_monitor/aws"
+  version = "~> 1.0"
+
+  name               = "Anyvan ${var.webchat_widget_name} Memory usage monitor - ${local.environment_name}"
+  message            = "Memory usage of ${var.webchat_widget_name} ${local.notification_channels}${var.env == "production" ? " | @${local.team}-engineers" : ""}"
+  type               = "query alert"
+  query              = "avg(last_5m):avg:aws.ecs.service.memory_utilization{servicename:${module.app.service_name}} > 90"
+  critical_threshold = 90
+  notify_no_data     = true
+  no_data_timeframe  = 20 // There is a 15+ mins delay in receiving ECS metrices on Datadog
+  tags = [
+    "env:${var.env}",
+    "team:${local.team}",
+    "service:${var.webchat_widget_name}"
+  ]
+  priority = 5
+}
diff --git a/terraform/datadog_service_definition.tf b/terraform/datadog_service_definition.tf
new file mode 100644
index 00000000..d1b6c84f
--- /dev/null
+++ b/terraform/datadog_service_definition.tf
@@ -0,0 +1,20 @@
+module "datadog_service_definition_yaml" {
+  source  = "terraform-registry.anyvan.com/anyvan/datadog_service_definition_yaml/aws"
+  version = "~> 1.0"
+
+  service_definition_yaml = <<EOF
+schema-version: v2
+dd-service: ${var.webchat_widget_name}
+team: ${var.squad}
+contacts:
+  - name: Slack
+    type: slack
+    contact: https://anyvan.slack.com/archives/C03UNTP33RT
+repos:
+  - name: Webchat Widget source code
+    provider: github
+    url: https://github.com/anyvan/twilio-widgets
+tags:
+  - squad:${var.squad}
+EOF
+}
\ No newline at end of file
diff --git a/terraform/ecr_repository.tf b/terraform/ecr_repository.tf
new file mode 100644
index 00000000..fa10748c
--- /dev/null
+++ b/terraform/ecr_repository.tf
@@ -0,0 +1,74 @@
+locals {
+  ecr_keep_last_images_count = var.env == "production" ? 40 : 200
+}
+
+resource "aws_ecr_repository" "twilio_flex" {
+  count    = var.create_ecr_repository ? 1 : 0
+  name     = var.ecr_repository_name
+  provider = aws.horizontal
+
+  image_tag_mutability = "MUTABLE"
+
+  image_scanning_configuration {
+    scan_on_push = true
+  }
+
+  tags = tomap({ "Name" = var.ecr_repository_name })
+}
+
+resource "aws_ecr_repository_policy" "twilio_flex" {
+  policy     = data.aws_iam_policy_document.allows_other_accounts_to_retrieve.json
+  repository = aws_ecr_repository.twilio_flex[0].name
+  provider   = aws.horizontal
+}
+
+data "aws_iam_policy_document" "allows_other_accounts_to_retrieve" {
+  statement {
+    sid    = "CrossAccountRetrievalPermission"
+    effect = "Allow"
+    actions = [
+      "ecr:BatchCheckLayerAvailability",
+      "ecr:BatchGetImage",
+      "ecr:GetDownloadUrlForLayer"
+    ]
+    principals {
+      type = "AWS"
+      identifiers = [
+        for account_id in data.terraform_remote_state.accounts.outputs.aws_accounts_ids : "arn:aws:iam::${account_id}:root"
+      ]
+    }
+  }
+
+  statement {
+    sid    = "LambdaECRCrossAccountRerievalPermission"
+    effect = "Allow"
+    actions = [
+      "ecr:BatchCheckLayerAvailability",
+      "ecr:BatchGetImage",
+      "ecr:GetDownloadUrlForLayer"
+    ]
+    principals {
+      type = "Service"
+      identifiers = [
+        "lambda.amazonaws.com"
+      ]
+    }
+    condition {
+      test     = "StringLike"
+      variable = "aws:sourceArn"
+      values = [
+        for account_id in data.terraform_remote_state.accounts.outputs.aws_accounts_ids : "arn:aws:lambda:${var.region}:${account_id}:function:*"
+      ]
+    }
+  }
+}
+
+resource "aws_ecr_lifecycle_policy" "twilio_flex" {
+  repository = aws_ecr_repository.twilio_flex[0].name
+
+  policy = templatefile("${path.module}/files/ecr_retention_policies.json", {
+    countLastImages = local.ecr_keep_last_images_count
+  })
+
+  provider = aws.horizontal
+}
diff --git a/terraform/env/production.tfvars b/terraform/env/production.tfvars
new file mode 100644
index 00000000..50b58074
--- /dev/null
+++ b/terraform/env/production.tfvars
@@ -0,0 +1,13 @@
+region              = "eu-west-1"
+env                 = "production"
+prefix              = "prod"
+profile             = "production"
+ecr_repository_name = "twilio-webchat-widget/prod"
+vpc_environment     = "production"
+notify              = ["@slack-alerting-centralised"]
+internal_fqdn       = "webchat-widget-internal.anyvan.com"
+external_fqdn       = "webchat-widget.anyvan.com"
+fargate_task_cpu    = 512
+fargate_task_memory = 1024
+
+
diff --git a/terraform/env/staging.tfvars b/terraform/env/staging.tfvars
new file mode 100644
index 00000000..7faf936f
--- /dev/null
+++ b/terraform/env/staging.tfvars
@@ -0,0 +1,12 @@
+region                = "eu-west-1"
+env                   = "staging"
+prefix                = "stage"
+profile               = "test1"
+ecr_repository_name   = "twilio-webchat-widget/stage"
+vpc_environment       = "staging"
+notify                = ["@slack-alerting-centralised"]
+internal_fqdn         = "stage-webchat-widget-internal.anyvan.com"
+external_fqdn         = "webchat-widget-stg.anyvan.com"
+fargate_task_cpu      = 256
+fargate_task_memory   = 512
+
diff --git a/terraform/env/testing.tfvars b/terraform/env/testing.tfvars
new file mode 100644
index 00000000..fbe9f6d1
--- /dev/null
+++ b/terraform/env/testing.tfvars
@@ -0,0 +1,13 @@
+region                = "eu-west-1"
+env                   = "testing"
+prefix                = "test"
+profile               = "test1"
+ecr_repository_name   = "twilio-webchat-widget/testing"
+vpc_environment       = "staging"
+notify                = ["@slack-alerting-centralised"]
+internal_fqdn         = "test-webchat-widget-internal-<jira-ticket-number>.anyvan.com"
+external_fqdn         = "webchat-widget-test-<jira-ticket-number>.anyvan.com"
+fargate_task_cpu      = 256
+fargate_task_memory   = 512
+
+
diff --git a/terraform/files/ecr_retention_policies.json b/terraform/files/ecr_retention_policies.json
new file mode 100644
index 00000000..7e536f30
--- /dev/null
+++ b/terraform/files/ecr_retention_policies.json
@@ -0,0 +1,29 @@
+{
+  "rules": [
+    {
+      "rulePriority": 1,
+      "description": "Remove untagged images",
+      "selection": {
+        "tagStatus": "untagged",
+        "countType": "imageCountMoreThan",
+        "countNumber": 1
+      },
+      "action": {
+        "type": "expire"
+      }
+    },
+    {
+      "rulePriority": 2,
+      "description": "Remove images older than last ${countLastImages} versions",
+      "selection": {
+        "tagStatus": "tagged",
+        "tagPrefixList": ["commit-"],
+        "countType": "imageCountMoreThan",
+        "countNumber": "${countLastImages}"
+      },
+      "action": {
+        "type": "expire"
+      }
+    }
+  ]
+}
diff --git a/terraform/locals.tf b/terraform/locals.tf
new file mode 100644
index 00000000..4e6de6cf
--- /dev/null
+++ b/terraform/locals.tf
@@ -0,0 +1,24 @@
+locals {
+  default_tags = {
+    env               = var.env
+    terraform_version = var.terraform_version
+    squad             = "Lions"
+    project           = "twilio-webchat-widget"
+    service           = "webchat-widget"
+    version           = var.commit_hash
+  }
+
+  is_pr_env     = var.env == "testing"
+  is_production = var.env == "production"
+
+
+  environment_name = "${var.env}${var.jira_ticket_number}"
+  suffix_map = {
+    production = "",
+    staging    = "-stg"
+    testing    = "-dev${var.jira_ticket_number}"
+  }
+
+  internal_fqdn = var.env == "testing" ? replace(var.internal_fqdn, "<jira-ticket-number>", var.jira_ticket_number) : var.internal_fqdn
+  external_fqdn = var.env == "testing" ? replace(var.external_fqdn, "<jira-ticket-number>", var.jira_ticket_number) : var.external_fqdn
+}
diff --git a/terraform/providers.tf b/terraform/providers.tf
new file mode 100644
index 00000000..88235fa3
--- /dev/null
+++ b/terraform/providers.tf
@@ -0,0 +1,89 @@
+terraform {
+  required_version = "~>1.9.5" # we pin the Terraform version to guarantee stability
+  required_providers {
+    aws = {
+      source  = "hashicorp/aws"
+      version = ">=3.68.0" # we pin the AWS provider version to guarantee stability
+    }
+    datadog = {
+      source = "DataDog/datadog"
+    }
+  }
+
+  backend "s3" {
+    bucket         = "anyvan-terraform-state-file-aws-accounts"      # name of the bucket
+    key            = "twilio-webchat-widget.tfstate"                 # name of the state file for this particular terraform stack
+    region         = "eu-west-1"                                     # this is the region where the bucket is created. It can be in a different region to where you deploy your resources.
+    dynamodb_table = "anyvan-terraform-state-file-lock-aws-accounts" # table where the lock is kept
+  }
+}
+
+provider "aws" {
+  region  = var.region
+  profile = var.profile
+
+  default_tags {
+    tags = local.default_tags
+  }
+}
+
+provider "aws" {
+  region  = var.region
+  profile = "production"
+  alias   = "production"
+
+  default_tags {
+    tags = local.default_tags
+  }
+}
+
+provider "aws" {
+  region  = var.region
+  profile = "horizontal"
+  alias   = "horizontal"
+
+  default_tags {
+    tags = local.default_tags
+  }
+}
+
+provider "datadog" {
+  // This then require environmental variables DD_API_KEY, DD_APP_KEY and DD_HOST be set
+  // These are all set in the circleci anyvan context.
+  validate = false
+}
+
+data "terraform_remote_state" "top" {
+  backend   = "s3"
+  workspace = "prod-anyvan_com"
+
+  config = {
+    bucket         = "anyvan-terraform-state-file-aws-accounts"
+    key            = "iac-terraform-top.tfstate"
+    region         = "eu-west-1"
+    dynamodb_table = "anyvan-terraform-state-file-lock-aws-accounts"
+  }
+}
+
+data "terraform_remote_state" "accounts" {
+  backend = "s3"
+
+  config = {
+    bucket         = "anyvan-terraform-state-file-aws-accounts"
+    key            = "iac-terraform-accounts/iac-terraform-accounts.tfstate"
+    region         = "eu-west-1"
+    dynamodb_table = "anyvan-terraform-state-file-lock-aws-accounts"
+  }
+}
+
+data "terraform_remote_state" "network" {
+  backend   = "s3"
+  workspace = "live-${var.vpc_environment}_vpc"
+
+  config = {
+    bucket         = "anyvan-terraform-state-file-aws-accounts"
+    key            = "iac-terraform-network.tfstate"
+    region         = "eu-west-1"
+    dynamodb_table = "anyvan-terraform-state-file-lock-aws-accounts"
+  }
+}
\ No newline at end of file
diff --git a/terraform/secrets_manager.tf b/terraform/secrets_manager.tf
new file mode 100644
index 00000000..1203f789
--- /dev/null
+++ b/terraform/secrets_manager.tf
@@ -0,0 +1,5 @@
+data "aws_secretsmanager_secret" "twilio-secrets" {
+  name = local.is_production ? "prod-twilio-flex-secret" : "stage-twilio-flex-secret"
+}
+
+
diff --git a/terraform/variables.tf b/terraform/variables.tf
new file mode 100644
index 00000000..5093b3a0
--- /dev/null
+++ b/terraform/variables.tf
@@ -0,0 +1,98 @@
+variable "region" {
+  type        = string
+  description = "Default region for AWS"
+}
+variable "env" {
+  type        = string
+  description = "Default environment for AWS"
+}
+variable "profile" {
+  type        = string
+  description = "Default profile for AWS"
+}
+variable "ecr_registry_id" {
+  type    = string
+  default = "331151898531"
+}
+variable "ecr_repository_name" {
+  type = string
+}
+variable "create_ecr_repository" {
+  type    = bool
+  default = true
+}
+
+variable "vpc_environment" {
+  type        = string
+  description = "Which of the shared VPCs to deploy into."
+
+  validation {
+    condition     = contains(["development", "staging", "production"], var.vpc_environment)
+    error_message = "Valid values for vpc_environment are: development, staging, production."
+  }
+}
+variable "terraform_version" {
+  type        = string
+  description = "Version of terraform to use"
+}
+variable "commit_hash" {
+  type        = string
+  description = "Github commit hash"
+}
+variable "webchat_widget_name" {
+  type        = string
+  description = "The name of the webchat widget"
+  default     = "twilio-webchat-widget"
+}
+
+variable "jira_ticket_number" {
+  type        = string
+  default     = ""
+  description = "Jira ticket number that we are using to build a stack in Staging for a particular PR"
+}
+
+variable "git_sha" {
+  type        = string
+  default     = ""
+  description = "Git SHA for the current commit"
+}
+
+variable "application_container_image_url" {
+  type        = string
+  description = "URL of the application container image in ECR"
+}
+
+variable "aws_region" {
+  type    = string
+  default = "eu-west-1"
+}
+
+variable "internal_fqdn" {
+  type        = string
+  default     = ""
+  description = "Internal FQDN (private endpoint)"
+}
+
+variable "external_fqdn" {
+  type        = string
+  description = "External FQDN (public endpoint)"
+}
+
+variable "fargate_task_cpu" {
+  type        = number
+  description = "The size of CPU (in Amazon units) to give to the Fargate task. By default, set using environmental variables"
+}
+
+variable "fargate_task_memory" {
+  type        = number
+  description = "The amount of memory (in MB) to give to the Fargate task. By default, set using environmental variables"
+}
+variable "squad" {
+  type    = string
+  default = "lions"
+}
+variable "slack_channel_web_hook" {
+  type      = string
+  default   = ""
+  sensitive = true
+}
diff --git a/terraform/video-app.tf b/terraform/video-app.tf
new file mode 100644
index 00000000..6f3947b0
--- /dev/null
+++ b/terraform/video-app.tf
@@ -0,0 +1,52 @@
+module "app" {
+  source  = "terraform-registry.anyvan.com/anyvan/ecs_project/aws"
+  version = "~>1.6.2"
+
+  app_name                        = var.webchat_widget_name
+  env                             = var.env
+  jira_ticket_number              = var.jira_ticket_number
+  application_container_image_url = var.application_container_image_url
+  commit_hash                     = var.git_sha
+  region                          = var.aws_region
+  profile                         = var.profile
+  internal_fqdn                   = local.internal_fqdn
+
+  cpu    = var.fargate_task_cpu
+  memory = var.fargate_task_memory
+
+  expose_internal = {
+    container_port                    = 3002
+    health_check_path                 = "/initWebchat"
+    health_check_grace_period_seconds = 300
+    listener_port                     = 443
+  }
+
+  expose_external = {
+    container_port                    = 3002
+    health_check_path                 = "/initWebchat"
+    health_check_grace_period_seconds = 240
+    listener_port                     = 443
+  }
+
+
+  task_permissions = {
+    allow_sm = {
+      sm_arns = [
+        data.aws_secretsmanager_secret.twilio-secrets.arn
+      ]
+      key_arns = []
+    }
+    ecs_task_statements = []
+  }
+  env_variables = {}
+
+  env_secrets      = {}
+  enable_appconfig = false
+
+  enable_database = false
+
+  providers = {
+    aws            = aws
+    aws.production = aws.production
+  }
+}
\ No newline at end of file
diff --git a/terraform/webchat-widget.tf b/terraform/webchat-widget.tf
new file mode 100644
index 00000000..6f3947b0
--- /dev/null
+++ b/terraform/webchat-widget.tf
@@ -0,0 +1,52 @@
+module "app" {
+  source  = "terraform-registry.anyvan.com/anyvan/ecs_project/aws"
+  version = "~>1.6.2"
+
+  app_name                        = var.webchat_widget_name
+  env                             = var.env
+  jira_ticket_number              = var.jira_ticket_number
+  application_container_image_url = var.application_container_image_url
+  commit_hash                     = var.git_sha
+  region                          = var.aws_region
+  profile                         = var.profile
+  internal_fqdn                   = local.internal_fqdn
+
+  cpu    = var.fargate_task_cpu
+  memory = var.fargate_task_memory
+
+  expose_internal = {
+    container_port                    = 3002
+    health_check_path                 = "/initWebchat"
+    health_check_grace_period_seconds = 300
+    listener_port                     = 443
+  }
+
+  expose_external = {
+    container_port                    = 3002
+    health_check_path                 = "/initWebchat"
+    health_check_grace_period_seconds = 240
+    listener_port                     = 443
+  }
+
+
+  task_permissions = {
+    allow_sm = {
+      sm_arns = [
+        data.aws_secretsmanager_secret.twilio-secrets.arn
+      ]
+      key_arns = []
+    }
+    ecs_task_statements = []
+  }
+  env_variables = {}
+
+  env_secrets      = {}
+  enable_appconfig = false
+
+  enable_database = false
+
+  providers = {
+    aws            = aws
+    aws.production = aws.production
+  }
+}
\ No newline at end of file

From 610fd20d97eabdfe5c2819d4ef10ac2e993f6373 Mon Sep 17 00:00:00 2001
From: GarethF531 <167188366+GarethF531@users.noreply.github.com>
Date: Mon, 25 Aug 2025 15:58:39 +0200
Subject: [PATCH 03/48] name changes

---
 server/controllers/initWebchatController.js   |   7 +-
 src/components/MessageBubble.tsx              |  10 +-
 src/components/MessageList.tsx                | 142 +++++++++++-------
 src/store/actions/initActions.ts              |   3 +
 .../actions/listeners/messagesListener.ts     |   5 +
 src/utils/generateTranscripts.ts              |  12 +-
 src/utils/getFirstName.test.ts                |  29 ++++
 src/utils/getFirstName.ts                     |  12 +-
 8 files changed, 150 insertions(+), 70 deletions(-)
 create mode 100644 src/utils/getFirstName.test.ts

diff --git a/server/controllers/initWebchatController.js b/server/controllers/initWebchatController.js
index bd00f944..8ba12085 100644
--- a/server/controllers/initWebchatController.js
+++ b/server/controllers/initWebchatController.js
@@ -30,7 +30,7 @@ const createConversationAndTriggerStudioFlow = async (request, customerFriendlyN
     const customerParticipant = await twilioClient.conversations
         .conversations(conversation.sid)
         .participants.create({
-            identity: `customer-${Date.now()}`,
+            identity: customerFriendlyName,
             attributes: JSON.stringify({
                 friendlyName: customerFriendlyName,
                 ...request.body?.formData
@@ -46,6 +46,7 @@ const createConversationAndTriggerStudioFlow = async (request, customerFriendlyN
             body: `New webchat session started by ${customerFriendlyName}`,
             attributes: JSON.stringify({
                 flowTrigger: true,
+                systemMessage: true,
                 customerName: customerFriendlyName,
                 customerEmail: request.body?.formData?.email || '',
                 customerQuery: request.body?.formData?.query || '',
@@ -86,7 +87,7 @@ const sendWelcomeMessage = (conversationSid, customerFriendlyName) => {
     return getTwilioClient()
         .conversations.conversations(conversationSid)
         .messages.create({
-            body: `Welcome ${customerFriendlyName}! An agent will be with you in just a moment.`,
+            body: `Welcome! An agent will be with you in just a moment.`,
             author: "AnyVan"
         })
         .then(() => {
@@ -101,7 +102,7 @@ const initWebchatController = async (request, response) => {
     const useStudioFlow = !!process.env.STUDIO_FLOW_SID;
     logInitialAction(`Initiating webchat with ${useStudioFlow ? 'Studio Flow' : 'TaskRouter'}`);
 
-    const customerFriendlyName = request.body?.formData?.friendlyName || "Customer";
+    const customerFriendlyName = request.body?.formData?.email || "Customer";
 
     let conversationSid;
     let flowExecutionSid;
diff --git a/src/components/MessageBubble.tsx b/src/components/MessageBubble.tsx
index 5ffcb812..614a8191 100644
--- a/src/components/MessageBubble.tsx
+++ b/src/components/MessageBubble.tsx
@@ -11,6 +11,7 @@ import { SuccessIcon } from "@twilio-paste/icons/esm/SuccessIcon";
 import { AppState } from "../store/definitions";
 import { FilePreview } from "./FilePreview";
 import { parseMessageBody } from "../utils/parseMessageBody";
+import { getFirstName } from "../utils/getFirstName";
 import {
     getAvatarContainerStyles,
     getInnerContainerStyles,
@@ -109,7 +110,8 @@ export const MessageBubble = ({
         }
     };
 
-    const author = users?.find((u) => u.identity === message.author)?.friendlyName || message.author;
+    const fullName = users?.find((u) => u.identity === message.author)?.friendlyName || message.author || "AnyVan Support";
+    const displayName = belongsToCurrentUser ? fullName : getFirstName(fullName);
 
     return (
         <Box
@@ -131,13 +133,13 @@ export const MessageBubble = ({
                 )}
                 <Box {...getInnerContainerStyles(belongsToCurrentUser)}>
                     <Flex hAlignContent="between" width="100%" vAlignContent="center" marginBottom="space20">
-                        <Text {...authorStyles} as="p" aria-hidden style={{ textOverflow: "ellipsis" }} title={author}>
-                            {author}
+                        <Text {...authorStyles} as="p" aria-hidden style={{ textOverflow: "ellipsis" }} title={displayName}>
+                            {displayName}
                         </Text>
                         <ScreenReaderOnly as="p">
                             {belongsToCurrentUser
                                 ? "You sent at"
-                                : `${users?.find((u) => u.identity === message.author)?.friendlyName} sent at`}
+                                : `${fullName} sent at`}
                         </ScreenReaderOnly>
                         <Text {...timeStampStyles} as="p">
                             {`${doubleDigit(message.dateCreated.getHours())}:${doubleDigit(
diff --git a/src/components/MessageList.tsx b/src/components/MessageList.tsx
index 8a3f1a27..4307edca 100644
--- a/src/components/MessageList.tsx
+++ b/src/components/MessageList.tsx
@@ -1,30 +1,45 @@
-import { Box, Text } from "@twilio-paste/core";
-import { Message, User } from "@twilio/conversations";
-import { useEffect, useRef, useState, UIEvent } from "react";
+import { UIEvent, useEffect, useRef, useState } from "react";
 import { useDispatch, useSelector } from "react-redux";
+import { Box } from "@twilio-paste/core/box";
+import { Text } from "@twilio-paste/core/text";
+import { Spinner } from "@twilio-paste/core/spinner";
+import { Message } from "@twilio/conversations";
+import throttle from "lodash.throttle";
 
+import { MessageBubble } from "./MessageBubble";
 import { AppState } from "../store/definitions";
 import { getMoreMessages } from "../store/actions/genericActions";
-import { MessageBubble } from "./MessageBubble";
+import { getDaysOld } from "../utils/getDaysOld";
 import { MessageListSeparator } from "./MessageListSeparator";
-import { getFirstName } from "../utils/getFirstName";
+import { MESSAGES_SPINNER_BOX_HEIGHT } from "../constants";
 import {
+    conversationEventContainerStyles,
+    conversationEventTitleStyles,
+    conversationEventDateStyles,
+    spinnerContainerStyles,
     messageListStyles,
-    outerContainerStyles,
     innerContainerStyles,
+    outerContainerStyles,
     participantTypingStyles
 } from "./styles/MessageList.styles";
 
-const MESSAGES_SPINNER_BOX_HEIGHT = 60;
+const isLastOfUserGroup = (message: Message, i: number, messages: Message[]) => {
+    const nextMessage = messages[i + 1];
 
-const isFirstOfDateGroup = (message: Message, i: number, messages: Message[]) => {
-    const currentMessageDate = message.dateCreated.toDateString();
-    const previousMessageDate = messages[i - 1].dateCreated.toDateString();
-    return currentMessageDate !== previousMessageDate;
+    // if there's no message afterwards, it's definitely the last of a group
+    if (!nextMessage) {
+        return true;
+    }
+
+    // if the author of the next message is different from current one's, then yes, this message is last of its group
+    return nextMessage.author !== message.author;
 };
 
-const renderChatStarted = () => {
-    return <MessageListSeparator separatorType="chatStarted" />;
+const isFirstOfDateGroup = (message: Message, i: number, messages: Message[]) => {
+    const prevMessage = messages[i - 1];
+
+    // if the previous message has a date older than the current message, this message is the first for this date
+    return getDaysOld(prevMessage.dateCreated) > getDaysOld(message.dateCreated);
 };
 
 export const MessageList = () => {
@@ -37,10 +52,12 @@ export const MessageList = () => {
     }));
     const dispatch = useDispatch();
     const messageListRef = useRef<HTMLDivElement>(null);
-    const [focusIndex, setFocusIndex] = useState(-1);
-    const [hasLoadedAllMessages, setHasLoadedAllMessages] = useState(false);
     const isLoadingMessages = useRef(false);
-    const oldMessagesLength = useRef(0);
+    const oldMessagesLength = useRef((messages || []).length);
+    const [hasLoadedAllMessages, setHasLoadedAllMessages] = useState(true);
+    const [focusIndex, setFocusIndex] = useState(
+        messages && messages.length ? messages[messages?.length - 1].index : -1
+    );
     const [shouldFocusLatest, setShouldFocusLatest] = useState(false);
 
     const updateFocus = (newFocus: number) => {
@@ -89,7 +106,12 @@ export const MessageList = () => {
         const checkIfAllMessagesLoaded = async () => {
             const totalMessagesCount = await conversation?.getMessagesCount();
             if (totalMessagesCount) {
-                setHasLoadedAllMessages(totalMessagesCount === messages?.length);
+                /*
+                 * Account for filtered system messages by subtracting 1 from total count
+                 * since we filter out the system message
+                 */
+                const expectedCount = totalMessagesCount - 1;
+                setHasLoadedAllMessages(expectedCount === messages?.length);
             }
 
             // if messages were added to state, loading is complete
@@ -113,7 +135,7 @@ export const MessageList = () => {
             oldMessagesLength.current = messages.length;
             const totalMessagesCount = await conversation?.getMessagesCount();
 
-            if (totalMessagesCount && messages.length < totalMessagesCount) {
+            if (totalMessagesCount && messages.length < totalMessagesCount - 1) {
                 dispatch(getMoreMessages({ anchor: totalMessagesCount - messages.length - 1, conversation }));
             }
         }
@@ -143,36 +165,69 @@ export const MessageList = () => {
         return null;
     };
 
+    const renderChatStarted = () =>
+        hasLoadedAllMessages ? (
+            <>
+                <Box {...conversationEventContainerStyles}>
+                    <Text as="h3" {...conversationEventTitleStyles} data-test="chat-started">
+                        Chat started
+                    </Text>
+                    <Text as="p" {...conversationEventDateStyles}>
+                        {conversation?.dateCreated.toLocaleString()}
+                    </Text>
+                </Box>
+            </>
+        ) : null;
+
     const renderChatItems = () => {
         if (!messages) {
             return null;
         }
 
-        return messages.map((message: Message, i: number) => {
-            const belongsToCurrentUser = message.author === conversationsClient?.user.identity;
-            const isLast = i === messages.length - 1;
-            const isLastOfUserGroup =
-                i === messages.length - 1 ||
-                messages[i + 1].author !== message.author ||
-                isFirstOfDateGroup(messages[i + 1], i + 1, messages);
+        /*
+         * We use a copy of the messages array where the first message is a placeholder for the loading spinner.
+         * By assigning the loading spinner to the same index and key as the previous message,
+         * we avoid a snappy scroll position change when loading spinner disappears.
+         */
+        const spinnerIndex = (messages[0]?.index || 0) - 1;
+        const messagesWithSpinner = [
+            {
+                index: spinnerIndex
+            } as Message,
+            ...messages
+        ];
+
+        return messagesWithSpinner.map((message: Message, i: number) => {
+            // First message in array represents the loading spinner
+            if (message.index === spinnerIndex) {
+                // Only render loading spinner if there are remaining messages to load
+                return hasLoadedAllMessages ? null : (
+                    <Box {...spinnerContainerStyles} key={message.index}>
+                        <Spinner color="colorTextWeak" decorative={false} title="Loading" />
+                    </Box>
+                );
+            }
+            // Discount loading spinner from indices
+            i -= 1;
 
             return (
-                <div key={message.sid}>
+                <Box data-test="all-message-bubbles" key={message.index}>
                     {renderSeparatorIfApplicable(message, i)}
                     <MessageBubble
                         message={message}
-                        isLast={isLast}
-                        isLastOfUserGroup={isLastOfUserGroup}
-                        focusable={focusIndex === message.index}
+                        isLast={i === messages.length - 1}
+                        isLastOfUserGroup={isLastOfUserGroup(message, i, messages)}
+                        focusable={message.index === focusIndex}
                         updateFocus={updateFocus}
                     />
-                </div>
+                </Box>
             );
         });
     };
 
     const handleFocus = () => {
-        if (messages && messages.length > 0) {
+        // Hand over focus to message bubbles once there is at least one
+        if (messages && messages.length && focusIndex < 0) {
             setFocusIndex(messages[messages.length - 1].index);
         }
     };
@@ -194,7 +249,7 @@ export const MessageList = () => {
                         ?.filter((p) => p.isTyping && p.identity !== conversationsClient?.user.identity)
                         .map((p) => (
                             <Text {...participantTypingStyles} as="p" key={p.identity}>
-                                {getFirstName(users?.find((u) => u.identity === p.identity)?.friendlyName)} is typing...
+                                {users?.find((u) => u.identity === p.identity)?.friendlyName} is typing...
                             </Text>
                         ))}
                 </Box>
@@ -202,26 +257,3 @@ export const MessageList = () => {
         </Box>
     );
 };
-
-// Throttle function to limit the frequency of scroll event handling
-function throttle<T extends (...args: any[]) => any>(func: T, delay: number): T {
-    let timeoutId: NodeJS.Timeout | null = null;
-    let lastExecTime = 0;
-    
-    return ((...args: any[]) => {
-        const currentTime = Date.now();
-        
-        if (currentTime - lastExecTime > delay) {
-            func(...args);
-            lastExecTime = currentTime;
-        } else {
-            if (timeoutId) {
-                clearTimeout(timeoutId);
-            }
-            timeoutId = setTimeout(() => {
-                func(...args);
-                lastExecTime = Date.now();
-            }, delay - (currentTime - lastExecTime));
-        }
-    }) as T;
-}
diff --git a/src/store/actions/initActions.ts b/src/store/actions/initActions.ts
index 825c2dac..19264aee 100644
--- a/src/store/actions/initActions.ts
+++ b/src/store/actions/initActions.ts
@@ -40,6 +40,9 @@ export function initSession({ token, conversationSid }: { token: string; convers
             participants = await conversation.getParticipants();
             users = await Promise.all(participants.map(async (p) => p.getUser()));
             messages = (await conversation.getMessages(MESSAGES_LOAD_COUNT)).items;
+            
+            // Filter out system messages so they don't appear to customers
+            messages = messages.filter((message) => message.author !== "System");
         } catch (e) {
             log.error("Something went wrong when initializing session", e);
             throw e;
diff --git a/src/store/actions/listeners/messagesListener.ts b/src/store/actions/listeners/messagesListener.ts
index 1623b9e6..d0ecf911 100644
--- a/src/store/actions/listeners/messagesListener.ts
+++ b/src/store/actions/listeners/messagesListener.ts
@@ -5,6 +5,11 @@ import { ACTION_ADD_MESSAGE, ACTION_REMOVE_MESSAGE, ACTION_UPDATE_MESSAGE } from
 
 export const initMessagesListener = (conversation: Conversation, dispatch: Dispatch) => {
     conversation.addListener("messageAdded", (message: Message) => {
+        // Filter out system messages so they don't appear to customers
+        if (message.author === "System") {
+            return;
+        }
+        
         dispatch({
             type: ACTION_ADD_MESSAGE,
             payload: { message }
diff --git a/src/utils/generateTranscripts.ts b/src/utils/generateTranscripts.ts
index 36c698cd..740f0a9a 100644
--- a/src/utils/generateTranscripts.ts
+++ b/src/utils/generateTranscripts.ts
@@ -1,6 +1,7 @@
 import { Media, Message, User } from "@twilio/conversations";
 
 import { generateDuration } from "./generateDuration";
+import { getFirstName } from "./getFirstName";
 
 interface Transcript {
     author?: string;
@@ -13,9 +14,18 @@ const getTranscriptData = (messages: Message[] | undefined, users: User[] | unde
     const transcriptData = [];
     if (messages && users) {
         for (const message of messages) {
+            // Filter out system messages
+            if (message.author === "System") {
+                continue;
+            }
+            
             const currentUser = users.find((user) => user.identity === message.author);
+            const fullName = message.author === "Concierge" ? message.author : (currentUser?.friendlyName || message.author || "AnyVan Support");
+            const isCustomer = message.author === currentUser?.identity; // Assuming customer is the current user
+            const displayName = isCustomer ? fullName : getFirstName(fullName);
+            
             transcriptData.push({
-                author: message.author === "Concierge" ? message.author : currentUser?.friendlyName,
+                author: displayName,
                 body: message.body,
                 timeStamp: message.dateCreated,
                 attachedMedia: message.attachedMedia
diff --git a/src/utils/getFirstName.test.ts b/src/utils/getFirstName.test.ts
new file mode 100644
index 00000000..cce24f09
--- /dev/null
+++ b/src/utils/getFirstName.test.ts
@@ -0,0 +1,29 @@
+import { getFirstName } from "./getFirstName";
+
+describe("getFirstName", () => {
+    it("should return the first name from a full name", () => {
+        expect(getFirstName("John Smith")).toBe("John");
+        expect(getFirstName("Mary Jane Watson")).toBe("Mary");
+        expect(getFirstName("Dr. Robert Johnson")).toBe("Dr.");
+    });
+
+    it("should return the original name if it's a single word", () => {
+        expect(getFirstName("John")).toBe("John");
+        expect(getFirstName("Agent")).toBe("Agent");
+    });
+
+    it("should handle names with multiple spaces", () => {
+        expect(getFirstName("John  Smith")).toBe("John");
+        expect(getFirstName("  Mary   Jane  ")).toBe("Mary");
+    });
+
+    it("should handle empty or undefined names", () => {
+        expect(getFirstName("")).toBe("");
+        expect(getFirstName(undefined)).toBe("");
+    });
+
+    it("should handle special characters", () => {
+        expect(getFirstName("José García")).toBe("José");
+        expect(getFirstName("O'Connor Smith")).toBe("O'Connor");
+    });
+});
diff --git a/src/utils/getFirstName.ts b/src/utils/getFirstName.ts
index 11175914..48d21be4 100644
--- a/src/utils/getFirstName.ts
+++ b/src/utils/getFirstName.ts
@@ -1,14 +1,12 @@
 /**
- * Extracts the first name from a full name string
- * @param fullName - The full name string
- * @returns The first name, or the original string if no space is found
+ * Extracts the first name from a full name
+ * @param fullName - The full name to extract the first name from
+ * @returns The first name, or the original name if it's a single word
  */
 export const getFirstName = (fullName: string | undefined): string => {
-    if (!fullName) {
-        return "";
-    }
+    if (!fullName) return "";
     
-    // Split by space and take the first part
+    // Split by spaces and take the first part
     const nameParts = fullName.trim().split(/\s+/);
     return nameParts[0] || fullName;
 };

From 451493489f17d505e14306e8dce6c296f10d8ce5 Mon Sep 17 00:00:00 2001
From: GarethF531 <167188366+GarethF531@users.noreply.github.com>
Date: Tue, 2 Sep 2025 11:23:18 +0200
Subject: [PATCH 04/48] commit

---
 server/controllers/ratingController.js        | 208 +++++++++++++++++
 server/index.js                               |  12 +
 src/components/Header.tsx                     |  61 ++++-
 src/components/MessageList.tsx                |   3 +-
 src/components/ServiceRating.tsx              | 158 +++++++++++++
 src/components/WebchatWidget.tsx              |  19 ++
 src/components/__tests__/Header.test.tsx      |  21 ++
 .../__tests__/ServiceRating.test.tsx          | 197 ++++++++++++++++
 src/hooks/useServiceRating.ts                 | 210 ++++++++++++++++++
 src/services/ratingService.ts                 |  73 ++++++
 .../__tests__/participantsListener.test.ts    |  14 +-
 .../actions/listeners/conversationListener.ts |  24 +-
 .../actions/listeners/participantsListener.ts |  77 ++++++-
 src/utils/chatClosureDetector.test.ts         | 134 +++++++++++
 src/utils/chatClosureDetector.ts              | 124 +++++++++++
 15 files changed, 1327 insertions(+), 8 deletions(-)
 create mode 100644 server/controllers/ratingController.js
 create mode 100644 src/components/ServiceRating.tsx
 create mode 100644 src/components/__tests__/ServiceRating.test.tsx
 create mode 100644 src/hooks/useServiceRating.ts
 create mode 100644 src/services/ratingService.ts
 create mode 100644 src/utils/chatClosureDetector.test.ts
 create mode 100644 src/utils/chatClosureDetector.ts

diff --git a/server/controllers/ratingController.js b/server/controllers/ratingController.js
new file mode 100644
index 00000000..88fff677
--- /dev/null
+++ b/server/controllers/ratingController.js
@@ -0,0 +1,208 @@
+const { getTwilioClient } = require("../helpers/getTwilioClient");
+const { logInterimAction } = require("../helpers/logs");
+
+// In-memory storage for ratings (in production, use a database)
+const ratings = new Map();
+
+/**
+ * Create a new TaskRouter task to log rating data
+ */
+const createRatingLogTask = async (ratingData) => {
+    try {
+        const twilioClient = getTwilioClient();
+        
+        // Use workspace SID from environment variable
+        const workspaceSid = process.env.WORKSPACE_SID;
+        if (!workspaceSid) {
+            logInterimAction("WORKSPACE_SID environment variable not set for rating log task");
+            return false;
+        }
+
+        // Use a specific workflow SID for rating logs
+        // You can set this as an environment variable or use a specific workflow
+        const ratingWorkflowSid = process.env.RATING_WORKFLOW_SID || workspace.workflowSid;
+
+        // Create task attributes for rating logging
+        const taskAttributes = {
+            taskType: "rating_log",
+            conversationSid: ratingData.conversationSid,
+            rating: ratingData.rating,
+            feedback: ratingData.feedback || "",
+            customerEmail: ratingData.customerEmail || "",
+            agentIdentity: ratingData.agentIdentity || "",
+            agentName: ratingData.agentName || "", // Add agent name to task attributes
+            agentEmail: ratingData.agentEmail || "", // Add agent email from worker attributes
+            workerSid: ratingData.workerSid || "", // Add worker SID for reference
+            closureType: ratingData.closureType,
+            timestamp: ratingData.timestamp.toISOString()
+        };
+
+        // Create the task with the rating workflow
+        const task = await twilioClient.taskrouter
+            .workspaces(workspaceSid)
+            .tasks.create({
+                attributes: JSON.stringify(taskAttributes),
+                workflowSid: ratingWorkflowSid,
+                timeout: 600 // 10 minutes in seconds
+            });
+
+        logInterimAction(`Rating log task created: ${task.sid} for conversation ${ratingData.conversationSid} using workspace ${workspaceSid} and workflow ${ratingWorkflowSid}`);
+        return true;
+
+    } catch (error) {
+        logInterimAction(`Error creating rating log task: ${error.message}`);
+        return false;
+    }
+};
+
+/**
+ * Submit a service rating
+ */
+const submitRatingController = async (request, response) => {
+    try {
+        const { conversationSid, rating, feedback, customerEmail, agentIdentity, agentName, agentEmail, workerSid, closureType } = request.body;
+
+        if (!conversationSid || !rating) {
+            return response.status(400).json({ error: "Missing required fields" });
+        }
+
+        const ratingData = {
+            conversationSid,
+            rating,
+            feedback,
+            customerEmail,
+            agentIdentity,
+            agentName, // Add agent name to rating data
+            agentEmail, // Add agent email from worker attributes
+            workerSid, // Add worker SID for reference
+            closureType,
+            timestamp: new Date(),
+        };
+
+        // Log the rating data received from frontend
+        logInterimAction(`Rating data received from frontend: ${JSON.stringify(ratingData)}`);
+
+        // Store rating in memory
+        ratings.set(conversationSid, ratingData);
+        logInterimAction(`Rating submitted for conversation ${conversationSid}: ${rating}/5 stars`);
+
+        // Create a new task to log the rating data
+        const taskCreated = await createRatingLogTask(ratingData);
+        if (taskCreated) {
+            logInterimAction(`Rating log task created successfully for conversation ${conversationSid}`);
+        } else {
+            logInterimAction(`Failed to create rating log task for conversation ${conversationSid}`);
+        }
+
+        response.json({ success: true, message: "Rating submitted successfully" });
+
+    } catch (error) {
+        logInterimAction(`Error submitting rating: ${error.message}`);
+        response.status(500).json({ error: "Failed to submit rating" });
+    }
+};
+
+/**
+ * Check if a conversation has already been rated
+ */
+const hasBeenRatedController = async (request, response) => {
+    try {
+        const { conversationSid } = request.query;
+
+        if (!conversationSid) {
+            return response.status(400).json({ error: "Conversation SID is required" });
+        }
+
+        // Check if rating exists in memory
+        const hasRated = ratings.has(conversationSid);
+        
+        response.json({ hasRated });
+
+    } catch (error) {
+        logInterimAction(`Error checking rating status: ${error.message}`);
+        response.status(500).json({ error: "Failed to check rating status" });
+    }
+};
+
+/**
+ * Get all ratings (for admin purposes)
+ */
+const getAllRatingsController = async (request, response) => {
+    try {
+        // Convert Map to array of rating objects
+        const allRatings = Array.from(ratings.values());
+        
+        response.json({ 
+            success: true, 
+            ratings: allRatings,
+            count: allRatings.length 
+        });
+
+    } catch (error) {
+        logInterimAction(`Error getting all ratings: ${error.message}`);
+        response.status(500).json({ error: "Failed to get ratings" });
+    }
+};
+
+/**
+ * Get worker attributes by agent identity
+ */
+const getWorkerAttributesController = async (request, response) => {
+    try {
+        const { agentIdentity } = request.body;
+
+        if (!agentIdentity) {
+            return response.status(400).json({ error: "Agent identity is required" });
+        }
+
+        const twilioClient = getTwilioClient();
+        
+        // Use workspace SID from environment variable
+        const workspaceSid = process.env.WORKSPACE_SID;
+        if (!workspaceSid) {
+            logInterimAction("WORKSPACE_SID environment variable not set for worker attributes lookup");
+            return response.status(500).json({ error: "Workspace SID not configured" });
+        }
+
+        try {
+            // Find worker by identity (friendlyName)
+            const workers = await twilioClient.taskrouter
+                .workspaces(workspaceSid)
+                .workers.list({ friendlyName: agentIdentity });
+            
+            if (workers.length > 0) {
+                const worker = workers[0];
+                const attributes = JSON.parse(worker.attributes || '{}');
+                
+                const workerData = {
+                    workerSid: worker.sid,
+                    workerIdentity: worker.identity,
+                    workerFriendlyName: worker.friendlyName,
+                    workerEmail: attributes.email || "",
+                    workerAttributes: attributes,
+                    workspaceSid: workspaceSid
+                };
+                
+                logInterimAction(`Found worker attributes for agent ${agentIdentity}: ${worker.sid}`);
+                response.json(workerData);
+            } else {
+                logInterimAction(`No worker found for agent identity: ${agentIdentity}`);
+                response.status(404).json({ error: "Worker not found" });
+            }
+        } catch (error) {
+            logInterimAction(`Error fetching worker attributes: ${error.message}`);
+            response.status(500).json({ error: "Failed to fetch worker attributes" });
+        }
+
+    } catch (error) {
+        logInterimAction(`Error in getWorkerAttributesController: ${error.message}`);
+        response.status(500).json({ error: "Internal server error" });
+    }
+};
+
+module.exports = {
+    submitRatingController,
+    hasBeenRatedController,
+    getAllRatingsController,
+    getWorkerAttributesController
+};
diff --git a/server/index.js b/server/index.js
index d89e63b9..9711c11f 100644
--- a/server/index.js
+++ b/server/index.js
@@ -6,6 +6,12 @@ const { validateRequestOriginMiddleware } = require("./middlewares/validateReque
 const { initWebchatController } = require("./controllers/initWebchatController");
 const { refreshTokenController } = require("./controllers/refreshTokenController");
 const { emailTranscriptController } = require("./controllers/emailTranscriptController");
+const {
+    submitRatingController,
+    hasBeenRatedController,
+    getAllRatingsController,
+    getWorkerAttributesController
+} = require("./controllers/ratingController");
 
 const cors = require("cors");
 const { allowedOrigins } = require("./helpers/getAllowedOrigins");
@@ -28,6 +34,12 @@ app.post("/initWebchat", validateRequestOriginMiddleware, initWebchatController)
 app.post("/refreshToken", validateRequestOriginMiddleware, refreshTokenController);
 app.post("/email", validateRequestOriginMiddleware, emailTranscriptController);
 
+// Rating routes
+app.post("/submitRating", validateRequestOriginMiddleware, submitRatingController);
+app.get("/hasBeenRated", validateRequestOriginMiddleware, hasBeenRatedController);
+app.get("/ratings", validateRequestOriginMiddleware, getAllRatingsController);
+app.post("/getWorkerAttributes", validateRequestOriginMiddleware, getWorkerAttributesController);
+
 // Catch-all handler: send back React's index.html file for any non-API routes
 app.get('*', (req, res) => {
   res.sendFile(path.join(__dirname, '../build/index.html'));
diff --git a/src/components/Header.tsx b/src/components/Header.tsx
index 1177f4fc..20d9c6e1 100644
--- a/src/components/Header.tsx
+++ b/src/components/Header.tsx
@@ -1,14 +1,71 @@
-import { Box } from "@twilio-paste/core/box";
-import { Text } from "@twilio-paste/core/text";
+import { Box, Text } from "@twilio-paste/core";
+import { CloseIcon } from "@twilio-paste/icons/esm/CloseIcon";
+import { useSelector } from "react-redux";
 
+import { AppState } from "../store/definitions";
 import { containerStyles, titleStyles } from "./styles/Header.styles";
 
 export const Header = ({ customTitle }: { customTitle?: string }) => {
+    const conversation = useSelector((state: AppState) => state.chat.conversation);
+    const conversationState = useSelector((state: AppState) => state.chat.conversationState);
+
+    const handleCloseChat = async () => {
+        console.log('🔄 X button clicked - starting customer chat closure process');
+        console.log('📊 Current conversation state:', conversationState);
+        console.log('💬 Conversation object exists:', Boolean(conversation));
+        
+        try {
+            /*
+             * Close the conversation first (like when agent ends chat)
+             * The conversation state change will trigger the rating modal automatically
+             */
+            if (conversation && conversationState !== 'closed') {
+                console.log('🔒 Attempting to close conversation via conversation.leave()');
+                await conversation.leave();
+                console.log('✅ Conversation closed by customer - rating modal will appear automatically');
+            } else {
+                console.log('ℹ️ Conversation already closed or no conversation object - skipping conversation.leave()');
+            }
+        } catch (error) {
+            console.error('❌ Error closing chat:', error);
+            console.error('🔍 Error details:', {
+                message: error instanceof Error ? error.message : String(error),
+                stack: error instanceof Error ? error.stack : undefined,
+                conversationState,
+                hasConversation: Boolean(conversation)
+            });
+        }
+    };
+
+    const isChatActive = conversationState === 'active';
+
     return (
         <Box as="header" {...containerStyles}>
             <Text as="h2" {...titleStyles}>
                 {customTitle || "AnyVan Chat"}
             </Text>
+            {isChatActive && (
+                <Box
+                    as="button"
+                    onClick={handleCloseChat}
+                    aria-label="Close chat"
+                    padding="space20"
+                    borderRadius="borderRadius20"
+                    backgroundColor="transparent"
+                    border="none"
+                    cursor="pointer"
+                    _hover={{
+                        backgroundColor: "colorBackgroundPrimaryWeak",
+                        transform: "scale(1.1)"
+                    }}
+                    transition="all 0.2s"
+                    display="flex"
+                    alignItems="center"
+                    justifyContent="center"
+                >
+                    <CloseIcon decorative={false} title="Close chat" color="colorTextInverse" />
+                </Box>
+            )}
         </Box>
     );
 };
diff --git a/src/components/MessageList.tsx b/src/components/MessageList.tsx
index 4307edca..2689d772 100644
--- a/src/components/MessageList.tsx
+++ b/src/components/MessageList.tsx
@@ -10,6 +10,7 @@ import { MessageBubble } from "./MessageBubble";
 import { AppState } from "../store/definitions";
 import { getMoreMessages } from "../store/actions/genericActions";
 import { getDaysOld } from "../utils/getDaysOld";
+import { getFirstName } from "../utils/getFirstName";
 import { MessageListSeparator } from "./MessageListSeparator";
 import { MESSAGES_SPINNER_BOX_HEIGHT } from "../constants";
 import {
@@ -249,7 +250,7 @@ export const MessageList = () => {
                         ?.filter((p) => p.isTyping && p.identity !== conversationsClient?.user.identity)
                         .map((p) => (
                             <Text {...participantTypingStyles} as="p" key={p.identity}>
-                                {users?.find((u) => u.identity === p.identity)?.friendlyName} is typing...
+                                {getFirstName(users?.find((u) => u.identity === p.identity)?.friendlyName)} is typing...
                             </Text>
                         ))}
                 </Box>
diff --git a/src/components/ServiceRating.tsx b/src/components/ServiceRating.tsx
new file mode 100644
index 00000000..a1e43258
--- /dev/null
+++ b/src/components/ServiceRating.tsx
@@ -0,0 +1,158 @@
+import React, { useState } from "react";
+import { Box, Text, Button, Modal, ModalHeading, ModalBody, ModalFooter, ModalFooterActions } from "@twilio-paste/core";
+
+interface ServiceRatingProps {
+    isOpen: boolean;
+    onClose: () => void;
+    onSubmit: (rating: number, feedback?: string) => void;
+    onSkip: () => void;
+    isLoading?: boolean;
+}
+
+export const ServiceRating: React.FC<ServiceRatingProps> = ({
+    isOpen,
+    onClose,
+    onSubmit,
+    onSkip,
+    isLoading = false
+}) => {
+    const [rating, setRating] = useState(0);
+    const [hoverRating, setHoverRating] = useState(0);
+    const [feedback, setFeedback] = useState("");
+
+    const handleStarClick = (starRating: number) => {
+        setRating(starRating);
+    };
+
+    const handleStarHover = (starRating: number) => {
+        setHoverRating(starRating);
+    };
+
+    const handleStarLeave = () => {
+        setHoverRating(0);
+    };
+
+    const handleSubmit = () => {
+        if (rating > 0) {
+            onSubmit(rating, feedback);
+        }
+    };
+
+    const handleClose = () => {
+        setRating(0);
+        setFeedback("");
+        setHoverRating(0);
+        onClose();
+    };
+
+    const renderStars = () => {
+        const stars = [];
+        const maxStars = 5;
+        const displayRating = hoverRating || rating;
+
+        for (let i = 1; i <= maxStars; i++) {
+            stars.push(
+                <Box
+                    key={i}
+                    as="button"
+                    type="button"
+                    onClick={() => handleStarClick(i)}
+                    onMouseEnter={() => handleStarHover(i)}
+                    onMouseLeave={handleStarLeave}
+                    backgroundColor="transparent"
+                    border="none"
+                    cursor="pointer"
+                    padding="space20"
+                    marginRight="space10"
+                    borderRadius="borderRadius20"
+                    _hover={{
+                        backgroundColor: "colorBackgroundPrimaryWeak",
+                        transform: "scale(1.1)"
+                    }}
+                    transition="all 0.2s"
+                    aria-label={`Rate ${i} star${i > 1 ? 's' : ''}`}
+                >
+                    <Text
+                        as="span"
+                        fontSize="fontSize60"
+                        color={i <= displayRating ? "colorTextIconSuccess" : "colorTextWeak"}
+                        fontWeight="fontWeightBold"
+                    >
+                        ★
+                    </Text>
+                </Box>
+            );
+        }
+        return stars;
+    };
+
+    const getRatingText = () => {
+        if (rating === 0) return "How would you rate your experience?";
+        if (rating === 1) return "Poor - We're sorry to hear that";
+        if (rating === 2) return "Fair - We'll work to improve";
+        if (rating === 3) return "Good - Thanks for your feedback";
+        if (rating === 4) return "Very Good - We're glad you had a good experience";
+        if (rating === 5) return "Excellent - Thank you for the perfect rating!";
+        return "";
+    };
+
+    return (
+        <Modal
+            isOpen={isOpen}
+            onDismiss={handleClose}
+            size="default"
+            ariaLabelledby="rating-modal-title"
+        >
+            <ModalHeading id="rating-modal-title">Rate Your Experience</ModalHeading>
+            <ModalBody>
+                <Box textAlign="center" paddingY="space60">
+                    <Text as="p" variant="bodyText" marginBottom="space50">
+                        {getRatingText()}
+                    </Text>
+
+                    <Box display="flex" justifyContent="center" marginBottom="space50">
+                        {renderStars()}
+                    </Box>
+
+                    {rating > 0 && (
+                        <Box marginTop="space50">
+                            <Text as="label" variant="label" display="block" marginBottom="space30">
+                                Additional Feedback (Optional)
+                            </Text>
+                            <textarea
+                                value={feedback}
+                                onChange={(e: React.ChangeEvent<HTMLTextAreaElement>) => setFeedback(e.target.value)}
+                                placeholder="Tell us about your experience..."
+                                style={{
+                                    width: '100%',
+                                    minHeight: '80px',
+                                    padding: '12px',
+                                    border: '1px solid #c1c3c6',
+                                    borderRadius: '4px',
+                                    fontFamily: 'inherit',
+                                    fontSize: '14px',
+                                    resize: 'vertical'
+                                }}
+                            />
+                        </Box>
+                    )}
+                </Box>
+            </ModalBody>
+            <ModalFooter>
+                <ModalFooterActions>
+                    <Button variant="secondary" onClick={onSkip} disabled={isLoading}>
+                        Skip
+                    </Button>
+                    <Button
+                        variant="primary"
+                        onClick={handleSubmit}
+                        disabled={rating === 0 || isLoading}
+                        loading={isLoading}
+                    >
+                        Submit Rating
+                    </Button>
+                </ModalFooterActions>
+            </ModalFooter>
+        </Modal>
+    );
+};
diff --git a/src/components/WebchatWidget.tsx b/src/components/WebchatWidget.tsx
index d2b846f4..bcb17368 100644
--- a/src/components/WebchatWidget.tsx
+++ b/src/components/WebchatWidget.tsx
@@ -3,15 +3,18 @@ import { CustomizationProvider, CustomizationProviderProps } from "@twilio-paste
 import { CSSProperties, FC, useEffect } from "react";
 
 import { RootContainer } from "./RootContainer";
+import { ServiceRating } from "./ServiceRating";
 import { AppState, EngagementPhase } from "../store/definitions";
 import { sessionDataHandler } from "../sessionDataHandler";
 import { changeEngagementPhase } from "../store/actions/genericActions";
+import { useServiceRating } from "../hooks/useServiceRating";
 
 const AnyCustomizationProvider: FC<CustomizationProviderProps & { style: CSSProperties }> = CustomizationProvider;
 
 export function WebchatWidget() {
     const theme = useSelector((state: AppState) => state.config.theme);
     const dispatch = useDispatch();
+    const { showRatingModal, closeRatingModal, submitRating, handleSkipRating, isLoading } = useServiceRating();
 
     useEffect(() => {
         // Clear session data on page refresh to ensure fresh start
@@ -21,6 +24,15 @@ export function WebchatWidget() {
         dispatch(changeEngagementPhase({ phase: EngagementPhase.PreEngagementForm }));
     }, [dispatch]);
 
+    const handleRatingSubmit = async (rating: number, feedback?: string) => {
+        try {
+            await submitRating(rating, feedback);
+        } catch (error) {
+            console.error('Failed to submit rating:', error);
+            // You could show a notification here
+        }
+    };
+
     return (
         <AnyCustomizationProvider
             baseTheme={theme?.isLight ? "default" : "dark"}
@@ -46,6 +58,13 @@ export function WebchatWidget() {
             style={{ minHeight: "100%", minWidth: "100%" }}
         >
             <RootContainer />
+            <ServiceRating
+                isOpen={showRatingModal}
+                onClose={closeRatingModal}
+                onSubmit={handleRatingSubmit}
+                onSkip={handleSkipRating}
+                isLoading={isLoading}
+            />
         </AnyCustomizationProvider>
     );
 }
diff --git a/src/components/__tests__/Header.test.tsx b/src/components/__tests__/Header.test.tsx
index 88e2181a..76dc5bf7 100644
--- a/src/components/__tests__/Header.test.tsx
+++ b/src/components/__tests__/Header.test.tsx
@@ -3,6 +3,27 @@ import "@testing-library/jest-dom";
 
 import { Header } from "../Header";
 
+// Mock the Redux hooks
+jest.mock('react-redux', () => ({
+    useSelector: jest.fn((selector) => {
+        // Mock the selector calls
+        if (selector.toString().includes('conversation')) {
+            return null;
+        }
+        if (selector.toString().includes('conversationState')) {
+            return 'active';
+        }
+        return undefined;
+    }),
+}));
+
+// Mock the useServiceRating hook
+jest.mock('../../hooks/useServiceRating', () => ({
+    useServiceRating: () => ({
+        openRatingModal: jest.fn(),
+    }),
+}));
+
 describe("Header", () => {
     it("renders the header", () => {
         const { container } = render(<Header />);
diff --git a/src/components/__tests__/ServiceRating.test.tsx b/src/components/__tests__/ServiceRating.test.tsx
new file mode 100644
index 00000000..e0045b42
--- /dev/null
+++ b/src/components/__tests__/ServiceRating.test.tsx
@@ -0,0 +1,197 @@
+import React from 'react';
+import { render, screen, fireEvent, waitFor } from '@testing-library/react';
+import '@testing-library/jest-dom';
+import { ServiceRating } from '../ServiceRating';
+
+describe('ServiceRating', () => {
+    const mockOnClose = jest.fn();
+    const mockOnSubmit = jest.fn();
+    const mockOnSkip = jest.fn();
+
+    beforeEach(() => {
+        jest.clearAllMocks();
+    });
+
+    it('renders rating modal when open', () => {
+        render(
+            <ServiceRating
+                isOpen={true}
+                onClose={mockOnClose}
+                onSubmit={mockOnSubmit}
+                onSkip={mockOnSkip}
+            />
+        );
+
+        expect(screen.getByText('Rate Your Experience')).toBeInTheDocument();
+        expect(screen.getByText('How would you rate your experience?')).toBeInTheDocument();
+    });
+
+    it('does not render when closed', () => {
+        render(
+            <ServiceRating
+                isOpen={false}
+                onClose={mockOnClose}
+                onSubmit={mockOnSubmit}
+                onSkip={mockOnSkip}
+            />
+        );
+
+        expect(screen.queryByText('Rate Your Experience')).not.toBeInTheDocument();
+    });
+
+    it('shows 5 stars', () => {
+        render(
+            <ServiceRating
+                isOpen={true}
+                onClose={mockOnClose}
+                onSubmit={mockOnSubmit}
+                onSkip={mockOnSkip}
+            />
+        );
+
+        const stars = screen.getAllByRole('button', { name: /Rate \d+ star/ });
+        expect(stars).toHaveLength(5);
+    });
+
+    it('allows rating selection', () => {
+        render(
+            <ServiceRating
+                isOpen={true}
+                onClose={mockOnClose}
+                onSubmit={mockOnSubmit}
+                onSkip={mockOnSkip}
+            />
+        );
+
+        const thirdStar = screen.getByRole('button', { name: 'Rate 3 stars' });
+        fireEvent.click(thirdStar);
+
+        expect(screen.getByText('Good - Thanks for your feedback')).toBeInTheDocument();
+    });
+
+    it('shows feedback textarea when rating is selected', () => {
+        render(
+            <ServiceRating
+                isOpen={true}
+                onClose={mockOnClose}
+                onSubmit={mockOnSubmit}
+                onSkip={mockOnSkip}
+            />
+        );
+
+        const thirdStar = screen.getByRole('button', { name: 'Rate 3 stars' });
+        fireEvent.click(thirdStar);
+
+        expect(screen.getByPlaceholderText('Tell us about your experience...')).toBeInTheDocument();
+    });
+
+    it('calls onSubmit with rating and feedback', async () => {
+        render(
+            <ServiceRating
+                isOpen={true}
+                onClose={mockOnClose}
+                onSubmit={mockOnSubmit}
+                onSkip={mockOnSkip}
+            />
+        );
+
+        const thirdStar = screen.getByRole('button', { name: 'Rate 3 stars' });
+        fireEvent.click(thirdStar);
+
+        const feedbackTextarea = screen.getByPlaceholderText('Tell us about your experience...');
+        fireEvent.change(feedbackTextarea, { target: { value: 'Great service!' } });
+
+        const submitButton = screen.getByRole('button', { name: 'Submit Rating' });
+        fireEvent.click(submitButton);
+
+        await waitFor(() => {
+            expect(mockOnSubmit).toHaveBeenCalledWith(3, 'Great service!');
+        });
+    });
+
+    it('calls onSkip when skip button is clicked', () => {
+        render(
+            <ServiceRating
+                isOpen={true}
+                onClose={mockOnClose}
+                onSubmit={mockOnSubmit}
+                onSkip={mockOnSkip}
+            />
+        );
+
+        const skipButton = screen.getByRole('button', { name: 'Skip' });
+        fireEvent.click(skipButton);
+
+        expect(mockOnSkip).toHaveBeenCalled();
+    });
+
+    it('disables submit button when no rating is selected', () => {
+        render(
+            <ServiceRating
+                isOpen={true}
+                onClose={mockOnClose}
+                onSubmit={mockOnSubmit}
+                onSkip={mockOnSkip}
+            />
+        );
+
+        const submitButton = screen.getByRole('button', { name: 'Submit Rating' });
+        expect(submitButton).toHaveAttribute('disabled');
+    });
+
+    it('enables submit button when rating is selected', () => {
+        render(
+            <ServiceRating
+                isOpen={true}
+                onClose={mockOnClose}
+                onSubmit={mockOnSubmit}
+                onSkip={mockOnSkip}
+            />
+        );
+
+        const thirdStar = screen.getByRole('button', { name: 'Rate 3 stars' });
+        fireEvent.click(thirdStar);
+
+        const submitButton = screen.getByRole('button', { name: 'Submit Rating' });
+        expect(submitButton).not.toHaveAttribute('disabled');
+    });
+
+    it('shows loading state when isLoading is true', () => {
+        render(
+            <ServiceRating
+                isOpen={true}
+                onClose={mockOnClose}
+                onSubmit={mockOnSubmit}
+                onSkip={mockOnSkip}
+                isLoading={true}
+            />
+        );
+
+        const thirdStar = screen.getByRole('button', { name: 'Rate 3 stars' });
+        fireEvent.click(thirdStar);
+
+        const submitButton = screen.getByRole('button', { name: 'Submit Rating' });
+        expect(submitButton).toHaveAttribute('disabled');
+    });
+
+    it('shows correct rating text for different ratings', () => {
+        render(
+            <ServiceRating
+                isOpen={true}
+                onClose={mockOnClose}
+                onSubmit={mockOnSubmit}
+                onSkip={mockOnSkip}
+            />
+        );
+
+        // Test 1 star
+        const firstStar = screen.getByRole('button', { name: 'Rate 1 star' });
+        fireEvent.click(firstStar);
+        expect(screen.getByText('Poor - We\'re sorry to hear that')).toBeInTheDocument();
+
+        // Test 5 stars
+        const fifthStar = screen.getByRole('button', { name: 'Rate 5 stars' });
+        fireEvent.click(fifthStar);
+        expect(screen.getByText('Excellent - Thank you for the perfect rating!')).toBeInTheDocument();
+    });
+});
diff --git a/src/hooks/useServiceRating.ts b/src/hooks/useServiceRating.ts
new file mode 100644
index 00000000..a7218f99
--- /dev/null
+++ b/src/hooks/useServiceRating.ts
@@ -0,0 +1,210 @@
+/* eslint-disable consistent-return */
+import { useState, useEffect, useCallback } from 'react';
+import { useSelector, useDispatch } from 'react-redux';
+import { Participant } from '@twilio/conversations';
+
+import { ratingService, RatingSubmission } from '../services/ratingService';
+import { AppState, EngagementPhase } from '../store/definitions';
+import { changeEngagementPhase, updatePreEngagementData, changeExpandedStatus } from '../store/actions/genericActions';
+import { sessionDataHandler } from '../sessionDataHandler';
+
+// Type for participant with worker attributes
+interface ParticipantWithWorkerAttributes extends Participant {
+    workerAttributes?: {
+        workerSid: string;
+        workerIdentity: string;
+        workerFriendlyName: string;
+        workerEmail: string;
+        workerAttributes: Record<string, any>;
+        workspaceSid: string;
+    };
+}
+
+interface UseServiceRatingReturn {
+    showRatingModal: boolean;
+    isLoading: boolean;
+    hasRated: boolean;
+    openRatingModal: () => void;
+    closeRatingModal: () => void;
+    submitRating: (rating: number, feedback?: string) => Promise<void>;
+    handleSkipRating: () => Promise<void>;
+}
+
+export const useServiceRating = (): UseServiceRatingReturn => {
+    const [showRatingModal, setShowRatingModal] = useState(false);
+    const [isLoading, setIsLoading] = useState(false);
+    const [hasRated, setHasRated] = useState(false);
+
+    const conversationSid = useSelector((state: AppState) => state.session.conversationSid);
+    const conversationState = useSelector((state: AppState) => state.chat.conversationState);
+    const participants = useSelector((state: AppState) => state.chat.participants);
+    const users = useSelector((state: AppState) => state.chat.users);
+    const conversation = useSelector((state: AppState) => state.chat.conversation);
+
+    const dispatch = useDispatch();
+
+    // Check if conversation has already been rated
+    useEffect(() => {
+        const checkRatingStatus = async () => {
+            if (conversationSid) {
+                try {
+                    const rated = await ratingService.hasBeenRated(conversationSid);
+                    setHasRated(rated);
+                } catch (error) {
+                    console.error('Error checking rating status:', error);
+                }
+            }
+        };
+
+        checkRatingStatus();
+    }, [conversationSid]);
+
+    // Show rating modal when conversation is closed and hasn't been rated
+    useEffect(() => {
+        console.log('🔄 useServiceRating useEffect triggered:', {
+            conversationState,
+            hasRated,
+            conversationSid: Boolean(conversationSid),
+            shouldShowModal: conversationState === 'closed' && !hasRated && Boolean(conversationSid)
+        });
+        
+        if (conversationState === 'closed' && !hasRated && conversationSid) {
+            console.log('⭐ Conversation closed and not rated - scheduling rating modal to appear');
+            // Small delay to ensure the closure is processed
+            const timer = setTimeout(() => {
+                console.log('🎯 Showing rating modal after conversation closure');
+                setShowRatingModal(true);
+            }, 1000);
+
+            return () => {
+                console.log('⏰ Clearing rating modal timer');
+                clearTimeout(timer);
+            };
+        }
+    }, [conversationState, hasRated, conversationSid]);
+
+    const openRatingModal = useCallback(() => {
+        console.log('Opening rating modal manually');
+        setShowRatingModal(true);
+    }, []);
+
+    const closeRatingModal = useCallback(() => {
+        console.log('Closing rating modal');
+        setShowRatingModal(false);
+    }, []);
+
+    const closeConversation = useCallback(async () => {
+        try {
+            // Try to close conversation if it's not already closed
+            if (conversation && conversationState !== 'closed') {
+                await conversation.leave();
+                console.log('Conversation closed after rating');
+            }
+            
+            // Always clear session data and reset to pre-engagement form
+            console.log('Resetting chat to pre-engagement form');
+            sessionDataHandler.clear();
+            dispatch(changeEngagementPhase({ phase: EngagementPhase.PreEngagementForm }));
+            dispatch(updatePreEngagementData({ name: '', email: '', query: '' })); // Clear pre-engagement form data
+            dispatch(changeExpandedStatus({ expanded: false })); // Minimize chat widget
+        } catch (error) {
+            console.error('Error in closeConversation:', error);
+            // Even if there's an error, still try to reset the chat
+            try {
+                sessionDataHandler.clear();
+                dispatch(changeEngagementPhase({ phase: EngagementPhase.PreEngagementForm }));
+                dispatch(updatePreEngagementData({ name: '', email: '', query: '' })); // Clear pre-engagement form data
+                dispatch(changeExpandedStatus({ expanded: false })); // Minimize chat widget
+            } catch (resetError) {
+                console.error('Error resetting chat:', resetError);
+            }
+        }
+    }, [conversation, conversationState, dispatch]);
+
+    const handleSkipRating = useCallback(async () => {
+        closeRatingModal();
+        await closeConversation();
+    }, [closeRatingModal, closeConversation]);
+
+    // eslint-disable-next-line consistent-return
+    const submitRating = useCallback(async (rating: number, feedback?: string): Promise<void> => {
+        if (!conversationSid) {
+            throw new Error('No conversation SID available');
+        }
+
+        setIsLoading(true);
+
+        try {
+            /*
+             * Get agent identity from participants
+             * Agent is the participant that is NOT the local participant (customer)
+             */
+            const localParticipantIdentity = (conversation as { localParticipant?: { identity?: string } }).localParticipant?.identity;
+            const agentParticipant = participants?.find(p => p.identity !== localParticipantIdentity);
+            const agentIdentity = agentParticipant?.identity;
+
+            // Get agent name from users array
+            const agentUser = users?.find(u => u.identity === agentIdentity);
+            const agentName = agentUser?.friendlyName || agentIdentity || "";
+
+            // Get worker attributes if available (stored when agent joined)
+            const workerAttributes = (agentParticipant as ParticipantWithWorkerAttributes)?.workerAttributes;
+            const agentEmail = workerAttributes?.workerEmail || "";
+            const workerSid = workerAttributes?.workerSid || "";
+
+            // Get customer email from the local participant's friendlyName
+            const customerEmail = localParticipantIdentity; // The local participant identity is the customer email
+
+            console.log('🔍 Rating data collection:', {
+                localParticipantIdentity,
+                agentParticipant: agentParticipant?.identity,
+                agentIdentity,
+                agentName,
+                agentEmail,
+                workerSid,
+                customerEmail,
+                participantsCount: participants?.length,
+                usersCount: users?.length,
+                hasWorkerAttributes: Boolean(workerAttributes)
+            });
+
+            const ratingData: RatingSubmission = {
+                conversationSid,
+                rating,
+                feedback,
+                customerEmail,
+                agentIdentity,
+                agentName, // Add agent name to rating data
+                agentEmail, // Add agent email from worker attributes
+                workerSid, // Add worker SID for reference
+                closureType: 'customer_closed', // Updated to reflect customer closure
+                timestamp: new Date(),
+            };
+
+            const success = await ratingService.submitRating(ratingData);
+            
+            if (success) {
+                setHasRated(true);
+                setShowRatingModal(false);
+                await closeConversation(); // Close conversation after successful rating
+            } else {
+                throw new Error('Failed to submit rating');
+            }
+        } catch (error) {
+            console.error('Error submitting rating:', error);
+            throw error;
+        } finally {
+            setIsLoading(false);
+        }
+    }, [conversationSid, participants, users, closeConversation]);
+
+    return {
+        showRatingModal,
+        isLoading,
+        hasRated,
+        openRatingModal,
+        closeRatingModal,
+        submitRating,
+        handleSkipRating,
+    };
+};
diff --git a/src/services/ratingService.ts b/src/services/ratingService.ts
new file mode 100644
index 00000000..85560e26
--- /dev/null
+++ b/src/services/ratingService.ts
@@ -0,0 +1,73 @@
+/* eslint-disable @typescript-eslint/member-ordering */
+interface RatingSubmission {
+    conversationSid: string;
+    rating: number;
+    feedback?: string;
+    customerEmail?: string;
+    agentIdentity?: string;
+    agentName?: string; // Add agent name field
+    agentEmail?: string; // Add agent email field
+    workerSid?: string; // Add worker SID field
+    closureType: 'agent_closed' | 'customer_closed';
+    timestamp: Date;
+}
+
+class RatingService {
+    private serverUrl: string;
+
+    constructor() {
+        this.serverUrl = process.env.REACT_APP_SERVER_URL || 'http://localhost:3002';
+    }
+
+    /**
+     * Submit a service rating
+     */
+    async submitRating(ratingData: RatingSubmission): Promise<boolean> {
+        try {
+            const response = await fetch(`${this.serverUrl}/submitRating`, {
+                method: 'POST',
+                headers: {
+                    'Content-Type': 'application/json',
+                },
+                body: JSON.stringify(ratingData),
+            });
+
+            if (!response.ok) {
+                throw new Error(`HTTP error! status: ${response.status}`);
+            }
+
+            const result = await response.json();
+            return result.success === true;
+        } catch (error) {
+            console.error('Error submitting rating:', error);
+            throw error;
+        }
+    }
+
+    /**
+     * Check if a conversation has already been rated
+     */
+    async hasBeenRated(conversationSid: string): Promise<boolean> {
+        try {
+            const response = await fetch(`${this.serverUrl}/hasBeenRated?conversationSid=${conversationSid}`, {
+                method: 'GET',
+                headers: {
+                    'Content-Type': 'application/json',
+                },
+            });
+
+            if (!response.ok) {
+                throw new Error(`HTTP error! status: ${response.status}`);
+            }
+
+            const result = await response.json();
+            return result.hasBeenRated === true;
+        } catch (error) {
+            console.error('Error checking rating status:', error);
+            return false; // Default to false if we can't check
+        }
+    }
+}
+
+export const ratingService = new RatingService();
+export type { RatingSubmission };
diff --git a/src/store/actions/listeners/__tests__/participantsListener.test.ts b/src/store/actions/listeners/__tests__/participantsListener.test.ts
index 934b2e85..0d8ac4a7 100644
--- a/src/store/actions/listeners/__tests__/participantsListener.test.ts
+++ b/src/store/actions/listeners/__tests__/participantsListener.test.ts
@@ -67,12 +67,22 @@ describe("initParticipantsListener", () => {
         });
     });
 
-    it('adds a listener for the "participantLeft" event', () => {
+    it('adds a listener for the "participantLeft" event', async () => {
         const dispatch = jest.fn();
+        
+        // Mock the conversation's localParticipant to simulate a customer
+        (conversation as any).localParticipant = { identity: 'customer@example.com' };
+        
+        // Mock the user identity to simulate an agent
+        (user as any).identity = 'agent@example.com';
 
         initParticipantsListener(conversation, dispatch);
         conversation.emit("participantLeft", participant);
-        expect(dispatch).toHaveBeenCalledTimes(1);
+        
+        await waitFor(() => {
+            expect(dispatch).toHaveBeenCalledTimes(1);
+        });
+        
         expect(dispatch).toHaveBeenCalledWith({
             type: ACTION_REMOVE_PARTICIPANT,
             payload: expect.objectContaining({ participant })
diff --git a/src/store/actions/listeners/conversationListener.ts b/src/store/actions/listeners/conversationListener.ts
index 4fd9a261..3489f3e2 100644
--- a/src/store/actions/listeners/conversationListener.ts
+++ b/src/store/actions/listeners/conversationListener.ts
@@ -7,10 +7,32 @@ export const initConversationListener = (conversation: Conversation, dispatch: D
     conversation.addListener("updated", ({ conversation: updatedConversation, updateReasons }) => {
         // we are listening only to a subset of events.
         if (updateReasons?.includes("state")) {
+            const newState = updatedConversation?.state?.current;
+            const previousState = conversation.state?.current;
+            
+            console.log('🔄 Conversation state change detected:', {
+                previousState,
+                newState,
+                updateReasons,
+                conversationSid: conversation.sid
+            });
+            
+            // Detect when conversation is closed by agent
+            if (newState === "closed" || newState === "inactive") {
+                console.log(`🎯 Chat closed. New state: ${newState}`);
+                console.log(`📊 State transition: ${previousState} → ${newState}`);
+                /*
+                 * You can add custom logic here to handle chat closure
+                 * For example, show a notification to the customer
+                 */
+            }
+            
             dispatch({
                 type: ACTION_UPDATE_CONVERSATION_STATE,
-                payload: { conversationState: updatedConversation?.state?.current }
+                payload: { conversationState: newState }
             });
+            
+            console.log('✅ Conversation state updated in Redux store:', newState);
         }
     });
 };
diff --git a/src/store/actions/listeners/participantsListener.ts b/src/store/actions/listeners/participantsListener.ts
index f8ec4b24..69482118 100644
--- a/src/store/actions/listeners/participantsListener.ts
+++ b/src/store/actions/listeners/participantsListener.ts
@@ -1,18 +1,91 @@
 import { Conversation, Participant } from "@twilio/conversations";
 import { Dispatch } from "redux";
 
-import { ACTION_ADD_PARTICIPANT, ACTION_REMOVE_PARTICIPANT, ACTION_UPDATE_PARTICIPANT } from "../actionTypes";
+import { ACTION_ADD_PARTICIPANT, ACTION_REMOVE_PARTICIPANT, ACTION_UPDATE_PARTICIPANT, ACTION_UPDATE_CONVERSATION_STATE } from "../actionTypes";
 
 export const initParticipantsListener = (conversation: Conversation, dispatch: Dispatch) => {
     conversation.addListener("participantJoined", async (participant: Participant) => {
         const user = await participant.getUser();
+        
+        // Check if this is an agent (not the local participant/customer)
+        const localParticipantIdentity = (conversation as { localParticipant?: { identity?: string } }).localParticipant?.identity;
+        const isAgent = user.identity !== localParticipantIdentity;
+        
+        if (isAgent) {
+            console.log('🔄 Agent joined conversation:', {
+                agentIdentity: user.identity,
+                agentName: user.friendlyName,
+                conversationSid: conversation.sid
+            });
+            
+            // Try to fetch worker attributes from Flex
+            try {
+                const response = await fetch(`${process.env.REACT_APP_SERVER_URL || 'http://localhost:3002'}/getWorkerAttributes`, {
+                    method: 'POST',
+                    headers: {
+                        'Content-Type': 'application/json',
+                    },
+                    body: JSON.stringify({
+                        agentIdentity: user.identity
+                    }),
+                });
+                
+                if (response.ok) {
+                    const workerData = await response.json();
+                    console.log('✅ Worker attributes fetched:', workerData);
+                    
+                    // Store worker attributes in participant attributes for later use
+                    const participantWithWorkerData = {
+                        ...participant,
+                        workerAttributes: workerData
+                    };
+                    
+                    dispatch({
+                        type: ACTION_ADD_PARTICIPANT,
+                        payload: { participant: participantWithWorkerData, user }
+                    });
+                    return;
+                }
+            } catch (error) {
+                console.error('❌ Error fetching worker attributes:', error);
+            }
+        }
+        
+        // Default dispatch for customer or if worker fetch fails
         dispatch({
             type: ACTION_ADD_PARTICIPANT,
             payload: { participant, user }
         });
     });
 
-    conversation.addListener("participantLeft", (participant: Participant) => {
+    conversation.addListener("participantLeft", async (participant: Participant) => {
+        // Get participant details
+        const user = await participant.getUser();
+        const localParticipantIdentity = (conversation as { localParticipant?: { identity?: string } }).localParticipant?.identity;
+        const isAgent = user.identity !== localParticipantIdentity;
+        
+        console.log('🔄 Participant left conversation:', {
+            participantIdentity: user.identity,
+            localParticipantIdentity,
+            isAgent,
+            conversationSid: conversation.sid
+        });
+        
+        // Check if conversation is actually ending (no remaining participants)
+        const remainingParticipants = await conversation.getParticipants();
+        console.log('📊 Remaining participants after leave:', remainingParticipants.length);
+        
+        if (remainingParticipants.length === 0) {
+            // Conversation is actually ending - trigger rating modal
+            console.log('🎯 Conversation ending (no remaining participants) - triggering conversation state change to closed');
+            dispatch({
+                type: ACTION_UPDATE_CONVERSATION_STATE,
+                payload: { conversationState: 'closed' }
+            });
+        } else {
+            console.log('ℹ️ Conversation continuing (participants remain) - not triggering rating modal');
+        }
+        
         dispatch({
             type: ACTION_REMOVE_PARTICIPANT,
             payload: { participant }
diff --git a/src/utils/chatClosureDetector.test.ts b/src/utils/chatClosureDetector.test.ts
new file mode 100644
index 00000000..7063854c
--- /dev/null
+++ b/src/utils/chatClosureDetector.test.ts
@@ -0,0 +1,134 @@
+import { ChatClosureDetector, ChatClosureEvent } from './chatClosureDetector';
+import { Conversation, Participant } from '@twilio/conversations';
+
+// Mock the Conversation class
+jest.mock('@twilio/conversations', () => ({
+    Conversation: jest.fn(),
+    Participant: jest.fn()
+}));
+
+describe('ChatClosureDetector', () => {
+    let detector: ChatClosureDetector;
+    let mockConversation: jest.Mocked<Conversation>;
+    let mockParticipant: jest.Mocked<Participant>;
+
+    beforeEach(() => {
+        mockConversation = {
+            addListener: jest.fn(),
+            removeAllListeners: jest.fn(),
+            state: { current: 'active' },
+            localParticipant: { identity: 'customer@example.com' }
+        } as any;
+
+        mockParticipant = {
+            getUser: jest.fn()
+        } as any;
+
+        detector = new ChatClosureDetector(mockConversation);
+    });
+
+    afterEach(() => {
+        jest.clearAllMocks();
+    });
+
+    describe('onChatClosed', () => {
+        it('should add callback to the list', () => {
+            const callback = jest.fn();
+            detector.onChatClosed(callback);
+            
+            // Trigger a callback manually to test
+            const event: ChatClosureEvent = {
+                type: 'conversation_closed',
+                timestamp: new Date(),
+                reason: 'test'
+            };
+            
+            // Access private method for testing
+            (detector as any).triggerCallbacks(event);
+            
+            expect(callback).toHaveBeenCalledWith(event);
+        });
+    });
+
+    describe('offChatClosed', () => {
+        it('should remove callback from the list', () => {
+            const callback = jest.fn();
+            detector.onChatClosed(callback);
+            detector.offChatClosed(callback);
+            
+            // Trigger a callback manually to test
+            const event: ChatClosureEvent = {
+                type: 'conversation_closed',
+                timestamp: new Date(),
+                reason: 'test'
+            };
+            
+            // Access private method for testing
+            (detector as any).triggerCallbacks(event);
+            
+            expect(callback).not.toHaveBeenCalled();
+        });
+    });
+
+    describe('startListening', () => {
+        it('should add conversation listeners', () => {
+            detector.startListening();
+            
+            expect(mockConversation.addListener).toHaveBeenCalledWith('updated', expect.any(Function));
+            expect(mockConversation.addListener).toHaveBeenCalledWith('participantLeft', expect.any(Function));
+        });
+
+        it('should not add listeners if already listening', () => {
+            detector.startListening();
+            detector.startListening();
+            
+            // Should only be called once for each event
+            expect(mockConversation.addListener).toHaveBeenCalledTimes(2);
+        });
+    });
+
+    describe('stopListening', () => {
+        it('should remove all listeners', () => {
+            detector.startListening();
+            detector.stopListening();
+            
+            expect(mockConversation.removeAllListeners).toHaveBeenCalled();
+        });
+    });
+
+    describe('isChatClosed', () => {
+        it('should return true when conversation is closed', () => {
+            Object.defineProperty(mockConversation, 'state', {
+                value: { current: 'closed' },
+                writable: true
+            });
+            expect(detector.isChatClosed()).toBe(true);
+        });
+
+        it('should return true when conversation is inactive', () => {
+            Object.defineProperty(mockConversation, 'state', {
+                value: { current: 'inactive' },
+                writable: true
+            });
+            expect(detector.isChatClosed()).toBe(false);
+        });
+
+        it('should return false when conversation is active', () => {
+            Object.defineProperty(mockConversation, 'state', {
+                value: { current: 'active' },
+                writable: true
+            });
+            expect(detector.isChatClosed()).toBe(false);
+        });
+    });
+
+    describe('getConversationState', () => {
+        it('should return current conversation state', () => {
+            Object.defineProperty(mockConversation, 'state', {
+                value: { current: 'closed' },
+                writable: true
+            });
+            expect(detector.getConversationState()).toBe('closed');
+        });
+    });
+});
diff --git a/src/utils/chatClosureDetector.ts b/src/utils/chatClosureDetector.ts
new file mode 100644
index 00000000..e3c59b56
--- /dev/null
+++ b/src/utils/chatClosureDetector.ts
@@ -0,0 +1,124 @@
+import { Conversation, Participant } from "@twilio/conversations";
+
+export interface ChatClosureEvent {
+    type: 'conversation_closed' | 'agent_left' | 'conversation_inactive';
+    timestamp: Date;
+    agentIdentity?: string;
+    reason?: string;
+}
+
+export type ChatClosureCallback = (event: ChatClosureEvent) => void;
+
+/**
+ * Utility to detect when a chat is closed by an agent
+ */
+export class ChatClosureDetector {
+    private conversation: Conversation;
+    private callbacks: ChatClosureCallback[] = [];
+    private isListening = false;
+
+    constructor(conversation: Conversation) {
+        this.conversation = conversation;
+    }
+
+    /**
+     * Add a callback to be notified when the chat is closed
+     */
+    onChatClosed(callback: ChatClosureCallback): void {
+        this.callbacks.push(callback);
+    }
+
+    /**
+     * Remove a callback
+     */
+    offChatClosed(callback: ChatClosureCallback): void {
+        const index = this.callbacks.indexOf(callback);
+        if (index > -1) {
+            this.callbacks.splice(index, 1);
+        }
+    }
+
+    /**
+     * Start listening for chat closure events
+     */
+    startListening(): void {
+        if (this.isListening) return;
+        
+        this.isListening = true;
+
+        // Listen for conversation state changes
+        this.conversation.addListener("updated", ({ conversation: updatedConversation, updateReasons }) => {
+            if (updateReasons?.includes("state")) {
+                const newState = updatedConversation?.state?.current;
+                
+                if (newState === "closed") {
+                    this.triggerCallbacks({
+                        type: 'conversation_closed',
+                        timestamp: new Date(),
+                        reason: 'Conversation was closed by agent'
+                    });
+                } else if (newState === "inactive") {
+                    this.triggerCallbacks({
+                        type: 'conversation_inactive',
+                        timestamp: new Date(),
+                        reason: 'Conversation became inactive'
+                    });
+                }
+            }
+        });
+
+        // Listen for agent leaving
+        this.conversation.addListener("participantLeft", async (participant: Participant) => {
+            try {
+                const user = await participant.getUser();
+                const isAgent = user.identity !== (this.conversation as { localParticipant?: { identity?: string } }).localParticipant?.identity;
+                
+                if (isAgent) {
+                    this.triggerCallbacks({
+                        type: 'agent_left',
+                        timestamp: new Date(),
+                        agentIdentity: user.identity,
+                        reason: 'Agent left the conversation'
+                    });
+                }
+            } catch (error) {
+                console.error('Error detecting agent leaving:', error);
+            }
+        });
+    }
+
+    /**
+     * Stop listening for chat closure events
+     */
+    stopListening(): void {
+        if (!this.isListening) return;
+        
+        this.isListening = false;
+        this.conversation.removeAllListeners();
+    }
+
+    /**
+     * Check if the conversation is currently closed
+     */
+    isChatClosed(): boolean {
+        const state = this.conversation.state?.current;
+        return state === "closed" || state === "inactive";
+    }
+
+    /**
+     * Get the current conversation state
+     */
+    getConversationState(): string | undefined {
+        return this.conversation.state?.current;
+    }
+
+    private triggerCallbacks(event: ChatClosureEvent): void {
+        this.callbacks.forEach(callback => {
+            try {
+                callback(event);
+            } catch (error) {
+                console.error('Error in chat closure callback:', error);
+            }
+        });
+    }
+}

From 31ef9d28e5aaf1773d058a35c67e327c71b48433 Mon Sep 17 00:00:00 2001
From: GarethF531 <167188366+GarethF531@users.noreply.github.com>
Date: Tue, 2 Sep 2025 12:25:05 +0200
Subject: [PATCH 05/48] Docker Wroking

---
 .dockerignore                           |  14 +--
 .eslintrc                               |   1 +
 DOCKER.md                               | 113 ++++++++++++++++++++++++
 Dockerfile.client                       |  27 ++++++
 Dockerfile.server                       |  27 ++++++
 cypress/plugins/helpers/twilioClient.ts |   6 +-
 docker-compose.yml                      |  57 ++++++++++++
 package.json                            |  12 ++-
 server/helpers/getTwilioClient.js       |   7 +-
 server/index.js                         |  11 +++
 src/services/ratingService.ts           |   1 -
 11 files changed, 260 insertions(+), 16 deletions(-)
 create mode 100644 DOCKER.md
 create mode 100644 Dockerfile.client
 create mode 100644 Dockerfile.server
 create mode 100644 docker-compose.yml

diff --git a/.dockerignore b/.dockerignore
index 44c0ccad..3ad96a21 100644
--- a/.dockerignore
+++ b/.dockerignore
@@ -1,5 +1,7 @@
 node_modules
 npm-debug.log
+yarn-debug.log
+yarn-error.log
 .git
 .gitignore
 README.md
@@ -9,20 +11,12 @@ coverage
 .nyc_output
 .coverage
 .cache
-.parcel-cache
+build
+dist
 .DS_Store
 *.log
-cypress
-cypress.json
-cypress.env.sample.json
-.cypress
 .vscode
 .idea
 *.swp
 *.swo
 *~
-terraform
-*.tfstate
-*.tfstate.backup
-.terraform
-.terraform.lock.hcl
diff --git a/.eslintrc b/.eslintrc
index 7d0683a3..34c93f26 100644
--- a/.eslintrc
+++ b/.eslintrc
@@ -34,6 +34,7 @@
     "@typescript-eslint/no-floating-promises": "off",
     "@typescript-eslint/no-shadow": ["error"],
     "@typescript-eslint/no-unused-vars": "error",
+    "@typescript-eslint/member-ordering": "off",
     "import/no-duplicates": ["error"],
     "spaced-comment": "warn",
     "prefer-named-capture-group": "off"
diff --git a/DOCKER.md b/DOCKER.md
new file mode 100644
index 00000000..e64a3648
--- /dev/null
+++ b/DOCKER.md
@@ -0,0 +1,113 @@
+# Docker Setup for Twilio Webchat Widget
+
+This project includes Docker configuration to run both the server and client applications in separate containers.
+
+## Prerequisites
+
+- Docker installed on your system
+- Docker Compose installed
+- `.env` file with your environment variables
+
+## Quick Start
+
+### Option 1: Using Docker Compose (Recommended)
+
+Start both services at once:
+```bash
+yarn docker:up
+```
+
+Stop both services:
+```bash
+yarn docker:down
+```
+
+View logs:
+```bash
+yarn docker:logs
+```
+
+### Option 2: Using Individual Docker Commands
+
+#### Server Only
+```bash
+# Build and run server
+yarn docker:server
+
+# Or build and run separately
+yarn docker:server:build
+yarn docker:server:run
+```
+
+#### Client Only
+```bash
+# Build and run client
+yarn docker:client
+
+# Or build and run separately
+yarn docker:client:build
+yarn docker:client:run
+```
+
+## Available Scripts
+
+| Script | Description |
+|--------|-------------|
+| `yarn docker:server` | Build and run server container |
+| `yarn docker:client` | Build and run client container |
+| `yarn docker:server:build` | Build server container only |
+| `yarn docker:client:build` | Build client container only |
+| `yarn docker:server:run` | Run existing server container |
+| `yarn docker:client:run` | Run existing client container |
+| `yarn docker:up` | Start both services with Docker Compose |
+| `yarn docker:down` | Stop both services |
+| `yarn docker:build` | Build both containers |
+| `yarn docker:logs` | View logs from both services |
+
+## Ports
+
+- **Client**: http://localhost:3000
+- **Server**: http://localhost:3002
+
+## Development Features
+
+### Hot Reload
+Both containers include volume mounts for hot reloading during development:
+- Server changes in `./server/` will trigger nodemon restart
+- Client changes in `./src/` will trigger React development server reload
+
+### Environment Variables
+The containers will use your `.env` file for environment variables. Make sure to create this file with your Twilio credentials and other configuration.
+
+## Production Build
+
+For production, you can modify the Dockerfiles to build the React app and serve it from the Express server:
+
+1. Build the React app: `yarn build`
+2. Serve static files from the Express server
+3. Use a single container for both client and server
+
+## Troubleshooting
+
+### Port Already in Use
+If you get port conflicts, make sure no other services are running on ports 3000 or 3002:
+```bash
+# Stop existing containers
+yarn docker:down
+
+# Kill any processes using the ports
+lsof -ti:3000 | xargs kill -9
+lsof -ti:3002 | xargs kill -9
+```
+
+### Environment Variables
+Ensure your `.env` file contains all required variables:
+- Twilio Account SID
+- Twilio Auth Token
+- Workspace SID
+- Workflow SID
+- Other configuration variables
+
+### Container Networking
+The containers are connected via a Docker network called `twilio-widget-network`. The client can reach the server at `http://server:3002` within the Docker network.
+
diff --git a/Dockerfile.client b/Dockerfile.client
new file mode 100644
index 00000000..bab0bd92
--- /dev/null
+++ b/Dockerfile.client
@@ -0,0 +1,27 @@
+# Use Node.js 18 Alpine for smaller image size
+FROM node:18-alpine
+
+# Set working directory
+WORKDIR /app
+
+# Copy package files
+COPY package.json yarn.lock ./
+
+# Install dependencies
+RUN yarn install --frozen-lockfile --production=false
+
+# Copy source code
+COPY public/ ./public/
+COPY src/ ./src/
+COPY tsconfig.json ./
+COPY config-overrides.js ./
+
+# Expose port
+EXPOSE 3000
+
+# Set environment variables
+ENV NODE_ENV=development
+ENV PORT=3000
+
+# Start the React development server
+CMD ["yarn", "start", "--host", "0.0.0.0"]
diff --git a/Dockerfile.server b/Dockerfile.server
new file mode 100644
index 00000000..7d7f658a
--- /dev/null
+++ b/Dockerfile.server
@@ -0,0 +1,27 @@
+# Use Node.js 18 Alpine for smaller image size
+FROM node:18-alpine
+
+# Set working directory
+WORKDIR /app
+
+# Copy package files
+COPY package.json yarn.lock ./
+
+# Install dependencies
+RUN yarn install --frozen-lockfile --production=false
+
+# Copy server source code
+COPY server/ ./server/
+COPY scripts/ ./scripts/
+
+# Create build directory for static files
+RUN mkdir -p build
+
+# Expose port
+EXPOSE 3002
+
+# Set environment variables
+ENV NODE_ENV=development
+
+# Start the server
+CMD ["yarn", "server"]
diff --git a/cypress/plugins/helpers/twilioClient.ts b/cypress/plugins/helpers/twilioClient.ts
index 2dc120d5..3fe6ef7e 100644
--- a/cypress/plugins/helpers/twilioClient.ts
+++ b/cypress/plugins/helpers/twilioClient.ts
@@ -7,6 +7,10 @@ export const getTwilioClient = () => {
         return twilioClient;
     }
 
-    twilioClient = new Twilio(process.env.ACCOUNT_SID!, process.env.AUTH_TOKEN!);
+    twilioClient = new Twilio(
+        process.env.API_KEY!, 
+        process.env.API_SECRET!,
+        { accountSid: process.env.ACCOUNT_SID! }
+    );
     return twilioClient;
 };
diff --git a/docker-compose.yml b/docker-compose.yml
new file mode 100644
index 00000000..1ac09f98
--- /dev/null
+++ b/docker-compose.yml
@@ -0,0 +1,57 @@
+services:
+  server:
+    build:
+      context: .
+      dockerfile: Dockerfile.server
+    ports:
+      - "3002:3002"
+    environment:
+      - NODE_ENV=development
+      # Explicitly set key environment variables
+      - ACCOUNT_SID=${ACCOUNT_SID}
+      - API_KEY=${API_KEY}
+      - API_SECRET=${API_SECRET}
+      - CONVERSATIONS_SERVICE_SID=${CONVERSATIONS_SERVICE_SID}
+      - TASKROUTER_WORKSPACE_SID=${TASKROUTER_WORKSPACE_SID}
+      - TASKROUTER_WORKFLOW_SID=${TASKROUTER_WORKFLOW_SID}
+      - STUDIO_FLOW_SID=${STUDIO_FLOW_SID}
+      - WORKSPACE_SID=${WORKSPACE_SID}
+      - RATING_WORKFLOW_SID=${RATING_WORKFLOW_SID}
+      - ALLOWED_ORIGINS=${ALLOWED_ORIGINS}
+      - SENDGRID_API_KEY=${SENDGRID_API_KEY}
+      - FROM_EMAIL=${FROM_EMAIL}
+    env_file:
+      - .env
+    volumes:
+      # Mount source code for development (hot reload)
+      - ./server:/app/server
+      - ./scripts:/app/scripts
+    networks:
+      - twilio-widget-network
+
+  client:
+    build:
+      context: .
+      dockerfile: Dockerfile.client
+    ports:
+      - "3000:3000"
+    environment:
+      - NODE_ENV=development
+      - PORT=3000
+      - REACT_APP_SERVER_URL=http://localhost:3002
+    env_file:
+      - .env
+    volumes:
+      # Mount source code for development (hot reload)
+      - ./src:/app/src
+      - ./public:/app/public
+      - ./tsconfig.json:/app/tsconfig.json
+      - ./config-overrides.js:/app/config-overrides.js
+    depends_on:
+      - server
+    networks:
+      - twilio-widget-network
+
+networks:
+  twilio-widget-network:
+    driver: bridge
diff --git a/package.json b/package.json
index a2db70c4..148ac47e 100644
--- a/package.json
+++ b/package.json
@@ -72,7 +72,17 @@
     "bootstrap": "node scripts/bootstrap",
     "e2eCleanupExistingTasks": "node scripts/e2eCleanupExistingTasks",
     "deploy": "yarn build && node scripts/deploy",
-    "eject": "react-app-rewired eject"
+    "eject": "react-app-rewired eject",
+    "docker:server": "docker build -f Dockerfile.server -t twilio-widget-server . && docker run -p 3002:3002 --env-file .env twilio-widget-server",
+    "docker:client": "docker build -f Dockerfile.client -t twilio-widget-client . && docker run -p 3000:3000 --env-file .env twilio-widget-client",
+    "docker:server:build": "docker build -f Dockerfile.server -t twilio-widget-server .",
+    "docker:client:build": "docker build -f Dockerfile.client -t twilio-widget-client .",
+    "docker:server:run": "docker run -p 3002:3002 --env-file .env twilio-widget-server",
+    "docker:client:run": "docker run -p 3000:3000 --env-file .env twilio-widget-client",
+    "docker:up": "docker-compose up",
+    "docker:down": "docker-compose down",
+    "docker:build": "docker-compose build",
+    "docker:logs": "docker-compose logs -f"
   },
   "browserslist": [
     ">0.2%",
diff --git a/server/helpers/getTwilioClient.js b/server/helpers/getTwilioClient.js
index 099c508f..fe57cb9a 100644
--- a/server/helpers/getTwilioClient.js
+++ b/server/helpers/getTwilioClient.js
@@ -7,10 +7,11 @@ const getTwilioClient = () => {
         return twilioClient;
     }
 
-    // Use staging credentials which are properly configured
+    // Use API Key authentication
     const newClient = new Twilio(
-        process.env.TWILIO_ACCOUNT_SID_STAGING || process.env.ACCOUNT_SID, 
-        process.env.TWILIO_AUTH_TOKEN_STAGING || process.env.AUTH_TOKEN
+        process.env.API_KEY, 
+        process.env.API_SECRET,
+        { accountSid: process.env.ACCOUNT_SID }
     );
 
     twilioClient = newClient;
diff --git a/server/index.js b/server/index.js
index 9711c11f..4a9add36 100644
--- a/server/index.js
+++ b/server/index.js
@@ -2,6 +2,17 @@ require("dotenv").config();
 const express = require("express");
 const path = require("path");
 
+// Debug: Log key environment variables
+console.log("Environment Variables Debug:");
+console.log("ACCOUNT_SID:", process.env.ACCOUNT_SID ? "SET" : "NOT SET");
+console.log("API_KEY:", process.env.API_KEY ? "SET" : "NOT SET");
+console.log("API_SECRET:", process.env.API_SECRET ? "SET" : "NOT SET");
+console.log("CONVERSATIONS_SERVICE_SID:", process.env.CONVERSATIONS_SERVICE_SID ? "SET" : "NOT SET");
+console.log("TASKROUTER_WORKSPACE_SID:", process.env.TASKROUTER_WORKSPACE_SID ? "SET" : "NOT SET");
+console.log("WORKSPACE_SID:", process.env.WORKSPACE_SID ? "SET" : "NOT SET");
+console.log("SENDGRID_API_KEY:", process.env.SENDGRID_API_KEY ? "SET" : "NOT SET");
+console.log("NODE_ENV:", process.env.NODE_ENV);
+
 const { validateRequestOriginMiddleware } = require("./middlewares/validateRequestOriginMiddleware");
 const { initWebchatController } = require("./controllers/initWebchatController");
 const { refreshTokenController } = require("./controllers/refreshTokenController");
diff --git a/src/services/ratingService.ts b/src/services/ratingService.ts
index 85560e26..c520496d 100644
--- a/src/services/ratingService.ts
+++ b/src/services/ratingService.ts
@@ -1,4 +1,3 @@
-/* eslint-disable @typescript-eslint/member-ordering */
 interface RatingSubmission {
     conversationSid: string;
     rating: number;

From 3870d8faee2dd5a6aa78fb50266b3c3d654f1420 Mon Sep 17 00:00:00 2001
From: GarethF531 <167188366+GarethF531@users.noreply.github.com>
Date: Tue, 2 Sep 2025 12:43:45 +0200
Subject: [PATCH 06/48] Terraform

Updated terraform to create separate ecs instances for client and server
---
 server/controllers/ratingController.js        |   1 -
 terraform/README.md                           | 183 ++++++++----------
 terraform/datadog_monitor.tf                  |   4 +-
 terraform/ecr_repository.tf                   |  10 +-
 terraform/env/production.tfvars               |   2 +
 terraform/env/staging.tfvars                  |   2 +
 terraform/env/testing.tfvars                  |   4 +-
 terraform/locals.tf                           |   4 +
 terraform/variables.tf                        |  22 +++
 ...hat-widget.tf => webchat-widget-client.tf} |  33 ++--
 ...{video-app.tf => webchat-widget-server.tf} |  19 +-
 11 files changed, 151 insertions(+), 133 deletions(-)
 rename terraform/{webchat-widget.tf => webchat-widget-client.tf} (59%)
 rename terraform/{video-app.tf => webchat-widget-server.tf} (78%)

diff --git a/server/controllers/ratingController.js b/server/controllers/ratingController.js
index 88fff677..71313332 100644
--- a/server/controllers/ratingController.js
+++ b/server/controllers/ratingController.js
@@ -54,7 +54,6 @@ const createRatingLogTask = async (ratingData) => {
         return false;
     }
 };
-
 /**
  * Submit a service rating
  */
diff --git a/terraform/README.md b/terraform/README.md
index e9ba55f2..7f2ed1f4 100644
--- a/terraform/README.md
+++ b/terraform/README.md
@@ -1,124 +1,109 @@
-# Twilio Webchat Widget - Terraform Deployment
+# Twilio Webchat Widget Terraform Configuration
 
-This directory contains the Terraform configuration for deploying the Twilio Webchat Widget to AWS ECS.
+This Terraform configuration deploys the Twilio Webchat Widget as two separate ECS services:
 
-## Overview
+## Architecture
+
+### Services
+1. **Webchat Server** (`webchat-widget-server.tf`)
+   - Express.js backend API
+   - Port: 3002
+   - Health check: `/initWebchat`
+   - Handles Twilio Conversations, TaskRouter, and rating functionality
+
+2. **Webchat Client** (`webchat-widget-client.tf`)
+   - React frontend application
+   - Port: 3000
+   - Health check: `/`
+   - Serves the webchat widget interface
 
-The deployment consists of:
-- **ECS Fargate Service**: Runs the webchat widget container
-- **Application Load Balancer**: Provides HTTP/HTTPS access
-- **ECR Repository**: Stores Docker images
-- **Secrets Manager**: Stores Twilio credentials
-- **Datadog Monitoring**: Error logs, CPU, and memory monitoring
+### Networking
+- **Server Internal FQDN**: `webchat-widget-server-internal.anyvan.com`
+- **Client Internal FQDN**: `webchat-widget-client-internal.anyvan.com`
+- **Client → Server Communication**: Client connects to server via internal FQDN
 
-## Prerequisites
+## Deployment
 
-1. AWS CLI configured with appropriate credentials
-2. Terraform installed (version ~>1.9.5)
-3. Docker installed for building images
-4. Access to the Anyvan AWS accounts
+### Prerequisites
+- AWS CLI configured with appropriate profile
+- Terraform installed
+- Docker images built and pushed to ECR
 
-## Environment Configuration
+### Environment Variables Required
+- `server_container_image_url`: ECR URL for server container
+- `client_container_image_url`: ECR URL for client container
+- `server_internal_fqdn`: Internal FQDN for server service
+- `client_internal_fqdn`: Internal FQDN for client service
 
-The deployment supports three environments:
+### Commands
 
-### Production
+#### Production
 ```bash
-terraform workspace select production
+cd terraform
+terraform init
 terraform plan -var-file=env/production.tfvars
 terraform apply -var-file=env/production.tfvars
 ```
 
-### Staging
+#### Staging
 ```bash
-terraform workspace select staging
+cd terraform
+terraform init
 terraform plan -var-file=env/staging.tfvars
 terraform apply -var-file=env/staging.tfvars
 ```
 
-### Testing (PR environments)
+#### Testing (PR Environment)
 ```bash
-terraform workspace select testing-<jira-ticket>
-terraform plan -var-file=env/testing.tfvars -var="jira_ticket_number=<jira-ticket>"
-terraform apply -var-file=env/testing.tfvars -var="jira_ticket_number=<jira-ticket>"
+cd terraform
+terraform init
+terraform plan -var-file=env/testing.tfvars
+terraform apply -var-file=env/testing.tfvars
 ```
 
-## Deployment Process
-
-1. **Build and Push Docker Image**:
-   ```bash
-   # Set environment variables
-   export ENVIRONMENT=production
-   export ECR_REPOSITORY_NAME=twilio-webchat-widget/prod
-   export GIT_SHA=$(git rev-parse HEAD)
-   
-   # Run deployment script
-   node scripts/deploy.js
-   ```
-
-2. **Deploy Infrastructure**:
-   ```bash
-   cd terraform
-   terraform init
-   terraform plan -var-file=env/production.tfvars -var="git_sha=$GIT_SHA"
-   terraform apply -var-file=env/production.tfvars -var="git_sha=$GIT_SHA"
-   ```
-
-## Configuration
+## Configuration Files
 
-### Environment Variables
+### Main Configuration
+- `webchat-widget-server.tf`: Server ECS service configuration
+- `webchat-widget-client.tf`: Client ECS service configuration
+- `variables.tf`: Variable definitions
+- `locals.tf`: Local variable calculations
+- `providers.tf`: Terraform provider configuration
 
-The following environment variables can be set in the `.tfvars` files:
-
-- `region`: AWS region (default: eu-west-1)
-- `env`: Environment name (production/staging/testing)
-- `profile`: AWS profile to use
-- `ecr_repository_name`: ECR repository name
-- `vpc_environment`: VPC environment to deploy into
-- `internal_fqdn`: Internal FQDN for the service
-- `external_fqdn`: External FQDN for the service
-- `fargate_task_cpu`: CPU allocation for the task
-- `fargate_task_memory`: Memory allocation for the task
-
-### Health Checks
-
-The service uses the `/initWebchat` endpoint for health checks, which is the main API endpoint for initializing webchat sessions.
+### Environment-Specific
+- `env/production.tfvars`: Production environment variables
+- `env/staging.tfvars`: Staging environment variables
+- `env/testing.tfvars`: Testing environment variables
 
 ### Monitoring
-
-The deployment includes Datadog monitoring for:
-- Error logs (threshold: 2 errors in 15 minutes)
-- CPU usage (threshold: 90%)
-- Memory usage (threshold: 90%)
-
-## Architecture
-
-```
-Internet → ALB → ECS Fargate → Webchat Widget Container (Port 3002)
-                                    ↓
-                            Secrets Manager (Twilio credentials)
-```
-
-## Troubleshooting
-
-### Common Issues
-
-1. **Health Check Failures**: Ensure the `/initWebchat` endpoint is responding correctly
-2. **Container Startup Issues**: Check container logs in CloudWatch
-3. **Secrets Access**: Verify the ECS task has access to the Twilio secrets in Secrets Manager
-
-### Logs
-
-- **Application Logs**: CloudWatch Logs group named after the service
-- **Datadog Logs**: Available in Datadog with service name `twilio-webchat-widget`
-
-### Scaling
-
-The service can be scaled by modifying the `desired_count` parameter in the ECS service configuration.
-
-## Security
-
-- The service runs in a private subnet
-- Access is controlled via ALB security groups
-- Twilio credentials are stored in AWS Secrets Manager
-- The container runs as a non-root user
+- `datadog_monitor.tf`: Datadog monitoring configuration
+- `datadog_dashboard.tf`: Datadog dashboard configuration
+- `datadog_service_definition.tf`: Datadog service definition
+
+## Container Images
+
+### Server Container
+- **Dockerfile**: `Dockerfile.server`
+- **Port**: 3002
+- **Environment**: Node.js with Express.js
+- **Features**: Twilio API integration, rating system, TaskRouter
+
+### Client Container
+- **Dockerfile**: `Dockerfile.client`
+- **Port**: 3000
+- **Environment**: Node.js with React
+- **Features**: Webchat widget UI, real-time messaging
+
+## Secrets Management
+- Twilio credentials stored in AWS Secrets Manager
+- Referenced via `data.aws_secretsmanager_secret.twilio-secrets.arn`
+
+## Monitoring
+- CPU and Memory monitoring for both services
+- Error log monitoring
+- Datadog integration for metrics and logs
+
+## Scaling
+- Both services use Fargate for serverless container management
+- CPU and Memory limits configurable per environment
+- Auto-scaling based on demand
diff --git a/terraform/datadog_monitor.tf b/terraform/datadog_monitor.tf
index b3223df7..34b5df50 100644
--- a/terraform/datadog_monitor.tf
+++ b/terraform/datadog_monitor.tf
@@ -30,7 +30,7 @@ module "cpu_monitor" {
   name               = "Anyvan ${var.webchat_widget_name} CPU usage monitor - ${local.environment_name}"
   message            = "CPU usage of ${var.webchat_widget_name} ${local.notification_channels}${var.env == "production" ? " | @${local.team}-engineers" : ""}"
   type               = "query alert"
-  query              = "avg(last_5m):avg:aws.ecs.service.cpuutilization{servicename:${module.app.service_name}} > 90"
+  query              = "avg(last_5m):avg:aws.ecs.service.cpuutilization{servicename:${module.webchat_server.service_name}} > 90"
   critical_threshold = 90
   notify_no_data     = true
   no_data_timeframe  = 20 // There is a 15+ mins delay in receiving ECS metrices on Datadog
@@ -50,7 +50,7 @@ module "memory_monitor" {
   name               = "Anyvan ${var.webchat_widget_name} Memory usage monitor - ${local.environment_name}"
   message            = "Memory usage of ${var.webchat_widget_name} ${local.notification_channels}${var.env == "production" ? " | @${local.team}-engineers" : ""}"
   type               = "query alert"
-  query              = "avg(last_5m):avg:aws.ecs.service.memory_utilization{servicename:${module.app.service_name}} > 90"
+  query              = "avg(last_5m):avg:aws.ecs.service.memory_utilization{servicename:${module.webchat_server.service_name}} > 90"
   critical_threshold = 90
   notify_no_data     = true
   no_data_timeframe  = 20 // There is a 15+ mins delay in receiving ECS metrices on Datadog
diff --git a/terraform/ecr_repository.tf b/terraform/ecr_repository.tf
index fa10748c..5fc61794 100644
--- a/terraform/ecr_repository.tf
+++ b/terraform/ecr_repository.tf
@@ -2,7 +2,7 @@ locals {
   ecr_keep_last_images_count = var.env == "production" ? 40 : 200
 }
 
-resource "aws_ecr_repository" "twilio_flex" {
+resource "aws_ecr_repository" "twilio_webchat_widget" {
   count    = var.create_ecr_repository ? 1 : 0
   name     = var.ecr_repository_name
   provider = aws.horizontal
@@ -16,9 +16,9 @@ resource "aws_ecr_repository" "twilio_flex" {
   tags = tomap({ "Name" = var.ecr_repository_name })
 }
 
-resource "aws_ecr_repository_policy" "twilio_flex" {
+resource "aws_ecr_repository_policy" "twilio_webchat_widget" {
   policy     = data.aws_iam_policy_document.allows_other_accounts_to_retrieve.json
-  repository = aws_ecr_repository.twilio_flex[0].name
+  repository = aws_ecr_repository.twilio_webchat_widget[0].name
   provider   = aws.horizontal
 }
 
@@ -63,8 +63,8 @@ data "aws_iam_policy_document" "allows_other_accounts_to_retrieve" {
   }
 }
 
-resource "aws_ecr_lifecycle_policy" "twilio_flex" {
-  repository = aws_ecr_repository.twilio_flex[0].name
+resource "aws_ecr_lifecycle_policy" "twilio_webchat_widget" {
+  repository = aws_ecr_repository.twilio_webchat_widget[0].name
 
   policy = templatefile("${path.module}/files/ecr_retention_policies.json", {
     countLastImages = local.ecr_keep_last_images_count
diff --git a/terraform/env/production.tfvars b/terraform/env/production.tfvars
index 50b58074..a3136839 100644
--- a/terraform/env/production.tfvars
+++ b/terraform/env/production.tfvars
@@ -7,6 +7,8 @@ vpc_environment     = "production"
 notify              = ["@slack-alerting-centralised"]
 internal_fqdn       = "webchat-widget-internal.anyvan.com"
 external_fqdn       = "webchat-widget.anyvan.com"
+server_internal_fqdn = "webchat-widget-server-internal.anyvan.com"
+client_internal_fqdn = "webchat-widget-client-internal.anyvan.com"
 fargate_task_cpu    = 512
 fargate_task_memory = 1024
 
diff --git a/terraform/env/staging.tfvars b/terraform/env/staging.tfvars
index 7faf936f..47492028 100644
--- a/terraform/env/staging.tfvars
+++ b/terraform/env/staging.tfvars
@@ -7,6 +7,8 @@ vpc_environment       = "staging"
 notify                = ["@slack-alerting-centralised"]
 internal_fqdn         = "stage-webchat-widget-internal.anyvan.com"
 external_fqdn         = "webchat-widget-stg.anyvan.com"
+server_internal_fqdn   = "stage-webchat-widget-server-internal.anyvan.com"
+client_internal_fqdn   = "stage-webchat-widget-client-internal.anyvan.com"
 fargate_task_cpu      = 256
 fargate_task_memory   = 512
 
diff --git a/terraform/env/testing.tfvars b/terraform/env/testing.tfvars
index fbe9f6d1..fff5427c 100644
--- a/terraform/env/testing.tfvars
+++ b/terraform/env/testing.tfvars
@@ -2,11 +2,13 @@ region                = "eu-west-1"
 env                   = "testing"
 prefix                = "test"
 profile               = "test1"
-ecr_repository_name   = "twilio-webchat-widget/testing"
+ecr_repository_name   = "twilio-webchat-widget/${local.environment_name}"
 vpc_environment       = "staging"
 notify                = ["@slack-alerting-centralised"]
 internal_fqdn         = "test-webchat-widget-internal-<jira-ticket-number>.anyvan.com"
 external_fqdn         = "webchat-widget-test-<jira-ticket-number>.anyvan.com"
+server_internal_fqdn   = "test-webchat-widget-server-internal-<jira-ticket-number>.anyvan.com"
+client_internal_fqdn   = "test-webchat-widget-client-internal-<jira-ticket-number>.anyvan.com"
 fargate_task_cpu      = 256
 fargate_task_memory   = 512
 
diff --git a/terraform/locals.tf b/terraform/locals.tf
index 4e6de6cf..deefc07f 100644
--- a/terraform/locals.tf
+++ b/terraform/locals.tf
@@ -21,4 +21,8 @@ locals {
 
   internal_fqdn = var.env == "testing" ? replace(var.internal_fqdn, "<jira-ticket-number>", var.jira_ticket_number) : var.internal_fqdn
   external_fqdn = var.env == "testing" ? replace(var.external_fqdn, "<jira-ticket-number>", var.jira_ticket_number) : var.external_fqdn
+  
+  # Server and Client specific FQDNs
+  server_internal_fqdn = var.env == "testing" ? replace(var.server_internal_fqdn, "<jira-ticket-number>", var.jira_ticket_number) : var.server_internal_fqdn
+  client_internal_fqdn = var.env == "testing" ? replace(var.client_internal_fqdn, "<jira-ticket-number>", var.jira_ticket_number) : var.client_internal_fqdn
 }
diff --git a/terraform/variables.tf b/terraform/variables.tf
index 5093b3a0..b90836ee 100644
--- a/terraform/variables.tf
+++ b/terraform/variables.tf
@@ -62,6 +62,16 @@ variable "application_container_image_url" {
   description = "URL of the application container image in ECR"
 }
 
+variable "server_container_image_url" {
+  type        = string
+  description = "URL of the server container image in ECR"
+}
+
+variable "client_container_image_url" {
+  type        = string
+  description = "URL of the client container image in ECR"
+}
+
 variable "aws_region" {
   type    = string
   default = "eu-west-1"
@@ -73,6 +83,18 @@ variable "internal_fqdn" {
   description = "Internal FQDN (private endpoint)"
 }
 
+variable "server_internal_fqdn" {
+  type        = string
+  default     = ""
+  description = "Server internal FQDN (private endpoint)"
+}
+
+variable "client_internal_fqdn" {
+  type        = string
+  default     = ""
+  description = "Client internal FQDN (private endpoint)"
+}
+
 variable "external_fqdn" {
   type        = string
   description = "External FQDN (public endpoint)"
diff --git a/terraform/webchat-widget.tf b/terraform/webchat-widget-client.tf
similarity index 59%
rename from terraform/webchat-widget.tf
rename to terraform/webchat-widget-client.tf
index 6f3947b0..868552ab 100644
--- a/terraform/webchat-widget.tf
+++ b/terraform/webchat-widget-client.tf
@@ -1,52 +1,53 @@
-module "app" {
+module "webchat_client" {
   source  = "terraform-registry.anyvan.com/anyvan/ecs_project/aws"
   version = "~>1.6.2"
 
-  app_name                        = var.webchat_widget_name
+  app_name                        = "${var.webchat_widget_name}-client"
   env                             = var.env
   jira_ticket_number              = var.jira_ticket_number
-  application_container_image_url = var.application_container_image_url
+  application_container_image_url = var.client_container_image_url
   commit_hash                     = var.git_sha
   region                          = var.aws_region
   profile                         = var.profile
-  internal_fqdn                   = local.internal_fqdn
+  internal_fqdn                   = local.client_internal_fqdn
 
   cpu    = var.fargate_task_cpu
   memory = var.fargate_task_memory
 
   expose_internal = {
-    container_port                    = 3002
-    health_check_path                 = "/initWebchat"
+    container_port                    = 3000
+    health_check_path                 = "/"
     health_check_grace_period_seconds = 300
     listener_port                     = 443
   }
 
   expose_external = {
-    container_port                    = 3002
-    health_check_path                 = "/initWebchat"
+    container_port                    = 3000
+    health_check_path                 = "/"
     health_check_grace_period_seconds = 240
     listener_port                     = 443
   }
 
-
   task_permissions = {
     allow_sm = {
-      sm_arns = [
-        data.aws_secretsmanager_secret.twilio-secrets.arn
-      ]
+      sm_arns = []
       key_arns = []
     }
     ecs_task_statements = []
   }
-  env_variables = {}
+  
+  env_variables = {
+    NODE_ENV = "production"
+    PORT = "3000"
+    REACT_APP_SERVER_URL = "https://${local.server_internal_fqdn}"
+  }
 
   env_secrets      = {}
   enable_appconfig = false
-
-  enable_database = false
+  enable_database  = false
 
   providers = {
     aws            = aws
     aws.production = aws.production
   }
-}
\ No newline at end of file
+}
diff --git a/terraform/video-app.tf b/terraform/webchat-widget-server.tf
similarity index 78%
rename from terraform/video-app.tf
rename to terraform/webchat-widget-server.tf
index 6f3947b0..c18e0c37 100644
--- a/terraform/video-app.tf
+++ b/terraform/webchat-widget-server.tf
@@ -1,15 +1,15 @@
-module "app" {
+module "webchat_server" {
   source  = "terraform-registry.anyvan.com/anyvan/ecs_project/aws"
   version = "~>1.6.2"
 
-  app_name                        = var.webchat_widget_name
+  app_name                        = "${var.webchat_widget_name}-server"
   env                             = var.env
   jira_ticket_number              = var.jira_ticket_number
-  application_container_image_url = var.application_container_image_url
+  application_container_image_url = var.server_container_image_url
   commit_hash                     = var.git_sha
   region                          = var.aws_region
   profile                         = var.profile
-  internal_fqdn                   = local.internal_fqdn
+  internal_fqdn                   = local.server_internal_fqdn
 
   cpu    = var.fargate_task_cpu
   memory = var.fargate_task_memory
@@ -28,7 +28,6 @@ module "app" {
     listener_port                     = 443
   }
 
-
   task_permissions = {
     allow_sm = {
       sm_arns = [
@@ -38,15 +37,17 @@ module "app" {
     }
     ecs_task_statements = []
   }
-  env_variables = {}
+  
+  env_variables = {
+    NODE_ENV = "production"
+  }
 
   env_secrets      = {}
   enable_appconfig = false
-
-  enable_database = false
+  enable_database  = false
 
   providers = {
     aws            = aws
     aws.production = aws.production
   }
-}
\ No newline at end of file
+}

From e5aa3c8d8cb2a67957e3dd4a82295dba90f26d0b Mon Sep 17 00:00:00 2001
From: GarethF531 <167188366+GarethF531@users.noreply.github.com>
Date: Tue, 2 Sep 2025 13:00:28 +0200
Subject: [PATCH 07/48] Added circleci config for building and deploying

---
 .circleci/config.yml          | 149 +++++---------
 .circleci/continue-config.yml | 371 ++++++++++++++++++++++++++++++++++
 terraform/env/testing.tfvars  |   2 +-
 3 files changed, 424 insertions(+), 98 deletions(-)
 create mode 100644 .circleci/continue-config.yml

diff --git a/.circleci/config.yml b/.circleci/config.yml
index 7940d981..a71360e2 100644
--- a/.circleci/config.yml
+++ b/.circleci/config.yml
@@ -1,114 +1,69 @@
-# This config is equivalent to both the '.circleci/extended/orb-free.yml' and the base '.circleci/config.yml'
-version: 2.1
+version: "2.1"
+
+setup: true
 
-# Orbs are reusable packages of CircleCI configuration that you may share across projects, enabling you to create encapsulated, parameterized commands, jobs, and executors that can be used across multiple projects.
-# See: https://circleci.com/docs/2.0/orb-intro/
 orbs:
-  node: circleci/node@4.7
-  cypress: cypress-io/cypress@1
+  path-filtering: circleci/path-filtering@0.1.3
+  compliance: anyvan/compliance@1
+  ci: anyvan/ci@1
+
+parameters:
+  workflow:
+    type: enum
+    enum: [
+      "default",
+      "deploy_webchat_widget",
+      "deploy_to_pr_env"
+    ]
+    default: "default"
+    description: "Select which service to deploy"
 
 executors:
-  with-chrome:
+  node-docker:
     docker:
-      - image: 'cypress/browsers:node14.17.0-chrome91-ff89'
+      - image: cimg/node:20.19.2
+    resource_class: small
 
 jobs:
-  cleanUp:
-    docker:
-      - image: cimg/node:14.18.1
-    steps:
-      - checkout
-      - run:
-          command: npm install twilio --no-save
-          name: Install Twilio client
-      - run:
-          command: |
-            yarn e2eCleanupExistingTasks \
-                accountSid=$TWILIO_ACCOUNT_SID \
-                authToken=$TWILIO_AUTH_TOKEN \
-          name: Cleanup existing tasks
-  runUnitTests:
-    docker:
-      - image: cimg/node:14.18.1
+  format-and-lint-check:
+    executor: node-docker
     steps:
       - checkout
-      - node/install-packages:
-          pkg-manager: yarn-berry
-          with-cache: true
-      - run:
-          command: yarn test:nowatch
-          name: Run YARN tests
-  cypressTestsOnSauce:
-    docker:
-      - image: cimg/node:lts
-    steps:
-      - checkout
-      - run:
-          name: "Install dependencies"
-          command: |
-            yarn install --frozen-lockfile
-      - run:
-          name: "Initialize accounts"
-          command: |
-                yarn bootstrap \
-                    accountSid=$TWILIO_ACCOUNT_SID \
-                    authToken=$TWILIO_AUTH_TOKEN \
-                    addressSid=$TWILIO_ADDRESS_SID \
-                    apiKey=$TWILIO_API_KEY \
-                    apiSecret=$TWILIO_API_SECRET \
-                    conversationsServiceSid=$TWILIO_CONVERSATIONS_SERVICE_SID
-      - run:
-          name: "Running Application"
-          background: true
-          command: |
-            yarn start & yarn server:ci
-      - run:
-          name: "Set Up Tunnel"
-          background: true
-          command: |
-            curl https://saucelabs.com/downloads/sc-4.7.1-linux.tar.gz -o saucelabs.tar.gz
-            tar -xzf saucelabs.tar.gz
-            cd sc-*
-            bin/sc -u ${SAUCE_USERNAME} -k ${SAUCE_ACCESS_KEY} --region ${SAUCE_REGION} --tunnel-name ${SAUCE_TUNNEL_IDENTIFIER}
       - run:
-          name: "Install Sauce Labs saucectl"
+          name: Install dependencies
           command: |
-            curl -fsSL -o get_saucectl.sh https://saucelabs.github.io/saucectl/install && \
-            chmod 700 get_saucectl.sh && \
-            sudo ./get_saucectl.sh -b /usr/local/bin
+            npm ci
       - run:
-          name: "Configure Sauce saucectl"
+          name: Run format check
           command: |
-            saucectl configure -u ${SAUCE_USERNAME} -a ${SAUCE_ACCESS_KEY}
-      - run:
-          name: "Run Cypress on Sauce"
-          command: |
-            saucectl run --tunnel-name ${SAUCE_TUNNEL_IDENTIFIER} -e TEST_EMAIL=${TEST_EMAIL}
+            npm run format:check
+
 
 workflows:
-  build:
+  setup:
+    when:
+      equal: ["default", << pipeline.parameters.workflow >>]
     jobs:
-      - cleanUp
-      - runUnitTests:
-          requires:
-            - cleanUp
-      - cypress/run:
+      - compliance/verify:
+          context: anyvan
+      - format-and-lint-check
+      - path-filtering/filter:
+          name: "Setup deployment workflow"
+          base-revision: master
+          config-path: .circleci/continue-config.yml
+          mapping: |
+            .* run-continue-workflow true
           requires:
-            - cleanUp
-          executor: with-chrome
-          post-install:
-            - run: "yarn bootstrap \
-                    accountSid=$TWILIO_ACCOUNT_SID \
-                    authToken=$TWILIO_AUTH_TOKEN \
-                    addressSid=$TWILIO_ADDRESS_SID \
-                    apiKey=$TWILIO_API_KEY \
-                    apiSecret=$TWILIO_API_SECRET \
-                    conversationsServiceSid=$TWILIO_CONVERSATIONS_SERVICE_SID
-                "
-          browser: chrome
-          yarn: true
-          start: 'yarn start & yarn server:ci' # start server before running tests
-          store_artifacts: true
-      - cypressTestsOnSauce:
-          requires:
-            - cleanUp
+            - format-and-lint-check
+
+  deploy-workflow:
+    when:
+      not:
+        equal: ["default", << pipeline.parameters.workflow >>]
+    jobs:
+      - path-filtering/filter:
+          name: "Setup deployment workflow"
+          base-revision: master
+          config-path: .circleci/continue-config.yml
+          mapping: |
+            .* run-continue-workflow true
diff --git a/.circleci/continue-config.yml b/.circleci/continue-config.yml
new file mode 100644
index 00000000..aa5f8cf8
--- /dev/null
+++ b/.circleci/continue-config.yml
@@ -0,0 +1,371 @@
+version: 2.1
+
+orbs:
+  compliance: anyvan/compliance@1
+  ci: anyvan/ci@1
+  aws: anyvan/aws_auth_config@2
+  terraform-helper: anyvan/terraform-helper@1
+  node: circleci/node@5.1.0
+  aws-ecr: circleci/aws-ecr@9.0
+  aws-cli: circleci/aws-cli@3.1
+
+parameters:
+  region:
+    default: eu-west-1
+    type: string
+  modules:
+    default: v0.0.79
+    type: string
+  destroy:
+    default: false
+    type: boolean
+  terraform_version:
+    default: "1.9.5"
+    type: string
+  jira_ticket_number:
+    type: string
+    default: $(echo $CIRCLE_BRANCH | sed -ne 's/[A-Z]*-\([0-9]*\)-.*/\1/p')
+  image_tag:
+    type: string
+    default: $CIRCLE_SHA1
+  workflow:
+    default: "default"
+    type: string
+    description: "Specify which workflow to run"
+  run-continue-workflow:
+    type: boolean
+    default: false
+
+executors:
+  base:
+    docker:
+      - image: cimg/base:current
+
+  node-docker:
+    docker:
+      - image: cimg/node:20.19.2
+    resource_class: small
+
+  iac-base:
+    docker:
+      - image: $AWS_ECR_CIRCLECI_IMAGES_REPOSITORY_HOST/base/iac-base:noble
+        aws_auth:
+          oidc_role_arn: arn:aws:iam::$HORIZONTAL_ACCOUNT:role/circleci_oidc_role
+  nodejs:
+    docker:
+      - image: $AWS_ECR_CIRCLECI_IMAGES_REPOSITORY_HOST/base/node-js-twilio:20-noble
+        aws_auth:
+          oidc_role_arn: arn:aws:iam::$HORIZONTAL_ACCOUNT:role/circleci_oidc_role
+
+commands:
+  determine-environment:
+    steps:
+      - run:
+          name: Determine deployment environment
+          command: |
+            if [ "$CIRCLE_BRANCH" = "master" ] || [ "$CIRCLE_BRANCH" = "main" ]; then
+              echo "prod" > /tmp/deployment_env
+            else
+              echo "stage" > /tmp/deployment_env
+            fi
+      - persist_to_workspace:
+          root: /tmp
+          paths:
+            - deployment_env
+
+  build-and-push:
+    parameters:
+      image:
+        type: string
+      env:
+        type: string
+      project-root:
+        type: string
+      repository:
+        type: string
+      entry:
+        type: string
+      dockerfile:
+        type: string
+      ecr_app_host:
+        type: string
+        default: $AWS_ECR_APP_IMAGES_REPOSITORY_HOST
+    steps:
+      - run:
+          name: "Build and push image to ECR"
+          command: |
+            PROJECT_REPOSITORY_URL=<< parameters.ecr_app_host >>/twilio-webchat-widget/<<parameters.env>>/<< parameters.repository >>
+            PROJECT_REPOSITORY_HOST=<< parameters.ecr_app_host >>
+            aws ecr get-login-password | docker login --username AWS --password-stdin $PROJECT_REPOSITORY_HOST
+            cd << parameters.project-root >>
+
+            docker build -f << parameters.dockerfile >> -t << parameters.image >>-latest \
+              << parameters.entry >>
+
+            docker tag << parameters.image >>-latest $PROJECT_REPOSITORY_URL:<< parameters.image >>-latest
+            docker tag << parameters.image >>-latest $PROJECT_REPOSITORY_URL:<< parameters.image >>-$CIRCLE_SHA1
+            docker push $PROJECT_REPOSITORY_URL:<< parameters.image >>-latest
+            docker push $PROJECT_REPOSITORY_URL:<< parameters.image >>-$CIRCLE_SHA1
+
+jobs:
+  determine_environment:
+    executor: base
+    steps:
+      - determine-environment
+
+  build-image:
+    parameters:
+      image:
+        type: string
+      project-root:
+        type: string
+      env:
+        type: string
+      repository:
+        type: string
+      entry:
+        type: string
+      dockerfile:
+        type: string
+    executor: iac-base
+    steps:
+      - checkout
+      - attach_workspace:
+          at: /tmp
+      - setup_remote_docker:
+          docker_layer_caching: false
+          version: default
+      - run:
+          name: Set environment variable
+          command: |
+            ENV=$(cat /tmp/deployment_env)
+            echo "export DEPLOYMENT_ENV=$ENV" >> $BASH_ENV
+      - build-and-push:
+          image: << parameters.image >>
+          env: $DEPLOYMENT_ENV
+          project-root: << parameters.project-root >>
+          repository: << parameters.repository >>
+          entry: << parameters.entry >>
+          dockerfile: << parameters.dockerfile >>
+
+  approve_deployment:
+    executor: base
+    steps:
+      - run:
+          name: Manual approval placeholder
+          command: echo "Deployment approved"
+
+workflows:
+  # Webchat Widget Deployment Workflow
+  deploy_webchat_widget:
+    when:
+      and:
+        - << pipeline.parameters.run-continue-workflow >>
+        - equal: ["deploy_webchat_widget", << pipeline.parameters.workflow >>]
+    jobs:
+      - determine_environment
+      - approve_deployment:
+          type: approval
+          name: approve_webchat_widget_deployment
+      - aws/init:
+          name: "Log in to AWS"
+          context: anyvan
+          region: << pipeline.parameters.region >>
+          account: PRODUCTION HORIZONTAL TEST1
+          requires:
+            - approve_webchat_widget_deployment
+            - determine_environment
+      
+      # Build Server Image
+      - build-image:
+          name: build_webchat_server
+          project-root: .
+          entry: .
+          repository: server
+          image: twilio-webchat-server
+          dockerfile: Dockerfile.server
+          requires:
+            - "Log in to AWS"
+      
+      # Build Client Image
+      - build-image:
+          name: build_webchat_client
+          project-root: .
+          entry: .
+          repository: client
+          image: twilio-webchat-client
+          dockerfile: Dockerfile.client
+          requires:
+            - "Log in to AWS"
+      
+      # Plan Terraform for Production
+      - terraform-helper/plan:
+          name: plan_webchat_widget_prod
+          context:
+            - anyvan
+            - twilio-flex-prod
+          workspace: production-twilio-webchat-widget
+          var: >-
+            jira_ticket_number=<< pipeline.parameters.jira_ticket_number >>,
+            server_container_image_url=$AWS_ECR_CIRCLECI_IMAGES_REPOSITORY_HOST/twilio-webchat-widget/prod/server:twilio-webchat-server-<< pipeline.parameters.image_tag >>,
+            client_container_image_url=$AWS_ECR_CIRCLECI_IMAGES_REPOSITORY_HOST/twilio-webchat-widget/prod/client:twilio-webchat-client-<< pipeline.parameters.image_tag >>,
+            git_sha=$CIRCLE_SHA1,
+            terraform_version=<< pipeline.parameters.terraform_version >>,
+            slack_channel_web_hook=$LIONS_ALERTS_CHANNEL_WEBHOOK
+          var_file: env/production.tfvars
+          modules_branch: << pipeline.parameters.modules >>
+          path: terraform/
+          terraform_version: << pipeline.parameters.terraform_version >>
+          settings: |-
+            {
+              "datadog_api_key": "${DD_API_KEY}"
+            }
+          requires:
+            - build_webchat_server
+            - build_webchat_client
+          filters:
+            branches:
+              only: master
+      
+      # Plan Terraform for Staging
+      - terraform-helper/plan:
+          name: plan_webchat_widget_staging
+          context:
+            - anyvan
+            - twilio-flex-stage
+          workspace: staging-twilio-webchat-widget
+          var: >-
+            server_container_image_url=$AWS_ECR_CIRCLECI_IMAGES_REPOSITORY_HOST/twilio-webchat-widget/stage/server:twilio-webchat-server-<< pipeline.parameters.image_tag >>,
+            client_container_image_url=$AWS_ECR_CIRCLECI_IMAGES_REPOSITORY_HOST/twilio-webchat-widget/stage/client:twilio-webchat-client-<< pipeline.parameters.image_tag >>,
+            git_sha=$CIRCLE_SHA1,
+            terraform_version=<< pipeline.parameters.terraform_version >>
+          var_file: env/staging.tfvars
+          modules_branch: << pipeline.parameters.modules >>
+          path: terraform/
+          terraform_version: << pipeline.parameters.terraform_version >>
+          requires:
+            - build_webchat_server
+            - build_webchat_client
+          filters:
+            branches:
+              ignore: master
+      
+      # Approve Terraform Apply
+      - approve_deployment:
+          name: approve_terraform_apply
+          type: approval
+          requires:
+            - plan_webchat_widget_prod
+            - plan_webchat_widget_staging
+      
+      # Apply Terraform for Production
+      - terraform-helper/apply:
+          name: apply_webchat_widget_prod
+          context: anyvan
+          workspace: production-twilio-webchat-widget
+          modules_branch: << pipeline.parameters.modules >>
+          path: terraform/
+          terraform_version: << pipeline.parameters.terraform_version >>
+          requires:
+            - approve_terraform_apply
+          filters:
+            branches:
+              only: master
+      
+      # Apply Terraform for Staging
+      - terraform-helper/apply:
+          name: apply_webchat_widget_staging
+          context: anyvan
+          workspace: staging-twilio-webchat-widget
+          modules_branch: << pipeline.parameters.modules >>
+          path: terraform/
+          terraform_version: << pipeline.parameters.terraform_version >>
+          requires:
+            - approve_terraform_apply
+          filters:
+            branches:
+              ignore: master
+
+  # PR Environment Deployment Workflow
+  deploy_to_pr_env:
+    when:
+      and:
+        - equal: ["deploy_to_pr_env", << pipeline.parameters.workflow >>]
+        - not:
+            equal: ["main", << pipeline.git.branch >>]
+        - not:
+            equal: ["", << pipeline.parameters.jira_ticket_number >>]
+    jobs:
+      - aws/init:
+          name: "Log in to AWS"
+          context: anyvan
+          region: << pipeline.parameters.region >>
+          account: PRODUCTION HORIZONTAL TEST1
+      
+      # Build Server Image for PR Environment
+      - build-image:
+          name: build_webchat_server_pr
+          project-root: .
+          entry: .
+          repository: server
+          image: twilio-webchat-server
+          dockerfile: Dockerfile.server
+          requires:
+            - "Log in to AWS"
+      
+      # Build Client Image for PR Environment
+      - build-image:
+          name: build_webchat_client_pr
+          project-root: .
+          entry: .
+          repository: client
+          image: twilio-webchat-client
+          dockerfile: Dockerfile.client
+          requires:
+            - "Log in to AWS"
+      
+      # Plan Terraform for PR Environment
+      - terraform-helper/plan:
+          name: plan_webchat_widget_pr
+          context:
+            - anyvan
+            - twilio-flex-stage
+          workspace: testing-twilio-webchat-widget-<< pipeline.parameters.jira_ticket_number >>
+          var: >-
+            jira_ticket_number=<< pipeline.parameters.jira_ticket_number >>,
+            server_container_image_url=$AWS_ECR_CIRCLECI_IMAGES_REPOSITORY_HOST/twilio-webchat-widget/testing/server:twilio-webchat-server-<< pipeline.parameters.image_tag >>,
+            client_container_image_url=$AWS_ECR_CIRCLECI_IMAGES_REPOSITORY_HOST/twilio-webchat-widget/testing/client:twilio-webchat-client-<< pipeline.parameters.image_tag >>,
+            git_sha=$CIRCLE_SHA1,
+            terraform_version=<< pipeline.parameters.terraform_version >>
+          var_file: env/testing.tfvars
+          modules_branch: << pipeline.parameters.modules >>
+          path: terraform/
+          terraform_version: << pipeline.parameters.terraform_version >>
+          requires:
+            - build_webchat_server_pr
+            - build_webchat_client_pr
+      
+      # Apply Terraform for PR Environment
+      - terraform-helper/apply:
+          name: apply_webchat_widget_pr
+          context: anyvan
+          workspace: testing-twilio-webchat-widget-<< pipeline.parameters.jira_ticket_number >>
+          modules_branch: << pipeline.parameters.modules >>
+          path: terraform/
+          terraform_version: << pipeline.parameters.terraform_version >>
+          requires:
+            - plan_webchat_widget_pr
+
+  scheduled:
+    triggers:
+      - schedule:
+          cron: "0 1 * * *"
+          filters:
+            branches:
+              only: master
+    jobs:
+      - compliance/verify:
+          context: anyvan
+      - ci/cancel_workflows:
+          context: anyvan
+          timeout: 3d 
\ No newline at end of file
diff --git a/terraform/env/testing.tfvars b/terraform/env/testing.tfvars
index fff5427c..556eedb8 100644
--- a/terraform/env/testing.tfvars
+++ b/terraform/env/testing.tfvars
@@ -2,7 +2,7 @@ region                = "eu-west-1"
 env                   = "testing"
 prefix                = "test"
 profile               = "test1"
-ecr_repository_name   = "twilio-webchat-widget/${local.environment_name}"
+ecr_repository_name   = "twilio-webchat-widget/testing"
 vpc_environment       = "staging"
 notify                = ["@slack-alerting-centralised"]
 internal_fqdn         = "test-webchat-widget-internal-<jira-ticket-number>.anyvan.com"

From 7ae8725c79e5f7b33ac2967c71a469900d6f6adc Mon Sep 17 00:00:00 2001
From: GarethF531 <167188366+GarethF531@users.noreply.github.com>
Date: Tue, 2 Sep 2025 13:10:23 +0200
Subject: [PATCH 08/48] Simplified circleci workflow

Collapsed all down to single pr based workflow
---
 .circleci/config.yml          | 212 +++++++++++++++----
 .circleci/continue-config.yml | 371 ----------------------------------
 2 files changed, 169 insertions(+), 414 deletions(-)
 delete mode 100644 .circleci/continue-config.yml

diff --git a/.circleci/config.yml b/.circleci/config.yml
index a71360e2..b3a8ffd3 100644
--- a/.circleci/config.yml
+++ b/.circleci/config.yml
@@ -1,69 +1,195 @@
 version: "2.1"
 
-setup: true
-
 orbs:
-  path-filtering: circleci/path-filtering@0.1.3
   compliance: anyvan/compliance@1
   ci: anyvan/ci@1
+  aws: anyvan/aws_auth_config@2
+  terraform-helper: anyvan/terraform-helper@1
+  node: circleci/node@5.1.0
+  aws-ecr: circleci/aws-ecr@9.0
+  aws-cli: circleci/aws-cli@3.1
 
 parameters:
-  workflow:
-    type: enum
-    enum: [
-      "default",
-      "deploy_webchat_widget",
-      "deploy_to_pr_env"
-    ]
-    default: "default"
-    description: "Select which service to deploy"
+  region:
+    default: eu-west-1
+    type: string
+  modules:
+    default: v0.0.79
+    type: string
+  terraform_version:
+    default: "1.9.5"
+    type: string
+  jira_ticket_number:
+    type: string
+    default: $(echo $CIRCLE_BRANCH | sed -ne 's/[A-Z]*-\([0-9]*\)-.*/\1/p')
+  image_tag:
+    type: string
+    default: $CIRCLE_SHA1
 
 executors:
+  base:
+    docker:
+      - image: cimg/base:current
+
   node-docker:
     docker:
       - image: cimg/node:20.19.2
     resource_class: small
 
-jobs:
-  format-and-lint-check:
-    executor: node-docker
+  iac-base:
+    docker:
+      - image: $AWS_ECR_CIRCLECI_IMAGES_REPOSITORY_HOST/base/iac-base:noble
+        aws_auth:
+          oidc_role_arn: arn:aws:iam::$HORIZONTAL_ACCOUNT:role/circleci_oidc_role
+
+commands:
+  build-and-push:
+    parameters:
+      image:
+        type: string
+      env:
+        type: string
+      project-root:
+        type: string
+      repository:
+        type: string
+      entry:
+        type: string
+      dockerfile:
+        type: string
+      ecr_app_host:
+        type: string
+        default: $AWS_ECR_APP_IMAGES_REPOSITORY_HOST
     steps:
-      - checkout
-      - run:
-          name: Install dependencies
-          command: |
-            npm ci
       - run:
-          name: Run format check
+          name: "Build and push image to ECR"
           command: |
-            npm run format:check
+            PROJECT_REPOSITORY_URL=<< parameters.ecr_app_host >>/twilio-webchat-widget/<<parameters.env>>/<< parameters.repository >>
+            PROJECT_REPOSITORY_HOST=<< parameters.ecr_app_host >>
+            aws ecr get-login-password | docker login --username AWS --password-stdin $PROJECT_REPOSITORY_HOST
+            cd << parameters.project-root >>
 
+            docker build -f << parameters.dockerfile >> -t << parameters.image >>-latest \
+              << parameters.entry >>
+
+            docker tag << parameters.image >>-latest $PROJECT_REPOSITORY_URL:<< parameters.image >>-latest
+            docker tag << parameters.image >>-latest $PROJECT_REPOSITORY_URL:<< parameters.image >>-$CIRCLE_SHA1
+            docker push $PROJECT_REPOSITORY_URL:<< parameters.image >>-latest
+            docker push $PROJECT_REPOSITORY_URL:<< parameters.image >>-$CIRCLE_SHA1
+
+jobs:
+   build-image:
+    parameters:
+      image:
+        type: string
+      project-root:
+        type: string
+      env:
+        type: string
+      repository:
+        type: string
+      entry:
+        type: string
+      dockerfile:
+        type: string
+    executor: iac-base
+    steps:
+      - checkout
+      - setup_remote_docker:
+          docker_layer_caching: false
+          version: default
+      - build-and-push:
+          image: << parameters.image >>
+          env: << parameters.env >>
+          project-root: << parameters.project-root >>
+          repository: << parameters.repository >>
+          entry: << parameters.entry >>
+          dockerfile: << parameters.dockerfile >>
 
 workflows:
-  setup:
+  # Default workflow - Deploy to PR Environment
+  deploy_to_pr_env:
     when:
-      equal: ["default", << pipeline.parameters.workflow >>]
+      and:
+        - not:
+            equal: ["main", << pipeline.git.branch >>]
+        - not:
+            equal: ["", << pipeline.parameters.jira_ticket_number >>]
     jobs:
-      - compliance/verify:
+      - aws/init:
+          name: "Log in to AWS"
+          context: anyvan
+          region: << pipeline.parameters.region >>
+          account: PRODUCTION HORIZONTAL TEST1
+      
+      # Build Server Image for PR Environment
+      - build-image:
+          name: build_webchat_server_pr
+          project-root: .
+          entry: .
+          repository: server
+          image: twilio-webchat-server
+          dockerfile: Dockerfile.server
+          env: testing
+          requires:
+            - "Log in to AWS"
+      
+      # Build Client Image for PR Environment
+      - build-image:
+          name: build_webchat_client_pr
+          project-root: .
+          entry: .
+          repository: client
+          image: twilio-webchat-client
+          dockerfile: Dockerfile.client
+          env: testing
+          requires:
+            - "Log in to AWS"
+      
+      # Plan Terraform for PR Environment
+      - terraform-helper/plan:
+          name: plan_webchat_widget_pr
+          context:
+            - anyvan
+            - twilio-flex-stage
+          workspace: testing-twilio-webchat-widget-<< pipeline.parameters.jira_ticket_number >>
+          var: >-
+            jira_ticket_number=<< pipeline.parameters.jira_ticket_number >>,
+            server_container_image_url=$AWS_ECR_CIRCLECI_IMAGES_REPOSITORY_HOST/twilio-webchat-widget/testing/server:twilio-webchat-server-<< pipeline.parameters.image_tag >>,
+            client_container_image_url=$AWS_ECR_CIRCLECI_IMAGES_REPOSITORY_HOST/twilio-webchat-widget/testing/client:twilio-webchat-client-<< pipeline.parameters.image_tag >>,
+            git_sha=$CIRCLE_SHA1,
+            terraform_version=<< pipeline.parameters.terraform_version >>
+          var_file: env/testing.tfvars
+          modules_branch: << pipeline.parameters.modules >>
+          path: terraform/
+          terraform_version: << pipeline.parameters.terraform_version >>
+          requires:
+            - build_webchat_server_pr
+            - build_webchat_client_pr
+      
+      # Apply Terraform for PR Environment
+      - terraform-helper/apply:
+          name: apply_webchat_widget_pr
           context: anyvan
-      - format-and-lint-check
-      - path-filtering/filter:
-          name: "Setup deployment workflow"
-          base-revision: master
-          config-path: .circleci/continue-config.yml
-          mapping: |
-            .* run-continue-workflow true
+          workspace: testing-twilio-webchat-widget-<< pipeline.parameters.jira_ticket_number >>
+          modules_branch: << pipeline.parameters.modules >>
+          path: terraform/
+          terraform_version: << pipeline.parameters.terraform_version >>
           requires:
-            - format-and-lint-check
+            - plan_webchat_widget_pr
 
-  deploy-workflow:
-    when:
-      not:
-        equal: ["default", << pipeline.parameters.workflow >>]
+
+  # Scheduled cleanup
+  scheduled:
+    triggers:
+      - schedule:
+          cron: "0 1 * * *"
+          filters:
+            branches:
+              only: main
     jobs:
-      - path-filtering/filter:
-          name: "Setup deployment workflow"
-          base-revision: master
-          config-path: .circleci/continue-config.yml
-          mapping: |
-            .* run-continue-workflow true
+      - compliance/verify:
+          context: anyvan
+      - ci/cancel_workflows:
+          context: anyvan
+          timeout: 3d
diff --git a/.circleci/continue-config.yml b/.circleci/continue-config.yml
deleted file mode 100644
index aa5f8cf8..00000000
--- a/.circleci/continue-config.yml
+++ /dev/null
@@ -1,371 +0,0 @@
-version: 2.1
-
-orbs:
-  compliance: anyvan/compliance@1
-  ci: anyvan/ci@1
-  aws: anyvan/aws_auth_config@2
-  terraform-helper: anyvan/terraform-helper@1
-  node: circleci/node@5.1.0
-  aws-ecr: circleci/aws-ecr@9.0
-  aws-cli: circleci/aws-cli@3.1
-
-parameters:
-  region:
-    default: eu-west-1
-    type: string
-  modules:
-    default: v0.0.79
-    type: string
-  destroy:
-    default: false
-    type: boolean
-  terraform_version:
-    default: "1.9.5"
-    type: string
-  jira_ticket_number:
-    type: string
-    default: $(echo $CIRCLE_BRANCH | sed -ne 's/[A-Z]*-\([0-9]*\)-.*/\1/p')
-  image_tag:
-    type: string
-    default: $CIRCLE_SHA1
-  workflow:
-    default: "default"
-    type: string
-    description: "Specify which workflow to run"
-  run-continue-workflow:
-    type: boolean
-    default: false
-
-executors:
-  base:
-    docker:
-      - image: cimg/base:current
-
-  node-docker:
-    docker:
-      - image: cimg/node:20.19.2
-    resource_class: small
-
-  iac-base:
-    docker:
-      - image: $AWS_ECR_CIRCLECI_IMAGES_REPOSITORY_HOST/base/iac-base:noble
-        aws_auth:
-          oidc_role_arn: arn:aws:iam::$HORIZONTAL_ACCOUNT:role/circleci_oidc_role
-  nodejs:
-    docker:
-      - image: $AWS_ECR_CIRCLECI_IMAGES_REPOSITORY_HOST/base/node-js-twilio:20-noble
-        aws_auth:
-          oidc_role_arn: arn:aws:iam::$HORIZONTAL_ACCOUNT:role/circleci_oidc_role
-
-commands:
-  determine-environment:
-    steps:
-      - run:
-          name: Determine deployment environment
-          command: |
-            if [ "$CIRCLE_BRANCH" = "master" ] || [ "$CIRCLE_BRANCH" = "main" ]; then
-              echo "prod" > /tmp/deployment_env
-            else
-              echo "stage" > /tmp/deployment_env
-            fi
-      - persist_to_workspace:
-          root: /tmp
-          paths:
-            - deployment_env
-
-  build-and-push:
-    parameters:
-      image:
-        type: string
-      env:
-        type: string
-      project-root:
-        type: string
-      repository:
-        type: string
-      entry:
-        type: string
-      dockerfile:
-        type: string
-      ecr_app_host:
-        type: string
-        default: $AWS_ECR_APP_IMAGES_REPOSITORY_HOST
-    steps:
-      - run:
-          name: "Build and push image to ECR"
-          command: |
-            PROJECT_REPOSITORY_URL=<< parameters.ecr_app_host >>/twilio-webchat-widget/<<parameters.env>>/<< parameters.repository >>
-            PROJECT_REPOSITORY_HOST=<< parameters.ecr_app_host >>
-            aws ecr get-login-password | docker login --username AWS --password-stdin $PROJECT_REPOSITORY_HOST
-            cd << parameters.project-root >>
-
-            docker build -f << parameters.dockerfile >> -t << parameters.image >>-latest \
-              << parameters.entry >>
-
-            docker tag << parameters.image >>-latest $PROJECT_REPOSITORY_URL:<< parameters.image >>-latest
-            docker tag << parameters.image >>-latest $PROJECT_REPOSITORY_URL:<< parameters.image >>-$CIRCLE_SHA1
-            docker push $PROJECT_REPOSITORY_URL:<< parameters.image >>-latest
-            docker push $PROJECT_REPOSITORY_URL:<< parameters.image >>-$CIRCLE_SHA1
-
-jobs:
-  determine_environment:
-    executor: base
-    steps:
-      - determine-environment
-
-  build-image:
-    parameters:
-      image:
-        type: string
-      project-root:
-        type: string
-      env:
-        type: string
-      repository:
-        type: string
-      entry:
-        type: string
-      dockerfile:
-        type: string
-    executor: iac-base
-    steps:
-      - checkout
-      - attach_workspace:
-          at: /tmp
-      - setup_remote_docker:
-          docker_layer_caching: false
-          version: default
-      - run:
-          name: Set environment variable
-          command: |
-            ENV=$(cat /tmp/deployment_env)
-            echo "export DEPLOYMENT_ENV=$ENV" >> $BASH_ENV
-      - build-and-push:
-          image: << parameters.image >>
-          env: $DEPLOYMENT_ENV
-          project-root: << parameters.project-root >>
-          repository: << parameters.repository >>
-          entry: << parameters.entry >>
-          dockerfile: << parameters.dockerfile >>
-
-  approve_deployment:
-    executor: base
-    steps:
-      - run:
-          name: Manual approval placeholder
-          command: echo "Deployment approved"
-
-workflows:
-  # Webchat Widget Deployment Workflow
-  deploy_webchat_widget:
-    when:
-      and:
-        - << pipeline.parameters.run-continue-workflow >>
-        - equal: ["deploy_webchat_widget", << pipeline.parameters.workflow >>]
-    jobs:
-      - determine_environment
-      - approve_deployment:
-          type: approval
-          name: approve_webchat_widget_deployment
-      - aws/init:
-          name: "Log in to AWS"
-          context: anyvan
-          region: << pipeline.parameters.region >>
-          account: PRODUCTION HORIZONTAL TEST1
-          requires:
-            - approve_webchat_widget_deployment
-            - determine_environment
-      
-      # Build Server Image
-      - build-image:
-          name: build_webchat_server
-          project-root: .
-          entry: .
-          repository: server
-          image: twilio-webchat-server
-          dockerfile: Dockerfile.server
-          requires:
-            - "Log in to AWS"
-      
-      # Build Client Image
-      - build-image:
-          name: build_webchat_client
-          project-root: .
-          entry: .
-          repository: client
-          image: twilio-webchat-client
-          dockerfile: Dockerfile.client
-          requires:
-            - "Log in to AWS"
-      
-      # Plan Terraform for Production
-      - terraform-helper/plan:
-          name: plan_webchat_widget_prod
-          context:
-            - anyvan
-            - twilio-flex-prod
-          workspace: production-twilio-webchat-widget
-          var: >-
-            jira_ticket_number=<< pipeline.parameters.jira_ticket_number >>,
-            server_container_image_url=$AWS_ECR_CIRCLECI_IMAGES_REPOSITORY_HOST/twilio-webchat-widget/prod/server:twilio-webchat-server-<< pipeline.parameters.image_tag >>,
-            client_container_image_url=$AWS_ECR_CIRCLECI_IMAGES_REPOSITORY_HOST/twilio-webchat-widget/prod/client:twilio-webchat-client-<< pipeline.parameters.image_tag >>,
-            git_sha=$CIRCLE_SHA1,
-            terraform_version=<< pipeline.parameters.terraform_version >>,
-            slack_channel_web_hook=$LIONS_ALERTS_CHANNEL_WEBHOOK
-          var_file: env/production.tfvars
-          modules_branch: << pipeline.parameters.modules >>
-          path: terraform/
-          terraform_version: << pipeline.parameters.terraform_version >>
-          settings: |-
-            {
-              "datadog_api_key": "${DD_API_KEY}"
-            }
-          requires:
-            - build_webchat_server
-            - build_webchat_client
-          filters:
-            branches:
-              only: master
-      
-      # Plan Terraform for Staging
-      - terraform-helper/plan:
-          name: plan_webchat_widget_staging
-          context:
-            - anyvan
-            - twilio-flex-stage
-          workspace: staging-twilio-webchat-widget
-          var: >-
-            server_container_image_url=$AWS_ECR_CIRCLECI_IMAGES_REPOSITORY_HOST/twilio-webchat-widget/stage/server:twilio-webchat-server-<< pipeline.parameters.image_tag >>,
-            client_container_image_url=$AWS_ECR_CIRCLECI_IMAGES_REPOSITORY_HOST/twilio-webchat-widget/stage/client:twilio-webchat-client-<< pipeline.parameters.image_tag >>,
-            git_sha=$CIRCLE_SHA1,
-            terraform_version=<< pipeline.parameters.terraform_version >>
-          var_file: env/staging.tfvars
-          modules_branch: << pipeline.parameters.modules >>
-          path: terraform/
-          terraform_version: << pipeline.parameters.terraform_version >>
-          requires:
-            - build_webchat_server
-            - build_webchat_client
-          filters:
-            branches:
-              ignore: master
-      
-      # Approve Terraform Apply
-      - approve_deployment:
-          name: approve_terraform_apply
-          type: approval
-          requires:
-            - plan_webchat_widget_prod
-            - plan_webchat_widget_staging
-      
-      # Apply Terraform for Production
-      - terraform-helper/apply:
-          name: apply_webchat_widget_prod
-          context: anyvan
-          workspace: production-twilio-webchat-widget
-          modules_branch: << pipeline.parameters.modules >>
-          path: terraform/
-          terraform_version: << pipeline.parameters.terraform_version >>
-          requires:
-            - approve_terraform_apply
-          filters:
-            branches:
-              only: master
-      
-      # Apply Terraform for Staging
-      - terraform-helper/apply:
-          name: apply_webchat_widget_staging
-          context: anyvan
-          workspace: staging-twilio-webchat-widget
-          modules_branch: << pipeline.parameters.modules >>
-          path: terraform/
-          terraform_version: << pipeline.parameters.terraform_version >>
-          requires:
-            - approve_terraform_apply
-          filters:
-            branches:
-              ignore: master
-
-  # PR Environment Deployment Workflow
-  deploy_to_pr_env:
-    when:
-      and:
-        - equal: ["deploy_to_pr_env", << pipeline.parameters.workflow >>]
-        - not:
-            equal: ["main", << pipeline.git.branch >>]
-        - not:
-            equal: ["", << pipeline.parameters.jira_ticket_number >>]
-    jobs:
-      - aws/init:
-          name: "Log in to AWS"
-          context: anyvan
-          region: << pipeline.parameters.region >>
-          account: PRODUCTION HORIZONTAL TEST1
-      
-      # Build Server Image for PR Environment
-      - build-image:
-          name: build_webchat_server_pr
-          project-root: .
-          entry: .
-          repository: server
-          image: twilio-webchat-server
-          dockerfile: Dockerfile.server
-          requires:
-            - "Log in to AWS"
-      
-      # Build Client Image for PR Environment
-      - build-image:
-          name: build_webchat_client_pr
-          project-root: .
-          entry: .
-          repository: client
-          image: twilio-webchat-client
-          dockerfile: Dockerfile.client
-          requires:
-            - "Log in to AWS"
-      
-      # Plan Terraform for PR Environment
-      - terraform-helper/plan:
-          name: plan_webchat_widget_pr
-          context:
-            - anyvan
-            - twilio-flex-stage
-          workspace: testing-twilio-webchat-widget-<< pipeline.parameters.jira_ticket_number >>
-          var: >-
-            jira_ticket_number=<< pipeline.parameters.jira_ticket_number >>,
-            server_container_image_url=$AWS_ECR_CIRCLECI_IMAGES_REPOSITORY_HOST/twilio-webchat-widget/testing/server:twilio-webchat-server-<< pipeline.parameters.image_tag >>,
-            client_container_image_url=$AWS_ECR_CIRCLECI_IMAGES_REPOSITORY_HOST/twilio-webchat-widget/testing/client:twilio-webchat-client-<< pipeline.parameters.image_tag >>,
-            git_sha=$CIRCLE_SHA1,
-            terraform_version=<< pipeline.parameters.terraform_version >>
-          var_file: env/testing.tfvars
-          modules_branch: << pipeline.parameters.modules >>
-          path: terraform/
-          terraform_version: << pipeline.parameters.terraform_version >>
-          requires:
-            - build_webchat_server_pr
-            - build_webchat_client_pr
-      
-      # Apply Terraform for PR Environment
-      - terraform-helper/apply:
-          name: apply_webchat_widget_pr
-          context: anyvan
-          workspace: testing-twilio-webchat-widget-<< pipeline.parameters.jira_ticket_number >>
-          modules_branch: << pipeline.parameters.modules >>
-          path: terraform/
-          terraform_version: << pipeline.parameters.terraform_version >>
-          requires:
-            - plan_webchat_widget_pr
-
-  scheduled:
-    triggers:
-      - schedule:
-          cron: "0 1 * * *"
-          filters:
-            branches:
-              only: master
-    jobs:
-      - compliance/verify:
-          context: anyvan
-      - ci/cancel_workflows:
-          context: anyvan
-          timeout: 3d 
\ No newline at end of file

From 0bd0c97a0e163d28e35533af64b8a3f0dea26821 Mon Sep 17 00:00:00 2001
From: GarethF531 <167188366+GarethF531@users.noreply.github.com>
Date: Tue, 2 Sep 2025 13:21:08 +0200
Subject: [PATCH 09/48] Updated circleci

fix for deploying to pr env
---
 .circleci/config.yml | 120 ++++++++++++++++++++++++++-----------------
 1 file changed, 72 insertions(+), 48 deletions(-)

diff --git a/.circleci/config.yml b/.circleci/config.yml
index b3a8ffd3..eddeff58 100644
--- a/.circleci/config.yml
+++ b/.circleci/config.yml
@@ -116,11 +116,29 @@ workflows:
         - not:
             equal: ["", << pipeline.parameters.jira_ticket_number >>]
     jobs:
-      - aws/init:
+      - aws/init: &aws_init
           name: "Log in to AWS"
           context: anyvan
-          region: << pipeline.parameters.region >>
-          account: PRODUCTION HORIZONTAL TEST1
+          region: << pipeline.parameters.aws_region >>
+          account: HORIZONTAL PRODUCTION TEST1
+          persist: .aws
+      - login-codeartifact-registry:
+          name: "Log in to AWS CodeArtifact"
+          requires:
+            - "Log in to AWS"
+      - aws-ecr-helper/create_aws_ecr: &create_ecr
+          name: "Create AWS ECR repository"
+          context: anyvan
+          module_path: "iac/terraform/image_repository"
+          app_name: << pipeline.parameters.app_name >>
+          tf_version: << pipeline.parameters.terraform_version >>
+          requires:
+            - "Log in to AWS"
+      - aws-ecr-helper/ecr_login: &ecr_login
+          name: "Log in to AWS ECR"
+          context: anyvan
+          requires:
+            - "Create AWS ECR repository"
       
       # Build Server Image for PR Environment
       - build-image:
@@ -146,50 +164,56 @@ workflows:
           requires:
             - "Log in to AWS"
       
-      # Plan Terraform for PR Environment
-      - terraform-helper/plan:
-          name: plan_webchat_widget_pr
-          context:
-            - anyvan
-            - twilio-flex-stage
-          workspace: testing-twilio-webchat-widget-<< pipeline.parameters.jira_ticket_number >>
-          var: >-
-            jira_ticket_number=<< pipeline.parameters.jira_ticket_number >>,
-            server_container_image_url=$AWS_ECR_CIRCLECI_IMAGES_REPOSITORY_HOST/twilio-webchat-widget/testing/server:twilio-webchat-server-<< pipeline.parameters.image_tag >>,
-            client_container_image_url=$AWS_ECR_CIRCLECI_IMAGES_REPOSITORY_HOST/twilio-webchat-widget/testing/client:twilio-webchat-client-<< pipeline.parameters.image_tag >>,
-            git_sha=$CIRCLE_SHA1,
-            terraform_version=<< pipeline.parameters.terraform_version >>
-          var_file: env/testing.tfvars
-          modules_branch: << pipeline.parameters.modules >>
-          path: terraform/
-          terraform_version: << pipeline.parameters.terraform_version >>
-          requires:
-            - build_webchat_server_pr
-            - build_webchat_client_pr
-      
-      # Apply Terraform for PR Environment
-      - terraform-helper/apply:
-          name: apply_webchat_widget_pr
-          context: anyvan
-          workspace: testing-twilio-webchat-widget-<< pipeline.parameters.jira_ticket_number >>
-          modules_branch: << pipeline.parameters.modules >>
-          path: terraform/
-          terraform_version: << pipeline.parameters.terraform_version >>
-          requires:
-            - plan_webchat_widget_pr
+     - terraform-helper/plan:
+        <<: *plan
+        name: "TF Plan for PR"
+        env: branches
+        expire: true
+        var_file: env/branches.tfvars
+        workspace: << pipeline.parameters.app_name >>_branches<< pipeline.parameters.jira_ticket_number >>
+        requires:
+          - build-and-push
+    - terraform-helper/apply:
+        <<: *apply
+        name: "Apply TF plan for PR"
+        expire: true
+        workspace: << pipeline.parameters.app_name >>_branches<< pipeline.parameters.jira_ticket_number >>
+        requires:
+          - "TF Plan for PR"
+
+pull_request_closed:
+  when:
+    and:
+      - equal: [pull_request_closed, << pipeline.parameters.workflow >>]
+      - not:
+          equal: [main, << pipeline.git.branch >>]
+      - not:
+          equal: ["", << pipeline.parameters.jira_ticket_number >>]
+  jobs:
+    - aws/init:
+        *aws_init
+    - terraform-helper/plan:
+        <<: *plan
+        name: "Plan destroy PR environment"
+        env: branches
+        destroy: true
+        var_file: env/branches.tfvars
+        workspace: << pipeline.parameters.app_name >>_branches<< pipeline.parameters.jira_ticket_number >>
+        requires:
+          - "Log in to AWS"
+    - terraform-helper/apply:
+        <<: *apply
+        name: "Apply Destroy of PR environment"
+        destroy: true
+        workspace: << pipeline.parameters.app_name >>_branches<< pipeline.parameters.jira_ticket_number >>
+        requires:
+          - "Plan destroy PR environment"
+
+
+
+
+
+
+
 
 
-  # Scheduled cleanup
-  scheduled:
-    triggers:
-      - schedule:
-          cron: "0 1 * * *"
-          filters:
-            branches:
-              only: main
-    jobs:
-      - compliance/verify:
-          context: anyvan
-      - ci/cancel_workflows:
-          context: anyvan
-          timeout: 3d

From 0c6c6b1b09212da892176622a4ea7ee3b710a718 Mon Sep 17 00:00:00 2001
From: GarethF531 <167188366+GarethF531@users.noreply.github.com>
Date: Tue, 2 Sep 2025 13:24:20 +0200
Subject: [PATCH 10/48] fix yaml

---
 .circleci/config.yml | 129 +++++++++++++++++++++----------------------
 1 file changed, 63 insertions(+), 66 deletions(-)

diff --git a/.circleci/config.yml b/.circleci/config.yml
index eddeff58..aac1a46a 100644
--- a/.circleci/config.yml
+++ b/.circleci/config.yml
@@ -78,7 +78,7 @@ commands:
             docker push $PROJECT_REPOSITORY_URL:<< parameters.image >>-$CIRCLE_SHA1
 
 jobs:
-   build-image:
+  build-image:
     parameters:
       image:
         type: string
@@ -116,29 +116,11 @@ workflows:
         - not:
             equal: ["", << pipeline.parameters.jira_ticket_number >>]
     jobs:
-      - aws/init: &aws_init
+      - aws/init:
           name: "Log in to AWS"
           context: anyvan
-          region: << pipeline.parameters.aws_region >>
-          account: HORIZONTAL PRODUCTION TEST1
-          persist: .aws
-      - login-codeartifact-registry:
-          name: "Log in to AWS CodeArtifact"
-          requires:
-            - "Log in to AWS"
-      - aws-ecr-helper/create_aws_ecr: &create_ecr
-          name: "Create AWS ECR repository"
-          context: anyvan
-          module_path: "iac/terraform/image_repository"
-          app_name: << pipeline.parameters.app_name >>
-          tf_version: << pipeline.parameters.terraform_version >>
-          requires:
-            - "Log in to AWS"
-      - aws-ecr-helper/ecr_login: &ecr_login
-          name: "Log in to AWS ECR"
-          context: anyvan
-          requires:
-            - "Create AWS ECR repository"
+          region: << pipeline.parameters.region >>
+          account: PRODUCTION HORIZONTAL TEST1
       
       # Build Server Image for PR Environment
       - build-image:
@@ -164,50 +146,65 @@ workflows:
           requires:
             - "Log in to AWS"
       
-     - terraform-helper/plan:
-        <<: *plan
-        name: "TF Plan for PR"
-        env: branches
-        expire: true
-        var_file: env/branches.tfvars
-        workspace: << pipeline.parameters.app_name >>_branches<< pipeline.parameters.jira_ticket_number >>
-        requires:
-          - build-and-push
-    - terraform-helper/apply:
-        <<: *apply
-        name: "Apply TF plan for PR"
-        expire: true
-        workspace: << pipeline.parameters.app_name >>_branches<< pipeline.parameters.jira_ticket_number >>
-        requires:
-          - "TF Plan for PR"
-
-pull_request_closed:
-  when:
-    and:
-      - equal: [pull_request_closed, << pipeline.parameters.workflow >>]
-      - not:
-          equal: [main, << pipeline.git.branch >>]
-      - not:
-          equal: ["", << pipeline.parameters.jira_ticket_number >>]
-  jobs:
-    - aws/init:
-        *aws_init
-    - terraform-helper/plan:
-        <<: *plan
-        name: "Plan destroy PR environment"
-        env: branches
-        destroy: true
-        var_file: env/branches.tfvars
-        workspace: << pipeline.parameters.app_name >>_branches<< pipeline.parameters.jira_ticket_number >>
-        requires:
-          - "Log in to AWS"
-    - terraform-helper/apply:
-        <<: *apply
-        name: "Apply Destroy of PR environment"
-        destroy: true
-        workspace: << pipeline.parameters.app_name >>_branches<< pipeline.parameters.jira_ticket_number >>
-        requires:
-          - "Plan destroy PR environment"
+      # Plan Terraform for PR Environment
+      - terraform-helper/plan:
+          name: plan_webchat_widget_pr
+          context:
+            - anyvan
+            - twilio-flex-stage
+          workspace: testing-twilio-webchat-widget-<< pipeline.parameters.jira_ticket_number >>
+          var: >-
+            jira_ticket_number=<< pipeline.parameters.jira_ticket_number >>,
+            server_container_image_url=$AWS_ECR_CIRCLECI_IMAGES_REPOSITORY_HOST/twilio-webchat-widget/testing/server:twilio-webchat-server-<< pipeline.parameters.image_tag >>,
+            client_container_image_url=$AWS_ECR_CIRCLECI_IMAGES_REPOSITORY_HOST/twilio-webchat-widget/testing/client:twilio-webchat-client-<< pipeline.parameters.image_tag >>,
+            git_sha=$CIRCLE_SHA1,
+            terraform_version=<< pipeline.parameters.terraform_version >>
+          var_file: env/testing.tfvars
+          modules_branch: << pipeline.parameters.modules >>
+          path: terraform/
+          terraform_version: << pipeline.parameters.terraform_version >>
+          requires:
+            - build_webchat_server_pr
+            - build_webchat_client_pr
+      
+      # Apply Terraform for PR Environment
+      - terraform-helper/apply:
+          name: apply_webchat_widget_pr
+          context: anyvan
+          workspace: testing-twilio-webchat-widget-<< pipeline.parameters.jira_ticket_number >>
+          modules_branch: << pipeline.parameters.modules >>
+          path: terraform/
+          terraform_version: << pipeline.parameters.terraform_version >>
+          requires:
+            - plan_webchat_widget_pr
+
+  pull_request_closed:
+    when:
+      and:
+        - equal: [pull_request_closed, << pipeline.parameters.workflow >>]
+        - not:
+            equal: [main, << pipeline.git.branch >>]
+        - not:
+            equal: ["", << pipeline.parameters.jira_ticket_number >>]
+    jobs:
+      - aws/init:
+          *aws_init
+      - terraform-helper/plan:
+          <<: *plan
+          name: "Plan destroy PR environment"
+          env: branches
+          destroy: true
+          var_file: env/branches.tfvars
+          workspace: << pipeline.parameters.app_name >>_branches<< pipeline.parameters.jira_ticket_number >>
+          requires:
+            - "Log in to AWS"
+      - terraform-helper/apply:
+          <<: *apply
+          name: "Apply Destroy of PR environment"
+          destroy: true
+          workspace: << pipeline.parameters.app_name >>_branches<< pipeline.parameters.jira_ticket_number >>
+          requires:
+            - "Plan destroy PR environment"
 
 
 

From 8d0161fba8a6df3be52bf70a05505c74d103a276 Mon Sep 17 00:00:00 2001
From: GarethF531 <167188366+GarethF531@users.noreply.github.com>
Date: Tue, 2 Sep 2025 13:27:00 +0200
Subject: [PATCH 11/48] Fixed aws_init ref

---
 .circleci/config.yml | 3 ++-
 1 file changed, 2 insertions(+), 1 deletion(-)

diff --git a/.circleci/config.yml b/.circleci/config.yml
index aac1a46a..9b8834b6 100644
--- a/.circleci/config.yml
+++ b/.circleci/config.yml
@@ -116,11 +116,12 @@ workflows:
         - not:
             equal: ["", << pipeline.parameters.jira_ticket_number >>]
     jobs:
-      - aws/init:
+      - aws/init: &aws_init
           name: "Log in to AWS"
           context: anyvan
           region: << pipeline.parameters.region >>
           account: PRODUCTION HORIZONTAL TEST1
+          persist: .aws
       
       # Build Server Image for PR Environment
       - build-image:

From 3b0bfcb37a73ab19e273e301163b3295e779f667 Mon Sep 17 00:00:00 2001
From: GarethF531 <167188366+GarethF531@users.noreply.github.com>
Date: Tue, 2 Sep 2025 13:27:59 +0200
Subject: [PATCH 12/48] updated tf refs

---
 .circleci/config.yml | 4 ++--
 1 file changed, 2 insertions(+), 2 deletions(-)

diff --git a/.circleci/config.yml b/.circleci/config.yml
index 9b8834b6..9effb189 100644
--- a/.circleci/config.yml
+++ b/.circleci/config.yml
@@ -148,7 +148,7 @@ workflows:
             - "Log in to AWS"
       
       # Plan Terraform for PR Environment
-      - terraform-helper/plan:
+      - terraform-helper/plan: &plan
           name: plan_webchat_widget_pr
           context:
             - anyvan
@@ -169,7 +169,7 @@ workflows:
             - build_webchat_client_pr
       
       # Apply Terraform for PR Environment
-      - terraform-helper/apply:
+      - terraform-helper/apply: &apply
           name: apply_webchat_widget_pr
           context: anyvan
           workspace: testing-twilio-webchat-widget-<< pipeline.parameters.jira_ticket_number >>

From bb8288383084f28f29f8ca0d23024445fee1674b Mon Sep 17 00:00:00 2001
From: GarethF531 <167188366+GarethF531@users.noreply.github.com>
Date: Tue, 2 Sep 2025 13:30:18 +0200
Subject: [PATCH 13/48] Update default pipeline

---
 .circleci/config.yml | 3 +++
 1 file changed, 3 insertions(+)

diff --git a/.circleci/config.yml b/.circleci/config.yml
index 9effb189..0971ca5c 100644
--- a/.circleci/config.yml
+++ b/.circleci/config.yml
@@ -25,6 +25,9 @@ parameters:
   image_tag:
     type: string
     default: $CIRCLE_SHA1
+  workflow:
+    type: string
+    default: "deploy_to_pr_env"
 
 executors:
   base:

From bee1acd4249ae9bcec44457f8d49af9b749a6bc4 Mon Sep 17 00:00:00 2001
From: GarethF531 <167188366+GarethF531@users.noreply.github.com>
Date: Tue, 2 Sep 2025 13:31:15 +0200
Subject: [PATCH 14/48] Fixed app_name

---
 .circleci/config.yml | 3 +++
 1 file changed, 3 insertions(+)

diff --git a/.circleci/config.yml b/.circleci/config.yml
index 0971ca5c..65af8df9 100644
--- a/.circleci/config.yml
+++ b/.circleci/config.yml
@@ -28,6 +28,9 @@ parameters:
   workflow:
     type: string
     default: "deploy_to_pr_env"
+  app_name:
+    type: string
+    default: "twilio-webchat-widget"
 
 executors:
   base:

From b457a3231826d99d9edc9b25761014dc2278fdc8 Mon Sep 17 00:00:00 2001
From: GarethF531 <167188366+GarethF531@users.noreply.github.com>
Date: Tue, 2 Sep 2025 13:33:50 +0200
Subject: [PATCH 15/48] re-added steps to create ecr repository

---
 .circleci/config.yml | 18 +++++++++++++++++-
 1 file changed, 17 insertions(+), 1 deletion(-)

diff --git a/.circleci/config.yml b/.circleci/config.yml
index 65af8df9..49436752 100644
--- a/.circleci/config.yml
+++ b/.circleci/config.yml
@@ -128,7 +128,23 @@ workflows:
           region: << pipeline.parameters.region >>
           account: PRODUCTION HORIZONTAL TEST1
           persist: .aws
-      
+      - login-codeartifact-registry:
+          name: "Log in to AWS CodeArtifact"
+          requires:
+            - "Log in to AWS"
+      - aws-ecr-helper/create_aws_ecr: &create_ecr
+          name: "Create AWS ECR repository"
+          context: anyvan
+          module_path: "iac/terraform/image_repository"
+          app_name: << pipeline.parameters.app_name >>
+          tf_version: << pipeline.parameters.terraform_version >>
+          requires:
+            - "Log in to AWS"
+      - aws-ecr-helper/ecr_login: &ecr_login
+          name: "Log in to AWS ECR"
+          context: anyvan
+          requires:
+            - "Create AWS ECR repository"
       # Build Server Image for PR Environment
       - build-image:
           name: build_webchat_server_pr

From 116bb7b5a612f7e0edee416cd33d84309b80b449 Mon Sep 17 00:00:00 2001
From: GarethF531 <167188366+GarethF531@users.noreply.github.com>
Date: Tue, 2 Sep 2025 13:35:12 +0200
Subject: [PATCH 16/48] Removed log in to codeartifact

---
 .circleci/config.yml | 4 ----
 1 file changed, 4 deletions(-)

diff --git a/.circleci/config.yml b/.circleci/config.yml
index 49436752..54f820d5 100644
--- a/.circleci/config.yml
+++ b/.circleci/config.yml
@@ -128,10 +128,6 @@ workflows:
           region: << pipeline.parameters.region >>
           account: PRODUCTION HORIZONTAL TEST1
           persist: .aws
-      - login-codeartifact-registry:
-          name: "Log in to AWS CodeArtifact"
-          requires:
-            - "Log in to AWS"
       - aws-ecr-helper/create_aws_ecr: &create_ecr
           name: "Create AWS ECR repository"
           context: anyvan

From 3c74a13ec5e5782614670a481392c66d0f52461a Mon Sep 17 00:00:00 2001
From: GarethF531 <167188366+GarethF531@users.noreply.github.com>
Date: Tue, 2 Sep 2025 13:36:28 +0200
Subject: [PATCH 17/48] added necessary orbs

---
 .circleci/config.yml | 10 ++++++----
 1 file changed, 6 insertions(+), 4 deletions(-)

diff --git a/.circleci/config.yml b/.circleci/config.yml
index 54f820d5..f6ef5d61 100644
--- a/.circleci/config.yml
+++ b/.circleci/config.yml
@@ -1,13 +1,15 @@
 version: "2.1"
 
 orbs:
-  compliance: anyvan/compliance@1
-  ci: anyvan/ci@1
-  aws: anyvan/aws_auth_config@2
-  terraform-helper: anyvan/terraform-helper@1
   node: circleci/node@5.1.0
   aws-ecr: circleci/aws-ecr@9.0
   aws-cli: circleci/aws-cli@3.1
+  terraform-helper: anyvan/terraform-helper@1
+  aws: anyvan/aws_auth_config@1
+  deployments: anyvan/deployments@1
+  aws-ecr-helper: anyvan/aws-ecr-helper@2
+  aws-tunnel-helper: anyvan/aws-tunnel-helper@2
+  anyvan_github_ssh_key: anyvan/ssh_key_github@1
 
 parameters:
   region:

From 9bee8a387e646968bc0ac703ec44e393e8c428d9 Mon Sep 17 00:00:00 2001
From: GarethF531 <167188366+GarethF531@users.noreply.github.com>
Date: Tue, 2 Sep 2025 13:38:12 +0200
Subject: [PATCH 18/48] fixed order of actions in pipeline

---
 .circleci/config.yml | 4 ++--
 1 file changed, 2 insertions(+), 2 deletions(-)

diff --git a/.circleci/config.yml b/.circleci/config.yml
index f6ef5d61..fc5e56b6 100644
--- a/.circleci/config.yml
+++ b/.circleci/config.yml
@@ -153,7 +153,7 @@ workflows:
           dockerfile: Dockerfile.server
           env: testing
           requires:
-            - "Log in to AWS"
+            - "Log in to AWS ECR"
       
       # Build Client Image for PR Environment
       - build-image:
@@ -165,7 +165,7 @@ workflows:
           dockerfile: Dockerfile.client
           env: testing
           requires:
-            - "Log in to AWS"
+            - "Log in to AWS ECR"
       
       # Plan Terraform for PR Environment
       - terraform-helper/plan: &plan

From a506f3b859487f770031bba6c1371cc44443bf99 Mon Sep 17 00:00:00 2001
From: GarethF531 <167188366+GarethF531@users.noreply.github.com>
Date: Tue, 2 Sep 2025 13:45:17 +0200
Subject: [PATCH 19/48] Refacgtored folders

---
 {terraform => iac/terraform}/README.md        |  0
 .../terraform}/datadog_dashboard.tf           |  0
 .../terraform}/datadog_monitor.tf             |  0
 .../terraform}/datadog_service_definition.tf  |  0
 .../terraform}/env/production.tfvars          |  0
 .../terraform}/env/staging.tfvars             |  0
 .../terraform}/env/testing.tfvars             |  0
 .../files/ecr_retention_policies.json         |  0
 iac/terraform/image_repository/Makefile       | 85 +++++++++++++++++++
 .../image_repository}/ecr_repository.tf       |  0
 iac/terraform/image_repository/providers.tf   | 33 +++++++
 iac/terraform/image_repository/variables.tf   | 14 +++
 {terraform => iac/terraform}/locals.tf        |  0
 {terraform => iac/terraform}/providers.tf     |  0
 .../terraform}/secrets_manager.tf             |  0
 {terraform => iac/terraform}/variables.tf     |  0
 .../terraform}/webchat-widget-client.tf       |  0
 .../terraform}/webchat-widget-server.tf       |  0
 18 files changed, 132 insertions(+)
 rename {terraform => iac/terraform}/README.md (100%)
 rename {terraform => iac/terraform}/datadog_dashboard.tf (100%)
 rename {terraform => iac/terraform}/datadog_monitor.tf (100%)
 rename {terraform => iac/terraform}/datadog_service_definition.tf (100%)
 rename {terraform => iac/terraform}/env/production.tfvars (100%)
 rename {terraform => iac/terraform}/env/staging.tfvars (100%)
 rename {terraform => iac/terraform}/env/testing.tfvars (100%)
 rename {terraform => iac/terraform}/files/ecr_retention_policies.json (100%)
 create mode 100644 iac/terraform/image_repository/Makefile
 rename {terraform => iac/terraform/image_repository}/ecr_repository.tf (100%)
 create mode 100644 iac/terraform/image_repository/providers.tf
 create mode 100644 iac/terraform/image_repository/variables.tf
 rename {terraform => iac/terraform}/locals.tf (100%)
 rename {terraform => iac/terraform}/providers.tf (100%)
 rename {terraform => iac/terraform}/secrets_manager.tf (100%)
 rename {terraform => iac/terraform}/variables.tf (100%)
 rename {terraform => iac/terraform}/webchat-widget-client.tf (100%)
 rename {terraform => iac/terraform}/webchat-widget-server.tf (100%)

diff --git a/terraform/README.md b/iac/terraform/README.md
similarity index 100%
rename from terraform/README.md
rename to iac/terraform/README.md
diff --git a/terraform/datadog_dashboard.tf b/iac/terraform/datadog_dashboard.tf
similarity index 100%
rename from terraform/datadog_dashboard.tf
rename to iac/terraform/datadog_dashboard.tf
diff --git a/terraform/datadog_monitor.tf b/iac/terraform/datadog_monitor.tf
similarity index 100%
rename from terraform/datadog_monitor.tf
rename to iac/terraform/datadog_monitor.tf
diff --git a/terraform/datadog_service_definition.tf b/iac/terraform/datadog_service_definition.tf
similarity index 100%
rename from terraform/datadog_service_definition.tf
rename to iac/terraform/datadog_service_definition.tf
diff --git a/terraform/env/production.tfvars b/iac/terraform/env/production.tfvars
similarity index 100%
rename from terraform/env/production.tfvars
rename to iac/terraform/env/production.tfvars
diff --git a/terraform/env/staging.tfvars b/iac/terraform/env/staging.tfvars
similarity index 100%
rename from terraform/env/staging.tfvars
rename to iac/terraform/env/staging.tfvars
diff --git a/terraform/env/testing.tfvars b/iac/terraform/env/testing.tfvars
similarity index 100%
rename from terraform/env/testing.tfvars
rename to iac/terraform/env/testing.tfvars
diff --git a/terraform/files/ecr_retention_policies.json b/iac/terraform/files/ecr_retention_policies.json
similarity index 100%
rename from terraform/files/ecr_retention_policies.json
rename to iac/terraform/files/ecr_retention_policies.json
diff --git a/iac/terraform/image_repository/Makefile b/iac/terraform/image_repository/Makefile
new file mode 100644
index 00000000..d6ff2a58
--- /dev/null
+++ b/iac/terraform/image_repository/Makefile
@@ -0,0 +1,85 @@
+## Usage: make [target] ...
+## -
+## Targets:
+.ONESHELL:
+.PHONY: test
+
+# Terraform Workspace
+workspace =
+
+# Enviroment
+env =
+
+# Outputfile for plan
+planfile =
+
+# App Docker image
+application_container_image_url=
+
+# Build variables
+jira_ticket_number=
+gitsha1 =
+
+ifdef jira_ticket_number
+	# Terraform Workspace
+    workspace="${app_name}_pr-stage_${jira_ticket_number}"
+else
+	# Terraform Workspace
+    workspace="${app_name}_${env}"
+endif
+
+all:		init test plan ## - targets to run
+
+init:		clean ## - targets to run
+	terraform init -upgrade
+
+test:		init format validate ## - targets to run
+
+clean:		## remove state file and lock.
+	rm -rf .terraform .terraform.lock.hcl
+
+fullclean:	clean ## terraform state file, plan file
+	rm -rf *.tfplan
+
+.terraform:
+	make init
+
+format:		## check if the input is formatted. Options: `fix=true`
+ifdef fix
+	terraform fmt
+else
+	terraform fmt -check
+endif
+
+validate:
+	terraform validate
+
+plan:		init workspace ## show changes required by the current configuration.
+ifdef planfile
+	terraform plan -refresh=true -var "app_name=${app_name}" -var "terraform_version=${terraform_version}" -out=${planfile}
+else
+	terraform plan -var "app_name=${app_name}" -var "terraform_version=${terraform_version}" -refresh=true
+endif
+
+apply:		workspace ## create or update infrastructure
+ifdef planfile
+	terraform apply ${planfile}
+else
+	terraform apply -refresh=true -var "app_name=${app_name}"
+endif
+
+destroyplan:	 init workspace ## show changes on destroying infrastructure
+ifdef planfile
+	terraform plan -destroy -refresh=true -var "app_name=${app_name}" -var "jira_ticket_number=${jira_ticket_number}" -var "terraform_version=${terraform_version}" -out=${planfile}
+else
+	terraform plan -destroy -refresh=true -var "app_name=${app_name}" -var "jira_ticket_number=${jira_ticket_number}" -var "terraform_version=${terraform_version}"
+endif
+
+destroy:	 init workspace ## destroy infrastructure
+	terraform apply -destroy -var "application_container_image_url=no_image" -auto-approve
+
+help:		## show this help.
+	@sed -ne '/@sed/!s/## //p' $(MAKEFILE_LIST)
+
+workspace: 		# switch workspace
+	terraform workspace select ${workspace} || terraform workspace new ${workspace}
diff --git a/terraform/ecr_repository.tf b/iac/terraform/image_repository/ecr_repository.tf
similarity index 100%
rename from terraform/ecr_repository.tf
rename to iac/terraform/image_repository/ecr_repository.tf
diff --git a/iac/terraform/image_repository/providers.tf b/iac/terraform/image_repository/providers.tf
new file mode 100644
index 00000000..fe317c27
--- /dev/null
+++ b/iac/terraform/image_repository/providers.tf
@@ -0,0 +1,33 @@
+terraform {
+  required_version = "~>1.9"
+
+  required_providers {
+    aws = {
+      source  = "hashicorp/aws"
+      version = "~>5.60"
+    }
+  }
+
+  backend "s3" {
+    region         = "eu-west-1"                                     # this is the region where the bucket is created. It can be in a different region to where you deploy your resources.
+    bucket         = "anyvan-terraform-state-file-aws-accounts"      # name of the bucket
+    key            = "twilio-webchat-widget.tfstate"                # name of the state file for this particular terraform stack
+    dynamodb_table = "anyvan-terraform-state-file-lock-aws-accounts" # table where the lock is kept
+  }
+}
+
+provider "aws" {
+  region  = var.aws_region
+  profile = "horizontal"
+  alias   = "horizontal"
+
+  default_tags {
+    tags = {
+      squad             = "lemurs"
+      terraform_version = var.terraform_version
+      service           = var.app_name
+      env               = "horizontal"
+      version           = "1.0"
+    }
+  }
+}
diff --git a/iac/terraform/image_repository/variables.tf b/iac/terraform/image_repository/variables.tf
new file mode 100644
index 00000000..c0a77f42
--- /dev/null
+++ b/iac/terraform/image_repository/variables.tf
@@ -0,0 +1,14 @@
+variable "app_name" {
+  type        = string
+  description = "Name of the application. This will be used for configuring infrastructure "
+}
+
+variable "aws_region" {
+  type    = string
+  default = "eu-west-1"
+}
+
+variable "terraform_version" {
+  type        = string
+  description = "Version of Terraform to use"
+}
diff --git a/terraform/locals.tf b/iac/terraform/locals.tf
similarity index 100%
rename from terraform/locals.tf
rename to iac/terraform/locals.tf
diff --git a/terraform/providers.tf b/iac/terraform/providers.tf
similarity index 100%
rename from terraform/providers.tf
rename to iac/terraform/providers.tf
diff --git a/terraform/secrets_manager.tf b/iac/terraform/secrets_manager.tf
similarity index 100%
rename from terraform/secrets_manager.tf
rename to iac/terraform/secrets_manager.tf
diff --git a/terraform/variables.tf b/iac/terraform/variables.tf
similarity index 100%
rename from terraform/variables.tf
rename to iac/terraform/variables.tf
diff --git a/terraform/webchat-widget-client.tf b/iac/terraform/webchat-widget-client.tf
similarity index 100%
rename from terraform/webchat-widget-client.tf
rename to iac/terraform/webchat-widget-client.tf
diff --git a/terraform/webchat-widget-server.tf b/iac/terraform/webchat-widget-server.tf
similarity index 100%
rename from terraform/webchat-widget-server.tf
rename to iac/terraform/webchat-widget-server.tf

From 159a41695e3d3c91c15ec54f8d3278ae86c41f4f Mon Sep 17 00:00:00 2001
From: Sebastian Murray-Roberts <sebastian.murray@anyvan.com>
Date: Tue, 2 Sep 2025 13:49:15 +0200
Subject: [PATCH 20/48] Fix terraform formatting

---
 iac/terraform/image_repository/providers.tf | 2 +-
 iac/terraform/locals.tf                     | 2 +-
 iac/terraform/webchat-widget-client.tf      | 8 ++++----
 iac/terraform/webchat-widget-server.tf      | 2 +-
 4 files changed, 7 insertions(+), 7 deletions(-)

diff --git a/iac/terraform/image_repository/providers.tf b/iac/terraform/image_repository/providers.tf
index fe317c27..5d6470cc 100644
--- a/iac/terraform/image_repository/providers.tf
+++ b/iac/terraform/image_repository/providers.tf
@@ -11,7 +11,7 @@ terraform {
   backend "s3" {
     region         = "eu-west-1"                                     # this is the region where the bucket is created. It can be in a different region to where you deploy your resources.
     bucket         = "anyvan-terraform-state-file-aws-accounts"      # name of the bucket
-    key            = "twilio-webchat-widget.tfstate"                # name of the state file for this particular terraform stack
+    key            = "twilio-webchat-widget.tfstate"                 # name of the state file for this particular terraform stack
     dynamodb_table = "anyvan-terraform-state-file-lock-aws-accounts" # table where the lock is kept
   }
 }
diff --git a/iac/terraform/locals.tf b/iac/terraform/locals.tf
index deefc07f..5599d3ab 100644
--- a/iac/terraform/locals.tf
+++ b/iac/terraform/locals.tf
@@ -21,7 +21,7 @@ locals {
 
   internal_fqdn = var.env == "testing" ? replace(var.internal_fqdn, "<jira-ticket-number>", var.jira_ticket_number) : var.internal_fqdn
   external_fqdn = var.env == "testing" ? replace(var.external_fqdn, "<jira-ticket-number>", var.jira_ticket_number) : var.external_fqdn
-  
+
   # Server and Client specific FQDNs
   server_internal_fqdn = var.env == "testing" ? replace(var.server_internal_fqdn, "<jira-ticket-number>", var.jira_ticket_number) : var.server_internal_fqdn
   client_internal_fqdn = var.env == "testing" ? replace(var.client_internal_fqdn, "<jira-ticket-number>", var.jira_ticket_number) : var.client_internal_fqdn
diff --git a/iac/terraform/webchat-widget-client.tf b/iac/terraform/webchat-widget-client.tf
index 868552ab..236e51d5 100644
--- a/iac/terraform/webchat-widget-client.tf
+++ b/iac/terraform/webchat-widget-client.tf
@@ -30,15 +30,15 @@ module "webchat_client" {
 
   task_permissions = {
     allow_sm = {
-      sm_arns = []
+      sm_arns  = []
       key_arns = []
     }
     ecs_task_statements = []
   }
-  
+
   env_variables = {
-    NODE_ENV = "production"
-    PORT = "3000"
+    NODE_ENV             = "production"
+    PORT                 = "3000"
     REACT_APP_SERVER_URL = "https://${local.server_internal_fqdn}"
   }
 
diff --git a/iac/terraform/webchat-widget-server.tf b/iac/terraform/webchat-widget-server.tf
index c18e0c37..2c3bcb54 100644
--- a/iac/terraform/webchat-widget-server.tf
+++ b/iac/terraform/webchat-widget-server.tf
@@ -37,7 +37,7 @@ module "webchat_server" {
     }
     ecs_task_statements = []
   }
-  
+
   env_variables = {
     NODE_ENV = "production"
   }

From 3cb78747f8beca809cff12ecb1083d5599f8f032 Mon Sep 17 00:00:00 2001
From: Sebastian Murray-Roberts <sebastian.murray@anyvan.com>
Date: Tue, 2 Sep 2025 13:53:54 +0200
Subject: [PATCH 21/48] Fixed up ecr repo tf

---
 iac/terraform/ecr_repository.tf               |  74 ++++++++++
 .../image_repository/ecr_repository.tf        | 138 +++++++++---------
 2 files changed, 144 insertions(+), 68 deletions(-)
 create mode 100644 iac/terraform/ecr_repository.tf

diff --git a/iac/terraform/ecr_repository.tf b/iac/terraform/ecr_repository.tf
new file mode 100644
index 00000000..5fc61794
--- /dev/null
+++ b/iac/terraform/ecr_repository.tf
@@ -0,0 +1,74 @@
+locals {
+  ecr_keep_last_images_count = var.env == "production" ? 40 : 200
+}
+
+resource "aws_ecr_repository" "twilio_webchat_widget" {
+  count    = var.create_ecr_repository ? 1 : 0
+  name     = var.ecr_repository_name
+  provider = aws.horizontal
+
+  image_tag_mutability = "MUTABLE"
+
+  image_scanning_configuration {
+    scan_on_push = true
+  }
+
+  tags = tomap({ "Name" = var.ecr_repository_name })
+}
+
+resource "aws_ecr_repository_policy" "twilio_webchat_widget" {
+  policy     = data.aws_iam_policy_document.allows_other_accounts_to_retrieve.json
+  repository = aws_ecr_repository.twilio_webchat_widget[0].name
+  provider   = aws.horizontal
+}
+
+data "aws_iam_policy_document" "allows_other_accounts_to_retrieve" {
+  statement {
+    sid    = "CrossAccountRetrievalPermission"
+    effect = "Allow"
+    actions = [
+      "ecr:BatchCheckLayerAvailability",
+      "ecr:BatchGetImage",
+      "ecr:GetDownloadUrlForLayer"
+    ]
+    principals {
+      type = "AWS"
+      identifiers = [
+        for account_id in data.terraform_remote_state.accounts.outputs.aws_accounts_ids : "arn:aws:iam::${account_id}:root"
+      ]
+    }
+  }
+
+  statement {
+    sid    = "LambdaECRCrossAccountRerievalPermission"
+    effect = "Allow"
+    actions = [
+      "ecr:BatchCheckLayerAvailability",
+      "ecr:BatchGetImage",
+      "ecr:GetDownloadUrlForLayer"
+    ]
+    principals {
+      type = "Service"
+      identifiers = [
+        "lambda.amazonaws.com"
+      ]
+    }
+    condition {
+      test     = "StringLike"
+      variable = "aws:sourceArn"
+      values = [
+        for account_id in data.terraform_remote_state.accounts.outputs.aws_accounts_ids : "arn:aws:lambda:${var.region}:${account_id}:function:*"
+      ]
+    }
+  }
+}
+
+resource "aws_ecr_lifecycle_policy" "twilio_webchat_widget" {
+  repository = aws_ecr_repository.twilio_webchat_widget[0].name
+
+  policy = templatefile("${path.module}/files/ecr_retention_policies.json", {
+    countLastImages = local.ecr_keep_last_images_count
+  })
+
+  provider = aws.horizontal
+}
diff --git a/iac/terraform/image_repository/ecr_repository.tf b/iac/terraform/image_repository/ecr_repository.tf
index 5fc61794..c276047b 100644
--- a/iac/terraform/image_repository/ecr_repository.tf
+++ b/iac/terraform/image_repository/ecr_repository.tf
@@ -1,74 +1,76 @@
-locals {
-  ecr_keep_last_images_count = var.env == "production" ? 40 : 200
-}
-
-resource "aws_ecr_repository" "twilio_webchat_widget" {
-  count    = var.create_ecr_repository ? 1 : 0
-  name     = var.ecr_repository_name
-  provider = aws.horizontal
-
-  image_tag_mutability = "MUTABLE"
-
-  image_scanning_configuration {
-    scan_on_push = true
-  }
-
-  tags = tomap({ "Name" = var.ecr_repository_name })
-}
-
-resource "aws_ecr_repository_policy" "twilio_webchat_widget" {
-  policy     = data.aws_iam_policy_document.allows_other_accounts_to_retrieve.json
-  repository = aws_ecr_repository.twilio_webchat_widget[0].name
-  provider   = aws.horizontal
-}
+module "ecr_repository" {
+  source  = "terraform-registry.anyvan.com/anyvan/ecr_repository/aws"
+  version = "1.1.0"
 
-data "aws_iam_policy_document" "allows_other_accounts_to_retrieve" {
-  statement {
-    sid    = "CrossAccountRetrievalPermission"
-    effect = "Allow"
-    actions = [
-      "ecr:BatchCheckLayerAvailability",
-      "ecr:BatchGetImage",
-      "ecr:GetDownloadUrlForLayer"
-    ]
-    principals {
-      type = "AWS"
-      identifiers = [
-        for account_id in data.terraform_remote_state.accounts.outputs.aws_accounts_ids : "arn:aws:iam::${account_id}:root"
-      ]
-    }
+  providers = {
+    aws = aws.horizontal
   }
+  ecr_repository_name       = var.app_name
+  allow_cross_account_fetch = true
 
-  statement {
-    sid    = "LambdaECRCrossAccountRerievalPermission"
-    effect = "Allow"
-    actions = [
-      "ecr:BatchCheckLayerAvailability",
-      "ecr:BatchGetImage",
-      "ecr:GetDownloadUrlForLayer"
-    ]
-    principals {
-      type = "Service"
-      identifiers = [
-        "lambda.amazonaws.com"
+  lifecycle_policy = <<EOF
+    {
+      "rules": [
+        {
+          "description": "prevent removing latest two production images",
+          "rulePriority": 1,
+          "action": {
+            "type": "expire"
+          },
+          "selection": {
+            "countType": "imageCountMoreThan",
+            "countNumber": 2,
+            "tagStatus": "tagged",
+            "tagPatternList": [
+              "production*"
+            ]
+          }
+        },
+        {
+          "description": "prevent removing latest two staging images",
+          "rulePriority": 2,
+          "action": {
+            "type": "expire"
+          },
+          "selection": {
+            "countType": "imageCountMoreThan",
+            "countNumber": 2,
+            "tagStatus": "tagged",
+            "tagPatternList": [
+              "staging*"
+            ]
+          }
+        },
+        {
+          "description": "remove old pull_request images",
+          "rulePriority": 3,
+          "action": {
+            "type": "expire"
+          },
+          "selection": {
+            "countType": "sinceImagePushed",
+            "countUnit": "days",
+            "countNumber": 14,
+            "tagStatus": "tagged",
+            "tagPrefixList": [
+              "pull_request"
+            ]
+          }
+        },
+        {
+          "description": "remove any old images over 1 year",
+          "rulePriority": 10,
+          "action": {
+            "type": "expire"
+          },
+          "selection": {
+            "tagStatus": "any",
+            "countType": "sinceImagePushed",
+            "countUnit": "days",
+            "countNumber": 365
+          }
+        }
       ]
     }
-    condition {
-      test     = "StringLike"
-      variable = "aws:sourceArn"
-      values = [
-        for account_id in data.terraform_remote_state.accounts.outputs.aws_accounts_ids : "arn:aws:lambda:${var.region}:${account_id}:function:*"
-      ]
-    }
-  }
-}
-
-resource "aws_ecr_lifecycle_policy" "twilio_webchat_widget" {
-  repository = aws_ecr_repository.twilio_webchat_widget[0].name
-
-  policy = templatefile("${path.module}/files/ecr_retention_policies.json", {
-    countLastImages = local.ecr_keep_last_images_count
-  })
-
-  provider = aws.horizontal
+  EOF
 }

From 39f55958bdb9530d86843a2b80a7838ed9ea0aa4 Mon Sep 17 00:00:00 2001
From: Sebastian Murray-Roberts <sebastian.murray@anyvan.com>
Date: Tue, 2 Sep 2025 14:05:32 +0200
Subject: [PATCH 22/48] Fixed build executor for build and push

---
 .circleci/config.yml | 27 ++++++++++++++++++++++++++-
 1 file changed, 26 insertions(+), 1 deletion(-)

diff --git a/.circleci/config.yml b/.circleci/config.yml
index fc5e56b6..93b138b0 100644
--- a/.circleci/config.yml
+++ b/.circleci/config.yml
@@ -87,6 +87,7 @@ commands:
 
 jobs:
   build-image:
+    executor: node-docker
     parameters:
       image:
         type: string
@@ -100,9 +101,14 @@ jobs:
         type: string
       dockerfile:
         type: string
-    executor: iac-base
     steps:
       - checkout
+      - attach_workspace:
+            at: ~/
+      - run:
+        name: Ensure docker-credential-helper is installed
+        command: |
+          sudo apt update && sudo apt install amazon-ecr-credential-helper
       - setup_remote_docker:
           docker_layer_caching: false
           version: default
@@ -114,6 +120,25 @@ jobs:
           entry: << parameters.entry >>
           dockerfile: << parameters.dockerfile >>
 
+  tag_image:
+    executor:
+      name: aws-ecr/default
+    parameters:
+      additional_tag:
+        type: string
+      source_tag:
+        type: string
+        default: "$CIRCLE_SHA1"
+    steps:
+      - attach_workspace:
+          at: ~/
+      - anyvan_github_ssh_key/install_ssh_key
+      - aws-ecr/tag_image:
+          repo: "<< pipeline.parameters.app_name >>"
+          source_tag: "<< parameters.source_tag >>"
+          target_tag: "<< parameters.additional_tag >>"
+
+
 workflows:
   # Default workflow - Deploy to PR Environment
   deploy_to_pr_env:

From 334e75bebe8154d7db5b0d0836e1486a5e0cb133 Mon Sep 17 00:00:00 2001
From: Sebastian Murray-Roberts <sebastian.murray@anyvan.com>
Date: Tue, 2 Sep 2025 14:08:06 +0200
Subject: [PATCH 23/48] Fixed yaml error

---
 .circleci/config.yml | 55 +++++++++++---------------------------------
 1 file changed, 14 insertions(+), 41 deletions(-)

diff --git a/.circleci/config.yml b/.circleci/config.yml
index 93b138b0..89c29228 100644
--- a/.circleci/config.yml
+++ b/.circleci/config.yml
@@ -50,25 +50,33 @@ executors:
         aws_auth:
           oidc_role_arn: arn:aws:iam::$HORIZONTAL_ACCOUNT:role/circleci_oidc_role
 
-commands:
+jobs:
   build-and-push:
     parameters:
       image:
         type: string
-      env:
-        type: string
       project-root:
         type: string
+      env:
+        type: string
       repository:
         type: string
       entry:
         type: string
       dockerfile:
         type: string
-      ecr_app_host:
-        type: string
-        default: $AWS_ECR_APP_IMAGES_REPOSITORY_HOST
+    executor: node-docker
     steps:
+      - checkout
+      - attach_workspace:
+            at: ~/
+      - run:
+          name: Ensure docker-credential-helper is installed
+          command: |
+            sudo apt update && sudo apt install amazon-ecr-credential-helper
+      - setup_remote_docker:
+          docker_layer_caching: false
+          version: default
       - run:
           name: "Build and push image to ECR"
           command: |
@@ -85,41 +93,6 @@ commands:
             docker push $PROJECT_REPOSITORY_URL:<< parameters.image >>-latest
             docker push $PROJECT_REPOSITORY_URL:<< parameters.image >>-$CIRCLE_SHA1
 
-jobs:
-  build-image:
-    executor: node-docker
-    parameters:
-      image:
-        type: string
-      project-root:
-        type: string
-      env:
-        type: string
-      repository:
-        type: string
-      entry:
-        type: string
-      dockerfile:
-        type: string
-    steps:
-      - checkout
-      - attach_workspace:
-            at: ~/
-      - run:
-        name: Ensure docker-credential-helper is installed
-        command: |
-          sudo apt update && sudo apt install amazon-ecr-credential-helper
-      - setup_remote_docker:
-          docker_layer_caching: false
-          version: default
-      - build-and-push:
-          image: << parameters.image >>
-          env: << parameters.env >>
-          project-root: << parameters.project-root >>
-          repository: << parameters.repository >>
-          entry: << parameters.entry >>
-          dockerfile: << parameters.dockerfile >>
-
   tag_image:
     executor:
       name: aws-ecr/default

From 3b1710872c105e3cd22763ee0f117405d4a3b273 Mon Sep 17 00:00:00 2001
From: Sebastian Murray-Roberts <sebastian.murray@anyvan.com>
Date: Tue, 2 Sep 2025 14:08:56 +0200
Subject: [PATCH 24/48] Fixed build-image to reference build-and-push

---
 .circleci/config.yml | 4 ++--
 1 file changed, 2 insertions(+), 2 deletions(-)

diff --git a/.circleci/config.yml b/.circleci/config.yml
index 89c29228..86e221da 100644
--- a/.circleci/config.yml
+++ b/.circleci/config.yml
@@ -142,7 +142,7 @@ workflows:
           requires:
             - "Create AWS ECR repository"
       # Build Server Image for PR Environment
-      - build-image:
+      - build-and-push:
           name: build_webchat_server_pr
           project-root: .
           entry: .
@@ -154,7 +154,7 @@ workflows:
             - "Log in to AWS ECR"
       
       # Build Client Image for PR Environment
-      - build-image:
+      - build-and-push:
           name: build_webchat_client_pr
           project-root: .
           entry: .

From f1fc54412c96c7f8da17e69587590a1c62d05722 Mon Sep 17 00:00:00 2001
From: Sebastian Murray-Roberts <sebastian.murray@anyvan.com>
Date: Tue, 2 Sep 2025 14:13:46 +0200
Subject: [PATCH 25/48] Fix in build-and-push

---
 .circleci/config.yml | 15 ++++-----------
 1 file changed, 4 insertions(+), 11 deletions(-)

diff --git a/.circleci/config.yml b/.circleci/config.yml
index 86e221da..4293e1c3 100644
--- a/.circleci/config.yml
+++ b/.circleci/config.yml
@@ -80,17 +80,10 @@ jobs:
       - run:
           name: "Build and push image to ECR"
           command: |
-            PROJECT_REPOSITORY_URL=<< parameters.ecr_app_host >>/twilio-webchat-widget/<<parameters.env>>/<< parameters.repository >>
-            PROJECT_REPOSITORY_HOST=<< parameters.ecr_app_host >>
-            aws ecr get-login-password | docker login --username AWS --password-stdin $PROJECT_REPOSITORY_HOST
-            cd << parameters.project-root >>
-
-            docker build -f << parameters.dockerfile >> -t << parameters.image >>-latest \
-              << parameters.entry >>
-
-            docker tag << parameters.image >>-latest $PROJECT_REPOSITORY_URL:<< parameters.image >>-latest
-            docker tag << parameters.image >>-latest $PROJECT_REPOSITORY_URL:<< parameters.image >>-$CIRCLE_SHA1
-            docker push $PROJECT_REPOSITORY_URL:<< parameters.image >>-latest
+            PROJECT_REPOSITORY_URL=$AWS_ECR_CIRCLECI_IMAGES_REPOSITORY_HOST/twilio-webchat-widget/<<parameters.env>>/<< parameters.repository >>
+            PROJECT_REPOSITORY_HOST=$AWS_ECR_CIRCLECI_IMAGES_REPOSITORY_HOST
+            
+            docker build -f << parameters.dockerfile >> -t << parameters.image >>:$CIRCLE_SHA1  
             docker push $PROJECT_REPOSITORY_URL:<< parameters.image >>-$CIRCLE_SHA1
 
   tag_image:

From 14d32f0c0081204f031823a22e96fa8e05415a88 Mon Sep 17 00:00:00 2001
From: Sebastian Murray-Roberts <sebastian.murray@anyvan.com>
Date: Tue, 2 Sep 2025 14:22:52 +0200
Subject: [PATCH 26/48] Added context path for docker build

---
 .circleci/config.yml | 4 ++--
 1 file changed, 2 insertions(+), 2 deletions(-)

diff --git a/.circleci/config.yml b/.circleci/config.yml
index 4293e1c3..73054efd 100644
--- a/.circleci/config.yml
+++ b/.circleci/config.yml
@@ -83,8 +83,8 @@ jobs:
             PROJECT_REPOSITORY_URL=$AWS_ECR_CIRCLECI_IMAGES_REPOSITORY_HOST/twilio-webchat-widget/<<parameters.env>>/<< parameters.repository >>
             PROJECT_REPOSITORY_HOST=$AWS_ECR_CIRCLECI_IMAGES_REPOSITORY_HOST
             
-            docker build -f << parameters.dockerfile >> -t << parameters.image >>:$CIRCLE_SHA1  
-            docker push $PROJECT_REPOSITORY_URL:<< parameters.image >>-$CIRCLE_SHA1
+            docker build -f << parameters.dockerfile >> -t $PROJECT_REPOSITORY_URL/<< parameters.image >>:$CIRCLE_SHA1 .
+            docker push $PROJECT_REPOSITORY_URL/<< parameters.image >>:$CIRCLE_SHA1
 
   tag_image:
     executor:

From a721dd9593de6c9769a5675f5c0f54c0f34df18e Mon Sep 17 00:00:00 2001
From: Sebastian Murray-Roberts <sebastian.murray@anyvan.com>
Date: Tue, 2 Sep 2025 14:26:13 +0200
Subject: [PATCH 27/48] Added approval step before deploying

---
 .circleci/config.yml | 10 +++++++---
 1 file changed, 7 insertions(+), 3 deletions(-)

diff --git a/.circleci/config.yml b/.circleci/config.yml
index 73054efd..a6674051 100644
--- a/.circleci/config.yml
+++ b/.circleci/config.yml
@@ -157,7 +157,11 @@ workflows:
           env: testing
           requires:
             - "Log in to AWS ECR"
-      
+      - hold_pr:
+          type: approval
+          requires:
+            - build_webchat_client_pr
+            - build_webchat_server_pr
       # Plan Terraform for PR Environment
       - terraform-helper/plan: &plan
           name: plan_webchat_widget_pr
@@ -176,8 +180,8 @@ workflows:
           path: terraform/
           terraform_version: << pipeline.parameters.terraform_version >>
           requires:
-            - build_webchat_server_pr
-            - build_webchat_client_pr
+            - hold_pr
+            - hold_pr
       
       # Apply Terraform for PR Environment
       - terraform-helper/apply: &apply

From 38b2280490592d9fdd8a83a85def3e376e063022 Mon Sep 17 00:00:00 2001
From: Sebastian Murray-Roberts <sebastian.murray@anyvan.com>
Date: Tue, 2 Sep 2025 14:36:08 +0200
Subject: [PATCH 28/48] Fixed up the references to the ecr repo

---
 .circleci/config.yml            | 12 +++---
 iac/terraform/ecr_repository.tf | 74 ---------------------------------
 2 files changed, 6 insertions(+), 80 deletions(-)
 delete mode 100644 iac/terraform/ecr_repository.tf

diff --git a/.circleci/config.yml b/.circleci/config.yml
index a6674051..3f23f85f 100644
--- a/.circleci/config.yml
+++ b/.circleci/config.yml
@@ -32,7 +32,7 @@ parameters:
     default: "deploy_to_pr_env"
   app_name:
     type: string
-    default: "twilio-webchat-widget"
+    default: "<< pipeline.parameters.app_name >>"
 
 executors:
   base:
@@ -80,7 +80,7 @@ jobs:
       - run:
           name: "Build and push image to ECR"
           command: |
-            PROJECT_REPOSITORY_URL=$AWS_ECR_CIRCLECI_IMAGES_REPOSITORY_HOST/twilio-webchat-widget/<<parameters.env>>/<< parameters.repository >>
+            PROJECT_REPOSITORY_URL=$AWS_ECR_CIRCLECI_IMAGES_REPOSITORY_HOST/<< pipeline.parameters.app_name >>
             PROJECT_REPOSITORY_HOST=$AWS_ECR_CIRCLECI_IMAGES_REPOSITORY_HOST
             
             docker build -f << parameters.dockerfile >> -t $PROJECT_REPOSITORY_URL/<< parameters.image >>:$CIRCLE_SHA1 .
@@ -168,11 +168,11 @@ workflows:
           context:
             - anyvan
             - twilio-flex-stage
-          workspace: testing-twilio-webchat-widget-<< pipeline.parameters.jira_ticket_number >>
+          workspace: testing-<< pipeline.parameters.app_name >>-<< pipeline.parameters.jira_ticket_number >>
           var: >-
             jira_ticket_number=<< pipeline.parameters.jira_ticket_number >>,
-            server_container_image_url=$AWS_ECR_CIRCLECI_IMAGES_REPOSITORY_HOST/twilio-webchat-widget/testing/server:twilio-webchat-server-<< pipeline.parameters.image_tag >>,
-            client_container_image_url=$AWS_ECR_CIRCLECI_IMAGES_REPOSITORY_HOST/twilio-webchat-widget/testing/client:twilio-webchat-client-<< pipeline.parameters.image_tag >>,
+            server_container_image_url=$AWS_ECR_CIRCLECI_IMAGES_REPOSITORY_HOST/<< pipeline.parameters.app_name >>/twilio-webchat-server-<< pipeline.parameters.image_tag >>,
+            client_container_image_url=$AWS_ECR_CIRCLECI_IMAGES_REPOSITORY_HOST/<< pipeline.parameters.app_name >>/twilio-webchat-client-<< pipeline.parameters.image_tag >>,
             git_sha=$CIRCLE_SHA1,
             terraform_version=<< pipeline.parameters.terraform_version >>
           var_file: env/testing.tfvars
@@ -187,7 +187,7 @@ workflows:
       - terraform-helper/apply: &apply
           name: apply_webchat_widget_pr
           context: anyvan
-          workspace: testing-twilio-webchat-widget-<< pipeline.parameters.jira_ticket_number >>
+          workspace: testing-<< pipeline.parameters.app_name >>-<< pipeline.parameters.jira_ticket_number >>
           modules_branch: << pipeline.parameters.modules >>
           path: terraform/
           terraform_version: << pipeline.parameters.terraform_version >>
diff --git a/iac/terraform/ecr_repository.tf b/iac/terraform/ecr_repository.tf
deleted file mode 100644
index 5fc61794..00000000
--- a/iac/terraform/ecr_repository.tf
+++ /dev/null
@@ -1,74 +0,0 @@
-locals {
-  ecr_keep_last_images_count = var.env == "production" ? 40 : 200
-}
-
-resource "aws_ecr_repository" "twilio_webchat_widget" {
-  count    = var.create_ecr_repository ? 1 : 0
-  name     = var.ecr_repository_name
-  provider = aws.horizontal
-
-  image_tag_mutability = "MUTABLE"
-
-  image_scanning_configuration {
-    scan_on_push = true
-  }
-
-  tags = tomap({ "Name" = var.ecr_repository_name })
-}
-
-resource "aws_ecr_repository_policy" "twilio_webchat_widget" {
-  policy     = data.aws_iam_policy_document.allows_other_accounts_to_retrieve.json
-  repository = aws_ecr_repository.twilio_webchat_widget[0].name
-  provider   = aws.horizontal
-}
-
-data "aws_iam_policy_document" "allows_other_accounts_to_retrieve" {
-  statement {
-    sid    = "CrossAccountRetrievalPermission"
-    effect = "Allow"
-    actions = [
-      "ecr:BatchCheckLayerAvailability",
-      "ecr:BatchGetImage",
-      "ecr:GetDownloadUrlForLayer"
-    ]
-    principals {
-      type = "AWS"
-      identifiers = [
-        for account_id in data.terraform_remote_state.accounts.outputs.aws_accounts_ids : "arn:aws:iam::${account_id}:root"
-      ]
-    }
-  }
-
-  statement {
-    sid    = "LambdaECRCrossAccountRerievalPermission"
-    effect = "Allow"
-    actions = [
-      "ecr:BatchCheckLayerAvailability",
-      "ecr:BatchGetImage",
-      "ecr:GetDownloadUrlForLayer"
-    ]
-    principals {
-      type = "Service"
-      identifiers = [
-        "lambda.amazonaws.com"
-      ]
-    }
-    condition {
-      test     = "StringLike"
-      variable = "aws:sourceArn"
-      values = [
-        for account_id in data.terraform_remote_state.accounts.outputs.aws_accounts_ids : "arn:aws:lambda:${var.region}:${account_id}:function:*"
-      ]
-    }
-  }
-}
-
-resource "aws_ecr_lifecycle_policy" "twilio_webchat_widget" {
-  repository = aws_ecr_repository.twilio_webchat_widget[0].name
-
-  policy = templatefile("${path.module}/files/ecr_retention_policies.json", {
-    countLastImages = local.ecr_keep_last_images_count
-  })
-
-  provider = aws.horizontal
-}

From c9a0816fb7201443dac1b019a5e31c6e1e12aaa6 Mon Sep 17 00:00:00 2001
From: Sebastian Murray-Roberts <sebastian.murray@anyvan.com>
Date: Tue, 2 Sep 2025 14:37:48 +0200
Subject: [PATCH 29/48] Fixed app name

---
 .circleci/config.yml | 6 +++---
 1 file changed, 3 insertions(+), 3 deletions(-)

diff --git a/.circleci/config.yml b/.circleci/config.yml
index 3f23f85f..8fcb5ba2 100644
--- a/.circleci/config.yml
+++ b/.circleci/config.yml
@@ -32,7 +32,7 @@ parameters:
     default: "deploy_to_pr_env"
   app_name:
     type: string
-    default: "<< pipeline.parameters.app_name >>"
+    default: "twilio-webchat-widget"
 
 executors:
   base:
@@ -145,7 +145,7 @@ workflows:
           env: testing
           requires:
             - "Log in to AWS ECR"
-      
+
       # Build Client Image for PR Environment
       - build-and-push:
           name: build_webchat_client_pr
@@ -182,7 +182,7 @@ workflows:
           requires:
             - hold_pr
             - hold_pr
-      
+
       # Apply Terraform for PR Environment
       - terraform-helper/apply: &apply
           name: apply_webchat_widget_pr

From fc4ac244991b20e65899f2cedac0a11f86fe9eb2 Mon Sep 17 00:00:00 2001
From: Sebastian Murray-Roberts <sebastian.murray@anyvan.com>
Date: Tue, 2 Sep 2025 14:44:55 +0200
Subject: [PATCH 30/48] Fixed image tag format

---
 .circleci/config.yml | 24 +++++++++++-------------
 1 file changed, 11 insertions(+), 13 deletions(-)

diff --git a/.circleci/config.yml b/.circleci/config.yml
index 8fcb5ba2..44783532 100644
--- a/.circleci/config.yml
+++ b/.circleci/config.yml
@@ -82,10 +82,8 @@ jobs:
           command: |
             PROJECT_REPOSITORY_URL=$AWS_ECR_CIRCLECI_IMAGES_REPOSITORY_HOST/<< pipeline.parameters.app_name >>
             PROJECT_REPOSITORY_HOST=$AWS_ECR_CIRCLECI_IMAGES_REPOSITORY_HOST
-            
-            docker build -f << parameters.dockerfile >> -t $PROJECT_REPOSITORY_URL/<< parameters.image >>:$CIRCLE_SHA1 .
-            docker push $PROJECT_REPOSITORY_URL/<< parameters.image >>:$CIRCLE_SHA1
-
+            docker build -f << parameters.dockerfile >> -t "${PROJECT_REPOSITORY_URL}/<< parameters.image >>:${CIRCLE_SHA1}" .
+            docker push "${PROJECT_REPOSITORY_URL}/<< parameters.image >>:${CIRCLE_SHA1}"
   tag_image:
     executor:
       name: aws-ecr/default
@@ -121,19 +119,19 @@ workflows:
           region: << pipeline.parameters.region >>
           account: PRODUCTION HORIZONTAL TEST1
           persist: .aws
-      - aws-ecr-helper/create_aws_ecr: &create_ecr
-          name: "Create AWS ECR repository"
-          context: anyvan
-          module_path: "iac/terraform/image_repository"
-          app_name: << pipeline.parameters.app_name >>
-          tf_version: << pipeline.parameters.terraform_version >>
-          requires:
-            - "Log in to AWS"
+#      - aws-ecr-helper/create_aws_ecr: &create_ecr
+#          name: "Create AWS ECR repository"
+#          context: anyvan
+#          module_path: "iac/terraform/image_repository"
+#          app_name: << pipeline.parameters.app_name >>
+#          tf_version: << pipeline.parameters.terraform_version >>
+#          requires:
+#            - "Log in to AWS"
       - aws-ecr-helper/ecr_login: &ecr_login
           name: "Log in to AWS ECR"
           context: anyvan
           requires:
-            - "Create AWS ECR repository"
+            - "Log in to AWS"
       # Build Server Image for PR Environment
       - build-and-push:
           name: build_webchat_server_pr

From 9d080bcd882e64695411d2af6c760e302d0ac4c8 Mon Sep 17 00:00:00 2001
From: Sebastian Murray-Roberts <sebastian.murray@anyvan.com>
Date: Tue, 2 Sep 2025 14:53:07 +0200
Subject: [PATCH 31/48] Addedd config for client and server repo

---
 .circleci/config.yml                          | 18 ++---
 ...ecr_repository.tf => client_repository.tf} |  2 +-
 .../image_repository/server_repository.tf     | 76 +++++++++++++++++++
 3 files changed, 86 insertions(+), 10 deletions(-)
 rename iac/terraform/image_repository/{ecr_repository.tf => client_repository.tf} (96%)
 create mode 100644 iac/terraform/image_repository/server_repository.tf

diff --git a/.circleci/config.yml b/.circleci/config.yml
index 44783532..fff369a5 100644
--- a/.circleci/config.yml
+++ b/.circleci/config.yml
@@ -119,19 +119,19 @@ workflows:
           region: << pipeline.parameters.region >>
           account: PRODUCTION HORIZONTAL TEST1
           persist: .aws
-#      - aws-ecr-helper/create_aws_ecr: &create_ecr
-#          name: "Create AWS ECR repository"
-#          context: anyvan
-#          module_path: "iac/terraform/image_repository"
-#          app_name: << pipeline.parameters.app_name >>
-#          tf_version: << pipeline.parameters.terraform_version >>
-#          requires:
-#            - "Log in to AWS"
+      - aws-ecr-helper/create_aws_ecr: &create_ecr
+          name: "Create AWS ECR repository"
+          context: anyvan
+          module_path: "iac/terraform/image_repository"
+          app_name: << pipeline.parameters.app_name >>
+          tf_version: << pipeline.parameters.terraform_version >>
+          requires:
+            - "Log in to AWS"
       - aws-ecr-helper/ecr_login: &ecr_login
           name: "Log in to AWS ECR"
           context: anyvan
           requires:
-            - "Log in to AWS"
+            - "Create AWS ECR repository"
       # Build Server Image for PR Environment
       - build-and-push:
           name: build_webchat_server_pr
diff --git a/iac/terraform/image_repository/ecr_repository.tf b/iac/terraform/image_repository/client_repository.tf
similarity index 96%
rename from iac/terraform/image_repository/ecr_repository.tf
rename to iac/terraform/image_repository/client_repository.tf
index c276047b..a526a996 100644
--- a/iac/terraform/image_repository/ecr_repository.tf
+++ b/iac/terraform/image_repository/client_repository.tf
@@ -5,7 +5,7 @@ module "ecr_repository" {
   providers = {
     aws = aws.horizontal
   }
-  ecr_repository_name       = var.app_name
+  ecr_repository_name       = "${var.app_name}/twilio-webchat-client"
   allow_cross_account_fetch = true
 
   lifecycle_policy = <<EOF
diff --git a/iac/terraform/image_repository/server_repository.tf b/iac/terraform/image_repository/server_repository.tf
new file mode 100644
index 00000000..a1a9f613
--- /dev/null
+++ b/iac/terraform/image_repository/server_repository.tf
@@ -0,0 +1,76 @@
+module "ecr_repository" {
+  source  = "terraform-registry.anyvan.com/anyvan/ecr_repository/aws"
+  version = "1.1.0"
+
+  providers = {
+    aws = aws.horizontal
+  }
+  ecr_repository_name       = "${var.app_name}/twilio-webchat-server"
+  allow_cross_account_fetch = true
+
+  lifecycle_policy = <<EOF
+    {
+      "rules": [
+        {
+          "description": "prevent removing latest two production images",
+          "rulePriority": 1,
+          "action": {
+            "type": "expire"
+          },
+          "selection": {
+            "countType": "imageCountMoreThan",
+            "countNumber": 2,
+            "tagStatus": "tagged",
+            "tagPatternList": [
+              "production*"
+            ]
+          }
+        },
+        {
+          "description": "prevent removing latest two staging images",
+          "rulePriority": 2,
+          "action": {
+            "type": "expire"
+          },
+          "selection": {
+            "countType": "imageCountMoreThan",
+            "countNumber": 2,
+            "tagStatus": "tagged",
+            "tagPatternList": [
+              "staging*"
+            ]
+          }
+        },
+        {
+          "description": "remove old pull_request images",
+          "rulePriority": 3,
+          "action": {
+            "type": "expire"
+          },
+          "selection": {
+            "countType": "sinceImagePushed",
+            "countUnit": "days",
+            "countNumber": 14,
+            "tagStatus": "tagged",
+            "tagPrefixList": [
+              "pull_request"
+            ]
+          }
+        },
+        {
+          "description": "remove any old images over 1 year",
+          "rulePriority": 10,
+          "action": {
+            "type": "expire"
+          },
+          "selection": {
+            "tagStatus": "any",
+            "countType": "sinceImagePushed",
+            "countUnit": "days",
+            "countNumber": 365
+          }
+        }
+      ]
+    }
+  EOF
+}

From d0647c00b8905c13f9ee53331dd78217edd878e5 Mon Sep 17 00:00:00 2001
From: Sebastian Murray-Roberts <sebastian.murray@anyvan.com>
Date: Tue, 2 Sep 2025 15:01:16 +0200
Subject: [PATCH 32/48] Went back to one repo and used tags to differentiate
 the images

---
 .circleci/config.yml                          | 23 +++---
 ...client_repository.tf => ecr_repository.tf} |  2 +-
 .../image_repository/server_repository.tf     | 76 -------------------
 3 files changed, 12 insertions(+), 89 deletions(-)
 rename iac/terraform/image_repository/{client_repository.tf => ecr_repository.tf} (96%)
 delete mode 100644 iac/terraform/image_repository/server_repository.tf

diff --git a/.circleci/config.yml b/.circleci/config.yml
index fff369a5..62415e25 100644
--- a/.circleci/config.yml
+++ b/.circleci/config.yml
@@ -81,9 +81,8 @@ jobs:
           name: "Build and push image to ECR"
           command: |
             PROJECT_REPOSITORY_URL=$AWS_ECR_CIRCLECI_IMAGES_REPOSITORY_HOST/<< pipeline.parameters.app_name >>
-            PROJECT_REPOSITORY_HOST=$AWS_ECR_CIRCLECI_IMAGES_REPOSITORY_HOST
-            docker build -f << parameters.dockerfile >> -t "${PROJECT_REPOSITORY_URL}/<< parameters.image >>:${CIRCLE_SHA1}" .
-            docker push "${PROJECT_REPOSITORY_URL}/<< parameters.image >>:${CIRCLE_SHA1}"
+            docker build -f << parameters.dockerfile >> -t "${PROJECT_REPOSITORY_URL}:<< parameters.image >>-${CIRCLE_SHA1}" .
+            docker push "${PROJECT_REPOSITORY_URL}:<< parameters.image >>-${CIRCLE_SHA1}"
   tag_image:
     executor:
       name: aws-ecr/default
@@ -119,19 +118,19 @@ workflows:
           region: << pipeline.parameters.region >>
           account: PRODUCTION HORIZONTAL TEST1
           persist: .aws
-      - aws-ecr-helper/create_aws_ecr: &create_ecr
-          name: "Create AWS ECR repository"
-          context: anyvan
-          module_path: "iac/terraform/image_repository"
-          app_name: << pipeline.parameters.app_name >>
-          tf_version: << pipeline.parameters.terraform_version >>
-          requires:
-            - "Log in to AWS"
+#      - aws-ecr-helper/create_aws_ecr: &create_ecr
+#          name: "Create AWS ECR repository"
+#          context: anyvan
+#          module_path: "iac/terraform/image_repository"
+#          app_name: << pipeline.parameters.app_name >>
+#          tf_version: << pipeline.parameters.terraform_version >>
+#          requires:
+#            - "Log in to AWS"
       - aws-ecr-helper/ecr_login: &ecr_login
           name: "Log in to AWS ECR"
           context: anyvan
           requires:
-            - "Create AWS ECR repository"
+            - "Log in to AWS"
       # Build Server Image for PR Environment
       - build-and-push:
           name: build_webchat_server_pr
diff --git a/iac/terraform/image_repository/client_repository.tf b/iac/terraform/image_repository/ecr_repository.tf
similarity index 96%
rename from iac/terraform/image_repository/client_repository.tf
rename to iac/terraform/image_repository/ecr_repository.tf
index a526a996..c276047b 100644
--- a/iac/terraform/image_repository/client_repository.tf
+++ b/iac/terraform/image_repository/ecr_repository.tf
@@ -5,7 +5,7 @@ module "ecr_repository" {
   providers = {
     aws = aws.horizontal
   }
-  ecr_repository_name       = "${var.app_name}/twilio-webchat-client"
+  ecr_repository_name       = var.app_name
   allow_cross_account_fetch = true
 
   lifecycle_policy = <<EOF
diff --git a/iac/terraform/image_repository/server_repository.tf b/iac/terraform/image_repository/server_repository.tf
deleted file mode 100644
index a1a9f613..00000000
--- a/iac/terraform/image_repository/server_repository.tf
+++ /dev/null
@@ -1,76 +0,0 @@
-module "ecr_repository" {
-  source  = "terraform-registry.anyvan.com/anyvan/ecr_repository/aws"
-  version = "1.1.0"
-
-  providers = {
-    aws = aws.horizontal
-  }
-  ecr_repository_name       = "${var.app_name}/twilio-webchat-server"
-  allow_cross_account_fetch = true
-
-  lifecycle_policy = <<EOF
-    {
-      "rules": [
-        {
-          "description": "prevent removing latest two production images",
-          "rulePriority": 1,
-          "action": {
-            "type": "expire"
-          },
-          "selection": {
-            "countType": "imageCountMoreThan",
-            "countNumber": 2,
-            "tagStatus": "tagged",
-            "tagPatternList": [
-              "production*"
-            ]
-          }
-        },
-        {
-          "description": "prevent removing latest two staging images",
-          "rulePriority": 2,
-          "action": {
-            "type": "expire"
-          },
-          "selection": {
-            "countType": "imageCountMoreThan",
-            "countNumber": 2,
-            "tagStatus": "tagged",
-            "tagPatternList": [
-              "staging*"
-            ]
-          }
-        },
-        {
-          "description": "remove old pull_request images",
-          "rulePriority": 3,
-          "action": {
-            "type": "expire"
-          },
-          "selection": {
-            "countType": "sinceImagePushed",
-            "countUnit": "days",
-            "countNumber": 14,
-            "tagStatus": "tagged",
-            "tagPrefixList": [
-              "pull_request"
-            ]
-          }
-        },
-        {
-          "description": "remove any old images over 1 year",
-          "rulePriority": 10,
-          "action": {
-            "type": "expire"
-          },
-          "selection": {
-            "tagStatus": "any",
-            "countType": "sinceImagePushed",
-            "countUnit": "days",
-            "countNumber": 365
-          }
-        }
-      ]
-    }
-  EOF
-}

From 90a7b7920194f2f722daaa2ac75abbfb922caaa8 Mon Sep 17 00:00:00 2001
From: Sebastian Murray-Roberts <sebastian.murray@anyvan.com>
Date: Tue, 2 Sep 2025 15:11:10 +0200
Subject: [PATCH 33/48] Added logging to check repo url

---
 .circleci/config.yml | 1 +
 1 file changed, 1 insertion(+)

diff --git a/.circleci/config.yml b/.circleci/config.yml
index 62415e25..195a1e1a 100644
--- a/.circleci/config.yml
+++ b/.circleci/config.yml
@@ -81,6 +81,7 @@ jobs:
           name: "Build and push image to ECR"
           command: |
             PROJECT_REPOSITORY_URL=$AWS_ECR_CIRCLECI_IMAGES_REPOSITORY_HOST/<< pipeline.parameters.app_name >>
+            echo "Repository URL: $PROJECT_REPOSITORY_URL"
             docker build -f << parameters.dockerfile >> -t "${PROJECT_REPOSITORY_URL}:<< parameters.image >>-${CIRCLE_SHA1}" .
             docker push "${PROJECT_REPOSITORY_URL}:<< parameters.image >>-${CIRCLE_SHA1}"
   tag_image:

From ca3d3ef09179ce386ef1cea2cb2a2e5c130eab11 Mon Sep 17 00:00:00 2001
From: Sebastian Murray-Roberts <sebastian.murray@anyvan.com>
Date: Tue, 2 Sep 2025 15:54:14 +0200
Subject: [PATCH 34/48] Added logging for project repository url

---
 .circleci/config.yml | 6 +++---
 1 file changed, 3 insertions(+), 3 deletions(-)

diff --git a/.circleci/config.yml b/.circleci/config.yml
index 195a1e1a..27fcaf56 100644
--- a/.circleci/config.yml
+++ b/.circleci/config.yml
@@ -80,10 +80,10 @@ jobs:
       - run:
           name: "Build and push image to ECR"
           command: |
-            PROJECT_REPOSITORY_URL=$AWS_ECR_CIRCLECI_IMAGES_REPOSITORY_HOST/<< pipeline.parameters.app_name >>
+            PROJECT_REPOSITORY_URL=$AWS_ECR_APP_IMAGES_REPOSITORY_HOST/<< pipeline.parameters.app_name>>/<<parameters.env>>/<< parameters.image >>
             echo "Repository URL: $PROJECT_REPOSITORY_URL"
-            docker build -f << parameters.dockerfile >> -t "${PROJECT_REPOSITORY_URL}:<< parameters.image >>-${CIRCLE_SHA1}" .
-            docker push "${PROJECT_REPOSITORY_URL}:<< parameters.image >>-${CIRCLE_SHA1}"
+            docker build -f << parameters.dockerfile >> -t "${PROJECT_REPOSITORY_URL}:${CIRCLE_SHA1}" .
+            docker push "${PROJECT_REPOSITORY_URL}:${CIRCLE_SHA1}"
   tag_image:
     executor:
       name: aws-ecr/default

From 2ab44385bb99ef12ef74b591c1fb0b530fd84f80 Mon Sep 17 00:00:00 2001
From: Sebastian Murray-Roberts <sebastian.murray@anyvan.com>
Date: Tue, 2 Sep 2025 16:04:07 +0200
Subject: [PATCH 35/48] Used hard-coded ecr url host for now

---
 .circleci/config.yml | 3 ++-
 1 file changed, 2 insertions(+), 1 deletion(-)

diff --git a/.circleci/config.yml b/.circleci/config.yml
index 27fcaf56..9716614b 100644
--- a/.circleci/config.yml
+++ b/.circleci/config.yml
@@ -80,7 +80,8 @@ jobs:
       - run:
           name: "Build and push image to ECR"
           command: |
-            PROJECT_REPOSITORY_URL=$AWS_ECR_APP_IMAGES_REPOSITORY_HOST/<< pipeline.parameters.app_name>>/<<parameters.env>>/<< parameters.image >>
+            PROJECT_REPO_HOST="331151898531.dkr.ecr.eu-west-1.amazonaws.com"
+            PROJECT_REPOSITORY_URL=$PROJECT_REPO_HOST/<< pipeline.parameters.app_name>>/<<parameters.env>>/<< parameters.image >>
             echo "Repository URL: $PROJECT_REPOSITORY_URL"
             docker build -f << parameters.dockerfile >> -t "${PROJECT_REPOSITORY_URL}:${CIRCLE_SHA1}" .
             docker push "${PROJECT_REPOSITORY_URL}:${CIRCLE_SHA1}"

From 5e0ff5fe07914a02721d5b97cfd658c6de2e0e7a Mon Sep 17 00:00:00 2001
From: Sebastian Murray-Roberts <sebastian.murray@anyvan.com>
Date: Tue, 2 Sep 2025 16:18:21 +0200
Subject: [PATCH 36/48] Tried using variables to create separate ecr
 repositories

---
 .circleci/config.yml                          | 25 ++++++++++++-------
 .../image_repository/ecr_repository.tf        |  2 +-
 iac/terraform/image_repository/variables.tf   | 10 ++++++++
 3 files changed, 27 insertions(+), 10 deletions(-)

diff --git a/.circleci/config.yml b/.circleci/config.yml
index 9716614b..9aa26826 100644
--- a/.circleci/config.yml
+++ b/.circleci/config.yml
@@ -120,19 +120,26 @@ workflows:
           region: << pipeline.parameters.region >>
           account: PRODUCTION HORIZONTAL TEST1
           persist: .aws
-#      - aws-ecr-helper/create_aws_ecr: &create_ecr
-#          name: "Create AWS ECR repository"
-#          context: anyvan
-#          module_path: "iac/terraform/image_repository"
-#          app_name: << pipeline.parameters.app_name >>
-#          tf_version: << pipeline.parameters.terraform_version >>
-#          requires:
-#            - "Log in to AWS"
+      - aws-ecr-helper/create_aws_ecr: &create_ecr
+          name: "Create AWS ECR Client repository"
+          context: anyvan
+          module_path: "iac/terraform/image_repository"
+          app_name: << pipeline.parameters.app_name >>
+          env: testing
+          repository_name: twilio-webchat-client
+          tf_version: << pipeline.parameters.terraform_version >>
+          requires:
+            - "Log in to AWS"
+      - aws-ecr-helper/create_aws_ecr:
+          <<: *create_ecr
+          name: "Create AWS ECR Server repository"
+          repository_name: twilio-webchat-server
       - aws-ecr-helper/ecr_login: &ecr_login
           name: "Log in to AWS ECR"
           context: anyvan
           requires:
-            - "Log in to AWS"
+            - "Create AWS ECR Server repository"
+            - "Create AWS ECR Client repository"
       # Build Server Image for PR Environment
       - build-and-push:
           name: build_webchat_server_pr
diff --git a/iac/terraform/image_repository/ecr_repository.tf b/iac/terraform/image_repository/ecr_repository.tf
index c276047b..9285398d 100644
--- a/iac/terraform/image_repository/ecr_repository.tf
+++ b/iac/terraform/image_repository/ecr_repository.tf
@@ -5,7 +5,7 @@ module "ecr_repository" {
   providers = {
     aws = aws.horizontal
   }
-  ecr_repository_name       = var.app_name
+  ecr_repository_name       = "${var.app_name}/${var.env}/${var.repository_name}"
   allow_cross_account_fetch = true
 
   lifecycle_policy = <<EOF
diff --git a/iac/terraform/image_repository/variables.tf b/iac/terraform/image_repository/variables.tf
index c0a77f42..62da6195 100644
--- a/iac/terraform/image_repository/variables.tf
+++ b/iac/terraform/image_repository/variables.tf
@@ -3,6 +3,16 @@ variable "app_name" {
   description = "Name of the application. This will be used for configuring infrastructure "
 }
 
+variable "env" {
+  type        = string
+  description = "Environment to deploy to"
+}
+
+variable "repository_name" {
+  type        = string
+  description = "Name of the repository. This will be used for configuring infrastructure "
+}
+
 variable "aws_region" {
   type    = string
   default = "eu-west-1"

From e93ac62813eccac20487bae9b34f335d80d73fc4 Mon Sep 17 00:00:00 2001
From: Sebastian Murray-Roberts <sebastian.murray@anyvan.com>
Date: Tue, 2 Sep 2025 16:26:53 +0200
Subject: [PATCH 37/48] Tried using image name to create ECR repo

---
 .circleci/config.yml | 8 +++-----
 1 file changed, 3 insertions(+), 5 deletions(-)

diff --git a/.circleci/config.yml b/.circleci/config.yml
index 9aa26826..57cbd1e8 100644
--- a/.circleci/config.yml
+++ b/.circleci/config.yml
@@ -81,7 +81,7 @@ jobs:
           name: "Build and push image to ECR"
           command: |
             PROJECT_REPO_HOST="331151898531.dkr.ecr.eu-west-1.amazonaws.com"
-            PROJECT_REPOSITORY_URL=$PROJECT_REPO_HOST/<< pipeline.parameters.app_name>>/<<parameters.env>>/<< parameters.image >>
+            PROJECT_REPOSITORY_URL=$PROJECT_REPO_HOST/<< parameters.image >>
             echo "Repository URL: $PROJECT_REPOSITORY_URL"
             docker build -f << parameters.dockerfile >> -t "${PROJECT_REPOSITORY_URL}:${CIRCLE_SHA1}" .
             docker push "${PROJECT_REPOSITORY_URL}:${CIRCLE_SHA1}"
@@ -124,16 +124,14 @@ workflows:
           name: "Create AWS ECR Client repository"
           context: anyvan
           module_path: "iac/terraform/image_repository"
-          app_name: << pipeline.parameters.app_name >>
-          env: testing
-          repository_name: twilio-webchat-client
+          app_name: twilio-webchat-client
           tf_version: << pipeline.parameters.terraform_version >>
           requires:
             - "Log in to AWS"
       - aws-ecr-helper/create_aws_ecr:
           <<: *create_ecr
           name: "Create AWS ECR Server repository"
-          repository_name: twilio-webchat-server
+          app_name: twilio-webchat-server
       - aws-ecr-helper/ecr_login: &ecr_login
           name: "Log in to AWS ECR"
           context: anyvan

From 48de6b9dd84c02ae2689ad565965f56dd2909922 Mon Sep 17 00:00:00 2001
From: Sebastian Murray-Roberts <sebastian.murray@anyvan.com>
Date: Tue, 2 Sep 2025 16:32:09 +0200
Subject: [PATCH 38/48] SHoould be the final fix for the ECR repo names

---
 .circleci/config.yml                             | 6 +++---
 iac/terraform/image_repository/ecr_repository.tf | 2 +-
 2 files changed, 4 insertions(+), 4 deletions(-)

diff --git a/.circleci/config.yml b/.circleci/config.yml
index 57cbd1e8..ec5f2a2d 100644
--- a/.circleci/config.yml
+++ b/.circleci/config.yml
@@ -81,7 +81,7 @@ jobs:
           name: "Build and push image to ECR"
           command: |
             PROJECT_REPO_HOST="331151898531.dkr.ecr.eu-west-1.amazonaws.com"
-            PROJECT_REPOSITORY_URL=$PROJECT_REPO_HOST/<< parameters.image >>
+            PROJECT_REPOSITORY_URL=$PROJECT_REPO_HOST/<< pipeline.parameters.app_name>>/<<parameters.env>>/<< parameters.image >>
             echo "Repository URL: $PROJECT_REPOSITORY_URL"
             docker build -f << parameters.dockerfile >> -t "${PROJECT_REPOSITORY_URL}:${CIRCLE_SHA1}" .
             docker push "${PROJECT_REPOSITORY_URL}:${CIRCLE_SHA1}"
@@ -124,14 +124,14 @@ workflows:
           name: "Create AWS ECR Client repository"
           context: anyvan
           module_path: "iac/terraform/image_repository"
-          app_name: twilio-webchat-client
+          app_name: << pipeline.parameters.app_name >>/testing/twilio-webchat-client
           tf_version: << pipeline.parameters.terraform_version >>
           requires:
             - "Log in to AWS"
       - aws-ecr-helper/create_aws_ecr:
           <<: *create_ecr
           name: "Create AWS ECR Server repository"
-          app_name: twilio-webchat-server
+          app_name: << pipeline.parameters.app_name >>/testing/twilio-webchat-server
       - aws-ecr-helper/ecr_login: &ecr_login
           name: "Log in to AWS ECR"
           context: anyvan
diff --git a/iac/terraform/image_repository/ecr_repository.tf b/iac/terraform/image_repository/ecr_repository.tf
index 9285398d..c276047b 100644
--- a/iac/terraform/image_repository/ecr_repository.tf
+++ b/iac/terraform/image_repository/ecr_repository.tf
@@ -5,7 +5,7 @@ module "ecr_repository" {
   providers = {
     aws = aws.horizontal
   }
-  ecr_repository_name       = "${var.app_name}/${var.env}/${var.repository_name}"
+  ecr_repository_name       = var.app_name
   allow_cross_account_fetch = true
 
   lifecycle_policy = <<EOF

From cafa43c1b895aba191cd5e5824180936c52e9c71 Mon Sep 17 00:00:00 2001
From: Sebastian Murray-Roberts <sebastian.murray@anyvan.com>
Date: Tue, 2 Sep 2025 16:35:50 +0200
Subject: [PATCH 39/48] Gave up and just used the app names

---
 .circleci/config.yml | 6 +++---
 1 file changed, 3 insertions(+), 3 deletions(-)

diff --git a/.circleci/config.yml b/.circleci/config.yml
index ec5f2a2d..e9fac3f2 100644
--- a/.circleci/config.yml
+++ b/.circleci/config.yml
@@ -81,7 +81,7 @@ jobs:
           name: "Build and push image to ECR"
           command: |
             PROJECT_REPO_HOST="331151898531.dkr.ecr.eu-west-1.amazonaws.com"
-            PROJECT_REPOSITORY_URL=$PROJECT_REPO_HOST/<< pipeline.parameters.app_name>>/<<parameters.env>>/<< parameters.image >>
+            PROJECT_REPOSITORY_URL=$PROJECT_REPO_HOST/<< parameters.image >>
             echo "Repository URL: $PROJECT_REPOSITORY_URL"
             docker build -f << parameters.dockerfile >> -t "${PROJECT_REPOSITORY_URL}:${CIRCLE_SHA1}" .
             docker push "${PROJECT_REPOSITORY_URL}:${CIRCLE_SHA1}"
@@ -124,14 +124,14 @@ workflows:
           name: "Create AWS ECR Client repository"
           context: anyvan
           module_path: "iac/terraform/image_repository"
-          app_name: << pipeline.parameters.app_name >>/testing/twilio-webchat-client
+          app_name: twilio-webchat-client
           tf_version: << pipeline.parameters.terraform_version >>
           requires:
             - "Log in to AWS"
       - aws-ecr-helper/create_aws_ecr:
           <<: *create_ecr
           name: "Create AWS ECR Server repository"
-          app_name: << pipeline.parameters.app_name >>/testing/twilio-webchat-server
+          app_name: testing/twilio-webchat-server
       - aws-ecr-helper/ecr_login: &ecr_login
           name: "Log in to AWS ECR"
           context: anyvan

From 26b7fcbb934c3dc7befe75fbe622ad7b1af34519 Mon Sep 17 00:00:00 2001
From: Sebastian Murray-Roberts <sebastian.murray@anyvan.com>
Date: Tue, 2 Sep 2025 16:38:33 +0200
Subject: [PATCH 40/48] Gave up and just used the app names

---
 .circleci/config.yml | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/.circleci/config.yml b/.circleci/config.yml
index e9fac3f2..57cbd1e8 100644
--- a/.circleci/config.yml
+++ b/.circleci/config.yml
@@ -131,7 +131,7 @@ workflows:
       - aws-ecr-helper/create_aws_ecr:
           <<: *create_ecr
           name: "Create AWS ECR Server repository"
-          app_name: testing/twilio-webchat-server
+          app_name: twilio-webchat-server
       - aws-ecr-helper/ecr_login: &ecr_login
           name: "Log in to AWS ECR"
           context: anyvan

From 5f359b8fd0bfc10a58434fffe4500bcfa3e2af41 Mon Sep 17 00:00:00 2001
From: Sebastian Murray-Roberts <sebastian.murray@anyvan.com>
Date: Tue, 2 Sep 2025 16:42:04 +0200
Subject: [PATCH 41/48] Removed unused vars for ECR creation

---
 iac/terraform/image_repository/variables.tf | 10 ----------
 1 file changed, 10 deletions(-)

diff --git a/iac/terraform/image_repository/variables.tf b/iac/terraform/image_repository/variables.tf
index 62da6195..c0a77f42 100644
--- a/iac/terraform/image_repository/variables.tf
+++ b/iac/terraform/image_repository/variables.tf
@@ -3,16 +3,6 @@ variable "app_name" {
   description = "Name of the application. This will be used for configuring infrastructure "
 }
 
-variable "env" {
-  type        = string
-  description = "Environment to deploy to"
-}
-
-variable "repository_name" {
-  type        = string
-  description = "Name of the repository. This will be used for configuring infrastructure "
-}
-
 variable "aws_region" {
   type    = string
   default = "eu-west-1"

From 830730f2f9b9c0cf27c0760a62fbdee6dd8b9c11 Mon Sep 17 00:00:00 2001
From: Sebastian Murray-Roberts <sebastian.murray@anyvan.com>
Date: Tue, 2 Sep 2025 16:56:59 +0200
Subject: [PATCH 42/48] Updated workspace for tf plan

---
 .circleci/config.yml | 46 ++++++++++++++++++++++++--------------------
 1 file changed, 25 insertions(+), 21 deletions(-)

diff --git a/.circleci/config.yml b/.circleci/config.yml
index 57cbd1e8..09a9ec0e 100644
--- a/.circleci/config.yml
+++ b/.circleci/config.yml
@@ -33,6 +33,10 @@ parameters:
   app_name:
     type: string
     default: "twilio-webchat-widget"
+  ecr_repo_host:
+    type: string
+    default: "331151898531.dkr.ecr.eu-west-1.amazonaws.com"
+
 
 executors:
   base:
@@ -80,8 +84,8 @@ jobs:
       - run:
           name: "Build and push image to ECR"
           command: |
-            PROJECT_REPO_HOST="331151898531.dkr.ecr.eu-west-1.amazonaws.com"
-            PROJECT_REPOSITORY_URL=$PROJECT_REPO_HOST/<< parameters.image >>
+            
+            PROJECT_REPOSITORY_URL=<< pipeline.parameters.ecr_repo_host >>/<< parameters.image >>
             echo "Repository URL: $PROJECT_REPOSITORY_URL"
             docker build -f << parameters.dockerfile >> -t "${PROJECT_REPOSITORY_URL}:${CIRCLE_SHA1}" .
             docker push "${PROJECT_REPOSITORY_URL}:${CIRCLE_SHA1}"
@@ -120,24 +124,25 @@ workflows:
           region: << pipeline.parameters.region >>
           account: PRODUCTION HORIZONTAL TEST1
           persist: .aws
-      - aws-ecr-helper/create_aws_ecr: &create_ecr
-          name: "Create AWS ECR Client repository"
-          context: anyvan
-          module_path: "iac/terraform/image_repository"
-          app_name: twilio-webchat-client
-          tf_version: << pipeline.parameters.terraform_version >>
-          requires:
-            - "Log in to AWS"
-      - aws-ecr-helper/create_aws_ecr:
-          <<: *create_ecr
-          name: "Create AWS ECR Server repository"
-          app_name: twilio-webchat-server
+#      - aws-ecr-helper/create_aws_ecr: &create_ecr
+#          name: "Create AWS ECR Client repository"
+#          context: anyvan
+#          module_path: "iac/terraform/image_repository"
+#          app_name: twilio-webchat-client
+#          tf_version: << pipeline.parameters.terraform_version >>
+#          requires:
+#            - "Log in to AWS"
+#      - aws-ecr-helper/create_aws_ecr:
+#          <<: *create_ecr
+#          name: "Create AWS ECR Server repository"
+#          app_name: twilio-webchat-server
       - aws-ecr-helper/ecr_login: &ecr_login
           name: "Log in to AWS ECR"
           context: anyvan
           requires:
-            - "Create AWS ECR Server repository"
-            - "Create AWS ECR Client repository"
+#            - "Create AWS ECR Server repository"
+#            - "Create AWS ECR Client repository"
+            - "Log in to AWS"
       # Build Server Image for PR Environment
       - build-and-push:
           name: build_webchat_server_pr
@@ -172,11 +177,11 @@ workflows:
           context:
             - anyvan
             - twilio-flex-stage
-          workspace: testing-<< pipeline.parameters.app_name >>-<< pipeline.parameters.jira_ticket_number >>
+          workspace: << pipeline.parameters.app_name >>_branches<< pipeline.parameters.jira_ticket_number >>
           var: >-
             jira_ticket_number=<< pipeline.parameters.jira_ticket_number >>,
-            server_container_image_url=$AWS_ECR_CIRCLECI_IMAGES_REPOSITORY_HOST/<< pipeline.parameters.app_name >>/twilio-webchat-server-<< pipeline.parameters.image_tag >>,
-            client_container_image_url=$AWS_ECR_CIRCLECI_IMAGES_REPOSITORY_HOST/<< pipeline.parameters.app_name >>/twilio-webchat-client-<< pipeline.parameters.image_tag >>,
+            server_container_image_url=<< pipeline.parameters.ecr_repo_host >>/twilio-webchat-server-<< pipeline.parameters.image_tag >>,
+            client_container_image_url=<< pipeline.parameters.ecr_repo_host >>/twilio-webchat-client-<< pipeline.parameters.image_tag >>,
             git_sha=$CIRCLE_SHA1,
             terraform_version=<< pipeline.parameters.terraform_version >>
           var_file: env/testing.tfvars
@@ -185,13 +190,12 @@ workflows:
           terraform_version: << pipeline.parameters.terraform_version >>
           requires:
             - hold_pr
-            - hold_pr
 
       # Apply Terraform for PR Environment
       - terraform-helper/apply: &apply
           name: apply_webchat_widget_pr
           context: anyvan
-          workspace: testing-<< pipeline.parameters.app_name >>-<< pipeline.parameters.jira_ticket_number >>
+          workspace: << pipeline.parameters.app_name >>_branches<< pipeline.parameters.jira_ticket_number >>
           modules_branch: << pipeline.parameters.modules >>
           path: terraform/
           terraform_version: << pipeline.parameters.terraform_version >>

From 6003134b925ff6638759605856485fef17d0994a Mon Sep 17 00:00:00 2001
From: Sebastian Murray-Roberts <sebastian.murray@anyvan.com>
Date: Tue, 2 Sep 2025 17:27:06 +0200
Subject: [PATCH 43/48] Fixed variable formatting and fixed terraform path

---
 .circleci/config.yml                |  4 ++--
 iac/terraform/env/production.tfvars | 22 +++++++++++-----------
 iac/terraform/env/staging.tfvars    | 26 +++++++++++++-------------
 iac/terraform/env/testing.tfvars    | 26 +++++++++++++-------------
 4 files changed, 39 insertions(+), 39 deletions(-)

diff --git a/.circleci/config.yml b/.circleci/config.yml
index 09a9ec0e..30ca884f 100644
--- a/.circleci/config.yml
+++ b/.circleci/config.yml
@@ -186,7 +186,7 @@ workflows:
             terraform_version=<< pipeline.parameters.terraform_version >>
           var_file: env/testing.tfvars
           modules_branch: << pipeline.parameters.modules >>
-          path: terraform/
+          path: iac/terraform/
           terraform_version: << pipeline.parameters.terraform_version >>
           requires:
             - hold_pr
@@ -197,7 +197,7 @@ workflows:
           context: anyvan
           workspace: << pipeline.parameters.app_name >>_branches<< pipeline.parameters.jira_ticket_number >>
           modules_branch: << pipeline.parameters.modules >>
-          path: terraform/
+          path: iac/terraform/
           terraform_version: << pipeline.parameters.terraform_version >>
           requires:
             - plan_webchat_widget_pr
diff --git a/iac/terraform/env/production.tfvars b/iac/terraform/env/production.tfvars
index a3136839..3c4bf9af 100644
--- a/iac/terraform/env/production.tfvars
+++ b/iac/terraform/env/production.tfvars
@@ -1,15 +1,15 @@
-region              = "eu-west-1"
-env                 = "production"
-prefix              = "prod"
-profile             = "production"
-ecr_repository_name = "twilio-webchat-widget/prod"
-vpc_environment     = "production"
-notify              = ["@slack-alerting-centralised"]
-internal_fqdn       = "webchat-widget-internal.anyvan.com"
-external_fqdn       = "webchat-widget.anyvan.com"
+region               = "eu-west-1"
+env                  = "production"
+prefix               = "prod"
+profile              = "production"
+ecr_repository_name  = "twilio-webchat-widget/prod"
+vpc_environment      = "production"
+notify               = ["@slack-alerting-centralised"]
+internal_fqdn        = "webchat-widget-internal.anyvan.com"
+external_fqdn        = "webchat-widget.anyvan.com"
 server_internal_fqdn = "webchat-widget-server-internal.anyvan.com"
 client_internal_fqdn = "webchat-widget-client-internal.anyvan.com"
-fargate_task_cpu    = 512
-fargate_task_memory = 1024
+fargate_task_cpu     = 512
+fargate_task_memory  = 1024
 
 
diff --git a/iac/terraform/env/staging.tfvars b/iac/terraform/env/staging.tfvars
index 47492028..d1ac9ec5 100644
--- a/iac/terraform/env/staging.tfvars
+++ b/iac/terraform/env/staging.tfvars
@@ -1,14 +1,14 @@
-region                = "eu-west-1"
-env                   = "staging"
-prefix                = "stage"
-profile               = "test1"
-ecr_repository_name   = "twilio-webchat-widget/stage"
-vpc_environment       = "staging"
-notify                = ["@slack-alerting-centralised"]
-internal_fqdn         = "stage-webchat-widget-internal.anyvan.com"
-external_fqdn         = "webchat-widget-stg.anyvan.com"
-server_internal_fqdn   = "stage-webchat-widget-server-internal.anyvan.com"
-client_internal_fqdn   = "stage-webchat-widget-client-internal.anyvan.com"
-fargate_task_cpu      = 256
-fargate_task_memory   = 512
+region               = "eu-west-1"
+env                  = "staging"
+prefix               = "stage"
+profile              = "test1"
+ecr_repository_name  = "twilio-webchat-widget/stage"
+vpc_environment      = "staging"
+notify               = ["@slack-alerting-centralised"]
+internal_fqdn        = "stage-webchat-widget-internal.anyvan.com"
+external_fqdn        = "webchat-widget-stg.anyvan.com"
+server_internal_fqdn = "stage-webchat-widget-server-internal.anyvan.com"
+client_internal_fqdn = "stage-webchat-widget-client-internal.anyvan.com"
+fargate_task_cpu     = 256
+fargate_task_memory  = 512
 
diff --git a/iac/terraform/env/testing.tfvars b/iac/terraform/env/testing.tfvars
index 556eedb8..bfb621e2 100644
--- a/iac/terraform/env/testing.tfvars
+++ b/iac/terraform/env/testing.tfvars
@@ -1,15 +1,15 @@
-region                = "eu-west-1"
-env                   = "testing"
-prefix                = "test"
-profile               = "test1"
-ecr_repository_name   = "twilio-webchat-widget/testing"
-vpc_environment       = "staging"
-notify                = ["@slack-alerting-centralised"]
-internal_fqdn         = "test-webchat-widget-internal-<jira-ticket-number>.anyvan.com"
-external_fqdn         = "webchat-widget-test-<jira-ticket-number>.anyvan.com"
-server_internal_fqdn   = "test-webchat-widget-server-internal-<jira-ticket-number>.anyvan.com"
-client_internal_fqdn   = "test-webchat-widget-client-internal-<jira-ticket-number>.anyvan.com"
-fargate_task_cpu      = 256
-fargate_task_memory   = 512
+region               = "eu-west-1"
+env                  = "testing"
+prefix               = "test"
+profile              = "test1"
+ecr_repository_name  = "twilio-webchat-widget/testing"
+vpc_environment      = "staging"
+notify               = ["@slack-alerting-centralised"]
+internal_fqdn        = "test-webchat-widget-internal-<jira-ticket-number>.anyvan.com"
+external_fqdn        = "webchat-widget-test-<jira-ticket-number>.anyvan.com"
+server_internal_fqdn = "test-webchat-widget-server-internal-<jira-ticket-number>.anyvan.com"
+client_internal_fqdn = "test-webchat-widget-client-internal-<jira-ticket-number>.anyvan.com"
+fargate_task_cpu     = 256
+fargate_task_memory  = 512
 
 

From 7116d8297f125a07ee6da7f044ea99d2520822cb Mon Sep 17 00:00:00 2001
From: Sebastian Murray-Roberts <sebastian.murray@anyvan.com>
Date: Tue, 2 Sep 2025 17:50:42 +0200
Subject: [PATCH 44/48] Removed tf vars which have no value

---
 iac/terraform/variables.tf | 21 ---------------------
 1 file changed, 21 deletions(-)

diff --git a/iac/terraform/variables.tf b/iac/terraform/variables.tf
index b90836ee..b64f6b76 100644
--- a/iac/terraform/variables.tf
+++ b/iac/terraform/variables.tf
@@ -10,17 +10,6 @@ variable "profile" {
   type        = string
   description = "Default profile for AWS"
 }
-variable "ecr_registry_id" {
-  type    = string
-  default = "331151898531"
-}
-variable "ecr_repository_name" {
-  type = string
-}
-variable "create_ecr_repository" {
-  type    = bool
-  default = true
-}
 
 variable "vpc_environment" {
   type        = string
@@ -57,11 +46,6 @@ variable "git_sha" {
   description = "Git SHA for the current commit"
 }
 
-variable "application_container_image_url" {
-  type        = string
-  description = "URL of the application container image in ECR"
-}
-
 variable "server_container_image_url" {
   type        = string
   description = "URL of the server container image in ECR"
@@ -113,8 +97,3 @@ variable "squad" {
   type    = string
   default = "lions"
 }
-variable "slack_channel_web_hook" {
-  type      = string
-  default   = ""
-  sensitive = true
-}

From ed1075751aecf09c04b5d782fbb895dc757f7942 Mon Sep 17 00:00:00 2001
From: Sebastian Murray-Roberts <sebastian.murray@anyvan.com>
Date: Wed, 3 Sep 2025 10:15:20 +0200
Subject: [PATCH 45/48] Terraform plan fixes

---
 .circleci/config.yml                                     | 6 +++---
 iac/terraform/env/{testing.tfvars => development.tfvars} | 4 +---
 iac/terraform/env/production.tfvars                      | 2 --
 iac/terraform/env/staging.tfvars                         | 2 --
 iac/terraform/webchat-widget-client.tf                   | 2 +-
 iac/terraform/webchat-widget-server.tf                   | 2 +-
 6 files changed, 6 insertions(+), 12 deletions(-)
 rename iac/terraform/env/{testing.tfvars => development.tfvars} (82%)

diff --git a/.circleci/config.yml b/.circleci/config.yml
index 30ca884f..dc75405d 100644
--- a/.circleci/config.yml
+++ b/.circleci/config.yml
@@ -151,7 +151,7 @@ workflows:
           repository: server
           image: twilio-webchat-server
           dockerfile: Dockerfile.server
-          env: testing
+          env: development
           requires:
             - "Log in to AWS ECR"
 
@@ -163,7 +163,7 @@ workflows:
           repository: client
           image: twilio-webchat-client
           dockerfile: Dockerfile.client
-          env: testing
+          env: development
           requires:
             - "Log in to AWS ECR"
       - hold_pr:
@@ -184,7 +184,7 @@ workflows:
             client_container_image_url=<< pipeline.parameters.ecr_repo_host >>/twilio-webchat-client-<< pipeline.parameters.image_tag >>,
             git_sha=$CIRCLE_SHA1,
             terraform_version=<< pipeline.parameters.terraform_version >>
-          var_file: env/testing.tfvars
+          var_file: env/development.tfvars
           modules_branch: << pipeline.parameters.modules >>
           path: iac/terraform/
           terraform_version: << pipeline.parameters.terraform_version >>
diff --git a/iac/terraform/env/testing.tfvars b/iac/terraform/env/development.tfvars
similarity index 82%
rename from iac/terraform/env/testing.tfvars
rename to iac/terraform/env/development.tfvars
index bfb621e2..ec4b297d 100644
--- a/iac/terraform/env/testing.tfvars
+++ b/iac/terraform/env/development.tfvars
@@ -1,8 +1,6 @@
 region               = "eu-west-1"
-env                  = "testing"
-prefix               = "test"
+env                  = "development"
 profile              = "test1"
-ecr_repository_name  = "twilio-webchat-widget/testing"
 vpc_environment      = "staging"
 notify               = ["@slack-alerting-centralised"]
 internal_fqdn        = "test-webchat-widget-internal-<jira-ticket-number>.anyvan.com"
diff --git a/iac/terraform/env/production.tfvars b/iac/terraform/env/production.tfvars
index 3c4bf9af..a3dbd390 100644
--- a/iac/terraform/env/production.tfvars
+++ b/iac/terraform/env/production.tfvars
@@ -1,8 +1,6 @@
 region               = "eu-west-1"
 env                  = "production"
-prefix               = "prod"
 profile              = "production"
-ecr_repository_name  = "twilio-webchat-widget/prod"
 vpc_environment      = "production"
 notify               = ["@slack-alerting-centralised"]
 internal_fqdn        = "webchat-widget-internal.anyvan.com"
diff --git a/iac/terraform/env/staging.tfvars b/iac/terraform/env/staging.tfvars
index d1ac9ec5..b9184243 100644
--- a/iac/terraform/env/staging.tfvars
+++ b/iac/terraform/env/staging.tfvars
@@ -1,8 +1,6 @@
 region               = "eu-west-1"
 env                  = "staging"
-prefix               = "stage"
 profile              = "test1"
-ecr_repository_name  = "twilio-webchat-widget/stage"
 vpc_environment      = "staging"
 notify               = ["@slack-alerting-centralised"]
 internal_fqdn        = "stage-webchat-widget-internal.anyvan.com"
diff --git a/iac/terraform/webchat-widget-client.tf b/iac/terraform/webchat-widget-client.tf
index 236e51d5..3066d20e 100644
--- a/iac/terraform/webchat-widget-client.tf
+++ b/iac/terraform/webchat-widget-client.tf
@@ -2,7 +2,7 @@ module "webchat_client" {
   source  = "terraform-registry.anyvan.com/anyvan/ecs_project/aws"
   version = "~>1.6.2"
 
-  app_name                        = "${var.webchat_widget_name}-client"
+  app_name                        = "twilio-webchat-client"
   env                             = var.env
   jira_ticket_number              = var.jira_ticket_number
   application_container_image_url = var.client_container_image_url
diff --git a/iac/terraform/webchat-widget-server.tf b/iac/terraform/webchat-widget-server.tf
index 2c3bcb54..bb479649 100644
--- a/iac/terraform/webchat-widget-server.tf
+++ b/iac/terraform/webchat-widget-server.tf
@@ -2,7 +2,7 @@ module "webchat_server" {
   source  = "terraform-registry.anyvan.com/anyvan/ecs_project/aws"
   version = "~>1.6.2"
 
-  app_name                        = "${var.webchat_widget_name}-server"
+  app_name                        = "twilio-webchat-server"
   env                             = var.env
   jira_ticket_number              = var.jira_ticket_number
   application_container_image_url = var.server_container_image_url

From c3a45ad818dd5d4677d540b220ce4c5511c26758 Mon Sep 17 00:00:00 2001
From: Sebastian Murray-Roberts <sebastian.murray@anyvan.com>
Date: Wed, 3 Sep 2025 10:30:10 +0200
Subject: [PATCH 46/48] Renamed app_names which were too long

---
 iac/terraform/webchat-widget-client.tf | 2 +-
 iac/terraform/webchat-widget-server.tf | 2 +-
 2 files changed, 2 insertions(+), 2 deletions(-)

diff --git a/iac/terraform/webchat-widget-client.tf b/iac/terraform/webchat-widget-client.tf
index 3066d20e..33d7b843 100644
--- a/iac/terraform/webchat-widget-client.tf
+++ b/iac/terraform/webchat-widget-client.tf
@@ -2,7 +2,7 @@ module "webchat_client" {
   source  = "terraform-registry.anyvan.com/anyvan/ecs_project/aws"
   version = "~>1.6.2"
 
-  app_name                        = "twilio-webchat-client"
+  app_name                        = "webchat-client"
   env                             = var.env
   jira_ticket_number              = var.jira_ticket_number
   application_container_image_url = var.client_container_image_url
diff --git a/iac/terraform/webchat-widget-server.tf b/iac/terraform/webchat-widget-server.tf
index bb479649..8b36627f 100644
--- a/iac/terraform/webchat-widget-server.tf
+++ b/iac/terraform/webchat-widget-server.tf
@@ -2,7 +2,7 @@ module "webchat_server" {
   source  = "terraform-registry.anyvan.com/anyvan/ecs_project/aws"
   version = "~>1.6.2"
 
-  app_name                        = "twilio-webchat-server"
+  app_name                        = "webchat-server"
   env                             = var.env
   jira_ticket_number              = var.jira_ticket_number
   application_container_image_url = var.server_container_image_url

From 29ec3c003eb526e3de43772220ab63fce282c5f3 Mon Sep 17 00:00:00 2001
From: Sebastian Murray-Roberts <sebastian.murray@anyvan.com>
Date: Wed, 3 Sep 2025 11:34:26 +0200
Subject: [PATCH 47/48] Fixed env to make alb dns correct

---
 iac/terraform/locals.tf | 10 +++++-----
 1 file changed, 5 insertions(+), 5 deletions(-)

diff --git a/iac/terraform/locals.tf b/iac/terraform/locals.tf
index 5599d3ab..ad76c59e 100644
--- a/iac/terraform/locals.tf
+++ b/iac/terraform/locals.tf
@@ -8,7 +8,7 @@ locals {
     version           = var.commit_hash
   }
 
-  is_pr_env     = var.env == "testing"
+  is_pr_env     = var.env == "development"
   is_production = var.env == "production"
 
 
@@ -19,10 +19,10 @@ locals {
     testing    = "-dev${var.jira_ticket_number}"
   }
 
-  internal_fqdn = var.env == "testing" ? replace(var.internal_fqdn, "<jira-ticket-number>", var.jira_ticket_number) : var.internal_fqdn
-  external_fqdn = var.env == "testing" ? replace(var.external_fqdn, "<jira-ticket-number>", var.jira_ticket_number) : var.external_fqdn
+  internal_fqdn = var.env == "development" ? replace(var.internal_fqdn, "<jira-ticket-number>", var.jira_ticket_number) : var.internal_fqdn
+  external_fqdn = var.env == "development" ? replace(var.external_fqdn, "<jira-ticket-number>", var.jira_ticket_number) : var.external_fqdn
 
   # Server and Client specific FQDNs
-  server_internal_fqdn = var.env == "testing" ? replace(var.server_internal_fqdn, "<jira-ticket-number>", var.jira_ticket_number) : var.server_internal_fqdn
-  client_internal_fqdn = var.env == "testing" ? replace(var.client_internal_fqdn, "<jira-ticket-number>", var.jira_ticket_number) : var.client_internal_fqdn
+  server_internal_fqdn = var.env == "development" ? replace(var.server_internal_fqdn, "<jira-ticket-number>", var.jira_ticket_number) : var.server_internal_fqdn
+  client_internal_fqdn = var.env == "development" ? replace(var.client_internal_fqdn, "<jira-ticket-number>", var.jira_ticket_number) : var.client_internal_fqdn
 }

From af4595390a4305fd256e7baa200907e44c89eccc Mon Sep 17 00:00:00 2001
From: Sebastian Murray-Roberts <sebastian.murray@anyvan.com>
Date: Mon, 15 Sep 2025 17:55:17 +0200
Subject: [PATCH 48/48] Fixed the container image urls

---
 .circleci/config.yml | 4 ++--
 1 file changed, 2 insertions(+), 2 deletions(-)

diff --git a/.circleci/config.yml b/.circleci/config.yml
index dc75405d..fe020e0a 100644
--- a/.circleci/config.yml
+++ b/.circleci/config.yml
@@ -180,8 +180,8 @@ workflows:
           workspace: << pipeline.parameters.app_name >>_branches<< pipeline.parameters.jira_ticket_number >>
           var: >-
             jira_ticket_number=<< pipeline.parameters.jira_ticket_number >>,
-            server_container_image_url=<< pipeline.parameters.ecr_repo_host >>/twilio-webchat-server-<< pipeline.parameters.image_tag >>,
-            client_container_image_url=<< pipeline.parameters.ecr_repo_host >>/twilio-webchat-client-<< pipeline.parameters.image_tag >>,
+            server_container_image_url=<< pipeline.parameters.ecr_repo_host >>/twilio-webchat-server:${CIRCLE_SHA1},
+            client_container_image_url=<< pipeline.parameters.ecr_repo_host >>/twilio-webchat-client:${CIRCLE_SHA1},
             git_sha=$CIRCLE_SHA1,
             terraform_version=<< pipeline.parameters.terraform_version >>
           var_file: env/development.tfvars