You are viewing a plain text version of this content. The canonical link for it is here.
Posted to notifications@couchdb.apache.org by garrensmith <gi...@git.apache.org> on 2016/08/15 13:45:32 UTC

[GitHub] couchdb-fauxton pull request #761: New replication

GitHub user garrensmith opened a pull request:

    https://github.com/apache/couchdb-fauxton/pull/761

    New replication

    This is the continuation of @benkeen's work in #669

You can merge this pull request into a Git repository by running:

    $ git pull https://github.com/garrensmith/couchdb-fauxton new-replication

Alternatively you can review and apply these changes as the patch at:

    https://github.com/apache/couchdb-fauxton/pull/761.patch

To close this pull request, make a commit to your master/trunk branch
with (at least) the following in the commit message:

    This closes #761
    
----
commit 0aff2b956c38948bbbbe35e929b273fb1ae93a5f
Author: Ben Keen <be...@gmail.com>
Date:   2016-06-03T11:58:29Z

    Include base64 npm module
    
    MIT license. https://github.com/mathiasbynens/base64

commit b974110ae49d1bce10d68bb2870f6b71dfefc46e
Author: Ben Keen <be...@gmail.com>
Date:   2016-03-16T21:06:33Z

    Replication page update

commit 1e6544b71d9ca5167c02e6be37a6b4119e710837
Author: Ben Keen <be...@gmail.com>
Date:   2016-08-14T21:04:29Z

    debug

commit e70f83a25c4c5484a5b625d28f180170b01a044f
Author: Ben Keen <be...@gmail.com>
Date:   2016-08-14T21:26:41Z

    debugging

commit dd91f0e4882ef4aa1e5c1897b72d4992d09c65b6
Author: Ben Keen <be...@gmail.com>
Date:   2016-08-14T21:36:48Z

    sheesh

commit 7a40e6e16f4392f155b452bed79e0498d83ff040
Author: Ben Keen <be...@gmail.com>
Date:   2016-08-14T21:46:57Z

    k

commit d5655d1a3385a37e32c6b63a81647974c4029853
Author: Ben Keen <be...@gmail.com>
Date:   2016-08-14T22:21:34Z

    continued

commit 10c6314285075e080657b9f6018868355985b3b9
Author: Ben Keen <be...@gmail.com>
Date:   2016-08-14T22:38:53Z

    more

commit 804eda7a0c156e78b46e99b90b11d2e86c929341
Author: Ben Keen <be...@gmail.com>
Date:   2016-08-14T23:06:58Z

    I miss my Sunday

commit f91dd99f6f57d8589c3caff8e2164c93a5983610
Author: Ben Keen <be...@gmail.com>
Date:   2016-08-14T23:36:59Z

    more

commit 50bedffed5d29362367ad2997ba06aeaab7d0518
Author: Ben Keen <be...@gmail.com>
Date:   2016-08-14T23:45:39Z

    all tests

commit 6b693e5da6c4cd3270eaa608b61b39ab8d22a651
Author: Ben Keen <be...@gmail.com>
Date:   2016-08-15T00:07:48Z

    meh

commit efd36771a5261ccd5cbc5e778e10651e691d58fa
Author: Ben Keen <be...@gmail.com>
Date:   2016-08-15T00:28:33Z

    testing cache bust

commit b44561c95f161fcc1f6be0bc228d1e8f0d60d250
Author: Garren Smith <ga...@gmail.com>
Date:   2016-08-15T13:44:37Z

    fix replication tests

----


---
If your project is set up for it, you can reply to this email and have your
reply appear on GitHub as well. If your project does not have this feature
enabled and wishes so, or if the feature is enabled but not working, please
contact infrastructure at infrastructure@apache.org or file a JIRA ticket
with INFRA.
---

[GitHub] couchdb-fauxton issue #761: New replication

Posted by garrensmith <gi...@git.apache.org>.
Github user garrensmith commented on the issue:

    https://github.com/apache/couchdb-fauxton/pull/761
  
    @robertkowalski tests are green \U0001f389 


---
If your project is set up for it, you can reply to this email and have your
reply appear on GitHub as well. If your project does not have this feature
enabled and wishes so, or if the feature is enabled but not working, please
contact infrastructure at infrastructure@apache.org or file a JIRA ticket
with INFRA.
---

[GitHub] couchdb-fauxton pull request #761: New replication

Posted by robertkowalski <gi...@git.apache.org>.
Github user robertkowalski commented on a diff in the pull request:

    https://github.com/apache/couchdb-fauxton/pull/761#discussion_r87581592
  
    --- Diff: test/dev.js ---
    @@ -13,7 +13,7 @@
     
     // This will search for files ending in .test.js and require them
     // so that they are added to the webpack bundle
    -var context = require.context('../app/', true, /[Ss]pec/);
    +var context = require.context('../app/addons/replication', true, /[Ss]pec/);
    --- End diff --
    
    debug issue?


---
If your project is set up for it, you can reply to this email and have your
reply appear on GitHub as well. If your project does not have this feature
enabled and wishes so, or if the feature is enabled but not working, please
contact infrastructure at infrastructure@apache.org or file a JIRA ticket
with INFRA.
---

[GitHub] couchdb-fauxton pull request #761: New replication

