diff options
author | walkafwalka <2865898-walkafwalka@users.noreply.gitlab.com> | 2019-03-08 00:51:43 +0300 |
---|---|---|
committer | walkafwalka <2865898-walkafwalka@users.noreply.gitlab.com> | 2019-03-08 02:25:48 +0300 |
commit | 460797dec3dc143943390e86a09d6e6b45a465d8 (patch) | |
tree | a5495703f3bfd1152929c84853322cd9a6812f15 /app/assets | |
parent | 31cf53df4d766ef58d6d5be60d5fa2e380406fc8 (diff) |
Add support for ingress hostnames
Diffstat (limited to 'app/assets')
-rw-r--r-- | app/assets/javascripts/clusters/components/applications.vue | 132 | ||||
-rw-r--r-- | app/assets/javascripts/clusters/stores/clusters_store.js | 5 |
2 files changed, 66 insertions, 71 deletions
diff --git a/app/assets/javascripts/clusters/components/applications.vue b/app/assets/javascripts/clusters/components/applications.vue index f74cd71de04..13e8617c515 100644 --- a/app/assets/javascripts/clusters/components/applications.vue +++ b/app/assets/javascripts/clusters/components/applications.vue @@ -89,53 +89,26 @@ export default { ingressInstalled() { return this.applications.ingress.status === APPLICATION_STATUS.INSTALLED; }, - ingressExternalIp() { - return this.applications.ingress.externalIp; + ingressExternalEndpoint() { + return this.applications.ingress.externalIp || this.applications.ingress.externalHostname; }, certManagerInstalled() { return this.applications.cert_manager.status === APPLICATION_STATUS.INSTALLED; }, ingressDescription() { - const extraCostParagraph = sprintf( - _.escape( - s__( - `ClusterIntegration|%{boldNotice} This will add some extra resources - like a load balancer, which may incur additional costs depending on - the hosting provider your Kubernetes cluster is installed on. If you are using - Google Kubernetes Engine, you can %{pricingLink}.`, - ), - ), - { - boldNotice: `<strong>${_.escape(s__('ClusterIntegration|Note:'))}</strong>`, - pricingLink: `<a href="https://cloud.google.com/compute/pricing#lb" target="_blank" rel="noopener noreferrer"> - ${_.escape(s__('ClusterIntegration|check the pricing here'))}</a>`, - }, - false, - ); - - const externalIpParagraph = sprintf( + return sprintf( _.escape( s__( - `ClusterIntegration|After installing Ingress, you will need to point your wildcard DNS - at the generated external IP address in order to view your app after it is deployed. %{ingressHelpLink}`, + `ClusterIntegration|Installing Ingress may incur additional costs. Learn more about %{pricingLink}.`, ), ), { - ingressHelpLink: `<a href="${this.ingressHelpPath}"> - ${_.escape(s__('ClusterIntegration|More information'))} - </a>`, + pricingLink: `<strong><a href="https://cloud.google.com/compute/pricing#lb" + target="_blank" rel="noopener noreferrer"> + ${_.escape(s__('ClusterIntegration|pricing'))}</a></strong>`, }, false, ); - - return ` - <p> - ${extraCostParagraph} - </p> - <p class="settings-message append-bottom-0"> - ${externalIpParagraph} - </p> - `; }, certManagerDescription() { return sprintf( @@ -196,11 +169,26 @@ export default { knativeUpgradeFailed() { return this.knative.status === APPLICATION_STATUS.UPDATE_ERRORED; }, - knativeExternalIp() { - return this.knative.externalIp; + knativeExternalEndpoint() { + return this.knative.externalIp || this.knative.externalHostname; + }, + knativeDescription() { + return sprintf( + _.escape( + s__( + `ClusterIntegration|Installing Knative may incur additional costs. Learn more about %{pricingLink}.`, + ), + ), + { + pricingLink: `<strong><a href="https://cloud.google.com/compute/pricing#lb" + target="_blank" rel="noopener noreferrer"> + ${_.escape(s__('ClusterIntegration|pricing'))}</a></strong>`, + }, + false, + ); }, canUpdateKnativeEndpoint() { - return this.knativeExternalIp && !this.knativeUpgradeFailed && !this.knativeUpgrading; + return this.knativeExternalEndpoint && !this.knativeUpgradeFailed && !this.knativeUpgrading; }, knativeHostname: { get() { @@ -289,31 +277,31 @@ export default { <template v-if="ingressInstalled"> <div class="form-group"> - <label for="ingress-ip-address"> - {{ s__('ClusterIntegration|Ingress IP Address') }} + <label for="ingress-endpoint"> + {{ s__('ClusterIntegration|Ingress Endpoint') }} </label> - <div v-if="ingressExternalIp" class="input-group"> + <div v-if="ingressExternalEndpoint" class="input-group"> <input - id="ingress-ip-address" - :value="ingressExternalIp" + id="ingress-endpoint" + :value="ingressExternalEndpoint" type="text" - class="form-control js-ip-address" + class="form-control js-endpoint" readonly /> <span class="input-group-append"> <clipboard-button - :text="ingressExternalIp" - :title="s__('ClusterIntegration|Copy Ingress IP Address to clipboard')" + :text="ingressExternalEndpoint" + :title="s__('ClusterIntegration|Copy Ingress Endpoint to clipboard')" class="input-group-text js-clipboard-btn" /> </span> </div> - <input v-else type="text" class="form-control js-ip-address" readonly value="?" /> + <input v-else type="text" class="form-control js-endpoint" readonly value="?" /> <p class="form-text text-muted"> {{ s__(`ClusterIntegration|Point a wildcard DNS to this - generated IP address in order to access - your application after it has been deployed.`) + generated endpoint in order to access + your application after it has been deployed.`) }} <a :href="ingressDnsHelpPath" target="_blank" rel="noopener noreferrer"> {{ __('More information') }} @@ -321,19 +309,21 @@ export default { </p> </div> - <p v-if="!ingressExternalIp" class="settings-message js-no-ip-message"> + <p v-if="!ingressExternalEndpoint" class="settings-message js-no-endpoint-message"> {{ - s__(`ClusterIntegration|The IP address is in - the process of being assigned. Please check your Kubernetes - cluster or Quotas on Google Kubernetes Engine if it takes a long time.`) + s__(`ClusterIntegration|The endpoint is in + the process of being assigned. Please check your Kubernetes + cluster or Quotas on Google Kubernetes Engine if it takes a long time.`) }} - <a :href="ingressHelpPath" target="_blank" rel="noopener noreferrer"> + <a :href="ingressDnsHelpPath" target="_blank" rel="noopener noreferrer"> {{ __('More information') }} </a> </p> </template> - <div v-html="ingressDescription"></div> + <template v-if="!ingressInstalled"> + <div class="bs-callout bs-callout-info" v-html="ingressDescription"></div> + </template> </div> </application-row> <application-row @@ -443,7 +433,7 @@ export default { }} </p> - <template v-if="ingressExternalIp"> + <template v-if="ingressExternalEndpoint"> <div class="form-group"> <label for="jupyter-hostname"> {{ s__('ClusterIntegration|Jupyter Hostname') }} @@ -468,7 +458,7 @@ export default { <p v-if="ingressInstalled" class="form-text text-muted"> {{ s__(`ClusterIntegration|Replace this with your own hostname if you want. - If you do so, point hostname to Ingress IP Address from above.`) + If you do so, point hostname to Ingress IP Address from above.`) }} <a :href="ingressDnsHelpPath" target="_blank" rel="noopener noreferrer"> {{ __('More information') }} @@ -493,10 +483,10 @@ export default { > <div slot="description"> <span v-if="!rbac"> - <p v-if="!rbac" class="bs-callout bs-callout-info append-bottom-0"> + <p v-if="!rbac" class="rbac-notice bs-callout bs-callout-info append-bottom-0"> {{ s__(`ClusterIntegration|You must have an RBAC-enabled cluster - to install Knative.`) + to install Knative.`) }} <a :href="helpPath" target="_blank" rel="noopener noreferrer"> {{ __('More information') }} @@ -534,31 +524,31 @@ export default { </template> <template v-if="knativeInstalled"> <div class="form-group col-sm-12 col-md-6 pl-md-0 mb-0 mt-3 mt-md-0"> - <label for="knative-ip-address"> + <label for="knative-endpoint"> <strong> {{ s__('ClusterIntegration|Knative Endpoint:') }} </strong> </label> - <div v-if="knativeExternalIp" class="input-group"> + <div v-if="knativeExternalEndpoint" class="input-group"> <input - id="knative-ip-address" - :value="knativeExternalIp" + id="knative-endpoint" + :value="knativeExternalEndpoint" type="text" - class="form-control js-knative-ip-address" + class="form-control js-knative-endpoint" readonly /> <span class="input-group-append"> <clipboard-button - :text="knativeExternalIp" + :text="knativeExternalEndpoint" :title="s__('ClusterIntegration|Copy Knative Endpoint to clipboard')" - class="input-group-text js-knative-ip-clipboard-btn" + class="input-group-text js-knative-endpoint-clipboard-btn" /> </span> </div> <input v-else type="text" - class="form-control js-knative-ip-address" + class="form-control js-knative-endpoint" readonly value="?" /> @@ -576,13 +566,13 @@ export default { </p> <p - v-if="!knativeExternalIp" - class="settings-message js-no-knative-ip-message mt-2 mr-3 mb-0 ml-3 " + v-if="!knativeExternalEndpoint" + class="settings-message js-no-knative-endpoint-message mt-2 mr-3 mb-0 ml-3" > {{ - s__(`ClusterIntegration|The IP address is in - the process of being assigned. Please check your Kubernetes - cluster or Quotas on Google Kubernetes Engine if it takes a long time.`) + s__(`ClusterIntegration|The endpoint is in + the process of being assigned. Please check your Kubernetes + cluster or Quotas on Google Kubernetes Engine if it takes a long time.`) }} </p> diff --git a/app/assets/javascripts/clusters/stores/clusters_store.js b/app/assets/javascripts/clusters/stores/clusters_store.js index 3f03a8512fc..92993337f02 100644 --- a/app/assets/javascripts/clusters/stores/clusters_store.js +++ b/app/assets/javascripts/clusters/stores/clusters_store.js @@ -25,6 +25,7 @@ export default class ClusterStore { requestStatus: null, requestReason: null, externalIp: null, + externalHostname: null, }, cert_manager: { title: s__('ClusterIntegration|Cert-Manager'), @@ -68,6 +69,7 @@ export default class ClusterStore { hostname: null, isEditingHostName: false, externalIp: null, + externalHostname: null, }, }, }; @@ -120,6 +122,7 @@ export default class ClusterStore { if (appId === INGRESS) { this.state.applications.ingress.externalIp = serverAppEntry.external_ip; + this.state.applications.ingress.externalHostname = serverAppEntry.external_hostname; } else if (appId === CERT_MANAGER) { this.state.applications.cert_manager.email = this.state.applications.cert_manager.email || serverAppEntry.email; @@ -136,6 +139,8 @@ export default class ClusterStore { } this.state.applications.knative.externalIp = serverAppEntry.external_ip || this.state.applications.knative.externalIp; + this.state.applications.knative.externalHostname = + serverAppEntry.external_hostname || this.state.applications.knative.externalHostname; } else if (appId === RUNNER) { this.state.applications.runner.version = version; this.state.applications.runner.upgradeAvailable = upgradeAvailable; |