interface: group feed header matches mocks

This commit is contained in:
Logan Allen 2021-03-23 15:59:19 -05:00
parent 7223156910
commit 307843a112
2 changed files with 36 additions and 5 deletions

View File

@ -41,7 +41,11 @@ export function GroupFeed(props) {
position="relative"
alignItems="center"
overflow="hidden">
<GroupFeedHeader baseUrl={baseUrl} history={history} />
<GroupFeedHeader
baseUrl={baseUrl}
history={history}
graphs={graphs}
graphResource={graphResource} />
<Switch>
<Route
exact

View File

@ -1,16 +1,43 @@
import React from 'react';
import { Box, Row, Text } from '@tlon/indigo-react';
import { Link } from 'react-router-dom';
import bigInt from 'big-integer';
export function GroupFeedHeader(props) {
const { baseUrl, history } = props;
const { baseUrl, history, graphs, graphResource } = props;
const historyLocation = history.location.pathname;
const graphId = `${graphResource.ship.slice(1)}/${graphResource.name}`;
const shouldRenderFeed = graphId in graphs;
const isHome =
historyLocation === baseUrl ||
historyLocation === `${baseUrl}/feed`;
const locationUrl =
history.location.pathname.replace(`${baseUrl}/feed`, '');
let nodeIndex = locationUrl.split('/').slice(1).map((ind) => {
return bigInt(ind);
});
let node;
let graph = graphs[graphId];
nodeIndex.forEach((i) => {
if (!graph) {
return null;
}
node = graph.get(i);
if (!node) {
return null;
}
graph = node.children;
});
let authorText = '';
if (node) {
authorText = node.post.author;
}
return (
<Row
flexShrink="0"
@ -36,12 +63,12 @@ export function GroupFeedHeader(props) {
<Text bold fontSize="2" pr="2">Group Feed</Text>
<Text fontSize="0" p="1" backgroundColor="washedGray">Everyone can post</Text>
</>
) : (
) : ( !authorText ? null : (
<>
<Text bold fontSize="2" pr="2">Post by </Text>
<Text bold fontSize="2" mono>{'TODO'}</Text>
<Text bold fontSize="2" mono>{`~${authorText}`}</Text>
</>
)}
))}
</Row>
);
}