Calls Tab & Group Call Disposition

ts/state/smart/StoriesTab.tsx

@@ -0,0 +1,130 @@
+// Copyright 2022 Signal Messenger, LLC
+// SPDX-License-Identifier: AGPL-3.0-only
+
+import React, { useEffect } from 'react';
+import { useSelector } from 'react-redux';
+
+import type { LocalizerType } from '../../types/Util';
+import type { StateType } from '../reducer';
+import { SmartStoryCreator } from './StoryCreator';
+import { StoriesTab } from '../../components/StoriesTab';
+import { getMaximumAttachmentSizeInKb } from '../../types/AttachmentSize';
+import type { ConfigKeyType } from '../../RemoteConfig';
+import { getMe } from '../selectors/conversations';
+import { getIntl, getTheme } from '../selectors/user';
+import { getPreferredBadgeSelector } from '../selectors/badges';
+import {
+  getHasStoryViewReceiptSetting,
+  getNavTabsCollapsed,
+  getPreferredLeftPaneWidth,
+  getRemoteConfig,
+} from '../selectors/items';
+import {
+  getAddStoryData,
+  getSelectedStoryData,
+  getStories,
+} from '../selectors/stories';
+import { useConversationsActions } from '../ducks/conversations';
+import { useGlobalModalActions } from '../ducks/globalModals';
+import { useStoriesActions } from '../ducks/stories';
+import { useToastActions } from '../ducks/toast';
+import { useAudioPlayerActions } from '../ducks/audioPlayer';
+import { useItemsActions } from '../ducks/items';
+
+function renderStoryCreator(): JSX.Element {
+  return <SmartStoryCreator />;
+}
+
+export function SmartStoriesTab(): JSX.Element | null {
+  const storiesActions = useStoriesActions();
+  const {
+    retryMessageSend,
+    saveAttachment,
+    showConversation,
+    toggleHideStories,
+  } = useConversationsActions();
+  const { showStoriesSettings, toggleForwardMessagesModal } =
+    useGlobalModalActions();
+  const { showToast } = useToastActions();
+
+  const i18n = useSelector<StateType, LocalizerType>(getIntl);
+
+  const preferredWidthFromStorage = useSelector<StateType, number>(
+    getPreferredLeftPaneWidth
+  );
+  const getPreferredBadge = useSelector(getPreferredBadgeSelector);
+
+  const addStoryData = useSelector(getAddStoryData);
+  const { hiddenStories, myStories, stories } = useSelector(getStories);
+
+  const me = useSelector(getMe);
+
+  const selectedStoryData = useSelector(getSelectedStoryData);
+
+  const isStoriesSettingsVisible = useSelector(
+    (state: StateType) => state.globalModals.isStoriesSettingsVisible
+  );
+
+  const hasViewReceiptSetting = useSelector(getHasStoryViewReceiptSetting);
+
+  const remoteConfig = useSelector(getRemoteConfig);
+  const maxAttachmentSizeInKb = getMaximumAttachmentSizeInKb(
+    (name: ConfigKeyType) => {
+      const value = remoteConfig[name]?.value;
+      return value ? String(value) : undefined;
+    }
+  );
+  const { pauseVoiceNotePlayer } = useAudioPlayerActions();
+
+  const preferredLeftPaneWidth = useSelector(getPreferredLeftPaneWidth);
+  const navTabsCollapsed = useSelector(getNavTabsCollapsed);
+  const { savePreferredLeftPaneWidth, toggleNavTabsCollapse } =
+    useItemsActions();
+
+  const theme = useSelector(getTheme);
+
+  useEffect(() => {
+    storiesActions.markStoriesTabViewed();
+    return () => {
+      storiesActions.clearStoriesTabState();
+    };
+  }, [storiesActions]);
+
+  return (
+    <StoriesTab
+      addStoryData={addStoryData}
+      getPreferredBadge={getPreferredBadge}
+      hiddenStories={hiddenStories}
+      i18n={i18n}
+      maxAttachmentSizeInKb={maxAttachmentSizeInKb}
+      me={me}
+      myStories={myStories}
+      navTabsCollapsed={navTabsCollapsed}
+      onForwardStory={messageId => {
+        toggleForwardMessagesModal([messageId]);
+      }}
+      onSaveStory={story => {
+        if (story.attachment) {
+          saveAttachment(story.attachment, story.timestamp);
+        }
+      }}
+      onToggleNavTabsCollapse={toggleNavTabsCollapse}
+      onMediaPlaybackStart={pauseVoiceNotePlayer}
+      preferredLeftPaneWidth={preferredLeftPaneWidth}
+      preferredWidthFromStorage={preferredWidthFromStorage}
+      renderStoryCreator={renderStoryCreator}
+      retryMessageSend={retryMessageSend}
+      savePreferredLeftPaneWidth={savePreferredLeftPaneWidth}
+      showConversation={showConversation}
+      showStoriesSettings={showStoriesSettings}
+      showToast={showToast}
+      stories={stories}
+      theme={theme}
+      toggleHideStories={toggleHideStories}
+      isViewingStory={selectedStoryData !== undefined}
+      isStoriesSettingsVisible={isStoriesSettingsVisible}
+      hasViewReceiptSetting={hasViewReceiptSetting}
+      {...storiesActions}
+    />
+  );
+}