struct MovieList: View {
    var movies: [Movie]

    @State var index = 0
    @FocusState var selectedMovie: Int?

    var body: some View {
        VStack {
            Text(selectedMovie != nil ? "selected movie: \(selectedMovie!)" : "no movie selected")

            ScrollView(.horizontal, showsIndicators: false) {
                HStack(alignment: VerticalAlignment.center, spacing: 20) {
                    ForEach(0..<movies.count) { i in
                        MovieCard(movie: movies[i])
                            .id(i)
                            .focusable(true)
                            .focused($selectedMovie, equals: i)
                            .frame(width: getImageWidth(i), height: getImageHeight(i))
                            .animation(.easeInOut, value: selectedMovie == i)
                    }
                }
            }
        }
    }

    func getImageWidth(_ index: Int) -> CGFloat? {
        return index == selectedMovie ? 250 * 1.2 : 250
    }

    func getImageHeight(_ index: Int) -> CGFloat? {
        return index == selectedMovie ? 400 * 1.2 : 400
    }
}