-
-
Notifications
You must be signed in to change notification settings - Fork 349
Commit
This commit does not belong to any branch on this repository, and may belong to a fork outside of the repository.
[frontend] Better autocapitalize/spellcheck settings on forms (#3077)
- Loading branch information
1 parent
5769722
commit bbbf6eb
Showing
20 changed files
with
205 additions
and
38 deletions.
There are no files selected for viewing
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
|
|
@@ -79,7 +79,10 @@ function InstanceSettingsForm({ data: instance }: InstanceSettingsFormProps) { | |
| const [submitForm, result] = useFormSubmit(form, useUpdateInstanceMutation()); | ||
|
|
||
| return ( | ||
| <form onSubmit={submitForm}> | ||
| <form | ||
| onSubmit={submitForm} | ||
| autoComplete="none" | ||
| > | ||
| <h1>Instance Settings</h1> | ||
|
|
||
| <div className="form-section-docs"> | ||
|
|
@@ -97,7 +100,8 @@ function InstanceSettingsForm({ data: instance }: InstanceSettingsFormProps) { | |
| <TextInput | ||
| field={form.title} | ||
| label={`Instance title (max ${titleLimit} characters)`} | ||
| placeholder="My GoToSocial instance" | ||
| autoCapitalize="words" | ||
| placeholder="My GoToSocial Instance" | ||
| /> | ||
|
|
||
| <div className="file-upload" aria-labelledby="avatar"> | ||
|
|
@@ -117,6 +121,7 @@ function InstanceSettingsForm({ data: instance }: InstanceSettingsFormProps) { | |
| field={form.thumbnailDesc} | ||
| label="Avatar image description" | ||
| placeholder="A cute drawing of a smiling sloth." | ||
| autoCapitalize="sentences" | ||
| /> | ||
| </div> | ||
| </div> | ||
|
|
@@ -139,20 +144,23 @@ function InstanceSettingsForm({ data: instance }: InstanceSettingsFormProps) { | |
| field={form.shortDesc} | ||
| label={`Short description (markdown accepted, max ${shortDescLimit} characters)`} | ||
| placeholder="A small testing instance for the GoToSocial alpha software." | ||
| autoCapitalize="sentences" | ||
| rows={6} | ||
| /> | ||
|
|
||
| <TextArea | ||
| field={form.description} | ||
| label={`Full description (markdown accepted, max ${descLimit} characters)`} | ||
| placeholder="A small testing instance for the GoToSocial alpha software. Just trying it out, my main instance is https://example.com" | ||
| autoCapitalize="sentences" | ||
| rows={6} | ||
| /> | ||
|
|
||
| <TextArea | ||
| field={form.terms} | ||
| label={`Terms & Conditions (markdown accepted, max ${termsLimit} characters)`} | ||
| placeholder="Terms and conditions of using this instance, data policy, imprint, GDPR stuff, yadda yadda." | ||
| autoCapitalize="sentences" | ||
| rows={6} | ||
| /> | ||
|
|
||
|
|
@@ -172,12 +180,15 @@ function InstanceSettingsForm({ data: instance }: InstanceSettingsFormProps) { | |
| field={form.contactUser} | ||
| label="Contact user (local account username)" | ||
| placeholder="admin" | ||
| autoCapitalize="none" | ||
| spellCheck="false" | ||
| /> | ||
|
|
||
| <TextInput | ||
| field={form.contactEmail} | ||
| label="Contact email" | ||
| placeholder="[email protected]" | ||
| type="email" | ||
| /> | ||
|
|
||
| <MutationButton label="Save" result={result} disabled={false} /> | ||
|
|
||
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
|
|
@@ -27,6 +27,7 @@ import MutationButton from "../../../../components/form/mutation-button"; | |
| import { useLocation, useSearch } from "wouter"; | ||
| import { AdminAccount } from "../../../../lib/types/account"; | ||
| import Username from "../../../../components/username"; | ||
| import isValidDomain from "is-valid-domain"; | ||
|
|
||
| export function AccountSearchForm() { | ||
| const [ location, setLocation ] = useLocation(); | ||
|
|
@@ -42,7 +43,31 @@ export function AccountSearchForm() { | |
| permissions: useTextInput("permissions", { defaultValue: urlQueryParams.get("permissions") ?? ""}), | ||
| username: useTextInput("username", { defaultValue: urlQueryParams.get("username") ?? ""}), | ||
| display_name: useTextInput("display_name", { defaultValue: urlQueryParams.get("display_name") ?? ""}), | ||
| by_domain: useTextInput("by_domain", { defaultValue: urlQueryParams.get("by_domain") ?? ""}), | ||
| by_domain: useTextInput("by_domain", { | ||
| defaultValue: urlQueryParams.get("by_domain") ?? "", | ||
| validator: (v: string) => { | ||
| if (v.length === 0) { | ||
| return ""; | ||
| } | ||
|
|
||
| if (v[v.length-1] === ".") { | ||
| return "invalid domain"; | ||
| } | ||
|
|
||
| const valid = isValidDomain(v, { | ||
| subdomain: true, | ||
| wildcard: false, | ||
| allowUnicode: true, | ||
| topLevel: false, | ||
| }); | ||
|
|
||
| if (valid) { | ||
| return ""; | ||
| } | ||
|
|
||
| return "invalid domain"; | ||
| } | ||
| }), | ||
| email: useTextInput("email", { defaultValue: urlQueryParams.get("email") ?? ""}), | ||
| ip: useTextInput("ip", { defaultValue: urlQueryParams.get("ip") ?? ""}), | ||
| limit: useTextInput("limit", { defaultValue: urlQueryParams.get("limit") ?? "50"}) | ||
|
|
@@ -109,13 +134,17 @@ export function AccountSearchForm() { | |
| > | ||
| <TextInput | ||
| field={form.username} | ||
| label={"(Optional) username (without leading '@' symbol)"} | ||
| label={`Username (without "@" prefix) - case sensitive`} | ||
| placeholder="someone" | ||
| autoCapitalize="none" | ||
| spellCheck="false" | ||
| /> | ||
| <TextInput | ||
| field={form.by_domain} | ||
| label={"(Optional) domain"} | ||
| label={`Domain (without "https://" prefix)`} | ||
| placeholder="example.org" | ||
| autoCapitalize="none" | ||
| spellCheck="false" | ||
| /> | ||
| <Select | ||
| field={form.origin} | ||
|
|
@@ -130,15 +159,18 @@ export function AccountSearchForm() { | |
| ></Select> | ||
| <TextInput | ||
| field={form.email} | ||
| label={"(Optional) email address (local accounts only)"} | ||
| label={"Email address (local accounts only)"} | ||
| placeholder={"[email protected]"} | ||
| // Get email validation for free. | ||
| {...{type: "email"}} | ||
| type="email" | ||
| /> | ||
| <TextInput | ||
| field={form.ip} | ||
| label={"(Optional) IP address (local accounts only)"} | ||
| label={"IP address (local accounts only)"} | ||
| placeholder={"198.51.100.0"} | ||
| autoCapitalize="none" | ||
| spellCheck="false" | ||
| className="monospace" | ||
| /> | ||
| <Select | ||
| field={form.status} | ||
|
|
||
Oops, something went wrong.