interface: group feed now allows deletion of posts

This commit is contained in:
Logan Allen 2021-05-03 15:43:32 -05:00
parent 4966615082
commit 26df0b1952
2 changed files with 51 additions and 32 deletions

View File

@ -5,6 +5,7 @@ import { useCopy } from '~/logic/lib/useCopy';
import { getPermalinkForGraph } from '~/logic/lib/permalinks';
import { Dropdown } from '~/views/components/Dropdown';
import useContactState from '~/logic/state/contact';
import { resourceFromPath } from '~/logic/lib/group';
export function PostHeader(props) {
@ -13,7 +14,8 @@ export function PostHeader(props) {
api,
association,
isReply,
showTimestamp
showTimestamp,
graphPath
} = props;
const contacts = useContactState(state => state.contacts);
const mb = isReply ? "2" : "3";
@ -24,6 +26,11 @@ export function PostHeader(props) {
post.index
) : '';
const { copyDisplay, doCopy } = useCopy(permalink, 'Copy Link');
const resource = resourceFromPath(graphPath);
const doDelete = () => {
api.graph.removePosts(resource.ship, resource.name, [post.index]);
};
return (
<Row
@ -49,7 +56,7 @@ export function PostHeader(props) {
lineHeight='1'
/>
<Dropdown
dropWidth="200px"
dropWidth="100px"
alignX="right"
alignY="top"
options={
@ -57,12 +64,14 @@ export function PostHeader(props) {
backgroundColor="white"
border={1}
borderRadius={1}
borderColor="lightGray">
<Row alignItems="center" p={1}>
<Action bg="white" m={1} color="black" onClick={doCopy}>
{copyDisplay}
</Action>
</Row>
borderColor="lightGray"
p={1}>
<Action bg="white" m={1} color="black" onClick={doCopy}>
{copyDisplay}
</Action>
<Action bg="white" m={1} color="black" onClick={doDelete}>
Delete
</Action>
</Col>
}>
<Icon icon="Ellipsis" color="gray" />

View File

@ -88,6 +88,7 @@ class PostItem extends React.Component {
const { inReplyMode } = this.state;
const canComment = this.canWrite();
const postExists = !!node.post && typeof node.post !== 'string';
return (
<Col
@ -108,30 +109,39 @@ class PostItem extends React.Component {
onClick={this.navigateToReplies}
cursor={isParent ? "default": "pointer"}
{...bind}>
<PostHeader
post={node.post}
api={api}
association={association}
showTimestamp={isRelativeTime}
isReply={isReply} />
{ (isReply || (parentPost && index.length > 1 && isParent)) ? (
<Row width="100%" alignItems="center" mb="2" pl="2" pr="2">
<Text color="gray" pr="1">Replying to</Text>
<Mention ship={parentPost?.author} />
</Row>
) : null }
<PostContent
post={node.post}
isParent={isParent}
isReply={isReply}
api={api} />
<PostFooter
timeSent={node.post['time-sent']}
replyCount={node.children.size}
showTimestamp={!isRelativeTime}
isParent={isParent}
canComment={canComment}
toggleReplyMode={this.toggleReplyMode} />
{ (postExists) ? (
<>
<PostHeader
post={node.post}
api={api}
association={association}
showTimestamp={isRelativeTime}
graphPath={graphPath}
isReply={isReply} />
{ (isReply || (parentPost && index.length > 1 && isParent)) ? (
<Row width="100%" alignItems="center" mb="2" pl="2" pr="2">
<Text color="gray" pr="1">Replying to</Text>
<Mention ship={parentPost?.author} />
</Row>
) : null }
<PostContent
post={node.post}
isParent={isParent}
isReply={isReply}
api={api} />
<PostFooter
timeSent={node.post['time-sent']}
replyCount={node.children.size}
showTimestamp={!isRelativeTime}
isParent={isParent}
canComment={canComment}
toggleReplyMode={this.toggleReplyMode} />
</>
) : (
<Box px="2" pb="2">
<Text gray>This post has been deleted</Text>
</Box>
) }
</Col>
{ inReplyMode ? (
<Col width="100%" maxWidth="600px">