From 7dae71965a89fc4afe053216b9b2f4230c3f850c Mon Sep 17 00:00:00 2001
From: Justin Edmund <justin@jedmund.com>
Date: Sat, 13 Dec 2025 20:02:18 -0800
Subject: [PATCH] extract DeleteTeamDialog component

---
 .../dialogs/DeleteTeamDialog.svelte           | 47 +++++++++++
 src/lib/components/party/Party.svelte         | 78 ++++++-------------
 2 files changed, 70 insertions(+), 55 deletions(-)
 create mode 100644 src/lib/components/dialogs/DeleteTeamDialog.svelte

diff --git a/src/lib/components/dialogs/DeleteTeamDialog.svelte b/src/lib/components/dialogs/DeleteTeamDialog.svelte
new file mode 100644
index 00000000..4a8cd8a6
--- /dev/null
+++ b/src/lib/components/dialogs/DeleteTeamDialog.svelte
@@ -0,0 +1,47 @@
+<script lang="ts">
+	import Dialog from '$lib/components/ui/Dialog.svelte'
+	import ModalHeader from '$lib/components/ui/ModalHeader.svelte'
+	import ModalBody from '$lib/components/ui/ModalBody.svelte'
+	import ModalFooter from '$lib/components/ui/ModalFooter.svelte'
+
+	interface Props {
+		open: boolean
+		partyName: string
+		deleting?: boolean
+		onDelete: () => void
+		onCancel: () => void
+	}
+
+	let { open = $bindable(), partyName, deleting = false, onDelete, onCancel }: Props = $props()
+</script>
+
+<Dialog bind:open>
+	{#snippet children()}
+		<ModalHeader title="Delete {partyName}?" />
+		<ModalBody>
+			<p class="message">Are you sure you want to permanently delete this team?</p>
+		</ModalBody>
+		<ModalFooter
+			{onCancel}
+			cancelDisabled={deleting}
+			primaryAction={{
+				label: deleting ? 'Deleting...' : 'Yes, delete',
+				onclick: onDelete,
+				destructive: true,
+				disabled: deleting
+			}}
+		/>
+	{/snippet}
+</Dialog>
+
+<style lang="scss">
+	@use '$src/themes/typography' as *;
+
+	.message {
+		margin: 0;
+		font-size: $font-regular;
+		line-height: 1.4;
+		color: var(--text-primary);
+		text-align: left;
+	}
+</style>
diff --git a/src/lib/components/party/Party.svelte b/src/lib/components/party/Party.svelte
index ca2a8601..63447ee6 100644
--- a/src/lib/components/party/Party.svelte
+++ b/src/lib/components/party/Party.svelte
@@ -63,6 +63,7 @@
 	import { transformSkillsToArray } from '$lib/utils/jobSkills'
 	import { findNextEmptySlot, SLOT_NOT_FOUND } from '$lib/utils/gridHelpers'
 	import ConflictDialog from '$lib/components/dialogs/ConflictDialog.svelte'
+	import DeleteTeamDialog from '$lib/components/dialogs/DeleteTeamDialog.svelte'
 	import type { ConflictData } from '$lib/types/api/conflict'
 	import { isConflictResponse, createConflictData } from '$lib/types/api/conflict'
 
@@ -743,9 +744,11 @@
 			transcendenceStep?: number,
 			_editKey?: string
 		) {
+			if (uncapLevel === undefined) return
 			try {
 				await updateCharacterUncap.mutateAsync({
 					id: gridCharacterId,
+					partyId: party.id,
 					partyShortcode: party.shortcode,
 					uncapLevel,
 					transcendenceStep
@@ -761,9 +764,11 @@
 			transcendenceStep?: number,
 			_editKey?: string
 		) {
+			if (uncapLevel === undefined) return
 			try {
 				await updateWeaponUncap.mutateAsync({
 					id: gridWeaponId,
+					partyId: party.id,
 					partyShortcode: party.shortcode,
 					uncapLevel,
 					transcendenceStep
@@ -779,9 +784,11 @@
 			transcendenceStep?: number,
 			_editKey?: string
 		) {
+			if (uncapLevel === undefined) return
 			try {
 				await updateSummonUncap.mutateAsync({
 					id: gridSummonId,
+					partyId: party.id,
 					partyShortcode: party.shortcode,
 					uncapLevel,
 					transcendenceStep
@@ -1021,42 +1028,26 @@
 				/>
 			</div>
 		</ModalBody>
-		<ModalFooter>
-			{#snippet children()}
-				<button class="btn-secondary" onclick={() => (editDialogOpen = false)} disabled={loading}>
-					Cancel
-				</button>
-				<button class="btn-primary" onclick={savePartyTitle} disabled={loading || !editingTitle.trim()}>
-					{loading ? 'Saving...' : 'Save'}
-				</button>
-			{/snippet}
-		</ModalFooter>
+		<ModalFooter
+			onCancel={() => (editDialogOpen = false)}
+			cancelDisabled={loading}
+			primaryAction={{
+				label: loading ? 'Saving...' : 'Save',
+				onclick: savePartyTitle,
+				disabled: loading || !editingTitle.trim()
+			}}
+		/>
 	{/snippet}
 </Dialog>
 
 <!-- Delete Confirmation Dialog -->
-<Dialog bind:open={deleteDialogOpen}>
-	{#snippet children()}
-		<ModalHeader title="Delete Party" />
-		<ModalBody>
-			<div class="delete-confirmation">
-				<p>Are you sure you want to delete this party?</p>
-				<p><strong>{party.name || 'Unnamed Party'}</strong></p>
-				<p class="warning">⚠️ This action cannot be undone.</p>
-			</div>
-		</ModalBody>
-		<ModalFooter>
-			{#snippet children()}
-				<button class="btn-secondary" onclick={() => (deleteDialogOpen = false)} disabled={deleting}>
-					Cancel
-				</button>
-				<button class="btn-danger" onclick={deleteParty} disabled={deleting}>
-					{deleting ? 'Deleting...' : 'Delete Party'}
-				</button>
-			{/snippet}
-		</ModalFooter>
-	{/snippet}
-</Dialog>
+<DeleteTeamDialog
+	bind:open={deleteDialogOpen}
+	partyName={party.name || 'Untitled'}
+	{deleting}
+	onDelete={deleteParty}
+	onCancel={() => (deleteDialogOpen = false)}
+/>
 
 <!-- Conflict Resolution Dialog -->
 <ConflictDialog
@@ -1434,27 +1425,4 @@
 		}
 	}
 
-	// Delete confirmation styles
-	.delete-confirmation {
-		display: flex;
-		flex-direction: column;
-		gap: $unit;
-		text-align: center;
-		padding: $unit 0;
-
-		p {
-			margin: 0;
-		}
-
-		strong {
-			color: var(--text-primary);
-			font-size: $font-medium;
-		}
-
-		.warning {
-			color: $error;
-			font-size: $font-small;
-			margin-top: $unit-half;
-		}
-	}
 </style>