feat: wip

src/index.jsx

@@ -84,6 +84,9 @@ const App = () => {
               />
             </>
           )}
+          <Route>
+            No match (404)
+          </Route>
         </Switch>
       </QueryClientProvider>
     </AppProvider>

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;
 };

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()}

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()}
       </>
     );
   }