Merge pull request #13 from ayangweb/feat/issue-8-scale-toast-notifications

feat(popup): scale toast notifications with popupScale preference

Author: ganeshmshetty

Sources/OpenClip/UI/Popup/ToastView.swift

@@ -11,8 +11,16 @@ struct ToastView: View {
 
     @AppStorage(SettingKey.popupTheme.name) private var selectedTheme: String = SettingKey.popupTheme.defaultValue
     @AppStorage(SettingKey.popupThemeColor.name) private var themeColor: String = SettingKey.popupThemeColor.defaultValue
+    @AppStorage(SettingKey.popupScale.name) private var popupScale: Int = SettingKey.popupScale.defaultValue
     @Environment(\.colorScheme) private var colorScheme
 
+    /// Visual multiplier derived from the user's Popup Scale level (1...5) so the toast keeps pace
+    /// with the popup bar it attaches to — same scale factor `PopupView` applies to the bar.
+    private var scale: CGFloat { PopupMetrics.scaleMultiplier(for: popupScale) }
+
+    /// Corner radius for the toast bubble, scaled with the popup scale.
+    private var cornerRadius: CGFloat { PopupMetrics.toastCornerRadius * scale }
+
     private var isGlass: Bool {
         PopupThemeModel.category(fromStored: selectedTheme) == .glass
     }
@@ -48,43 +56,47 @@ struct ToastView: View {
     }
 
     var body: some View {
-        let content = HStack(spacing: 6) {
+        let content = HStack(spacing: 6 * scale) {
             if feedback.isLoading {
+                // macOS `.small` spinner is 16pt; scale its frame AND rendering so both the panel
+                // sizing (hostingView.fittingSize) and the visible spinner track the popup scale.
                 ProgressView()
                     .controlSize(.small)
+                    .scaleEffect(scale)
+                    .frame(width: 16 * scale, height: 16 * scale)
             } else if let symbol = feedback.symbolName {
                 Image(systemName: symbol)
-                    .font(.system(size: 10, weight: .medium))
+                    .font(.system(size: 10 * scale, weight: .medium))
                     .foregroundColor(feedback.style == .error ? Color.red : (feedback.style == .success ? Color.accentColor : textColor))
             }
             Text(feedback.message)
-                .font(.system(size: 11, weight: .regular))
+                .font(.system(size: 11 * scale, weight: .regular))
                 .lineLimit(1)
                 .truncationMode(.tail)
         }
         .foregroundColor(textColor)
-        .padding(.horizontal, 11)
-        .padding(.vertical, 5)
+        .padding(.horizontal, 11 * scale)
+        .padding(.vertical, 5 * scale)
 
         Group {
             if isGlass {
                 content
                     .background(
-                        RoundedRectangle(cornerRadius: PopupMetrics.toastCornerRadius, style: .continuous)
+                        RoundedRectangle(cornerRadius: cornerRadius, style: .continuous)
                             .fill(.ultraThinMaterial)
                     )
-                    .clipShape(RoundedRectangle(cornerRadius: PopupMetrics.toastCornerRadius, style: .continuous))
+                    .clipShape(RoundedRectangle(cornerRadius: cornerRadius, style: .continuous))
                     .overlay(
-                        RoundedRectangle(cornerRadius: PopupMetrics.toastCornerRadius, style: .continuous)
+                        RoundedRectangle(cornerRadius: cornerRadius, style: .continuous)
                             .stroke(glassBorderColor, lineWidth: 1.0)
                     )
                     .shadow(color: Color.black.opacity(0.15), radius: 4, x: 0, y: 1)
             } else {
                 content
                     .background(opaqueBackground)
-                    .clipShape(RoundedRectangle(cornerRadius: PopupMetrics.toastCornerRadius, style: .continuous))
+                    .clipShape(RoundedRectangle(cornerRadius: cornerRadius, style: .continuous))
                     .overlay(
-                        RoundedRectangle(cornerRadius: PopupMetrics.toastCornerRadius, style: .continuous)
+                        RoundedRectangle(cornerRadius: cornerRadius, style: .continuous)
                             .stroke(opaqueBorder, lineWidth: 1.0)
                     )
                     .shadow(color: Color.black.opacity(effectiveTheme == "light" ? 0.10 : 0.20), radius: 4, x: 0, y: 1)

Tests/OpenClipTests/ToastPanelControllerTests.swift

@@ -120,6 +120,39 @@ final class ToastPanelControllerTests: XCTestCase {
         XCTAssertFalse(controller.isShowing, "info toast should auto-dismiss")
     }
 
+    /// Regression: the toast must scale with the user's Popup Scale preference, matching the popup
+    /// bar it attaches to. `ToastView` reads `SettingKey.popupScale` via @AppStorage; a larger scale
+    /// must produce a larger bubble (and vice-versa). The default level 3 must stay byte-identical
+    /// to the legacy fixed layout (baseline 77×24), so only the relative growth is asserted.
+    @MainActor
+    func testToastScalesWithPopupScale() {
+        let defaults = UserDefaults.standard
+        let key = SettingKey.popupScale.name
+        let original = defaults.object(forKey: key)
+        defer {
+            if let original {
+                defaults.set(original, forKey: key)
+            } else {
+                defaults.removeObject(forKey: key)
+            }
+        }
+
+        let controller = ToastPanelController()
+
+        defaults.set(5, forKey: key)
+        controller.show(StatusFeedback(message: "Copied", style: .success, symbolName: "checkmark"))
+        let largeSize = controller.panelFrame.size
+        controller.hide()
+
+        defaults.set(1, forKey: key)
+        controller.show(StatusFeedback(message: "Copied", style: .success, symbolName: "checkmark"))
+        let smallSize = controller.panelFrame.size
+        controller.hide()
+
+        XCTAssertGreaterThan(largeSize.height, smallSize.height, "toast panel height must grow with popupScale")
+        XCTAssertGreaterThan(largeSize.width, smallSize.width, "toast panel width must grow with popupScale")
+    }
+
     @MainActor
     func testLoadingToastHasNoTimer() async throws {
         let controller = ToastPanelController(autoDismissNanoseconds: 5_000_000)