Conversation
|
The commit history here needs to be cleaned up. The zulip/zulip contributing guide will be very helpful on this and other advice for making a quality reviewable PR. Check out our GitHub guide and commit guidelines for more details. |
| onChange: () => void; | ||
| }; | ||
|
|
||
| const subdomainPattern = /^[a-zA-Z\d-]+$/; |
There was a problem hiding this comment.
How did you check whether this was correct? Ideally a reference to zulip/zulip API docs would be good here.
There was a problem hiding this comment.
For the pattern I referred the issue discussion where the spec is described as "subdomain can only have lowercase letters, numbers, and dashes." I also checked zulip.com/help/change-organization-url which confirms the .zulipchat.com format but doesn't mention character constraints.
Looking at this more carefully, the current pattern /^[a-zA-Z\d-]+$/ permits uppercase letters. I'll tighten it to /^[a-z\d-]+$/ and add a comment explaining the constraint.
I'll also clean up the commit history into a single well-described commit now.
Restores the autoComplete function removed in a prior refactor, which caused bare subdomains like "myteam" to resolve to "https://myteam" instead of "https://myteam.zulipchat.com" on connect. Adds a ghost-text suffix showing ".zulipchat.com" after the cursor while typing, hiding it when a dot, slash, or protocol is detected. Subdomain pattern restricted to lowercase letters, digits, and hyphens per the spec in the issue description. Fixes: zulip#1012
6461ccb to
6e44a6b
Compare
Fixes #1012
Autocomplete to the Organisation URL input and adds inline ghost-text to show the behaviour visually while typing.
Problem
Typing myteam and hitting Connect now resolves to https://myteam instead of https://myteam.zulipchat.com. it should be shown to the user within the input field before they submit.
Changes Made
HTML (new-server-form.ts)
Restored the autoComplete function — bare subdomains are expanded to https://.zulipchat.com on submit, anything containing a dot, slash, or protocol is passed through untouched
Wrapped the inside a styled to look like the input box to allow the ghost suffix to sit inline with the typed text
Added a ghost suffix that displays .zulipchat.com directly after the cursor when a bare subdomain is detected, giving the user a preview before hitting Connect
Added an invisible measuring that mirrors the typed text so its pixel width can be read and applied to the input, keeping the suffix flush against the last character
CSS (preferences.css)
Added label#new-server-url-label:focus-within alongside the existing .setting-input-value:focus rule so the teal focus border fires correctly through the label wrapper
Added width: 100% as the default on #new-server-url-input so the placeholder renders in full, with JS overriding this to a pixel value only while the suffix is visible
All new rules are scoped to four unique IDs (#new-server-url-label, #new-server-url-input, #new-server-url-domain, #new-server-url-size-calc) so there is zero risk of affecting any other input or form in the preferences component
Testing
Verified myteam now correctly resolves to https://myteam.zulipchat.com on submit
Tested with full URLs, self-hosted domains, and explicit http:// to confirm they are passed through untouched
Screen Capture
Autofill.for.new.org.mp4