LBRYCommunity/lbry-desktop
1
0
Fork 0
Code Issues 596 Pull requests 6 Projects Releases 238 Packages Wiki Activity

When setting MinTip, ensure MinSuper=0 | Debounce numerical settings.

Browse source 
(1) The GUI currently behaves such that if MinTip is set, MinSuper will be ineffective. However, Commentron actually checks MinSuper first. Just zero out MinSuper for now to enforce our desired behavior.

(2) Add debouncing to numerical settings. Refresh everything during onBlur to always reflect what's in server (e.g. in case there was an error).
This commit is contained in:
infinite-persistence 2021-08-11 23:22:27 +08:00
parent 926de0959e
commit 7817c57689
No known key found for this signature in database
GPG key ID: B9C3252EDC3D0AA0
1 changed files with 66 additions and 18 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

84
ui/page/settingsCreator/view.jsx
View file

@ -11,6 +11,7 @@ import LbcSymbol from 'component/common/lbc-symbol';
import I18nMessage from 'component/i18nMessage'; import I18nMessage from 'component/i18nMessage';
import { isNameValid, parseURI } from 'lbry-redux'; import { isNameValid, parseURI } from 'lbry-redux';
import ClaimPreview from 'component/claimPreview'; import ClaimPreview from 'component/claimPreview';
import debounce from 'util/debounce';
import { getUriForSearchTerm } from 'util/search'; import { getUriForSearchTerm } from 'util/search';
const DEBOUNCE_REFRESH_MS = 1000; const DEBOUNCE_REFRESH_MS = 1000;
@ -19,6 +20,9 @@ const LBC_MAX = 21000000;
const LBC_MIN = 0; const LBC_MIN = 0;
const LBC_STEP = 1.0; const LBC_STEP = 1.0;
// ****************************************************************************
// ****************************************************************************
type Props = { type Props = {
activeChannelClaim: ChannelClaim, activeChannelClaim: ChannelClaim,
settingsByChannelId: { [string]: PerChannelSettings }, settingsByChannelId: { [string]: PerChannelSettings },
@ -56,11 +60,18 @@ export default function SettingsCreatorPage(props: Props) {
const [moderatorSearchTerm, setModeratorSearchTerm] = React.useState(''); const [moderatorSearchTerm, setModeratorSearchTerm] = React.useState('');
const [moderatorSearchError, setModeratorSearchError] = React.useState(''); const [moderatorSearchError, setModeratorSearchError] = React.useState('');
const [moderatorSearchClaimUri, setModeratorSearchClaimUri] = React.useState(''); const [moderatorSearchClaimUri, setModeratorSearchClaimUri] = React.useState('');
const [minTipAmountComment, setMinTipAmountComment] = React.useState(0); const [minTip, setMinTip] = React.useState(0);
const [minTipAmountSuperChat, setMinTipAmountSuperChat] = React.useState(0); const [minSuper, setMinSuper] = React.useState(0);
const [slowModeMinGap, setSlowModeMinGap] = React.useState(0); const [slowModeMin, setSlowModeMin] = React.useState(0);
const [lastUpdated, setLastUpdated] = React.useState(1); const [lastUpdated, setLastUpdated] = React.useState(1);
const pushSlowModeMinDebounced = React.useMemo(() => debounce(pushSlowModeMin, 1000), []);
const pushMinTipDebounced = React.useMemo(() => debounce(pushMinTip, 1000), []);
const pushMinSuperDebounced = React.useMemo(() => debounce(pushMinSuper, 1000), []);
// **************************************************************************
// **************************************************************************
/** /**
* Updates corresponding GUI states with the given PerChannelSettings values. * Updates corresponding GUI states with the given PerChannelSettings values.
* *
@ -82,22 +93,22 @@ export default function SettingsCreatorPage(props: Props) {
if (fullSync) { if (fullSync) {
setCommentsEnabled(settings.comments_enabled || false); setCommentsEnabled(settings.comments_enabled || false);
setMinTipAmountComment(settings.min_tip_amount_comment || 0); setMinTip(settings.min_tip_amount_comment || 0);
setMinTipAmountSuperChat(settings.min_tip_amount_super_chat || 0); setMinSuper(settings.min_tip_amount_super_chat || 0);
setSlowModeMinGap(settings.slow_mode_min_gap || 0); setSlowModeMin(settings.slow_mode_min_gap || 0);
doSetMutedWordTags(settings.words || []); doSetMutedWordTags(settings.words || []);
} else { } else {
if (settings.comments_enabled !== undefined) { if (settings.comments_enabled !== undefined) {
setCommentsEnabled(settings.comments_enabled); setCommentsEnabled(settings.comments_enabled);
} }
if (settings.min_tip_amount_comment !== undefined) { if (settings.min_tip_amount_comment !== undefined) {
setMinTipAmountComment(settings.min_tip_amount_comment); setMinTip(settings.min_tip_amount_comment);
} }
if (settings.min_tip_amount_super_chat !== undefined) { if (settings.min_tip_amount_super_chat !== undefined) {
setMinTipAmountSuperChat(settings.min_tip_amount_super_chat); setMinSuper(settings.min_tip_amount_super_chat);
} }
if (settings.slow_mode_min_gap !== undefined) { if (settings.slow_mode_min_gap !== undefined) {
setSlowModeMinGap(settings.slow_mode_min_gap); setSlowModeMin(settings.slow_mode_min_gap);
} }
if (settings.words) { if (settings.words) {
doSetMutedWordTags(settings.words); doSetMutedWordTags(settings.words);
@ -111,6 +122,18 @@ export default function SettingsCreatorPage(props: Props) {
setLastUpdated(Date.now()); setLastUpdated(Date.now());
} }
function pushSlowModeMin(value: number, activeChannelClaim: ChannelClaim) {
updateCreatorSettings(activeChannelClaim, { slow_mode_min_gap: value });
}
function pushMinTip(value: number, activeChannelClaim: ChannelClaim) {
updateCreatorSettings(activeChannelClaim, { min_tip_amount_comment: value });
}
function pushMinSuper(value: number, activeChannelClaim: ChannelClaim) {
updateCreatorSettings(activeChannelClaim, { min_tip_amount_super_chat: value });
}
function addMutedWords(newTags: Array<Tag>) { function addMutedWords(newTags: Array<Tag>) {
const validatedNewTags = []; const validatedNewTags = [];
newTags.forEach((newTag) => { newTags.forEach((newTag) => {
@ -174,6 +197,9 @@ export default function SettingsCreatorPage(props: Props) {
} }
} }
// **************************************************************************
// **************************************************************************
// 'moderatorSearchTerm' to 'moderatorSearchClaimUri' // 'moderatorSearchTerm' to 'moderatorSearchClaimUri'
React.useEffect(() => { React.useEffect(() => {
if (!moderatorSearchTerm) { if (!moderatorSearchTerm) {
@ -246,6 +272,9 @@ export default function SettingsCreatorPage(props: Props) {
} }
}, [lastUpdated, activeChannelClaim, fetchCreatorSettings]); }, [lastUpdated, activeChannelClaim, fetchCreatorSettings]);
// **************************************************************************
// **************************************************************************
const isBusy = const isBusy =
!activeChannelClaim || !settingsByChannelId || settingsByChannelId[activeChannelClaim.claim_id] === undefined; !activeChannelClaim || !settingsByChannelId || settingsByChannelId[activeChannelClaim.claim_id] === undefined;
const isDisabled = const isDisabled =
@ -293,8 +322,13 @@ export default function SettingsCreatorPage(props: Props) {
step={1} step={1}
type="number" type="number"
placeholder="1" placeholder="1"
value={slowModeMinGap} value={slowModeMin}
onChange={(e) => setSettings({ slow_mode_min_gap: parseInt(e.target.value) })} onChange={(e) => {
const value = parseInt(e.target.value);
setSlowModeMin(value);
pushSlowModeMinDebounced(value, activeChannelClaim);
}}
onBlur={() => setLastUpdated(Date.now())}
/> />
</> </>
} }
@ -335,9 +369,18 @@ export default function SettingsCreatorPage(props: Props) {
min={LBC_MIN} min={LBC_MIN}
step={LBC_STEP} step={LBC_STEP}
type="number" type="number"
placeholder="3.14" placeholder="1"
value={minTipAmountComment} value={minTip}
onChange={(e) => setSettings({ min_tip_amount_comment: parseFloat(e.target.value) })} onChange={(e) => {
const newMinTip = parseFloat(e.target.value);
setMinTip(newMinTip);
pushMinTipDebounced(newMinTip, activeChannelClaim);
if (newMinTip !== 0 && minSuper !== 0) {
setMinSuper(0);
pushMinSuperDebounced(0, activeChannelClaim);
}
}}
onBlur={() => setLastUpdated(Date.now())}
/> />
<FormField <FormField
name="min_tip_amount_super_chat" name="min_tip_amount_super_chat"
@ -349,7 +392,7 @@ export default function SettingsCreatorPage(props: Props) {
{__( {__(
'Enabling a minimum amount to hyperchat will force all TIPPED comments to have this value in order to be shown. This still allows regular comments to be posted.' 'Enabling a minimum amount to hyperchat will force all TIPPED comments to have this value in order to be shown. This still allows regular comments to be posted.'
)} )}
{minTipAmountComment !== 0 && ( {minTip !== 0 && (
<p className="help--inline"> <p className="help--inline">
<em>{__('(This settings is not applicable if all comments require a tip.)')}</em> <em>{__('(This settings is not applicable if all comments require a tip.)')}</em>
</p> </p>
@ -361,9 +404,14 @@ export default function SettingsCreatorPage(props: Props) {
step="any" step="any"
type="number" type="number"
placeholder="1" placeholder="1"
value={minTipAmountSuperChat} value={minSuper}
disabled={minTipAmountComment !== 0} disabled={minTip !== 0}
onChange={(e) => setSettings({ min_tip_amount_super_chat: parseFloat(e.target.value) })} onChange={(e) => {
const newMinSuper = parseFloat(e.target.value);
setMinSuper(newMinSuper);
pushMinSuperDebounced(newMinSuper, activeChannelClaim);
}}
onBlur={() => setLastUpdated(Date.now())}
/> />
</> </>
} }