fix(app): allow custom slowmode values (#1584)

This commit is contained in:
Hampus authored and GitHub committed 2026-08-13 21:18:09 +02:00
1 parent 09ea748479
commit 5cc92469aa
5 files changed
+91 -51

No files matched your search

@@ -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,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}