interface: fix replies view

This commit is contained in:
Logan Allen 2021-05-18 18:48:28 -05:00
parent d308b96909
commit 941ee247e5
8 changed files with 40 additions and 29 deletions

View File

@ -204,6 +204,9 @@ const addNodes = (json, state) => {
const _addNode = (graph, index, node) => {
// set child of graph
if (index.length === 1) {
if (graph.has(index[0])) {
return graph;
}
return graph.set(index[0], node);
}
@ -346,9 +349,13 @@ const addNodes = (json, state) => {
}).length === 0;
if (isFirstChild) {
node.children = mapifyChildren({});
state.threadGraphs[resource][threadKey] =
state.threadGraphs[resource][threadKey].set(indexArr, node);
state.threadGraphs[resource][threadKey].set(
indexArr,
produce(node, draft => {
draft.children = mapifyChildren({});
})
);
}
}
}
@ -359,6 +366,7 @@ const addNodes = (json, state) => {
}
});
}
return state;
};

View File

@ -28,7 +28,6 @@ function GroupFlatFeed(props) {
const graphRid =
graphPath ? resourceFromPath(graphPath) : resourceFromPath('/ship/~zod/null');
const flatGraph = useFlatGraph(graphRid.ship, graphRid.name);
const association = useAssocForGraph(graphPath);
const graphTimesentMap = useGraphTimesentMap(graphRid.ship, graphRid.name);
@ -80,7 +79,6 @@ function GroupFlatFeed(props) {
group={group}
association={association}
vip={vip}
flatGraph={flatGraph}
pendingSize={pendingSize}
/>
);

View File

@ -71,7 +71,6 @@ class PostFeed extends React.Component<PostFeedProps, any> {
<React.Fragment key={index.toString()}>
<Col
key={index.toString()}
// @ts-ignore indigo-react doesn't allow us to pass refs
ref={ref}
mb={3}
width="100%"
@ -79,7 +78,6 @@ class PostFeed extends React.Component<PostFeedProps, any> {
>
<PostItem
key={parentNode.post.index}
// @ts-ignore withHovering prop pass is broken?
parentPost={grandparentNode?.post}
node={parentNode}
parentNode={grandparentNode}
@ -96,7 +94,6 @@ class PostFeed extends React.Component<PostFeedProps, any> {
/>
</Col>
<PostItem
// @ts-ignore withHovering prop pass is broken?
node={node}
graphPath={graphPath}
association={association}
@ -153,9 +150,7 @@ class PostFeed extends React.Component<PostFeedProps, any> {
}
return (
// @ts-ignore indigo-react doesn't allow us to pass refs
<Box key={index.toString()} ref={ref}>
// @ts-ignore withHovering prop pass is broken?
<PostItem
node={node}
graphPath={graphPath}

View File

@ -92,7 +92,8 @@ class PostFlatFeed extends React.Component<PostFeedProps, PostFeedState> {
isRelativeTime={true}
vip={vip}
group={group}
isThread={isThread && !isLast}
isThread={isThread}
isLast={isLast}
/>
</Col>
);
@ -152,7 +153,8 @@ class PostFlatFeed extends React.Component<PostFeedProps, PostFeedState> {
isRelativeTime={true}
vip={vip}
group={group}
isThread={isThread && !isLast}
isThread={isThread}
isLast={isLast}
/>
</Box>
);

View File

@ -3,6 +3,8 @@ import { Association, FlatGraph, Group } from '@urbit/api';
import React, { ReactElement } from 'react';
import GlobalApi from '~/logic/api/global';
import { Loading } from '~/views/components/Loading';
import { useFlatGraph } from '~/logic/state/graph';
import { resourceFromPath } from '~/logic/lib/group';
import PostFlatFeed from './PostFlatFeed';
import PostInput from './PostInput';
@ -10,7 +12,6 @@ interface PostTimelineProps {
api: GlobalApi;
association: Association;
baseUrl: string;
flatGraph: FlatGraph;
graphPath: string;
group: Group;
pendingSize: number;
@ -24,11 +25,14 @@ const PostFlatTimeline = (props: PostTimelineProps): ReactElement => {
association,
graphPath,
group,
flatGraph,
pendingSize,
vip
} = props;
const graphRid =
graphPath ? resourceFromPath(graphPath) : resourceFromPath('/ship/~zod/null');
const flatGraph = useFlatGraph(graphRid.ship, graphRid.name);
const shouldRenderFeed = Boolean(flatGraph);
if (!shouldRenderFeed) {

View File

@ -29,6 +29,7 @@ export interface PostItemProps {
parentPost?: Post;
vip: string;
isThread?: boolean;
isLast?: boolean;
}
interface PostItemState {
@ -80,9 +81,11 @@ class PostItem extends React.Component<PostItemProps, PostItemState> {
});
// TODO: ensure that the logic here works properly
history.push(`${baseUrl}/feed/thread${indexString}`);
//history.push(`${baseUrl}/feed/replies${indexString}`);
if (!isThread) {
history.push(`${baseUrl}/feed/thread${indexString}`);
} else {
history.push(`${baseUrl}/feed/replies${indexString}`);
}
}
submitCallback() {
@ -105,7 +108,8 @@ class PostItem extends React.Component<PostItemProps, PostItemState> {
group,
hovering,
bind,
isThread
isThread,
isLast
} = this.props;
let indexString = '';
@ -124,7 +128,7 @@ class PostItem extends React.Component<PostItemProps, PostItemState> {
ref={innerRef}
pl={1}
pr={1}
mb={isThread && !inReplyMode ? 0 : 3}
mb={isThread && !isLast && !inReplyMode ? 0 : 3}
width="100%"
alignItems="center"
>
@ -192,7 +196,7 @@ class PostItem extends React.Component<PostItemProps, PostItemState> {
/>
</Col>
) : null }
{ isThread && !inReplyMode ? (
{ isThread && !isLast && !inReplyMode ? (
<Col width="100%" maxWidth="600px">
<Box
ml={3}

View File

@ -3,9 +3,12 @@ import { GraphNode } from '@urbit/api';
import bigInt from 'big-integer';
import React from 'react';
import { resourceFromPath } from '~/logic/lib/group';
import { useGraph } from '~/logic/state/graph';
import { Loading } from '~/views/components/Loading';
import PostFeed from './PostFeed';
import PostItem from './PostItem/PostItem';
import { stringToArr } from '~/views/components/ArrayVirtualScroller';
export default function PostReplies(props) {
const {
@ -19,9 +22,9 @@ export default function PostReplies(props) {
pendingSize
} = props;
const graphResource = resourceFromPath(graphPath);
const graphRid = resourceFromPath(graphPath);
let graph = useGraph(graphRid.ship, graphRid.name);
let graph = props.graph;
const shouldRenderFeed = Boolean(graph);
if (!shouldRenderFeed) {
@ -33,10 +36,8 @@ export default function PostReplies(props) {
}
const locationUrl =
props.locationUrl.replace(`${baseUrl}/feed`, '');
const nodeIndex = locationUrl.split('/').slice(1).map((ind) => {
return bigInt(ind);
});
props.locationUrl.replace(`${baseUrl}/feed/replies`, '');
const nodeIndex = stringToArr(locationUrl);
let node: GraphNode;
let parentNode;
@ -62,7 +63,7 @@ export default function PostReplies(props) {
if (!first) {
return (
<Col
key={locationUrl}
key={`/replies/${locationUrl}`}
width="100%"
height="100%"
alignItems="center" overflowY="scroll"
@ -70,7 +71,6 @@ export default function PostReplies(props) {
<Box mt={3} width="100%" alignItems="center">
<PostItem
key={node.post.index}
// @ts-ignore withHovering prop pass is broken?
node={node}
graphPath={graphPath}
association={association}
@ -104,7 +104,7 @@ export default function PostReplies(props) {
return (
<Box height="calc(100% - 48px)" width="100%" alignItems="center" pl={1} pt={3}>
<PostFeed
key={locationUrl}
key={`/replies/${locationUrl}`}
graphPath={graphPath}
graph={graph}
grandparentNode={parentNode}

View File

@ -109,7 +109,7 @@ export default function PostThread(props) {
return (
<Box height="calc(100% - 48px)" width="100%" alignItems="center" pl={1}>
<PostFlatFeed
key={graphPath}
key={`/thread/${locationUrl}`}
graphPath={graphPath}
flatGraph={threadGraph}
pendingSize={pendingSize}