Skip to content

Commit

Permalink
Add changes for Gateway Visibility feature
Browse files Browse the repository at this point in the history
  • Loading branch information
Naduni Pamudika committed Jan 22, 2025
1 parent 2484434 commit e260dfe
Show file tree
Hide file tree
Showing 9 changed files with 758 additions and 12 deletions.
6 changes: 6 additions & 0 deletions portals/admin/package-lock.json
View file

Some generated files are not rendered by default. Learn more about how customized files appear on GitHub.

393 changes: 393 additions & 0 deletions portals/admin/src/main/webapp/package-lock.json
View file

Large diffs are not rendered by default.

3 changes: 3 additions & 0 deletions portals/admin/src/main/webapp/package.json
View file
Original file line number Diff line number Diff line change
Expand Up @@ -32,6 +32,7 @@
"@emotion/react": "^11.11.3",
"@emotion/styled": "^11.11.0",
"@hapi/joi": "^15.1.1",
"@material-ui/icons": "^4.11.3",
"@monaco-editor/react": "^4.6.0",
"@mui/icons-material": "^5.15.4",
"@mui/lab": "^5.0.0-alpha.160",
Expand All @@ -49,6 +50,8 @@
"lodash.clonedeep": "^4.5.0",
"lodash.isempty": "^4.4.0",
"lodash.sortby": "^4.7.0",
"material-ui-chip-input": "^1.1.0",
"material-ui-color": "^1.2.0",
"moment": "^2.29.4",
"mui-chips-input": "^2.1.3",
"mui-datatables": "^4.3.0",
Expand Down
6 changes: 6 additions & 0 deletions portals/admin/src/main/webapp/site/public/locales/en.json
View file
Original file line number Diff line number Diff line change
Expand Up @@ -206,6 +206,7 @@
"Api.Provider": "Provider",
"Api.Version": "Version",
"Apis.Details.Scopes.CreateScope.roles.help": "Enter a valid role and press `Enter`.",
"Apis.Details.Scopes.Roles.Invalid": "Invalid Role(s) Found",
"Apis.Details.Scopes.permission.status.allow": "Allow",
"Apis.Details.Scopes.permission.status.deny": "Deny",
"Apis.Details.Scopes.permission.status.none": "None",
Expand Down Expand Up @@ -334,6 +335,8 @@
"Dashboard.tasksWorkflow.noTasks.card.description": "Manage workflow tasks, increase productivity and enhance competitiveness by enabling developers to easily deploy business processes and models.",
"Dashboard.tasksWorkflow.noTasks.card.title": "All the pending tasks completed",
"Form.Dialog.Base.cancel.btn": "Cancel",
"Gateway.AddEditGWEnvironment.permission.allowed": "Use of this Gateway Environment is \"Allowed\" for above roles.",
"Gateway.AddEditGWEnvironment.permission.denied": "Use of this Gateway Environment is \"Denied\" for above roles.",
"GatewayEnvironments.AddEditGWEnvironment.form.description.help": "Description of the Gateway Environment",
"GatewayEnvironments.AddEditGWEnvironment.form.description.label": "Description",
"GatewayEnvironments.AddEditGWEnvironment.form.displayName": "Display Name",
Expand All @@ -350,6 +353,9 @@
"GatewayEnvironments.AddEditGWEnvironment.form.info.edit.successful": "Gateway Environment edited successfully",
"GatewayEnvironments.AddEditGWEnvironment.form.name": "Name",
"GatewayEnvironments.AddEditGWEnvironment.form.name.help": "Name of the Gateway Environment",
"GatewayEnvironments.AddEditGWEnvironment.form.permission.type": "Gateway Environment Permission",
"GatewayEnvironments.AddEditGWEnvironment.form.permissions": "Permissions",
"GatewayEnvironments.AddEditGWEnvironment.form.permissions.add.description": "Permissions for the Gateway Environment",
"GatewayEnvironments.AddEditGWEnvironment.form.save.button.label": "Save",
"GatewayEnvironments.AddEditGWEnvironment.form.type.helper.text": "Supported Key Type of the Gateway Environment",
"GatewayEnvironments.AddEditGWEnvironment.form.type.hybrid.option": "Hybrid",
Expand Down
229 changes: 224 additions & 5 deletions ...in/src/main/webapp/source/src/app/components/GatewayEnvironments/AddEditGWEnvironment.jsx
View file
Original file line number Diff line number Diff line change
Expand Up @@ -19,8 +19,10 @@
import React, { useEffect, useReducer, useState } from 'react';
import { styled } from '@mui/material/styles';
import API from 'AppData/api';
import base64url from 'base64url';
import PropTypes from 'prop-types';
import { useAppContext } from 'AppComponents/Shared/AppContext';
import Box from '@mui/material/Box';
import TextField from '@mui/material/TextField';
import { FormattedMessage, useIntl } from 'react-intl';
import Select from '@mui/material//Select';
Expand All @@ -35,6 +37,10 @@ import Typography from '@mui/material/Typography';
import FormControlLabel from '@mui/material/FormControlLabel';
import FormHelperText from '@mui/material/FormHelperText';
import FormLabel from '@mui/material/FormLabel';
import { MuiChipsInput } from 'mui-chips-input';
import Error from '@material-ui/icons/Error';
import InputAdornment from '@material-ui/core/InputAdornment';
import { red } from '@material-ui/core/colors/';
import AddEditVhost from 'AppComponents/GatewayEnvironments/AddEditVhost';

