interface: useEffect for graph fetching

This commit is contained in:
Logan Allen 2020-09-21 09:58:49 -05:00
parent fb1d1816a0
commit f426da1753
3 changed files with 33 additions and 21 deletions

View File

@ -159,13 +159,6 @@ export class LinksApp extends Component {
const popout = props.match.url.includes('/popout/');
const graph = graphs[resourcePath] || null;
if (!graph) {
api.graph.getGraph(
`~${props.match.params.ship}`,
props.match.params.name
);
}
return (
<Skeleton
associations={associations}
@ -181,6 +174,7 @@ export class LinksApp extends Component {
{...props}
api={api}
graph={graph}
graphResource={graphKeys.has(resourcePath)}
popout={popout}
metadata={resource.metadata}
contacts={contactDetails}
@ -214,13 +208,6 @@ export class LinksApp extends Component {
const index = parseInt(indexArr[1], 10);
const node = !!graph ? graph.get(index) : null;
if (!graph) {
api.graph.getGraph(
`~${props.match.params.ship}`,
props.match.params.name
);
}
return (
<Skeleton
associations={associations}
@ -235,6 +222,7 @@ export class LinksApp extends Component {
<LinkDetail
{...props}
node={node}
graphResource={graphKeys.has(resourcePath)}
ship={props.match.params.ship}
name={props.match.params.name}
resource={resource}

View File

@ -1,4 +1,4 @@
import React, { Component } from 'react';
import React, { Component, useEffect } from 'react';
import { TabBar } from '~/views/components/chat-link-tabbar';
import { LinkPreview } from './lib/link-preview';
import { LinkSubmit } from './lib/link-submit';
@ -10,14 +10,25 @@ import { getContactDetails } from '~/logic/lib/util';
export const LinkDetail = (props) => {
if (!props.node) {
// TODO: something
if (!props.node && props.graphResource) {
useEffect(() => {
props.api.graph.getGraph(
`~${props.match.params.ship}`,
props.match.params.name
);
});
return (
<div>
Not found
</div>
<div>Loading...</div>
);
}
if (!props.node) {
return (
<div>Not found</div>
);
}
const { nickname } = getContactDetails(props.contacts[ship]);
const our = getContactDetails(props.contacts[window.ship]);
const resourcePath = `${props.ship}/${props.name}`;

View File

@ -1,4 +1,4 @@
import React, { Component } from 'react';
import React, { Component, useEffect } from 'react';
import { TabBar } from '~/views/components/chat-link-tabbar';
import { SidebarSwitcher } from '~/views/components/SidebarSwitch';
@ -12,6 +12,19 @@ export const LinkList = (props) => {
const resource = `${props.ship}/${props.name}`;
const title = props.metadata.title || resource;
if (!props.graph && props.graphResource) {
useEffect(() => {
props.api.graph.getGraph(
`~${props.match.params.ship}`,
props.match.params.name
);
});
return (
<div>Loading...</div>
);
}
if (!props.graph) {
return (
<div>Not found</div>