Convert more callbacks to arrow functions
This commit is contained in:
parent
3e35d44978
commit
09834941ab
14 changed files with 48 additions and 48 deletions
|
@ -52,12 +52,12 @@ class SubmitEmailStage extends React.Component {
|
|||
render() {
|
||||
return (
|
||||
<section>
|
||||
<form onSubmit={this.handleSubmit}>
|
||||
<form onSubmit={(event) => { this.handleSubmit(event) }}>
|
||||
<FormRow ref={(ref) => { this._emailRow = ref }} type="text" label="Email" placeholder="scrwvwls@lbry.io"
|
||||
name="email" value={this.state.email}
|
||||
onChange={this.handleEmailChanged} />
|
||||
onChange={(event) => { this.handleEmailChanged(event) }} />
|
||||
<div className="form-row-submit">
|
||||
<Link button="primary" label="Next" disabled={this.state.submitting} onClick={this.handleSubmit} />
|
||||
<Link button="primary" label="Next" disabled={this.state.submitting} onClick={(event) => { this.handleSubmit(event) }} />
|
||||
</div>
|
||||
</form>
|
||||
</section>
|
||||
|
@ -108,12 +108,12 @@ class ConfirmEmailStage extends React.Component {
|
|||
render() {
|
||||
return (
|
||||
<section>
|
||||
<form onSubmit={this.handleSubmit}>
|
||||
<form onSubmit={(event) => { this.handleSubmit(event) }}>
|
||||
<FormRow label="Verification Code" ref={(ref) => { this._codeRow = ref }} type="text"
|
||||
name="code" placeholder="a94bXXXXXXXXXXXXXX" value={this.state.code} onChange={this.handleCodeChanged}
|
||||
name="code" placeholder="a94bXXXXXXXXXXXXXX" value={this.state.code} onChange={(event) => { this.handleCodeChanged(event) }}
|
||||
helper="A verification code is required to access this version."/>
|
||||
<div className="form-row-submit form-row-submit--with-footer">
|
||||
<Link button="primary" label="Verify" disabled={this.state.submitting} onClick={this.handleSubmit} />
|
||||
<Link button="primary" label="Verify" disabled={this.state.submitting} onClick={(event) => { this.handleSubmit(event)}} />
|
||||
</div>
|
||||
<div className="form-field__helper">
|
||||
No code? <Link onClick={() => { this.props.setStage("nocode")}} label="Click here" />.
|
||||
|
@ -152,7 +152,7 @@ class WelcomeStage extends React.Component {
|
|||
<p>Below, LBRY is controlled by users -- you -- via blockchain and decentralization.</p>
|
||||
<p>Thank you for making content freedom possible! Here's a nickel, kid.</p>
|
||||
<div style={{textAlign: "center", marginBottom: "12px"}}>
|
||||
<RewardLink type="new_user" button="primary" onRewardClaim={this.onRewardClaim} onRewardFailure={() => this.props.setStage(null)} onConfirmed={() => { this.props.setStage(null) }} />
|
||||
<RewardLink type="new_user" button="primary" onRewardClaim={(event) => { this.onRewardClaim(event) }} onRewardFailure={() => this.props.setStage(null)} onConfirmed={() => { this.props.setStage(null) }} />
|
||||
</div>
|
||||
</section>
|
||||
</Modal> :
|
||||
|
@ -319,9 +319,9 @@ export class AuthOverlay extends React.Component {
|
|||
this.state.stage != "welcome" ?
|
||||
<ModalPage className="modal-page--full" isOpen={true} contentLabel="Authentication" {...this.props}>
|
||||
<h1>LBRY Early Access</h1>
|
||||
<StageContent {...this.state.stageProps} setStage={this.setStage} />
|
||||
<StageContent {...this.state.stageProps} setStage={(stage, stageProps) => { this.setStage(stage, stageProps) }} />
|
||||
</ModalPage> :
|
||||
<StageContent setStage={this.setStage} {...this.state.stageProps} />
|
||||
<StageContent setStage={(stage, stageProps) => { this.setStage(stage, stageProps) }} {...this.state.stageProps} />
|
||||
);
|
||||
}
|
||||
}
|
|
@ -152,6 +152,6 @@ export class Thumbnail extends React.Component {
|
|||
const className = this.props.className ? this.props.className : '',
|
||||
otherProps = Object.assign({}, this.props)
|
||||
delete otherProps.className;
|
||||
return <img ref="img" onError={this.handleError} {...otherProps} className={className} src={this.state.imageUri} />
|
||||
return <img ref="img" onError={() => { this.handleError() }} {...otherProps} className={className} src={this.state.imageUri} />
|
||||
}
|
||||
}
|
||||
|
|
|
@ -121,7 +121,7 @@ class FileActions extends React.Component {
|
|||
<DropDownMenuItem key={1} onClick={() => openModal('confirmRemove')} label="Remove..." />
|
||||
</DropDownMenu> : '' }
|
||||
<Modal type="confirm" isOpen={modal == 'affirmPurchase'}
|
||||
contentLabel="Confirm Purchase" onConfirmed={this.onAffirmPurchase.bind(this)} onAborted={closeModal}>
|
||||
contentLabel="Confirm Purchase" onConfirmed={this.onAffirmPurchase.bind(this)} onAborted={this.closeModal.bind(this)}>
|
||||
This will purchase <strong>{title}</strong> for <strong><FilePrice uri={uri} look="plain" /></strong> credits.
|
||||
</Modal>
|
||||
<Modal isOpen={modal == 'notEnoughCredits'} contentLabel="Not enough credits"
|
||||
|
|
|
@ -92,7 +92,7 @@ export default Link
|
|||
|
||||
// return (
|
||||
// <a className={className} href={this.props.href || 'javascript:;'} title={this.props.title}
|
||||
// onClick={this.handleClick} {... 'style' in this.props ? {style: this.props.style} : {}}>
|
||||
// onClick={(event) => { this.handleClick() }} {... 'style' in this.props ? {style: this.props.style} : {}}>
|
||||
// {content}
|
||||
// </a>
|
||||
// );
|
||||
|
|
|
@ -81,9 +81,9 @@ export class DropDownMenu extends React.Component {
|
|||
}
|
||||
return (
|
||||
<div className="menu-container">
|
||||
<Link ref={(span) => this._menuButton = span} button="text" icon="icon-ellipsis-v" onClick={this.handleMenuIconClick} />
|
||||
<Link ref={(span) => this._menuButton = span} button="text" icon="icon-ellipsis-v" onClick={(event) => { this.handleMenuIconClick(event) }} />
|
||||
{this.state.menuOpen
|
||||
? <div ref={(div) => this._menuDiv = div} className="menu" onClick={this.handleMenuClick}>
|
||||
? <div ref={(div) => this._menuDiv = div} className="menu" onClick={(event) => { this.handleMenuClick(event) }}>
|
||||
{this.props.children}
|
||||
</div>
|
||||
: null}
|
||||
|
|
|
@ -81,7 +81,7 @@ export class ExpandableModal extends React.Component {
|
|||
<div className="modal__buttons">
|
||||
<Link button="primary" label={this.props.confirmButtonLabel} className="modal__button" onClick={this.props.onConfirmed} />
|
||||
<Link button="alt" label={!this.state.expanded ? this.props.expandButtonLabel : this.props.hideButtonLabel}
|
||||
className="modal__button" onClick={this.toggleExpanded} />
|
||||
className="modal__button" onClick={() => { this.toggleExpanded() }} />
|
||||
</div>
|
||||
</Modal>
|
||||
);
|
||||
|
|
|
@ -78,9 +78,9 @@ export class RewardLink extends React.Component {
|
|||
{this.props.claimed
|
||||
? <span><Icon icon="icon-check" /> Reward claimed.</span>
|
||||
: <Link button={this.props.button ? this.props.button : 'alt'} disabled={this.state.pending || !this.state.claimable }
|
||||
label={ this.state.pending ? "Claiming..." : "Claim Reward"} onClick={this.claimReward} />}
|
||||
label={ this.state.pending ? "Claiming..." : "Claim Reward"} onClick={() => { this.claimReward() }} />}
|
||||
{this.state.errorMessage ?
|
||||
<Modal isOpen={true} contentLabel="Reward Claim Error" className="error-modal" onConfirmed={this.clearError}>
|
||||
<Modal isOpen={true} contentLabel="Reward Claim Error" className="error-modal" onConfirmed={() => { this.clearError() }}>
|
||||
{this.state.errorMessage}
|
||||
</Modal>
|
||||
: ''}
|
||||
|
|
|
@ -18,7 +18,7 @@ export class SplashScreen extends React.Component {
|
|||
}
|
||||
|
||||
updateStatus() {
|
||||
lbry.status().then(this._updateStatusCallback);
|
||||
lbry.status().then((status) => { this._updateStatusCallback(status) });
|
||||
}
|
||||
|
||||
_updateStatusCallback(status) {
|
||||
|
|
|
@ -29,11 +29,11 @@ export class ToolTip extends React.Component {
|
|||
render() {
|
||||
return (
|
||||
<span className={'tooltip ' + (this.props.className || '')}>
|
||||
<a className="tooltip__link" onClick={this.handleClick}>
|
||||
<a className="tooltip__link" onClick={() => { this.handleClick() }}>
|
||||
{this.props.label}
|
||||
</a>
|
||||
<div className={'tooltip__body ' + (this.state.showTooltip ? '' : ' hidden')}
|
||||
onMouseOut={this.handleTooltipMouseOut}>
|
||||
onMouseOut={() => { this.handleTooltipMouseOut() }}>
|
||||
{this.props.body}
|
||||
</div>
|
||||
</span>
|
||||
|
|
|
@ -51,9 +51,9 @@ class VideoPlayButton extends React.Component {
|
|||
label={label ? label : ""}
|
||||
className="video__play-button"
|
||||
icon="icon-play"
|
||||
onClick={this.onWatchClick} />
|
||||
onClick={() => { this.onWatchClick() }} />
|
||||
{modal}
|
||||
<Modal contentLabel="Not enough credits" isOpen={modal == 'notEnoughCredits'} onConfirmed={closeModal}>
|
||||
<Modal contentLabel="Not enough credits" isOpen={modal == 'notEnoughCredits'} onConfirmed={() => { this.closeModal() }}>
|
||||
You don't have enough LBRY credits to pay for this stream.
|
||||
</Modal>
|
||||
<Modal
|
||||
|
@ -65,7 +65,7 @@ class VideoPlayButton extends React.Component {
|
|||
This will purchase <strong>{title}</strong> for <strong><FilePrice uri={uri} look="plain" /></strong> credits.
|
||||
</Modal>
|
||||
<Modal
|
||||
isOpen={modal == 'timedOut'} onConfirmed={closeModal} contentLabel="Timed Out">
|
||||
isOpen={modal == 'timedOut'} onConfirmed={() => { this.closeModal() }} contentLabel="Timed Out">
|
||||
Sorry, your download timed out :(
|
||||
</Modal>
|
||||
</div>);
|
||||
|
|
|
@ -65,25 +65,25 @@ class DeveloperPage extends React.Component {
|
|||
<section className="card">
|
||||
<h3>Developer Settings</h3>
|
||||
<div className="form-row">
|
||||
<label><FormField type="checkbox" onChange={this.handleShowDeveloperMenuChange} checked={this.state.showDeveloperMenu} /> Show developer menu</label>
|
||||
<label><FormField type="checkbox" onChange={(event) => { this.handleShowDeveloperMenuChange() }} checked={this.state.showDeveloperMenu} /> Show developer menu</label>
|
||||
</div>
|
||||
<div className="form-row">
|
||||
<label><FormField type="checkbox" onChange={this.handleUseCustomLighthouseServersChange} checked={this.state.useCustomLighthouseServers} /> Use custom search servers</label>
|
||||
<label><FormField type="checkbox" onChange={(event) => { this.handleUseCustomLighthouseServersChange() }} checked={this.state.useCustomLighthouseServers} /> Use custom search servers</label>
|
||||
</div>
|
||||
{this.state.useCustomLighthouseServers
|
||||
? <div className="form-row">
|
||||
<label>
|
||||
Custom search servers (one per line)
|
||||
<div><FormField type="textarea" className="developer-page__custom-lighthouse-servers" value={this.state.customLighthouseServers} onChange={this.handleCustomLighthouseServersChange} checked={this.state.debugMode} /></div>
|
||||
<div><FormField type="textarea" className="developer-page__custom-lighthouse-servers" value={this.state.customLighthouseServers} onChange={(event) => { this.handleCustomLighthouseServersChange() }} checked={this.state.debugMode} /></div>
|
||||
</label>
|
||||
</div>
|
||||
: null}
|
||||
</section>
|
||||
<section className="card">
|
||||
<div className="form-row">
|
||||
<FormField name="file" ref="file" type="file" onChange={this.handleUpgradeFileChange}/>
|
||||
<FormField name="file" ref="file" type="file" onChange={(event) => { this.handleUpgradeFileChange() }}/>
|
||||
|
||||
<Link label="Force Upgrade" button="alt" onClick={this.handleForceUpgradeClick} />
|
||||
<Link label="Force Upgrade" button="alt" onClick={(event) => { this.handleForceUpgradeClick() }} />
|
||||
</div>
|
||||
</section>
|
||||
</main>
|
||||
|
|
|
@ -409,7 +409,7 @@ class PublishPage extends React.Component {
|
|||
|
||||
return (
|
||||
<main className="main--single-column">
|
||||
<form onSubmit={this.handleSubmit}>
|
||||
<form onSubmit={(event) => { this.handleSubmit(event) }}>
|
||||
<section className="card">
|
||||
<div className="card__title-primary">
|
||||
<h4>Content</h4>
|
||||
|
@ -418,7 +418,7 @@ class PublishPage extends React.Component {
|
|||
</div>
|
||||
</div>
|
||||
<div className="card__content">
|
||||
<FormRow name="file" label="File" ref="file" type="file" onChange={this.onFileChange}
|
||||
<FormRow name="file" label="File" ref="file" type="file" onChange={(event) => { this.onFileChange(event) }}
|
||||
helper={this.state.myClaimExists ? "If you don't choose a file, the file from your existing claim will be used." : null}/>
|
||||
</div>
|
||||
{ !this.state.hasFile ? '' :
|
||||
|
@ -468,7 +468,7 @@ class PublishPage extends React.Component {
|
|||
<FormField type="radio" name="isFree" label={!this.state.isFee ? 'Choose price...' : 'Price ' }
|
||||
onChange={ () => { this.handleFeePrefChange(true) } } defaultChecked={this.state.isFee} />
|
||||
<span className={!this.state.isFee ? 'hidden' : ''}>
|
||||
<FormField type="number" className="form-field__input--inline" step="0.01" placeholder="1.00" onChange={this.handleFeeAmountChange} /> <FormField type="select" onChange={this.handleFeeCurrencyChange}>
|
||||
<FormField type="number" className="form-field__input--inline" step="0.01" placeholder="1.00" onChange={(event) => this.handleFeeAmountChange(event)} /> <FormField type="select" onChange={(event) => { this.handleFeeCurrencyChange(event) }}>
|
||||
<option value="USD">US Dollars</option>
|
||||
<option value="LBC">LBRY credits</option>
|
||||
</FormField>
|
||||
|
@ -477,7 +477,7 @@ class PublishPage extends React.Component {
|
|||
<div className="form-field__helper">
|
||||
If you choose to price this content in dollars, the number of credits charged will be adjusted based on the value of LBRY credits at the time of purchase.
|
||||
</div> : '' }
|
||||
<FormRow label="License" type="select" ref="meta_license" name="license" onChange={this.handleLicenseChange}>
|
||||
<FormRow label="License" type="select" ref="meta_license" name="license" onChange={(event) => { this.handleLicenseChange(event) }}>
|
||||
<option></option>
|
||||
<option>Public Domain</option>
|
||||
<option data-url="https://creativecommons.org/licenses/by/4.0/legalcode">Creative Commons Attribution 4.0 International</option>
|
||||
|
@ -492,13 +492,13 @@ class PublishPage extends React.Component {
|
|||
<FormField type="hidden" ref="meta_license_url" name="license_url" value={this.getLicenseUrl()} />
|
||||
{this.state.copyrightChosen
|
||||
? <FormRow label="Copyright notice" type="text" name="copyright-notice"
|
||||
value={this.state.copyrightNotice} onChange={this.handleCopyrightNoticeChange} />
|
||||
value={this.state.copyrightNotice} onChange={(event) => { this.handleCopyrightNoticeChange(event) }} />
|
||||
: null}
|
||||
{this.state.otherLicenseChosen ?
|
||||
<FormRow label="License description" type="text" name="other-license-description" onChange={this.handleOtherLicenseDescriptionChange} />
|
||||
<FormRow label="License description" type="text" name="other-license-description" onChange={(event) => { this.handleOtherLicenseDescriptionChange() }} />
|
||||
: null}
|
||||
{this.state.otherLicenseChosen ?
|
||||
<FormRow label="License URL" type="text" name="other-license-url" onChange={this.handleOtherLicenseUrlChange} />
|
||||
<FormRow label="License URL" type="text" name="other-license-url" onChange={(event) => { this.handleOtherLicenseUrlChange(event) }} />
|
||||
: null}
|
||||
</div>
|
||||
</section>
|
||||
|
@ -511,7 +511,7 @@ class PublishPage extends React.Component {
|
|||
</div>
|
||||
</div>
|
||||
<div className="card__content">
|
||||
<FormRow type="select" tabIndex="1" onChange={this.handleChannelChange} value={this.state.channel}>
|
||||
<FormRow type="select" tabIndex="1" onChange={(event) => { this.handleChannelChange(event) }} value={this.state.channel}>
|
||||
<option key="anonymous" value="anonymous">Anonymous</option>
|
||||
{this.state.channels.map(({name}) => <option key={name} value={name}>{name}</option>)}
|
||||
<option key="new" value="new">New identity...</option>
|
||||
|
@ -519,17 +519,17 @@ class PublishPage extends React.Component {
|
|||
</div>
|
||||
{this.state.channel == 'new' ?
|
||||
<div className="card__content">
|
||||
<FormRow label="Name" type="text" onChange={this.handleNewChannelNameChange} ref={newChannelName => { this.refs.newChannelName = newChannelName }}
|
||||
<FormRow label="Name" type="text" onChange={(event) => { this.handleNewChannelNameChange(event) }} ref={newChannelName => { this.refs.newChannelName = newChannelName }}
|
||||
value={this.state.newChannelName} />
|
||||
<FormRow label="Deposit"
|
||||
postfix="LBC"
|
||||
step="0.01"
|
||||
type="number"
|
||||
helper={lbcInputHelp}
|
||||
onChange={this.handleNewChannelBidChange}
|
||||
onChange={(event) => { this.handleNewChannelBidChange(event) }}
|
||||
value={this.state.newChannelBid} />
|
||||
<div className="form-row-submit">
|
||||
<Link button="primary" label={!this.state.creatingChannel ? 'Create identity' : 'Creating identity...'} onClick={this.handleCreateChannelClick} disabled={this.state.creatingChannel} />
|
||||
<Link button="primary" label={!this.state.creatingChannel ? 'Create identity' : 'Creating identity...'} onClick={(event) => { this.handleCreateChannelClick(event) }} disabled={this.state.creatingChannel} />
|
||||
</div>
|
||||
</div>
|
||||
: null}
|
||||
|
@ -542,7 +542,7 @@ class PublishPage extends React.Component {
|
|||
<div className="card__subtitle">Where should this content permanently reside? <Link label="Read more" href="https://lbry.io/faq/naming" />.</div>
|
||||
</div>
|
||||
<div className="card__content">
|
||||
<FormRow prefix="lbry://" type="text" ref="name" placeholder="myname" value={this.state.rawName} onChange={this.handleNameChange}
|
||||
<FormRow prefix="lbry://" type="text" ref="name" placeholder="myname" value={this.state.rawName} onChange={(event) => { this.handleNameChange(event) }}
|
||||
helper={this.getNameBidHelpText()} />
|
||||
</div>
|
||||
{ this.state.rawName ?
|
||||
|
@ -552,7 +552,7 @@ class PublishPage extends React.Component {
|
|||
step="0.01"
|
||||
label="Deposit"
|
||||
postfix="LBC"
|
||||
onChange={this.handleBidChange}
|
||||
onChange={(event) => { this.handleBidChange(event) }}
|
||||
value={this.state.bid}
|
||||
placeholder={this.state.nameResolved ? this.state.topClaimValue + 10 : 100}
|
||||
helper={lbcInputHelp} />
|
||||
|
@ -566,24 +566,24 @@ class PublishPage extends React.Component {
|
|||
<div className="card__content">
|
||||
<FormRow label={
|
||||
<span>I agree to the <Link href="https://www.lbry.io/termsofservice" label="LBRY terms of service" checked={this.state.TOSAgreed} /></span>
|
||||
} type="checkbox" name="tos_agree" ref={(field) => { this.refs.tos_agree = field }} onChange={this.handleTOSChange} />
|
||||
} type="checkbox" name="tos_agree" ref={(field) => { this.refs.tos_agree = field }} onChange={(event) => { this.handleTOSChange(event)}} />
|
||||
</div>
|
||||
</section>
|
||||
|
||||
<div className="card-series-submit">
|
||||
<Link button="primary" label={!this.state.submitting ? 'Publish' : 'Publishing...'} onClick={this.handleSubmit} disabled={this.state.submitting} />
|
||||
<Link button="primary" label={!this.state.submitting ? 'Publish' : 'Publishing...'} onClick={(event) => { this.handleSubmit(event) }} disabled={this.state.submitting} />
|
||||
<Link button="cancel" onClick={lbry.back} label="Cancel" />
|
||||
<input type="submit" className="hidden" />
|
||||
</div>
|
||||
</form>
|
||||
|
||||
<Modal isOpen={this.state.modal == 'publishStarted'} contentLabel="File published"
|
||||
onConfirmed={this.handlePublishStartedConfirmed}>
|
||||
onConfirmed={(event) => { this.handlePublishStartedConfirmed(event) }}>
|
||||
<p>Your file has been published to LBRY at the address <code>lbry://{this.state.name}</code>!</p>
|
||||
<p>The file will take a few minutes to appear for other LBRY users. Until then it will be listed as "pending" under your published files.</p>
|
||||
</Modal>
|
||||
<Modal isOpen={this.state.modal == 'error'} contentLabel="Error publishing file"
|
||||
onConfirmed={this.closeModal}>
|
||||
onConfirmed={(event) => { this.closeModal(event) }}>
|
||||
The following error occurred when attempting to publish your file: {this.state.errorMessage}
|
||||
</Modal>
|
||||
</main>
|
||||
|
|
|
@ -44,7 +44,7 @@ class ReportPage extends React.Component {
|
|||
<textarea ref={(t) => this._messageArea = t} cols="80" rows="10" name="message" type="text"/>
|
||||
</div>
|
||||
<div className="form-row form-row-submit">
|
||||
<button onClick={this.submitMessage} className={'button-block button-primary ' + (this.state.submitting ? 'disabled' : '')}>{this.state.submitting ? 'Submitting...' : 'Submit Report'}</button>
|
||||
<button onClick={(event) => { this.submitMessage(event) }} className={'button-block button-primary ' + (this.state.submitting ? 'disabled' : '')}>{this.state.submitting ? 'Submitting...' : 'Submit Report'}</button>
|
||||
</div>
|
||||
</section>
|
||||
<section className="card">
|
||||
|
@ -52,7 +52,7 @@ class ReportPage extends React.Component {
|
|||
You can also <Link href="https://github.com/lbryio/lbry/issues" label="submit an issue on GitHub"/>.
|
||||
</section>
|
||||
<Modal isOpen={this.state.modal == 'submitted'} contentLabel="Bug report submitted"
|
||||
onConfirmed={this.closeModal}>
|
||||
onConfirmed={(event) => { this.closeModal(event) }}>
|
||||
Your bug report has been submitted! Thank you for your feedback.
|
||||
</Modal>
|
||||
</main>
|
||||
|
|
|
@ -9,7 +9,7 @@ class SettingsPage extends React.Component {
|
|||
|
||||
const daemonSettings = this.props.daemonSettings
|
||||
|
||||
return {
|
||||
this.state = {
|
||||
isMaxUpload: daemonSettings && daemonSettings.max_upload != 0,
|
||||
isMaxDownload: daemonSettings && daemonSettings.max_download != 0,
|
||||
showNsfw: lbry.getClientSetting('showNsfw'),
|
||||
|
|
Loading…
Reference in a new issue