Skip to content
This repository has been archived by the owner on Oct 4, 2023. It is now read-only.

[C-2968] Fix private collection action buttons #3937

Merged
merged 1 commit into from
Aug 23, 2023
Merged
Show file tree
Hide file tree
Changes from all commits
Commits
File filter

Filter by extension

Filter by extension

Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
Original file line number Diff line number Diff line change
Expand Up @@ -23,6 +23,8 @@ export const OwnerActionButtons = (props: OwnerActionButtonProps) => {
) as Collection
const { track_count, is_private, is_album } = collection ?? {}

const isDisabled = track_count === 0

return collection ? (
<>
<EditButton
Expand All @@ -31,7 +33,10 @@ export const OwnerActionButtons = (props: OwnerActionButtonProps) => {
/>
<ShareButton
collectionId={collectionId}
disabled={track_count === 0}
disabled={isDisabled}
tooltipText={
isDisabled ? 'You can’t share an empty playlist.' : undefined
}
widthToHideText={BUTTON_COLLAPSE_WIDTHS.third}
/>
{is_private && !is_album ? (
Expand Down
10 changes: 5 additions & 5 deletions packages/web/src/components/collection/desktop/ShareButton.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -16,17 +16,17 @@ import { EntityActionButton } from '../../entity-page/EntityActionButton'
const { requestOpen: requestOpenShareModal } = shareModalUIActions

const messages = {
share: 'Share',
emptyPlaylistTooltipText: 'You can’t share an empty playlist.'
share: 'Share'
}

type ShareButtonProps = Partial<ButtonProps> & {
collectionId: SmartCollectionVariant | ID
userId?: ID
tooltipText?: string
}

export const ShareButton = (props: ShareButtonProps) => {
const { collectionId, type, userId, ...other } = props
const { collectionId, type, userId, tooltipText, ...other } = props
const dispatch = useDispatch()

const handleShare = useCallback(() => {
Expand Down Expand Up @@ -64,8 +64,8 @@ export const ShareButton = (props: ShareButtonProps) => {
/>
)

return other.disabled ? (
<Tooltip text={messages.emptyPlaylistTooltipText}>
return tooltipText ? (
<Tooltip text={tooltipText}>
<span>{shareButtonElement}</span>
</Tooltip>
) : (
Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -4,7 +4,6 @@ import {
CommonState,
ID
} from '@audius/common'
import { ButtonType } from '@audius/stems'
import { useSelector } from 'react-redux'

import { FavoriteButton } from './FavoriteButton'
Expand All @@ -24,23 +23,24 @@ export const ViewerActionButtons = (props: ViewerActionButtonsProps) => {
getCollection(state, { id: collectionId })
) as Collection | null

const isEmptyPlaylist = !collection || collection.track_count === 0
const { track_count, is_private } = collection ?? {}
const isDisabled = !collection || track_count === 0 || is_private

return (
<>
<ShareButton
disabled={isDisabled}
collectionId={collectionId}
type={isEmptyPlaylist ? ButtonType.DISABLED : undefined}
widthToHideText={BUTTON_COLLAPSE_WIDTHS.second}
/>
<RepostButton
disabled={isDisabled}
collectionId={collectionId}
type={isEmptyPlaylist ? ButtonType.DISABLED : undefined}
widthToHideText={BUTTON_COLLAPSE_WIDTHS.third}
/>
<FavoriteButton
disabled={isDisabled}
collectionId={collectionId}
type={isEmptyPlaylist ? ButtonType.DISABLED : undefined}
widthToHideText={BUTTON_COLLAPSE_WIDTHS.fourth}
/>
<OverflowMenuButton collectionId={collectionId} />
Expand Down