Merge remote-tracking branch 'origin/main' into sponsor-mgmt-ui

# Conflicts:
#	apps/users/views.py
#	docker-compose.yml
#	pydotorg/settings/local.py

Author: JacobCoffee

.github/dependabot.yml

@@ -26,7 +26,7 @@ updates:
   cooldown:
     default-days: 7
 - package-ecosystem: docker
-  directory: "/"
+  directory: "/docker"
   groups:
     docker:
       patterns:

Makefile

@@ -10,7 +10,7 @@ help: ## Display this help text
 # Docker State
 # =============================================================================
 
-.state/docker-build-web: Dockerfile pyproject.toml uv.lock
+.state/docker-build-web: docker/Dockerfile pyproject.toml uv.lock
 	docker compose build --force-rm web
 	mkdir -p .state && touch .state/docker-build-web
 

apps/agreements/orders/catalog.py

@@ -22,6 +22,8 @@
 CURRENCY_WHOLE_DIGITS = 16
 CURRENCY_DECIMAL_PLACES = 2
 CHOICE_PAIR_SIZE = 2
+HOURS_PER_BUSINESS_DAY = 8
+BUSINESS_TIME = re.compile(r"^\s*(\d+)\s+business\s+(hour|day)s?\s*$", re.IGNORECASE)
 
 RULE_FIELDS = {
     "fixed": {"amount"},
@@ -45,6 +47,15 @@ class Tier:
     includes: str = ""
 
 
+def business_hours(target: str) -> int | None:
+    """Convert a response target such as "2 Business Days" to Coverage Window hours, if it has that form."""
+    match = BUSINESS_TIME.match(target)
+    if not match:
+        return None
+    count = int(match[1])
+    return count * HOURS_PER_BUSINESS_DAY if match[2].lower() == "day" else count
+
+
 @dataclass(frozen=True)
 class Service:
     """A service available at every tier or at an explicit subset."""

apps/agreements/orders/forms.py

@@ -196,7 +196,12 @@ def __init__(
         cast("forms.MultipleChoiceField", self.fields["services"]).choices = [
             (service.key, service.name) for service in agreement.services
         ]
-        self.initial["services"] = line.services if line else []
+        # New packages start with every base service the tier offers; the builder keeps unedited
+        # services in step with tier changes.
+        self.services_follow_tier = line is None and not self.is_bound
+        self.initial["services"] = (
+            line.services if line else [service.key for service in agreement.services_at(self.initial["tier"])]
+        )
         if staff:
             self.fields["special_terms"] = forms.CharField(
                 required=False,

apps/agreements/orders/views.py

@@ -24,6 +24,7 @@
 from apps.agreements.forms.signing import SignForm
 from apps.agreements.models import Order, OrderLine, Program
 from apps.agreements.orders import documents
+from apps.agreements.orders.catalog import business_hours
 from apps.agreements.orders.forms import OrderBuilder
 from apps.agreements.orders.pricing import build_quote, money
 from apps.agreements.registry import get_kind
@@ -36,9 +37,11 @@
     from django.db.models import QuerySet
     from django.http import HttpRequest, HttpResponse
 
+    from apps.agreements.orders.catalog import Agreement
     from apps.users.models import User
 
 KIND = "order"
+SEVERITIES = (("Critical", "P1"), ("High", "P2"), ("Medium", "P3"), ("Low", "P4"))
 
 
 def _orders() -> QuerySet[Order]:
@@ -86,6 +89,29 @@ def _program_or_404(request: HttpRequest, slug: str) -> Program:
     return get_object_or_404(Program.visible_to(request.user), slug=slug)
 
 
+def _response_ladders(agreements: list[Agreement]) -> list[list[dict[str, Any]]]:
+    """Scale every response target against the slowest one in the program, so agreements compare too."""
+    hours = [[[business_hours(target) for target in tier.response_targets] for tier in a.tiers] for a in agreements]
+    slowest = max((h for agreement in hours for tier in agreement for h in tier if h), default=0)
+    return [
+        [
+            {
+                "name": name,
+                "code": code,
+                "cells": [
+                    {
+                        "target": tier.response_targets[index],
+                        "bar": round(100 * h / slowest, 1) if slowest and (h := tier_hours[index]) else None,
+                    }
+                    for tier, tier_hours in zip(agreement.tiers, agreement_hours, strict=True)
+                ],
+            }
+            for index, (name, code) in enumerate(SEVERITIES)
+        ]
+        for agreement, agreement_hours in zip(agreements, hours, strict=True)
+    ]
+
+
 @never_cache
 @require_GET
 def program_list(request: HttpRequest) -> HttpResponse:
@@ -113,6 +139,7 @@ def program_detail(request: HttpRequest, slug: str) -> HttpResponse:
             "program": program,
             "catalog": program.catalog,
             "agreements": agreements,
+            "families": list(zip(agreements, _response_ladders(agreements), strict=True)),
             "under_review": any(agreement.terms.under_review for agreement in agreements),
             "orders": _order_rows(_own_orders(request.user).filter(program=program)[:5]),
             "nav": "programs",

apps/agreements/static/agreements/package-builder.css

@@ -2,10 +2,6 @@
 
 /* ---------- Program list and overview ---------- */
 
-.agreement-orders .tier-table { margin: 0.5em 0 1.3125em; }
-.agreement-orders .tier-table th,
-.agreement-orders .tier-table td { padding: 0.45em 0.6em; border-bottom: 1px solid #e6e8ea; }
-.agreement-orders .tier-table thead th { background-color: #e6e8ea; color: #444; font-family: SourceSansProBold, Arial, sans-serif; }
 .agreement-orders .agreement-summary { border-top: 5px solid #caccce; padding-top: 0.5em; margin-top: 1.75em; }
 .agreement-orders .agreement-summary h2 { margin-top: 0.25em; }
 .agreement-orders .agreement-services { color: #666; font-size: 0.9em; }
@@ -26,9 +22,79 @@
 .program-overview .po-tagline { margin-bottom: 0.5em; }
 .program-overview .po-table-wrap { max-width: 100%; overflow-x: auto; }
 .program-overview .po-terms { font-size: 0.9em; color: #666; }
+.program-overview .po-list-title { margin: 1em 0 0.15em; font-size: 1.0625em; }
+.program-overview .agreement-services { margin-bottom: 0.4em; }
+.program-overview .po-list { margin: 0 0 1em; font-size: 0.9375em; line-height: 1.5; }
+.program-overview .po-list dt { margin-top: 0.5em; border: 0; font-family: SourceSansProBold, Arial, sans-serif; color: #222; }
+.program-overview .po-list dd { margin: 0; padding: 0; border: 0; color: #555; }
+.program-overview .po-list-note { margin-left: 0.35em; font-family: SourceSansProRegular, Arial, sans-serif; font-size: 0.9em; color: #2b5b84; }
+
+/* Tier comparison: plan columns, with response targets drawn to one program-wide scale. */
+.program-overview .po-plans {
+  --po-blue: #3776ab;
+  --po-blue-dark: #2b5b84;
+  --po-blue-quiet: #a9c4dc;
+  --po-yellow: #ffd343;
+  --po-line: #e6e8ea;
+  --po-col: #f3f8fc;
+  width: 100%;
+  margin: 0.75em 0 1.75em;
+  table-layout: fixed;
+  border-collapse: separate;
+  border-spacing: 0;
+  font-variant-numeric: tabular-nums;
+}
+.program-overview .po-plans tr { background: none; }
+.program-overview .po-plans :is(th, td) { padding: 0.55em 0.9em; background: none; border: 0; text-align: left; vertical-align: middle; transition: background-color 180ms cubic-bezier(0.22, 1, 0.36, 1); }
+.program-overview .po-plans tbody th { width: 30%; padding-left: 0; font-family: SourceSansProRegular, Arial, sans-serif; color: #444; }
+.program-overview .po-plans thead :is(th, td) { border-bottom: 1px solid #caccce; }
+.program-overview .po-plans .po-plan { padding-top: 0.85em; padding-bottom: 0.9em; border-top: 3px solid var(--po-line); vertical-align: bottom; transition: background-color 180ms cubic-bezier(0.22, 1, 0.36, 1), border-color 180ms cubic-bezier(0.22, 1, 0.36, 1); }
+.program-overview .po-plan-name { display: block; font-family: SourceSansProBold, Arial, sans-serif; font-size: 0.9375em; color: var(--po-blue-dark); }
+.program-overview .po-plan-fee { display: block; margin-top: 0.1em; font-family: SourceSansProBold, Arial, sans-serif; font-size: 1.75em; line-height: 1.1; color: #222; }
+.program-overview .po-plan-unit { display: block; margin-top: 0.15em; font-family: SourceSansProRegular, Arial, sans-serif; font-size: 0.875em; line-height: 1.3; color: #666; }
+.program-overview .po-requests :is(th, td) { padding-block: 0.75em; border-bottom: 1px solid var(--po-line); }
+.program-overview .po-requests td { font-family: SourceSansProBold, Arial, sans-serif; font-size: 1.125em; color: #222; }
+.program-overview .po-group th { padding: 1.5em 0 0.4em; font-family: SourceSansProBold, Arial, sans-serif; color: #222; }
+.program-overview .po-group-note { margin-left: 0.4em; font-family: SourceSansProRegular, Arial, sans-serif; font-size: 0.875em; color: #666; }
+.program-overview .po-severity :is(th, td) { padding-block: 0.6em; border-top: 1px solid var(--po-line); }
+.program-overview .po-sev { margin-left: 0.3em; padding: 0.1em 0.4em; border-radius: 3px; background-color: #eef1f4; color: #555; font-family: SourceSansProBold, Arial, sans-serif; font-size: 0.75em; vertical-align: 0.1em; }
+.program-overview .po-target { display: block; color: #333; font-size: 0.9375em; white-space: nowrap; }
+.program-overview .po-bar { display: block; width: 100%; height: 6px; margin-top: 0.4em; border-radius: 3px; overflow: hidden; }
+.program-overview .po-bar-track { fill: #eef1f4; }
+.program-overview .po-bar-fill { fill: var(--po-blue); transition: fill 180ms cubic-bezier(0.22, 1, 0.36, 1); }
+
+/* Pointing at any cell in a tier lights that tier's whole column and quiets the others. */
+.program-overview .po-plans:has(:is(thead th, td):hover) .po-bar-fill { fill: var(--po-blue-quiet); }
+.program-overview .po-plans:has(tr > :nth-child(2):is(th, td):hover) tr > :nth-child(2),
+.program-overview .po-plans:has(tr > :nth-child(3):is(th, td):hover) tr > :nth-child(3),
+.program-overview .po-plans:has(tr > :nth-child(4):is(th, td):hover) tr > :nth-child(4),
+.program-overview .po-plans:has(tr > :nth-child(5):is(th, td):hover) tr > :nth-child(5),
+.program-overview .po-plans:has(tr > :nth-child(6):is(th, td):hover) tr > :nth-child(6) { background-color: var(--po-col); }
+.program-overview .po-plans:has(tr > :nth-child(2):is(th, td):hover) tr > :nth-child(2) .po-bar-fill,
+.program-overview .po-plans:has(tr > :nth-child(3):is(th, td):hover) tr > :nth-child(3) .po-bar-fill,
+.program-overview .po-plans:has(tr > :nth-child(4):is(th, td):hover) tr > :nth-child(4) .po-bar-fill,
+.program-overview .po-plans:has(tr > :nth-child(5):is(th, td):hover) tr > :nth-child(5) .po-bar-fill,
+.program-overview .po-plans:has(tr > :nth-child(6):is(th, td):hover) tr > :nth-child(6) .po-bar-fill { fill: var(--po-blue-dark); }
+.program-overview .po-plans:has(tr > :nth-child(2):is(th, td):hover) thead tr > :nth-child(2),
+.program-overview .po-plans:has(tr > :nth-child(3):is(th, td):hover) thead tr > :nth-child(3),
+.program-overview .po-plans:has(tr > :nth-child(4):is(th, td):hover) thead tr > :nth-child(4),
+.program-overview .po-plans:has(tr > :nth-child(5):is(th, td):hover) thead tr > :nth-child(5),
+.program-overview .po-plans:has(tr > :nth-child(6):is(th, td):hover) thead tr > :nth-child(6) { border-top-color: var(--po-yellow); }
+
+@media (prefers-reduced-motion: no-preference) {
+  .program-overview .po-bar-fill { transform-box: fill-box; transform-origin: left center; animation: po-bar-grow 720ms cubic-bezier(0.22, 1, 0.36, 1) both; }
+  .program-overview .po-severity:nth-child(4) .po-bar-fill { animation-delay: 70ms; }
+  .program-overview .po-severity:nth-child(5) .po-bar-fill { animation-delay: 140ms; }
+  .program-overview .po-severity:nth-child(6) .po-bar-fill { animation-delay: 210ms; }
+}
+@keyframes po-bar-grow { from { transform: scaleX(0); } }
 
 @media (max-width: 40em) {
   .program-overview .po-invite { grid-template-columns: minmax(0, 1fr); }
+  .program-overview .po-plans :is(th, td) { padding-inline: 0.45em; }
+  .program-overview .po-plans tbody th { width: 34%; padding-left: 0; line-height: 1.25; }
+  .program-overview .po-plan-fee { font-size: 1.25em; }
+  .program-overview .po-target { font-size: 0.875em; white-space: normal; line-height: 1.25; }
   .program-overview .po-invite-cta { justify-self: start; }
 }
 
@@ -38,10 +104,6 @@
 .agreement-orders .order-orgs { color: #666; font-size: 0.95em; }
 .agreement-orders .num { font-variant-numeric: tabular-nums; }
 
-@media (max-width: 800px) {
-  .agreement-orders .tier-table { display: block; overflow-x: auto; }
-}
-
 /* ================================================================
    Package builder (order form)
    ================================================================ */
@@ -234,7 +296,7 @@
 .package-builder .pb-extra-family + .pb-extra-family { margin-top: 1.5em; }
 .package-builder .pb-extra-family > h3 { margin: 0 0 0.75em; font-size: 1.125em; font-family: SourceSansProBold, Arial, sans-serif; }
 .package-builder #pb-extras-empty { padding: 1.5em 0; color: var(--pb-muted); }
-.package-builder .pb-comparison-scroll { max-width: 100%; overflow-x: auto; }
+.package-builder .pb-comparison-scroll { position: relative; max-width: 100%; overflow-x: auto; }
 .package-builder .pb-comparison { width: 100%; min-width: 54em; table-layout: fixed; margin: 0.75em 0; border-collapse: collapse; font-size: 0.875em; line-height: 1.4; }
 .package-builder .pb-comparison-label { width: 38%; }
 .package-builder .pb-comparison :is(th, td) { padding: 0.65em; border-bottom: 1px solid var(--pb-line); text-align: left; vertical-align: top; }

apps/agreements/static/agreements/package-builder.js

@@ -31,6 +31,7 @@
       include: el.querySelector(".pb-include-input"),
       radios: $$(".pb-tier-input", el),
       services: $$(".pb-base-service", el),
+      servicesFollowTier: "servicesFollowTier" in el.dataset,
       extraGroup,
       extras: extraGroup ? $$(".pb-extra", extraGroup) : [],
     };
@@ -134,6 +135,8 @@
       const allowedTiers = row.dataset.serviceTiers.split(" ").filter(Boolean);
       const available = !allowedTiers.length || allowedTiers.includes(serviceTierKey);
       const box = serviceBox(row);
+      // Base services the customer hasn't edited track what the chosen tier offers.
+      if (tier && family.servicesFollowTier && !box.dataset.edited) box.checked = available;
       row.hidden = !available && !box.checked;
       box.disabled = !tier || (!available && !box.checked);
       const conflict = Boolean(tier) && !available && box.checked;
@@ -815,6 +818,8 @@
       } else if (target.classList.contains("pb-tier-input") && !family.include.checked) {
         family.include.checked = true;
         announce(`${family.name} added at the ${tierColumn(target).dataset.tierName} tier.`);
+      } else if (target.closest(".pb-base-service")) {
+        target.dataset.edited = "true";
       }
     } else if (target.name !== "discount") {
       return;

apps/agreements/templates/agreements/_nav.html

@@ -0,0 +1,25 @@
+{% load agreements %}
+{# One navigation for every agreements page; `nav` marks the current item. #}
+<nav class="section-navigation sidebar-widget" aria-label="Agreements">
+  <ul class="section-nav menu">
+    {% if token %}
+      <li><a href="{% url 'agreements:sign_link' token %}">Agreement to sign</a></li>
+    {% else %}
+      <li class="{% if nav == 'programs' %}current_item selected{% endif %}"><a href="{% url 'agreements:program_list' %}">Programs</a></li>
+      {% if user.is_authenticated %}
+        <li class="{% if nav == 'orders' %}current_item selected{% endif %}"><a href="{% url 'agreements:order_list' %}">Your orders</a></li>
+      {% endif %}
+    {% endif %}
+  </ul>
+</nav>
+{% if not token and user|can_prepare_agreements %}
+  <nav class="sidebar-widget staff-nav" aria-labelledby="staff-nav-title">
+    <h2 class="widget-title" id="staff-nav-title">PSF staff</h2>
+    <ul class="section-nav menu">
+      <li class="{% if nav == 'queue' %}current_item selected{% endif %}"><a href="{% url 'agreements:queue' %}">Agreements</a></li>
+      <li class="{% if nav == 'staff' %}current_item selected{% endif %}"><a href="{% url 'agreements:staff_orders' %}">All orders</a></li>
+      <li class="{% if nav == 'custom' %}current_item selected{% endif %}"><a href="{% url 'agreements:custom_create' %}">New contract</a></li>
+      <li class="{% if nav == 'terms' %}current_item selected{% endif %}"><a href="{% url 'agreements:terms_list' %}">Terms</a></li>
+    </ul>
+  </nav>
+{% endif %}

apps/agreements/templates/agreements/base.html

@@ -4,7 +4,7 @@
 {% block page_title %}{% block title %}Agreements{% endblock %} | Python Software Foundation{% endblock %}
 {% block og_title %}PSF Agreements{% endblock %}
 
-{% block body_attributes %}class="psf agreements"{% endblock %}
+{% block body_attributes %}class="psf agreements default-page"{% endblock %}
 
 {% block section-logo %}<a href="/psf-landing/"><img class="psf-logo" src="{{ STATIC_URL }}img/psf-logo.png" alt="Python Software Foundation"></a>{% endblock %}
 
@@ -27,17 +27,7 @@
 
 {% block left_sidebar %}
 <aside class="left-sidebar">
+  {% include "agreements/_nav.html" %}
   {% block sidebar %}{% endblock %}
-  {% if user|can_prepare_agreements %}
-    <div class="section-navigation sidebar-widget">
-      <ul class="section-nav menu" role="menu">
-        <li class="{% if nav == 'queue' %}current_item selected{% endif %}" role="menuitem"><a href="{% url 'agreements:queue' %}">Agreements</a></li>
-        <li class="{% if nav == 'custom' %}current_item selected{% endif %}" role="menuitem"><a href="{% url 'agreements:custom_create' %}">New contract</a></li>
-        <li class="{% if nav == 'terms' %}current_item selected{% endif %}" role="menuitem"><a href="{% url 'agreements:terms_list' %}">Terms</a></li>
-        <li role="menuitem"><a href="{% url 'agreements:program_list' %}">Programs</a></li>
-        <li role="menuitem"><a href="{% url 'agreements:staff_orders' %}">Orders</a></li>
-      </ul>
-    </div>
-  {% endif %}
 </aside>
 {% endblock left_sidebar %}

apps/agreements/templates/agreements/detail.html

@@ -3,8 +3,17 @@
 {% block title %}{{ agreement.title }}: {{ agreement.counterparty_name }}{% endblock %}
 
 {% block crumbs %}
-{% if can_prepare %}<li><a href="{% url 'agreements:queue' %}">Agreements</a><span class="prompt">&gt;&gt;&gt;</span></li>{% endif %}
-<li>{{ agreement.counterparty_name }}</li>
+{% if can_prepare %}
+  <li><a href="{% url 'agreements:queue' %}">Agreements</a><span class="prompt">&gt;&gt;&gt;</span></li>
+  <li>{{ agreement.counterparty_name }}</li>
+{% elif agreement.order %}
+  <li><a href="{% url 'agreements:program_list' %}">Programs</a><span class="prompt">&gt;&gt;&gt;</span></li>
+  <li><a href="{% url 'agreements:order_list' %}">Your orders</a><span class="prompt">&gt;&gt;&gt;</span></li>
+  <li><a href="{{ agreement.order.get_absolute_url }}">{{ agreement.order.legal_name }}</a><span class="prompt">&gt;&gt;&gt;</span></li>
+  <li>Agreement</li>
+{% else %}
+  <li>{{ agreement.counterparty_name }}</li>
+{% endif %}
 {% endblock %}
 
 {% block content %}