const styles = {
Expand Down Expand Up @@ -77,6 +83,15 @@ const StyledLabel = styled('span')({ ...styles.label, ...styles.newLabel });

const StyledSpan = styled('span')(({ theme }) => ({ color: theme.palette.error.dark }));

const useStyles = styled(() => ({
chipInputBox: {
marginRight: '30px',
marginLeft: '10px',
marginTop: '10px',
marginBottom: '10px',
},
}));

/**
* Reducer
* @param {JSON} state State
Expand All @@ -91,10 +106,16 @@ function reducer(state, { field, value }) {
case 'gatewayType':
case 'description':
case 'type':
case 'roles':
case 'vhosts':
return { ...state, [field]: value };
case 'editDetails':
return value;
case 'permissionType':
return {
...state,
permissions: { ...state.permissions, [field]: value },
};
default:
return state;
}
Expand All @@ -106,6 +127,7 @@ function reducer(state, { field, value }) {
* @returns {JSX}.
*/
function AddEditGWEnvironment(props) {
const classes = useStyles();
const intl = useIntl();
const {
updateList, dataRow, icon, triggerButtonText, title,
Expand All @@ -115,22 +137,71 @@ function AddEditGWEnvironment(props) {
host: '', httpContext: '', httpsPort: 8243, httpPort: 8280, wssPort: 8099, wsPort: 9099, isNew: true,
};
const { settings } = useAppContext();
const [validRoles, setValidRoles] = useState([]);
const [invalidRoles, setInvalidRoles] = useState([]);
const [roleValidity, setRoleValidity] = useState(true);
const { gatewayTypes } = settings;
const [initialState, setInitialState] = useState({
displayName: '',
description: '',
gatewayType: gatewayTypes && gatewayTypes.length > 1 ? 'Regular' : gatewayTypes[0],
type: 'hybrid',
vhosts: [defaultVhost],
permissions: {
roles: [],
permissionType: 'PUBLIC',
},
});
const [editMode, setIsEditMode] = useState(false);

const [state, dispatch] = useReducer(reducer, initialState);
const {
name, displayName, description, vhosts, type, gatewayType,
name, displayName, description, vhosts, type, gatewayType, permissions,
} = state;

let permissionType = '';
if (permissions) {
permissionType = state.permissions.permissionType;
}
const handleRoleDeletion = (role) => {
if (invalidRoles.includes(role)) {
const invalidRolesArray = invalidRoles.filter((existingRole) => existingRole !== role);
setInvalidRoles(invalidRolesArray);
if (invalidRolesArray.length === 0) {
setRoleValidity(true);
}
} else {
setValidRoles(validRoles.filter((existingRole) => existingRole !== role));
}
};

const restApi = new API();
const handleRoleAddition = (role) => {
const promise = restApi.validateSystemRole(base64url.encode(role));
promise
.then(() => {
setValidRoles(validRoles.concat(role));
if (invalidRoles.length === 0) {
setRoleValidity(true);
} else {
setRoleValidity(false);
}
})
.catch((error) => {
if (error.status === 404) {
setInvalidRoles(invalidRoles.concat(role));
setRoleValidity(false);
} else {
Alert.error('Error when validating role: ' + role);
console.error('Error when validating role ' + error);
}
});
};
const onChange = (e) => {
if (e.target.name === 'GatewayPermissionRestrict') {
permissionType = e.target.value;
dispatch({ field: 'permissionType', value: permissionType });
}
dispatch({ field: e.target.name, value: e.target.value });
};

Expand All @@ -147,6 +218,10 @@ function AddEditGWEnvironment(props) {
gatewayType: '',
type: 'hybrid',
vhosts: [defaultVhost],
permissions: {
roles: [],
permissionType: 'PUBLIC',
},
});
}, []);

Expand Down Expand Up @@ -322,18 +397,18 @@ function AddEditGWEnvironment(props) {
});
});
}

const restApi = new API();
permissions.permissionType = state.permissions.permissionType;
permissions.roles = validRoles;
let promiseAPICall;
if (dataRow) {
// assign the update promise to the promiseAPICall
promiseAPICall = restApi.updateGatewayEnvironment(
dataRow.id, name.trim(), displayName, type, description, gatewayType, vhostDto,
dataRow.id, name.trim(), displayName, type, description, gatewayType, vhostDto, permissions,
);
} else {
// assign the create promise to the promiseAPICall
promiseAPICall = restApi.addGatewayEnvironment(name.trim(), displayName, type, description,
gatewayType, vhostDto);
gatewayType, vhostDto, permissions);
}

