interface: fix tab bar to display and link properly

This commit is contained in:
Logan Allen 2020-09-24 13:47:11 -05:00
parent 1576ebe0c4
commit 5cc4165b74
4 changed files with 25 additions and 11 deletions

View File

@ -137,9 +137,11 @@ export default class LinksApp extends Component {
render={ (props) => {
const resourcePath =
`${props.match.params.ship}/${props.match.params.name}`;
const metPath = `/ship/~${resourcePath}`;
const resource =
associations.graph[resourcePath] ?
associations.graph[resourcePath] : { metadata: {} };
associations.graph[metPath] ?
associations.graph[metPath] : { metadata: {} };
const contactDetails = contacts[resource['group-path']] || {};
const popout = props.match.url.includes('/popout/');
const graph = graphs[resourcePath] || null;
@ -160,6 +162,7 @@ export default class LinksApp extends Component {
api={api}
graph={graph}
graphResource={graphKeys.has(resourcePath)}
resourcePath={resourcePath}
popout={popout}
metadata={resource.metadata}
contacts={contactDetails}
@ -177,9 +180,10 @@ export default class LinksApp extends Component {
render={ (props) => {
const resourcePath =
`${props.match.params.ship}/${props.match.params.name}`;
const metPath = `/ship/~${resourcePath}`;
const resource =
associations.graph[resourcePath] ?
associations.graph[resourcePath] : { metadata: {} };
associations.graph[metPath] ?
associations.graph[metPath] : { metadata: {} };
const popout = props.match.url.includes('/popout/');
const contactDetails = contacts[resource['group-path']] || {};

View File

@ -48,8 +48,13 @@ export const LinkDetail = (props) => {
popout={props.popout}
api={props.api}
/>
<Link className="dib f9 fw4 pt2 gray2 lh-solid" to="/~link">
{`<- ${title}`}
<Link className="dib f9 fw4 pt2 gray2 lh-solid"
to={`/~link/${resourcePath}`}>
<h2
className="dib f9 fw4 lh-solid v-top black white-d"
style={{ width: 'max-content' }}>
{`<- ${title}`}
</h2>
</Link>
<TabBar
location={props.location}

View File

@ -48,7 +48,11 @@ export const LinkList = (props) => {
sidebarShown={props.sidebarShown}
popout={props.popout}
api={props.api} />
<h2 className='white-d dib f9 fw4 lh-solid v-top pt2'>{title}</h2>
<h2
className="dib f9 fw4 pt2 lh-solid v-top black white-d"
style={{ width: 'max-content' }}>
{title}
</h2>
<TabBar
location={props.location}
popout={props.popout}
@ -64,7 +68,7 @@ export const LinkList = (props) => {
ship={props.ship}
api={props.api} />
</div>
{ Array.from(props.graph.values()).map((node) => {
{ Array.from(props.graph.values()).reverse().map((node) => {
return (
<LinkItem
resource={resource}

View File

@ -143,7 +143,8 @@ export class SettingsScreen extends Component {
popout={this.props.popout}
api={this.props.api}
/>
<Link to="/~link" className="pt2">
<Link className="dib f9 fw4 pt2 gray2 lh-solid"
to={`/~link/${props.resourcePath}`}>
<h2
className="dib f9 fw4 lh-solid v-top"
style={{ width: 'max-content' }}>
@ -153,8 +154,8 @@ export class SettingsScreen extends Component {
<TabBar
location={props.location}
popout={props.popout}
popoutHref={`/~link/popout/${props.resource}/settings`}
settings={`/~link/${props.resource}/settings`}
popoutHref={`/~link/popout/${props.resourcePath}/settings`}
settings={`/~link/${props.resourcePath}/settings`}
/>
</div>
<div className="w-100 pl3 mt4 cf">