dce-reactkit 3.2.9 → 3.3.1

package/dist/esm/types/client/initClient.d.ts

@@ -0,0 +1,55 @@
+/**
+ * Type of CACCL's send request function
+ * @author Gabe Abrams
+ */
+declare type SendRequestFunction = (opts: {
+    path: string;
+    method: ('GET' | 'POST' | 'DELETE' | 'PUT');
+    params?: {
+        [x: string]: any;
+    } | undefined;
+    headers?: {
+        [x: string]: any;
+    } | undefined;
+    numRetries?: number | undefined;
+}) => Promise<{
+    body: any;
+    status: number;
+    headers: {
+        [x: string]: any;
+    };
+}>;
+/**
+ * Get the send request function
+ * @author Gabe Abrams
+ * @returns sendRequest function
+ */
+export declare const getSendRequest: () => SendRequestFunction;
+declare let dark: boolean | undefined;
+/**
+ * Get the current dark/light theme
+ * @author Gabe Abrams
+ * @returns true if the app has a dark theme
+ */
+export declare const darkModeIsOn: () => boolean;
+declare let sessionExpiredMessage: string | undefined;
+/**
+ * Get the custom session expired message
+ * @author Gabe Abrams
+ * @returns session expired message
+ */
+export declare const getSessionExpiredMessage: () => string;
+/**
+ * Initialize the client-side version of reactkit
+ * @author Gabe Abrams
+ * @param opts object containing all arguments
+ * @param opts.sendRequest caccl send request functions
+ * @param [opts.dark] if true, the app is a dark-themed app
+ * @param [opts.sessionExpiredMessage] a custom session expired message
+ */
+declare const initClient: (opts: {
+    sendRequest: SendRequestFunction;
+    dark?: boolean;
+    sessionExpiredMessage?: string;
+}) => void;
+export default initClient;

package/dist/esm/types/components/AppWrapper.d.ts

@@ -7,34 +7,7 @@ import React from 'react';
 import Variant from '../types/Variant';
 declare type Props = {
     children: React.ReactNode;
-    sendRequest: SendRequestFunction;
-    dark?: boolean;
-    sessionExpiredMessage?: string;
 };
