Portainer
/
portainer
mirror of https://github.com/portainer/portainer.git
1
0
Fork 0
Code Issues Packages Projects Releases Wiki Activity

refactor(containers): migrate restart policy tab to react [EE-5213] (#10347)

pull/10376/head
Chaim Lev-Ari 2023-09-25 20:40:26 +03:00 committed by GitHub
parent 3d19c46326
commit 2dfa4a7c45
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
9 changed files with 122 additions and 15 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

11
app/docker/react/components/containers.ts
View File

@ -34,6 +34,10 @@ import {
CapabilitiesTab,
capabilitiesTabUtils,
} from '@/react/docker/containers/CreateView/CapabilitiesTab';
import {
RestartPolicyTab,
restartPolicyTabUtils,
} from '@/react/docker/containers/CreateView/RestartPolicyTab';
const ngModule = angular
.module('portainer.docker.react.components.containers', [])
@ -103,3 +107,10 @@ withFormValidation(
[],
capabilitiesTabUtils.validation
);
withFormValidation(
ngModule,
RestartPolicyTab,
'dockerCreateContainerRestartPolicyTab',
[],
restartPolicyTabUtils.validation
);

12
app/docker/views/containers/create/createContainerController.js
View File

@ -17,6 +17,7 @@ import './createcontainer.css';
import { envVarsTabUtils } from '@/react/docker/containers/CreateView/EnvVarsTab';
import { getContainers } from '@/react/docker/containers/queries/containers';
import { resourcesTabUtils } from '@/react/docker/containers/CreateView/ResourcesTab';
import { restartPolicyTabUtils } from '@/react/docker/containers/CreateView/RestartPolicyTab';
angular.module('portainer.docker').controller('CreateContainerController', [
'$q',
@ -86,12 +87,14 @@ angular.module('portainer.docker').controller('CreateContainerController', [
AccessControlData: new AccessControlFormData(),
NodeName: null,
RegistryModel: new PorImageRegistryModel(),
commands: commandsTabUtils.getDefaultViewModel(),
envVars: envVarsTabUtils.getDefaultViewModel(),
volumes: volumesTabUtils.getDefaultViewModel(),
network: networkTabUtils.getDefaultViewModel(),
resources: resourcesTabUtils.getDefaultViewModel(),
capabilities: capabilitiesTabUtils.getDefaultViewModel(),
restartPolicy: restartPolicyTabUtils.getDefaultViewModel(),
};
$scope.state = {
@ -146,6 +149,12 @@ angular.module('portainer.docker').controller('CreateContainerController', [
});
};
$scope.onRestartPolicyChange = function (restartPolicy) {
return $scope.$evalAsync(() => {
$scope.formValues.restartPolicy = restartPolicy;
});
};
function onAlwaysPullChange(checked) {
return $scope.$evalAsync(() => {
$scope.formValues.alwaysPull = checked;
@ -315,6 +324,7 @@ angular.module('portainer.docker').controller('CreateContainerController', [
config = networkTabUtils.toRequest(config, $scope.formValues.network, $scope.fromContainer.Id);
config = resourcesTabUtils.toRequest(config, $scope.formValues.resources);
config = capabilitiesTabUtils.toRequest(config, $scope.formValues.capabilities);
config = restartPolicyTabUtils.toRequest(config, $scope.formValues.restartPolicy);
prepareImageConfig(config);
preparePortBindings(config);
@ -372,6 +382,8 @@ angular.module('portainer.docker').controller('CreateContainerController', [
$scope.formValues.resources = resourcesTabUtils.toViewModel(d);
$scope.formValues.capabilities = capabilitiesTabUtils.toViewModel(d);
$scope.formValues.restartPolicy = restartPolicyTabUtils.toViewModel(d);
loadFromContainerPortBindings(d);
loadFromContainerLabels(d);
loadFromContainerImageConfig(d);

18
app/docker/views/containers/create/createcontainer.html
View File

@ -264,23 +264,11 @@
></docker-create-container-env-vars-tab>
</div>
<!-- !tab-env -->
<!-- tab-restart-policy -->
<div class="tab-pane" id="restart-policy">
<form class="form-horizontal" style="margin-top: 15px">
<div class="form-group">
<div class="col-sm-12">
<label class="control-label text-left"> Restart policy </label>
<div class="btn-group btn-group-sm" style="margin-left: 20px">
<label class="btn btn-light" ng-model="config.HostConfig.RestartPolicy.Name" uib-btn-radio="'no'"> Never </label>
<label class="btn btn-light" ng-model="config.HostConfig.RestartPolicy.Name" uib-btn-radio="'always'"> Always </label>
<label class="btn btn-light" ng-model="config.HostConfig.RestartPolicy.Name" uib-btn-radio="'on-failure'"> On failure </label>
<label class="btn btn-light" ng-model="config.HostConfig.RestartPolicy.Name" uib-btn-radio="'unless-stopped'"> Unless stopped </label>
</div>
</div>
</div>
</form>
<docker-create-container-restart-policy-tab values="formValues.restartPolicy" on-change="(onRestartPolicyChange)"></docker-create-container-restart-policy-tab>
</div>
<!-- !tab-restart-policy -->
<!-- tab-runtime-resources -->
<div class="tab-pane" id="runtime-resources">
<docker-create-container-resources-tab

27
app/react/docker/containers/CreateView/RestartPolicyTab/RestartPolicyTab.tsx Normal file
View File

@ -0,0 +1,27 @@
import { ButtonSelector } from '@@/form-components/ButtonSelector/ButtonSelector';
import { FormControl } from '@@/form-components/FormControl';
import { RestartPolicy } from './types';
export function RestartPolicyTab({
values,
onChange,
}: {
values: RestartPolicy;
onChange: (values: RestartPolicy) => void;
}) {
return (
<FormControl label="Restart Policy">
<ButtonSelector
options={[
{ label: 'Never', value: RestartPolicy.No },
{ label: 'Always', value: RestartPolicy.Always },
{ label: 'On failure', value: RestartPolicy.OnFailure },
{ label: 'Unless stopped', value: RestartPolicy.UnlessStopped },
]}
value={values}
onChange={onChange}
/>
</FormControl>
);
}

13
app/react/docker/containers/CreateView/RestartPolicyTab/index.ts Normal file
View File

@ -0,0 +1,13 @@
import { validation } from './validation';
import { toViewModel, getDefaultViewModel } from './toViewModel';
import { toRequest } from './toRequest';
export { RestartPolicyTab } from './RestartPolicyTab';
export { RestartPolicy } from './types';
export const restartPolicyTabUtils = {
toViewModel,
toRequest,
validation,
getDefaultViewModel,
};

19
app/react/docker/containers/CreateView/RestartPolicyTab/toRequest.ts Normal file
View File

@ -0,0 +1,19 @@
import { CreateContainerRequest } from '../types';
import { RestartPolicy } from './types';
export function toRequest(
config: CreateContainerRequest,
value: RestartPolicy
): CreateContainerRequest {
return {
...config,
HostConfig: {
...config.HostConfig,
RestartPolicy: {
...config.HostConfig.RestartPolicy,
Name: value,
},
},
};
}

21
app/react/docker/containers/CreateView/RestartPolicyTab/toViewModel.ts Normal file
View File

@ -0,0 +1,21 @@
import { ContainerJSON } from '../../queries/container';
import { RestartPolicy } from './types';
export function toViewModel(config: ContainerJSON): RestartPolicy {
switch (config.HostConfig?.RestartPolicy?.Name) {
case 'always':
return RestartPolicy.Always;
case 'on-failure':
return RestartPolicy.OnFailure;
case 'unless-stopped':
return RestartPolicy.UnlessStopped;
case 'no':
default:
return RestartPolicy.No;
}
}
export function getDefaultViewModel(): RestartPolicy {
return RestartPolicy.No;
}

7
app/react/docker/containers/CreateView/RestartPolicyTab/types.ts Normal file
View File

@ -0,0 +1,7 @@
// Enum version of RestartPolicy
export enum RestartPolicy {
No = 'no',
Always = 'always',
OnFailure = 'on-failure',
UnlessStopped = 'unless-stopped',
}

9
app/react/docker/containers/CreateView/RestartPolicyTab/validation.ts Normal file
View File

@ -0,0 +1,9 @@
import { mixed, SchemaOf } from 'yup';
import { RestartPolicy } from './types';
export function validation(): SchemaOf<RestartPolicy> {
return mixed<RestartPolicy>()
.oneOf(Object.values(RestartPolicy))
.default(RestartPolicy.No) as SchemaOf<RestartPolicy>;
}