shared help text styles

SpecterOps · Jan 26, 2024 · f277e48 · f277e48
1 parent 107949d
commit f277e48
Show file tree

Hide file tree

Showing 10 changed files with 37 additions and 165 deletions.
diff --git a/packages/javascript/bh-shared-ui/src/components/HelpTexts/ADCSESC10a/General.tsx b/packages/javascript/bh-shared-ui/src/components/HelpTexts/ADCSESC10a/General.tsx
@@ -15,29 +15,12 @@
 // SPDX-License-Identifier: Apache-2.0
 
 import { FC } from 'react';
-import { groupSpecialFormat } from '../utils';
+import { useHelpTextStyles, groupSpecialFormat } from '../utils';
 import { EdgeInfoProps } from '../index';
 import { Typography } from '@mui/material';
-import { makeStyles } from '@mui/styles';
-
-const useStyles = makeStyles((theme) => ({
-    containsCodeEl: {
-        '& code': {
-            backgroundColor: 'darkgrey',
-            padding: '2px .5ch',
-            fontWeight: 'normal',
-            fontSize: '.875em',
-            borderRadius: '3px',
-            display: 'inline',
-
-            overflowWrap: 'break-word',
-            whiteSpace: 'pre-wrap',
-        },
-    },
-}));
 
 const General: FC<EdgeInfoProps> = ({ sourceName, sourceType, targetName }) => {
-    const classes = useStyles();
+    const classes = useHelpTextStyles();
     return (
         <Typography variant='body2' className={classes.containsCodeEl}>
             {groupSpecialFormat(sourceType, sourceName)} has the privileges to perform the ADCS ESC10 Scenario A attack

diff --git a/packages/javascript/bh-shared-ui/src/components/HelpTexts/ADCSESC10a/LinuxAbuse.tsx b/packages/javascript/bh-shared-ui/src/components/HelpTexts/ADCSESC10a/LinuxAbuse.tsx
@@ -16,26 +16,10 @@
 
 import { FC } from 'react';
 import { Box, Link, List, ListItem, Typography } from '@mui/material';
-import { makeStyles } from '@mui/styles';
-
-const useStyles = makeStyles((theme) => ({
-    containsCodeEl: {
-        '& code': {
-            backgroundColor: 'darkgrey',
-            padding: '2px .5ch',
-            fontWeight: 'normal',
-            fontSize: '.875em',
-            borderRadius: '3px',
-            display: 'inline',
-
-            overflowWrap: 'break-word',
-            whiteSpace: 'pre-wrap',
-        },
-    },
-}));
+import { useHelpTextStyles } from '../utils';
 
 const LinuxAbuse: FC = () => {
-    const classes = useStyles();
+    const classes = useHelpTextStyles();
     const step1 = (
         <>
             <Typography variant='body2' className={classes.containsCodeEl}>

diff --git a/packages/javascript/bh-shared-ui/src/components/HelpTexts/ADCSESC10a/WindowsAbuse.tsx b/packages/javascript/bh-shared-ui/src/components/HelpTexts/ADCSESC10a/WindowsAbuse.tsx
@@ -15,27 +15,11 @@
 // SPDX-License-Identifier: Apache-2.0
 
 import { FC } from 'react';
-import makeStyles from '@mui/styles/makeStyles';
 import { Typography, Link, List, ListItem, Box } from '@mui/material';
-
-const useStyles = makeStyles((theme) => ({
-    containsCodeEl: {
-        '& code': {
-            backgroundColor: 'darkgrey',
-            padding: '2px .5ch',
-            fontWeight: 'normal',
-            fontSize: '.875em',
-            borderRadius: '3px',
-            display: 'inline',
-
-            overflowWrap: 'break-word',
-            whiteSpace: 'pre-wrap',
-        },
-    },
-}));
+import { useHelpTextStyles } from '../utils';
 
 const WindowsAbuse: FC = () => {
-    const classes = useStyles();
+    const classes = useHelpTextStyles();
     const step1 = (
         <>
             <Typography variant='body2' className={classes.containsCodeEl}>

diff --git a/packages/javascript/bh-shared-ui/src/components/HelpTexts/ADCSESC9a/General.tsx b/packages/javascript/bh-shared-ui/src/components/HelpTexts/ADCSESC9a/General.tsx
@@ -15,29 +15,12 @@
 // SPDX-License-Identifier: Apache-2.0
 
 import { FC } from 'react';
-import { groupSpecialFormat } from '../utils';
+import { useHelpTextStyles, groupSpecialFormat } from '../utils';
 import { EdgeInfoProps } from '../index';
 import { Typography } from '@mui/material';
-import { makeStyles } from '@mui/styles';
-
-const useStyles = makeStyles((theme) => ({
-    containsCodeEl: {
-        '& code': {
-            backgroundColor: 'darkgrey',
-            padding: '2px .5ch',
-            fontWeight: 'normal',
-            fontSize: '.875em',
-            borderRadius: '3px',
-            display: 'inline',
-
-            overflowWrap: 'break-word',
-            whiteSpace: 'pre-wrap',
-        },
-    },
-}));
 
 const General: FC<EdgeInfoProps> = ({ sourceName, sourceType, targetName }) => {
-    const classes = useStyles();
+    const classes = useHelpTextStyles();
     return (
         <>
             <Typography variant='body2'>

diff --git a/packages/javascript/bh-shared-ui/src/components/HelpTexts/ADCSESC9a/LinuxAbuse.tsx b/packages/javascript/bh-shared-ui/src/components/HelpTexts/ADCSESC9a/LinuxAbuse.tsx
@@ -16,26 +16,10 @@
 
 import { FC } from 'react';
 import { Box, Link, List, ListItem, Typography } from '@mui/material';
-import { makeStyles } from '@mui/styles';
-
-const useStyles = makeStyles((theme) => ({
-    containsCodeEl: {
-        '& code': {
-            backgroundColor: 'darkgrey',
-            padding: '2px .5ch',
-            fontWeight: 'normal',
-            fontSize: '.875em',
-            borderRadius: '3px',
-            display: 'inline',
-
-            overflowWrap: 'break-word',
-            whiteSpace: 'pre-wrap',
-        },
-    },
-}));
+import { useHelpTextStyles } from '../utils';
 
 const LinuxAbuse: FC = () => {
-    const classes = useStyles();
+    const classes = useHelpTextStyles();
     const step1 = (
         <>
             <Typography variant='body2' className={classes.containsCodeEl}>

diff --git a/packages/javascript/bh-shared-ui/src/components/HelpTexts/ADCSESC9a/WindowsAbuse.tsx b/packages/javascript/bh-shared-ui/src/components/HelpTexts/ADCSESC9a/WindowsAbuse.tsx
@@ -15,27 +15,11 @@
 // SPDX-License-Identifier: Apache-2.0
 
 import { FC } from 'react';
-import makeStyles from '@mui/styles/makeStyles';
 import { Typography, Link, List, ListItem, Box } from '@mui/material';
-
-const useStyles = makeStyles((theme) => ({
-    containsCodeEl: {
-        '& code': {
-            backgroundColor: 'darkgrey',
-            padding: '2px .5ch',
-            fontWeight: 'normal',
-            fontSize: '.875em',
-            borderRadius: '3px',
-            display: 'inline',
-
-            overflowWrap: 'break-word',
-            whiteSpace: 'pre-wrap',
-        },
-    },
-}));
+import { useHelpTextStyles } from '../utils';
 
 const WindowsAbuse: FC = () => {
-    const classes = useStyles();
+    const classes = useHelpTextStyles();
     const step1 = (
         <>
             <Typography variant='body2' className={classes.containsCodeEl}>

diff --git a/packages/javascript/bh-shared-ui/src/components/HelpTexts/ADCSESC9b/General.tsx b/packages/javascript/bh-shared-ui/src/components/HelpTexts/ADCSESC9b/General.tsx
@@ -15,29 +15,12 @@
 // SPDX-License-Identifier: Apache-2.0
 
 import { FC } from 'react';
-import { groupSpecialFormat } from '../utils';
+import { useHelpTextStyles, groupSpecialFormat } from '../utils';
 import { EdgeInfoProps } from '../index';
 import { Typography } from '@mui/material';
-import { makeStyles } from '@mui/styles';
-
-const useStyles = makeStyles((theme) => ({
-    containsCodeEl: {
-        '& code': {
-            backgroundColor: 'darkgrey',
-            padding: '2px .5ch',
-            fontWeight: 'normal',
-            fontSize: '.875em',
-            borderRadius: '3px',
-            display: 'inline',
-
-            overflowWrap: 'break-word',
-            whiteSpace: 'pre-wrap',
-        },
-    },
-}));
 
 const General: FC<EdgeInfoProps> = ({ sourceName, sourceType, targetName }) => {
-    const classes = useStyles();
+    const classes = useHelpTextStyles();
     return (
         <>
             <Typography variant='body2' className={classes.containsCodeEl}>

diff --git a/packages/javascript/bh-shared-ui/src/components/HelpTexts/ADCSESC9b/LinuxAbuse.tsx b/packages/javascript/bh-shared-ui/src/components/HelpTexts/ADCSESC9b/LinuxAbuse.tsx
@@ -16,26 +16,10 @@
 
 import { FC } from 'react';
 import { Link, Typography } from '@mui/material';
-import { makeStyles } from '@mui/styles';
-
-const useStyles = makeStyles((theme) => ({
-    containsCodeEl: {
-        '& code': {
-            backgroundColor: 'darkgrey',
-            padding: '2px .5ch',
-            fontWeight: 'normal',
-            fontSize: '.875em',
-            borderRadius: '3px',
-            display: 'inline',
-
-            overflowWrap: 'break-word',
-            whiteSpace: 'pre-wrap',
-        },
-    },
-}));
+import { useHelpTextStyles } from '../utils';
 
 const LinuxAbuse: FC = () => {
-    const classes = useStyles();
+    const classes = useHelpTextStyles();
     const step1 = (
         <>
             <Typography variant='body2' className={classes.containsCodeEl}>

diff --git a/packages/javascript/bh-shared-ui/src/components/HelpTexts/ADCSESC9b/WindowsAbuse.tsx b/packages/javascript/bh-shared-ui/src/components/HelpTexts/ADCSESC9b/WindowsAbuse.tsx
@@ -15,27 +15,11 @@
 // SPDX-License-Identifier: Apache-2.0
 
 import { FC } from 'react';
-import makeStyles from '@mui/styles/makeStyles';
 import { Typography, Link } from '@mui/material';
-
-const useStyles = makeStyles((theme) => ({
-    containsCodeEl: {
-        '& code': {
-            backgroundColor: 'darkgrey',
-            padding: '2px .5ch',
-            fontWeight: 'normal',
-            fontSize: '.875em',
-            borderRadius: '3px',
-            display: 'inline',
-
-            overflowWrap: 'break-word',
-            whiteSpace: 'pre-wrap',
-        },
-    },
-}));
+import { useHelpTextStyles } from '../utils';
 
 const WindowsAbuse: FC = () => {
-    const classes = useStyles();
+    const classes = useHelpTextStyles();
     const step1 = (
         <>
             <Typography variant='body2' className={classes.containsCodeEl}>

diff --git a/packages/javascript/bh-shared-ui/src/components/HelpTexts/utils.ts b/packages/javascript/bh-shared-ui/src/components/HelpTexts/utils.ts
@@ -14,6 +14,8 @@
 //
 // SPDX-License-Identifier: Apache-2.0
 
+import { makeStyles } from "@mui/styles";
+
 export const groupSpecialFormat = (sourceType: string | undefined, sourceName: string | undefined) => {
     if (!sourceType || !sourceName) return 'This entity has';
     if (sourceType === 'Group') {
@@ -41,3 +43,20 @@ export const typeFormat = (type: string | undefined): string => {
         return type.toLowerCase();
     }
 };
+
+
+export const useHelpTextStyles = makeStyles((theme) => ({
+    containsCodeEl: {
+        '& code': {
+            backgroundColor: 'darkgrey',
+            padding: '2px .5ch',
+            fontWeight: 'normal',
+            fontSize: '.875em',
+            borderRadius: '3px',
+            display: 'inline',
+
+            overflowWrap: 'break-word',
+            whiteSpace: 'pre-wrap',
+        },
+    },
+}));