Fix UI regressions (#17)

* Fix UI regressions * Fix type * Fix border
mattermost · Mar 10, 2022 · fa811fe · fa811fe
1 parent ece978a
commit fa811fe
Show file tree

Hide file tree

Showing 6 changed files with 8 additions and 1 deletion.
diff --git a/e2e/tests/join_call.spec.ts b/e2e/tests/join_call.spec.ts
@@ -58,6 +58,8 @@ test.describe('join call', () => {
         const joinCallButton = page.locator('.post__body').last().locator('button:has-text("Join call")');
         await expect(joinCallButton).toBeVisible();
 
+        await expect(page.locator('.call-thread').last()).toBeVisible();
+
         expect(await page.locator('.call-thread').last().screenshot()).toMatchSnapshot('call-thread-join.png');
 
         await joinCallButton.click();

diff --git a/e2e/tests/join_call.spec.ts-snapshots/call-thread-join-chromium-linux.png b/e2e/tests/join_call.spec.ts-snapshots/call-thread-join-chromium-linux.png
diff --git a/e2e/tests/join_call.spec.ts-snapshots/call-thread-leave-chromium-linux.png b/e2e/tests/join_call.spec.ts-snapshots/call-thread-leave-chromium-linux.png
diff --git a/webapp/src/components/channel_call_toast/component.tsx b/webapp/src/components/channel_call_toast/component.tsx
@@ -97,6 +97,7 @@ export default class ChannelCallToast extends React.PureComponent<Props, State>
                         pictures={this.props.pictures}
                         size={24}
                         fontSize={10}
+                        border={false}
                         maxShowedProfiles={2}
                     />
                 </div>

diff --git a/webapp/src/components/connected_profiles.tsx b/webapp/src/components/connected_profiles.tsx
@@ -11,9 +11,10 @@ interface Props {
     maxShowedProfiles: number,
     size: number;
     fontSize: number;
+    border?: boolean;
 }
 
-const ConnectedProfiles = ({pictures, profiles, maxShowedProfiles, size, fontSize}: Props) => {
+const ConnectedProfiles = ({pictures, profiles, maxShowedProfiles, size, fontSize, border}: Props) => {
     maxShowedProfiles = maxShowedProfiles || 2;
     const diff = profiles.length - maxShowedProfiles;
     profiles = diff > 0 ? profiles.slice(0, maxShowedProfiles) : profiles;
@@ -35,6 +36,7 @@ const ConnectedProfiles = ({pictures, profiles, maxShowedProfiles, size, fontSiz
                     size={size}
                     fontSize={fontSize}
                     url={pictures[idx]}
+                    border={Boolean(border)}
                     style={{position: 'relative', left: `${margin + off}px`}}
                 />
             </OverlayTrigger>
@@ -47,6 +49,7 @@ const ConnectedProfiles = ({pictures, profiles, maxShowedProfiles, size, fontSiz
                 size={size}
                 text={`+${diff}`}
                 style={{position: 'relative', left: `${margin}px`}}
+                border={Boolean(border)}
                 key='call_thread_more_profiles'
             />,
         );

diff --git a/webapp/src/components/post_type/component.tsx b/webapp/src/components/post_type/component.tsx
@@ -148,6 +148,7 @@ export default class PostType extends React.PureComponent<Props> {
                                 pictures={this.props.pictures}
                                 size={32}
                                 fontSize={12}
+                                border={true}
                                 maxShowedProfiles={2}
                             />
                         </div>