chore(repo): initialize planarchy workspace
This commit is contained in:
@@ -0,0 +1,215 @@
|
||||
"use client";
|
||||
|
||||
import { useState } from "react";
|
||||
import { clsx } from "clsx";
|
||||
import { trpc } from "~/lib/trpc/client.js";
|
||||
|
||||
interface ApplyEffortRulesProps {
|
||||
estimateId: string;
|
||||
canEdit: boolean;
|
||||
onApplied?: () => void;
|
||||
}
|
||||
|
||||
export function ApplyEffortRules({ estimateId, canEdit, onApplied }: ApplyEffortRulesProps) {
|
||||
const utils = trpc.useUtils();
|
||||
const { data: ruleSets, isLoading } = trpc.effortRule.list.useQuery();
|
||||
|
||||
const [selectedRuleSetId, setSelectedRuleSetId] = useState<string>("");
|
||||
const [mode, setMode] = useState<"replace" | "append">("replace");
|
||||
const [showPreview, setShowPreview] = useState(false);
|
||||
|
||||
const previewQuery = trpc.effortRule.preview.useQuery(
|
||||
{ estimateId, ruleSetId: selectedRuleSetId },
|
||||
{ enabled: showPreview && Boolean(selectedRuleSetId) },
|
||||
);
|
||||
|
||||
const applyMutation = trpc.effortRule.apply.useMutation({
|
||||
onSuccess: (result) => {
|
||||
utils.estimate.getById.invalidate();
|
||||
setShowPreview(false);
|
||||
onApplied?.();
|
||||
if (result.warnings.length > 0) {
|
||||
alert(`Generated ${result.linesGenerated} demand lines.\n\nWarnings:\n${result.warnings.join("\n")}`);
|
||||
}
|
||||
},
|
||||
});
|
||||
|
||||
// Auto-select default rule set
|
||||
if (!selectedRuleSetId && ruleSets) {
|
||||
const defaultSet = ruleSets.find((rs) => rs.isDefault) ?? ruleSets[0];
|
||||
if (defaultSet) {
|
||||
setSelectedRuleSetId(defaultSet.id);
|
||||
}
|
||||
}
|
||||
|
||||
if (!canEdit) return null;
|
||||
|
||||
if (isLoading) {
|
||||
return <p className="text-sm text-gray-400">Loading effort rules...</p>;
|
||||
}
|
||||
|
||||
if (!ruleSets || ruleSets.length === 0) {
|
||||
return (
|
||||
<div className="rounded-2xl border border-dashed border-gray-300 bg-gray-50 p-4 text-center text-sm text-gray-500">
|
||||
No effort rule sets defined.{" "}
|
||||
<a href="/admin/effort-rules" className="text-brand-600 hover:underline">
|
||||
Create one
|
||||
</a>{" "}
|
||||
to auto-generate demand lines from scope items.
|
||||
</div>
|
||||
);
|
||||
}
|
||||
|
||||
return (
|
||||
<div className="rounded-3xl border border-gray-200 bg-white p-5 shadow-sm">
|
||||
<h3 className="mb-3 text-base font-semibold text-gray-900">Generate demand lines from scope</h3>
|
||||
|
||||
<div className="flex flex-wrap items-end gap-4">
|
||||
<label className="block">
|
||||
<span className="mb-1 block text-xs font-medium text-gray-500 uppercase tracking-wider">Rule set</span>
|
||||
<select
|
||||
value={selectedRuleSetId}
|
||||
onChange={(e) => {
|
||||
setSelectedRuleSetId(e.target.value);
|
||||
setShowPreview(false);
|
||||
}}
|
||||
className="rounded-2xl border border-gray-300 bg-gray-50 px-3 py-2 text-sm text-gray-900"
|
||||
>
|
||||
{ruleSets.map((rs) => (
|
||||
<option key={rs.id} value={rs.id}>
|
||||
{rs.name} ({rs.rules.length} rules){rs.isDefault ? " *" : ""}
|
||||
</option>
|
||||
))}
|
||||
</select>
|
||||
</label>
|
||||
|
||||
<label className="block">
|
||||
<span className="mb-1 block text-xs font-medium text-gray-500 uppercase tracking-wider">Mode</span>
|
||||
<select
|
||||
value={mode}
|
||||
onChange={(e) => setMode(e.target.value as "replace" | "append")}
|
||||
className="rounded-2xl border border-gray-300 bg-gray-50 px-3 py-2 text-sm text-gray-900"
|
||||
>
|
||||
<option value="replace">Replace existing lines</option>
|
||||
<option value="append">Append to existing</option>
|
||||
</select>
|
||||
</label>
|
||||
|
||||
<button
|
||||
onClick={() => setShowPreview(!showPreview)}
|
||||
disabled={!selectedRuleSetId}
|
||||
className="rounded-2xl border border-gray-300 px-4 py-2 text-sm font-medium text-gray-600 hover:bg-gray-50 disabled:opacity-50"
|
||||
>
|
||||
{showPreview ? "Hide preview" : "Preview"}
|
||||
</button>
|
||||
|
||||
<button
|
||||
onClick={() => {
|
||||
if (!selectedRuleSetId) return;
|
||||
const action = mode === "replace" ? "replace all existing demand lines" : "append new demand lines";
|
||||
if (confirm(`This will ${action}. Continue?`)) {
|
||||
applyMutation.mutate({ estimateId, ruleSetId: selectedRuleSetId, mode });
|
||||
}
|
||||
}}
|
||||
disabled={!selectedRuleSetId || applyMutation.isPending}
|
||||
className="rounded-2xl bg-brand-600 px-4 py-2 text-sm font-medium text-white hover:bg-brand-700 disabled:opacity-50"
|
||||
>
|
||||
{applyMutation.isPending ? "Generating..." : "Apply rules"}
|
||||
</button>
|
||||
</div>
|
||||
|
||||
{applyMutation.error && (
|
||||
<p className="mt-2 text-sm text-red-600">{applyMutation.error.message}</p>
|
||||
)}
|
||||
|
||||
{/* Preview */}
|
||||
{showPreview && previewQuery.data && (
|
||||
<div className="mt-4 space-y-3">
|
||||
<div className="flex flex-wrap gap-4 text-sm text-gray-600">
|
||||
<span>{previewQuery.data.scopeItemCount} scope items</span>
|
||||
<span>{previewQuery.data.ruleCount} rules</span>
|
||||
<span className="font-semibold text-brand-700">{previewQuery.data.lines.length} demand lines would be generated</span>
|
||||
{previewQuery.data.unmatchedScopeItems.length > 0 && (
|
||||
<span className="text-amber-600">{previewQuery.data.unmatchedScopeItems.length} unmatched scope items</span>
|
||||
)}
|
||||
</div>
|
||||
|
||||
{previewQuery.data.warnings.length > 0 && (
|
||||
<div className="rounded-xl bg-amber-50 p-3 text-sm text-amber-700">
|
||||
{previewQuery.data.warnings.map((w, i) => (
|
||||
<p key={i}>{w}</p>
|
||||
))}
|
||||
</div>
|
||||
)}
|
||||
|
||||
{/* Aggregated discipline summary */}
|
||||
{previewQuery.data.aggregated.length > 0 && (
|
||||
<div className="overflow-x-auto">
|
||||
<table className="w-full text-left text-sm">
|
||||
<thead>
|
||||
<tr className="border-b border-gray-200 text-xs uppercase tracking-wider text-gray-500">
|
||||
<th className="py-2 pr-3 font-medium">Discipline</th>
|
||||
<th className="px-3 py-2 font-medium">Chapter</th>
|
||||
<th className="px-3 py-2 text-right font-medium">Total hours</th>
|
||||
<th className="pl-3 py-2 text-right font-medium">Lines</th>
|
||||
</tr>
|
||||
</thead>
|
||||
<tbody>
|
||||
{previewQuery.data.aggregated.map((agg, i) => (
|
||||
<tr key={i} className="border-b border-gray-100">
|
||||
<td className="py-1.5 pr-3 font-medium text-gray-900">{agg.discipline}</td>
|
||||
<td className="px-3 py-1.5 text-gray-500">{agg.chapter ?? "\u2014"}</td>
|
||||
<td className="px-3 py-1.5 text-right tabular-nums text-gray-700">{agg.totalHours.toFixed(1)} h</td>
|
||||
<td className="pl-3 py-1.5 text-right tabular-nums text-gray-500">{agg.lineCount}</td>
|
||||
</tr>
|
||||
))}
|
||||
</tbody>
|
||||
</table>
|
||||
</div>
|
||||
)}
|
||||
|
||||
{/* Detailed lines (collapsible) */}
|
||||
{previewQuery.data.lines.length > 0 && (
|
||||
<details className="text-sm">
|
||||
<summary className="cursor-pointer text-gray-500 hover:text-gray-700">
|
||||
Show all {previewQuery.data.lines.length} generated lines
|
||||
</summary>
|
||||
<div className="mt-2 overflow-x-auto">
|
||||
<table className="w-full text-left text-sm">
|
||||
<thead>
|
||||
<tr className="border-b border-gray-200 text-xs uppercase tracking-wider text-gray-500">
|
||||
<th className="py-2 pr-3 font-medium">Scope item</th>
|
||||
<th className="px-3 py-2 font-medium">Discipline</th>
|
||||
<th className="px-3 py-2 font-medium">Chapter</th>
|
||||
<th className="px-3 py-2 font-medium">Mode</th>
|
||||
<th className="px-3 py-2 text-right font-medium">Units</th>
|
||||
<th className="px-3 py-2 text-right font-medium">h/unit</th>
|
||||
<th className="pl-3 py-2 text-right font-medium">Hours</th>
|
||||
</tr>
|
||||
</thead>
|
||||
<tbody>
|
||||
{previewQuery.data.lines.map((line, i) => (
|
||||
<tr key={i} className={clsx("border-b border-gray-100", i % 2 === 0 ? "" : "bg-gray-50")}>
|
||||
<td className="py-1.5 pr-3 text-gray-900">{line.scopeItemName}</td>
|
||||
<td className="px-3 py-1.5 text-gray-700">{line.discipline}</td>
|
||||
<td className="px-3 py-1.5 text-gray-500">{line.chapter ?? "\u2014"}</td>
|
||||
<td className="px-3 py-1.5 text-gray-500">{line.unitMode}</td>
|
||||
<td className="px-3 py-1.5 text-right tabular-nums text-gray-600">{line.unitCount}</td>
|
||||
<td className="px-3 py-1.5 text-right tabular-nums text-gray-600">{line.hoursPerUnit}</td>
|
||||
<td className="pl-3 py-1.5 text-right tabular-nums font-medium text-gray-900">{line.hours.toFixed(1)}</td>
|
||||
</tr>
|
||||
))}
|
||||
</tbody>
|
||||
</table>
|
||||
</div>
|
||||
</details>
|
||||
)}
|
||||
</div>
|
||||
)}
|
||||
|
||||
{showPreview && previewQuery.isLoading && (
|
||||
<p className="mt-3 text-sm text-gray-400">Computing preview...</p>
|
||||
)}
|
||||
</div>
|
||||
);
|
||||
}
|
||||
Reference in New Issue
Block a user