mirror of
https://github.com/scm-manager/scm-manager.git
synced 2025-11-07 14:05:44 +01:00
scm-ui: new repository layout
This commit is contained in:
Sebastian Sdorra
@@ -0,0 +1,53 @@
|
||||
// @flow
|
||||
import React from "react";
|
||||
import { translate } from "react-i18next";
|
||||
import { Checkbox, InputField, Subtitle } from "@scm-manager/ui-components";
|
||||
|
||||
type Props = {
|
||||
baseUrl: string,
|
||||
forceBaseUrl: boolean,
|
||||
t: string => string,
|
||||
onChange: (boolean, any, string) => void,
|
||||
hasUpdatePermission: boolean
|
||||
};
|
||||
|
||||
class BaseUrlSettings extends React.Component<Props> {
|
||||
render() {
|
||||
const { t, baseUrl, forceBaseUrl, hasUpdatePermission } = this.props;
|
||||
|
||||
return (
|
||||
<div>
|
||||
<Subtitle subtitle={t("base-url-settings.name")} />
|
||||
<div className="columns">
|
||||
<div className="column is-half">
|
||||
<InputField
|
||||
label={t("base-url-settings.base-url")}
|
||||
onChange={this.handleBaseUrlChange}
|
||||
value={baseUrl}
|
||||
disabled={!hasUpdatePermission}
|
||||
helpText={t("help.baseUrlHelpText")}
|
||||
/>
|
||||
</div>
|
||||
<div className="column is-half">
|
||||
<Checkbox
|
||||
checked={forceBaseUrl}
|
||||
label={t("base-url-settings.force-base-url")}
|
||||
onChange={this.handleForceBaseUrlChange}
|
||||
disabled={!hasUpdatePermission}
|
||||
helpText={t("help.forceBaseUrlHelpText")}
|
||||
/>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
);
|
||||
}
|
||||
|
||||
handleBaseUrlChange = (value: string) => {
|
||||
this.props.onChange(true, value, "baseUrl");
|
||||
};
|
||||
handleForceBaseUrlChange = (value: boolean) => {
|
||||
this.props.onChange(true, value, "forceBaseUrl");
|
||||
};
|
||||
}
|
||||
|
||||
export default translate("config")(BaseUrlSettings);
|
||||
209
scm-ui/ui-webapp/src/admin/components/form/ConfigForm.js
Normal file
209
scm-ui/ui-webapp/src/admin/components/form/ConfigForm.js
Normal file
@@ -0,0 +1,209 @@
|
||||
// @flow
|
||||
import React from "react";
|
||||
import { translate } from "react-i18next";
|
||||
import { SubmitButton, Notification } from "@scm-manager/ui-components";
|
||||
import type { NamespaceStrategies, Config } from "@scm-manager/ui-types";
|
||||
import ProxySettings from "./ProxySettings";
|
||||
import GeneralSettings from "./GeneralSettings";
|
||||
import BaseUrlSettings from "./BaseUrlSettings";
|
||||
import LoginAttempt from "./LoginAttempt";
|
||||
|
||||
type Props = {
|
||||
submitForm: Config => void,
|
||||
config?: Config,
|
||||
loading?: boolean,
|
||||
configReadPermission: boolean,
|
||||
configUpdatePermission: boolean,
|
||||
namespaceStrategies?: NamespaceStrategies,
|
||||
// context props
|
||||
t: string => string
|
||||
};
|
||||
|
||||
type State = {
|
||||
config: Config,
|
||||
showNotification: boolean,
|
||||
error: {
|
||||
loginAttemptLimitTimeout: boolean,
|
||||
loginAttemptLimit: boolean
|
||||
},
|
||||
changed: boolean
|
||||
};
|
||||
|
||||
class ConfigForm extends React.Component<Props, State> {
|
||||
constructor(props: Props) {
|
||||
super(props);
|
||||
|
||||
this.state = {
|
||||
config: {
|
||||
proxyPassword: null,
|
||||
proxyPort: 0,
|
||||
proxyServer: "",
|
||||
proxyUser: null,
|
||||
enableProxy: false,
|
||||
realmDescription: "",
|
||||
disableGroupingGrid: false,
|
||||
dateFormat: "",
|
||||
anonymousAccessEnabled: false,
|
||||
baseUrl: "",
|
||||
forceBaseUrl: false,
|
||||
loginAttemptLimit: 0,
|
||||
proxyExcludes: [],
|
||||
skipFailedAuthenticators: false,
|
||||
pluginUrl: "",
|
||||
loginAttemptLimitTimeout: 0,
|
||||
enabledXsrfProtection: true,
|
||||
namespaceStrategy: "",
|
||||
loginInfoUrl: "",
|
||||
_links: {}
|
||||
},
|
||||
showNotification: false,
|
||||
error: {
|
||||
loginAttemptLimitTimeout: false,
|
||||
loginAttemptLimit: false
|
||||
},
|
||||
changed: false
|
||||
};
|
||||
}
|
||||
|
||||
componentDidMount() {
|
||||
const { config, configUpdatePermission } = this.props;
|
||||
if (config) {
|
||||
this.setState({ ...this.state, config: { ...config } });
|
||||
}
|
||||
if (!configUpdatePermission) {
|
||||
this.setState({ ...this.state, showNotification: true });
|
||||
}
|
||||
}
|
||||
|
||||
submit = (event: Event) => {
|
||||
event.preventDefault();
|
||||
this.setState({
|
||||
changed: false
|
||||
});
|
||||
this.props.submitForm(this.state.config);
|
||||
};
|
||||
|
||||
render() {
|
||||
const {
|
||||
loading,
|
||||
t,
|
||||
namespaceStrategies,
|
||||
configReadPermission,
|
||||
configUpdatePermission
|
||||
} = this.props;
|
||||
const config = this.state.config;
|
||||
|
||||
let noPermissionNotification = null;
|
||||
|
||||
if (!configReadPermission) {
|
||||
return (
|
||||
<Notification
|
||||
type={"danger"}
|
||||
children={t("config.form.no-read-permission-notification")}
|
||||
/>
|
||||
);
|
||||
}
|
||||
|
||||
if (this.state.showNotification) {
|
||||
noPermissionNotification = (
|
||||
<Notification
|
||||
type={"info"}
|
||||
children={t("config.form.no-write-permission-notification")}
|
||||
onClose={() => this.onClose()}
|
||||
/>
|
||||
);
|
||||
}
|
||||
|
||||
return (
|
||||
<form onSubmit={this.submit}>
|
||||
{noPermissionNotification}
|
||||
<GeneralSettings
|
||||
namespaceStrategies={namespaceStrategies}
|
||||
loginInfoUrl={config.loginInfoUrl}
|
||||
realmDescription={config.realmDescription}
|
||||
disableGroupingGrid={config.disableGroupingGrid}
|
||||
dateFormat={config.dateFormat}
|
||||
anonymousAccessEnabled={config.anonymousAccessEnabled}
|
||||
skipFailedAuthenticators={config.skipFailedAuthenticators}
|
||||
pluginUrl={config.pluginUrl}
|
||||
enabledXsrfProtection={config.enabledXsrfProtection}
|
||||
namespaceStrategy={config.namespaceStrategy}
|
||||
onChange={(isValid, changedValue, name) =>
|
||||
this.onChange(isValid, changedValue, name)
|
||||
}
|
||||
hasUpdatePermission={configUpdatePermission}
|
||||
/>
|
||||
<hr />
|
||||
<LoginAttempt
|
||||
loginAttemptLimit={config.loginAttemptLimit}
|
||||
loginAttemptLimitTimeout={config.loginAttemptLimitTimeout}
|
||||
onChange={(isValid, changedValue, name) =>
|
||||
this.onChange(isValid, changedValue, name)
|
||||
}
|
||||
hasUpdatePermission={configUpdatePermission}
|
||||
/>
|
||||
<hr />
|
||||
<BaseUrlSettings
|
||||
baseUrl={config.baseUrl}
|
||||
forceBaseUrl={config.forceBaseUrl}
|
||||
onChange={(isValid, changedValue, name) =>
|
||||
this.onChange(isValid, changedValue, name)
|
||||
}
|
||||
hasUpdatePermission={configUpdatePermission}
|
||||
/>
|
||||
<hr />
|
||||
<ProxySettings
|
||||
proxyPassword={config.proxyPassword ? config.proxyPassword : ""}
|
||||
proxyPort={config.proxyPort}
|
||||
proxyServer={config.proxyServer ? config.proxyServer : ""}
|
||||
proxyUser={config.proxyUser ? config.proxyUser : ""}
|
||||
enableProxy={config.enableProxy}
|
||||
proxyExcludes={config.proxyExcludes}
|
||||
onChange={(isValid, changedValue, name) =>
|
||||
this.onChange(isValid, changedValue, name)
|
||||
}
|
||||
hasUpdatePermission={configUpdatePermission}
|
||||
/>
|
||||
<hr />
|
||||
<SubmitButton
|
||||
loading={loading}
|
||||
label={t("config.form.submit")}
|
||||
disabled={
|
||||
!configUpdatePermission || this.hasError() || !this.state.changed
|
||||
}
|
||||
/>
|
||||
</form>
|
||||
);
|
||||
}
|
||||
|
||||
onChange = (isValid: boolean, changedValue: any, name: string) => {
|
||||
this.setState({
|
||||
...this.state,
|
||||
config: {
|
||||
...this.state.config,
|
||||
[name]: changedValue
|
||||
},
|
||||
error: {
|
||||
...this.state.error,
|
||||
[name]: !isValid
|
||||
},
|
||||
changed: true
|
||||
});
|
||||
};
|
||||
|
||||
hasError = () => {
|
||||
return (
|
||||
this.state.error.loginAttemptLimit ||
|
||||
this.state.error.loginAttemptLimitTimeout
|
||||
);
|
||||
};
|
||||
|
||||
onClose = () => {
|
||||
this.setState({
|
||||
...this.state,
|
||||
showNotification: false
|
||||
});
|
||||
};
|
||||
}
|
||||
|
||||
export default translate("config")(ConfigForm);
|
||||
113
scm-ui/ui-webapp/src/admin/components/form/GeneralSettings.js
Normal file
113
scm-ui/ui-webapp/src/admin/components/form/GeneralSettings.js
Normal file
@@ -0,0 +1,113 @@
|
||||
// @flow
|
||||
import React from "react";
|
||||
import { translate } from "react-i18next";
|
||||
import { Checkbox, InputField } from "@scm-manager/ui-components";
|
||||
import type { NamespaceStrategies } from "@scm-manager/ui-types";
|
||||
import NamespaceStrategySelect from "./NamespaceStrategySelect";
|
||||
|
||||
type Props = {
|
||||
realmDescription: string,
|
||||
loginInfoUrl: string,
|
||||
disableGroupingGrid: boolean,
|
||||
dateFormat: string,
|
||||
anonymousAccessEnabled: boolean,
|
||||
skipFailedAuthenticators: boolean,
|
||||
pluginUrl: string,
|
||||
enabledXsrfProtection: boolean,
|
||||
namespaceStrategy: string,
|
||||
namespaceStrategies?: NamespaceStrategies,
|
||||
onChange: (boolean, any, string) => void,
|
||||
hasUpdatePermission: boolean,
|
||||
// context props
|
||||
t: string => string
|
||||
};
|
||||
|
||||
class GeneralSettings extends React.Component<Props> {
|
||||
render() {
|
||||
const {
|
||||
t,
|
||||
realmDescription,
|
||||
loginInfoUrl,
|
||||
pluginUrl,
|
||||
enabledXsrfProtection,
|
||||
namespaceStrategy,
|
||||
hasUpdatePermission,
|
||||
namespaceStrategies
|
||||
} = this.props;
|
||||
|
||||
return (
|
||||
<div>
|
||||
<div className="columns">
|
||||
<div className="column is-half">
|
||||
<InputField
|
||||
label={t("general-settings.realm-description")}
|
||||
onChange={this.handleRealmDescriptionChange}
|
||||
value={realmDescription}
|
||||
disabled={!hasUpdatePermission}
|
||||
helpText={t("help.realmDescriptionHelpText")}
|
||||
/>
|
||||
</div>
|
||||
<div className="column is-half">
|
||||
<NamespaceStrategySelect
|
||||
label={t("general-settings.namespace-strategy")}
|
||||
onChange={this.handleNamespaceStrategyChange}
|
||||
value={namespaceStrategy}
|
||||
disabled={!hasUpdatePermission}
|
||||
namespaceStrategies={namespaceStrategies}
|
||||
helpText={t("help.nameSpaceStrategyHelpText")}
|
||||
/>
|
||||
</div>
|
||||
</div>
|
||||
<div className="columns">
|
||||
<div className="column is-half">
|
||||
<InputField
|
||||
label={t("general-settings.login-info-url")}
|
||||
onChange={this.handleLoginInfoUrlChange}
|
||||
value={loginInfoUrl}
|
||||
disabled={!hasUpdatePermission}
|
||||
helpText={t("help.loginInfoUrlHelpText")}
|
||||
/>
|
||||
</div>
|
||||
<div className="column is-half">
|
||||
<Checkbox
|
||||
checked={enabledXsrfProtection}
|
||||
label={t("general-settings.enabled-xsrf-protection")}
|
||||
onChange={this.handleEnabledXsrfProtectionChange}
|
||||
disabled={!hasUpdatePermission}
|
||||
helpText={t("help.enableXsrfProtectionHelpText")}
|
||||
/>
|
||||
</div>
|
||||
</div>
|
||||
<div className="columns">
|
||||
<div className="column is-half">
|
||||
<InputField
|
||||
label={t("general-settings.plugin-url")}
|
||||
onChange={this.handlePluginCenterUrlChange}
|
||||
value={pluginUrl}
|
||||
disabled={!hasUpdatePermission}
|
||||
helpText={t("help.pluginUrlHelpText")}
|
||||
/>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
);
|
||||
}
|
||||
|
||||
handleLoginInfoUrlChange = (value: string) => {
|
||||
this.props.onChange(true, value, "loginInfoUrl");
|
||||
};
|
||||
handleRealmDescriptionChange = (value: string) => {
|
||||
this.props.onChange(true, value, "realmDescription");
|
||||
};
|
||||
handleEnabledXsrfProtectionChange = (value: boolean) => {
|
||||
this.props.onChange(true, value, "enabledXsrfProtection");
|
||||
};
|
||||
handleNamespaceStrategyChange = (value: string) => {
|
||||
this.props.onChange(true, value, "namespaceStrategy");
|
||||
};
|
||||
handlePluginCenterUrlChange = (value: string) => {
|
||||
this.props.onChange(true, value, "pluginUrl");
|
||||
};
|
||||
}
|
||||
|
||||
export default translate("config")(GeneralSettings);
|
||||
97
scm-ui/ui-webapp/src/admin/components/form/LoginAttempt.js
Normal file
97
scm-ui/ui-webapp/src/admin/components/form/LoginAttempt.js
Normal file
@@ -0,0 +1,97 @@
|
||||
// @flow
|
||||
import React from "react";
|
||||
import { translate } from "react-i18next";
|
||||
import {
|
||||
InputField,
|
||||
Subtitle,
|
||||
validation as validator
|
||||
} from "@scm-manager/ui-components";
|
||||
|
||||
type Props = {
|
||||
loginAttemptLimit: number,
|
||||
loginAttemptLimitTimeout: number,
|
||||
t: string => string,
|
||||
onChange: (boolean, any, string) => void,
|
||||
hasUpdatePermission: boolean
|
||||
};
|
||||
|
||||
type State = {
|
||||
loginAttemptLimitError: boolean,
|
||||
loginAttemptLimitTimeoutError: boolean
|
||||
};
|
||||
|
||||
class LoginAttempt extends React.Component<Props, State> {
|
||||
constructor(props: Props) {
|
||||
super(props);
|
||||
|
||||
this.state = {
|
||||
loginAttemptLimitError: false,
|
||||
loginAttemptLimitTimeoutError: false
|
||||
};
|
||||
}
|
||||
render() {
|
||||
const {
|
||||
t,
|
||||
loginAttemptLimit,
|
||||
loginAttemptLimitTimeout,
|
||||
hasUpdatePermission
|
||||
} = this.props;
|
||||
|
||||
return (
|
||||
<div>
|
||||
<Subtitle subtitle={t("login-attempt.name")} />
|
||||
<div className="columns">
|
||||
<div className="column is-half">
|
||||
<InputField
|
||||
label={t("login-attempt.login-attempt-limit")}
|
||||
onChange={this.handleLoginAttemptLimitChange}
|
||||
value={loginAttemptLimit}
|
||||
disabled={!hasUpdatePermission}
|
||||
validationError={this.state.loginAttemptLimitError}
|
||||
errorMessage={t("validation.login-attempt-limit-invalid")}
|
||||
helpText={t("help.loginAttemptLimitHelpText")}
|
||||
/>
|
||||
</div>
|
||||
<div className="column is-half">
|
||||
<InputField
|
||||
label={t("login-attempt.login-attempt-limit-timeout")}
|
||||
onChange={this.handleLoginAttemptLimitTimeoutChange}
|
||||
value={loginAttemptLimitTimeout}
|
||||
disabled={!hasUpdatePermission}
|
||||
validationError={this.state.loginAttemptLimitTimeoutError}
|
||||
errorMessage={t("validation.login-attempt-limit-timeout-invalid")}
|
||||
helpText={t("help.loginAttemptLimitTimeoutHelpText")}
|
||||
/>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
);
|
||||
}
|
||||
|
||||
//TODO: set Error in ConfigForm to disable Submit Button!
|
||||
handleLoginAttemptLimitChange = (value: string) => {
|
||||
this.setState({
|
||||
...this.state,
|
||||
loginAttemptLimitError: !validator.isNumberValid(value)
|
||||
});
|
||||
this.props.onChange(
|
||||
validator.isNumberValid(value),
|
||||
value,
|
||||
"loginAttemptLimit"
|
||||
);
|
||||
};
|
||||
|
||||
handleLoginAttemptLimitTimeoutChange = (value: string) => {
|
||||
this.setState({
|
||||
...this.state,
|
||||
loginAttemptLimitTimeoutError: !validator.isNumberValid(value)
|
||||
});
|
||||
this.props.onChange(
|
||||
validator.isNumberValid(value),
|
||||
value,
|
||||
"loginAttemptLimitTimeout"
|
||||
);
|
||||
};
|
||||
}
|
||||
|
||||
export default translate("config")(LoginAttempt);
|
||||
@@ -0,0 +1,67 @@
|
||||
//@flow
|
||||
import React from "react";
|
||||
import { translate, type TFunction } from "react-i18next";
|
||||
import { Select } from "@scm-manager/ui-components";
|
||||
import type { NamespaceStrategies } from "@scm-manager/ui-types";
|
||||
|
||||
type Props = {
|
||||
namespaceStrategies: NamespaceStrategies,
|
||||
label: string,
|
||||
value?: string,
|
||||
disabled?: boolean,
|
||||
helpText?: string,
|
||||
onChange: (value: string, name?: string) => void,
|
||||
// context props
|
||||
t: TFunction
|
||||
};
|
||||
|
||||
class NamespaceStrategySelect extends React.Component<Props> {
|
||||
createNamespaceOptions = () => {
|
||||
const { namespaceStrategies, t } = this.props;
|
||||
let available = [];
|
||||
if (namespaceStrategies && namespaceStrategies.available) {
|
||||
available = namespaceStrategies.available;
|
||||
}
|
||||
|
||||
return available.map(ns => {
|
||||
const key = "namespaceStrategies." + ns;
|
||||
let label = t(key);
|
||||
if (label === key) {
|
||||
label = ns;
|
||||
}
|
||||
return {
|
||||
value: ns,
|
||||
label: label
|
||||
};
|
||||
});
|
||||
};
|
||||
|
||||
findSelected = () => {
|
||||
const { namespaceStrategies, value } = this.props;
|
||||
if (
|
||||
!namespaceStrategies ||
|
||||
!namespaceStrategies.available ||
|
||||
namespaceStrategies.available.indexOf(value) < 0
|
||||
) {
|
||||
return namespaceStrategies.current;
|
||||
}
|
||||
return value;
|
||||
};
|
||||
|
||||
render() {
|
||||
const { label, helpText, disabled, onChange } = this.props;
|
||||
const nsOptions = this.createNamespaceOptions();
|
||||
return (
|
||||
<Select
|
||||
label={label}
|
||||
onChange={onChange}
|
||||
value={this.findSelected()}
|
||||
disabled={disabled}
|
||||
options={nsOptions}
|
||||
helpText={helpText}
|
||||
/>
|
||||
);
|
||||
}
|
||||
}
|
||||
|
||||
export default translate("plugins")(NamespaceStrategySelect);
|
||||
146
scm-ui/ui-webapp/src/admin/components/form/ProxySettings.js
Normal file
146
scm-ui/ui-webapp/src/admin/components/form/ProxySettings.js
Normal file
@@ -0,0 +1,146 @@
|
||||
// @flow
|
||||
import React from "react";
|
||||
import { translate } from "react-i18next";
|
||||
import {
|
||||
Checkbox,
|
||||
InputField,
|
||||
Subtitle,
|
||||
AddEntryToTableField
|
||||
} from "@scm-manager/ui-components";
|
||||
import ProxyExcludesTable from "../table/ProxyExcludesTable";
|
||||
|
||||
type Props = {
|
||||
proxyPassword: string,
|
||||
proxyPort: number,
|
||||
proxyServer: string,
|
||||
proxyUser: string,
|
||||
enableProxy: boolean,
|
||||
proxyExcludes: string[],
|
||||
t: string => string,
|
||||
onChange: (boolean, any, string) => void,
|
||||
hasUpdatePermission: boolean
|
||||
};
|
||||
|
||||
class ProxySettings extends React.Component<Props> {
|
||||
render() {
|
||||
const {
|
||||
t,
|
||||
proxyPassword,
|
||||
proxyPort,
|
||||
proxyServer,
|
||||
proxyUser,
|
||||
enableProxy,
|
||||
proxyExcludes,
|
||||
hasUpdatePermission
|
||||
} = this.props;
|
||||
|
||||
return (
|
||||
<div>
|
||||
<Subtitle subtitle={t("proxy-settings.name")} />
|
||||
<div className="columns">
|
||||
<div className="column is-full">
|
||||
<Checkbox
|
||||
checked={enableProxy}
|
||||
label={t("proxy-settings.enable-proxy")}
|
||||
onChange={this.handleEnableProxyChange}
|
||||
disabled={!hasUpdatePermission}
|
||||
helpText={t("help.enableProxyHelpText")}
|
||||
/>
|
||||
</div>
|
||||
</div>
|
||||
<div className="columns">
|
||||
<div className="column is-half">
|
||||
<InputField
|
||||
label={t("proxy-settings.proxy-password")}
|
||||
onChange={this.handleProxyPasswordChange}
|
||||
value={proxyPassword}
|
||||
type="password"
|
||||
disabled={!enableProxy || !hasUpdatePermission}
|
||||
helpText={t("help.proxyPasswordHelpText")}
|
||||
/>
|
||||
</div>
|
||||
<div className="column is-half">
|
||||
<InputField
|
||||
label={t("proxy-settings.proxy-port")}
|
||||
value={proxyPort}
|
||||
onChange={this.handleProxyPortChange}
|
||||
disabled={!enableProxy || !hasUpdatePermission}
|
||||
helpText={t("help.proxyPortHelpText")}
|
||||
/>
|
||||
</div>
|
||||
</div>
|
||||
<div className="columns">
|
||||
<div className="column is-half">
|
||||
<InputField
|
||||
label={t("proxy-settings.proxy-server")}
|
||||
value={proxyServer}
|
||||
onChange={this.handleProxyServerChange}
|
||||
disabled={!enableProxy || !hasUpdatePermission}
|
||||
helpText={t("help.proxyServerHelpText")}
|
||||
/>
|
||||
</div>
|
||||
<div className="column is-half">
|
||||
<InputField
|
||||
label={t("proxy-settings.proxy-user")}
|
||||
value={proxyUser}
|
||||
onChange={this.handleProxyUserChange}
|
||||
disabled={!enableProxy || !hasUpdatePermission}
|
||||
helpText={t("help.proxyUserHelpText")}
|
||||
/>
|
||||
</div>
|
||||
</div>
|
||||
<div className="columns">
|
||||
<div className="column is-full">
|
||||
<ProxyExcludesTable
|
||||
proxyExcludes={proxyExcludes}
|
||||
onChange={(isValid, changedValue, name) =>
|
||||
this.props.onChange(isValid, changedValue, name)
|
||||
}
|
||||
disabled={!enableProxy || !hasUpdatePermission}
|
||||
/>
|
||||
<AddEntryToTableField
|
||||
addEntry={this.addProxyExclude}
|
||||
disabled={!enableProxy || !hasUpdatePermission}
|
||||
buttonLabel={t("proxy-settings.add-proxy-exclude-button")}
|
||||
fieldLabel={t("proxy-settings.add-proxy-exclude-textfield")}
|
||||
errorMessage={t("proxy-settings.add-proxy-exclude-error")}
|
||||
/>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
);
|
||||
}
|
||||
|
||||
handleProxyPasswordChange = (value: string) => {
|
||||
this.props.onChange(true, value, "proxyPassword");
|
||||
};
|
||||
handleProxyPortChange = (value: string) => {
|
||||
this.props.onChange(true, value, "proxyPort");
|
||||
};
|
||||
handleProxyServerChange = (value: string) => {
|
||||
this.props.onChange(true, value, "proxyServer");
|
||||
};
|
||||
handleProxyUserChange = (value: string) => {
|
||||
this.props.onChange(true, value, "proxyUser");
|
||||
};
|
||||
handleEnableProxyChange = (value: string) => {
|
||||
this.props.onChange(true, value, "enableProxy");
|
||||
};
|
||||
|
||||
addProxyExclude = (proxyExcludeName: string) => {
|
||||
if (this.isProxyExcludeMember(proxyExcludeName)) {
|
||||
return;
|
||||
}
|
||||
this.props.onChange(
|
||||
true,
|
||||
[...this.props.proxyExcludes, proxyExcludeName],
|
||||
"proxyExcludes"
|
||||
);
|
||||
};
|
||||
|
||||
isProxyExcludeMember = (proxyExcludeName: string) => {
|
||||
return this.props.proxyExcludes.includes(proxyExcludeName);
|
||||
};
|
||||
}
|
||||
|
||||
export default translate("config")(ProxySettings);
|
||||
@@ -0,0 +1,49 @@
|
||||
//@flow
|
||||
import React from "react";
|
||||
import { RemoveEntryOfTableButton, LabelWithHelpIcon } from "@scm-manager/ui-components";
|
||||
|
||||
type Props = {
|
||||
items: string[],
|
||||
label: string,
|
||||
removeLabel: string,
|
||||
onRemove: (string[], string) => void,
|
||||
disabled: boolean,
|
||||
helpText: string
|
||||
};
|
||||
|
||||
class ArrayConfigTable extends React.Component<Props> {
|
||||
render() {
|
||||
const { label, disabled, removeLabel, items, helpText } = this.props;
|
||||
return (
|
||||
<div>
|
||||
<LabelWithHelpIcon label={label} helpText={helpText}/>
|
||||
<table className="table is-hoverable is-fullwidth">
|
||||
<tbody>
|
||||
{items.map(item => {
|
||||
return (
|
||||
<tr key={item}>
|
||||
<td>{item}</td>
|
||||
<td>
|
||||
<RemoveEntryOfTableButton
|
||||
entryname={item}
|
||||
removeEntry={this.removeEntry}
|
||||
disabled={disabled}
|
||||
label={removeLabel}
|
||||
/>
|
||||
</td>
|
||||
</tr>
|
||||
);
|
||||
})}
|
||||
</tbody>
|
||||
</table>
|
||||
</div>
|
||||
);
|
||||
}
|
||||
|
||||
removeEntry = (item: string) => {
|
||||
const newItems = this.props.items.filter(name => name !== item);
|
||||
this.props.onRemove(newItems, item);
|
||||
};
|
||||
}
|
||||
|
||||
export default ArrayConfigTable;
|
||||
@@ -0,0 +1,35 @@
|
||||
//@flow
|
||||
import React from "react";
|
||||
import { translate } from "react-i18next";
|
||||
import ArrayConfigTable from "./ArrayConfigTable";
|
||||
|
||||
type Props = {
|
||||
proxyExcludes: string[],
|
||||
t: string => string,
|
||||
onChange: (boolean, any, string) => void,
|
||||
disabled: boolean
|
||||
};
|
||||
|
||||
type State = {};
|
||||
|
||||
class ProxyExcludesTable extends React.Component<Props, State> {
|
||||
render() {
|
||||
const { proxyExcludes, disabled, t } = this.props;
|
||||
return (
|
||||
<ArrayConfigTable
|
||||
items={proxyExcludes}
|
||||
label={t("proxy-settings.proxy-excludes")}
|
||||
removeLabel={t("proxy-settings.remove-proxy-exclude-button")}
|
||||
onRemove={this.removeEntry}
|
||||
disabled={disabled}
|
||||
helpText={t("help.proxyExcludesHelpText")}
|
||||
/>
|
||||
);
|
||||
}
|
||||
|
||||
removeEntry = (newExcludes: string[]) => {
|
||||
this.props.onChange(true, newExcludes, "proxyExcludes");
|
||||
};
|
||||
}
|
||||
|
||||
export default translate("config")(ProxyExcludesTable);
|
||||
Reference in New Issue
Block a user