From 6f341415f0fa9cba359a8d131723f600ff655188 Mon Sep 17 00:00:00 2001
From: Tudor Stanciu <tudor.stanciu94@gmail.com>
Date: Sun, 5 Mar 2023 01:39:00 +0200
Subject: [PATCH] apply mask on sensitive information

---
 src/features/machines/components/Machine.js | 10 +++++----
 src/providers/SensitiveInfoProvider.js      |  8 ++++++-
 src/utils/obfuscateStrings.js               | 24 +++++++++++++++++++++
 3 files changed, 37 insertions(+), 5 deletions(-)
 create mode 100644 src/utils/obfuscateStrings.js

diff --git a/src/features/machines/components/Machine.js b/src/features/machines/components/Machine.js
index 629c8a1..3554875 100644
--- a/src/features/machines/components/Machine.js
+++ b/src/features/machines/components/Machine.js
@@ -12,6 +12,7 @@ import { KeyboardArrowDown, KeyboardArrowUp } from "@material-ui/icons";
 import { makeStyles } from "@material-ui/core/styles";
 import MachineLog from "./MachineLog";
 import WakeComponent from "./WakeComponent";
+import { useSensitiveInfo } from "../../../hooks";
 
 const useRowStyles = makeStyles({
   root: {
@@ -62,6 +63,7 @@ const Machine = ({
 }) => {
   const [open, setOpen] = React.useState(false);
   const classes = useRowStyles();
+  const { mask } = useSensitiveInfo();
 
   const topActions = useMemo(
     () => actions.filter(a => a.top === true),
@@ -86,11 +88,11 @@ const Machine = ({
           </IconButton>
         </TableCell>
         <TableCell component="th" scope="row">
-          {machine.fullMachineName}
+          {mask(machine.fullMachineName)}
         </TableCell>
-        <TableCell>{machine.machineName}</TableCell>
-        <TableCell>{machine.iPv4Address}</TableCell>
-        <TableCell>{machine.macAddress}</TableCell>
+        <TableCell>{mask(machine.machineName)}</TableCell>
+        <TableCell>{mask(machine.iPv4Address)}</TableCell>
+        <TableCell>{mask(machine.macAddress)}</TableCell>
         <TableCell align="right">
           <WakeComponent machine={machine} addLog={addLog} />
           {topActions.map(action => (
diff --git a/src/providers/SensitiveInfoProvider.js b/src/providers/SensitiveInfoProvider.js
index 7507230..1e97525 100644
--- a/src/providers/SensitiveInfoProvider.js
+++ b/src/providers/SensitiveInfoProvider.js
@@ -1,5 +1,6 @@
 import React, { useReducer, useMemo, useContext } from "react";
 import PropTypes from "prop-types";
+import { obfuscate } from "../utils/obfuscateStrings";
 
 const SensitiveInfoContext = React.createContext();
 
@@ -31,7 +32,12 @@ const useSensitiveInfo = () => {
   const { enabled } = state;
   const { onSensitiveInfoEnabled } = actions;
 
-  return { enabled, onSensitiveInfoEnabled };
+  const mask = text => {
+    if (!enabled) return text;
+    return obfuscate(text, "#");
+  };
+
+  return { enabled, onSensitiveInfoEnabled, mask };
 };
 
 const SensitiveInfoProvider = ({ children }) => {
diff --git a/src/utils/obfuscateStrings.js b/src/utils/obfuscateStrings.js
new file mode 100644
index 0000000..dc2d229
--- /dev/null
+++ b/src/utils/obfuscateStrings.js
@@ -0,0 +1,24 @@
+const obfuscateForChars = (text, placeholder = "*") => {
+  const firstChar = text.substring(0, 1);
+  const lastChar = text.substring(text.length - 1);
+  const middleChars = text
+    .substring(1, text.length - 1)
+    .replace(/[a-zA-Z0-9]/g, placeholder);
+  return firstChar + middleChars + lastChar;
+};
+
+const obfuscate = (text, placeholder = "*") => {
+  if (text.length <= 2) return text;
+  if (text.length <= 4) {
+    return obfuscateForChars(text);
+  }
+
+  const firstTwoChars = text.substring(0, 2);
+  const lastTwoChars = text.substring(text.length - 2);
+  const middleChars = text
+    .substring(2, text.length - 2)
+    .replace(/[a-zA-Z0-9]/g, placeholder);
+  return firstTwoChars + middleChars + lastTwoChars;
+};
+
+export { obfuscate };