Skip to content

Commit

Permalink
Iterating on dialog language
Browse files Browse the repository at this point in the history
  • Loading branch information
@jeznorth
jeznorth committed Jan 19, 2024
1 parent 8ba28f0 commit 4ab89b5
Showing 1 changed file with 126 additions and 135 deletions.
261 changes: 126 additions & 135 deletions app/src/components/security/SecurityRuleForm.tsx
View file
Original file line number Diff line number Diff line change
Expand Up @@ -137,148 +137,139 @@ const SecurityRuleForm = () => {

return (
<form onSubmit={formikProps.handleSubmit}>
<Box component="fieldset">
<Typography
variant="body1"
color="textSecondary"
sx={{
maxWidth: '72ch'
}}>
Manage security rules for features in this submission.
<Box component="fieldset" mt={1}>
<Typography component="legend">Add Security Rules</Typography>
<Typography variant="body1" color="textSecondary" sx={{ mt: -1, mb: 3 }}>
Select one or more security rules to apply to these records.
</Typography>
<Autocomplete
value={null}
id={'autocomplete-security-rule-search'}
data-testid={'autocomplete-security-rule-search'}
filterSelectedOptions
clearOnBlur
loading={submissionContext.allSecurityRulesStaticListDataLoader.isLoading}
noOptionsText="No records found"
options={applyRulesAvailableSortedOptions}
filterOptions={(options, state) => {
const searchFilter = createFilterOptions<ISecurityRuleAndCategory>({

Check warning on line 155 in app/src/components/security/SecurityRuleForm.tsx

View check run for this annotation

Codecov / codecov/patch

app/src/components/security/SecurityRuleForm.tsx#L155 

Added line #L155 was not covered by tests
ignoreCase: true,
matchFrom: 'any',
stringify: (option) => option.name + option.category_name

Check warning on line 158 in app/src/components/security/SecurityRuleForm.tsx

View check run for this annotation

Codecov / codecov/patch

app/src/components/security/SecurityRuleForm.tsx#L158 

Added line #L158 was not covered by tests
});

<Box component="fieldset" mt={3}>
<Typography component="legend">Add Security Rules</Typography>
<Autocomplete
value={null}
id={'autocomplete-security-rule-search'}
data-testid={'autocomplete-security-rule-search'}
filterSelectedOptions
clearOnBlur
loading={submissionContext.allSecurityRulesStaticListDataLoader.isLoading}
noOptionsText="No records found"
options={applyRulesAvailableSortedOptions}
filterOptions={(options, state) => {
const searchFilter = createFilterOptions<ISecurityRuleAndCategory>({
ignoreCase: true,
matchFrom: 'any',
stringify: (option) => option.name + option.category_name
});

const selectableOptions = options.filter((securityRule) => {
return !formikProps.values.stagedForApply.some(
(applyingRule) => applyingRule.security_rule_id === securityRule.security_rule_id
);
});

return searchFilter(selectableOptions, state);
}}
getOptionLabel={(option) => option.name}
isOptionEqualToValue={(option, value) => option.security_rule_id === value.security_rule_id}
inputValue={searchText}
onInputChange={(_, value, reason) => {
if (reason === 'reset') {
setSearchText('');
} else {
setSearchText(value);
}
}}
onChange={(_, option) => {
if (option) {
toggleStageApply(option);
}
}}
renderInput={(params) => (
<TextField
{...params}
variant="outlined"
placeholder={'Add security reasons'}
fullWidth
InputProps={{
...params.InputProps,
startAdornment: (
<Box mx={1} mt="6px">
<Icon path={mdiMagnify} size={1}></Icon>
</Box>
)
}}
/>
)}
renderOption={(renderProps, renderOption) => {
return (
<ListItem
disablePadding
divider
sx={{
py: '12px !important',
px: 2
}}
{...renderProps}>
<SecurityRuleCard
title={renderOption.name}
category={renderOption.category_name}
description={renderOption.description}
/>
</ListItem>
);
}}
/>
<Stack component={TransitionGroup} gap={1} my={1}>
{formikProps.values.stagedForApply.map((applyingRule) => {
return (
<Collapse key={applyingRule.security_rule_id}>
<SecurityRuleActionCard
action={'apply'}
title={applyingRule.name}
category={applyingRule.category_name}
description={applyingRule.description}
onRemove={() => toggleStageApply(applyingRule)}
/>
</Collapse>
const selectableOptions = options.filter((securityRule) => {
return !formikProps.values.stagedForApply.some(
(applyingRule) => applyingRule.security_rule_id === securityRule.security_rule_id

Check warning on line 163 in app/src/components/security/SecurityRuleForm.tsx

View check run for this annotation

Codecov / codecov/patch

app/src/components/security/SecurityRuleForm.tsx#L161-L163 

Added lines #L161 - L163 were not covered by tests
);
})}
</Stack>
</Box>
});

<Box component="fieldset" mt={3}>
<Typography component="legend">Manage Existing Security</Typography>
<Typography variant="body1" color="textSecondary" sx={{ mt: -0.5 }}>
Manage security rules have already been applied.
</Typography>
return searchFilter(selectableOptions, state);

Check warning on line 167 in app/src/components/security/SecurityRuleForm.tsx

View check run for this annotation

Codecov / codecov/patch

app/src/components/security/SecurityRuleForm.tsx#L167 

Added line #L167 was not covered by tests
}}
getOptionLabel={(option) => option.name}
isOptionEqualToValue={(option, value) => option.security_rule_id === value.security_rule_id}

Check warning on line 170 in app/src/components/security/SecurityRuleForm.tsx

View check run for this annotation

Codecov / codecov/patch

app/src/components/security/SecurityRuleForm.tsx#L169-L170 

Added lines #L169 - L170 were not covered by tests
inputValue={searchText}
onInputChange={(_, value, reason) => {
if (reason === 'reset') {
setSearchText('');

Check warning on line 174 in app/src/components/security/SecurityRuleForm.tsx

View check run for this annotation

Codecov / codecov/patch

app/src/components/security/SecurityRuleForm.tsx#L174 

Added line #L174 was not covered by tests
} else {
setSearchText(value);

Check warning on line 176 in app/src/components/security/SecurityRuleForm.tsx

View check run for this annotation

Codecov / codecov/patch

app/src/components/security/SecurityRuleForm.tsx#L176 

Added line #L176 was not covered by tests
}
}}
onChange={(_, option) => {
if (option) {
toggleStageApply(option);

Check warning on line 181 in app/src/components/security/SecurityRuleForm.tsx

View check run for this annotation

Codecov / codecov/patch

app/src/components/security/SecurityRuleForm.tsx#L181 

Added line #L181 was not covered by tests
}
}}
renderInput={(params) => (
<TextField

Check warning on line 185 in app/src/components/security/SecurityRuleForm.tsx

View check run for this annotation

Codecov / codecov/patch

app/src/components/security/SecurityRuleForm.tsx#L185 

Added line #L185 was not covered by tests
{...params}
variant="outlined"
placeholder={'Security rules'}
fullWidth
InputProps={{
...params.InputProps,
startAdornment: (
<Box mx={1} mt="6px">
<Icon path={mdiMagnify} size={1}></Icon>
</Box>
)
}}
/>
)}
renderOption={(renderProps, renderOption) => {
return (

Check warning on line 201 in app/src/components/security/SecurityRuleForm.tsx

View check run for this annotation

Codecov / codecov/patch

app/src/components/security/SecurityRuleForm.tsx#L201 

Added line #L201 was not covered by tests
<ListItem
disablePadding
divider
sx={{
py: '12px !important',
px: 2
}}
{...renderProps}>
<SecurityRuleCard
title={renderOption.name}
category={renderOption.category_name}
description={renderOption.description}
/>
</ListItem>
);
}}
/>
<Stack component={TransitionGroup} gap={1} my={1}>
{formikProps.values.stagedForApply.map((applyingRule) => {
return (
<Collapse key={applyingRule.security_rule_id}>
<SecurityRuleActionCard
action={'apply'}
title={applyingRule.name}
category={applyingRule.category_name}
description={applyingRule.description}
onRemove={() => toggleStageApply(applyingRule)}
/>
</Collapse>
);
})}
</Stack>
</Box>
<Box component="fieldset" mt={2}>
<Typography component="legend">Secured Records</Typography>
<Typography variant="body1" color="textSecondary" sx={{ mt: -1 }}>
Some of the selected records are already secured using one or more of the following rules.
</Typography>

<Stack component={TransitionGroup} gap={1} mt={3}>
{groupedAppliedSecurityRules.map((group: IAppliedSecurityRuleGroup) => {
const cardAction = formikProps.values.stagedForRemove.some(
(removingRule) => removingRule.security_rule_id === group.securityRule.security_rule_id
)
? 'remove'
: 'persist';
<Stack component={TransitionGroup} gap={1} mt={3}>
{groupedAppliedSecurityRules.map((group: IAppliedSecurityRuleGroup) => {
const cardAction = formikProps.values.stagedForRemove.some(
(removingRule) => removingRule.security_rule_id === group.securityRule.security_rule_id
)
? 'remove'
: 'persist';

return (
<Collapse key={group.securityRule.security_rule_id}>
<SecurityRuleActionCard
action={cardAction}
title={group.securityRule.name}
category={group.securityRule.category_name}
description={group.securityRule.description}
featureMembers={group.appliedFeatureGroups.map(
(featureGroup) =>
`${p(featureGroup.numFeatures, featureGroup.displayName)} (${featureGroup.numFeatures})`
)}
onRemove={() => toggleStageRemove(group.securityRule)}
/>
</Collapse>
);
})}
</Stack>
return (
<Collapse key={group.securityRule.security_rule_id}>
<SecurityRuleActionCard
action={cardAction}
title={group.securityRule.name}
category={group.securityRule.category_name}
description={group.securityRule.description}
featureMembers={group.appliedFeatureGroups.map(
(featureGroup) =>
`${p(featureGroup.numFeatures, featureGroup.displayName)} (${featureGroup.numFeatures})`
)}
onRemove={() => toggleStageRemove(group.securityRule)}
/>
</Collapse>
);
})}
</Stack>

{hasNoSecuritySelected && (
<Alert severity="error">
<AlertTitle>No security applied</AlertTitle>
All users will have unrestricted access to records that have been included in this submission.
</Alert>
)}
</Box>
{hasNoSecuritySelected && (
<Alert severity="error">
<AlertTitle>No security applied</AlertTitle>
All users will have unrestricted access to records that have been included in this submission.
</Alert>
)}
</Box>
</form>
);
Expand Down

0 comments on commit 4ab89b5

Please sign in to comment.