-declare type SendRequestFunction = (opts: {
-    path: string;
-    method: ('GET' | 'POST' | 'DELETE' | 'PUT');
-    params?: {
-        [x: string]: any;
-    } | undefined;
-    headers?: {
-        [x: string]: any;
-    } | undefined;
-    numRetries?: number | undefined;
-}) => Promise<{
-    body: any;
-    status: number;
-    headers: {
-        [x: string]: any;
-    };
-}>;
-/**
- * Send a request using caccl's send request feature
- * @author Gabe Abrams
- * @param opts send request options
- * @returns send request response
- */
-export declare const cacclSendRequest: SendRequestFunction;
 /**
  * Show an alert modal with an "Okay" button
  * @author Gabe Abrams

package/dist/esm/types/index.d.ts

@@ -21,6 +21,7 @@ import MINUTE_IN_MS from './constants/MINUTE_IN_MS';
 import HOUR_IN_MS from './constants/HOUR_IN_MS';
 import DAY_IN_MS from './constants/DAY_IN_MS';
 import DynamicWord from './dynamicConstants/DynamicWord';
+import initClient from './client/initClient';
 import abbreviate from './helpers/abbreviate';
 import avg from './helpers/avg';
 import ceilToNumDecimals from './helpers/ceilToNumDecimals';
@@ -68,4 +69,4 @@ import LogBuiltInMetadata from './types/LogBuiltInMetadata';
 import LogMetadataType from './types/LogMetadataType';
 import IntelliTableColumn from './types/IntelliTableColumn';
 import PickableItem from './components/ItemPicker/types/PickableItem';
-export { AppWrapper, LoadingSpinner, ErrorBox, Modal, TabBox, RadioButton, CheckboxButton, ButtonInputGroup, SimpleDateChooser, Drawer, PopSuccessMark, PopFailureMark, PopPendingMark, CopiableBox, ItemPicker, LogReviewer, IntelliTable, CSVDownloadButton, alert, confirm, showFatalError, ErrorWithCode, MINUTE_IN_MS, HOUR_IN_MS, DAY_IN_MS, DynamicWord, abbreviate, avg, ceilToNumDecimals, floorToNumDecimals, forceNumIntoBounds, padDecimalZeros, padZerosLeft, roundToNumDecimals, sum, waitMs, getOrdinal, getTimeInfoInET, stubServerEndpoint, startMinWait, getHumanReadableDate, getPartOfDay, stringsToHumanReadableList, onlyKeepLetters, parallelLimit, getMonthName, genCSV, canReviewLogs, isMobileOrTablet, extractProp, compareArraysByProp, visitServerEndpoint, logClientEvent, initServer, genRouteHandler, handleError, handleSuccess, initLogCollection, ModalButtonType, ModalSize, ModalType, ReactKitErrorCode, Variant, DayOfWeek, Log, LogType, LogSource, LogAction, LogBuiltInMetadata, LogMetadataType, IntelliTableColumn, PickableItem, ParamType, };
+export { AppWrapper, LoadingSpinner, ErrorBox, Modal, TabBox, RadioButton, CheckboxButton, ButtonInputGroup, SimpleDateChooser, Drawer, PopSuccessMark, PopFailureMark, PopPendingMark, CopiableBox, ItemPicker, LogReviewer, IntelliTable, CSVDownloadButton, alert, confirm, showFatalError, ErrorWithCode, MINUTE_IN_MS, HOUR_IN_MS, DAY_IN_MS, DynamicWord, abbreviate, avg, ceilToNumDecimals, floorToNumDecimals, forceNumIntoBounds, padDecimalZeros, padZerosLeft, roundToNumDecimals, sum, waitMs, getOrdinal, getTimeInfoInET, stubServerEndpoint, startMinWait, getHumanReadableDate, getPartOfDay, stringsToHumanReadableList, onlyKeepLetters, parallelLimit, getMonthName, genCSV, canReviewLogs, isMobileOrTablet, extractProp, compareArraysByProp, initClient, visitServerEndpoint, logClientEvent, initServer, genRouteHandler, handleError, handleSuccess, initLogCollection, ModalButtonType, ModalSize, ModalType, ReactKitErrorCode, Variant, DayOfWeek, Log, LogType, LogSource, LogAction, LogBuiltInMetadata, LogMetadataType, IntelliTableColumn, PickableItem, ParamType, };

package/dist/esm/types/types/ReactKitErrorCode.d.ts

@@ -13,6 +13,8 @@ declare enum ReactKitErrorCode {
     NoCACCLGetLaunchInfoFunction = "DRK8",
     NotTTM = "DRK9",
     NotAdmin = "DRK10",
-    NotAllowedToReviewLogs = "DRK11"
+    NotAllowedToReviewLogs = "DRK11",
+    ThemeCheckedBeforeReactKitReady = "DRK12",
+    SessionExpiredMessageGottenBeforeReactKitReady = "DRK13"
 }
 export default ReactKitErrorCode;

package/dist/index.d.ts

@@ -24,27 +24,7 @@ declare enum Variant {
 
 declare type Props$g = {
     children: React.ReactNode;
-    sendRequest: SendRequestFunction;
-    dark?: boolean;
-    sessionExpiredMessage?: string;
 };
-declare type SendRequestFunction = (opts: {
-    path: string;
-    method: ('GET' | 'POST' | 'DELETE' | 'PUT');
-    params?: {
-        [x: string]: any;
-    } | undefined;
-    headers?: {
-        [x: string]: any;
-    } | undefined;
-    numRetries?: number | undefined;
-}) => Promise<{
-    body: any;
-    status: number;
-    headers: {
-        [x: string]: any;
-    };
-}>;
 /**
  * Show an alert modal with an "Okay" button
  * @author Gabe Abrams
@@ -523,6 +503,41 @@ declare const DynamicWord: {
     DeviceCapitalized: string;
 };
 
+/**
+ * Type of CACCL's send request function
+ * @author Gabe Abrams
+ */
+declare type SendRequestFunction = (opts: {
+    path: string;
+    method: ('GET' | 'POST' | 'DELETE' | 'PUT');
+    params?: {
+        [x: string]: any;
+    } | undefined;
+    headers?: {
+        [x: string]: any;
+    } | undefined;
+    numRetries?: number | undefined;
+}) => Promise<{
+    body: any;
+    status: number;
+    headers: {
+        [x: string]: any;
+    };
+}>;
+/**
+ * Initialize the client-side version of reactkit
+ * @author Gabe Abrams
+ * @param opts object containing all arguments
+ * @param opts.sendRequest caccl send request functions
+ * @param [opts.dark] if true, the app is a dark-themed app
+ * @param [opts.sessionExpiredMessage] a custom session expired message
+ */
+declare const initClient: (opts: {
+    sendRequest: SendRequestFunction;
+    dark?: boolean;
+    sessionExpiredMessage?: string;
+}) => void;
+
 /**
  * Shorten text so it fits into a certain number of chars
  * @author Gabe Abrams
@@ -1064,7 +1079,9 @@ declare enum ReactKitErrorCode {
     NoCACCLGetLaunchInfoFunction = "DRK8",
     NotTTM = "DRK9",
     NotAdmin = "DRK10",
-    NotAllowedToReviewLogs = "DRK11"
+    NotAllowedToReviewLogs = "DRK11",
+    ThemeCheckedBeforeReactKitReady = "DRK12",
+    SessionExpiredMessageGottenBeforeReactKitReady = "DRK13"
 }
 
 /**
@@ -1097,4 +1114,4 @@ declare const LogBuiltInMetadata: {
     };
 };
 
-export { AppWrapper, ButtonInputGroup, CSVDownloadButton, CheckboxButton, CopiableBox, DAY_IN_MS, DayOfWeek, Drawer, DynamicWord, ErrorBox, ErrorWithCode, HOUR_IN_MS, IntelliTable, IntelliTableColumn, ItemPicker, LoadingSpinner, Log, LogAction, LogBuiltInMetadata, LogMetadataType, LogReviewer, LogSource, LogType, MINUTE_IN_MS, Modal, ModalButtonType, ModalSize, ModalType, ParamType, PickableItem, PopFailureMark, PopPendingMark, PopSuccessMark, RadioButton, ReactKitErrorCode, SimpleDateChooser, TabBox, Variant, abbreviate, alert, avg, canReviewLogs, ceilToNumDecimals, compareArraysByProp, confirm, extractProp, floorToNumDecimals, forceNumIntoBounds, genCSV, genRouteHandler, getHumanReadableDate, getMonthName, getOrdinal, getPartOfDay, getTimeInfoInET, handleError, handleSuccess, initLogCollection, initServer, isMobileOrTablet, logClientEvent, onlyKeepLetters, padDecimalZeros, padZerosLeft, parallelLimit, roundToNumDecimals, showFatalError, startMinWait, stringsToHumanReadableList, stubServerEndpoint, sum, visitServerEndpoint, waitMs };
+export { AppWrapper, ButtonInputGroup, CSVDownloadButton, CheckboxButton, CopiableBox, DAY_IN_MS, DayOfWeek, Drawer, DynamicWord, ErrorBox, ErrorWithCode, HOUR_IN_MS, IntelliTable, IntelliTableColumn, ItemPicker, LoadingSpinner, Log, LogAction, LogBuiltInMetadata, LogMetadataType, LogReviewer, LogSource, LogType, MINUTE_IN_MS, Modal, ModalButtonType, ModalSize, ModalType, ParamType, PickableItem, PopFailureMark, PopPendingMark, PopSuccessMark, RadioButton, ReactKitErrorCode, SimpleDateChooser, TabBox, Variant, abbreviate, alert, avg, canReviewLogs, ceilToNumDecimals, compareArraysByProp, confirm, extractProp, floorToNumDecimals, forceNumIntoBounds, genCSV, genRouteHandler, getHumanReadableDate, getMonthName, getOrdinal, getPartOfDay, getTimeInfoInET, handleError, handleSuccess, initClient, initLogCollection, initServer, isMobileOrTablet, logClientEvent, onlyKeepLetters, padDecimalZeros, padZerosLeft, parallelLimit, roundToNumDecimals, showFatalError, startMinWait, stringsToHumanReadableList, stubServerEndpoint, sum, visitServerEndpoint, waitMs };

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "dce-reactkit",
-  "version": "3.2.9",
+  "version": "3.3.1",
   "description": "Shared components for Harvard DCE apps",
   "main": "dist/cjs/index.js",
   "module": "dist/esm/index.js",

package/src/client/initClient.tsx

@@ -0,0 +1,160 @@
+// Import other components
+import { showFatalError } from '../components/AppWrapper';
+
+// Import shared types
+import ErrorWithCode from '../errors/ErrorWithCode';
+import ReactKitErrorCode from '../types/ReactKitErrorCode';
+
+
+/*----------------------------------------*/
+/* ---------------- Types --------------- */
+/*----------------------------------------*/
+
+/**
+ * Type of CACCL's send request function
+ * @author Gabe Abrams
+ */
+type SendRequestFunction = (
+  opts: {
+    path: string;
+    method: ('GET' | 'POST' | 'DELETE' | 'PUT');
+    params?: {
+      [x: string]: any;
+    } | undefined;
+    headers?: {
+      [x: string]: any;
+    } | undefined;
+    numRetries?: number | undefined;
+  },
+) => Promise<{
+  body: any;
+  status: number;
+  headers: {
+    [x: string]: any;
+  };
+}>;
+
+/*----------------------------------------*/
+/* ---- Static Variables and Getters ---- */
+/*----------------------------------------*/
+
+/* ----------- Initialized ---------- */
+
+let initialized = false;
+
+/* ---------- Send Request ---------- */
+
+let storedSendRequest: SendRequestFunction;
+
+/**
+ * Get the send request function
+ * @author Gabe Abrams
+ * @returns sendRequest function
+ */
+export const getSendRequest = () => {
+  // Error if no send request function
+  if (!initialized) {
+    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,
+      ),
+    );
+
+    // Return dummy function that never resolves
+    return (
+      () => {
+        return new Promise(() => {});
+      }
+    ) as SendRequestFunction;
+  }
+
+  // Return
+  return storedSendRequest;
+};
+
+/* ------------ Dark Mode ----------- */
+
+let dark: boolean | undefined;
+
+/**
+ * Get the current dark/light theme
+ * @author Gabe Abrams
+ * @returns true if the app has a dark theme
+ */
+export const darkModeIsOn = () => {
+  // Error if not set up yet
+  if (!initialized) {
+    showFatalError(
+      new ErrorWithCode(
+        'Could not check theme color because dce-reactkit was properly initialized. Perhaps dce-reactkit was not initialized with initClient.',
+        ReactKitErrorCode.ThemeCheckedBeforeReactKitReady,
+      ),
+    );
+    return false;
+  }
+
+  // Return
+  return !!dark;
+};
+
+/* ----- Session Expired Message ---- */
+
+let sessionExpiredMessage: string | undefined;
+
+/**
+ * Get the custom session expired message
+ * @author Gabe Abrams
+ * @returns session expired message
+ */
+export const getSessionExpiredMessage = () => {
+  // Error if not set up yet
+  if (!initialized) {
+    showFatalError(
+      new ErrorWithCode(
+        'Could not get the session expired message because dce-reactkit was properly initialized. Perhaps dce-reactkit was not initialized with initClient.',
+        ReactKitErrorCode.SessionExpiredMessageGottenBeforeReactKitReady,
+      ),
+    );
+    return '';
+  }
+
+  // Return
+  return (
+    sessionExpiredMessage
+    ?? 'Your session has expired. Please go back to Canvas and start over.'
+  );
+};
+
+/*----------------------------------------*/
+/* ---------------- Init ---------------- */
+/*----------------------------------------*/
+
+/**
+ * Initialize the client-side version of reactkit
+ * @author Gabe Abrams
+ * @param opts object containing all arguments
+ * @param opts.sendRequest caccl send request functions
+ * @param [opts.dark] if true, the app is a dark-themed app
+ * @param [opts.sessionExpiredMessage] a custom session expired message
+ */
+const initClient = (
+  opts: {
+    // Copy of CACCL's send request function
+    sendRequest: SendRequestFunction,
+    // True if this app is a dark-themed app
+    dark?: boolean,
+    // Custom session expired message
+    sessionExpiredMessage?: string,
+  },
+) => {
+  // Store values
+  storedSendRequest = opts.sendRequest;
+  dark = !!opts.dark;
+  sessionExpiredMessage = opts.sessionExpiredMessage;
+
+  // Mark as initialized
+  initialized = true;
+};
+
+export default initClient;

