diff --git a/server/src/__tests__/projects.test.ts b/server/src/__tests__/projects.test.ts
index 9cb8e1b..f6127f7 100644
--- a/server/src/__tests__/projects.test.ts
+++ b/server/src/__tests__/projects.test.ts
@@ -45,14 +45,89 @@ describe('Projects API', () => {
   });
 
   it('rejects an invalid repository URL without persisting a project', async () => {
-    await request(app)
-      .post(`/api/companies/${companyId}/projects`)
-      .send({ name: 'Invalid repository', repoUrl: 'not-a-url' })
-      .expect(400);
+    for (const repoUrl of ['not-a-url', 'javascript:alert(document.domain)']) {
+      await request(app)
+        .post(`/api/companies/${companyId}/projects`)
+        .send({ name: 'Invalid repository', repoUrl })
+        .expect(400);
+    }
 
     const list = await request(app)
       .get(`/api/companies/${companyId}/projects`)
       .expect(200);
     expect(list.body.data).toEqual([]);
   });
+
+  it('updates and soft-archives a project with durable detail reads', async () => {
+    const created = await request(app)
+      .post(`/api/companies/${companyId}/projects`)
+      .send({ name: 'Lifecycle draft', status: 'planning', repoUrl: null })
+      .expect(201);
+    const projectId = created.body.data.id;
+
+    await request(app)
+      .patch(`/api/companies/${companyId}/projects/${projectId}`)
+      .send({
+        name: 'Lifecycle verified',
+        description: 'Prove edits survive a canonical detail reload.',
+        status: 'active',
+        repoUrl: 'https://github.com/vertical-labs/eidolon',
+      })
+      .expect(200)
+      .expect(({ body }) => {
+        expect(body.data).toEqual(expect.objectContaining({
+          id: projectId,
+          name: 'Lifecycle verified',
+          status: 'active',
+          repoUrl: 'https://github.com/vertical-labs/eidolon',
+        }));
+      });
+
+    await request(app)
+      .get(`/api/companies/${companyId}/projects/${projectId}`)
+      .expect(200)
+      .expect(({ body }) => {
+        expect(body.data).toEqual(expect.objectContaining({
+          id: projectId,
+          name: 'Lifecycle verified',
+          description: 'Prove edits survive a canonical detail reload.',
+        }));
+      });
+
+    await request(app)
+      .delete(`/api/companies/${companyId}/projects/${projectId}`)
+      .expect(200)
+      .expect(({ body }) => {
+        expect(body.data).toEqual(expect.objectContaining({ id: projectId, status: 'archived' }));
+      });
+
+    await request(app)
+      .get(`/api/companies/${companyId}/projects/${projectId}`)
+      .expect(200)
+      .expect(({ body }) => {
+        expect(body.data).toEqual(expect.objectContaining({ id: projectId, status: 'archived' }));
+      });
+  });
+
+  it('rejects an invalid repository URL during an update without changing the project', async () => {
+    const created = await request(app)
+      .post(`/api/companies/${companyId}/projects`)
+      .send({ name: 'Keep canonical state', status: 'planning', repoUrl: null })
+      .expect(201);
+
+    await request(app)
+      .patch(`/api/companies/${companyId}/projects/${created.body.data.id}`)
+      .send({ name: 'Do not persist', repoUrl: 'javascript:alert(document.domain)' })
+      .expect(400);
+
+    await request(app)
+      .get(`/api/companies/${companyId}/projects/${created.body.data.id}`)
+      .expect(200)
+      .expect(({ body }) => {
+        expect(body.data).toEqual(expect.objectContaining({
+          name: 'Keep canonical state',
+          repoUrl: null,
+        }));
+      });
+  });
 });
diff --git a/server/src/routes/projects.ts b/server/src/routes/projects.ts
index 3ed67b7..74d1066 100644
--- a/server/src/routes/projects.ts
+++ b/server/src/routes/projects.ts
@@ -7,18 +7,27 @@ import eventBus from '../realtime/events.js';
 import type { DbInstance } from '../types.js';
 import { routeParams } from '../utils/route-params.js';
 
