This is an automated email from the ASF dual-hosted git repository. rusackas pushed a commit to branch mobile-dashboard-support in repository https://gitbox.apache.org/repos/asf/superset.git
commit c32751c6eb3da844e90ab9f9d85c4c3ca802ccca Author: Evan Rusackas <[email protected]> AuthorDate: Fri Jan 9 22:14:31 2026 -0800 fix(mobile): Force card view on dashboard list with forceViewMode prop - Add forceViewMode prop to ListView that overrides URL-persisted viewMode - useEffect updates viewMode when forceViewMode changes (screen resize) - DashboardList uses forceViewMode='card' on mobile 🤖 Generated with [Claude Code](https://claude.com/claude-code) Co-Authored-By: Claude Opus 4.5 <[email protected]> --- superset-frontend/src/components/ListView/ListView.tsx | 3 +++ superset-frontend/src/components/ListView/utils.ts | 13 ++++++++++++- superset-frontend/src/pages/DashboardList/index.tsx | 3 +-- 3 files changed, 16 insertions(+), 3 deletions(-) diff --git a/superset-frontend/src/components/ListView/ListView.tsx b/superset-frontend/src/components/ListView/ListView.tsx index a8bc0bff5d..7fdc5ee705 100644 --- a/superset-frontend/src/components/ListView/ListView.tsx +++ b/superset-frontend/src/components/ListView/ListView.tsx @@ -254,6 +254,7 @@ export interface ListViewProps<T extends object = any> { renderCard?: (row: T & { loading: boolean }) => ReactNode; cardSortSelectOptions?: Array<CardSortSelectOption>; defaultViewMode?: ViewModeType; + forceViewMode?: ViewModeType; highlightRowId?: number; showThumbnails?: boolean; emptyState?: EmptyStateProps; @@ -281,6 +282,7 @@ export function ListView<T extends object = any>({ showThumbnails, cardSortSelectOptions, defaultViewMode = 'card', + forceViewMode, highlightRowId, emptyState, columnsForWrapText, @@ -316,6 +318,7 @@ export function ListView<T extends object = any>({ initialFilters: filters, renderCard: Boolean(renderCard), defaultViewMode, + forceViewMode, }); const allowBulkTagActions = bulkTagResourceName && enableBulkTag; const filterable = Boolean(filters.length); diff --git a/superset-frontend/src/components/ListView/utils.ts b/superset-frontend/src/components/ListView/utils.ts index 37b15e8780..66603717fc 100644 --- a/superset-frontend/src/components/ListView/utils.ts +++ b/superset-frontend/src/components/ListView/utils.ts @@ -202,6 +202,7 @@ interface UseListViewConfig { }; renderCard?: boolean; defaultViewMode?: ViewModeType; + forceViewMode?: ViewModeType; } export function useListViewState({ @@ -216,6 +217,7 @@ export function useListViewState({ bulkSelectColumnConfig, renderCard = false, defaultViewMode = 'card', + forceViewMode, }: UseListViewConfig) { const [query, setQuery] = useQueryParams({ filters: RisonParam, @@ -243,10 +245,19 @@ export function useListViewState({ }; const [viewMode, setViewMode] = useState<ViewModeType>( - (query.viewMode as ViewModeType) || + // forceViewMode overrides everything (used for mobile) + forceViewMode || + (query.viewMode as ViewModeType) || (renderCard ? defaultViewMode : 'table'), ); + // Update viewMode when forceViewMode changes (e.g., screen resize) + useEffect(() => { + if (forceViewMode) { + setViewMode(forceViewMode); + } + }, [forceViewMode]); + const columnsWithSelect = useMemo(() => { // add exact filter type so filters with falsy values are not filtered out const columnsWithFilter = columns.map(f => ({ ...f, filter: 'exact' })); diff --git a/superset-frontend/src/pages/DashboardList/index.tsx b/superset-frontend/src/pages/DashboardList/index.tsx index 2909c70efc..84f2cc7f38 100644 --- a/superset-frontend/src/pages/DashboardList/index.tsx +++ b/superset-frontend/src/pages/DashboardList/index.tsx @@ -815,12 +815,11 @@ function DashboardList(props: DashboardListProps) { } renderCard={renderCard} defaultViewMode={ - // Force card view on mobile - !isNotMobile || isFeatureEnabled(FeatureFlag.ListviewsDefaultCardView) ? 'card' : 'table' } + forceViewMode={!isNotMobile ? 'card' : undefined} enableBulkTag={enableBulkTag} bulkTagResourceName="dashboard" />
