refactor: ADR refactor (WIP)

src/messages.js

@@ -10,14 +10,6 @@ const messages = defineMessages({
     id: 'authoring.alert.support.text',
     defaultMessage: 'Support Page',
   },
-  noResultsFoundMessage: {
-    id: 'authoring.table.noResultsFound.message',
-    defaultMessage: 'No results found',
-  },
-  actionsButtonLabel: {
-    id: 'authoring.action.button.label',
-    defaultMessage: 'Actions',
-  },
 });
 
 export default messages;

src/taxonomy/api/hooks/api.js

@@ -5,18 +5,10 @@ import { getAuthenticatedHttpClient } from '@edx/frontend-platform/auth';
 
 const getApiBaseUrl = () => getConfig().STUDIO_BASE_URL;
 const getTaxonomyListApiUrl = () => new URL('api/content_tagging/v1/taxonomies/?enabled=true', getApiBaseUrl()).href;
-const getExportTaxonomyApiUrl = (pk, format) => new URL(
+export const getExportTaxonomyApiUrl = (pk, format) => new URL(
   `api/content_tagging/v1/taxonomies/${pk}/export/?output_format=${format}&download=1`,
   getApiBaseUrl(),
 ).href;
-const getTaxonomyDetailApiUrl = (taxonomyId) => new URL(
-  `api/content_tagging/v1/taxonomies/${taxonomyId}/`,
-  getApiBaseUrl(),
-).href;
-const getTagListApiUrl = (taxonomyId, page) => new URL(
-  `api/content_tagging/v1/taxonomies/${taxonomyId}/tags/?page=${page + 1}`,
-  getApiBaseUrl(),
-).href;
 
 /**
  * @returns {import("../types.mjs").UseQueryResult}
@@ -32,31 +24,3 @@ export const useTaxonomyListData = () => (
 export const exportTaxonomy = (pk, format) => {
   window.location.href = getExportTaxonomyApiUrl(pk, format);
 };
-
-/**
- * @param {number} taxonomyId
- * @returns {import('@tanstack/react-query').UseQueryResult<import('../types.mjs').TaxonomyData>}
- */
-export const useTaxonomyDetailData = (taxonomyId) => (
-  useQuery({
-    queryKey: ['taxonomyDetail', taxonomyId],
-    queryFn: () => getAuthenticatedHttpClient().get(getTaxonomyDetailApiUrl(taxonomyId))
-      .then(camelCaseObject)
-      .then((response) => response.data),
-  })
-);
-
-/**
- * @param {number} taxonomyId
- * @param {import('../types.mjs').QueryOptions} options
- * @returns {import('@tanstack/react-query').UseQueryResult<import('../types.mjs').TaxonomyData>}
- */
-export const useTagListData = (taxonomyId, options) => {
-  const { pageIndex } = options;
-  return useQuery({
-    queryKey: ['tagList', taxonomyId, pageIndex],
-    queryFn: () => getAuthenticatedHttpClient().get(getTagListApiUrl(taxonomyId, pageIndex))
-      .then(camelCaseObject)
-      .then((response) => response.data),
-  });
-};

src/taxonomy/api/hooks/selectors.js

@@ -1,8 +1,6 @@
 // @ts-check
 import {
-  useTaxonomyDetailData,
   useTaxonomyListData,
-  useTagListData,
   exportTaxonomy,
 } from './api';
 
@@ -27,72 +25,3 @@ export const useIsTaxonomyListDataLoaded = () => (
 export const callExportTaxonomy = (pk, format) => (
   exportTaxonomy(pk, format)
 );
-
-/**
- * @param {number} taxonomyId
- * @returns {Pick<import('@tanstack/react-query').UseQueryResult, "error" | "isError" | "isFetched" | "isSuccess">}
- */
-export const useTaxonomyDetailDataStatus = (taxonomyId) => {
-  const {
-    isError,
-    error,
-    isFetched,
-    isSuccess,
-  } = useTaxonomyDetailData(taxonomyId);
-  return {
-    isError,
-    error,
-    isFetched,
-    isSuccess,
-  };
-};
-
-/**
- * @param {number} taxonomyId
- * @returns {import("../types.mjs").TaxonomyData | undefined}
- */
-export const useTaxonomyDetailDataResponse = (taxonomyId) => {
-  const { isSuccess, data } = useTaxonomyDetailData(taxonomyId);
-  if (isSuccess) {
-    return data;
-  }
-
-  return undefined;
-};
-
-/* eslint-disable max-len */
-/**
- * @param {number} taxonomyId
- * @param {import("../types.mjs").QueryOptions} options
- * @returns {Pick<import('@tanstack/react-query').UseQueryResult, "error" | "isError" | "isFetched" | "isLoading" | "isSuccess" >}
- */ /* eslint-enable max-len */
-export const useTagListDataStatus = (taxonomyId, options) => {
-  const {
-    error,
-    isError,
-    isFetched,
-    isLoading,
-    isSuccess,
-  } = useTagListData(taxonomyId, options);
-  return {
-    error,
-    isError,
-    isFetched,
-    isLoading,
-    isSuccess,
-  };
-};
-
-/**
- * @param {number} taxonomyId
- * @param {import("../types.mjs").QueryOptions} options
- * @returns {import("../types.mjs").TaxonomyData | undefined}
- */
-export const useTagListDataResponse = (taxonomyId, options) => {
-  const { isSuccess, data } = useTagListData(taxonomyId, options);
-  if (isSuccess) {
-    return data;
-  }
-
-  return undefined;
-};

src/taxonomy/api/hooks/selectors.test.js

@@ -1,17 +1,11 @@
 import {
   useTaxonomyListDataResponse,
   useIsTaxonomyListDataLoaded,
-  useTaxonomyDetailDataStatus,
-  useTaxonomyDetailDataResponse,
-  useTagListDataStatus,
-  useTagListDataResponse,
   callExportTaxonomy,
 } from './selectors';
 import {
   useTaxonomyListData,
   exportTaxonomy,
-  useTaxonomyDetailData,
-  useTagListData,
 } from './api';
 
 jest.mock('./api', () => ({
@@ -65,74 +59,3 @@ describe('callExportTaxonomy', () => {
     expect(exportTaxonomy).toHaveBeenCalled();
   });
 });
-
-describe('useTaxonomyDetailDataStatus', () => {
-  it('should return status values', () => {
-    const status = {
-      isError: false,
-      error: undefined,
-      isFetched: true,
-      isSuccess: true,
-    };
-
-    useTaxonomyDetailData.mockReturnValueOnce(status);
-
-    const result = useTaxonomyDetailDataStatus(0);
-
-    expect(result).toEqual(status);
-  });
-});
-
-describe('useTaxonomyDetailDataResponse', () => {
-  it('should return data when status is success', () => {
-    useTaxonomyDetailData.mockReturnValueOnce({ isSuccess: true, data: 'data' });
-
-    const result = useTaxonomyDetailDataResponse();
-
-    expect(result).toEqual('data');
-  });
-
-  it('should return undefined when status is not success', () => {
-    useTaxonomyDetailData.mockReturnValueOnce({ isSuccess: false });
-
-    const result = useTaxonomyDetailDataResponse();
-
-    expect(result).toBeUndefined();
-  });
-});
-
-describe('useTagListDataStatus', () => {
-  it('should return status values', () => {
-    const status = {
-      error: undefined,
-      isError: false,
-      isFetched: true,
-      isLoading: true,
-      isSuccess: true,
-    };
-
-    useTagListData.mockReturnValueOnce(status);
-
-    const result = useTagListDataStatus(0, {});
-
-    expect(result).toEqual(status);
-  });
-});
-
-describe('useTagListDataResponse', () => {
-  it('should return data when status is success', () => {
-    useTagListData.mockReturnValueOnce({ isSuccess: true, data: 'data' });
-
-    const result = useTagListDataResponse(0, {});
-
-    expect(result).toEqual('data');
-  });
-
-  it('should return undefined when status is not success', () => {
-    useTagListData.mockReturnValueOnce({ isSuccess: false });
-
-    const result = useTagListDataResponse(0, {});
-
-    expect(result).toBeUndefined();
-  });
-});

src/taxonomy/api/types.mjs

@@ -39,8 +39,3 @@
  * @property {Object} data
  * @property {string} status
  */
-
-/**
- * @typedef {Object} QueryOptions
- * @property {number} pageIndex
- */

src/taxonomy/messages.js

@@ -69,18 +69,6 @@ const messages = defineMessages({
     id: 'course-authoring.taxonomy-list.modal.cancel',
     defaultMessage: 'Cancel',
   },
-  taxonomyDetailsHeader: {
-    id: 'course-authoring.taxonomy-detail.side-card.header',
-    defaultMessage: 'Taxonomy details',
-  },
-  taxonomyDetailsName: {
-    id: 'course-authoring.taxonomy-detail.side-card.name',
-    defaultMessage: 'Title',
-  },
-  taxonomyDetailsDescription: {
-    id: 'course-authoring.taxonomy-detail.side-card.description',
-    defaultMessage: 'Description',
-  },
   tagListColumnValueHeader: {
     id: 'course-authoring.tag-list.column.value.header',
     defaultMessage: 'Value',

src/taxonomy/tag-list/data/api.js

@@ -0,0 +1,26 @@
+// @ts-check
+import { useQuery } from '@tanstack/react-query';
+import { camelCaseObject, getConfig } from '@edx/frontend-platform';
+import { getAuthenticatedHttpClient } from '@edx/frontend-platform/auth';
+
+const getApiBaseUrl = () => getConfig().STUDIO_BASE_URL;
+const getTagListApiUrl = (taxonomyId, page) => new URL(
+  `api/content_tagging/v1/taxonomies/${taxonomyId}/tags/?page=${page + 1}`,
+  getApiBaseUrl(),
+).href;
+
+// ToDo: fix types
+/**
+ * @param {number} taxonomyId
+ * @param {import('../types.mjs').QueryOptions} options
+ * @returns {import('@tanstack/react-query').UseQueryResult<import('../types.mjs').TaxonomyData>} 
+ */ // eslint-disable-next-line import/prefer-default-export
+export const useTagListData = (taxonomyId, options) => {
+  const { pageIndex } = options;
+  return useQuery({
+    queryKey: ['tagList', taxonomyId, pageIndex],
+    queryFn: () => getAuthenticatedHttpClient().get(getTagListApiUrl(taxonomyId, pageIndex))
+      .then(camelCaseObject)
+      .then((response) => response.data),
+  });
+};

src/taxonomy/tag-list/data/api.test.js

@@ -0,0 +1,27 @@
+import { useQuery } from '@tanstack/react-query';
+import {
+  useTagListData,
+} from './api';
+
+const mockHttpClient = {
+  get: jest.fn(),
+};
+
+jest.mock('@tanstack/react-query', () => ({
+  useQuery: jest.fn(),
+}));
+
+jest.mock('@edx/frontend-platform/auth', () => ({
+  getAuthenticatedHttpClient: jest.fn(() => mockHttpClient),
+}));
+
+describe('useTagListData', () => {
+  it('should call useQuery with the correct parameters', () => {
+    useTagListData('1', { pageIndex: 3 });
+
+    expect(useQuery).toHaveBeenCalledWith({
+      queryKey: ['tagList', '1', 3],
+      queryFn: expect.any(Function),
+    });
+  });
+});

src/taxonomy/tag-list/data/selectors.js

@@ -0,0 +1,42 @@
+// @ts-check
+import {
+  useTagListData,
+} from './api';
+
+/* eslint-disable max-len */
+/**
+ * @param {number} taxonomyId
+ * @param {import("../types.mjs").QueryOptions} options
+ * @returns {Pick<import('@tanstack/react-query').UseQueryResult, "error" | "isError" | "isFetched" | "isLoading" | "isSuccess" >}
+ */ /* eslint-enable max-len */
+export const useTagListDataStatus = (taxonomyId, options) => {
+  const {
+    error,
+    isError,
+    isFetched,
+    isLoading,
+    isSuccess,
+  } = useTagListData(taxonomyId, options);
+  return {
+    error,
+    isError,
+    isFetched,
+    isLoading,
+    isSuccess,
+  };
+};
+
+// ToDo: fix types
+/**
+ * @param {number} taxonomyId
+ * @param {import("../types.mjs").QueryOptions} options
+ * @returns {import("../types.mjs").TaxonomyData | undefined}
+ */
+export const useTagListDataResponse = (taxonomyId, options) => {
+  const { isSuccess, data } = useTagListData(taxonomyId, options);
+  if (isSuccess) {
+    return data;
+  }
+
+  return undefined;
+};