Skip to content

fix(web): align remote assignment table colors with datahub subject table - #1811

Merged
joshunrau merged 3 commits into
mainfrom
fix/remote-assignment-table-colors
Oct 28, 2026
Merged

joshunrau merged 3 commits into
mainfrom
fix/remote-assignment-table-colors

Conversation

@thomasbeaudry

@thomasbeaudry thomasbeaudry commented Oct 14, 2026 •

Copy link
Copy Markdown
Collaborator

Summary

  • Remove rootStyle card-color overrides from create and delete remote assignment DataTables so their row colors match the datahub subject table
  • Add bg-background to WizardTable, FileDropzone and TextArea in the bulk assignment wizard so they use the page background instead of inheriting the card surface
  • Match checkbox column width (size: 40, maxSize: 40) between create and delete assignment tables
  • Cap the column mapping table at ~10 visible rows with vertical scroll for files with many columns

🤖 Generated with Claude Code

@gdevenyi gdevenyi left a comment

Copy link
Copy Markdown
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Thanks for this. Two things are missing before this can merge:

The maintainers accept the page background for tables and inputs inside the wizard and delete cards, to match the datahub subject table.

  1. E2E test. Every change needs an end-to-end test in testing/. In testing/src/specs/remote-assignments-wizard.spec.ts, load a file with more than ten columns into the wizard. Then check that the column-mapping table (bulk-column-mapping) is no taller than 28rem (448px) and that it scrolls (scrollHeight > clientHeight). The spec already has a boundingBox helper for this type of layout check.
  2. Unit tests. In apps/web/src/components/BulkRemoteAssignmentWizard/__tests__/MapStep.test.tsx, check that the column-mapping table frame gets the height cap and the vertical scroll classes. In WizardTable.test.tsx, check that the frame keeps bg-background when a caller passes its own className.

If you hand this to Claude Code, Opus 5 is the right size — the tests span apps/web and the Playwright suite, and the e2e part must load a wide fixture file through the wizard.

Reviewed at commit 7fc352c.

@joshunrau joshunrau left a comment

Copy link
Copy Markdown
Collaborator

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Thanks for adding the tests. They pin the cap and the table surface exactly as asked. Two small things before this can go in:

  1. Split the first commit. Commits are merged as they are, and each fix commit becomes one changelog entry. 7fc352c includes the column-mapping height cap (MapStep.tsx:124-125) under a subject about table colours, so the cap would never appear in the changelog. Please give the cap its own commit, e.g. fix(web): cap the column mapping table so a wide file cannot push the wizard's controls off screen. Put the bulk-column-mapping testid move, the MapStep unit test, the e2e case and the page-object additions from 22c5f85 in that commit. Keep the colour changes, the checkbox column width (SourceStep.tsx:262-263) and the WizardTable test in the other commit, with a subject that also covers the width, e.g. fix(web): align remote assignment tables with the datahub subject table. Each commit should pass lint and the tests on its own.
  2. Use the canonical Tailwind class. main recently rewrote every class in apps/web to Tailwind's canonical spelling (c11dfab28). For max-h-[28rem] that spelling is max-h-112, which compiles to the same CSS. Please change it in apps/web/src/components/BulkRemoteAssignmentWizard/MapStep.tsx:124, and update the class the test checks in __tests__/MapStep.test.tsx:79.

If you hand this to Claude Code, Opus 5 is the right size — it is a history rewrite across apps/web and testing in which each new commit has to pass on its own.

Reviewed at commit 22c5f85.

… wizard's controls off screen

A file with many columns grew the mapping grid one row per column until the
step's own Back and Continue buttons sat below the fold. The frame is capped at
28rem and scrolls within itself, so the step keeps its height whatever the file
is. The testid moves onto that frame, since it is the scrolling element a test
has to measure.
The create and delete assignment tables overrode their row colour to the card
surface, so each read as one more box inside the card rather than as the same
grid the datahub shows. They now take the page background, as do the wizard's
table frame, file dropzone and paste box, and the checkbox column is given the
same width in both tables so the two line up.
@thomasbeaudry
thomasbeaudry force-pushed the fix/remote-assignment-table-colors branch from e137f66 to 4db3225 Compare October 27, 2026 17:33
@thomasbeaudry

Copy link
Copy Markdown
Collaborator Author

Both items are in, as a rewrite onto current main (6e16f84). The branch is now two commits:

  1. fix(web): cap the column mapping table so a wide file cannot push the wizard's controls off screen — the cap and scroll on MapStep.tsx, the bulk-column-mapping testid move onto the WizardTable frame, the MapStep unit case, the e2e case and the page-object additions.
  2. fix(web): align remote assignment tables with the datahub subject table — the rootStyle removals, the bg-background on the wizard table, dropzone and paste box, the checkbox column width in SourceStep.tsx, and the WizardTable surface test.

The class is now max-h-112, in both MapStep.tsx and the test that reads it.

Checks: pnpm lint 34/34 on a second pass, pnpm test:coverage 100% on all four axes, pnpm test:e2e 292/293 — the one failure is record-file-deletion.spec.ts, which needs the S3 backend a bare local stack does not start and passes on CI. Commit 1 was also verified on its own: web and testing lint clean and the wizard unit suite green at that commit.

@joshunrau
joshunrau merged commit fbe55cb into main Oct 28, 2026
6 checks passed
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

None yet

Projects

None yet

Development

Successfully merging this pull request may close these issues.

3 participants