diff --git a/htmlui/src/RepoStatus.js b/htmlui/src/RepoStatus.js index 79bf49f24..63cb025f8 100644 --- a/htmlui/src/RepoStatus.js +++ b/htmlui/src/RepoStatus.js @@ -81,30 +81,47 @@ export class RepoStatus extends Component { <>

Connected To Repository

- - Config File - - - - Cache Directory - - + {this.state.status.apiServerURL ? <> + + + Server URL + + + + : <> + + + Config File + + + + Cache Directory + + + + + + Provider + + + + Hash Algorithm + + + + Encryption Algorithm + + + + Splitter Algorithm + + + + } - Provider - - - - Hash Algorithm - - - - Encryption Algorithm - - - - Splitter Algorithm - + Connected as: + diff --git a/htmlui/src/SetupKopiaServer.js b/htmlui/src/SetupKopiaServer.js new file mode 100644 index 000000000..8421e1005 --- /dev/null +++ b/htmlui/src/SetupKopiaServer.js @@ -0,0 +1,27 @@ +import React, { Component } from 'react'; +import Form from 'react-bootstrap/Form'; +import { handleChange, OptionalField, RequiredField, validateRequiredFields } from './forms'; + +export class SetupKopiaServer extends Component { + constructor() { + super(); + + this.state = {}; + this.handleChange = handleChange.bind(this); + } + + validate() { + return validateRequiredFields(this, ["url"]) + } + + render() { + return <> + + {RequiredField(this, "Server address", "url", { placeholder: "enter server URL (https://:port)" })} + + + {OptionalField(this, "Trusted server certificate finterprint (SHA256)", "serverCertFingerprint", { placeholder: "enter trusted server certificate fingerprint printed at server startup" })} + + ; + } +} diff --git a/htmlui/src/SetupRepository.js b/htmlui/src/SetupRepository.js index 8ec46b4bf..cb9db9eb8 100644 --- a/htmlui/src/SetupRepository.js +++ b/htmlui/src/SetupRepository.js @@ -13,6 +13,7 @@ import { SetupAzure } from './SetupAzure'; import { SetupSFTP } from './SetupSFTP'; import { SetupToken } from './SetupToken'; import { SetupWebDAV } from './SetupWebDAV'; +import { SetupKopiaServer } from './SetupKopiaServer'; const supportedProviders = [ { provider: "filesystem", description: "Filesystem", component: SetupFilesystem }, @@ -23,6 +24,7 @@ const supportedProviders = [ { provider: "sftp", description: "SFTP server", component: SetupSFTP }, { provider: "webdav", description: "WebDAV server", component: SetupWebDAV }, { provider: "_token", description: "(use token)", component: SetupToken }, + { provider: "_server", description: "(connect to Kopia server)", component: SetupKopiaServer }, ]; export class SetupRepository extends Component { @@ -126,18 +128,29 @@ export class SetupRepository extends Component { } let request = null; - if (this.state.provider === "_token") { - request = { - token: ed.state.token, - } - } else { - request = { - storage: { - type: this.state.provider, - config: ed.state, - }, - password: this.state.password, - } + switch (this.state.provider) { + case "_token": + request = { + token: ed.state.token, + }; + break; + + case "_server": + request = { + apiServer: ed.state, + password: this.state.password, + }; + break; + + default: + request = { + storage: { + type: this.state.provider, + config: ed.state, + }, + password: this.state.password, + }; + break; } this.setState({ isLoading: true }); diff --git a/htmlui/src/SourcesTable.js b/htmlui/src/SourcesTable.js index bf36bfa19..473fc1732 100644 --- a/htmlui/src/SourcesTable.js +++ b/htmlui/src/SourcesTable.js @@ -28,6 +28,7 @@ export class SourcesTable extends Component { error: null, localSourceName: "", + multiUser: false, selectedOwner: localSnapshots, selectedDirectory: "", }; @@ -59,6 +60,7 @@ export class SourcesTable extends Component { axios.get('/api/v1/sources').then(result => { this.setState({ localSourceName: result.data.localUsername + "@" + result.data.localHost, + multiUser: result.data.multiUser, sources: result.data.sources, isLoading: false, }); @@ -323,7 +325,7 @@ export class SourcesTable extends Component { }] return
- + {this.state.multiUser &&   @@ -343,7 +345,7 @@ export class SourcesTable extends Component { - + }