Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Jump to bottom

runfix: RightSidebar deflake tests #13851

Merged
merged 2 commits into from
Oct 13, 2022
Merged

runfix: RightSidebar deflake tests #13851

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
2 commits
Select commit Hold shift + click to select a range
5c6da2e
runfix: RightSidebar deflake tests
przemvs Oct 13, 2022
f46fc9b
remove unecessary code
przemvs Oct 13, 2022
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Jump to
Jump to file
Failed to load files.
Diff view
Diff view
4 changes: 4 additions & 0 deletions src/script/components/Modals/GroupCreation/GroupCreationModal.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -51,6 +51,7 @@ import {ConversationRepository} from '../../../conversation/ConversationReposito
import {User} from '../../../entity/User';
import {isProtocolOption, ProtocolOption} from '../../../guards/Protocol';
import {RootContext} from '../../../page/RootProvider';
import {useAppMainState} from '../../../page/state';
import {TeamState} from '../../../team/TeamState';
import {initFadingScrollbar} from '../../../ui/fadingScrollbar';
import {UserState} from '../../../user/UserState';
Expand Down Expand Up @@ -216,6 +217,9 @@ const GroupCreationModal: React.FC<GroupCreationModalProps> = ({
);
setIsShown(false);
amplify.publish(WebAppEvents.CONVERSATION.SHOW, conversationEntity, {});

const {rightSidebar} = useAppMainState.getState();
rightSidebar.clearHistory();
} catch (error) {
setIsCreatingConversation(false);
logger.error(error);
Expand Down
1 change: 1 addition & 0 deletions src/script/components/panel/ServiceDetails.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -30,6 +30,7 @@ export interface ServiceDetailsProps {

const ServiceDetails: React.FC<ServiceDetailsProps> = ({service}) => {
const {providerName, name} = useKoSubscribableChildren(service, ['providerName', 'name']);

return (
<div className="panel-participant">
<div className="panel-participant__name" data-uie-name="status-service-name">
Expand Down
11 changes: 5 additions & 6 deletions src/script/integration/IntegrationRepository.ts
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -75,14 +75,13 @@ export class IntegrationRepository {
* Get provider name for entity.
* @param entity Service or user to add provider name to
*/
async addProviderNameToParticipant(entity: ServiceEntity): Promise<ServiceEntity | ProviderEntity>;
async addProviderNameToParticipant(entity: User): Promise<User | ProviderEntity>;
async addProviderNameToParticipant(entity: ServiceEntity | User): Promise<ServiceEntity | User | ProviderEntity> {
const shouldUpdateProviderName = !!entity.providerName() && !entity.providerName().trim();

if (shouldUpdateProviderName) {
if (entity.providerId) {
const providerEntity = await this.getProviderById(entity.providerId);
entity.providerName(providerEntity.name);

if (providerEntity) {
entity.providerName(providerEntity.name);
}
}

return entity;
Expand Down
12 changes: 1 addition & 11 deletions src/script/page/RightSidebar/AddParticipants/AddParticipants.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -158,17 +158,7 @@ const AddParticipants: FC<AddParticipantsProps> = ({
}
};

const onServiceSelect = async (entity: ServiceEntity) => {
const serviceEntity = await integrationRepository.getServiceFromUser(entity);

if (!serviceEntity) {
return;
}

integrationRepository.addProviderNameToParticipant(serviceEntity);

togglePanel(PanelState.GROUP_PARTICIPANT_SERVICE, serviceEntity, true);
};
const onServiceSelect = (entity: ServiceEntity) => togglePanel(PanelState.GROUP_PARTICIPANT_SERVICE, entity, true);

const addUsers = async () => {
const userEntities = selectedContacts.slice();
Expand Down
55 changes: 25 additions & 30 deletions src/script/page/RightSidebar/ConversationDetails/ConversationDetails.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -17,7 +17,7 @@
*
*/

import {FC, useEffect, useState} from 'react';
import {FC, useEffect, useMemo, useState} from 'react';

import {RECEIPT_MODE} from '@wireapp/api-client/src/conversation/data/';

Expand Down Expand Up @@ -89,9 +89,6 @@ const ConversationDetails: FC<ConversationDetailsProps> = ({
isFederated = false,
}) => {
const [selectedService, setSelectedService] = useState<ServiceEntity>();
const [allUsersCount, setAllUsersCount] = useState<number>(0);
const [userParticipants, setUserParticipants] = useState<User[]>([]);
const [serviceParticipants, setServiceParticipants] = useState<ServiceEntity[]>([]);

const roleRepository = conversationRepository.conversationRoleRepository;

Expand Down Expand Up @@ -178,6 +175,28 @@ const ConversationDetails: FC<ConversationDetailsProps> = ({
const canRenameGroup = roleRepository.canRenameGroup(activeConversation);
const hasReceiptsEnabled = conversationRepository.expectReadReceipt(activeConversation);

const userParticipants = useMemo(() => {
const filteredUsers: User[] = participatingUserEts.flatMap(user => {
const isUser = !isServiceEntity(user);
return isUser ? [user] : [];
});

if (!removedFromConversation) {
return [...filteredUsers, selfUser].sort(sortUsersByPriority);
}

return filteredUsers;
}, [participatingUserEts, removedFromConversation, selfUser]);
Comment on lines +178 to +189
Copy link
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

👍


const usersCount = userParticipants.length;
const exceedsMaxUserCount = usersCount > CONFIG.MAX_USERS_VISIBLE;
const allUsersCount = exceedsMaxUserCount ? usersCount : 0;

const serviceParticipants: ServiceEntity[] = participatingUserEts.flatMap(service => {
const isService = isServiceEntity(service);
return isService ? [service] : [];
});

const toggleMute = () => actionsViewModel.toggleMuteConversation(activeConversation);

const openParticipantDevices = () => togglePanel(PanelState.PARTICIPANT_DEVICES, firstParticipant, false, 'left');
Expand Down Expand Up @@ -208,7 +227,7 @@ const ConversationDetails: FC<ConversationDetailsProps> = ({

if (serviceEntity) {
setSelectedService(serviceEntity);
integrationRepository.addProviderNameToParticipant(serviceEntity);
await integrationRepository.addProviderNameToParticipant(serviceEntity);
}
};

Expand All @@ -225,36 +244,12 @@ const ConversationDetails: FC<ConversationDetailsProps> = ({
if (isTeam && isSingleUserMode) {
teamRepository.updateTeamMembersByIds(team, [firstParticipant.id], true);
}
}, []);
}, [firstParticipant.id, isSingleUserMode, isTeam, team, teamRepository]);

useEffect(() => {
getService();
}, [firstParticipant, integrationRepository]);

useEffect(() => {
const users: User[] = participatingUserEts.flatMap(user => {
const isUser = !isServiceEntity(user);
return isUser ? [user] : [];
});

const services: ServiceEntity[] = participatingUserEts.flatMap(service => {
const isService = isServiceEntity(service);
return isService ? [service] : [];
});

setServiceParticipants(services);

if (!removedFromConversation) {
users.push(selfUser);
users.sort(sortUsersByPriority);
}

const usersCount = users.length;
const exceedsMaxUserCount = usersCount > CONFIG.MAX_USERS_VISIBLE;
setAllUsersCount(exceedsMaxUserCount ? usersCount : 0);
setUserParticipants(users);
}, [activeConversation, participatingUserEts.length, removedFromConversation, selfUser]);

return (
<div id="conversation-details" className="panel__page conversation-details">
<PanelHeader
Expand Down
6 changes: 2 additions & 4 deletions src/script/page/RightSidebar/ConversationParticipants/ConversationParticipants.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -76,7 +76,7 @@ const ConversationParticipants: FC<ConversationParticipantsProps> = ({
return isUser ? [user] : [];
});

if (removedFromConversation && selfUser) {
if (!removedFromConversation && selfUser) {
return [...users, selfUser].sort(sortUsersByPriority);
}

Expand All @@ -101,10 +101,8 @@ const ConversationParticipants: FC<ConversationParticipantsProps> = ({
/>

<div className="conversation-participants__list panel__content" ref={initFadingScrollbar}>
{/* TODO: Need to update dataUieName for UserSearchableList - make it in another PR, and change other UserSearchableList */}
{/*data-uie-name="list-conversation-participants"*/}

<UserSearchableList
dataUieName="list-conversation-participants"
users={participants}
filter={searchInput}
highlightedUsers={highlightedUsers}
Expand Down
2 changes: 1 addition & 1 deletion src/script/page/RightSidebar/GroupParticipantService/GroupParticipantService.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -91,7 +91,7 @@ const GroupParticipantService: FC<GroupParticipantServiceProps> = ({

useEffect(() => {
integrationRepository.addProviderNameToParticipant(serviceEntity);
}, [serviceEntity]);
}, [integrationRepository, serviceEntity]);

return (
<div id="group-participant-service" className="panel__page group-participant">
Expand Down
6 changes: 1 addition & 5 deletions src/script/page/RightSidebar/GroupParticipantUser/GroupParticipantUser.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -115,10 +115,6 @@ const GroupParticipantUser: FC<GroupParticipantUserProps> = ({

useEffect(() => {
amplify.subscribe(WebAppEvents.CONVERSATION.EVENT_FROM_BACKEND, checkMemberLeave);

return () => {
amplify.unsubscribeAll(WebAppEvents.CONVERSATION.EVENT_FROM_BACKEND);
};
}, []);

useEffect(() => {
Expand All @@ -131,7 +127,7 @@ const GroupParticipantUser: FC<GroupParticipantUserProps> = ({
if (isTeam) {
teamRepository.updateTeamMembersByIds(team, [currentUser.id], true);
}
}, [isTeam, currentUser]);
}, [isTeam, currentUser, teamRepository, team]);

useEffect(() => {
if (isTemporaryGuest) {
Expand Down
2 changes: 1 addition & 1 deletion src/script/page/RightSidebar/MessageDetails/MessageDetails.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -86,7 +86,7 @@ const MessageDetails: FC<MessageDetailsProps> = ({
const [likeUsers, setLikeUsers] = useState<User[]>([]);
const [messageId, setMessageId] = useState<string>(messageEntity.id);

const [isReceiptsOpen, setIsReceiptsOpen] = useState<boolean>(showLikes);
const [isReceiptsOpen, setIsReceiptsOpen] = useState<boolean>(!showLikes);

const {
timestamp,
Expand Down
18 changes: 11 additions & 7 deletions src/script/page/RightSidebar/RightSidebar.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -133,13 +133,17 @@ const RightSidebar: FC<RightSidebarProps> = ({
};

const onBackClick = (entity: PanelEntity | null = activeConversation) => {
rightSidebar.goBack(entity);
const previousHistory = rightSidebar.history.slice(0, -1);
const hasPreviousHistory = !!previousHistory.length;
setAnimatePanelToLeft(false);
};

const onBackToDetails = (entity: PanelEntity | null = activeConversation) => {
if (hasPreviousHistory) {
rightSidebar.goBack(entity);

return;
}

rightSidebar.goTo(PanelState.CONVERSATION_DETAILS, {entity});
setAnimatePanelToLeft(false);
};

const showDevices = (entity: User) => {
Expand Down Expand Up @@ -200,7 +204,7 @@ const RightSidebar: FC<RightSidebarProps> = ({

{currentState === PanelState.GROUP_PARTICIPANT_USER && userEntity && (
<GroupParticipantUser
onBack={onBackToDetails}
onBack={onBackClick}
onClose={closePanel}
goToRoot={goToRoot}
showDevices={showDevices}
Expand All @@ -220,7 +224,7 @@ const RightSidebar: FC<RightSidebarProps> = ({
activeConversation={activeConversation}
repositories={repositories}
onClose={closePanel}
onGoBack={onBackToDetails}
onGoBack={onBackClick}
/>
)}

Expand Down Expand Up @@ -260,7 +264,7 @@ const RightSidebar: FC<RightSidebarProps> = ({
actionsViewModel={actionsViewModel}
integrationRepository={integrationRepository}
goToRoot={goToRoot}
onBack={onBackToDetails}
onBack={onBackClick}
onClose={closePanel}
serviceEntity={serviceEntity}
userEntity={userServiceEntity}
Expand Down