linkedpipes
diff --git a/Collapse file: client/app-services/vocabulary.js
‎client/app-services/vocabulary.js‎
Copy file name to clipboard
+6Lines changed: 6 additions & 0 deletions b/Collapse file: client/app-services/vocabulary.js
‎client/app-services/vocabulary.js‎
Copy file name to clipboard
+6Lines changed: 6 additions & 0 deletions
diff --git a/Collapse file: client/dataset/detail/distribution/access/compress-format-item.jsx
‎client/dataset/detail/distribution/access/compress-format-item.jsx‎
Copy file name to clipboard
+31Lines changed: 31 additions & 0 deletions b/Collapse file: client/dataset/detail/distribution/access/compress-format-item.jsx
‎client/dataset/detail/distribution/access/compress-format-item.jsx‎
Copy file name to clipboard
+31Lines changed: 31 additions & 0 deletions
diff --git a/Collapse file: client/dataset/detail/distribution/access/endpoint-description-item.jsx
‎client/dataset/detail/distribution/access/endpoint-description-item.jsx‎
Copy file name to clipboard
+18Lines changed: 18 additions & 0 deletions b/Collapse file: client/dataset/detail/distribution/access/endpoint-description-item.jsx
‎client/dataset/detail/distribution/access/endpoint-description-item.jsx‎
Copy file name to clipboard
+18Lines changed: 18 additions & 0 deletions
diff --git a/Collapse file: client/dataset/detail/distribution/access/endpoint-url-item.jsx
‎client/dataset/detail/distribution/access/endpoint-url-item.jsx‎
Copy file name to clipboard
+18Lines changed: 18 additions & 0 deletions b/Collapse file: client/dataset/detail/distribution/access/endpoint-url-item.jsx
‎client/dataset/detail/distribution/access/endpoint-url-item.jsx‎
Copy file name to clipboard
+18Lines changed: 18 additions & 0 deletions
diff --git a/Collapse file: client/dataset/detail/distribution/access/package-format-item.jsx
‎client/dataset/detail/distribution/access/package-format-item.jsx‎
Copy file name to clipboard
+30Lines changed: 30 additions & 0 deletions b/Collapse file: client/dataset/detail/distribution/access/package-format-item.jsx
‎client/dataset/detail/distribution/access/package-format-item.jsx‎
Copy file name to clipboard
+30Lines changed: 30 additions & 0 deletions
diff --git a/Collapse file: client/dataset/detail/distribution/data-service.jsx
‎client/dataset/detail/distribution/data-service.jsx‎
Copy file name to clipboard
+108Lines changed: 108 additions & 0 deletions b/Collapse file: client/dataset/detail/distribution/data-service.jsx
‎client/dataset/detail/distribution/data-service.jsx‎
Copy file name to clipboard
+108Lines changed: 108 additions & 0 deletions
diff --git a/Collapse file: client/dataset/detail/distribution/distribution-action.js
‎client/dataset/detail/distribution/distribution-action.js‎
Copy file name to clipboard
+51-2Lines changed: 51 additions & 2 deletions b/Collapse file: client/dataset/detail/distribution/distribution-action.js
‎client/dataset/detail/distribution/distribution-action.js‎
Copy file name to clipboard
+51-2Lines changed: 51 additions & 2 deletions
diff --git a/Collapse file: client/dataset/detail/distribution/distribution-api.js
‎client/dataset/detail/distribution/distribution-api.js‎
Copy file name to clipboard
+8-3Lines changed: 8 additions & 3 deletions b/Collapse file: client/dataset/detail/distribution/distribution-api.js
‎client/dataset/detail/distribution/distribution-api.js‎
Copy file name to clipboard
+8-3Lines changed: 8 additions & 3 deletions
@@ -39,6 +39,12 @@ export const DCAT = {
   "CatalogRecord": DCAT_PREFIX + "CatalogRecord",
   "Catalog": DCAT_PREFIX + "Catalog",
   "accessURL": DCAT_PREFIX + "accessURL",
+  "packageFormat": DCAT_PREFIX + "packageFormat",
+  "compressFormat": DCAT_PREFIX + "compressFormat",
+  "DataService": DCAT_PREFIX + "DataService",
+  "endpointURL": DCAT_PREFIX + "endpointURL",
+  "servesDataset": DCAT_PREFIX + "servesDataset",
+  "endpointDescription": DCAT_PREFIX + "endpointDescription",
 };
 
 const FOAF_PREFIX = "https://xmlns.com/foaf/0.1/";
 
