diff --git a/src/streams/TopicItem.js b/src/streams/TopicItem.js index 2195ba4b4e9..cd2ad31bdf3 100644 --- a/src/streams/TopicItem.js +++ b/src/streams/TopicItem.js @@ -1,10 +1,15 @@ /* @flow strict-local */ -import React from 'react'; +import React, { useContext } from 'react'; import { View } from 'react-native'; +import { useActionSheet } from '@expo/react-native-action-sheet'; import styles, { BRAND_COLOR, createStyleSheet } from '../styles'; import { RawLabel, Touchable, UnreadCount } from '../common'; -import { showToast } from '../utils/info'; +import { showHeaderActionSheet } from '../message/messageActionSheet'; +import type { ShowActionSheetWithOptions } from '../message/messageActionSheet'; +import { TranslationContext } from '../boot/TranslationProvider'; +import { useDispatch, useSelector } from '../react-redux'; +import { getAuth, getMute, getFlags, getSubscriptions, getOwnUser } from '../selectors'; const componentStyles = createStyleSheet({ selectedRow: { @@ -33,8 +38,31 @@ type Props = $ReadOnly<{| export default function TopicItem(props: Props) { const { name, stream, isMuted = false, isSelected = false, unreadCount = 0, onPress } = props; + const showActionSheetWithOptions: ShowActionSheetWithOptions = useActionSheet() + .showActionSheetWithOptions; + const _ = useContext(TranslationContext); + const dispatch = useDispatch(); + const backgroundData = useSelector(state => ({ + auth: getAuth(state), + mute: getMute(state), + subscriptions: getSubscriptions(state), + ownUser: getOwnUser(state), + flags: getFlags(state), + })); + return ( - onPress(stream, name)} onLongPress={() => showToast(name)}> + onPress(stream, name)} + onLongPress={() => { + showHeaderActionSheet({ + showActionSheetWithOptions, + callbacks: { dispatch, _ }, + backgroundData, + stream, + topic: name, + }); + }} + >