Fixes for mobile.
Some checks are pending
Create docker images (cloud) / Build, push, and deploy (push) Waiting to run
Node.js CI / build (postgresql, 18.18, 10) (push) Waiting to run

This commit is contained in:
Mike Cao 2025-10-18 01:12:45 -07:00
parent bcafa12349
commit 9a5604f236
11 changed files with 38 additions and 58 deletions

View file

@ -6,9 +6,9 @@ import {
cloneElement,
isValidElement,
} from 'react';
import { SearchField, Row, Column, useBreakpoint } from '@umami/react-zen';
import { SearchField, Row, Column } from '@umami/react-zen';
import { UseQueryResult } from '@tanstack/react-query';
import { useMessages, useNavigation } from '@/components/hooks';
import { useMessages, useMobile, useNavigation } from '@/components/hooks';
import { Pager } from '@/components/common/Pager';
import { LoadingPanel } from '@/components/common/LoadingPanel';
import { PageResult } from '@/lib/types';
@ -42,8 +42,8 @@ export function DataGrid({
const { router, updateParams, query: queryParams } = useNavigation();
const [search, setSearch] = useState(queryParams?.search || data?.search || '');
const showPager = allowPaging && data && data.count > data.pageSize;
const breakpoint = useBreakpoint();
const displayMode = ['xs', 'sm', 'md', 'lg'].includes(breakpoint) ? 'cards' : undefined;
const { isMobile } = useMobile();
const displayMode = isMobile ? 'cards' : undefined;
const handleSearch = (value: string) => {
if (value !== search) {