Hive Hive
Sign in

fix(web): align operations tables with Noora

GitHub issue · Closed

Metadata
Source
tuist/hive #90
Updated
Jun 25, 2026
Domains
Hive
Details

What changed

This updates the broken operations surfaces to use the Noora table patterns consistently:

  • Replaces the custom Slack workspace rows with a Noora table, standard table cells, status badges, table empty state, and a compact action cell.
  • Splits Slack routing details into plain Channel and Notifications summary columns so the table stays scannable.
  • Moves Slack notification route editing into a per-workspace modal opened from the row action, instead of rendering form controls as table columns.
  • Moves the inference profiles empty state into the Noora table empty-state slot so the icon and copy stay centered in the table body.
  • Adds local Slack seed data with placeholder tokens so connected, disconnected, and routed workspace states are visible during development.
  • Updates the Slack operations tests to assert the new table structure and route modal.

Why

The production operations pages were visually broken and drifted from the table/list standard already used elsewhere in Hive and Tuist. The Slack workspace page also needed realistic seeded rows so the actual management state can be reviewed without manually connecting a workspace.

Root cause

The Slack workspace page used custom article rows with nested route controls instead of the Noora table primitive. That made the page diverge from the standard density, column layout, action placement, and row behavior.

The inference profiles page rendered its empty-state component outside the Noora table. With no rows, the table header remained in place while the empty-state content sat separately, which made the production screen look misaligned.

Approach

The Slack page now uses a single Noora table for the workspace list. Workspace identity, connection status, installation details, channel summary, notification summary, and row actions each use standard table cells. Editing routes happens in a Noora modal from the compact pencil action, and disconnect uses the destructive icon action in the same row action cell.

The inference profiles page now assigns profiles as a regular list for the table and uses a stable row key. That matches Noora’s empty-state expectations and keeps row navigation unchanged.

The seed data is intentionally small and uses obvious placeholders. It creates two connected Slack workspaces with notification channels and one disconnected workspace.

Impact

Operators get operations pages that match the rest of the product and are easier to scan. The changes do not add a data migration and do not affect production Slack installation data. The new seed rows only affect local development seed runs.

Verification screenshots

The images are cropped to the page content so they avoid browser chrome and account details.

Inference profiles

Before After
Inference profiles empty state before Inference profiles empty state after

Slack workspaces

Before After
Slack workspace routes before Slack workspace table after

Validation

  • git diff --check HEAD~3..HEAD
  • mix format lib/hive_web/live/ops_live/inference.ex lib/hive_web/live/ops_live/slack.ex priv/repo/seeds.exs test/hive_web/live/ops_live/slack_test.exs
  • mix test test/hive_web/live/ops_live/slack_test.exs test/hive_web/live/ops_live/inference_test.exs, 16 tests passed
  • mix compile --warnings-as-errors
  • Captured the screenshots above with a headless Chrome browser

mix ecto.setup was also run. It reached the new visual seed data, then stopped in an existing later spec seed because that seed path enqueues an Oban job while no Oban process is running in the setup command. I confirmed the seeded visual data with a count command: 2 inference profiles, 3 Slack installations, and 2 Slack routes.

Comments

No GitHub comments yet.