Use Case 01 - Sub use cases and documents

v0.1.4

The use case detail screen for a live pipeline: a nested sub use case tree (confirm, edit, reject, add, re-derive) plus a supporting documents panel (upload, preview, delete). Fully generic over the caller's node, status, and document shapes.

View as Markdown

Preview

Open full page ↗

Install & usage

npx shadcn@4.1.2 add @signalos/use-case-01

Pulls the page source plus its widget dependencies (@signalos/tokens, @signalos/utils, @signalos/button, @signalos/badge, @signalos/label, @signalos/textarea, @signalos/skeleton, @signalos/page-header, @signalos/form-dialog, @signalos/confirm-dialog, @signalos/data-primitives) into your app - you own the copy. Requires access.

usage

// after: npx shadcn@4.1.2 add @signalos/use-case-01
// mount the pulled page in a route, e.g. src/app/use-case/page.tsx
import UseCase01 from "@/components/blocks/use-case-01/UseCase01"

export default function Page() {
  return <UseCase01 />
}

Props

UseCaseNodeLike

Prop	Type	Default	Description
id*	`string`	-
title*	`string`	-
statement*	`string`	-
status*	`TStatus`	-
derivation_basis	`string[] \| undefined`	-	Short tags describing why this node was derived (e.g. source excerpts).
hand_added	`boolean \| undefined`	-	True when a person added this node rather than it being derived.
review_note	`string \| null \| undefined`	-
use_case_id	`string \| undefined`	-	Stable id to key review/update calls on; falls back to `id` when absent.
children*	`UseCaseNodeLike<TStatus>[]`	-

UseCaseNodePatch

Prop	Type	Default
title	`string \| undefined`	-
statement	`string \| undefined`	-
status	`TStatus \| undefined`	-
review_note	`string \| null \| undefined`	-

NewUseCaseNode

Prop	Type	Default	Description
title*	`string`	-
statement*	`string`	-
useCaseId*	`string`	-	The pipeline's top-level use case this sub use case is filed under.
parentUseCaseId*	`string \| null`	-

UseCaseTreeProps

Prop	Type	Default	Description
nodes*	`TNode[]`	-
onUpdateNode*	`(id: string, patch: UseCaseNodePatch<TStatus>) => void`	-
onAddNode*	`(node: NewUseCaseNode) => void`	-
onReview*	`(id: string, action: UseCaseReviewAction, reviewNote?: string \| undefined) => void`	-	Confirm or reject one sub use case. Rejecting does not remove the row — it stays, marked with the caller's "rejected" status.
onConfirmAll	`(() => void) \| undefined`	-	Confirm every still-undecided node in one go.
isConfirmingAll	`boolean \| undefined`	-	True while a "Confirm all" batch is in flight.
isLoading	`boolean \| undefined`	-	True while the initial fetch is in flight.
hasFailed	`boolean \| undefined`	-	True when the fetch itself failed (distinct from "nothing there").
onRederive	`(() => void) \| undefined`	-	Re-run derivation from the current use case.
isRederiving	`boolean \| undefined`	-
confirmedStatus*	`TStatus`	-	Status values treated as "confirmed" / "rejected" for badges and counts. Node statuses outside these two sets are treated as undecided.
rejectedStatus*	`TStatus`	-
className	`string \| undefined`	-

UseCaseDocumentLike

Prop	Type	Default
document_id*	`string`	-
filename*	`string`	-
size_bytes	`number \| null \| undefined`	-
uploaded_at	`string \| null \| undefined`	-

UseCaseDocumentsPanelProps

Prop	Type	Default
documents*	`TDoc[]`	-
isLoading	`boolean \| undefined`	-
isUploading	`boolean \| undefined`	-
isDeleting	`boolean \| undefined`	-
onUpload*	`(files: File[]) => void`	-
onDelete*	`(documentId: string) => void`	-

UseCase01Props

Prop	Type	Default	Description
pipelineName	`ReactNode`	-
onBack	`(() => void) \| undefined`	-
subUseCaseTree*	`TNode[]`	-
onUpdateSubUseCase*	`(id: string, patch: UseCaseNodePatch<TStatus>) => void`	-
onAddSubUseCase*	`(node: NewUseCaseNode) => void`	-
onReviewSubUseCase*	`(id: string, action: UseCaseReviewAction, reviewNote?: string \| undefined) => void`	-	Confirm or reject one sub use case. Rejecting does not remove the row — it stays, marked with the caller's "rejected" status.
onConfirmAllSubUseCases	`(() => void) \| undefined`	-
isConfirmingAllSubUseCases	`boolean \| undefined`	-
isLoadingSubUseCases	`boolean \| undefined`	-
subUseCasesFailed	`boolean \| undefined`	-
onRederiveSubUseCases	`(() => void) \| undefined`	-
isRederivingSubUseCases	`boolean \| undefined`	-
confirmedStatus*	`TStatus`	-	Status values treated as "confirmed" / "rejected" for badges and counts.
rejectedStatus*	`TStatus`	-
documents*	`TDoc[]`	-
isLoadingDocuments	`boolean \| undefined`	-
isUploadingDocuments	`boolean \| undefined`	-
isDeletingDocument	`boolean \| undefined`	-
onUploadDocuments*	`(files: File[]) => void`	-
onDeleteDocument*	`(documentId: string) => void`	-
className	`string \| undefined`	-
data-testid	`string \| undefined`	-

Supporting types

export type SubUseCaseStatus = "proposed" | "confirmed" | "rejected"

export type UseCaseReviewAction = "confirm" | "reject"

Changelog

use-case-01

0.1.4

Initial release: a pipeline's use case detail screen — a nested sub use case tree (confirm / edit / reject / add / re-derive) plus a documents panel (upload / preview / delete). Generic over the caller's node shape, status union, and document shape; no domain types.