mirror of
https://github.com/fluxerapp/fluxer
synced 2026-10-17 21:15:32 +09:00
fix(app): allow custom slowmode values (#1584)
This commit is contained in:
1 parent
09ea748479
commit
5cc92469aa
5 files changed
+91
-51
No files matched your search
+1
-2
@@ -83,7 +83,6 @@ const ChannelOverviewTab: React.FC<{channelId: string}> = observer(({channelId})
|
||||
const isVoiceChannel = channel?.type === ChannelTypes.GUILD_VOICE;
|
||||
const [rtcRegions, setRtcRegions] = useState<Array<ChannelRtcRegion>>([]);
|
||||
const [isLoadingRegions, setIsLoadingRegions] = useState(false);
|
||||
const remoteSlowmodeSeconds = channel == null ? 0 : channel.rateLimitPerUser;
|
||||
const form = useForm<FormInputs>({
|
||||
defaultValues: {
|
||||
name: '',
|
||||
@@ -303,7 +302,7 @@ const ChannelOverviewTab: React.FC<{channelId: string}> = observer(({channelId})
|
||||
initialTopic={remoteValues != null && remoteValues.topic != null ? remoteValues.topic : ''}
|
||||
onTopicExceedsLimit={handleTopicExceedsLimit}
|
||||
/>
|
||||
<SlowmodeControl form={form} remoteSlowmodeSeconds={remoteSlowmodeSeconds} />
|
||||
<SlowmodeControl form={form} />
|
||||
</div>
|
||||
)}
|
||||
{showVoiceSection && (
|
||||
|
||||
+12
-38
@@ -12,7 +12,6 @@ import type {I18n} from '@lingui/core';
|
||||
import {msg} from '@lingui/core/macro';
|
||||
import {useLingui} from '@lingui/react/macro';
|
||||
import type React from 'react';
|
||||
import {useMemo} from 'react';
|
||||
import {Controller, type UseFormReturn} from 'react-hook-form';
|
||||
|
||||
const SLOWMODE_DESCRIPTOR = msg({
|
||||
@@ -48,30 +47,6 @@ const SLOWMODE_STOP_SECONDS: ReadonlyArray<number> = [
|
||||
];
|
||||
const SLOWMODE_MARKER_SECONDS: ReadonlyArray<number> = [0, 60, 3600, 21600];
|
||||
|
||||
function buildSlowmodeStops(remoteSeconds: number): Array<number> {
|
||||
const boundedSeconds = Math.min(
|
||||
Math.max(Math.round(remoteSeconds), CHANNEL_RATE_LIMIT_PER_USER_MIN),
|
||||
CHANNEL_RATE_LIMIT_PER_USER_MAX,
|
||||
);
|
||||
if (SLOWMODE_STOP_SECONDS.includes(boundedSeconds)) {
|
||||
return [...SLOWMODE_STOP_SECONDS];
|
||||
}
|
||||
return [...SLOWMODE_STOP_SECONDS, boundedSeconds].sort((left, right) => left - right);
|
||||
}
|
||||
|
||||
function findNearestStopIndex(stops: ReadonlyArray<number>, seconds: number): number {
|
||||
let nearestIndex = 0;
|
||||
let nearestDistance = Number.POSITIVE_INFINITY;
|
||||
for (let index = 0; index < stops.length; index++) {
|
||||
const distance = Math.abs(stops[index] - seconds);
|
||||
if (distance < nearestDistance) {
|
||||
nearestIndex = index;
|
||||
nearestDistance = distance;
|
||||
}
|
||||
}
|
||||
return nearestIndex;
|
||||
}
|
||||
|
||||
function formatSlowmodeDuration(i18n: I18n, seconds: number): string {
|
||||
if (seconds === 0) {
|
||||
return i18n._(OFF_DESCRIPTOR);
|
||||
@@ -87,13 +62,10 @@ function formatSlowmodeDuration(i18n: I18n, seconds: number): string {
|
||||
|
||||
interface SlowmodeControlProps {
|
||||
form: UseFormReturn<FormInputs>;
|
||||
remoteSlowmodeSeconds: number;
|
||||
}
|
||||
|
||||
export const SlowmodeControl: React.FC<SlowmodeControlProps> = ({form, remoteSlowmodeSeconds}) => {
|
||||
export const SlowmodeControl: React.FC<SlowmodeControlProps> = ({form}) => {
|
||||
const {i18n} = useLingui();
|
||||
const stops = useMemo(() => buildSlowmodeStops(remoteSlowmodeSeconds), [remoteSlowmodeSeconds]);
|
||||
const markerIndexes = useMemo(() => SLOWMODE_MARKER_SECONDS.map((seconds) => stops.indexOf(seconds)), [stops]);
|
||||
const slowmodeLabel = i18n._(SLOWMODE_DESCRIPTOR);
|
||||
const bypassSlowmodePermissionLabel = formatPermissionLabel(i18n, Permissions.BYPASS_SLOWMODE);
|
||||
const resetSliderLabel = i18n._(RESET_SLIDER_TO_DEFAULT_VALUE_DESCRIPTOR);
|
||||
@@ -108,7 +80,6 @@ export const SlowmodeControl: React.FC<SlowmodeControlProps> = ({form, remoteSlo
|
||||
} else {
|
||||
currentSeconds = 0;
|
||||
}
|
||||
const currentIndex = findNearestStopIndex(stops, currentSeconds);
|
||||
return (
|
||||
<SettingsControlRow
|
||||
label={slowmodeLabel}
|
||||
@@ -118,18 +89,21 @@ export const SlowmodeControl: React.FC<SlowmodeControlProps> = ({form, remoteSlo
|
||||
>
|
||||
<div className={styles.settingsSliderControl}>
|
||||
<Slider
|
||||
value={currentIndex}
|
||||
defaultValue={currentIndex}
|
||||
value={currentSeconds}
|
||||
defaultValue={currentSeconds}
|
||||
factoryDefaultValue={0}
|
||||
minValue={0}
|
||||
maxValue={stops.length - 1}
|
||||
minValue={CHANNEL_RATE_LIMIT_PER_USER_MIN}
|
||||
maxValue={CHANNEL_RATE_LIMIT_PER_USER_MAX}
|
||||
step={1}
|
||||
markers={markerIndexes}
|
||||
equidistant
|
||||
markers={SLOWMODE_STOP_SECONDS}
|
||||
ariaLabel={slowmodeLabel}
|
||||
ariaValueText={formatSlowmodeDuration(i18n, currentSeconds)}
|
||||
onMarkerRender={(index) => formatSlowmodeDuration(i18n, stops[index])}
|
||||
onValueRender={(index) => formatSlowmodeDuration(i18n, stops[Math.round(index)])}
|
||||
onValueChange={(index) => field.onChange(stops[Math.round(index)])}
|
||||
onMarkerRender={(seconds) =>
|
||||
SLOWMODE_MARKER_SECONDS.includes(seconds) ? formatSlowmodeDuration(i18n, seconds) : null
|
||||
}
|
||||
onValueRender={(seconds) => formatSlowmodeDuration(i18n, Math.round(seconds))}
|
||||
onValueChange={(seconds) => field.onChange(Math.round(seconds))}
|
||||
showResetButton={true}
|
||||
onReset={() => field.onChange(0)}
|
||||
resetTooltip={resetSliderLabel}
|
||||
|
||||
Reference in new issue
Block a user