diff --git a/src/components/context-menu.js b/src/components/context-menu.js new file mode 100644 index 0000000..6f9a4cb --- /dev/null +++ b/src/components/context-menu.js @@ -0,0 +1,50 @@ +import React from "react"; +import { Dimensions, View, Image } from "react-native"; +import { FontAwesome } from '@expo/vector-icons'; +import { + Menu, + MenuOptions, + MenuOption, + MenuTrigger, + renderers +} from "react-native-popup-menu"; + +const { SlideInMenu } = renderers; + +const SCREEN_WIDTH = Dimensions.get("window").width; + +const ContextMenuJsx = (props) => { + const optionsStyles = { + optionWrapper: { // The wrapper around a single option + paddingLeft: SCREEN_WIDTH / 15, + paddingTop: SCREEN_WIDTH / 30, + paddingBottom: SCREEN_WIDTH / 30 + }, + optionsWrapper: { // The wrapper around all options + marginTop: SCREEN_WIDTH / 20, + marginBottom: SCREEN_WIDTH / 20, + }, + optionsContainer: { // The Animated.View + borderTopLeftRadius: 10, + borderTopRightRadius: 10 + } + }; + + return ( + + + + + + + { props.children } + + + + ); +} + +export { ContextMenuJsx as default }; diff --git a/src/components/pages/view-post.js b/src/components/pages/view-post.js index 2a47812..1ac35d7 100644 --- a/src/components/pages/view-post.js +++ b/src/components/pages/view-post.js @@ -18,6 +18,9 @@ const ViewPostJsx = ({navigation}) => { navigation = { navigation }> navigation.goBack() + } data = { state.post } /> ); diff --git a/src/components/posts/post.js b/src/components/posts/post.js index 47df233..7af3e23 100644 --- a/src/components/posts/post.js +++ b/src/components/posts/post.js @@ -15,7 +15,8 @@ import * as requests from "src/requests"; import PostActionBarJsx from "src/components/posts/post-action-bar"; -import ModerateMenuJsx from "src/components/moderate-menu.js"; +import { MenuOption } from "react-native-popup-menu"; +import ContextMenuJsx from "src/components/context-menu.js"; const SCREEN_WIDTH = Dimensions.get("window").width; const TEST_IMAGE = "https://cache.desktopnexus.com/thumbseg/2255/2255124-bigthumbnail.jpg"; @@ -106,9 +107,27 @@ export const RawPostJsx = (props) => { { props.data.account.acct } - + + { props.own + ? <> + + + : <> + + + + + + } + { props.data.media_attachments.length > 1 ? @@ -176,20 +195,23 @@ export const PostByDataJsx = (props) => { let [state, setState] = useState({ loaded: false, + deleted: false, data: props.data, dimensions: [] }); useEffect(() => { - let instance, accessToken; + let instance, accessToken, own; AsyncStorage .multiGet([ "@user_instance", + "@user_profile", "@user_token", ]) - .then(([instancePair, tokenPair]) => { + .then(([instancePair, profilePair, tokenPair]) => { instance = instancePair[1]; accessToken = JSON.parse(tokenPair[1]).access_token; + own = state.data.account.id == JSON.parse(profilePair[1]).id; }) .then(() => Promise.all( @@ -201,6 +223,7 @@ export const PostByDataJsx = (props) => { dimensions: dimensions, instance, accessToken, + own, loaded: true }); }); @@ -273,15 +296,34 @@ export const PostByDataJsx = (props) => { }); }; + const _handleDelete = async () => { + await requests.deleteStatus( + state.instance, + state.data.id, + state.accessToken + ); + + if (props.afterDelete) { + // Useful for when we need to navigate away from ViewPost + props.afterDelete(); + } else { + setState({...state, + deleted: true, + }); + } + } + return ( - { state.loaded ? + { state.loaded && !state.deleted ? : } @@ -314,10 +356,6 @@ const styles = { marginRight: SCREEN_WIDTH / 28, borderRadius: 50 }, - ellipsis: { - width: SCREEN_WIDTH / 15, - height: SCREEN_WIDTH / 15 - }, photo: { flex: 1, },