package/src/components/AppWrapper.tsx

@@ -15,14 +15,20 @@ 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
 import Modal from './Modal';
 
 // Import custom errors
 import ErrorWithCode from '../errors/ErrorWithCode';
+
+// Import other helpers
 import logClientEvent from '../helpers/logClientEvent';
-import LogBuiltInMetadata from '../types/LogBuiltInMetadata';
+import {
+  darkModeIsOn,
+  getSessionExpiredMessage,
+} from '../client/initClient';
 
 /*------------------------------------------------------------------------*/
 /*                                  Props                                 */
@@ -31,64 +37,12 @@ import LogBuiltInMetadata from '../types/LogBuiltInMetadata';
 type Props = {
   // The entire app
   children: React.ReactNode,
-  // Copy of CACCL's send request function
-  sendRequest: SendRequestFunction,
-  // True if this app is a dark-themed app
-  dark?: boolean,
-  // Custom session expired message
-  sessionExpiredMessage?: string,
 };
 
-// Type of CACCL's send request function
-type SendRequestFunction = (
-  opts: {
-    path: string;
-    method: ('GET' | 'POST' | 'DELETE' | 'PUT');
-    params?: {
-      [x: string]: any;
-    } | undefined;
-    headers?: {
-      [x: string]: any;
-    } | undefined;
-    numRetries?: number | undefined;
-  },
-) => Promise<{
-  body: any;
-  status: number;
-  headers: {
-    [x: string]: any;
-  };
-}>;
-
 /*------------------------------------------------------------------------*/
 /*                             Static Helpers                             */
 /*------------------------------------------------------------------------*/
 
