578 decoupled image imports from multipage overlay

ScottLogic · Feb 27, 2024 · a58a244 · a58a244
1 parent 767de8b
commit a58a244
Show file tree

Hide file tree

Showing 4 changed files with 20 additions and 23 deletions.
diff --git a/frontend/src/components/Overlay/LevelsComplete.tsx b/frontend/src/components/Overlay/LevelsComplete.tsx
@@ -1,3 +1,5 @@
+import BotAvatarDefault from '@src/assets/images/BotAvatarDefault.svg';
+import Manager from '@src/assets/images/manager.png';
 import LevelsCompleteButtons from '@src/components/ThemedButtons/LevelsCompleteButtons';
 
 import MultipageOverlay from './MultipageOverlay';
@@ -21,7 +23,7 @@ function LevelsComplete({
 					</p>
 				</>
 			),
-			imageName: 'ScottBrew Manager',
+			imageName: Manager,
 		},
 		{
 			content: (
@@ -38,7 +40,7 @@ function LevelsComplete({
 					/>
 				</>
 			),
-			imageName: 'SpyLogic',
+			imageName: BotAvatarDefault,
 		},
 	];
 

diff --git a/frontend/src/components/Overlay/MissionInformation.tsx b/frontend/src/components/Overlay/MissionInformation.tsx
@@ -1,4 +1,7 @@
 import { LEVELS } from '@src/Levels';
+import Handler from '@src/assets/images/handler.png';
+import Lawyer from '@src/assets/images/lawyer.png';
+import Manager from '@src/assets/images/manager.png';
 import OverlayButton from '@src/components/ThemedButtons/OverlayButton';
 import { LEVEL_NAMES } from '@src/models/level';
 
@@ -25,7 +28,14 @@ function MissionInformation({
 						)}
 					</>
 				),
-				imageName: speaker,
+				imageName:
+					speaker === 'ScottBrew Manager'
+						? Manager
+						: speaker === 'ScottBrew Lawyer'
+						? Lawyer
+						: speaker === 'Handler'
+						? Handler
+						: '',
 			};
 		}
 	);

diff --git a/frontend/src/components/Overlay/MultipageOverlay.tsx b/frontend/src/components/Overlay/MultipageOverlay.tsx
@@ -1,10 +1,5 @@
 import { ReactNode, useState } from 'react';
 
-import BotAvatarDefault from '@src/assets/images/BotAvatarDefault.svg';
-import Handler from '@src/assets/images/handler.png';
-import Lawyer from '@src/assets/images/lawyer.png';
-import Manager from '@src/assets/images/manager.png';
-
 import Overlay from './Overlay';
 import OverlayNav from './OverlayNav';
 
@@ -37,26 +32,15 @@ function MultipageOverlay({
 		}
 	}
 
-	let speakerImage;
-
-	if (pages[currentPage].imageName === 'Handler') {
-		speakerImage = Handler;
-	} else if (pages[currentPage].imageName === 'ScottBrew Manager') {
-		speakerImage = Manager;
-	} else if (pages[currentPage].imageName === 'ScottBrew Lawyer') {
-		speakerImage = Lawyer;
-	} else {
-		speakerImage = BotAvatarDefault;
-	}
-
 	return (
 		<Overlay closeOverlay={closeOverlay} heading={heading}>
 			<div className="multi-page-container">
 				<div className="multi-page-content">
 					<div className="multi-page-text-image-container">
 						<img
 							className="multi-page-speaker-image"
-							src={speakerImage}
+							// src={speakerImage}
+							src={pages[currentPage].imageName}
 							alt=""
 						/>
 						<span className="multi-page-speaker-text">

diff --git a/frontend/src/components/Overlay/OverlayWelcome.tsx b/frontend/src/components/Overlay/OverlayWelcome.tsx
@@ -1,3 +1,4 @@
+import BotAvatarDefault from '@src/assets/images/BotAvatarDefault.svg';
 import StartLevelButtons from '@src/components/ThemedButtons/StartLevelButtons';
 import { LEVEL_NAMES } from '@src/models/level';
 
@@ -25,7 +26,7 @@ function OverlayWelcome({
 					</p>
 				</>
 			),
-			imageName: 'SpyLogic',
+			imageName: BotAvatarDefault,
 		},
 		{
 			content: (
@@ -48,7 +49,7 @@ function OverlayWelcome({
 					/>
 				</>
 			),
-			imageName: 'SpyLogic',
+			imageName: BotAvatarDefault,
 		},
 	];