Skip to content

Commit

Permalink
fix(redblack): fixing redblack onchange values (spinnaker#10107) (spi…
Browse files Browse the repository at this point in the history
…nnaker#10110)

* fix(redblack): fixing redblack onchange values

* fix(lint): fixing linting erros

* fix(lint): fixing linting - lodash

* fix(prettier): fixing prettier for AdditionalFields.tsx

---------

Co-authored-by: ovidiupopa07 <[email protected]>
(cherry picked from commit 443408e)

Co-authored-by: Shlomo Daari <[email protected]>
  • Loading branch information
2 people authored and sahititarigoppula committed Jul 1, 2024
1 parent ccb4e4e commit 6dc1e42
Showing 1 changed file with 97 additions and 68 deletions.
Original file line number Diff line number Diff line change
Expand Up @@ -8,72 +8,101 @@ export interface IRedBlackStrategyAdditionalFieldsProps extends IDeploymentStrat
command: IRedBlackCommand;
}

export const AdditionalFields = ({ command, onChange }: IRedBlackStrategyAdditionalFieldsProps) => (
<div className="form-group">
<div className="col-md-12 checkbox">
<label>
<input
type="checkbox"
checked={command.rollback?.onFailure ?? false}
onChange={(e) => onChange('rollback.onFailure', e.target.checked)}
/>
Rollback to previous server group if deployment fails <HelpField id="strategy.redblack.rollback" />
</label>
</div>
<div className="col-md-12 checkbox">
<label>
<input type="checkbox" checked={command.scaleDown} onChange={(e) => onChange('scaleDown', e.target.checked)} />
Scale down replaced server groups to zero instances
<HelpField id="strategy.redblack.scaleDown" />
</label>
</div>
<div className="col-md-12 form-inline">
<label>
Maximum number of server groups to leave
<HelpField id="strategy.redblack.maxRemainingAsgs" />
</label>
<input
className="form-control input-sm"
style={{ width: '50px' }}
type="number"
value={command.maxRemainingAsgs}
onChange={(e) => onChange('maxRemainingAsgs', e.target.value)}
min="2"
/>
</div>
<div className="col-md-12 form-inline">
<label>
Wait Before Disable
<HelpField content="Time to wait before disabling all old server groups in this cluster" />
</label>
<input
className="form-control input-sm"
style={{ width: '60px' }}
min="0"
type="number"
value={command.delayBeforeDisableSec}
onChange={(e) => onChange('delayBeforeDisableSec', e.target.value)}
placeholder="0"
/>
seconds
</div>
{command.scaleDown && (
<div className="col-md-12 form-inline" style={{ marginTop: '5px' }}>
<label>
Wait Before Scale Down
<HelpField content="Time to wait before scaling down all old server groups in this cluster" />
</label>
<input
className="form-control input-sm"
style={{ width: '60px' }}
min="0"
type="number"
value={command.delayBeforeScaleDownSec}
onChange={(e) => onChange('delayBeforeScaleDownSec', e.target.value)}
placeholder="0"
/>
seconds
export class AdditionalFields extends React.Component<IRedBlackStrategyAdditionalFieldsProps> {
private rollbackOnFailureChange = (e: React.ChangeEvent<HTMLInputElement>) => {
this.props.command.rollback.onFailure = e.target.checked;
this.forceUpdate();
};

private scaleDownChange = (e: React.ChangeEvent<HTMLInputElement>) => {
this.props.command.scaleDown = e.target.checked;
this.forceUpdate();
};

private maxRemainingAsgsChange = (e: React.ChangeEvent<HTMLInputElement>) => {
this.props.command.maxRemainingAsgs = parseInt(e.target.value, 10);
this.forceUpdate();
};

private delayBeforeDisableSecChange = (e: React.ChangeEvent<HTMLInputElement>) => {
this.props.command.delayBeforeDisableSec = parseInt(e.target.value, 10);
this.forceUpdate();
};

private delayBeforeScaleDownSecChange = (e: React.ChangeEvent<HTMLInputElement>) => {
this.props.command.delayBeforeScaleDownSec = parseInt(e.target.value, 10);
this.forceUpdate();
};

public render() {
const { command } = this.props;
return (
<div className="form-group">
<div className="col-md-12 checkbox" style={{ marginTop: 0 }}>
<label>
<input
type="checkbox"
checked={command.rollback?.onFailure ?? false}
onChange={this.rollbackOnFailureChange}
/>
Rollback to previous server group if deployment fails <HelpField id="strategy.redblack.rollback" />
</label>
</div>
<div className="col-md-12 checkbox">
<label>
<input type="checkbox" checked={command.scaleDown} onChange={this.scaleDownChange} />
Scale down replaced server groups to zero instances <HelpField id="strategy.redblack.scaleDown" />
</label>
</div>
<div className="col-md-12 form-inline">
<label>
Maximum number of server groups to leave
<HelpField id="strategy.redblack.maxRemainingAsgs" />
</label>
<input
className="form-control input-sm"
style={{ width: '50px' }}
type="number"
value={command.maxRemainingAsgs}
onChange={this.maxRemainingAsgsChange}
min="2"
/>
</div>
<div className="col-md-12 form-inline">
<label>
Wait Before Disable
<HelpField content="Time to wait before disabling all old server groups in this cluster" />
</label>
<input
className="form-control input-sm"
style={{ width: '60px' }}
min="0"
type="number"
value={command.delayBeforeDisableSec}
onChange={this.delayBeforeDisableSecChange}
placeholder="0"
/>
seconds
</div>
{command.scaleDown && (
<div className="col-md-12 form-inline" style={{ marginTop: '5px' }}>
<label>
Wait Before Scale Down
<HelpField content="Time to wait before scaling down all old server groups in this cluster" />
</label>
<input
className="form-control input-sm"
style={{ width: '60px' }}
min="0"
type="number"
value={command.delayBeforeScaleDownSec}
onChange={this.delayBeforeScaleDownSecChange}
placeholder="0"
/>
seconds
</div>
)}
</div>
)}
</div>
);
);
}
}

0 comments on commit 6dc1e42

Please sign in to comment.