updated reply modal implementation tabContent

src/components/tabbedPosts/view/tabContent.tsx

@@ -5,12 +5,12 @@ import { LoadPostsOptions, TabContentProps, TabMeta } from '../services/tabbedPo
 import {useSelector, useDispatch } from 'react-redux';
 import TabEmptyView from './listEmptyView';
 import { setInitPosts } from '../../../redux/actions/postsAction';
+import { showReplyModal } from '../../../redux/actions/uiAction';
 import { calculateTimeLeftForPostCheck } from '../services/tabbedPostsHelpers';
 import { AppState, NativeScrollEvent, NativeSyntheticEvent } from 'react-native';
 import { PostsListRef } from '../../postsList/container/postsListContainer';
 import ScrollTopPopup from './scrollTopPopup';
 import { debounce } from 'lodash';
-import { QuickReplyModal } from '../..';
 
 const DEFAULT_TAB_META = {
     startAuthor:'',
@@ -68,7 +68,6 @@ const TabContent = ({
   const appState = useRef(AppState.currentState);
   const postsRef = useRef(posts);
   const sessionUserRef = useRef(sessionUser);
-  const quickReplyModalRef = useRef(null)
 
   //init state refs;
   postsRef.current = posts;
@@ -335,13 +334,12 @@ const TabContent = ({
 
   // show quick reply modal
   const _showQuickReplyModal = (post:any) => {
-    // console.log('post: ', post);
     if (isLoggedIn) {
-      quickReplyModalRef.current.show(post);
+      dispatch(showReplyModal(post))
     } else {
+      //TODO: show proper alert message 
       console.log('Not LoggedIn');
     }
-    
   }
 
   return (
@@ -375,7 +373,6 @@ const TabContent = ({
         setEnableScrollTop(false);
       }}
     />
-    <QuickReplyModal ref={quickReplyModalRef} />
   </>
   );
 };

src/redux/reducers/uiReducer.ts

@@ -1,4 +1,3 @@
-import { State } from 'react-native-gesture-handler';
 import {
   UPDATE_ACTIVE_BOTTOM_TAB,
   TOAST_NOTIFICATION,
@@ -12,6 +11,7 @@ import {
   TOGGLE_QR_MODAL,
   SET_DEVICE_ORIENTATION,
   SHOW_REPLY_MODAL,
+  HIDE_REPLY_MODAL,
 } from '../constants/constants';
 import { orientations } from '../constants/orientationsConstants';
 
@@ -121,7 +121,7 @@ export default function (state = initialState, action) : UiState {
         replyModalVisible:true,
         replyModalPost:action.payload
       }
-    case HIDE_ACTION_MODAL:
+    case HIDE_REPLY_MODAL:
       return {
         ...state,
         replyModalVisible:false,

src/screens/application/children/applicationScreen.tsx

@@ -25,6 +25,7 @@ import {
   ForegroundNotification,
   QuickProfileModal,
   QRModal,
+  QuickReplyModal,
 } from '../../../components';
 
 // Themes (Styles)
@@ -127,10 +128,13 @@ class ApplicationScreen extends Component {
         )}
 
         <ForegroundNotification remoteMessage={foregroundNotificationData} />
+       
+        <QuickProfileModal navigation={{ navigate }} />
         <AccountsBottomSheet />
         <ActionModal />
-        <QuickProfileModal navigation={{ navigate }} />
+        <QuickReplyModal />
         <QRModal />
+
       </View>
     );
   }