Merge pull request #60 from makeen-project/feature_ALS-1591_web-respo…

…nsive_main [Makeen] [Feature ALS-1591] web responsiveness
aws-geospatial · Oct 13, 2023 · 779e7b1 · 779e7b1
2 parents 7f8c347 + 364479c
commit 779e7b1
Show file tree

Hide file tree

Showing 3 changed files with 45 additions and 39 deletions.
diff --git a/src/atomicui/organisms/ResponsiveBottomSheet/ResponsiveBottomSheet.tsx b/src/atomicui/organisms/ResponsiveBottomSheet/ResponsiveBottomSheet.tsx
@@ -521,44 +521,56 @@ const ResponsiveBottomSheet: FC<IProps> = ({
 	const footerHeight = useCallback((maxHeight: number) => calculatePixelValue(maxHeight, 50), [calculatePixelValue]);
 
 	const onCloseHandler = useCallback(() => {
-		from === MenuItemEnum.GEOFENCE ? setShowUnauthGeofenceBox(false) : setShowUnauthTrackerBox(false);
+		clearCredsAndLocationClient && clearCredsAndLocationClient();
 		setShowStartUnauthSimulation(false);
+		from === MenuItemEnum.GEOFENCE ? setShowUnauthGeofenceBox(false) : setShowUnauthTrackerBox(false);
+		setConfirmCloseSimulation(false);
 		resetToExplore();
-	}, [from, resetToExplore, setShowStartUnauthSimulation, setShowUnauthGeofenceBox, setShowUnauthTrackerBox]);
+	}, [
+		clearCredsAndLocationClient,
+		from,
+		resetToExplore,
+		setConfirmCloseSimulation,
+		setShowStartUnauthSimulation,
+		setShowUnauthGeofenceBox,
+		setShowUnauthTrackerBox
+	]);
 
-	const ExitSimulation = useCallback(
-		() => (
-			<Flex className="confirmation-modal-container">
-				<ConfirmationModal
-					open
-					onClose={onCloseHandler}
-					heading={t("start_unauth_simulation__exit_simulation.text") as string}
-					description={
-						<Text
-							className="small-text"
-							variation="tertiary"
-							marginTop="1.23rem"
-							textAlign="center"
-							whiteSpace="pre-line"
-						>
-							{t("start_unauth_simulation__exit_simulation_desc.text")}
-						</Text>
-					}
-					onConfirm={() =>
-						setUI(from === MenuItemEnum.GEOFENCE ? ResponsiveUIEnum.unauth_geofence : ResponsiveUIEnum.unauth_tracker)
-					}
-					confirmationText={t("start_unauth_simulation__stay_in_simulation.text") as string}
-					cancelationText={t("exit.text") as string}
-				/>
-			</Flex>
-		),
-		[from, onCloseHandler, setUI, t]
+	const ExitSimulation = () => (
+		<Flex className="confirmation-modal-container">
+			<ConfirmationModal
+				open={confirmCloseSimulation}
+				onClose={() => {
+					setUI(from === MenuItemEnum.GEOFENCE ? ResponsiveUIEnum.unauth_geofence : ResponsiveUIEnum.unauth_tracker);
+					setConfirmCloseSimulation(false);
+				}}
+				onCancel={onCloseHandler}
+				heading={t("start_unauth_simulation__exit_simulation.text") as string}
+				description={
+					<Text
+						className="small-text"
+						variation="tertiary"
+						marginTop="1.23rem"
+						textAlign="center"
+						whiteSpace="pre-line"
+					>
+						{t("start_unauth_simulation__exit_simulation_desc.text")}
+					</Text>
+				}
+				onConfirm={() => {
+					setUI(from === MenuItemEnum.GEOFENCE ? ResponsiveUIEnum.unauth_geofence : ResponsiveUIEnum.unauth_tracker);
+					setConfirmCloseSimulation(false);
+				}}
+				confirmationText={t("start_unauth_simulation__stay_in_simulation.text") as string}
+				cancelationText={t("exit.text") as string}
+			/>
+		</Flex>
 	);
 
 	return (
 		<>
 			{!isDesktop && isNonStartedSimulation && UnauthSimulationUI}
-			{!isDesktop && isExitSimulation && ExitSimulation()}
+			{!isDesktop && isExitSimulation && <ExitSimulation />}
 
 			<BottomSheet
 				open

diff --git a/src/atomicui/organisms/SearchBox/SearchBox.tsx b/src/atomicui/organisms/SearchBox/SearchBox.tsx
@@ -120,6 +120,7 @@ const SearchBox: React.FC<SearchBoxProps> = ({
 				if (ui === ResponsiveUIEnum.explore) {
 					setIsFocused(false);
 					searchInputRef.current?.blur();
+					setBottomSheetMinHeight(BottomSheetHeights.explore.min);
 				}
 			}
 
@@ -128,7 +129,7 @@ const SearchBox: React.FC<SearchBoxProps> = ({
 				document.removeEventListener("touchmove", handleClickOutside);
 			};
 		}
-	}, [ui, isDesktop, bottomSheetRef]);
+	}, [ui, isDesktop, bottomSheetRef, setBottomSheetMinHeight]);
 
 	const handleSearch = useCallback(
 		async (value: string, exact = false, action: string) => {

diff --git a/src/atomicui/organisms/UnauthSimulation/UnauthSimulation.tsx b/src/atomicui/organisms/UnauthSimulation/UnauthSimulation.tsx
@@ -232,7 +232,6 @@ const UnauthSimulation: React.FC<UnauthSimulationProps> = ({
 		handleClose();
 		setHideGeofenceTrackerShortcut(false);
 		setConfirmCloseSimulation(false);
-		setUI(ResponsiveUIEnum.explore);
 	};
 
 	const StartSimulation = useCallback(() => {
@@ -391,14 +390,8 @@ const UnauthSimulation: React.FC<UnauthSimulationProps> = ({
 		} else {
 			setIsPlaying(false);
 			setConfirmCloseSimulation(true);
-
-			if (!isDesktop) {
-				from === MenuItemEnum.GEOFENCE
-					? setUI(ResponsiveUIEnum.exit_unauthorized_geofence)
-					: setUI(ResponsiveUIEnum.exit_unauthorized_tracker);
-			}
 		}
-	}, [isNotifications, setIsNotifications, setConfirmCloseSimulation, isDesktop, from, setUI]);
+	}, [isNotifications, setIsNotifications, setConfirmCloseSimulation]);
 
 	const BeforeStartSimulation = () => (
 		<>