Skip to content

Commit

Permalink
Bug fix and updated styles
Browse files Browse the repository at this point in the history 
Signed-off-by: Yi Cai <yicai@redhat.com>
  • Loading branch information
@ciiay
ciiay committed Jun 20, 2024
1 parent fd72565 commit c813e04
Show file tree
Hide file tree
Showing 3 changed files with 207 additions and 108 deletions.
47 changes: 41 additions & 6 deletions plugins/rbac/src/components/ConditionalAccess/ConditionsForm.tsx
View file
Original file line number Diff line number Diff line change
Expand Up @@ -8,7 +8,12 @@ import Button from '@mui/material/Button';

import { ConditionsFormRow } from './ConditionsFormRow';
import { criterias } from './const';
import { ConditionsData, RuleParamsErrors, RulesData } from './types';
import {
Condition,
ConditionsData,
RuleParamsErrors,
RulesData,
} from './types';

const useStyles = makeStyles(theme => ({
form: {
Expand Down Expand Up @@ -63,19 +68,49 @@ export const ConditionsForm = ({
const [removeAllClicked, setRemoveAllClicked] =
React.useState<boolean>(false);

const flattenConditions = (
conditions: Condition[],
): PermissionCondition[] => {
const flatConditions: PermissionCondition[] = [];

const processCondition = (condition: Condition) => {
if ('rule' in condition) {
flatConditions.push(condition);
} else {
if (condition.allOf) {
condition.allOf.forEach(processCondition);
}
if (condition.anyOf) {
condition.anyOf.forEach(processCondition);
}
if (condition.not) {
if ('rule' in condition.not) {
flatConditions.push(condition.not);
} else {
processCondition(condition.not);
}
}
}
};
conditions.forEach(processCondition);
return flatConditions;
};

const isNoRuleSelected = () => {
switch (criteria) {
case criterias.condition: {
case criterias.condition:
return !conditions.condition?.rule;
}
case criterias.not: {
return !(conditions.not as PermissionCondition)?.rule;
const flatConditions = flattenConditions([conditions.not as Condition]);
return flatConditions.some(c => !c.rule);
}
case criterias.allOf: {
return !!conditions.allOf?.find(c => !(c as PermissionCondition).rule);
const flatConditions = flattenConditions(conditions.allOf || []);
return flatConditions.some(c => !c.rule);
}
case criterias.anyOf: {
return !!conditions.anyOf?.find(c => !(c as PermissionCondition).rule);
const flatConditions = flattenConditions(conditions.anyOf || []);
return flatConditions.some(c => !c.rule);
}
default:
return true;
Expand Down
180 changes: 108 additions & 72 deletions plugins/rbac/src/components/ConditionalAccess/ConditionsFormRow.tsx
View file
Original file line number Diff line number Diff line change
Expand Up @@ -83,6 +83,12 @@ const useStyles = makeStyles(theme => ({
flexGrow: 0,
alignSelf: 'baseline',
},
radioGroup: {
margin: '0.5rem',
},
radioLabel: {
marginTop: '0.5rem',
},
}));

type ConditionFormRowProps = {
Expand Down Expand Up @@ -122,11 +128,8 @@ export const ConditionsFormRow = ({

React.useEffect(() => {
let nestedConditions: ConditionsData[] = [];

const extractNestedConditions = (
conditions: ConditionsData[],
criteriaTypes: string[],
) => {
const criteriaTypes = [criterias.allOf, criterias.anyOf, criterias.not];
const extractNestedConditions = (conditions: ConditionsData[]) => {
Array.isArray(conditions) &&
conditions?.forEach(c => {
criteriaTypes.forEach(ct => {
Expand All @@ -139,23 +142,19 @@ export const ConditionsFormRow = ({

switch (criteria) {
case criterias.allOf:
extractNestedConditions(
(conditionRow.allOf as ConditionsData[]) || [],
[criterias.allOf, criterias.anyOf, criterias.not],
);
extractNestedConditions((conditionRow.allOf as ConditionsData[]) || []);
break;
case criterias.anyOf:
extractNestedConditions(
(conditionRow.anyOf as ConditionsData[]) || [],
[criterias.allOf, criterias.anyOf, criterias.not],
);
extractNestedConditions((conditionRow.anyOf as ConditionsData[]) || []);
break;
case criterias.not:
extractNestedConditions((conditionRow.not as ConditionsData[]) || [], [
criterias.allOf,
criterias.anyOf,
criterias.not,
]);
if (
criteriaTypes.includes(
Object.keys(conditionRow.not as ConditionsData)[0],
)
) {
nestedConditions.push(conditionRow.not as ConditionsData);
}
break;
default:
break;
Expand Down Expand Up @@ -216,17 +215,21 @@ export const ConditionsFormRow = ({
}
};

const updateRules = (updatedNestedConditionRow: ConditionsData[]) => {
const updateRules = (
updatedNestedConditionRow: ConditionsData[] | ConditionsData,
) => {
const existingSimpleCondition =
criteria !== criterias.not
? (
conditionRow[criteria as keyof ConditionsData] as Condition[]
)?.filter(con => Object.keys(con).includes('rule')) || []
: [];
const newCondition = [
...existingSimpleCondition,
...updatedNestedConditionRow,
];
let newCondition: Condition[] = [];
if (Array.isArray(updatedNestedConditionRow)) {
newCondition = [...existingSimpleCondition, ...updatedNestedConditionRow];
} else {
newCondition = [...existingSimpleCondition, updatedNestedConditionRow];
}

if (criteria === criterias.anyOf) {
onRuleChange({
Expand All @@ -240,7 +243,7 @@ export const ConditionsFormRow = ({
}
if (criteria === criterias.not) {
onRuleChange({
[criteria]: updatedNestedConditionRow,
not: updatedNestedConditionRow as ConditionsData,
});
}
};
Expand All @@ -249,44 +252,66 @@ export const ConditionsFormRow = ({
val: string,
nestedConditionIndex: number,
) => {
const updatedNestedConditionRow = nestedConditionRow.map((c, index) => {
if (index === nestedConditionIndex) {
return {
[val]: [
{
rule: '',
resourceType: selPluginResourceType,
params: {},
},
],
};
}
return c;
});

updateRules(updatedNestedConditionRow);
const newNestedConditionNot: ConditionsData = {
[val]: {
rule: '',
resourceType: selPluginResourceType,
params: {},
},
};
const newNestedConditionAllOfOrAnyOf: ConditionsData = {
[val]: [
{
rule: '',
resourceType: selPluginResourceType,
params: {},
},
],
};
if (criteria === criterias.not) {
updateRules(
val === criterias.not
? newNestedConditionNot
: newNestedConditionAllOfOrAnyOf,
);
} else {
const updatedNestedConditionRow = nestedConditionRow.map((c, index) => {
if (index === nestedConditionIndex) {
return val === criterias.not
? newNestedConditionNot
: newNestedConditionAllOfOrAnyOf;
}
return c;
});
updateRules(updatedNestedConditionRow);
}
};

const handleAddNestedCondition = () => {
const handleAddNestedCondition = (criteria: string) => {
const newNestedCondition = {
[criterias.allOf]: [
{
rule: '',
resourceType: selPluginResourceType,
params: {},
},
],
};
const updatedNestedConditionRow = [
...nestedConditionRow,
{
[criterias.allOf]: [
{
rule: '',
resourceType: selPluginResourceType,
params: {},
},
],
},
newNestedCondition,
];
updateRules(updatedNestedConditionRow);
updateRules(
criteria === criterias.not
? newNestedCondition
: updatedNestedConditionRow,
);
};

const handleNotConditionTypeChange = (val: string) => {
setNotConditionType(val as NotConditionType);
if (val === 'nested-condition') {
handleAddNestedCondition();
handleAddNestedCondition(criterias.not);
} else {
onRuleChange({
not: {
Expand All @@ -295,11 +320,6 @@ export const ConditionsFormRow = ({
params: {},
},
});
if (nestedConditionRow.length > 0) {
nestedConditionRow.forEach((_c, index) => {
handleRemoveNestedCondition(index);
});
}
}
};

Expand Down Expand Up @@ -327,8 +347,11 @@ export const ConditionsFormRow = ({
updatedNestedConditionRow.push(c);
}
});

updateRules(updatedNestedConditionRow);
updateRules(
criteria === criterias.not
? updatedNestedConditionRow[0]
: updatedNestedConditionRow,
);
};

const handleRemoveNestedCondition = (nestedConditionIndex: number) => {
Expand Down Expand Up @@ -361,7 +384,11 @@ export const ConditionsFormRow = ({
}
});

updateRules(updatedNestedConditionRow);
updateRules(
criteria === criterias.not
? updatedNestedConditionRow[0]
: updatedNestedConditionRow,
);
};

const ruleOptionDisabled = (
Expand Down Expand Up @@ -468,15 +495,17 @@ export const ConditionsFormRow = ({
})}
{criteria === criterias.not && (
<RadioGroup
className={classes.radioGroup}
value={notConditionType}
onChange={(_event, value) =>
handleNotConditionTypeChange(value as NotConditionType)
}
>
<FormControlLabel
value="simple-condition"
control={<Radio />}
control={<Radio color="primary" />}
label="Add rule"
className={classes.radioLabel}
/>
{notConditionType === 'simple-condition' && (
<ConditionsFormRowFields
Expand Down Expand Up @@ -505,8 +534,9 @@ export const ConditionsFormRow = ({
)}
<FormControlLabel
value="nested-condition"
control={<Radio />}
control={<Radio color="primary" />}
label="Add nested condition"
className={classes.radioLabel}
/>
</RadioGroup>
)}
Expand Down Expand Up @@ -536,7 +566,7 @@ export const ConditionsFormRow = ({
<Button
className={classes.addNestedConditionButton}
size="small"
onClick={() => handleAddNestedCondition()}
onClick={() => handleAddNestedCondition(criteria)}
>
<AddIcon fontSize="small" />
Add nested condition
Expand Down Expand Up @@ -583,15 +613,17 @@ export const ConditionsFormRow = ({
</ToggleButton>
))}
</ToggleButtonGroup>
<IconButton
title="Remove"
className={classes.removeNestedRuleButton}
onClick={() =>
handleRemoveNestedCondition(nestedConditionIndex)
}
>
<RemoveIcon />
</IconButton>
{criteria !== criterias.not && (
<IconButton
title="Remove"
className={classes.removeNestedRuleButton}
onClick={() =>
handleRemoveNestedCondition(nestedConditionIndex)
}
>
<RemoveIcon />
</IconButton>
)}
</div>
<Box>
{Object.keys(nc)[0] === criterias.allOf &&
Expand Down Expand Up @@ -687,6 +719,10 @@ export const ConditionsFormRow = ({
)
}
setRemoveAllClicked={setRemoveAllClicked}
nestedConditionRow={nestedConditionRow}
nestedConditionCriteria={Object.keys(nc)[0]}
nestedConditionIndex={nestedConditionIndex}
updateRules={updateRules}
/>
)}
{Object.keys(nc)[0] !== criterias.not && (
Expand Down
Loading

0 comments on commit c813e04

Please sign in to comment.