diff --git a/e2e-tests/playwright/lib/src/ui/components/channels/center_view.ts b/e2e-tests/playwright/lib/src/ui/components/channels/center_view.ts
index 62fd0d7106..951be18362 100644
--- a/e2e-tests/playwright/lib/src/ui/components/channels/center_view.ts
+++ b/e2e-tests/playwright/lib/src/ui/components/channels/center_view.ts
@@ -21,7 +21,9 @@ export default class ChannelsCenterView {
readonly scheduledDraftChannelIcon;
readonly scheduledDraftChannelInfoMessage;
readonly scheduledDraftChannelInfoMessageLocator;
+ readonly scheduledDraftDMChannelLocator;
readonly scheduledDraftChannelInfoMessageText;
+ readonly scheduledDraftDMChannelLocatorString;
readonly scheduledDraftSeeAllLink;
readonly postEdit;
readonly editedPostIcon;
@@ -29,6 +31,7 @@ export default class ChannelsCenterView {
constructor(container: Locator) {
this.container = container;
this.scheduledDraftChannelInfoMessageLocator = 'span:has-text("Message scheduled for")';
+ this.scheduledDraftDMChannelLocatorString = 'div.ScheduledPostIndicator span a';
this.header = new ChannelsHeader(this.container.locator('.channel-header'));
this.postCreate = new ChannelsPostCreate(container.getByTestId('post-create'));
this.scheduledDraftOptions = new ChannelsPostCreate(container.locator('#dropdown_send_post_options'));
@@ -37,6 +40,7 @@ export default class ChannelsCenterView {
this.scheduledDraftChannelIcon = container.locator('#create_post i.icon-draft-indicator');
this.scheduledDraftChannelInfoMessage = container.locator('div.ScheduledPostIndicator span');
this.scheduledDraftChannelInfoMessageText = container.locator(this.scheduledDraftChannelInfoMessageLocator);
+ this.scheduledDraftDMChannelLocator = container.locator(this.scheduledDraftDMChannelLocatorString);
this.scheduledDraftSeeAllLink = container.locator('a:has-text("See all")');
this.editedPostIcon = (postID: string) => container.locator(`#postEdited_${postID}`);
}
@@ -127,16 +131,20 @@ export default class ChannelsCenterView {
);
}
+ async goToScheduledDraftsFromDMChannel() {
+ if (await this.scheduledDraftDMChannelLocator.isVisible()) {
+ await this.scheduledDraftDMChannelLocator.click();
+ return;
+ }
+ await this.scheduledDraftSeeAllLink.isVisible();
+ await this.scheduledDraftSeeAllLink.click();
+ }
+
async verifyscheduledDraftChannelInfo() {
await this.postBoxIndicator.isVisible();
await this.scheduledDraftChannelIcon.isVisible();
const messageLocator = this.scheduledDraftChannelInfoMessage.first();
- try {
- await expect(messageLocator).toContainText('Message scheduled for');
- } catch {
- // First assertion failed, trying fallback
- await expect(messageLocator).toContainText('You have one scheduled message.');
- }
+ await expect(messageLocator).toContainText('Message scheduled for');
}
async clickOnLastEditedPost(postID: string | null) {
diff --git a/e2e-tests/playwright/specs/functional/channels/scheduled_drafts/create_scheduled_draft.spec.ts b/e2e-tests/playwright/specs/functional/channels/scheduled_drafts/create_scheduled_draft.spec.ts
index 55fee59434..2b06c60258 100644
--- a/e2e-tests/playwright/specs/functional/channels/scheduled_drafts/create_scheduled_draft.spec.ts
+++ b/e2e-tests/playwright/specs/functional/channels/scheduled_drafts/create_scheduled_draft.spec.ts
@@ -192,11 +192,7 @@ test('MM-T5643_3 should create a scheduled message from a DM', async ({pw}) => {
await setupChannelPage(channelsPage, draftMessage, team.name, `@${user2.username}`);
await scheduleMessage(channelsPage);
- await channelsPage.centerView.verifyscheduledDraftChannelInfo();
-
- const postBoxIndicator = await channelsPage.centerView.scheduledDraftChannelInfoMessageText.innerText();
-
- await verifyScheduledDraft(channelsPage, scheduledDraftPage, draftMessage, postBoxIndicator);
+ await channelsPage.centerView.goToScheduledDraftsFromDMChannel();
// # Hover and verify options
await scheduledDraftPage.verifyOnHoverActionItems(draftMessage);
@@ -288,7 +284,7 @@ test('MM-T5650 should copy scheduled message', async ({pw, browserName}) => {
const {user} = await pw.initSetup();
const {page, channelsPage, scheduledDraftPage} = await pw.testBrowser.login(user);
- await setupChannelPage(channelsPage, draftMessage);
+ await setupChannelPage(channelsPage, draftMessage, '', 'town-square');
await scheduleMessage(channelsPage);
await channelsPage.centerView.verifyscheduledDraftChannelInfo();
diff --git a/webapp/channels/src/components/file_attachment/__snapshots__/file_attachment.test.tsx.snap b/webapp/channels/src/components/file_attachment/__snapshots__/file_attachment.test.tsx.snap
index 464ea0c7cb..0cac2bb9af 100644
--- a/webapp/channels/src/components/file_attachment/__snapshots__/file_attachment.test.tsx.snap
+++ b/webapp/channels/src/components/file_attachment/__snapshots__/file_attachment.test.tsx.snap
@@ -45,6 +45,7 @@ exports[`FileAttachment should match snapshot when file is deleted 1`] = `
>
@@ -633,6 +641,7 @@ exports[`FileAttachment should not render menu items when disable actions is set
>
{
@@ -88,6 +88,7 @@ export default class FilenameOverlay extends React.PureComponent {
diff --git a/webapp/channels/src/components/file_search_results/__snapshots__/file_search_result_item.test.tsx.snap b/webapp/channels/src/components/file_search_results/__snapshots__/file_search_result_item.test.tsx.snap
index 6690980a47..0c1adccea3 100644
--- a/webapp/channels/src/components/file_search_results/__snapshots__/file_search_result_item.test.tsx.snap
+++ b/webapp/channels/src/components/file_search_results/__snapshots__/file_search_result_item.test.tsx.snap
@@ -85,7 +85,7 @@ exports[`components/file_search_result/FileSearchResultItem should match snapsho
}
>
@@ -192,7 +192,7 @@ exports[`components/file_search_result/FileSearchResultItem should match snapsho
}
>
@@ -299,7 +299,7 @@ exports[`components/file_search_result/FileSearchResultItem should match snapsho
}
>
@@ -401,7 +401,7 @@ exports[`components/file_search_result/FileSearchResultItem should match snapsho
}
>
diff --git a/webapp/channels/src/components/file_search_results/file_search_result_item.scss b/webapp/channels/src/components/file_search_results/file_search_result_item.scss
index 9c6ecc7fb6..71ffebab00 100644
--- a/webapp/channels/src/components/file_search_results/file_search_result_item.scss
+++ b/webapp/channels/src/components/file_search_results/file_search_result_item.scss
@@ -85,33 +85,16 @@
}
.action-icon {
- display: flex;
- width: 32px;
- min-width: 32px;
- height: 32px;
- justify-content: center;
- border-radius: 4px;
- margin-left: 8px;
- background-color: var(--center-channel-bg);
- color: rgba(var(--center-channel-color-rgb), 0.64);
- cursor: pointer;
- fill: rgba(var(--center-channel-color-rgb), 0.64);
- opacity: 0;
- text-decoration: none;
- transition: opacity 0.15s ease;
+ display: none;
+ margin-left: 2px;
&.download-icon {
- margin-right: 6px;
+ margin-right: 2px;
}
svg {
display: flex;
}
-
- &:hover {
- background-color: rgba(var(--center-channel-color-rgb), 0.08);
- color: rgba(var(--center-channel-color-rgb), 0.8);
- }
}
.MenuWrapper {
diff --git a/webapp/channels/src/components/file_search_results/file_search_result_item.tsx b/webapp/channels/src/components/file_search_results/file_search_result_item.tsx
index 99b055d116..8885abd76a 100644
--- a/webapp/channels/src/components/file_search_results/file_search_result_item.tsx
+++ b/webapp/channels/src/components/file_search_results/file_search_result_item.tsx
@@ -154,7 +154,7 @@ export default class FileSearchResultItem extends React.PureComponent
@@ -181,7 +181,7 @@ export default class FileSearchResultItem extends React.PureComponent
diff --git a/webapp/channels/src/sass/components/_files.scss b/webapp/channels/src/sass/components/_files.scss
index ae5954714d..ca91d5f67b 100644
--- a/webapp/channels/src/sass/components/_files.scss
+++ b/webapp/channels/src/sass/components/_files.scss
@@ -352,7 +352,6 @@
&:hover,
&:focus-within,
&.keep-open {
- overflow: visible;
box-shadow: 0 2px 3px 0 rgba(variables.$black, 0.1), 0 2px 3px 0 rgba(variables.$black, 0.1);
.file-dropdown-icon {
@@ -463,20 +462,6 @@
.file-dropdown-icon {
display: none;
- width: 32px;
- min-width: 32px;
- height: 32px;
- align-items: center;
- justify-content: center;
- border: 0;
- border-radius: 4px;
- margin-left: 8px;
- background-color: var(--center-channel-bg);
- color: rgba(var(--center-channel-color-rgb), 0.64);
- cursor: pointer;
- fill: rgba(var(--center-channel-color-rgb), 0.64);
- text-decoration: none;
- transition: opacity 0.15s ease;
svg {
display: flex;
@@ -484,8 +469,6 @@
&:hover {
display: flex;
- background-color: rgba(var(--center-channel-color-rgb), 0.08);
- color: rgba(var(--center-channel-color-rgb), 0.8);
}
&:focus {
@@ -497,9 +480,15 @@
position: relative;
display: flex;
overflow: hidden;
+ width: 100%;
+ min-width: 0;
height: 100%;
flex: 1;
+ flex-direction: row;
align-items: center;
+ padding-right: 12px;
+ background: transparent;
+ color: functions.v(center-channel-color);
font-size: 12px;
text-align: left;
@@ -529,7 +518,9 @@
.post-image__detail_wrapper {
display: flex;
+ min-width: 0;
flex: 1;
+ flex-direction: row;
padding: 0;
.post--compact & {
@@ -538,6 +529,7 @@
.post-image__detail {
width: 100%;
+ min-width: 0;
height: 100%;
line-height: normal;
@@ -590,67 +582,39 @@
}
.post-image__download {
- top: 0;
- right: 0;
display: flex;
height: 100%;
align-items: center;
justify-content: center;
- padding: 0 1.6rem;
+ margin-left: 2px;
+ background: transparent;
line-height: 0;
opacity: 1;
text-align: center;
- transition: opacity 0.15s ease;
-
- a {
- display: flex;
- width: 3.2rem;
- height: 3.2rem;
- align-items: center;
- justify-content: center;
- border-radius: 4px;
- color: rgba(functions.v(center-channel-color-rgb), 0.75);
- font-size: 1.6rem;
- text-decoration: none;
-
- &:focus {
- color: rgba(functions.v(center-channel-color-rgb), 0.75);
- }
-
- &:hover {
- background: rgba(functions.v(center-channel-color-rgb), 0.08);
- color: rgba(functions.v(center-channel-color-rgb), 0.75);
- }
-
- &:active {
- background: rgba(var(--button-bg-rgb), 0.08);
- color: functions.v(button-bg);
- }
- }
-
- span {
- display: inline-block;
- }
+ transition: opacity 0.15s ease, background-color 0.15s ease;
svg {
display: inline-block;
width: 30px;
height: 30px;
- border: 1px solid;
- border-color: rgba(var(--center-channel-color-rgb), 0.35);
+ border: 1px solid rgba(var(--center-channel-color-rgb), 0.35);
border-radius: 50%;
opacity: 0.7;
stroke: rgba(var(--center-channel-color-rgb), 0.4);
- transition: all 0.1s linear;
+ transition: opacity 0.15s ease;
&:hover {
opacity: 1;
}
}
- }
- div.MenuWrapper + .post-image__download {
- padding-left: 8px;
+ .btn-icon {
+ display: flex;
+ }
+
+ span {
+ display: inline-block;
+ }
}
.post-image__progressBar {