dce-reactkit 3.2.8 → 3.3.1

package/dist/cjs/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/cjs/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/cjs/types/helpers/compareArraysByProp.d.ts

@@ -0,0 +1,12 @@
+/**
+ * Compare two arrays of objects by only comparing the values in a specific
+ *  property (e.g. compare user arrays by comparing their user.id values)
+ * @author Gabe Abrams
+ * @param a the first array
+ * @param b the second array
+ * @param prop the property to compare with
+ * @returns true if the arrays contain the same objects as determined by
+ *   the values associated with each object's prop
+ */
+declare const compareArraysByProp: (a: any[], b: any[], prop: string) => boolean;
+export default compareArraysByProp;

package/dist/cjs/types/helpers/extractProp.d.ts

@@ -0,0 +1,12 @@
+/**
+ * For every element in an array, extract the value of a prop
+ *   (e.g. for all user objects, extract their ages and put that into a new
+ *   ages array)
+ * @author Gabe Abrams
+ * @param arr the array of objects to operate on
+ * @param prop the property to extract from each object
+ * @returns new array containing the corresponding values, in order, of each
+ *   object in the original array
+ */
+declare const extractProp: (arr: any[], prop: string) => any[];
+export default extractProp;

package/dist/cjs/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';
@@ -51,6 +52,8 @@ import getMonthName from './helpers/getMonthName';
 import genCSV from './helpers/genCSV';
 import canReviewLogs from './helpers/canReviewLogs';
 import isMobileOrTablet from './helpers/isMobileOrTablet';
+import extractProp from './helpers/extractProp';
+import compareArraysByProp from './helpers/compareArraysByProp';
 import ModalButtonType from './types/ModalButtonType';
 import ModalSize from './types/ModalSize';
 import ModalType from './types/ModalType';
@@ -66,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, 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/cjs/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/esm/index.js

@@ -28,7 +28,7 @@ function __awaiter(thisArg, _arguments, P, generator) {
     });
 }
 
-// Highest error code = DRK11
+// Highest error code = DRK13
 /**
  * List of error codes built into the react kit
  * @author Gabe Abrams
@@ -46,6 +46,8 @@ var ReactKitErrorCode;
     ReactKitErrorCode["NotTTM"] = "DRK9";
     ReactKitErrorCode["NotAdmin"] = "DRK10";
     ReactKitErrorCode["NotAllowedToReviewLogs"] = "DRK11";
+    ReactKitErrorCode["ThemeCheckedBeforeReactKitReady"] = "DRK12";
+    ReactKitErrorCode["SessionExpiredMessageGottenBeforeReactKitReady"] = "DRK13";
 })(ReactKitErrorCode || (ReactKitErrorCode = {}));
 var ReactKitErrorCode$1 = ReactKitErrorCode;
 
@@ -141,6 +143,24 @@ var ModalType;
 })(ModalType || (ModalType = {}));
 var ModalType$1 = ModalType;
 
+/**
+ * Built-in metadata for logs
+ * @author Gabe Abrams
+ */
+const LogBuiltInMetadata = {
+    // Contexts
+    Context: {
+        Uncategorized: 'Uncategorized',
+        ServerRenderedErrorPage: 'ServerRenderedErrorPage',
+        ServerEndpointError: 'ServerEndpointError',
+        ClientFatalError: 'ClientFatalError',
+    },
+    // Targets
+    Target: {
+        NoTarget: 'NoTarget',
+    },
+};
+
 /**
  * Wait for a certain number of ms
  * @author Gabe Abrams
@@ -504,24 +524,6 @@ const ROUTE_PATH_PREFIX = '/dce-reactkit';
  */
 const LOG_ROUTE_PATH = `${ROUTE_PATH_PREFIX}/log`;
 
