diff --git a/app/javascript/flavours/glitch/features/interaction_modal/index.jsx b/app/javascript/flavours/glitch/features/interaction_modal/index.jsx index bbfa9af8d..77c0122e2 100644 --- a/app/javascript/flavours/glitch/features/interaction_modal/index.jsx +++ b/app/javascript/flavours/glitch/features/interaction_modal/index.jsx @@ -100,8 +100,41 @@ class LoginForm extends React.PureComponent { this.input = c; }; + isValueValid = (value) => { + let likelyAcct = false; + let url = null; + + if (value.startsWith('/')) { + return false; + } + + if (value.startsWith('@')) { + value = value.slice(1); + likelyAcct = true; + } + + // The user is in the middle of typing something, do not error out + if (value === '') { + return true; + } + + if (/^https?:\/\//.test(value) && !likelyAcct) { + url = value; + } else { + url = `https://${value}`; + } + + try { + new URL(url); + return true; + } catch(_) { + return false; + } + }; + handleChange = ({ target }) => { - this.setState(state => ({ value: target.value, isLoading: true, error: false, options: addInputToOptions(target.value, state.networkOptions) }), () => this._loadOptions()); + const error = !this.isValueValid(target.value); + this.setState(state => ({ error, value: target.value, isLoading: true, options: addInputToOptions(target.value, state.networkOptions) }), () => this._loadOptions()); }; handleMessage = (event) => { @@ -115,11 +148,18 @@ class LoginForm extends React.PureComponent { this.setState({ isSubmitting: false, error: true }); } else if (event.data?.type === 'fetchInteractionURL-success') { if (/^https?:\/\//.test(event.data.template)) { - if (localStorage) { - localStorage.setItem(PERSISTENCE_KEY, event.data.uri_or_domain); - } + try { + const url = new URL(event.data.template.replace('{uri}', encodeURIComponent(resourceUrl))); - window.location.href = event.data.template.replace('{uri}', encodeURIComponent(resourceUrl)); + if (localStorage) { + localStorage.setItem(PERSISTENCE_KEY, event.data.uri_or_domain); + } + + window.location.href = url; + } catch (e) { + console.error(e); + this.setState({ isSubmitting: false, error: true }); + } } else { this.setState({ isSubmitting: false, error: true }); } @@ -259,7 +299,7 @@ class LoginForm extends React.PureComponent { spellcheck='false' /> - + {hasPopOut && (