mirror of
https://github.com/Unleash/unleash.git
synced 2024-12-22 19:07:54 +01:00
Fix/console warn (#290)
* fix: resolve uncontrolled autocomplete * fix: return if no strategy is present * fix: change logic for retrieving context index * fix: remove prop types from UserList * fix: add default to api key name input * fix: remove raised property from button
This commit is contained in:
parent
ad09c4039a
commit
cc54fad3a4
@ -10,7 +10,7 @@ import PropTypes from 'prop-types';
|
||||
import ConditionallyRender from '../ConditionallyRender/ConditionallyRender';
|
||||
import { useStyles } from './Dialogue.styles';
|
||||
|
||||
const ConfirmDialogue = ({
|
||||
const Dialogue = ({
|
||||
children,
|
||||
open,
|
||||
onClick,
|
||||
@ -67,10 +67,9 @@ const ConfirmDialogue = ({
|
||||
);
|
||||
};
|
||||
|
||||
ConfirmDialogue.propTypes = {
|
||||
Dialogue.propTypes = {
|
||||
primaryButtonText: PropTypes.string,
|
||||
secondaryButtonText: PropTypes.string,
|
||||
children: PropTypes.object,
|
||||
open: PropTypes.bool,
|
||||
onClick: PropTypes.func,
|
||||
onClose: PropTypes.func,
|
||||
@ -80,4 +79,4 @@ ConfirmDialogue.propTypes = {
|
||||
fullWidth: PropTypes.bool,
|
||||
};
|
||||
|
||||
export default ConfirmDialogue;
|
||||
export default Dialogue;
|
||||
|
@ -26,6 +26,8 @@ const ContextList = ({ removeContextField, history, contextFields }) => {
|
||||
const [showDelDialogue, setShowDelDialogue] = useState(false);
|
||||
const [name, setName] = useState();
|
||||
|
||||
console.log(contextFields);
|
||||
|
||||
const styles = useStyles();
|
||||
const contextList = () =>
|
||||
contextFields.map(field => (
|
||||
|
@ -6,7 +6,7 @@ import { useStyles } from './StrategyCardConstraints.styles.js';
|
||||
import ConditionallyRender from '../../../../../../common/ConditionallyRender/ConditionallyRender';
|
||||
import { C } from '../../../../../../common/flags.js';
|
||||
|
||||
const StrategyCardConstraints = ({ constraints= [], flags }) => {
|
||||
const StrategyCardConstraints = ({ constraints = [], flags }) => {
|
||||
const styles = useStyles();
|
||||
|
||||
const isEnterprise = () => {
|
||||
@ -33,8 +33,9 @@ const StrategyCardConstraints = ({ constraints= [], flags }) => {
|
||||
};
|
||||
|
||||
const renderConstraints = () => {
|
||||
/* TODO: We need something unique here or we might have weird rendering issues. */
|
||||
return constraints.map((constraint, i) => (
|
||||
<div key={`${constraint.contextName}-${constraint.operator}`}>
|
||||
<div key={`${constraint.contextName}-${constraint.operator}-${i}`}>
|
||||
<ConditionallyRender
|
||||
condition={i > 0}
|
||||
show={<span>and</span>}
|
||||
|
@ -13,7 +13,12 @@ const constraintOperators = [
|
||||
{ key: 'NOT_IN', label: 'NOT_IN' },
|
||||
];
|
||||
|
||||
const StrategyConstraintInputField = ({ constraint, updateConstraint, removeConstraint, contextFields }) => {
|
||||
const StrategyConstraintInputField = ({
|
||||
constraint,
|
||||
updateConstraint,
|
||||
removeConstraint,
|
||||
contextFields,
|
||||
}) => {
|
||||
const [error, setError] = useState();
|
||||
const commonStyles = useCommonStyles();
|
||||
const styles = useStyles();
|
||||
@ -40,10 +45,14 @@ const StrategyConstraintInputField = ({ constraint, updateConstraint, removeCons
|
||||
key: f.name,
|
||||
label: f.name,
|
||||
}));
|
||||
const constraintDef = contextFields.find(c => c.name === constraint.contextName);
|
||||
const constraintDef = contextFields.find(
|
||||
c => c.name === constraint.contextName
|
||||
);
|
||||
|
||||
const options =
|
||||
constraintDef && constraintDef.legalValues && constraintDef.legalValues.length > 0
|
||||
constraintDef &&
|
||||
constraintDef.legalValues &&
|
||||
constraintDef.legalValues.length > 0
|
||||
? constraintDef.legalValues.map(l => ({ value: l, label: l }))
|
||||
: undefined;
|
||||
const values = constraint.values.map(v => ({ value: v, label: v }));
|
||||
@ -55,8 +64,10 @@ const StrategyConstraintInputField = ({ constraint, updateConstraint, removeCons
|
||||
name="contextName"
|
||||
label="Context Field"
|
||||
options={constraintContextNames}
|
||||
value={constraint.contextName}
|
||||
onChange={evt => updateConstraint(evt.target.value, 'contextName')}
|
||||
value={constraint.contextName || ''}
|
||||
onChange={evt =>
|
||||
updateConstraint(evt.target.value, 'contextName')
|
||||
}
|
||||
className={styles.contextField}
|
||||
/>
|
||||
</td>
|
||||
@ -66,7 +77,9 @@ const StrategyConstraintInputField = ({ constraint, updateConstraint, removeCons
|
||||
label="Operator"
|
||||
options={constraintOperators}
|
||||
value={constraint.operator}
|
||||
onChange={evt => updateConstraint(evt.target.value, 'operator')}
|
||||
onChange={evt =>
|
||||
updateConstraint(evt.target.value, 'operator')
|
||||
}
|
||||
className={styles.operator}
|
||||
/>
|
||||
</td>
|
||||
@ -78,13 +91,27 @@ const StrategyConstraintInputField = ({ constraint, updateConstraint, removeCons
|
||||
multiple
|
||||
size="small"
|
||||
options={options}
|
||||
value={values || []}
|
||||
getOptionLabel={option => option.label}
|
||||
getOptionSelected={(option, value) => option.value === value.value}
|
||||
defaultValue={values}
|
||||
getOptionSelected={(option, value) =>
|
||||
option.value === value.value
|
||||
}
|
||||
filterSelectedOptions
|
||||
filterOptions={options => options.filter(o => !values.some(v => v.value === o.value))}
|
||||
onChange={(evt, values) => handleChangeValue(values)}
|
||||
renderInput={params => <TextField {...params} variant="outlined" label="Values" />}
|
||||
filterOptions={options =>
|
||||
options.filter(
|
||||
o => !values.some(v => v.value === o.value)
|
||||
)
|
||||
}
|
||||
onChange={(evt, values) =>
|
||||
handleChangeValue(values)
|
||||
}
|
||||
renderInput={params => (
|
||||
<TextField
|
||||
{...params}
|
||||
variant="outlined"
|
||||
label="Values"
|
||||
/>
|
||||
)}
|
||||
/>
|
||||
}
|
||||
elseShow={
|
||||
@ -94,7 +121,9 @@ const StrategyConstraintInputField = ({ constraint, updateConstraint, removeCons
|
||||
onBlur={onBlur}
|
||||
values={constraint.values}
|
||||
label="Values (v1, v2, v3)"
|
||||
updateValues={values => updateConstraint(values, 'values')}
|
||||
updateValues={values =>
|
||||
updateConstraint(values, 'values')
|
||||
}
|
||||
/>
|
||||
}
|
||||
/>
|
||||
|
@ -1,7 +1,13 @@
|
||||
import React from 'react';
|
||||
import PropTypes from 'prop-types';
|
||||
import { Link } from 'react-router-dom';
|
||||
import { Typography, IconButton, FormControl, TextField, Button } from '@material-ui/core';
|
||||
import {
|
||||
Typography,
|
||||
IconButton,
|
||||
FormControl,
|
||||
TextField,
|
||||
Button,
|
||||
} from '@material-ui/core';
|
||||
import CreateIcon from '@material-ui/icons/Create';
|
||||
import ConditionallyRender from '../../common/ConditionallyRender/ConditionallyRender';
|
||||
|
||||
@ -53,7 +59,10 @@ export default class UpdateDescriptionComponent extends React.Component {
|
||||
aria-label="toggle description edit"
|
||||
to="#edit"
|
||||
component={Link}
|
||||
onClick={this.onEditMode.bind(this, description)}
|
||||
onClick={this.onEditMode.bind(
|
||||
this,
|
||||
description
|
||||
)}
|
||||
>
|
||||
<CreateIcon />
|
||||
</IconButton>
|
||||
@ -79,11 +88,16 @@ export default class UpdateDescriptionComponent extends React.Component {
|
||||
onChange={this.updateValue}
|
||||
/>
|
||||
<div style={{ marginTop: '0.5rem' }}>
|
||||
<Button type="submit" color="primary" variant="contained" onClick={this.onSave}>
|
||||
<Button
|
||||
type="submit"
|
||||
color="primary"
|
||||
variant="contained"
|
||||
onClick={this.onSave}
|
||||
>
|
||||
Save
|
||||
</Button>
|
||||
|
||||
<Button type="cancel" raised onClick={this.onCancel}>
|
||||
<Button type="cancel" onClick={this.onCancel}>
|
||||
Cancel
|
||||
</Button>
|
||||
</div>
|
||||
@ -93,6 +107,8 @@ export default class UpdateDescriptionComponent extends React.Component {
|
||||
|
||||
render() {
|
||||
const { editMode } = this.state;
|
||||
return editMode ? this.renderEdit(this.props) : this.renderRead(this.props);
|
||||
return editMode
|
||||
? this.renderEdit(this.props)
|
||||
: this.renderRead(this.props);
|
||||
}
|
||||
}
|
||||
|
@ -30,7 +30,7 @@ const CreateStrategy = ({
|
||||
<ConditionallyRender
|
||||
condition={editMode}
|
||||
show={
|
||||
<Typography variant="p">
|
||||
<Typography variant="body1">
|
||||
Be careful! Changing a strategy definition might also
|
||||
require changes to the implementation in the clients.
|
||||
</Typography>
|
||||
|
@ -17,7 +17,7 @@ export default class StrategyDetails extends Component {
|
||||
toggles: PropTypes.array,
|
||||
applications: PropTypes.array,
|
||||
activeTab: PropTypes.string.isRequired,
|
||||
strategy: PropTypes.object.isRequired,
|
||||
strategy: PropTypes.object,
|
||||
fetchStrategies: PropTypes.func.isRequired,
|
||||
fetchApplications: PropTypes.func.isRequired,
|
||||
fetchFeatureToggles: PropTypes.func.isRequired,
|
||||
@ -38,6 +38,8 @@ export default class StrategyDetails extends Component {
|
||||
|
||||
render() {
|
||||
const strategy = this.props.strategy;
|
||||
if (!strategy) return null;
|
||||
|
||||
const tabData = [
|
||||
{
|
||||
label: 'Details',
|
||||
|
@ -1,4 +1,4 @@
|
||||
import React, { useContext, useEffect, useState } from 'react';
|
||||
import { useContext, useEffect, useState } from 'react';
|
||||
import PropTypes from 'prop-types';
|
||||
import { Link, useHistory } from 'react-router-dom';
|
||||
|
||||
@ -11,7 +11,6 @@ import {
|
||||
IconButton,
|
||||
Button,
|
||||
Tooltip,
|
||||
Typography,
|
||||
} from '@material-ui/core';
|
||||
import HeaderTitle from '../../common/HeaderTitle';
|
||||
import PageContent from '../../common/PageContent/PageContent';
|
||||
@ -131,9 +130,7 @@ const TagTypeList = ({ tagTypes, fetchTagTypes, removeTagType }) => {
|
||||
onClose={() => {
|
||||
setDeletion({ open: false });
|
||||
}}
|
||||
>
|
||||
<Typography>Are you sure?</Typography>
|
||||
</Dialogue>
|
||||
/>
|
||||
</PageContent>
|
||||
);
|
||||
};
|
||||
|
@ -1,6 +1,13 @@
|
||||
import React, { useState } from 'react';
|
||||
import PropTypes from 'prop-types';
|
||||
import { Select, TextField, Button, MenuItem, FormControl, InputLabel } from '@material-ui/core';
|
||||
import {
|
||||
Select,
|
||||
TextField,
|
||||
Button,
|
||||
MenuItem,
|
||||
FormControl,
|
||||
InputLabel,
|
||||
} from '@material-ui/core';
|
||||
import Dialogue from '../../../component/common/Dialogue/Dialogue';
|
||||
import classnames from 'classnames';
|
||||
import { styles as commonStyles } from '../../../component/common';
|
||||
@ -43,9 +50,15 @@ function CreateApiKey({ addKey }) {
|
||||
secondaryButtonText="Cancel"
|
||||
title="Add new API key"
|
||||
>
|
||||
<form onSubmit={submit} className={classnames(styles.addApiKeyForm, commonStyles.contentSpacing)}>
|
||||
<form
|
||||
onSubmit={submit}
|
||||
className={classnames(
|
||||
styles.addApiKeyForm,
|
||||
commonStyles.contentSpacing
|
||||
)}
|
||||
>
|
||||
<TextField
|
||||
value={username}
|
||||
value={username || ''}
|
||||
name="username"
|
||||
onChange={e => setUsername(e.target.value)}
|
||||
label="Username"
|
||||
@ -55,7 +68,11 @@ function CreateApiKey({ addKey }) {
|
||||
variant="outlined"
|
||||
size="small"
|
||||
/>
|
||||
<FormControl variant="outlined" size="small" style={{ minWidth: '120px' }}>
|
||||
<FormControl
|
||||
variant="outlined"
|
||||
size="small"
|
||||
style={{ minWidth: '120px' }}
|
||||
>
|
||||
<InputLabel id="apikey_type" />
|
||||
<Select
|
||||
labelId="apikey_type"
|
||||
@ -63,10 +80,18 @@ function CreateApiKey({ addKey }) {
|
||||
value={type}
|
||||
onChange={e => setType(e.target.value)}
|
||||
>
|
||||
<MenuItem value="CLIENT" key="apikey_client" title="Client">
|
||||
<MenuItem
|
||||
value="CLIENT"
|
||||
key="apikey_client"
|
||||
title="Client"
|
||||
>
|
||||
Client
|
||||
</MenuItem>
|
||||
<MenuItem value="ADMIN" key="apikey_admin" title="Admin">
|
||||
<MenuItem
|
||||
value="ADMIN"
|
||||
key="apikey_admin"
|
||||
title="Admin"
|
||||
>
|
||||
Admin
|
||||
</MenuItem>
|
||||
</Select>
|
||||
|
@ -240,14 +240,6 @@ function UsersList({ location }) {
|
||||
}
|
||||
|
||||
UsersList.propTypes = {
|
||||
roles: PropTypes.array.isRequired,
|
||||
users: PropTypes.array.isRequired,
|
||||
fetchUsers: PropTypes.func.isRequired,
|
||||
removeUser: PropTypes.func.isRequired,
|
||||
addUser: PropTypes.func.isRequired,
|
||||
validatePassword: PropTypes.func.isRequired,
|
||||
updateUser: PropTypes.func.isRequired,
|
||||
changePassword: PropTypes.func.isRequired,
|
||||
location: PropTypes.object.isRequired,
|
||||
};
|
||||
|
||||
|
@ -17,12 +17,16 @@ function getInitState() {
|
||||
return new List(DEFAULT_CONTEXT_FIELDS);
|
||||
}
|
||||
|
||||
const strategies = (state = getInitState(), action) => {
|
||||
const context = (state = getInitState(), action) => {
|
||||
switch (action.type) {
|
||||
case RECEIVE_CONTEXT:
|
||||
return new List(action.value);
|
||||
case REMOVE_CONTEXT:
|
||||
return state.remove(state.indexOf(action.context));
|
||||
const index = state.findIndex(
|
||||
item => item.name === action.context.name
|
||||
);
|
||||
|
||||
return state.remove(index);
|
||||
case ADD_CONTEXT_FIELD:
|
||||
return state.push(action.context);
|
||||
case UPDATE_CONTEXT_FIELD: {
|
||||
@ -39,4 +43,4 @@ const strategies = (state = getInitState(), action) => {
|
||||
}
|
||||
};
|
||||
|
||||
export default strategies;
|
||||
export default context;
|
||||
|
Loading…
Reference in New Issue
Block a user