diff --git a/public/src/components/channelManagement/testListBanditIcon.tsx b/public/src/components/channelManagement/testListBanditIcon.tsx new file mode 100644 index 00000000..d1b115f0 --- /dev/null +++ b/public/src/components/channelManagement/testListBanditIcon.tsx @@ -0,0 +1,23 @@ +import React from 'react'; +import { makeStyles } from '@mui/styles'; +import SmartToyIcon from '@mui/icons-material/SmartToy'; + +const useStyles = makeStyles(() => ({ + container: { + padding: '1px', + background: '#FFC107', + borderRadius: '2px', + lineHeight: 0, + }, +})); + +const TestListBanditIcon = (): JSX.Element => { + const classes = useStyles(); + return ( +
+ +
+ ); +}; + +export default TestListBanditIcon; diff --git a/public/src/components/channelManagement/testListTest.tsx b/public/src/components/channelManagement/testListTest.tsx index 0d1d3b5a..dabf1179 100644 --- a/public/src/components/channelManagement/testListTest.tsx +++ b/public/src/components/channelManagement/testListTest.tsx @@ -8,6 +8,7 @@ import TestListTestName from './testListTestName'; import TestListTestArticleCountLabel from './testListTestArticleCountLabel'; import useHover from '../../hooks/useHover'; import EditIcon from '@mui/icons-material/Edit'; +import TestListBanditIcon from './testListBanditIcon'; const useStyles = makeStyles(({ palette }: Theme) => ({ test: { @@ -21,6 +22,12 @@ const useStyles = makeStyles(({ palette }: Theme) => ({ borderRadius: '4px', padding: '0 12px', }, + icons: { + display: 'flex', + '& > * + *': { + marginLeft: '2px', + }, + }, live: { border: `1px solid ${red[500]}`, @@ -53,6 +60,7 @@ const useStyles = makeStyles(({ palette }: Theme) => ({ '& > * + *': { marginLeft: '4px', }, + overflow: 'hidden', }, whitePencil: { color: 'white', @@ -75,6 +83,7 @@ const TestListTest: React.FC = ({ const classes = useStyles(); const hasArticleCount = test.articlesViewedSettings !== undefined; + const isBanditTest = test.methodologies.find(method => method.name === 'EpsilonGreedyBandit'); const [ref, isHovered] = useHover(); @@ -101,7 +110,10 @@ const TestListTest: React.FC = ({ /> - {hasArticleCount && } +
+ {hasArticleCount && } + {isBanditTest && } +
); };