dce-reactkit 3.1.20 → 3.2.0-beta.1

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (52) hide show
  1. package/dist/cjs/index.js +363 -19
  2. package/dist/cjs/index.js.map +1 -1
  3. package/dist/cjs/types/constants/LOG_ROUTE_PATH.d.ts +6 -0
  4. package/dist/cjs/types/constants/ROUTE_PATH_PREFIX.d.ts +6 -0
  5. package/dist/cjs/types/helpers/genRouteHandler.d.ts +2 -0
  6. package/dist/cjs/types/helpers/logClientEvent.d.ts +7 -0
  7. package/dist/cjs/types/helpers/parseUserAgent.d.ts +17 -0
  8. package/dist/cjs/types/index.d.ts +5 -1
  9. package/dist/cjs/types/server/initServer.d.ts +13 -0
  10. package/dist/cjs/types/types/Log/LogMainInfo.d.ts +37 -0
  11. package/dist/cjs/types/types/Log/LogSourceSpecificInfo.d.ts +13 -0
  12. package/dist/cjs/types/types/Log/LogTypeSpecificInfo.d.ts +17 -0
  13. package/dist/cjs/types/types/Log/index.d.ts +10 -0
  14. package/dist/cjs/types/types/LogAction.d.ts +22 -0
  15. package/dist/cjs/types/types/LogFunction.d.ts +20 -0
  16. package/dist/cjs/types/types/LogSource.d.ts +9 -0
  17. package/dist/cjs/types/types/LogType.d.ts +9 -0
  18. package/dist/esm/index.js +361 -20
  19. package/dist/esm/index.js.map +1 -1
  20. package/dist/esm/types/constants/LOG_ROUTE_PATH.d.ts +6 -0
  21. package/dist/esm/types/constants/ROUTE_PATH_PREFIX.d.ts +6 -0
  22. package/dist/esm/types/helpers/genRouteHandler.d.ts +2 -0
  23. package/dist/esm/types/helpers/logClientEvent.d.ts +7 -0
  24. package/dist/esm/types/helpers/parseUserAgent.d.ts +17 -0
  25. package/dist/esm/types/index.d.ts +5 -1
  26. package/dist/esm/types/server/initServer.d.ts +13 -0
  27. package/dist/esm/types/types/Log/LogMainInfo.d.ts +37 -0
  28. package/dist/esm/types/types/Log/LogSourceSpecificInfo.d.ts +13 -0
  29. package/dist/esm/types/types/Log/LogTypeSpecificInfo.d.ts +17 -0
  30. package/dist/esm/types/types/Log/index.d.ts +10 -0
  31. package/dist/esm/types/types/LogAction.d.ts +22 -0
  32. package/dist/esm/types/types/LogFunction.d.ts +20 -0
  33. package/dist/esm/types/types/LogSource.d.ts +9 -0
  34. package/dist/esm/types/types/LogType.d.ts +9 -0
  35. package/dist/index.d.ts +137 -1
  36. package/package.json +1 -1
  37. package/src/components/AppWrapper.tsx +1 -1
  38. package/src/constants/LOG_ROUTE_PATH.ts +9 -0
  39. package/src/constants/ROUTE_PATH_PREFIX.ts +7 -0
  40. package/src/helpers/genRouteHandler.ts +129 -1
  41. package/src/helpers/logClientEvent.tsx +50 -0
  42. package/src/helpers/parseUserAgent.ts +108 -0
  43. package/src/index.ts +8 -0
  44. package/src/server/initServer.ts +90 -0
  45. package/src/types/Log/LogMainInfo.ts +64 -0
  46. package/src/types/Log/LogSourceSpecificInfo.ts +25 -0
  47. package/src/types/Log/LogTypeSpecificInfo.ts +33 -0
  48. package/src/types/Log/index.ts +17 -0
  49. package/src/types/LogAction.ts +38 -0
  50. package/src/types/LogFunction.ts +41 -0
  51. package/src/types/LogSource.ts +12 -0
  52. package/src/types/LogType.ts +12 -0
