From 719a192a4b18e741c9a8963324846c29a10082d5 Mon Sep 17 00:00:00 2001 From: Thomas Stjernegaard Date: Tue, 23 Nov 2021 11:21:20 +0100 Subject: [PATCH] Fix white screen on Diff viewer --- src/App.js | 8 +++ src/api/gitVersion.js | 19 +++-- src/config.js | 2 +- src/pages/DatasetList/ColumnFilter.js | 1 + src/pages/DatasetList/ColumnFilter2.js | 98 ++++++++++++++++++++++++++ src/pages/DatasetList/index.js | 90 +++++++++++++++-------- src/pages/NameSearch/Search.js | 13 ++++ src/pages/NameSearch/index.js | 2 +- src/pages/tools/DiffViewer.js | 9 --- 9 files changed, 191 insertions(+), 51 deletions(-) create mode 100644 src/pages/DatasetList/ColumnFilter2.js create mode 100644 src/pages/NameSearch/Search.js diff --git a/src/App.js b/src/App.js index ced30907..738d1df2 100644 --- a/src/App.js +++ b/src/App.js @@ -43,6 +43,7 @@ import MetaDataValidator from "./pages/tools/MetaDataValidator"; import NameMatch from "./pages/tools/NameMatch"; import GBIFTaxonomyReview from "./pages/tools/GBIFTaxonomyReview"; import DiffViewer from "./pages/tools/DiffViewer"; +import NameUsageSearch from "./pages/NameSearch/Search"; const theme = { colorPrimary: "deepskyblue", @@ -228,6 +229,13 @@ class App extends Component { path="/dataset" render={(props) => } /> + + { - return axios(`/gitVersion.json`).then(res => res.data) + return axios(`/gitVersion.json`).then((res) => res.data); }; export const getBackendGitVersion = () => { - return axios(`${config.dataApi}version`).then(res => { - const splitted = res.data.split(' '); - return { - short: splitted[0].trim(), - created: splitted[1].trim() - } - }) - }; - + return axios(`${config.dataApi}version`).then((res) => { + const splitted = res.data.split(" "); + return { + short: splitted[0].trim(), + created: splitted[1].trim(), + }; + }); +}; diff --git a/src/config.js b/src/config.js index e471806c..d85b9589 100644 --- a/src/config.js +++ b/src/config.js @@ -9,7 +9,7 @@ if ( ) { env = environments.prod; } else if (domain.endsWith("localhost")) { - env = environments.dev; + env = environments.prod; } else { env = environments.dev; } diff --git a/src/pages/DatasetList/ColumnFilter.js b/src/pages/DatasetList/ColumnFilter.js index 656b48b9..0825d02a 100644 --- a/src/pages/DatasetList/ColumnFilter.js +++ b/src/pages/DatasetList/ColumnFilter.js @@ -61,6 +61,7 @@ class ColumnFilter extends React.Component { defaultValue={excludeColumns} onChange={this.handleHideColumnChange} showSearch + maxTagCount={4} > {columns.map((f) => { return ( diff --git a/src/pages/DatasetList/ColumnFilter2.js b/src/pages/DatasetList/ColumnFilter2.js new file mode 100644 index 00000000..aea943e9 --- /dev/null +++ b/src/pages/DatasetList/ColumnFilter2.js @@ -0,0 +1,98 @@ +import React from "react"; + +import { Select } from "antd"; +const Option = Select.Option; + +class ColumnFilter extends React.Component { + constructor(props) { + super(props); + this.state = { + showColumns: [], + }; + } + + componentDidMount = () => { + this.setColumns(this.props.columns); + }; + + componentDidUpdate = (nextProps) => { + if (!this.props.columns || this.props.columns.length === 0) { + this.setColumns(nextProps.columns); + } + }; + setColumns = (columns) => { + let excludeColumns = JSON.parse( + localStorage.getItem("colplus_datasetlist_hide_columns") + ) || [ + "creator", + "version", + "confidence", + "editor", + "geographicScope", + "private", + "modified", + "created", + "completeness", + ]; + // Handle metadata update + if (excludeColumns.includes("organisations")) { + excludeColumns = [ + "creator", + "version", + "confidence", + "editor", + "geographicScope", + "private", + "modified", + "created", + "completeness", + ]; + } + + this.setState({ + showColumns: columns + .filter((c) => !excludeColumns.includes(c.key)) + .map((c) => c.key), + }); + }; + + handleHideColumnChange = (showColumns) => { + const { columns } = this.props; + const excludeColumns = columns + .filter((c) => !showColumns.includes(c.key)) + .map((c) => c.key); + localStorage.setItem( + "colplus_datasetlist_hide_columns", + JSON.stringify(excludeColumns) + ); + this.setState({ showColumns }, () => { + this.props.onChange(excludeColumns); + }); + }; + + render = () => { + const { showColumns } = this.state; + const { columns } = this.props; + return ( + + ); + }; +} + +export default ColumnFilter; diff --git a/src/pages/DatasetList/index.js b/src/pages/DatasetList/index.js index 034f5dec..6547b96e 100644 --- a/src/pages/DatasetList/index.js +++ b/src/pages/DatasetList/index.js @@ -2,7 +2,7 @@ import React from "react"; import axios from "axios"; import { NavLink } from "react-router-dom"; import { LockOutlined, UnlockOutlined, PlusOutlined } from "@ant-design/icons"; -import { Table, Alert, Row, Col, Form, Button } from "antd"; +import { Table, Alert, Row, Col, Form, Button, Tooltip } from "antd"; import config from "../../config"; import qs from "query-string"; import Layout from "../../components/LayoutNew"; @@ -10,7 +10,7 @@ import moment from "moment"; import history from "../../history"; import Auth from "../../components/Auth"; import SearchBox from "./SearchBox"; -import ColumnFilter from "./ColumnFilter"; +import ColumnFilter from "./ColumnFilter2"; import DatasetLogo from "./DatasetLogo"; import ImportButton from "../../pages/Imports/importTabs/ImportButton"; import withContext from "../../components/hoc/withContext"; @@ -92,10 +92,20 @@ class DatasetList extends React.Component { dataIndex: "creator", key: "creator", sorter: true, + ellipsis: { + showTitle: false, + }, render: (text, record) => { - return text && _.isArray(text) - ? text.map((t) => t.name).join(", ") - : ""; + return text && _.isArray(text) ? ( + t.name).join(", ")} + > + {text.map((t) => t.name).join(", ")} + + ) : ( + "" + ); }, }, { @@ -103,10 +113,20 @@ class DatasetList extends React.Component { dataIndex: "editor", key: "editor", sorter: true, + ellipsis: { + showTitle: false, + }, render: (text, record) => { - return text && _.isArray(text) - ? text.map((t) => t.name).join(", ") - : ""; + return text && _.isArray(text) ? ( + t.name).join(", ")} + > + {text.map((t) => t.name).join(", ")} + + ) : ( + "" + ); }, }, { @@ -114,10 +134,20 @@ class DatasetList extends React.Component { dataIndex: "contributor", key: "contributor", sorter: true, + ellipsis: { + showTitle: false, + }, render: (text, record) => { - return text && _.isArray(text) - ? text.map((t) => t.name).join(", ") - : ""; + return text && _.isArray(text) ? ( + t.name).join(", ")} + > + {text.map((t) => t.name).join(", ")} + + ) : ( + "" + ); }, }, { @@ -378,24 +408,24 @@ class DatasetList extends React.Component { } */ const filteredColumns = isEditorOrAdmin(this.props.user) ? [ - ...defaultColumns, - { - title: "Action", - dataIndex: "", - width: 60, - key: "__actions__", - render: (text, record) => - record.origin === "external" && + ...defaultColumns, + { + title: "Action", + dataIndex: "", + width: 60, + key: "__actions__", + render: (text, record) => + record.origin === "external" && canEditDataset(record, this.props.user) ? ( - - ) : ( - "" - ), - }, - ] + + ) : ( + "" + ), + }, + ] : defaultColumns; const columns = _.filter( @@ -450,10 +480,10 @@ class DatasetList extends React.Component { diff --git a/src/pages/NameSearch/Search.js b/src/pages/NameSearch/Search.js new file mode 100644 index 00000000..dadef5d6 --- /dev/null +++ b/src/pages/NameSearch/Search.js @@ -0,0 +1,13 @@ +import React from "react"; +import Layout from "../../components/LayoutNew"; +import { withRouter } from "react-router"; +import NameSearch from "./index"; +const NameUsageSearch = ({ location }) => { + return ( + + + + ); +}; + +export default withRouter(NameUsageSearch); diff --git a/src/pages/NameSearch/index.js b/src/pages/NameSearch/index.js index 67ede4e7..5aaace38 100644 --- a/src/pages/NameSearch/index.js +++ b/src/pages/NameSearch/index.js @@ -199,7 +199,7 @@ class NameSearchPage extends React.Component { }); const url = datasetKey ? `${config.dataApi}dataset/${datasetKey}/nameusage/search` - : `${config.dataApi}name/search`; + : `${config.dataApi}nameusage/search`; axios(`${url}?${qs.stringify(newParamsWithPaging)}`) .then((res) => { this.setState({ diff --git a/src/pages/tools/DiffViewer.js b/src/pages/tools/DiffViewer.js index 315e9fdc..f839005a 100644 --- a/src/pages/tools/DiffViewer.js +++ b/src/pages/tools/DiffViewer.js @@ -222,15 +222,6 @@ const DiffViewer = ({ location, addError, rank }) => { )} - {_.get(this.state, "data") === "" && ( - - - - - - - - )} );