fix(ui): scroll a wide code preview instead of widening its modal

frontend/src/lib/components/DBTableEditor.svelte

@@ -503,7 +503,7 @@
 		{/if}
 		{#if askingForConfirmation?.codeContent}
 			<div
-				class="bg-surface-secondary border border-surface-selected rounded-md p-2 relative group"
+				class="bg-surface-secondary border border-surface-selected rounded-md p-2 relative group min-w-0"
 			>
 				<button
 					class="absolute top-2 right-2 opacity-0 group-hover:opacity-100 transition-opacity p-1 rounded hover:bg-surface-hover"
@@ -512,9 +512,7 @@
 				>
 					<ClipboardCopy size={14} />
 				</button>
-				<pre class="whitespace-pre-wrap text-sm"
-					><code>{askingForConfirmation.codeContent}</code></pre
-				>
+				<pre class="overflow-x-auto text-sm"><code>{askingForConfirmation.codeContent}</code></pre>
 			</div>
 		{/if}
 	</ConfirmationModal>

frontend/src/lib/components/common/confirmationModal/ConfirmationModal.svelte

@@ -175,7 +175,7 @@
 									<Icon class={theme[type].classes.icon} />
 								</div>
 							{/if}
-							<div class={twMerge('ml-0 text-left flex-1 ', showIcon ? 'ml-4' : '')}>
+							<div class={twMerge('ml-0 text-left flex-1 min-w-0', showIcon ? 'ml-4' : '')}>
 								<h3 class="text-lg font-medium text-primary">
 									{title}
 								</h3>

frontend/src/lib/components/datatableAcl/PgGrantBuilder.svelte

@@ -87,6 +87,6 @@
 		</Button>
 	</div>
 	{#if statement}
-		<pre class="text-2xs text-tertiary whitespace-pre-wrap">{statement}</pre>
+		<pre class="text-2xs text-tertiary overflow-x-auto">{statement}</pre>
 	{/if}
 </div>

frontend/src/lib/components/workspaceSettings/DataTablePermissionsButton.svelte

@@ -382,7 +382,7 @@
 		onConfirmed={apply}
 		onCanceled={() => (preview = undefined)}
 	>
-		<div class="flex flex-col gap-3">
+		<div class="flex flex-col gap-3 min-w-0">
 			{#each preview?.warnings ?? [] as warning}
 				<Alert type="warning" title="Warning" size="xs">{warning}</Alert>
 			{/each}
@@ -394,8 +394,7 @@
 				<span class="text-sm text-secondary">
 					The following runs against <span class="font-mono">{datatable}</span> in a single transaction:
 				</span>
-				<pre
-					class="whitespace-pre-wrap overflow-y-auto text-xs bg-surface-secondary p-3 rounded select-all max-h-80"
+				<pre class="overflow-auto text-xs bg-surface-secondary p-3 rounded select-all max-h-80"
 					>{preview.statements.join('\n')}</pre
 				>
 			{/if}