package/dist/cjs/index.js CHANGED
@@ -2124,9 +2124,42 @@ const visitServerEndpoint = (opts) => __awaiter(void 0, void 0, void 0, function
2124
2124
  return body;
2125
2125
  });
2126
2126
 
2127
+ /**
2128
+ * Path that all routes start with
2129
+ * @author Gabe Abrams
2130
+ */
2131
+ const ROUTE_PATH_PREFIX = '/dce-reactkit';
2132
+
2133
+ /**
2134
+ * Path of the route for storing client-side logs
2135
+ * @author Gabe Abrams
2136
+ */
2137
+ const LOG_ROUTE_PATH = `${ROUTE_PATH_PREFIX}/log`;
2138
+
2139
+ /**
2140
+ * Server-side API param types
2141
+ * @author Gabe Abrams
2142
+ */
2143
+ var ParamType;
2144
+ (function (ParamType) {
2145
+ ParamType["Boolean"] = "boolean";
2146
+ ParamType["BooleanOptional"] = "boolean-optional";
2147
+ ParamType["Float"] = "float";
2148
+ ParamType["FloatOptional"] = "float-optional";
2149
+ ParamType["Int"] = "int";
2150
+ ParamType["IntOptional"] = "int-optional";
2151
+ ParamType["JSON"] = "json";
2152
+ ParamType["JSONOptional"] = "json-optional";
2153
+ ParamType["String"] = "string";
2154
+ ParamType["StringOptional"] = "string-optional";
2155
+ })(ParamType || (ParamType = {}));
2156
+ var ParamType$1 = ParamType;
2157
+
2127
2158
  // Import custom error
2128
2159
  // Stored copy of caccl functions
2129
2160
  let _cacclGetLaunchInfo;
2161
+ // Stored copy of dce-mango log collection
2162
+ let _logCollection;
2130
2163
  /*------------------------------------------------------------------------*/
2131
2164
  /* Helpers */
2132
2165
  /*------------------------------------------------------------------------*/
@@ -2142,6 +2175,15 @@ const cacclGetLaunchInfo = (req) => {
2142
2175
  }
2143
2176
  return _cacclGetLaunchInfo(req);
2144
2177
  };
2178
+ /**
2179
+ * Get log collection
2180
+ * @author Gabe Abrams
2181
+ * @returns log collection if one was included during launch or null if we don't
2182
+ * have a log collection (yet)
2183
+ */
2184
+ const internalGetLogCollection = () => {
2185
+ return _logCollection !== null && _logCollection !== void 0 ? _logCollection : null;
2186
+ };
2145
2187
  /*------------------------------------------------------------------------*/
2146
2188
  /* Main */
2147
2189
  /*------------------------------------------------------------------------*/
