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

refactor the logic backing GKE network/subnetwork selections 

While working on a ticket to provide the ability to de-select subnetworks when
using the create subnetwork option I discovered the options were all messed up
and allowed you to misconfigure yourself into a hole.

I've moved ipalias and related networks settings out of advanced becuase
depending on what you select for your subnetwork the ability to choose ipalias
and the other settings changes.

This change allows you deselect a node subnet so you can create a subnetwork
automatically.

rancher/rancher#21079
This commit is contained in:
Westly Wright 2019-11-07 13:43:10 -07:00
parent 62bee3bdf0
commit 3399b66bc3
No known key found for this signature in database
GPG Key ID: 4FAB3D8673DC54A3
3 changed files with 180 additions and 136 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

142
lib/shared/addon/components/cluster-driver/driver-googlegke/component.js
View File

@ -1,15 +1,15 @@
import Component from '@ember/component' import Component from '@ember/component'
import ClusterDriver from 'shared/mixins/cluster-driver'; import ClusterDriver from 'shared/mixins/cluster-driver';
import layout from './template'; import layout from './template';
import { import {
get, set, computed, observer, setProperties get, set, computed, observer, setProperties
} from '@ember/object'; } from '@ember/object';
import { sortableNumericSuffix } from 'shared/utils/util'; import { sortableNumericSuffix } from 'shared/utils/util';
import { reject, all } from 'rsvp'; import { reject, all } from 'rsvp';
import { inject as service } from '@ember/service'; import { inject as service } from '@ember/service';
import { equal } from '@ember/object/computed' import { equal } from '@ember/object/computed';
import $ from 'jquery'; import $ from 'jquery';
import { isEmpty } from '@ember/utils';
const times = [ const times = [
{ {
@ -211,19 +211,21 @@ export default Component.extend(ClusterDriver, {
if ( !config ) { if ( !config ) {
config = get(this, 'globalStore').createRecord({ config = get(this, 'globalStore').createRecord({
type: 'googleKubernetesEngineConfig', type: 'googleKubernetesEngineConfig',
diskSizeGb: 100, diskSizeGb: 100,
enableAlphaFeature: false, enableAlphaFeature: false,
nodeCount: 3, nodeCount: 3,
machineType: 'n1-standard-2', machineType: 'n1-standard-2',
zone: 'us-central1-f', zone: 'us-central1-f',
clusterIpv4Cidr: '', clusterIpv4Cidr: '',
minNodeCount: 1, minNodeCount: 1,
maxNodeCount: 5, maxNodeCount: 5,
imageType: 'UBUNTU', imageType: 'UBUNTU',
diskType: 'pd-standard', diskType: 'pd-standard',
region: 'us-west2', region: 'us-west2',
taints: [], taints: [],
useIpAliases: true,
ipPolicyCreateSubnetwork: true,
}); });
setProperties(this, { setProperties(this, {
@ -448,8 +450,14 @@ export default Component.extend(ClusterDriver, {
const subNetworkContent = get(this, 'subNetworkContent') || [] const subNetworkContent = get(this, 'subNetworkContent') || []
if (subNetworkContent.length > 0) { if (subNetworkContent.length > 1) {
set(this, 'config.subNetwork', subNetworkContent[0] && subNetworkContent[0].value) const firstNonNullSubnetMatch = subNetworkContent.find((sn) => !isEmpty(sn.value));
setProperties(this, {
'config.subNetwork': firstNonNullSubnetMatch.value,
'config.ipPolicyCreateSubnetwork': false,
})
const secondaryIpRangeContent = get(this, 'secondaryIpRangeContent') || [] const secondaryIpRangeContent = get(this, 'secondaryIpRangeContent') || []
if (secondaryIpRangeContent.length > 0) { if (secondaryIpRangeContent.length > 0) {
@ -463,6 +471,20 @@ export default Component.extend(ClusterDriver, {
} }
}), }),
subnetworkChange: observer('config.subNetwork', function() {
if (this.saving) {
return;
}
const { config: { subNetwork } } = this;
if (isEmpty(subNetwork)) {
set(this, 'config.ipPolicyCreateSubnetwork', true);
} else {
set(this, 'config.ipPolicyCreateSubnetwork', false);
}
}),
secondaryIpRangeContentChange: observer('secondaryIpRangeContent.[]', 'config.useIpAliases', function() { secondaryIpRangeContentChange: observer('secondaryIpRangeContent.[]', 'config.useIpAliases', function() {
if (this.saving) { if (this.saving) {
return; return;
@ -480,8 +502,15 @@ export default Component.extend(ClusterDriver, {
return; return;
} }
if (!get(this, 'config.useIpAliases')) { if (get(this, 'config.useIpAliases')) {
set(this, 'config.enablePrivateNodes', false) if (!isEmpty(this.config.subNetwork)) {
set(this, 'config.ipPolicyCreateSubnetwork', false);
}
} else {
setProperties(this, {
'config.enablePrivateNodes': false,
'config.ipPolicyCreateSubnetwork': false,
});
} }
}), }),
@ -544,43 +573,62 @@ export default Component.extend(ClusterDriver, {
return zoneChoices.filter((z) => (z.name || '').startsWith(locationName) && z.name !== zone) return zoneChoices.filter((z) => (z.name || '').startsWith(locationName) && z.name !== zone)
}), }),
networkContent: computed('networks', function() { networkContent: computed('networks', 'config.zone', function() {
return get(this, 'networks') return get(this, 'networks')
}), }),
subNetworkContent: computed('subNetworks.[]', 'config.network', function() { subNetworkContent: computed('subNetworks.[]', 'config.network', 'config.zone', function() {
const subNetworks = get(this, 'subNetworks') || [] const {
const networkName = get(this, 'config.network') config: { network: networkName },
networkContent,
subNetworks = [],
} = this;
const out = subNetworks.filter((s) => { const filteredSubnets = (subNetworks || []).filter((s) => {
const { network = '' } = s const network = networkContent.findBy('selfLink', s.network);
const arr = network.split('/') || [] const networkDisplayName = network.name;
const networkDisplayName = arr[arr.length - 1]
if (networkDisplayName === networkName) { if (networkDisplayName === networkName) {
return true return true
} }
}) });
const mappedSubnets = filteredSubnets.map((o) => {
const network = networkContent.findBy('selfLink', o.network);
const networkDisplayName = network.name;
return out.map((o) => {
return { return {
label: `${ o.name }(${ o.ipCidrRange })`, label: `${ o.name }(${ o.ipCidrRange })`,
value: o.name, value: o.name,
secondaryIpRanges: o.secondaryIpRanges, secondaryIpRanges: o.secondaryIpRanges,
networkDisplayName
} }
}) });
const defaultSubnetAry = [{
label: this.intl.t('clusterNew.googlegke.ipPolicyCreateSubnetwork.autoLabel'),
value: '',
}];
return [...defaultSubnetAry, ...mappedSubnets];
}), }),
secondaryIpRangeContent: computed('subNetworkContent.[]', 'config.network', function() { secondaryIpRangeContent: computed('subNetworkContent.[]', 'config.network', function() {
const subNetworkContent = get(this, 'subNetworkContent') const { subNetworkContent = [], config: { network } } = this;
const { secondaryIpRanges = [] } = subNetworkContent const subNetwork = subNetworkContent.findBy('networkDisplayName', network);
return secondaryIpRanges.map((s) => { if (subNetwork) {
return { const { secondaryIpRanges = [] } = subNetwork;
lable: `${ s.rangeName }(${ s.ipCidrRange })`,
value: s.rangeName, return secondaryIpRanges.map((s) => {
} return {
}) label: `${ s.rangeName }(${ s.ipCidrRange })`,
value: s.rangeName,
}
});
}
return [];
}), }),
serviceAccountContent: computed('serviceAccounts', function() { serviceAccountContent: computed('serviceAccounts', function() {
@ -593,6 +641,24 @@ export default Component.extend(ClusterDriver, {
return get(this, 'maintenanceWindowTimes').findBy('value', get(this, 'config.maintenanceWindow')) || { label: 'Any Time' }; return get(this, 'maintenanceWindowTimes').findBy('value', get(this, 'config.maintenanceWindow')) || { label: 'Any Time' };
}), }),
shouldAllowDisableCreateSubNetwork: computed('config.subNetwork', function() {
const {
config: { subNetwork },
secondaryIpRangeContent,
editing,
} = this;
if (isEmpty(subNetwork)) {
return true;
}
if (editing && isEmpty(secondaryIpRangeContent)) {
return true;
}
return false;
}),
fetchZones() { fetchZones() {
return get(this, 'globalStore').rawRequest({ return get(this, 'globalStore').rawRequest({
url: '/meta/gkeZones', url: '/meta/gkeZones',

171
lib/shared/addon/components/cluster-driver/driver-googlegke/template.hbs
View File

@ -315,14 +315,16 @@
selection=config.enableHorizontalPodAutoscaling selection=config.enableHorizontalPodAutoscaling
value=true value=true
disabled=editing disabled=editing
}} {{t "generic.enabled"}} }}
{{t "generic.enabled"}}
</label> </label>
<label class={{concat (if editing "text-muted") " hand"}}> <label class={{concat (if editing "text-muted") " hand"}}>
{{radio-button {{radio-button
selection=config.enableHorizontalPodAutoscaling selection=config.enableHorizontalPodAutoscaling
value=false value=false
disabled=editing disabled=editing
}} {{t "generic.disabled"}} }}
{{t "generic.disabled"}}
</label> </label>
</div> </div>
</div> </div>
@ -345,6 +347,7 @@
</div> </div>
</div> </div>
</div> </div>
<div class="row"> <div class="row">
<div class="col span-6"> <div class="col span-6">
<label class="acc-label"> <label class="acc-label">
@ -385,111 +388,85 @@
{{/if}} {{/if}}
</div> </div>
{{#advanced-section advanced=clusterAdvanced}} <div class="row">
<h4 class="mt-20 mb-10">{{t "clusterNew.googlegke.header.iPAllocationPolicy"}}</h4> <div class="col span-6">
<hr/> <label class="acc-label">
<div class="row"> {{t "clusterNew.googlegke.useIpAliases.label"}}
<div class="col span-6"> </label>
<label class="acc-label"> <div class="form-control-static">
{{t "clusterNew.googlegke.useIpAliases.label"}} <label class={{concat (if editing "text-muted") " mr-20 hand"}}>
{{radio-button
selection=config.useIpAliases
value=true
disabled=editing
}}
{{t "generic.enabled"}}
</label>
<label class={{concat (if editing "text-muted") " hand"}}>
{{radio-button
selection=config.useIpAliases
value=false
disabled=(or editing (not config.subNetwork))
}}
{{t "generic.disabled"}}
</label> </label>
<div class="form-control-static">
<label class={{concat (if editing "text-muted") " mr-20 hand"}}>
{{radio-button
selection=config.useIpAliases
value=true
disabled=editing
}}
{{t "generic.yes"}}
</label>
<label class={{concat (if editing "text-muted") " hand"}}>
{{radio-button
selection=config.useIpAliases
value=false
disabled=editing
}}
{{t "generic.no"}}
</label>
</div>
</div> </div>
{{#if config.useIpAliases}} </div>
</div>
{{#if config.useIpAliases}}
{{#if (and config.ipPolicyCreateSubnetwork config.useIpAliases)}}
<div class="row">
<div class="col span-6"> <div class="col span-6">
<label class="acc-label"> <label class="acc-label">
{{t "clusterNew.googlegke.ipPolicyCreateSubnetwork.label"}} {{t "clusterNew.googlegke.ipPolicyClusterIpv4CidrBlock.label"}}
</label> </label>
<div class="form-control-static"> {{input
<label class={{concat (if editing "text-muted") " mr-20 hand"}}> value=config.ipPolicyClusterIpv4CidrBlock
{{radio-button placeholder=(t "clusterNew.googlegke.ipPolicyClusterIpv4CidrBlock.placeholder")
selection=config.ipPolicyCreateSubnetwork disabled=editing
value=true }}
disabled=editing
}}
{{t "generic.enabled"}}
</label>
<label class={{concat (if editing "text-muted") " hand"}} class={{concat (if (eq secondaryIpRangeContent.length 0) "text-muted") " hand"}}>
{{radio-button
selection=config.ipPolicyCreateSubnetwork
value=false
disabled=(or editing (eq secondaryIpRangeContent.length 0))
}}
{{t "generic.disabled"}}
</label>
</div>
</div> </div>
{{/if}} <div class="col span-6">
</div> <label class="acc-label">
{{#if config.useIpAliases}} {{t "clusterNew.googlegke.ipPolicyServicesIpv4CidrBlock.label"}}
{{#if (and config.ipPolicyCreateSubnetwork config.useIpAliases)}} </label>
<div class="row"> {{input
<div class="col span-6"> value=config.ipPolicyServicesIpv4CidrBlock
<label class="acc-label"> placeholder=(t "clusterNew.googlegke.ipPolicyServicesIpv4CidrBlock.placeholder")
{{t "clusterNew.googlegke.ipPolicyClusterIpv4CidrBlock.label"}} disabled=editing
</label> }}
{{input
value=config.ipPolicyClusterIpv4CidrBlock
placeholder=(t "clusterNew.googlegke.ipPolicyClusterIpv4CidrBlock.placeholder")
disabled=editing
}}
</div>
<div class="col span-6">
<label class="acc-label">
{{t "clusterNew.googlegke.ipPolicyServicesIpv4CidrBlock.label"}}
</label>
{{input
value=config.ipPolicyServicesIpv4CidrBlock
placeholder=(t "clusterNew.googlegke.ipPolicyServicesIpv4CidrBlock.placeholder")
disabled=editing
}}
</div>
</div> </div>
{{else}} </div>
<div class="row"> {{else}}
<div class="col span-6"> <div class="row">
<label class="acc-label"> <div class="col span-6">
{{t "clusterNew.googlegke.ipPolicyClusterSecondaryRangeName.label"}} <label class="acc-label">
</label> {{t "clusterNew.googlegke.ipPolicyClusterSecondaryRangeName.label"}}
{{searchable-select </label>
content=secondaryIpRangeContent {{searchable-select
classNames="form-control" content=secondaryIpRangeContent
value=config.ipPolicyClusterSecondaryRangeName classNames="form-control"
disabled=editing value=config.ipPolicyClusterSecondaryRangeName
}} disabled=editing
</div> }}
<div class="col span-6">
<label class="acc-label">
{{t "clusterNew.googlegke.ipPolicyServicesSecondaryRangeName.label"}}
</label>
{{searchable-select
content=secondaryIpRangeContent
classNames="form-control"
value=config.ipPolicyServicesSecondaryRangeName
disabled=editing
}}
</div>
</div> </div>
{{/if}} <div class="col span-6">
<label class="acc-label">
{{t "clusterNew.googlegke.ipPolicyServicesSecondaryRangeName.label"}}
</label>
{{searchable-select
content=secondaryIpRangeContent
classNames="form-control"
value=config.ipPolicyServicesSecondaryRangeName
disabled=editing
}}
</div>
</div>
{{/if}} {{/if}}
{{/if}}
{{#advanced-section advanced=clusterAdvanced}}
<h4 class="mt-20 mb-10"> <h4 class="mt-20 mb-10">
{{t "clusterNew.googlegke.header.privateCluster"}} {{t "clusterNew.googlegke.header.privateCluster"}}
</h4> </h4>

3
translations/en-us.yaml
View File

@ -3620,12 +3620,13 @@ clusterNew:
label: Master IP range label: Master IP range
placeholder: e.g. 10.42.0.0/28 placeholder: e.g. 10.42.0.0/28
useIpAliases: useIpAliases:
label: Use Ip Aliases label: Ip Aliases
ipPolicySubnetworkName: ipPolicySubnetworkName:
label: Subnetwork Name label: Subnetwork Name
placeholder: Your Subnetwork Name placeholder: Your Subnetwork Name
ipPolicyCreateSubnetwork: ipPolicyCreateSubnetwork:
label: Create Subnetwork label: Create Subnetwork
autoLabel: Auto Create Subnetwork
ipPolicyClusterSecondaryRangeName: ipPolicyClusterSecondaryRangeName:
label: Cluster Secondary Range Name label: Cluster Secondary Range Name
placeholder: Your Cluster Secondary Range Name placeholder: Your Cluster Secondary Range Name