From 0cdad1f41d8cc2002e7c265702099dcd4e418547 Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?Pablo=20Andr=C3=A9s=20V=C3=A9lez=20Vidal?= Date: Wed, 1 Feb 2023 15:30:14 +0100 Subject: [PATCH 1/9] MM-48246 - ab test open RHS with linked board; add telemetry info --- .../webapp/src/components/rhsChannelBoardItem.tsx | 13 ++++++++++++- webapp/src/telemetry/telemetryClient.ts | 1 + 2 files changed, 13 insertions(+), 1 deletion(-) diff --git a/mattermost-plugin/webapp/src/components/rhsChannelBoardItem.tsx b/mattermost-plugin/webapp/src/components/rhsChannelBoardItem.tsx index 5f60e71a8..43ee7841d 100644 --- a/mattermost-plugin/webapp/src/components/rhsChannelBoardItem.tsx +++ b/mattermost-plugin/webapp/src/components/rhsChannelBoardItem.tsx @@ -6,6 +6,7 @@ import {FormattedMessage, useIntl} from 'react-intl' import mutator from '../../../../webapp/src/mutator' import {Utils} from '../../../../webapp/src/utils' import {getCurrentTeam} from '../../../../webapp/src/store/teams' +import {getCurrentChannel} from '../../../../webapp/src/store/channels' import {createBoard, Board} from '../../../../webapp/src/blocks/board' import {useAppSelector} from '../../../../webapp/src/store/hooks' import IconButton from '../../../../webapp/src/widgets/buttons/iconButton' @@ -17,8 +18,10 @@ import CompassIcon from '../../../../webapp/src/widgets/icons/compassIcon' import {Permission} from '../../../../webapp/src/constants' -import './rhsChannelBoardItem.scss' import BoardPermissionGate from '../../../../webapp/src/components/permissions/boardPermissionGate' +import TelemetryClient, {TelemetryActions, TelemetryCategory} from '../../../../webapp/src/telemetry/telemetryClient' + +import './rhsChannelBoardItem.scss' const windowAny = (window as SuiteWindow) @@ -35,7 +38,15 @@ const RHSChannelBoardItem = (props: Props) => { return null } + const currentChannel = useAppSelector(getCurrentChannel) + if (!currentChannel) { + return null + } + const handleBoardClicked = (boardID: string) => { + // send the telemetry information for the clicked board + TelemetryClient.trackEvent(TelemetryCategory, TelemetryActions.ClickChannelsRHSBoard, {teamID: team.id, channelID: currentChannel.id}) + window.open(`${windowAny.frontendBaseURL}/team/${team.id}/${boardID}`, '_blank', 'noopener') } diff --git a/webapp/src/telemetry/telemetryClient.ts b/webapp/src/telemetry/telemetryClient.ts index 460e9d247..1787315da 100644 --- a/webapp/src/telemetry/telemetryClient.ts +++ b/webapp/src/telemetry/telemetryClient.ts @@ -50,6 +50,7 @@ export const TelemetryActions = { LimitCardLimitReached: 'limit_cardLimitReached', LimitCardLimitLinkOpen: 'limit_cardLimitLinkOpen', VersionMoreInfo: 'version_more_info', + ClickChannelsRHSBoard: 'click_channels_RHS_board', } interface IEventProps { From b4ea125a63ab10133ad3f97849c7687dd7bf5397 Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?Pablo=20Andr=C3=A9s=20V=C3=A9lez=20Vidal?= Date: Wed, 1 Feb 2023 18:53:02 +0100 Subject: [PATCH 2/9] add board info --- .../webapp/src/components/rhsChannelBoardItem.tsx | 3 ++- 1 file changed, 2 insertions(+), 1 deletion(-) diff --git a/mattermost-plugin/webapp/src/components/rhsChannelBoardItem.tsx b/mattermost-plugin/webapp/src/components/rhsChannelBoardItem.tsx index 43ee7841d..e796af1e5 100644 --- a/mattermost-plugin/webapp/src/components/rhsChannelBoardItem.tsx +++ b/mattermost-plugin/webapp/src/components/rhsChannelBoardItem.tsx @@ -45,7 +45,8 @@ const RHSChannelBoardItem = (props: Props) => { const handleBoardClicked = (boardID: string) => { // send the telemetry information for the clicked board - TelemetryClient.trackEvent(TelemetryCategory, TelemetryActions.ClickChannelsRHSBoard, {teamID: team.id, channelID: currentChannel.id}) + const extraData = {teamID: team.id, channelID: currentChannel.id, board: boardID} + TelemetryClient.trackEvent(TelemetryCategory, TelemetryActions.ClickChannelsRHSBoard, extraData) window.open(`${windowAny.frontendBaseURL}/team/${team.id}/${boardID}`, '_blank', 'noopener') } From 4030866a286c77ee14de1961f215a3336a9c498a Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?Pablo=20Andr=C3=A9s=20V=C3=A9lez=20Vidal?= Date: Mon, 6 Feb 2023 14:31:25 +0100 Subject: [PATCH 3/9] remove innecessary telemetry channel information --- .../webapp/src/components/rhsChannelBoardItem.tsx | 8 +------- 1 file changed, 1 insertion(+), 7 deletions(-) diff --git a/mattermost-plugin/webapp/src/components/rhsChannelBoardItem.tsx b/mattermost-plugin/webapp/src/components/rhsChannelBoardItem.tsx index e796af1e5..1f03dc003 100644 --- a/mattermost-plugin/webapp/src/components/rhsChannelBoardItem.tsx +++ b/mattermost-plugin/webapp/src/components/rhsChannelBoardItem.tsx @@ -6,7 +6,6 @@ import {FormattedMessage, useIntl} from 'react-intl' import mutator from '../../../../webapp/src/mutator' import {Utils} from '../../../../webapp/src/utils' import {getCurrentTeam} from '../../../../webapp/src/store/teams' -import {getCurrentChannel} from '../../../../webapp/src/store/channels' import {createBoard, Board} from '../../../../webapp/src/blocks/board' import {useAppSelector} from '../../../../webapp/src/store/hooks' import IconButton from '../../../../webapp/src/widgets/buttons/iconButton' @@ -38,14 +37,9 @@ const RHSChannelBoardItem = (props: Props) => { return null } - const currentChannel = useAppSelector(getCurrentChannel) - if (!currentChannel) { - return null - } - const handleBoardClicked = (boardID: string) => { // send the telemetry information for the clicked board - const extraData = {teamID: team.id, channelID: currentChannel.id, board: boardID} + const extraData = {teamID: team.id, board: boardID} TelemetryClient.trackEvent(TelemetryCategory, TelemetryActions.ClickChannelsRHSBoard, extraData) window.open(`${windowAny.frontendBaseURL}/team/${team.id}/${boardID}`, '_blank', 'noopener') From 5b1c53dffa7bb70fbaeb2fe6040a23df12706037 Mon Sep 17 00:00:00 2001 From: Benjamin Cooke Date: Wed, 22 Feb 2023 16:21:12 -0500 Subject: [PATCH 4/9] updating date when prop has changed --- webapp/src/properties/date/date.tsx | 8 +++++++- 1 file changed, 7 insertions(+), 1 deletion(-) diff --git a/webapp/src/properties/date/date.tsx b/webapp/src/properties/date/date.tsx index 23d764a1b..e2c285b5e 100644 --- a/webapp/src/properties/date/date.tsx +++ b/webapp/src/properties/date/date.tsx @@ -1,6 +1,6 @@ // Copyright (c) 2015-present Mattermost, Inc. All Rights Reserved. // See LICENSE.txt for license information. -import React, {useMemo, useState, useCallback} from 'react' +import React, {useMemo, useState, useCallback, useEffect} from 'react' import {useIntl} from 'react-intl' import {DateUtils} from 'react-day-picker' import MomentLocaleUtils from 'react-day-picker/moment' @@ -58,6 +58,12 @@ function DateRange(props: PropertyProps): JSX.Element { const [value, setValue] = useState(propertyValue) const intl = useIntl() + useEffect(() => { + if (value !== propertyValue) { + setValue(propertyValue) + } + }, [propertyValue, setValue]) + const onChange = useCallback((newValue) => { if (value !== newValue) { setValue(newValue) From ae44d6f2bfc78d36e9060a9c52ac8945695822c9 Mon Sep 17 00:00:00 2001 From: Benjamin Cooke Date: Thu, 23 Feb 2023 14:27:52 -0500 Subject: [PATCH 5/9] unit test --- .../date/__snapshots__/date.test.tsx.snap | 17 ++++++++++ webapp/src/properties/date/date.test.tsx | 32 +++++++++++++++++++ 2 files changed, 49 insertions(+) diff --git a/webapp/src/properties/date/__snapshots__/date.test.tsx.snap b/webapp/src/properties/date/__snapshots__/date.test.tsx.snap index 861e203c5..231f47e8a 100644 --- a/webapp/src/properties/date/__snapshots__/date.test.tsx.snap +++ b/webapp/src/properties/date/__snapshots__/date.test.tsx.snap @@ -34,6 +34,23 @@ exports[`properties/dateRange handle clear 1`] = ` `; +exports[`properties/dateRange returns component with new date after prop change 1`] = ` +
+
+ +
+
+`; + exports[`properties/dateRange returns default correctly 1`] = `
{ expect(mockedMutator.changePropertyValue).toHaveBeenCalledWith(board.id, card, propertyTemplate.id, JSON.stringify({from: today})) }) + + test('returns component with new date after prop change', () => { + const component = wrapIntl( + , + ) + + const {container, rerender} = render(component) + + rerender( + wrapIntl( + + ) + ) + + expect(container).toMatchSnapshot() + }) }) From 30c9da952efa2aff4c2c1e817cdddcb2ba1bbc09 Mon Sep 17 00:00:00 2001 From: Benjamin Cooke Date: Thu, 23 Feb 2023 15:35:04 -0500 Subject: [PATCH 6/9] lint --- webapp/src/properties/date/date.test.tsx | 6 +++--- 1 file changed, 3 insertions(+), 3 deletions(-) diff --git a/webapp/src/properties/date/date.test.tsx b/webapp/src/properties/date/date.test.tsx index d1989425b..dfabdf706 100644 --- a/webapp/src/properties/date/date.test.tsx +++ b/webapp/src/properties/date/date.test.tsx @@ -315,7 +315,7 @@ describe('properties/dateRange', () => { expect(mockedMutator.changePropertyValue).toHaveBeenCalledWith(board.id, card, propertyTemplate.id, JSON.stringify({from: today})) }) - + test('returns component with new date after prop change', () => { const component = wrapIntl( { board={{...board}} card={{...card}} propertyTemplate={propertyTemplate} - /> - ) + />, + ), ) expect(container).toMatchSnapshot() From 8f3407291d7eee1864169d3b792f653b9b9bb3a1 Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?Pablo=20Andr=C3=A9s=20V=C3=A9lez=20Vidal?= Date: Wed, 1 Mar 2023 00:34:43 +0100 Subject: [PATCH 7/9] update telemetry id Co-authored-by: Maria A Nunez --- webapp/src/telemetry/telemetryClient.ts | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/webapp/src/telemetry/telemetryClient.ts b/webapp/src/telemetry/telemetryClient.ts index 1787315da..c722929ff 100644 --- a/webapp/src/telemetry/telemetryClient.ts +++ b/webapp/src/telemetry/telemetryClient.ts @@ -50,7 +50,7 @@ export const TelemetryActions = { LimitCardLimitReached: 'limit_cardLimitReached', LimitCardLimitLinkOpen: 'limit_cardLimitLinkOpen', VersionMoreInfo: 'version_more_info', - ClickChannelsRHSBoard: 'click_channels_RHS_board', + ClickChannelsRHSBoard: 'click_board_in_channels_RHS', } interface IEventProps { From 56954e0491844a956ac095f63b97d72b68aa2523 Mon Sep 17 00:00:00 2001 From: Asaad Mahmood Date: Sat, 4 Mar 2023 12:20:05 +0500 Subject: [PATCH 8/9] Updating welcome screen for small sizes (#4609) --- .../__snapshots__/welcomePage.test.tsx.snap | 112 ++++++++++-------- webapp/src/pages/welcome/welcomePage.scss | 21 +++- webapp/src/pages/welcome/welcomePage.tsx | 104 ++++++++-------- 3 files changed, 138 insertions(+), 99 deletions(-) diff --git a/webapp/src/pages/welcome/__snapshots__/welcomePage.test.tsx.snap b/webapp/src/pages/welcome/__snapshots__/welcomePage.test.tsx.snap index 2dfc52f90..ef9ac5df4 100644 --- a/webapp/src/pages/welcome/__snapshots__/welcomePage.test.tsx.snap +++ b/webapp/src/pages/welcome/__snapshots__/welcomePage.test.tsx.snap @@ -18,32 +18,40 @@ exports[`pages/welcome Welcome Page shows Explore Page 1`] = ` > Boards is a project management tool that helps define, organize, track, and manage work across teams using a familiar Kanban board view.
- Boards Welcome Image - Boards Welcome Image - - + Boards Welcome Image +
+ + +
+
@@ -67,32 +75,40 @@ exports[`pages/welcome Welcome Page shows Explore Page with subpath 1`] = ` > Boards is a project management tool that helps define, organize, track, and manage work across teams using a familiar Kanban board view. - Boards Welcome Image - Boards Welcome Image - - + Boards Welcome Image +
+ + +
+ diff --git a/webapp/src/pages/welcome/welcomePage.scss b/webapp/src/pages/welcome/welcomePage.scss index d6810e1bf..ebeb7f2b6 100644 --- a/webapp/src/pages/welcome/welcomePage.scss +++ b/webapp/src/pages/welcome/welcomePage.scss @@ -10,6 +10,26 @@ @media (max-height: 768px) { justify-content: flex-start; height: auto; + padding-top: 40px; + } + + .WelcomePage__content { + display: flex; + flex-direction: column; + align-items: center; + gap: 12px; + + @media (max-height: 800px) { + flex-direction: column-reverse; + margin-top: 16px; + } + } + + .WelcomePage__buttons { + display: flex; + flex-direction: column; + align-items: center; + gap: 12px; } > div { @@ -34,7 +54,6 @@ } .skip { - margin-top: 12px; color: rgba(var(--link-color-rgb), 1); cursor: pointer; diff --git a/webapp/src/pages/welcome/welcomePage.tsx b/webapp/src/pages/welcome/welcomePage.tsx index df7a6edbf..723f5c3f5 100644 --- a/webapp/src/pages/welcome/welcomePage.tsx +++ b/webapp/src/pages/welcome/welcomePage.tsx @@ -127,59 +127,63 @@ const WelcomePage = () => { /> - {/* This image will be rendered on large screens over 2000px */} - Boards Welcome Image +
+ {/* This image will be rendered on large screens over 2000px */} + Boards Welcome Image - {/* This image will be rendered on small screens below 2000px */} - Boards Welcome Image + {/* This image will be rendered on small screens below 2000px */} + Boards Welcome Image - {me?.is_guest !== true && - } +
+ {me?.is_guest !== true && + } - {me?.is_guest !== true && - - - } - {me?.is_guest === true && - } + {me?.is_guest !== true && + + + } + {me?.is_guest === true && + } +
+
) From d16bbcbe10fba7d525c836c7c84d3cacbe4eb3c1 Mon Sep 17 00:00:00 2001 From: Scott Bishel Date: Mon, 6 Mar 2023 08:48:30 -0700 Subject: [PATCH 9/9] Fix table multiperson (#4613) * clear overflow on multiperson * clear overflow on multiperson --- webapp/src/components/table/table.scss | 1 + 1 file changed, 1 insertion(+) diff --git a/webapp/src/components/table/table.scss b/webapp/src/components/table/table.scss index bbc9ef118..6d36a7215 100644 --- a/webapp/src/components/table/table.scss +++ b/webapp/src/components/table/table.scss @@ -203,6 +203,7 @@ width: inherit; } + .MultiPerson.octo-propertyvalue, .Person.octo-propertyvalue, .DateRange.octo-propertyvalue { overflow: unset;