@@ -2149,31 +2191,73 @@ const cacclGetLaunchInfo = (req) => {
2149
2191
  * Prepare dce-reactkit to run on the server
2150
2192
  * @author Gabe Abrams
2151
2193
  * @param opts object containing all arguments
2194
+ * @param opts.app express app from inside of the postprocessor function that
2195
+ * we will add routes to
2152
2196
  * @param opts.getLaunchInfo CACCL LTI's get launch info function
2197
+ * @param [opts.logCollection] mongo collection from dce-mango to use for
2198
+ * storing logs. If none is included, logs are written to the console
2153
2199
  */
2154
2200
  const initServer = (opts) => {
2155
2201
  _cacclGetLaunchInfo = opts.getLaunchInfo;
2202
+ _logCollection = opts.logCollection;
2203
+ /**
2204
+ * Log an event
2205
+ * @author Gabe Abrams
2206
+ * @param {string} category Category of the event (each app determines how to
2207
+ * categorize its events)
2208
+ * @param {string} subcategory Subcategory of the event (each app determines
2209
+ * how to categorize its events)
2210
+ * @param {string} tags stringified list of tags that apply to this action
2211
+ * (each app determines tag usage)
2212
+ * @param {string} metadata stringified object containing optional custom metadata
2213
+ * @param {string} [errorMessage] error message if type is an error
2214
+ * @param {string} [errorCode] error code if type is an error
2215
+ * @param {string} [errorStack] error stack if type is an error
2216
+ * @param {string} [target] Target of the action (each app determines the list
2217
+ * of targets) These are usually buttons, panels, elements, etc.
2218
+ * @param {LogAction} [action] the type of action performed on the target
2219
+ * @returns {Log}
2220
+ */
2221
+ opts.app.post(LOG_ROUTE_PATH, genRouteHandler({
2222
+ paramTypes: {
2223
+ category: ParamType$1.String,
2224
+ subcategory: ParamType$1.String,
2225
+ tags: ParamType$1.JSON,
2226
+ metadata: ParamType$1.JSON,
2227
+ errorMessage: ParamType$1.StringOptional,
2228
+ errorCode: ParamType$1.StringOptional,
2229
+ errorStack: ParamType$1.StringOptional,
2230
+ target: ParamType$1.StringOptional,
2231
+ action: ParamType$1.StringOptional,
2232
+ },
2233
+ handler: ({ params, logServerEvent }) => {
2234
+ const log = logServerEvent((params.errorMessage || params.errorCode || params.errorStack)
2235
+ // Error
2236
+ ? {
2237
+ category: params.category,
2238
+ subcategory: params.subcategory,
2239
+ tags: params.tags,
2240
+ metadata: params.metadata,
2241
+ error: {
2242
+ message: params.errorMessage,
2243
+ code: params.errorCode,
2244
+ stack: params.errorStack,
2245
+ },
2246
+ }
2247
+ // Action
2248
+ : {
2249
+ category: params.category,
2250
+ subcategory: params.subcategory,
2251
+ tags: params.tags,
2252
+ metadata: params.metadata,
2253
+ target: params.target,
2254
+ action: params.action,
2255
+ });
2256
+ return log;
2257
+ },
2258
+ }));
2156
2259
  };
2157
2260
 
2158
- /**
2159
- * Server-side API param types
2160
- * @author Gabe Abrams
2161
- */
2162
- var ParamType;
2163
- (function (ParamType) {
2164
- ParamType["Boolean"] = "boolean";
2165
- ParamType["BooleanOptional"] = "boolean-optional";
2166
- ParamType["Float"] = "float";
2167
- ParamType["FloatOptional"] = "float-optional";
2168
- ParamType["Int"] = "int";
2169
- ParamType["IntOptional"] = "int-optional";
2170
- ParamType["JSON"] = "json";
2171
- ParamType["JSONOptional"] = "json-optional";
2172
- ParamType["String"] = "string";
2173
- ParamType["StringOptional"] = "string-optional";
2174
- })(ParamType || (ParamType = {}));
2175
- var ParamType$1 = ParamType;
2176
-
2177
2261
  // Import shared types
2178
2262
  /**
2179
2263
  * Handle an error and respond to the client
@@ -2366,6 +2450,137 @@ const genErrorPage = (opts = {}) => {
2366
2450
  `;
2367
2451
  };
2368
2452
 
2453
+ /**
2454
+ * Perform a rudimentary parsing of the user's browser agent string
2455
+ * @author Gabe Abrams
2456
+ * @param userAgent the user's browser agent
2457
+ * @returns user info
2458
+ */
2459
+ const parseUserAgent = (userAgent) => {
2460
+ /* ------------- Browser ------------ */
2461
+ let browser = {
2462
+ name: 'Unknown',
2463
+ version: 'Unknown',
2464
+ };
2465
+ // Parse user agent
2466
+ let verOffset;
2467
+ let nameOffset;
2468
+ if ((verOffset = userAgent.indexOf('Opera')) !== -1) {
2469
+ // In Opera, the true version is after 'Opera' or after 'Version'
2470
+ browser = {
2471
+ name: 'Opera',
2472
+ version: userAgent.substring(verOffset + 6),
2473
+ };
2474
+ if ((verOffset = userAgent.indexOf('Version')) !== -1) {
2475
+ browser.version = userAgent.substring(verOffset + 8);
2476
+ }
2477
+ }
2478
+ else if ((verOffset = userAgent.indexOf('MSIE')) !== -1) {
2479
+ // In MSIE, the true version is after 'MSIE' in userAgent
2480
+ browser = {
2481
+ name: 'Internet Explorer',
2482
+ version: userAgent.substring(verOffset + 5),
2483
+ };
2484
+ }
2485
+ else if ((verOffset = userAgent.indexOf('Chrome')) !== -1) {
2486
+ // In Chrome, the true version is after 'Chrome'
2487
+ browser = {
2488
+ name: 'Chrome',
2489
+ version: userAgent.substring(verOffset + 7),
2490
+ };
2491
+ }
2492
+ else if ((verOffset = userAgent.indexOf('Safari')) !== -1) {
2493
+ // In Safari, the true version is after 'Safari' or after 'Version'
2494
+ browser = {
2495
+ name: 'Safari',
2496
+ version: userAgent.substring(verOffset + 7),
2497
+ };
2498
+ if ((verOffset = userAgent.indexOf('Version')) !== -1) {
2499
+ browser.version = userAgent.substring(verOffset + 8);
2500
+ }
2501
+ }
2502
+ else if ((verOffset = userAgent.indexOf('Firefox')) != -1) {
2503
+ // In Firefox, the true version is after 'Firefox'
2504
+ browser = {
2505
+ name: 'Firefox',
2506
+ version: userAgent.substring(verOffset + 8),
2507
+ };
2508
+ }
2509
+ else if ((nameOffset = userAgent.lastIndexOf(' ') + 1)
2510
+ < (verOffset = userAgent.lastIndexOf('/'))) {
2511
+ browser = {
2512
+ name: userAgent.substring(nameOffset, verOffset),
2513
+ version: userAgent.substring(verOffset + 1),
2514
+ };
2515
+ }
2516
+ // Postprocess version
2517
+ // trim the fullVersion string at semicolon/space if present
2518
+ let ix;
2519
+ if ((ix = browser.version.indexOf(';')) !== -1) {
2520
+ browser.version = browser.version.substring(0, ix);
2521
+ }
2522
+ if ((ix = browser.version.indexOf(' ')) !== -1) {
2523
+ browser.version = browser.version.substring(0, ix);
2524
+ }
2525
+ /* ------------- Device ------------- */
2526
+ // Detect os
2527
+ let os = 'Unknown';
2528
+ if (userAgent.includes('Linux')) {
2529
+ os = 'Linux';
2530
+ }
2531
+ else if (userAgent.includes('like Mac')) {
2532
+ os = 'iOS';
2533
+ }
2534
+ else if (userAgent.includes('Mac')) {
2535
+ os = 'Mac';
2536
+ }
2537
+ else if (userAgent.includes('Android')) {
2538
+ os = 'Android';
2539
+ }
2540
+ else if (userAgent.includes('Win')) {
2541
+ os = 'Win';
2542
+ }
2543
+ // Check if mobile
2544
+ const isMobile = !!userAgent.match(/(iPhone|iPod|iPad|Android|BlackBerry)/);
2545
+ // Device
2546
+ const device = {
2547
+ isMobile,
2548
+ os,
2549
+ };
2550
+ /* ------------- Finish ------------- */
2551
+ // Return info
2552
+ return {
2553
+ browser,
2554
+ device,
2555
+ };
2556
+ };
2557
+
2558
+ /**
2559
+ * Type of a log event
2560
+ * @author Gabe Abrams
2561
+ */
2562
+ var LogType;
2563
+ (function (LogType) {
2564
+ // User action
2565
+ LogType["Action"] = "action";
2566
+ // Error
2567
+ LogType["Error"] = "error";
2568
+ })(LogType || (LogType = {}));
2569
+ var LogType$1 = LogType;
2570
+
2571
+ /**
2572
+ * Source of a log event
2573
+ * @author Gabe Abrams
2574
+ */
2575
+ var LogSource;
2576
+ (function (LogSource) {
2577
+ // Client
2578
+ LogSource["Client"] = "client";
2579
+ // Server
2580
+ LogSource["Server"] = "server";
2581
+ })(LogSource || (LogSource = {}));
2582
+ var LogSource$1 = LogSource;
2583
+
2369
2584
  /**
2370
2585
  * Generate an express API route handler
2371
2586
  * @author Gabe Abrams
@@ -2681,6 +2896,92 @@ const genRouteHandler = (opts) => {
2681
2896
  status: 401,
2682
2897
  });
2683
2898
  }
2899
+ /*----------------------------------------*/
2900
+ /* Log Handler */
2901
+ /*----------------------------------------*/
2902
+ // Create a log handler function
2903
+ /**
2904
+ * Log an event on the server
2905
+ * @author Gabe Abrams
2906
+ */
2907
+ const logServerEvent = (opts) => __awaiter(void 0, void 0, void 0, function* () {
2908
+ // NOTE: internally, we slip through an opts.overrideAsClientEvent boolean
2909
+ // that indicates that this is actually a client event, but we don't
2910
+ // include that in the LogFunction type because this is internal and
2911
+ // hidden from users
2912
+ var _c, _d, _e, _f, _g, _h, _j, _k;
2913
+ // Parse user agent
2914
+ const { browser, device, } = parseUserAgent(req.headers['user-agent']);
2915
+ // Get time info in ET
2916
+ const { timestamp, year, month, day, hour, minute, } = getTimeInfoInET();
2917
+ // Main log info
2918
+ const mainLogInfo = {
2919
+ id: `${launchInfo.userId}-${Date.now()}-${Math.floor(Math.random() * 100000)}-${Math.floor(Math.random() * 100000)}`,
2920
+ userFirstName: launchInfo.userFirstName,
2921
+ userLastName: launchInfo.userLastName,
2922
+ userEmail: launchInfo.userEmail,
2923
+ userId: launchInfo.userId,
2924
+ isLearner: !!launchInfo.isLearner,
2925
+ isAdmin: !!launchInfo.isAdmin,
2926
+ isTTM: !!launchInfo.isTTM,
2927
+ courseId: launchInfo.courseId,
2928
+ courseName: launchInfo.courseName,
2929
+ browser,
2930
+ device,
2931
+ year,
2932
+ month,
2933
+ day,
2934
+ hour,
2935
+ minute,
2936
+ timestamp,
2937
+ category: opts.category,
2938
+ subcategory: (_c = opts.subcategory) !== null && _c !== void 0 ? _c : 'none',
2939
+ tags: (_d = opts.tags) !== null && _d !== void 0 ? _d : [],
2940
+ metadata: (_e = opts.metadata) !== null && _e !== void 0 ? _e : {},
2941
+ };
2942
+ // Type-specific info
2943
+ const typeSpecificInfo = (('error' in opts && opts.error)
2944
+ ? {
2945
+ type: LogType$1.Error,
2946
+ errorMessage: (_f = opts.error.message) !== null && _f !== void 0 ? _f : 'Unknown message',
2947
+ errorCode: (_g = opts.error.code) !== null && _g !== void 0 ? _g : ReactKitErrorCode$1.NoCode,
2948
+ errorStack: (_h = opts.error.stack) !== null && _h !== void 0 ? _h : 'No stack',
2949
+ }
2950
+ : {
2951
+ type: LogType$1.Action,
2952
+ target: (_j = opts.target) !== null && _j !== void 0 ? _j : 'Unknown',
2953
+ action: (_k = opts.action) !== null && _k !== void 0 ? _k : 'Unknown'
2954
+ });
2955
+ // Source-specific info
2956
+ const sourceSpecificInfo = (opts.overrideAsClientEvent
2957
+ ? {
2958
+ source: LogSource$1.Client,
2959
+ }
2960
+ : {
2961
+ source: LogSource$1.Server,
2962
+ routePath: req.path,
2963
+ routeTemplate: req.route.path,
2964
+ });
2965
+ // Build log event
2966
+ const log = Object.assign(Object.assign(Object.assign({}, mainLogInfo), typeSpecificInfo), sourceSpecificInfo);
2967
+ // Either print to console or save to db
2968
+ const logCollection = internalGetLogCollection();
2969
+ if (logCollection) {
2970
+ // Store to the log collection
2971
+ yield logCollection.insert(log);
2972
+ }
2973
+ else {
2974
+ // Print to console
2975
+ if (log.type === LogType$1.Error) {
2976
+ console.error('dce-reactkit error log:', log);
2977
+ }
2978
+ else {
2979
+ console.log('dce-reactkit action log:', log);
2980
+ }
2981
+ }
2982
+ // Return log entry
2983
+ return log;
2984
+ });
2684
2985
  /*------------------------------------------------------------------------*/
2685
2986
  /* Call handler */
2686
2987
  /*------------------------------------------------------------------------*/
@@ -2734,6 +3035,7 @@ const genRouteHandler = (opts) => {
2734
3035
  },
2735
3036
  redirect,
2736
3037
  renderErrorPage,
3038
+ logServerEvent,
2737
3039
  });
