Show the pending-counter in any corners (#1638)

The pending-button can now be shown in any corner the user prefers. This is
accomplished by allowing the user to move the counter left in addition to the
already present option to move it down. Fixes #1637

Signed-off-by: Paul Schuetz <pa.schuetz@web.de>

IceCubesApp/App/Tabs/Settings/DisplaySettingsView.swift

@@ -204,6 +204,7 @@ struct DisplaySettingsView: View {
       }
       Toggle("settings.display.translate-button", isOn: $userPreferences.showTranslateButton)
       Toggle("settings.display.pending-at-bottom", isOn: $userPreferences.pendingShownAtBottom)
+      Toggle("settings.display.pending-left", isOn: $userPreferences.pendingShownLeft)
     }
     .listRowBackground(theme.primaryBackgroundColor)
   }

IceCubesApp/Resources/Localization/Localizable.xcstrings

@@ -40435,6 +40435,23 @@
         }
       }
     },
+    "settings.display.pending-left" : {
+      "extractionState" : "manual",
+      "localizations" : {
+        "de" : {
+          "stringUnit" : {
+            "state" : "needs_review",
+            "value" : "Ungelesene-Button am linken Rand anzeigen"
+          }
+        },
+        "en" : {
+          "stringUnit" : {
+            "state" : "translated",
+            "value" : "Show Pending Button on the Left"
+          }
+        }
+      }
+    },
     "settings.display.restore" : {
       "localizations" : {
         "be" : {

Packages/Env/Sources/Env/UserPreferences.swift

@@ -10,6 +10,7 @@ import SwiftUI
     @AppStorage("preferred_browser") public var preferredBrowser: PreferredBrowser = .inAppSafari
     @AppStorage("show_translate_button_inline") public var showTranslateButton: Bool = true
     @AppStorage("show_pending_at_bottom") public var pendingShownAtBottom: Bool = false
+    @AppStorage("show_pending_left") public var pendingShownLeft: Bool = false
     @AppStorage("is_open_ai_enabled") public var isOpenAIEnabled: Bool = true
 
     @AppStorage("recently_used_languages") public var recentlyUsedLanguages: [String] = []
@@ -80,6 +81,31 @@ import SwiftUI
     }
   }
   
+  public var pendingShownLeft: Bool {
+    didSet {
+      storage.pendingShownLeft = pendingShownLeft
+    }
+  }
+  
+  public var pendingLocation: Alignment {
+    get {
+      let fromLeft = Locale.current.language.characterDirection == .leftToRight ? pendingShownLeft : !pendingShownLeft
+      if pendingShownAtBottom {
+        if fromLeft {
+          return .bottomLeading
+        } else {
+          return .bottomTrailing
+        }
+      } else {
+        if fromLeft {
+          return .topLeading
+        } else {
+          return .topTrailing
+        }
+      }
+    }
+  }
+
   public var isOpenAIEnabled: Bool {
     didSet {
       storage.isOpenAIEnabled = isOpenAIEnabled
@@ -430,5 +456,6 @@ import SwiftUI
     collapseLongPosts = storage.collapseLongPosts
     shareButtonBehavior = storage.shareButtonBehavior
     pendingShownAtBottom = storage.pendingShownAtBottom
+      pendingShownLeft = storage.pendingShownLeft
   }
 }

Packages/Timeline/Sources/Timeline/PendingStatusesObserver.swift

@@ -32,23 +32,20 @@ struct PendingStatusesObserverView: View {
   @Environment(UserPreferences.self) private var preferences
   var body: some View {
     if observer.pendingStatusesCount > 0 {
-      HStack(spacing: 6) {
+      Button {
-        Spacer()
+        observer.scrollToIndex?(observer.pendingStatusesCount)
-        Button {
+      } label: {
-          observer.scrollToIndex?(observer.pendingStatusesCount)
+        Text("\(observer.pendingStatusesCount)")
-        } label: {
+          // Accessibility: this results in a frame with a size of at least 44x44 at regular font size
-          Text("\(observer.pendingStatusesCount)")
+          .frame(minWidth: 30, minHeight: 30)
-            // Accessibility: this results in a frame with a size of at least 44x44 at regular font size
-            .frame(minWidth: 30, minHeight: 30)
-        }
-        .accessibilityLabel("accessibility.tabs.timeline.unread-posts.label-\(observer.pendingStatusesCount)")
-        .accessibilityHint("accessibility.tabs.timeline.unread-posts.hint")
-        .buttonStyle(.bordered)
-        .background(.thinMaterial)
-        .cornerRadius(8)
       }
+      .accessibilityLabel("accessibility.tabs.timeline.unread-posts.label-\(observer.pendingStatusesCount)")
+      .accessibilityHint("accessibility.tabs.timeline.unread-posts.hint")
+      .buttonStyle(.bordered)
+      .background(.thinMaterial)
+      .cornerRadius(8)
       .padding(12)
-      .frame(maxHeight: .infinity, alignment: preferences.pendingShownAtBottom ? .bottom : .top)
+      .frame(maxWidth: .infinity, maxHeight: .infinity, alignment: preferences.pendingLocation)
     }
   }
 }