- fixed reference access error when both chart & table are disabled

- fixed `preview-tabular-data-settings` not fetched for dist - code refactoring
magda-io · Jul 31, 2024 · 1a0f48d · 1a0f48d
1 parent 1dd1221
commit 1a0f48d
Show file tree

Hide file tree

Showing 5 changed files with 86 additions and 50 deletions.
diff --git a/magda-web-client/src/Components/Common/DataPreviewVis.tsx b/magda-web-client/src/Components/Common/DataPreviewVis.tsx
@@ -22,6 +22,39 @@ type StateType = {
     fileSizeCheckResult: FileSizeCheckResult | null;
 };
 
+export function mergeDatasetAndDistributionPreviewSettings(
+    dist: ParsedDistribution | null,
+    dataset: ParsedDataset
+) {
+    if (!dist) {
+        return dist;
+    }
+    const datasetPreviewTabularDataSettings =
+        dataset?.rawData?.aspects?.["preview-tabular-data-settings"];
+    if (datasetPreviewTabularDataSettings) {
+        // merge the dataset preview-tabular-data-settings with the distribution preview-tabular-data-settings
+        const rawDistDataAspect = {
+            ...dist.rawData.aspects,
+            "preview-tabular-data-settings": {
+                ...datasetPreviewTabularDataSettings,
+                ...(dist?.rawData?.aspects?.["preview-tabular-data-settings"]
+                    ? dist.rawData.aspects["preview-tabular-data-settings"]
+                    : {})
+            }
+        };
+        const rawDistData = {
+            ...dist.rawData,
+            aspects: rawDistDataAspect
+        };
+        return {
+            ...dist,
+            rawData: rawDistData
+        };
+    } else {
+        return { ...dist };
+    }
+}
+
 class DataPreviewVis extends Component<
     {
         distribution: ParsedDistribution | null;
@@ -175,10 +208,13 @@ class DataPreviewVis extends Component<
      * @param {Array} tabs - Array of tab items
      */
     renderTabs(tabs) {
-        const activeTab = tabs.find(
+        let activeTab = tabs.find(
             (item, i) =>
                 item.value.toLowerCase() === this.state.visType.toLowerCase()
         );
+        if (!activeTab && tabs.length > 0) {
+            activeTab = tabs[0];
+        }
 
         return (
             <nav className="tab-navigation">
@@ -187,7 +223,7 @@ class DataPreviewVis extends Component<
                         <li key={t.value}>
                             <button
                                 className={`${t.value.toLowerCase()} au-link ${
-                                    t.value.toLowerCase() === activeTab.value
+                                    t.value.toLowerCase() === activeTab?.value
                                         ? "tab-active"
                                         : null
                                 }`}
@@ -202,12 +238,29 @@ class DataPreviewVis extends Component<
                         </li>
                     ))}
                 </ul>
-                {activeTab.action}
+                {activeTab?.action ? activeTab.action : null}
             </nav>
         );
     }
 
