fixed url input middle display to reflect no selected channel

This commit is contained in:
bill bittner 2018-01-24 12:02:40 -08:00
parent 39a1308080
commit 04754920df
7 changed files with 14 additions and 12 deletions

View file

@ -1,9 +1,9 @@
import React from 'react'; import React from 'react';
import PropTypes from 'prop-types'; import PropTypes from 'prop-types';
function UrlMiddle ({publishInChannel, loggedInChannelName, loggedInChannelShortId}) { function UrlMiddle ({publishInChannel, selectedChannel, loggedInChannelName, loggedInChannelShortId}) {
if (publishInChannel) { if (publishInChannel) {
if (loggedInChannelName) { if (selectedChannel === loggedInChannelName) {
return <span id="url-channel" className="url-text--secondary">{loggedInChannelName}:{loggedInChannelShortId} /</span>; return <span id="url-channel" className="url-text--secondary">{loggedInChannelName}:{loggedInChannelShortId} /</span>;
} }
return <span id="url-channel-placeholder" className="url-text--secondary tooltip">@channel<span return <span id="url-channel-placeholder" className="url-text--secondary tooltip">@channel<span

View file

@ -1,7 +1,6 @@
import {connect} from 'react-redux'; import {connect} from 'react-redux';
import {setPublishInChannel} from 'actions/publish'; import {setPublishInChannel, updateSelectedChannel} from 'actions/publish';
import View from './view.jsx'; import View from './view.jsx';
import {updateSelectedChannel} from '../../actions/publish';
const mapStateToProps = ({ channel, publish }) => { const mapStateToProps = ({ channel, publish }) => {
return { return {

View file

@ -1,7 +1,7 @@
import React from 'react'; import React from 'react';
import ChannelLoginForm from 'containers/ChannelLoginForm'; import ChannelLoginForm from 'containers/ChannelLoginForm';
import ChannelCreateForm from 'containers/ChannelCreateForm'; import ChannelCreateForm from 'containers/ChannelCreateForm';
import * as states from 'constants/channel_select_states'; import * as states from 'constants/publish_channel_select_states';
class ChannelSelect extends React.Component { class ChannelSelect extends React.Component {
constructor (props) { constructor (props) {

View file

@ -8,6 +8,7 @@ const mapStateToProps = ({ channel, publish }) => {
loggedInChannelShortId: channel.loggedInChannel.shortId, loggedInChannelShortId: channel.loggedInChannel.shortId,
fileName : publish.file.name, fileName : publish.file.name,
publishInChannel : publish.publishInChannel, publishInChannel : publish.publishInChannel,
selectedChannel : publish.selectedChannel,
claim : publish.claim, claim : publish.claim,
urlError : publish.error.url, urlError : publish.error.url,
}; };

View file

@ -5,10 +5,6 @@ import UrlMiddle from 'components/PublishUrlMiddleDisplay';
class PublishUrlInput extends React.Component { class PublishUrlInput extends React.Component {
constructor (props) { constructor (props) {
super(props); super(props);
this.state = {
host : 'spee.ch',
urlMiddle: null,
};
this.handleInput = this.handleInput.bind(this); this.handleInput = this.handleInput.bind(this);
this.cleanseInput = this.cleanseInput.bind(this); this.cleanseInput = this.cleanseInput.bind(this);
this.setClaimNameFromFileName = this.setClaimNameFromFileName.bind(this); this.setClaimNameFromFileName = this.setClaimNameFromFileName.bind(this);
@ -65,9 +61,14 @@ class PublishUrlInput extends React.Component {
<label className="label">URL:</label> <label className="label">URL:</label>
</div><div className="column column--7 column--sml-10 input-text--primary span--relative"> </div><div className="column column--7 column--sml-10 input-text--primary span--relative">
<span className="url-text--secondary">{this.state.host} / </span> <span className="url-text--secondary">spee.ch / </span>
<UrlMiddle publishInChannel={this.props.publishInChannel} loggedInChannelName={this.props.loggedInChannelName} loggedInChannelShortId={this.props.loggedInChannelShortId}/> <UrlMiddle
publishInChannel={this.props.publishInChannel}
selectedChannel={this.props.selectedChannel}
loggedInChannelName={this.props.loggedInChannelName}
loggedInChannelShortId={this.props.loggedInChannelShortId}
/>
<input type="text" id="claim-name-input" className="input-text" name='claim' placeholder="your-url-here" onChange={this.handleInput} value={this.props.claim}/> <input type="text" id="claim-name-input" className="input-text" name='claim' placeholder="your-url-here" onChange={this.handleInput} value={this.props.claim}/>
{ (this.props.claim && !this.props.urlError) && <span id="input-success-claim-name" className="info-message--success span--absolute">{'\u2713'}</span> } { (this.props.claim && !this.props.urlError) && <span id="input-success-claim-name" className="info-message--success span--absolute">{'\u2713'}</span> }

View file

@ -1,8 +1,9 @@
import * as actions from 'constants/publish_action_types'; import * as actions from 'constants/publish_action_types';
import { LOGIN } from 'constants/publish_channel_select_states';
const initialState = { const initialState = {
publishInChannel : false, publishInChannel : false,
selectedChannel : null, selectedChannel : LOGIN,
showMetadataInputs: false, showMetadataInputs: false,
status : { status : {
status : null, status : null,