feat(web): the dashboard in cards, like the repository page (closes #155) f8cf54e99879

- **Diffusion (#148, docs/diffusion.md).** When a repository that others pin as a subrepo moves on, each consumer that follows it gets a proposal moving the pin, signed by the hub, tested by the consumer's own pipeline, with the upstream's changes listed. One proposal per consumer and subrepo, kept up to date; never landed by itself. Turned on per repository (Settings › Diffusion, `PUT /repos/{owner}/{name}/diffusion`, or `follow` in `.oxymodules`), off by default; `green` waits for the upstream's run to pass. A repository's page shows who uses it and how far behind each is (Diffusion › Diffuses to, `GET /repos/{owner}/{name}/consumers`). Consumers are bumped on the bookmark their work lands on, learned from where their proposals land.

- **Diffusion in the API (#153):** `GET /repos/{owner}/{name}/diffusion` gives what a repository takes from and what it diffuses to, each with its pill, for the VS Code extension.

- **Tidier pages (#152).** The repository sidebar is a column of cards with shaded headings: Diffusion in one card (Takes from and Diffuses to, each with its pill), the ten most recently moved bookmarks with a link to the rest, and the hub's delegate key shown with the OxygenHub mark. The code tree has a shaded head with the latest change and the history, and folder and file icons; the site bar has icons; the Diffusion tables share one column grid; Help › Coming from GitHub covers submodules and Renovate.

- **Admin › Runners › Images (#146):** every runner image, where it is and what uses it.

- **Faster pages after a restart (#145):** bookmark summaries are kept on disk; slow requests are logged.

:root[data-look="github"] .tree-box .tree-head + table.tree { border-top-left-radius: 0; border-top-right-radius: 0; }

:root[data-look="github"] .side-card > h3 { font-size: 14px; }

:root[data-look="github"] table.tree td.g.ic-dir { color: #54aeff; }

    // Andy owns both repositories: both proposals wait for his review.

    let page = get(app, "/", Some(&andy)).await;

    assert_eq!(page.status, StatusCode::OK);

    assert!(page.body.contains("/andy/demo/proposal/1") && page.body.contains("/andy/secret/proposal/1"));

    assert!(page.body.contains("Your repositories"));

    assert!(page.body.contains("opened proposal"), "activity feed: {}", page.body);

    let andy_id = db::accounts::account_by_name(&app.db, "andy").await.unwrap().unwrap().id;

    let p = db::proposals::get(&app.db, demo.id, 1).await.unwrap().unwrap();

    db::proposals::add_review(&app.db, p.id, andy_id, "andy", "approve", "").await.unwrap();

    // Bob sees his own proposal on the public repository, never the private one's.

    let page = get(app, "/", Some(&bob)).await;

    assert!(!page.body.contains("Hidden work"));

    assert!(page.body.contains("Faster startup"));

    let feed = &page.body[page.body.find("Recent activity").unwrap()..];

    assert!(!feed.contains("andy/secret"), "private activity leaked: {feed}");

<div class="head">

  <h1>Dashboard <small>signed in as {% if let Some(u) = shell.user %}{{ u }}{% endif %}</small></h1>

</div>

  <div>

    {% if reviews.is_empty() %}

    <p class="empty small">Nothing waits on you. Proposals by others in your repositories land here until you review them.</p>

    {% else %}

    {% endfor %}

    </ul>

    {% endif %}

    {% if !authored.is_empty() %}

    <ul class="rows">

    {% for p in authored %}

      <li>

      </li>

    {% endfor %}

    </ul>

    {% endif %}

    {% if !assigned.is_empty() %}

    <ul class="rows">

    {% for i in assigned %}

      <li>

      </li>

    {% endfor %}

    </ul>

    {% endif %}

    {% if feed.is_empty() %}

    <p class="empty small">No activity yet. Push to a repository and it shows here.</p>

    {% else %}

    {% endfor %}

    </ul>

    {% endif %}

  </div>

    {% if mine.is_empty() %}

    <p class="small mute">None yet. <a href="/new">Create one</a>, or <a href="/explore">explore</a>.</p>

    {% else %}

    {% for r in mine %}

    {% endfor %}

    </ul>

    {% endif %}

  </aside>

</div>

{% endblock %}

ul.df-list .df-line { display: flex; align-items: center; gap: 8px; margin-top: 3px; font-size: 12px; }

ul.bookmarks li { display: flex; align-items: center; gap: 6px; }

ul.bookmarks li > a { flex: 1; min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }