refactor: Move api to data to match with 0002 ADR

src/taxonomy/TaxonomyListPage.jsx

@@ -11,7 +11,7 @@ import Header from '../header';
 import SubHeader from '../generic/sub-header/SubHeader';
 import messages from './messages';
 import TaxonomyCard from './taxonomy-card';
-import { useTaxonomyListDataResponse, useIsTaxonomyListDataLoaded } from './api/hooks/selectors';
+import { useTaxonomyListDataResponse, useIsTaxonomyListDataLoaded } from './hooks';
 
 const TaxonomyListPage = () => {
   const intl = useIntl();

src/taxonomy/TaxonomyListPage.test.jsx

@@ -7,11 +7,11 @@ import { act, render } from '@testing-library/react';
 import initializeStore from '../store';
 
 import TaxonomyListPage from './TaxonomyListPage';
-import { useTaxonomyListDataResponse, useIsTaxonomyListDataLoaded } from './api/hooks/selectors';
+import { useTaxonomyListDataResponse, useIsTaxonomyListDataLoaded } from './hooks';
 
 let store;
 
-jest.mock('./api/hooks/selectors', () => ({
+jest.mock('./hooks', () => ({
   useTaxonomyListDataResponse: jest.fn(),
   useIsTaxonomyListDataLoaded: jest.fn(),
 }));

src/taxonomy/__mocks__/index.js

@@ -0,0 +1,2 @@
+// eslint-disable-next-line import/prefer-default-export
+export { default as taxonomyListMock } from './taxonomyListMock';

src/taxonomy/__mocks__/taxonomyListMock.js

@@ -0,0 +1,50 @@
+module.exports = {
+  next: null,
+  previous: null,
+  count: 4,
+  numPages: 1,
+  currentPage: 1,
+  start: 0,
+  results: [
+    {
+      id: -2,
+      name: 'Content Authors',
+      description: 'Allows tags for any user ID created on the instance.',
+      enabled: true,
+      allowMultiple: false,
+      allowFreeText: false,
+      systemDefined: true,
+      visibleToAuthors: false,
+    },
+    {
+      id: -1,
+      name: 'Languages',
+      description: 'lang lang lang lang lang lang lang lang',
+      enabled: true,
+      allowMultiple: false,
+      allowFreeText: false,
+      systemDefined: true,
+      visibleToAuthors: true,
+    },
+    {
+      id: 1,
+      name: 'Taxonomy',
+      description: 'This is a Description',
+      enabled: true,
+      allowMultiple: false,
+      allowFreeText: false,
+      systemDefined: false,
+      visibleToAuthors: true,
+    },
+    {
+      id: 2,
+      name: 'Taxonomy long long long long long long long long long long long long long long long long long long long',
+      description: 'This is a Description long lon',
+      enabled: true,
+      allowMultiple: false,
+      allowFreeText: false,
+      systemDefined: false,
+      visibleToAuthors: true,
+    },
+  ],
+};

src/taxonomy/data/api.js

@@ -0,0 +1,29 @@
+// @ts-check
+import { camelCaseObject, getConfig } from '@edx/frontend-platform';
+import { getAuthenticatedHttpClient } from '@edx/frontend-platform/auth';
+
+const getApiBaseUrl = () => getConfig().STUDIO_BASE_URL;
+export const getTaxonomyListApiUrl = () => new URL('api/content_tagging/v1/taxonomies/?enabled=true', getApiBaseUrl()).href;
+export const getExportTaxonomyApiUrl = (pk, format) => new URL(
+  `api/content_tagging/v1/taxonomies/${pk}/export/?output_format=${format}&download=1`,
+  getApiBaseUrl(),
+).href;
+
+/**
+ * Get list of taxonomies.
+ * @returns {Promise<Object>}
+ */
+export async function getTaxonomyListData() {
+  const { data } = await getAuthenticatedHttpClient().get(getTaxonomyListApiUrl());
+  return camelCaseObject(data);
+}
+
+/**
+ * Downloads the file of the exported taxonomy
+ * @param {number} pk
+ * @param {string} format
+ * @returns {void}
+ */
+export function getTaxonomyExportFile(pk, format) {
+  window.location.href = getExportTaxonomyApiUrl(pk, format);
+}

src/taxonomy/data/api.test.js

@@ -0,0 +1,61 @@
+import MockAdapter from 'axios-mock-adapter';
+import { initializeMockApp } from '@edx/frontend-platform';
+import { getAuthenticatedHttpClient } from '@edx/frontend-platform/auth';
+
+import { taxonomyListMock } from '../__mocks__';
+
+import {
+  getTaxonomyListApiUrl,
+  getExportTaxonomyApiUrl,
+  getTaxonomyListData,
+  getTaxonomyExportFile,
+} from './api';
+
+let axiosMock;
+
+describe('taxonomy api calls', () => {
+  const { location } = window;
+  beforeEach(() => {
+    initializeMockApp({
+      authenticatedUser: {
+        userId: 3,
+        username: 'abc123',
+        administrator: true,
+        roles: [],
+      },
+    });
+    axiosMock = new MockAdapter(getAuthenticatedHttpClient());
+  });
+
+  afterEach(() => {
+    jest.clearAllMocks();
+  });
+
+  beforeAll(() => {
+    delete window.location;
+    window.location = {
+      href: '',
+    };
+  });
+
+  afterAll(() => {
+    window.location = location;
+  });
+
+  it('should get taxonomy list data', async () => {
+    axiosMock.onGet(getTaxonomyListApiUrl()).reply(200, taxonomyListMock);
+    const result = await getTaxonomyListData();
+
+    expect(axiosMock.history.get[0].url).toEqual(getTaxonomyListApiUrl());
+    expect(result).toEqual(taxonomyListMock);
+  });
+
+  it('should set window.location.href correctly', () => {
+    const pk = 1;
+    const format = 'json';
+
+    getTaxonomyExportFile(pk, format);
+
+    expect(window.location.href).toEqual(getExportTaxonomyApiUrl(pk, format));
+  });
+});

src/taxonomy/data/thunks.js

@@ -0,0 +1,14 @@
+// @ts-check
+import { getTaxonomyExportFile } from './api';
+
+/**
+ * Downloads the file of the exported taxonomy
+ * @param {number} pk
+ * @param {string} format
+ * @returns {void}
+ */
+const exportTaxonomy = (pk, format) => (
+  getTaxonomyExportFile(pk, format)
+);
+
+export default exportTaxonomy;

src/taxonomy/export-modal/ExportModal.test.jsx

@@ -5,14 +5,15 @@ import { AppProvider } from '@edx/frontend-platform/react';
 import { render, fireEvent } from '@testing-library/react';
 import ExportModal from '.';
 import initializeStore from '../../store';
-import { callExportTaxonomy } from '../api/hooks/selectors';
+import exportTaxonomy from '../data/thunks';
 
 const onClose = jest.fn();
 let store;
 const taxonomyId = 1;
 
-jest.mock('../api/hooks/selectors', () => ({
-  callExportTaxonomy: jest.fn(),
+jest.mock('../data/thunks', () => ({
+  __esModule: true,
+  default: jest.fn(),
 }));
 
 const ExportModalComponent = () => (
@@ -48,6 +49,6 @@ describe('<ExportModal />', async () => {
     fireEvent.click(getByText('Export'));
 
     expect(onClose).toHaveBeenCalled();
-    expect(callExportTaxonomy).toHaveBeenCalledWith(taxonomyId, 'json');
+    expect(exportTaxonomy).toHaveBeenCalledWith(taxonomyId, 'json');
   });
 });

src/taxonomy/export-modal/index.jsx

@@ -8,7 +8,7 @@ import {
 import PropTypes from 'prop-types';
 import { useIntl } from '@edx/frontend-platform/i18n';
 import messages from './messages';
-import { callExportTaxonomy } from '../api/hooks/selectors';
+import exportTaxonomy from '../data/thunks';
 
 const ExportModal = ({
   taxonomyId,
@@ -20,7 +20,7 @@ const ExportModal = ({
 
   const onClickExport = () => {
     onClose();
-    callExportTaxonomy(taxonomyId, outputFormat);
+    exportTaxonomy(taxonomyId, outputFormat);
   };
 
   return (

src/taxonomy/hooks.jsx

@@ -0,0 +1,34 @@
+// @ts-check
+import { useQuery } from '@tanstack/react-query';
+import { getTaxonomyListData } from './data/api';
+
+/**
+ * Builds the query yo get the taxonomy list
+ * @returns {import("./data/types.mjs").UseQueryResult}
+ */
+const useTaxonomyListData = () => (
+  useQuery({
+    queryKey: ['taxonomyList'],
+    queryFn: getTaxonomyListData,
+  })
+);
+
+/**
+ * Gets the taxonomy list data
+ * @returns {import("./data/types.mjs").TaxonomyListData | undefined}
+ */
+export const useTaxonomyListDataResponse = () => {
+  const response = useTaxonomyListData();
+  if (response.status === 'success') {
+    return response.data;
+  }
+  return undefined;
+};
+
+/**
+ * Returns the status of the taxonomy list query
+ * @returns {boolean}
+ */
+export const useIsTaxonomyListDataLoaded = () => (
+  useTaxonomyListData().status === 'success'
+);