From d28d25f3d150b8e9e211acb1e7ad15702fab4cd7 Mon Sep 17 00:00:00 2001 From: Stefan Ceriu Date: Tue, 26 Aug 2025 13:05:23 +0300 Subject: [PATCH] Overhaul the FormattedBodyText previews --- .../TimelineItemViews/FormattedBodyText.swift | 116 +++++++++++------- .../formattedBodyText.iPad-en-GB-0.png | 4 +- .../formattedBodyText.iPad-en-GB-1.png | 4 +- .../formattedBodyText.iPad-pseudo-0.png | 4 +- .../formattedBodyText.iPad-pseudo-1.png | 4 +- .../formattedBodyText.iPhone-16-en-GB-0.png | 4 +- .../formattedBodyText.iPhone-16-en-GB-1.png | 4 +- .../formattedBodyText.iPhone-16-pseudo-0.png | 4 +- .../formattedBodyText.iPhone-16-pseudo-1.png | 4 +- 9 files changed, 91 insertions(+), 57 deletions(-) diff --git a/ElementX/Sources/Screens/Timeline/View/TimelineItemViews/FormattedBodyText.swift b/ElementX/Sources/Screens/Timeline/View/TimelineItemViews/FormattedBodyText.swift index ef1232385..31d505a22 100644 --- a/ElementX/Sources/Screens/Timeline/View/TimelineItemViews/FormattedBodyText.swift +++ b/ElementX/Sources/Screens/Timeline/View/TimelineItemViews/FormattedBodyText.swift @@ -142,27 +142,45 @@ struct FormattedBodyText_Previews: PreviewProvider, TestablePreview { } @ViewBuilder + // swiftlint:disable:next function_body_length static func body(_ attributedStringBuilder: AttributedStringBuilderProtocol) -> some View { let htmlStrings = [ """ - Plain text -
- !room:matrix.org -
- https://www.matrix.org -
- www.matrix.org -
- matrix.org -
- what's sup dude? -
- thumbs if you liked it, sub if you loved it + Nothing is as permanent as a temporary solution that works. + Experience is the name everyone gives to their mistakes. + If debugging is the process of removing bugs, then programming must be the process of putting them in. """, """ - Text before blockquote -
bold italic
- Text after blockquote +

H1 Header


+

H2 Header


+

H3 Header


+

H4 Header


+
H5 Header

+
H6 Header
+ """, + """ +

This is a paragraph.

And this is another one.

