fix: align profile screens with Figma

Bitkit/Assets.xcassets/icons/activity-regular.imageset/Contents.json

@@ -0,0 +1,16 @@
+{
+  "images": [
+    {
+      "filename": "activity-regular.svg",
+      "idiom": "universal"
+    }
+  ],
+  "info": {
+    "author": "xcode",
+    "version": 1
+  },
+  "properties": {
+    "preserves-vector-representation": true,
+    "template-rendering-intent": "template"
+  }
+}

Bitkit/Assets.xcassets/icons/coins-regular.imageset/Contents.json

@@ -0,0 +1,16 @@
+{
+  "images": [
+    {
+      "filename": "coins-regular.svg",
+      "idiom": "universal"
+    }
+  ],
+  "info": {
+    "author": "xcode",
+    "version": 1
+  },
+  "properties": {
+    "preserves-vector-representation": true,
+    "template-rendering-intent": "template"
+  }
+}

Bitkit/Assets.xcassets/icons/copy-simple.imageset/Contents.json

@@ -0,0 +1,16 @@
+{
+  "images": [
+    {
+      "filename": "copy-simple.svg",
+      "idiom": "universal"
+    }
+  ],
+  "info": {
+    "author": "xcode",
+    "version": 1
+  },
+  "properties": {
+    "preserves-vector-representation": true,
+    "template-rendering-intent": "template"
+  }
+}

Bitkit/Assets.xcassets/icons/pencil-regular.imageset/Contents.json

@@ -0,0 +1,16 @@
+{
+  "images": [
+    {
+      "filename": "pencil-regular.svg",
+      "idiom": "universal"
+    }
+  ],
+  "info": {
+    "author": "xcode",
+    "version": 1
+  },
+  "properties": {
+    "preserves-vector-representation": true,
+    "template-rendering-intent": "template"
+  }
+}

Bitkit/Assets.xcassets/icons/share-regular.imageset/Contents.json

@@ -0,0 +1,16 @@
+{
+  "images": [
+    {
+      "filename": "share-regular.svg",
+      "idiom": "universal"
+    }
+  ],
+  "info": {
+    "author": "xcode",
+    "version": 1
+  },
+  "properties": {
+    "preserves-vector-representation": true,
+    "template-rendering-intent": "template"
+  }
+}

Bitkit/Assets.xcassets/icons/trash-regular.imageset/Contents.json

@@ -0,0 +1,16 @@
+{
+  "images": [
+    {
+      "filename": "trash-regular.svg",
+      "idiom": "universal"
+    }
+  ],
+  "info": {
+    "author": "xcode",
+    "version": 1
+  },
+  "properties": {
+    "preserves-vector-representation": true,
+    "template-rendering-intent": "template"
+  }
+}

Bitkit/Components/Button/GradientCircleButton.swift

@@ -32,11 +32,7 @@ struct GradientCircleButton: View {
                             endPoint: .bottom
                         )
                     )
