From 98c58af3be69db0b037436579dccfbfe89060cf2 Mon Sep 17 00:00:00 2001
From: daedalus <44623501+ComfortablyCoding@users.noreply.github.com>
Date: Wed, 7 Feb 2024 16:11:32 -0500
Subject: [PATCH] Fix manual flow dialog showing above select item drawer
 (#21361)

---
 .changeset/breezy-moose-think.md                         | 5 +++++
 app/src/components/v-dialog.vue                          | 4 ++++
 app/src/views/private/components/flow-sidebar-detail.vue | 2 +-
 3 files changed, 10 insertions(+), 1 deletion(-)
 create mode 100644 .changeset/breezy-moose-think.md

diff --git a/.changeset/breezy-moose-think.md b/.changeset/breezy-moose-think.md
new file mode 100644
index 0000000000..1814c9ac7f
--- /dev/null
+++ b/.changeset/breezy-moose-think.md
@@ -0,0 +1,5 @@
+---
+'@directus/app': patch
+---
+
+Fixed manual flow dialog showing above select item drawer
diff --git a/app/src/components/v-dialog.vue b/app/src/components/v-dialog.vue
index 34705b7112..69d2103679 100644
--- a/app/src/components/v-dialog.vue
+++ b/app/src/components/v-dialog.vue
@@ -105,6 +105,10 @@ function nudge() {
 	z-index: 600;
 }
 
+.container.center:has(.manual-flow-card) {
+	z-index: 500;
+}
+
 .container.center.nudge > :slotted(*:not(:first-child)) {
 	animation: nudge 200ms;
 }
diff --git a/app/src/views/private/components/flow-sidebar-detail.vue b/app/src/views/private/components/flow-sidebar-detail.vue
index 25c8fc1628..68237fef52 100644
--- a/app/src/views/private/components/flow-sidebar-detail.vue
+++ b/app/src/views/private/components/flow-sidebar-detail.vue
@@ -181,7 +181,7 @@ const runManualFlow = async (flowId: string) => {
 		</div>
 
 		<v-dialog :model-value="!!confirmRunFlow" @esc="resetConfirm">
-			<v-card>
+			<v-card class="manual-flow-card">
 				<template v-if="confirmDetails">
 					<v-card-title>{{ confirmDetails.description ?? t('run_flow_confirm') }}</v-card-title>