2738
3040
  // Send results to client (only if next wasn't called)
2739
3041
  if (!responseSent) {
@@ -2953,6 +3255,45 @@ var DayOfWeek;
2953
3255
  })(DayOfWeek || (DayOfWeek = {}));
2954
3256
  var DayOfWeek$1 = DayOfWeek;
2955
3257
 
3258
+ /**
3259
+ * Types of actions
3260
+ * @author Gabe Abrams
3261
+ */
3262
+ var LogAction;
3263
+ (function (LogAction) {
3264
+ // Target was opened by the user (it was not on screen, but now it is)
3265
+ LogAction["Open"] = "open";
3266
+ // Target was closed by the user (it was on screen, but now it is not)
3267
+ LogAction["Close"] = "close";
3268
+ // Target was expanded by the user (it always remains on screen, but size was changed)
3269
+ LogAction["Expand"] = "expand";
3270
+ // Target was collapsed by the user (it always remains on screen, but size was changed)
3271
+ LogAction["Collapse"] = "collapse";
3272
+ // Target was viewed by the user (only for items that are not opened or closed, those must use Open/Close actions)
3273
+ LogAction["View"] = "view";
3274
+ // Target interrupted the user (popup, dialog, validation message, etc. appeared without user prompting)
3275
+ LogAction["Interrupt"] = "interrupt";
3276
+ // Target was created by the user (it did not exist before)
3277
+ LogAction["Create"] = "create";
3278
+ // Target was edited by the user (it existed and was changed)
3279
+ LogAction["Edit"] = "edit";
3280
+ // Target was deleted by the user (it existed and now it doesn't)
3281
+ LogAction["Delete"] = "delete";
3282
+ // Target was added by the user (it already existed and was added to another place)
3283
+ LogAction["Add"] = "add";
3284
+ // Target was removed by the user (it was removed from something but still exists)
3285
+ LogAction["Remove"] = "remove";
3286
+ // Target was activated by the user (click, check, tap, keypress, etc.)
3287
+ LogAction["Activate"] = "activate";
3288
+ // Target was deactivated by the user (click away, uncheck, tap outside of, tab away, etc.)
3289
+ LogAction["Deactivate"] = "deactivate";
3290
+ // User showed interest in a target (hover, peek, etc.)
3291
+ LogAction["Peek"] = "peek";
3292
+ // Unknown action
3293
+ LogAction["Unknown"] = "unknown";
3294
+ })(LogAction || (LogAction = {}));
3295
+ var LogAction$1 = LogAction;
3296
+
2956
3297
  exports.AppWrapper = AppWrapper;
2957
3298
  exports.ButtonInputGroup = ButtonInputGroup;
2958
3299
  exports.CheckboxButton = CheckboxButton;
@@ -2965,6 +3306,9 @@ exports.ErrorWithCode = ErrorWithCode;
2965
3306
  exports.HOUR_IN_MS = HOUR_IN_MS;
2966
3307
  exports.ItemPicker = ItemPicker;
2967
3308
  exports.LoadingSpinner = LoadingSpinner;
3309
+ exports.LogAction = LogAction$1;
3310
+ exports.LogSource = LogSource$1;
3311
+ exports.LogType = LogType$1;
2968
3312
  exports.MINUTE_IN_MS = MINUTE_IN_MS;
2969
3313
  exports.Modal = Modal;
2970
3314
  exports.ModalButtonType = ModalButtonType$1;