From 8af2ddaaa8cb1ed25f3acde38853cebd5346f489 Mon Sep 17 00:00:00 2001 From: James McLaughlin Date: Sun, 19 Jan 2025 23:29:57 +0000 Subject: [PATCH] ebi webapp updates --- .../src/components/datatable/DataTable.tsx | 2 +- .../matq/MaterialisedQueryTable.tsx | 11 +++-- .../{EdgesInList.tsx => EdgesList.tsx} | 35 ++++++++++++--- .../node_edge_list/EdgesOutList.tsx | 18 -------- .../node_graph_view/GraphViewCtx.tsx | 43 +++++++++++++++---- .../src/frontends/ebi/pages/EbiNodePage.tsx | 6 ++- .../exposomekg/pages/EkgNodePage.tsx | 5 ++- webapp/up_saturos.fish | 4 +- 8 files changed, 81 insertions(+), 43 deletions(-) rename webapp/grebi_ui/src/components/node_edge_list/{EdgesInList.tsx => EdgesList.tsx} (81%) delete mode 100644 webapp/grebi_ui/src/components/node_edge_list/EdgesOutList.tsx diff --git a/webapp/grebi_ui/src/components/datatable/DataTable.tsx b/webapp/grebi_ui/src/components/datatable/DataTable.tsx index cdb08d3..8c22768 100644 --- a/webapp/grebi_ui/src/components/datatable/DataTable.tsx +++ b/webapp/grebi_ui/src/components/datatable/DataTable.tsx @@ -188,7 +188,7 @@ export default function DataTable({ className="text-md align-top py-2 px-4" key={randomString()} > -
+
{column.selector(row, column.id) ? column.selector(row, column.id) : "(no data)"} diff --git a/webapp/grebi_ui/src/components/matq/MaterialisedQueryTable.tsx b/webapp/grebi_ui/src/components/matq/MaterialisedQueryTable.tsx index 02dc890..ef53aad 100644 --- a/webapp/grebi_ui/src/components/matq/MaterialisedQueryTable.tsx +++ b/webapp/grebi_ui/src/components/matq/MaterialisedQueryTable.tsx @@ -1,10 +1,10 @@ -import { useState, useEffect } from "react"; +import { useState, useEffect, Fragment } from "react"; import GraphMetadata from "../../model/GraphMetadata" import MaterialisedQuery from "../../model/MaterialisedQuery"; import LocalDataTable from "../datatable/LocalDataTable" import { get } from "../../app/api"; import { Box, Button, CircularProgress, Link, Stack } from "@mui/material"; -import { Download } from "@mui/icons-material"; +import { Download, Info } from "@mui/icons-material"; import { useNavigate } from "react-router-dom"; @@ -19,7 +19,11 @@ const cols= [ id:"id", name:"Query ID", selector:(row:any,key:string)=> { - return {row[key]} + return + {row[key]} + + + }, sortable:true }, @@ -80,7 +84,6 @@ export default function MaterialisedQueryTable({ return row[key]} columns={cols} onSelectRow={(row) => { diff --git a/webapp/grebi_ui/src/components/node_edge_list/EdgesInList.tsx b/webapp/grebi_ui/src/components/node_edge_list/EdgesList.tsx similarity index 81% rename from webapp/grebi_ui/src/components/node_edge_list/EdgesInList.tsx rename to webapp/grebi_ui/src/components/node_edge_list/EdgesList.tsx index 4920d16..0377713 100644 --- a/webapp/grebi_ui/src/components/node_edge_list/EdgesInList.tsx +++ b/webapp/grebi_ui/src/components/node_edge_list/EdgesList.tsx @@ -10,6 +10,7 @@ import DatasourceSelector from "../DatasourceSelector"; import { DatasourceTags } from "../DatasourceTag"; import DataTable from "../datatable/DataTable"; import LoadingOverlay from "../LoadingOverlay"; +import { dir } from "console"; export interface EdgesState { total:number, @@ -19,13 +20,14 @@ export interface EdgesState { propertyColumns:string[] }; -export default function EdgesInList(params:{ +export default function EdgesList(params:{ subgraph:string, node:GraphNode, + direction:'incoming'|'outgoing', onEdgesLoaded?:((edges:EdgesState) => void)|undefined, extraSearchParams?: string[][]|undefined }) { - let { subgraph, node, onEdgesLoaded, extraSearchParams } = params + let { direction, subgraph, node, onEdgesLoaded, extraSearchParams } = params let [edgesState, setEdgesState] = useState(null) @@ -42,7 +44,8 @@ export default function EdgesInList(params:{ async function getEdges() { console.log('refreshing ', node.getNodeId(), JSON.stringify(dsEnabled), JSON.stringify(edgesState?.datasources)) setLoading(true) - let res = (await getPaginated(`api/v1/subgraphs/${subgraph}/nodes/${node.getEncodedNodeId()}/incoming_edges?${ + let endpoint = direction === 'incoming' ? 'incoming_edges' : 'outgoing_edges' + let res = (await getPaginated(`api/v1/subgraphs/${subgraph}/nodes/${node.getEncodedNodeId()}/${endpoint}?${ new URLSearchParams([ ['page', page], ['size', rowsPerPage], @@ -72,7 +75,7 @@ export default function EdgesInList(params:{ } getEdges() - }, [ node.getNodeId(), JSON.stringify(dsEnabled), page, rowsPerPage, filter, sortColumn, sortDir ]); + }, [ direction, node.getNodeId(), JSON.stringify(dsEnabled), page, rowsPerPage, filter, sortColumn, sortDir ]); if(edgesState == null) { return @@ -92,14 +95,25 @@ export default function EdgesInList(params:{ }, sortable: true, }, - { + ... + (direction === 'incoming' ? [ + { id: 'grebi:from', name: 'From Node', selector: (row:GraphEdge) => { return }, sortable: true, - }, + } , + { + id: 'grebi:type', + name: 'Edge Type', + selector: (row:GraphEdge) => { + return row.getType() + }, + sortable: true, + } + ] : [ { id: 'grebi:type', name: 'Edge Type', @@ -108,6 +122,15 @@ export default function EdgesInList(params:{ }, sortable: true, }, + { + id: 'grebi:to', + name: 'To Node', + selector: (row:GraphEdge) => { + return + }, + sortable: true, + } + ]), ...(edgesState?.propertyColumns || []).map((prop:string) => { return { name: prop, diff --git a/webapp/grebi_ui/src/components/node_edge_list/EdgesOutList.tsx b/webapp/grebi_ui/src/components/node_edge_list/EdgesOutList.tsx deleted file mode 100644 index 049190d..0000000 --- a/webapp/grebi_ui/src/components/node_edge_list/EdgesOutList.tsx +++ /dev/null @@ -1,18 +0,0 @@ - -import { Grid } from "@mui/material"; -import React, { Fragment } from "react"; -import GraphNode from "../../model/GraphNode"; - -export default function EdgesOutList(params:{ - subgraph:string, - node:GraphNode, - datasources:string[], - dsEnabled:string[] -}) { - let { subgraph, node, datasources, dsEnabled } = params - - - - return
- -} diff --git a/webapp/grebi_ui/src/components/node_graph_view/GraphViewCtx.tsx b/webapp/grebi_ui/src/components/node_graph_view/GraphViewCtx.tsx index 7999123..da4be73 100644 --- a/webapp/grebi_ui/src/components/node_graph_view/GraphViewCtx.tsx +++ b/webapp/grebi_ui/src/components/node_graph_view/GraphViewCtx.tsx @@ -358,7 +358,6 @@ color:'gray', // this.clearHighlightedDatasource() // } this.dsExclude = newExclude - this.loadSingulars() this.startLoading(false) renderDsSelector() await this.incrementalUpdate() @@ -405,11 +404,6 @@ color:'gray', }) } - loadSingulars() { - - - } - async incrementalUpdate() { let {elements,style,layout} = this.renderToCytoscapeJson() @@ -440,11 +434,44 @@ color:'gray', return Promise.all(toLoadShallow.map(node => this.loadShallow(node))) } + async loadIncoming(node:GraphNodeRef) { + + let res = await get(`api/v1/subgraphs/${this.subgraph}/nodes/${node.getEncodedNodeId()}/incoming_edge_counts`) + + return this.resolveSingulars(res) + } + + async loadOutgoing(node:GraphNodeRef) { + + let res = await get(`api/v1/subgraphs/${this.subgraph}/nodes/${node.getEncodedNodeId()}/outgoing_edge_counts`) + + + return this.resolveSingulars(res) + } + + async resolveSingulars(res:any) { + + // {p: datasource: count }} + + let singulars = new Set() + let singularToDs = new Map() + for(let edgeType of Object.keys(res)) { + let dsToCount = res[edgeType] + let dss = Object.keys(dsToCount) + if(dss.length === 1) { + singulars.add(edgeType) + singularToDs.set(edgeType, dss[0]) + } + } + + } + + async loadShallow(node:GraphNodeRef) { let [incomingEdgeCounts,outgoingEdgeCounts] = (await Promise.all([ - get(`api/v1/subgraphs/${this.subgraph}/nodes/${node.getEncodedNodeId()}/incoming_edge_counts`), - get(`api/v1/subgraphs/${this.subgraph}/nodes/${node.getEncodedNodeId()}/outgoing_edge_counts`) + this.loadIncoming(node), + this.loadOutgoing(node) ])) this.incoming_nodeIdToEdgeCountByTypeAndDs.set(node.getNodeId(), incomingEdgeCounts); diff --git a/webapp/grebi_ui/src/frontends/ebi/pages/EbiNodePage.tsx b/webapp/grebi_ui/src/frontends/ebi/pages/EbiNodePage.tsx index 91b904c..bee2b86 100644 --- a/webapp/grebi_ui/src/frontends/ebi/pages/EbiNodePage.tsx +++ b/webapp/grebi_ui/src/frontends/ebi/pages/EbiNodePage.tsx @@ -13,13 +13,14 @@ import { FormatListBulleted, CallReceived, CallMade, Share } from "@mui/icons-ma import { Typography, Grid, Tabs, Tab, Box } from "@mui/material"; import { copyToClipboard } from "../../../app/util"; import LoadingOverlay from "../../../components/LoadingOverlay"; -import EdgesInList from "../../../components/node_edge_list/EdgesInList"; +import EdgesInList from "../../../components/node_edge_list/EdgesList"; import GraphView from "../../../components/node_graph_view/GraphView"; import PropTable from "../../../components/node_prop_table/PropTable"; import SearchBox from "../../../components/SearchBox"; import GraphNode from "../../../model/GraphNode"; import { get, getPaginated } from "../../../app/api"; import encodeNodeId from "../../../encodeNodeId"; +import EdgesList from "../../../components/node_edge_list/EdgesList"; export default function EbiNodePage() { @@ -91,9 +92,10 @@ export default function EbiNodePage() { - + + diff --git a/webapp/grebi_ui/src/frontends/exposomekg/pages/EkgNodePage.tsx b/webapp/grebi_ui/src/frontends/exposomekg/pages/EkgNodePage.tsx index 51433e4..fe02f0f 100644 --- a/webapp/grebi_ui/src/frontends/exposomekg/pages/EkgNodePage.tsx +++ b/webapp/grebi_ui/src/frontends/exposomekg/pages/EkgNodePage.tsx @@ -13,7 +13,7 @@ import { FormatListBulleted, CallReceived, CallMade, Share, Masks, Summarize, Un import { Typography, Grid, Tabs, Tab, Box } from "@mui/material"; import { copyToClipboard } from "../../../app/util"; import LoadingOverlay from "../../../components/LoadingOverlay"; -import EdgesInList from "../../../components/node_edge_list/EdgesInList"; +import EdgesList from "../../../components/node_edge_list/EdgesList"; import GraphView from "../../../components/node_graph_view/GraphView"; import PropTable from "../../../components/node_prop_table/PropTable"; import SearchBox from "../../../components/SearchBox"; @@ -83,9 +83,10 @@ export default function EkgNodePage() { - + + diff --git a/webapp/up_saturos.fish b/webapp/up_saturos.fish index ef59433..bcea5c2 100755 --- a/webapp/up_saturos.fish +++ b/webapp/up_saturos.fish @@ -1,6 +1,6 @@ export GREBI_NEO_DATA_PATH=/data/grebi_from_codon/(ls /data/grebi_from_codon/ | grep neo | grep -v tgz)/data export GREBI_SOLR_PATH=/data/grebi_from_codon/(ls /data/grebi_from_codon/ | grep solr | grep -v tgz) -export GREBI_SQLITE_SEARCH_PATH=/data/grebi_from_codon/ -export GREBI_METADATA_JSON_SEARCH_PATH=/data/grebi_from_codon/ +export GREBI_SQLITE_SEARCH_PATH=/data/grebi_from_codon/sqlite +export GREBI_METADATA_JSON_SEARCH_PATH=/data/grebi_from_codon/metadata