diff --git a/src/client/components/facet_results/FacetResults.js b/src/client/components/facet_results/FacetResults.js
index 0d913353f8ae634c7b6f7ee0642e1f3a2af18e24..3fab8ffd9431372e09603d104c3d37ee316bd613 100644
--- a/src/client/components/facet_results/FacetResults.js
+++ b/src/client/components/facet_results/FacetResults.js
@@ -8,9 +8,9 @@ const ResultTable = lazy(() => import('./ResultTable'))
const LeafletMap = lazy(() => import('./LeafletMap'))
const Deck = lazy(() => import('./Deck'))
const ApexCharts = lazy(() => import('./ApexCharts'))
+const Network = lazy(() => import('./Network'))
// const BarChartRace = lazy(() => import('../../facet_results/BarChartRace'))
-// const Network = lazy(() => import('../../facet_results/Network'))
-// const Export = lazy(() => import('../../facet_results/Export'))
+const Export = lazy(() => import('./Export'))
const FacetResults = props => {
const {
@@ -53,6 +53,7 @@ const FacetResults = props => {
render={routeProps =>
<ResultTable
portalConfig={portalConfig}
+ perspectiveConfig={perspective}
data={perspectiveState}
facetUpdateID={facetState.facetUpdateID}
resultClass={resultClass}
@@ -78,6 +79,7 @@ const FacetResults = props => {
render={() =>
<LeafletMap
portalConfig={portalConfig}
+ perspectiveConfig={perspective}
center={resultClassMap.center}
zoom={resultClassMap.zoom}
results={perspectiveState.results}
@@ -120,6 +122,7 @@ const FacetResults = props => {
const resultClassMap = maps[resultClass]
let deckProps = {
portalConfig,
+ perspectiveConfig: perspective,
center: resultClassMap.center,
zoom: resultClassMap.zoom,
results: perspectiveState.results,
@@ -183,6 +186,7 @@ const FacetResults = props => {
} = resultClassConfig
const apexProps = {
portalConfig,
+ perspectiveConfig: perspective,
pageType,
resultClass,
facetClass,
@@ -212,14 +216,65 @@ const FacetResults = props => {
)
break
}
- // case 'Network':
- // routeComponent = (
-
- // )
- // case 'BarChartRace':
- // routeComponent = (
-
- // )
+ case 'Network': {
+ const { networkConfig } = props
+ const {
+ pageType = 'facetResults',
+ limit,
+ optimize,
+ style,
+ layout,
+ preprocess
+ } = resultClassConfig
+ const networkProps = {
+ portalConfig,
+ perspectiveConfig: perspective,
+ pageType,
+ resultClass,
+ facetClass,
+ results: perspectiveState.results,
+ resultUpdateID: perspectiveState.resultUpdateID,
+ facetUpdateID: facetState.facetUpdateID,
+ fetching: perspectiveState.fetching,
+ fetchResults: props.fetchResults,
+ layoutConfig: props.layoutConfig,
+ limit,
+ optimize,
+ style: networkConfig[style],
+ layout: networkConfig[layout],
+ preprocess: networkConfig[preprocess]
+ }
+ routeComponent = (
+ <Route
+ path={path}
+ key={resultClass}
+ render={() =>
+ <Network {...networkProps} />}
+ />
+ )
+ break
+ }
+ case 'Export': {
+ const exportResultClass = resultClassConfig.resultClass
+ routeComponent = (
+ <Route
+ path={path}
+ key={resultClass}
+ render={routeProps =>
+ <Export
+ portalConfig={portalConfig}
+ data={perspectiveState}
+ resultClass={exportResultClass}
+ facetClass={facetClass}
+ pageType='facetResults'
+ fetchPaginatedResults={props.fetchPaginatedResults}
+ updatePage={props.updatePage}
+ layoutConfig={props.layoutConfig}
+ />}
+ />
+ )
+ break
+ }
}
return routeComponent
}
@@ -228,7 +283,7 @@ const FacetResults = props => {
<>
<PerspectiveTabs
routeProps={props.routeProps}
- tabs={props.perspective.tabs}
+ tabs={perspective.tabs}
screenSize={props.screenSize}
layoutConfig={props.layoutConfig}
/>
@@ -260,44 +315,6 @@ const FacetResults = props => {
layoutConfig={props.layoutConfig}
/>}
/>
-
- <Route
- path={`${rootUrl}/${perspective.id}/faceted-search/event_dates`}
- render={() =>
- <ApexChart
- portalConfig={portalConfig}
- pageType='facetResults'
- rawData={props.perspectiveState.results}
- rawDataUpdateID={props.perspectiveState.resultUpdateID}
- facetUpdateID={props.facetState.facetUpdateID}
- fetching={props.perspectiveState.fetching}
- fetchData={props.fetchResults}
- createChartData={props.lineChartConfig.createMultipleLineChartData}
- title='Manuscript events by decade'
- xaxisTitle='Year'
- xaxisType='category'
- xaxisTickAmount={30}
- yaxisTitle='Count'
- seriesTitle='Count'
- stroke={{
- curve: 'straight',
- width: 2
- }}
- fill={{
- type: 'gradient',
- gradient: {
- shadeIntensity: 1,
- inverseColors: false,
- opacityFrom: 0.6,
- opacityTo: 0.05,
- stops: [20, 60, 100, 100]
- }
- }}
- resultClass='eventLineChart'
- facetClass='perspective1'
- layoutConfig={props.layoutConfig}
- />}
- />
<Route
path={`${rootUrl}/${perspective.id}/faceted-search/bar_chart_race_ms_productions`}
render={() =>
@@ -330,41 +347,7 @@ const FacetResults = props => {
stepDuration={1000}
/>}
/>
- <Route
- path={`${rootUrl}/${perspective.id}/faceted-search/network`}
- render={() =>
- <Network
- portalConfig={portalConfig}
- results={props.perspectiveState.results}
- facetUpdateID={props.facetState.facetUpdateID}
- resultUpdateID={props.perspectiveState.resultUpdateID}
- fetchResults={props.fetchResults}
- fetching={props.perspectiveState.fetching}
- resultClass='manuscriptFacetResultsNetwork'
- facetClass='perspective1'
- limit={500}
- optimize={1.2}
- style={props.networkConfig.cytoscapeStyle}
- layout={props.networkConfig.coseLayout}
- preprocess={props.networkConfig.preprocess}
- pageType='facetResults'
- layoutConfig={props.layoutConfig}
- />}
- />
- <Route
- path={`${rootUrl}/${perspective.id}/faceted-search/export`}
- render={() =>
- <Export
- portalConfig={portalConfig}
- data={props.perspectiveState}
- resultClass='perspective1'
- facetClass='perspective1'
- pageType='facetResults'
- fetchPaginatedResults={props.fetchPaginatedResults}
- updatePage={props.updatePage}
- layoutConfig={props.layoutConfig}
- />}
- /> */}
+ */}
</>
)
}
diff --git a/src/client/configs/sampo/perspective_configs/search_perspectives/perspective1.json b/src/client/configs/sampo/perspective_configs/search_perspectives/perspective1.json
index dbd3634e6d5a5a89b038088a72182a3b4fd27e99..899ece34664bdbc1d939d4621941a986bc0c32b8 100644
--- a/src/client/configs/sampo/perspective_configs/search_perspectives/perspective1.json
+++ b/src/client/configs/sampo/perspective_configs/search_perspectives/perspective1.json
@@ -125,9 +125,6 @@
}
},
"productionsByDecadeAndCountry": {
- "tabID": 1,
- "tabPath": "",
- "tabIcon": "AddLocation",
"sparqlQuery": "productionsByDecadeAndCountryQuery",
"facetClass": "perspective1",
"filterTarget": "manuscript",
@@ -140,8 +137,9 @@
}
},
"eventLineChart": {
- "tabID": 1,
- "tabPath": "",
+ "tabID": 4,
+ "component": "ApexCharts",
+ "tabPath": "event_dates",
"tabIcon": "AddLocation",
"sparqlQuery": "eventsByDecadeQuery",
"facetClass": "perspective1",
@@ -149,6 +147,32 @@
"resultMapper": "mapMultipleLineChart",
"resultMapperConfig": {
"fillEmptyValues": false
+ },
+ "createChartData": "createMultipleLineChartData",
+ "title": "Manuscript events by decade",
+ "xaxisTitle": "Decade",
+ "xaxisType": "category",
+ "xaxisTickAmount": 30,
+ "yaxisTitle": "Count",
+ "seriesTitle": "Count",
+ "stroke": {
+ "curve": "straight",
+ "width": 2
+ },
+ "fill": {
+ "type": "gradient",
+ "gradient": {
+ "shadeIntensity": 1,
+ "inverseColors": false,
+ "opacityFrom": 0.6,
+ "opacityTo": 0.05,
+ "stops": [
+ 20,
+ 60,
+ 100,
+ 100
+ ]
+ }
}
},
"manuscriptInstancePageNetwork": {
@@ -157,14 +181,28 @@
"useNetworkAPI": true
},
"manuscriptFacetResultsNetwork": {
- "tabID": 1,
- "tabPath": "",
- "tabIcon": "AddLocation",
+ "tabID": 7,
+ "component": "Network",
+ "tabPath": "network",
+ "tabIcon": "BubbleChart",
"sparqlQuery": "manuscriptFacetResultsNetworkLinksQuery",
"facetClass": "perspective1",
"sparqlQueryNodes": "manuscriptNetworkNodesQuery",
"filterTarget": "manuscript",
- "useNetworkAPI": true
+ "useNetworkAPI": true,
+ "limit": 500,
+ "optimize": 1.2,
+ "style": "cytoscapeStyle",
+ "layout": "coseLayout",
+ "preprocess": "preprocess"
+ },
+ "export": {
+ "tabID": 8,
+ "component": "Export",
+ "tabPath": "export",
+ "tabIcon": "CloudDownload",
+ "resultClass": "perspective1",
+ "facetClass": "perspective1"
},
"perspective1KnowledgeGraphMetadata": {
"sparqlQuery": "knowledgeGraphMetadataQuery",
@@ -211,53 +249,6 @@
"zoom": 4
}
},
- "tabs": [
- {
- "id": "table",
- "value": 0,
- "icon": "CalendarViewDay"
- },
- {
- "id": "production_places",
- "value": 1,
- "icon": "AddLocation"
- },
- {
- "id": "production_places_heatmap",
- "value": 2,
- "icon": "AddLocation"
- },
- {
- "id": "production_dates",
- "value": 3,
- "icon": "ShowChart"
- },
- {
- "id": "event_dates",
- "value": 4,
- "icon": "ShowChart"
- },
- {
- "id": "last_known_locations",
- "value": 5,
- "icon": "LocationOn"
- },
- {
- "id": "migrations",
- "value": 6,
- "icon": "Redo"
- },
- {
- "id": "network",
- "value": 7,
- "icon": "BubbleChart"
- },
- {
- "id": "export",
- "value": 8,
- "icon": "CloudDownload"
- }
- ],
"instancePageTabs": [
{
"id": "table",
diff --git a/src/client/helpers/helpers.js b/src/client/helpers/helpers.js
index 8a56215bfea79c1e4b895ebb39d793b136d7a5bf..db0d19c3ee64404166476e94f6f513a63ba9ae20 100644
--- a/src/client/helpers/helpers.js
+++ b/src/client/helpers/helpers.js
@@ -1,6 +1,6 @@
import React from 'react'
import querystring from 'querystring'
-import { has } from 'lodash'
+import { has, sortBy } from 'lodash'
import intl from 'react-intl-universal'
import MuiIcon from '../components/main_layout/MuiIcon'
@@ -199,10 +199,25 @@ export const createPerspectiveConfig = async ({ portalID, searchPerspectives })
const { default: image } = await import(/* webpackMode: "eager" */ `../img/${perspective.frontPageImage}`)
perspective.frontPageImage = image
}
- if (has(perspective, 'tabs')) {
- for (const tab of perspective.tabs) {
- tab.icon = <MuiIcon iconName={tab.icon} />
- }
+ if (has(perspective, 'resultClasses')) {
+ const tabs = []
+ // console.log(perspective)
+ Object.keys(perspective.resultClasses).forEach(resultClass => {
+ let resultClassConfig = perspective.resultClasses[resultClass]
+ if (has(resultClassConfig, 'paginatedResultsConfig')) {
+ resultClassConfig = resultClassConfig.paginatedResultsConfig
+ }
+ if (has(resultClassConfig, 'tabID') && has(resultClassConfig, 'tabPath')) {
+ const { tabID, tabPath, tabIcon } = resultClassConfig
+ tabs.push({
+ id: tabPath,
+ value: tabID,
+ icon: <MuiIcon iconName={tabIcon} />
+ })
+ }
+ sortBy(tabs, 'value')
+ })
+ perspective.tabs = tabs
}
if (has(perspective, 'instancePageTabs')) {
for (const tab of perspective.instancePageTabs) {