dce-reactkit 3.1.20 → 3.2.0-beta.10

package/.vscode/settings.json

@@ -0,0 +1,6 @@
+{
+  "cSpell.words": [
+    "Subcontext",
+    "Uncategorized"
+  ]
+}

package/dist/cjs/index.js

@@ -2124,9 +2124,42 @@ const visitServerEndpoint = (opts) => __awaiter(void 0, void 0, void 0, function
     return body;
 });
 
+/**
+ * Path that all routes start with
+ * @author Gabe Abrams
+ */
+const ROUTE_PATH_PREFIX = '/dce-reactkit';
+
+/**
+ * Path of the route for storing client-side logs
+ * @author Gabe Abrams
+ */
+const LOG_ROUTE_PATH = `${ROUTE_PATH_PREFIX}/log`;
+
+/**
+ * Server-side API param types
+ * @author Gabe Abrams
+ */
+var ParamType;
+(function (ParamType) {
+    ParamType["Boolean"] = "boolean";
+    ParamType["BooleanOptional"] = "boolean-optional";
+    ParamType["Float"] = "float";
+    ParamType["FloatOptional"] = "float-optional";
+    ParamType["Int"] = "int";
+    ParamType["IntOptional"] = "int-optional";
+    ParamType["JSON"] = "json";
+    ParamType["JSONOptional"] = "json-optional";
+    ParamType["String"] = "string";
+    ParamType["StringOptional"] = "string-optional";
+})(ParamType || (ParamType = {}));
+var ParamType$1 = ParamType;
+
 // Import custom error
 // Stored copy of caccl functions
 let _cacclGetLaunchInfo;
+// Stored copy of dce-mango log collection
+let _logCollection;
 /*------------------------------------------------------------------------*/
 /*                                 Helpers                                */
 /*------------------------------------------------------------------------*/
@@ -2142,6 +2175,15 @@ const cacclGetLaunchInfo = (req) => {
     }
     return _cacclGetLaunchInfo(req);
 };
+/**
+ * Get log collection
+ * @author Gabe Abrams
+ * @returns log collection if one was included during launch or null if we don't
+ *   have a log collection (yet)
+ */
+const internalGetLogCollection = () => {
+    return _logCollection !== null && _logCollection !== void 0 ? _logCollection : null;
+};
 /*------------------------------------------------------------------------*/
 /*                                  Main                                  */
 /*------------------------------------------------------------------------*/