Posted by michellephung <gi...@git.apache.org>.
Github user michellephung commented on a diff in the pull request:

    https://github.com/apache/couchdb-fauxton/pull/761#discussion_r75611487
  
    --- Diff: app/addons/replication/components/source.js ---
    @@ -0,0 +1,164 @@
    +// Licensed under the Apache License, Version 2.0 (the "License"); you may not
    +// use this file except in compliance with the License. You may obtain a copy of
    +// the License at
    +//
    +//   http://www.apache.org/licenses/LICENSE-2.0
    +//
    +// Unless required by applicable law or agreed to in writing, software
    +// distributed under the License is distributed on an "AS IS" BASIS, WITHOUT
    +// WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. See the
    +// License for the specific language governing permissions and limitations under
    +// the License.
    +import React from 'react';
    +import Constants from '../constants';
    +import Components from '../../components/react-components.react';
    +import ReactSelect from 'react-select';
    +
    +const { StyledSelect } = Components;
    +
    +const RemoteSourceInput = ({onChange, value}) =>
    +  <div className="replication-section">
    +    <div className="replication-input-label">Database URL:</div>
    +    <div className="">
    +      <input type="text" className="replication-remote-connection-url" placeholder="https://" value={value}
    +        onChange={(e) => onChange(e.target.value)} />
    +      <div className="replication-remote-connection-url-text">e.g. https://$REMOTE_USERNAME:$REMOTE_PASSWORD@$REMOTE_SERVER/$DATABASE</div>
    +    </div>
    +  </div>;
    +
    +RemoteSourceInput.propTypes = {
    +  value: React.PropTypes.string.isRequired,
    +  onChange: React.PropTypes.func.isRequired
    +};
    +
    +const LocalSourceInput = ({value, onChange, databases}) => {
    +  const options = databases.map(db => ({value: db, label: db}));
    +  return (
    +    <div className="replication-section">
    +      <div className="replication-input-label">
    +        Source Name:
    +      </div>
    +      <div className="replication-input-react-select">
    +        <ReactSelect
    +          name="source-name"
    +          value={value}
    +          placeholder="Database name"
    +          options={options}
    +          clearable={false}
    +          onChange={({value}) => onChange(value)} />
    +      </div>
    +    </div>
    +  );
    +};
    +
    +LocalSourceInput.propTypes = {
    +  value: React.PropTypes.string.isRequired,
    +  databases: React.PropTypes.array.isRequired,
    +  onChange: React.PropTypes.func.isRequired
    +};
    +
    +const ReplicationSourceRow = ({replicationSource, databases, sourceDatabase, remoteSource, onChangeRemote, onChangeLocal}) => {
    +  if (replicationSource === Constants.REPLICATION_SOURCE.LOCAL) {
    +    return <LocalSourceInput
    +      value={sourceDatabase}
    +      databases={databases}
    +      onChange={onChangeLocal}
    +           />;
    --- End diff --
    
    nvm


---
If your project is set up for it, you can reply to this email and have your
reply appear on GitHub as well. If your project does not have this feature
enabled and wishes so, or if the feature is enabled but not working, please
contact infrastructure at infrastructure@apache.org or file a JIRA ticket
with INFRA.
---

[GitHub] couchdb-fauxton issue #761: New replication

Posted by justin-mcdavid-ibm <gi...@git.apache.org>.
Github user justin-mcdavid-ibm commented on the issue:

    https://github.com/apache/couchdb-fauxton/pull/761
  
    With regard to trying to start a replication job that uses a custom doc ID that conflicts with that of an existing document, we should be providing validation of some sort, and then giving the user a choice on what action to take.
    
    Currently, if I fill out details for a remote replication job, but make a small mistake on the url/password, the replication document will be created, but the replication job will fail.  If I want to go in an make a small tweak to fix the details, but use the same custom ID, I'll get a doc-conflict error warning, and will then either need to manually delete the first document or change the custom doc ID to something new (at which point I'd probably want to delete the doc for the failed job just to keep things tidy).
    
    My recommendation is to provide a validation step in between clicking the "Start Replication" button and the replication document actually being created/sent to the server.  If validation fails, give the user an opportunity to delete the existing, conflicting replication document before creating the new one.
    <img width="428" alt="artboard 1 copy 4" src="https://cloud.githubusercontent.com/assets/12969375/18851240/d6f9644c-83ef-11e6-9979-051e99db557f.png">



---
If your project is set up for it, you can reply to this email and have your
reply appear on GitHub as well. If your project does not have this feature
enabled and wishes so, or if the feature is enabled but not working, please
contact infrastructure at infrastructure@apache.org or file a JIRA ticket
with INFRA.
---

[GitHub] couchdb-fauxton pull request #761: New replication

Posted by michellephung <gi...@git.apache.org>.
Github user michellephung commented on a diff in the pull request:

    https://github.com/apache/couchdb-fauxton/pull/761#discussion_r75611414
  
    --- Diff: app/addons/replication/components/target.js ---
    @@ -0,0 +1,202 @@
    +// Licensed under the Apache License, Version 2.0 (the "License"); you may not
    +// use this file except in compliance with the License. You may obtain a copy of
    +// the License at
    +//
    +//   http://www.apache.org/licenses/LICENSE-2.0
    +//
    +// Unless required by applicable law or agreed to in writing, software
    +// distributed under the License is distributed on an "AS IS" BASIS, WITHOUT
    +// WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. See the
    +// License for the specific language governing permissions and limitations under
    +// the License.
    +import React from 'react';
    +import Constants from '../constants';
    +import Components from '../../components/react-components.react';
    +import ReactSelect from 'react-select';
    +
    +const { StyledSelect } = Components;
    +
    +const replicationTargetSourceOptions = () => {
    +  return [
    +    { value: '', label: 'Select target' },
    +    { value: Constants.REPLICATION_TARGET.EXISTING_LOCAL_DATABASE, label: 'Existing local database' },
    +    { value: Constants.REPLICATION_TARGET.EXISTING_REMOTE_DATABASE, label: 'Existing remote database' },
    +    { value: Constants.REPLICATION_TARGET.NEW_LOCAL_DATABASE, label: 'New local database' },
    +    { value: Constants.REPLICATION_TARGET.NEW_REMOTE_DATABASE, label: 'New remote database' }
    +  ].map((option) => {
    +    return (
    +      <option value={option.value} key={option.value}>{option.label}</option>
    +    );
    +  });
    +};
    +
    +const ReplicationTargetSelect = ({value, onChange}) => {
    +  return (
    +    <div className="replication-section">
    +      <div className="replication-input-label">
    +        Replication Target:
    +      </div>
    +      <div className="replication-input-select">
    +        <StyledSelect
    +          selectContent={replicationTargetSourceOptions()}
    +          selectChange={(e) => onChange(e.target.value)}
    +          selectId="replication-target"
    +          selectValue={value} />
    +      </div>
    +    </div>
    +  );
    +};
    +
    +ReplicationTargetSelect.propTypes = {
    +  value: React.PropTypes.string.isRequired,
    +  onChange: React.PropTypes.func.isRequired
    +};
    +
    +const RemoteTargetReplicationRow = ({onChange, value}) => {
    +  return (
    +    <div>
    +      <input type="text" className="replication-remote-connection-url" placeholder="https://" value={value}
    +        onChange={(e) => onChange(e.target.value)} />
    +      <div className="replication-remote-connection-url-text">e.g. https://$REMOTE_USERNAME:$REMOTE_PASSWORD@$REMOTE_SERVER/$DATABASE</div>
    --- End diff --
    
    maybe put onto 3 lines


---
If your project is set up for it, you can reply to this email and have your
reply appear on GitHub as well. If your project does not have this feature
enabled and wishes so, or if the feature is enabled but not working, please
contact infrastructure at infrastructure@apache.org or file a JIRA ticket
with INFRA.
---

[GitHub] couchdb-fauxton issue #761: New replication

Posted by robertkowalski <gi...@git.apache.org>.
Github user robertkowalski commented on the issue:

    https://github.com/apache/couchdb-fauxton/pull/761
  
    tests are red


---
If your project is set up for it, you can reply to this email and have your
reply appear on GitHub as well. If your project does not have this feature
enabled and wishes so, or if the feature is enabled but not working, please
contact infrastructure at infrastructure@apache.org or file a JIRA ticket
with INFRA.
---

[GitHub] couchdb-fauxton pull request #761: New replication

Posted by robertkowalski <gi...@git.apache.org>.
Github user robertkowalski commented on a diff in the pull request:

    https://github.com/apache/couchdb-fauxton/pull/761#discussion_r87581878
  
    --- Diff: app/addons/replication/route.js ---
    @@ -10,48 +10,67 @@
     // License for the specific language governing permissions and limitations under
     // the License.
     
    -import app from "../../app";
    -import FauxtonAPI from "../../core/api";
    -import Replication from "./resources";
    -import Views from "./views";
    -var RepRouteObject = FauxtonAPI.RouteObject.extend({
    -  layout: 'one_pane',
    +import FauxtonAPI from '../../core/api';
    +import ReplicationController from './controller';
    +import ComponentActions from '../components/actions';
    +
    +const ReplicationRouteObject = FauxtonAPI.RouteObject.extend({
    +  layout: 'empty',
    +  hideNotificationCenter: true,
    +  hideApiBar: true,
    +
       routes: {
    -    "replication": 'defaultView',
    -    "replication/:dbname": 'defaultView'
    +    'replication/create': 'defaultView',
    +    'replication/:dbname': 'defaultView',
    --- End diff --
    
    it looks like you can't edit a database with the name `create` using this routing


---
If your project is set up for it, you can reply to this email and have your
reply appear on GitHub as well. If your project does not have this feature
enabled and wishes so, or if the feature is enabled but not working, please
contact infrastructure at infrastructure@apache.org or file a JIRA ticket
with INFRA.
---

[GitHub] couchdb-fauxton issue #761: New replication

Posted by robertkowalski <gi...@git.apache.org>.
Github user robertkowalski commented on the issue:

    https://github.com/apache/couchdb-fauxton/pull/761
  
    update: discussed with garren, the validation shoudl happen on the serverside.


---
If your project is set up for it, you can reply to this email and have your
reply appear on GitHub as well. If your project does not have this feature
enabled and wishes so, or if the feature is enabled but not working, please
contact infrastructure at infrastructure@apache.org or file a JIRA ticket
with INFRA.
---

[GitHub] couchdb-fauxton pull request #761: New replication

Posted by michellephung <gi...@git.apache.org>.
Github user michellephung commented on a diff in the pull request:

    https://github.com/apache/couchdb-fauxton/pull/761#discussion_r75611194
  
    --- Diff: app/addons/replication/components.react.jsx ---
    @@ -0,0 +1,204 @@
    +// Licensed under the Apache License, Version 2.0 (the "License"); you may not
    +// use this file except in compliance with the License. You may obtain a copy of
    +// the License at
    +//
    +//   http://www.apache.org/licenses/LICENSE-2.0
    +//
    +// Unless required by applicable law or agreed to in writing, software
    +// distributed under the License is distributed on an "AS IS" BASIS, WITHOUT
    +// WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. See the
    +// License for the specific language governing permissions and limitations under
    +// the License.
    +import app from '../../app';
    +import FauxtonAPI from '../../core/api';
    +import React from 'react';
    +import Constants from './constants';
    +import Helpers from './helpers';
    +import Components from '../components/react-components.react';
    +import AuthComponents from '../auth/components.react';
    +import ReactSelect from 'react-select';
    +
    +const {LoadLines, StyledSelect, ConfirmButton} = Components;
    +const PasswordModal = AuthComponents.PasswordModal;
    +
    +class ReplicationSourceRow extends React.Component {
    +  render () {
    +    const { replicationSource, databases, sourceDatabase, remoteSource, onChange} = this.props;
    +
    +    if (replicationSource === Constants.REPLICATION_SOURCE.LOCAL) {
    +      return (
    +        <div className="replication-source-name-row row">
    +          <div className="span3">
    +            Source Name:
    +          </div>
    +          <div className="span7">
    +            <ReactSelect
    +              name="source-name"
    +              value={sourceDatabase}
    +              placeholder="Database name"
    +              options={Helpers.getReactSelectOptions(databases)}
    +              clearable={false}
    +              onChange={(selected) => Actions.updateFormField('sourceDatabase', selected.value)} />
    +          </div>
    +        </div>
    +      );
    +    }
    +
    +    return (
    +      <div>
    +        <div className="row">
    +          <div className="span3">Database URL:</div>
    +          <div className="span7">
    +            <input type="text" className="connection-url" placeholder="https://" value={remoteSource}
    +              onChange={(e) => onChange(e.target.value)} />
    +            <div className="connection-url-example">e.g. https://$REMOTE_USERNAME:$REMOTE_PASSWORD@$REMOTE_SERVER/$DATABASE</div>
    +          </div>
    +        </div>
    +      </div>
    +    );
    +  }
    +}
    +ReplicationSourceRow.propTypes = {
    +  replicationSource: React.PropTypes.string.isRequired,
    +  databases: React.PropTypes.array.isRequired,
    +  sourceDatabase: React.PropTypes.string.isRequired,
    +  remoteSource: React.PropTypes.string.isRequired,
    +  onChange: React.PropTypes.func.isRequired
    +};
    +
    +
    +class ReplicationTarget extends React.Component {
    +  getOptions () {
    +    const options = [
    +      { value: '', label: 'Select target' },
    +      { value: Constants.REPLICATION_TARGET.EXISTING_LOCAL_DATABASE, label: 'Existing local database' },
    +      { value: Constants.REPLICATION_TARGET.EXISTING_REMOTE_DATABASE, label: 'Existing remote database' },
    +      { value: Constants.REPLICATION_TARGET.NEW_LOCAL_DATABASE, label: 'New local database' },
    +      { value: Constants.REPLICATION_TARGET.NEW_REMOTE_DATABASE, label: 'New remote database' }
    +    ];
    +    return options.map((option) => {
    +      return (
    +        <option value={option.value} key={option.value}>{option.label}</option>
    +      );
    +    });
    +  }
    +
    +  render () {
    +    return (
    +      <StyledSelect
    +        selectContent={this.getOptions()}
    +        selectChange={(e) => this.props.onChange(e.target.value)}
    +        selectId="replication-target"
    +        selectValue={this.props.value} />
    +    );
    +  }
    +}
    +
    +ReplicationTarget.propTypes = {
    +  value: React.PropTypes.string.isRequired,
    +  onChange: React.PropTypes.func.isRequired
    +};
    +
    +
    +class ReplicationType extends React.Component {
    +  getOptions () {
    +    const options = [
    +      { value: Constants.REPLICATION_TYPE.ONE_TIME, label: 'One time' },
    +      { value: Constants.REPLICATION_TYPE.CONTINUOUS, label: 'Continuous' }
    +    ];
    +    return _.map(options, function (option) {
    +      return (
    +        <option value={option.value} key={option.value}>{option.label}</option>
    +      );
    +    });
    +  }
    +
    +  render () {
    +    return (
    +      <StyledSelect
    +        selectContent={this.getOptions()}
    +        selectChange={(e) => this.props.onChange(e.target.value)}
    +        selectId="replication-target"
    +        selectValue={this.props.value} />
    +    );
    +  }
    +}
    +ReplicationType.propTypes = {
    +  value: React.PropTypes.string.isRequired,
    +  onChange: React.PropTypes.func.isRequired
    +};
    +
    +
    +class ReplicationTargetRow extends React.Component {
    +  update (value) {
    +    Actions.updateFormField('remoteTarget', value);
    +  }
    +
    +  render () {
    +    const { replicationTarget, remoteTarget, targetDatabase, databases } = this.props;
    +
    +    let targetLabel = 'Target Name:';
    +    let field = null;
    +    let remoteHelpText = 'https://$USERNAME:$PASSWORD@server.com/$DATABASE';
    +
    +    // new and existing remote DBs show a URL field
    +    if (replicationTarget === Constants.REPLICATION_TARGET.NEW_REMOTE_DATABASE ||
    +        replicationTarget === Constants.REPLICATION_TARGET.EXISTING_REMOTE_DATABASE) {
    +      targetLabel = 'Database URL';
    +      remoteHelpText = 'https://$REMOTE_USERNAME:$REMOTE_PASSWORD@$REMOTE_SERVER/$DATABASE';
    +
    +      field = (
    +        <div>
    +          <input type="text" className="connection-url" placeholder="https://" value={remoteTarget}
    +            onChange={(e) => Actions.updateFormField('remoteTarget', e.target.value)} />
    --- End diff --
    
    new lines in here would help readability


---
If your project is set up for it, you can reply to this email and have your
reply appear on GitHub as well. If your project does not have this feature
enabled and wishes so, or if the feature is enabled but not working, please
contact infrastructure at infrastructure@apache.org or file a JIRA ticket
with INFRA.
---

[GitHub] couchdb-fauxton pull request #761: New replication

Posted by michellephung <gi...@git.apache.org>.
Github user michellephung commented on a diff in the pull request:

    https://github.com/apache/couchdb-fauxton/pull/761#discussion_r74870084
  
    --- Diff: app/addons/replication/assets/less/replication.less ---
    @@ -11,187 +11,102 @@
     // the License.
     
     @import "../../../../../assets/less/variables.less";
    +@import "../../../../../assets/less/mixins.less";
     
    -#replication {
    -  position: relative;
    -  max-width: none;
    -  width: auto;
    +.replication-page {
    +  font-size: 14px;
     
    -  .form_set {
    -    width: 350px;
    -    display: inline-block;
    -    border: 1px solid @greyBrownLighter;
    -    padding: 15px 10px 0;
    -    margin-bottom: 20px;
    -    &.middle {
    -      width: 100px;
    -      border: none;
    -      position: relative;
    -      height: 100px;
    -      margin: 0;
    -    }
    -    input, select {
    -      margin: 0 0 16px 5px;
    -      height: 40px;
    -      width: 318px;
    -    }
    -    .btn-group {
    -      margin: 0 0 16px 5px;
    -      .btn {
    -        padding: 10px 57px;
    -      }
    -    }
    -    &.local {
    -      .local_option {
    -        display: block;
    -      }
    -      .remote_option {
    -        display: none;
    -      }
    -      .local-btn {
    -        background-color: @brandPrimary;
    -        color: #fff;
    -      }
    -      .remote-btn {
    -        background-color: #f5f5f5;
    -        color: @fontGrey;
    -      }
    -    }
    -    .local_option {
    -      display: none;
    -    }
    -    .remote-btn {
    -      background-color: @brandPrimary;
    -      color: #fff;
    -    }
    +  input, select {
    +    font-size: 14px;
    +  }
    +  input {
    +    width: 246px;
    +  }
    +  select {
    +    width: 246px;
    +    margin-bottom: 10px;
    +    background-color: white;
    +    border: 1px solid #cccccc;
    +  }
    +  .styled-select {
    +    width: 250px;
       }
     
    -
    -  .options {
    -    position: relative;
    -    &:after {
    -      content: '';
    -      display: block;
    -      position: absolute;
    -      right: -16px;
    -      top: 9px;
    -      width: 0;
    -      height: 0;
    -      border-left: 5px solid transparent;
    -      border-right: 5px solid transparent;
    -      border-bottom: 5px solid black;
    -      border-top: none;
    -    }
    -    &.off {
    -      &:after {
    -      content: '';
    -      display: block;
    -      position: absolute;
    -      right: -16px;
    -      top: 9px;
    -      width: 0;
    -      height: 0;
    -      border-left: 5px solid transparent;
    -      border-right: 5px solid transparent;
    -      border-bottom: none;
    -      border-top: 5px solid black;
    -      }
    -    }
    +  .span3 {
    +    text-align: right;
    +    margin-top: 12px;
       }
    -  .control-group {
    -    label {
    -      float: left;
    -      min-height: 30px;
    -      vertical-align: top;
    -      padding-right: 5px;
    -      min-width: 130px;
    -      padding-left: 0px;
    -    }
    -    input[type=radio],
    -    input[type=checkbox] {
    -      margin: 0 0 2px 0;
    +  .remote-connection-details {
    +    margin: 15px 0;
    +  }
    +  .connection-url {
    +    width: 100%;
    +  }
    +  .buttons-row {
    +    margin-top: 10px;
    +    a {
    +      padding: 12px;
         }
       }
    +  .typeahead {
    +    width: 100%;
    +  }
     
    -  .circle {
    -    z-index: 0;
    -    position: absolute;
    -    top: 20px;
    -    left: 15px;
    -
    -    &:after {
    -      width: 70px;
    -      height: 70px;
    -      content: '';
    -      display: block;
    -      position: relative;
    -      margin: 0 auto;
    -      border: 1px solid @greyBrownLighter;
    -      -webkit-border-radius: 40px;
    -      -moz-border-radius: 40px;
    -      border-radius:40px;
    -    }
    +  hr {
    +    margin: 6px 0 15px;
    +  }
    +  .section-header {
    +    font-weight: bold;
    +    font-size: 14pt;
       }
    -  .swap {
    -    text-decoration: none;
    -    z-index: 30;
    +}
    +
    +#dashboard-content .replication-page {
    +  padding-top: 25px;
    +}
    +
    +.connection-url-example {
    +  font-size: 9pt;
    +  color: #999999;
    +  margin-bottom: 8px;
    +}
    +
    +.custom-id-field {
    +  position: relative;
    +  width: 250px;
    +
    +  span.fonticon {
         cursor: pointer;
         position: absolute;
    -    font-size: 40px;
    -    width: 27px;
    -    height: 12px;
    -    top: 31px;
    -    left: 30px;
    +    right: 6px;
    +    top: 8px;
    +    font-size: 11px;
    +    padding: 8px;
    +    color: #999999;
    +    .transition(all 0.25s linear);
         &:hover {
    -      color: @greyBrownLighter;
    +      color: #333333;
    +    }
    +    input {
    +      padding-right: 32px;
         }
       }
     }
     
    -#replicationStatus {
    -  &.showHeader {
    -    li.header {
    -      display: block;
    -      border: none;
    -    }
    -    ul {
    -      border:1px solid @greyBrownLighter;
    -    }
    +
    +body .Select div.Select-control {
    --- End diff --
    
    OK i did it in a gist, since i don't know how to add to this this pr. You can copy and paste it:
    
    https://gist.github.com/michellephung/71b8658d38f37d67331c240e366fbf3b


---
If your project is set up for it, you can reply to this email and have your
reply appear on GitHub as well. If your project does not have this feature
enabled and wishes so, or if the feature is enabled but not working, please
contact infrastructure at infrastructure@apache.org or file a JIRA ticket
with INFRA.
---

[GitHub] couchdb-fauxton issue #761: New replication

Posted by justin-mcdavid-ibm <gi...@git.apache.org>.
Github user justin-mcdavid-ibm commented on the issue:

    https://github.com/apache/couchdb-fauxton/pull/761
  
    This is looking better and better.  There are a few bugs we still want to squish, but I think we're almost there.
    
    # Create Replication Page
    
    1. The Create Replication page should not have the polling or refresh components.
    2. The dropdown arrows and the X for clearing the custom-doc field are picking up the Fauxton red hover state, rather than the Cloudant orange.
    3. Most selected/entered text in the completed form is now #555555, However text in the Source Name dropdown is #333333.  I'd previously was hoping that all that text could be consistently #333333. If that's too much of a pain, I'd settle for consistently #555555.
    
    # Activity Page
    
    1. The hyperlink highlighting for local dbs listed in either source or target columns is being picked up by the final forward slash before the database name starts.  Might be tricky to fix, as I see that line-breaks are also happening before that final slash.
    2. The down arrow for column sort is picking up Fauxton red, rather than Cloudant Orange
    
    # Dialogues
    
    1. In the last sentence of the Fix Document Conflict Dialogue, please change "Replicationed documents" to "replicated documents."
    2. Remove the unstyled "Close" button on the error-message dialogue.
    <img width="253" alt="screen shot 2016-11-10 at 2 14 50 pm" src="https://cloud.githubusercontent.com/assets/12969375/20197785/208ba1f4-a756-11e6-8426-a16eda4c74c6.png">
    <img width="585" alt="screen shot 2016-11-10 at 2 54 51 pm" src="https://cloud.githubusercontent.com/assets/12969375/20197793/2884791c-a756-11e6-98ff-c4356f004ac5.png">
    <img width="1148" alt="screen shot 2016-11-10 at 2 59 14 pm" src="https://cloud.githubusercontent.com/assets/12969375/20197865/7c0b4052-a756-11e6-8b16-41c853348cc0.png">
    <img width="458" alt="screen shot 2016-11-10 at 1 57 39 pm" src="https://cloud.githubusercontent.com/assets/12969375/20197878/83f1c976-a756-11e6-91d6-f26c1bd7fa62.png">



---
If your project is set up for it, you can reply to this email and have your
reply appear on GitHub as well. If your project does not have this feature
enabled and wishes so, or if the feature is enabled but not working, please
contact infrastructure at infrastructure@apache.org or file a JIRA ticket
with INFRA.
---

[GitHub] couchdb-fauxton issue #761: New replication

Posted by garrensmith <gi...@git.apache.org>.
Github user garrensmith commented on the issue:

    https://github.com/apache/couchdb-fauxton/pull/761
  
    Merged!!!!. Thanks @benkeen and @justin-mcdavid-ibm for the awesome help in this. 


---
If your project is set up for it, you can reply to this email and have your
reply appear on GitHub as well. If your project does not have this feature
enabled and wishes so, or if the feature is enabled but not working, please
contact infrastructure at infrastructure@apache.org or file a JIRA ticket
with INFRA.
---

[GitHub] couchdb-fauxton issue #761: New replication

Posted by robertkowalski <gi...@git.apache.org>.
Github user robertkowalski commented on the issue:

    https://github.com/apache/couchdb-fauxton/pull/761
  
    wow @garrensmith and @justin-mcdavid-ibm that is really cool stuff i am super excited


---
If your project is set up for it, you can reply to this email and have your
reply appear on GitHub as well. If your project does not have this feature
enabled and wishes so, or if the feature is enabled but not working, please
contact infrastructure at infrastructure@apache.org or file a JIRA ticket
with INFRA.
---

[GitHub] couchdb-fauxton issue #761: New replication

Posted by robertkowalski <gi...@git.apache.org>.
Github user robertkowalski commented on the issue:

    https://github.com/apache/couchdb-fauxton/pull/761
  
    issue 1
    
    1) take a cloudant accoutn and database
    2) put your cloudant account into the url field, e.g. "https://foo:bar@example.com/mydatabase
    3) select target: local database enter name
    4) click replicate
    5) enter password
    6) nothing happens - expected "password is wrong message"
    7) i'm quite sure my password  is right?
    
    ![image](https://cloud.githubusercontent.com/assets/298166/20215649/1a1b2518-a816-11e6-8fee-a3dcd6f28c7d.png)



---
If your project is set up for it, you can reply to this email and have your
reply appear on GitHub as well. If your project does not have this feature
enabled and wishes so, or if the feature is enabled but not working, please
contact infrastructure at infrastructure@apache.org or file a JIRA ticket
with INFRA.
---

[GitHub] couchdb-fauxton issue #761: New replication

Posted by justin-mcdavid-ibm <gi...@git.apache.org>.
Github user justin-mcdavid-ibm commented on the issue:

    https://github.com/apache/couchdb-fauxton/pull/761
  
    Hey Garren,
    
    Great work.  Thanks for all the effort that you put into this.
    
    The UI looks ready to go. Everything appears to be behaving as it should.
    
    +1


---
If your project is set up for it, you can reply to this email and have your
reply appear on GitHub as well. If your project does not have this feature
enabled and wishes so, or if the feature is enabled but not working, please
contact infrastructure at infrastructure@apache.org or file a JIRA ticket
with INFRA.
---

[GitHub] couchdb-fauxton pull request #761: New replication

Posted by michellephung <gi...@git.apache.org>.
Github user michellephung commented on a diff in the pull request:

    https://github.com/apache/couchdb-fauxton/pull/761#discussion_r75611166
  
    --- Diff: app/addons/replication/components.react.jsx ---
    @@ -0,0 +1,204 @@
    +// Licensed under the Apache License, Version 2.0 (the "License"); you may not
    +// use this file except in compliance with the License. You may obtain a copy of
    +// the License at
    +//
    +//   http://www.apache.org/licenses/LICENSE-2.0
    +//
    +// Unless required by applicable law or agreed to in writing, software
    +// distributed under the License is distributed on an "AS IS" BASIS, WITHOUT
    +// WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. See the
    +// License for the specific language governing permissions and limitations under
    +// the License.
    +import app from '../../app';
    +import FauxtonAPI from '../../core/api';
    +import React from 'react';
    +import Constants from './constants';
    +import Helpers from './helpers';
    +import Components from '../components/react-components.react';
    +import AuthComponents from '../auth/components.react';
    +import ReactSelect from 'react-select';
    +
    +const {LoadLines, StyledSelect, ConfirmButton} = Components;
    +const PasswordModal = AuthComponents.PasswordModal;
    +
    +class ReplicationSourceRow extends React.Component {
    +  render () {
    +    const { replicationSource, databases, sourceDatabase, remoteSource, onChange} = this.props;
    +
    +    if (replicationSource === Constants.REPLICATION_SOURCE.LOCAL) {
    +      return (
    +        <div className="replication-source-name-row row">
    +          <div className="span3">
    +            Source Name:
    +          </div>
    +          <div className="span7">
    +            <ReactSelect
    +              name="source-name"
    +              value={sourceDatabase}
    +              placeholder="Database name"
    +              options={Helpers.getReactSelectOptions(databases)}
    +              clearable={false}
    +              onChange={(selected) => Actions.updateFormField('sourceDatabase', selected.value)} />
    +          </div>
    +        </div>
    +      );
    +    }
    +
    +    return (
    +      <div>
    +        <div className="row">
    +          <div className="span3">Database URL:</div>
    +          <div className="span7">
    +            <input type="text" className="connection-url" placeholder="https://" value={remoteSource}
    +              onChange={(e) => onChange(e.target.value)} />
    +            <div className="connection-url-example">e.g. https://$REMOTE_USERNAME:$REMOTE_PASSWORD@$REMOTE_SERVER/$DATABASE</div>
    --- End diff --
    
    maybe we should put this on 3 lines? it's long


---
If your project is set up for it, you can reply to this email and have your
reply appear on GitHub as well. If your project does not have this feature
enabled and wishes so, or if the feature is enabled but not working, please
contact infrastructure at infrastructure@apache.org or file a JIRA ticket
with INFRA.
---

[GitHub] couchdb-fauxton pull request #761: New replication

Posted by michellephung <gi...@git.apache.org>.
Github user michellephung commented on a diff in the pull request:

    https://github.com/apache/couchdb-fauxton/pull/761#discussion_r75611392
  
    --- Diff: app/addons/replication/components/source.js ---
    @@ -0,0 +1,164 @@
    +// Licensed under the Apache License, Version 2.0 (the "License"); you may not
    +// use this file except in compliance with the License. You may obtain a copy of
    +// the License at
    +//
    +//   http://www.apache.org/licenses/LICENSE-2.0
    +//
    +// Unless required by applicable law or agreed to in writing, software
    +// distributed under the License is distributed on an "AS IS" BASIS, WITHOUT
    +// WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. See the
    +// License for the specific language governing permissions and limitations under
    +// the License.
    +import React from 'react';
    +import Constants from '../constants';
    +import Components from '../../components/react-components.react';
    +import ReactSelect from 'react-select';
    +
    +const { StyledSelect } = Components;
    +
    +const RemoteSourceInput = ({onChange, value}) =>
    +  <div className="replication-section">
    +    <div className="replication-input-label">Database URL:</div>
    +    <div className="">
    +      <input type="text" className="replication-remote-connection-url" placeholder="https://" value={value}
    +        onChange={(e) => onChange(e.target.value)} />
    +      <div className="replication-remote-connection-url-text">e.g. https://$REMOTE_USERNAME:$REMOTE_PASSWORD@$REMOTE_SERVER/$DATABASE</div>
    +    </div>
    +  </div>;
    +
    +RemoteSourceInput.propTypes = {
    +  value: React.PropTypes.string.isRequired,
    +  onChange: React.PropTypes.func.isRequired
    +};
    +
    +const LocalSourceInput = ({value, onChange, databases}) => {
    +  const options = databases.map(db => ({value: db, label: db}));
    +  return (
    +    <div className="replication-section">
    +      <div className="replication-input-label">
    +        Source Name:
    +      </div>
    +      <div className="replication-input-react-select">
    +        <ReactSelect
    +          name="source-name"
    +          value={value}
    +          placeholder="Database name"
    +          options={options}
    +          clearable={false}
    +          onChange={({value}) => onChange(value)} />
    +      </div>
    +    </div>
    +  );
    +};
    +
    +LocalSourceInput.propTypes = {
    +  value: React.PropTypes.string.isRequired,
    +  databases: React.PropTypes.array.isRequired,
    +  onChange: React.PropTypes.func.isRequired
    +};
    +
    +const ReplicationSourceRow = ({replicationSource, databases, sourceDatabase, remoteSource, onChangeRemote, onChangeLocal}) => {
    +  if (replicationSource === Constants.REPLICATION_SOURCE.LOCAL) {
    +    return <LocalSourceInput
    +      value={sourceDatabase}
    +      databases={databases}
    +      onChange={onChangeLocal}
    +           />;
    +  }
    +
    +  return <RemoteSourceInput value={remoteSource} onChange={onChangeRemote} />;
    +};
    +
    +ReplicationSourceRow.propTypes = {
    +  replicationSource: React.PropTypes.string.isRequired,
    +  databases: React.PropTypes.array.isRequired,
    +  sourceDatabase: React.PropTypes.string.isRequired,
    +  remoteSource: React.PropTypes.string.isRequired,
    +  onChangeRemote: React.PropTypes.func.isRequired,
    +  onChangeLocal: React.PropTypes.func.isRequired
    +};
    +
    +const replicationSourceSelectOptions = () => {
    +  return [
    +    { value: '', label: 'Select source' },
    +    { value: Constants.REPLICATION_SOURCE.LOCAL, label: 'Local database' },
    +    { value: Constants.REPLICATION_SOURCE.REMOTE, label: 'Remote database' }
    +  ].map((option) => {
    +    return (
    +      <option value={option.value} key={option.value}>{option.label}</option>
    +    );
    +  });
    +};
    +
    +export const ReplicationSourceSelect = ({onChange, value}) => {
    +
    +  return (
    +    <div className="replication-section">
    +      <div className="replication-input-label">
    +        Replication Source:
    +      </div>
    +      <div className="replication-input-select">
    +        <StyledSelect
    +          selectContent={replicationSourceSelectOptions()}
    +          selectChange={(e) => onChange(e.target.value)}
    +          selectId="replication-source"
    +          selectValue={value} />
    +      </div>
    +    </div>
    +  );
    +};
    +
    +ReplicationSourceSelect.propTypes = {
    +  value: React.PropTypes.string.isRequired,
    +  onChange: React.PropTypes.func.isRequired
    +};
    +
    +export class ReplicationSource extends React.Component {
    +
    +  getReplicationSourceRow () {
    +    const {
    +      replicationSource,
    +      sourceDatabase,
    +      onLocalSourceChange,
    +      onRemoteSourceChange,
    +      remoteSource,
    +      databases
    +    } = this.props;
    +
    +    if (!replicationSource) {
    +      return null;
    +    }
    +
    +    return <ReplicationSourceRow
    +      replicationSource={replicationSource}
    +      databases={databases}
    +      sourceDatabase={sourceDatabase}
    +      remoteSource={remoteSource}
    +      onChangeLocal={onLocalSourceChange}
    +      onChangeRemote={onRemoteSourceChange}
    +           />;
    +  }
    +
    +  render () {
    +    const {replicationSource, onSourceSelect, sourceDatabase, remoteSource, databases} = this.props;
    +    const Actions = {};
    +    return (
    +      <div>
    +        <ReplicationSourceSelect
    +          onChange={onSourceSelect}
    +          value={replicationSource}
    +        />
    --- End diff --
    
    the ws on this one looks good :)


---
If your project is set up for it, you can reply to this email and have your
reply appear on GitHub as well. If your project does not have this feature
enabled and wishes so, or if the feature is enabled but not working, please
contact infrastructure at infrastructure@apache.org or file a JIRA ticket
with INFRA.
---

[GitHub] couchdb-fauxton pull request #761: New replication

Posted by garrensmith <gi...@git.apache.org>.
Github user garrensmith closed the pull request at:

    https://github.com/apache/couchdb-fauxton/pull/761


---
If your project is set up for it, you can reply to this email and have your
reply appear on GitHub as well. If your project does not have this feature
enabled and wishes so, or if the feature is enabled but not working, please
contact infrastructure at infrastructure@apache.org or file a JIRA ticket
with INFRA.
---

[GitHub] couchdb-fauxton pull request #761: New replication

Posted by michellephung <gi...@git.apache.org>.
Github user michellephung commented on a diff in the pull request:

    https://github.com/apache/couchdb-fauxton/pull/761#discussion_r75611296
  
    --- Diff: app/addons/replication/components/options.js ---
    @@ -0,0 +1,92 @@
    +// Licensed under the Apache License, Version 2.0 (the "License"); you may not
    +// use this file except in compliance with the License. You may obtain a copy of
    +// the License at
    +//
    +//   http://www.apache.org/licenses/LICENSE-2.0
    +//
    +// Unless required by applicable law or agreed to in writing, software
    +// distributed under the License is distributed on an "AS IS" BASIS, WITHOUT
    +// WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. See the
    +// License for the specific language governing permissions and limitations under
    +// the License.
    +import React from 'react';
    +import Constants from '../constants';
    +import Components from '../../components/react-components.react';
    +import ReactSelect from 'react-select';
    +
    +const { StyledSelect } = Components;
    +
    +const getReplicationTypeOptions = () => {
    +  return [
    +    { value: Constants.REPLICATION_TYPE.ONE_TIME, label: 'One time' },
    +    { value: Constants.REPLICATION_TYPE.CONTINUOUS, label: 'Continuous' }
    +  ].map(option => <option value={option.value} key={option.value}>{option.label}</option>);
    +};
    +
    +const ReplicationType = ({value, onChange}) => {
    +  return (
    +    <div className="replication-section">
    +      <div className="replication-input-label">
    +        Replication Type:
    +      </div>
    +      <div className="replication-input-select">
    +        <StyledSelect
    +          selectContent={getReplicationTypeOptions()}
    +          selectChange={(e) => onChange(e.target.value)}
    +          selectId="replication-target"
    +          selectValue={value} />
    +      </div>
    +    </div>
    +  );
    +};
    +
    +ReplicationType.propTypes = {
    +  value: React.PropTypes.string.isRequired,
    +  onChange: React.PropTypes.func.isRequired
    +};
    +
    +const ReplicationDoc = ({value, onChange}) =>
    +<div className="replication-section">
    +  <div className="replication-input-label">
    +    Replication Document:
    +  </div>
    +  <div className="replication-doc-name">
    +    <span className="fonticon fonticon-cancel replication-doc-name-icon" title="Clear field"
    +      onClick={(e) => onChange('')} />
    +    <input type="text" className="replication-doc-name-input" placeholder="Custom, new ID (optional)" value={value}
    +      onChange={(e) => onChange(e.target.value)}/>
    --- End diff --
    
    starting to notice a pattern... is there some reason the inputs properties are inline?


---
If your project is set up for it, you can reply to this email and have your
reply appear on GitHub as well. If your project does not have this feature
enabled and wishes so, or if the feature is enabled but not working, please
contact infrastructure at infrastructure@apache.org or file a JIRA ticket
with INFRA.
---

[GitHub] couchdb-fauxton pull request #761: New replication

Posted by robertkowalski <gi...@git.apache.org>.
Github user robertkowalski commented on a diff in the pull request:

    https://github.com/apache/couchdb-fauxton/pull/761#discussion_r87580975
  
    --- Diff: app/addons/auth/components.react.jsx ---
    @@ -302,9 +305,87 @@ var CreateAdminSidebar = React.createClass({
       }
     });
     
    +
    +class PasswordModal extends React.Component {
    +  constructor (props) {
    +    super(props);
    +    this.state = {
    +      password: ''
    +    };
    +    this.authenticate = this.authenticate.bind(this);
    +    this.onKeyPress = this.onKeyPress.bind(this);
    +  }
    +
    +  // clicking <Enter> should submit the form
    +  onKeyPress (e) {
    +    if (e.key === 'Enter') {
    +      this.authenticate();
    +    }
    +  }
    +
    +  // default authentication function. This can be overridden via props if you want to do something different
    +  authenticate () {
    +    const username = app.session.get('userCtx').name; // yuck. But simplest for now until logging in publishes the user data
    --- End diff --
    
    agreed


---
If your project is set up for it, you can reply to this email and have your
reply appear on GitHub as well. If your project does not have this feature
enabled and wishes so, or if the feature is enabled but not working, please
contact infrastructure at infrastructure@apache.org or file a JIRA ticket
with INFRA.
---

[GitHub] couchdb-fauxton pull request #761: New replication

Posted by michellephung <gi...@git.apache.org>.
Github user michellephung commented on a diff in the pull request:

    https://github.com/apache/couchdb-fauxton/pull/761#discussion_r74869907
  
    --- Diff: app/addons/replication/assets/less/replication.less ---
    @@ -11,187 +11,102 @@
     // the License.
     
     @import "../../../../../assets/less/variables.less";
    +@import "../../../../../assets/less/mixins.less";
     
    -#replication {
    -  position: relative;
    -  max-width: none;
    -  width: auto;
    +.replication-page {
    +  font-size: 14px;
     
    -  .form_set {
    -    width: 350px;
    -    display: inline-block;
    -    border: 1px solid @greyBrownLighter;
    -    padding: 15px 10px 0;
    -    margin-bottom: 20px;
    -    &.middle {
    -      width: 100px;
    -      border: none;
    -      position: relative;
    -      height: 100px;
    -      margin: 0;
    -    }
    -    input, select {
    -      margin: 0 0 16px 5px;
    -      height: 40px;
    -      width: 318px;
    -    }
    -    .btn-group {
    -      margin: 0 0 16px 5px;
    -      .btn {
    -        padding: 10px 57px;
    -      }
    -    }
    -    &.local {
    -      .local_option {
    -        display: block;
    -      }
    -      .remote_option {
    -        display: none;
    -      }
    -      .local-btn {
    -        background-color: @brandPrimary;
    -        color: #fff;
    -      }
    -      .remote-btn {
    -        background-color: #f5f5f5;
    -        color: @fontGrey;
    -      }
    -    }
    -    .local_option {
    -      display: none;
    -    }
    -    .remote-btn {
    -      background-color: @brandPrimary;
    -      color: #fff;
    -    }
    +  input, select {
    +    font-size: 14px;
    +  }
    +  input {
    +    width: 246px;
    +  }
    +  select {
    +    width: 246px;
    +    margin-bottom: 10px;
    +    background-color: white;
    +    border: 1px solid #cccccc;
    +  }
    +  .styled-select {
    +    width: 250px;
       }
     
    -
    -  .options {
    -    position: relative;
    -    &:after {
    -      content: '';
    -      display: block;
    -      position: absolute;
    -      right: -16px;
    -      top: 9px;
    -      width: 0;
    -      height: 0;
    -      border-left: 5px solid transparent;
    -      border-right: 5px solid transparent;
    -      border-bottom: 5px solid black;
    -      border-top: none;
    -    }
    -    &.off {
    -      &:after {
    -      content: '';
    -      display: block;
    -      position: absolute;
    -      right: -16px;
    -      top: 9px;
    -      width: 0;
    -      height: 0;
    -      border-left: 5px solid transparent;
    -      border-right: 5px solid transparent;
    -      border-bottom: none;
    -      border-top: 5px solid black;
    -      }
    -    }
    +  .span3 {
    +    text-align: right;
    +    margin-top: 12px;
       }
    -  .control-group {
    -    label {
    -      float: left;
    -      min-height: 30px;
    -      vertical-align: top;
    -      padding-right: 5px;
    -      min-width: 130px;
    -      padding-left: 0px;
    -    }
    -    input[type=radio],
    -    input[type=checkbox] {
    -      margin: 0 0 2px 0;
    +  .remote-connection-details {
    +    margin: 15px 0;
    +  }
    +  .connection-url {
    +    width: 100%;
    +  }
    +  .buttons-row {
    +    margin-top: 10px;
    +    a {
    +      padding: 12px;
         }
       }
    +  .typeahead {
    +    width: 100%;
    +  }
     
    -  .circle {
    -    z-index: 0;
    -    position: absolute;
    -    top: 20px;
    -    left: 15px;
    -
    -    &:after {
    -      width: 70px;
    -      height: 70px;
    -      content: '';
    -      display: block;
    -      position: relative;
    -      margin: 0 auto;
    -      border: 1px solid @greyBrownLighter;
    -      -webkit-border-radius: 40px;
    -      -moz-border-radius: 40px;
    -      border-radius:40px;
    -    }
    +  hr {
    +    margin: 6px 0 15px;
    +  }
    +  .section-header {
    +    font-weight: bold;
    +    font-size: 14pt;
       }
    -  .swap {
    -    text-decoration: none;
    -    z-index: 30;
    +}
    +
    +#dashboard-content .replication-page {
    +  padding-top: 25px;
    +}
    +
    +.connection-url-example {
    +  font-size: 9pt;
    +  color: #999999;
    +  margin-bottom: 8px;
    +}
    +
    +.custom-id-field {
    +  position: relative;
    +  width: 250px;
    +
    +  span.fonticon {
         cursor: pointer;
         position: absolute;
    -    font-size: 40px;
    -    width: 27px;
    -    height: 12px;
    -    top: 31px;
    -    left: 30px;
    +    right: 6px;
    +    top: 8px;
    +    font-size: 11px;
    +    padding: 8px;
    +    color: #999999;
    +    .transition(all 0.25s linear);
         &:hover {
    -      color: @greyBrownLighter;
    +      color: #333333;
    +    }
    +    input {
    +      padding-right: 32px;
         }
       }
     }
     
    -#replicationStatus {
    -  &.showHeader {
    -    li.header {
    -      display: block;
    -      border: none;
    -    }
    -    ul {
    -      border:1px solid @greyBrownLighter;
    -    }
    +
    +body .Select div.Select-control {
    --- End diff --
    
    hey :D 
    
    I think the css specified in `body .Select div.Select-control` should move into the `.replication-page` brackets, it's nudging the jump-to-db input box on the all_dbs page over:
    
    ![screen shot 2016-08-15 at 10 27 30 pm](https://cloud.githubusercontent.com/assets/836039/17686546/7665bf9c-633b-11e6-9730-70e38578f144.png)
     
    
    also if you have time, move the other css into there too ;) so they can all be together


---
If your project is set up for it, you can reply to this email and have your
reply appear on GitHub as well. If your project does not have this feature
enabled and wishes so, or if the feature is enabled but not working, please
contact infrastructure at infrastructure@apache.org or file a JIRA ticket
with INFRA.
---

[GitHub] couchdb-fauxton issue #761: New replication

Posted by garrensmith <gi...@git.apache.org>.
Github user garrensmith commented on the issue:

    https://github.com/apache/couchdb-fauxton/pull/761
  
    @robertkowalski with the admin party issue, I think the best fix there is to not show a password if the user is in admin party mode


---
If your project is set up for it, you can reply to this email and have your
reply appear on GitHub as well. If your project does not have this feature
enabled and wishes so, or if the feature is enabled but not working, please
contact infrastructure at infrastructure@apache.org or file a JIRA ticket
with INFRA.
---

[GitHub] couchdb-fauxton pull request #761: New replication

Posted by robertkowalski <gi...@git.apache.org>.
Github user robertkowalski commented on a diff in the pull request:

    https://github.com/apache/couchdb-fauxton/pull/761#discussion_r87582534
  
    --- Diff: app/addons/replication/assets/less/replication.less ---
    @@ -11,187 +11,288 @@
     // the License.
     
     @import "../../../../../assets/less/variables.less";
    +@import "../../../../../assets/less/mixins.less";
     
    -#replication {
    -  position: relative;
    -  max-width: none;
    -  width: auto;
    -
    -  .form_set {
    -    width: 350px;
    -    display: inline-block;
    -    border: 1px solid @greyBrownLighter;
    -    padding: 15px 10px 0;
    -    margin-bottom: 20px;
    -    &.middle {
    -      width: 100px;
    -      border: none;
    -      position: relative;
    -      height: 100px;
    -      margin: 0;
    -    }
    -    input, select {
    -      margin: 0 0 16px 5px;
    -      height: 40px;
    -      width: 318px;
    -    }
    -    .btn-group {
    -      margin: 0 0 16px 5px;
    -      .btn {
    -        padding: 10px 57px;
    -      }
    -    }
    -    &.local {
    -      .local_option {
    -        display: block;
    -      }
    -      .remote_option {
    -        display: none;
    -      }
    -      .local-btn {
    -        background-color: @brandPrimary;
    -        color: #fff;
    -      }
    -      .remote-btn {
    -        background-color: #f5f5f5;
    -        color: @fontGrey;
    -      }
    -    }
    -    .local_option {
    -      display: none;
    -    }
    -    .remote-btn {
    -      background-color: @brandPrimary;
    -      color: #fff;
    -    }
    -  }
    +div.replication-page {
    +  padding-top: 25px !important;
    +  display: flex;
    +  flex-direction: column;
    +  align-items: center;
    +}
     
    +.replication-section {
    +  display: flex;
    +  flex-flow: row wrap;
    +  justify-content: flex-start;
    +}
     
    -  .options {
    -    position: relative;
    -    &:after {
    -      content: '';
    -      display: block;
    -      position: absolute;
    -      right: -16px;
    -      top: 9px;
    -      width: 0;
    -      height: 0;
    -      border-left: 5px solid transparent;
    -      border-right: 5px solid transparent;
    -      border-bottom: 5px solid black;
    -      border-top: none;
    -    }
    -    &.off {
    -      &:after {
    -      content: '';
    -      display: block;
    -      position: absolute;
    -      right: -16px;
    -      top: 9px;
    -      width: 0;
    -      height: 0;
    -      border-left: 5px solid transparent;
    -      border-right: 5px solid transparent;
    -      border-bottom: none;
    -      border-top: 5px solid black;
    -      }
    -    }
    -  }
    -  .control-group {
    -    label {
    -      float: left;
    -      min-height: 30px;
    -      vertical-align: top;
    -      padding-right: 5px;
    -      min-width: 130px;
    -      padding-left: 0px;
    -    }
    -    input[type=radio],
    -    input[type=checkbox] {
    -      margin: 0 0 2px 0;
    -    }
    -  }
    +.replication-seperator {
    --- End diff --
    
    wouldn't it be  `.replication__seperator` or am i missing someting?


---
If your project is set up for it, you can reply to this email and have your
reply appear on GitHub as well. If your project does not have this feature
enabled and wishes so, or if the feature is enabled but not working, please
contact infrastructure at infrastructure@apache.org or file a JIRA ticket
with INFRA.
---

[GitHub] couchdb-fauxton pull request #761: New replication

Posted by michellephung <gi...@git.apache.org>.
Github user michellephung commented on a diff in the pull request:

    https://github.com/apache/couchdb-fauxton/pull/761#discussion_r75611442
  
    --- Diff: app/addons/replication/components/target.js ---
    @@ -0,0 +1,202 @@
    +// Licensed under the Apache License, Version 2.0 (the "License"); you may not
    +// use this file except in compliance with the License. You may obtain a copy of
    +// the License at
    +//
    +//   http://www.apache.org/licenses/LICENSE-2.0
    +//
    +// Unless required by applicable law or agreed to in writing, software
    +// distributed under the License is distributed on an "AS IS" BASIS, WITHOUT
    +// WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. See the
    +// License for the specific language governing permissions and limitations under
    +// the License.
    +import React from 'react';
    +import Constants from '../constants';
    +import Components from '../../components/react-components.react';
    +import ReactSelect from 'react-select';
    +
    +const { StyledSelect } = Components;
    +
    +const replicationTargetSourceOptions = () => {
    +  return [
    +    { value: '', label: 'Select target' },
    +    { value: Constants.REPLICATION_TARGET.EXISTING_LOCAL_DATABASE, label: 'Existing local database' },
    +    { value: Constants.REPLICATION_TARGET.EXISTING_REMOTE_DATABASE, label: 'Existing remote database' },
    +    { value: Constants.REPLICATION_TARGET.NEW_LOCAL_DATABASE, label: 'New local database' },
    +    { value: Constants.REPLICATION_TARGET.NEW_REMOTE_DATABASE, label: 'New remote database' }
    +  ].map((option) => {
    +    return (
    +      <option value={option.value} key={option.value}>{option.label}</option>
    +    );
    +  });
    +};
    +
    +const ReplicationTargetSelect = ({value, onChange}) => {
    +  return (
    +    <div className="replication-section">
    +      <div className="replication-input-label">
    +        Replication Target:
    +      </div>
    +      <div className="replication-input-select">
    +        <StyledSelect
    +          selectContent={replicationTargetSourceOptions()}
    +          selectChange={(e) => onChange(e.target.value)}
    +          selectId="replication-target"
    +          selectValue={value} />
    +      </div>
    +    </div>
    +  );
    +};
    +
    +ReplicationTargetSelect.propTypes = {
    +  value: React.PropTypes.string.isRequired,
    +  onChange: React.PropTypes.func.isRequired
    +};
    +
    +const RemoteTargetReplicationRow = ({onChange, value}) => {
    +  return (
    +    <div>
    +      <input type="text" className="replication-remote-connection-url" placeholder="https://" value={value}
    +        onChange={(e) => onChange(e.target.value)} />
    +      <div className="replication-remote-connection-url-text">e.g. https://$REMOTE_USERNAME:$REMOTE_PASSWORD@$REMOTE_SERVER/$DATABASE</div>
    +    </div>
    +  );
    +};
    +
    +RemoteTargetReplicationRow.propTypes = {
    +  value: React.PropTypes.string.isRequired,
    +  onChange: React.PropTypes.func.isRequired
    +};
    +
    +const ExistingLocalTargetReplicationRow = ({onChange, value, databases}) => {
    +  const options = databases.map(db => ({value: db, label: db}));
    +  return (
    +    <div className="replication-input-react-select">
    +      <ReactSelect
    +        value={value}
    +        options={options}
    +        placeholder="Database name"
    +        clearable={false}
    +        onChange={({value}) => onChange(value)}
    +      />
    +    </div>
    +  );
    +};
    +
    +ExistingLocalTargetReplicationRow.propTypes = {
    +  value: React.PropTypes.string.isRequired,
    +  databases: React.PropTypes.array.isRequired,
    +  onChange: React.PropTypes.func.isRequired
    +};
    +
    +const NewLocalTargetReplicationRow = ({onChange, value}) =>
    +  <input
    +    type="text"
    +    className="replication-new-input"
    +    placeholder="Database name"
    +    value={value}
    +    onChange={(e) => onChange(e.target.value)}
    +  />;
    +
    +NewLocalTargetReplicationRow.propTypes = {
    +  value: React.PropTypes.string.isRequired,
    +  onChange: React.PropTypes.func.isRequired
    +};
    +
    +const ReplicationTargetRow = ({
    +  replicationTarget,
    +  onLocalTargetChange,
    +  onRemoteTargetChange,
    +  localTarget,
    +  remoteTarget,
    +  databases
    +}) => {
    +  if (!replicationTarget) {
    +    return null;
    +  }
    +  let input;
    +
    +  if (replicationTarget === Constants.REPLICATION_TARGET.NEW_LOCAL_DATABASE) {
    +    targetLabel = 'New Database:';
    +    input = <NewLocalTargetReplicationRow
    +      value={localTarget}
    +      onChange={onLocalTargetChange}
    +            />;
    --- End diff --
    
    ahh i get it


---
If your project is set up for it, you can reply to this email and have your
reply appear on GitHub as well. If your project does not have this feature
enabled and wishes so, or if the feature is enabled but not working, please
contact infrastructure at infrastructure@apache.org or file a JIRA ticket
with INFRA.
---

[GitHub] couchdb-fauxton issue #761: New replication

Posted by robertkowalski <gi...@git.apache.org>.
Github user robertkowalski commented on the issue:

    https://github.com/apache/couchdb-fauxton/pull/761
  
    
    
    
    <img width="610" alt="screen shot 2016-11-15 at 15 21 00" src="https://cloud.githubusercontent.com/assets/298166/20309147/28b87920-ab47-11e6-8fcc-bcd9cf9aa2dd.png">
    
    
    typo: Replcator DB Activity.


---
If your project is set up for it, you can reply to this email and have your
reply appear on GitHub as well. If your project does not have this feature
enabled and wishes so, or if the feature is enabled but not working, please
contact infrastructure at infrastructure@apache.org or file a JIRA ticket
with INFRA.
---

[GitHub] couchdb-fauxton issue #761: New replication

Posted by robertkowalski <gi...@git.apache.org>.
Github user robertkowalski commented on the issue:

    https://github.com/apache/couchdb-fauxton/pull/761
  
    +1 after fixing the typo


---
If your project is set up for it, you can reply to this email and have your
reply appear on GitHub as well. If your project does not have this feature
enabled and wishes so, or if the feature is enabled but not working, please
contact infrastructure at infrastructure@apache.org or file a JIRA ticket
with INFRA.
---

[GitHub] couchdb-fauxton pull request #761: New replication

Posted by michellephung <gi...@git.apache.org>.
Github user michellephung commented on a diff in the pull request:

    https://github.com/apache/couchdb-fauxton/pull/761#discussion_r75611317
  
    --- Diff: app/addons/replication/components/source.js ---
    @@ -0,0 +1,164 @@
    +// Licensed under the Apache License, Version 2.0 (the "License"); you may not
    +// use this file except in compliance with the License. You may obtain a copy of
    +// the License at
    +//
    +//   http://www.apache.org/licenses/LICENSE-2.0
    +//
    +// Unless required by applicable law or agreed to in writing, software
    +// distributed under the License is distributed on an "AS IS" BASIS, WITHOUT
    +// WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. See the
    +// License for the specific language governing permissions and limitations under
    +// the License.
    +import React from 'react';
    +import Constants from '../constants';
    +import Components from '../../components/react-components.react';
    +import ReactSelect from 'react-select';
    +
    +const { StyledSelect } = Components;
    +
    +const RemoteSourceInput = ({onChange, value}) =>
    +  <div className="replication-section">
    +    <div className="replication-input-label">Database URL:</div>
    +    <div className="">
    +      <input type="text" className="replication-remote-connection-url" placeholder="https://" value={value}
    +        onChange={(e) => onChange(e.target.value)} />
    +      <div className="replication-remote-connection-url-text">e.g. https://$REMOTE_USERNAME:$REMOTE_PASSWORD@$REMOTE_SERVER/$DATABASE</div>
    +    </div>
    +  </div>;
    +
    +RemoteSourceInput.propTypes = {
    +  value: React.PropTypes.string.isRequired,
    +  onChange: React.PropTypes.func.isRequired
    +};
    +
    +const LocalSourceInput = ({value, onChange, databases}) => {
    +  const options = databases.map(db => ({value: db, label: db}));
    +  return (
    +    <div className="replication-section">
    +      <div className="replication-input-label">
    +        Source Name:
    +      </div>
    +      <div className="replication-input-react-select">
    +        <ReactSelect
    +          name="source-name"
    +          value={value}
    +          placeholder="Database name"
    +          options={options}
    +          clearable={false}
    +          onChange={({value}) => onChange(value)} />
    +      </div>
    +    </div>
    +  );
    +};
    +
    +LocalSourceInput.propTypes = {
    +  value: React.PropTypes.string.isRequired,
    +  databases: React.PropTypes.array.isRequired,
    +  onChange: React.PropTypes.func.isRequired
    +};
    +
    +const ReplicationSourceRow = ({replicationSource, databases, sourceDatabase, remoteSource, onChangeRemote, onChangeLocal}) => {
    +  if (replicationSource === Constants.REPLICATION_SOURCE.LOCAL) {
    +    return <LocalSourceInput
    +      value={sourceDatabase}
    +      databases={databases}
    +      onChange={onChangeLocal}
    +           />;
    --- End diff --
    
    ws


---
If your project is set up for it, you can reply to this email and have your
reply appear on GitHub as well. If your project does not have this feature
enabled and wishes so, or if the feature is enabled but not working, please
contact infrastructure at infrastructure@apache.org or file a JIRA ticket
with INFRA.
---

[GitHub] couchdb-fauxton issue #761: New replication

Posted by garrensmith <gi...@git.apache.org>.
Github user garrensmith commented on the issue:

    https://github.com/apache/couchdb-fauxton/pull/761
  
    I've done a few fixes to the code and css, just to add consistency to where we moving with our React codebase. I think its working really nicely. I just need to write some unit tests for the React components. Just to note that local replication won't work in dev server mode. You can hack it by doing local replication then editing the url's in the `_replicator` document to point to the couchdb instance instead of the dev server.
    
    @benkeen and @michellephung, I would love your thoughts.


---
If your project is set up for it, you can reply to this email and have your
reply appear on GitHub as well. If your project does not have this feature
enabled and wishes so, or if the feature is enabled but not working, please
contact infrastructure at infrastructure@apache.org or file a JIRA ticket
with INFRA.
---

[GitHub] couchdb-fauxton issue #761: New replication

Posted by benkeen <gi...@git.apache.org>.
Github user benkeen commented on the issue:

    https://github.com/apache/couchdb-fauxton/pull/761
  
    Just looking over the code the changes look really tight, great stuff! 


---
If your project is set up for it, you can reply to this email and have your
reply appear on GitHub as well. If your project does not have this feature
enabled and wishes so, or if the feature is enabled but not working, please
contact infrastructure at infrastructure@apache.org or file a JIRA ticket
with INFRA.
---

[GitHub] couchdb-fauxton pull request #761: New replication

Posted by garrensmith <gi...@git.apache.org>.
Github user garrensmith commented on a diff in the pull request:

    https://github.com/apache/couchdb-fauxton/pull/761#discussion_r74889213
  
    --- Diff: app/addons/replication/assets/less/replication.less ---
    @@ -11,187 +11,102 @@
     // the License.
     
     @import "../../../../../assets/less/variables.less";
    +@import "../../../../../assets/less/mixins.less";
     
    -#replication {
    -  position: relative;
    -  max-width: none;
    -  width: auto;
    +.replication-page {
    +  font-size: 14px;
     
    -  .form_set {
    -    width: 350px;
    -    display: inline-block;
    -    border: 1px solid @greyBrownLighter;
    -    padding: 15px 10px 0;
    -    margin-bottom: 20px;
    -    &.middle {
    -      width: 100px;
    -      border: none;
    -      position: relative;
    -      height: 100px;
    -      margin: 0;
    -    }
    -    input, select {
    -      margin: 0 0 16px 5px;
    -      height: 40px;
    -      width: 318px;
    -    }
    -    .btn-group {
    -      margin: 0 0 16px 5px;
    -      .btn {
    -        padding: 10px 57px;
    -      }
    -    }
    -    &.local {
    -      .local_option {
    -        display: block;
    -      }
    -      .remote_option {
    -        display: none;
    -      }
    -      .local-btn {
    -        background-color: @brandPrimary;
    -        color: #fff;
    -      }
    -      .remote-btn {
    -        background-color: #f5f5f5;
    -        color: @fontGrey;
    -      }
    -    }
    -    .local_option {
    -      display: none;
    -    }
    -    .remote-btn {
    -      background-color: @brandPrimary;
    -      color: #fff;
    -    }
    +  input, select {
    +    font-size: 14px;
    +  }
    +  input {
    +    width: 246px;
    +  }
    +  select {
    +    width: 246px;
    +    margin-bottom: 10px;
    +    background-color: white;
    +    border: 1px solid #cccccc;
    +  }
    +  .styled-select {
    +    width: 250px;
       }
     
    -
    -  .options {
    -    position: relative;
    -    &:after {
    -      content: '';
    -      display: block;
    -      position: absolute;
    -      right: -16px;
    -      top: 9px;
    -      width: 0;
    -      height: 0;
    -      border-left: 5px solid transparent;
    -      border-right: 5px solid transparent;
    -      border-bottom: 5px solid black;
    -      border-top: none;
    -    }
    -    &.off {
    -      &:after {
    -      content: '';
    -      display: block;
    -      position: absolute;
    -      right: -16px;
    -      top: 9px;
    -      width: 0;
    -      height: 0;
    -      border-left: 5px solid transparent;
    -      border-right: 5px solid transparent;
    -      border-bottom: none;
    -      border-top: 5px solid black;
    -      }
    -    }
    +  .span3 {
    +    text-align: right;
    +    margin-top: 12px;
       }
    -  .control-group {
    -    label {
    -      float: left;
    -      min-height: 30px;
    -      vertical-align: top;
    -      padding-right: 5px;
    -      min-width: 130px;
    -      padding-left: 0px;
    -    }
    -    input[type=radio],
    -    input[type=checkbox] {
    -      margin: 0 0 2px 0;
    +  .remote-connection-details {
    +    margin: 15px 0;
    +  }
    +  .connection-url {
    +    width: 100%;
    +  }
    +  .buttons-row {
    +    margin-top: 10px;
    +    a {
    +      padding: 12px;
         }
       }
    +  .typeahead {
    +    width: 100%;
    +  }
     
    -  .circle {
    -    z-index: 0;
    -    position: absolute;
    -    top: 20px;
    -    left: 15px;
    -
    -    &:after {
    -      width: 70px;
    -      height: 70px;
    -      content: '';
    -      display: block;
    -      position: relative;
    -      margin: 0 auto;
    -      border: 1px solid @greyBrownLighter;
    -      -webkit-border-radius: 40px;
    -      -moz-border-radius: 40px;
    -      border-radius:40px;
    -    }
    +  hr {
    +    margin: 6px 0 15px;
    +  }
    +  .section-header {
    +    font-weight: bold;
    +    font-size: 14pt;
       }
    -  .swap {
    -    text-decoration: none;
    -    z-index: 30;
    +}
    +
    +#dashboard-content .replication-page {
    +  padding-top: 25px;
    +}
    +
    +.connection-url-example {
    +  font-size: 9pt;
    +  color: #999999;
    +  margin-bottom: 8px;
    +}
    +
    +.custom-id-field {
    +  position: relative;
    +  width: 250px;
    +
    +  span.fonticon {
         cursor: pointer;
         position: absolute;
    -    font-size: 40px;
    -    width: 27px;
    -    height: 12px;
    -    top: 31px;
    -    left: 30px;
    +    right: 6px;
    +    top: 8px;
    +    font-size: 11px;
    +    padding: 8px;
    +    color: #999999;
    +    .transition(all 0.25s linear);
         &:hover {
    -      color: @greyBrownLighter;
    +      color: #333333;
    +    }
    +    input {
    +      padding-right: 32px;
         }
       }
     }
     
    -#replicationStatus {
    -  &.showHeader {
    -    li.header {
    -      display: block;
    -      border: none;
    -    }
    -    ul {
    -      border:1px solid @greyBrownLighter;
    -    }
    +
    +body .Select div.Select-control {
    --- End diff --
    
    Awesome thanks Michelle. I'll make the changes.
    
    On 16 August 2016 at 05:04, Michelle Phung <no...@github.com> wrote:
    
    > In app/addons/replication/assets/less/replication.less
    > <https://github.com/apache/couchdb-fauxton/pull/761#discussion_r74870084>:
    >
    > >      }
    > >    }
    > >  }
    > >
    > > -#replicationStatus {
    > > -  &.showHeader {
    > > -    li.header {
    > > -      display: block;
    > > -      border: none;
    > > -    }
    > > -    ul {
    > > -      border:1px solid @greyBrownLighter;
    > > -    }
    > > +
    > > +body .Select div.Select-control {
    >
    > OK i did it in a gist, since i don't know how to add to this this pr. You
    > can copy and paste it:
    >
    > https://gist.github.com/michellephung/71b8658d38f37d67331c240e366fbf3b
    >
    > \u2014
    > You are receiving this because you authored the thread.
    > Reply to this email directly, view it on GitHub
    > <https://github.com/apache/couchdb-fauxton/pull/761/files/ed20c2db34e4b69515fd69e02c25531035e68d91#r74870084>,
    > or mute the thread
    > <https://github.com/notifications/unsubscribe-auth/AAK9AvjU3VYFG9yBTRw_7IdL1AJfDVt7ks5qgSiggaJpZM4JkZCx>
    > .
    >



---
If your project is set up for it, you can reply to this email and have your
reply appear on GitHub as well. If your project does not have this feature
enabled and wishes so, or if the feature is enabled but not working, please
contact infrastructure at infrastructure@apache.org or file a JIRA ticket
with INFRA.
---

[GitHub] couchdb-fauxton pull request #761: New replication

Posted by michellephung <gi...@git.apache.org>.
Github user michellephung commented on a diff in the pull request:

    https://github.com/apache/couchdb-fauxton/pull/761#discussion_r75611052
  
    --- Diff: app/addons/auth/components.react.jsx ---
    @@ -302,9 +303,72 @@ var CreateAdminSidebar = React.createClass({
       }
     });
     
    +
    +class PasswordModal extends React.Component {
    +  constructor (props) {
    +    super(props);
    +    this.state = {
    +      password: ''
    +    };
    +    this.authenticate = this.authenticate.bind(this);
    +    this.onKeyPress = this.onKeyPress.bind(this);
    +  }
    +
    +  // clicking <Enter> should submit the form
    +  onKeyPress (e) {
    +    if (e.key === 'Enter') {
    +      this.authenticate();
    +    }
    +  }
    +
    +  // default authentication function. This can be overridden via props if you want to do something different
    +  authenticate () {
    +    const username = app.session.get('userCtx').name; // yuck. But simplest for now until logging in publishes the user data
    +    this.props.onSubmit(username, this.state.password, this.props.onSuccess);
    +  }
    +
    +  render () {
    +    return (
    +      <Modal dialogClassName="enter-password-modal" show={this.props.visible} onHide={() => this.props.onClose()}>
    +        <Modal.Header closeButton={true}>
    +          <Modal.Title>Enter Password</Modal.Title>
    +        </Modal.Header>
    +        <Modal.Body>
    +          {this.props.modalMessage}
    +          <input type="password" placeholder="Enter your password" autoFocus={true} value={this.state.password}
    --- End diff --
    
    i think you can add some newlines in here


---
If your project is set up for it, you can reply to this email and have your
reply appear on GitHub as well. If your project does not have this feature
enabled and wishes so, or if the feature is enabled but not working, please
contact infrastructure at infrastructure@apache.org or file a JIRA ticket
with INFRA.
---

[GitHub] couchdb-fauxton issue #761: New replication

Posted by justin-mcdavid-ibm <gi...@git.apache.org>.
Github user justin-mcdavid-ibm commented on the issue:

    https://github.com/apache/couchdb-fauxton/pull/761
  
    Hey Garren-- This is looking great.
    
    Beyond the changes we talked about on video conference, here are some things I've noticed while playing around.  And I'm having problems getting remote->remote replication to work (I'm getting permissions errors that I'm not expecting), and local->remote are failing to complete.  So I'm not able to test some thing at this time.
    
    # Activity Page
    
    1. In-field text for "Filter replication" is 16px. Please reduce to 14px.  And let's get rid of the input box's padding; the box doesn't need to be so visually dominant.
    2. Remove the "Ok" button on error-message dialogue boxes
    3. To slightly improve readability, can we strip the first set of curly brackets off of displayed error messages?
    4. The Edit Replication (wrench) functionality breaks if the replication document ID starts with a forward slash.
    5. Can we have the Activity page column-sort default to State Time, descending from new-to-old?
    6. When you add the refresh options to the header, could you make sure that column-sort selection persists over refreshes or when the back-button is clicked? When I refresh via the browser, it's resetting my sort selection.
    
    # New Replication Page
    
    1. The "Clear" replication-clear-link text is 16px. Please reduce to 14px.  Also increase the left-padding of replication-clear-link from 12px to something like 12px 0 12px 24px (ow whatever will move it a similar distance to the right).
    2. On hover for truncated long values in dropdowns, can we have the full value display?
    3. Remover the API URL button from the header on this page, too.
    4. Change the title of the Replication Error dialogue to "Fix Document Conflict." Capitalize the first letter of the first paragraph in the message. Add the eraser icon (http://fontawesome.io/3.2.1/icon/eraser/) to the "Overwrite Existing Document" button.
    5. Malformed remote source/target URLs prevent a replication from being sent off when the Start Replication button is clicked, but there's no indicator of why the job failed.  Can we add highlighting to URL fields that are malformed once the Start Replication button is clicked?
    
    # Component issues?
    
    1. Long db names in the local-db dropdown list are hidden behind the slider (this is a component issue?). We should either give them some right-padding so that the slider doesn't cover them, or allow horizontal scroll in the window.
    2. The ellipses in truncated long values are running into the arrow on the right side of dropdowns. Truncating a character or two earlier would likely fix the issue. 
    3. In the fields of the form, font colors are not consistent between selected text (#333) and entered text (#555). Let's make them a consistent #333, to match the label color.
    4. Related, the ellipses for truncated values should also be #333 (they're currently picking up the color of in-field text).
    5. The .Select-arrow-zone icons are not consistently colored, and don't have consistent color states. They're #000 with no hover state before a value is selected. After a value is selected, they change to #999, with a hover state involving an odd border-top color-change. Hovers of #F3812D in Cloudant and #E73D34 for CouchDB would be better for all dropown-select arrows, as well as for the field-clearing Xs, as we have in the Replication document field.
    
    # Odd Ways to Break Things.
    
    1. If I create a job and specify a custom replication doc of /// the Replication Activity section fails to to load. If I go into _replicator and delete the doc, it comes back.  A couple of hours later, I now can't reproduce this, so it might have been a system hiccup. Or an odd bug that just happens on first /// creation.
    2. If I create a job and specify a custom replication doc of """ the replication doc never updates, even though the replication job completed. 
    
    Thanks again for all the work on this.



---
If your project is set up for it, you can reply to this email and have your
reply appear on GitHub as well. If your project does not have this feature
enabled and wishes so, or if the feature is enabled but not working, please
contact infrastructure at infrastructure@apache.org or file a JIRA ticket
with INFRA.
---

[GitHub] couchdb-fauxton pull request #761: New replication

Posted by michellephung <gi...@git.apache.org>.
Github user michellephung commented on a diff in the pull request:

    https://github.com/apache/couchdb-fauxton/pull/761#discussion_r75611474
  
    --- Diff: app/addons/replication/components/source.js ---
    @@ -0,0 +1,164 @@
    +// Licensed under the Apache License, Version 2.0 (the "License"); you may not
    +// use this file except in compliance with the License. You may obtain a copy of
    +// the License at
    +//
    +//   http://www.apache.org/licenses/LICENSE-2.0
    +//
    +// Unless required by applicable law or agreed to in writing, software
    +// distributed under the License is distributed on an "AS IS" BASIS, WITHOUT
    +// WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. See the
    +// License for the specific language governing permissions and limitations under
    +// the License.
    +import React from 'react';
    +import Constants from '../constants';
    +import Components from '../../components/react-components.react';
    +import ReactSelect from 'react-select';
    +
    +const { StyledSelect } = Components;
    +
    +const RemoteSourceInput = ({onChange, value}) =>
    +  <div className="replication-section">
    +    <div className="replication-input-label">Database URL:</div>
    +    <div className="">
    +      <input type="text" className="replication-remote-connection-url" placeholder="https://" value={value}
    +        onChange={(e) => onChange(e.target.value)} />
    +      <div className="replication-remote-connection-url-text">e.g. https://$REMOTE_USERNAME:$REMOTE_PASSWORD@$REMOTE_SERVER/$DATABASE</div>
    +    </div>
    +  </div>;
    +
    +RemoteSourceInput.propTypes = {
    +  value: React.PropTypes.string.isRequired,
    +  onChange: React.PropTypes.func.isRequired
    +};
    +
    +const LocalSourceInput = ({value, onChange, databases}) => {
    +  const options = databases.map(db => ({value: db, label: db}));
    +  return (
    +    <div className="replication-section">
    +      <div className="replication-input-label">
    +        Source Name:
    +      </div>
    +      <div className="replication-input-react-select">
    +        <ReactSelect
    +          name="source-name"
    +          value={value}
    +          placeholder="Database name"
    +          options={options}
    +          clearable={false}
    +          onChange={({value}) => onChange(value)} />
    +      </div>
    +    </div>
    +  );
    +};
    +
    +LocalSourceInput.propTypes = {
    +  value: React.PropTypes.string.isRequired,
    +  databases: React.PropTypes.array.isRequired,
    +  onChange: React.PropTypes.func.isRequired
    +};
    +
    +const ReplicationSourceRow = ({replicationSource, databases, sourceDatabase, remoteSource, onChangeRemote, onChangeLocal}) => {
    +  if (replicationSource === Constants.REPLICATION_SOURCE.LOCAL) {
    +    return <LocalSourceInput
    +      value={sourceDatabase}
    +      databases={databases}
    +      onChange={onChangeLocal}
    +           />;
    +  }
    +
    +  return <RemoteSourceInput value={remoteSource} onChange={onChangeRemote} />;
    +};
    +
    +ReplicationSourceRow.propTypes = {
    +  replicationSource: React.PropTypes.string.isRequired,
    +  databases: React.PropTypes.array.isRequired,
    +  sourceDatabase: React.PropTypes.string.isRequired,
    +  remoteSource: React.PropTypes.string.isRequired,
    +  onChangeRemote: React.PropTypes.func.isRequired,
    +  onChangeLocal: React.PropTypes.func.isRequired
    +};
    +
    +const replicationSourceSelectOptions = () => {
    +  return [
    +    { value: '', label: 'Select source' },
    +    { value: Constants.REPLICATION_SOURCE.LOCAL, label: 'Local database' },
    +    { value: Constants.REPLICATION_SOURCE.REMOTE, label: 'Remote database' }
    +  ].map((option) => {
    +    return (
    +      <option value={option.value} key={option.value}>{option.label}</option>
    +    );
    +  });
    +};
    +
    +export const ReplicationSourceSelect = ({onChange, value}) => {
    +
    +  return (
    +    <div className="replication-section">
    +      <div className="replication-input-label">
    +        Replication Source:
    +      </div>
    +      <div className="replication-input-select">
    +        <StyledSelect
    +          selectContent={replicationSourceSelectOptions()}
    +          selectChange={(e) => onChange(e.target.value)}
    +          selectId="replication-source"
    +          selectValue={value} />
    +      </div>
    +    </div>
    +  );
    +};
    +
    +ReplicationSourceSelect.propTypes = {
    +  value: React.PropTypes.string.isRequired,
    +  onChange: React.PropTypes.func.isRequired
    +};
    +
    +export class ReplicationSource extends React.Component {
    +
    +  getReplicationSourceRow () {
    +    const {
    +      replicationSource,
    +      sourceDatabase,
    +      onLocalSourceChange,
    +      onRemoteSourceChange,
    +      remoteSource,
    +      databases
    +    } = this.props;
    +
    +    if (!replicationSource) {
    +      return null;
    +    }
    +
    +    return <ReplicationSourceRow
    +      replicationSource={replicationSource}
    +      databases={databases}
    +      sourceDatabase={sourceDatabase}
    +      remoteSource={remoteSource}
    +      onChangeLocal={onLocalSourceChange}
    +      onChangeRemote={onRemoteSourceChange}
    +           />;
    --- End diff --
    
    ok nvm


---
If your project is set up for it, you can reply to this email and have your
reply appear on GitHub as well. If your project does not have this feature
enabled and wishes so, or if the feature is enabled but not working, please
contact infrastructure at infrastructure@apache.org or file a JIRA ticket
with INFRA.
---

[GitHub] couchdb-fauxton pull request #761: New replication

Posted by robertkowalski <gi...@git.apache.org>.
Github user robertkowalski commented on a diff in the pull request:

    https://github.com/apache/couchdb-fauxton/pull/761#discussion_r87580932
  
    --- Diff: app/addons/auth/actions.js ---
    @@ -28,88 +28,130 @@ var errorHandler = function (xhr, type, msg) {
     };
     
     
    -export default {
    +function login (username, password, urlBack) {
    +  var promise = FauxtonAPI.session.login(username, password);
    +
    +  promise.then(() => {
    +    FauxtonAPI.addNotification({ msg: FauxtonAPI.session.messages.loggedIn });
    +    if (urlBack) {
    +      return FauxtonAPI.navigate(urlBack);
    +    }
    +    FauxtonAPI.navigate('/');
    +  }, errorHandler);
    +}
    +
    +function changePassword (password, passwordConfirm) {
    +  var nodes = nodesStore.getNodes();
    +  var promise = FauxtonAPI.session.changePassword(password, passwordConfirm, nodes[0].node);
    +
    +  promise.then(() => {
    +    FauxtonAPI.addNotification({ msg: FauxtonAPI.session.messages.changePassword });
    +    FauxtonAPI.dispatch({ type: ActionTypes.AUTH_CLEAR_CHANGE_PWD_FIELDS });
    +  }, errorHandler);
    +}
    +
    +function updateChangePasswordField (value) {
    +  FauxtonAPI.dispatch({
    +    type: ActionTypes.AUTH_UPDATE_CHANGE_PWD_FIELD,
    +    value: value
    +  });
    +}
    +
    +function updateChangePasswordConfirmField (value) {
    +  FauxtonAPI.dispatch({
    +    type: ActionTypes.AUTH_UPDATE_CHANGE_PWD_CONFIRM_FIELD,
    +    value: value
    +  });
    +}
     
    -  login: function (username, password, urlBack) {
    -    var promise = FauxtonAPI.session.login(username, password);
    +function createAdmin (username, password, loginAfter) {
    +  var nodes = nodesStore.getNodes();
    +  var promise = FauxtonAPI.session.createAdmin(username, password, loginAfter, nodes[0].node);
     
    -    promise.then(function () {
    -      FauxtonAPI.addNotification({ msg: FauxtonAPI.session.messages.loggedIn });
    -      if (urlBack) {
    -        return FauxtonAPI.navigate(urlBack);
    -      }
    +  promise.then(() => {
    +    FauxtonAPI.addNotification({ msg: FauxtonAPI.session.messages.adminCreated });
    +    if (loginAfter) {
           FauxtonAPI.navigate('/');
    +    } else {
    +      FauxtonAPI.dispatch({ type: ActionTypes.AUTH_CLEAR_CREATE_ADMIN_FIELDS });
    +    }
    +  }, (xhr, type, msg) => {
    +    msg = xhr;
    +    if (arguments.length === 3) {
    +      msg = xhr.responseJSON.reason;
    +    }
    +    errorHandler(FauxtonAPI.session.messages.adminCreationFailedPrefix + ' ' + msg);
    +  });
    +}
    +
    +// simple authentication method - does nothing other than check creds
    +function authenticate (username, password, onSuccess) {
    +  $.ajax({
    +    cache: false,
    +    type: 'POST',
    +    url: '/_session',
    +    dataType: 'json',
    +    data: { name: username, password: password }
    +  }).then(() => {
    +    FauxtonAPI.dispatch({
    +      type: ActionTypes.AUTH_CREDS_VALID,
    +      options: { username: username, password: password }
         });
    -    promise.fail(errorHandler);
    -  },
    -
    -  changePassword: function (password, passwordConfirm) {
    -    var nodes = nodesStore.getNodes();
    -    var promise = FauxtonAPI.session.changePassword(password, passwordConfirm, nodes[0].node);
    -
    -    promise.done(function () {
    -      FauxtonAPI.addNotification({ msg: FauxtonAPI.session.messages.changePassword });
    -      FauxtonAPI.dispatch({ type: ActionTypes.AUTH_CLEAR_CHANGE_PWD_FIELDS });
    +    hidePasswordModal();
    +    onSuccess(username, password);
    +  }, () => {
    +    FauxtonAPI.addNotification({
    +      msg: 'Your password is incorrect.',
    +      type: 'error',
    +      clear: true
         });
    -
    -    promise.fail(errorHandler);
    -  },
    -
    -  updateChangePasswordField: function (value) {
         FauxtonAPI.dispatch({
    -      type: ActionTypes.AUTH_UPDATE_CHANGE_PWD_FIELD,
    -      value: value
    +      type: ActionTypes.AUTH_CREDS_INVALID,
    +      options: { username: username, password: password }
         });
    -  },
    +  });
    +}
     
    -  updateChangePasswordConfirmField: function (value) {
    -    FauxtonAPI.dispatch({
    -      type: ActionTypes.AUTH_UPDATE_CHANGE_PWD_CONFIRM_FIELD,
    -      value: value
    -    });
    -  },
    -
    -  createAdmin: function (username, password, loginAfter) {
    -    var nodes = nodesStore.getNodes();
    -    var promise = FauxtonAPI.session.createAdmin(username, password, loginAfter, nodes[0].node);
    -
    -    promise.then(function () {
    -      FauxtonAPI.addNotification({ msg: FauxtonAPI.session.messages.adminCreated });
    -      if (loginAfter) {
    -        FauxtonAPI.navigate('/');
    -      } else {
    -        FauxtonAPI.dispatch({ type: ActionTypes.AUTH_CLEAR_CREATE_ADMIN_FIELDS });
    -      }
    -    });
    +function updateCreateAdminUsername (value) {
    +  FauxtonAPI.dispatch({
    +    type: ActionTypes.AUTH_UPDATE_CREATE_ADMIN_USERNAME_FIELD,
    +    value: value
    +  });
    +}
     
    -    promise.fail(function (xhr, type, msg) {
    -      msg = xhr;
    -      if (arguments.length === 3) {
    -        msg = xhr.responseJSON.reason;
    -      }
    -      errorHandler(FauxtonAPI.session.messages.adminCreationFailedPrefix + ' ' + msg);
    -    });
    -  },
    +function updateCreateAdminPassword (value) {
    +  FauxtonAPI.dispatch({
    +    type: ActionTypes.AUTH_UPDATE_CREATE_ADMIN_PWD_FIELD,
    +    value: value
    +  });
    +}
     
    -  updateCreateAdminUsername: function (value) {
    -    FauxtonAPI.dispatch({
    -      type: ActionTypes.AUTH_UPDATE_CREATE_ADMIN_USERNAME_FIELD,
    -      value: value
    -    });
    -  },
    +function selectPage (page) {
    +  FauxtonAPI.dispatch({
    +    type: ActionTypes.AUTH_SELECT_PAGE,
    +    page: page
    +  });
    +}
     
    -  updateCreateAdminPassword: function (value) {
    -    FauxtonAPI.dispatch({
    -      type: ActionTypes.AUTH_UPDATE_CREATE_ADMIN_PWD_FIELD,
    -      value: value
    -    });
    -  },
    +function showPasswordModal () {
    +  FauxtonAPI.dispatch({ type: ActionTypes.AUTH_SHOW_PASSWORD_MODAL });
    +}
    +
    +function hidePasswordModal () {
    +  FauxtonAPI.dispatch({ type: ActionTypes.AUTH_HIDE_PASSWORD_MODAL });
    +}
     
    -  selectPage: function (page) {
    -    FauxtonAPI.dispatch({
    -      type: ActionTypes.AUTH_SELECT_PAGE,
    -      page: page
    -    });
    -  }
     
    +export default {
    +  login,
    +  changePassword,
    +  updateChangePasswordField,
    +  updateChangePasswordConfirmField,
    +  createAdmin,
    +  authenticate,
    +  updateCreateAdminUsername,
    +  updateCreateAdminPassword,
    +  selectPage,
    +  showPasswordModal,
    +  hidePasswordModal
    --- End diff --
    
    is this part of the replication work or a refactor? did something change, except the function type?


---
If your project is set up for it, you can reply to this email and have your
reply appear on GitHub as well. If your project does not have this feature
enabled and wishes so, or if the feature is enabled but not working, please
contact infrastructure at infrastructure@apache.org or file a JIRA ticket
with INFRA.
---

[GitHub] couchdb-fauxton pull request #761: New replication

Posted by michellephung <gi...@git.apache.org>.
Github user michellephung commented on a diff in the pull request:

    https://github.com/apache/couchdb-fauxton/pull/761#discussion_r75611225
  
    --- Diff: app/addons/replication/components.react.jsx ---
    @@ -0,0 +1,204 @@
    +// Licensed under the Apache License, Version 2.0 (the "License"); you may not
    +// use this file except in compliance with the License. You may obtain a copy of
    +// the License at
    +//
    +//   http://www.apache.org/licenses/LICENSE-2.0
    +//
    +// Unless required by applicable law or agreed to in writing, software
    +// distributed under the License is distributed on an "AS IS" BASIS, WITHOUT
    +// WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. See the
    +// License for the specific language governing permissions and limitations under
    +// the License.
    +import app from '../../app';
    +import FauxtonAPI from '../../core/api';
    +import React from 'react';
    +import Constants from './constants';
    +import Helpers from './helpers';
    +import Components from '../components/react-components.react';
    +import AuthComponents from '../auth/components.react';
    +import ReactSelect from 'react-select';
    +
    +const {LoadLines, StyledSelect, ConfirmButton} = Components;
    +const PasswordModal = AuthComponents.PasswordModal;
    +
    +class ReplicationSourceRow extends React.Component {
    +  render () {
    +    const { replicationSource, databases, sourceDatabase, remoteSource, onChange} = this.props;
    +
    +    if (replicationSource === Constants.REPLICATION_SOURCE.LOCAL) {
    +      return (
    +        <div className="replication-source-name-row row">
    +          <div className="span3">
    +            Source Name:
    +          </div>
    +          <div className="span7">
    +            <ReactSelect
    +              name="source-name"
    +              value={sourceDatabase}
    +              placeholder="Database name"
    +              options={Helpers.getReactSelectOptions(databases)}
    +              clearable={false}
    +              onChange={(selected) => Actions.updateFormField('sourceDatabase', selected.value)} />
    +          </div>
    +        </div>
    +      );
    +    }
    +
    +    return (
    +      <div>
    +        <div className="row">
    +          <div className="span3">Database URL:</div>
    +          <div className="span7">
    +            <input type="text" className="connection-url" placeholder="https://" value={remoteSource}
    +              onChange={(e) => onChange(e.target.value)} />
    +            <div className="connection-url-example">e.g. https://$REMOTE_USERNAME:$REMOTE_PASSWORD@$REMOTE_SERVER/$DATABASE</div>
    +          </div>
    +        </div>
    +      </div>
    +    );
    +  }
    +}
    +ReplicationSourceRow.propTypes = {
    +  replicationSource: React.PropTypes.string.isRequired,
    +  databases: React.PropTypes.array.isRequired,
    +  sourceDatabase: React.PropTypes.string.isRequired,
    +  remoteSource: React.PropTypes.string.isRequired,
    +  onChange: React.PropTypes.func.isRequired
    +};
    +
    +
    +class ReplicationTarget extends React.Component {
    +  getOptions () {
    +    const options = [
    +      { value: '', label: 'Select target' },
    +      { value: Constants.REPLICATION_TARGET.EXISTING_LOCAL_DATABASE, label: 'Existing local database' },
    +      { value: Constants.REPLICATION_TARGET.EXISTING_REMOTE_DATABASE, label: 'Existing remote database' },
    +      { value: Constants.REPLICATION_TARGET.NEW_LOCAL_DATABASE, label: 'New local database' },
    +      { value: Constants.REPLICATION_TARGET.NEW_REMOTE_DATABASE, label: 'New remote database' }
    +    ];
    +    return options.map((option) => {
    +      return (
    +        <option value={option.value} key={option.value}>{option.label}</option>
    +      );
    +    });
    +  }
    +
    +  render () {
    +    return (
    +      <StyledSelect
    +        selectContent={this.getOptions()}
    +        selectChange={(e) => this.props.onChange(e.target.value)}
    +        selectId="replication-target"
    +        selectValue={this.props.value} />
    +    );
    +  }
    +}
    +
    +ReplicationTarget.propTypes = {
    +  value: React.PropTypes.string.isRequired,
    +  onChange: React.PropTypes.func.isRequired
    +};
    +
    +
    +class ReplicationType extends React.Component {
    +  getOptions () {
    +    const options = [
    +      { value: Constants.REPLICATION_TYPE.ONE_TIME, label: 'One time' },
    +      { value: Constants.REPLICATION_TYPE.CONTINUOUS, label: 'Continuous' }
    +    ];
    +    return _.map(options, function (option) {
    +      return (
    +        <option value={option.value} key={option.value}>{option.label}</option>
    +      );
    +    });
    +  }
    +
    +  render () {
    +    return (
    +      <StyledSelect
    +        selectContent={this.getOptions()}
    +        selectChange={(e) => this.props.onChange(e.target.value)}
    +        selectId="replication-target"
    +        selectValue={this.props.value} />
    +    );
    +  }
    +}
    +ReplicationType.propTypes = {
    +  value: React.PropTypes.string.isRequired,
    +  onChange: React.PropTypes.func.isRequired
    +};
    +
    +
    +class ReplicationTargetRow extends React.Component {
    +  update (value) {
    +    Actions.updateFormField('remoteTarget', value);
    +  }
    +
    +  render () {
    +    const { replicationTarget, remoteTarget, targetDatabase, databases } = this.props;
    +
    +    let targetLabel = 'Target Name:';
    +    let field = null;
    +    let remoteHelpText = 'https://$USERNAME:$PASSWORD@server.com/$DATABASE';
    +
    +    // new and existing remote DBs show a URL field
    +    if (replicationTarget === Constants.REPLICATION_TARGET.NEW_REMOTE_DATABASE ||
    +        replicationTarget === Constants.REPLICATION_TARGET.EXISTING_REMOTE_DATABASE) {
    +      targetLabel = 'Database URL';
    +      remoteHelpText = 'https://$REMOTE_USERNAME:$REMOTE_PASSWORD@$REMOTE_SERVER/$DATABASE';
    +
    +      field = (
    +        <div>
    +          <input type="text" className="connection-url" placeholder="https://" value={remoteTarget}
    +            onChange={(e) => Actions.updateFormField('remoteTarget', e.target.value)} />
    +          <div className="connection-url-example">e.g. {remoteHelpText}</div>
    +        </div>
    +      );
    +
    +    // new local databases have a freeform text field
    +    } else if (replicationTarget === Constants.REPLICATION_TARGET.NEW_LOCAL_DATABASE) {
    +      field = (
    +        <input type="text" className="new-local-db" placeholder="Database name" value={targetDatabase}
    +          onChange={(e) => Actions.updateFormField('targetDatabase', e.target.value)} />
    --- End diff --
    
    ditto here


---
If your project is set up for it, you can reply to this email and have your
reply appear on GitHub as well. If your project does not have this feature
enabled and wishes so, or if the feature is enabled but not working, please
contact infrastructure at infrastructure@apache.org or file a JIRA ticket
with INFRA.
---

[GitHub] couchdb-fauxton issue #761: New replication

Posted by michellephung <gi...@git.apache.org>.
Github user michellephung commented on the issue:

    https://github.com/apache/couchdb-fauxton/pull/761
  
    hey garren, code looks really good :) 
    
    I'm having trouble when i try to prepublish it as a package though. I'll try and ping you in the morning.


---
If your project is set up for it, you can reply to this email and have your
reply appear on GitHub as well. If your project does not have this feature
enabled and wishes so, or if the feature is enabled but not working, please
contact infrastructure at infrastructure@apache.org or file a JIRA ticket
with INFRA.
---

[GitHub] couchdb-fauxton issue #761: New replication

Posted by justin-mcdavid-ibm <gi...@git.apache.org>.
Github user justin-mcdavid-ibm commented on the issue:

    https://github.com/apache/couchdb-fauxton/pull/761
  
    Hey Garren, I've given things a look.  Thanks for tag-teaming this with Ben.
    
    Here're my comments:
    
    ## General Testing
    
    I was able to replicate into an **existing** remote database using **target: New Remote Database**. That should fail.
    
    Forward slashes are allowed in db names, but replication fails (on both remote-local and local-local) when a slash is included. I'm assuming that this might be an issue for remote sources, as well.  Also, replication messages aren't picking up the full db name.  Replicating (locally) from cat/dog to fish/bird triggers a message that 'Replication from "dog" to "bird" has begun.' 
    
    Related FB ticket on the Cloudant side: https://cloudant.fogbugz.com/f/cases/66917/
    Tangentially related (?) ticket: https://cloudant.fogbugz.com/f/cases/45464/
     
     "source": {
       "headers": {
        "Authorization": "Basic am1tY2Rhdmk6Z2V0aW4xMDFDbG91ZGFudA=="
       },
       "url": "https://jmmcdavi.cloudant.com/conflicts"
      },
      "target": "https://justinmcdavidibm:***@justinmcdavidibm.cloudant.com/conflict/testing",
      "create_target": true,
      "continuous": false,
      "owner": "jmmcdavi",
      "_replication_state": "error",
      "_replication_state_time": "2016-08-19T18:12:36+00:00",
      "_replication_state_reason": "{db_not_found,<<\"could not open https://justinmcdavidibm:*****@justinmcdavidibm.cloudant.com/conflict/testing/\">>}",
      "_replication_id": "7ebd686ea179ba68db907a776a85b74f"
    
    ## Usability
    
    Are we unable to separate the database name from the remote-host info in the form (making two separate fields), and then recombine them for the actual request we're sending off?  Were I to want to trigger a number of replications in a row, it would be great if I could just change a database-name field, rather than modifying the end of the https://$REMOTE_USERNAME:$REMOTE_PASSWORD@$REMOTE_SERVER/$DATABASE string before clicking Start Replication again.  Fewer keystrokes and less mousing.
    
    The Start Replication button is inactive until an "Existing Local Database" is selected, but for the other three options (existing remote, new local, new remote), the button activates before the fields are populated. The button should be in an inactive state until all required fields are populated.
    
    To reduce triggering of multiple jobs (and the errors that would arise), after a Replication is triggered, the "Start Replication" button should go into an inactive state until a change has been made to the form. 
    
    Along the same lines as the above, can we provide some validation for the fields (illegal characters, spaces, databases not following naming rules, replicating to and from the same database, replicating system databases that shouldn't be replicated (or should everything be up for grabs?)? Or are we leaving all of that to the server? The current lagtime and architecture between sending off replicate jobs that we know would fail leaves me leaning toward providing our own validation where we can.
    
    Can the "Document Update Conflict" message that appears when you attempt to specify an existing replication document as the Custom ID be made more specific, so that users know that it's a conflict between replication documents, rather than a conflict arising out of the actual replication process?
    
    ## Styles
    
    With the different dropdowns/fields, we have two different font families (Source Sans Pro and Helvetica Neue) and a couple different font sizes (14px-16px).  Let's make all the text (labels/fields) in that form 14px Source Sans Pro (so as to match the localdb-selection dropdown). And just for consistent units, let's change the example text for remote sources/targets from 9pt to 12px.
    
    The confirmation dialogue styles appear broken, padding-wise.
    
    The inactive "Start Replication" button has a hover state that should be removed.
    
    ## Strings
    Change "e.g." to "Example:" in the case of remote-db example text.
    
    (apologies to @benkeen ), but in the Replication doc field, I've had a change of heart, and think that just "Custom ID (optional)" will work as in-field text.
    
    On the confirmation dialogue:
    Change the dialogue's title to "Enter Account Password."
    Change the explanatory test to "Replication requires authentication on your local account."
    Change the in-field text to "Password"
    Change the text on the button to "Start Replication," and add the check icon that we have on the main page's "Start Replication" button.
    
    ## Bloat
    I don't have the Replication status/error pages in the Cloudant beta, can we implement those in Fauxton as part of this work? 


---
If your project is set up for it, you can reply to this email and have your
reply appear on GitHub as well. If your project does not have this feature
enabled and wishes so, or if the feature is enabled but not working, please
contact infrastructure at infrastructure@apache.org or file a JIRA ticket
with INFRA.
---

[GitHub] couchdb-fauxton pull request #761: New replication

Posted by robertkowalski <gi...@git.apache.org>.
Github user robertkowalski commented on a diff in the pull request:

    https://github.com/apache/couchdb-fauxton/pull/761#discussion_r87581396
  
    --- Diff: app/addons/replication/tests/helpersSpec.js ---
    @@ -0,0 +1,41 @@
    +// Licensed under the Apache License, Version 2.0 (the "License"); you may not
    +// use this file except in compliance with the License. You may obtain a copy of
    +// the License at
    +//
    +//   http://www.apache.org/licenses/LICENSE-2.0
    +//
    +// Unless required by applicable law or agreed to in writing, software
    +// distributed under the License is distributed on an "AS IS" BASIS, WITHOUT
    +// WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. See the
    +// License for the specific language governing permissions and limitations under
    +// the License.
    +
    +import utils from "../../../../test/mocha/testUtils";
    +import helpers from '../helpers';
    +const assert = utils.assert;
    +
    +describe('Replication Helpers', () => {
    +
    +  describe('getDatabaseLabel', () => {
    +
    +    it('returns database name for string', () => {
    +      const db = 'http://tester:testerpass@127.0.0.1/fancy/db/name';
    +
    +      const dbName = helpers.getDatabaseLabel(db);
    +      assert.deepEqual('fancy/db/name', dbName);
    +
    +    });
    +
    +    it('returns database name for object', () => {
    +      const db = {
    +        url: 'http://tester:testerpass@127.0.0.1/fancy'
    +      };
    +
    +      const dbName = helpers.getDatabaseLabel(db);
    +      assert.deepEqual('fancy', dbName);
    +
    +    });
    +
    +  });
    +
    +});
    --- End diff --
    
    nice testing


---
If your project is set up for it, you can reply to this email and have your
reply appear on GitHub as well. If your project does not have this feature
enabled and wishes so, or if the feature is enabled but not working, please
contact infrastructure at infrastructure@apache.org or file a JIRA ticket
with INFRA.
---

[GitHub] couchdb-fauxton issue #761: New replication

Posted by justin-mcdavid-ibm <gi...@git.apache.org>.
Github user justin-mcdavid-ibm commented on the issue:

    https://github.com/apache/couchdb-fauxton/pull/761
  
    For replication activity I recommend that we implement something along the lines of the following mockup:
    <img width="1008" alt="replicator db activity" src="https://cloud.githubusercontent.com/assets/12969375/18851330/4809c1fe-83f0-11e6-9cf3-b57efa5c4edf.png">



---
If your project is set up for it, you can reply to this email and have your
reply appear on GitHub as well. If your project does not have this feature
enabled and wishes so, or if the feature is enabled but not working, please
contact infrastructure at infrastructure@apache.org or file a JIRA ticket
with INFRA.
---

[GitHub] couchdb-fauxton issue #761: New replication

Posted by michellephung <gi...@git.apache.org>.
Github user michellephung commented on the issue:

    https://github.com/apache/couchdb-fauxton/pull/761
  
    hi garren! hi ben! :D :D !
    
    i will look at this over the weekend. looks cool so far


---
If your project is set up for it, you can reply to this email and have your
reply appear on GitHub as well. If your project does not have this feature
enabled and wishes so, or if the feature is enabled but not working, please
contact infrastructure at infrastructure@apache.org or file a JIRA ticket
with INFRA.
---

[GitHub] couchdb-fauxton pull request #761: New replication

Posted by michellephung <gi...@git.apache.org>.
Github user michellephung commented on a diff in the pull request:

    https://github.com/apache/couchdb-fauxton/pull/761#discussion_r75611802
  
    --- Diff: app/addons/replication/tests/replicationSpec.js ---
    @@ -9,30 +9,205 @@
     // WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. See the
     // License for the specific language governing permissions and limitations under
     // the License.
    -import Replication from "../base";
    -import Views from "../views";
    -import Resources from "../resources";
    -import testUtils from "../../../../test/mocha/testUtils";
    -var assert = testUtils.assert,
    -    ViewSandbox = testUtils.ViewSandbox,
    -    viewSandbox;
    -
    -describe('Replication Addon', function () {
    -  describe('Replication View', function () {
    -    var view = new Views.ReplicationForm({
    -      collection: new Replication.DBList()
    +/*import React from 'react';
    --- End diff --
    
    ?


---
If your project is set up for it, you can reply to this email and have your
reply appear on GitHub as well. If your project does not have this feature
enabled and wishes so, or if the feature is enabled but not working, please
contact infrastructure at infrastructure@apache.org or file a JIRA ticket
with INFRA.
---

[GitHub] couchdb-fauxton issue #761: New replication

Posted by robertkowalski <gi...@git.apache.org>.
Github user robertkowalski commented on the issue:

    https://github.com/apache/couchdb-fauxton/pull/761
  
    when i forget to add a database name to the url, it will still accept the url:
    
    remote target:
    ```
    https://mypassword@rockoartischocko.cloudant.com
    ```
    
    expected: error that i have to specify a database name


---
If your project is set up for it, you can reply to this email and have your
reply appear on GitHub as well. If your project does not have this feature
enabled and wishes so, or if the feature is enabled but not working, please
contact infrastructure at infrastructure@apache.org or file a JIRA ticket
with INFRA.
---

[GitHub] couchdb-fauxton issue #761: New replication

Posted by justin-mcdavid-ibm <gi...@git.apache.org>.
Github user justin-mcdavid-ibm commented on the issue:

    https://github.com/apache/couchdb-fauxton/pull/761
  
    Hi Garren,
    
    1. Looking at replication, and as we discussed, we should combine the "New remote database" and "Existing remote database" options into a single "A remote database" option. We can't currently validate that a "new" database doesn't already exist, and back out of the replication process.
    
    2. After chatting about the remote source/target issues, I think we should clarify our examples.  I don't want to clutter up the page with too much text, but I think we should do some handholding here, just to clarify. I propose that we simplify the URL example to:
    
    Example: https://$USERNAME:$PASSWORD@$REMOTE_SERVER/$DATABASE
    
    and then add a ? icon to the "Example:" label with the following explanatory text:
    
    "If you have username and password for the remote account, use the remote username and remote password.
    
    If your local account has permissions on the remote database, you can use your local username and local password.
    
    If the remote database has granted permissions to "everybody," you do not need to include a username and password."


---
If your project is set up for it, you can reply to this email and have your
reply appear on GitHub as well. If your project does not have this feature
enabled and wishes so, or if the feature is enabled but not working, please
contact infrastructure at infrastructure@apache.org or file a JIRA ticket
with INFRA.
---

[GitHub] couchdb-fauxton pull request #761: New replication

Posted by garrensmith <gi...@git.apache.org>.
Github user garrensmith commented on a diff in the pull request:

    https://github.com/apache/couchdb-fauxton/pull/761#discussion_r87771863
  
    --- Diff: app/addons/replication/assets/less/replication.less ---
    @@ -11,187 +11,288 @@
     // the License.
     
     @import "../../../../../assets/less/variables.less";
    +@import "../../../../../assets/less/mixins.less";
     
    -#replication {
    -  position: relative;
    -  max-width: none;
    -  width: auto;
    -
    -  .form_set {
    -    width: 350px;
    -    display: inline-block;
    -    border: 1px solid @greyBrownLighter;
    -    padding: 15px 10px 0;
    -    margin-bottom: 20px;
    -    &.middle {
    -      width: 100px;
    -      border: none;
    -      position: relative;
    -      height: 100px;
    -      margin: 0;
    -    }
    -    input, select {
    -      margin: 0 0 16px 5px;
    -      height: 40px;
    -      width: 318px;
    -    }
    -    .btn-group {
    -      margin: 0 0 16px 5px;
    -      .btn {
    -        padding: 10px 57px;
    -      }
    -    }
    -    &.local {
    -      .local_option {
    -        display: block;
    -      }
    -      .remote_option {
    -        display: none;
    -      }
    -      .local-btn {
    -        background-color: @brandPrimary;
    -        color: #fff;
    -      }
    -      .remote-btn {
    -        background-color: #f5f5f5;
    -        color: @fontGrey;
    -      }
    -    }
    -    .local_option {
    -      display: none;
    -    }
    -    .remote-btn {
    -      background-color: @brandPrimary;
    -      color: #fff;
    -    }
    -  }
    +div.replication-page {
    +  padding-top: 25px !important;
    +  display: flex;
    +  flex-direction: column;
    +  align-items: center;
    +}
     
    +.replication-section {
    +  display: flex;
    +  flex-flow: row wrap;
    +  justify-content: flex-start;
    +}
     
    -  .options {
    -    position: relative;
    -    &:after {
    -      content: '';
    -      display: block;
    -      position: absolute;
    -      right: -16px;
    -      top: 9px;
    -      width: 0;
    -      height: 0;
    -      border-left: 5px solid transparent;
    -      border-right: 5px solid transparent;
    -      border-bottom: 5px solid black;
    -      border-top: none;
    -    }
    -    &.off {
    -      &:after {
    -      content: '';
    -      display: block;
    -      position: absolute;
    -      right: -16px;
    -      top: 9px;
    -      width: 0;
    -      height: 0;
    -      border-left: 5px solid transparent;
    -      border-right: 5px solid transparent;
    -      border-bottom: none;
    -      border-top: 5px solid black;
    -      }
    -    }
    -  }
    -  .control-group {
    -    label {
    -      float: left;
    -      min-height: 30px;
    -      vertical-align: top;
    -      padding-right: 5px;
    -      min-width: 130px;
    -      padding-left: 0px;
    -    }
    -    input[type=radio],
    -    input[type=checkbox] {
    -      margin: 0 0 2px 0;
    -    }
    -  }
    +.replication-seperator {
    --- End diff --
    
    Yes you are correct. I'll make the fix



---
If your project is set up for it, you can reply to this email and have your
reply appear on GitHub as well. If your project does not have this feature
enabled and wishes so, or if the feature is enabled but not working, please
contact infrastructure at infrastructure@apache.org or file a JIRA ticket
with INFRA.
---

[GitHub] couchdb-fauxton issue #761: New replication

Posted by justin-mcdavid-ibm <gi...@git.apache.org>.
Github user justin-mcdavid-ibm commented on the issue:

    https://github.com/apache/couchdb-fauxton/pull/761
  
    Hey Garren-- This is coming along great.  Comments below.
    
    # Activity Page:
    
    1. When I click on the column header, it changes the active-state coloring to orange, but I need to click a second time for it to do the actual sorting.
    2. Is it possible to just highlight the sorting triangle, rather than the entire column-header text?
    3. Change the Activity tab label to "Replicator DB Activity."
    4. Add some padding (try 8px?) between the funnel icon and the Filter Replications entry box
    5. Increase the text size of and padding around action icons.  Warehousing uses 16px for the icons. _all_dbs uses 19px (+enclosure box). I think 16px font and 8px left/right padding should suffice with our current information density.
    6. Encoding for db names containing forward slashes still appears to be broken for source/target displays in Activity. The broken encoding also extends to the linking to the actual databases.
    7. The action to edit the Replication document for a job listed in the activity section doesn't appear to be working yet.
    8. Same with the action to view the Replication document.
    9. The Verify Deletion dialogue does not differentiate between single-doc deletions, and multi-doc deletions (performed through the bulk-selector).  It would probably be better if the dialogue triggered through the bulk selector had it's own (pluralized) text and could reference the actual number of documents being deleted. (Instead of "You are deleting a replication document." make it "You are deleting <number> replication documents."
    10. When does the Activity page refresh?  I'm wondering if we should have polling/refresh controls on the page, similarly to how we have them for Monitoring and Active Tasks.
    11. Replication jobs that fail to create a new local database still have active links to the non-existant database.
    
    
    # New Replication Page
    
    1. The Start Replication button is not quite aligned with the field above it. If they could be left-aligned, it would be great.
    2. Padding and password-entry-box length on the replication dialogue are broken. Also, what are requirements around this? How regularly should it be asking for password, if you're triggering multiple jobs.  Can we have permission extend over a session? 
    3. Infield-text on the dialogue's password-entry box should be change to "Local-account password."  Apologies for the confusion, but please remove the period from the end of the dialogue box's title, as well.
    4. I got a "Database target may not start with an underscore." error when attempting to replicate to an existing db named "a_c." So it looks like the validation might be a bit overzealous there. Also, is that message new? And a way to prevent replicating system dbs?  I'm a little gunshy to test this, but I see that the "Start Replication" button is active if I select my local _replicator as both source and target. Perhaps we can strip dbs starting with an underscore from the source/target dropdowns, as well?  Also, now I'm still getting the underscore error, but none of the information in the form contains underscores, so it looks like something buggier might be afoot.
    5. Related to above: Did you add validation to prevent replicating a database to itself?
    6. Change the "Database target may not start with an underscore." message to "The names of database sources and targets cannot begin with underscores." (and then you can reuse this message for underscored sources, as well.
    7. I can still use local -> new remote replication to replicate into an **existing** remote database.  Same goes for replicating something to a "new" database that actually already exists. There should be an error for remote-instance-overwrite attempts, and validation for local-instance-overwrite attempts.
    8. To reduce triggering of multiple jobs (and the errors that would arise), after a Replication is triggered, the "Start Replication" button should go into an inactive state until a change has been made to the form.
    9. Can we implement the replication-doc conflicting handling described here: https://github.com/apache/couchdb-fauxton/pull/761#issuecomment-249692858
    
    # General
    
    1. The "Replication" breadcrumb for the replication section takes you to New Replication, rather than the Activity page; however, unless Advanced Replication is going to happen sometime soon (which it doesn't look like it will), I think it would be better to follow the same model we have for Warehousing, where there is a Create Replication button on the Activity page, and then the creation page has breadcrumbs and no tabs.
    2. The message upon triggering a replication job is not quite correct.  It states that "Replication from <db1> to <db2> has begun." which isn't actually the case if the job errors.  That message should be "Replication from <db1> to <db2> is triggered." Though we could say "scheduled" instead of triggered, if you want to anticipate the dbnext-change rollout.



---
If your project is set up for it, you can reply to this email and have your
reply appear on GitHub as well. If your project does not have this feature
enabled and wishes so, or if the feature is enabled but not working, please
contact infrastructure at infrastructure@apache.org or file a JIRA ticket
with INFRA.
---

[GitHub] couchdb-fauxton pull request #761: New replication

Posted by michellephung <gi...@git.apache.org>.
Github user michellephung commented on a diff in the pull request:

    https://github.com/apache/couchdb-fauxton/pull/761#discussion_r75611331
  
    --- Diff: app/addons/replication/components/source.js ---
    @@ -0,0 +1,164 @@
    +// Licensed under the Apache License, Version 2.0 (the "License"); you may not
    +// use this file except in compliance with the License. You may obtain a copy of
    +// the License at
    +//
    +//   http://www.apache.org/licenses/LICENSE-2.0
    +//
    +// Unless required by applicable law or agreed to in writing, software
    +// distributed under the License is distributed on an "AS IS" BASIS, WITHOUT
    +// WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. See the
    +// License for the specific language governing permissions and limitations under
    +// the License.
    +import React from 'react';
    +import Constants from '../constants';
    +import Components from '../../components/react-components.react';
    +import ReactSelect from 'react-select';
    +
    +const { StyledSelect } = Components;
    +
    +const RemoteSourceInput = ({onChange, value}) =>
    +  <div className="replication-section">
    +    <div className="replication-input-label">Database URL:</div>
    +    <div className="">
    +      <input type="text" className="replication-remote-connection-url" placeholder="https://" value={value}
    +        onChange={(e) => onChange(e.target.value)} />
    +      <div className="replication-remote-connection-url-text">e.g. https://$REMOTE_USERNAME:$REMOTE_PASSWORD@$REMOTE_SERVER/$DATABASE</div>
    +    </div>
    +  </div>;
    +
    +RemoteSourceInput.propTypes = {
    +  value: React.PropTypes.string.isRequired,
    +  onChange: React.PropTypes.func.isRequired
    +};
    +
    +const LocalSourceInput = ({value, onChange, databases}) => {
    +  const options = databases.map(db => ({value: db, label: db}));
    +  return (
    +    <div className="replication-section">
    +      <div className="replication-input-label">
    +        Source Name:
    +      </div>
    +      <div className="replication-input-react-select">
    +        <ReactSelect
    +          name="source-name"
    +          value={value}
    +          placeholder="Database name"
    +          options={options}
    +          clearable={false}
    +          onChange={({value}) => onChange(value)} />
    +      </div>
    +    </div>
    +  );
    +};
    +
    +LocalSourceInput.propTypes = {
    +  value: React.PropTypes.string.isRequired,
    +  databases: React.PropTypes.array.isRequired,
    +  onChange: React.PropTypes.func.isRequired
    +};
    +
    +const ReplicationSourceRow = ({replicationSource, databases, sourceDatabase, remoteSource, onChangeRemote, onChangeLocal}) => {
    +  if (replicationSource === Constants.REPLICATION_SOURCE.LOCAL) {
    +    return <LocalSourceInput
    +      value={sourceDatabase}
    +      databases={databases}
    +      onChange={onChangeLocal}
    +           />;
    +  }
    +
    +  return <RemoteSourceInput value={remoteSource} onChange={onChangeRemote} />;
    +};
    +
    +ReplicationSourceRow.propTypes = {
    +  replicationSource: React.PropTypes.string.isRequired,
    +  databases: React.PropTypes.array.isRequired,
    +  sourceDatabase: React.PropTypes.string.isRequired,
    +  remoteSource: React.PropTypes.string.isRequired,
    +  onChangeRemote: React.PropTypes.func.isRequired,
    +  onChangeLocal: React.PropTypes.func.isRequired
    +};
    +
    +const replicationSourceSelectOptions = () => {
    +  return [
    +    { value: '', label: 'Select source' },
    +    { value: Constants.REPLICATION_SOURCE.LOCAL, label: 'Local database' },
    +    { value: Constants.REPLICATION_SOURCE.REMOTE, label: 'Remote database' }
    +  ].map((option) => {
    +    return (
    +      <option value={option.value} key={option.value}>{option.label}</option>
    +    );
    +  });
    +};
    +
    +export const ReplicationSourceSelect = ({onChange, value}) => {
    +
    +  return (
    +    <div className="replication-section">
    +      <div className="replication-input-label">
    +        Replication Source:
    +      </div>
    +      <div className="replication-input-select">
    +        <StyledSelect
    +          selectContent={replicationSourceSelectOptions()}
    +          selectChange={(e) => onChange(e.target.value)}
    +          selectId="replication-source"
    +          selectValue={value} />
    +      </div>
    +    </div>
    +  );
    +};
    +
    +ReplicationSourceSelect.propTypes = {
    +  value: React.PropTypes.string.isRequired,
    +  onChange: React.PropTypes.func.isRequired
    +};
    +
    +export class ReplicationSource extends React.Component {
    +
    +  getReplicationSourceRow () {
    +    const {
    +      replicationSource,
    +      sourceDatabase,
    +      onLocalSourceChange,
    +      onRemoteSourceChange,
    +      remoteSource,
    +      databases
    +    } = this.props;
    +
    +    if (!replicationSource) {
    +      return null;
    +    }
    +
    +    return <ReplicationSourceRow
    +      replicationSource={replicationSource}
    +      databases={databases}
    +      sourceDatabase={sourceDatabase}
    +      remoteSource={remoteSource}
    +      onChangeLocal={onLocalSourceChange}
    +      onChangeRemote={onRemoteSourceChange}
    +           />;
    --- End diff --
    
    ws


---
If your project is set up for it, you can reply to this email and have your
reply appear on GitHub as well. If your project does not have this feature
enabled and wishes so, or if the feature is enabled but not working, please
contact infrastructure at infrastructure@apache.org or file a JIRA ticket
with INFRA.
---

[GitHub] couchdb-fauxton pull request #761: New replication

Posted by garrensmith <gi...@git.apache.org>.
Github user garrensmith commented on a diff in the pull request:

    https://github.com/apache/couchdb-fauxton/pull/761#discussion_r87771285
  
    --- Diff: app/addons/auth/actions.js ---
    @@ -28,88 +28,130 @@ var errorHandler = function (xhr, type, msg) {
     };
     
     
    -export default {
    +function login (username, password, urlBack) {
    +  var promise = FauxtonAPI.session.login(username, password);
    +
    +  promise.then(() => {
    +    FauxtonAPI.addNotification({ msg: FauxtonAPI.session.messages.loggedIn });
    +    if (urlBack) {
    +      return FauxtonAPI.navigate(urlBack);
    +    }
    +    FauxtonAPI.navigate('/');
    +  }, errorHandler);
    +}
    +
    +function changePassword (password, passwordConfirm) {
    +  var nodes = nodesStore.getNodes();
    +  var promise = FauxtonAPI.session.changePassword(password, passwordConfirm, nodes[0].node);
    +
    +  promise.then(() => {
    +    FauxtonAPI.addNotification({ msg: FauxtonAPI.session.messages.changePassword });
    +    FauxtonAPI.dispatch({ type: ActionTypes.AUTH_CLEAR_CHANGE_PWD_FIELDS });
    +  }, errorHandler);
    +}
    +
    +function updateChangePasswordField (value) {
    +  FauxtonAPI.dispatch({
    +    type: ActionTypes.AUTH_UPDATE_CHANGE_PWD_FIELD,
    +    value: value
    +  });
    +}
    +
    +function updateChangePasswordConfirmField (value) {
    +  FauxtonAPI.dispatch({
    +    type: ActionTypes.AUTH_UPDATE_CHANGE_PWD_CONFIRM_FIELD,
    +    value: value
    +  });
    +}
     
    -  login: function (username, password, urlBack) {
    -    var promise = FauxtonAPI.session.login(username, password);
    +function createAdmin (username, password, loginAfter) {
    +  var nodes = nodesStore.getNodes();
    +  var promise = FauxtonAPI.session.createAdmin(username, password, loginAfter, nodes[0].node);
     
    -    promise.then(function () {
    -      FauxtonAPI.addNotification({ msg: FauxtonAPI.session.messages.loggedIn });
    -      if (urlBack) {
    -        return FauxtonAPI.navigate(urlBack);
    -      }
    +  promise.then(() => {
    +    FauxtonAPI.addNotification({ msg: FauxtonAPI.session.messages.adminCreated });
    +    if (loginAfter) {
           FauxtonAPI.navigate('/');
    +    } else {
    +      FauxtonAPI.dispatch({ type: ActionTypes.AUTH_CLEAR_CREATE_ADMIN_FIELDS });
    +    }
    +  }, (xhr, type, msg) => {
    +    msg = xhr;
    +    if (arguments.length === 3) {
    +      msg = xhr.responseJSON.reason;
    +    }
    +    errorHandler(FauxtonAPI.session.messages.adminCreationFailedPrefix + ' ' + msg);
    +  });
    +}
    +
    +// simple authentication method - does nothing other than check creds
    +function authenticate (username, password, onSuccess) {
    +  $.ajax({
    +    cache: false,
    +    type: 'POST',
    +    url: '/_session',
    +    dataType: 'json',
    +    data: { name: username, password: password }
    +  }).then(() => {
    +    FauxtonAPI.dispatch({
    +      type: ActionTypes.AUTH_CREDS_VALID,
    +      options: { username: username, password: password }
         });
    -    promise.fail(errorHandler);
    -  },
    -
    -  changePassword: function (password, passwordConfirm) {
    -    var nodes = nodesStore.getNodes();
    -    var promise = FauxtonAPI.session.changePassword(password, passwordConfirm, nodes[0].node);
    -
    -    promise.done(function () {
    -      FauxtonAPI.addNotification({ msg: FauxtonAPI.session.messages.changePassword });
    -      FauxtonAPI.dispatch({ type: ActionTypes.AUTH_CLEAR_CHANGE_PWD_FIELDS });
    +    hidePasswordModal();
    +    onSuccess(username, password);
    +  }, () => {
    +    FauxtonAPI.addNotification({
    +      msg: 'Your password is incorrect.',
    +      type: 'error',
    +      clear: true
         });
    -
    -    promise.fail(errorHandler);
    -  },
    -
    -  updateChangePasswordField: function (value) {
         FauxtonAPI.dispatch({
    -      type: ActionTypes.AUTH_UPDATE_CHANGE_PWD_FIELD,
    -      value: value
    +      type: ActionTypes.AUTH_CREDS_INVALID,
    +      options: { username: username, password: password }
         });
    -  },
    +  });
    +}
     
    -  updateChangePasswordConfirmField: function (value) {
    -    FauxtonAPI.dispatch({
    -      type: ActionTypes.AUTH_UPDATE_CHANGE_PWD_CONFIRM_FIELD,
    -      value: value
    -    });
    -  },
    -
    -  createAdmin: function (username, password, loginAfter) {
    -    var nodes = nodesStore.getNodes();
    -    var promise = FauxtonAPI.session.createAdmin(username, password, loginAfter, nodes[0].node);
    -
    -    promise.then(function () {
    -      FauxtonAPI.addNotification({ msg: FauxtonAPI.session.messages.adminCreated });
    -      if (loginAfter) {
    -        FauxtonAPI.navigate('/');
    -      } else {
    -        FauxtonAPI.dispatch({ type: ActionTypes.AUTH_CLEAR_CREATE_ADMIN_FIELDS });
    -      }
    -    });
    +function updateCreateAdminUsername (value) {
    +  FauxtonAPI.dispatch({
    +    type: ActionTypes.AUTH_UPDATE_CREATE_ADMIN_USERNAME_FIELD,
    +    value: value
    +  });
    +}
     
    -    promise.fail(function (xhr, type, msg) {
    -      msg = xhr;
    -      if (arguments.length === 3) {
    -        msg = xhr.responseJSON.reason;
    -      }
    -      errorHandler(FauxtonAPI.session.messages.adminCreationFailedPrefix + ' ' + msg);
    -    });
    -  },
    +function updateCreateAdminPassword (value) {
    +  FauxtonAPI.dispatch({
    +    type: ActionTypes.AUTH_UPDATE_CREATE_ADMIN_PWD_FIELD,
    +    value: value
    +  });
    +}
     
    -  updateCreateAdminUsername: function (value) {
    -    FauxtonAPI.dispatch({
    -      type: ActionTypes.AUTH_UPDATE_CREATE_ADMIN_USERNAME_FIELD,
    -      value: value
    -    });
    -  },
    +function selectPage (page) {
    +  FauxtonAPI.dispatch({
    +    type: ActionTypes.AUTH_SELECT_PAGE,
    +    page: page
    +  });
    +}
     
    -  updateCreateAdminPassword: function (value) {
    -    FauxtonAPI.dispatch({
    -      type: ActionTypes.AUTH_UPDATE_CREATE_ADMIN_PWD_FIELD,
    -      value: value
    -    });
    -  },
    +function showPasswordModal () {
    +  FauxtonAPI.dispatch({ type: ActionTypes.AUTH_SHOW_PASSWORD_MODAL });
    +}
    +
    +function hidePasswordModal () {
    +  FauxtonAPI.dispatch({ type: ActionTypes.AUTH_HIDE_PASSWORD_MODAL });
    +}
     
    -  selectPage: function (page) {
    -    FauxtonAPI.dispatch({
    -      type: ActionTypes.AUTH_SELECT_PAGE,
    -      page: page
    -    });
    -  }
     
    +export default {
    +  login,
    +  changePassword,
    +  updateChangePasswordField,
    +  updateChangePasswordConfirmField,
    +  createAdmin,
    +  authenticate,
    +  updateCreateAdminUsername,
    +  updateCreateAdminPassword,
    +  selectPage,
    +  showPasswordModal,
    +  hidePasswordModal
    --- End diff --
    
    I just did a quick clean up here as I am using the password modal


---
If your project is set up for it, you can reply to this email and have your
reply appear on GitHub as well. If your project does not have this feature
enabled and wishes so, or if the feature is enabled but not working, please
contact infrastructure at infrastructure@apache.org or file a JIRA ticket
with INFRA.
---

[GitHub] couchdb-fauxton pull request #761: New replication

Posted by robertkowalski <gi...@git.apache.org>.
Github user robertkowalski commented on a diff in the pull request:

    https://github.com/apache/couchdb-fauxton/pull/761#discussion_r87581714
  
    --- Diff: app/addons/replication/tests/controllerSpec.js ---
    @@ -0,0 +1,27 @@
    +// Licensed under the Apache License, Version 2.0 (the "License"); you may not
    +// use this file except in compliance with the License. You may obtain a copy of
    +// the License at
    +//
    +//   http://www.apache.org/licenses/LICENSE-2.0
    +//
    +// Unless required by applicable law or agreed to in writing, software
    +// distributed under the License is distributed on an "AS IS" BASIS, WITHOUT
    +// WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. See the
    +// License for the specific language governing permissions and limitations under
    +// the License.
    +import React from "react";
    +import TestUtils from "react-addons-test-utils";
    +import utils from "../../../../test/mocha/testUtils";
    +import { mount } from 'enzyme';
    +import sinon from "sinon";
    +import Stores from '../stores';
    +import Controller from '../controller';
    +import Constants from '../constants';
    +
    +const store = Stores.replicationStore;
    +const assert = utils.assert;
    +
    +describe('Replication Controller', () => {
    +
    +
    +});
    --- End diff --
    
    i think this can get deleted. i think the controler is coverd by selenium tests


---
If your project is set up for it, you can reply to this email and have your
reply appear on GitHub as well. If your project does not have this feature
enabled and wishes so, or if the feature is enabled but not working, please
contact infrastructure at infrastructure@apache.org or file a JIRA ticket
with INFRA.
---

[GitHub] couchdb-fauxton issue #761: New replication

Posted by justin-mcdavid-ibm <gi...@git.apache.org>.
Github user justin-mcdavid-ibm commented on the issue:

    https://github.com/apache/couchdb-fauxton/pull/761
  
    Hi Garren,
    
    1. As we just discussed, the combining of the two remote options will not be feasible (thanks for the clarification), but we can add a caveat to the form so that users will not have incorrect expectations about system behavior (replicating into a pre-existing db when they think they're creating a new database). So, when the user selects "New remote database" from the dropdown, let's add the following statement below the example string.
    
       If a "new" database already exists, data will replicate into that existing database.
    
    2. Also, when a user selects "New remote database," the middle sentence in the embedded help panel should not appear, (as db permissions cannot be set on not-yet-existing dbs).
    
    3. On looking at the example string, I think the icon in the middle of the example isn't working as well as it could. I think the following changes to that string would be improvements: 
      - Remove the "Example:" label. I think the combination of grayed-out text plus the icon make it implicitly clearer as to what it is.
      - Move the hover help icon to the end of the example string.
      - Keep the string grayed out, but change the icon color to #08c
      - Give the icon an orange (#F3812D) hover in addition to the evoking of the help panel.
    
    4. I noticed that hover-state for the clear-field X in the dashboard is now Cloudant-orange but that the drop-down arrows are still Fauxton red.
    
    5. Add the following sentence to the Replication page when there are not any replication jobs showing:
    
       There is no replicator-db activity or history to display.
    
    Component fixes (not necessary to finish this feature):
    
    1. I'm still seeing a bit of styling-weirdness that happens when horizontal scrolling happens in the dropdown component.  But I think that's a component fix, and not necessarily for this feature.
    
    2. The bulk selector checkbox remains selected after bulk-delete happens. Not a big thing,
    
    3. The ellipses on long values selected in dropdown boxes still overlap with dropdown arrows, and are of a different text color than the selected values are.
    
    Once we have those final changes (1-5), I believe we're good to go.  Thanks for all your work on this.
    
    <img width="52" alt="screen shot 2016-11-14 at 8 19 16 am" src="https://cloud.githubusercontent.com/assets/12969375/20279754/a8e016b0-aa5e-11e6-857f-a3c3de8f82ce.png">
    <img width="707" alt="screen shot 2016-11-14 at 11 09 13 am" src="https://cloud.githubusercontent.com/assets/12969375/20279762/b39a2bcc-aa5e-11e6-86e5-7940bfd5a068.png">
    <img width="378" alt="screen shot 2016-11-14 at 11 40 14 am" src="https://cloud.githubusercontent.com/assets/12969375/20279895/3620f3c8-aa5f-11e6-8dde-f48e1a32a7e6.png">
    
    
    
    
    



---
If your project is set up for it, you can reply to this email and have your
reply appear on GitHub as well. If your project does not have this feature
enabled and wishes so, or if the feature is enabled but not working, please
contact infrastructure at infrastructure@apache.org or file a JIRA ticket
with INFRA.
---

[GitHub] couchdb-fauxton issue #761: New replication

Posted by justin-mcdavid-ibm <gi...@git.apache.org>.
Github user justin-mcdavid-ibm commented on the issue:

    https://github.com/apache/couchdb-fauxton/pull/761
  
    1. Because the current view can only show replication jobs for which a replication document exists, the section should probably have a more specific title like "Replicator DB Activity."  It's not replication history-- cancelled continuous jobs will not appear, because we currently delete a continuous job's replication doc to stop it.  "Replication Activity" implies active jobs-- But the view shows errored/completed jobs.
    2. We should implement the bulk-doc selector to give users an opportunity clean up completed jobs from the view.
    3. Add sortable columns so that jobs can be organized.
    4. Add a filter box so that jobs can be filtered.
    5. Add "State" and "State Time" columns so that jobs can be ordered by recency. Failed jobs should be in our warning red, and completed jobs can be in green.
    6. Improve access to local dbs in either of the "Source" or "Target" columns by making the db name clickable.  Because "Replicator DB Activity" is the top-level tab in the "Replication" section, it will be easy to navigate back view-- Meaning don't bother trying to implement any sort of complicated back functionality, depending on how a user gets to a db.
    7. Create an action icon (wrench) that will take the user to the simple replication form, but pre-populated with details from the replication job.
    8. Create an action icon (document) that will take the user to the listed job's replication document. Again, no need to implement complicated back functionality-- The activity view will be easy to return to. It would also be great if hovering over the icon could create a pop-up similar to the one we have for the copy icon table view of documents, and if the custom document ID, while not appearing as a value in the table, was still associated (metadata?) with the row, allowing users to "find" a custom doc through the filter.
    9. Create an action icon (trashcan) that will delete a replication job's document (after action verification through a pop-up-- screenshot attached).
    10. Implement an action icon (red triangular warning) for replication errors. The icon should only appears when errors exist.  I recommend lifting the code we use for warehousing error messages in Cloudant to display the actual errors. (screenshots attached).
    11. The type column should be either "Continuous" or "One time," rather than true/false
    ![error popup](https://cloud.githubusercontent.com/assets/12969375/18851983/41527330-83f3-11e6-9547-9379ac36cee7.png)
    ![error hover](https://cloud.githubusercontent.com/assets/12969375/18851984/4156b71a-83f3-11e6-8854-35d7d5f0c53b.png)
    <img width="428" alt="delete verification" src="https://cloud.githubusercontent.com/assets/12969375/18851985/41660ac6-83f3-11e6-9538-c81de2d77022.png">
    
    
    
    



---
If your project is set up for it, you can reply to this email and have your
reply appear on GitHub as well. If your project does not have this feature
enabled and wishes so, or if the feature is enabled but not working, please
contact infrastructure at infrastructure@apache.org or file a JIRA ticket
with INFRA.
---