2018-03-26 23:32:43 +02:00
// @flow
2019-08-25 22:43:44 +02:00
/* eslint react/no-unescaped-entities:0 */
/* eslint react/jsx-no-comment-textnodes:0 */
2019-07-08 22:54:58 +02:00
import * as PAGES from 'constants/pages' ;
2020-05-22 17:47:48 +02:00
import * as MODALS from 'constants/modal_types' ;
2018-03-26 23:32:43 +02:00
import * as React from 'react' ;
2019-10-23 20:59:33 +02:00
2019-09-27 22:03:05 +02:00
import { FormField , FormFieldPrice } from 'component/common/form' ;
2018-03-26 23:32:43 +02:00
import Button from 'component/button' ;
2019-09-04 23:43:37 +02:00
import I18nMessage from 'component/i18nMessage' ;
2018-03-26 23:32:43 +02:00
import Page from 'component/page' ;
2019-09-04 23:43:37 +02:00
import SettingLanguage from 'component/settingLanguage' ;
2019-12-11 21:09:27 +01:00
import SettingWalletServer from 'component/settingWalletServer' ;
2019-11-18 19:30:15 +01:00
import SettingAutoLaunch from 'component/settingAutoLaunch' ;
2018-03-26 23:32:43 +02:00
import FileSelector from 'component/common/file-selector' ;
2019-10-15 23:23:51 +02:00
import SyncToggle from 'component/syncToggle' ;
2020-02-19 07:31:40 +01:00
import { SETTINGS } from 'lbry-redux' ;
2019-09-27 22:03:05 +02:00
import Card from 'component/common/card' ;
2020-03-17 19:58:34 +01:00
import { getPasswordFromCookie } from 'util/saved-passwords' ;
2020-03-24 18:57:17 +01:00
import Spinner from 'component/spinner' ;
2020-04-13 21:16:07 +02:00
import SettingAccountPassword from 'component/settingAccountPassword' ;
2020-04-15 18:43:22 +02:00
import { Lbryio } from 'lbryinc' ;
2019-11-18 19:30:15 +01:00
// @if TARGET='app'
export const IS _MAC = process . platform === 'darwin' ;
// @endif
2019-04-24 16:02:08 +02:00
type Price = {
2018-03-26 23:32:43 +02:00
currency : string ,
amount : number ,
} ;
2019-02-12 18:26:50 +01:00
type SetDaemonSettingArg = boolean | string | number | Price ;
2019-08-18 19:01:04 +02:00
type DarkModeTimes = {
from : { hour : string , min : string , formattedTime : string } ,
to : { hour : string , min : string , formattedTime : string } ,
} ;
type OptionTimes = {
fromTo : string ,
time : string ,
} ;
2018-03-26 23:32:43 +02:00
type DaemonSettings = {
2019-02-12 18:26:50 +01:00
download _dir : string ,
2018-03-26 23:32:43 +02:00
share _usage _data : boolean ,
2018-10-13 17:49:47 +02:00
max _key _fee ? : Price ,
2019-08-02 08:28:14 +02:00
max _connections _per _download ? : number ,
save _files : boolean ,
save _blobs : boolean ,
2020-03-24 18:57:17 +01:00
ffmpeg _path : string ,
2018-03-26 23:32:43 +02:00
} ;
type Props = {
2019-02-12 18:26:50 +01:00
setDaemonSetting : ( string , ? SetDaemonSettingArg ) => void ,
2020-03-24 18:57:17 +01:00
clearDaemonSetting : string => void ,
2019-02-12 18:26:50 +01:00
setClientSetting : ( string , SetDaemonSettingArg ) => void ,
2020-02-19 07:31:40 +01:00
toggle3PAnalytics : boolean => void ,
2018-03-26 23:32:43 +02:00
clearCache : ( ) => Promise < any > ,
daemonSettings : DaemonSettings ,
2020-02-19 07:31:40 +01:00
allowAnalytics : boolean ,
2018-03-26 23:32:43 +02:00
showNsfw : boolean ,
2019-11-22 22:13:00 +01:00
isAuthenticated : boolean ,
2018-03-26 23:32:43 +02:00
instantPurchaseEnabled : boolean ,
instantPurchaseMax : Price ,
currentTheme : string ,
themes : Array < string > ,
automaticDarkModeEnabled : boolean ,
2018-05-30 05:18:41 +02:00
autoplay : boolean ,
2019-10-15 06:20:12 +02:00
// autoDownload: boolean,
2018-07-18 21:48:30 +02:00
encryptWallet : ( ) => void ,
decryptWallet : ( ) => void ,
2018-10-13 17:49:47 +02:00
updateWalletStatus : ( ) => void ,
2018-07-18 21:48:30 +02:00
walletEncrypted : boolean ,
2018-08-01 20:49:57 +02:00
osNotificationsEnabled : boolean ,
2019-07-19 22:21:41 +02:00
supportOption : boolean ,
2019-07-08 22:54:58 +02:00
userBlockedChannelsCount ? : number ,
2019-07-29 17:37:29 +02:00
hideBalance : boolean ,
2019-09-26 18:28:08 +02:00
confirmForgetPassword : ( { } ) => void ,
2019-08-13 07:35:13 +02:00
floatingPlayer : boolean ,
2020-05-22 17:47:48 +02:00
hideReposts : ? boolean ,
2019-08-13 07:35:13 +02:00
clearPlayingUri : ( ) => void ,
2019-08-18 19:01:04 +02:00
darkModeTimes : DarkModeTimes ,
2019-08-18 18:54:55 +02:00
setDarkTime : ( string , { } ) => void ,
2020-03-24 18:57:17 +01:00
ffmpegStatus : { available : boolean , which : string } ,
findingFFmpeg : boolean ,
findFFmpeg : ( ) => void ,
2020-05-22 17:47:48 +02:00
openModal : string => void ,
2018-03-26 23:32:43 +02:00
} ;
type State = {
clearingCache : boolean ,
2019-08-20 14:29:59 +02:00
storedPassword : boolean ,
2018-03-26 23:32:43 +02:00
} ;
class SettingsPage extends React . PureComponent < Props , State > {
constructor ( props : Props ) {
2017-05-17 10:10:25 +02:00
super ( props ) ;
2017-06-02 18:40:26 +02:00
2017-05-18 03:37:39 +02:00
this . state = {
2017-06-16 07:43:43 +02:00
clearingCache : false ,
2019-08-20 14:29:59 +02:00
storedPassword : false ,
2017-06-06 23:19:12 +02:00
} ;
2018-02-08 20:28:46 +01:00
2018-03-26 23:32:43 +02:00
( this : any ) . onKeyFeeChange = this . onKeyFeeChange . bind ( this ) ;
2019-08-02 08:28:14 +02:00
( this : any ) . onMaxConnectionsChange = this . onMaxConnectionsChange . bind ( this ) ;
2019-02-12 18:26:50 +01:00
( this : any ) . onKeyFeeDisableChange = this . onKeyFeeDisableChange . bind ( this ) ;
2018-03-26 23:32:43 +02:00
( this : any ) . onInstantPurchaseMaxChange = this . onInstantPurchaseMaxChange . bind ( this ) ;
( this : any ) . onThemeChange = this . onThemeChange . bind ( this ) ;
( this : any ) . onAutomaticDarkModeChange = this . onAutomaticDarkModeChange . bind ( this ) ;
2019-08-18 18:54:55 +02:00
( this : any ) . onChangeTime = this . onChangeTime . bind ( this ) ;
2019-08-28 04:35:07 +02:00
( this : any ) . onConfirmForgetPassword = this . onConfirmForgetPassword . bind ( this ) ;
2017-06-16 07:43:43 +02:00
}
2018-03-26 23:32:43 +02:00
componentDidMount ( ) {
2020-03-24 18:57:17 +01:00
const { isAuthenticated , ffmpegStatus , daemonSettings , findFFmpeg } = this . props ;
// @if TARGET='app'
const { available } = ffmpegStatus ;
const { ffmpeg _path : ffmpegPath } = daemonSettings ;
if ( ! available ) {
if ( ffmpegPath ) {
this . clearDaemonSetting ( 'ffmpeg_path' ) ;
}
findFFmpeg ( ) ;
}
// @endif
2020-01-15 05:34:28 +01:00
if ( isAuthenticated || ! IS _WEB ) {
2019-12-14 17:12:33 +01:00
this . props . updateWalletStatus ( ) ;
2020-03-17 19:58:34 +01:00
getPasswordFromCookie ( ) . then ( p => {
2019-12-19 23:35:12 +01:00
if ( typeof p === 'string' ) {
2019-12-14 17:12:33 +01:00
this . setState ( { storedPassword : true } ) ;
}
} ) ;
}
2017-05-17 10:10:25 +02:00
}
2020-03-24 18:57:17 +01:00
onFFmpegFolder ( path : string ) {
this . setDaemonSetting ( 'ffmpeg_path' , path ) ;
this . findFFmpeg ( ) ;
}
2018-03-26 23:32:43 +02:00
onKeyFeeChange ( newValue : Price ) {
this . setDaemonSetting ( 'max_key_fee' , newValue ) ;
2017-05-17 10:10:25 +02:00
}
2019-08-02 08:28:14 +02:00
onMaxConnectionsChange ( event : SyntheticInputEvent < * > ) {
const { value } = event . target ;
this . setDaemonSetting ( 'max_connections_per_download' , value ) ;
}
2018-03-26 23:32:43 +02:00
onKeyFeeDisableChange ( isDisabled : boolean ) {
2019-02-12 18:26:50 +01:00
if ( isDisabled ) this . setDaemonSetting ( 'max_key_fee' ) ;
2017-05-17 10:10:25 +02:00
}
2018-03-26 23:32:43 +02:00
onThemeChange ( event : SyntheticInputEvent < * > ) {
2017-08-12 20:46:10 +02:00
const { value } = event . target ;
2018-02-08 20:28:46 +01:00
if ( value === 'dark' ) {
this . onAutomaticDarkModeChange ( false ) ;
}
2018-11-26 02:21:25 +01:00
this . props . setClientSetting ( SETTINGS . THEME , value ) ;
2017-08-05 03:36:36 +02:00
}
2018-03-26 23:32:43 +02:00
onAutomaticDarkModeChange ( value : boolean ) {
2018-11-26 02:21:25 +01:00
this . props . setClientSetting ( SETTINGS . AUTOMATIC _DARK _MODE _ENABLED , value ) ;
2018-01-14 10:14:15 +01:00
}
2018-03-26 23:32:43 +02:00
onInstantPurchaseEnabledChange ( enabled : boolean ) {
2018-11-26 02:21:25 +01:00
this . props . setClientSetting ( SETTINGS . INSTANT _PURCHASE _ENABLED , enabled ) ;
2017-09-08 07:03:37 +02:00
}
2018-03-26 23:32:43 +02:00
onInstantPurchaseMaxChange ( newValue : Price ) {
2018-11-26 02:21:25 +01:00
this . props . setClientSetting ( SETTINGS . INSTANT _PURCHASE _MAX , newValue ) ;
2017-09-08 07:03:37 +02:00
}
2018-07-18 21:48:30 +02:00
onChangeEncryptWallet ( ) {
2018-10-13 17:49:47 +02:00
const { decryptWallet , walletEncrypted , encryptWallet } = this . props ;
if ( walletEncrypted ) {
decryptWallet ( ) ;
} else {
encryptWallet ( ) ;
}
2017-08-24 18:29:54 +02:00
}
2019-08-20 14:29:59 +02:00
onConfirmForgetPassword ( ) {
const { confirmForgetPassword } = this . props ;
2019-09-26 18:28:08 +02:00
confirmForgetPassword ( {
callback : ( ) => {
this . setState ( { storedPassword : false } ) ;
} ,
} ) ;
2019-08-20 14:29:59 +02:00
}
2019-08-18 19:01:04 +02:00
onChangeTime ( event : SyntheticInputEvent < * > , options : OptionTimes ) {
2019-08-18 18:54:55 +02:00
const { value } = event . target ;
this . props . setDarkTime ( value , options ) ;
}
to12Hour ( time : string ) {
const now = new Date ( 0 , 0 , 0 , Number ( time ) ) ;
const hour = now . toLocaleTimeString ( 'en-US' , { hour12 : true , hour : '2-digit' } ) ;
return hour ;
}
2019-02-12 18:26:50 +01:00
setDaemonSetting ( name : string , value : ? SetDaemonSettingArg ) : void {
2018-10-13 17:49:47 +02:00
this . props . setDaemonSetting ( name , value ) ;
}
2020-03-24 18:57:17 +01:00
clearDaemonSetting ( name : string ) : void {
this . props . clearDaemonSetting ( name ) ;
}
findFFmpeg ( ) : void {
this . props . findFFmpeg ( ) ;
}
2017-05-17 10:10:25 +02:00
render ( ) {
2017-09-07 03:53:42 +02:00
const {
daemonSettings ,
2020-03-24 18:57:17 +01:00
ffmpegStatus ,
2020-02-19 07:31:40 +01:00
allowAnalytics ,
2017-09-07 03:53:42 +02:00
showNsfw ,
2017-09-08 07:03:37 +02:00
instantPurchaseEnabled ,
instantPurchaseMax ,
2019-11-22 22:13:00 +01:00
isAuthenticated ,
2018-03-26 23:32:43 +02:00
currentTheme ,
2017-09-07 03:53:42 +02:00
themes ,
2018-01-14 10:14:15 +01:00
automaticDarkModeEnabled ,
2018-05-30 05:18:41 +02:00
autoplay ,
2018-07-18 21:48:30 +02:00
walletEncrypted ,
2018-08-01 20:49:57 +02:00
osNotificationsEnabled ,
2019-10-15 06:20:12 +02:00
// autoDownload,
2019-02-13 17:27:20 +01:00
setDaemonSetting ,
setClientSetting ,
2020-02-19 07:31:40 +01:00
toggle3PAnalytics ,
2019-07-19 22:21:41 +02:00
supportOption ,
2019-07-29 17:37:29 +02:00
hideBalance ,
2019-07-08 22:54:58 +02:00
userBlockedChannelsCount ,
2019-08-13 07:35:13 +02:00
floatingPlayer ,
2020-04-15 18:43:22 +02:00
hideReposts ,
2019-08-14 05:04:08 +02:00
clearPlayingUri ,
2019-08-18 18:54:55 +02:00
darkModeTimes ,
2019-10-16 07:01:18 +02:00
clearCache ,
2020-03-24 18:57:17 +01:00
findingFFmpeg ,
2020-05-22 17:47:48 +02:00
openModal ,
2017-09-07 03:53:42 +02:00
} = this . props ;
2019-10-17 21:15:32 +02:00
const { storedPassword } = this . state ;
2018-03-26 23:32:43 +02:00
const noDaemonSettings = ! daemonSettings || Object . keys ( daemonSettings ) . length === 0 ;
2020-03-24 18:57:17 +01:00
// @if TARGET='app'
const { available : ffmpegAvailable , which : ffmpegPath } = ffmpegStatus ;
// @endif
2019-02-12 18:26:50 +01:00
const defaultMaxKeyFee = { currency : 'USD' , amount : 50 } ;
2019-08-02 08:28:14 +02:00
2019-02-12 18:26:50 +01:00
const disableMaxKeyFee = ! ( daemonSettings && daemonSettings . max _key _fee ) ;
2019-08-13 07:35:13 +02:00
const connectionOptions = [ 1 , 2 , 4 , 6 , 10 , 20 ] ;
2019-08-18 18:54:55 +02:00
const startHours = [ '18' , '19' , '20' , '21' ] ;
const endHours = [ '5' , '6' , '7' , '8' ] ;
2019-02-12 18:26:50 +01:00
2016-04-10 02:00:56 +02:00
return (
2020-04-01 20:43:50 +02:00
< Page className = "card-stack" >
2019-08-26 20:32:45 +02:00
{ ! IS _WEB && noDaemonSettings ? (
2018-03-26 23:32:43 +02:00
< section className = "card card--section" >
2020-05-18 23:17:26 +02:00
< div className = "card__title card__title--deprecated" > { _ _ ( 'Failed to load settings.' ) } < / div >
2018-03-26 23:32:43 +02:00
< / section >
) : (
2019-08-22 23:14:51 +02:00
< div >
2019-09-27 22:03:05 +02:00
< Card title = { _ _ ( 'Language' ) } actions = { < SettingLanguage / > } / >
2020-04-13 21:16:07 +02:00
{ isAuthenticated && < SettingAccountPassword / > }
2019-10-23 20:59:33 +02:00
{ /* @if TARGET='app' */ }
2019-10-17 21:15:32 +02:00
< Card
title = { _ _ ( 'Sync' ) }
subtitle = {
walletEncrypted && ! storedPassword
? _ _ ( "To enable this feature, check 'Save Password' the next time you start the app." )
: null
}
actions = { < SyncToggle disabled = { walletEncrypted && ! storedPassword } / > }
/ >
2019-09-27 22:03:05 +02:00
< Card
title = { _ _ ( 'Download Directory' ) }
actions = {
< React.Fragment >
< FileSelector
type = "openDirectory"
currentPath = { daemonSettings . download _dir }
2019-10-07 22:02:32 +02:00
onFileChosen = { ( newDirectory : WebFile ) => {
setDaemonSetting ( 'download_dir' , newDirectory . path ) ;
2019-09-27 22:03:05 +02:00
} }
/ >
< p className = "help" > { _ _ ( 'LBRY downloads will be saved here.' ) } < / p >
< / React.Fragment >
}
/ >
< Card
title = { _ _ ( 'Network and Data Settings' ) }
actions = {
< React.Fragment >
< FormField
type = "checkbox"
name = "save_files"
onChange = { ( ) => setDaemonSetting ( 'save_files' , ! daemonSettings . save _files ) }
checked = { daemonSettings . save _files }
label = { _ _ ( 'Save all viewed content to your downloads directory' ) }
helper = { _ _ (
'Paid content and some file types are saved by default. Changing this setting will not affect previously downloaded content.'
) }
/ >
2018-12-19 06:44:53 +01:00
2019-09-27 22:03:05 +02:00
< FormField
type = "checkbox"
name = "save_blobs"
onChange = { ( ) => setDaemonSetting ( 'save_blobs' , ! daemonSettings . save _blobs ) }
checked = { daemonSettings . save _blobs }
label = { _ _ ( 'Save hosting data to help the LBRY network' ) }
helper = {
< React.Fragment >
{ _ _ ( "If disabled, LBRY will be very sad and you won't be helping improve the network." ) } { ' ' }
< Button button = "link" label = { _ _ ( 'Learn more' ) } href = "https://lbry.com/faq/host-content" / > .
< / React.Fragment >
}
/ >
< / React.Fragment >
}
/ >
< Card
title = { _ _ ( 'Max Purchase Price' ) }
actions = {
< React.Fragment >
< FormField
type = "radio"
name = "no_max_purchase_no_limit"
checked = { disableMaxKeyFee }
label = { _ _ ( 'No Limit' ) }
onChange = { ( ) => {
this . onKeyFeeDisableChange ( true ) ;
} }
/ >
< FormField
type = "radio"
name = "max_purchase_limit"
checked = { ! disableMaxKeyFee }
onChange = { ( ) => {
this . onKeyFeeDisableChange ( false ) ;
this . onKeyFeeChange ( defaultMaxKeyFee ) ;
} }
label = { _ _ ( 'Choose limit' ) }
/ >
2019-02-13 17:27:20 +01:00
2019-09-27 22:03:05 +02:00
{ ! disableMaxKeyFee && (
< FormFieldPrice
name = "max_key_fee"
min = { 0 }
onChange = { this . onKeyFeeChange }
price = { daemonSettings . max _key _fee ? daemonSettings . max _key _fee : defaultMaxKeyFee }
/ >
) }
< p className = "help" >
{ _ _ ( 'This will prevent you from purchasing any content over a certain cost, as a safety measure.' ) }
< / p >
< / React.Fragment >
}
/ >
2020-04-25 01:53:57 +02:00
{ /* @endif */ }
2019-09-27 22:03:05 +02:00
< Card
2020-04-25 01:53:57 +02:00
title = { _ _ ( 'Purchase and Tip Confirmations' ) }
2019-09-27 22:03:05 +02:00
actions = {
< React.Fragment >
< FormField
type = "radio"
name = "confirm_all_purchases"
checked = { ! instantPurchaseEnabled }
2020-04-25 01:53:57 +02:00
label = { _ _ ( 'Always confirm before purchasing content or tipping' ) }
2019-09-27 22:03:05 +02:00
onChange = { ( ) => {
this . onInstantPurchaseEnabledChange ( false ) ;
} }
/ >
< FormField
type = "radio"
name = "instant_purchases"
checked = { instantPurchaseEnabled }
2020-04-25 01:53:57 +02:00
label = { _ _ ( 'Only confirm purchases or tips over a certain amount' ) }
2019-09-27 22:03:05 +02:00
onChange = { ( ) => {
this . onInstantPurchaseEnabledChange ( true ) ;
} }
2018-04-11 00:05:30 +02:00
/ >
2019-05-08 03:29:30 +02:00
2019-09-27 22:03:05 +02:00
{ instantPurchaseEnabled && (
< FormFieldPrice
name = "confirmation_price"
min = { 0.1 }
onChange = { this . onInstantPurchaseMaxChange }
price = { instantPurchaseMax }
/ >
) }
2018-12-19 06:44:53 +01:00
2019-09-27 22:03:05 +02:00
< p className = "help" >
2020-04-25 01:53:57 +02:00
{ _ _ (
"When this option is chosen, LBRY won't ask you to confirm downloads or tips below your chosen amount."
) }
2019-09-27 22:03:05 +02:00
< / p >
< / React.Fragment >
}
/ >
< Card
title = { _ _ ( 'Content Settings' ) }
actions = {
< React.Fragment >
< FormField
type = "checkbox"
name = "floating_player"
onChange = { ( ) => {
setClientSetting ( SETTINGS . FLOATING _PLAYER , ! floatingPlayer ) ;
clearPlayingUri ( ) ;
} }
checked = { floatingPlayer }
label = { _ _ ( 'Floating video player' ) }
helper = { _ _ ( 'Keep content playing in the corner when navigating to a different page.' ) }
/ >
2019-02-20 06:20:29 +01:00
2019-09-27 22:03:05 +02:00
< FormField
type = "checkbox"
name = "autoplay"
onChange = { ( ) => setClientSetting ( SETTINGS . AUTOPLAY , ! autoplay ) }
checked = { autoplay }
label = { _ _ ( 'Autoplay media files' ) }
helper = { _ _ (
'Autoplay video and audio files when navigating to a file, as well as the next related item when a file finishes playing.'
) }
2018-04-11 00:05:30 +02:00
/ >
2019-05-08 03:29:30 +02:00
2020-04-15 18:43:22 +02:00
< FormField
2020-02-20 13:30:27 +01:00
type = "checkbox"
2020-04-15 18:43:22 +02:00
name = "hide_reposts"
onChange = { e => {
if ( isAuthenticated ) {
let param = e . target . checked ? { add : 'noreposts' } : { remove : 'noreposts' } ;
Lbryio . call ( 'user_tag' , 'edit' , param ) ;
}
2020-05-22 17:47:48 +02:00
setClientSetting ( SETTINGS . HIDE _REPOSTS , ! hideReposts ) ;
2020-02-20 13:30:27 +01:00
} }
2020-04-15 18:43:22 +02:00
checked = { hideReposts }
label = { _ _ ( 'Hide reposts' ) }
helper = { _ _ ( 'You will not see reposts by people you follow or receive email notifying about them.' ) }
/ >
2020-02-20 13:30:27 +01:00
2019-10-17 18:58:28 +02:00
{ / * < F o r m F i e l d
2019-10-08 18:25:33 +02:00
type = "checkbox"
name = "show_anonymous"
onChange = { ( ) => setClientSetting ( SETTINGS . SHOW _ANONYMOUS , ! showAnonymous ) }
checked = { showAnonymous }
label = { _ _ ( 'Show anonymous content' ) }
2019-10-15 19:29:27 +02:00
helper = { _ _ ( 'Anonymous content is published without a channel.' ) }
2019-10-17 18:58:28 +02:00
/> */ }
2019-10-08 18:25:33 +02:00
2019-09-27 22:03:05 +02:00
< FormField
type = "checkbox"
name = "show_nsfw"
2020-05-22 17:47:48 +02:00
onChange = { ( ) =>
! IS _WEB || showNsfw
? setClientSetting ( SETTINGS . SHOW _MATURE , ! showNsfw )
: openModal ( MODALS . CONFIRM _AGE )
}
2019-09-27 22:03:05 +02:00
checked = { showNsfw }
label = { _ _ ( 'Show mature content' ) }
helper = { _ _ (
'Mature content may include nudity, intense sexuality, profanity, or other adult content. By displaying mature content, you are affirming you are of legal age to view mature content in your country or jurisdiction. '
) }
/ >
< / React.Fragment >
}
/ >
2020-01-15 05:34:28 +01:00
{ ( isAuthenticated || ! IS _WEB ) && (
2019-11-22 22:13:00 +01:00
< Card
title = { _ _ ( 'Blocked Channels' ) }
actions = {
2020-05-22 17:47:48 +02:00
< p >
< React.Fragment >
{ _ _ ( '%count% %channels%. ' , {
c ount :
userBlockedChannelsCount === 0
? _ _ ( "You don't have" )
: _ _ ( 'You have' ) + ' ' + ( userBlockedChannelsCount || 0 ) + ' ' ,
channels : userBlockedChannelsCount === 1 ? _ _ ( 'blocked channel' ) : _ _ ( 'blocked channels' ) ,
} ) }
{
< Button
button = "link"
label = { userBlockedChannelsCount === 0 ? null : _ _ ( 'Manage' ) }
navigate = { ` / $ / ${ PAGES . BLOCKED } ` }
/ >
}
< / React.Fragment >
< / p >
2019-11-22 22:13:00 +01:00
}
/ >
) }
2019-09-27 22:03:05 +02:00
2019-08-26 20:32:45 +02:00
{ /* @if TARGET='app' */ }
2019-09-27 22:03:05 +02:00
< Card
title = { _ _ ( 'Notifications' ) }
actions = {
2019-08-25 22:43:44 +02:00
< FormField
type = "checkbox"
name = "desktopNotification"
onChange = { ( ) => setClientSetting ( SETTINGS . OS _NOTIFICATIONS _ENABLED , ! osNotificationsEnabled ) }
checked = { osNotificationsEnabled }
label = { _ _ ( 'Show Desktop Notifications' ) }
helper = { _ _ ( 'Get notified when a publish is confirmed, or when new content is available to watch.' ) }
/ >
2019-09-27 22:03:05 +02:00
}
/ >
< Card
2020-02-19 07:31:40 +01:00
title = { _ _ ( 'Share Usage and Diagnostic Data' ) }
subtitle = {
< React.Fragment >
{ _ _ (
` This is information like error logging, performance tracking, and usage statistics. It includes your IP address and basic system details, but no other identifying information (unless you sign in to lbry.tv) `
) } { ' ' }
< Button button = "link" label = { _ _ ( 'Learn more' ) } href = "https://lbry.com/privacypolicy" / >
< / React.Fragment >
}
2019-09-27 22:03:05 +02:00
actions = {
2020-02-19 07:31:40 +01:00
< >
< FormField
type = "checkbox"
name = "share_internal"
onChange = { ( ) => setDaemonSetting ( 'share_usage_data' , ! daemonSettings . share _usage _data ) }
checked = { daemonSettings . share _usage _data }
label = { < React.Fragment > { _ _ ( 'Allow the app to share data to LBRY.inc' ) } < / React.Fragment > }
helper = {
isAuthenticated
? _ _ ( 'Internal sharing is required while signed in.' )
: _ _ ( 'Internal sharing is required to participate in rewards programs.' )
}
2020-02-26 03:11:47 +01:00
disabled = { isAuthenticated && daemonSettings . share _usage _data }
2020-02-19 07:31:40 +01:00
/ >
< FormField
type = "checkbox"
name = "share_third_party"
onChange = { e => toggle3PAnalytics ( e . target . checked ) }
checked = { allowAnalytics }
2020-02-24 22:39:00 +01:00
label = { _ _ ( 'Allow the app to access third party analytics platforms' ) }
2020-02-19 07:31:40 +01:00
helper = { _ _ ( 'We use detailed analytics to improve all aspects of the LBRY experience.' ) }
/ >
< / >
2019-09-27 22:03:05 +02:00
}
/ >
2019-08-26 20:32:45 +02:00
{ /* @endif */ }
2018-12-19 06:44:53 +01:00
2019-09-27 22:03:05 +02:00
< Card
title = { _ _ ( 'Appearance' ) }
actions = {
< React.Fragment >
< fieldset - section >
< FormField
name = "theme_select"
type = "select"
label = { _ _ ( 'Theme' ) }
onChange = { this . onThemeChange }
value = { currentTheme }
disabled = { automaticDarkModeEnabled }
>
{ themes . map ( theme => (
< option key = { theme } value = { theme } >
2019-10-24 23:41:18 +02:00
{ theme === 'light' ? _ _ ( 'Light' ) : _ _ ( 'Dark' ) }
2019-09-27 22:03:05 +02:00
< / option >
) ) }
< / FormField >
< / f i e l d s e t - s e c t i o n >
< fieldset - section >
< FormField
type = "checkbox"
name = "automatic_dark_mode"
onChange = { ( ) => this . onAutomaticDarkModeChange ( ! automaticDarkModeEnabled ) }
checked = { automaticDarkModeEnabled }
label = { _ _ ( 'Automatic dark mode' ) }
/ >
{ automaticDarkModeEnabled && (
< fieldset - group class = "fieldset-group--smushed" >
< FormField
type = "select"
name = "automatic_dark_mode_range"
onChange = { value => this . onChangeTime ( value , { fromTo : 'from' , time : 'hour' } ) }
value = { darkModeTimes . from . hour }
label = { _ _ ( 'From' ) }
>
{ startHours . map ( time => (
< option key = { time } value = { time } >
{ this . to12Hour ( time ) }
< / option >
) ) }
< / FormField >
< FormField
type = "select"
name = "automatic_dark_mode_range"
label = { _ _ ( 'To' ) }
onChange = { value => this . onChangeTime ( value , { fromTo : 'to' , time : 'hour' } ) }
value = { darkModeTimes . to . hour }
>
{ endHours . map ( time => (
< option key = { time } value = { time } >
{ this . to12Hour ( time ) }
< / option >
) ) }
< / FormField >
< / f i e l d s e t - g r o u p >
) }
< / f i e l d s e t - s e c t i o n >
< / React.Fragment >
}
/ >
2019-11-22 22:13:00 +01:00
{ ( isAuthenticated || ! IS _WEB ) && (
< Card
title = { _ _ ( 'Wallet Security' ) }
actions = {
< React.Fragment >
{ /* @if TARGET='app' */ }
< FormField
disabled
type = "checkbox"
name = "encrypt_wallet"
onChange = { ( ) => this . onChangeEncryptWallet ( ) }
checked = { walletEncrypted }
label = { _ _ ( 'Encrypt my wallet with a custom password' ) }
helper = {
< React.Fragment >
< I18nMessage
tokens = { {
learn _more : (
< Button
button = "link"
label = { _ _ ( 'Learn more' ) }
href = "https://lbry.com/faq/account-sync"
/ >
) ,
} }
>
Wallet encryption is currently unavailable until it ' s supported for synced accounts . It will
be added back soon . % learn _more % .
< / I18nMessage >
{ / * { _ _ ( ' S e c u r e y o u r l o c a l w a l l e t d a t a w i t h a c u s t o m p a s s w o r d . ' ) } { ' ' }
< strong > { _ _ ( 'Lost passwords cannot be recovered.' ) } < / strong >
< Button button = "link" label = { _ _ ( 'Learn more' ) } href = "https://lbry.com/faq/wallet-encryption" / > . * / }
< / React.Fragment >
}
/ >
{ walletEncrypted && this . state . storedPassword && (
< FormField
type = "checkbox"
name = "save_password"
onChange = { this . onConfirmForgetPassword }
checked = { this . state . storedPassword }
label = { _ _ ( 'Save Password' ) }
helper = { < React.Fragment > { _ _ ( 'Automatically unlock your wallet on startup' ) } < / React.Fragment > }
/ >
) }
{ /* @endif */ }
< FormField
type = "checkbox"
name = "hide_balance"
onChange = { ( ) => setClientSetting ( SETTINGS . HIDE _BALANCE , ! hideBalance ) }
checked = { hideBalance }
label = { _ _ ( 'Hide wallet balance in header' ) }
/ >
< / React.Fragment >
}
/ >
) }
2020-03-24 18:57:17 +01:00
{ /* @if TARGET='app' */ }
< Card
title = {
< span >
{ _ _ ( 'Experimental Transcoding' ) }
{ findingFFmpeg && < Spinner type = "small" / > }
< / span >
}
actions = {
< React.Fragment >
< FileSelector
type = "openDirectory"
placeholder = { _ _ ( 'A Folder containing FFmpeg' ) }
currentPath = { ffmpegPath || daemonSettings . ffmpeg _path }
onFileChosen = { ( newDirectory : WebFile ) => {
this . onFFmpegFolder ( newDirectory . path ) ;
} }
disabled = { Boolean ( ffmpegPath ) }
/ >
< p className = "help" >
{ ffmpegAvailable ? (
< I18nMessage
tokens = { {
learn _more : (
< Button
button = "link"
label = { _ _ ( 'Learn more' ) }
href = "https://lbry.com/faq/video-publishing-guide#automatic"
/ >
) ,
} }
>
FFmpeg is correctly configured . % learn _more %
< / I18nMessage >
) : (
< I18nMessage
tokens = { {
check _again : (
< Button
button = "link"
label = { _ _ ( 'Check again' ) }
onClick = { ( ) => this . findFFmpeg ( ) }
disabled = { findingFFmpeg }
/ >
) ,
learn _more : (
< Button
button = "link"
label = { _ _ ( 'Learn more' ) }
href = "https://lbry.com/faq/video-publishing-guide#automatic"
/ >
) ,
} }
>
FFmpeg could not be found . Navigate to it or Install , Then % check _again % or quit and restart the
app . % learn _more %
< / I18nMessage >
) }
< / p >
< / React.Fragment >
}
/ >
{ /* @endif */ }
2019-11-22 22:13:00 +01:00
{ ( ! IS _WEB || isAuthenticated ) && (
< Card
title = { _ _ ( 'Experimental Settings' ) }
actions = {
< React.Fragment >
< FormField
type = "checkbox"
name = "support_option"
onChange = { ( ) => setClientSetting ( SETTINGS . SUPPORT _OPTION , ! supportOption ) }
checked = { supportOption }
label = { _ _ ( 'Enable claim support' ) }
helper = {
2019-10-03 23:40:54 +02:00
< I18nMessage
tokens = { {
2019-11-22 22:13:00 +01:00
discovery _link : (
< Button button = "link" label = { _ _ ( 'discovery' ) } href = "https://lbry.com/faq/trending" / >
) ,
vanity _names _link : (
< Button button = "link" label = { _ _ ( 'vanity names' ) } href = "https://lbry.com/faq/naming" / >
2019-10-03 23:40:54 +02:00
) ,
} }
>
2019-11-22 22:13:00 +01:00
This will add a Support button along side tipping . Similar to tips , supports help
% discovery _link % but the LBC is returned to your wallet if revoked . Both also help secure your
% vanity _names _link % .
2019-10-03 23:40:54 +02:00
< / I18nMessage >
2019-11-22 22:13:00 +01:00
}
2019-09-27 22:03:05 +02:00
/ >
2019-09-26 18:28:08 +02:00
2019-11-22 22:13:00 +01:00
{ /* @if TARGET='app' */ }
{ / *
2019-10-15 17:47:43 +02:00
Disabling below until we get downloads to work with shared subscriptions code
< FormField
2019-09-27 22:03:05 +02:00
type = "checkbox"
name = "auto_download"
onChange = { ( ) => setClientSetting ( SETTINGS . AUTO _DOWNLOAD , ! autoDownload ) }
checked = { autoDownload }
label = { _ _ ( 'Automatically download new content from my subscriptions' ) }
2019-08-13 07:35:13 +02:00
helper = { _ _ (
2019-09-27 22:03:05 +02:00
"The latest file from each of your subscriptions will be downloaded for quick access as soon as it's published."
2019-08-13 07:35:13 +02:00
) }
2019-10-15 06:20:12 +02:00
/> */ }
2019-11-22 22:13:00 +01:00
< fieldset - section >
< FormField
name = "max_connections"
type = "select"
label = { _ _ ( 'Max Connections' ) }
helper = { _ _ (
'For users with good bandwidth, try a higher value to improve streaming and download speeds. Low bandwidth users may benefit from a lower setting. Default is 4.'
) }
min = { 1 }
max = { 100 }
onChange = { this . onMaxConnectionsChange }
value = { daemonSettings . max _connections _per _download }
>
{ connectionOptions . map ( connectionOption => (
< option key = { connectionOption } value = { connectionOption } >
{ connectionOption }
< / option >
) ) }
< / FormField >
< / f i e l d s e t - s e c t i o n >
2019-12-12 21:18:13 +01:00
< SettingWalletServer / >
2019-12-14 17:12:33 +01:00
{ /* @endif */ }
2019-11-22 22:13:00 +01:00
< / React.Fragment >
}
/ >
) }
2019-09-27 22:03:05 +02:00
2019-11-18 19:30:15 +01:00
{ /* @if TARGET='app' */ }
{ /* Auto launch in a hidden state doesn't work on mac https://github.com/Teamwork/node-auto-launch/issues/81 */ }
{ ! IS _MAC && < Card title = { _ _ ( 'Startup Preferences' ) } actions = { < SettingAutoLaunch / > } / > }
{ /* @endif */ }
2019-09-27 22:03:05 +02:00
< Card
title = { _ _ ( 'Application Cache' ) }
subtitle = {
2019-11-22 22:13:00 +01:00
< p className = "section__subtitle" >
2019-09-27 22:03:05 +02:00
{ _ _ (
2019-11-22 22:13:00 +01:00
'This will clear the application cache, and might fix issues you are having. Your wallet will not be affected. '
2019-09-27 22:03:05 +02:00
) }
2019-10-16 03:14:21 +02:00
< / p >
2019-09-27 22:03:05 +02:00
}
actions = {
< Button
2019-11-22 22:13:00 +01:00
button = "secondary"
2019-09-27 22:03:05 +02:00
label = { this . state . clearingCache ? _ _ ( 'Clearing' ) : _ _ ( 'Clear Cache' ) }
2019-10-16 07:01:18 +02:00
onClick = { clearCache }
2019-09-27 22:03:05 +02:00
disabled = { this . state . clearingCache }
/ >
}
/ >
2019-03-18 06:06:41 +01:00
< / div >
2018-03-26 23:32:43 +02:00
) }
< / Page >
2016-04-10 02:00:56 +02:00
) ;
}
2017-05-17 10:10:25 +02:00
}
2016-11-22 21:19:08 +01:00
export default SettingsPage ;