Merge next into main: every setting upaas reads in the README, UPAAS_PORT in the Compose file (#232)

Reviewed-on: #232

TODO.md

@@ -20,17 +20,6 @@ regress.
 
 # Completed Steps
 
-- 2026-09-29: The app page is 50% wider on large screens (84rem instead of
-  56rem), its build log and container log boxes are twice as tall, the build log
-  sits between the webhook URL and the environment variables, and the container
-  log sits above the deploy key (#246).
-
-- 2026-09-29: The app page shows the app's branch as a label in its title, next
-  to the status badge, instead of after the repository under it (#240).
-
-- 2026-09-29: An app's deployments page now lists only its 10 most recent
-  deployments, newest first, instead of 50 (#238).
-
 - 2026-09-29: `docker-compose.yml` now sets `UPAAS_PORT` to 8080 as well as
   `PORT`, since upaas reads `UPAAS_PORT` first and a `UPAAS_PORT` in `.env` made
   it listen away from the port mapping and healthcheck; the README's Compose

internal/handlers/app.go

@@ -28,7 +28,7 @@ const (
 	// recentDeploymentsLimit is the number of recent deployments to show.
 	recentDeploymentsLimit = 5
 	// deploymentsHistoryLimit is the number of deployments to show in history.
-	deploymentsHistoryLimit = 10
+	deploymentsHistoryLimit = 50
 )
 
 // redirectToApp issues a SeeOther redirect to the page for the given

internal/handlers/app_branch_test.go

@@ -1,46 +0,0 @@
-package handlers_test
-
-import (
-	"net/http"
-	"net/http/httptest"
-	"strings"
-	"testing"
-
-	"github.com/stretchr/testify/assert"
-	"github.com/stretchr/testify/require"
-
-	"sneak.berlin/go/upaas/internal/service/app"
-)
-
-// TestAppPageTitleShowsBranch checks that an app's branch can be read from
-// the app page title, next to the status badge, without opening the edit page.
-func TestAppPageTitleShowsBranch(t *testing.T) {
-	t.Parallel()
-
-	testCtx := setupTestHandlers(t)
-
-	createdApp, err := testCtx.appSvc.CreateApp(t.Context(), app.CreateAppInput{
-		Name:    "branch-shown-app",
-		RepoURL: "git@example.com:user/branch-shown-app.git",
-		Branch:  "staging",
-	})
-	require.NoError(t, err)
-
-	request := httptest.NewRequestWithContext(
-		t.Context(), http.MethodGet, "/apps/"+createdApp.ID, nil,
-	)
-	request = addChiURLParams(request, map[string]string{"id": createdApp.ID})
-	recorder := httptest.NewRecorder()
-
-	testCtx.handlers.HandleAppDetail().ServeHTTP(recorder, request)
-
-	require.Equal(t, http.StatusOK, recorder.Code)
-
-	// The title row runs from the app name heading to the end of its div.
-	_, afterHeading, found := strings.Cut(recorder.Body.String(), "<h1")
-	require.True(t, found, "app page has no heading")
-
-	titleRow, _, _ := strings.Cut(afterHeading, "</div>")
-	assert.Contains(t, titleRow, `x-text="statusLabel"`)
-	assert.Contains(t, titleRow, ">staging</span>")
-}

internal/handlers/app_page_layout_test.go

@@ -1,76 +0,0 @@
-package handlers_test
-
-import (
-	"net/http"
-	"net/http/httptest"
-	"strings"
-	"testing"
-
-	"github.com/stretchr/testify/assert"
-	"github.com/stretchr/testify/require"
-
-	"sneak.berlin/go/upaas/internal/service/app"
-)
-
-// TestAppPageLayout checks the app page's width, the order of its sections,
-// and the height of its two log boxes.
-func TestAppPageLayout(t *testing.T) {
-	t.Parallel()
-
-	testCtx := setupTestHandlers(t)
-
-	createdApp, err := testCtx.appSvc.CreateApp(t.Context(), app.CreateAppInput{
-		Name:    "layout-app",
-		RepoURL: "git@example.com:user/layout-app.git",
-	})
-	require.NoError(t, err)
-
-	request := httptest.NewRequestWithContext(
-		t.Context(), http.MethodGet, "/apps/"+createdApp.ID, nil,
-	)
-	request = addChiURLParams(request, map[string]string{"id": createdApp.ID})
-	recorder := httptest.NewRecorder()
-
-	testCtx.handlers.HandleAppDetail().ServeHTTP(recorder, request)
-
-	require.Equal(t, http.StatusOK, recorder.Code)
-
-	body := recorder.Body.String()
-
-	_, afterMain, found := strings.Cut(body, "<main")
-	require.True(t, found, "app page has no main element")
-
-	mainTag, _, _ := strings.Cut(afterMain, ">")
-	assert.Contains(t, mainTag, "max-width: 84rem;")
-
-	sectionTitles := []string{
-		"Container Logs",
-		"Deploy Key",
-		"Webhook URL",
-		"Last Deployment Build Logs",
-		"Environment Variables",
-		"Docker Labels",
-		"Volume Mounts",
-		"Port Mappings",
-		"Recent Deployments",
-		"Danger Zone",
-	}
-
-	previousIndex := -1
-
-	for _, title := range sectionTitles {
-		index := strings.Index(body, ">"+title+"</h2>")
-		require.NotEqual(t, -1, index, "app page has no %q section", title)
-		assert.Greater(t, index, previousIndex, "%q section is out of order", title)
-
-		previousIndex = index
-	}
-
-	for _, logBox := range []string{"containerLogsWrapper", "buildLogsWrapper"} {
-		_, afterRef, found := strings.Cut(body, `x-ref="`+logBox+`"`)
-		require.True(t, found, "app page has no %s", logBox)
-
-		logBoxTag, _, _ := strings.Cut(afterRef, ">")
-		assert.Contains(t, logBoxTag, "max-height: 800px;", logBox)
-	}
-}

internal/handlers/handlers_test.go

@@ -8,7 +8,6 @@ import (
 	"strconv"
 	"strings"
 	"testing"
-	"time"
 
 	"github.com/go-chi/chi/v5"
 	"github.com/stretchr/testify/assert"
@@ -1149,73 +1148,6 @@ func TestHandleCancelDeployReturns404ForUnknownApp(t *testing.T) {
 	assert.Equal(t, http.StatusNotFound, recorder.Code)
 }
 
-// TestHandleAppDeploymentsShowsTenNewest verifies the deployments page
-// lists only the 10 most recent deployments, newest first.
-func TestHandleAppDeploymentsShowsTenNewest(t *testing.T) {
-	t.Parallel()
-
-	testCtx := setupTestHandlers(t)
-	createdApp := createTestApp(t, testCtx, "deployments-page-app")
-
-	// Create 12 deployments, each started one minute after the one before.
-	firstStart := time.Date(2026, 1, 1, 0, 0, 0, 0, time.UTC)
-
-	ids := make([]int64, 0, 12)
-
-	for idx := range 12 {
-		deployment := models.NewDeployment(testCtx.database)
-		deployment.AppID = createdApp.ID
-		deployment.Status = models.DeploymentStatusSuccess
-		require.NoError(t, deployment.Save(context.Background()))
-
-		_, err := testCtx.database.Exec(
-			context.Background(),
-			"UPDATE deployments SET started_at = ? WHERE id = ?",
-			firstStart.Add(time.Duration(idx)*time.Minute),
-			deployment.ID,
-		)
-		require.NoError(t, err)
-
-		ids = append(ids, deployment.ID)
-	}
-
-	request := httptest.NewRequestWithContext(
-		t.Context(),
-		http.MethodGet,
-		"/apps/"+createdApp.ID+"/deployments",
-		nil,
-	)
-	request = addChiURLParams(request, map[string]string{"id": createdApp.ID})
-	recorder := httptest.NewRecorder()
-
-	handler := testCtx.handlers.HandleAppDeployments()
-	handler.ServeHTTP(recorder, request)
-
-	require.Equal(t, http.StatusOK, recorder.Code)
-
-	body := recorder.Body.String()
-	card := func(id int64) string {
-		return `data-deployment-id="` + strconv.FormatInt(id, 10) + `"`
-	}
-
-	assert.Equal(t, 10, strings.Count(body, `data-deployment-id="`))
-
-	// The two oldest are left out.
-	assert.NotContains(t, body, card(ids[0]))
-	assert.NotContains(t, body, card(ids[1]))
-
-	// The ten newest are shown, newest first.
-	previous := -1
-
-	for idx := len(ids) - 1; idx >= 2; idx-- {
-		position := strings.Index(body, card(ids[idx]))
-		require.Greater(t, position, previous,
-			"deployment %d missing or out of order", ids[idx])
-
-		previous = position
-	}
-}
-
 func TestHandleWebhookReturns404ForUnknownSecret(t *testing.T) {
 	t.Parallel()
 

templates/app_detail.html

@@ -5,7 +5,7 @@
 {{define "content"}}
 {{template "nav" .}}
 
-<main class="mx-auto px-4 py-8" style="max-width: 84rem;" x-data="appDetail({
+<main class="max-w-4xl mx-auto px-4 py-8" x-data="appDetail({
     appId: '{{.App.ID}}',
     initialDeploymentId: {{if .LatestDeployment}}{{.LatestDeployment.ID}}{{else}}null{{end}},
     initialStatus: '{{.App.Status}}',
@@ -26,12 +26,11 @@
     <!-- Header -->
     <div class="flex flex-col sm:flex-row sm:items-center sm:justify-between gap-4 mb-8">
         <div>
-            <div class="flex flex-wrap items-center gap-3">
+            <div class="flex items-center gap-3">
                 <h1 class="text-2xl font-medium text-gray-900">{{.App.Name}}</h1>
                 <span x-bind:class="statusBadgeClass" x-text="statusLabel"></span>
-                <span class="badge-neutral font-mono break-all" title="Branch">{{.App.Branch}}</span>
             </div>
-            <p class="text-gray-500 font-mono text-sm mt-1">{{.App.RepoURL}}</p>
+            <p class="text-gray-500 font-mono text-sm mt-1">{{.App.RepoURL}}@{{.App.Branch}}</p>
         </div>
         <div class="flex gap-3">
             <a href="/apps/{{.App.ID}}/edit" class="btn-secondary">Edit</a>
@@ -54,26 +53,6 @@
         </div>
     </div>
 
-    <!-- Container Logs -->
-    <div class="card p-6 mb-6">
-        <div class="flex items-center justify-between mb-4">
-            <h2 class="section-title">Container Logs</h2>
-            <span x-bind:class="containerStatusBadgeClass" x-text="containerStatusLabel"></span>
-        </div>
-        <div class="relative">
-            <div x-ref="containerLogsWrapper" class="bg-gray-900 rounded-lg p-4 overflow-y-auto" style="max-height: 800px;">
-                <pre class="text-gray-100 text-xs font-mono whitespace-pre-wrap break-words m-0" x-text="containerLogs"></pre>
-            </div>
-            <button
-                x-show="!_containerAutoScroll"
-                x-transition
-                @click="_containerAutoScroll = true; Alpine.store('utils').scrollToBottom($refs.containerLogsWrapper)"
-                class="absolute bottom-2 right-4 bg-primary-600 hover:bg-primary-700 text-white text-xs px-3 py-1 rounded-full shadow-lg opacity-90 hover:opacity-100 transition"
-                title="Scroll to bottom"
-            >↓ Follow</button>
-        </div>
-    </div>
-
     <!-- Deploy Key -->
     <div class="card p-6 mb-6">
         <h2 class="section-title mb-4">Deploy Key</h2>
@@ -121,26 +100,6 @@
         </div>
     </div>
 
-    <!-- Last Deployment Build Logs -->
-    <div class="card p-6 mb-6" x-show="showBuildLogs" x-cloak>
-        <div class="flex items-center justify-between mb-4">
-            <h2 class="section-title">Last Deployment Build Logs</h2>
-            <span x-bind:class="buildStatusBadgeClass" x-text="buildStatusLabel"></span>
-        </div>
-        <div class="relative">
-            <div x-ref="buildLogsWrapper" class="bg-gray-900 rounded-lg p-4 overflow-y-auto" style="max-height: 800px;">
-                <pre class="text-gray-100 text-xs font-mono whitespace-pre-wrap break-words m-0" x-text="buildLogs"></pre>
-            </div>
-            <button
-                x-show="!_buildAutoScroll"
-                x-transition
-                @click="_buildAutoScroll = true; Alpine.store('utils').scrollToBottom($refs.buildLogsWrapper)"
-                class="absolute bottom-2 right-4 bg-primary-600 hover:bg-primary-700 text-white text-xs px-3 py-1 rounded-full shadow-lg opacity-90 hover:opacity-100 transition"
-                title="Scroll to bottom"
-            >↓ Follow</button>
-        </div>
-    </div>
-
     <!-- Environment Variables -->
     <div class="card p-6 mb-6" x-data="envVarEditor('{{.App.ID}}')">
         <h2 class="section-title mb-4">Environment Variables</h2>
@@ -394,6 +353,26 @@
         </form>
     </div>
 
+    <!-- Container Logs -->
+    <div class="card p-6 mb-6">
+        <div class="flex items-center justify-between mb-4">
+            <h2 class="section-title">Container Logs</h2>
+            <span x-bind:class="containerStatusBadgeClass" x-text="containerStatusLabel"></span>
+        </div>
+        <div class="relative">
+            <div x-ref="containerLogsWrapper" class="bg-gray-900 rounded-lg p-4 overflow-y-auto" style="max-height: 400px;">
+                <pre class="text-gray-100 text-xs font-mono whitespace-pre-wrap break-words m-0" x-text="containerLogs"></pre>
+            </div>
+            <button
+                x-show="!_containerAutoScroll"
+                x-transition
+                @click="_containerAutoScroll = true; Alpine.store('utils').scrollToBottom($refs.containerLogsWrapper)"
+                class="absolute bottom-2 right-4 bg-primary-600 hover:bg-primary-700 text-white text-xs px-3 py-1 rounded-full shadow-lg opacity-90 hover:opacity-100 transition"
+                title="Scroll to bottom"
+            >↓ Follow</button>
+        </div>
+    </div>
+
     <!-- Recent Deployments -->
     <div class="card p-6 mb-6">
         <div class="flex items-center justify-between mb-4">
@@ -433,6 +412,26 @@
         </template>
     </div>
 
+    <!-- Last Deployment Build Logs -->
+    <div class="card p-6 mb-6" x-show="showBuildLogs" x-cloak>
+        <div class="flex items-center justify-between mb-4">
+            <h2 class="section-title">Last Deployment Build Logs</h2>
+            <span x-bind:class="buildStatusBadgeClass" x-text="buildStatusLabel"></span>
+        </div>
+        <div class="relative">
+            <div x-ref="buildLogsWrapper" class="bg-gray-900 rounded-lg p-4 overflow-y-auto" style="max-height: 400px;">
+                <pre class="text-gray-100 text-xs font-mono whitespace-pre-wrap break-words m-0" x-text="buildLogs"></pre>
+            </div>
+            <button
+                x-show="!_buildAutoScroll"
+                x-transition
+                @click="_buildAutoScroll = true; Alpine.store('utils').scrollToBottom($refs.buildLogsWrapper)"
+                class="absolute bottom-2 right-4 bg-primary-600 hover:bg-primary-700 text-white text-xs px-3 py-1 rounded-full shadow-lg opacity-90 hover:opacity-100 transition"
+                title="Scroll to bottom"
+            >↓ Follow</button>
+        </div>
+    </div>
+
     <!-- Danger Zone -->
     <div class="card border-2 border-error-500/20 bg-error-50/50 p-6">
         <h2 class="text-lg font-medium text-error-700 mb-4">Danger Zone</h2>