+const HttpUrl = z.string().url().refine((value) => {
+  try {
+    const protocol = new URL(value).protocol;
+    return protocol === 'http:' || protocol === 'https:';
+  } catch {
+    return false;
+  }
+}, 'Repository URL must start with http:// or https://');
+
 const CreateProjectBody = z.object({
   name: z.string().min(1).max(255),
   description: z.string().max(5000).optional(),
   status: z.enum(['planning', 'active', 'completed', 'archived']).default('planning'),
-  repoUrl: z.string().url().nullable().default(null),
+  repoUrl: HttpUrl.nullable().default(null),
 });
 
 const UpdateProjectBody = z.object({
   name: z.string().min(1).max(255).optional(),
   description: z.string().max(5000).nullable().optional(),
   status: z.enum(['planning', 'active', 'completed', 'archived']).optional(),
-  repoUrl: z.string().url().nullable().optional(),
+  repoUrl: HttpUrl.nullable().optional(),
 });
 
 const ProjectListQuery = z.object({
diff --git a/ui/src/components/projects/CreateProjectModal.tsx b/ui/src/components/projects/CreateProjectModal.tsx
index 1f4839c..c1316fc 100644
--- a/ui/src/components/projects/CreateProjectModal.tsx
+++ b/ui/src/components/projects/CreateProjectModal.tsx
@@ -1,10 +1,5 @@
-import { useState } from "react";
-import { z } from "zod";
-import { Modal } from "@/components/ui/Modal";
-import { Input, Select, Textarea } from "@/components/ui/Input";
-import { Button } from "@/components/ui/Button";
-import { useCreateProject } from "@/lib/hooks";
-import type { Project, ProjectStatus } from "@/lib/api";
+import { ProjectFormModal } from "./ProjectFormModal";
+import type { Project } from "@/lib/api";
 
 interface CreateProjectModalProps {
   open: boolean;
@@ -13,192 +8,18 @@ interface CreateProjectModalProps {
   companyId: string;
 }
 
-const projectStatuses: { value: ProjectStatus; label: string }[] = [
-  { value: "planning", label: "Planning" },
-  { value: "active", label: "Active" },
-  { value: "completed", label: "Completed" },
-  { value: "archived", label: "Archived" },
-];
-
-const projectSchema = z.object({
-  name: z.string().trim().min(1, "Enter a project name.").max(255, "Use 255 characters or fewer."),
-  description: z.string().max(5000, "Use 5,000 characters or fewer."),
-  status: z.enum(["planning", "active", "completed", "archived"]),
-  repoUrl: z.union([
-    z.literal(""),
-    z.url("Enter a complete repository URL, such as https://github.com/org/repo."),
-  ]),
-});
-
-type ProjectFormErrors = Partial<Record<keyof z.infer<typeof projectSchema>, string>>;
-
-function FieldError({ id, message }: { id: string; message?: string }) {
-  if (!message) return null;
-
-  return (
-    <p id={id} role="alert" className="mt-1.5 text-xs text-error">
-      {message}
-    </p>
-  );
-}
-
 export function CreateProjectModal({
   open,
   onClose,
   onCreated,
   companyId,
 }: CreateProjectModalProps) {
-  const [name, setName] = useState("");
-  const [description, setDescription] = useState("");
-  const [status, setStatus] = useState<ProjectStatus>("planning");
-  const [repoUrl, setRepoUrl] = useState("");
-  const [errors, setErrors] = useState<ProjectFormErrors>({});
-  const [submitError, setSubmitError] = useState<string | null>(null);
-  const mutation = useCreateProject(companyId);
-
-  function resetForm() {
-    setName("");
-    setDescription("");
-    setStatus("planning");
-    setRepoUrl("");
-    setErrors({});
-    setSubmitError(null);
-    mutation.reset();
-  }
-
-  function handleClose() {
-    resetForm();
-    onClose();
-  }
-
-  function handleSubmit(event: React.FormEvent) {
-    event.preventDefault();
-    setSubmitError(null);
-
-    const parsed = projectSchema.safeParse({ name, description, status, repoUrl });
-    if (!parsed.success) {
-      const fieldErrors = parsed.error.flatten().fieldErrors;
-      setErrors({
-        name: fieldErrors.name?.[0],
-        description: fieldErrors.description?.[0],
-        status: fieldErrors.status?.[0],
-        repoUrl: fieldErrors.repoUrl?.[0],
-      });
-      return;
-    }
-
-    setErrors({});
-    mutation.mutate(
-      {
-        name: parsed.data.name,
-        description: parsed.data.description.trim() || undefined,
-        status: parsed.data.status,
-        repoUrl: parsed.data.repoUrl || null,
-      },
-      {
-        onSuccess: (project) => {
-          resetForm();
-          onClose();
-          onCreated(project);
-        },
-        onError: (error) => {
-          setSubmitError(
-            error instanceof Error
-              ? error.message
-              : "Project creation failed. Check your connection and try again.",
-          );
-        },
-      },
-    );
-  }
-
   return (
-    <Modal
+    <ProjectFormModal
       open={open}
-      onClose={handleClose}
-      title="Create Project"
-      dismissible={!mutation.isPending}
-    >
-      <form onSubmit={handleSubmit} noValidate className="space-y-4">
-        <div>
-          <Input
-            label="Project name"
-            placeholder="e.g., Runtime reliability"
-            value={name}
-            onChange={(event) => setName(event.target.value)}
-            aria-invalid={!!errors.name}
-            aria-describedby={errors.name ? "project-name-error" : undefined}
-            className="text-base placeholder:text-text-primary/60 sm:text-sm"
-            autoFocus
-            maxLength={255}
-            disabled={mutation.isPending}
-            required
-          />
-          <FieldError id="project-name-error" message={errors.name} />
-        </div>
-        <div>
-          <Textarea
-            label="Description"
-            placeholder="What outcome does this project own?"
-            value={description}
-            onChange={(event) => setDescription(event.target.value)}
-            aria-invalid={!!errors.description}
-            aria-describedby={errors.description ? "project-description-error" : undefined}
-            className="text-base placeholder:text-text-primary/60 sm:text-sm"
-            maxLength={5000}
-            rows={3}
-            disabled={mutation.isPending}
-          />
-          <FieldError id="project-description-error" message={errors.description} />
-        </div>
-        <div>
-          <Select
-            label="Status"
-            options={projectStatuses}
-            value={status}
-            onChange={(event) => setStatus(event.target.value as ProjectStatus)}
-            aria-invalid={!!errors.status}
-            aria-describedby={errors.status ? "project-status-error" : undefined}
-            className="text-base sm:text-sm"
-            disabled={mutation.isPending}
-          />
-          <FieldError id="project-status-error" message={errors.status} />
-        </div>
-        <div>
-          <Input
-            label="Repository URL"
-            type="url"
-            inputMode="url"
-            placeholder="https://github.com/organization/repository"
-            value={repoUrl}
-            onChange={(event) => setRepoUrl(event.target.value)}
-            aria-invalid={!!errors.repoUrl}
-            aria-describedby={errors.repoUrl ? "project-repository-url-error" : undefined}
-            className="text-base placeholder:text-text-primary/60 sm:text-sm"
-            disabled={mutation.isPending}
-          />
-          <FieldError id="project-repository-url-error" message={errors.repoUrl} />
-        </div>
-
-        {submitError && (
-          <div
-            role="alert"
-            aria-live="polite"
-            className="rounded-lg border border-error/30 bg-error/10 px-3 py-2 text-sm text-error"
-          >
-            Project was not created: {submitError} Your entries are still here; correct the issue and retry.
-          </div>
-        )}
-
-        <div className="flex flex-col-reverse gap-2 pt-2 sm:flex-row sm:justify-end">
-          <Button type="button" variant="ghost" onClick={handleClose} disabled={mutation.isPending}>
-            Cancel
-          </Button>
-          <Button type="submit" loading={mutation.isPending}>
-            Create Project
-          </Button>
-        </div>
-      </form>
-    </Modal>
+      companyId={companyId}
+      onClose={onClose}
+      onSaved={onCreated}
+    />
   );
 }
diff --git a/ui/src/components/projects/ProjectFormModal.tsx b/ui/src/components/projects/ProjectFormModal.tsx
new file mode 100644
index 0000000..d4ff5ee
--- /dev/null
+++ b/ui/src/components/projects/ProjectFormModal.tsx
@@ -0,0 +1,231 @@
+import { useEffect, useState } from "react";
+import { z } from "zod";
+import { Modal } from "@/components/ui/Modal";
+import { Input, Select, Textarea } from "@/components/ui/Input";
+import { Button } from "@/components/ui/Button";
+import { useCreateProject, useUpdateProject } from "@/lib/hooks";
+import { isHttpUrl } from "@/lib/urls";
+import type { Project, ProjectStatus } from "@/lib/api";
+
+interface ProjectFormModalProps {
+  open: boolean;
+  onClose: () => void;
+  onSaved: (project: Project) => void;
+  companyId: string;
+  project?: Project;
+}
+
+const projectStatuses: { value: ProjectStatus; label: string }[] = [
+  { value: "planning", label: "Planning" },
+  { value: "active", label: "Active" },
+  { value: "completed", label: "Completed" },
+];
+
+const projectSchema = z.object({
+  name: z.string().trim().min(1, "Enter a project name.").max(255, "Use 255 characters or fewer."),
+  description: z.string().max(5000, "Use 5,000 characters or fewer."),
+  status: z.enum(["planning", "active", "completed"]),
+  repoUrl: z.union([
+    z.literal(""),
+    z
+      .url("Enter a complete repository URL, such as https://github.com/org/repo.")
+      .refine(isHttpUrl, "Repository URL must start with http:// or https://."),
+  ]),
+});
+
+type ProjectFormErrors = Partial<Record<keyof z.infer<typeof projectSchema>, string>>;
+
+function FieldError({ id, message }: { id: string; message?: string }) {
+  if (!message) return null;
+
+  return (
+    <p id={id} role="alert" className="mt-1.5 text-xs text-error">
+      {message}
+    </p>
+  );
+}
+
+export function ProjectFormModal({
+  open,
+  onClose,
+  onSaved,
+  companyId,
+  project,
+}: ProjectFormModalProps) {
+  const [name, setName] = useState("");
+  const [description, setDescription] = useState("");
+  const [status, setStatus] = useState<ProjectStatus>("planning");
+  const [repoUrl, setRepoUrl] = useState("");
+  const [errors, setErrors] = useState<ProjectFormErrors>({});
+  const [submitError, setSubmitError] = useState<string | null>(null);
+  const createMutation = useCreateProject(companyId);
+  const updateMutation = useUpdateProject(companyId);
+  const isEditing = !!project;
+  const isPending = createMutation.isPending || updateMutation.isPending;
+
+  useEffect(() => {
+    if (!open) return;
+    setName(project?.name ?? "");
+    setDescription(project?.description ?? "");
+    setStatus(project?.status === "archived" ? "planning" : (project?.status ?? "planning"));
+    setRepoUrl(project?.repoUrl ?? "");
+    setErrors({});
+    setSubmitError(null);
+    // Initialize once per opened project: a background refetch of the project query
+    // changes the object identity, and re-running here would discard operator input.
+  }, [open, project?.id]);
+
+  function resetForm() {
+    setName("");
+    setDescription("");
+    setStatus("planning");
+    setRepoUrl("");
+    setErrors({});
+    setSubmitError(null);
+    createMutation.reset();
+    updateMutation.reset();
+  }
+
+  function handleClose() {
+    resetForm();
+    onClose();
+  }
+
+  function handleSubmit(event: React.FormEvent) {
+    event.preventDefault();
+    setSubmitError(null);
+
+    const parsed = projectSchema.safeParse({ name, description, status, repoUrl });
+    if (!parsed.success) {
+      const fieldErrors = parsed.error.flatten().fieldErrors;
+      setErrors({
+        name: fieldErrors.name?.[0],
+        description: fieldErrors.description?.[0],
+        status: fieldErrors.status?.[0],
+        repoUrl: fieldErrors.repoUrl?.[0],
+      });
+      return;
+    }
+
+    setErrors({});
+    const data = {
+      name: parsed.data.name,
+      description: parsed.data.description.trim() || null,
+      status: parsed.data.status,
+      repoUrl: parsed.data.repoUrl || null,
+    };
+    const callbacks = {
+      onSuccess: (savedProject: Project) => {
+        resetForm();
+        onClose();
+        onSaved(savedProject);
+      },
+      onError: (error: Error) => {
+        setSubmitError(
+          error instanceof Error
+            ? error.message
+            : `Project ${isEditing ? "update" : "creation"} failed. Check your connection and try again.`,
+        );
+      },
+    };
+
+    if (project) {
+      updateMutation.mutate({ projectId: project.id, data }, callbacks);
+    } else {
+      createMutation.mutate(
+        { ...data, description: data.description ?? undefined },
+        callbacks,
+      );
+    }
+  }
+
+  return (
+    <Modal
+      open={open}
+      onClose={handleClose}
+      title={isEditing ? "Edit Project" : "Create Project"}
+      dismissible={!isPending}
+    >
+      <form onSubmit={handleSubmit} noValidate className="space-y-4">
+        <div>
+          <Input
+            label="Project name"
+            placeholder="e.g., Runtime reliability"
+            value={name}
+            onChange={(event) => setName(event.target.value)}
+            aria-invalid={!!errors.name}
+            aria-describedby={errors.name ? "project-name-error" : undefined}
+            className="text-base placeholder:text-text-primary/60 sm:text-sm"
+            autoFocus
+            maxLength={255}
+            disabled={isPending}
+            required
+          />
+          <FieldError id="project-name-error" message={errors.name} />
+        </div>
+        <div>
+          <Textarea
+            label="Description"
+            placeholder="What outcome does this project own?"
+            value={description}
+            onChange={(event) => setDescription(event.target.value)}
+            aria-invalid={!!errors.description}
+            aria-describedby={errors.description ? "project-description-error" : undefined}
+            className="text-base placeholder:text-text-primary/60 sm:text-sm"
+            maxLength={5000}
+            rows={3}
+            disabled={isPending}
+          />
+          <FieldError id="project-description-error" message={errors.description} />
+        </div>
+        <div>
+          <Select
+            label="Status"
+            options={projectStatuses}
+            value={status}
+            onChange={(event) => setStatus(event.target.value as ProjectStatus)}
+            aria-invalid={!!errors.status}
+            aria-describedby={errors.status ? "project-status-error" : undefined}
+            className="text-base sm:text-sm"
+            disabled={isPending}
+          />
+          <FieldError id="project-status-error" message={errors.status} />
+        </div>
+        <div>
+          <Input
+            label="Repository URL"
+            type="url"
+            inputMode="url"
+            placeholder="https://github.com/organization/repository"
+            value={repoUrl}
+            onChange={(event) => setRepoUrl(event.target.value)}
+            aria-invalid={!!errors.repoUrl}
+            aria-describedby={errors.repoUrl ? "project-repository-url-error" : undefined}
+            className="text-base placeholder:text-text-primary/60 sm:text-sm"
+            disabled={isPending}
+          />
+          <FieldError id="project-repository-url-error" message={errors.repoUrl} />
+        </div>
+
+        {submitError && (
+          <div
+            role="alert"
+            aria-live="polite"
+            className="rounded-lg border border-error/30 bg-error/10 px-3 py-2 text-sm text-error"
+          >
+            Project was not {isEditing ? "updated" : "created"}: {submitError} Your entries are still here; correct the issue and retry.
+          </div>
+        )}
+
+        <div className="flex flex-col-reverse gap-2 pt-2 sm:flex-row sm:justify-end">
+          <Button type="button" variant="ghost" onClick={handleClose} disabled={isPending}>
+            Cancel
+          </Button>
+          <Button type="submit" loading={isPending}>
+            {isEditing ? "Save Changes" : "Create Project"}
+          </Button>
+        </div>
+      </form>
+    </Modal>
+  );
+}
diff --git a/ui/src/lib/api.ts b/ui/src/lib/api.ts
index 1c23e05..7c629b0 100644
--- a/ui/src/lib/api.ts
+++ b/ui/src/lib/api.ts
@@ -259,15 +259,39 @@ export interface CreateProjectInput {
   repoUrl: string | null;
 }
 
+export interface UpdateProjectInput {
+  name?: string;
+  description?: string | null;
+  status?: ProjectStatus;
+  repoUrl?: string | null;
+}
+
 export const getProjects = (companyId: string) =>
   request<Project[]>(`/companies/${companyId}/projects`);
 
+export const getProject = (companyId: string, projectId: string) =>
+  request<ApiResponse<Project>>(`/companies/${companyId}/projects/${projectId}`);
+
 export const createProject = (companyId: string, data: CreateProjectInput) =>
   request<ApiResponse<Project>>(`/companies/${companyId}/projects`, {
     method: "POST",
     body: JSON.stringify(data),
   });
 
+export const updateProject = (
+  companyId: string,
+  projectId: string,
+  data: UpdateProjectInput,
+) => request<ApiResponse<Project>>(`/companies/${companyId}/projects/${projectId}`, {
+  method: "PATCH",
+  body: JSON.stringify(data),
+});
+
+export const archiveProject = (companyId: string, projectId: string) =>
+  request<ApiResponse<Project>>(`/companies/${companyId}/projects/${projectId}`, {
+    method: "DELETE",
+  });
+
 // ── Agents ───────────────────────────────────────────────────────────────
 
 export const getAgents = (companyId: string) =>
diff --git a/ui/src/lib/hooks.ts b/ui/src/lib/hooks.ts
index 695fd4e..f1a7501 100644
--- a/ui/src/lib/hooks.ts
+++ b/ui/src/lib/hooks.ts
@@ -91,6 +91,17 @@ export function useProjects(companyId: string | undefined) {
   });
 }
 
+export function useProject(
+  companyId: string | undefined,
+  projectId: string | undefined,
+) {
+  return useQuery({
+    queryKey: ["projects", companyId, projectId],
+    queryFn: async () => unwrap<api.Project>(await api.getProject(companyId!, projectId!)),
+    enabled: !!companyId && !!projectId,
+  });
+}
+
 export function useCreateProject(companyId: string) {
   const qc = useQueryClient();
 
@@ -107,6 +118,45 @@ export function useCreateProject(companyId: string) {
   });
 }
 
