-
Notifications
You must be signed in to change notification settings - Fork 15
Commit
This commit does not belong to any branch on this repository, and may belong to a fork outside of the repository.
- Loading branch information
1 parent
f540546
commit 482c970
Showing
5 changed files
with
174 additions
and
66 deletions.
There are no files selected for viewing
73 changes: 73 additions & 0 deletions
73
apps/mobile/src/components/Gallery/DeleteGalleryBottomSheet.tsx
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -0,0 +1,73 @@ | ||
| import { useCallback } from 'react'; | ||
| import { View } from 'react-native'; | ||
| import { graphql, useFragment } from 'react-relay'; | ||
| import useDeleteGallery from 'shared/hooks/useDeleteGallery'; | ||
|
|
||
| import { Button } from '~/components/Button'; | ||
| import { Typography } from '~/components/Typography'; | ||
| import { useBottomSheetModalActions } from '~/contexts/BottomSheetModalContext'; | ||
| import { DeleteGalleryBottomSheet$key } from '~/generated/DeleteGalleryBottomSheet.graphql'; | ||
| import { contexts } from '~/shared/analytics/constants'; | ||
|
|
||
| type Props = { | ||
| galleryRef: DeleteGalleryBottomSheet$key; | ||
| }; | ||
|
|
||
| export default function DeleteGalleryBottomSheet({ galleryRef }: Props) { | ||
| const gallery = useFragment( | ||
| graphql` | ||
| fragment DeleteGalleryBottomSheet on Gallery { | ||
| dbid | ||
| } | ||
| `, | ||
| galleryRef | ||
| ); | ||
| const deleteGallery = useDeleteGallery(); | ||
| const { hideBottomSheetModal } = useBottomSheetModalActions(); | ||
|
|
||
| const handleBack = useCallback(() => { | ||
| hideBottomSheetModal(); | ||
| }, [hideBottomSheetModal]); | ||
|
|
||
| const handleDelete = useCallback(() => { | ||
| deleteGallery(gallery.dbid); | ||
| hideBottomSheetModal(); | ||
| }, [deleteGallery, gallery, hideBottomSheetModal]); | ||
|
|
||
| return ( | ||
| <View className="flex flex-col space-y-6"> | ||
| <View className="flex flex-col space-y-4"> | ||
| <Typography | ||
| className="text-lg text-black-900 dark:text-offWhite" | ||
| font={{ family: 'ABCDiatype', weight: 'Bold' }} | ||
| > | ||
| Delete gallery | ||
| </Typography> | ||
| <Typography | ||
| className="text-lg text-black-900 dark:text-offWhite" | ||
| font={{ family: 'ABCDiatype', weight: 'Regular' }} | ||
| > | ||
| Are you sure you want to delete this gallery? | ||
| </Typography> | ||
| </View> | ||
|
|
||
| <View className="space-y-2"> | ||
| <Button | ||
| onPress={handleDelete} | ||
| text="DELETE" | ||
| eventElementId="Delete Gallery Button" | ||
| eventName="Delete Gallery" | ||
| eventContext={contexts.UserGallery} | ||
| /> | ||
| <Button | ||
| onPress={handleBack} | ||
| variant="secondary" | ||
| text="CANCEL" | ||
| eventElementId="Cancel Delete Gallery Button" | ||
| eventName="Cancel Delete Gallery" | ||
| eventContext={contexts.UserGallery} | ||
| /> | ||
| </View> | ||
| </View> | ||
| ); | ||
| } |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
92 changes: 92 additions & 0 deletions
92
apps/mobile/src/components/ProfileView/GalleryPreviewCardBottomSheet.tsx
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -0,0 +1,92 @@ | ||
| import { useNavigation } from '@react-navigation/native'; | ||
| import { useCallback } from 'react'; | ||
| import { View } from 'react-native'; | ||
| import { graphql, useFragment } from 'react-relay'; | ||
| import { contexts } from 'shared/analytics/constants'; | ||
|
|
||
| import { useBottomSheetModalActions } from '~/contexts/BottomSheetModalContext'; | ||
| import { useToastActions } from '~/contexts/ToastContext'; | ||
| import { GalleryPreviewCardBottomSheetFragment$key } from '~/generated/GalleryPreviewCardBottomSheetFragment.graphql'; | ||
| import { RootStackNavigatorProp } from '~/navigation/types'; | ||
|
|
||
| import { BottomSheetRow } from '../BottomSheetRow'; | ||
| import DeleteGalleryBottomSheet from '../Gallery/DeleteGalleryBottomSheet'; | ||
| import { useSafeAreaPadding } from '../SafeAreaViewWithPadding'; | ||
|
|
||
| type Props = { | ||
| galleryRef: GalleryPreviewCardBottomSheetFragment$key; | ||
| onClose: () => void; | ||
| }; | ||
|
|
||
| export function GalleryPreviewCardBottomSheet({ galleryRef, onClose }: Props) { | ||
| const gallery = useFragment( | ||
| graphql` | ||
| fragment GalleryPreviewCardBottomSheetFragment on Gallery { | ||
| dbid | ||
| ...DeleteGalleryBottomSheet | ||
| } | ||
| `, | ||
| galleryRef | ||
| ); | ||
|
|
||
| const galleryId = gallery.dbid; | ||
|
|
||
| const { bottom } = useSafeAreaPadding(); | ||
| const { pushToast } = useToastActions(); | ||
|
|
||
| const { showBottomSheetModal } = useBottomSheetModalActions(); | ||
| const navigation = useNavigation<RootStackNavigatorProp>(); | ||
|
|
||
| const handleInProgress = useCallback(() => { | ||
| pushToast({ | ||
| message: 'Feature in progress', | ||
| }); | ||
| }, [pushToast]); | ||
|
|
||
| const handleEditGallery = useCallback(() => { | ||
| navigation.navigate('GalleryEditor', { | ||
| galleryId, | ||
| stagedTokens: [], | ||
| }); | ||
| onClose(); | ||
| }, [galleryId, navigation, onClose]); | ||
|
|
||
| const handleDeleteGallery = useCallback(() => { | ||
| showBottomSheetModal({ | ||
| content: <DeleteGalleryBottomSheet galleryRef={gallery} />, | ||
| }); | ||
| }, [gallery, showBottomSheetModal]); | ||
|
|
||
| return ( | ||
| <View style={{ paddingBottom: bottom }} className=" flex flex-col space-y-6"> | ||
| <View className="flex flex-col space-y-2"> | ||
| <BottomSheetRow | ||
| text="Edit Gallery" | ||
| onPress={handleEditGallery} | ||
| eventContext={contexts.UserGallery} | ||
| /> | ||
| <BottomSheetRow | ||
| text="Feature on Profile" | ||
| onPress={handleInProgress} | ||
| eventContext={contexts.UserGallery} | ||
| /> | ||
| <BottomSheetRow | ||
| text="Hide Gallery" | ||
| onPress={handleInProgress} | ||
| eventContext={contexts.UserGallery} | ||
| /> | ||
| <BottomSheetRow | ||
| text="Share Gallery" | ||
| onPress={handleInProgress} | ||
| eventContext={contexts.UserGallery} | ||
| /> | ||
| <BottomSheetRow | ||
| text="Delete Gallery" | ||
| onPress={handleDeleteGallery} | ||
| isConfirmationRow | ||
| eventContext={contexts.UserGallery} | ||
| /> | ||
| </View> | ||
| </View> | ||
| ); | ||
| } |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters