chore: Remove linkProperties from DataCatalog Component

app/scripts/components/common/card/index.tsx

@@ -301,6 +301,7 @@ function CardComponent(props: CardComponentPropsType) {
     const { linkProperties: linkPropertiesProps } = props;
     linkProperties = linkPropertiesProps;
   } else {
+    // @NOTE: This currently just exists for GHG which uses the Card component
     const { linkTo } = props;
     linkProperties = linkTo
       ? {

app/scripts/components/common/catalog/catalog-card.tsx

@@ -3,17 +3,12 @@ import styled, { css } from "styled-components";
 import { CollecticonPlus, CollecticonTickSmall, iconDataURI } from "@devseed-ui/collecticons";
 import { glsp, themeVal } from "@devseed-ui/theme-provider";
 import { Card } from "../card";
-import { CardMeta, CardTopicsList } from "../card/styles";
-import { DatasetClassification } from "../dataset-classification";
-import { CardSourcesList } from "../card-sources";
+import { CardTopicsList } from "../card/styles";
 import TextHighlight from "../text-highlight";
 import { getDatasetDescription, getMediaProperty } from './utils';
-import { LinkProperties } from '$types/veda';
 import { DatasetData, DatasetLayer } from "$types/veda";
-import { getDatasetPath } from "$utils/routes";
-import { TAXONOMY_SOURCE, TAXONOMY_TOPICS, getAllTaxonomyValues, getTaxonomy } from "$utils/veda-data/taxonomies";
+import { TAXONOMY_TOPICS, getAllTaxonomyValues, getTaxonomy } from "$utils/veda-data/taxonomies";
 import { Pill } from "$styles/pill";
-import { usePathname } from "$utils/use-pathname";
 
 interface CatalogCardProps {
   dataset: DatasetData;
@@ -22,7 +17,6 @@ interface CatalogCardProps {
   selectable?: boolean;
   selected?: boolean;
   onDatasetClick?: () => void;
-  linkProperties?: LinkProperties;
 }
 
 const CardSelectable = styled(Card)<{
@@ -101,14 +95,10 @@ export const CatalogCard = (props: CatalogCardProps) => {
     searchTerm,
     selectable,
     selected,
-    onDatasetClick,
-    linkProperties
+    onDatasetClick
   } = props;
 
-  const pathname = usePathname();
-
   const topics = getTaxonomy(dataset, TAXONOMY_TOPICS)?.values;
-  const sources = getTaxonomy(dataset, TAXONOMY_SOURCE)?.values;
   const allTaxonomyValues = getAllTaxonomyValues(dataset).map((v) => v.name);
 
   const title = layer ? layer.name : dataset.name;
@@ -123,20 +113,12 @@ export const CatalogCard = (props: CatalogCardProps) => {
     }
   };
 
-  const linkTo = getDatasetPath(dataset, pathname);
-
   return (
     <CardSelectable
       cardType='horizontal-info'
       checked={selectable ? selected : undefined}
       selectable={selectable}
       tagLabels={allTaxonomyValues}
-      overline={
-        <CardMeta>
-          <DatasetClassification dataset={dataset} />
-          <CardSourcesList sources={sources} linkProperties={linkProperties} />
-        </CardMeta>
-      }
       linkLabel='View dataset'
       onClick={handleClick}
       title={
@@ -172,7 +154,6 @@ export const CatalogCard = (props: CatalogCardProps) => {
           ) : null}
         </>
       }
-      {...(linkProperties ? {linkProperties: {...linkProperties, linkTo: linkTo}} : {})}
     />
   );
 };

app/scripts/components/common/catalog/catalog-content.tsx

@@ -9,7 +9,6 @@ import { CatalogCard } from './catalog-card';
 import CatalogTagsContainer from './catalog-tags';
 
 import { FilterActions } from './utils';
-import { LinkProperties } from '$types/veda';
 import { DatasetData, DatasetDataWithEnhancedLayers } from '$types/veda';
 import { CardList } from '$components/common/card/styles';
 import EmptyHub from '$components/common/empty-hub';
@@ -22,6 +21,8 @@ import {
 import { OptionItem } from '$components/common/form/checkable-filter';
 import { Pill } from '$styles/pill';
 import { usePreviousValue } from '$utils/use-effect-previous';
+import { getDatasetPath } from '$utils/routes';
+import { usePathname } from "$utils/use-pathname";
 
 const EXCLUSIVE_SOURCE_WARNING = "Can only be analyzed with layers from the same source";
 
@@ -34,7 +35,7 @@ export interface CatalogContentProps {
   search: string;
   taxonomies: Record<string, string[]>;
   onAction: (action: FilterActions, value?: any) => void;
-  linkProperties: LinkProperties;
+  onCardNavigate?: (path: string) => void;
 }
 
 const DEFAULT_SORT_OPTION = 'asc';
@@ -71,7 +72,7 @@ function CatalogContent({
   search,
   taxonomies,
   onAction,
-  linkProperties
+  onCardNavigate
 }: CatalogContentProps) {
   const [exclusiveSourceSelected, setExclusiveSourceSelected] = useState<string | null>(null);
   const isSelectable = selectedIds !== undefined;
@@ -95,6 +96,8 @@ function CatalogContent({
 
   const prevSelectedFilters = usePreviousValue(selectedFilters) ?? [];
 
+  const pathname = usePathname();
+
   // Handlers
   const updateSelectedFilters = useCallback((item: OptionItem, action: 'add' | 'remove') => {
     if (action == 'add') {
@@ -275,7 +278,7 @@ function CatalogContent({
                   <CatalogCard
                     dataset={d}
                     searchTerm={search}
-                    linkProperties={linkProperties}
+                    {...(onCardNavigate && {onDatasetClick: () => onCardNavigate(getDatasetPath(d, pathname))})}
                   />
                 </li>
               ))}

app/scripts/components/common/catalog/index.tsx

@@ -2,7 +2,7 @@ import React from 'react';
 import styled from 'styled-components';
 import { themeVal } from '@devseed-ui/theme-provider';
 import CatalogContent from './catalog-content';
-import { DatasetData, LinkProperties } from '$types/veda';
+import { DatasetData } from '$types/veda';
 import {
   useSlidingStickyHeaderProps
 } from '$components/common/layout-root/useSlidingStickyHeaderProps';
@@ -41,13 +41,13 @@ export interface CatalogViewProps {
     taxonomies: Record<string, string[]> | Record<string, never>,
     onAction: () => void,
   } | any;
-  linkProperties: LinkProperties;
+  onCardNavigate?: (path: string) => void;
 }
 
 function CatalogView({
   datasets,
   onFilterChanges,
-  linkProperties,
+  onCardNavigate
 }: CatalogViewProps) {
 
   const { headerHeight } = useSlidingStickyHeaderProps();
@@ -70,7 +70,7 @@ function CatalogView({
         search={search}
         taxonomies={taxonomies}
         onAction={onAction}
-        linkProperties={linkProperties}
+        onCardNavigate={onCardNavigate}
       />
     </CatalogWrapper>
   );

app/scripts/components/data-catalog/container.tsx

@@ -1,4 +1,5 @@
 import React from 'react';
+import { useNavigate } from "react-router-dom";
 import { getString } from 'veda';
 import { getAllDatasetsProps } from '$utils/veda-data';
 import CatalogView from '$components/common/catalog';
@@ -8,7 +9,6 @@ import PageHero from '$components/common/page-hero';
 import { FeaturedDatasets } from '$components/common/featured-slider-section';
 import { veda_faux_module_datasets } from '$data-layer/datasets';
 import { useFiltersWithQS } from '$components/common/catalog/controls/hooks/use-filters-with-query';
-import SmartLink from '$components/common/smart-link';
 
 /**
  * @VEDA2-REFACTOR-WORK
@@ -20,6 +20,11 @@ import SmartLink from '$components/common/smart-link';
 export default function DataCatalogContainer() {
   const allDatasets = getAllDatasetsProps(veda_faux_module_datasets);
   const controlVars = useFiltersWithQS();
+  const navigate = useNavigate();
+
+  const handleCardNavigation = (path: string) => {
+    navigate(path);
+  };
 
   return (
     <PageMainContent>
@@ -35,10 +40,7 @@ export default function DataCatalogContainer() {
       <CatalogView
         datasets={allDatasets}
         onFilterChanges={() => controlVars}
-        linkProperties={{
-          LinkElement: SmartLink,
-          pathAttributeKeyName: 'to'
-        }}
+        onCardNavigate={handleCardNavigation}
       />
     </PageMainContent>
   );

app/scripts/components/exploration/components/dataset-selector-modal/index.tsx

@@ -66,7 +66,7 @@ const DatasetModal = styled(Modal)`
 interface DatasetSelectorModalProps {
   revealed: boolean;
   close: () => void;
-  linkProperties: LinkProperties;
+  linkProperties?: LinkProperties;
   datasets: DatasetData[];
   datasetPathName: string;
   timelineDatasets: TimelineDataset[];
@@ -126,7 +126,6 @@ export function DatasetSelectorModal(props: DatasetSelectorModalProps) {
           setSelectedIds={setSelectedIds}
           onAction={onAction}
           filterLayers={true}
-          linkProperties={linkProperties}
           emptyStateContent={
             <>
               <p>There are no datasets to show with the selected filters.</p>