@@ -0,0 +1,31 @@
+import React from "react";
+import {selectLabelNoIri} from "../../../../app-services/labels";
+
+export default function compressFormat(labels, distribution) {
+  if (distribution.compressFormat === undefined) {
+    return null;
+  }
+  return (
+    <li className="list-group-item px-2">
+      {selectLabelNoIri(labels, distribution.compressFormat)}
+      <a href={distribution.compressFormat["@id"]}
+        rel="nofollow noopener noreferrer"
+        target="_blank">
+        {linkIcon()}
+      </a>
+    </li>
+  )
+}
+
+function linkIcon() {
+  const iconStyle = {
+    "fontSize": "1.2rem",
+    "paddingLeft": "0.5rem",
+  };
+  return (
+    <i className="material-icons" style={iconStyle}>
+      open_in_new
+    </i>
+  );
+}
+
@@ -0,0 +1,18 @@
+import React from "react";
+import {getString} from "@/app-services/strings";
+
+export default function endpointDescription(labels, dataSource) {
+  if (dataSource.endpointDescription === undefined) {
+    return null;
+  }
+  return (
+    <li className="list-group-item px-2">
+      <a href={dataSource.endpointDescription}
+        className="card-link"
+        rel="nofollow noopener noreferrer"
+        target="_blank">
+        {getString("endpoint_description")}
+      </a>
+    </li>
+  )
+}
@@ -0,0 +1,18 @@
+import React from "react";
+import {getString} from "@/app-services/strings";
+
+export default function endpointUrl(labels, dataSource) {
+  if (dataSource.endpointURL === undefined) {
+    return null;
+  }
+  return (
+    <li className="list-group-item px-2">
+      <a href={dataSource.endpointURL}
+        className="card-link"
+        rel="nofollow noopener noreferrer"
+        target="_blank">
+        {getString("endpoint")}
+      </a>
+    </li>
+  )
+}
@@ -0,0 +1,30 @@
+import React from "react";
+import {selectLabelNoIri} from "../../../../app-services/labels";
+
+export default function packageFormat(labels, distribution) {
+  if (distribution.packageFormat === undefined) {
+    return null;
+  }
+  return (
+    <li className="list-group-item px-2">
+      {selectLabelNoIri(labels, distribution.packageFormat)}
+      <a href={distribution.packageFormat["@id"]}
+        rel="nofollow noopener noreferrer"
+        target="_blank">
+        {linkIcon()}
+      </a>
+    </li>
+  )
+}
+
+function linkIcon() {
+  const iconStyle = {
+    "fontSize": "1.2rem",
+    "paddingLeft": "0.5rem",
+  };
+  return (
+    <i className="material-icons" style={iconStyle}>
+      open_in_new
+    </i>
+  );
+}
@@ -0,0 +1,108 @@
+import React from "react";
+import {getString} from "@/app-services/strings";
+import {selectLabelNoIri} from "@/app-services/labels/index";
+import {selectLabel} from "@/app-services/labels";
+import authorship from "./terms-of-use/authorship";
+import databaseAuthorship from "./terms-of-use/database-authorship";
+import protectedDatabaseAuthorship
+  from "./terms-of-use/protected-database-authorship";
+import personalData from "./terms-of-use/personal-data";
+import schemaListItem from "./access/schema-list-item";
+import mediaTypeItem from "./access/media-type-item";
+import compressFormat from "./access/compress-format-item";
+import packageFormat from "./access/package-format-item";
+import endpointDescription from "./access/endpoint-description-item";
+import endpointUrl from "./access/endpoint-url-item";
+
+import {PropTypes} from "prop-types";
+
+export default class DataService extends React.PureComponent {
+  render() {
+    const {labels, distribution, openModal} = this.props;
+
+    const title = selectLabelNoIri(labels, distribution);
+
+    return (
+      <div className="col-12 col-sm-12 col-md-6 col-lg-6 mb-3">
+        <div className="card p-2">
+          <div className="card-body px-2">
+            {title === undefined ?
+              <span className="sr-only">
+                {getString("unnamed_distribution")}
+              </span>
+              :
+              <h5 className="card-title">
+                {title}
+              </h5>
+            }
+            {dataFormatItem(labels, distribution)}
+          </div>
+          <div className="row">
+            <div className="col-6 pr-1">
+              {licenseColumn(distribution, openModal)}
+            </div>
+            <div className="col-6 pl-1">
+              {accessColumn(labels, distribution, openModal)}
+            </div>
+          </div>
+        </div>
+      </div>
+    )
+  }
+}
+
+DataService.propTypes = {
+  "labels": PropTypes.object.isRequired,
+  "distribution": PropTypes.object.isRequired,
+  "openModal": PropTypes.func.isRequired,
+};
+
+function dataFormatItem(labels, distribution) {
+  const label = selectLabel(labels, distribution.format);
+  if (label === undefined) {
+    return (
+      <h6 className="card-subtitle mb-2 text-muted">
+        {getString("data_service")}
+      </h6>
+    );
+  }
+  return (
+    <h6 className="card-subtitle mb-2 text-muted">
+      {getString("data_service")} {label}
+    </h6>
+  )
+}
+
+function licenseColumn(distribution, openModal) {
+  return (
+    <div className="card">
+      <h6 className="card-title text-muted pl-2 pt-2">
+        {getString("distribution_license")}
+      </h6>
+      <ul className="list-group list-group-flush">
+        {authorship(distribution, openModal)}
+        {databaseAuthorship(distribution, openModal)}
+        {protectedDatabaseAuthorship(distribution, openModal)}
+        {personalData(distribution, openModal)}
+      </ul>
+    </div>
+  )
+}
+
+function accessColumn(labels, distribution, openModal) {
+  return (
+    <div className="card">
+      <h6 className="card-title text-muted pl-2 pt-2">
+        {getString("distribution_access")}
+      </h6>
+      <ul className="list-group list-group-flush">
+        {endpointDescription(labels, distribution)}
+        {endpointUrl(labels, distribution)}
+        {schemaListItem(distribution, openModal)}
+        {mediaTypeItem(labels, distribution, openModal)}
+        {compressFormat(labels, distribution)}
+        {packageFormat(labels, distribution)}
+      </ul>
+    </div>
+  );
+}
@@ -1,8 +1,10 @@
 import {
   fetchDistributionDetail,
-  fetchLabelsForDistribution,
+  fetchDataSourceDetail,
+  fetchLabelsForProperties,
 } from "./distribution-api";
 import {jsonLdToDistribution} from "./jsonld-to-distribution";
