diff --git a/ElementX/Resources/Assets.xcassets/images/home/settings-icon-with-badge.imageset/Contents.json b/ElementX/Resources/Assets.xcassets/images/home/settings-icon-with-badge.imageset/Contents.json
new file mode 100644
index 000000000..ce09911da
--- /dev/null
+++ b/ElementX/Resources/Assets.xcassets/images/home/settings-icon-with-badge.imageset/Contents.json
@@ -0,0 +1,25 @@
+{
+ "images" : [
+ {
+ "filename" : "settings-icon-with-badge-light 1.svg",
+ "idiom" : "universal"
+ },
+ {
+ "appearances" : [
+ {
+ "appearance" : "luminosity",
+ "value" : "dark"
+ }
+ ],
+ "filename" : "settings-icon-with-badge-dark 1.svg",
+ "idiom" : "universal"
+ }
+ ],
+ "info" : {
+ "author" : "xcode",
+ "version" : 1
+ },
+ "properties" : {
+ "preserves-vector-representation" : true
+ }
+}
diff --git a/ElementX/Resources/Assets.xcassets/images/home/settings-icon-with-badge.imageset/settings-icon-with-badge-dark 1.svg b/ElementX/Resources/Assets.xcassets/images/home/settings-icon-with-badge.imageset/settings-icon-with-badge-dark 1.svg
new file mode 100644
index 000000000..b921ea8df
--- /dev/null
+++ b/ElementX/Resources/Assets.xcassets/images/home/settings-icon-with-badge.imageset/settings-icon-with-badge-dark 1.svg
@@ -0,0 +1,4 @@
+
diff --git a/ElementX/Resources/Assets.xcassets/images/home/settings-icon-with-badge.imageset/settings-icon-with-badge-light 1.svg b/ElementX/Resources/Assets.xcassets/images/home/settings-icon-with-badge.imageset/settings-icon-with-badge-light 1.svg
new file mode 100644
index 000000000..814c2c104
--- /dev/null
+++ b/ElementX/Resources/Assets.xcassets/images/home/settings-icon-with-badge.imageset/settings-icon-with-badge-light 1.svg
@@ -0,0 +1,4 @@
+
diff --git a/ElementX/Sources/Generated/Assets.swift b/ElementX/Sources/Generated/Assets.swift
index 5e264c8fb..dc72a70ea 100644
--- a/ElementX/Sources/Generated/Assets.swift
+++ b/ElementX/Sources/Generated/Assets.swift
@@ -61,6 +61,7 @@ internal enum Asset {
internal static let decryptionError = ImageAsset(name: "images/decryption-error")
internal static let endedPoll = ImageAsset(name: "images/ended-poll")
internal static let compose = ImageAsset(name: "images/compose")
+ internal static let settingsIconWithBadge = ImageAsset(name: "images/settings-icon-with-badge")
internal static let launchBackground = ImageAsset(name: "images/launch-background")
internal static let locationMarker = ImageAsset(name: "images/location-marker")
internal static let locationPin = ImageAsset(name: "images/location-pin")
diff --git a/ElementX/Sources/Screens/HomeScreen/View/HomeScreenUserMenuButton.swift b/ElementX/Sources/Screens/HomeScreen/View/HomeScreenUserMenuButton.swift
index 0f0c083a1..9b9462100 100644
--- a/ElementX/Sources/Screens/HomeScreen/View/HomeScreenUserMenuButton.swift
+++ b/ElementX/Sources/Screens/HomeScreen/View/HomeScreenUserMenuButton.swift
@@ -14,6 +14,7 @@
// limitations under the License.
//
+import Compound
import SwiftUI
struct HomeScreenUserMenuButton: View {
@@ -31,7 +32,11 @@ struct HomeScreenUserMenuButton: View {
Label {
Text(L10n.commonSettings)
} icon: {
- settingsIconImage
+ if context.viewState.showSettingsMenuOptionBadge {
+ CompoundIcon(customImage: Asset.Images.settingsIconWithBadge.swiftUIImage)
+ } else {
+ CompoundIcon(\.settings)
+ }
}
}
.accessibilityIdentifier(A11yIdentifiers.homeScreen.settings)
@@ -74,24 +79,4 @@ struct HomeScreenUserMenuButton: View {
}
.accessibilityLabel(L10n.a11yUserMenu)
}
-
- // MARK: - Private
-
- /// Menu doesn't render composed views. Trick it into showing a badge.
- private var settingsIconImage: Image? {
- let settingsIcon = Image(systemSymbol: .gearshape)
- .resizable()
- .frame(width: 100, height: 100)
- .overlayBadge(40, isBadged: context.viewState.showSettingsMenuOptionBadge)
- .colorScheme(colorScheme)
- .padding()
-
- let renderer = ImageRenderer(content: settingsIcon)
-
- guard let image = renderer.uiImage else {
- return nil
- }
-
- return Image(uiImage: image)
- }
}