Files
punktfunk/clients/apple/PunktfunkWidgets/SessionLiveActivity.swift
T
enricobuehler a65c47874d feat(apple/widgets): Dynamic Island rebuild + brand purple everywhere (re-landed post-rebase)
Re-lands the island rebuild: a concurrent session's pull-rebase reordered the
pick against the canvas-previews commit and the pre-rebuild file content won;
the working tree kept the intended final state (BrandColor.swift itself
survived tracked). Content identical to the original commit message:

The widgets rendered system BLUE because Color.brand lived in PunktfunkKit,
which the extension never links — moved to PunktfunkShared (Kit re-exports
Shared). Island rebuilt: expanded = identity leading + elapsed clock trailing
+ one purposeful bottom row (status dot/stage + live latency/bitrate stats
line, End at the trailing edge); compact trailing = the one glanceable number
(live latency green / disconnect countdown orange / state glyph); keylineTint
brand. Lock Screen banner shares the same StatusLine/StatsLine pieces.

swift build + PunktfunkWidgetsExtension build green on the rebased base.

Co-Authored-By: Claude Fable 5 <noreply@anthropic.com>
2026-07-19 16:36:36 +02:00

333 lines
12 KiB
Swift
Raw Blame History

This file contains ambiguous Unicode characters
This file contains Unicode characters that might be confused with other characters. If you think that this is intentional, you can safely ignore this warning. Use the Escape button to reveal them.
// The Live Activity UI (Lock Screen banner + Dynamic Island) for a running session. The app owns
// the Activity's lifecycle (SessionActivityController); this is only its presentation, rendered in
// the widget-extension process from the shared `PunktfunkSessionAttributes`.
//
// The End button runs `EndStreamIntent` (a LiveActivityIntent) IN THE APP's process, which posts
// .punktfunkEndActiveSession → the app disconnects. Elapsed time ticks client-side via
// Text(timerInterval:) — no per-second push.
import ActivityKit
import AppIntents
import SwiftUI
import WidgetKit
import PunktfunkShared
struct PunktfunkSessionLiveActivity: Widget {
var body: some WidgetConfiguration {
ActivityConfiguration(for: PunktfunkSessionAttributes.self) { context in
LockScreenView(context: context)
.activitySystemActionForegroundColor(.white)
} dynamicIsland: { context in
// Island layout (2026-07 rebuild): the EXPANDED island leads with identity (brand
// glyph + host), keeps the elapsed clock at the trailing edge, and gives the bottom
// region one purposeful row — session status + the live numbers on the left, the
// End action on the right. COMPACT shows the one number worth a glance: live
// latency while streaming (the sparse ~30 s pushes), the disconnect countdown while
// backgrounded, a state glyph otherwise. Brand purple is the identity accent
// everywhere `.tint` used to leak system blue.
DynamicIsland {
DynamicIslandExpandedRegion(.leading) {
HStack(spacing: 6) {
Image(systemName: "play.tv.fill")
.font(.subheadline)
.foregroundStyle(Color.brand)
Text(context.attributes.hostName)
.font(.subheadline.weight(.semibold))
.lineLimit(1)
}
.padding(.leading, 4)
.padding(.top, 2)
}
DynamicIslandExpandedRegion(.trailing) {
ElapsedClock(startedAt: context.state.startedAt)
.font(.subheadline)
.foregroundStyle(.secondary)
.frame(maxWidth: 64, alignment: .trailing)
.padding(.trailing, 4)
.padding(.top, 2)
}
DynamicIslandExpandedRegion(.center) {
if let title = context.attributes.launchTitle {
Text(title)
.font(.caption)
.foregroundStyle(.secondary)
.lineLimit(1)
}
}
DynamicIslandExpandedRegion(.bottom) {
HStack(alignment: .center, spacing: 12) {
VStack(alignment: .leading, spacing: 4) {
StatusLine(state: context.state)
StatsLine(state: context.state)
}
Spacer(minLength: 8)
EndButton()
}
.padding(.horizontal, 4)
.padding(.top, 8)
}
} compactLeading: {
Image(systemName: "play.tv.fill")
.foregroundStyle(Color.brand)
} compactTrailing: {
CompactReadout(state: context.state)
} minimal: {
Image(systemName: "play.tv.fill")
.foregroundStyle(Color.brand)
}
.keylineTint(Color.brand)
}
}
}
// MARK: - Lock Screen banner
private struct LockScreenView: View {
let context: ActivityViewContext<PunktfunkSessionAttributes>
var body: some View {
HStack(alignment: .top, spacing: 12) {
Image(systemName: "play.tv.fill")
.font(.title2)
.foregroundStyle(Color.brand)
VStack(alignment: .leading, spacing: 4) {
HStack {
Text(context.attributes.hostName).font(.headline).lineLimit(1)
Spacer()
ElapsedClock(startedAt: context.state.startedAt)
.font(.subheadline)
.foregroundStyle(.secondary)
}
if let title = context.attributes.launchTitle {
Text(title).font(.caption).foregroundStyle(.secondary).lineLimit(1)
}
StatusLine(state: context.state)
StatsLine(state: context.state)
}
if context.state.stage == .background {
EndButton()
}
}
.padding()
}
}
// MARK: - Shared pieces
/// The ticking elapsed-session clock — client-side via `timerInterval`, no per-second push.
private struct ElapsedClock: View {
let startedAt: Date
var body: some View {
Text(timerInterval: startedAt...Date.distantFuture, countsDown: false)
.monospacedDigit()
.multilineTextAlignment(.trailing)
}
}
/// The session's state as a colored dot + label; while backgrounded with a deadline, the label
/// IS the countdown. One shared truth for the island bottom and the Lock Screen banner.
private struct StatusLine: View {
let state: PunktfunkSessionAttributes.ContentState
var body: some View {
HStack(spacing: 5) {
Circle()
.fill(color)
.frame(width: 6, height: 6)
label
.font(.caption2.weight(.medium))
.foregroundStyle(.secondary)
.lineLimit(1)
}
}
private var color: Color {
switch state.stage {
case .streaming: return .green
case .background: return .orange
case .reconnecting: return .yellow
case .ending: return .secondary
}
}
@ViewBuilder private var label: some View {
switch state.stage {
case .streaming:
Text("Streaming")
case .background:
if let deadline = state.backgroundDeadline {
HStack(spacing: 3) {
Text("Background · ends in")
Text(timerInterval: Date()...deadline, countsDown: true)
.monospacedDigit()
}
} else {
Text("Running in background")
}
case .reconnecting:
Text("Reconnecting…")
case .ending:
Text("Session ended")
}
}
}
/// The live numbers, one quiet line: latency and bitrate (the sparse ~30 s pushes) ahead of the
/// mode. Anything unreported simply doesn't appear.
private struct StatsLine: View {
let state: PunktfunkSessionAttributes.ContentState
var body: some View {
HStack(spacing: 8) {
if let ms = state.latencyMs {
stat("bolt.fill", "\(ms) ms")
}
if let mbps = state.mbps {
stat("arrow.down", String(format: "%.0f Mb/s", mbps))
}
Text(state.modeLine)
.font(.caption2)
.foregroundStyle(.tertiary)
.lineLimit(1)
}
}
private func stat(_ icon: String, _ text: String) -> some View {
HStack(spacing: 3) {
Image(systemName: icon)
.font(.system(size: 8, weight: .semibold))
Text(text)
.font(.caption2)
.monospacedDigit()
}
.foregroundStyle(.secondary)
}
}
/// The compact trailing readout — the island's one glanceable number. Streaming: the live
/// latency once the app has reported one, the elapsed clock until then. Backgrounded: the
/// auto-disconnect countdown. Off-nominal stages show a state glyph instead of a number.
private struct CompactReadout: View {
let state: PunktfunkSessionAttributes.ContentState
var body: some View {
switch state.stage {
case .streaming:
if let ms = state.latencyMs {
Text("\(ms) ms")
.font(.caption2.weight(.medium))
.monospacedDigit()
.foregroundStyle(.green)
} else {
ElapsedClock(startedAt: state.startedAt)
.font(.caption2)
.frame(maxWidth: 48)
}
case .background:
if let deadline = state.backgroundDeadline {
Text(timerInterval: Date()...deadline, countsDown: true)
.font(.caption2)
.monospacedDigit()
.multilineTextAlignment(.trailing)
.frame(maxWidth: 48)
.foregroundStyle(.orange)
} else {
Image(systemName: "moon.fill").foregroundStyle(.orange)
}
case .reconnecting:
Image(systemName: "wifi.exclamationmark").foregroundStyle(.yellow)
case .ending:
Image(systemName: "stop.fill").foregroundStyle(.secondary)
}
}
}
/// End-stream button — runs EndStreamIntent in the app process (LiveActivityIntent).
private struct EndButton: View {
var body: some View {
Button(intent: EndStreamIntent()) {
Label("End", systemImage: "stop.fill")
.font(.caption).bold()
}
.tint(.red)
.buttonStyle(.bordered)
}
}
// MARK: - Previews (Xcode canvas)
//
// Select the PunktfunkWidgetsExtension scheme and open the canvas (⌥⌘↩) — the activity
// `#Preview(as:using:)` form renders every surface WITHOUT running the app or starting a real
// Activity: `.content` is the Lock Screen banner, `.dynamicIsland(.expanded/.compact/.minimal)`
// the island states (canvas device must be a Dynamic Island phone for those). Each listed
// content state becomes a frame in the canvas timeline strip, so all four session stages are one
// click apart. Sample state lives here (fileprivate), never in PunktfunkShared.
extension PunktfunkSessionAttributes {
fileprivate static var preview: PunktfunkSessionAttributes {
PunktfunkSessionAttributes(hostID: UUID(), hostName: "Studio", launchTitle: "Hades II")
}
}
extension PunktfunkSessionAttributes.ContentState {
fileprivate static var streaming: Self {
.init(
stage: .streaming, startedAt: .now.addingTimeInterval(-754),
modeLine: "2752×2064 @120 · HEVC · HDR", latencyMs: 8, mbps: 84.2)
}
fileprivate static var backgrounded: Self {
.init(
stage: .background, startedAt: .now.addingTimeInterval(-1975),
modeLine: "2752×2064 @120 · HEVC · HDR",
backgroundDeadline: .now.addingTimeInterval(9 * 60))
}
fileprivate static var reconnecting: Self {
.init(
stage: .reconnecting, startedAt: .now.addingTimeInterval(-754),
modeLine: "2752×2064 @120 · HEVC · HDR")
}
fileprivate static var ended: Self {
.init(
stage: .ending, startedAt: .now.addingTimeInterval(-3541),
modeLine: "2752×2064 @120 · HEVC · HDR")
}
}
#Preview("Lock Screen", as: .content, using: PunktfunkSessionAttributes.preview) {
PunktfunkSessionLiveActivity()
} contentStates: {
PunktfunkSessionAttributes.ContentState.streaming
PunktfunkSessionAttributes.ContentState.backgrounded
PunktfunkSessionAttributes.ContentState.reconnecting
PunktfunkSessionAttributes.ContentState.ended
}
#Preview(
"Island expanded", as: .dynamicIsland(.expanded),
using: PunktfunkSessionAttributes.preview
) {
PunktfunkSessionLiveActivity()
} contentStates: {
PunktfunkSessionAttributes.ContentState.streaming
PunktfunkSessionAttributes.ContentState.backgrounded
}
#Preview(
"Island compact", as: .dynamicIsland(.compact),
using: PunktfunkSessionAttributes.preview
) {
PunktfunkSessionLiveActivity()
} contentStates: {
PunktfunkSessionAttributes.ContentState.streaming
}
#Preview(
"Island minimal", as: .dynamicIsland(.minimal),
using: PunktfunkSessionAttributes.preview
) {
PunktfunkSessionLiveActivity()
} contentStates: {
PunktfunkSessionAttributes.ContentState.streaming
}