Overhaul native approval UX and add widget surfaces

Bring the SwiftUI app in line with the Apple-native mock and keep pending approvals actionable from Live Activities and watch complications.
2026-04-19 16:29:13 +02:00
parent a6939453f8
commit 61a0cc1f7d
63 changed files with 3496 additions and 1769 deletions
@@ -0,0 +1,100 @@
+import SwiftUI
+
+struct ApprovalCardModifier: ViewModifier {
+    var highlighted = false
+
+    func body(content: Content) -> some View {
+        content
+            .padding(18)
+            .background(
+                RoundedRectangle(cornerRadius: IdP.cardRadius, style: .continuous)
+                    .fill(Color.idpSecondaryGroupedBackground)
+            )
+            .overlay(
+                RoundedRectangle(cornerRadius: IdP.cardRadius, style: .continuous)
+                    .stroke(highlighted ? IdP.tint.opacity(0.7) : Color.idpSeparator.opacity(0.55), lineWidth: highlighted ? 1.5 : 1)
+            )
+            .overlay {
+                if highlighted {
+                    RoundedRectangle(cornerRadius: IdP.cardRadius, style: .continuous)
+                        .stroke(IdP.tint.opacity(0.12), lineWidth: 6)
+                        .padding(-2)
+                }
+            }
+    }
+}
+
+extension View {
+    func approvalCard(highlighted: Bool = false) -> some View {
+        modifier(ApprovalCardModifier(highlighted: highlighted))
+    }
+
+    func deviceRowStyle() -> some View {
+        modifier(DeviceRowStyle())
+    }
+}
+
+struct RequestHeroCard: View {
+    let request: ApprovalRequest
+    let handle: String
+
+    var body: some View {
+        HStack(alignment: .top, spacing: 16) {
+            MonogramAvatar(title: request.source, size: 64)
+
+            VStack(alignment: .leading, spacing: 8) {
+                Text("\(request.source) wants to sign in as you")
+                    .font(.title3.weight(.semibold))
+                    .fixedSize(horizontal: false, vertical: true)
+
+                Text("Continue as \(Text(handle).foregroundStyle(IdP.tint))")
+                    .font(.subheadline)
+                    .foregroundStyle(.secondary)
+
+                HStack(spacing: 8) {
+                    Label(request.kind.title, systemImage: request.kind.systemImage)
+                    Text(request.createdAt, style: .relative)
+                }
+                .font(.caption.weight(.medium))
+                .foregroundStyle(.secondary)
+            }
+        }
+        .approvalCard(highlighted: true)
+    }
+}
+
+struct MonogramAvatar: View {
+    let title: String
+    var size: CGFloat = 40
+    var tint: Color = IdP.tint
+
+    private var monogram: String {
+        String(title.trimmingCharacters(in: .whitespacesAndNewlines).first ?? "I").uppercased()
+    }
+
+    var body: some View {
+        ZStack {
+            RoundedRectangle(cornerRadius: size * 0.34, style: .continuous)
+                .fill(tint.opacity(0.14))
+
+            Image("AppMonogram")
+                .resizable()
+                .scaledToFit()
+                .frame(width: size * 0.44, height: size * 0.44)
+                .opacity(0.18)
+
+            Text(monogram)
+                .font(.system(size: size * 0.42, weight: .semibold, design: .rounded))
+                .foregroundStyle(tint)
+        }
+        .frame(width: size, height: size)
+        .accessibilityHidden(true)
+    }
+}
+
+struct DeviceRowStyle: ViewModifier {
+    func body(content: Content) -> some View {
+        content
+            .padding(.vertical, 4)
+    }
+}