fix: set fallback values \w global configs in App comp (#640)

Fixes https://sendbird.atlassian.net/browse/UIKIT-4140

Put fallback value for replyType, isReactionEnabled, showSearchIcon \w global configs in `AppLayout` to reduce a chance to get these value get undefined

Author: AhyoungRyu

src/modules/App/AppLayout.tsx

@@ -7,38 +7,50 @@ import { useMediaQueryContext } from '../../lib/MediaQueryContext';
 import { DesktopLayout } from './DesktopLayout';
 import { MobileLayout } from './MobileLayout';
 
+import useSendbirdStateContext from '../../hooks/useSendbirdStateContext';
+
 export const AppLayout: React.FC<AppLayoutProps> = (
   props: AppLayoutProps,
 ) => {
   const {
-    isReactionEnabled,
-    replyType,
     isMessageGroupingEnabled,
     allowProfileEdit,
-    showSearchIcon,
     onProfileEditSuccess,
     disableAutoSelect,
     currentChannel,
     setCurrentChannel,
   } = props;
+
+  const globalStore = useSendbirdStateContext();
+  const globalConfigs = globalStore?.config;
+
   const [showThread, setShowThread] = useState(false);
   const [threadTargetMessage, setThreadTargetMessage] = useState<UserMessage | FileMessage | null>(null);
   const [showSettings, setShowSettings] = useState(false);
   const [showSearch, setShowSearch] = useState(false);
   const [highlightedMessage, setHighlightedMessage] = useState<number | null>(null);
   const [startingPoint, setStartingPoint] = useState<number | null>(null);
   const { isMobile } = useMediaQueryContext();
+
+  /**
+   * Below configs can be set via Dashboard UIKit config setting but as a lower priority than App props.
+   * So need to be have fallback value \w global configs even though each prop values are undefined
+   */
+  const replyType = props.replyType ?? globalConfigs?.replyType;
+  const isReactionEnabled = props.isReactionEnabled ?? globalConfigs?.isReactionEnabled;
+  const showSearchIcon = props.showSearchIcon ?? globalConfigs?.showSearchIcon;
+
   return (
     <>
       {
         isMobile
           ? (
             <MobileLayout
               replyType={replyType}
+              showSearchIcon={showSearchIcon}
+              isReactionEnabled={isReactionEnabled}
               isMessageGroupingEnabled={isMessageGroupingEnabled}
               allowProfileEdit={allowProfileEdit}
-              isReactionEnabled={isReactionEnabled}
-              showSearchIcon={showSearchIcon}
               onProfileEditSuccess={onProfileEditSuccess}
               currentChannel={currentChannel}
               setCurrentChannel={setCurrentChannel}
@@ -52,11 +64,11 @@ export const AppLayout: React.FC<AppLayoutProps> = (
           )
           : (
             <DesktopLayout
-              isReactionEnabled={isReactionEnabled}
               replyType={replyType}
+              isReactionEnabled={isReactionEnabled}
+              showSearchIcon={showSearchIcon}
               isMessageGroupingEnabled={isMessageGroupingEnabled}
               allowProfileEdit={allowProfileEdit}
-              showSearchIcon={showSearchIcon}
               onProfileEditSuccess={onProfileEditSuccess}
               disableAutoSelect={disableAutoSelect}
               currentChannel={currentChannel}