(chore) add tooltip to relative time, move maps

metlo-labs · Sep 3, 2022 · 9d94ae3 · 9d94ae3
1 parent d26214a
commit 9d94ae3
Show file tree

Hide file tree

Showing 7 changed files with 49 additions and 42 deletions.
diff --git a/backend/src/constants.ts b/backend/src/constants.ts
@@ -1,29 +1,7 @@
-import { RiskScore, DataClass, AlertType, SpecExtension } from "@common/enums"
+import { RiskScore, SpecExtension } from "@common/enums"
 
 export const pathParameterRegex: RegExp = new RegExp(String.raw`/{[^/]+}`, "g")
 
-export const DATA_CLASS_TO_RISK_SCORE: Record<DataClass, RiskScore> = {
-  [DataClass.ADDRESS]: RiskScore.HIGH,
-  [DataClass.EMAIL]: RiskScore.MEDIUM,
-  [DataClass.CREDIT_CARD]: RiskScore.HIGH,
-  [DataClass.SSN]: RiskScore.HIGH,
-  [DataClass.PHONE_NUMBER]: RiskScore.MEDIUM,
-  [DataClass.IP_ADDRESS]: RiskScore.MEDIUM,
-  [DataClass.DOB]: RiskScore.MEDIUM,
-  [DataClass.VIN]: RiskScore.LOW,
-  [DataClass.COORDINATE]: RiskScore.MEDIUM,
-  [DataClass.DL_NUMBER]: RiskScore.MEDIUM,
-}
-
-export const ALERT_TYPE_TO_RISK_SCORE: Record<AlertType, RiskScore> = {
-  [AlertType.NEW_ENDPOINT]: RiskScore.LOW,
-  [AlertType.OPEN_API_SPEC_DIFF]: RiskScore.MEDIUM,
-  [AlertType.PII_DATA_DETECTED]: RiskScore.HIGH,
-  [AlertType.QUERY_SENSITIVE_DATA]: RiskScore.HIGH,
-  [AlertType.UNDOCUMENTED_ENDPOINT]: RiskScore.LOW,
-  [AlertType.BASIC_AUTHENTICATION_DETECTED]: RiskScore.MEDIUM,
-}
-
 export const RISK_SCORE_ORDER: Record<RiskScore, number> = {
   [RiskScore.HIGH]: 3,
   [RiskScore.MEDIUM]: 2,

diff --git a/backend/src/services/alert/index.ts b/backend/src/services/alert/index.ts
@@ -15,7 +15,7 @@ import {
   UpdateAlertType,
 } from "@common/enums"
 import { DATA_SECTION_TO_LABEL_MAP } from "@common/maps"
-import { ALERT_TYPE_TO_RISK_SCORE } from "~/constants"
+import { ALERT_TYPE_TO_RISK_SCORE } from "@common/maps"
 import {
   GetAlertParams,
   Alert as AlertResponse,

diff --git a/common/src/maps.ts b/common/src/maps.ts
@@ -1,4 +1,4 @@
-import { DataSection, AWS_STEPS, GCP_STEPS } from "./enums"
+import { DataSection, AWS_STEPS, GCP_STEPS, DataClass, RiskScore, AlertType } from "./enums"
 
 export const AWS_NEXT_STEP: Record<AWS_STEPS, AWS_STEPS | null> = {
   [AWS_STEPS.AWS_KEY_SETUP]: AWS_STEPS.SOURCE_INSTANCE_ID,
@@ -55,3 +55,26 @@ export const DATA_SECTION_TO_LABEL_MAP: Record<DataSection, string> = {
   [DataSection.RESPONSE_HEADER]: "Response Headers",
   [DataSection.RESPONSE_BODY]: "Response Body",
 }
+
+export const DATA_CLASS_TO_RISK_SCORE: Record<DataClass | "", RiskScore> = {
+  [DataClass.ADDRESS]: RiskScore.HIGH,
+  [DataClass.EMAIL]: RiskScore.MEDIUM,
+  [DataClass.CREDIT_CARD]: RiskScore.HIGH,
+  [DataClass.SSN]: RiskScore.HIGH,
+  [DataClass.PHONE_NUMBER]: RiskScore.MEDIUM,
+  [DataClass.IP_ADDRESS]: RiskScore.MEDIUM,
+  [DataClass.DOB]: RiskScore.MEDIUM,
+  [DataClass.VIN]: RiskScore.LOW,
+  [DataClass.COORDINATE]: RiskScore.MEDIUM,
+  [DataClass.DL_NUMBER]: RiskScore.MEDIUM,
+  "": RiskScore.NONE,
+}
+
+export const ALERT_TYPE_TO_RISK_SCORE: Record<AlertType, RiskScore> = {
+  [AlertType.NEW_ENDPOINT]: RiskScore.LOW,
+  [AlertType.OPEN_API_SPEC_DIFF]: RiskScore.MEDIUM,
+  [AlertType.PII_DATA_DETECTED]: RiskScore.HIGH,
+  [AlertType.QUERY_SENSITIVE_DATA]: RiskScore.HIGH,
+  [AlertType.UNDOCUMENTED_ENDPOINT]: RiskScore.LOW,
+  [AlertType.BASIC_AUTHENTICATION_DETECTED]: RiskScore.MEDIUM,
+}
diff --git a/frontend/src/components/Endpoint/DataFieldTags.tsx b/frontend/src/components/Endpoint/DataFieldTags.tsx
@@ -5,7 +5,8 @@ import { HStack, Tag, Button, Box } from "@chakra-ui/react"
 import { FiPlus } from "@react-icons/all-files/fi/FiPlus"
 import { HiPencil } from "@react-icons/all-files/hi/HiPencil"
 import { DataClass } from "@common/enums"
-import { DATA_CLASS_TO_RISK_SCORE, RISK_TO_COLOR } from "~/constants"
+import { DATA_CLASS_TO_RISK_SCORE } from "@common/maps"
+import { RISK_TO_COLOR } from "~/constants"
 
 interface TagListProps {
   updating: boolean

diff --git a/frontend/src/components/EndpointList/List.tsx b/frontend/src/components/EndpointList/List.tsx
@@ -1,10 +1,19 @@
 import React from "react"
-import { Badge, Box, Text, useColorMode, HStack, Tag } from "@chakra-ui/react"
+import {
+  Badge,
+  Box,
+  Text,
+  useColorMode,
+  HStack,
+  Tag,
+  Tooltip,
+} from "@chakra-ui/react"
 import { useRouter } from "next/router"
 import EmptyView from "components/utils/EmptyView"
 import dynamic from "next/dynamic"
 import { SortOrder, TableColumn } from "react-data-table-component"
-import { DATA_CLASS_TO_RISK_SCORE, RISK_TO_COLOR } from "~/constants"
+import { RISK_TO_COLOR } from "~/constants"
+import { DATA_CLASS_TO_RISK_SCORE } from "@common/maps"
 import {
   getCustomStyles,
   rowStyles,
@@ -203,6 +212,14 @@ const List: React.FC<EndpointTablesProps> = React.memo(
         sortable: false,
         selector: (row: ApiEndpoint) =>
           getDateTimeRelative(row.lastActive) || "N/A",
+        cell: (row: ApiEndpoint) => (
+          <Tooltip
+            placement="top"
+            label={getDateTimeString(row.lastActive) || "N/A"}
+          >
+            {getDateTimeRelative(row.lastActive) || "N/A"}
+          </Tooltip>
+        ),
         id: "lastActive",
         grow: 1.5,
       },

diff --git a/frontend/src/constants.ts b/frontend/src/constants.ts
@@ -29,19 +29,6 @@ export const RISK_SCORE_ORDER: Record<RiskScore, number> = {
   [RiskScore.NONE]: 0,
 }
 
-export const DATA_CLASS_TO_RISK_SCORE: Record<DataClass | "", RiskScore> = {
-  [DataClass.ADDRESS]: RiskScore.HIGH,
-  [DataClass.EMAIL]: RiskScore.MEDIUM,
-  [DataClass.CREDIT_CARD]: RiskScore.HIGH,
-  [DataClass.SSN]: RiskScore.HIGH,
-  [DataClass.PHONE_NUMBER]: RiskScore.MEDIUM,
-  [DataClass.IP_ADDRESS]: RiskScore.MEDIUM,
-  [DataClass.DOB]: RiskScore.MEDIUM,
-  [DataClass.VIN]: RiskScore.LOW,
-  [DataClass.COORDINATE]: RiskScore.MEDIUM,
-  [DataClass.DL_NUMBER]: RiskScore.MEDIUM,
-  "": RiskScore.NONE,
-}
 export const statusToColor = (statusCode: number) => {
   if (statusCode >= 200 && statusCode < 300) {
     return "green"

diff --git a/frontend/src/utils.ts b/frontend/src/utils.ts
@@ -1,7 +1,8 @@
 import { DataClass, RiskScore } from "@common/enums"
 import axios, { AxiosError } from "axios"
 import { DateTime } from "luxon"
-import { DATA_CLASS_TO_RISK_SCORE, RISK_SCORE_ORDER } from "./constants"
+import { RISK_SCORE_ORDER } from "./constants"
+import { DATA_CLASS_TO_RISK_SCORE } from "@common/maps"
 
 export const getDateTimeString = (date: Date) => {
   if (date) {