This is main view of our app

ContentView.swift

struct ContentView: View {
    
    @ObservedObject var vm = VoiceViewModel()
    @State private var showingList = false
    @State private var showingAlert = false
    
    var body: some View {
        
        ZStack{
            
            Image("back")
                .resizable()
                .scaledToFill()
                .edgesIgnoringSafeArea(.all)
                
            
            VStack{
                HStack{
                    Button(action: {
                        showingAlert = true
                    }) {
                        Image(systemName: "info.circle.fill")
                            .foregroundColor(.white)
                            .font(.system(size: 20, weight: .bold))
                    }.alert(isPresented: $showingAlert) {
                        Alert(title: Text("Hi There !"), message: Text("Use CO-Voice to Learn the code and Implementations . Enjoy the Code and ask me anything on my socials media"), dismissButton: .default(Text("Got it")))
                    }
                    
                    Spacer()
                    
                    Text("CO-Voice")
                        .foregroundColor(.white)
                        .font(.system(size: 20 , weight : .bold))
                    
                    Spacer()
                    
                    Button(action: {
                        if vm.isRecording == true {
                            vm.stopRecording()
                        }
                        vm.fetchAllRecording()
                        showingList.toggle()
                    }) {
                        Image(systemName: "list.bullet")
                            .foregroundColor(.white)
                            .font(.system(size: 20, weight: .bold))
                    }.sheet(isPresented: $showingList, content: {
                        recordingListView()
                    })
                    
                }
                
                Spacer()
                
                if vm.isRecording {
                    
                    VStack(alignment : .leading , spacing : -5){
                        HStack (spacing : 3) {
                            Image(systemName: vm.isRecording && vm.toggleColor ? "circle.fill" : "circle")
                                .font(.system(size:10))
                                .foregroundColor(.red)
                            Text("Rec")
                        }
                        Text(vm.timer)
                            .font(.system(size:60))
                            .foregroundColor(.white)
                    }
                    
                } else {
                    
                    Text("Press the Recording Button below")
                        .foregroundColor(.white)
                        .fontWeight(.bold)
                    Text("and Stop when its done")
                        .foregroundColor(.white)
                        .fontWeight(.bold)
                    
                }
                
                Spacer()
                Spacer()
                
                ZStack {
                    
                    Circle()
                        .fill(Color(#colorLiteral(red: 0.8782673327, green: 0.8782673327, blue: 0.8782673327, alpha: 1)))
                        .frame(width: 70, height: 70)
                    
                    Button(action: {
                        
                        if vm.isRecording == true {
                            vm.stopRecording()
                        } else {
                            vm.startRecording()
                        }
                    }) {
                        Image(systemName: vm.isRecording ? "stop.circle.fill" : "mic.circle.fill")
                            .foregroundColor(.red)
                            .font(.system(size: 45))
                    }
                }
                
                Spacer()
                
            }
            .padding(.leading,25)
            .padding(.trailing,25)
            .padding(.top , 70)
            
        }
   
    }
}