diff --git a/src/state/models/shell.ts b/src/state/models/shell.ts
index 6755393cdb..a2e83b5e3a 100644
--- a/src/state/models/shell.ts
+++ b/src/state/models/shell.ts
@@ -8,15 +8,23 @@ export class LinkActionsModel {
}
}
+export class SharePostModel {
+ name = 'share-post'
+
+ constructor(public href: string) {
+ makeAutoObservable(this)
+ }
+}
+
export class ShellModel {
isModalActive = false
- activeModal: LinkActionsModel | undefined
+ activeModal: LinkActionsModel | SharePostModel | undefined
constructor() {
makeAutoObservable(this)
}
- openModal(modal: LinkActionsModel) {
+ openModal(modal: LinkActionsModel | SharePostModel) {
this.isModalActive = true
this.activeModal = modal
}
diff --git a/src/view/com/feed/Feed.tsx b/src/view/com/feed/Feed.tsx
index 7c7fea58a6..4a2ecb6128 100644
--- a/src/view/com/feed/Feed.tsx
+++ b/src/view/com/feed/Feed.tsx
@@ -1,15 +1,16 @@
-import React, {useRef} from 'react'
+import React from 'react'
import {observer} from 'mobx-react-lite'
import {Text, View, FlatList} from 'react-native'
import {FeedViewModel, FeedViewItemModel} from '../../../state/models/feed-view'
import {FeedItem} from './FeedItem'
-import {ShareModal} from '../modals/SharePost'
+import {SharePostModel} from '../../../state/models/shell'
+import {useStores} from '../../../state'
export const Feed = observer(function Feed({feed}: {feed: FeedViewModel}) {
- const shareSheetRef = useRef<{open: (_uri: string) => void}>()
+ const store = useStores()
const onPressShare = (uri: string) => {
- shareSheetRef.current?.open(uri)
+ store.shell.openModal(new SharePostModel(uri))
}
// TODO optimize renderItem or FeedItem, we're getting this notice from RN: -prf
// VirtualizedList: You have a large list that is slow to update - make sure your
@@ -41,7 +42,6 @@ export const Feed = observer(function Feed({feed}: {feed: FeedViewModel}) {
/>
)}
{feed.isEmpty && This feed is empty!}
-
)
})
diff --git a/src/view/com/modals/Modal.tsx b/src/view/com/modals/Modal.tsx
index 172dd0ad44..dc5b719bc1 100644
--- a/src/view/com/modals/Modal.tsx
+++ b/src/view/com/modals/Modal.tsx
@@ -6,6 +6,7 @@ import {useStores} from '../../../state'
import {createCustomBackdrop} from '../util/BottomSheetCustomBackdrop'
import * as LinkActionsModal from './LinkActions'
+import * as SharePostModal from './SharePost.native'
export const Modal = observer(function Modal() {
const store = useStores()
@@ -28,6 +29,9 @@ export const Modal = observer(function Modal() {
if (store.shell.activeModal?.name === 'link-actions') {
snapPoints = LinkActionsModal.snapPoints
element =
+ } else if (store.shell.activeModal?.name === 'share-post') {
+ snapPoints = SharePostModal.snapPoints
+ element =
} else {
return
}
diff --git a/src/view/com/modals/SharePost.native.tsx b/src/view/com/modals/SharePost.native.tsx
index 6fc1d1adf7..01692fb74f 100644
--- a/src/view/com/modals/SharePost.native.tsx
+++ b/src/view/com/modals/SharePost.native.tsx
@@ -1,63 +1,36 @@
-import React, {forwardRef, useState, useImperativeHandle, useRef} from 'react'
+import React from 'react'
import {Button, StyleSheet, Text, TouchableOpacity, View} from 'react-native'
-import BottomSheet from '@gorhom/bottom-sheet'
import Toast from '../util/Toast'
import Clipboard from '@react-native-clipboard/clipboard'
import {s} from '../../lib/styles'
-import {createCustomBackdrop} from '../util/BottomSheetCustomBackdrop'
+import {useStores} from '../../../state'
-export const ShareModal = forwardRef(function ShareModal({}: {}, ref) {
- const [isOpen, setIsOpen] = useState(false)
- const [uri, setUri] = useState('')
- const bottomSheetRef = useRef(null)
-
- useImperativeHandle(ref, () => ({
- open(uri: string) {
- console.log('sharing', uri)
- setUri(uri)
- setIsOpen(true)
- bottomSheetRef.current?.expand()
- },
- }))
+export const snapPoints = ['30%']
+export function Component({href}: {href: string}) {
+ const store = useStores()
const onPressCopy = () => {
- Clipboard.setString(uri)
- console.log('showing')
+ Clipboard.setString(href)
Toast.show('Link copied', {
position: Toast.positions.TOP,
})
+ store.shell.closeModal()
}
- const onShareBottomSheetChange = (snapPoint: number) => {
- if (snapPoint === -1) {
- console.log('unsharing')
- setIsOpen(false)
- }
- }
- const onClose = () => {
- bottomSheetRef.current?.close()
- }
+ const onClose = () => store.shell.closeModal()
return (
-
-
- Share this post
- {uri}
-
-
-
- Close
-
-
+
+ Share this post
+ {href}
+
+
+
+ Close
+
-
+
)
-})
+}
const styles = StyleSheet.create({
closeBtn: {
diff --git a/src/view/com/post-thread/PostThread.tsx b/src/view/com/post-thread/PostThread.tsx
index c12d99edbc..7a70aea75d 100644
--- a/src/view/com/post-thread/PostThread.tsx
+++ b/src/view/com/post-thread/PostThread.tsx
@@ -6,9 +6,8 @@ import {
PostThreadViewPostModel,
} from '../../../state/models/post-thread-view'
import {useStores} from '../../../state'
+import {SharePostModel} from '../../../state/models/shell'
import {PostThreadItem} from './PostThreadItem'
-import {ShareModal} from '../modals/SharePost'
-import {s} from '../../lib/styles'
const UPDATE_DELAY = 2e3 // wait 2s before refetching the thread for updates
@@ -16,7 +15,6 @@ export const PostThread = observer(function PostThread({uri}: {uri: string}) {
const store = useStores()
const [view, setView] = useState()
const [lastUpdate, setLastUpdate] = useState(Date.now())
- const shareSheetRef = useRef<{open: (_uri: string) => void}>()
useEffect(() => {
if (view?.params.uri === uri) {
@@ -38,7 +36,7 @@ export const PostThread = observer(function PostThread({uri}: {uri: string}) {
// })
const onPressShare = (uri: string) => {
- shareSheetRef.current?.open(uri)
+ store.shell.openModal(new SharePostModel(uri))
}
const onRefresh = () => {
view?.refresh().catch(err => console.error('Failed to refresh', err))
@@ -83,7 +81,6 @@ export const PostThread = observer(function PostThread({uri}: {uri: string}) {
refreshing={view.isRefreshing}
onRefresh={onRefresh}
/>
-
)
})