From 11ac1f4d1979ff684784eb782de3aa87835a797e Mon Sep 17 00:00:00 2001 From: Harshil Sharma <18575143+harshilsharma63@users.noreply.github.com> Date: Fri, 15 Nov 2024 19:20:00 +0530 Subject: [PATCH] [MM-61539] Removed duplicate draft icons when no scheduled posts exist and updated draft icon (#29218) * Removed duplicate draft icons * Added tooltip * Restored drafts count icon --- .../drafts/drafts_link/drafts_link.tsx | 74 ++++++++++++++----- webapp/channels/src/i18n/en.json | 1 + 2 files changed, 56 insertions(+), 19 deletions(-) diff --git a/webapp/channels/src/components/drafts/drafts_link/drafts_link.tsx b/webapp/channels/src/components/drafts/drafts_link/drafts_link.tsx index 707f4f2c04f..ba977a43685 100644 --- a/webapp/channels/src/components/drafts/drafts_link/drafts_link.tsx +++ b/webapp/channels/src/components/drafts/drafts_link/drafts_link.tsx @@ -2,7 +2,7 @@ // See LICENSE.txt for license information. import classNames from 'classnames'; -import React, {memo, useEffect, useRef} from 'react'; +import React, {memo, useEffect, useMemo, useRef} from 'react'; import {FormattedMessage} from 'react-intl'; import {useSelector, useDispatch} from 'react-redux'; import {NavLink, useRouteMatch} from 'react-router-dom'; @@ -19,6 +19,7 @@ import {makeGetDraftsCount} from 'selectors/drafts'; import DraftsTourTip from 'components/drafts/drafts_link/drafts_tour_tip/drafts_tour_tip'; import ChannelMentionBadge from 'components/sidebar/sidebar_channel/channel_mention_badge'; +import WithTooltip from 'components/with_tooltip'; import {SCHEDULED_POST_URL_SUFFIX} from 'utils/constants'; @@ -81,6 +82,30 @@ function DraftsLink() { initialScheduledPostsLoaded.current = true; }, [dispatch, isScheduledPostEnabled, teamId]); + const showScheduledPostCount = isScheduledPostEnabled && teamScheduledPostCount > 0; + + const tooltipText = useMemo(() => { + const lineBreaks = (x: React.ReactNode) => { + if (draftCount > 0 && teamScheduledPostCount > 0) { + return (<>
{x}); + } + + return null; + }; + + return ( + + ); + }, [draftCount, teamScheduledPostCount]); + if (!itemsExist && !urlMatches) { return null; } @@ -100,7 +125,10 @@ function DraftsLink() { className='SidebarLink sidebar-item' tabIndex={0} > - {pencilIcon} +
- { - draftCount > 0 && - - } - - { - isScheduledPostEnabled && teamScheduledPostCount > 0 && - - } + +
+ { + draftCount > 0 && + + } + + { + showScheduledPostCount && + + } +
+
diff --git a/webapp/channels/src/i18n/en.json b/webapp/channels/src/i18n/en.json index fdc0f08de3a..486426282c4 100644 --- a/webapp/channels/src/i18n/en.json +++ b/webapp/channels/src/i18n/en.json @@ -3612,6 +3612,7 @@ "drafts.sidebarLink": "Drafts", "drafts.subtitle": "Any messages you've started will show here", "drafts.title": "{prefix}Drafts - {displayName} {siteName}", + "drafts.tooltipText": "{draftCount, plural, =0 {} =1 {1 Draft} other {{draftCount} Drafts}}

{scheduledPostCount, plural, =0 {} other {{scheduledPostCount} Scheduled}}", "drafts.tutorial_tip.notNow": "Not now", "drafts.tutorial_tip.viewDrafts": "View drafts", "drafts.tutorialTip.description": "With the new Drafts view, all of your unfinished messages are collected in one place. Return here to read, edit, or send draft messages.",