diff --git a/_locales/en/messages.json b/_locales/en/messages.json index c3e692b9a..b3ac604d2 100644 --- a/_locales/en/messages.json +++ b/_locales/en/messages.json @@ -1915,6 +1915,10 @@ "message": "No contacts found", "description": "Label shown when there are no contacts to compose to" }, + "noGroupsFound": { + "message": "No groups found", + "description": "Label shown when there are no groups to compose to" + }, "noConversationsFound": { "message": "No conversations found", "description": "Label shown when there are no conversations to compose to" @@ -5623,6 +5627,10 @@ "message": "Remove story? This will remove the story from your list, but you will still be able to view stories from this group.", "description": "Confirmation body for removing a group story" }, + "SendStoryModal__announcements-only": { + "message": "Only admins can send stories to this group.", + "description": "Alert body for groups that non-admins cannot send stories to" + }, "Stories__settings-toggle--title": { "message": "Share & View Stories", "description": "Select box title for the stories on/off toggle" diff --git a/ts/components/Alert.tsx b/ts/components/Alert.tsx index f0e2dc8a4..532d8d617 100644 --- a/ts/components/Alert.tsx +++ b/ts/components/Alert.tsx @@ -5,30 +5,34 @@ import type { FunctionComponent, ReactNode } from 'react'; import React from 'react'; import type { LocalizerType } from '../types/Util'; +import type { Theme } from '../util/theme'; import { Button } from './Button'; import { Modal } from './Modal'; type PropsType = { - title?: string; body: ReactNode; i18n: LocalizerType; onClose: () => void; + theme?: Theme; + title?: string; }; export const Alert: FunctionComponent = ({ body, i18n, onClose, + theme, title, }) => ( {i18n('Confirmation--confirm')} } + modalName="Alert" + onClose={onClose} + theme={theme} + title={title} > {body} diff --git a/ts/components/SendStoryModal.tsx b/ts/components/SendStoryModal.tsx index 2ed35527d..66a5ed719 100644 --- a/ts/components/SendStoryModal.tsx +++ b/ts/components/SendStoryModal.tsx @@ -13,6 +13,7 @@ import type { PreferredBadgeSelectorType } from '../state/selectors/badges'; import type { PropsType as StoriesSettingsModalPropsType } from './StoriesSettingsModal'; import type { StoryDistributionListWithMembersDataType } from '../types/Stories'; import type { UUIDStringType } from '../types/UUID'; +import { Alert } from './Alert'; import { Avatar, AvatarSize } from './Avatar'; import { Button, ButtonVariant } from './Button'; import { Checkbox } from './Checkbox'; @@ -199,6 +200,8 @@ export const SendStoryModal = ({ Array >([]); + const [hasAnnouncementsOnlyAlert, setHasAnnouncementsOnlyAlert] = + useState(false); const [confirmRemoveGroupId, setConfirmRemoveGroupId] = useState< string | undefined >(); @@ -481,6 +484,11 @@ export const SendStoryModal = ({ moduleClassName="SendStoryModal__distribution-list" name="SendStoryModal__distribution-list" onChange={(value: boolean) => { + if (group.announcementsOnly && !group.areWeAdmin) { + setHasAnnouncementsOnlyAlert(true); + return; + } + setChosenGroupIds(groupIds => { if (value) { groupIds.add(group.id); @@ -531,7 +539,7 @@ export const SendStoryModal = ({ )) ) : (
- {i18n('noContactsFound')} + {i18n('noGroupsFound')}
)} @@ -708,6 +716,11 @@ export const SendStoryModal = ({ return; } + if (group.announcementsOnly && !group.areWeAdmin) { + setHasAnnouncementsOnlyAlert(true); + return; + } + setSelectedGroupIds(groupIds => { if (value) { groupIds.add(group.id); @@ -788,6 +801,14 @@ export const SendStoryModal = ({ > {modal} + {hasAnnouncementsOnlyAlert && ( + setHasAnnouncementsOnlyAlert(false)} + theme={Theme.Dark} + /> + )} {confirmRemoveGroupId && (