fix: Fix null checks

tjtanjin · Sep 29, 2024 · f56b76b · f56b76b
1 parent 1dd12ab
commit f56b76b
Show file tree

Hide file tree

Showing 13 changed files with 34 additions and 34 deletions.
diff --git a/src/components/ChatBotBody/ChatBotBody.tsx b/src/components/ChatBotBody/ChatBotBody.tsx
@@ -83,8 +83,8 @@ const ChatBotBody = ({
 	const toastPromptContainerStyle: CSSProperties = {
 		bottom: 20,
 		width: 300,
-		minWidth: (styles.chatWindowStyle?.width as number || 375) / 2,
-		maxWidth: (styles.chatWindowStyle?.width as number || 375)  - 50,
+		minWidth: (styles.chatWindowStyle?.width as number ?? 375) / 2,
+		maxWidth: (styles.chatWindowStyle?.width as number ?? 375)  - 50,
 		...styles.toastPromptContainerStyle
 	};
 
@@ -151,7 +151,7 @@ const ChatBotBody = ({
 		}
 		const { scrollTop, clientHeight, scrollHeight } = chatBodyRef.current;
 		setIsScrolling(
-			scrollTop + clientHeight < scrollHeight - (settings.chatWindow?.messagePromptOffset || 30)
+			scrollTop + clientHeight < scrollHeight - (settings.chatWindow?.messagePromptOffset ?? 30)
 		);
 
 		// workaround to ensure user never truly scrolls to bottom by introducing a 1 pixel offset

diff --git a/src/components/ChatBotBody/UserCheckboxes/UserCheckboxes.tsx b/src/components/ChatBotBody/UserCheckboxes/UserCheckboxes.tsx
@@ -143,7 +143,7 @@ const UserCheckboxes = ({
 					if (checkboxes.sendOutput) {
 						sendInChat = checkboxes.sendOutput;
 					} else {
-						sendInChat = settings.chatInput?.sendCheckboxOutput || true;
+						sendInChat = settings.chatInput?.sendCheckboxOutput ?? true;
 					}
 					handleSubmitText(userInput, sendInChat);
 				}}

diff --git a/src/components/ChatBotBody/UserOptions/UserOptions.tsx b/src/components/ChatBotBody/UserOptions/UserOptions.tsx
@@ -110,7 +110,7 @@ const UserOptions = ({
 							if (options.sendOutput) {
 								sendInChat = options.sendOutput;
 							} else {
-								sendInChat = settings.chatInput?.sendOptionOutput || true;
+								sendInChat = settings.chatInput?.sendOptionOutput ?? true;
 							}
 							handleSubmitText(key, sendInChat);
 						}}

diff --git a/src/components/ChatBotContainer.tsx b/src/components/ChatBotContainer.tsx
@@ -1,4 +1,4 @@
-import { MouseEvent } from "react";
+import { MouseEvent, useMemo } from "react";
 
 import ChatBotHeader from "./ChatBotHeader/ChatBotHeader";
 import ChatBotBody from "./ChatBotBody/ChatBotBody";
@@ -64,15 +64,15 @@ const ChatBotContainer = ({
 	/**
 	 * Retrieves class name for window state.
 	 */
-	const getWindowStateClass = () => {
+	const windowStateClass = useMemo(() => {
 		const windowClass = "rcb-chat-bot ";
 		if (settings.general?.embedded) {
 			return windowClass + "rcb-window-embedded";
 		} else if (isChatWindowOpen) {
 			return windowClass + "rcb-window-open";
 		}
-		return windowClass + "rcb-window-close"
-	}
+		return windowClass + "rcb-window-close";
+	}, [settings, isChatWindowOpen]);
 
 	/**
 	 * Retrieves styles for chat window.
@@ -114,7 +114,7 @@ const ChatBotContainer = ({
 						// if not on mobile, should remove focus
 						isDesktop ? inputRef.current?.blur() : event?.preventDefault();
 					}}
-					className={getWindowStateClass()}
+					className={windowStateClass}
 				>
 					<ChatBotTooltip/>
 					<ChatBotButton/>

diff --git a/src/components/ChatBotTooltip/ChatBotTooltip.tsx b/src/components/ChatBotTooltip/ChatBotTooltip.tsx
@@ -39,8 +39,8 @@ const ChatBotTooltip = () => {
 			if (isDesktop) {
 				let offset;
 				if (isChatWindowOpen) {
-					offset = (styles.chatWindowStyle?.width as number || 375) -
-					(styles.chatButtonStyle?.width as number || 75)
+					offset = (styles.chatWindowStyle?.width as number ?? 375) -
+					(styles.chatButtonStyle?.width as number ?? 75)
 				} else {
 					offset = 0;
 				}
@@ -71,7 +71,7 @@ const ChatBotTooltip = () => {
 	// styles for tooltip
 	const tooltipStyle: React.CSSProperties = {
 		transform: `translateX(-${tooltipOffset}px)`,
-		right: (styles.chatButtonStyle?.width as number || 75) + 40,
+		right: (styles.chatButtonStyle?.width as number ?? 75) + 40,
 		bottom: 30,
 		backgroundColor: settings.general?.secondaryColor,
 		color: settings.general?.secondaryColor,

diff --git a/src/context/BotStatesContext.tsx b/src/context/BotStatesContext.tsx
@@ -72,11 +72,11 @@ const BotStatesProvider = ({
 	settings?: Settings;
 }) => {
 	const [isBotTyping, setIsBotTyping] = useState<boolean>(false);
-	const [isChatWindowOpen, setIsChatWindowOpen] = useState<boolean>(settings?.chatWindow?.defaultOpen || false);
-	const [audioToggledOn, setAudioToggledOn] = useState<boolean>(settings?.audio?.defaultToggledOn || false);
-	const [voiceToggledOn, setVoiceToggledOn] = useState<boolean>(settings?.voice?.defaultToggledOn || false);
+	const [isChatWindowOpen, setIsChatWindowOpen] = useState<boolean>(settings?.chatWindow?.defaultOpen ?? false);
+	const [audioToggledOn, setAudioToggledOn] = useState<boolean>(settings?.audio?.defaultToggledOn ?? false);
+	const [voiceToggledOn, setVoiceToggledOn] = useState<boolean>(settings?.voice?.defaultToggledOn ?? false);
 	const [notificationsToggledOn, setNotificationsToggledOn] = useState<boolean>(
-		settings?.notification?.defaultToggledOn || true
+		settings?.notification?.defaultToggledOn ?? true
 	);
 	const [isLoadingChatHistory, setIsLoadingChatHistory] = useState<boolean>(false);
 	const [isScrolling, setIsScrolling] = useState<boolean>(false);
@@ -91,9 +91,9 @@ const BotStatesProvider = ({
 	const [timeoutId, setTimeoutId] = useState<ReturnType<typeof setTimeout> | null>(null);
 	// tracks view port height and width (for auto-resizing on mobile view)
 	const [viewportHeight, setViewportHeight] = useState<number>(window.visualViewport?.height as number
-		|| window.innerHeight);
+		?? window.innerHeight);
 	const [viewportWidth, setViewportWidth] = useState<number>(window.visualViewport?.width as number
-		|| window.innerWidth);
+		?? window.innerWidth);
 
 	return (
 		<BotStatesContext.Provider value={{

diff --git a/src/hooks/internal/useMessagesInternal.ts b/src/hooks/internal/useMessagesInternal.ts
@@ -210,7 +210,7 @@ export const useMessagesInternal = () => {
 
 			return updatedMessages;
 		});
-		return streamMessageMap.current.get(sender) || null;
+		return streamMessageMap.current.get(sender) ?? null;
 	},[]);
 
 	/**

diff --git a/src/hooks/internal/useNotificationsInternal.ts b/src/hooks/internal/useNotificationsInternal.ts
@@ -35,7 +35,7 @@ export const useNotificationInternal = () => {
 		const notificationSound = settings.notification?.sound;
 		audioContextRef.current = new AudioContext();
 		const gainNode = audioContextRef.current.createGain();
-		gainNode.gain.value = settings.notification?.volume || 0.2;
+		gainNode.gain.value = settings.notification?.volume ?? 0.2;
 		gainNodeRef.current = gainNode;
 
 		let audioSource;

diff --git a/src/hooks/internal/useSubmitInputInternal.ts b/src/hooks/internal/useSubmitInputInternal.ts
@@ -78,7 +78,7 @@ export const useSubmitInputInternal = () => {
 			if (settings?.sensitiveInput?.hideInUserBubble) {
 				return;
 			} else if (settings?.sensitiveInput?.maskInUserBubble) {
-				await injectMessage("*".repeat(settings.sensitiveInput?.asterisksCount as number || 10), "user");
+				await injectMessage("*".repeat(settings.sensitiveInput?.asterisksCount as number ?? 10), "user");
 				return;
 			}
 		}
@@ -176,7 +176,7 @@ export const useSubmitInputInternal = () => {
 	 */
 	const handleSubmitText = useCallback(async (inputText?: string, sendInChat = true) => {
 		// if no user input provided, grab from text area
-		inputText = inputText || inputRef.current?.value as string;
+		inputText = inputText ?? inputRef.current?.value as string;
 
 		// handles user send text event
 		if (settings.event?.rcbUserSubmitText) {

diff --git a/src/hooks/useFlow.ts b/src/hooks/useFlow.ts
@@ -36,7 +36,7 @@ export const useFlow = () => {
 	 * Retrieves the conversation flow for the chatbot.
 	 */
 	const getFlow = () => {
-		return flowRef.current || {};
+		return flowRef.current ?? {};
 	}
 
 	return {

diff --git a/src/hooks/useToast.ts b/src/hooks/useToast.ts
@@ -37,7 +37,7 @@ export const useToast = () => {
 		const currentToasts = toastsRef.current;
 		const numToast = currentToasts.length;
 
-		if (numToast >= (settings.toast?.maxCount || 3)) {
+		if (numToast >= (settings.toast?.maxCount ?? 3)) {
 			if (settings.toast?.forbidOnMax) {
 				return null;
 			}

diff --git a/src/services/ChatHistoryService.tsx b/src/services/ChatHistoryService.tsx
@@ -141,7 +141,7 @@ const loadChatHistory = (settings: Settings, styles: Styles, chatHistory: string
 					}
 					return [...parsedMessages, lineBreakMessage, ...prevMessages];
 				});
-				setTextAreaDisabled(settings.chatInput?.disabled || false);
+				setTextAreaDisabled(settings.chatInput?.disabled ?? false);
 			}, 500)
 		} catch {
 			// remove chat history on error (to address corrupted storage values)
@@ -240,8 +240,8 @@ const addStyleToOptions = (classList: DOMTokenList, attributes: {[key: string]:
 	if (classList.contains("rcb-options")) {
 		attributes["style"] = {
 			...(attributes["style"] as CSSProperties),
-			color: styles.botOptionStyle?.color || settings.general?.primaryColor,
-			borderColor: styles.botOptionStyle?.color || settings.general?.primaryColor,
+			color: styles.botOptionStyle?.color ?? settings.general?.primaryColor,
+			borderColor: styles.botOptionStyle?.color ?? settings.general?.primaryColor,
 			cursor: `url(${settings.general?.actionDisabledIcon}), auto`,
 			...styles.botOptionStyle
 		}
@@ -261,8 +261,8 @@ const addStyleToCheckboxRows = (classList: DOMTokenList, attributes: {[key: stri
 	if (classList.contains("rcb-checkbox-row-container")) {
 		attributes["style"] = {
 			...(attributes["style"] as CSSProperties),
-			color: styles.botCheckboxRowStyle?.color || settings.general?.primaryColor,
-			borderColor: styles.botCheckboxRowStyle?.color || settings.general?.primaryColor,
+			color: styles.botCheckboxRowStyle?.color ?? settings.general?.primaryColor,
+			borderColor: styles.botCheckboxRowStyle?.color ?? settings.general?.primaryColor,
 			cursor: `url(${settings.general?.actionDisabledIcon}), auto`,
 			...styles.botCheckboxRowStyle
 		}
@@ -282,8 +282,8 @@ const addStyleToCheckboxNextButton = (classList: DOMTokenList, attributes: {[key
 	if (classList.contains("rcb-checkbox-next-button")) {
 		attributes["style"] = {
 			...(attributes["style"] as CSSProperties),
-			color: styles.botCheckboxNextStyle?.color || settings.general?.primaryColor,
-			borderColor: styles.botCheckboxNextStyle?.color || settings.general?.primaryColor,
+			color: styles.botCheckboxNextStyle?.color ?? settings.general?.primaryColor,
+			borderColor: styles.botCheckboxNextStyle?.color ?? settings.general?.primaryColor,
 			cursor: `url(${settings.general?.actionDisabledIcon}), auto`,
 			...styles.botCheckboxNextStyle
 		}

diff --git a/src/utils/displayChecker.ts b/src/utils/displayChecker.ts
@@ -9,8 +9,8 @@ export const isChatBotVisible = (element: HTMLDivElement) => {
 	}
 
 	const rect = element.getBoundingClientRect();
-	const windowHeight = (window.innerHeight || document.documentElement.clientHeight);
-	const windowWidth = (window.innerWidth || document.documentElement.clientWidth);
+	const windowHeight = (window.innerHeight ?? document.documentElement.clientHeight);
+	const windowWidth = (window.innerWidth ?? document.documentElement.clientWidth);
 
 	return (
 		rect.top >= 0 &&
-Original file line number
+Diff line change
@@ Expand Up / @@ -210,7 +210,7 @@ export const useMessagesInternal = () => { @@
     			return updatedMessages;
     		});
-    		return streamMessageMap.current.get(sender) || null;
+    		return streamMessageMap.current.get(sender) ?? null;
     	},[]);
     	/**
@@ Expand Down @@