Refactor smart components

Co-authored-by: Fedor Indutny <79877362+indutny-signal@users.noreply.github.com>
This commit is contained in:
Jamie Kyle 2024-03-13 13:44:13 -07:00 committed by GitHub
parent 05c09ef769
commit 27b55e472d
No known key found for this signature in database
GPG key ID: B5690EEEBB952194
109 changed files with 3583 additions and 2629 deletions

View file

@ -1,7 +1,7 @@
// Copyright 2021 Signal Messenger, LLC
// SPDX-License-Identifier: AGPL-3.0-only
import React from 'react';
import React, { memo, useCallback } from 'react';
import { useSelector } from 'react-redux';
import type { StateType } from '../reducer';
import { ConversationPanel } from './ConversationPanel';
@ -18,51 +18,67 @@ import {
import { useComposerActions } from '../ducks/composer';
import { useConversationsActions } from '../ducks/conversations';
export function SmartConversationView(): JSX.Element {
const conversationId = useSelector(getSelectedConversationId);
if (!conversationId) {
throw new Error('SmartConversationView: No selected conversation');
}
const { toggleSelectMode } = useConversationsActions();
const selectedMessageIds = useSelector(getSelectedMessageIds);
const isSelectMode = selectedMessageIds != null;
const { processAttachments } = useComposerActions();
const hasOpenModal = useSelector((state: StateType) => {
return (
state.globalModals.forwardMessagesProps != null ||
state.globalModals.deleteMessagesProps != null ||
state.globalModals.hasConfirmationModal
);
});
const shouldHideConversationView = useSelector((state: StateType) => {
const activePanel = getActivePanel(state);
const isAnimating = getIsPanelAnimating(state);
return activePanel && !isAnimating;
});
return (
<ConversationView
conversationId={conversationId}
hasOpenModal={hasOpenModal}
isSelectMode={isSelectMode}
onExitSelectMode={() => {
toggleSelectMode(false);
}}
processAttachments={processAttachments}
renderCompositionArea={() => <SmartCompositionArea id={conversationId} />}
renderConversationHeader={() => (
<SmartConversationHeader id={conversationId} />
)}
renderTimeline={() => (
<SmartTimeline key={conversationId} id={conversationId} />
)}
renderPanel={() => <ConversationPanel conversationId={conversationId} />}
shouldHideConversationView={shouldHideConversationView}
/>
);
function renderCompositionArea(conversationId: string) {
return <SmartCompositionArea id={conversationId} />;
}
function renderConversationHeader(conversationId: string) {
return <SmartConversationHeader id={conversationId} />;
}
function renderTimeline(conversationId: string) {
return <SmartTimeline key={conversationId} id={conversationId} />;
}
function renderPanel(conversationId: string) {
return <ConversationPanel conversationId={conversationId} />;
}
export const SmartConversationView = memo(
function SmartConversationView(): JSX.Element {
const conversationId = useSelector(getSelectedConversationId);
if (!conversationId) {
throw new Error('SmartConversationView: No selected conversation');
}
const { toggleSelectMode } = useConversationsActions();
const selectedMessageIds = useSelector(getSelectedMessageIds);
const isSelectMode = selectedMessageIds != null;
const { processAttachments } = useComposerActions();
const hasOpenModal = useSelector((state: StateType) => {
return (
state.globalModals.forwardMessagesProps != null ||
state.globalModals.deleteMessagesProps != null ||
state.globalModals.hasConfirmationModal
);
});
const shouldHideConversationView = useSelector((state: StateType) => {
const activePanel = getActivePanel(state);
const isAnimating = getIsPanelAnimating(state);
return activePanel && !isAnimating;
});
const onExitSelectMode = useCallback(() => {
toggleSelectMode(false);
}, [toggleSelectMode]);
return (
<ConversationView
conversationId={conversationId}
hasOpenModal={hasOpenModal}
isSelectMode={isSelectMode}
onExitSelectMode={onExitSelectMode}
processAttachments={processAttachments}
renderCompositionArea={renderCompositionArea}
renderConversationHeader={renderConversationHeader}
renderTimeline={renderTimeline}
renderPanel={renderPanel}
shouldHideConversationView={shouldHideConversationView}
/>
);
}
);