mirror of
https://github.com/discourse/discourse.git
synced 2025-02-28 09:34:27 +08:00

Followup to e113eff6634c9b398b0541ea6a0d1626f6732dcc We previously sanitized input for integer site settings on the server side only, which was a bit confusing when users would enter e.g. 100.5 and end up with 1005, and not see this reflected in the UI. Now that we are using native number inputs for these settings, we can improve the experience a bit by not allowing `.` or `,` in the input, because it should be whole numbers only, and add a step size of 1. All other characters are already prevented in this native number input.
42 lines
1.1 KiB
Plaintext
42 lines
1.1 KiB
Plaintext
import Component from "@glimmer/component";
|
|
import { on } from "@ember/modifier";
|
|
import { action } from "@ember/object";
|
|
import SettingValidationMessage from "admin/components/setting-validation-message";
|
|
import SiteSettingDescription from "admin/components/site-settings/description";
|
|
|
|
export default class SiteSettingsInteger extends Component {
|
|
@action
|
|
updateValue(event) {
|
|
const num = parseInt(event.target.value, 10);
|
|
|
|
if (isNaN(num)) {
|
|
return;
|
|
}
|
|
|
|
this.args.changeValueCallback(num);
|
|
}
|
|
|
|
@action
|
|
preventDecimal(event) {
|
|
if (event.key === "." || event.key === ",") {
|
|
event.preventDefault();
|
|
}
|
|
}
|
|
|
|
<template>
|
|
<input
|
|
{{on "keydown" this.preventDecimal}}
|
|
{{on "input" this.updateValue}}
|
|
type="number"
|
|
value={{@value}}
|
|
min={{if @setting.min @setting.min null}}
|
|
max={{if @setting.max @setting.max null}}
|
|
class="input-setting-integer"
|
|
step="1"
|
|
/>
|
|
|
|
<SettingValidationMessage @message={{@validationMessage}} />
|
|
<SiteSettingDescription @description={{@setting.description}} />
|
|
</template>
|
|
}
|