dce-reactkit 4.3.4 → 5.0.0

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "dce-reactkit",
-  "version": "4.3.4",
+  "version": "5.0.0",
   "description": "Shared components for Harvard DCE apps",
   "main": "dist/cjs/index.js",
   "module": "dist/esm/index.js",
@@ -24,7 +24,7 @@
   },
   "homepage": "https://github.com/harvard-edtech/dce-reactkit#readme",
   "dependencies": {
-    "nanoclone": "^1.0.2",
+    "dce-commonkit": "^5.0.0",
     "react-select": "^5.7.3"
   },
   "peerDependencies": {
@@ -33,7 +33,8 @@
     "@fortawesome/free-solid-svg-icons": "^x.x.x",
     "@fortawesome/react-fontawesome": "^x.x.x",
     "bootstrap": "^5.x.x",
-    "react": "^x.x.x"
+    "react": "^x.x.x",
+    "react-dom": "^x.x.x"
   },
   "devDependencies": {
     "@rollup/plugin-commonjs": "^22.0.0",

package/src/components/AppWrapper.tsx

@@ -10,24 +10,27 @@ import React, { useState } from 'react';
 // Import FontAwesome
 import { faHourglassEnd } from '@fortawesome/free-solid-svg-icons';
 
+// Import commonkit
+import {
+  LogBuiltInMetadata,
+  ErrorWithCode,
+  waitMs,
+  CommonKitErrorCode,
+} from 'dce-commonkit';
+
 // Import shared components
 import ErrorBox from './ErrorBox';
 
 // Import shared types
-import ReactKitErrorCode from '../types/ReactKitErrorCode';
 import ModalButtonType from '../types/ModalButtonType';
 import ModalType from '../types/ModalType';
 import Variant from '../types/Variant';
-import LogBuiltInMetadata from '../types/LogBuiltInMetadata';
 
 // Import shared components
 // TODO: fix dependency cycle
 // eslint-disable-next-line import/no-cycle
 import ModalForWrapper from './Modal';
 
-// Import custom errors
-import ErrorWithCode from '../errors/ErrorWithCode';
-
 // Import other helpers
 // TODO: fix dependency cycle
 // eslint-disable-next-line import/no-cycle
@@ -38,7 +41,6 @@ import {
   getSessionExpiredMessage,
   isDarkModeOn,
 } from '../helpers/initClient';
-import waitMs from '../helpers/waitMs';
 
 // Import constants
 import NUM_MODAL_PORTALS from '../constants/NUM_MODAL_PORTALS';
@@ -413,8 +415,8 @@ export const showFatalError = async (
   );
   const code: string = (
     typeof error === 'string'
-      ? ReactKitErrorCode.NoCode
-      : String(error.code ?? ReactKitErrorCode.NoCode)
+      ? CommonKitErrorCode.NoCode
+      : String(error.code ?? CommonKitErrorCode.NoCode)
   );
 
   // Call all fatal error listeners
@@ -856,11 +858,11 @@ const AppWrapper: React.FC<Props> = (props: Props): React.ReactElement => {
       sessionHasExpired
         ? new ErrorWithCode(
           getSessionExpiredMessage(),
-          ReactKitErrorCode.SessionExpired,
+          CommonKitErrorCode.SessionExpired,
         )
         : new ErrorWithCode(
           (fatalErrorMessage ?? 'An unknown error has occurred. Please contact support.'),
-          (fatalErrorCode ?? ReactKitErrorCode.NoCode),
+          (fatalErrorCode ?? CommonKitErrorCode.NoCode),
         )
     );
 

package/src/components/AutoscrollToBottomContainer.tsx

@@ -16,12 +16,14 @@ import {
   faChevronDown,
 } from '@fortawesome/free-solid-svg-icons';
 
+// Import commonkit
+import {
+  idify,
+} from 'dce-commonkit';
+
 // Import shared types
 import Variant from '../types/Variant';
 
-// Import shared helper
-import idify from '../helpers/idify';
-
 /*------------------------------------------------------------------------*/
 /* -------------------------------- Types ------------------------------- */
 /*------------------------------------------------------------------------*/

package/src/components/CopiableBox.tsx

@@ -10,9 +10,13 @@ import React, { useReducer } from 'react';
 import { FontAwesomeIcon } from '@fortawesome/react-fontawesome';
 import { faClipboard } from '@fortawesome/free-solid-svg-icons';
 
+// Import commonkit
+import {
+  waitMs,
+} from 'dce-commonkit';
+
 // Import other reactkit functions
 import { alert } from './AppWrapper';
-import waitMs from '../helpers/waitMs';
 
 /*------------------------------------------------------------------------*/
 /* -------------------------------- Types ------------------------------- */

package/src/components/DBEntryManagerPanel/helpers/generateEndpointPath.ts

@@ -5,12 +5,12 @@
  * @param [adminsOnly] true if the endpoint is for admins only
  * @returns the endpoint path
  */
-const generateEndpointPath = (collectionName: string, adminsOnly?: boolean) => {
+const generateEndpointPath = (collectionName: string, adminsOnly: boolean = true) => {
   // Determine prefix based on whether the endpoint is for admins only
   const userPath = adminsOnly ? 'admin' : 'ttm';
 
   // Return the endpoint path
-  return `/api/${userPath}/dce-reactkit/dbeditor/${collectionName}`;
+  return `/api/${userPath}/dce-commonkit/dbeditor/${collectionName}`;
 };
 
 export default generateEndpointPath;

package/src/components/ErrorBox.tsx

@@ -11,8 +11,12 @@ import { FontAwesomeIcon } from '@fortawesome/react-fontawesome';
 import { faExclamationTriangle } from '@fortawesome/free-solid-svg-icons';
 import { IconProp } from '@fortawesome/fontawesome-svg-core';
 
+// Import commonkit
+import {
+  CommonKitErrorCode,
+} from 'dce-commonkit';
+
 // Import shared types
-import ReactKitErrorCode from '../types/ReactKitErrorCode';
 import Variant from '../types/Variant';
 
 /*------------------------------------------------------------------------*/
@@ -82,7 +86,7 @@ const ErrorBox: React.FC<Props> = (props) => {
         >
           code:
           {' '}
-          {String((error as any).code ?? ReactKitErrorCode.NoCode).toUpperCase()}
+          {String((error as any).code ?? CommonKitErrorCode.NoCode).toUpperCase()}
         </span>
       </span>
     );

package/src/components/IntelliTable.tsx

@@ -17,14 +17,16 @@ import {
   faMinus,
 } from '@fortawesome/free-solid-svg-icons';
 
+// Import commonkit
+import {
+  ParamType,
+  roundToNumDecimals,
+  genCSV,
+} from 'dce-commonkit';
+
 // Import shared types
-import ParamType from '../types/ParamType';
 import IntelliTableColumn from '../types/IntelliTableColumn';
 
-// Import shared helpers
-import roundToNumDecimals from '../helpers/roundToNumDecimals';
-import genCSV from '../helpers/genCSV';
-
 // Import shared components
 import Modal from './Modal';
 import ModalType from '../types/ModalType';

package/src/components/LogReviewer.tsx

@@ -19,32 +19,35 @@ import {
   faSearch,
 } from '@fortawesome/free-solid-svg-icons';
 
+// Import commonkit
+import {
+  getTimeInfoInET,
+  getHumanReadableDate,
+  LOG_REVIEW_GET_LOGS_ROUTE,
+  Log,
+  LogMetadataType,
+  LogSource,
+  LogType,
+  LogAction,
+  ParamType,
+  LogBuiltInMetadata,
+  LogMetadataContextMap,
+  LogMetadataTargetMap,
+  cloneDeep,
+  LogReviewerFilterState,
+  DateFilterState,
+  ContextFilterState,
+  TagFilterState,
+  ActionErrorFilterState,
+  AdvancedFilterState,
+} from 'dce-commonkit';
+
 // Import shared helpers
 import visitServerEndpoint from '../helpers/visitServerEndpoint';
-import getTimeInfoInET from '../helpers/getTimeInfoInET';
 import { alert, showFatalError } from './AppWrapper';
-import getHumanReadableDate from '../helpers/getHumanReadableDate';
-
-// Import shared constants
-import LOG_REVIEW_GET_LOGS_ROUTE from '../constants/LOG_REVIEW_GET_LOGS_ROUTE';
 
 // Import shared types
-import Log from '../types/Log';
-import LogMetadataType from '../types/LogMetadataType';
-import LogSource from '../types/LogSource';
-import LogType from '../types/LogType';
-import LogAction from '../types/LogAction';
-import ParamType from '../types/ParamType';
 import IntelliTableColumn from '../types/IntelliTableColumn';
-import LogBuiltInMetadata from '../types/LogBuiltInMetadata';
-import LogMetadataContextMap from '../types/LogMetadataContextMap';
-import LogMetadataTargetMap from '../types/LogMetadataTargetMap';
-import LogReviewerFilterState from '../types/LogReviewerFilterState';
-import DateFilterState from '../types/LogReviewerFilterState/DateFilterState';
-import ContextFilterState from '../types/LogReviewerFilterState/ContextFilterState';
-import TagFilterState from '../types/LogReviewerFilterState/TagFilterState';
-import ActionErrorFilterState from '../types/LogReviewerFilterState/ActionErrorFilterState';
-import AdvancedFilterState from '../types/LogReviewerFilterState/AdvancedFilterState';
 import Variant from '../types/Variant';
 
 // Import shared components
@@ -59,7 +62,6 @@ import RadioButton from './RadioButton';
 import ButtonInputGroup from './ButtonInputGroup';
 import IntelliTable from './IntelliTable';
 import Pagination from './Pagination';
-import cloneDeep from '../helpers/cloneDeep';
 
 /*------------------------------------------------------------------------*/
 /* -------------------------------- Types ------------------------------- */

package/src/components/Modal/index.tsx

@@ -13,12 +13,14 @@
 import React, { useState, useEffect, useRef } from 'react';
 import ReactDOM from 'react-dom';
 
+// Import commonkit
+import {
+  waitMs,
+} from 'dce-commonkit';
+
 // Import other components
 import LoadingSpinner from '../LoadingSpinner';
 
-// Import helpers
-import waitMs from '../../helpers/waitMs';
-
 // Import types
 import Variant from '../../types/Variant';
 import ModalButtonType from '../../types/ModalButtonType';

package/src/components/MultiSwitch.tsx

@@ -12,8 +12,12 @@ import React, { useReducer } from 'react';
 import { FontAwesomeIcon } from '@fortawesome/react-fontawesome';
 import { IconProp } from '@fortawesome/fontawesome-svg-core';
 
+// Import commonkit
+import {
+  idify,
+} from 'dce-commonkit';
+
 // Import shared helpers
-import idify from '../helpers/idify';
 import combineClassNames from '../helpers/combineClassNames';
 
 /*------------------------------------------------------------------------*/

package/src/components/Shimmer.tsx

@@ -8,8 +8,10 @@
 // Import React
 import React, { useRef, useEffect } from 'react';
 
-// Import helpers
-import waitMs from '../helpers/waitMs';
+// Import commonkit
+import {
+  waitMs,
+} from 'dce-commonkit';
 
 /*------------------------------------------------------------------------*/
 /* -------------------------------- Types ------------------------------- */

package/src/components/SimpleDateChooser.tsx

@@ -7,20 +7,18 @@
 // Import React
 import React, { useReducer } from 'react';
 
+// Import commonkit
+import {
+  getOrdinal,
+  getMonthName,
+  getTimeInfoInET,
+  ErrorWithCode,
+  CommonKitErrorCode,
+} from 'dce-commonkit';
+
 // Import AppWrapper helpers
 import { confirm } from './AppWrapper';
 
-// Import helpers
-import getOrdinal from '../helpers/getOrdinal';
-import getMonthName from '../helpers/getMonthName';
-import getTimeInfoInET from '../helpers/getTimeInfoInET';
-
-// Import classes
-import ErrorWithCode from '../errors/ErrorWithCode';
-
-// Import types
-import ReactKitErrorCode from '../types/ReactKitErrorCode';
-
 /*------------------------------------------------------------------------*/
 /* -------------------------------- Types ------------------------------- */
 /*------------------------------------------------------------------------*/
@@ -153,7 +151,7 @@ const getChoices = (
   if (dontAllowPast && dontAllowFuture) {
     throw new ErrorWithCode(
       'No past or future dates allowed',
-      ReactKitErrorCode.SimpleDateChooserInvalidDateRange,
+      CommonKitErrorCode.SimpleDateChooserInvalidDateRange,
     );
   }
 
@@ -161,7 +159,7 @@ const getChoices = (
   if (numMonthsToShow <= 0) {
     throw new ErrorWithCode(
       'numMonthsToShow must be positive',
-      ReactKitErrorCode.SimpleDateChooserInvalidNumMonths,
+      CommonKitErrorCode.SimpleDateChooserInvalidNumMonths,
     );
   }
 

package/src/components/SimpleTimeChooser.tsx

@@ -6,8 +6,10 @@
 // Import React
 import React from 'react';
 
-// Import helpers
-import padZerosLeft from '../helpers/padZerosLeft';
+// Import commonkit
+import {
+  padZerosLeft,
+} from 'dce-commonkit';
 
 /*------------------------------------------------------------------------*/
 /* -------------------------------- Types ------------------------------- */

package/src/helpers/canReviewLogs.test.ts

@@ -3,15 +3,17 @@
  * @author Gabe Abrams
  */
 
+// Import commonkit
+import {
+  LOG_REVIEW_STATUS_ROUTE,
+} from 'dce-commonkit';
+
 // Import dce-reactkit
 import stubServerEndpoint from './stubServerEndpoint';
 
 // Import main function
 import canReviewLogs, { resetCanReviewCache } from './canReviewLogs';
 
-// Import shared constants
-import LOG_REVIEW_STATUS_ROUTE from '../constants/LOG_REVIEW_STATUS_ROUTE';
-
 describe('helpers > canReviewLogs', () => {
   beforeEach(() => {
     // Reset the cache

package/src/helpers/canReviewLogs.ts

@@ -1,9 +1,11 @@
+// Import commonkit
+import {
+  LOG_REVIEW_STATUS_ROUTE,
+} from 'dce-commonkit';
+
 // Import shared helpers
 import visitServerEndpoint from './visitServerEndpoint';
 
-// Import shared constants
-import LOG_REVIEW_STATUS_ROUTE from '../constants/LOG_REVIEW_STATUS_ROUTE';
-
 /*------------------------------------------------------------------------*/
 /* -------------------------------- Cache ------------------------------- */
 /*------------------------------------------------------------------------*/

package/src/helpers/initClient.tsx

@@ -1,15 +1,15 @@
+// Import commonkit
+import {
+  waitMs,
+  ErrorWithCode,
+  CommonKitErrorCode,
+} from 'dce-commonkit';
+
 // Import other components
 // TODO: fix dependency cycle
 // eslint-disable-next-line import/no-cycle
 import { showFatalError } from '../components/AppWrapper';
 
-// Import other helpers
-import waitMs from './waitMs';
-
-// Import shared types
-import ErrorWithCode from '../errors/ErrorWithCode';
-import ReactKitErrorCode from '../types/ReactKitErrorCode';
-
 /*----------------------------------------*/
 /* ---------------- Types --------------- */
 /*----------------------------------------*/
@@ -80,7 +80,7 @@ export const getSendRequest = async () => {
       showFatalError(
         new ErrorWithCode(
           'Could not send a request because the request needed to be sent before dce-reactkit was properly initialized. Perhaps dce-reactkit was not initialized with initClient.',
-          ReactKitErrorCode.NoCACCLSendRequestFunction,
+          CommonKitErrorCode.NoCACCLSendRequestFunction,
         ),
       );
     }

package/src/helpers/isMobileOrTablet.tsx

@@ -1,5 +1,5 @@
 // True if user is on mobile or tablet
-let cachedResult: boolean | undefined = undefined;
+let cachedResult: boolean | undefined;
 
 /**
  * Check if the user is on a mobile device or tablet
@@ -13,6 +13,7 @@ const isMobileOrTablet = () => {
 
   try {
     let check = false;
+    // eslint-disable-next-line max-len, no-useless-escape
     ((a) => { if (/(android|bb\d+|meego).+mobile|avantgo|bada\/|blackberry|blazer|compal|elaine|fennec|hiptop|iemobile|ip(hone|od)|iris|kindle|lge |maemo|midp|mmp|mobile.+firefox|netfront|opera m(ob|in)i|palm( os)?|phone|p(ixi|re)\/|plucker|pocket|psp|series(4|6)0|symbian|treo|up\.(browser|link)|vodafone|wap|windows ce|xda|xiino|android|ipad|playbook|silk/i.test(a) || /1207|6310|6590|3gso|4thp|50[1-6]i|770s|802s|a wa|abac|ac(er|oo|s\-)|ai(ko|rn)|al(av|ca|co)|amoi|an(ex|ny|yw)|aptu|ar(ch|go)|as(te|us)|attw|au(di|\-m|r |s )|avan|be(ck|ll|nq)|bi(lb|rd)|bl(ac|az)|br(e|v)w|bumb|bw\-(n|u)|c55\/|capi|ccwa|cdm\-|cell|chtm|cldc|cmd\-|co(mp|nd)|craw|da(it|ll|ng)|dbte|dc\-s|devi|dica|dmob|do(c|p)o|ds(12|\-d)|el(49|ai)|em(l2|ul)|er(ic|k0)|esl8|ez([4-7]0|os|wa|ze)|fetc|fly(\-|_)|g1 u|g560|gene|gf\-5|g\-mo|go(\.w|od)|gr(ad|un)|haie|hcit|hd\-(m|p|t)|hei\-|hi(pt|ta)|hp( i|ip)|hs\-c|ht(c(\-| |_|a|g|p|s|t)|tp)|hu(aw|tc)|i\-(20|go|ma)|i230|iac( |\-|\/)|ibro|idea|ig01|ikom|im1k|inno|ipaq|iris|ja(t|v)a|jbro|jemu|jigs|kddi|keji|kgt( |\/)|klon|kpt |kwc\-|kyo(c|k)|le(no|xi)|lg( g|\/(k|l|u)|50|54|\-[a-w])|libw|lynx|m1\-w|m3ga|m50\/|ma(te|ui|xo)|mc(01|21|ca)|m\-cr|me(rc|ri)|mi(o8|oa|ts)|mmef|mo(01|02|bi|de|do|t(\-| |o|v)|zz)|mt(50|p1|v )|mwbp|mywa|n10[0-2]|n20[2-3]|n30(0|2)|n50(0|2|5)|n7(0(0|1)|10)|ne((c|m)\-|on|tf|wf|wg|wt)|nok(6|i)|nzph|o2im|op(ti|wv)|oran|owg1|p800|pan(a|d|t)|pdxg|pg(13|\-([1-8]|c))|phil|pire|pl(ay|uc)|pn\-2|po(ck|rt|se)|prox|psio|pt\-g|qa\-a|qc(07|12|21|32|60|\-[2-7]|i\-)|qtek|r380|r600|raks|rim9|ro(ve|zo)|s55\/|sa(ge|ma|mm|ms|ny|va)|sc(01|h\-|oo|p\-)|sdk\/|se(c(\-|0|1)|47|mc|nd|ri)|sgh\-|shar|sie(\-|m)|sk\-0|sl(45|id)|sm(al|ar|b3|it|t5)|so(ft|ny)|sp(01|h\-|v\-|v )|sy(01|mb)|t2(18|50)|t6(00|10|18)|ta(gt|lk)|tcl\-|tdg\-|tel(i|m)|tim\-|t\-mo|to(pl|sh)|ts(70|m\-|m3|m5)|tx\-9|up(\.b|g1|si)|utst|v400|v750|veri|vi(rg|te)|vk(40|5[0-3]|\-v)|vm40|voda|vulc|vx(52|53|60|61|70|80|81|83|85|98)|w3c(\-| )|webc|whit|wi(g |nc|nw)|wmlb|wonu|x700|yas\-|your|zeto|zte\-/i.test(a.substr(0, 4))) check = true; })((navigator ?? {}).userAgent || (navigator ?? {}).vendor || ((window as any) ?? {}).opera);
     cachedResult = check;
     return cachedResult;

package/src/helpers/isSelectAdmin.ts

@@ -1,5 +1,7 @@
-// Import shared constants
-import SELECT_ADMIN_CHECK_ROUTE from '../constants/SELECT_ADMIN_CHECK_ROUTE';
+// Import commonkit
+import {
+  SELECT_ADMIN_CHECK_ROUTE,
+} from 'dce-commonkit';
 
 // Import shared helpers
 import visitServerEndpoint from './visitServerEndpoint';

package/src/helpers/logClientEvent.tsx

@@ -1,8 +1,10 @@
-// Import shared types
-import LOG_ROUTE_PATH from '../constants/LOG_ROUTE_PATH';
-import LogBuiltInMetadata from '../types/LogBuiltInMetadata';
-import LogFunction from '../types/LogFunction';
-import LogLevel from '../types/LogLevel';
+// Import commonkit
+import {
+  LOG_ROUTE_PATH,
+  LogBuiltInMetadata,
+  LogFunction,
+  LogLevel,
+} from 'dce-commonkit';
 
 // Import shared functions
 // TODO: fix dependency cycle

package/src/helpers/stubServerEndpoint.tsx

@@ -1,4 +1,4 @@
-import { _setStubResponse } from './visitServerEndpoint'
+import { _setStubResponse } from './visitServerEndpoint';
 
 /**
  * Stub a server endpoint response

package/src/helpers/visitServerEndpoint.tsx

@@ -1,8 +1,11 @@
+// Import commonkit
+import {
+  ErrorWithCode,
+  CommonKitErrorCode,
+} from 'dce-commonkit';
+
 /* eslint-disable no-underscore-dangle */
 /* eslint-disable @typescript-eslint/naming-convention */
-// Import custom error
-import ErrorWithCode from '../errors/ErrorWithCode';
-import ReactKitErrorCode from '../types/ReactKitErrorCode';
 
 // Import helpers
 // TODO: fix dependency cycle
@@ -62,7 +65,7 @@ export const _setStubResponse = (
   } = opts;
   const method = (opts.method ?? 'GET').toUpperCase();
   const errorMessage = (opts.errorMessage ?? 'An unknown error has occurred.');
-  const errorCode = (opts.errorCode ?? ReactKitErrorCode.NoCode);
+  const errorCode = (opts.errorCode ?? CommonKitErrorCode.NoCode);
 
   // Store to stub responses
   if (!stubResponses[method]) {
@@ -162,12 +165,12 @@ const visitServerEndpoint = async (
   if (!response || !response.body) {
     throw new ErrorWithCode(
       'We didn\'t get a response from the server. Please check your internet connection.',
-      ReactKitErrorCode.NoResponse,
+      CommonKitErrorCode.NoResponse,
     );
   }
   if (!response.body.success) {
     // Session expired
-    if (response.body.code === ReactKitErrorCode.SessionExpired) {
+    if (response.body.code === CommonKitErrorCode.SessionExpired) {
       showSessionExpiredMessage();
 
       // Never return (don't continue execution)
@@ -184,7 +187,7 @@ const visitServerEndpoint = async (
       ),
       (
         response.body.code
-        || ReactKitErrorCode.NoCode
+        || CommonKitErrorCode.NoCode
       ),
     );
   }

package/src/html/genErrorPage.ts

@@ -1,5 +1,7 @@
-// Import shared types
-import ReactKitErrorCode from '../types/ReactKitErrorCode';
+// Import commonkit
+import {
+  CommonKitErrorCode,
+} from 'dce-commonkit';
 
 /**
  * Generate a static error page
@@ -8,7 +10,7 @@ import ReactKitErrorCode from '../types/ReactKitErrorCode';
  * @param [opts.title=An Error Occurred] title of the error box
  * @param [opts.description=An unknown server error occurred. Please contact support.]
  *   a human-readable description of the error
- * @param [opts.code=ReactKitErrorCode.NoCode] error code to show
+ * @param [opts.code=CommonKitErrorCode.NoCode] error code to show
  * @param [opts.pageTitle=opts.title] title of the page/tab if it differs from
  *   the title of the error
  * @returns html of the page
@@ -27,7 +29,7 @@ const genErrorPage = (
     opts.description
     ?? 'An unknown server error occurred. Please contact support.'
   );
-  const code = (opts.code ?? ReactKitErrorCode.NoCode);
+  const code = (opts.code ?? CommonKitErrorCode.NoCode);
 
   return `
 <head>