Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Jump to bottom

fix(redblack): fixing redblack onchange values #10107

Merged
merged 5 commits into from
May 13, 2024
Merged

fix(redblack): fixing redblack onchange values #10107

Changes from all commits
Commits
Show all changes
5 commits
Select commit Hold shift + click to select a range
d78f001
fix(redblack): fixing redblack onchange values
shlomodaari May 10, 2024
c603be6
fix(lint): fixing linting erros
shlomodaari May 13, 2024
cae0fdf
fix(lint): fixing linting - lodash
shlomodaari May 13, 2024
54440e9
fix(prettier): fixing prettier for AdditionalFields.tsx
shlomodaari May 13, 2024
f4f6507
Merge branch 'master' into fix-deck-recblack-onchange
ovidiupopa07 May 13, 2024
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
165 changes: 97 additions & 68 deletions packages/core/src/deploymentStrategy/strategies/redblack/AdditionalFields.tsx
View file
Open in desktop
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>
);
);
}
}