+export function useUpdateProject(companyId: string) {
+  const qc = useQueryClient();
+
+  return useMutation({
+    mutationFn: async ({
+      projectId,
+      data,
+    }: {
+      projectId: string;
+      data: api.UpdateProjectInput;
+    }) => unwrap<api.Project>(await api.updateProject(companyId, projectId, data)),
+    onSuccess: (project) => {
+      qc.setQueryData(["projects", companyId, project.id], project);
+      qc.setQueryData<api.Project[]>(["projects", companyId], (current) =>
+        current?.map((item) => item.id === project.id ? project : item),
+      );
+      qc.invalidateQueries({ queryKey: ["projects", companyId] });
+      qc.invalidateQueries({ queryKey: ["projects", companyId, project.id] });
+    },
+  });
+}
+
+export function useArchiveProject(companyId: string) {
+  const qc = useQueryClient();
+
+  return useMutation({
+    mutationFn: async ({ projectId }: { projectId: string }) =>
+      unwrap<api.Project>(await api.archiveProject(companyId, projectId)),
+    onSuccess: (project) => {
+      qc.setQueryData(["projects", companyId, project.id], project);
+      qc.setQueryData<api.Project[]>(["projects", companyId], (current) =>
+        current?.map((item) => item.id === project.id ? project : item),
+      );
+      qc.invalidateQueries({ queryKey: ["projects", companyId] });
+      qc.invalidateQueries({ queryKey: ["projects", companyId, project.id] });
+    },
+  });
+}
+
 // ── Agents ───────────────────────────────────────────────────────────────
 
 export function useAgents(companyId: string | undefined) {
diff --git a/ui/src/lib/urls.ts b/ui/src/lib/urls.ts
new file mode 100644
index 0000000..c4faf99
--- /dev/null
+++ b/ui/src/lib/urls.ts
@@ -0,0 +1,8 @@
+export function isHttpUrl(value: string): boolean {
+  try {
+    const protocol = new URL(value).protocol;
+    return protocol === "http:" || protocol === "https:";
+  } catch {
+    return false;
+  }
+}
diff --git a/ui/src/pages/ProjectDetail.tsx b/ui/src/pages/ProjectDetail.tsx
index 3c0d9fe..0913412 100644
--- a/ui/src/pages/ProjectDetail.tsx
+++ b/ui/src/pages/ProjectDetail.tsx
@@ -1,11 +1,15 @@
 import { useState } from "react";
-import { useParams, Link } from "react-router-dom";
-import { ArrowLeft, FolderKanban, Activity } from "lucide-react";
-import { useProjects } from "@/lib/hooks";
+import { useParams, Link, useNavigate } from "react-router-dom";
+import { Activity, Archive, ArrowLeft, ExternalLink, FolderKanban, Pencil } from "lucide-react";
+import { toast } from "sonner";
+import { useArchiveProject, useProject } from "@/lib/hooks";
 import { Badge } from "@/components/ui/Badge";
 import { Button } from "@/components/ui/Button";
 import { Tabs } from "@/components/ui/Tabs";
 import { EmptyState } from "@/components/ui/EmptyState";
+import { Modal } from "@/components/ui/Modal";
+import { ProjectFormModal } from "@/components/projects/ProjectFormModal";
+import { isHttpUrl } from "@/lib/urls";
 import { TaskBoard } from "@/pages/TaskBoard";
 import { GoalTree } from "@/pages/GoalTree";
 import type { Tab } from "@/components/ui/Tabs";
@@ -26,10 +30,13 @@ const statusVariant: Record<string, "default" | "success" | "warning" | "info" |
 
 export function ProjectDetail() {
   const { companyId, projectId } = useParams();
-  const { data: projects, isLoading } = useProjects(companyId);
+  const navigate = useNavigate();
+  const { data: project, isLoading, isError, refetch } = useProject(companyId, projectId);
+  const archiveMutation = useArchiveProject(companyId ?? "");
   const [activeTab, setActiveTab] = useState("issues");
-
-  const project = projects?.find((p) => p.id === projectId);
+  const [editOpen, setEditOpen] = useState(false);
+  const [archiveOpen, setArchiveOpen] = useState(false);
+  const [archiveError, setArchiveError] = useState<string | null>(null);
 
   if (isLoading) {
     return (
@@ -39,6 +46,19 @@ export function ProjectDetail() {
     );
   }
 
+  if (isError) {
+    return (
+      <div className="flex h-full items-center justify-center p-6">
+        <EmptyState
+          icon={<FolderKanban className="h-6 w-6" />}
+          title="Project could not be loaded"
+          description="Check your connection and try again."
+          action={<Button variant="secondary" onClick={() => void refetch()}>Try again</Button>}
+        />
+      </div>
+    );
+  }
+
   if (!project) {
     return (
       <div className="flex h-full items-center justify-center p-6">
@@ -58,11 +78,13 @@ export function ProjectDetail() {
     );
   }
 
+  const repoUrl = project.repoUrl && isHttpUrl(project.repoUrl) ? project.repoUrl : null;
+
   return (
     <div className="flex h-full flex-col">
       {/* Header */}
       <div className="shrink-0 bg-surface border-b border-white/[0.06] px-5 pt-4 pb-0">
-        <div className="flex items-center gap-3 mb-3">
+        <div className="mb-3 flex flex-wrap items-center gap-3">
           <Link
             to={`/company/${companyId}/projects`}
             className="flex h-7 w-7 items-center justify-center rounded-md text-text-secondary hover:text-accent hover:bg-accent/10 transition-all duration-200"
@@ -82,11 +104,45 @@ export function ProjectDetail() {
               </Badge>
             </div>
             {project.description && (
-              <p className="text-xs text-text-secondary mt-0.5 truncate">
+              <p className="mt-0.5 line-clamp-2 text-xs text-text-secondary">
                 {project.description}
               </p>
             )}
+            {repoUrl && (
+              <a
+                href={repoUrl}
+                target="_blank"
+                rel="noopener noreferrer"
+                className="mt-1 inline-flex max-w-full items-center gap-1 text-xs text-accent hover:underline"
+              >
+                <span className="truncate">{repoUrl}</span>
+                <ExternalLink className="h-3 w-3 shrink-0" aria-hidden="true" />
+              </a>
+            )}
           </div>
+          {project.status !== "archived" && (
+            <div className="flex w-full gap-2 sm:w-auto">
+              <Button
+                variant="secondary"
+                className="flex-1 sm:flex-none"
+                icon={<Pencil className="h-3.5 w-3.5" />}
+                onClick={() => setEditOpen(true)}
+              >
+                Edit Project
+              </Button>
+              <Button
+                variant="danger"
+                className="flex-1 sm:flex-none"
+                icon={<Archive className="h-3.5 w-3.5" />}
+                onClick={() => {
+                  setArchiveError(null);
+                  setArchiveOpen(true);
+                }}
+              >
+                Archive Project
+              </Button>
+            </div>
+          )}
         </div>
         <Tabs tabs={tabs} activeTab={activeTab} onTabChange={setActiveTab} className="!px-0" />
       </div>
@@ -105,6 +161,72 @@ export function ProjectDetail() {
           </div>
         )}
       </div>
+
+      <ProjectFormModal
+        open={editOpen}
+        companyId={companyId ?? ""}
+        project={project}
+        onClose={() => setEditOpen(false)}
+        onSaved={(savedProject) => toast.success(`Project updated: ${savedProject.name}`)}
+      />
+
+      <Modal
+        open={archiveOpen}
+        onClose={() => {
+          setArchiveError(null);
+          archiveMutation.reset();
+          setArchiveOpen(false);
+        }}
+        title="Archive Project"
+        dismissible={!archiveMutation.isPending}
+      >
+        <div className="space-y-4">
+          <p className="text-sm leading-relaxed text-text-secondary">
+            Archive <strong className="text-text-primary">{project.name}</strong>? Its data and history will be retained, and the project will remain identifiable as archived.
+          </p>
+          {archiveError && (
+            <div
+              role="alert"
+              aria-live="polite"
+              className="rounded-lg border border-error/30 bg-error/10 px-3 py-2 text-sm text-error"
+            >
+              Project was not archived: {archiveError} Try again when the connection is available.
+            </div>
+          )}
+          <div className="flex flex-col-reverse gap-2 sm:flex-row sm:justify-end">
+            <Button
+              type="button"
+              variant="ghost"
+              disabled={archiveMutation.isPending}
+              onClick={() => setArchiveOpen(false)}
+            >
+              Keep Project
+            </Button>
+            <Button
+              type="button"
+              variant="danger"
+              loading={archiveMutation.isPending}
+              onClick={() => {
+                setArchiveError(null);
+                archiveMutation.mutate(
+                  { projectId: project.id },
+                  {
+                    onSuccess: () => {
+                      toast.success(`Project archived: ${project.name}`);
+                      navigate(`/company/${companyId}/projects`, { replace: true });
+                    },
+                    onError: (error) => {
+                      setArchiveError(error instanceof Error ? error.message : "Archive failed.");
+                    },
+                  },
+                );
+              }}
+            >
+              Confirm Archive
+            </Button>
+          </div>
+        </div>
+      </Modal>
     </div>
   );
 }
diff --git a/ui/test/CreateProjectModal.test.tsx b/ui/test/CreateProjectModal.test.tsx
index 848b7e9..c307a38 100644
--- a/ui/test/CreateProjectModal.test.tsx
+++ b/ui/test/CreateProjectModal.test.tsx
@@ -5,6 +5,7 @@ import { CreateProjectModal } from "../src/components/projects/CreateProjectModa
 
 const mocks = vi.hoisted(() => ({
   createProject: vi.fn(),
+  updateProject: vi.fn(),
   reset: vi.fn(),
   isPending: false,
 }));
@@ -15,6 +16,11 @@ vi.mock("@/lib/hooks", () => ({
     reset: mocks.reset,
     isPending: mocks.isPending,
   }),
+  useUpdateProject: () => ({
+    mutate: mocks.updateProject,
+    reset: mocks.reset,
+    isPending: false,
+  }),
 }));
 
 const project = {
@@ -67,6 +73,30 @@ describe("CreateProjectModal", () => {
     expect(mocks.createProject).not.toHaveBeenCalled();
   });
 
+  it("rejects repository URLs with executable schemes", async () => {
+    const user = userEvent.setup();
+    render(
+      <CreateProjectModal
+        open
+        companyId="company-1"
+        onClose={vi.fn()}
+        onCreated={vi.fn()}
+      />,
+    );
+
+    await user.type(screen.getByLabelText("Project name"), "Runtime reliability");
+    await user.type(
+      screen.getByLabelText("Repository URL"),
+      "javascript:alert(document.domain)",
+    );
+    await user.click(screen.getByRole("button", { name: "Create Project" }));
+
+    expect(screen.getByRole("alert")).toHaveTextContent(
+      "Repository URL must start with http:// or https://.",
+    );
+    expect(mocks.createProject).not.toHaveBeenCalled();
+  });
+
   it("locks dismissal and fields while creation is pending", () => {
     mocks.isPending = true;
     const onClose = vi.fn();
diff --git a/ui/test/ProjectDetail.test.tsx b/ui/test/ProjectDetail.test.tsx
new file mode 100644
index 0000000..513f58d
--- /dev/null
+++ b/ui/test/ProjectDetail.test.tsx
@@ -0,0 +1,151 @@
+import { render, screen } from "@testing-library/react";
+import userEvent from "@testing-library/user-event";
+import { MemoryRouter, Route, Routes } from "react-router-dom";
+import { beforeAll, beforeEach, describe, expect, it, vi } from "vitest";
+import { ProjectDetail } from "../src/pages/ProjectDetail";
+
+const mocks = vi.hoisted(() => ({
+  archiveProject: vi.fn(),
+  createProject: vi.fn(),
+  updateProject: vi.fn(),
+  reset: vi.fn(),
+  successToast: vi.fn(),
+}));
+
+const project = {
+  id: "project-1",
+  companyId: "company-1",
+  name: "Runtime reliability",
+  description: "Make agent execution durable.",
+  status: "active" as const,
+  repoUrl: "https://github.com/vertical-labs/eidolon",
+  createdAt: "2026-07-30T22:00:00.000Z",
+  updatedAt: "2026-07-30T22:00:00.000Z",
+};
+
+vi.mock("@/lib/hooks", () => ({
+  useArchiveProject: () => ({
+    mutate: mocks.archiveProject,
+    reset: mocks.reset,
+    isPending: false,
+  }),
+  useCreateProject: () => ({
+    mutate: mocks.createProject,
+    reset: mocks.reset,
+    isPending: false,
+  }),
+  useProject: () => ({
+    data: project,
+    isLoading: false,
+    isError: false,
+    refetch: vi.fn(),
+  }),
+  useUpdateProject: () => ({
+    mutate: mocks.updateProject,
+    reset: mocks.reset,
+    isPending: false,
+  }),
+}));
+
+vi.mock("@/pages/TaskBoard", () => ({ TaskBoard: () => <div>Issue board</div> }));
+vi.mock("@/pages/GoalTree", () => ({ GoalTree: () => <div>Goal tree</div> }));
+vi.mock("sonner", () => ({ toast: { success: mocks.successToast } }));
+
+function renderDetail() {
+  return render(
+    <MemoryRouter initialEntries={["/company/company-1/projects/project-1"]}>
+      <Routes>
+        <Route path="/company/:companyId/projects/:projectId" element={<ProjectDetail />} />
+        <Route path="/company/:companyId/projects" element={<div>Project list route</div>} />
+      </Routes>
+    </MemoryRouter>,
+  );
+}
+
+describe("ProjectDetail lifecycle controls", () => {
+  beforeAll(() => {
+    HTMLDialogElement.prototype.showModal = vi.fn(function (this: HTMLDialogElement) {
+      this.setAttribute("open", "");
+    });
+    HTMLDialogElement.prototype.close = vi.fn(function (this: HTMLDialogElement) {
+      this.removeAttribute("open");
+    });
+  });
+
+  beforeEach(() => {
+    vi.clearAllMocks();
+    project.repoUrl = "https://github.com/vertical-labs/eidolon";
+  });
+
+  it("does not render a persisted unsafe repository URL as a link", () => {
+    project.repoUrl = "javascript:alert(document.domain)";
+    renderDetail();
+
+    expect(screen.queryByRole("link", { name: /javascript:/ })).not.toBeInTheDocument();
+  });
+
+  it("edits all operator fields through the shared form with keyboard submission", async () => {
+    const user = userEvent.setup();
+    renderDetail();
+
+    await user.click(screen.getByRole("button", { name: "Edit Project" }));
+    const name = screen.getByLabelText("Project name");
+    expect(name).toHaveValue("Runtime reliability");
+    expect(screen.getByLabelText("Repository URL"))
+      .toHaveValue("https://github.com/vertical-labs/eidolon");
+
+    await user.clear(name);
+    await user.type(name, "Runtime reliability verified");
+    await user.selectOptions(screen.getByLabelText("Status"), "completed");
+    screen.getByRole("button", { name: "Save Changes" }).focus();
+    await user.keyboard("{Enter}");
+
+    expect(mocks.updateProject).toHaveBeenCalledWith(
+      {
+        projectId: "project-1",
+        data: expect.objectContaining({
+          name: "Runtime reliability verified",
+          description: "Make agent execution durable.",
+          status: "completed",
+          repoUrl: "https://github.com/vertical-labs/eidolon",
+        }),
+      },
+      expect.objectContaining({ onSuccess: expect.any(Function), onError: expect.any(Function) }),
+    );
+  });
+
+  it("preserves edits and shows a visible update failure", async () => {
+    const user = userEvent.setup();
+    renderDetail();
+
+    await user.click(screen.getByRole("button", { name: "Edit Project" }));
+    const name = screen.getByLabelText("Project name");
+    await user.clear(name);
+    await user.type(name, "Keep this edit");
+    await user.click(screen.getByRole("button", { name: "Save Changes" }));
+    const callbacks = mocks.updateProject.mock.calls[0][1];
+    callbacks.onError(new Error("Database unavailable"));
+
+    expect(await screen.findByRole("alert")).toHaveTextContent("Database unavailable");
+    expect(name).toHaveValue("Keep this edit");
+  });
+
+  it("explains soft archive, reports failure, and returns to the project list after success", async () => {
+    const user = userEvent.setup();
+    renderDetail();
+
+    await user.click(screen.getByRole("button", { name: "Archive Project" }));
+    expect(screen.getByText(/Its data and history will be retained/)).toBeInTheDocument();
+    await user.click(screen.getByRole("button", { name: "Confirm Archive" }));
+    let callbacks = mocks.archiveProject.mock.calls[0][1];
+    callbacks.onError(new Error("Archive service unavailable"));
+    expect(await screen.findByRole("alert")).toHaveTextContent("Archive service unavailable");
+
+    await user.click(screen.getByRole("button", { name: "Confirm Archive" }));
+    callbacks = mocks.archiveProject.mock.calls[1][1];
+    callbacks.onSuccess({ ...project, status: "archived" });
+
+    expect(await screen.findByText("Project list route")).toBeInTheDocument();
+    expect(mocks.successToast).toHaveBeenCalledWith("Project archived: Runtime reliability");
+  });
+});
diff --git a/ui/test/ProjectFormModal.test.tsx b/ui/test/ProjectFormModal.test.tsx
new file mode 100644
index 0000000..f8c5bd1
--- /dev/null
+++ b/ui/test/ProjectFormModal.test.tsx
@@ -0,0 +1,79 @@
+import { render, screen } from "@testing-library/react";
+import userEvent from "@testing-library/user-event";
+import { beforeAll, beforeEach, describe, expect, it, vi } from "vitest";
+import { ProjectFormModal } from "../src/components/projects/ProjectFormModal";
+
+const mocks = vi.hoisted(() => ({
+  createProject: vi.fn(),
+  updateProject: vi.fn(),
+  reset: vi.fn(),
+}));
+
+vi.mock("@/lib/hooks", () => ({
+  useCreateProject: () => ({
+    mutate: mocks.createProject,
+    reset: mocks.reset,
+    isPending: false,
+  }),
+  useUpdateProject: () => ({
+    mutate: mocks.updateProject,
+    reset: mocks.reset,
+    isPending: false,
+  }),
+}));
+
+const project = {
+  id: "project-1",
+  companyId: "company-1",
+  name: "Runtime reliability",
+  description: "Make agent execution durable.",
+  status: "active" as const,
+  repoUrl: "https://github.com/vertical-labs/eidolon",
+  createdAt: "2026-07-30T22:00:00.000Z",
+  updatedAt: "2026-07-30T22:00:00.000Z",
+};
+
+describe("ProjectFormModal", () => {
+  beforeAll(() => {
+    HTMLDialogElement.prototype.showModal = vi.fn(function (this: HTMLDialogElement) {
+      this.setAttribute("open", "");
+    });
+    HTMLDialogElement.prototype.close = vi.fn(function (this: HTMLDialogElement) {
+      this.removeAttribute("open");
+    });
+  });
+
+  beforeEach(() => {
+    vi.clearAllMocks();
+  });
+
+  it("keeps operator edits when the cached project is refetched", async () => {
+    const user = userEvent.setup();
+    const { rerender } = render(
+      <ProjectFormModal
+        open
+        companyId="company-1"
+        project={project}
+        onClose={vi.fn()}
+        onSaved={vi.fn()}
+      />,
+    );
+
+    const name = screen.getByLabelText("Project name");
+    await user.clear(name);
+    await user.type(name, "Runtime durability");
+
+    // A background refetch hands down an equal project with a new object identity.
+    rerender(
+      <ProjectFormModal
+        open
+        companyId="company-1"
+        project={{ ...project }}
+        onClose={vi.fn()}
+        onSaved={vi.fn()}
+      />,
+    );
+
+    expect(screen.getByLabelText("Project name")).toHaveValue("Runtime durability");
+  });
+});
diff --git a/ui/test/project-hooks.test.tsx b/ui/test/project-hooks.test.tsx
index 43f8afd..880356b 100644
--- a/ui/test/project-hooks.test.tsx
+++ b/ui/test/project-hooks.test.tsx
@@ -1,16 +1,27 @@
-import { act, renderHook } from "@testing-library/react";
+import { act, renderHook, waitFor } from "@testing-library/react";
 import { QueryClient, QueryClientProvider } from "@tanstack/react-query";
 import type { ReactNode } from "react";
 import { beforeEach, describe, expect, it, vi } from "vitest";
-import { useCreateProject } from "../src/lib/hooks";
+import {
+  useArchiveProject,
+  useCreateProject,
+  useProject,
+  useUpdateProject,
+} from "../src/lib/hooks";
 
 const apiMocks = vi.hoisted(() => ({
+  archiveProject: vi.fn(),
   createProject: vi.fn(),
+  getProject: vi.fn(),
+  updateProject: vi.fn(),
 }));
 
 vi.mock("../src/lib/api", async () => ({
   ...(await vi.importActual<typeof import("../src/lib/api")>("../src/lib/api")),
+  archiveProject: apiMocks.archiveProject,
   createProject: apiMocks.createProject,
+  getProject: apiMocks.getProject,
+  updateProject: apiMocks.updateProject,
 }));
 
 const createdProject = {
@@ -60,4 +71,63 @@ describe("useCreateProject", () => {
       .toEqual([createdProject]);
     expect(queryClient.getQueryState(["projects", "company-1"])?.isInvalidated).toBe(true);
   });
+
+  it("loads one project into a canonical detail cache", async () => {
+    apiMocks.getProject.mockResolvedValue({ data: createdProject });
+    const { result } = renderHook(() => useProject("company-1", "project-1"), { wrapper });
+
+    await waitFor(() => expect(result.current.isSuccess).toBe(true));
+    expect(result.current.data).toEqual(createdProject);
+    expect(apiMocks.getProject).toHaveBeenCalledWith("company-1", "project-1");
+  });
+
+  it("updates list and detail caches with the persisted project", async () => {
+    const updatedProject = {
+      ...createdProject,
+      name: "Runtime reliability verified",
+      status: "completed" as const,
+    };
+    queryClient.setQueryData(["projects", "company-1"], [createdProject]);
+    queryClient.setQueryData(["projects", "company-1", "project-1"], createdProject);
+    apiMocks.updateProject.mockResolvedValue({ data: updatedProject });
+    const { result } = renderHook(() => useUpdateProject("company-1"), { wrapper });
+
+    await act(async () => {
+      await result.current.mutateAsync({
+        projectId: "project-1",
+        data: { name: "Runtime reliability verified", status: "completed" },
+      });
+    });
+
+    expect(apiMocks.updateProject).toHaveBeenCalledWith(
+      "company-1",
+      "project-1",
+      expect.objectContaining({ status: "completed" }),
+    );
+    expect(queryClient.getQueryData(["projects", "company-1", "project-1"]))
+      .toEqual(updatedProject);
+    expect(queryClient.getQueryData(["projects", "company-1"]))
+      .toEqual([updatedProject]);
+    expect(queryClient.getQueryState(["projects", "company-1"])?.isInvalidated).toBe(true);
+    expect(queryClient.getQueryState(["projects", "company-1", "project-1"])?.isInvalidated)
+      .toBe(true);
+  });
+
+  it("marks the canonical project archived in both caches", async () => {
+    const archivedProject = { ...createdProject, status: "archived" as const };
+    queryClient.setQueryData(["projects", "company-1"], [createdProject]);
+    queryClient.setQueryData(["projects", "company-1", "project-1"], createdProject);
+    apiMocks.archiveProject.mockResolvedValue({ data: archivedProject });
+    const { result } = renderHook(() => useArchiveProject("company-1"), { wrapper });
+
+    await act(async () => {
+      await result.current.mutateAsync({ projectId: "project-1" });
+    });
+
+    expect(apiMocks.archiveProject).toHaveBeenCalledWith("company-1", "project-1");
+    expect(queryClient.getQueryData(["projects", "company-1", "project-1"]))
+      .toEqual(archivedProject);
+    expect(queryClient.getQueryData(["projects", "company-1"]))
+      .toEqual([archivedProject]);
+  });
 });