matty/ncd-fe
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Use media query to detect touchscreens

Browse Source 
Signed-off-by: marcin mikołajczak <git@mkljczk.pl>
This commit is contained in:
marcin mikołajczak
2024-02-07 17:33:22 +01:00
parent ebf48dd830
commit 5e801b899d
5 changed files with 12 additions and 29 deletions
Download Patch File Download Diff File Expand all files Collapse all files

8
src/components/dropdown-menu/dropdown-menu.tsx
View File

@ -7,7 +7,7 @@ import { useHistory } from 'react-router-dom';
import { closeDropdownMenu as closeDropdownMenuRedux, openDropdownMenu } from 'soapbox/actions/dropdown-menu';
import { closeModal, openModal } from 'soapbox/actions/modals';
import { useAppDispatch } from 'soapbox/hooks';
import { isUserTouching } from 'soapbox/is-mobile';
import { userTouching } from 'soapbox/is-mobile';
import { IconButton, Portal } from '../ui';
@ -53,8 +53,6 @@ const DropdownMenu = (props: IDropdownMenu) => {
const arrowRef = useRef<HTMLDivElement>(null);
const isOnMobile = isUserTouching();
const { x, y, strategy, refs, middlewareData, placement } = useFloating<HTMLButtonElement>({
placement: initialPlacement,
middleware: [
@ -92,7 +90,7 @@ const DropdownMenu = (props: IDropdownMenu) => {
* On mobile screens, let's replace the Popper dropdown with a Modal.
*/
const handleOpen = () => {
if (isOnMobile) {
if (userTouching.matches) {
dispatch(
openModal('ACTIONS', {
status: filteredProps.status,
@ -113,7 +111,7 @@ const DropdownMenu = (props: IDropdownMenu) => {
const handleClose = () => {
(refs.reference.current as HTMLButtonElement)?.focus();
if (isOnMobile) {
if (userTouching.matches) {
dispatch(closeModal('ACTIONS'));
} else {
closeDropdownMenu();