dce-reactkit 3.2.2-beta.9 → 3.2.4

package/src/components/SimpleDateChooser.tsx

@@ -62,11 +62,7 @@ const SimpleDateChooser: React.FC<Props> = (props) => {
     onChange,
     chooseFromPast,
   } = props;
-  let numMonthsToShow = forceNumIntoBounds(
-    (props.numMonthsToShow ?? 6),
-    1,
-    12,
-  );
+  const numMonthsToShow = (props.numMonthsToShow ?? 6);
 
   /*------------------------------------------------------------------------*/
   /*                                 Render                                 */
@@ -88,7 +84,7 @@ const SimpleDateChooser: React.FC<Props> = (props) => {
   let startMonth = today.month;
   if (chooseFromPast) {
     startMonth -= Math.max(0, numMonthsToShow - 1);
-    if (startMonth <= 0) {
+    while (startMonth <= 0) {
       startMonth += 12;
       startYear -= 1;
     }
@@ -96,28 +92,37 @@ const SimpleDateChooser: React.FC<Props> = (props) => {
   for (let i = 0; i < numMonthsToShow; i++) {
     // Get month and year info
     const unmoddedMonth = (startMonth + i);
-    const month = (
-      unmoddedMonth > 12
-        ? unmoddedMonth - 12
-        : unmoddedMonth
-    );
+    let month = unmoddedMonth;
+    while (month > 12) {
+      month -= 12;
+    }
     const monthName = getMonthName(month).full;
-    const year = (
-      unmoddedMonth > 12
-        ? startYear + 1
-        : startYear
-    );
+    // Year is start year +1 for each 12 months
+    const year = (startYear + (Math.floor(unmoddedMonth / 12)));
 
     // Figure out which days are allowed
     const days = [];
     const numDaysInMonth = (new Date(year, month, 0)).getDate();
-    const firstDay = (
-      month === today.month
-        ? today.day // Current month: start at current date
-        : 1 // Future month: start at beginning of month
-    );
-    for (let day = firstDay; day <= numDaysInMonth; day++) {
-      days.push(day);
+    if (chooseFromPast) {
+      // Past selection
+      const numDaysToAdd = (
+        (month === today.month)
+          ? today.day // Current month, only add up to today
+          : numDaysInMonth // Past month, add all days
+      );
+      for (let day = 1; day <= numDaysToAdd; day++) {
+        days.push(day);
+      }
+    } else {
+      // Future selection: add all remaining days of the month
+      const firstDay = (
+        month === today.month
+          ? today.day // Current month: start at current date
+          : 1 // Future month: start at beginning of month
+      );
+      for (let day = firstDay; day <= numDaysInMonth; day++) {
+        days.push(day);
+      }
     }
 
     choices.push({
@@ -136,7 +141,7 @@ const SimpleDateChooser: React.FC<Props> = (props) => {
     monthOptions.push(
       <option
         key={choice.month}
-        value={choice.month}
+        value={`${choice.month}-${choice.year}`}
         aria-label={`choose ${choice.choiceName}`}
         onSelect={() => {
           onChange(choice.month, choice.days[0], choice.year);
@@ -176,7 +181,7 @@ const SimpleDateChooser: React.FC<Props> = (props) => {
         className="custom-select d-inline-block mr-1"
         style={{ width: 'auto' }}
         id={`SimpleDateChooser-${name}-month`}
-        value={month}
+        value={`${month}-${year}`}
         onChange={(e) => {
           const choice = choices[e.target.selectedIndex];
 

package/src/dynamicConstants/DynamicWord.tsx

@@ -0,0 +1,44 @@
+// Import shared types
+import isMobileOrTablet from '../helpers/isMobileOrTablet';
+
+// Check if mobile
+const isMobile = isMobileOrTablet();
+
+/**
+ * Dynamic words determined by the user's platform
+ * @author Gabe Abrams
+ */
+const DynamicWord = {
+  Click: (
+    isMobile
+      ? 'tap'
+      : 'click'
+  ),
+  ClickCapitalized: (
+    isMobile
+      ? 'Tap'
+      : 'Click'
+  ),
+  App: (
+    isMobile
+      ? 'app'
+      : 'application'
+  ),
+  AppCapitalized: (
+    isMobile
+      ? 'App'
+      : 'Application'
+  ),
+  Device: (
+    isMobile
+      ? 'device'
+      : 'computer'
+  ),
+  DeviceCapitalized: (
+    isMobile
+      ? 'Device'
+      : 'Computer'
+  ),
+};
+
+export default DynamicWord;

package/src/helpers/genCSV.ts

@@ -5,13 +5,13 @@
  * @returns escaped cell text
  */
 const escapeCellText = (text: string): string => {
-  if (!text.includes(',')) {
+  if (!String(text).includes(',')) {
     // No need to escape
-    return text;
+    return String(text);
   }
 
   // Perform escape
-  return `"${text.replace(/"/g, '""')}`;
+  return `"${String(text).replace(/"/g, '""')}`;
 };
 
 /**
@@ -43,10 +43,28 @@ const genCSV = (
 
   // Add each row
   data.forEach((datum) => {
+    csv += '\n';
     csv += (
       columns
         .map((column) => {
-          return escapeCellText(datum[column.param]);
+          let contents: string;
+          const cell = datum[column.param];
+          if (
+            typeof cell === 'string'
+            || typeof cell === 'number'
+          ) {
+            contents = String(cell);
+          } else if (
+            typeof cell === 'undefined'
+            || cell === null
+          ) {
+            contents = '';
+          } else if (typeof cell === 'object') {
+            contents = JSON.stringify(cell);
+          } else {
+            contents = '';
+          }
+          return escapeCellText(contents);
         })
         .join(',')
     );

package/src/helpers/genRouteHandler.ts

@@ -500,7 +500,7 @@ const genRouteHandler = (
           isAdmin: !!launchInfo.isAdmin,
           isTTM: !!launchInfo.isTTM,
           courseId: launchInfo.courseId,
-          courseName: launchInfo.courseName,
+          courseName: launchInfo.contextLabel,
           browser,
           device,
           year,
@@ -539,7 +539,7 @@ const genRouteHandler = (
               type: LogType.Action,
               target: (
                 (opts as any).target
-                ?? LogBuiltInMetadata.Target.NoSpecificTarget
+                ?? LogBuiltInMetadata.Target.NoTarget
               ),
               action: (
                 (opts as any).action

package/src/helpers/isMobileOrTablet.tsx

@@ -0,0 +1,26 @@
+// True if user is on mobile or tablet
+let cachedResult: boolean | undefined = undefined;
+
+/**
+ * Check if the user is on a mobile device or tablet
+ * from https://stackoverflow.com/questions/11381673/detecting-a-mobile-browser
+ * @returns true if user is on a mobile device
+ */
+const isMobileOrTablet = () => {
+  if (cachedResult !== undefined) {
+    return cachedResult;
+  }
+
+  try {
+    let check = false;
+    ((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;
+  } catch (err) {
+    // Probably this code is being executed on a server
+    cachedResult = false;
+    return cachedResult;
+  }
+};
+
+export default isMobileOrTablet;

package/src/helpers/logClientEvent.tsx

@@ -53,7 +53,7 @@ const logClientEvent: LogFunction = async (opts) => {
         (opts as any).action
           ? (
             (opts as any).target
-            ?? LogBuiltInMetadata.Target.NoSpecificTarget
+            ?? LogBuiltInMetadata.Target.NoTarget
           )
           : undefined
       ),

package/src/index.ts

@@ -26,6 +26,9 @@ 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 dynamic constants
+import DynamicWord from './dynamicConstants/DynamicWord';
+
 // Import helpers
 import abbreviate from './helpers/abbreviate';
 import avg from './helpers/avg';
@@ -56,6 +59,7 @@ import initLogCollection from './server/initLogCollection';
 import getMonthName from './helpers/getMonthName';
 import genCSV from './helpers/genCSV';
 import canReviewLogs from './helpers/canReviewLogs';
+import isMobileOrTablet from './helpers/isMobileOrTablet';
 
 // Import types
 import ModalButtonType from './types/ModalButtonType';
@@ -107,6 +111,8 @@ export {
   MINUTE_IN_MS,
   HOUR_IN_MS,
   DAY_IN_MS,
+  // Dynamic Constants
+  DynamicWord,
   // Helpers
   abbreviate,
   avg,
@@ -130,6 +136,7 @@ export {
   getMonthName,
   genCSV,
   canReviewLogs,
+  isMobileOrTablet,
   // Client helpers
   visitServerEndpoint,
   logClientEvent,

package/src/server/initServer.ts

@@ -249,10 +249,14 @@ const initServer = (
       },
       handler: async ({ params }) => {
         // Get user info
-        const { userId, isAdmin } = params;
+        const {
+          year,
+          month,
+          userId,
+          isAdmin,
+        } = params;
 
         // Validate user
-        // isAdmin is already checked because path starts with '/admin'
         const canReview = await canReviewLogs(userId, isAdmin);
         if (!canReview) {
           throw new ErrorWithCode(
@@ -262,7 +266,10 @@ const initServer = (
         }
 
         // Query for logs
-        const logs: Log[] = await _logCollection.find({ userId });
+        const logs: Log[] = await _logCollection.find({
+          year,
+          month,
+        });
 
         // Return logs
         return logs;

package/src/types/LogAction.ts

@@ -4,37 +4,37 @@
  */
 enum LogAction {
   // Target was opened by the user (it was not on screen, but now it is)
-  Open = 'open',
+  Open = 'Open',
   // Target was closed by the user (it was on screen, but now it is not)
-  Close = 'close',
+  Close = 'Close',
   // Target was cancelled by the user (it was on closed without saving)
-  Cancel = 'cancel',
+  Cancel = 'Cancel',
   // Target was expanded by the user (it always remains on screen, but size was changed)
-  Expand = 'expand',
+  Expand = 'Expand',
   // Target was collapsed by the user (it always remains on screen, but size was changed)
-  Collapse = 'collapse',
+  Collapse = 'Collapse',
   // Target was viewed by the user (only for items that are not opened or closed, those must use Open/Close actions)
-  View = 'view',
+  View = 'View',
   // Target interrupted the user (popup, dialog, validation message, etc. appeared without user prompting)
-  Interrupt = 'interrupt',
+  Interrupt = 'Interrupt',
   // Target was created by the user (it did not exist before)
-  Create = 'create',
+  Create = 'Create',
   // Target was edited by the user (it existed and was changed)
-  Edit = 'edit',
+  Edit = 'Edit',
   // Target was deleted by the user (it existed and now it doesn't)
-  Delete = 'delete',
+  Delete = 'Delete',
   // Target was added by the user (it already existed and was added to another place)
-  Add = 'add',
+  Add = 'Add',
   // Target was removed by the user (it was removed from something but still exists)
-  Remove = 'remove',
+  Remove = 'Remove',
   // Target was activated by the user (click, check, tap, keypress, etc.)
-  Activate = 'activate',
+  Activate = 'Activate',
   // Target was deactivated by the user (click away, uncheck, tap outside of, tab away, etc.)
-  Deactivate = 'deactivate',
+  Deactivate = 'Deactivate',
   // User showed interest in a target (hover, peek, etc.)
-  Peek = 'peek',
+  Peek = 'Peek',
   // Unknown action
-  Unknown = 'unknown',
+  Unknown = 'Unknown',
 };
 
 export default LogAction;

package/src/types/LogBuiltInMetadata.ts

@@ -5,14 +5,14 @@
 const LogBuiltInMetadata = {
   // Contexts
   Context: {
-    Uncategorized: 'n/a',
-    ServerRenderedErrorPage: '_server-rendered-error-page',
-    ServerEndpointError: '_server-endpoint-error',
-    ClientFatalError: '_client-fatal-error',
+    Uncategorized: 'Uncategorized',
+    ServerRenderedErrorPage: 'ServerRenderedErrorPage',
+    ServerEndpointError: 'ServerEndpointError',
+    ClientFatalError: 'ClientFatalError',
   },
   // Targets
   Target: {
-    NoSpecificTarget: 'n/a',
+    NoTarget: 'NoTarget',
   },
 };
 

package/src/types/LogMetadataContextMap.ts

@@ -0,0 +1,15 @@
+/**
+ * Type of the context map in a LogMetadata file
+ * @author Gabe Abrams
+ */
+type LogMetadataContextMap = {
+  [k: string]: (
+    | string
+    | {
+      _: string,
+      [k: string]: string
+    }
+  )
+};
+
+export default LogMetadataContextMap;

package/src/types/LogMetadataTagMap.ts

@@ -0,0 +1,9 @@
+/**
+ * Type of the tag map inside a LogMetadata file
+ * @author Gabe Abrams
+ */
+type LogMetadataTagMap = {
+  [k: string]: string
+};
+
+export default LogMetadataTagMap;

package/src/types/LogMetadataTargetMap.ts

@@ -0,0 +1,9 @@
+/**
+ * Type of the target map inside a LogMetadata file
+ * @author Gabe Abrams
+ */
+type LogMetadataTargetMap = {
+  [k: string]: string
+};
+
+export default LogMetadataTargetMap;

package/src/types/LogMetadataType.ts

@@ -1,23 +1,16 @@
+// Import shared types
+import LogMetadataContextMap from './LogMetadataContextMap';
+import LogMetadataTagMap from './LogMetadataTagMap';
+import LogMetadataTargetMap from './LogMetadataTargetMap';
+
 /**
  * Type of a LogMetadata file
  * @author Gabe Abrams
  */
 type LogMetadataType = {
-  Context?: {
-    [k: string]: (
-      | string
-      | {
-        _: string,
-        [k: string]: string
-      }
-    )
-  },
-  Tag?: {
-    [k: string]: string
-  },
-  Target?: {
-    [k: string]: string
-  },
+  Context?: LogMetadataContextMap,
+  Tag?: LogMetadataTagMap,
+  Target?: LogMetadataTargetMap,
 };
 
 export default LogMetadataType;