interface: redirect properly upon create and dismiss of group feed

This commit is contained in:
Logan Allen 2021-04-01 17:31:19 -05:00
parent d494ef1c15
commit 96a57a9c4b
4 changed files with 29 additions and 6 deletions

View File

@ -2,6 +2,7 @@ import React, { useState } from 'react';
import { Box, Row, Button, Col, Text, BaseImage, Icon } from '@tlon/indigo-react';
import { Link } from 'react-router-dom';
import { resourceFromPath } from '~/logic/lib/group';
import { useHistory } from 'react-router-dom';
export const AddFeedBanner = (props) => {
@ -9,9 +10,13 @@ export const AddFeedBanner = (props) => {
api,
group,
groupPath,
baseUrl
} = props;
const [dismissing, setDismissing] = useState(false);
const history = useHistory();
const disableFeed = () => {
if (!groupPath) {
console.error('no group path, cannot enable feed');
@ -24,6 +29,7 @@ export const AddFeedBanner = (props) => {
}
api.graph.disableGroupFeed(resource);
history.push(baseUrl);
};
return (
@ -37,7 +43,7 @@ export const AddFeedBanner = (props) => {
pl={2}
pr={2}
>
<Row gapX="2">
<Row gapX="2" flexShrink={1}>
{ dismissing ? (
<>
<Icon icon="Info" />
@ -46,16 +52,22 @@ export const AddFeedBanner = (props) => {
) : (
<>
<Text fontWeight="medium" verticalAlign="middle">
<Text fontWeight="medium" verticalAlign="middle" flexShrink={0}>
Enable Group Feed?
</Text>
<Text gray>
<Text
gray
textOverflow="ellipsis"
overflow="hidden"
whiteSpace="nowrap"
minWidth="0"
flexShrink={1}>
A central place to broadcast short posts with your group
</Text>
</>
)}
</Row>
<Row gapX="2">
<Row gapX="2" flexShrink={0}>
{ dismissing ? (
<Button primary onClick={disableFeed}>
OK

View File

@ -55,7 +55,7 @@ export function EnableGroupFeed(props: {
await api.groups.addTag(resource, tag, [`~${window.ship}`]);
}
actions.setStatus({ success: null });
dismiss();
history.replace(`${baseUrl}/feed`);
},
[groupPath, baseUrl]
);

View File

@ -7,6 +7,7 @@ import { resourceFromPath } from '~/logic/lib/group';
import useGraphState from '~/logic/state/graph';
import { GroupFeedHeader } from './GroupFeedHeader';
import { useHistory } from 'react-router-dom';
import { Loading } from '~/views/components/Loading';
import PostTimeline from './Post/PostTimeline';
import PostReplies from './Post/PostReplies';
@ -29,7 +30,8 @@ function GroupFeed(props) {
const associations = useMetadataState(state => state.associations);
const graphs = useGraphState(state => state.graphs);
const graphResource = resourceFromPath(graphPath);
const graphResource =
graphPath ? resourceFromPath(graphPath) : resourceFromPath('/ship/~zod/null');
const graphTimesentMap = useGraphState(state => state.graphTimesentMap);
const pendingSize = Object.keys(
@ -48,9 +50,16 @@ function GroupFeed(props) {
useEffect(() => {
// TODO: VirtualScroller should support lower starting values than 100
if (graphResource.ship === '~zod' && graphResource.name === 'null') {
return;
}
api.graph.getNewest(graphResource.ship, graphResource.name, 100);
}, [graphPath]);
if (!graphPath) {
return <Loading />;
}
return (
<Col
width="100%"

View File

@ -5,6 +5,7 @@ import { EnableGroupFeed } from './EnableGroupFeed';
import { EmptyGroupHome } from './EmptyGroupHome';
import { GroupFeed } from './GroupFeed';
import { AddFeedBanner } from './AddFeedBanner';
import { Route } from 'react-router-dom';
import useGroupState from '~/logic/state/group';
@ -55,6 +56,7 @@ function GroupHome(props) {
<AddFeedBanner
api={api}
groupPath={groupPath}
baseUrl={baseUrl}
group={groups[groupPath]}
/>
) : null }