When a user lacks permission, the app should (a) not let them do data entry it
will reject and (b) subtly say who can. General mechanism + the key gates.
Server — compute & expose "who can <verb> here":
- zddc.WhoCan(chain, verb) → Authority{Roles, People}: the acl.permissions
grantees holding the verb across the cascade (roles + their members) plus the
admins (who bypass). New whocan.go + whocan_test.go.
- AccessView gains path_who_can (profilehandler.go), populated only for verbs the
caller LACKS and only when they can read the path (mirrors .zddc readability),
so one cap.at() answers "can I?" and "if not, who?".
- writeForbiddenWho enriches the 403 body with who_can for the missing verb
(errors.go); authorizeAction uses it (fileapi.go) as the safety net for denials
that weren't pre-checked.
Shared — shared/cap.js:
- cap.whoCan(view, verb) + cap.denyHint(view, verb) → {text, title}, role-first
("Only the document controller can create here") with the people in the tooltip.
- handleForbidden appends the hint (from the 403 body, else the cached view), so
every tool that already routes 403s through it (form save, tables save, browse)
now explains who can — for free.
Key gates:
- Browse party-create (the reported bug): pre-check create authority on ssr/ and
the slot BEFORE opening the picker — if the user can do neither, show the hint
instead of the form; if only existing parties are usable, disable "+ New party"
with the who-can hint. The post-hoc 403 catch now names who can too.
- Tables +Add row disabled state shows the who-can hint.
Plus: subtle /_apps/{browse,archive,classifier}.html links in the landing footer.
Tests: Go WhoCan unit test (role/person split, admin bypass, dedupe); cap.spec.js
(denyHint role-first/people/fallback, whoCan, handleForbidden enrichment) — 5
green; Go handler+zddc+policy suites green. (Pre-existing stale browse toolbar
test browse.spec.js:274 unaffected.)
Co-Authored-By: Claude Opus 4.8 (1M context) <noreply@anthropic.com>
257 lines
13 KiB
HTML
257 lines
13 KiB
HTML
<!DOCTYPE html>
|
|
<html lang="en">
|
|
<head>
|
|
<meta charset="UTF-8">
|
|
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
|
<title>ZDDC — Projects</title>
|
|
<link rel="icon" type="image/svg+xml" href="{{FAVICON}}">
|
|
<style>
|
|
{{CSS_PLACEHOLDER}}
|
|
</style>
|
|
</head>
|
|
<body>
|
|
<header class="app-header">
|
|
<div class="header-left">
|
|
<svg class="app-header__logo" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 64 64" aria-hidden="true">
|
|
<rect width="64" height="64" rx="12" fill="#1e3a5f"/>
|
|
<g fill="#fff">
|
|
<rect x="14" y="18" width="36" height="7"/>
|
|
<polygon points="43,25 50,25 21,43 14,43"/>
|
|
<rect x="14" y="43" width="36" height="7"/>
|
|
</g>
|
|
</svg>
|
|
<div class="header-title-group">
|
|
<span class="app-header__title">ZDDC</span>
|
|
<span class="build-timestamp">{{BUILD_LABEL}}</span>
|
|
</div>
|
|
</div>
|
|
<div class="header-right">
|
|
<button id="theme-btn" class="btn btn-secondary" title="Theme: auto (follows OS)" aria-label="Theme: auto (follows OS)">◐</button>
|
|
<button id="help-btn" class="btn btn-secondary" title="Help" aria-label="Help">?</button>
|
|
</div>
|
|
</header>
|
|
|
|
<main id="landingMain" class="landing-main">
|
|
<!-- Picker mode (deployment root /). Project picker + groups. -->
|
|
<div id="pickerView">
|
|
<!-- Welcome / hero -->
|
|
<section class="landing-hero">
|
|
<h1>Welcome to the ZDDC Archive</h1>
|
|
<p class="landing-hero-sub">
|
|
Click a group or project below to open the archive. Use
|
|
<strong>+ New group</strong> to bundle a set of projects you open together.
|
|
</p>
|
|
</section>
|
|
|
|
<!-- Access warning banner (shown when URL ?projects= contains inaccessible items) -->
|
|
<div id="accessWarningBanner" class="access-warning-banner hidden" role="alert">
|
|
<span id="accessWarningText"></span>
|
|
<button class="warning-dismiss-btn" onclick="LandingApp.dismissWarning()" aria-label="Dismiss">×</button>
|
|
</div>
|
|
|
|
<!-- Groups card -->
|
|
<div class="landing-card">
|
|
<div class="landing-card-header">
|
|
<div class="landing-card-title">
|
|
<h2>Groups</h2>
|
|
<span id="groupCount" class="landing-count"></span>
|
|
</div>
|
|
<div class="landing-header-actions">
|
|
<button id="newGroupBtn" class="btn btn-secondary btn-sm" onclick="LandingApp.startCreateGroup()">+ New group</button>
|
|
</div>
|
|
</div>
|
|
<div id="groupsContainer" class="groups-container">
|
|
<!-- Populated by JS -->
|
|
</div>
|
|
</div>
|
|
|
|
<!-- Projects card -->
|
|
<div class="landing-card">
|
|
<!-- Action bar (only visible in select-mode) -->
|
|
<div id="selectActionBar" class="select-action-bar hidden">
|
|
<div class="select-action-bar__label">
|
|
<span id="selectModeTitle"></span>
|
|
<input id="groupNameInput" type="text" class="group-name-input" placeholder="Group name">
|
|
</div>
|
|
<div class="select-action-bar__buttons">
|
|
<button id="cancelSelectBtn" class="btn btn-secondary btn-sm" onclick="LandingApp.cancelSelect()">Cancel</button>
|
|
<button id="openSelectedBtn" class="btn btn-secondary btn-sm" onclick="LandingApp.openSelectedVisible()">Open selected</button>
|
|
<button id="saveGroupBtn" class="btn btn-primary btn-sm" onclick="LandingApp.saveGroup()">Save group</button>
|
|
</div>
|
|
</div>
|
|
|
|
<div class="landing-card-header">
|
|
<div class="landing-card-title">
|
|
<h2>Projects</h2>
|
|
<span id="projectCount" class="landing-count"></span>
|
|
</div>
|
|
<div class="landing-header-actions">
|
|
<!-- Shown only when the server reports can_create_project. -->
|
|
<button id="newProjectBtn" class="btn btn-primary btn-sm hidden" onclick="LandingApp.openNewProject()">+ New project</button>
|
|
</div>
|
|
</div>
|
|
|
|
<div id="projectListContainer" class="project-list-container">
|
|
<!-- Populated by JS -->
|
|
<div class="project-list-loading">Loading projects…</div>
|
|
</div>
|
|
</div>
|
|
</div><!-- /pickerView -->
|
|
|
|
<!-- New-project dialog. Mirrors the profile page's create form; POSTs to
|
|
/.profile/projects, which gates on the create verb at the root. -->
|
|
<div id="newProjectModal" class="np-modal hidden" role="dialog" aria-modal="true" aria-labelledby="npHeading">
|
|
<div class="np-modal__backdrop" onclick="LandingApp.closeNewProject()"></div>
|
|
<div class="np-modal__dialog">
|
|
<div class="np-modal__head">
|
|
<h2 id="npHeading">Create new project</h2>
|
|
<button type="button" class="np-modal__close" onclick="LandingApp.closeNewProject()" aria-label="Close">×</button>
|
|
</div>
|
|
<p class="np-help">Creates a top-level project folder. You're recorded as its creator and added to its admins automatically. Assign members to the project roles below — one email (or role pattern) per row.</p>
|
|
<form id="npForm" autocomplete="off">
|
|
<label class="np-field">Name
|
|
<input type="text" id="npName" maxlength="64" placeholder="e.g. Site-3" required>
|
|
<span class="np-err" id="npNameErr"></span>
|
|
</label>
|
|
<label class="np-field">Title (optional)
|
|
<input type="text" id="npTitleInput" maxlength="200" placeholder="Human-readable project title">
|
|
</label>
|
|
|
|
<h3 class="np-grouphdr">Admins <span class="np-sub">full control (you're already an admin)</span></h3>
|
|
<div class="np-list" data-field="admins"></div>
|
|
<button type="button" class="np-add" data-target="admins">+ Add admin</button>
|
|
|
|
<h3 class="np-grouphdr">Document controllers <span class="np-sub">manage filing & records — read / write / create / delete</span></h3>
|
|
<div class="np-list" data-field="document_controllers"></div>
|
|
<button type="button" class="np-add" data-target="document_controllers">+ Add document controller</button>
|
|
|
|
<h3 class="np-grouphdr">Project team <span class="np-sub">contribute documents — read / write / create</span></h3>
|
|
<div class="np-list" data-field="project_team"></div>
|
|
<button type="button" class="np-add" data-target="project_team">+ Add team member</button>
|
|
|
|
<h3 class="np-grouphdr">Guests <span class="np-sub">read-only access</span></h3>
|
|
<div class="np-list" data-field="guests"></div>
|
|
<button type="button" class="np-add" data-target="guests">+ Add guest</button>
|
|
|
|
<h3 class="np-grouphdr">Advanced — ACL permissions <span class="np-sub">pattern → verbs (r w c d a); empty verbs = explicit deny</span></h3>
|
|
<div class="np-list" data-field="acl.permissions"></div>
|
|
<button type="button" class="np-add" data-target="acl.permissions">+ Add permission</button>
|
|
|
|
<div class="np-actions">
|
|
<button type="button" class="btn btn-secondary" onclick="LandingApp.closeNewProject()">Cancel</button>
|
|
<button type="submit" class="btn btn-primary">Create project</button>
|
|
</div>
|
|
</form>
|
|
</div>
|
|
</div>
|
|
|
|
<!-- Project mode (/<project>). Stage cards + MDL section. Shown
|
|
by landing.js when location.pathname is a single segment. -->
|
|
<div id="projectView" class="hidden">
|
|
<h1 id="projectTitle" class="project-title">
|
|
<span id="projectName"></span>
|
|
<span class="project-title__subtle">— project workspace</span>
|
|
</h1>
|
|
<p class="lead">Pick a lifecycle stage, or browse all files.</p>
|
|
|
|
<div class="stages">
|
|
<a class="stage-card" id="stageArchive">
|
|
<h3>Archive</h3>
|
|
<p>Permanent record of issued and received transmittals, organized by counterparty.</p>
|
|
</a>
|
|
<a class="stage-card" id="stageWorking">
|
|
<h3>Working</h3>
|
|
<p>Per-user drafting workspace. Your folder is private by default; you can grant access by editing its <code>.zddc</code> file.</p>
|
|
</a>
|
|
<a class="stage-card" id="stageStaging">
|
|
<h3>Staging</h3>
|
|
<p>Outbound transmittals being prepared for issue.</p>
|
|
</a>
|
|
<a class="stage-card" id="stageReviewing">
|
|
<h3>Reviewing</h3>
|
|
<p>Pending review responses — inbound submittals paired with their in-progress drafts.</p>
|
|
</a>
|
|
<!-- MDL card. Visually matches the four stage cards above but
|
|
is interactive rather than a plain link: pick a party from
|
|
the select, then Open. -->
|
|
<div class="stage-card stage-card--mdl" id="stageMdl">
|
|
<h3>Master Deliverables List</h3>
|
|
<p>The editable list of expected deliverables for each counterparty.</p>
|
|
<div class="stage-card__action">
|
|
<label class="visually-hidden" for="mdlPartySelect">Party</label>
|
|
<select id="mdlPartySelect" class="mdl-party-select" disabled>
|
|
<option value="">Loading parties…</option>
|
|
</select>
|
|
<button id="mdlOpenBtn" class="btn btn-primary btn-sm" disabled>Open MDL</button>
|
|
</div>
|
|
<p class="stage-card__hint" id="mdlHint">
|
|
The MDL view renders even when <code>archive/<party>/mdl/</code> doesn't yet exist —
|
|
you can start editing before any transmittals have been exchanged.
|
|
</p>
|
|
</div>
|
|
</div>
|
|
|
|
<p><a id="browseAllLink" class="browse-link">Browse all files →</a></p>
|
|
</div><!-- /projectView -->
|
|
</main>
|
|
|
|
<!-- Subtle links to the standalone tools (run against your own local files,
|
|
no server). Served at /_apps/<tool>.html by zddc-server. -->
|
|
<footer class="landing-apps">
|
|
<span class="landing-apps__label">Standalone tools for your own files:</span>
|
|
<a class="browse-link" href="/_apps/browse.html">Browse</a>
|
|
<a class="browse-link" href="/_apps/archive.html">Archive</a>
|
|
<a class="browse-link" href="/_apps/classifier.html">Classifier</a>
|
|
</footer>
|
|
|
|
<!-- Help Panel -->
|
|
<aside id="help-panel" class="help-panel" hidden aria-labelledby="help-panel-title">
|
|
<div class="help-panel__header">
|
|
<h2 id="help-panel-title" class="help-panel__title">Help — ZDDC</h2>
|
|
<button type="button" class="help-panel__close" id="help-panel-close" aria-label="Close">×</button>
|
|
</div>
|
|
<div class="help-panel__body">
|
|
<h3>What is this page?</h3>
|
|
<p>This is the ZDDC archive landing page — a project picker. It lists every
|
|
project (top-level directory) you have access to on this server, plus any
|
|
<strong>groups</strong> you've defined for opening multiple projects at once.</p>
|
|
|
|
<h3>Projects</h3>
|
|
<p>Click a project to open it. The project's archive view (list of folders +
|
|
files, with all the standard ZDDC tools available inside) loads in the same
|
|
tab. Use back/forward to navigate between projects and the picker.</p>
|
|
|
|
<h3>Groups</h3>
|
|
<p>A group bundles a set of projects you commonly open together. Click
|
|
<strong>+ New group</strong>, give it a name, click projects to include
|
|
them, then save. Opening a group opens all its projects in one go.</p>
|
|
<dl>
|
|
<dt>Save group</dt>
|
|
<dd>Persist the selection as a named group on this server (visible to
|
|
other users with access to the same projects).</dd>
|
|
<dt>Open selected</dt>
|
|
<dd>Open the currently-checked projects without saving as a group.</dd>
|
|
<dt>Cancel</dt>
|
|
<dd>Exit select mode without saving.</dd>
|
|
</dl>
|
|
|
|
<h3>Access</h3>
|
|
<p>Projects and groups are filtered by your account's permissions.
|
|
If a URL references a project you don't have access to, a warning banner
|
|
appears and the inaccessible items are skipped silently.</p>
|
|
|
|
<h3>Header buttons</h3>
|
|
<dl>
|
|
<dt>◐ Theme</dt>
|
|
<dd>Cycle auto / light / dark.</dd>
|
|
<dt>? Help</dt>
|
|
<dd>This panel. Press <kbd>Esc</kbd> to close.</dd>
|
|
</dl>
|
|
</div>
|
|
</aside>
|
|
|
|
<script>
|
|
{{JS_PLACEHOLDER}}
|
|
</script>
|
|
</body>
|
|
</html>
|