return promiseAPICall.then(() => {
Expand Down Expand Up @@ -372,6 +447,7 @@ function AddEditGWEnvironment(props) {
type: originalType,
vhosts: originalVhosts,
gatewayType: originalGatewayType,
permissions: originalPermissions,
} = dataRow;
setIsEditMode(true);
dispatch({
Expand All @@ -383,6 +459,7 @@ function AddEditGWEnvironment(props) {
gatewayType: originalGatewayType,
description: originalDescription,
vhosts: originalVhosts,
permissions: originalPermissions,
},
});
}
Expand Down Expand Up @@ -614,6 +691,148 @@ function AddEditGWEnvironment(props) {
/>
</FormHelperText>
</FormControl>
{/* Permissions */}
<FormControl
component='fieldset'
variant='outlined'
margin='dense'
style={{ marginTop: '10px', marginBottom: '10px' }}
>
<InputLabel id='demo-simple-select-label'>
<FormattedMessage
id='GatewayEnvironments.AddEditGWEnvironment.form.permissions'
defaultMessage='Permission'
/>
</InputLabel>
<Select
labelId='demo-simple-select-label'
id='demo-simple-select'
value={permissionType}
name='GatewayPermissionRestrict'
label={(
<FormattedMessage
id='GatewayEnvironments.AddEditGWEnvironment.form.permissions.select'
defaultMessage='Permission'
/>
)}
onChange={onChange}
>
<MenuItem key='PUBLIC' value='PUBLIC'>
<FormattedMessage
id='GatewayEnvironments.AddEditGWEnvironment.form.permission.public.option'
defaultMessage='Public'
/>
</MenuItem>
<MenuItem key='ALLOW' value='ALLOW'>
<FormattedMessage
id='GatewayEnvironments.AddEditGWEnvironment.form.permission.allow.option'
defaultMessage='Allow for role(s)'
/>
</MenuItem>
<MenuItem key='DENY' value='DENY'>
<FormattedMessage
id='GatewayEnvironments.AddEditGWEnvironment.form.permission.deny.option'
defaultMessage='Deny for role(s)'
/>
</MenuItem>
</Select>
<FormHelperText>
<FormattedMessage
id='GatewayEnvironments.AddEditGWEnvironment.form.Permission.helper.text'
defaultMessage='Permissions for the Gateway Environment'
/>
</FormHelperText>
<Box component='div' m={1}>
{
(permissionType === 'ALLOW' || permissionType === 'DENY')
&& (
<Box
display='flex'
flexDirection='row'
alignItems='center'
margin='dense'
classes={{ root: classes.chipInputBox }}
>
<MuiChipsInput
fullWidth
label='Roles'
InputLabelProps={{
shrink: true,
}}
name='GatewayEnvironmentPermissions'
variant='outlined'
value={validRoles.concat(invalidRoles)}
alwaysShowPlaceholder={false}
placeholder='Enter roles and press Enter'
blurBehavior='clear'
data-testid='gateway-permission-roles'
InputProps={{
endAdornment: !roleValidity && (
<InputAdornment
position='end'
sx={{
position: 'absolute',
right: '25px',
top: '50%',
}}
>
<Error color='error' />
</InputAdornment>
),
}}
onAddChip={handleRoleAddition}
renderChip={(ChipComponent, key, ChipProps) => (
<ChipComponent
key={ChipProps.label}
label={ChipProps.label}
onDelete={() => handleRoleDeletion(ChipProps.label)}
data-testid={ChipProps.label}
style={{
backgroundColor:
invalidRoles.includes(ChipProps.label)
? red[300] : null,
margin: '8px 8px 8px 0',
float: 'left',
}}
/>
)}
error={!roleValidity}
helperText={
!roleValidity ? (
<FormattedMessage
id='Gateway.AddEditGWEnvironment.permission.Invalid'
defaultMessage='Invalid Role(s) Found'
/>
) : [
(permissionType === 'ALLOW'
? (
<FormattedMessage
id='Gateway.AddEditGWEnvironment.permission.allowed'
defaultMessage='Use of this Gateway Environment is
"Allowed" for above roles.'
/>
)
: (
<FormattedMessage
id='Gateway.AddEditGWEnvironment.permission.denied'
defaultMessage='Use of this Gateway Environment is
"Denied" for above roles.'
/>
)
),
' ',
<FormattedMessage
id='Gateway.AddEditGWEnvironment.permission.help'
defaultMessage='Enter a valid role and press `Enter`'
/>,
]
}
/>
</Box>
)
}
</Box>
</FormControl>
<AddEditVhost
initialVhosts={vhosts}
onVhostChange={onChange}
Expand Down
Loading

0 comments on commit e260dfe

Please sign in to comment.