developmentseed / developmentseed/cng-sandbox

feat: upload UX for multidimensional datasets

Open
#118 1 comment 0 reactions 0 assignees View on GitHub
agent-ready feat
Dominant language
TypeScript
Stars
3
Forks
0
Avg merge
2h 21m
Merged PRs (30d)
3

Description

## Summary

Polish the upload experience for multidimensional datasets: skip the variable picker, show an informative progress message, and display a "Multidim" badge on dataset cards. This is the UX polish for #113.

## Context

When a multidimensional dataset is uploaded, the pipeline detects extra dimensions and routes to the multidim pipeline automatically — no variable selection needed. But the frontend upload flow was designed around the assumption that users always pick a variable. We need to make the multidim path feel intentional and informative rather than like something was skipped.

## Prerequisites

- Multidim detection and pipeline working (scanner + pipeline issues)
- Dimension controls in map view working (frontend issue)

## Tasks

### 1. Skip variable picker for multidim datasets

**File**: `frontend/src/hooks/useConversionJob.ts`

The SSE handler currently shows the `VariablePicker` when a `scan_result` event arrives with multiple variables. For multidim datasets, the backend won't send a `scan_result` event (the pipeline proceeds without pausing). No change should be needed here — just verify the flow works end-to-end without the picker appearing.

If the backend does send scan results for informational purposes, ensure the frontend doesn't show the picker when the dataset is detected as multidim. The signal could be a `multidim: true` flag on the scan result, or simply the absence of a `scan_result` event.

### 2. Show informative progress message

During the `scanning` stage, the SSE status should include a detail message when multidim is detected:

> "Multidimensional dataset detected — 3 variables, 5 dimensions. All variables preserved for interactive exploration."

This uses the existing `StageProgress.detail` field, which the frontend already renders in the upload progress UI. The backend sets this in the multidim pipeline (covered in the pipeline issue), but verify it displays correctly.

### 3. Dataset card badge

**File**: `frontend/src/components/DatasetCard.tsx` (or wherever dataset cards are rendered in the dataset list)

Add a visual indicator for multidim datasets:
- Show a "Multidim" badge/tag next to the filename
- Include dimension count: "Multidim · 5 dimensions · 3 variables"
- Use the brand palette (e.g., `brand.orange` background) to match existing UI

### 4. Dataset detail panel

If there's a dataset detail/info panel, show the dimension metadata:
- List each dimension with its name, size, and available values
- List available variables
- This gives users a preview of what they'll be able to explore in the map view

## Verification

- [ ] Upload a multidimensional NetCDF → no variable picker appears
- [ ] Upload progress shows the "Multidimensional dataset detected" message during scanning
- [ ] Dataset card in the list shows a "Multidim" badge
- [ ] Dataset detail shows dimension and variable info
- [ ] Upload a simple GeoTIFF → normal flow, no multidim indicators (backward compat)
- [ ] Upload a temporal NetCDF (time-only, no extra dims) → normal temporal flow with variable picker if needed
- [ ] Screenshot the upload flow and dataset card to verify UX

## Files to modify

| File | Change |
|------|--------|
| `frontend/src/hooks/useConversionJob.ts` | Verify multidim flow (may need no changes) |
| `frontend/src/components/DatasetCard.tsx` | Add Multidim badge |
| Dataset detail component (TBD) | Show dimension/variable metadata |

Part of #113

Contributor guide

Open the contributing guide

Research direction

Start by tracing the upload flow in frontend/src/hooks/useConversionJob.ts and the dataset-card rendering in frontend/src/components/DatasetCard.tsx, then locate the dataset detail component. Verify the existing StageProgress.detail rendering and multidimensional metadata available from the backend. Done means multidimensional uploads skip the picker, show progress details, display badge and metadata, while GeoTIFF and temporal NetCDF flows remain unchanged.

Written by the indexing model from the issue text.

Assessment

Tech stack
typescript
Domain
data, frontend
Issue type
Feature
Difficulty
4/5
Estimated time
3-5 days
Activity status
Quiet
Clarity
Mostly clear
Newbie friendliness
45/100

Get new issues in your inbox

A short digest of beginner-friendly GitHub issues.