+
And this is a division.
+ New lines are ignored.\n\nLike so.
+ But this line comes after a line break.
+ """, + """ + We expect various identifiers to be (partially) detected:
+ !room:matrix.org, #room:matrix.org, $event:matrix.org, @user:matrix.org
+ matrix://roomid/room:matrix.org, matrix://r/room:matrix.org, matrix://roomid/room:matrix.org/e/event:matrix.org, matrix://roomid/room:matrix.org/u/user:matrix.org
+ """, + """ + Links too:
Matrix rules! 🤘, matrix.org, www.matrix.org, http://matrix.org + """, + """ + Text formatting should work properly.
+ Text formatting does work!.
+ And mixed formatting works too!!1!. +
+ Thumbs if you liked it, sub if you loved it! + """, + """ + Text before blockquote
Nothing is as permanent as a temporary solution that works.
Text after blockquote """, """
First blockquote with a link in it
@@ -170,13 +188,12 @@ struct FormattedBodyText_Previews: PreviewProvider, TestablePreview {
Third blockquote with a link in it
""", """ -
A blockquote that is long and goes onto multiple lines as the first item in the message
-

Then another line of text here to reply to the blockquote, which is also a multiline component.

-
Short line here.
-

And a simple reply here.

+
A blockquote that is long and goes onto multiple lines
+

Then another line of text to reply to the blockquote, also multiline.

+
Then a short blockquote.

Followed by another short sentence.

""", """ -
struct ContentView: View {
+            
A preformatted code blockstruct ContentView: View {
                 var body: some View {
                     VStack {
                         Text("Knock, knock!")
@@ -186,44 +203,61 @@ struct FormattedBodyText_Previews: PreviewProvider, TestablePreview {
                     }
                     .padding()
                 }
-            }
-            
-            
+ }

+ Followed by some plain code blocks
+ Hello, world! + Hello, world! + Hello, world! """, """ - Hello world -

Text

- Hello world -

Text

- Hello world -

Text

- matrix.org https://www.matrix.org + This is an unordered list +
    +
  • Jones’ Crumpets
  • +
  • Crumpetorium
  • +
  • Village Bakery
  • +
""", - "

This is a list

\n
    \n
  • One
  • \n
  • Two
  • \n
  • And number 3
  • \n
\n", - "
  • First item
  • Second item
  • Third item
", - "

test

\n

test

" + """ + This is an ordered list +
    +
  1. Jelly Belly
  2. +
  3. Starburst
  4. +
  5. Skittles
  6. +
+ """ ] ScrollView { - VStack(alignment: .leading, spacing: 24.0) { + VStack(alignment: .leading, spacing: 4.0) { ForEach(htmlStrings, id: \.self) { htmlString in - if let attributedString = attributedStringBuilder.fromHTML(htmlString) { - FormattedBodyText(attributedString: attributedString) - .bubbleBackground() + HStack(alignment: .top, spacing: 0) { + Text(htmlString) + .frame(minWidth: 0, maxWidth: .infinity, alignment: .leading) + .padding(4.0) + + Divider() + .background(.black) + + if let attributedString = attributedStringBuilder.fromHTML(htmlString) { + FormattedBodyText(attributedString: attributedString) + .frame(minWidth: 0, maxWidth: .infinity, alignment: .leading) + .bubbleBackground() + .padding(4.0) + } } + .border(.black) } + FormattedBodyText(attributedString: AttributedString("Some plain text wrapped in an AttributedString.")) .bubbleBackground() + FormattedBodyText(text: "Some plain text that's not an attributed component.") .bubbleBackground() - FormattedBodyText(text: "Some plain text that's not an attributed component. This one is really long.") - .bubbleBackground() FormattedBodyText(text: "❤️", boostFontSize: true) .bubbleBackground() } .padding() } - .previewLayout(.sizeThatFits) } } diff --git a/PreviewTests/Sources/__Snapshots__/PreviewTests/formattedBodyText.iPad-en-GB-0.png b/PreviewTests/Sources/__Snapshots__/PreviewTests/formattedBodyText.iPad-en-GB-0.png index a805e2205..b3fc5ddf3 100644 --- a/PreviewTests/Sources/__Snapshots__/PreviewTests/formattedBodyText.iPad-en-GB-0.png +++ b/PreviewTests/Sources/__Snapshots__/PreviewTests/formattedBodyText.iPad-en-GB-0.png @@ -1,3 +1,3 @@ version https://git-lfs.github.com/spec/v1 -oid sha256:934392ab4fdab8bd7bdb73ec3fde03c80ec86c045af86c7af0d43f2b9c973307 -size 431642 +oid sha256:0afe442ef495ebf79cfb765870127fd522e5634d9fcaf97ad7f18d2e6d61ff16 +size 1144762 diff --git a/PreviewTests/Sources/__Snapshots__/PreviewTests/formattedBodyText.iPad-en-GB-1.png b/PreviewTests/Sources/__Snapshots__/PreviewTests/formattedBodyText.iPad-en-GB-1.png index 8841dbf66..dbd82fa08 100644 --- a/PreviewTests/Sources/__Snapshots__/PreviewTests/formattedBodyText.iPad-en-GB-1.png +++ b/PreviewTests/Sources/__Snapshots__/PreviewTests/formattedBodyText.iPad-en-GB-1.png @@ -1,3 +1,3 @@ version https://git-lfs.github.com/spec/v1 -oid sha256:555d7ae30575387972f64caa2d324bcb5511c27aad11b80a0d74daafe0a80651 -size 403362 +oid sha256:eeff85fc90e7c67e1812d308516d642ed5e534675384a9acbd7f1a112bb904f3 +size 1106059 diff --git a/PreviewTests/Sources/__Snapshots__/PreviewTests/formattedBodyText.iPad-pseudo-0.png b/PreviewTests/Sources/__Snapshots__/PreviewTests/formattedBodyText.iPad-pseudo-0.png index a805e2205..b3fc5ddf3 100644 --- a/PreviewTests/Sources/__Snapshots__/PreviewTests/formattedBodyText.iPad-pseudo-0.png +++ b/PreviewTests/Sources/__Snapshots__/PreviewTests/formattedBodyText.iPad-pseudo-0.png @@ -1,3 +1,3 @@ version https://git-lfs.github.com/spec/v1 -oid sha256:934392ab4fdab8bd7bdb73ec3fde03c80ec86c045af86c7af0d43f2b9c973307 -size 431642 +oid sha256:0afe442ef495ebf79cfb765870127fd522e5634d9fcaf97ad7f18d2e6d61ff16 +size 1144762 diff --git a/PreviewTests/Sources/__Snapshots__/PreviewTests/formattedBodyText.iPad-pseudo-1.png b/PreviewTests/Sources/__Snapshots__/PreviewTests/formattedBodyText.iPad-pseudo-1.png index 8841dbf66..dbd82fa08 100644 --- a/PreviewTests/Sources/__Snapshots__/PreviewTests/formattedBodyText.iPad-pseudo-1.png +++ b/PreviewTests/Sources/__Snapshots__/PreviewTests/formattedBodyText.iPad-pseudo-1.png @@ -1,3 +1,3 @@ version https://git-lfs.github.com/spec/v1 -oid sha256:555d7ae30575387972f64caa2d324bcb5511c27aad11b80a0d74daafe0a80651 -size 403362 +oid sha256:eeff85fc90e7c67e1812d308516d642ed5e534675384a9acbd7f1a112bb904f3 +size 1106059 diff --git a/PreviewTests/Sources/__Snapshots__/PreviewTests/formattedBodyText.iPhone-16-en-GB-0.png b/PreviewTests/Sources/__Snapshots__/PreviewTests/formattedBodyText.iPhone-16-en-GB-0.png index 1e18a0b07..4ddb21eb4 100644 --- a/PreviewTests/Sources/__Snapshots__/PreviewTests/formattedBodyText.iPhone-16-en-GB-0.png +++ b/PreviewTests/Sources/__Snapshots__/PreviewTests/formattedBodyText.iPhone-16-en-GB-0.png @@ -1,3 +1,3 @@ version https://git-lfs.github.com/spec/v1 -oid sha256:c32002366537dbb2498693c6404bbb7f04c8e2b6d4276c27cf8e7b6da726c41d -size 327007 +oid sha256:1c1d75edcce4fd949e15c41cf00a0ee5cb2974a5573ac079e9bbeef230008170 +size 1323823 diff --git a/PreviewTests/Sources/__Snapshots__/PreviewTests/formattedBodyText.iPhone-16-en-GB-1.png b/PreviewTests/Sources/__Snapshots__/PreviewTests/formattedBodyText.iPhone-16-en-GB-1.png index 79e77d47a..fd3ec3979 100644 --- a/PreviewTests/Sources/__Snapshots__/PreviewTests/formattedBodyText.iPhone-16-en-GB-1.png +++ b/PreviewTests/Sources/__Snapshots__/PreviewTests/formattedBodyText.iPhone-16-en-GB-1.png @@ -1,3 +1,3 @@ version https://git-lfs.github.com/spec/v1 -oid sha256:070581019f6b97ffdad6ebb5b895211e1359c3f77f05b34c9addfafc3fe4b7aa -size 302644 +oid sha256:71608e9218a46fa9f22b59e90352d6a463597bb9b2dbff95d063d334085bd8a5 +size 1303346 diff --git a/PreviewTests/Sources/__Snapshots__/PreviewTests/formattedBodyText.iPhone-16-pseudo-0.png b/PreviewTests/Sources/__Snapshots__/PreviewTests/formattedBodyText.iPhone-16-pseudo-0.png index 1e18a0b07..4ddb21eb4 100644 --- a/PreviewTests/Sources/__Snapshots__/PreviewTests/formattedBodyText.iPhone-16-pseudo-0.png +++ b/PreviewTests/Sources/__Snapshots__/PreviewTests/formattedBodyText.iPhone-16-pseudo-0.png @@ -1,3 +1,3 @@ version https://git-lfs.github.com/spec/v1 -oid sha256:c32002366537dbb2498693c6404bbb7f04c8e2b6d4276c27cf8e7b6da726c41d -size 327007 +oid sha256:1c1d75edcce4fd949e15c41cf00a0ee5cb2974a5573ac079e9bbeef230008170 +size 1323823 diff --git a/PreviewTests/Sources/__Snapshots__/PreviewTests/formattedBodyText.iPhone-16-pseudo-1.png b/PreviewTests/Sources/__Snapshots__/PreviewTests/formattedBodyText.iPhone-16-pseudo-1.png index 79e77d47a..fd3ec3979 100644 --- a/PreviewTests/Sources/__Snapshots__/PreviewTests/formattedBodyText.iPhone-16-pseudo-1.png +++ b/PreviewTests/Sources/__Snapshots__/PreviewTests/formattedBodyText.iPhone-16-pseudo-1.png @@ -1,3 +1,3 @@ version https://git-lfs.github.com/spec/v1 -oid sha256:070581019f6b97ffdad6ebb5b895211e1359c3f77f05b34c9addfafc3fe4b7aa -size 302644 +oid sha256:71608e9218a46fa9f22b59e90352d6a463597bb9b2dbff95d063d334085bd8a5 +size 1303346