@@ -2149,31 +2191,73 @@ const cacclGetLaunchInfo = (req) => {
  * Prepare dce-reactkit to run on the server
  * @author Gabe Abrams
  * @param opts object containing all arguments
+ * @param opts.app express app from inside of the postprocessor function that
+ *   we will add routes to
  * @param opts.getLaunchInfo CACCL LTI's get launch info function
+ * @param [opts.logCollection] mongo collection from dce-mango to use for
+ *   storing logs. If none is included, logs are written to the console
  */
 const initServer = (opts) => {
     _cacclGetLaunchInfo = opts.getLaunchInfo;
+    _logCollection = opts.logCollection;
+    /**
+     * Log an event
+     * @author Gabe Abrams
+     * @param {string} context Context of the event (each app determines how to
+     *   organize its contexts)
+     * @param {string} subcontext Subcontext of the event (each app determines
+     *   how to organize its subcontexts)
+     * @param {string} tags stringified list of tags that apply to this action
+     *   (each app determines tag usage)
+     * @param {string} metadata stringified object containing optional custom metadata
+     * @param {string} [errorMessage] error message if type is an error
+     * @param {string} [errorCode] error code if type is an error
+     * @param {string} [errorStack] error stack if type is an error
+     * @param {string} [target] Target of the action (each app determines the list
+     *   of targets) These are usually buttons, panels, elements, etc.
+     * @param {LogAction} [action] the type of action performed on the target
+     * @returns {Log}
+     */
+    opts.app.post(LOG_ROUTE_PATH, genRouteHandler({
+        paramTypes: {
+            context: ParamType$1.String,
+            subcontext: ParamType$1.String,
+            tags: ParamType$1.JSON,
+            metadata: ParamType$1.JSON,
+            errorMessage: ParamType$1.StringOptional,
+            errorCode: ParamType$1.StringOptional,
+            errorStack: ParamType$1.StringOptional,
+            target: ParamType$1.StringOptional,
+            action: ParamType$1.StringOptional,
+        },
+        handler: ({ params, logServerEvent }) => {
+            const log = logServerEvent((params.errorMessage || params.errorCode || params.errorStack)
+                // Error
+                ? {
+                    context: params.context,
+                    subcontext: params.subcontext,
+                    tags: params.tags,
+                    metadata: params.metadata,
+                    error: {
+                        message: params.errorMessage,
+                        code: params.errorCode,
+                        stack: params.errorStack,
+                    },
+                }
+                // Action
+                : {
+                    context: params.context,
+                    subcontext: params.subcontext,
+                    tags: params.tags,
+                    metadata: params.metadata,
+                    target: params.target,
+                    action: params.action,
+                });
+            return log;
+        },
+    }));
 };
 
-/**
- * Server-side API param types
- * @author Gabe Abrams
- */
-var ParamType;
-(function (ParamType) {
-    ParamType["Boolean"] = "boolean";
-    ParamType["BooleanOptional"] = "boolean-optional";
-    ParamType["Float"] = "float";
-    ParamType["FloatOptional"] = "float-optional";
-    ParamType["Int"] = "int";
-    ParamType["IntOptional"] = "int-optional";
-    ParamType["JSON"] = "json";
-    ParamType["JSONOptional"] = "json-optional";
-    ParamType["String"] = "string";
-    ParamType["StringOptional"] = "string-optional";
-})(ParamType || (ParamType = {}));
-var ParamType$1 = ParamType;
-
 // Import shared types
 /**
  * Handle an error and respond to the client
@@ -2366,6 +2450,195 @@ const genErrorPage = (opts = {}) => {
   `;
 };
 
+/**
+ * Perform a rudimentary parsing of the user's browser agent string
+ * @author Gabe Abrams
+ * @param userAgent the user's browser agent
+ * @returns user info
+ */
+const parseUserAgent = (userAgent) => {
+    /* ------------- Browser ------------ */
+    let browser = {
+        name: 'Unknown',
+        version: 'Unknown',
+    };
+    // Parse user agent
+    let verOffset;
+    let nameOffset;
+    if ((verOffset = userAgent.indexOf('Opera')) !== -1) {
+        // In Opera, the true version is after 'Opera' or after 'Version'
+        browser = {
+            name: 'Opera',
+            version: userAgent.substring(verOffset + 6),
+        };
+        if ((verOffset = userAgent.indexOf('Version')) !== -1) {
+            browser.version = userAgent.substring(verOffset + 8);
+        }
+    }
+    else if ((verOffset = userAgent.indexOf('MSIE')) !== -1) {
+        // In MSIE, the true version is after 'MSIE' in userAgent
+        browser = {
+            name: 'Internet Explorer',
+            version: userAgent.substring(verOffset + 5),
+        };
+    }
+    else if ((verOffset = userAgent.indexOf('Chrome')) !== -1) {
+        // In Chrome, the true version is after 'Chrome'
+        browser = {
+            name: 'Chrome',
+            version: userAgent.substring(verOffset + 7),
+        };
+    }
+    else if ((verOffset = userAgent.indexOf('Safari')) !== -1) {
+        // In Safari, the true version is after 'Safari' or after 'Version'
+        browser = {
+            name: 'Safari',
+            version: userAgent.substring(verOffset + 7),
+        };
+        if ((verOffset = userAgent.indexOf('Version')) !== -1) {
+            browser.version = userAgent.substring(verOffset + 8);
+        }
+    }
+    else if ((verOffset = userAgent.indexOf('Firefox')) != -1) {
+        // In Firefox, the true version is after 'Firefox'
+        browser = {
+            name: 'Firefox',
+            version: userAgent.substring(verOffset + 8),
+        };
+    }
+    else if ((nameOffset = userAgent.lastIndexOf(' ') + 1)
+        < (verOffset = userAgent.lastIndexOf('/'))) {
+        browser = {
+            name: userAgent.substring(nameOffset, verOffset),
+            version: userAgent.substring(verOffset + 1),
+        };
+    }
+    // Postprocess version
+    // trim the fullVersion string at semicolon/space if present
+    let ix;
+    if ((ix = browser.version.indexOf(';')) !== -1) {
+        browser.version = browser.version.substring(0, ix);
+    }
+    if ((ix = browser.version.indexOf(' ')) !== -1) {
+        browser.version = browser.version.substring(0, ix);
+    }
+    /* ------------- Device ------------- */
+    // Detect os
+    let os = 'Unknown';
+    if (userAgent.includes('Linux')) {
+        os = 'Linux';
+    }
+    else if (userAgent.includes('like Mac')) {
+        os = 'iOS';
+    }
+    else if (userAgent.includes('Mac')) {
+        os = 'Mac';
+    }
+    else if (userAgent.includes('Android')) {
+        os = 'Android';
+    }
+    else if (userAgent.includes('Win')) {
+        os = 'Win';
+    }
+    // Check if mobile
+    const isMobile = !!userAgent.match(/(iPhone|iPod|iPad|Android|BlackBerry)/);
+    // Device
+    const device = {
+        isMobile,
+        os,
+    };
+    /* ------------- Finish ------------- */
+    // Return info
+    return {
+        browser,
+        device,
+    };
+};
+
+/**
+ * Type of a log event
+ * @author Gabe Abrams
+ */
+var LogType;
+(function (LogType) {
+    // User action
+    LogType["Action"] = "action";
+    // Error
+    LogType["Error"] = "error";
+})(LogType || (LogType = {}));
+var LogType$1 = LogType;
+
+/**
+ * Source of a log event
+ * @author Gabe Abrams
+ */
+var LogSource;
+(function (LogSource) {
+    // Client
+    LogSource["Client"] = "client";
+    // Server
+    LogSource["Server"] = "server";
+})(LogSource || (LogSource = {}));
+var LogSource$1 = LogSource;
+
+/**
+ * Built-in metadata for logs
+ * @author Gabe Abrams
+ */
+const LogBuiltInMetadata = {
+    // Contexts
+    Context: {
+        Uncategorized: 'n/a',
+        ServerRenderedErrorPage: '_server-rendered-error-page',
+        ServerEndpointError: '_server-endpoint-error',
+    },
+    // Targets
+    Target: {
+        NoSpecificTarget: 'n/a',
+    },
+};
+
+/**
+ * Types of actions
+ * @author Gabe Abrams
+ */
+var LogAction;
+(function (LogAction) {
+    // Target was opened by the user (it was not on screen, but now it is)
+    LogAction["Open"] = "open";
+    // Target was closed by the user (it was on screen, but now it is not)
+    LogAction["Close"] = "close";
+    // Target was cancelled by the user (it was on closed without saving)
+    LogAction["Cancel"] = "cancel";
+    // Target was expanded by the user (it always remains on screen, but size was changed)
+    LogAction["Expand"] = "expand";
+    // Target was collapsed by the user (it always remains on screen, but size was changed)
+    LogAction["Collapse"] = "collapse";
+    // Target was viewed by the user (only for items that are not opened or closed, those must use Open/Close actions)
+    LogAction["View"] = "view";
+    // Target interrupted the user (popup, dialog, validation message, etc. appeared without user prompting)
+    LogAction["Interrupt"] = "interrupt";
+    // Target was created by the user (it did not exist before)
+    LogAction["Create"] = "create";
+    // Target was edited by the user (it existed and was changed)
+    LogAction["Edit"] = "edit";
+    // Target was deleted by the user (it existed and now it doesn't)
+    LogAction["Delete"] = "delete";
+    // Target was added by the user (it already existed and was added to another place)
+    LogAction["Add"] = "add";
+    // Target was removed by the user (it was removed from something but still exists)
+    LogAction["Remove"] = "remove";
+    // Target was activated by the user (click, check, tap, keypress, etc.)
+    LogAction["Activate"] = "activate";
+    // Target was deactivated by the user (click away, uncheck, tap outside of, tab away, etc.)
+    LogAction["Deactivate"] = "deactivate";
+    // User showed interest in a target (hover, peek, etc.)
+    LogAction["Peek"] = "peek";
+    // Unknown action
+    LogAction["Unknown"] = "unknown";
+})(LogAction || (LogAction = {}));
+var LogAction$1 = LogAction;
+
 /**
  * Generate an express API route handler
  * @author Gabe Abrams
@@ -2681,6 +2954,146 @@ const genRouteHandler = (opts) => {
                 status: 401,
             });
         }
+        /*----------------------------------------*/
+        /*               Log Handler              */
+        /*----------------------------------------*/
+        // Create a log handler function
+        /**
+         * Log an event on the server
+         * @author Gabe Abrams
+         */
+        const logServerEvent = (opts) => __awaiter(void 0, void 0, void 0, function* () {
+            var _c, _d, _e, _f, _g, _h, _j, _k, _l, _m, _o;
+            // NOTE: internally, we slip through an opts.overrideAsClientEvent boolean
+            // that indicates that this is actually a client event, but we don't
+            // include that in the LogFunction type because this is internal and
+            // hidden from users
+            try {
+                // Parse user agent
+                const { browser, device, } = parseUserAgent(req.headers['user-agent']);
+                // Get time info in ET
+                const { timestamp, year, month, day, hour, minute, } = getTimeInfoInET();
+                // Main log info
+                const mainLogInfo = {
+                    id: `${launchInfo.userId}-${Date.now()}-${Math.floor(Math.random() * 100000)}-${Math.floor(Math.random() * 100000)}`,
+                    userFirstName: launchInfo.userFirstName,
+                    userLastName: launchInfo.userLastName,
+                    userEmail: launchInfo.userEmail,
+                    userId: launchInfo.userId,
+                    isLearner: !!launchInfo.isLearner,
+                    isAdmin: !!launchInfo.isAdmin,
+                    isTTM: !!launchInfo.isTTM,
+                    courseId: launchInfo.courseId,
+                    courseName: launchInfo.courseName,
+                    browser,
+                    device,
+                    year,
+                    month,
+                    day,
+                    hour,
+                    minute,
+                    timestamp,
+                    context: (typeof opts.context === 'string'
+                        ? opts.context
+                        : ((_d = ((_c = opts.context) !== null && _c !== void 0 ? _c : {})._) !== null && _d !== void 0 ? _d : LogBuiltInMetadata.Context.Uncategorized)),
+                    subcontext: (typeof opts.context === 'string'
+                        ? opts.subcontext
+                        : ((_f = ((_e = opts.subcontext) !== null && _e !== void 0 ? _e : {})._) !== null && _f !== void 0 ? _f : LogBuiltInMetadata.Context.Uncategorized)),
+                    tags: (_g = opts.tags) !== null && _g !== void 0 ? _g : [],
+                    metadata: (_h = opts.metadata) !== null && _h !== void 0 ? _h : {},
+                };
+                // Type-specific info
+                const typeSpecificInfo = (('error' in opts && opts.error)
+                    ? {
+                        type: LogType$1.Error,
+                        errorMessage: (_j = opts.error.message) !== null && _j !== void 0 ? _j : 'Unknown message',
+                        errorCode: (_k = opts.error.code) !== null && _k !== void 0 ? _k : ReactKitErrorCode$1.NoCode,
+                        errorStack: (_l = opts.error.stack) !== null && _l !== void 0 ? _l : 'No stack',
+                    }
+                    : {
+                        type: LogType$1.Action,
+                        target: ((_m = opts.target) !== null && _m !== void 0 ? _m : LogBuiltInMetadata.Target.NoSpecificTarget),
+                        action: ((_o = opts.action) !== null && _o !== void 0 ? _o : LogAction$1.Unknown),
+                    });
+                // Source-specific info
+                const sourceSpecificInfo = (opts.overrideAsClientEvent
+                    ? {
+                        source: LogSource$1.Client,
+                    }
+                    : {
+                        source: LogSource$1.Server,
+                        routePath: req.path,
+                        routeTemplate: req.route.path,
+                    });
+                // Build log event
+                const log = Object.assign(Object.assign(Object.assign({}, mainLogInfo), typeSpecificInfo), sourceSpecificInfo);
+                // Either print to console or save to db
+                const logCollection = internalGetLogCollection();
+                if (logCollection) {
+                    // Store to the log collection
+                    yield logCollection.insert(log);
+                }
+                else {
+                    // Print to console
+                    if (log.type === LogType$1.Error) {
+                        console.error('dce-reactkit error log:', log);
+                    }
+                    else {
+                        console.log('dce-reactkit action log:', log);
+                    }
+                }
+                // Return log entry
+                return log;
+            }
+            catch (err) {
+                // Print because we cannot store the error
+                console.error('Could not log the following:', opts);
+                // Create a dummy log to return
+                const dummyMainInfo = {
+                    id: '-1',
+                    userFirstName: 'Unknown',
+                    userLastName: 'Unknown',
+                    userEmail: 'unknown@harvard.edu',
+                    userId: 1,
+                    isLearner: false,
+                    isAdmin: false,
+                    isTTM: false,
+                    courseId: 1,
+                    courseName: 'Unknown',
+                    browser: {
+                        name: 'Unknown',
+                        version: 'Unknown',
+                    },
+                    device: {
+                        isMobile: false,
+                        os: 'Unknown',
+                    },
+                    year: 1,
+                    month: 1,
+                    day: 1,
+                    hour: 1,
+                    minute: 1,
+                    timestamp: Date.now(),
+                    tags: [],
+                    metadata: {},
+                    context: LogBuiltInMetadata.Context.Uncategorized,
+                    subcontext: LogBuiltInMetadata.Context.Uncategorized,
+                };
+                const dummyTypeSpecificInfo = {
+                    type: LogType$1.Error,
+                    errorMessage: 'Unknown',
+                    errorCode: 'Unknown',
+                    errorStack: 'No Stack',
+                };
+                const dummySourceSpecificInfo = {
+                    source: LogSource$1.Server,
+                    routePath: req.path,
+                    routeTemplate: req.route.path,
+                };
+                const log = Object.assign(Object.assign(Object.assign({}, dummyMainInfo), dummyTypeSpecificInfo), dummySourceSpecificInfo);
+                return log;
+            }
+        });
         /*------------------------------------------------------------------------*/
         /*                              Call handler                              */
         /*------------------------------------------------------------------------*/
@@ -2718,9 +3131,24 @@ const genRouteHandler = (opts) => {
          * @param [opts.status=500] http status code
          */
         const renderErrorPage = (opts = {}) => {
-            var _a;
+            var _a, _b;
             const html = genErrorPage(opts);
             send(html, (_a = opts.status) !== null && _a !== void 0 ? _a : 500);
+            // Log
+            logServerEvent({
+                context: LogBuiltInMetadata.Context.ServerRenderedErrorPage,
+                error: {
+                    message: `${opts.title}: ${opts.description}`,
+                    code: opts.code,
+                },
+                metadata: {
+                    title: opts.title,
+                    description: opts.description,
+                    code: opts.code,
+                    pageTitle: opts.pageTitle,
+                    status: (_b = opts.status) !== null && _b !== void 0 ? _b : 500,
+                },
+            });
         };
         // Call the handler
         try {
@@ -2734,6 +3162,7 @@ const genRouteHandler = (opts) => {
                 },
                 redirect,
                 renderErrorPage,
+                logServerEvent,
             });
             // Send results to client (only if next wasn't called)
             if (!responseSent) {
@@ -2743,7 +3172,13 @@ const genRouteHandler = (opts) => {
         catch (err) {
             // Send error to client (only if next wasn't called)
             if (!responseSent) {
-                return handleError(res, err);
+                handleError(res, err);
+                // Log server-side error
+                logServerEvent({
+                    context: LogBuiltInMetadata.Context.ServerEndpointError,
+                    error: err,
+                });
+                return;
             }
             // Log error that was not responded with
             console.log('Error occurred but could not be sent to client because a response was already sent:', err);
@@ -2937,6 +3372,61 @@ const parallelLimit = (taskFunctions, limit) => __awaiter(void 0, void 0, void 0
     return results;
 });
 
+/**
+ * Log a user action on the client (cannot be used on the server)
+ * @author Gabe Abrams
+ */
+const logClientEvent = (opts) => __awaiter(void 0, void 0, void 0, function* () {
+    var _a, _b, _c, _d, _e, _f, _g;
+    return visitServerEndpoint({
+        path: LOG_ROUTE_PATH,
+        method: 'POST',
+        params: {
+            context: (typeof opts.context === 'string'
+                ? opts.context
+                : ((_b = ((_a = opts.context) !== null && _a !== void 0 ? _a : {})._) !== null && _b !== void 0 ? _b : LogBuiltInMetadata.Context.Uncategorized)),
+            subcontext: (typeof opts.context === 'string'
+                ? opts.subcontext
+                : ((_d = ((_c = opts.subcontext) !== null && _c !== void 0 ? _c : {})._) !== null && _d !== void 0 ? _d : LogBuiltInMetadata.Context.Uncategorized)),
+            tags: JSON.stringify((_e = opts.tags) !== null && _e !== void 0 ? _e : []),
+            metadata: JSON.stringify((_f = opts.metadata) !== null && _f !== void 0 ? _f : {}),
+            errorMessage: (opts.error
+                ? opts.error.message
+                : undefined),
+            errorCode: (opts.error
+                ? opts.error.code
+                : undefined),
+            errorStack: (opts.error
+                ? opts.error.stack
+                : undefined),
+            target: (opts.action
+                ? ((_g = opts.target) !== null && _g !== void 0 ? _g : LogBuiltInMetadata.Target.NoSpecificTarget)
+                : undefined),
+            action: (opts.action
+                ? opts.action
+                : undefined),
+        },
+    });
+});
+
+/**
+ * Initialize a log collection given the dce-mango Collection class
+ * @author Gabe Abrams
+ * @param Collection the Collection class from dce-mango
+ * @returns initialized logCollection
+ */
+const initLogCollection = (Collection) => {
+    return new Collection('Log', {
+        uniqueIndexKey: 'id',
+        indexKeys: [
+            'courseId',
+            'context',
+            'subcontext',
+            'tags',
+        ],
+    });
+};
+
 /**
  * Days of the week
  * @author Gabe Abrams
@@ -2965,6 +3455,10 @@ exports.ErrorWithCode = ErrorWithCode;
 exports.HOUR_IN_MS = HOUR_IN_MS;
 exports.ItemPicker = ItemPicker;
 exports.LoadingSpinner = LoadingSpinner;
+exports.LogAction = LogAction$1;
+exports.LogBuiltInMetadata = LogBuiltInMetadata;
+exports.LogSource = LogSource$1;
+exports.LogType = LogType$1;
 exports.MINUTE_IN_MS = MINUTE_IN_MS;
 exports.Modal = Modal;
 exports.ModalButtonType = ModalButtonType$1;
@@ -2993,7 +3487,9 @@ exports.getPartOfDay = getPartOfDay;
 exports.getTimeInfoInET = getTimeInfoInET;
 exports.handleError = handleError;
 exports.handleSuccess = handleSuccess;
+exports.initLogCollection = initLogCollection;
 exports.initServer = initServer;
+exports.logClientEvent = logClientEvent;
 exports.onlyKeepLetters = onlyKeepLetters;
 exports.padDecimalZeros = padDecimalZeros;
 exports.padZerosLeft = padZerosLeft;