Mirrors/unleash.unleash
1
0
Fork 0
mirror of https://github.com/Unleash/unleash.git synced 2025-09-01 13:47:27 +02:00
Code Issues Projects Releases Wiki Activity

Initial spike

Browse Source
This commit is contained in:
Thomas Heartman 2025-04-22 13:23:30 +02:00
parent 60562ad0b0
commit 1da5a30e07
3 changed files with 38 additions and 6 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

3
frontend/src/assets/icons/constraint-equals.svg Normal file
View File

@ -0,0 +1,3 @@
<svg width="13" height="5" viewBox="0 0 13 5" fill="none" xmlns="http://www.w3.org/2000/svg">
<path d="M0.289062 1.88672V0.480469H4.87109V1.88672H0.289062ZM0.289062 4.23047V2.82422H4.87109V4.23047H0.289062ZM7.4375 1.88672V0.480469H12.0195V1.88672H7.4375ZM7.4375 4.23047V2.82422H12.0195V4.23047H7.4375Z" fill="#000"/>
</svg>
Side by Side

After

Width:  |  Height:  |  Size: 324 B

4
frontend/src/assets/icons/constraint-not-equals.svg Normal file
View File

@ -0,0 +1,4 @@
<svg width="24" height="24" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg">
<path d="M9.28906 11.8867V10.4805H13.8711V11.8867H9.28906ZM9.28906 14.2305V12.8242H13.8711V14.2305H9.28906Z" fill="#9F9FA1"/>
<rect x="16.4541" y="3.94922" width="1" height="18.3741" rx="0.5" transform="rotate(32.071 16.4541 3.94922)" fill="#6E6E70"/>
</svg>
Side by Side

After

Width:  |  Height:  |  Size: 355 B

37
frontend/src/component/feature/FeatureStrategy/FeatureStrategyConstraints/EditableConstraint.tsx
View File

@ -42,6 +42,8 @@ import Delete from '@mui/icons-material/Delete';
import { ValueList } from './ValueList';
import { ReactComponent as CaseSensitiveIcon } from 'assets/icons/case-sensitive.svg';
import { ReactComponent as CaseInsensitiveIcon } from 'assets/icons/case-insensitive.svg';
import { ReactComponent as EqualsIcon } from 'assets/icons/constraint-equals.svg';
import { ReactComponent as NotEqualsIcon } from 'assets/icons/constraint-not-equals.svg';
import { ScreenReaderOnly } from 'component/common/ScreenReaderOnly/ScreenReaderOnly';
const Container = styled('article')(({ theme }) => ({
@ -112,6 +114,8 @@ const StyledSelect = styled(GeneralSelect)(({ theme }) => ({
}));
const StyledButton = styled('button')(({ theme }) => ({
display: 'grid',
placeItems: 'center',
width: '5ch',
borderRadius: theme.shape.borderRadius,
padding: theme.spacing(0.25, 0),
@ -134,13 +138,24 @@ const StyledCaseInsensitiveIcon = styled(CaseInsensitiveIcon)(({ theme }) => ({
fill: theme.palette.text.secondary,
},
}));
const StyledCaseSensitiveIcon = styled(CaseSensitiveIcon)(({ theme }) => ({
fill: 'currentcolor',
}));
const CaseButton = styled(StyledButton)(({ theme }) => ({
display: 'grid',
placeItems: 'center',
const StyledEqualsIcon = styled(EqualsIcon)(({ theme }) => ({
path: {
fill: 'currentcolor',
},
}));
const StyledNotEqualsIcon = styled(NotEqualsIcon)(({ theme }) => ({
path: {
fill: theme.palette.text.disabled,
},
rect: {
fill: theme.palette.text.secondary,
},
}));
type Props = {
@ -380,7 +395,17 @@ export const EditableConstraint: FC<Props> = ({
type='button'
onClick={toggleInvertedOperator}
>
{localConstraint.inverted ? 'aint' : 'is'}
{localConstraint.inverted ? (
<StyledNotEqualsIcon aria-label='The constraint operator is exclusive.' />
) : (
<StyledEqualsIcon aria-label='The constraint operator is inclusive.' />
)}
<ScreenReaderOnly>
Make the selected operator
{localConstraint.inverted
? ' inclusive'
: ' exclusive'}
</ScreenReaderOnly>
</StyledButton>
<ConstraintOperatorSelect
@ -391,7 +416,7 @@ export const EditableConstraint: FC<Props> = ({
/>
{showCaseSensitiveButton ? (
<CaseButton
<StyledButton
type='button'
onClick={toggleCaseSensitivity}
>
@ -407,7 +432,7 @@ export const EditableConstraint: FC<Props> = ({
: ' not '}
case sensitive
</ScreenReaderOnly>
</CaseButton>
</StyledButton>
) : null}
{!input.includes('LEGAL_VALUES') && (