IO-3020 IO-3036 Update job actions menu & improve feature wrapper/blur wrapper trace

client/src/components/feature-wrapper/blur-wrapper.component.jsx

@@ -9,7 +9,11 @@ const mapStateToProps = createStructuredSelector({
   bodyshop: selectBodyshop
 });
 const blurringProps = {
-  filter: "blur(6px)"
+  filter: "blur(4px)",
+  webkitUserSelect: "none",
+  msUserSelect: "none",
+  mozUserSelect: "none",
+  userSelect: "none"
 };
 
 export function BlurWrapper({
@@ -19,8 +23,18 @@ export function BlurWrapper({
   valueProp = "value",
   overrideValue = true,
   overrideValueFunction,
-  children
+  children,
+  bypass
 }) {
+  if (import.meta.env.DEV) {
+    if (!ValidateFeatureName(featureName)) console.trace("*** INVALID FEATURE NAME", featureName);
+  }
+
+  if (bypass) {
+    console.trace("*** BYPASS USED", featureName);
+    return children;
+  }
+
   if (!HasFeatureAccess({ featureName, bodyshop })) {
     const childrenWithBlurProps = React.Children.map(children, (child) => {
       if (React.isValidElement(child)) {
@@ -48,6 +62,7 @@ export function BlurWrapper({
 
     return childrenWithBlurProps;
   }
+
   return children;
 }
 export default connect(mapStateToProps, null)(BlurWrapper);
@@ -55,3 +70,25 @@ export default connect(mapStateToProps, null)(BlurWrapper);
 function RandomDinero() {
   return Dinero({ amount: Math.round(Math.exp(Math.random() * 100, 2)) }).toFormat();
 }
+
+const featureNameList = [
+  "mobile",
+  "allAccess",
+  "timetickets",
+  "payments",
+  "partsorders",
+  "bills",
+  "export",
+  "csi",
+  "courtesycars",
+  "media",
+  "visualboard",
+  "scoreboard",
+  "checklist",
+  "smartscheduling",
+  "roguard"
+];
+
+function ValidateFeatureName(featureName) {
+  return featureNameList.includes(featureName);
+}