stack update from stkusr:nok

struct Option: Hashable, Identifiable {
    // Identifier for Option !! MUST be unique
    let id: Int
    let title: String
    let imageName: String
}
struct ContentView: View {
    @State var currentOption: Int = 0

    let options: [Option] = [
        .init(id: 1, title: "DART Meadow", imageName: "sun.max.fill"),
        .init(id: 2, title: "Research", imageName: "flame"),
        .init(id: 3, title: "Navigation", imageName: "moon.stars.fill"),
        .init(id: 4, title: "Shelf", imageName: "archivebox"),
        .init(id: 5, title: "Chest", imageName: "shippingbox"),
        .init(id: 6, title: "Crate", imageName: "bonjour"),
        .init(id: 7, title: "Manufactoring", imageName: "gear"),
        .init(id: 8, title: "Warehouse", imageName: "archivebox.fill"),
        .init(id: 9, title: "Journal", imageName: "note.text"),


    ]

    var body: some View {


        VStack(alignment: .leading) {
            HStack(alignment: .top) {

                NavigationView{
                    ListView(options: options, currentSelection: $currentOption)

                    switch (currentOption) {

                    case 1:

                        MainView()

                    case 2:
                        ScrollView( .vertical) {
                            OrbitNodeView()
                            Content2View()
                        }
                    case 3:
                        ScrollView( .vertical) {
                            ATM26NodeView()
                        }
                    case 4:
                        ScrollView( .vertical) {
                            NozzleNodeView()
                        }
                    case 5:
                        ScrollView( .vertical) {
                            Text("Chest")
                                .font(.largeTitle)
                                .bold()
                                .colorInvert()
                                .padding(.top, 60)
                        }
                    case 6:
                        ScrollView( .vertical) {
                            Text("Crate")
                                .font(.largeTitle)
                                .bold()
                                .colorInvert()
                                .padding(.top, 60)
                        }
                    case 7:
                        ScrollView( .vertical) {
                            Text("Manufactoring")
                                .font(.largeTitle)
                                .bold()
                                .colorInvert()
                                .padding(.top, 60)
                        }
                    case 8:
                        ScrollView( .vertical) {
                            Text("Warehouse")
                                .font(.largeTitle)
                                .bold()
                                .colorInvert()
                                .padding(.top, 60)
                        }
                    case 9:
                        WebView()
                    default:

                        MainView()
                    }

                }.background(Color.white)

            }
        }
        Spacer()
    }
}




struct MainView: View {

    var body: some View{
        VStack(alignment: .leading) {
            HStack(alignment: .bottom) {


                Image("CotharticrenArcLakeWhiteW900")
                    .shadow(radius: 6)

            }
        }.frame(width: 900, height: 800, alignment: .center)
            .background(Color.white)

        Spacer()


    }

}

struct ListView: View {
    let options: [Option]
    @Binding var currentSelection: Int

    var body: some View{
        VStack(alignment: .leading) {
            HStack(alignment: .top) {
                HStack(alignment: .top) {
                    VStack(alignment: .trailing) {
                        Circle()
                            .stroke(Color.init(red: 0.9, green: 0.95, blue: 0.2, opacity: 1), lineWidth: 2)
                            .alignmentGuide(HorizontalAlignment.myAlignment)
                        { d in d[.leading] }
                        .alignmentGuide(VerticalAlignment.myAlignment)
                        { d in d[.bottom] }
                        .frame(width: 50, height: 50)

                        Circle()
                            .stroke(Color.init(red: 0.25, green: 0.9, blue: 0.2, opacity: 1), lineWidth: 2)
                            .alignmentGuide(HorizontalAlignment.myAlignment)
                        { d in d[.leading] }
                        .alignmentGuide(VerticalAlignment.myAlignment)
                        { d in d[.bottom] }
                        .frame(width: 25, height: 25)
                        VStack(alignment: .leading) {
                            Circle()
                                .stroke(Color.init(red: 0.1, green: 0.1, blue: 1, opacity: 1), lineWidth: 2)
                                .alignmentGuide(HorizontalAlignment.myAlignment)
                            { d in d[.leading] }
                            .alignmentGuide(VerticalAlignment.myAlignment)
                            { d in d[.bottom] }
                            .frame(width: 75, height: 75)
                        }
                    }
                }

                HStack(alignment: .top) {
                    Image("DARTMeadowCSMwidthArtemis2by1")

                        .shadow(radius: 3)
                        .padding(.top, 10)
                }


                .padding(.top, 20)


                .padding(.trailing, 10)
            }.padding(.top, 20).padding(.leading, 10)

            HStack(alignment: .center) {
                VStack(alignment: .center) {

                    Image("arrow300")
                    HStack(alignment: .center) {
                        Text("You've never plotted an Edge?")
                    }
                }
            }.shadow(radius: 3)

            //Menu
            VStack(alignment: .leading) {
                ForEach(options, id: \.self) {option in
                    HStack {
                        Image(systemName: option.imageName)
                            .frame(width: 20)

                        Text(option.title)
                        // Don't even have to use current = options[currentSelection] anymore:
                            .foregroundColor(currentSelection == option.id ? .accentColor : .primary)
                    }
                    .padding(8)
                    .onTapGesture {
                        // Set the currentSelection to the ID of the option
                        currentSelection = option.id
                    }
                }
            }

        }.frame(width: 200, height: 800, alignment: .center)




    }
}

struct WebView: View {

    var body: some View{
        VStack(alignment: .center) {
            Text("Journal")
                .font(.largeTitle)
                .bold()
                .colorInvert()
                .padding(.top, 60)
            HStack(alignment: .bottom) {


                Image("articrenmeadowopacity")
                    .shadow(radius: 3)
            }
        }.frame(width: 900, height: 800, alignment: .center)
            .background(Color.white)

        Spacer()
    }

}