-/**
- * Built-in metadata for logs
- * @author Gabe Abrams
- */
-const LogBuiltInMetadata = {
-    // Contexts
-    Context: {
-        Uncategorized: 'Uncategorized',
-        ServerRenderedErrorPage: 'ServerRenderedErrorPage',
-        ServerEndpointError: 'ServerEndpointError',
-        ClientFatalError: 'ClientFatalError',
-    },
-    // Targets
-    Target: {
-        NoTarget: 'NoTarget',
-    },
-};
-
 /**
  * Allowed log levels
  * @author Gabe Abrams
@@ -534,6 +536,83 @@ var LogLevel;
 })(LogLevel || (LogLevel = {}));
 var LogLevel$1 = LogLevel;
 
+// Import other components
+/*----------------------------------------*/
+/* ---- Static Variables and Getters ---- */
+/*----------------------------------------*/
+/* ----------- Initialized ---------- */
+let initialized = false;
+/* ---------- Send Request ---------- */
+let storedSendRequest;
+/**
+ * Get the send request function
+ * @author Gabe Abrams
+ * @returns sendRequest function
+ */
+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$1.NoCACCLSendRequestFunction));
+        // Return dummy function that never resolves
+        return (() => {
+            return new Promise(() => { });
+        });
+    }
+    // Return
+    return storedSendRequest;
+};
+/* ------------ Dark Mode ----------- */
+let dark;
+/**
+ * Get the current dark/light theme
+ * @author Gabe Abrams
+ * @returns true if the app has a dark theme
+ */
+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$1.ThemeCheckedBeforeReactKitReady));
+        return false;
+    }
+    // Return
+    return !!dark;
+};
+/* ----- Session Expired Message ---- */
+let sessionExpiredMessage;
+/**
+ * Get the custom session expired message
+ * @author Gabe Abrams
+ * @returns session expired message
+ */
+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$1.SessionExpiredMessageGottenBeforeReactKitReady));
+        return '';
+    }
+    // Return
+    return (sessionExpiredMessage !== null && sessionExpiredMessage !== void 0 ? 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) => {
+    // Store values
+    storedSendRequest = opts.sendRequest;
+    dark = !!opts.dark;
+    sessionExpiredMessage = opts.sessionExpiredMessage;
+    // Mark as initialized
+    initialized = true;
+};
+
 // Keep track of whether or not session expiry has already been handled
 let sessionAlreadyExpired = false;
 /*------------------------------------------------------------------------*/
@@ -605,7 +684,8 @@ const visitServerEndpoint = (opts) => __awaiter(void 0, void 0, void 0, function
         throw new ErrorWithCode(stubResponse.errorMessage, stubResponse.errorCode);
     }
     // Send the request
