From 548c032dbb90ae9c06b05fc05724c49d0b552fd9 Mon Sep 17 00:00:00 2001 From: Claire Date: Tue, 5 Sep 2023 23:49:48 +0200 Subject: [PATCH] Improve interaction modal error handling (#26795) --- .../api/v1/peers/search_controller.rb | 2 + .../features/interaction_modal/index.jsx | 52 ++++++++++++++++--- .../packs/remote_interaction_helper.ts | 4 +- 3 files changed, 51 insertions(+), 7 deletions(-) diff --git a/app/controllers/api/v1/peers/search_controller.rb b/app/controllers/api/v1/peers/search_controller.rb index 2c0eacdca..0c503d9bc 100644 --- a/app/controllers/api/v1/peers/search_controller.rb +++ b/app/controllers/api/v1/peers/search_controller.rb @@ -41,5 +41,7 @@ class Api::V1::Peers::SearchController < Api::BaseController domain = TagManager.instance.normalize_domain(domain) @domains = Instance.searchable.where(Instance.arel_table[:domain].matches("#{Instance.sanitize_sql_like(domain)}%", false, true)).limit(10).pluck(:domain) end + rescue Addressable::URI::InvalidURIError + @domains = [] end end diff --git a/app/javascript/mastodon/features/interaction_modal/index.jsx b/app/javascript/mastodon/features/interaction_modal/index.jsx index 84e430925..2a9fa0e33 100644 --- a/app/javascript/mastodon/features/interaction_modal/index.jsx +++ b/app/javascript/mastodon/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 && ( diff --git a/app/javascript/packs/remote_interaction_helper.ts b/app/javascript/packs/remote_interaction_helper.ts index 76528ff38..d5834c6c3 100644 --- a/app/javascript/packs/remote_interaction_helper.ts +++ b/app/javascript/packs/remote_interaction_helper.ts @@ -140,7 +140,9 @@ const fromAcct = (acct: string) => { }; const fetchInteractionURL = (uri_or_domain: string) => { - if (/^https?:\/\//.test(uri_or_domain)) { + if (uri_or_domain === '') { + fetchInteractionURLFailure(); + } else if (/^https?:\/\//.test(uri_or_domain)) { fromURL(uri_or_domain); } else if (uri_or_domain.includes('@')) { fromAcct(uri_or_domain);