I have a menu overlapping the tabbar, which is fine, but the DragGesture() doesnt seem to work, the problem is when the menu has been draged for 100 frames, it just dissapers instead of dissapering with animation. And the reason for this is because its on top of the tabbar. So my question is, how can i keep the menu of top of the tabbar, but fix the animation?

struct ContentView: View {

    // To close menu
    @ObservedObject var showMenu2 = profileMenuManager.global

    @State var viewState = CGSize.zero
    var body: some View {
        let drag = DragGesture()
            .onEnded{
                self.viewState = .zero
                if $0.translation.height > 100 {
                    withAnimation {
                        self.viewState = .zero
                        self.showMenu2.showMenuView = false
                    }
                }
        }.onChanged{value in self.viewState = value.translation}

        return GeometryReader { geometry in
            ZStack(alignment: .bottom){
                // Selection determains default tab
                Tabbar()
                if self.showMenu2.showMenuView == true {
                    profileMenuView()
                        .frame(height: geometry.size.height/2, alignment: .bottom)
                        .transition(.move(edge: .bottom)).animation(.default)
                        .offset(y: 80)
                        .offset(y: self.viewState.height)
                }
            }.gesture(drag)
        }
    }
}