Better syntax when using shared resources in SwiftUI

[alobaili]

Hello everyone,

I wanted to share a technique to make using moko resources in SwiftUI more readable using Swift's KeyPath.

I created this Swift file in my iOS project to contain the helper code, currently I'm only using strings and colors, I can already see myself using these a helper file like this in all my projects.

I'm assuming that the shared module is called shared and the resources module is called SharedRes.

KMPHelpers.swift

import shared
import SwiftUI

// Globals to access colors and strings conveniently.
fileprivate let strings = SharedRes.strings.shared
fileprivate let colors = SharedRes.colors.shared

extension StringProtocol where Self == String {
    static func shared(_ resource: KeyPath<SharedRes.strings, shared.StringResource>) -> String {
        strings[keyPath: resource].desc().localized()
    }
}

extension Text {
    init(_ resource: KeyPath<SharedRes.strings, shared.StringResource>) {
        self.init(verbatim: .shared(resource))
    }
}

struct SharedShapeStyle: ShapeStyle {
    let color: SwiftUI.Color

    init(_ resource: KeyPath<SharedRes.colors, shared.ColorResource>) {
        color = Color(colors[keyPath: resource].getUIColor())
    }

    func resolve(in environment: EnvironmentValues) -> some ShapeStyle {
        color
    }
}

extension ShapeStyle where Self == SharedShapeStyle {
    static func shared(_ resource: KeyPath<SharedRes.colors, shared.ColorResource>) -> SharedShapeStyle {
        SharedShapeStyle(resource)
    }
}

This will allow you to initialize Text and use the foregroundStyle or any modifier that take ShapeStyle by passing a KeyPath to the string or color resource. You don't even have to import shared!

import SwiftUI

struct ContentView: View {
    var body: some View {
       VStack {
            // Use `some_text` from shared moko resources.
            Text(\.some_text)

            // Use `some_button_title` from shared moko resources.
            Button(.shared(\.some_button_title)) {

            }

            // Use `some_color` and `some_background_color` from shared moko resources.
            Text(\.some_text)
                .foregroundStyle(.shared(\.some_color))
                .background(.shared(\.some_background_color))
        }
    }
}

Let me know what you think! Can we somehow expand this or integrate it in mako-resources so that everyone can have convenience helpers similar to this? Otherwise, feel free to share any helper code that can make using moko-resources in SwiftUI more readable.