diff --git a/src/components/Toast/index.tsx b/src/components/Toast/index.tsx index 57bb56e30c..c13feeb72d 100644 --- a/src/components/Toast/index.tsx +++ b/src/components/Toast/index.tsx @@ -37,7 +37,13 @@ export {Outlet} from '#/components/Toast/Portal' const TOAST_ANIMATION_DURATION = 300 -export function ToastProvider({children}: {children: React.ReactNode}) { +export function ToastProvider({ + children, + offsetTop, +}: { + children: React.ReactNode + offsetTop?: number +}) { const {top} = useSafeAreaInsets() const [toasts, setToasts] = useState< { @@ -96,7 +102,7 @@ export function ToastProvider({children}: {children: React.ReactNode}) { a.gap_sm, { flexDirection: 'column-reverse', - top: top, + top: offsetTop ?? top, left: a.px_lg.paddingLeft, right: a.px_lg.paddingLeft, }, diff --git a/src/view/com/composer/Composer.tsx b/src/view/com/composer/Composer.tsx index 71714fddee..c109e28909 100644 --- a/src/view/com/composer/Composer.tsx +++ b/src/view/com/composer/Composer.tsx @@ -127,6 +127,7 @@ import {EmojiArc_Stroke2_Corner0_Rounded as EmojiSmile} from '#/components/icons import {TimesLarge_Stroke2_Corner0_Rounded as X} from '#/components/icons/Times' import {LazyQuoteEmbed} from '#/components/Post/Embed/LazyQuoteEmbed' import * as Prompt from '#/components/Prompt' +import {useToast} from '#/components/Toast' import {Text as NewText} from '#/components/Typography' import {BottomSheetPortalProvider} from '../../../../modules/bottom-sheet' import { @@ -776,6 +777,7 @@ let ComposerPost = React.memo(function ComposerPost({ : _(msg`Add another post`) : _(msg`What's up?`) const discardPromptControl = Prompt.usePromptControl() + const {show: showToast} = useToast() const dispatchPost = useCallback( (action: PostAction) => { @@ -807,6 +809,11 @@ let ComposerPost = React.memo(function ComposerPost({ const onPhotoPasted = useCallback( async (uri: string) => { + showToast({ + type: 'success', + content: _(msg`Pasty wasty`), + a11yLabel: _(msg`Pasty wasty`), + }) if (uri.startsWith('data:video/') || uri.startsWith('data:image/gif')) { if (isNative) return // web only const [mimeType] = uri.slice('data:'.length).split(';') @@ -824,7 +831,7 @@ let ComposerPost = React.memo(function ComposerPost({ onImageAdd([res]) } }, - [post.id, onSelectVideo, onImageAdd, _], + [post.id, onSelectVideo, onImageAdd, _, showToast], ) useHideKeyboardOnBackground() diff --git a/src/view/shell/Composer.ios.tsx b/src/view/shell/Composer.ios.tsx index 393b8f80e6..c32c9bddf3 100644 --- a/src/view/shell/Composer.ios.tsx +++ b/src/view/shell/Composer.ios.tsx @@ -4,6 +4,7 @@ import {Modal, View} from 'react-native' import {useDialogStateControlContext} from '#/state/dialogs' import {useComposerState} from '#/state/shell/composer' import {atoms as a, useTheme} from '#/alf' +import {Outlet as ToastPortalOutlet, ToastProvider} from '#/components/Toast' import {ComposePost, useComposerCancelRef} from '../com/composer/Composer' export function Composer({}: {winHeight: number}) { @@ -32,19 +33,22 @@ export function Composer({}: {winHeight: number}) { presentationStyle="pageSheet" animationType="slide" onRequestClose={() => ref.current?.onPressCancel()}> - - - + + + + + + ) }