From 860840b894eb289aa032292ee693da852a7ebcb1 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?R=C3=B4mulo=20Penido?= <romulo@opencraft.com>
Date: Fri, 20 Oct 2023 16:39:27 -0300
Subject: [PATCH] feat: wip

---
 src/index.jsx                                 |  3 +++
 src/taxonomy/api/hooks/selectors.js           |  2 +-
 src/taxonomy/taxonomy-card/TaxonomyCard.jsx   |  3 +++
 .../taxonomy-detail/TaxonomyDetailPage.jsx    | 21 +++++++++++++++++--
 4 files changed, 26 insertions(+), 3 deletions(-)

diff --git a/src/index.jsx b/src/index.jsx
index 46ba868924..dec441acad 100755
--- a/src/index.jsx
+++ b/src/index.jsx
@@ -84,6 +84,9 @@ const App = () => {
               />
             </>
           )}
+          <Route>
+            No match (404)
+          </Route>
         </Switch>
       </QueryClientProvider>
     </AppProvider>
diff --git a/src/taxonomy/api/hooks/selectors.js b/src/taxonomy/api/hooks/selectors.js
index c072c72e1e..0890dda77d 100644
--- a/src/taxonomy/api/hooks/selectors.js
+++ b/src/taxonomy/api/hooks/selectors.js
@@ -11,7 +11,7 @@ import {
 export const useTaxonomyListDataResponse = () => {
   const response = useTaxonomyListData();
   if (response.status === 'success') {
-    return response.data;
+    return response.data.data;
   }
   return undefined;
 };
diff --git a/src/taxonomy/taxonomy-card/TaxonomyCard.jsx b/src/taxonomy/taxonomy-card/TaxonomyCard.jsx
index 48e6688d91..0f1e20f8d4 100644
--- a/src/taxonomy/taxonomy-card/TaxonomyCard.jsx
+++ b/src/taxonomy/taxonomy-card/TaxonomyCard.jsx
@@ -7,6 +7,8 @@ import {
 } from '@edx/paragon';
 import { injectIntl, intlShape } from '@edx/frontend-platform/i18n';
 import PropTypes from 'prop-types';
+import { Link } from 'react-router-dom';
+
 import classNames from 'classnames';
 import messages from '../messages';
 import TaxonomyCardMenu from './TaxonomyCardMenu';
@@ -102,6 +104,7 @@ const TaxonomyCard = ({ className, original, intl }) => {
   return (
     <>
       <Card className={classNames('taxonomy-card', className)} data-testid={`taxonomy-card-${id}`}>
+        <Link className="stretched-link" to={`taxonomy-list/${id}`} aria-label="view taxonomy details" />
         <Card.Header
           title={name}
           subtitle={getHeaderSubtitle()}
diff --git a/src/taxonomy/taxonomy-detail/TaxonomyDetailPage.jsx b/src/taxonomy/taxonomy-detail/TaxonomyDetailPage.jsx
index d422efde18..3f2975f38a 100644
--- a/src/taxonomy/taxonomy-detail/TaxonomyDetailPage.jsx
+++ b/src/taxonomy/taxonomy-detail/TaxonomyDetailPage.jsx
@@ -1,4 +1,4 @@
-import React from 'react';
+import React, { useState } from 'react';
 import {
   Container,
   Layout,
@@ -11,6 +11,7 @@ import Header from '../../header';
 import SubHeader from '../../generic/sub-header/SubHeader';
 import TaxonomyDetailSideCard from './TaxonomyDetailSideCard';
 import TagListTable from './TagListTable';
+import ExportModal from '../modals/ExportModal';
 import { useTaxonomyDetailDataResponse, useTaxonomyDetailDataStatus } from '../api/hooks/selectors';
 
 const TaxonomyDetailContent = ({ taxonomyId }) => {
@@ -22,6 +23,8 @@ const TaxonomyDetailContent = ({ taxonomyId }) => {
 
   const { isError, isFetched, taxonomy } = useTaxonomyDetailData(taxonomyId);
 
+  const [isExportModalOpen, setIsExportModalOpen] = useState(false);
+
   if (isError) {
     return (
       <PermissionDeniedAlert />
@@ -34,6 +37,20 @@ const TaxonomyDetailContent = ({ taxonomyId }) => {
     );
   }
 
+  const renderModals = () => (
+    // eslint-disable-next-line react/jsx-no-useless-fragment
+    <>
+      {isExportModalOpen && (
+        <ExportModal
+          isOpen={isExportModalOpen}
+          onClose={() => setIsExportModalOpen(false)}
+          taxonomyId={taxonomyId}
+          taxonomyName={taxonomy.name}
+        />
+      )}
+    </>
+  );
+
   if (taxonomy) {
     return (
       <>
@@ -59,9 +76,9 @@ const TaxonomyDetailContent = ({ taxonomyId }) => {
             <Layout.Element>
               <TaxonomyDetailSideCard taxonomy={taxonomy} />
             </Layout.Element>
-
           </Layout>
         </div>
+        {renderModals()}
       </>
     );
   }