tyiu/damus
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Improve BlurOverlayView to look protective, not broken

Browse Source 
The blur overlay previously used error-state iconography (eye.slash icon,
"Tap to load" button, raw URL display) which made users think media was
broken rather than intentionally hidden. Redesign to communicate
intentional protection:

- Replace eye.slash icon with shield icon
- Change title from "Media from someone you don't follow" to
  "Content hidden" (the old text was also wrong for undistractMode)
- Rename button from "Tap to load" to "Show"
- Remove raw URL display that added noise
- Remove unused properties (artifacts, size, damus_state, parentView)
  and dead ParentViewType enum that only existed for the URL display
- Simplify all 4 call sites to pass only the blur binding

Changelog-Changed: Redesigned media blur overlay to look like intentional protection instead of a broken state

Closes: https://github.com/damus-io/damus/issues/3662
Signed-off-by: alltheseas <alltheseas@users.noreply.github.com>
Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com>
This commit is contained in:
alltheseas
2026-04-06 14:48:30 -07:00
committed by Daniel D’Aquino
co-authored by Claude Opus 4.6
parent bfad604e5b
commit 652e802ca6
3 changed files with 23 additions and 44 deletions
Download Patch File Download Diff File Expand all files Collapse all files
damus/Features/Events/NoteContentView.swift
+20 -41
View File
@@ -215,7 +215,7 @@ struct NoteContentView: View {
ImageCarousel(state: damus_state, evid: event.id, urls: artifacts.media) { dismiss in ImageCarousel(state: damus_state, evid: event.id, urls: artifacts.media) { dismiss in
fullscreen_preview(dismiss: dismiss) fullscreen_preview(dismiss: dismiss)
} }
BlurOverlayView(blur_images: $blur_images, artifacts: artifacts, size: size, damus_state: damus_state, parentView: .noteContentView) BlurOverlayView(blur_images: $blur_images)
} }
} }
} }
@@ -615,60 +615,39 @@ func lookup_cached_preview_size(previews: PreviewCache, evid: NoteId) -> CGFloat
struct BlurOverlayView: View { struct BlurOverlayView: View {
@Binding var blur_images: Bool @Binding var blur_images: Bool
let artifacts: NoteArtifactsSeparated?
let size: EventViewKind?
let damus_state: DamusState?
let parentView: ParentViewType
var body: some View { var body: some View {
ZStack { ZStack {
Color.black.opacity(0.54)
Color.black
.opacity(0.54)
Blur() Blur()
VStack(spacing: 12) {
VStack(alignment: .center) { Image(systemName: "shield")
Image(systemName: "eye.slash") .font(.system(size: 28))
.foregroundStyle(.white.opacity(0.9))
.accessibilityHidden(true)
Text(NSLocalizedString("Content hidden", comment: "Title on the image blur overlay indicating media is intentionally hidden"))
.foregroundStyle(.white) .foregroundStyle(.white)
.bold() .font(.headline)
.padding(EdgeInsets(top: 5, leading: 10, bottom: 0, trailing: 10))
Text("Media from someone you don't follow", comment: "Label on the image blur mask") Text(NSLocalizedString("This content is from a user you do not follow.", comment: "Explanation on the image blur overlay that indicates media is intentionally hidden"))
.multilineTextAlignment(.center) .foregroundStyle(.white.opacity(0.75))
.foregroundStyle(Color.white) .font(.caption)
.font(.title2)
.padding(EdgeInsets(top: 5, leading: 10, bottom: 0, trailing: 10)) Button(NSLocalizedString("Show", comment: "Button to reveal hidden media on the blur overlay")) {
Button(NSLocalizedString("Tap to load", comment: "Label for button that allows user to dismiss media content warning and unblur the image")) {
blur_images = false blur_images = false
} }
.buttonStyle(.bordered) .buttonStyle(.bordered)
.fontWeight(.bold) .fontWeight(.semibold)
.foregroundStyle(.white) .foregroundStyle(.white)
.padding(EdgeInsets(top: 5, leading: 10, bottom: 0, trailing: 10)) .padding(.top, 4)
if parentView == .noteContentView,
let artifacts = artifacts,
let size = size,
let damus_state = damus_state
{
switch artifacts.media[0] {
case .image(let url), .video(let url):
Text(verbatim: "\(abbreviateURL(url, maxLength: 30))")
.font(eventviewsize_to_font(size, font_size: damus_state.settings.font_size * 0.8))
.foregroundStyle(.white)
.multilineTextAlignment(.center)
.padding(EdgeInsets(top: 20, leading: 10, bottom: 5, trailing: 10))
}
}
} }
.padding(.horizontal, 20)
} }
.onTapGesture { .onTapGesture {
blur_images = false blur_images = false
} }
} }
enum ParentViewType {
case noteContentView, longFormView
}
} }
struct NoteContentView_Previews: PreviewProvider { struct NoteContentView_Previews: PreviewProvider {
damus/Features/FollowPack/Views/FollowPackPreview.swift
+1 -1
View File
@@ -75,7 +75,7 @@ struct FollowPackBannerImage: View {
} else { } else {
ZStack { ZStack {
titleImage(url: url, preview: preview) titleImage(url: url, preview: preview)
BlurOverlayView(blur_images: $blur_imgs, artifacts: nil, size: nil, damus_state: nil, parentView: .longFormView) BlurOverlayView(blur_images: $blur_imgs)
.frame(maxWidth: preview ? 350 : UIScreen.main.bounds.width, minHeight: preview ? 180 : 200, maxHeight: preview ? 180 : 200) .frame(maxWidth: preview ? 350 : UIScreen.main.bounds.width, minHeight: preview ? 180 : 200, maxHeight: preview ? 180 : 200)
} }
} }
damus/Features/Longform/Views/LongformPreview.swift
+2 -2
View File
@@ -146,7 +146,7 @@ struct LongformPreviewBody: View {
} else { } else {
ZStack { ZStack {
titleImage(url: url) titleImage(url: url)
BlurOverlayView(blur_images: $blur_images, artifacts: nil, size: nil, damus_state: nil, parentView: .longFormView) BlurOverlayView(blur_images: $blur_images)
} }
} }
} }
@@ -207,7 +207,7 @@ struct LongformPreviewBody: View {
} else { } else {
ZStack { ZStack {
titleImage(url: url) titleImage(url: url)
BlurOverlayView(blur_images: $blur_images, artifacts: nil, size: nil, damus_state: nil, parentView: .longFormView) BlurOverlayView(blur_images: $blur_images)
} }
} }
} }