-                    .overlay(
-                        Circle()
-                            .stroke(Color.white10, lineWidth: 1)
-                            .padding(0.5)
-                    )
+                    .shadow(color: .white10, radius: 0, x: 0, y: -1)
 
                 if let icon {
                     Image(icon)

Bitkit/Components/Button/IconActionButton.swift

@@ -1,62 +1,63 @@
 import SwiftUI
 
-/// A pill-shaped button with an icon and label, used for "Add Link", "Add Tag" actions.
+/// A small pill button with an optional icon, used for "Add Link", "Add Tag" and suggestion pills.
 struct IconActionButton: View {
-    let icon: String
+    let icon: String?
     let isSystemIcon: Bool
     let title: String
+    let tint: Color
     let accessibilityId: String
     let action: () -> Void
 
     init(
-        icon: String,
+        icon: String? = nil,
         isSystemIcon: Bool = false,
         title: String,
+        tint: Color = .white,
         accessibilityId: String,
         action: @escaping () -> Void
     ) {
         self.icon = icon
         self.isSystemIcon = isSystemIcon
         self.title = title
+        self.tint = tint
         self.accessibilityId = accessibilityId
         self.action = action
     }
 
     var body: some View {
         Button(action: action) {
             HStack(spacing: 8) {
-                if isSystemIcon {
-                    Image(systemName: icon)
-                        .font(.system(size: 14, weight: .medium))
-                        .foregroundColor(.white)
-                } else {
-                    Image(icon)
-                        .resizable()
-                        .scaledToFit()
-                        .foregroundColor(.white)
-                        .frame(width: 14, height: 14)
+                if let icon {
+                    iconImage(icon)
+                        .frame(width: 16, height: 16)
                 }
 
-                BodySSBText(title)
+                CaptionBText(title, textColor: tint)
                     .lineLimit(1)
             }
             .padding(.horizontal, 16)
             .frame(height: 40)
-            .background(
-                LinearGradient(
-                    colors: [Color(hex: 0x2A2A2A), Color(hex: 0x1C1C1C)],
-                    startPoint: .top,
-                    endPoint: .bottom
-                )
-            )
-            .overlay(
-                RoundedRectangle(cornerRadius: 64)
-                    .stroke(Color.white10, lineWidth: 1)
-            )
-            .shadow(color: .black.opacity(0.32), radius: 2, x: 0, y: 2)
+            .background(ButtonGradient())
             .cornerRadius(64)
+            .shadow(color: .white10, radius: 0, x: 0, y: -1)
+            .shadow(color: .black.opacity(0.32), radius: 2, x: 0, y: 2)
         }
         .buttonStyle(.plain)
         .accessibilityIdentifier(accessibilityId)
     }
+
+    @ViewBuilder
+    private func iconImage(_ icon: String) -> some View {
+        if isSystemIcon {
+            Image(systemName: icon)
+                .font(.system(size: 14, weight: .medium))
+                .foregroundColor(tint)
+        } else {
+            Image(icon)
+                .resizable()
+                .scaledToFit()
+                .foregroundColor(tint)
+        }
+    }
 }

Bitkit/Components/CenteredProfileHeader.swift

@@ -13,12 +13,10 @@ struct CenteredProfileHeader: View {
     var notesAccessibilityIdentifier: String?
 
     var body: some View {
-        VStack(spacing: 0) {
+        VStack(spacing: 16) {
             CaptionMText(truncatedKey, textColor: .white64)
-                .padding(.bottom, 16)
 
             avatarView
-                .padding(.bottom, 16)
 
             Text(name.uppercased())
                 .font(Fonts.black(size: 44))
@@ -27,15 +25,14 @@ struct CenteredProfileHeader: View {
                 .multilineTextAlignment(.center)
                 .fixedSize(horizontal: false, vertical: true)
                 .frame(maxWidth: .infinity, alignment: .center)
-                .padding(.bottom, showBio && !bio.isEmpty ? 8 : 0)
                 .accessibilityIdentifierIfPresent(nameAccessibilityIdentifier)
 
             if showBio, !bio.isEmpty {
                 BodyMText(bio, textColor: .white64)
                     .multilineTextAlignment(.center)
                     .fixedSize(horizontal: false, vertical: true)
                     .frame(maxWidth: .infinity, alignment: .center)
-                    .padding(.bottom, 16)
+                    .padding(.horizontal, 16)
                     .accessibilityIdentifierIfPresent(notesAccessibilityIdentifier)
             }
 

Bitkit/Components/ClipboardCopyPopup.swift

@@ -0,0 +1,32 @@
+import SwiftUI
+
+struct ClipboardCopyPopup: View {
+    let title: String
+    let value: String
+
+    var body: some View {
+        VStack(spacing: 16) {
+            BodyMSBText(title, textColor: .brandAccent)
+
+            BodySText(value, textColor: .textPrimary)
+        }
+        .multilineTextAlignment(.center)
+        .fixedSize(horizontal: false, vertical: true)
+        .frame(width: 247)
+        .padding(32)
+        .background(Color.gray6)
+        .clipShape(RoundedRectangle(cornerRadius: 16))
+        .shadow(color: .black.opacity(0.4), radius: 25, x: 0, y: 25)
+        .accessibilityElement(children: .combine)
+    }
+}
+
+#Preview {
+    ClipboardCopyPopup(
+        title: "pubky copied to clipboard",
+        value: "pubky3rsduhcxpw74snwyct86m38c63j3pq8x4ycqikxg64roik8yw5xg"
+    )
+    .frame(maxWidth: .infinity, maxHeight: .infinity)
+    .background(Color.customBlack)
+    .preferredColorScheme(.dark)
+}

Bitkit/Components/Header.swift

@@ -136,7 +136,7 @@ struct Header: View {
                 profileAvatar
 
                 if let name = pubkyProfile.displayName {
-                    TitleText(name)
+                    TitleText(name.capitalizingFirstLetterOfEachWord)
                 } else {
                     TitleText(t("slashtags__your_name_capital"))
                 }
@@ -153,21 +153,11 @@ struct Header: View {
         return true
     }
 
-    @ViewBuilder
     private var profileAvatar: some View {
-        if let imageUri = pubkyProfile.displayImageUri {
-            PubkyImage(uri: imageUri, size: 32)
-        } else {
-            Circle()
-                .fill(Color.gray4)
-                .frame(width: 32, height: 32)
-                .overlay {
-                    Image("user-square")
-                        .resizable()
-                        .scaledToFit()
-                        .foregroundColor(.white32)
-                        .frame(width: 16, height: 16)
-                }
-        }
+        PubkyContactAvatar(
+            name: pubkyProfile.displayName ?? t("slashtags__your_name_capital"),
+            imageUrl: pubkyProfile.displayImageUri,
+            size: 32
+        )
     }
 }

Bitkit/Components/NoteTextEditor.swift

@@ -8,6 +8,7 @@ struct NoteTextEditor: View {
     var minHeight: CGFloat = 30
     var maxHeight: CGFloat = 50
     var backgroundColor: Color = .white06
+    var allowsLineBreaks = false
 
     var body: some View {
         ZStack(alignment: .topLeading) {
@@ -20,11 +21,11 @@ struct NoteTextEditor: View {
                 .font(.custom(Fonts.semiBold, size: 15))
                 .foregroundColor(.textPrimary)
                 .accentColor(.brandAccent)
-                .submitLabel(.done)
+                .submitLabel(allowsLineBreaks ? .return : .done)
                 .scrollContentBackground(.hidden)
                 .padding(EdgeInsets(top: -8, leading: -5, bottom: -5, trailing: -5))
                 .frame(minHeight: minHeight, maxHeight: maxHeight)
-                .dismissKeyboardOnReturn(text: $text, isFocused: isFocused)
+                .dismissKeyboardOnReturn(text: $text, isFocused: isFocused, isEnabled: !allowsLineBreaks)
                 .accessibilityValue(text)
                 .accessibilityIdentifier(testIdentifier)
         }