feat: delete draft persona (#282)

packages/ui/src/lib/adapters/in-memory-and-ipfs/index.ts

@@ -182,6 +182,20 @@ export class InMemoryAndIPFS implements Adapter {
 		)
 	}
 
+	deleteDraftPersona(index: number): Promise<void> {
+		return new Promise((resolve) =>
+			personas.update(({ draft, ...state }) => {
+				const newDraft = draft.filter((_, i) => i !== index)
+
+				saveToLocalStorage('drafts', newDraft)
+
+				resolve()
+
+				return { ...state, draft: newDraft }
+			}),
+		)
+	}
+
 	async publishPersona(draftPersona: DraftPersona, signer: Signer): Promise<void> {
 		await signer.signMessage('This "transaction" publishes persona')
 

packages/ui/src/lib/adapters/index.ts

@@ -18,6 +18,7 @@ export interface Adapter {
 	removePersonaFromFavorite: (groupId: string, persona?: Persona) => Promise<void>
 	addPersonaDraft: (draftPersona: DraftPersona) => Promise<number>
 	updatePersonaDraft: (index: number, draftPersona: DraftPersona) => Promise<void>
+	deleteDraftPersona: (index: number) => Promise<void>
 	publishPersona(draftPersona: DraftPersona, signer: Signer): Promise<void>
 
 	uploadPicture(picture: string): Promise<string>

packages/ui/src/lib/adapters/zkitter/index.ts

@@ -96,6 +96,20 @@ export class ZkitterAdapter implements Adapter {
 		)
 	}
 
+	deleteDraftPersona(index: number): Promise<void> {
+		return new Promise((resolve) =>
+			personas.update(({ draft, ...state }) => {
+				const newDraft = draft.filter((_, i) => i !== index)
+
+				saveToLocalStorage('drafts', newDraft)
+
+				resolve()
+
+				return { ...state, draft: newDraft }
+			}),
+		)
+	}
+
 	async publishPersona(draftPersona: DraftPersona, signer: Signer): Promise<void> {
 		// FIXME: properly implement
 		console.error('NOT IMPLEMENTED', 'publishPersona')

packages/ui/src/routes/persona/draft/[id]/+page.svelte

@@ -57,6 +57,7 @@
 		| 'done'
 
 	let showWarningDiscardModal = false
+	let showWarningDeletePersona = false
 
 	const setState = (newState: State) => {
 		state = newState
@@ -119,6 +120,33 @@
 			</svelte:fragment>
 		</InfoBox>
 	</InfoScreen>
+{:else if showWarningDeletePersona}
+	<InfoScreen title="Delete persona">
+		<InfoBox>
+			<div class="icon">
+				<Info size={32} />
+			</div>
+			<h2>Are you sure you want to delete this draft persona?</h2>
+			<LearnMore href="/" />
+			<svelte:fragment slot="buttons">
+				<Button
+					icon={Checkmark}
+					variant="primary"
+					label="Yes, delete persona"
+					on:click={() => {
+						adapter.deleteDraftPersona(personaIndex)
+						goto(ROUTES.HOME)
+					}}
+				/>
+				<Button
+					variant="secondary"
+					label="No, keep it"
+					icon={Undo}
+					on:click={() => (showWarningDeletePersona = false)}
+				/>
+			</svelte:fragment>
+		</InfoBox>
+	</InfoScreen>
 {:else if postToDelete !== undefined}
 	<InfoScreen title="Delete seed post">
 		<InfoBox>
@@ -201,8 +229,8 @@
 				/>
 			{/if}
 		</svelte:fragment>
+		<svelte:fragment slot="button_other">
 			<Button
-			slot="button_other"
 				variant="secondary"
 				label="Edit Persona details"
 				icon={EditPersona}
@@ -214,6 +242,12 @@
 					setState('edit_text')
 				}}
 			/>
+			<Button
+				variant="secondary"
+				icon={TrashCan}
+				on:click={() => (showWarningDeletePersona = true)}
+			/>
+		</svelte:fragment>
 		<Divider />
 		<Container>
 			<InfoBox>