+    shouldNotShow() {
+        const distribution = this.props.distribution;
+        return (
+            (distribution?.compatiblePreviews?.chart === false ||
+                distribution?.rawData?.aspects?.[
+                    "preview-tabular-data-settings"
+                ]?.enableChart === false) &&
+            (distribution?.compatiblePreviews?.table === false ||
+                distribution?.rawData?.aspects?.[
+                    "preview-tabular-data-settings"
+                ]?.enableTable === false)
+        );
+    }
+
     renderByState() {
+        if (this.shouldNotShow()) {
+            return null;
+        }
         if (
             this.state.fileSizeCheckResult &&
             this.state.fileSizeCheckResult.fileSizeCheckStatus !==

diff --git a/magda-web-client/src/Components/Dataset/View/DatasetPagePreview.tsx b/magda-web-client/src/Components/Dataset/View/DatasetPagePreview.tsx
@@ -1,6 +1,8 @@
 import React, { Component } from "react";
 import { Location } from "history";
-import DataPreviewVis from "Components/Common/DataPreviewVis";
+import DataPreviewVis, {
+    mergeDatasetAndDistributionPreviewSettings
+} from "Components/Common/DataPreviewVis";
 import DataPreviewMap from "Components/Common/DataPreviewMap";
 import { getPluginExtraVisualisationSections } from "../../../externalPluginComponents";
 import { ParsedDistribution, ParsedDataset } from "../../../helpers/record";
@@ -21,7 +23,7 @@ export default class DatasetPagePreview extends Component<PropsTypes> {
         if (!distributions || distributions?.length === 0) {
             return null;
         }
-        let dist = distributions.find((d) => {
+        const dist = distributions.find((d) => {
             // Checking if the distribution has a url
             if (!(typeof d === "string") && !d.downloadURL && !d.accessURL) {
                 return null;
@@ -33,36 +35,7 @@ export default class DatasetPagePreview extends Component<PropsTypes> {
             return null;
         }
 
-        if (dist) {
-            const datasetPreviewTabularDataSettings =
-                dataset?.rawData?.aspects?.["preview-tabular-data-settings"];
-            if (datasetPreviewTabularDataSettings) {
-                // merge the dataset preview-tabular-data-settings with the distribution preview-tabular-data-settings
-                const rawDistDataAspect = {
-                    ...dist.rawData.aspects,
-                    "preview-tabular-data-settings": {
-                        ...datasetPreviewTabularDataSettings,
-                        ...(dist?.rawData?.aspects?.[
-                            "preview-tabular-data-settings"
-                        ]
-                            ? dist.rawData.aspects[
-                                  "preview-tabular-data-settings"
-                              ]
-                            : {})
-                    }
-                };
-                const rawDistData = {
-                    ...dist.rawData,
-                    aspects: rawDistDataAspect
-                };
-                dist = {
-                    ...dist,
-                    rawData: rawDistData
-                };
-            }
-        }
-
-        return dist;
+        return mergeDatasetAndDistributionPreviewSettings(dist, dataset);
     }
 
     render() {

diff --git a/magda-web-client/src/Components/Dataset/View/DistributionDetails.tsx b/magda-web-client/src/Components/Dataset/View/DistributionDetails.tsx
@@ -1,5 +1,7 @@
 import React, { Component } from "react";
-import DataPreviewVis from "Components/Common/DataPreviewVis";
+import DataPreviewVis, {
+    mergeDatasetAndDistributionPreviewSettings
+} from "Components/Common/DataPreviewVis";
 import DataPreviewMap from "Components/Common/DataPreviewMap";
 import MagdaNamespacesConsumer from "Components/i18n/MagdaNamespacesConsumer";
 import ContactPoint from "Components/Common/ContactPoint";
@@ -115,7 +117,10 @@ class DistributionDetails extends Component<{
 
     render() {
         const dataset = this.props.dataset;
-        const distribution = this.props.distribution;
+        const distribution = mergeDatasetAndDistributionPreviewSettings(
+            this.props.distribution,
+            dataset
+        ) as ParsedDistribution;
         const sourceText = this.renderLinkText(distribution);
 
         return (
@@ -135,7 +140,8 @@ class DistributionDetails extends Component<{
                 {(distribution?.downloadURL || distribution?.accessURL) && (
                     <div className="distribution-preview">
                         <DataPreviewVis
-                            distribution={this.props.distribution}
+                            distribution={distribution}
+                            dataset={dataset}
                         />
                         <DataPreviewMap distributions={[distribution]} />
                         {extraVisualisationSections?.length

diff --git a/magda-web-client/src/actions/recordActions.ts b/magda-web-client/src/actions/recordActions.ts
@@ -6,7 +6,8 @@ import { FetchError } from "../types";
 import {
     ensureAspectExists,
     fetchRecord,
-    Record
+    Record,
+    DEFAULT_OPTIONAL_DISTRIBUTION_FETCH_ASPECT_LIST
 } from "api-clients/RegistryApis";
 import request from "helpers/request";
 
@@ -124,17 +125,7 @@ export function fetchDistributionFromRegistry(id: string): any {
         try {
             const data = await fetchRecord<RawDistribution>(
                 id,
-                [
-                    "source-link-status",
-                    "source",
-                    "visualization-info",
-                    "access",
-                    "usage",
-                    "dataset-format",
-                    "ckan-resource",
-                    "publishing",
-                    "version"
-                ],
+                DEFAULT_OPTIONAL_DISTRIBUTION_FETCH_ASPECT_LIST,
                 ["dcat-distribution-strings"]
             );
             return dispatch(receiveDistribution(data));

diff --git a/magda-web-client/src/api-clients/RegistryApis.ts b/magda-web-client/src/api-clients/RegistryApis.ts
@@ -250,6 +250,19 @@ export const DEFAULT_OPTIONAL_FETCH_ASPECT_LIST = [
     "preview-tabular-data-settings"
 ];
 
+export const DEFAULT_OPTIONAL_DISTRIBUTION_FETCH_ASPECT_LIST = [
+    "source-link-status",
+    "source",
+    "visualization-info",
+    "access",
+    "usage",
+    "dataset-format",
+    "ckan-resource",
+    "publishing",
+    "version",
+    "preview-tabular-data-settings"
+];
+
 export const DEFAULT_COMPULSORY_FETCH_ASPECT_LIST = ["dcat-dataset-strings"];
 
 export async function fetchRecord<T = RawDataset>(