Refactor MeasuresPage to use Relay fragments

Replace the client-side grouped-by-category view (fetching 500 items)
with a flat table using server-side filtering and cursor-based
pagination. Colocate GraphQL queries, fragments, and mutations in the
component file per console CLAUDE.md conventions.

Backend changes add a category filter to the measure list endpoints
(GraphQL, MCP) and a new measureCategories field on Organization.

Signed-off-by: Bryan Frimin <bryan@getprobo.com>
This commit is contained in:
Bryan Frimin
2026-03-18 16:00:40 +01:00
parent 69c418d1b7
commit 82f241628c
12 changed files with 459 additions and 215 deletions

View File

@@ -8,24 +8,19 @@ import { Fragment } from "react";
import { loadQuery } from "react-relay";
import { redirect } from "react-router";
import type { MeasureGraphListQuery } from "#/__generated__/core/MeasureGraphListQuery.graphql";
import type { MeasureGraphNodeQuery } from "#/__generated__/core/MeasureGraphNodeQuery.graphql";
import { LinkCardSkeleton } from "#/components/skeletons/LinkCardSkeleton";
import { PageSkeleton } from "#/components/skeletons/PageSkeleton";
import { coreEnvironment } from "#/environments";
import { measureNodeQuery, measuresQuery } from "#/hooks/graph/MeasureGraph";
import { measureNodeQuery } from "#/hooks/graph/MeasureGraph";
export const measureRoutes = [
{
path: "measures",
Fallback: PageSkeleton,
loader: loaderFromQueryLoader(({ organizationId }) =>
loadQuery<MeasureGraphListQuery>(coreEnvironment, measuresQuery, {
organizationId: organizationId,
}),
),
Component: withQueryRef(
lazy(() => import("#/pages/organizations/measures/MeasuresPage")),
Component: lazy(
() =>
import("#/pages/organizations/measures/MeasuresPageLoader"),
),
children: [
{