From 3762dd624976217210f133dfda94d90551cc18b1 Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?KMY=EF=BC=88=E9=9B=AA=E3=81=82=E3=81=99=E3=81=8B=EF=BC=89?= Date: Fri, 26 Jan 2024 13:43:40 +0900 Subject: [PATCH] =?UTF-8?q?Change:=20=E3=82=B9=E3=83=9E=E3=83=9B=E3=81=8B?= =?UTF-8?q?=E3=82=89=E5=85=AC=E9=96=8B=E7=AF=84=E5=9B=B2=E3=81=AA=E3=81=A9?= =?UTF-8?q?=E3=81=AE=E9=81=B8=E6=8A=9E=E8=82=A2=E3=82=92=E8=A1=A8=E7=A4=BA?= =?UTF-8?q?=E3=81=99=E3=82=8B=E3=81=A8=E3=81=8D=E3=81=AE=E3=83=87=E3=82=B6?= =?UTF-8?q?=E3=82=A4=E3=83=B3=E3=82=92=E8=AA=BF=E6=95=B4=20(#508)?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- .../compose/components/circle_dropdown.jsx | 18 ++++++++++--- .../components/expiration_dropdown.jsx | 18 ++++++++++--- .../compose/components/privacy_dropdown.jsx | 25 ++++++++++++++++--- .../components/searchability_dropdown.jsx | 25 ++++++++++++++++--- .../containers/privacy_dropdown_container.js | 4 +-- 5 files changed, 74 insertions(+), 16 deletions(-) diff --git a/app/javascript/mastodon/features/compose/components/circle_dropdown.jsx b/app/javascript/mastodon/features/compose/components/circle_dropdown.jsx index 7bbdf8ff50..d366200e2f 100644 --- a/app/javascript/mastodon/features/compose/components/circle_dropdown.jsx +++ b/app/javascript/mastodon/features/compose/components/circle_dropdown.jsx @@ -148,11 +148,21 @@ class CircleDropdown extends PureComponent { }; handleToggle = () => { - if (this.state.open && this.activeElement) { - this.activeElement.focus({ preventScroll: true }); + if (this.props.isUserTouching && this.props.isUserTouching()) { + if (this.state.open) { + this.props.onModalClose(); + } else { + this.props.onModalOpen({ + actions: this.options.map(option => ({ ...option, active: option.value === this.props.circleId })), + onClick: this.handleModalActionClick, + }); + } + } else { + if (this.state.open && this.activeElement) { + this.activeElement.focus({ preventScroll: true }); + } + this.setState({ open: !this.state.open }); } - - this.setState({ open: !this.state.open }); }; handleModalActionClick = (e) => { diff --git a/app/javascript/mastodon/features/compose/components/expiration_dropdown.jsx b/app/javascript/mastodon/features/compose/components/expiration_dropdown.jsx index b7d5aa47b6..44f946bcb8 100644 --- a/app/javascript/mastodon/features/compose/components/expiration_dropdown.jsx +++ b/app/javascript/mastodon/features/compose/components/expiration_dropdown.jsx @@ -142,11 +142,21 @@ class ExpirationDropdown extends PureComponent { }; handleToggle = () => { - if (this.state.open && this.activeElement) { - this.activeElement.focus({ preventScroll: true }); + if (this.props.isUserTouching && this.props.isUserTouching()) { + if (this.state.open) { + this.props.onModalClose(); + } else { + this.props.onModalOpen({ + actions: this.options.map(option => ({ ...option, active: false })), + onClick: this.handleModalActionClick, + }); + } + } else { + if (this.state.open && this.activeElement) { + this.activeElement.focus({ preventScroll: true }); + } + this.setState({ open: !this.state.open }); } - - this.setState({ open: !this.state.open }); }; handleModalActionClick = (e) => { diff --git a/app/javascript/mastodon/features/compose/components/privacy_dropdown.jsx b/app/javascript/mastodon/features/compose/components/privacy_dropdown.jsx index e4548f9b41..ebfe620517 100644 --- a/app/javascript/mastodon/features/compose/components/privacy_dropdown.jsx +++ b/app/javascript/mastodon/features/compose/components/privacy_dropdown.jsx @@ -188,11 +188,30 @@ class PrivacyDropdown extends PureComponent { }; handleToggle = () => { - if (this.state.open && this.activeElement) { - this.activeElement.focus({ preventScroll: true }); + if (this.props.isUserTouching && this.props.isUserTouching()) { + if (this.state.open) { + this.props.onModalClose(); + } else { + this.props.onModalOpen({ + actions: this.options.map(option => ({ ...option, active: option.value === this.props.value })), + onClick: this.handleModalActionClick, + }); + } + } else { + if (this.state.open && this.activeElement) { + this.activeElement.focus({ preventScroll: true }); + } + this.setState({ open: !this.state.open }); } + }; - this.setState({ open: !this.state.open }); + handleModalActionClick = (e) => { + e.preventDefault(); + + const { value } = this.options[e.currentTarget.getAttribute('data-index')]; + + this.props.onModalClose(); + this.props.onChange(value); }; handleKeyDown = e => { diff --git a/app/javascript/mastodon/features/compose/components/searchability_dropdown.jsx b/app/javascript/mastodon/features/compose/components/searchability_dropdown.jsx index 3b8061bd0d..55ac5de362 100644 --- a/app/javascript/mastodon/features/compose/components/searchability_dropdown.jsx +++ b/app/javascript/mastodon/features/compose/components/searchability_dropdown.jsx @@ -165,11 +165,30 @@ class SearchabilityDropdown extends PureComponent { }; handleToggle = () => { - if (this.state.open && this.activeElement) { - this.activeElement.focus({ preventScroll: true }); + if (this.props.isUserTouching && this.props.isUserTouching()) { + if (this.state.open) { + this.props.onModalClose(); + } else { + this.props.onModalOpen({ + actions: this.options.map(option => ({ ...option, active: option.value === this.props.value })), + onClick: this.handleModalActionClick, + }); + } + } else { + if (this.state.open && this.activeElement) { + this.activeElement.focus({ preventScroll: true }); + } + this.setState({ open: !this.state.open }); } + }; - this.setState({ open: !this.state.open }); + handleModalActionClick = (e) => { + e.preventDefault(); + + const { value } = this.options[e.currentTarget.getAttribute('data-index')]; + + this.props.onModalClose(); + this.props.onChange(value); }; handleKeyDown = e => { diff --git a/app/javascript/mastodon/features/compose/containers/privacy_dropdown_container.js b/app/javascript/mastodon/features/compose/containers/privacy_dropdown_container.js index 89a001a222..bffbc059c8 100644 --- a/app/javascript/mastodon/features/compose/containers/privacy_dropdown_container.js +++ b/app/javascript/mastodon/features/compose/containers/privacy_dropdown_container.js @@ -17,11 +17,11 @@ const mapDispatchToProps = dispatch => ({ }, isUserTouching, - onModalOpen: props => dispatch(openModal({ + onModalOpen: props => dispatch(openModal({ // kmyblue: Do not remove modalType: 'ACTIONS', modalProps: props, })), - onModalClose: () => dispatch(closeModal({ + onModalClose: () => dispatch(closeModal({ // kmyblue: Do not remove modalType: undefined, ignoreFocus: false, })),