SwiftUI animation "rollback" issue

I have an animation depending on a range. When the end is reached the value is reseted to 0. Unfortunately I get a "rollback" animation which looks very bad but I have no idea how to handle it. Here is a sample code:

import SwiftUI

let clockTimer = Timer.publish(every: 1, on: .main, in: .common).autoconnect()

struct ContentView: View {
    static func getSecond(_ d : Date) -> Int {
        let dc = Calendar.current.dateComponents([.second], from: d)
        guard let s = dc.second else {
            fatalError("Can't get value!")
        }
        return s
    }
    
    @State var s = ContentView.getSecond(Date())
    var body: some View {
        ZStack {
            Rectangle()
                .fill(.white)
                .frame(width: 200.0, height: 200.0)
            Rectangle()
                .fill(.red)
                .frame(width: 80.0, height: 1.5, alignment: .center)
                .offset(CGSize(width: 50, height: 0))
                .rotationEffect(Angle(degrees: 360.0 / 60.0 * Double(s) - 90.0))
                .animation(.smooth, value: s)
        }
        .onReceive(clockTimer) { currentDate in
            s = ContentView.getSecond(currentDate)
        }
    }
}

#Preview {
    ContentView()
}

Any clue how to solve this issue?

SwiftUI animation "rollback" issue
 
 
Q