+import {jsonLdToDataService} from "./jsonld-to-data-service";
 import {fetchDatasetQuality} from "@/dataset/detail/dataset-api";
 
 export const MOUNT_DISTRIBUTION = "MOUNT_DISTRIBUTION";
@@ -12,6 +14,10 @@ export const FETCH_DISTRIBUTION_REQUEST = "FETCH_DISTRIBUTION_REQUEST";
 export const FETCH_DISTRIBUTION_SUCCESS = "FETCH_DISTRIBUTION_SUCCESS";
 export const FETCH_DISTRIBUTION_FAILED = "FETCH_DISTRIBUTION_FAILED";
 
+export const FETCH_DATA_SOURCE_REQUEST = "FETCH_DATA_SOURCE_REQUEST";
+export const FETCH_DATA_SOURCE_SUCCESS = "FETCH_DATA_SOURCE_SUCCESS";
+export const FETCH_DATA_SOURCE_FAILED = "FETCH_DATA_SOURCE_FAILED";
+
 export const SET_DISTRIBUTION_PAGE_INDEX = "SET_DISTRIBUTION_PAGE_INDEX";
 export const SET_DISTRIBUTION_PAGE_SIZE = "SET_DISTRIBUTION_PAGE_SIZE";
 
@@ -39,7 +45,7 @@ export function fetchDistribution(iri) {
     fetchDistributionDetail(iri).then((jsonld) => {
       const distribution = jsonLdToDistribution(jsonld);
       dispatch(fetchDistributionSuccess(iri, jsonld, distribution));
-      fetchLabelsForDistribution(distribution, dispatch);
+      fetchLabelsForProperties(distribution, dispatch, ["format", "mediaType"]);
       dispatch(fetchQuality(iri));
     }).catch((error) => dispatch(fetchDistributionFailed(iri, error)));
   };
@@ -108,3 +114,46 @@ function fetchQualityFailed(iri, error) {
   }
 }
 
+export function fetchDataSource(iri) {
+
+  return (dispatch) => {
+    dispatch(fetchDataSourceRequest(iri));
+    fetchDataSourceDetail(iri).then((jsonld) => {
+      const dataSource = jsonLdToDataService(jsonld);
+      if (dataSource === null) {
+        console.error("Missing DataService data.")
+        return;
+      }
+      dispatch(fetchDataSourceSuccess(iri, jsonld, dataSource));
+      fetchLabelsForProperties(dataSource, dispatch, ["format", "mediaType"]);
+      dispatch(fetchQuality(iri));
+    }).catch(error => console.error(error))
+      .catch((error) => dispatch(fetchDataSourceFailed(iri, error)));
+  };
+}
+
+function fetchDataSourceRequest(iri) {
+  return {
+    "type": FETCH_DATA_SOURCE_REQUEST,
+    "iri": iri,
+  }
+}
+
+function fetchDataSourceSuccess(iri, jsonld, distribution) {
+  return {
+    "type": FETCH_DATA_SOURCE_SUCCESS,
+    "iri": iri,
+    "jsonld": jsonld,
+    "distribution": distribution,
+  }
+}
+
+function fetchDataSourceFailed(iri, error) {
+  return {
+    "type": FETCH_DATA_SOURCE_FAILED,
+    "iri": iri,
+    "error": error,
+  }
+}
+
+
@@ -17,8 +17,7 @@ function normalizeData(data) {
 }
 
 // TODO Generalize and merge.
-export function fetchLabelsForDistribution(entity, dispatch) {
-  const properties = ["format", "mediaType"];
+export function fetchLabelsForProperties(entity, dispatch, properties) {
   properties.forEach((property) => {
     const value = entity[property];
     if (value === undefined) {
@@ -35,4 +34,10 @@ export function fetchLabelsForDistribution(entity, dispatch) {
 
 function dispatchLabelRequest(dispatch, iri) {
   dispatch(fetchLabel(iri));
-}
+}
+export function fetchDataSourceDetail(iri) {
+  const url = "./api/v1/resource/distribution?iri=" + encodeURI(iri);
+  return fetchJson(url).then((response) => {
+    return normalizeData(response.json);
+  });
+}