branch.
+ if (el.classList.contains("folder-tree__link")) {
+ const details = el.closest("summary")?.parentElement
+ if (!details || details.open) return null
+ return {
+ open: () => {
+ details.open = true
+ return { owner: el, keepAlive: [details], close: () => { details.open = false } }
+ }
+ }
+ }
+
+ // Main pane: folder rows tunnel in, breadcrumbs tunnel back up — the
+ // pane temporarily becomes that folder's real level view. Any folder
+ // (empty included: tunnel in, drop on the empty pane to file there).
+ if (el.classList.contains("folder-row") ||
+ (el.classList.contains("workspace-crumbs__crumb") &&
+ !el.classList.contains("workspace-crumbs__crumb--current"))) {
+ const url = el.href
+ if (!url) return null
+ return {
+ prefetch: () => this.#prefetchPane(url),
+ open: () => { this.#tunnel(url); return null }
+ }
+ }
+
+ return null
+ }
+
+ // ----- Tunneling (temporary in-drag navigation of the main pane) -----
+
+ #prefetchPane(url) {
+ if (this.paneCache?.url === url) return this.paneCache.promise
+ const promise = fetch(url, { headers: { "Accept": "text/html" } })
+ .then(response => {
+ if (!response.ok) throw new Error(`prefetch ${response.status}`)
+ return response.text()
+ })
+ .then(html => new DOMParser().parseFromString(html, "text/html"))
+ // Swallow here so an abandoned prefetch never surfaces as an unhandled
+ // rejection; #tunnel re-awaits the cached promise and handles failure.
+ promise.catch(() => {})
+ this.paneCache = { url, promise }
+ return promise
+ }
+
+ async #tunnel(url) {
+ let doc
+ try { doc = await this.#prefetchPane(url) } catch { return }
+ // The world may have moved on while the fetch ran.
+ if (!this.dragActive) return
+ const main = this.element.querySelector(".workspace__main")
+ const incoming = doc.querySelector(".workspace__main")
+ if (!main || !incoming) return
+
+ if (!this.tunnelHome) {
+ // Keep the dragged row's node in the document — removing the drag
+ // source mid-drag makes browsers skip dragend entirely, leaking the
+ // whole drag state. It waits out the tunnel in a hidden stash.
+ if (this.dragSourceEl && main.contains(this.dragSourceEl)) {
+ this.sourceHome = { parent: this.dragSourceEl.parentNode, next: this.dragSourceEl.nextSibling }
+ this.#stash().appendChild(this.dragSourceEl)
+ }
+ this.tunnelHome = { nodes: Array.from(main.childNodes) }
+ this.homeFolderId = main.dataset.folderId
+ }
+ main.replaceChildren(...incoming.childNodes)
+ // Swap the pane's own drop identity too — dead-space drops now file
+ // into the tunneled folder.
+ main.dataset.folderId = incoming.dataset.folderId || ""
+ this.tunnelUrl = url
+ // Restart the entrance animation for each level.
+ main.classList.remove("workspace__main--tunneled")
+ void main.offsetWidth
+ main.classList.add("workspace__main--tunneled")
+ }
+
+ #restoreTunnel() {
+ if (!this.tunnelHome) return
+ const main = this.element.querySelector(".workspace__main")
+ if (main) {
+ main.replaceChildren(...this.tunnelHome.nodes)
+ main.dataset.folderId = this.homeFolderId ?? main.dataset.folderId
+ main.classList.remove("workspace__main--tunneled")
+ }
+ if (this.dragSourceEl && this.sourceHome?.parent?.isConnected) {
+ this.sourceHome.parent.insertBefore(this.dragSourceEl, this.sourceHome.next)
+ }
+ this.tunnelHome = null
+ this.tunnelUrl = null
+ this.sourceHome = null
+ }
+
+ #stash() {
+ if (!this.stashEl) {
+ this.stashEl = document.createElement("div")
+ this.stashEl.style.display = "none"
+ this.element.appendChild(this.stashEl)
+ }
+ return this.stashEl
+ }
+
+ #cancelPendingSpring() {
+ clearTimeout(this.springTimer)
+ this.springPendingEl?.classList.remove(SPRING_CLASS)
+ this.springPendingEl = null
+ }
+
+ #collapseAllSprings() {
+ while (this.springs.length) this.springs.pop().close()
+ }
+
+ #dragCleanup() {
+ this.dragActive = false
+ this.#cancelPendingSpring()
+ this.paneCache = null
+ // A committed drop keeps the tunneled pane and its pulsing target on
+ // screen until the refresh lands (or the move fails); an abandoned
+ // drag snaps everything back to where it started.
+ if (!this.dropCommitted) {
+ this.#collapseAllSprings()
+ this.#restoreTunnel()
+ }
+ setTimeout(() => { this.dragHappened = false }, 0)
}
drop(event) {
if (!this.#accepts(event)) return
event.preventDefault()
+ // Same innermost-target-wins rule as dragOver: a drop on a folder row
+ // must not also fire the pane-wide "file here" target behind it.
+ event.stopPropagation()
const target = event.currentTarget
target.classList.remove(DROP_CLASS)
@@ -85,14 +319,14 @@ export default class extends Controller {
// no-op, not a PATCH + reload + toast.
if (payload.id && payload.id === targetFolderId) return
if ((payload.parentId || "") === targetFolderId) return
- this.#patch(payload.url, { parent_id: targetFolderId }, "Folder moved.")
+ this.#patch(payload.url, { parent_id: targetFolderId }, "Folder moved.", target)
} else {
let payload = {}
try { payload = JSON.parse(event.dataTransfer.getData(PLAN_MIME)) } catch {}
if (!payload.url) return
// Same quiet no-op when the plan is already filed right here.
if ((payload.folderId || "") === targetFolderId) return
- this.#patch(payload.url, { folder_id: targetFolderId }, "Plan moved.")
+ this.#patch(payload.url, { folder_id: targetFolderId }, "Plan moved.", target)
}
}
@@ -101,7 +335,16 @@ export default class extends Controller {
return types.includes(PLAN_MIME) || types.includes(FOLDER_MIME)
}
- #patch(url, body, fallbackMessage) {
+ #patch(url, body, fallbackMessage, target) {
+ // The PATCH + page refresh takes a beat — show it immediately: the drop
+ // target pulses, the dragged row stays ghosted, the cursor says busy.
+ // (drop fires before dragend, so the --dragging source is still marked.)
+ this.dropCommitted = true
+ target?.classList.add(BUSY_CLASS)
+ this.element.classList.add("workspace--moving")
+ this.element.querySelector(".plan-row--dragging, .folder-tree__link--dragging")
+ ?.classList.add("dnd-source--moving")
+
const token = document.querySelector('meta[name="csrf-token"]')?.content
fetch(url, {
method: "PATCH",
@@ -120,12 +363,31 @@ export default class extends Controller {
const message = data.message || fallbackMessage
if (window.Turbo) {
document.addEventListener("turbo:load", () => this.#toast(message, "notice"), { once: true })
- window.Turbo.visit(window.location.href, { action: "replace" })
+ // A drop inside a tunneled folder lands you there for real —
+ // Finder leaves you in the window you sprang into.
+ if (this.tunnelUrl) {
+ window.Turbo.visit(this.tunnelUrl, { action: "advance" })
+ } else {
+ window.Turbo.visit(window.location.href, { action: "replace" })
+ }
} else {
this.#toast(message, "notice")
+ this.#clearBusy(target)
}
})
- .catch(error => this.#toast(error.message, "alert"))
+ .catch(error => {
+ this.#clearBusy(target)
+ this.#toast(error.message, "alert")
+ })
+ }
+
+ #clearBusy(target) {
+ this.dropCommitted = false
+ target?.classList.remove(BUSY_CLASS)
+ this.element.classList.remove("workspace--moving")
+ this.element.querySelector(".dnd-source--moving")?.classList.remove("dnd-source--moving")
+ this.#collapseAllSprings()
+ this.#restoreTunnel()
}
#toast(message, kind) {
diff --git a/engine/app/javascript/controllers/coplan/plan_bookmark_controller.js b/engine/app/javascript/controllers/coplan/plan_bookmark_controller.js
new file mode 100644
index 0000000..594b64c
--- /dev/null
+++ b/engine/app/javascript/controllers/coplan/plan_bookmark_controller.js
@@ -0,0 +1,30 @@
+import { Controller } from "@hotwired/stimulus"
+
+// Mounts the save bookmark into the plan header's title row. The bookmark
+// is viewer-relative (saved state, move URL) so it can't be rendered inside
+// the broadcast-replaced #plan-header partial — instead the show view
+// renders it into a and this controller stamps a fresh copy into
+// #plan-bookmark-slot on load and again after every broadcast replaces the
+// header.
+export default class extends Controller {
+ static targets = ["template"]
+
+ connect() {
+ this.observer = new MutationObserver(() => this.#mount())
+ this.observer.observe(this.element, { childList: true, subtree: true })
+ this.#mount()
+ }
+
+ disconnect() {
+ this.observer.disconnect()
+ }
+
+ #mount() {
+ if (!this.hasTemplateTarget) return
+ const slot = this.element.querySelector("#plan-bookmark-slot")
+ // Stamping into the slot re-fires the observer; the childElementCount
+ // check makes that re-entry a no-op instead of a loop.
+ if (!slot || slot.childElementCount > 0) return
+ slot.append(this.templateTarget.content.cloneNode(true))
+ }
+}
diff --git a/engine/app/javascript/controllers/coplan/plan_keys_controller.js b/engine/app/javascript/controllers/coplan/plan_keys_controller.js
index 62c2726..6436b2f 100644
--- a/engine/app/javascript/controllers/coplan/plan_keys_controller.js
+++ b/engine/app/javascript/controllers/coplan/plan_keys_controller.js
@@ -9,6 +9,16 @@ import { Controller } from "@hotwired/stimulus"
// (references, attachments)
//
// Sections register via data-plan-section attributes, in document order.
+
+// Turbo Drive navigates with pushState + fetch, so document.referrer never
+// updates after the first real page load — it can't answer "did we get here
+// from inside the app?". Track that ourselves: any Turbo visit in this tab
+// means there's in-app history worth going back to. (Module scope survives
+// Turbo navigations; a full reload resets it, but a full reload also sets a
+// real referrer, so the two checks cover each other.)
+let visitedInApp = false
+document.addEventListener("turbo:visit", () => { visitedInApp = true })
+
export default class extends Controller {
static values = { fallbackUrl: String }
@@ -47,10 +57,12 @@ export default class extends Controller {
}
_goBack() {
- // Same-app referrer: real back, preserving scroll and history. A cold
+ // Came from inside the app (Turbo visit or full-load referrer): real
+ // back, preserving the folder you were in, scroll, and history. A cold
// open (direct link, new tab) has nowhere to go back to — visit the
// fallback instead.
- if (document.referrer.startsWith(window.location.origin) && window.history.length > 1) {
+ const cameFromApp = visitedInApp || document.referrer.startsWith(window.location.origin)
+ if (cameFromApp && window.history.length > 1) {
window.history.back()
} else if (this.hasFallbackUrlValue && window.Turbo) {
window.Turbo.visit(this.fallbackUrlValue)
diff --git a/engine/app/javascript/controllers/coplan/toast_controller.js b/engine/app/javascript/controllers/coplan/toast_controller.js
new file mode 100644
index 0000000..ec90633
--- /dev/null
+++ b/engine/app/javascript/controllers/coplan/toast_controller.js
@@ -0,0 +1,16 @@
+import { Controller } from "@hotwired/stimulus"
+
+// A self-dismissing toast. Server-rendered Turbo Stream toasts append into
+// #coplan-toasts with this controller attached; it fades the toast out and
+// removes it. (Client-built toasts in folder_dnd manage their own timer.)
+export default class extends Controller {
+ static values = { duration: { type: Number, default: 4000 } }
+
+ connect() {
+ this.timer = setTimeout(() => this.element.remove(), this.durationValue)
+ }
+
+ disconnect() {
+ clearTimeout(this.timer)
+ }
+}
diff --git a/engine/app/models/coplan/folder.rb b/engine/app/models/coplan/folder.rb
index 0a2baf3..cd29c4c 100644
--- a/engine/app/models/coplan/folder.rb
+++ b/engine/app/models/coplan/folder.rb
@@ -94,10 +94,11 @@ def self.paths_by_id(folders = order(:name).to_a)
by_id = folders.index_by(&:id)
folders.index_with do |folder|
names = [ folder.name ]
+ seen = Set.new([ folder.id ])
node = folder
while node.parent_id && (node = by_id[node.parent_id])
+ break unless seen.add?(node.id) # cycle guard on bad data
names.unshift(node.name)
- break if names.length > MAX_DEPTH # cycle guard on bad data
end
names.join("/")
end.transform_keys(&:id)
diff --git a/engine/app/views/coplan/plans/_attachments.html.erb b/engine/app/views/coplan/plans/_attachments.html.erb
index f7b8924..b478702 100644
--- a/engine/app/views/coplan/plans/_attachments.html.erb
+++ b/engine/app/views/coplan/plans/_attachments.html.erb
@@ -7,8 +7,9 @@
<% if can_add %>
<%= render layout: "coplan/shared/add_modal", locals: { id: "add-attachment-modal", title: "Add files" } do %>
<%# One designed dropzone instead of the native file input: click to
- browse or drag files on; choosing files uploads immediately (the
- upload redirect reloads the page, which closes the lightbox). %>
+ browse or drag files on; choosing files uploads immediately with
+ a live progress bar, then the server's Turbo Stream re-renders
+ this whole section in place — no reload, no scroll jump. %>
<%= form_with url: plan_attachments_path(plan), method: :post, multipart: true,
class: "attachments-upload", data: { controller: "coplan--dropzone" } do |f| %>
<%= f.file_field :files, multiple: true, name: "files[]", class: "dropzone__input",
accept: CoPlan::Plan::ATTACHMENT_CONTENT_TYPES.join(","),
@@ -68,8 +72,7 @@
<% end %>
<% else %>
-
+ <%# Byline, anchored to the card's top-right corner regardless of how the
+ title wraps — a floating "author · when" would read as misalignment. %>
+
diff --git a/engine/app/views/coplan/plans/_references.html.erb b/engine/app/views/coplan/plans/_references.html.erb
index 770d93d..1e54daf 100644
--- a/engine/app/views/coplan/plans/_references.html.erb
+++ b/engine/app/views/coplan/plans/_references.html.erb
@@ -55,8 +55,7 @@
<% end %>
<% else %>
- 
- <% else %>
-
- <%= viewer.name.split.map { |w| w[0] }.first(2).join.upcase %>
-
+ <%# Each viewer is a person — their avatar links to their profile
+ (and library). The tooltip lives on the link: ::after can't
+ render on a replaced element like ![]()
. %>
+ <%= link_to profile_path_for(viewer), class: "plan-viewers__avatar-link",
+ data: { tooltip: tooltip }, aria: { label: "#{viewer.name}’s profile" } do %>
+ <% if viewer.avatar_url.present? %>
+
+ <% else %>
+
+ <%= viewer.name.split.map { |w| w[0] }.first(2).join.upcase %>
+
+ <% end %>
<% end %>
<% end %>
<% if viewers.size > 8 %>
diff --git a/engine/app/views/coplan/plans/index.html.erb b/engine/app/views/coplan/plans/index.html.erb
index 8ce1de1..601ebfd 100644
--- a/engine/app/views/coplan/plans/index.html.erb
+++ b/engine/app/views/coplan/plans/index.html.erb
@@ -5,11 +5,18 @@
<% end %>
-
-
+ <%# One quiet line, not a padded card — empty is the common case. %>
+ No attachments yet.<% if can_add %> Upload files to share diagrams, screenshots, or documents alongside the plan.<% end %>
-None yet<% if can_add %> — use the + to add screenshots, diagrams, or files<% end %>.
<% end %> diff --git a/engine/app/views/coplan/plans/_footnotes.html.erb b/engine/app/views/coplan/plans/_footnotes.html.erb new file mode 100644 index 0000000..fa1e1b7 --- /dev/null +++ b/engine/app/views/coplan/plans/_footnotes.html.erb @@ -0,0 +1,32 @@ +<%# Back matter: references and attachments close out the document inside + the content column — separated from the prose by a rule, not banished + below the sidebar where long outlines made them collide. Each section + is one quiet header line (+, title, count); empty sections stay one + line tall. %> +
+
+
+
+
+
+
diff --git a/engine/app/views/coplan/plans/_header.html.erb b/engine/app/views/coplan/plans/_header.html.erb
index 480a509..638a564 100644
--- a/engine/app/views/coplan/plans/_header.html.erb
+++ b/engine/app/views/coplan/plans/_header.html.erb
@@ -6,11 +6,20 @@
+ <% if current_user && allowed_to?(plan, :contribute?) %>
+
+ <% end %>
+
+ <%= render partial: "coplan/plans/references", locals: { references: references, plan: plan } %>
+ References
+ <%= references.size %> +
+ <% if current_user && allowed_to?(plan, :contribute?) %>
+
+ <% end %>
+
+ <%= render partial: "coplan/plans/attachments", locals: { attachments: attachments, plan: plan } %>
+ Attachments
+ <%= attachments.size %> +
<%= plan_type_icon(plan, size: :lg) %>
diff --git a/engine/app/views/coplan/plans/_plan_row.html.erb b/engine/app/views/coplan/plans/_plan_row.html.erb
index fca4a8f..5bab1bc 100644
--- a/engine/app/views/coplan/plans/_plan_row.html.erb
+++ b/engine/app/views/coplan/plans/_plan_row.html.erb
@@ -24,7 +24,12 @@
<%= plan_type_icon(plan, size: :lg) %>
<%= plan.title %>
+ <%# The save bookmark mounts here from outside this partial: it's + viewer-relative (needs current_user), and this header re-renders + from broadcasts where there is none — plan_bookmark_controller + re-stamps it after every replace. %> +
- <%= link_to plan.title, plan_path(plan), class: "plan-row__title", draggable: false, data: { turbo_frame: "_top" } %><%= plan_state_badge(plan) %>
+ <%# Stretched link: the title's ::after covers the whole card, so a
+ click anywhere navigates and a hover anywhere prefetches the plan
+ (Turbo 8 hover prefetch) — native link semantics (middle/cmd
+ click) included. Other links/buttons in the row sit above it. %>
+ <%= link_to plan.title, plan_path(plan), class: "plan-row__title", draggable: false,
+ data: { turbo_frame: "_top", turbo_prefetch: true } %><%= plan_state_badge(plan) %>
<% if my_folder_id && my_folder_id != local_assigns[:suppress_folder_id] %>
<%= link_to workspace_path(folder: my_folder_id),
class: "plan-row__folder", draggable: false, data: { turbo_frame: "_top" } do %>
@@ -32,35 +37,18 @@
<%= folder_paths_by_id[my_folder_id] %>
<% end %>
<% end %>
- <% plan.tags.each do |tag| %>
- <%= link_to tag.name,
- workspace_path(tag: tag.name),
- class: "badge badge--tag #{'badge--tag-active' if params[:tag] == tag.name}",
- draggable: false,
- data: { turbo_frame: "_top" } %>
- <% end %>
-
<% if unread > 0 %>
"><%= unread %>
<% end %>
- <%= time_ago_in_words(plan.updated_at) %> ago
- <%= link_to user_avatar(plan.created_by_user), profile_path_for(plan.created_by_user), title: plan.created_by_user.name, draggable: false, data: { turbo_frame: "_top" } %>
- <%# Bookmark = the keyboard/no-drag path into the folder navigator.
- Saved rows unsave on the second click, quietly. %>
-
<% if summary.present? %>
<%= summary %>
<% end %>
-
+ <%# One quiet line, not a padded card — empty is the common case. %>
+ No references yet. Links in the plan content are auto-extracted, or add one manually.
-None yet — links in the document are picked up automatically.
<% end %> diff --git a/engine/app/views/coplan/plans/_shelves.html.erb b/engine/app/views/coplan/plans/_shelves.html.erb index ce830e3..0e5d74d 100644 --- a/engine/app/views/coplan/plans/_shelves.html.erb +++ b/engine/app/views/coplan/plans/_shelves.html.erb @@ -2,10 +2,10 @@ rendered Drive-style — a quiet folder chip with just the folder name. Whose library it is lives in the tooltip (and the link target). Lives outside the broadcast #plan-header region — it's viewer-relative - (needs current_user). %> -<% my_placement = placements.find { |p| p.library.writable_by?(current_user) } %> - -<% if current_user || placements.any? %> + (needs current_user). The save bookmark itself lives beside the title + (see plan_bookmark_controller), so this strip is chips-only and + disappears entirely when the plan sits on no one's shelf. %> +<% if placements.any? %>
<% placements.each do |placement| %>
<% mine = placement.library.writable_by?(current_user) %>
@@ -30,23 +30,5 @@
<% end %>
<% end %>
- <% if current_user %>
- <%# The bookmark: click to save this plan into your own library via
- the folder navigator; click again to quietly unsave it (your own
- plans just return to My Plans, unfiled). Filled once shelved —
- exactly a bookmark star. %>
-
- <% end %>
<% end %>
diff --git a/engine/app/views/coplan/plans/_sidebar.html.erb b/engine/app/views/coplan/plans/_sidebar.html.erb
index fdc67dd..7b057da 100644
--- a/engine/app/views/coplan/plans/_sidebar.html.erb
+++ b/engine/app/views/coplan/plans/_sidebar.html.erb
@@ -111,15 +111,20 @@
Hidden
diff --git a/engine/app/views/coplan/plans/_viewers.html.erb b/engine/app/views/coplan/plans/_viewers.html.erb index 6eacd42..8689d4d 100644 --- a/engine/app/views/coplan/plans/_viewers.html.erb +++ b/engine/app/views/coplan/plans/_viewers.html.erb @@ -4,12 +4,18 @@ <% viewers.first(8).each do |viewer| %> <% is_you = defined?(current_user) && current_user&.id == viewer.id %> <% tooltip = is_you ? "#{viewer.name} (you)" : viewer.name %> - <% if viewer.avatar_url.present? %> -
+<%# No folder picker here: rows file via drag & drop, and the plan page's
+ title bookmark covers the click path. %>
+
<%= render "coplan/plans/sidebar" %>
- <%= render partial: "coplan/shared/folder_picker", locals: { folders: @folders } %>
-
+ <%# The whole pane is a drop target for the folder you're looking at —
+ Finder semantics: drop on empty space to file right here. Specific
+ targets inside (folder rows, crumbs) win via stopPropagation. It also
+ carries the pane's own URL so drag-tunneling can restore/advance. %>
+
<%# Drive-style breadcrumb: where you are in your library. Segments are
drop targets — drag a plan or folder onto one to move it up. %>