-/*----------------------------------------*/
-/*              Send Request              */
-/*----------------------------------------*/
-
-// Store copy of caccl send request
-let _cacclSendRequest: SendRequestFunction;
-
-/**
- * Send a request using caccl's send request feature
- * @author Gabe Abrams
- * @param opts send request options
- * @returns send request response
- */
-export const cacclSendRequest: SendRequestFunction = async (opts) => {
-  // Make sure send request has been passed in
-  if (!_cacclSendRequest) {
-    throw new ErrorWithCode(
-      `\nThe request could not be sent because the AppWrapper component does not have a copy of sendRequest from CACCL.\nIf you are currently writing tests for your app, this means you did not properly stub the server response.\nMethod: ${opts.method}\nPath: ${opts.path}\n\n`,
-      ReactKitErrorCode.NoCACCLSendRequestFunction,
-    );
-  }
-
-  return _cacclSendRequest(opts);
-};
-
 /*----------------------------------------*/
 /*                  Alert                 */
 /*----------------------------------------*/
@@ -283,14 +237,8 @@ const AppWrapper: React.FC<Props> = (props: Props): React.ReactElement => {
 
   const {
     children,
-    sendRequest,
-    dark,
-    sessionExpiredMessage = 'Your session has expired. Please go back to Canvas and start over.',
   } = props;
 
-  // Store copy of send request
-  _cacclSendRequest = sendRequest;
-
   /* -------------- State ------------- */
 
   // Fatal error
@@ -421,7 +369,7 @@ const AppWrapper: React.FC<Props> = (props: Props): React.ReactElement => {
     const error = (
       sessionHasExpired
         ? new ErrorWithCode(
-          sessionExpiredMessage,
+          getSessionExpiredMessage(),
           ReactKitErrorCode.SessionExpired,
         )
         : new ErrorWithCode(
@@ -439,7 +387,7 @@ const AppWrapper: React.FC<Props> = (props: Props): React.ReactElement => {
           minHeight: '100vh',
           paddingTop: '2rem',
           backgroundColor: (
-            dark
+            darkModeIsOn()
               ? '#222'
               : '#fff'
           ),

package/src/helpers/visitServerEndpoint.tsx

@@ -2,8 +2,8 @@
 import ErrorWithCode from '../errors/ErrorWithCode';
 import ReactKitErrorCode from '../types/ReactKitErrorCode';
 
-// Import helpers from app wrapper
-import { cacclSendRequest } from '../components/AppWrapper';
+// Import helpers
+import { getSendRequest } from '../client/initClient';
 
 /*------------------------------------------------------------------------*/
 /*                                Listener                                */
@@ -138,7 +138,8 @@ const visitServerEndpoint = async (
   }
 
   // Send the request
-  const response = await cacclSendRequest({
+  const sendRequest = getSendRequest();
+  const response = await sendRequest({
     path: opts.path,
     method: opts.method ?? 'GET',
     params: opts.params,

package/src/index.ts

@@ -30,6 +30,7 @@ import DAY_IN_MS from './constants/DAY_IN_MS';
 import DynamicWord from './dynamicConstants/DynamicWord';
 
 // Import helpers
+import initClient from './client/initClient';
 import abbreviate from './helpers/abbreviate';
 import avg from './helpers/avg';
 import ceilToNumDecimals from './helpers/ceilToNumDecimals';
@@ -142,6 +143,7 @@ export {
   extractProp,
   compareArraysByProp,
   // Client helpers
+  initClient,
   visitServerEndpoint,
   logClientEvent,
   // Server helpers

package/src/types/ReactKitErrorCode.tsx

@@ -1,4 +1,4 @@
-// Highest error code = DRK11
+// Highest error code = DRK13
 
 /**
  * List of error codes built into the react kit
@@ -16,6 +16,8 @@ enum ReactKitErrorCode {
   NotTTM = 'DRK9',
   NotAdmin = 'DRK10',
   NotAllowedToReviewLogs = 'DRK11',
+  ThemeCheckedBeforeReactKitReady = 'DRK12',
+  SessionExpiredMessageGottenBeforeReactKitReady = 'DRK13',
 }
 
 export default ReactKitErrorCode;