From 319fae6fec0d28969fbfa8c2edd12c265fd5528a Mon Sep 17 00:00:00 2001
From: Shadowfacts <me@shadowfacts.net>
Date: Mon, 3 Mar 2025 19:15:13 -0500
Subject: [PATCH] Compose autocomplete tweaks

---
 .../Autocomplete/AutocompleteEmojiView.swift  | 11 +++----
 .../AutocompleteHashtagView.swift             | 11 +++++--
 .../AutocompleteMentionView.swift             |  5 +++-
 .../Views/Autocomplete/AutocompleteView.swift | 30 ++++++++++++++++---
 .../ComposeUI/Views/ComposeToolbarView.swift  |  2 +-
 5 files changed, 45 insertions(+), 14 deletions(-)

diff --git a/Packages/ComposeUI/Sources/ComposeUI/Views/Autocomplete/AutocompleteEmojiView.swift b/Packages/ComposeUI/Sources/ComposeUI/Views/Autocomplete/AutocompleteEmojiView.swift
index 72dd2e87a3..99133af527 100644
--- a/Packages/ComposeUI/Sources/ComposeUI/Views/Autocomplete/AutocompleteEmojiView.swift
+++ b/Packages/ComposeUI/Sources/ComposeUI/Views/Autocomplete/AutocompleteEmojiView.swift
@@ -17,13 +17,15 @@ struct AutocompleteEmojiView: View {
     @State private var emojis: [Emoji] = []
     
     var body: some View {
-        HStack(alignment: expanded ? .top : .center, spacing: 0) {
+        HStack(alignment: expanded ? .top : .center, spacing: 8) {
             scrollView
+                .transition(.opacity)
+                .animation(.snappy, value: expanded)
             
             ToggleExpandedButton(expanded: $expanded)
-                .padding(.trailing, 8)
                 .padding(.top, expanded ? 8 : 0)
         }
+        .padding(.horizontal, 8)
         .task(id: query) {
             await queryChanged()
         }
@@ -81,7 +83,6 @@ private struct InlineEmojiView: View {
                 AutocompleteEmojiButton(emoji: emoji)
             }
         }
-        .padding(.horizontal, 8)
         .frame(height: ComposeToolbarView.autocompleteHeight)
     }
 }
@@ -97,7 +98,7 @@ private struct ExpandedEmojiView: View {
                 ExpandedEmojiSection(section: section, emojis: emojisBySection[section]!)
             }
         }
-        .padding(.all, 8)
+        .padding(.vertical, 8)
         .task(id: emojis) {
             groupEmojisBySection()
         }
@@ -170,7 +171,7 @@ private struct ToggleExpandedButton: View {
     
     var body: some View {
         Button {
-            withAnimation(nil) {
+            withAnimation(.snappy) {
                 expanded.toggle()
             }
         } label: {
diff --git a/Packages/ComposeUI/Sources/ComposeUI/Views/Autocomplete/AutocompleteHashtagView.swift b/Packages/ComposeUI/Sources/ComposeUI/Views/Autocomplete/AutocompleteHashtagView.swift
index 4b23d28e03..ab881dd4c4 100644
--- a/Packages/ComposeUI/Sources/ComposeUI/Views/Autocomplete/AutocompleteHashtagView.swift
+++ b/Packages/ComposeUI/Sources/ComposeUI/Views/Autocomplete/AutocompleteHashtagView.swift
@@ -19,9 +19,14 @@ struct AutocompleteHashtagView: View {
     var body: some View {
         ScrollView(.horizontal) {
             HStack(spacing: 8) {
-                if hashtags.isEmpty && loading {
-                    ProgressView()
-                        .progressViewStyle(.circular)
+                if hashtags.isEmpty {
+                    if loading {
+                        ProgressView()
+                            .progressViewStyle(.circular)
+                    } else if query.isEmpty {
+                        Text("Type to search")
+                            .font(.callout.italic())
+                    }
                 }
                 
                 ForEach(hashtags, id: \.name) { hashtag in
diff --git a/Packages/ComposeUI/Sources/ComposeUI/Views/Autocomplete/AutocompleteMentionView.swift b/Packages/ComposeUI/Sources/ComposeUI/Views/Autocomplete/AutocompleteMentionView.swift
index c8f4d2982f..2ec205de33 100644
--- a/Packages/ComposeUI/Sources/ComposeUI/Views/Autocomplete/AutocompleteMentionView.swift
+++ b/Packages/ComposeUI/Sources/ComposeUI/Views/Autocomplete/AutocompleteMentionView.swift
@@ -24,9 +24,12 @@ struct AutocompleteMentionView: View {
                     if loading {
                         ProgressView()
                             .progressViewStyle(.circular)
+                    } else if query.isEmpty {
+                        Text("Type to search")
+                            .font(.callout.italic())
                     } else {
                         Text("No accounts found")
-                            .font(.caption.italic())
+                            .font(.callout.italic())
                     }
                 }
                 
diff --git a/Packages/ComposeUI/Sources/ComposeUI/Views/Autocomplete/AutocompleteView.swift b/Packages/ComposeUI/Sources/ComposeUI/Views/Autocomplete/AutocompleteView.swift
index 51166e1681..bb62558323 100644
--- a/Packages/ComposeUI/Sources/ComposeUI/Views/Autocomplete/AutocompleteView.swift
+++ b/Packages/ComposeUI/Sources/ComposeUI/Views/Autocomplete/AutocompleteView.swift
@@ -12,18 +12,40 @@ struct AutocompleteView: View {
     @FocusedInputAutocompleteState private var state
     
     var body: some View {
+        contentView
+            .composeToolbarBackground()
+            .transition(.move(edge: .bottom))
+            .animation(.snappy, value: AutocompleteMode(state: state))
+    }
+    
+    @ViewBuilder
+    var contentView: some View {
         switch state {
         case nil:
-            Color.clear
+            EmptyView()
         case .hashtag(let s):
             AutocompleteHashtagView(query: s, mastodonController: mastodonController)
-                .composeToolbarBackground()
         case .mention(let s):
             AutocompleteMentionView(query: s, mastodonController: mastodonController)
-                .composeToolbarBackground()
         case .emoji(let s):
             AutocompleteEmojiView(query: s, mastodonController: mastodonController)
-                .composeToolbarBackground()
+        }
+    }
+}
+
+private enum AutocompleteMode {
+    case none, hashtag, mention, emoji
+    
+    init(state: AutocompleteState?) {
+        switch state {
+        case .mention(_):
+            self = .mention
+        case .emoji(_):
+            self = .emoji
+        case .hashtag(_):
+            self = .hashtag
+        case nil:
+            self = .none
         }
     }
 }
diff --git a/Packages/ComposeUI/Sources/ComposeUI/Views/ComposeToolbarView.swift b/Packages/ComposeUI/Sources/ComposeUI/Views/ComposeToolbarView.swift
index 611a4bf71c..986fdf7dfd 100644
--- a/Packages/ComposeUI/Sources/ComposeUI/Views/ComposeToolbarView.swift
+++ b/Packages/ComposeUI/Sources/ComposeUI/Views/ComposeToolbarView.swift
@@ -39,7 +39,7 @@ private struct ToolbarContentView: View {
         #else
         ToolbarScrollView {
             buttons
-                .padding(.horizontal, 16)
+                .padding(.horizontal, 8)
         }
         .frame(height: ComposeToolbarView.toolbarHeight)
         .composeToolbarBackground()