dce-reactkit 3.2.2-beta.44 → 3.2.2-beta.47

package/src/components/LogReviewer.tsx

@@ -36,6 +36,8 @@ import LogAction from '../types/LogAction';
 import ParamType from '../types/ParamType';
 import IntelliTableColumn from '../types/IntelliTableColumn';
 import LogBuiltInMetadata from '../types/LogBuiltInMetadata';
+import LogMetadataContextMap from '../types/LogMetadataContextMap';
+import LogMetadataTargetMap from '../types/LogMetadataTargetMap';
 
 // Import shared components
 import SimpleDateChooser from './SimpleDateChooser';
@@ -262,6 +264,197 @@ const style = `
   }
 `;
 
+/*------------------------------------------------------------------------*/
+/*                                Constants                               */
+/*------------------------------------------------------------------------*/
+
+const columns: IntelliTableColumn[] = [
+  {
+    title: 'First Name',
+    param: 'userFirstName',
+    type: ParamType.String,
+  },
+  {
+    title: 'Last Name',
+    param: 'userLastName',
+    type: ParamType.String,
+  },
+  {
+    title: 'Email',
+    param: 'userEmail',
+    type: ParamType.String,
+  },
+  {
+    title: 'Canvas Id',
+    param: 'userId',
+    type: ParamType.Int,
+  },
+  {
+    title: 'Student?',
+    param: 'isLearner',
+    type: ParamType.Boolean,
+  },
+  {
+    title: 'Teaching Staff?',
+    param: 'isTTM',
+    type: ParamType.Boolean,
+    startsHidden: true,
+  },
+  {
+    title: 'Admin?',
+    param: 'isAdmin',
+    type: ParamType.Boolean,
+    startsHidden: true,
+  },
+  {
+    title: 'Course Canvas Id',
+    param: 'courseId',
+    type: ParamType.Int,
+    startsHidden: true,
+  },
+  {
+    title: 'Course Name',
+    param: 'courseName',
+    type: ParamType.String,
+  },
+  {
+    title: 'Browser Name',
+    param: 'browser.name',
+    type: ParamType.String,
+    startsHidden: true,
+  },
+  {
+    title: 'Browser Version',
+    param: 'browser.version',
+    type: ParamType.String,
+    startsHidden: true,
+  },
+  {
+    title: 'OS',
+    param: 'device.os',
+    type: ParamType.String,
+    startsHidden: true,
+  },
+  {
+    title: 'Mobile?',
+    param: 'device.isMobile',
+    type: ParamType.Boolean,
+    startsHidden: true,
+  },
+  {
+    title: 'Year',
+    param: 'year',
+    type: ParamType.Int,
+  },
+  {
+    title: 'Month',
+    param: 'month',
+    type: ParamType.Int,
+  },
+  {
+    title: 'Day',
+    param: 'day',
+    type: ParamType.Int,
+  },
+  {
+    title: 'Hour',
+    param: 'hour',
+    type: ParamType.Int,
+  },
+  {
+    title: 'Minute',
+    param: 'minute',
+    type: ParamType.Int,
+    startsHidden: true,
+  },
+  {
+    title: 'Timestamp',
+    param: 'timestamp',
+    type: ParamType.Int,
+    startsHidden: true,
+  },
+  {
+    title: 'Context',
+    param: 'context',
+    type: ParamType.String,
+  },
+  {
+    title: 'Subcontext',
+    param: 'subcontext',
+    type: ParamType.String,
+  },
+  {
+    title: 'Tags',
+    param: 'tags',
+    type: ParamType.JSON,
+    startsHidden: true,
+  },
+  {
+    title: 'Log Level',
+    param: 'level',
+    type: ParamType.String,
+    startsHidden: true,
+  },
+  {
+    title: 'Metadata',
+    param: 'metadata',
+    type: ParamType.JSON,
+    startsHidden: true,
+  },
+  {
+    title: 'Source',
+    param: 'source',
+    type: ParamType.String,
+  },
+  {
+    title: 'Server Route Path',
+    param: 'routePath',
+    type: ParamType.String,
+    startsHidden: true,
+  },
+  {
+    title: 'Server Route Template',
+    param: 'routeTemplate',
+    type: ParamType.String,
+    startsHidden: true,
+  },
+  {
+    title: 'Type',
+    param: 'type',
+    type: ParamType.String,
+  },
+  {
+    title: 'Error Message',
+    param: 'errorMessage',
+    type: ParamType.String,
+    startsHidden: true,
+  },
+  {
+    title: 'Error Code',
+    param: 'errorCode',
+    type: ParamType.String,
+    startsHidden: true,
+  },
+  {
+    title: 'Error Stack',
+    param: 'errorStack',
+    type: ParamType.String,
+    startsHidden: true,
+  },
+  {
+    title: 'Action Target',
+    param: 'target',
+    type: ParamType.String,
+    startsHidden: true,
+  },
+  {
+    title: 'Action Type',
+    param: 'action',
+    type: ParamType.String,
+    startsHidden: true,
+  },
+];
+
 /*------------------------------------------------------------------------*/
 /*                            Static Functions                            */
 /*------------------------------------------------------------------------*/
