Status view improvement

[ericholguin]

This PR improves the look of the User Status view:
nostr:note1e5mk4leg56af3jvxspdmef3uuaqexd3tt0cvmp8tetvn8lqlr6tsm5ffvw

https://damus.io/note1e5mk4leg56af3jvxspdmef3uuaqexd3tt0cvmp8tetvn8lqlr6tsm5ffvw

[jb55]

On Sat, Oct 14, 2023 at 03:23:49PM -0600, ericholguin wrote: Closes: #1606 ---

Needs changelog entry! Reviewed-by: William Casarin ***@***.***>

…

damus/Components/Status/UserStatusSheet.swift | 142 ++++++++++++------ damus/ContentView.swift | 3 +- 2 files changed, 101 insertions(+), 44 deletions(-) diff --git a/damus/Components/Status/UserStatusSheet.swift b/damus/Components/Status/UserStatusSheet.swift index dec711352..50e27c90b 100644 --- a/damus/Components/Status/UserStatusSheet.swift +++ b/damus/Components/Status/UserStatusSheet.swift @@ -46,17 +46,26 @@ enum StatusDuration: CustomStringConvertible, CaseIterable { } let formatter = DateComponentsFormatter() - formatter.unitsStyle = .full + formatter.unitsStyle = .abbreviated formatter.allowedUnits = [.minute, .hour, .day, .weekOfMonth] return formatter.string(from: timeInterval) ?? "\(timeInterval) seconds" } } +enum Fields{ + case status + case link +} + struct UserStatusSheet: View { + let damus_state: DamusState let postbox: PostBox let keypair: Keypair @State var duration: StatusDuration = .never + @State var show_link: Bool = false + + @focusstate var focusedTextField : Fields? @ObservedObject var status: UserStatusModel @Environment(\.dismiss) var dismiss @@ -86,48 +95,18 @@ struct UserStatusSheet: View { } var body: some View { - VStack(alignment: .leading, spacing: 20) { - Text("Set Status", comment: "Title of view that allows the user to set their profile status (e.g. working, studying, coding)") - .font(.largeTitle) - - TextField(text: status_binding, label: { - Text("📋 Working", comment: "Placeholder as an example of what the user could set as their profile status.") - }) - - HStack { - Image("link") - - TextField(text: url_binding, label: { - Text("https://example.com", comment: "Placeholder as an example of what the user could set so that the link is opened when the status is tapped.") - }) - } - + VStack { HStack { - Text("Clear status", comment: "Label to prompt user to select an expiration time for the profile status to clear.") - - Spacer() - - Picker(NSLocalizedString("Duration", comment: "Label for profile status expiration duration picker."), selection: $duration) { - ForEach(StatusDuration.allCases, id: \.self) { d in - Text(verbatim: d.description) - .tag(d) - } - } - } - - Toggle(isOn: $status.playing_enabled, label: { - Text("Broadcast music playing on Apple Music", comment: "Toggle to enable or disable broadcasting what music is being played on Apple Music in their profile status.") - }) - - HStack(alignment: .center) { Button(action: { dismiss() }, label: { Text("Cancel", comment: "Cancel button text for dismissing profile status settings view.") + .padding(10) }) - + .buttonStyle(NeutralButtonStyle()) + Spacer() - + Button(action: { guard let status = self.status.general, let kp = keypair.to_full(), @@ -135,26 +114,103 @@ struct UserStatusSheet: View { else { return } - + postbox.send(ev) - + dismiss() }, label: { - Text("Save", comment: "Save button text for saving profile status settings.") + Text("Share", comment: "Save button text for saving profile status settings.") }) - .buttonStyle(GradientButtonStyle()) + .buttonStyle(GradientButtonStyle(padding: 10)) + } + .padding() + + Divider() + + ZStack { + ProfilePicView(pubkey: keypair.pubkey, size: 120.0, highlight: .custom(DamusColors.white, 3.0), profiles: damus_state.profiles, disable_animation: damus_state.settings.disable_animation) + .padding(.top, 130) + + VStack(spacing: 0) { + HStack { + TextField(NSLocalizedString("Staying humble...", comment: "Placeholder as an example of what the user could set as their profile status."), text: status_binding, axis: .vertical) + .focused($focusedTextField, equals: Fields.status) + .task { + self.focusedTextField = .status + } + .autocorrectionDisabled(true) + .textInputAutocapitalization(.never) + .lineLimit(3) + .frame(width: 175) + } + .padding(10) + .background(DamusColors.adaptableWhite) + .cornerRadius(15) + .shadow(color: DamusColors.neutral3, radius: 15) + + Circle() + .fill(DamusColors.adaptableWhite) + .frame(width: 12, height: 12) + .padding(.trailing, 140) + + Circle() + .fill(DamusColors.adaptableWhite) + .frame(width: 7, height: 7) + .padding(.trailing, 120) + + } + .padding(.leading, 60) + } + + VStack { + HStack { + Image("link") + .foregroundColor(DamusColors.neutral3) + + TextField(text: url_binding, label: { + Text("Add an external link", comment: "Placeholder as an example of what the user could set so that the link is opened when the status is tapped.") + }) + .focused($focusedTextField, equals: Fields.link) + } + .padding(10) + .cornerRadius(12) + .overlay( + RoundedRectangle(cornerRadius: 12) + .stroke(DamusColors.neutral3, lineWidth: 1) + ) + } + .padding() + + Toggle(isOn: $status.playing_enabled, label: { + Text("Broadcast music playing on Apple Music", comment: "Toggle to enable or disable broadcasting what music is being played on Apple Music in their profile status.") + }) + .tint(DamusColors.purple) + .padding(.horizontal) + + HStack { + Text("Clear status", comment: "Label to prompt user to select an expiration time for the profile status to clear.") + + Spacer() + + Picker(NSLocalizedString("Duration", comment: "Label for profile status expiration duration picker."), selection: $duration) { + ForEach(StatusDuration.allCases, id: \.self) { d in + Text(verbatim: d.description) + .tag(d) + } + } + .pickerStyle(.segmented) } - .padding([.top], 30) + .padding() Spacer() } - .padding(30) + .padding(.top) } } struct UserStatusSheet_Previews: PreviewProvider { static var previews: some View { - UserStatusSheet(postbox: test_damus_state.postbox, keypair: test_keypair, status: .init()) + UserStatusSheet(damus_state: test_damus_state, postbox: test_damus_state.postbox, keypair: test_keypair, status: .init()) } } diff --git a/damus/ContentView.swift b/damus/ContentView.swift index dc897f09f..204277364 100644 --- a/damus/ContentView.swift +++ b/damus/ContentView.swift @@ -312,7 +312,8 @@ struct ContentView: View { case .post(let action): PostView(action: action, damus_state: damus_state!) case .user_status: - UserStatusSheet(postbox: damus_state!.postbox, keypair: damus_state!.keypair, status: damus_state!.profiles.profile_data(damus_state!.pubkey).status) + UserStatusSheet(damus_state: damus_state!, postbox: damus_state!.postbox, keypair: damus_state!.keypair, status: damus_state!.profiles.profile_data(damus_state!.pubkey).status) + .presentationDragIndicator(.visible) case .event: EventDetailView() case .zap(let zapsheet):

[jb55]

On Sun, Oct 15, 2023 at 08:44:45AM +0200, William Casarin wrote: On Sat, Oct 14, 2023 at 03:23:49PM -0600, ericholguin wrote: >Closes: #1606 >--- Needs changelog entry!

all good I updated it myself

[jb55]

On Mon, Oct 16, 2023 at 02:51:34AM +0200, William Casarin wrote: On Sun, Oct 15, 2023 at 08:44:45AM +0200, William Casarin wrote: >On Sat, Oct 14, 2023 at 03:23:49PM -0600, ericholguin wrote: >>Closes: #1606 >>--- > >Needs changelog entry! all good I updated it myself

Thanks! applied @ cf243e3