swiftui-view-refactor

SwiftUI View Refactor

View Ordering (top to bottom)

1. Environment properties
2. private/public let constants
3. @State / other stored properties
4. Computed var (non-view)
5. init
6. body
7. Computed view builders / view helpers
8. Helper / async functions

Core Guidelines

1) Prefer MV (Model-View) Patterns

• Default to MV: views are lightweight state expressions; models/services own business logic
• Favor @State, @Environment, @Query, task, and onChange for orchestration
• Inject services and shared models via @Environment
• Split large views into smaller views instead of introducing a view model

2) Split Large Bodies

If body grows beyond a screen or has multiple logical sections, split it within this file:

var body: some View {
    VStack(alignment: .leading, spacing: 16) {
        HeaderSection(title: title, isPinned: isPinned)
        DetailsSection(details: details)
        ActionsSection(onSave: onSave, onCancel: onCancel)
    }
}

Or use computed view properties in the same file:

var body: some View {
    List {
        header
        filters
        results
        footer
    }
}

private var header: some View {
    VStack(alignment: .leading, spacing: 6) {
        Text(title).font(.title2)
        Text(subtitle).font(.subheadline)
    }
}

private var filters: some View {
    ScrollView(.horizontal, showsIndicators: false) {
        HStack {
            ForEach(filterOptions, id: \.self) { option in
                FilterChip(option: option, isSelected: option == selectedFilter)
                    .onTapGesture { selectedFilter = option }
            }
        }
    }
}

3) View Model Handling (only if already present)

• Do not introduce a view model unless the request or existing code clearly calls for one
• If a view model exists, make it non-optional when possible
• Pass dependencies to the view via init, then into the view model

@State private var viewModel: SomeViewModel

init(dependency: Dependency) {
    _viewModel = State(initialValue: SomeViewModel(dependency: dependency))
}