@@ -521,33 +714,34 @@ const LogReviewer: React.FC<Props> = (props) => {
     onClose,
   } = props;
 
-  // Add built-in LogMetadata
-  // > Add "uncategorized" subcontext to each context
-  Object.keys(LogMetadata.Context ?? {}).forEach((context) => {
-    if (
-      // Context exists
-      LogMetadata.Context
-      // Context has children already
-      && typeof LogMetadata.Context[context] !== 'string'
-    ) {
-      (LogMetadata.Context as any)[context][LogBuiltInMetadata.Context.Uncategorized] = (
-        LogBuiltInMetadata.Context.Uncategorized
-      );
-    }
-  })
-  // > Add built-in contexts
-  LogMetadata.Context = (LogMetadata.Context ?? {});
-  Object.keys(LogBuiltInMetadata.Context).forEach((context) => {
-    if (LogMetadata.Context) {
-      LogMetadata.Context[context] = context;
-    }
+  // Create complete map of contexts
+  const contextMap: LogMetadataContextMap = {};
+  [
+    (LogMetadata.Context ?? {}),
+    LogBuiltInMetadata.Context,
+  ].forEach((contextMap) => {
+    Object.keys(contextMap).forEach((context) => {
+      // Add context
+      contextMap[context] = context;
+
+      // If context has children, add an "uncategorized" subcontext
+      if (typeof contextMap[context] !== 'string') {
+        (contextMap[context] as any)[LogBuiltInMetadata.Context.Uncategorized] = (
+          LogBuiltInMetadata.Context.Uncategorized
+        );
+      }
+    });
   });
-  // > Add built-in targets
-  LogMetadata.Target = (LogMetadata.Target ?? {});
-  Object.keys(LogBuiltInMetadata.Target).forEach((target) => {
-    if (LogMetadata.Target) {
-      LogMetadata.Target[target] = target;
-    }
+
+  // Create complete map of targets
+  const targetMap: LogMetadataTargetMap = {};
+  [
+    (LogMetadata.Target ?? {}),
+    LogBuiltInMetadata.Target,
+  ].forEach((targetMap) => {
+    Object.keys(targetMap).forEach((target) => {
+      targetMap[target] = target;
+    });
   });
 
   /* -------------- State ------------- */
@@ -934,7 +1128,7 @@ const LogReviewer: React.FC<Props> = (props) => {
               });
             }}
           >
-            Reset All
+            Reset
           </button>
         </div>
       </div>
@@ -996,45 +1190,63 @@ const LogReviewer: React.FC<Props> = (props) => {
         );
       } else if (expandedFilterDrawer === FilterDrawer.Context) {
         // Create item picker items
-        const pickableItems: PickableItem[] = (
-          Object.keys(LogMetadata.Context ?? {})
-            .map((context) => {
-              const value = (LogMetadata.Context ?? {})[context];
-              if (typeof value === 'string') {
-                // No subcategories
-                const item: PickableItem = {
-                  id: context,
-                  name: genHumanReadableName(context),
-                  isGroup: false,
-                  checked: !!contextFilterState[context],
-                };
-                return item;
-              }
-
-              // Has subcategories
-              const children: PickableItem[] = (
-                Object.keys(value)
-                  .filter((subcontext) => {
-                    return subcontext !== '_';
-                  })
-                  .map((subcontext) => {
-                    return {
-                      id: subcontext,
-                      name: genHumanReadableName(subcontext),
-                      isGroup: false,
-                      checked: (contextFilterState[context] as any)[subcontext],
-                    };
-                  })
-              );
+        const builtInPickableItem: PickableItem = {
+          id: '_',
+          name: 'Auto-logged',
+          isGroup: true,
+          children: [],
+        };
+        const pickableItems: PickableItem[] = [];
+        Object.keys(contextMap)
+          .forEach((context) => {
+            const value = (contextMap)[context];
+            if (typeof value === 'string') {
+              // No subcategories
               const item: PickableItem = {
                 id: context,
                 name: genHumanReadableName(context),
-                isGroup: true,
-                children,
+                isGroup: false,
+                checked: !!contextFilterState[context],
               };
-              return item;
-            })
-        );
+
+              // Add built-in items to its own folder
+              const isBuiltIn = context in LogBuiltInMetadata.Context;
+              if (isBuiltIn) {
+                // Add to built-in pickable item
+                builtInPickableItem.children.push(item);
+              } else {
+                // Add to pickable items list
+                pickableItems.push(item);
+              }
+            }
+
+            // Has subcategories
+            const children: PickableItem[] = (
+              Object.keys(value)
+                // Remove parent name
+                .filter((subcontext) => {
+                  return subcontext !== '_';
+                })
+                // Create child pickable items
+                .map((subcontext) => {
+                  return {
+                    id: subcontext,
+                    name: genHumanReadableName(subcontext),
+                    isGroup: false,
+                    checked: (contextFilterState[context] as any)[subcontext],
+                  };
+                })
+            );
+            const item: PickableItem = {
+              id: context,
+              name: genHumanReadableName(context),
+              isGroup: true,
+              children,
+            };
+            pickableItems.push(item);
+          });
+        // Add built-in contexts to end ofl ist
+        pickableItems.push(builtInPickableItem);
 
         // Create filter UI
         filterDrawer = (
@@ -1046,15 +1258,30 @@ const LogReviewer: React.FC<Props> = (props) => {
               updatedItems.forEach((pickableItem) => {
                 if (pickableItem.isGroup) {
                   // Has subcontexts
-                  pickableItem.children.forEach((subcontextItem) => {
-                    if (!subcontextItem.isGroup) {
-                      (
-                        contextFilterState[pickableItem.id] as { [k: string]: boolean }
-                      )[subcontextItem.id] = (
-                        subcontextItem.checked
+
+                  
+                  if (pickableItem.id === '_') {
+                    // Built-in
+
+                    // Treat as if these were top-level contexts
+                    pickableItem.children.forEach((subcontextItem) => {
+                      contextFilterState[subcontextItem.id] = (
+                        'checked' in subcontextItem
+                        && subcontextItem.checked
                       );
-                    }
-                  });
+                    });
+                  } else {
+                    // Not built-in
+                    pickableItem.children.forEach((subcontextItem) => {
+                      if (!subcontextItem.isGroup) {
+                        (
+                          contextFilterState[pickableItem.id] as { [k: string]: boolean }
+                        )[subcontextItem.id] = (
+                          subcontextItem.checked
+                        );
+                      }
+                    });
+                  }
                 } else {
                   // No subcontexts
                   (contextFilterState as any)[pickableItem.id] = (
@@ -1073,6 +1300,11 @@ const LogReviewer: React.FC<Props> = (props) => {
         // Create filter UI
         filterDrawer = (
           <TabBox title="Tags">
+            <div>
+              If any are selected, logs must contain at least one
+              but not necessarily all of the
+              selected tags.
+            </div>
             {
               Object.keys(LogMetadata.Tag ?? {})
                 .map((tag, i) => {
@@ -1183,15 +1415,9 @@ const LogReviewer: React.FC<Props> = (props) => {
                   </ButtonInputGroup>
                   {/* Target */}
                   <ButtonInputGroup label="Target">
-                    {/* Nothing here */}
-                    {(Object.keys(LogMetadata.Target ?? {}).length === 0) && (
-                      <div>
-                        This app does not have any targets yet.
-                      </div>
-                    )}
                     {/* List of targets */}
                     {
-                      Object.keys(LogMetadata.Target ?? {})
+                      Object.keys(targetMap)
                         .map((target, i) => {
                           const description = genHumanReadableName(target);
                           return (
@@ -1209,7 +1435,7 @@ const LogReviewer: React.FC<Props> = (props) => {
                                   actionErrorFilterState,
                                 });
                               }}
-                              noMarginOnRight={i === Object.keys(LogMetadata.Target ?? {}).length - 1}
+                              noMarginOnRight={i === Object.keys(targetMap).length - 1}
                             />
                           );
                         })
@@ -1942,194 +2168,6 @@ const LogReviewer: React.FC<Props> = (props) => {
     /*                  Data                  */
     /*----------------------------------------*/
 
-    // Create data table
-    const columns: IntelliTableColumn[] = [
-      {
-        title: 'First Name',
-        param: 'userFirstName',
-        type: ParamType.String,
-      },
-      {
-        title: 'Last Name',
-        param: 'userLastName',
-        type: ParamType.String,
-      },
-      {
-        title: 'Email',
-        param: 'userEmail',
-        type: ParamType.String,
-      },
-      {
-        title: 'Canvas Id',
-        param: 'userId',
-        type: ParamType.Int,
-      },
-      {
-        title: 'Student?',
-        param: 'isLearner',
-        type: ParamType.Boolean,
-      },
-      {
-        title: 'Teaching Staff?',
-        param: 'isTTM',
-        type: ParamType.Boolean,
-        startsHidden: true,
-      },
-      {
-        title: 'Admin?',
-        param: 'isAdmin',
-        type: ParamType.Boolean,
-        startsHidden: true,
-      },
-      {
-        title: 'Course Canvas Id',
-        param: 'courseId',
-        type: ParamType.Int,
-        startsHidden: true,
-      },
-      {
-        title: 'Course Name',
-        param: 'courseName',
-        type: ParamType.String,
-      },
-      {
-        title: 'Browser Name',
-        param: 'browser.name',
-        type: ParamType.String,
-        startsHidden: true,
-      },
-      {
-        title: 'Browser Version',
-        param: 'browser.version',
-        type: ParamType.String,
-        startsHidden: true,
-      },
-      {
-        title: 'OS',
-        param: 'device.os',
-        type: ParamType.String,
-        startsHidden: true,
-      },
-      {
-        title: 'Mobile?',
-        param: 'device.isMobile',
-        type: ParamType.Boolean,
-        startsHidden: true,
-      },
-      {
-        title: 'Year',
-        param: 'year',
-        type: ParamType.Int,
-      },
-      {
-        title: 'Month',
-        param: 'month',
-        type: ParamType.Int,
-      },
-      {
-        title: 'Day',
-        param: 'day',
-        type: ParamType.Int,
-      },
-      {
-        title: 'Hour',
-        param: 'hour',
-        type: ParamType.Int,
-      },
-      {
-        title: 'Minute',
-        param: 'minute',
-        type: ParamType.Int,
-        startsHidden: true,
-      },
-      {
-        title: 'Timestamp',
-        param: 'timestamp',
-        type: ParamType.Int,
-        startsHidden: true,
-      },
-      {
-        title: 'Context',
-        param: 'context',
-        type: ParamType.String,
-      },
-      {
-        title: 'Subcontext',
-        param: 'subcontext',
-        type: ParamType.String,
-      },
-      {
-        title: 'Tags',
-        param: 'tags',
-        type: ParamType.JSON,
-        startsHidden: true,
-      },
-      {
-        title: 'Log Level',
-        param: 'level',
-        type: ParamType.String,
-        startsHidden: true,
-      },
-      {
-        title: 'Metadata',
-        param: 'metadata',
-        type: ParamType.JSON,
-        startsHidden: true,
-      },
-      {
-        title: 'Source',
-        param: 'source',
-        type: ParamType.String,
-      },
-      {
-        title: 'Server Route Path',
-        param: 'routePath',
-        type: ParamType.String,
-        startsHidden: true,
-      },
-      {
-        title: 'Server Route Template',
-        param: 'routeTemplate',
-        type: ParamType.String,
-        startsHidden: true,
-      },
-      {
-        title: 'Type',
-        param: 'type',
-        type: ParamType.String,
-      },
-      {
-        title: 'Error Message',
-        param: 'errorMessage',
-        type: ParamType.String,
-        startsHidden: true,
-      },
-      {
-        title: 'Error Code',
-        param: 'errorCode',
-        type: ParamType.String,
-        startsHidden: true,
-      },
-      {
-        title: 'Error Stack',
-        param: 'errorStack',
-        type: ParamType.String,
-        startsHidden: true,
-      },
-      {
-        title: 'Action Target',
-        param: 'target',
-        type: ParamType.String,
-        startsHidden: true,
-      },
-      {
-        title: 'Action Type',
-        param: 'action',
-        type: ParamType.String,
-        startsHidden: true,
-      },
-    ];
-
     // Nothing to show notice
     const noLogsNotice = (
       logs.length === 0

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;