From a279ec29efb863fefd1ca82e5b490f2e8784cf3c Mon Sep 17 00:00:00 2001
From: soryu <soryu@soryu.co>
Date: Sun, 25 Jan 2026 00:01:25 +0000
Subject: Move files tab and file pages to be accessible via contracts (#27)

* feat: remove Files from top-level navigation

Co-Authored-By: Claude Opus 4.5 <noreply@anthropic.com>

* feat: update file links to use contract-scoped routes

Co-Authored-By: Claude Opus 4.5 <noreply@anthropic.com>

* feat: add contract context to FileDetail component

- Add contractId, contractName, and onContractClick props to FileDetailProps
- Update breadcrumb navigation to show contract name with path separator
  when viewing file within a contract context
- Fall back to "Back to list" when no contract context is provided
- This enables the FileDetail component to be used within the
  /contracts/:contractId/files/:fileId route

Co-Authored-By: Claude Opus 4.5 <noreply@anthropic.com>

* feat: update routes to nest files under contracts

- Add react-router-dom for client-side routing
- Create ContractList component to list all contracts
- Create ContractDetail component with tabs (overview, files, tasks, repos)
- Create FileDetail component to view individual files
- Configure routes:
  - /contracts - list all contracts
  - /contracts/:id - view contract details with Files tab
  - /contracts/:contractId/files/:fileId - view file in contract context
- Remove standalone file routes (/files, /files/:id)

Files are now only accessible through their parent contract.

Co-Authored-By: Claude Opus 4.5 <noreply@anthropic.com>

* Task completion checkpoint

* Task completion checkpoint

* Task completion checkpoint

* Task completion checkpoint

* Task completion checkpoint

* Task completion checkpoint

* Task completion checkpoint

* Task completion checkpoint

---------

Co-authored-by: Claude Opus 4.5 <noreply@anthropic.com>
---
 makima/frontend/src/components/NavStrip.tsx        |  1 -
 .../frontend/src/components/files/FileDetail.tsx   | 35 ++++++++++++++++++----
 2 files changed, 29 insertions(+), 7 deletions(-)

(limited to 'makima/frontend/src/components')

diff --git a/makima/frontend/src/components/NavStrip.tsx b/makima/frontend/src/components/NavStrip.tsx
index 2838469..f44799b 100644
--- a/makima/frontend/src/components/NavStrip.tsx
+++ b/makima/frontend/src/components/NavStrip.tsx
@@ -10,7 +10,6 @@ interface NavLink {
 
 const NAV_LINKS: NavLink[] = [
   { label: "Listen", href: "/listen" },
-  { label: "Files", href: "/files", requiresAuth: true },
   { label: "Contracts", href: "/contracts", requiresAuth: true },
   { label: "Board", href: "/workflow", requiresAuth: true },
   { label: "Mesh", href: "/mesh", requiresAuth: true },
diff --git a/makima/frontend/src/components/files/FileDetail.tsx b/makima/frontend/src/components/files/FileDetail.tsx
index a030c57..e1fe85f 100644
--- a/makima/frontend/src/components/files/FileDetail.tsx
+++ b/makima/frontend/src/components/files/FileDetail.tsx
@@ -37,6 +37,10 @@ interface FileDetailProps {
   onSelectVersion?: (version: number) => void;
   onRestoreVersion?: (version: number) => void;
   onClearVersionSelection?: () => void;
+  // Contract context props (for when file is viewed within a contract)
+  contractId?: string;
+  contractName?: string;
+  onContractClick?: () => void;
 }
 
 export function FileDetail({
@@ -65,6 +69,9 @@ export function FileDetail({
   onSelectVersion,
   onRestoreVersion,
   onClearVersionSelection,
+  contractId,
+  contractName,
+  onContractClick,
 }: FileDetailProps) {
   const [isEditing, setIsEditing] = useState(false);
   const [name, setName] = useState(file.name);
@@ -134,13 +141,29 @@ export function FileDetail({
     <div className="panel h-full flex flex-col">
       {/* Header */}
       <div className="p-4 border-b border-dashed border-[rgba(117,170,252,0.35)]">
+        {/* Breadcrumb navigation */}
         <div className="flex items-center justify-between mb-3">
-          <button
-            onClick={onBack}
-            className="font-mono text-xs text-[#75aafc] hover:text-[#9bc3ff] transition-colors"
-          >
-            &larr; Back to list
-          </button>
+          <div className="flex items-center gap-2">
+            {contractId && contractName ? (
+              <>
+                <button
+                  onClick={onContractClick || onBack}
+                  className="font-mono text-xs text-[#75aafc] hover:text-[#9bc3ff] transition-colors"
+                >
+                  &larr; {contractName}
+                </button>
+                <span className="font-mono text-xs text-[#556677]">/</span>
+                <span className="font-mono text-xs text-[#9bc3ff]">Files</span>
+              </>
+            ) : (
+              <button
+                onClick={onBack}
+                className="font-mono text-xs text-[#75aafc] hover:text-[#9bc3ff] transition-colors"
+              >
+                &larr; Back to list
+              </button>
+            )}
+          </div>
           <div className="flex items-center gap-2">
             {isEditing ? (
               <>
-- 
cgit v1.2.3