Skip to content

Commit 0511d3f

Browse files
spadgettspadgett
committed
Use label-editor for PVC labels
Fixes a problem where the regex used for validating label names is wrong. Names with a `/` were incorrectly blocked.
1 parent afbed7d commit 0511d3f

File tree

4 files changed

+52
-46
lines changed

4 files changed

+52
-46
lines changed

‎app/scripts/directives/oscPersistentVolumeClaim.js

Lines changed: 15 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -45,6 +45,21 @@ angular.module("openshiftConsole")
4545
}];
4646
scope.claim.selectedLabels = [];
4747

48+
var previousLabels = [];
49+
scope.$watch('useLabels', function(useLabels, previousValue) {
50+
if (useLabels === previousValue) {
51+
return;
52+
}
53+
54+
// Prefill the previous values if the checkbox was unchecked and checked again.
55+
if (useLabels) {
56+
scope.claim.selectedLabels = previousLabels;
57+
} else {
58+
previousLabels = scope.claim.selectedLabels;
59+
scope.claim.selectedLabels = [];
60+
}
61+
});
62+
4863
scope.groupUnits = function(unit) {
4964
switch (unit.value) {
5065
case 'Mi':

‎app/views/directives/osc-persistent-volume-claim.html

Lines changed: 17 additions & 25 deletions
Original file line numberDiff line numberDiff line change
@@ -58,7 +58,7 @@
5858
<!-- Name -->
5959
<div class="form-group">
6060
<label for="claim-name" class="required">Name</label>
61-
<span ng-class="{ 'has-error': persistentVolumeClaimForm.name.$invalid && persistentVolumeClaimForm.name.$touched && !claimDisabled }">
61+
<span ng-class="{ 'has-error': persistentVolumeClaimForm.name.$invalid && persistentVolumeClaimForm.name.$dirty && !claimDisabled }">
6262
<input
6363
id="claim-name"
6464
class="form-control"
@@ -79,7 +79,7 @@
7979
<div>
8080
<span id="claim-name-help" class="help-block">A unique name for the storage claim within the project.</span>
8181
</div>
82-
<div class="has-error" ng-show="persistentVolumeClaimForm.name.$error.required && persistentVolumeClaimForm.name.$touched && !claimDisabled">
82+
<div class="has-error" ng-show="persistentVolumeClaimForm.name.$error.required && persistentVolumeClaimForm.name.$dirty && !claimDisabled">
8383
<span class="help-block">
8484
Name is required.
8585
</span>
@@ -201,30 +201,22 @@
201201
</div>
202202
</fieldset>
203203
</div>
204-
<!--advanced options-->
205-
<div ng-show="!showAdvancedOptions" class="mar-bottom-xl">
206-
Use
207-
<a href="" ng-click="showAdvancedOptions = true">label selectors</a>
208-
to request storage.
204+
<div class="checkbox">
205+
<label>
206+
<input type="checkbox" ng-model="useLabels">
207+
Use label selectors to request storage
208+
</label>
209+
<div class="help-block learn-more-block mar-bottom-xl">
210+
<a ng-href="{{'selector_label' | helpLink}}" target="_blank">Learn More&nbsp;<i class="fa fa-external-link" aria-hidden="true"></i></a>
211+
</div>
209212
</div>
210-
211-
<div ng-show="showAdvancedOptions" class="form-group">
212-
<fieldset class="compute-resource">
213-
<label>Label Selector</label>
214-
<div class="help-block mar-bottom-lg">
215-
Enter a label and value to use for your storage.
216-
<div class="learn-more-block">
217-
<a ng-href="{{'selector_label' | helpLink}}" target="_blank">Learn More&nbsp;<i class="fa fa-external-link" aria-hidden="true"></i></a>
218-
</div>
219-
</div>
220-
<key-value-editor
221-
entries="claim.selectedLabels"
222-
key-placeholder="label"
223-
value-placeholder="value"
224-
key-validator="[a-zA-Z][a-zA-Z0-9_-]*"
225-
key-validator-error-tooltip="A valid label name is an alphanumeric (a-z and 0-9) string beginning with a letter that may contain underscores and dashes."
226-
add-row-link="Add Label"></key-value-editor>
227-
</fieldset>
213+
<div ng-show="useLabels" class="form-group osc-form">
214+
<label-editor
215+
labels="claim.selectedLabels"
216+
expand="true"
217+
can-toggle="false"
218+
help-text="Enter a label and value to use for your storage.">
219+
</label-editor>
228220
</div>
229221
</fieldset>
230222
</ng-form>

‎dist/scripts/scripts.js

Lines changed: 9 additions & 5 deletions
Original file line numberDiff line numberDiff line change
@@ -10037,7 +10037,11 @@ label: "GB"
1003710037
}, {
1003810038
value: "T",
1003910039
label: "TB"
10040-
} ], i.claim.selectedLabels = [], i.groupUnits = function(e) {
10040+
} ], i.claim.selectedLabels = [];
10041+
var l = [];
10042+
i.$watch("useLabels", function(e, t) {
10043+
e !== t && (e ? i.claim.selectedLabels = l : (l = i.claim.selectedLabels, i.claim.selectedLabels = []));
10044+
}), i.groupUnits = function(e) {
1004110045
switch (e.value) {
1004210046
case "Mi":
1004310047
case "Gi":
@@ -10053,10 +10057,10 @@ return "";
1005310057
}, i.showComputeUnitsHelp = function() {
1005410058
r.showComputeUnitsHelp();
1005510059
};
10056-
var l = function() {
10060+
var u = function() {
1005710061
var e = i.claim.amount && c(i.claim.amount + i.claim.unit), t = _.has(i, "limits.min") && c(i.limits.min), n = _.has(i, "limits.max") && c(i.limits.max), a = !0, r = !0;
1005810062
e && t && (a = e >= t), e && n && (r = e <= n), i.persistentVolumeClaimForm.capacity.$setValidity("limitRangeMin", a), i.persistentVolumeClaimForm.capacity.$setValidity("limitRangeMax", r);
10059-
}, u = function() {
10063+
}, d = function() {
1006010064
var e = a.isAnyStorageQuotaExceeded(i.quotas, i.clusterQuotas), t = a.willRequestExceedQuota(i.quotas, i.clusterQuotas, "requests.storage", i.claim.amount + i.claim.unit);
1006110065
i.persistentVolumeClaimForm.capacity.$setValidity("willExceedStorage", !t), i.persistentVolumeClaimForm.capacity.$setValidity("outOfClaims", !e);
1006210066
};
@@ -10092,12 +10096,12 @@ var t = e.by("metadata.name");
1009210096
if (!_.isEmpty(t)) {
1009310097
i.limits = n.getEffectiveLimitRange(t, "storage", "PersistentVolumeClaim");
1009410098
var a;
10095-
i.limits.min && i.limits.max && c(i.limits.min) === c(i.limits.max) && (a = s(i.limits.max), i.claim.amount = Number(a[0]), i.claim.unit = a[1], i.capacityReadOnly = !0), i.$watchGroup([ "claim.amount", "claim.unit" ], l);
10099+
i.limits.min && i.limits.max && c(i.limits.min) === c(i.limits.max) && (a = s(i.limits.max), i.claim.amount = Number(a[0]), i.claim.unit = a[1], i.capacityReadOnly = !0), i.$watchGroup([ "claim.amount", "claim.unit" ], u);
1009610100
}
1009710101
}), t.list("resourcequotas", {
1009810102
namespace: i.projectName
1009910103
}, function(e) {
10100-
i.quotas = e.by("metadata.name"), i.$watchGroup([ "claim.amount", "claim.unit" ], u);
10104+
i.quotas = e.by("metadata.name"), i.$watchGroup([ "claim.amount", "claim.unit" ], d);
1010110105
}), t.list("appliedclusterresourcequotas", {
1010210106
namespace: i.projectName
1010310107
}, function(e) {

‎dist/scripts/templates.js

Lines changed: 11 additions & 16 deletions
Original file line numberDiff line numberDiff line change
@@ -8187,13 +8187,13 @@ angular.module('openshiftConsoleTemplates', []).run(['$templateCache', function(
81878187
"\n" +
81888188
"<div class=\"form-group\">\n" +
81898189
"<label for=\"claim-name\" class=\"required\">Name</label>\n" +
8190-
"<span ng-class=\"{ 'has-error': persistentVolumeClaimForm.name.$invalid && persistentVolumeClaimForm.name.$touched && !claimDisabled }\">\n" +
8190+
"<span ng-class=\"{ 'has-error': persistentVolumeClaimForm.name.$invalid && persistentVolumeClaimForm.name.$dirty && !claimDisabled }\">\n" +
81918191
"<input id=\"claim-name\" class=\"form-control\" type=\"text\" name=\"name\" ng-model=\"claim.name\" ng-required=\"true\" ng-pattern=\"nameValidation.pattern\" ng-maxlength=\"nameValidation.maxlength\" placeholder=\"my-storage-claim\" take-focus select-on-focus autocorrect=\"off\" autocapitalize=\"none\" spellcheck=\"false\" aria-describedby=\"claim-name-help\">\n" +
81928192
"</span>\n" +
81938193
"<div>\n" +
81948194
"<span id=\"claim-name-help\" class=\"help-block\">A unique name for the storage claim within the project.</span>\n" +
81958195
"</div>\n" +
8196-
"<div class=\"has-error\" ng-show=\"persistentVolumeClaimForm.name.$error.required && persistentVolumeClaimForm.name.$touched && !claimDisabled\">\n" +
8196+
"<div class=\"has-error\" ng-show=\"persistentVolumeClaimForm.name.$error.required && persistentVolumeClaimForm.name.$dirty && !claimDisabled\">\n" +
81978197
"<span class=\"help-block\">\n" +
81988198
"Name is required.\n" +
81998199
"</span>\n" +
@@ -8304,23 +8304,18 @@ angular.module('openshiftConsoleTemplates', []).run(['$templateCache', function(
83048304
"</div>\n" +
83058305
"</fieldset>\n" +
83068306
"</div>\n" +
8307-
"\n" +
8308-
"<div ng-show=\"!showAdvancedOptions\" class=\"mar-bottom-xl\">\n" +
8309-
"Use\n" +
8310-
"<a href=\"\" ng-click=\"showAdvancedOptions = true\">label selectors</a>\n" +
8311-
"to request storage.\n" +
8312-
"</div>\n" +
8313-
"<div ng-show=\"showAdvancedOptions\" class=\"form-group\">\n" +
8314-
"<fieldset class=\"compute-resource\">\n" +
8315-
"<label>Label Selector</label>\n" +
8316-
"<div class=\"help-block mar-bottom-lg\">\n" +
8317-
"Enter a label and value to use for your storage.\n" +
8318-
"<div class=\"learn-more-block\">\n" +
8307+
"<div class=\"checkbox\">\n" +
8308+
"<label>\n" +
8309+
"<input type=\"checkbox\" ng-model=\"useLabels\">\n" +
8310+
"Use label selectors to request storage\n" +
8311+
"</label>\n" +
8312+
"<div class=\"help-block learn-more-block mar-bottom-xl\">\n" +
83198313
"<a ng-href=\"{{'selector_label' | helpLink}}\" target=\"_blank\">Learn More&nbsp;<i class=\"fa fa-external-link\" aria-hidden=\"true\"></i></a>\n" +
83208314
"</div>\n" +
83218315
"</div>\n" +
8322-
"<key-value-editor entries=\"claim.selectedLabels\" key-placeholder=\"label\" value-placeholder=\"value\" key-validator=\"[a-zA-Z][a-zA-Z0-9_-]*\" key-validator-error-tooltip=\"A valid label name is an alphanumeric (a-z and 0-9) string beginning with a letter that may contain underscores and dashes.\" add-row-link=\"Add Label\"></key-value-editor>\n" +
8323-
"</fieldset>\n" +
8316+
"<div ng-show=\"useLabels\" class=\"form-group osc-form\">\n" +
8317+
"<label-editor labels=\"claim.selectedLabels\" expand=\"true\" can-toggle=\"false\" help-text=\"Enter a label and value to use for your storage.\">\n" +
8318+
"</label-editor>\n" +
83248319
"</div>\n" +
83258320
"</fieldset>\n" +
83268321
"</ng-form>"

0 commit comments

Comments
 (0)