-    const response = yield cacclSendRequest({
+    const sendRequest = getSendRequest();
+    const response = yield sendRequest({
         path: opts.path,
         method: (_c = opts.method) !== null && _c !== void 0 ? _c : 'GET',
         params: opts.params,
@@ -692,24 +772,6 @@ const logClientEvent = (opts) => __awaiter(void 0, void 0, void 0, function* ()
 /*                             Static Helpers                             */
 /*------------------------------------------------------------------------*/
 /*----------------------------------------*/
-/*              Send Request              */
-/*----------------------------------------*/
-// Store copy of caccl send request
-let _cacclSendRequest;
-/**
- * Send a request using caccl's send request feature
- * @author Gabe Abrams
- * @param opts send request options
- * @returns send request response
- */
-const cacclSendRequest = (opts) => __awaiter(void 0, void 0, void 0, function* () {
-    // 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$1.NoCACCLSendRequestFunction);
-    }
-    return _cacclSendRequest(opts);
-});
-/*----------------------------------------*/
 /*                  Alert                 */
 /*----------------------------------------*/
 // Stored copies of setters
@@ -833,9 +895,7 @@ const AppWrapper = (props) => {
     /*                                  Setup                                 */
     /*------------------------------------------------------------------------*/
     /* -------------- Props ------------- */
-    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;
+    const { children, } = props;
     /* -------------- State ------------- */
     // Fatal error
     const [fatalErrorMessage, setFatalErrorMessageInner,] = useState();
@@ -888,7 +948,7 @@ const AppWrapper = (props) => {
     if (fatalErrorMessage || fatalErrorCode || sessionHasExpired) {
         // Re-encapsulate in an error
         const error = (sessionHasExpired
-            ? new ErrorWithCode(sessionExpiredMessage, ReactKitErrorCode$1.SessionExpired)
+            ? new ErrorWithCode(getSessionExpiredMessage(), ReactKitErrorCode$1.SessionExpired)
             : new ErrorWithCode((fatalErrorMessage !== null && fatalErrorMessage !== void 0 ? fatalErrorMessage : 'An unknown error has occurred. Please contact support.'), (fatalErrorCode !== null && fatalErrorCode !== void 0 ? fatalErrorCode : ReactKitErrorCode$1.NoCode)));
         // Build error screen
         body = (React.createElement("div", { style: {
@@ -896,7 +956,7 @@ const AppWrapper = (props) => {
                 width: '100vw',
                 minHeight: '100vh',
                 paddingTop: '2rem',
-                backgroundColor: (dark
+                backgroundColor: (darkModeIsOn()
                     ? '#222'
                     : '#fff'),
             } },
@@ -5525,6 +5585,54 @@ const canReviewLogs = () => __awaiter(void 0, void 0, void 0, function* () {
     return canReview;
 });
 
+/**
+ * For every element in an array, extract the value of a prop
+ *   (e.g. for all user objects, extract their ages and put that into a new
+ *   ages array)
+ * @author Gabe Abrams
+ * @param arr the array of objects to operate on
+ * @param prop the property to extract from each object
+ * @returns new array containing the corresponding values, in order, of each
+ *   object in the original array
+ */
+const extractProp = (arr, prop) => {
+    return arr.map((item) => {
+        return item[prop];
+    });
+};
+
+// Import shared helpers
+/**
+ * Compare two arrays of objects by only comparing the values in a specific
+ *  property (e.g. compare user arrays by comparing their user.id values)
+ * @author Gabe Abrams
+ * @param a the first array
+ * @param b the second array
+ * @param prop the property to compare with
+ * @returns true if the arrays contain the same objects as determined by
+ *   the values associated with each object's prop
+ */
+const compareArraysByProp = (a, b, prop) => {
+    // Extract values for comparison
+    const aVals = new Set(extractProp(a, prop));
+    const bVals = new Set(extractProp(b, prop));
+    // Compare sizes first
+    if (aVals.size !== bVals.size) {
+        return false;
+    }
+    // Same number of items. Make sure every object in aVals appears in bVals
+    // (if so, they should be equivalent since the sizes are the same)
+    // > Create map of items in bVals
+    const inBVals = {}; // item => true if in bVals
+    Array.from(bVals.values()).forEach((item) => {
+        inBVals[item] = true;
+    });
+    // > Loop through aVals and make sure every item is in bVals
+    return Array.from(aVals.values()).every((item) => {
+        return inBVals[item];
+    });
+};
+
 /**
  * Days of the week
  * @author Gabe Abrams
@@ -5541,5 +5649,5 @@ var DayOfWeek;
 })(DayOfWeek || (DayOfWeek = {}));
 var DayOfWeek$1 = DayOfWeek;
 
-export { AppWrapper, ButtonInputGroup, CSVDownloadButton, CheckboxButton, CopiableBox, DAY_IN_MS, DayOfWeek$1 as DayOfWeek, Drawer, DynamicWord, ErrorBox, ErrorWithCode, HOUR_IN_MS, IntelliTable, ItemPicker, LoadingSpinner, LogAction$1 as LogAction, LogBuiltInMetadata, LogReviewer, LogSource$1 as LogSource, LogType$1 as LogType, MINUTE_IN_MS, Modal, ModalButtonType$1 as ModalButtonType, ModalSize$1 as ModalSize, ModalType$1 as ModalType, ParamType$1 as ParamType, PopFailureMark, PopPendingMark, PopSuccessMark, RadioButton, ReactKitErrorCode$1 as ReactKitErrorCode, SimpleDateChooser, TabBox, Variant$1 as Variant, abbreviate, alert$1 as alert, avg, canReviewLogs, ceilToNumDecimals, confirm, 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$1 as DayOfWeek, Drawer, DynamicWord, ErrorBox, ErrorWithCode, HOUR_IN_MS, IntelliTable, ItemPicker, LoadingSpinner, LogAction$1 as LogAction, LogBuiltInMetadata, LogReviewer, LogSource$1 as LogSource, LogType$1 as LogType, MINUTE_IN_MS, Modal, ModalButtonType$1 as ModalButtonType, ModalSize$1 as ModalSize, ModalType$1 as ModalType, ParamType$1 as ParamType, PopFailureMark, PopPendingMark, PopSuccessMark, RadioButton, ReactKitErrorCode$1 as ReactKitErrorCode, SimpleDateChooser, TabBox, Variant$1 as Variant, abbreviate, alert$1 as 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 };
 //# sourceMappingURL=index.js.map