Use more Compound icons (part 2!) (#2082)

* Use Compound icons in ListRow.

* Add CompoundIcon(asset:) convenience initialiser.

ElementX.xcodeproj/project.pbxproj

@@ -637,6 +637,7 @@
 		A5D551E5691749066E0E0C44 /* RoomDetailsScreenViewModel.swift in Sources */ = {isa = PBXBuildFile; fileRef = 837B440C4705E4B899BCB899 /* RoomDetailsScreenViewModel.swift */; };
 		A64B52D9F73F9A6B95AF24FE /* UserDetailsEditScreenCoordinator.swift in Sources */ = {isa = PBXBuildFile; fileRef = C4CD503F5E0938FE53C7C6E7 /* UserDetailsEditScreenCoordinator.swift */; };
 		A680F54935A6ADEA4ED6C38F /* TimelineItemStatusView.swift in Sources */ = {isa = PBXBuildFile; fileRef = 6A4C9547BBFEEF30AA11329B /* TimelineItemStatusView.swift */; };
+		A6B83EB78F025D21B6EBA90C /* CompoundIcon.swift in Sources */ = {isa = PBXBuildFile; fileRef = 044E501B8331B339874D1B96 /* CompoundIcon.swift */; };
 		A6D4C5EEA85A6A0ABA1559D6 /* RoomDetailsEditScreenModels.swift in Sources */ = {isa = PBXBuildFile; fileRef = 16D09C79746BDCD9173EB3A7 /* RoomDetailsEditScreenModels.swift */; };
 		A6DEC1ADEC8FEEC206A0FA37 /* AttributedStringBuilderProtocol.swift in Sources */ = {isa = PBXBuildFile; fileRef = 72F37B5DA798C9AE436F2C2C /* AttributedStringBuilderProtocol.swift */; };
 		A722F426FD81FC67706BB1E0 /* CustomLayoutLabelStyle.swift in Sources */ = {isa = PBXBuildFile; fileRef = 42236480CF0431535EBE8387 /* CustomLayoutLabelStyle.swift */; };
@@ -1044,6 +1045,7 @@
 		0392E3FDE372C9B56FEEED8B /* test_voice_message.m4a */ = {isa = PBXFileReference; path = test_voice_message.m4a; sourceTree = "<group>"; };
 		03DD998E523D4EC93C7ED703 /* RoomNotificationSettingsScreenViewModelProtocol.swift */ = {isa = PBXFileReference; lastKnownFileType = sourcecode.swift; path = RoomNotificationSettingsScreenViewModelProtocol.swift; sourceTree = "<group>"; };
 		03FABD73FD8086EFAB699F42 /* MediaUploadPreviewScreenViewModelTests.swift */ = {isa = PBXFileReference; lastKnownFileType = sourcecode.swift; path = MediaUploadPreviewScreenViewModelTests.swift; sourceTree = "<group>"; };
+		044E501B8331B339874D1B96 /* CompoundIcon.swift */ = {isa = PBXFileReference; lastKnownFileType = sourcecode.swift; path = CompoundIcon.swift; sourceTree = "<group>"; };
 		045253F9967A535EE5B16691 /* Label.swift */ = {isa = PBXFileReference; lastKnownFileType = sourcecode.swift; path = Label.swift; sourceTree = "<group>"; };
 		04BB8DDE245ED86C489BA983 /* AccessibilityIdentifiers.swift */ = {isa = PBXFileReference; lastKnownFileType = sourcecode.swift; path = AccessibilityIdentifiers.swift; sourceTree = "<group>"; };
 		04DF593C3F7AF4B2FBAEB05D /* FileManager.swift */ = {isa = PBXFileReference; lastKnownFileType = sourcecode.swift; path = FileManager.swift; sourceTree = "<group>"; };
@@ -2731,6 +2733,7 @@
 				B6E89E530A8E92EC44301CA1 /* Bundle.swift */,
 				A9FAFE1C2149E6AC8156ED2B /* Collection.swift */,
 				E2B1CC9AA154F4D5435BF60A /* Comparable.swift */,
+				044E501B8331B339874D1B96 /* CompoundIcon.swift */,
 				B383DCD3DCB19E00FD478A5F /* ConfirmationDialog.swift */,
 				2141693488CE5446BB391964 /* Date.swift */,
 				BFDCAC6CAAD65A2C24EA9C4B /* Dictionary.swift */,
@@ -5395,6 +5398,7 @@
 				56BAB81A0D03C2EF09B86294 /* ComposerToolbarModels.swift in Sources */,
 				5995C63B1C61DE1373AA2BCE /* ComposerToolbarViewModel.swift in Sources */,
 				9BEA56957B3AF954E7321658 /* ComposerToolbarViewModelProtocol.swift in Sources */,
+				A6B83EB78F025D21B6EBA90C /* CompoundIcon.swift in Sources */,
 				EA6613B29BA671F39CE1B1D2 /* ConfirmationDialog.swift in Sources */,
 				AC7AA215D60FBC307F984028 /* Consumable.swift in Sources */,
 				C3522917C0C367C403429EEC /* CoordinatorProtocol.swift in Sources */,
@@ -6664,7 +6668,7 @@
 			repositoryURL = "https://github.com/vector-im/compound-ios";
 			requirement = {
 				kind = revision;
-				revision = 849e5beaadfb449b53a28d41cc22cf303cc9045b;
+				revision = 7ae8b7ef4033861d0439427d5404538243afeffd;
 			};
 		};
 		9A472EE0218FE7DCF5283429 /* XCRemoteSwiftPackageReference "SwiftUI-Introspect" */ = {

ElementX.xcodeproj/project.xcworkspace/xcshareddata/swiftpm/Package.resolved

@@ -14,7 +14,7 @@
       "kind" : "remoteSourceControl",
       "location" : "https://github.com/vector-im/compound-ios",
       "state" : {
-        "revision" : "849e5beaadfb449b53a28d41cc22cf303cc9045b"
+        "revision" : "7ae8b7ef4033861d0439427d5404538243afeffd"
       }
     },
     {

ElementX/Resources/Assets.xcassets/images/block.imageset/Contents.json

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

ElementX/Resources/Assets.xcassets/images/block.imageset/block.svg

@@ -0,0 +1,3 @@
+<svg width="24" height="24" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg">
+<path d="M12 22C10.6167 22 9.31667 21.7375 8.1 21.2125C6.88333 20.6875 5.825 19.975 4.925 19.075C4.025 18.175 3.3125 17.1167 2.7875 15.9C2.2625 14.6833 2 13.3833 2 12C2 10.6167 2.2625 9.31667 2.7875 8.1C3.3125 6.88333 4.025 5.825 4.925 4.925C5.825 4.025 6.88333 3.3125 8.1 2.7875C9.31667 2.2625 10.6167 2 12 2C13.3833 2 14.6833 2.2625 15.9 2.7875C17.1167 3.3125 18.175 4.025 19.075 4.925C19.975 5.825 20.6875 6.88333 21.2125 8.1C21.7375 9.31667 22 10.6167 22 12C22 13.3833 21.7375 14.6833 21.2125 15.9C20.6875 17.1167 19.975 18.175 19.075 19.075C18.175 19.975 17.1167 20.6875 15.9 21.2125C14.6833 21.7375 13.3833 22 12 22ZM12 20C12.9 20 13.7667 19.8542 14.6 19.5625C15.4333 19.2708 16.2 18.85 16.9 18.3L5.7 7.1C5.15 7.8 4.72917 8.56667 4.4375 9.4C4.14583 10.2333 4 11.1 4 12C4 14.2333 4.775 16.125 6.325 17.675C7.875 19.225 9.76667 20 12 20ZM18.3 16.9C18.85 16.2 19.2708 15.4333 19.5625 14.6C19.8542 13.7667 20 12.9 20 12C20 9.76667 19.225 7.875 17.675 6.325C16.125 4.775 14.2333 4 12 4C11.1 4 10.2333 4.14583 9.4 4.4375C8.56667 4.72917 7.8 5.15 7.1 5.7L18.3 16.9Z" fill="#1B1D22"/>
+</svg>

ElementX/Resources/Assets.xcassets/images/devices.imageset/Contents.json

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

ElementX/Resources/Assets.xcassets/images/devices.imageset/devices.svg

@@ -0,0 +1,3 @@
+<svg width="24" height="24" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg">
+<path d="M3.5 20C3.08333 20 2.72917 19.8542 2.4375 19.5625C2.14583 19.2708 2 18.9167 2 18.5C2 18.0833 2.14583 17.7292 2.4375 17.4375C2.72917 17.1458 3.08333 17 3.5 17H4V6C4 5.45 4.19583 4.97917 4.5875 4.5875C4.97917 4.19583 5.45 4 6 4H20C20.2833 4 20.5208 4.09583 20.7125 4.2875C20.9042 4.47917 21 4.71667 21 5C21 5.28333 20.9042 5.52083 20.7125 5.7125C20.5208 5.90417 20.2833 6 20 6H6V17H10.5C10.9167 17 11.2708 17.1458 11.5625 17.4375C11.8542 17.7292 12 18.0833 12 18.5C12 18.9167 11.8542 19.2708 11.5625 19.5625C11.2708 19.8542 10.9167 20 10.5 20H3.5ZM15 20C14.7167 20 14.4792 19.9042 14.2875 19.7125C14.0958 19.5208 14 19.2833 14 19V9C14 8.71667 14.0958 8.47917 14.2875 8.2875C14.4792 8.09583 14.7167 8 15 8H21C21.2833 8 21.5208 8.09583 21.7125 8.2875C21.9042 8.47917 22 8.71667 22 9V19C22 19.2833 21.9042 19.5208 21.7125 19.7125C21.5208 19.9042 21.2833 20 21 20H15ZM16 17H20V10H16V17Z" fill="#1B1D22"/>
+</svg>

ElementX/Resources/Assets.xcassets/images/lock.imageset/Contents.json

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

ElementX/Resources/Assets.xcassets/images/lock.imageset/lock.svg

@@ -0,0 +1,3 @@
+<svg width="24" height="24" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg">
+<path d="M6 22C5.45 22 4.97917 21.8042 4.5875 21.4125C4.19583 21.0208 4 20.55 4 20V10C4 9.45 4.19583 8.97917 4.5875 8.5875C4.97917 8.19583 5.45 8 6 8H7V6C7 4.61667 7.4875 3.4375 8.4625 2.4625C9.4375 1.4875 10.6167 1 12 1C13.3833 1 14.5625 1.4875 15.5375 2.4625C16.5125 3.4375 17 4.61667 17 6V8H18C18.55 8 19.0208 8.19583 19.4125 8.5875C19.8042 8.97917 20 9.45 20 10V20C20 20.55 19.8042 21.0208 19.4125 21.4125C19.0208 21.8042 18.55 22 18 22H6ZM6 20H18V10H6V20ZM9 8H15V6C15 5.16667 14.7083 4.45833 14.125 3.875C13.5417 3.29167 12.8333 3 12 3C11.1667 3 10.4583 3.29167 9.875 3.875C9.29167 4.45833 9 5.16667 9 6V8Z" fill="#1B1D22"/>
+</svg>

ElementX/Resources/Assets.xcassets/images/user-add.imageset/Contents.json

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

ElementX/Resources/Assets.xcassets/images/user-add.imageset/user-add.svg

@@ -0,0 +1,4 @@
+<svg width="24" height="24" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg">
+<path d="M10 12C8.9 12 7.95833 11.6083 7.175 10.825C6.39167 10.0417 6 9.1 6 8C6 6.9 6.39167 5.95833 7.175 5.175C7.95833 4.39167 8.9 4 10 4C11.1 4 12.0417 4.39167 12.825 5.175C13.6083 5.95833 14 6.9 14 8C14 9.1 13.6083 10.0417 12.825 10.825C12.0417 11.6083 11.1 12 10 12ZM2 18V17.2C2 16.6333 2.14583 16.1125 2.4375 15.6375C2.72917 15.1625 3.11667 14.8 3.6 14.55C4.63333 14.0333 5.68333 13.6458 6.75 13.3875C7.81667 13.1292 8.9 13 10 13C11.1 13 12.1833 13.1292 13.25 13.3875C14.3167 13.6458 15.3667 14.0333 16.4 14.55C16.8833 14.8 17.2708 15.1625 17.5625 15.6375C17.8542 16.1125 18 16.6333 18 17.2V18C18 18.55 17.8042 19.0208 17.4125 19.4125C17.0208 19.8042 16.55 20 16 20H4C3.45 20 2.97917 19.8042 2.5875 19.4125C2.19583 19.0208 2 18.55 2 18ZM4 18H16V17.2C16 17.0167 15.9542 16.85 15.8625 16.7C15.7708 16.55 15.65 16.4333 15.5 16.35C14.6 15.9 13.6917 15.5625 12.775 15.3375C11.8583 15.1125 10.9333 15 10 15C9.06667 15 8.14167 15.1125 7.225 15.3375C6.30833 15.5625 5.4 15.9 4.5 16.35C4.35 16.4333 4.22917 16.55 4.1375 16.7C4.04583 16.85 4 17.0167 4 17.2V18ZM10 10C10.55 10 11.0208 9.80417 11.4125 9.4125C11.8042 9.02083 12 8.55 12 8C12 7.45 11.8042 6.97917 11.4125 6.5875C11.0208 6.19583 10.55 6 10 6C9.45 6 8.97917 6.19583 8.5875 6.5875C8.19583 6.97917 8 7.45 8 8C8 8.55 8.19583 9.02083 8.5875 9.4125C8.97917 9.80417 9.45 10 10 10Z" fill="#1B1D22"/>
+<path d="M17 11H19V13C19 13.2833 19.0958 13.5208 19.2875 13.7125C19.4792 13.9042 19.7167 14 20 14C20.2833 14 20.5208 13.9042 20.7125 13.7125C20.9042 13.5208 21 13.2833 21 13V11H23C23.2833 11 23.5208 10.9042 23.7125 10.7125C23.9042 10.5208 24 10.2833 24 10C24 9.71667 23.9042 9.47917 23.7125 9.2875C23.5208 9.09583 23.2833 9 23 9H21V7C21 6.71667 20.9042 6.47917 20.7125 6.2875C20.5208 6.09583 20.2833 6 20 6C19.7167 6 19.4792 6.09583 19.2875 6.2875C19.0958 6.47917 19 6.71667 19 7V9H17C16.7167 9 16.4792 9.09583 16.2875 9.2875C16.0958 9.47917 16 9.71667 16 10C16 10.2833 16.0958 10.5208 16.2875 10.7125C16.4792 10.9042 16.7167 11 17 11Z" fill="#1B1D22"/>
+</svg>

ElementX/Resources/Assets.xcassets/images/user.imageset/Contents.json

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

ElementX/Resources/Assets.xcassets/images/user.imageset/user.svg

@@ -0,0 +1,3 @@
+<svg width="24" height="24" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg">
+<path d="M12 12C10.9 12 9.95833 11.6083 9.175 10.825C8.39167 10.0417 8 9.1 8 8C8 6.9 8.39167 5.95833 9.175 5.175C9.95833 4.39167 10.9 4 12 4C13.1 4 14.0417 4.39167 14.825 5.175C15.6083 5.95833 16 6.9 16 8C16 9.1 15.6083 10.0417 14.825 10.825C14.0417 11.6083 13.1 12 12 12ZM4 18V17.2C4 16.6333 4.14583 16.1125 4.4375 15.6375C4.72917 15.1625 5.11667 14.8 5.6 14.55C6.63333 14.0333 7.68333 13.6458 8.75 13.3875C9.81667 13.1292 10.9 13 12 13C13.1 13 14.1833 13.1292 15.25 13.3875C16.3167 13.6458 17.3667 14.0333 18.4 14.55C18.8833 14.8 19.2708 15.1625 19.5625 15.6375C19.8542 16.1125 20 16.6333 20 17.2V18C20 18.55 19.8042 19.0208 19.4125 19.4125C19.0208 19.8042 18.55 20 18 20H6C5.45 20 4.97917 19.8042 4.5875 19.4125C4.19583 19.0208 4 18.55 4 18ZM6 18H18V17.2C18 17.0167 17.9542 16.85 17.8625 16.7C17.7708 16.55 17.65 16.4333 17.5 16.35C16.6 15.9 15.6917 15.5625 14.775 15.3375C13.8583 15.1125 12.9333 15 12 15C11.0667 15 10.1417 15.1125 9.225 15.3375C8.30833 15.5625 7.4 15.9 6.5 16.35C6.35 16.4333 6.22917 16.55 6.1375 16.7C6.04583 16.85 6 17.0167 6 17.2V18ZM12 10C12.55 10 13.0208 9.80417 13.4125 9.4125C13.8042 9.02083 14 8.55 14 8C14 7.45 13.8042 6.97917 13.4125 6.5875C13.0208 6.19583 12.55 6 12 6C11.45 6 10.9792 6.19583 10.5875 6.5875C10.1958 6.97917 10 7.45 10 8C10 8.55 10.1958 9.02083 10.5875 9.4125C10.9792 9.80417 11.45 10 12 10Z" fill="#1B1D22"/>
+</svg>

ElementX/Resources/Localizations/en.lproj/Localizable.strings

@@ -314,8 +314,8 @@
 "screen_bug_report_contact_me" = "You may contact me if you have any follow up questions.";
 "screen_bug_report_contact_me_title" = "Contact me";
 "screen_bug_report_edit_screenshot" = "Edit screenshot";
-"screen_bug_report_editor_description" = "Please describe the bug. What did you do? What did you expect to happen? What actually happened. Please go into as much detail as you can.";
-"screen_bug_report_editor_placeholder" = "Describe the bug…";
+"screen_bug_report_editor_description" = "Please describe the problem. What did you do? What did you expect to happen? What actually happened. Please go into as much detail as you can.";
+"screen_bug_report_editor_placeholder" = "Describe the problem…";
 "screen_bug_report_editor_supporting" = "If possible, please write the description in English.";
 "screen_bug_report_include_crash_logs" = "Send crash logs";
 "screen_bug_report_include_logs" = "Allow logs";

ElementX/Sources/Generated/Assets.swift

@@ -33,6 +33,7 @@ internal enum Asset {
   internal enum Images {
     internal static let appLogo = ImageAsset(name: "images/app-logo")
     internal static let serverSelectionIcon = ImageAsset(name: "images/server-selection-icon")
+    internal static let block = ImageAsset(name: "images/block")
     internal static let circle = ImageAsset(name: "images/circle")
     internal static let closeCircle = ImageAsset(name: "images/close-circle")
     internal static let addLocation = ImageAsset(name: "images/add-location")
@@ -57,6 +58,7 @@ internal enum Asset {
     internal static let textFormat = ImageAsset(name: "images/text-format")
     internal static let underline = ImageAsset(name: "images/underline")
     internal static let unindent = ImageAsset(name: "images/unindent")
+    internal static let devices = ImageAsset(name: "images/devices")
     internal static let document = ImageAsset(name: "images/document")
     internal static let decryptionError = ImageAsset(name: "images/decryption-error")
     internal static let endedPoll = ImageAsset(name: "images/ended-poll")
@@ -67,6 +69,7 @@ internal enum Asset {
     internal static let locationPin = ImageAsset(name: "images/location-pin")
     internal static let locationPointerFull = ImageAsset(name: "images/location-pointer-full")
     internal static let locationPointer = ImageAsset(name: "images/location-pointer")
+    internal static let lock = ImageAsset(name: "images/lock")
     internal static let mediaPause = ImageAsset(name: "images/media-pause")
     internal static let mediaPlay = ImageAsset(name: "images/media-play")
     internal static let secureBackupIcon = ImageAsset(name: "images/secure-backup-icon")
@@ -82,6 +85,8 @@ internal enum Asset {
     internal static let timelineEndedPoll = ImageAsset(name: "images/timeline-ended-poll")
     internal static let timelinePollAttachment = ImageAsset(name: "images/timeline-poll-attachment")
     internal static let timelinePoll = ImageAsset(name: "images/timeline-poll")
+    internal static let userAdd = ImageAsset(name: "images/user-add")
+    internal static let user = ImageAsset(name: "images/user")
     internal static let waitingGradient = ImageAsset(name: "images/waiting-gradient")
   }
 }

ElementX/Sources/Generated/Strings.swift

@@ -768,9 +768,9 @@ public enum L10n {
   public static var screenBugReportContactMeTitle: String { return L10n.tr("Localizable", "screen_bug_report_contact_me_title") }
   /// Edit screenshot
   public static var screenBugReportEditScreenshot: String { return L10n.tr("Localizable", "screen_bug_report_edit_screenshot") }
-  /// Please describe the bug. What did you do? What did you expect to happen? What actually happened. Please go into as much detail as you can.
+  /// Please describe the problem. What did you do? What did you expect to happen? What actually happened. Please go into as much detail as you can.
   public static var screenBugReportEditorDescription: String { return L10n.tr("Localizable", "screen_bug_report_editor_description") }
-  /// Describe the bug…
+  /// Describe the problem…
   public static var screenBugReportEditorPlaceholder: String { return L10n.tr("Localizable", "screen_bug_report_editor_placeholder") }
   /// If possible, please write the description in English.
   public static var screenBugReportEditorSupporting: String { return L10n.tr("Localizable", "screen_bug_report_editor_supporting") }

ElementX/Sources/Other/Extensions/CompoundIcon.swift

@@ -0,0 +1,28 @@
+//
+// Copyright 2023 New Vector Ltd
+//
+// Licensed under the Apache License, Version 2.0 (the "License");
+// you may not use this file except in compliance with the License.
+// You may obtain a copy of the License at
+//
+// http://www.apache.org/licenses/LICENSE-2.0
+//
+// Unless required by applicable law or agreed to in writing, software
+// distributed under the License is distributed on an "AS IS" BASIS,
+// WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+// See the License for the specific language governing permissions and
+// limitations under the License.
+//
+
+import Compound
+import SwiftUI
+
+extension CompoundIcon {
+    init(asset: ImageAsset) {
+        self.init(customImage: asset.swiftUIImage)
+    }
+    
+    init(asset: ImageAsset, size: CompoundIcon.Size, relativeTo font: Font) {
+        self.init(customImage: asset.swiftUIImage, size: size, relativeTo: font)
+    }
+}

ElementX/Sources/Screens/BugReportScreen/View/BugReportScreen.swift

@@ -92,7 +92,7 @@ struct BugReportScreen: View {
                 PhotosPicker(selection: $selectedScreenshot,
                              matching: .screenshots,
                              photoLibrary: .shared()) {
-                    ListLabel.default(title: photosPickerTitle, systemIcon: .camera)
+                    ListLabel.plain(title: photosPickerTitle)
                 }
             })
             .accessibilityIdentifier(A11yIdentifiers.bugReportScreen.attachScreenshot)

ElementX/Sources/Screens/ComposerToolbar/View/VoiceMessageRecordingButton.swift

@@ -45,7 +45,7 @@ struct VoiceMessageRecordingButton: View {
                     .foregroundColor(.compound.iconSecondary)
                     .scaledPadding(10, relativeTo: .title)
             case .recording:
-                CompoundIcon(customImage: Asset.Images.stopRecording.swiftUIImage, size: .medium, relativeTo: .title)
+                CompoundIcon(asset: Asset.Images.stopRecording, size: .medium, relativeTo: .title)
                     .foregroundColor(.compound.iconOnSolidPrimary)
                     .scaledPadding(6, relativeTo: .title)
                     .background(

ElementX/Sources/Screens/HomeScreen/View/HomeScreenUserMenuButton.swift

@@ -32,7 +32,7 @@ struct HomeScreenUserMenuButton: View {
                         Text(L10n.commonSettings)
                     } icon: {
                         if context.viewState.showSettingsMenuOptionBadge {
-                            CompoundIcon(customImage: Asset.Images.settingsIconWithBadge.swiftUIImage)
+                            CompoundIcon(asset: Asset.Images.settingsIconWithBadge)
                         } else {
                             CompoundIcon(\.settings)
                         }

ElementX/Sources/Screens/RoomDetailsEditScreen/View/RoomDetailsEditScreen.swift

@@ -122,7 +122,7 @@ struct RoomDetailsEditScreen: View {
     }
     
     private var avatarOverlayIcon: some View {
-        CompoundIcon(customImage: Asset.Images.editing.swiftUIImage, size: .xSmall, relativeTo: .compound.bodyLG)
+        CompoundIcon(asset: Asset.Images.editing, size: .xSmall, relativeTo: .compound.bodyLG)
             .foregroundColor(.white)
             .padding(3)
             .background {

ElementX/Sources/Screens/RoomDetailsScreen/RoomDetailsScreenModels.swift

@@ -14,9 +14,8 @@
 // limitations under the License.
 //
 
-import Foundation
+import Compound
 import SwiftUI
-import UIKit
 
 // MARK: - Coordinator
 
@@ -85,8 +84,8 @@ struct RoomDetailsScreenViewState: BindableState {
         areNotificationsMuted ? L10n.commonUnmute : L10n.commonMute
     }
     
-    var notificationShortcutButtonImage: Image {
-        areNotificationsMuted ? Image(systemName: "bell.slash.fill") : Image(systemName: "bell")
+    var notificationShortcutButtonIcon: KeyPath<CompoundIcons, Image> {
+        areNotificationsMuted ? \.notificationsOff : \.notifications
     }
 }
 

ElementX/Sources/Screens/RoomDetailsScreen/View/RoomDetailsScreen.swift

@@ -110,7 +110,7 @@ struct RoomDetailsScreen: View {
                     toggleMuteButton
                 case .share(let permalink):
                     ShareLink(item: permalink) {
-                        Image(systemName: "square.and.arrow.up")
+                        CompoundIcon(asset: Asset.Images.shareIos)
                     }
                     .buttonStyle(FormActionButtonStyle(title: L10n.actionShare))
                 }
@@ -141,7 +141,8 @@ struct RoomDetailsScreen: View {
 
     private var aboutSection: some View {
         Section {
-            ListRow(label: .default(title: L10n.commonPeople, systemIcon: .person),
+            ListRow(label: .default(title: L10n.commonPeople,
+                                    icon: CompoundIcon(asset: Asset.Images.user)),
                     details: .title(String(context.viewState.joinedMembersCount)),
                     kind: .navigationLink {
                         context.send(viewAction: .processTapPeople)
@@ -150,7 +151,7 @@ struct RoomDetailsScreen: View {
             
             if context.viewState.canInviteUsers {
                 ListRow(label: .default(title: L10n.screenRoomDetailsInvitePeopleTitle,
-                                        systemIcon: .personBadgePlus),
+                                        icon: CompoundIcon(asset: Asset.Images.userAdd)),
                         kind: .navigationLink {
                             context.send(viewAction: .processTapInvite)
                         })
@@ -159,11 +160,10 @@ struct RoomDetailsScreen: View {
         }
     }
     
-    @ViewBuilder
     private var notificationSection: some View {
         Section {
             ListRow(label: .default(title: L10n.screenRoomDetailsNotificationTitle,
-                                    systemIcon: .bell),
+                                    icon: \.notifications),
                     details: context.viewState.notificationSettingsState.isLoading ? .isWaiting(true)
                         : context.viewState.notificationSettingsState.isError ? .systemIcon(.exclamationmarkCircle)
                         : .title(context.viewState.notificationSettingsState.label),
@@ -176,7 +176,6 @@ struct RoomDetailsScreen: View {
         .disabled(context.viewState.notificationSettingsState.isLoading)
     }
     
-    @ViewBuilder
     private var toggleMuteButton: some View {
         Button {
             context.send(viewAction: .processToogleMuteNotifications)
@@ -184,20 +183,20 @@ struct RoomDetailsScreen: View {
             if context.viewState.isProcessingMuteToggleAction {
                 ProgressView()
             } else {
-                context.viewState.notificationShortcutButtonImage
+                CompoundIcon(context.viewState.notificationShortcutButtonIcon)
             }
         }
         .buttonStyle(FormActionButtonStyle(title: context.viewState.notificationShortcutButtonTitle))
         .disabled(context.viewState.isProcessingMuteToggleAction)
     }
-
+    
     @ViewBuilder
     private var securitySection: some View {
         if context.viewState.isEncrypted {
             Section {
                 ListRow(label: .default(title: L10n.screenRoomDetailsEncryptionEnabledTitle,
                                         description: L10n.screenRoomDetailsEncryptionEnabledSubtitle,
-                                        systemIcon: .lockShield,
+                                        icon: CompoundIcon(asset: Asset.Images.lock),
                                         iconAlignment: .top),
                         kind: .label)
             } header: {
@@ -209,9 +208,9 @@ struct RoomDetailsScreen: View {
 
     private var leaveRoomSection: some View {
         Section {
-            ListRow(label: .default(title: L10n.actionLeaveRoom,
-                                    systemIcon: .doorRightHandOpen,
-                                    role: .destructive),
+            ListRow(label: .action(title: L10n.actionLeaveRoom,
+                                   icon: \.leave,
+                                   role: .destructive),
                     kind: .button { context.send(viewAction: .processTapLeave) })
         }
     }
@@ -219,7 +218,7 @@ struct RoomDetailsScreen: View {
     private func ignoreUserSection(user: RoomMemberDetails) -> some View {
         Section {
             ListRow(label: .default(title: user.isIgnored ? L10n.screenDmDetailsUnblockUser : L10n.screenDmDetailsBlockUser,
-                                    systemIcon: .slashCircle,
+                                    icon: CompoundIcon(asset: Asset.Images.block),
                                     role: user.isIgnored ? nil : .destructive),
                     details: .isWaiting(context.viewState.isProcessingIgnoreRequest),
                     kind: .button {

ElementX/Sources/Screens/RoomScreen/View/Style/SwipeToReplyView.swift

@@ -21,7 +21,7 @@ struct SwipeToReplyView: View {
     let timelineItem: RoomTimelineItemProtocol
     
     var body: some View {
-        CompoundIcon(customImage: Asset.Images.reply.swiftUIImage)
+        CompoundIcon(asset: Asset.Images.reply)
             .foregroundColor(.compound.iconPrimary)
             .accessibilityHidden(true)
     }

ElementX/Sources/Screens/RoomScreen/View/Supplementary/TimelineDeliveryStatusView.swift

@@ -28,7 +28,7 @@ struct TimelineDeliveryStatusView: View {
     private var icon: CompoundIcon {
         switch deliveryStatus {
         case .sending:
-            return CompoundIcon(customImage: Asset.Images.circle.swiftUIImage, size: .xSmall, relativeTo: .compound.bodyMD)
+            return CompoundIcon(asset: Asset.Images.circle, size: .xSmall, relativeTo: .compound.bodyMD)
         case .sent:
             return CompoundIcon(\.checkCircle, size: .xSmall, relativeTo: .compound.bodyMD)
         }

ElementX/Sources/Screens/Settings/AnalyticsSettingsScreen/View/AnalyticsSettingsScreen.swift

@@ -31,8 +31,7 @@ struct AnalyticsSettingsScreen: View {
     
     var analyticsSection: some View {
         Section {
-            ListRow(label: .default(title: L10n.screenAnalyticsSettingsShareData,
-                                    systemIcon: .chartBar),
+            ListRow(label: .plain(title: L10n.screenAnalyticsSettingsShareData),
                     kind: .toggle($context.enableAnalytics))
                 .onChange(of: context.enableAnalytics) { _ in
                     context.send(viewAction: .toggleAnalytics)

ElementX/Sources/Screens/Settings/AvancedOptionsScreen/View/AdvancedSettingsScreen.swift

@@ -23,15 +23,14 @@ struct AdvancedSettingsScreen: View {
     var body: some View {
         Form {
             Section {
-                ListRow(label: .default(title: L10n.commonMessageLayout,
-                                        systemIcon: .rectangleGrid1x2),
+                ListRow(label: .plain(title: L10n.commonMessageLayout),
                         kind: .picker(selection: $context.timelineStyle,
                                       items: TimelineStyle.allCases.map { (title: $0.name, tag: $0) }))
                 
-                ListRow(label: .default(title: L10n.commonRichTextEditor, icon: Image(asset: Asset.Images.textFormat)),
+                ListRow(label: .plain(title: L10n.commonRichTextEditor),
                         kind: .toggle($context.richTextEditorEnabled))
                 
-                ListRow(label: .default(title: L10n.actionViewSource, systemIcon: .mailAndTextMagnifyingglass),
+                ListRow(label: .plain(title: L10n.actionViewSource),
                         kind: .toggle($context.viewSourceEnabled))
             }
         }

ElementX/Sources/Screens/Settings/SettingsScreen/View/SettingsScreen.swift

@@ -88,7 +88,7 @@ struct SettingsScreen: View {
             Section {
                 if !context.viewState.isSessionVerified {
                     ListRow(label: .default(title: L10n.actionCompleteVerification,
-                                            systemIcon: .checkmarkShield),
+                                            icon: \.checkCircle),
                             kind: .button { context.send(viewAction: .sessionVerification) })
                 } else if context.viewState.chatBackupEnabled {
                     ListRow(label: .default(title: L10n.commonChatBackup,
@@ -104,7 +104,8 @@ struct SettingsScreen: View {
     private var mainSection: some View {
         Section {
             if context.viewState.accountProfileURL != nil {
-                ListRow(label: .default(title: L10n.actionManageAccount, systemIcon: .person),
+                ListRow(label: .default(title: L10n.actionManageAccount,
+                                        icon: \.userProfile),
                         kind: .button {
                             context.send(viewAction: .accountProfile)
                         })
@@ -112,35 +113,35 @@ struct SettingsScreen: View {
             }
             
             ListRow(label: .default(title: L10n.screenNotificationSettingsTitle,
-                                    systemIcon: .bell),
+                                    icon: \.notifications),
                     kind: .navigationLink {
                         context.send(viewAction: .notifications)
                     })
                     .accessibilityIdentifier(A11yIdentifiers.settingsScreen.notifications)
             
             ListRow(label: .default(title: L10n.commonAnalytics,
-                                    systemIcon: .chartBar),
+                                    icon: \.polls),
                     kind: .navigationLink {
                         context.send(viewAction: .analytics)
                     })
                     .accessibilityIdentifier(A11yIdentifiers.settingsScreen.analytics)
             
             ListRow(label: .default(title: L10n.commonScreenLock,
-                                    systemIcon: .lock),
+                                    icon: CompoundIcon(asset: Asset.Images.lock)),
                     kind: .navigationLink {
                         context.send(viewAction: .appLock)
                     })
                     .accessibilityIdentifier(A11yIdentifiers.settingsScreen.screenLock)
             
             ListRow(label: .default(title: L10n.commonReportAProblem,
-                                    systemIcon: .ladybug),
+                                    icon: \.chatProblem),
                     kind: .navigationLink {
                         context.send(viewAction: .reportBug)
                     })
                     .accessibilityIdentifier(A11yIdentifiers.settingsScreen.reportBug)
             
             ListRow(label: .default(title: L10n.commonAbout,
-                                    systemIcon: .questionmarkCircle),
+                                    icon: \.info),
                     kind: .navigationLink {
                         context.send(viewAction: .about)
                     })
@@ -150,27 +151,18 @@ struct SettingsScreen: View {
     
     private var manageSessionsSection: some View {
         Section {
-            ListRow(label: .default(title: L10n.actionManageDevices, systemIcon: deviceIcon),
+            ListRow(label: .default(title: L10n.actionManageDevices,
+                                    icon: CompoundIcon(asset: Asset.Images.devices)),
                     kind: .button {
                         context.send(viewAction: .accountSessionsList)
                     })
         }
     }
     
-    private var deviceIcon: SFSymbol {
-        if ProcessInfo.processInfo.isiOSAppOnMac {
-            return .macbookAndIphone
-        } else if UIDevice.current.userInterfaceIdiom == .pad {
-            return .ipad
-        } else {
-            return .iphone
-        }
-    }
-    
     private var advancedOptionsSection: some View {
         Section {
             ListRow(label: .default(title: L10n.commonAdvancedSettings,
-                                    systemIcon: .gearshape2),
+                                    icon: \.settings),
                     kind: .navigationLink {
                         context.send(viewAction: .advancedSettings)
                     })
@@ -178,7 +170,7 @@ struct SettingsScreen: View {
             
             if context.viewState.showDeveloperOptions {
                 ListRow(label: .default(title: L10n.commonDeveloperOptions,
-                                        systemIcon: .hammerCircle),
+                                        icon: CompoundIcon(asset: Asset.Images.codeBlock)),
                         kind: .navigationLink {
                             context.send(viewAction: .developerOptions)
                         })
@@ -189,8 +181,9 @@ struct SettingsScreen: View {
     
     private var signOutSection: some View {
         Section {
-            ListRow(label: .default(title: L10n.screenSignoutPreferenceItem,
-                                    systemIcon: .rectanglePortraitAndArrowRight),
+            ListRow(label: .action(title: L10n.screenSignoutPreferenceItem,
+                                   icon: CompoundIcon(asset: Asset.Images.signOut),
+                                   role: .destructive),
                     kind: .button {
                         context.send(viewAction: .logout)
                     })

ElementX/Sources/Screens/Settings/UserDetailsEditScreen/View/UserDetailsEditScreen.swift

@@ -89,7 +89,7 @@ struct UserDetailsEditScreen: View {
     }
     
     private var avatarOverlayIcon: some View {
-        CompoundIcon(customImage: Asset.Images.editing.swiftUIImage, size: .xSmall, relativeTo: .compound.bodyLG)
+        CompoundIcon(asset: Asset.Images.editing, size: .xSmall, relativeTo: .compound.bodyLG)
             .foregroundColor(.white)
             .padding(4)
             .background {

UnitTests/Sources/RoomDetailsViewModelTests.swift

@@ -481,7 +481,7 @@ class RoomDetailsScreenViewModelTests: XCTestCase {
         _ = await context.$viewState.debounce(for: .milliseconds(100), scheduler: DispatchQueue.main).values.first()
         
         XCTAssertEqual(context.viewState.notificationShortcutButtonTitle, L10n.commonUnmute)
-        XCTAssertEqual(context.viewState.notificationShortcutButtonImage, Image(systemName: "bell.slash.fill"))
+        XCTAssertEqual(context.viewState.notificationShortcutButtonIcon, \.notificationsOff)
     }
     
     func testNotificationRoomNotMuted() async throws {
@@ -495,7 +495,7 @@ class RoomDetailsScreenViewModelTests: XCTestCase {
         try await deferred.fulfill()
         
         XCTAssertEqual(context.viewState.notificationShortcutButtonTitle, L10n.commonMute)
-        XCTAssertEqual(context.viewState.notificationShortcutButtonImage, Image(systemName: "bell"))
+        XCTAssertEqual(context.viewState.notificationShortcutButtonIcon, \.notifications)
     }
     
     func testUnmuteTappedFailure() async throws {

project.yml

@@ -49,7 +49,7 @@ packages:
     # path: ../matrix-rust-sdk
   Compound:
     url: https://github.com/vector-im/compound-ios
-    revision: 849e5beaadfb449b53a28d41cc22cf303cc9045b
+    revision: 7ae8b7ef4033861d0439427d5404538243afeffd
     # path: ../compound-ios
   AnalyticsEvents:
     url: https://github.com/matrix-org/matrix-analytics-events