diff --git a/locales/en/messages.po b/locales/en/messages.po index 215c921039..afc73e2a5e 100644 --- a/locales/en/messages.po +++ b/locales/en/messages.po @@ -37,6 +37,10 @@ msgstr "(empty) (Allowing the specific traffic to all pods in this namespace)" #~ msgid "(new)" #~ msgstr "(new)" +#: src/renderer/components/+add-cluster/add-cluster.tsx:213 +#~ msgid "* Choose how to import clusters: from selected kube-config file or by manually pasting kube-config's content as a text" +#~ msgstr "* Choose how to import clusters: from selected kube-config file or by manually pasting kube-config's content as a text" + #: src/renderer/components/item-object-list/item-list-layout.tsx:224 msgid "<0>Filtered0>: {itemsCount} / {allItemsCount}" msgstr "<0>Filtered0>: {itemsCount} / {allItemsCount}" @@ -83,7 +87,7 @@ msgstr "Account Name" msgid "Active" msgstr "Active" -#: src/renderer/components/+add-cluster/add-cluster.tsx:196 +#: src/renderer/components/+add-cluster/add-cluster.tsx:225 #: src/renderer/components/cluster-manager/clusters-menu.tsx:116 msgid "Add Cluster" msgstr "Add Cluster" @@ -108,7 +112,7 @@ msgstr "Add bindings to {name}" #~ msgid "Add cluster" #~ msgstr "Add cluster" -#: src/renderer/components/+add-cluster/add-cluster.tsx:223 +#: src/renderer/components/+add-cluster/add-cluster.tsx:243 msgid "Add cluster(s)" msgstr "Add cluster(s)" @@ -315,6 +319,10 @@ msgstr "Binding targets" msgid "Bindings" msgstr "Bindings" +#: src/renderer/components/+add-cluster/add-cluster.tsx:218 +msgid "Browse" +msgstr "Browse" + #: src/renderer/components/error-boundary/error-boundary.tsx:37 #~ msgid "Build version" #~ msgstr "Build version" @@ -440,6 +448,18 @@ msgstr "Charts" #~ msgid "Checking update" #~ msgstr "Checking update" +#: src/renderer/components/+add-cluster/add-cluster.tsx:218 +#~ msgid "Choose how to import clusters: from selected kube-config file or by manually pasting kube-config's content as a text" +#~ msgstr "Choose how to import clusters: from selected kube-config file or by manually pasting kube-config's content as a text" + +#: src/renderer/components/+add-cluster/add-cluster.tsx:218 +#~ msgid "Choose how to import clusters: from selected kube-config file or from manually pasted configuration contents" +#~ msgstr "Choose how to import clusters: from selected kube-config file or from manually pasted configuration contents" + +#: src/renderer/components/+add-cluster/add-cluster.tsx:218 +#~ msgid "Choose how to import clusters: from selected kube-config file or from pasted yaml configuration" +#~ msgstr "Choose how to import clusters: from selected kube-config file or from pasted yaml configuration" + #: src/renderer/components/+storage-volumes/volume-details.tsx:68 #: src/renderer/components/+storage-volumes/volumes.tsx:43 msgid "Claim" @@ -710,9 +730,9 @@ msgstr "Currently applied filters:" msgid "Custom Resources" msgstr "Custom Resources" -#: src/renderer/components/+add-cluster/add-cluster.tsx:141 -msgid "Custom.." -msgstr "Custom.." +#: src/renderer/components/+add-cluster/add-cluster.tsx:155 +#~ msgid "Custom.." +#~ msgstr "Custom.." #: src/renderer/components/+custom-resources/certmanager.k8s.io/certificate-details.tsx:95 msgid "DNS Provider" @@ -1710,6 +1730,10 @@ msgstr "Parallelism" msgid "Parameters" msgstr "Parameters" +#: src/renderer/components/+add-cluster/add-cluster.tsx:205 +msgid "Paste as text" +msgstr "Paste as text" + #: src/renderer/components/+custom-resources/certmanager.k8s.io/issuer-details.tsx:94 #: src/renderer/components/+custom-resources/certmanager.k8s.io/issuer-details.tsx:102 #: src/renderer/components/+network-ingresses/ingress-details.tsx:42 @@ -1730,7 +1754,7 @@ msgstr "Persistent Volume Claims" msgid "Persistent Volumes" msgstr "Persistent Volumes" -#: src/renderer/components/+add-cluster/add-cluster.tsx:78 +#: src/renderer/components/+add-cluster/add-cluster.tsx:92 msgid "Please select kube-config's context" msgstr "Please select kube-config's context" @@ -1836,7 +1860,7 @@ msgstr "Provisioner" msgid "Proxy is used only for non-cluster communication." msgstr "Proxy is used only for non-cluster communication." -#: src/renderer/components/+add-cluster/add-cluster.tsx:207 +#: src/renderer/components/+add-cluster/add-cluster.tsx:231 msgid "Proxy settings" msgstr "Proxy settings" @@ -2017,6 +2041,7 @@ msgstr "Required Drop Capabilities" msgid "Required field" msgstr "Required field" +#: src/renderer/components/+add-cluster/add-cluster.tsx:217 #: src/renderer/components/item-object-list/page-filters-list.tsx:31 msgid "Reset" msgstr "Reset" @@ -2220,7 +2245,7 @@ msgstr "Secret type" msgid "Secrets" msgstr "Secrets" -#: src/renderer/components/+add-cluster/add-cluster.tsx:204 +#: src/renderer/components/+add-cluster/add-cluster.tsx:228 msgid "Select a context" msgstr "Select a context" @@ -2232,15 +2257,23 @@ msgstr "Select a quota.." #~ msgid "Select context" #~ msgstr "Select context" -#: src/renderer/components/+add-cluster/add-cluster.tsx:52 -#: src/renderer/components/+add-cluster/add-cluster.tsx:52 +#: src/renderer/components/+add-cluster/add-cluster.tsx:62 +#: src/renderer/components/+add-cluster/add-cluster.tsx:62 msgid "Select custom kube-config file" msgstr "Select custom kube-config file" +#: src/renderer/components/+add-cluster/add-cluster.tsx:212 +#~ msgid "Select file" +#~ msgstr "Select file" + #: src/renderer/components/+add-cluster/add-cluster.tsx:173 #~ msgid "Select kubeconfig" #~ msgstr "Select kubeconfig" +#: src/renderer/components/+add-cluster/add-cluster.tsx:204 +msgid "Select or drop file" +msgstr "Select or drop file" + #: src/renderer/components/+preferences/preferences.tsx:88 #~ msgid "Select repository" #~ msgstr "Select repository" @@ -2579,8 +2612,8 @@ msgstr "Upgrade version" msgid "Usage" msgstr "Usage" -#: src/renderer/components/+add-cluster/add-cluster.tsx:53 -#: src/renderer/components/+add-cluster/add-cluster.tsx:53 +#: src/renderer/components/+add-cluster/add-cluster.tsx:63 +#: src/renderer/components/+add-cluster/add-cluster.tsx:63 msgid "Use configuration" msgstr "Use configuration" diff --git a/locales/fi/messages.po b/locales/fi/messages.po index c137ed90a7..74cd7e5c97 100644 --- a/locales/fi/messages.po +++ b/locales/fi/messages.po @@ -37,6 +37,10 @@ msgstr "" #~ msgid "(new)" #~ msgstr "" +#: src/renderer/components/+add-cluster/add-cluster.tsx:213 +#~ msgid "* Choose how to import clusters: from selected kube-config file or by manually pasting kube-config's content as a text" +#~ msgstr "" + #: src/renderer/components/item-object-list/item-list-layout.tsx:224 msgid "<0>Filtered0>: {itemsCount} / {allItemsCount}" msgstr "" @@ -83,7 +87,7 @@ msgstr "" msgid "Active" msgstr "" -#: src/renderer/components/+add-cluster/add-cluster.tsx:196 +#: src/renderer/components/+add-cluster/add-cluster.tsx:225 #: src/renderer/components/cluster-manager/clusters-menu.tsx:116 msgid "Add Cluster" msgstr "" @@ -108,7 +112,7 @@ msgstr "" #~ msgid "Add cluster" #~ msgstr "" -#: src/renderer/components/+add-cluster/add-cluster.tsx:223 +#: src/renderer/components/+add-cluster/add-cluster.tsx:243 msgid "Add cluster(s)" msgstr "" @@ -315,6 +319,10 @@ msgstr "" msgid "Bindings" msgstr "" +#: src/renderer/components/+add-cluster/add-cluster.tsx:218 +msgid "Browse" +msgstr "" + #: src/renderer/components/error-boundary/error-boundary.tsx:37 #~ msgid "Build version" #~ msgstr "" @@ -436,6 +444,18 @@ msgstr "" msgid "Charts" msgstr "" +#: src/renderer/components/+add-cluster/add-cluster.tsx:218 +#~ msgid "Choose how to import clusters: from selected kube-config file or by manually pasting kube-config's content as a text" +#~ msgstr "" + +#: src/renderer/components/+add-cluster/add-cluster.tsx:218 +#~ msgid "Choose how to import clusters: from selected kube-config file or from manually pasted configuration contents" +#~ msgstr "" + +#: src/renderer/components/+add-cluster/add-cluster.tsx:218 +#~ msgid "Choose how to import clusters: from selected kube-config file or from pasted yaml configuration" +#~ msgstr "" + #: src/renderer/components/+storage-volumes/volume-details.tsx:68 #: src/renderer/components/+storage-volumes/volumes.tsx:43 msgid "Claim" @@ -706,9 +726,9 @@ msgstr "" msgid "Custom Resources" msgstr "" -#: src/renderer/components/+add-cluster/add-cluster.tsx:141 -msgid "Custom.." -msgstr "" +#: src/renderer/components/+add-cluster/add-cluster.tsx:155 +#~ msgid "Custom.." +#~ msgstr "" #: src/renderer/components/+custom-resources/certmanager.k8s.io/certificate-details.tsx:95 msgid "DNS Provider" @@ -1693,6 +1713,10 @@ msgstr "" msgid "Parameters" msgstr "" +#: src/renderer/components/+add-cluster/add-cluster.tsx:205 +msgid "Paste as text" +msgstr "" + #: src/renderer/components/+custom-resources/certmanager.k8s.io/issuer-details.tsx:94 #: src/renderer/components/+custom-resources/certmanager.k8s.io/issuer-details.tsx:102 #: src/renderer/components/+network-ingresses/ingress-details.tsx:42 @@ -1713,7 +1737,7 @@ msgstr "" msgid "Persistent Volumes" msgstr "" -#: src/renderer/components/+add-cluster/add-cluster.tsx:78 +#: src/renderer/components/+add-cluster/add-cluster.tsx:92 msgid "Please select kube-config's context" msgstr "" @@ -1819,7 +1843,7 @@ msgstr "" msgid "Proxy is used only for non-cluster communication." msgstr "" -#: src/renderer/components/+add-cluster/add-cluster.tsx:207 +#: src/renderer/components/+add-cluster/add-cluster.tsx:231 msgid "Proxy settings" msgstr "" @@ -2000,6 +2024,7 @@ msgstr "" msgid "Required field" msgstr "" +#: src/renderer/components/+add-cluster/add-cluster.tsx:217 #: src/renderer/components/item-object-list/page-filters-list.tsx:31 msgid "Reset" msgstr "" @@ -2203,7 +2228,7 @@ msgstr "" msgid "Secrets" msgstr "" -#: src/renderer/components/+add-cluster/add-cluster.tsx:204 +#: src/renderer/components/+add-cluster/add-cluster.tsx:228 msgid "Select a context" msgstr "" @@ -2215,15 +2240,23 @@ msgstr "" #~ msgid "Select context" #~ msgstr "" -#: src/renderer/components/+add-cluster/add-cluster.tsx:52 -#: src/renderer/components/+add-cluster/add-cluster.tsx:52 +#: src/renderer/components/+add-cluster/add-cluster.tsx:62 +#: src/renderer/components/+add-cluster/add-cluster.tsx:62 msgid "Select custom kube-config file" msgstr "" +#: src/renderer/components/+add-cluster/add-cluster.tsx:212 +#~ msgid "Select file" +#~ msgstr "" + #: src/renderer/components/+add-cluster/add-cluster.tsx:173 #~ msgid "Select kubeconfig" #~ msgstr "" +#: src/renderer/components/+add-cluster/add-cluster.tsx:204 +msgid "Select or drop file" +msgstr "" + #: src/renderer/components/+preferences/preferences.tsx:88 #~ msgid "Select repository" #~ msgstr "" @@ -2562,8 +2595,8 @@ msgstr "" msgid "Usage" msgstr "" -#: src/renderer/components/+add-cluster/add-cluster.tsx:53 -#: src/renderer/components/+add-cluster/add-cluster.tsx:53 +#: src/renderer/components/+add-cluster/add-cluster.tsx:63 +#: src/renderer/components/+add-cluster/add-cluster.tsx:63 msgid "Use configuration" msgstr "" diff --git a/locales/ru/messages.po b/locales/ru/messages.po index 4d61241cae..3626756376 100644 --- a/locales/ru/messages.po +++ b/locales/ru/messages.po @@ -38,6 +38,10 @@ msgstr "(Пусто) (Допускается трафик ко всем пода #~ msgid "(new)" #~ msgstr "" +#: src/renderer/components/+add-cluster/add-cluster.tsx:213 +#~ msgid "* Choose how to import clusters: from selected kube-config file or by manually pasting kube-config's content as a text" +#~ msgstr "" + #: src/renderer/components/item-object-list/item-list-layout.tsx:224 msgid "<0>Filtered0>: {itemsCount} / {allItemsCount}" msgstr "<0>Отфильтровано0>: {itemsCount} / {allItemsCount}" @@ -84,7 +88,7 @@ msgstr "Название аккаунта" msgid "Active" msgstr "Активный" -#: src/renderer/components/+add-cluster/add-cluster.tsx:196 +#: src/renderer/components/+add-cluster/add-cluster.tsx:225 #: src/renderer/components/cluster-manager/clusters-menu.tsx:116 msgid "Add Cluster" msgstr "" @@ -109,7 +113,7 @@ msgstr "Добавить привязки к {name}" #~ msgid "Add cluster" #~ msgstr "" -#: src/renderer/components/+add-cluster/add-cluster.tsx:223 +#: src/renderer/components/+add-cluster/add-cluster.tsx:243 msgid "Add cluster(s)" msgstr "" @@ -316,6 +320,10 @@ msgstr "Цели привязки" msgid "Bindings" msgstr "Привязки" +#: src/renderer/components/+add-cluster/add-cluster.tsx:218 +msgid "Browse" +msgstr "" + #: src/renderer/components/error-boundary/error-boundary.tsx:37 #~ msgid "Build version" #~ msgstr "Версия билда" @@ -441,6 +449,18 @@ msgstr "Чарты" #~ msgid "Checking update" #~ msgstr "Проверка обновлений" +#: src/renderer/components/+add-cluster/add-cluster.tsx:218 +#~ msgid "Choose how to import clusters: from selected kube-config file or by manually pasting kube-config's content as a text" +#~ msgstr "" + +#: src/renderer/components/+add-cluster/add-cluster.tsx:218 +#~ msgid "Choose how to import clusters: from selected kube-config file or from manually pasted configuration contents" +#~ msgstr "" + +#: src/renderer/components/+add-cluster/add-cluster.tsx:218 +#~ msgid "Choose how to import clusters: from selected kube-config file or from pasted yaml configuration" +#~ msgstr "" + #: src/renderer/components/+storage-volumes/volume-details.tsx:68 #: src/renderer/components/+storage-volumes/volumes.tsx:43 msgid "Claim" @@ -711,9 +731,9 @@ msgstr "Текущие фильтры:" msgid "Custom Resources" msgstr "" -#: src/renderer/components/+add-cluster/add-cluster.tsx:141 -msgid "Custom.." -msgstr "" +#: src/renderer/components/+add-cluster/add-cluster.tsx:155 +#~ msgid "Custom.." +#~ msgstr "" #: src/renderer/components/+custom-resources/certmanager.k8s.io/certificate-details.tsx:95 msgid "DNS Provider" @@ -1711,6 +1731,10 @@ msgstr "Параллелизм" msgid "Parameters" msgstr "Параметры" +#: src/renderer/components/+add-cluster/add-cluster.tsx:205 +msgid "Paste as text" +msgstr "" + #: src/renderer/components/+custom-resources/certmanager.k8s.io/issuer-details.tsx:94 #: src/renderer/components/+custom-resources/certmanager.k8s.io/issuer-details.tsx:102 #: src/renderer/components/+network-ingresses/ingress-details.tsx:42 @@ -1731,7 +1755,7 @@ msgstr "Persistent Volume Claims" msgid "Persistent Volumes" msgstr "Persistent Volumes" -#: src/renderer/components/+add-cluster/add-cluster.tsx:78 +#: src/renderer/components/+add-cluster/add-cluster.tsx:92 msgid "Please select kube-config's context" msgstr "" @@ -1837,7 +1861,7 @@ msgstr "Комиссия" msgid "Proxy is used only for non-cluster communication." msgstr "" -#: src/renderer/components/+add-cluster/add-cluster.tsx:207 +#: src/renderer/components/+add-cluster/add-cluster.tsx:231 msgid "Proxy settings" msgstr "" @@ -2018,6 +2042,7 @@ msgstr "" msgid "Required field" msgstr "Обязательное поле" +#: src/renderer/components/+add-cluster/add-cluster.tsx:217 #: src/renderer/components/item-object-list/page-filters-list.tsx:31 msgid "Reset" msgstr "Сбросить" @@ -2221,7 +2246,7 @@ msgstr "Тип секрета" msgid "Secrets" msgstr "Secrets" -#: src/renderer/components/+add-cluster/add-cluster.tsx:204 +#: src/renderer/components/+add-cluster/add-cluster.tsx:228 msgid "Select a context" msgstr "" @@ -2233,15 +2258,23 @@ msgstr "Выберите квоту..." #~ msgid "Select context" #~ msgstr "" -#: src/renderer/components/+add-cluster/add-cluster.tsx:52 -#: src/renderer/components/+add-cluster/add-cluster.tsx:52 +#: src/renderer/components/+add-cluster/add-cluster.tsx:62 +#: src/renderer/components/+add-cluster/add-cluster.tsx:62 msgid "Select custom kube-config file" msgstr "" +#: src/renderer/components/+add-cluster/add-cluster.tsx:212 +#~ msgid "Select file" +#~ msgstr "" + #: src/renderer/components/+add-cluster/add-cluster.tsx:173 #~ msgid "Select kubeconfig" #~ msgstr "" +#: src/renderer/components/+add-cluster/add-cluster.tsx:204 +msgid "Select or drop file" +msgstr "" + #: src/renderer/components/+preferences/preferences.tsx:88 #~ msgid "Select repository" #~ msgstr "" @@ -2580,8 +2613,8 @@ msgstr "Обновить версию" msgid "Usage" msgstr "Использование" -#: src/renderer/components/+add-cluster/add-cluster.tsx:53 -#: src/renderer/components/+add-cluster/add-cluster.tsx:53 +#: src/renderer/components/+add-cluster/add-cluster.tsx:63 +#: src/renderer/components/+add-cluster/add-cluster.tsx:63 msgid "Use configuration" msgstr "" diff --git a/src/renderer/components/+add-cluster/add-cluster.scss b/src/renderer/components/+add-cluster/add-cluster.scss index 2716d22911..fe45375fa1 100644 --- a/src/renderer/components/+add-cluster/add-cluster.scss +++ b/src/renderer/components/+add-cluster/add-cluster.scss @@ -10,31 +10,18 @@ } .kube-config-select { - border: 1px solid $borderFaintColor; - padding: $padding / 2 $padding; - border-radius: $radius; - transition: border 200ms ease-in-out; + &.droppable { + box-shadow: 0 0 3px 2px $primary; - &.droppable, - &:hover { - border-color: $primary; - cursor: pointer; - } - - > * { - pointer-events: none; - } - - > .title { - white-space: nowrap; - } - - code { - word-break: break-all; + > * { + pointer-events: none; + } } } - code { - color: $pink-400; + .info-col { + code { + color: $pink-400; + } } } diff --git a/src/renderer/components/+add-cluster/add-cluster.tsx b/src/renderer/components/+add-cluster/add-cluster.tsx index 50c1330186..f215890607 100644 --- a/src/renderer/components/+add-cluster/add-cluster.tsx +++ b/src/renderer/components/+add-cluster/add-cluster.tsx @@ -21,14 +21,24 @@ import { userStore } from "../../../common/user-store"; import { clusterViewURL } from "../cluster-manager/cluster-view.route"; import { cssNames } from "../../utils"; import { Notifications } from "../notifications"; +import { Tab, Tabs } from "../tabs"; + +// todo: improve UI/UX kube-config consuming: FILE (input + button) | PASTE TEXT (editor) +// todo: allow to manually input kube-config file path +// todo: allow to create multiple clusters at once (multi-select) + +enum KubeConfigSourceTab { + FILE = "file", + TEXT = "text" +} @observer export class AddCluster extends React.Component { - readonly custom: any = "custom" @observable.ref localKubeConfig: KubeConfig; @observable.ref newClusterConfig: KubeConfig; @observable.ref error: React.ReactNode; + @observable sourceTab = KubeConfigSourceTab.FILE; @observable isWaiting = false @observable showSettings = false @observable dropAreaActive = false; @@ -74,8 +84,8 @@ export class AddCluster extends React.Component { } } - @computed get isCustom() { - return this.newClusterConfig === this.custom; + resetKubeConfig = () => { + this.kubeConfigPath = kubeConfigDefaultPath; } @computed get clusterOptions() { @@ -92,10 +102,6 @@ export class AddCluster extends React.Component { } }) } - options.push({ - label: Custom.., - value: this.custom, - }); return options; } @@ -113,13 +119,14 @@ export class AddCluster extends React.Component { return label; }; + // fixme: support adding multiple clusters addCluster = async () => { const { newClusterConfig, customConfig, proxyServer } = this; const clusterId = uuid(); this.isWaiting = true this.error = "" try { - const config = this.isCustom ? loadConfig(customConfig) : newClusterConfig; + const config = this.sourceTab == KubeConfigSourceTab.TEXT ? loadConfig(customConfig) : newClusterConfig; if (!config) { this.error = Please select kube-config's context return; @@ -194,16 +201,25 @@ export class AddCluster extends React.Component { ) } - render() { + renderKubeConfigSource() { return ( - - Add Cluster - - + this.sourceTab = v}> + Select or drop file} + active={this.sourceTab == KubeConfigSourceTab.FILE}/> + Paste as text} + active={this.sourceTab == KubeConfigSourceTab.TEXT} + /> + + {this.sourceTab === KubeConfigSourceTab.FILE && ( + this.dropAreaActive = true} onDragLeave={event => this.dropAreaActive = false} onDragOver={event => { @@ -215,24 +231,44 @@ export class AddCluster extends React.Component { this.kubeConfigPath = event.dataTransfer.files[0].path; }} > - Kubeconfig file - {this.kubeConfigPath} - - {this.kubeConfigPath !== kubeConfigDefaultPath && ( - this.kubeConfigPath = kubeConfigDefaultPath} - tooltip="Reset to defaults" + console.log('change', value)} /> - )} - + {this.kubeConfigPath !== kubeConfigDefaultPath && ( + Reset} onClick={this.resetKubeConfig}/> + )} + Browse} onClick={this.selectKubeConfig}/> + + )} + {this.sourceTab === KubeConfigSourceTab.TEXT && ( + this.customConfig = value} + /> + )} + > + ) + } + + render() { + return ( + + Add Cluster + {this.renderKubeConfigSource()} Select a context} value={this.newClusterConfig} options={this.clusterOptions} onChange={({ value }: SelectOption) => this.newClusterConfig = value} formatOptionLabel={this.formatClusterContextLabel} - id="kubecontext-select" /> this.showSettings = !this.showSettings}> @@ -253,18 +289,6 @@ export class AddCluster extends React.Component { )} - {this.isCustom && ( - - Kubeconfig: - this.customConfig = value} - /> - - )} {this.error && ( {this.error} )} diff --git a/src/renderer/components/input/input.tsx b/src/renderer/components/input/input.tsx index a8fd532dde..1edabbee48 100644 --- a/src/renderer/components/input/input.tsx +++ b/src/renderer/components/input/input.tsx @@ -17,6 +17,7 @@ export type InputProps = Omit { const result = validator.validate(value, this.props); if (isBoolean(result) && !result) { errors.push(this.getValidatorError(value, validator)); - } - else if (result instanceof Promise) { + } else if (result instanceof Promise) { if (!validationId) { this.validationId = validationId = uniqueId("validation_id_"); } @@ -176,8 +176,9 @@ export class Input extends React.Component { @autobind() onFocus(evt: React.FocusEvent) { - const { onFocus } = this.props; + const { onFocus, autoSelectOnFocus } = this.props; if (onFocus) onFocus(evt); + if (autoSelectOnFocus) this.select(); this.setState({ focused: true }); } @@ -255,13 +256,14 @@ export class Input extends React.Component { } render() { - /* eslint-disable */ - let { multiLine, showValidationLine, validators, theme, maxRows, children, iconLeft, iconRight, ...inputProps } = this.props; - let { className, maxLength, rows, disabled, } = this.props; - /* eslint-enable */ + const { + multiLine, showValidationLine, validators, theme, maxRows, children, + maxLength, rows, disabled, autoSelectOnFocus, + ...inputProps + } = this.props; const { focused, dirty, valid, validating, errors } = this.state; - className = cssNames("Input", className, { + const className = cssNames("Input", this.props.className, { [`theme ${theme}`]: theme, focused: focused, disabled: disabled, @@ -272,6 +274,7 @@ export class Input extends React.Component { }); // normalize icons + let { iconLeft, iconRight } = this.props; if (isString(iconLeft)) iconLeft = if (isString(iconRight)) iconRight = diff --git a/src/renderer/components/layout/main-layout.scss b/src/renderer/components/layout/main-layout.scss index e9980bb3fb..5b9361978b 100755 --- a/src/renderer/components/layout/main-layout.scss +++ b/src/renderer/components/layout/main-layout.scss @@ -11,10 +11,6 @@ > .Tabs { grid-area: tabs; background: $layoutTabsBackground; - - .Tab { - --color-active: #{$layoutTabsActiveColor}; - } } header { diff --git a/src/renderer/components/tabs/tabs.scss b/src/renderer/components/tabs/tabs.scss index 6273dc7a20..1d7d5e94b9 100644 --- a/src/renderer/components/tabs/tabs.scss +++ b/src/renderer/components/tabs/tabs.scss @@ -4,6 +4,10 @@ -webkit-user-select: none; /* safari */ -moz-user-select: none; /* firefox */ + &.withBorder { + border-bottom: 1px solid $borderFaintColor; + } + &.wrap { flex-wrap: wrap; } @@ -24,7 +28,7 @@ } .Tab { - --color-active: inherit; + --color-active: #{$layoutTabsActiveColor}; --line-color-active: #{$primary}; --line-color-focus: currentColor; diff --git a/src/renderer/components/tabs/tabs.tsx b/src/renderer/components/tabs/tabs.tsx index 5ae1fc1ec2..e81322de1b 100644 --- a/src/renderer/components/tabs/tabs.tsx +++ b/src/renderer/components/tabs/tabs.tsx @@ -7,6 +7,7 @@ const TabsContext = React.createContext({}); interface TabsContextValue { autoFocus?: boolean; + withBorder?: boolean; value?: D; onChange?(value: D): void; } @@ -29,16 +30,12 @@ export class Tabs extends React.PureComponent { } render() { - const { - center, wrap, onChange, value, autoFocus, - scrollable = true, - ...elemProps - } = this.props; - let { className } = this.props; - className = cssNames("Tabs", className, { - "center": center, - "wrap": wrap, - "scrollable": scrollable, + const { center, wrap, onChange, value, autoFocus, scrollable = true, withBorder, ...elemProps } = this.props; + const className = cssNames("Tabs", this.props.className, { + center: center, + wrap: wrap, + scrollable: scrollable, + withBorder: withBorder, }); return (
{this.kubeConfigPath}
Kubeconfig: