From 3c8659349f4e08d1788f9456f22341bcbd0c6b2b Mon Sep 17 00:00:00 2001
From: Daniel Karbach <daniel.karbach@localhorst.tv>
Date: Wed, 14 Jan 2026 11:46:38 +0100
Subject: [PATCH] delete episode

---
 app/Http/Controllers/EpisodeController.php    |  7 ++
 app/Policies/EpisodePolicy.php                |  2 +-
 .../js/components/episodes/DeleteDialog.jsx   | 73 +++++++++++++++++++
 resources/js/components/episodes/Dialog.jsx   |  3 +
 .../js/components/episodes/Form/index.jsx     |  7 ++
 resources/js/hooks/episodes.jsx               | 37 ++++++++++
 resources/js/i18n/de.js                       |  4 +
 resources/js/i18n/en.js                       |  4 +
 resources/sass/episodes.scss                  | 12 ++-
 9 files changed, 144 insertions(+), 5 deletions(-)
 create mode 100644 resources/js/components/episodes/DeleteDialog.jsx

diff --git a/app/Http/Controllers/EpisodeController.php b/app/Http/Controllers/EpisodeController.php
index 9711849..3e529c7 100644
--- a/app/Http/Controllers/EpisodeController.php
+++ b/app/Http/Controllers/EpisodeController.php
@@ -24,6 +24,13 @@ class EpisodeController extends Controller {
 		return $episode->toArray();
 	}
 
+	public function delete(Request $request, Episode $episode) {
+		$this->authorize('delete', $episode);
+		$episode->callOff();
+		$episode->delete();
+		return $episode->toArray();
+	}
+
 	public function update(Request $request, Episode $episode) {
 		$this->authorize('update', $episode);
 		$validatedEpisode = $this->validateEpisode($request);
diff --git a/app/Policies/EpisodePolicy.php b/app/Policies/EpisodePolicy.php
index 1996d21..6216094 100644
--- a/app/Policies/EpisodePolicy.php
+++ b/app/Policies/EpisodePolicy.php
@@ -64,7 +64,7 @@ class EpisodePolicy
 	 */
 	public function delete(User $user, Episode $episode)
 	{
-		return false;
+		return $user->isEventAdmin($episode->event);
 	}
 
 	/**
diff --git a/resources/js/components/episodes/DeleteDialog.jsx b/resources/js/components/episodes/DeleteDialog.jsx
new file mode 100644
index 0000000..0ea0021
--- /dev/null
+++ b/resources/js/components/episodes/DeleteDialog.jsx
@@ -0,0 +1,73 @@
+import PropTypes from 'prop-types';
+import React from 'react';
+import { Alert, Button, Modal } from 'react-bootstrap';
+import { useTranslation } from 'react-i18next';
+
+import Players from './Players';
+
+const Dialog = ({
+	episode,
+	onHide,
+	onSubmit,
+	show,
+}) => {
+	const { t } = useTranslation();
+
+	return <Modal className="episode-delete-dialog" onHide={onHide} show={show} size="lg">
+		<Modal.Header closeButton>
+			<Modal.Title>
+				{t('episodes.delete')}
+			</Modal.Title>
+		</Modal.Header>
+		<Modal.Body>
+			{episode.title || episode.event ?
+				<h4 className="episode-title fs-5 fs-md-4">
+					{!episode.confirmed ?
+						<span>{`${t('episodes.unconfirmed')} `}</span>
+					: null}
+					<span>{episode.title || episode.event.title}</span>
+				</h4>
+			: null}
+			<p>{t('episodes.startTime', { date: new Date(episode.start) })}</p>
+			{episode.comment ?
+				<p className="episode-comment">
+					{episode.comment}
+				</p>
+			: null}
+			{episode.players && episode.players.length ?
+				<Players players={episode.players} />
+			: null}
+			<Alert variant="warning">
+				{t('episodes.deleteQuestion')}
+			</Alert>
+		</Modal.Body>
+		<Modal.Footer>
+			<Button onClick={onHide} variant="secondary">
+				{t('button.cancel')}
+			</Button>
+			<Button onClick={onSubmit} variant="danger">
+				{t('button.delete')}
+			</Button>
+		</Modal.Footer>
+	</Modal>;
+};
+
+Dialog.propTypes = {
+	episode: PropTypes.shape({
+		comment: PropTypes.string,
+		confirmed: PropTypes.bool,
+		event: PropTypes.shape({
+			title: PropTypes.string,
+		}),
+		id: PropTypes.number,
+		players: PropTypes.arrayOf(PropTypes.shape({
+		})),
+		start: PropTypes.string,
+		title: PropTypes.string,
+	}),
+	onHide: PropTypes.func,
+	onSubmit: PropTypes.func,
+	show: PropTypes.bool,
+};
+
+export default Dialog;
diff --git a/resources/js/components/episodes/Dialog.jsx b/resources/js/components/episodes/Dialog.jsx
index ab59c39..344e48c 100644
--- a/resources/js/components/episodes/Dialog.jsx
+++ b/resources/js/components/episodes/Dialog.jsx
@@ -9,6 +9,7 @@ const Form = React.lazy(() => import('./Form'));
 
 const Dialog = ({
 	episode,
+	onDelete,
 	onHide,
 	onSubmit,
 	show,
@@ -25,6 +26,7 @@ const Dialog = ({
 			<Form
 				episode={episode}
 				onCancel={onHide}
+				onDelete={onDelete}
 				onSubmit={onSubmit}
 			/>
 		</React.Suspense>
@@ -35,6 +37,7 @@ Dialog.propTypes = {
 	episode: PropTypes.shape({
 		id: PropTypes.number,
 	}),
+	onDelete: PropTypes.func,
 	onHide: PropTypes.func,
 	onSubmit: PropTypes.func,
 	show: PropTypes.bool,
diff --git a/resources/js/components/episodes/Form/index.jsx b/resources/js/components/episodes/Form/index.jsx
index 9da9464..1d189cd 100644
--- a/resources/js/components/episodes/Form/index.jsx
+++ b/resources/js/components/episodes/Form/index.jsx
@@ -24,6 +24,7 @@ const EpisodeForm = ({
 	handleChange,
 	handleSubmit,
 	onCancel,
+	onDelete,
 	setFieldValue,
 	touched,
 	values,
@@ -86,6 +87,11 @@ const EpisodeForm = ({
 			</Col>
 		</Row>
 		<Modal.Footer>
+			{onDelete ?
+				<Button className="me-auto" onClick={() => onDelete(episode)} variant="outline-danger">
+					{t('episodes.delete')}
+				</Button>
+			: null}
 			{onCancel ?
 				<Button onClick={onCancel} variant="secondary">
 					{t('button.cancel')}
@@ -119,6 +125,7 @@ EpisodeForm.propTypes = {
 	handleChange: PropTypes.func,
 	handleSubmit: PropTypes.func,
 	onCancel: PropTypes.func,
+	onDelete: PropTypes.func,
 	setFieldValue: PropTypes.func,
 	touched: PropTypes.shape({
 		comment: PropTypes.bool,
diff --git a/resources/js/hooks/episodes.jsx b/resources/js/hooks/episodes.jsx
index 0a7a6e9..2cd0050 100644
--- a/resources/js/hooks/episodes.jsx
+++ b/resources/js/hooks/episodes.jsx
@@ -6,6 +6,7 @@ import toastr from 'toastr';
 
 import { useUser } from './user';
 import ApplyDialog from '../components/episodes/ApplyDialog';
+import DeleteEpisodeDialog from '../components/episodes/DeleteDialog';
 import EpisodeDialog from '../components/episodes/Dialog';
 import RestreamDialog from '../components/episodes/RestreamDialog';
 
@@ -13,6 +14,7 @@ const context = React.createContext({
 	onAddEpisode: null,
 	onAddRestream: null,
 	onApplyRestream: null,
+	onDeleteEpisode: null,
 	onEditEpisode: null,
 	onEditRestream: null,
 });
@@ -21,10 +23,12 @@ export const useEpisodes = () => React.useContext(context);
 
 export const EpisodesProvider = ({ children, setEpisodes }) => {
 	const [applyAs, setApplyAs] = React.useState('commentary');
+	const [deleteEpisode, setDeleteEpisode] = React.useState(null);
 	const [editEpisode, setEditEpisode] = React.useState(null);
 	const [restreamChannel, setRestreamChannel] = React.useState(null);
 	const [restreamEpisode, setRestreamEpisode] = React.useState(null);
 	const [showApplyDialog, setShowApplyDialog] = React.useState(false);
+	const [showDeleteEpisodeDialog, setShowDeleteEpisodeDialog] = React.useState(false);
 	const [showEpisodeDialog, setShowEpisodeDialog] = React.useState(false);
 	const [showRestreamDialog, setShowRestreamDialog] = React.useState(false);
 
@@ -36,6 +40,30 @@ export const EpisodesProvider = ({ children, setEpisodes }) => {
 		setShowEpisodeDialog(true);
 	}, []);
 
+	const onDeleteEpisode = React.useCallback((episode) => {
+		setDeleteEpisode(episode);
+		setShowDeleteEpisodeDialog(true);
+		setShowEpisodeDialog(false);
+	}, []);
+
+	const onHideDeleteEpisodeDialog = React.useCallback(() => {
+		setShowDeleteEpisodeDialog(false);
+		if (editEpisode?.id === deleteEpisode.id) {
+			setShowEpisodeDialog(true);
+		}
+	}, [editEpisode, deleteEpisode]);
+
+	const onSubmitDeleteEpisodeDialog = React.useCallback(async () => {
+		try {
+			await axios.delete(`/api/episodes/${deleteEpisode.id}`);
+			setEpisodes(episodes => episodes.filter(e => e.id !== deleteEpisode.id));
+			setShowDeleteEpisodeDialog(false);
+			toastr.success(t('episodes.deleteSuccess'));
+		} catch (error) {
+			toastr.error(t('episodes.deleteError', { error }));
+		}
+	}, [deleteEpisode, t]);
+
 	const onEditEpisode = React.useCallback((episode) => {
 		setEditEpisode(episode);
 		setShowEpisodeDialog(true);
@@ -220,12 +248,14 @@ export const EpisodesProvider = ({ children, setEpisodes }) => {
 		onAddEpisode,
 		onAddRestream,
 		onApplyRestream,
+		onDeleteEpisode,
 		onEditEpisode,
 		onEditRestream,
 	}), [
 		onAddEpisode,
 		onAddRestream,
 		onApplyRestream,
+		onDeleteEpisode,
 		onEditEpisode,
 		onEditRestream,
 	]);
@@ -240,8 +270,15 @@ export const EpisodesProvider = ({ children, setEpisodes }) => {
 				onSubmit={onSubmitApplyDialog}
 				show={showApplyDialog}
 			/>
+			<DeleteEpisodeDialog
+				episode={deleteEpisode}
+				onHide={onHideDeleteEpisodeDialog}
+				onSubmit={onSubmitDeleteEpisodeDialog}
+				show={showDeleteEpisodeDialog}
+			/>
 			<EpisodeDialog
 				episode={editEpisode}
+				onDelete={onDeleteEpisode}
 				onHide={onHideEpisodeDialog}
 				onSubmit={onSubmitEpisodeDialog}
 				show={showEpisodeDialog}
diff --git a/resources/js/i18n/de.js b/resources/js/i18n/de.js
index 88aaac4..600f62b 100644
--- a/resources/js/i18n/de.js
+++ b/resources/js/i18n/de.js
@@ -238,6 +238,10 @@ export default {
 			create: 'Neue Episode',
 			createError: 'Fehler beim Speichern',
 			createSuccess: 'Episode eingetragen',
+			delete: 'Episode löschen',
+			deleteError: 'Fehler beim Löschen',
+			deleteQuestion: 'Diese Episode wirklich löschen? Alle eingetragenen Restreams werden abgesagt und erstellte Discord Events gelöscht.',
+			deleteSuccess: 'Episode gelöscht',
 			edit: 'Episode bearbeiten',
 			editError: 'Fehler beim Speichern',
 			editSuccess: 'Änderungen gespeichert',
diff --git a/resources/js/i18n/en.js b/resources/js/i18n/en.js
index f5b18de..ca5c805 100644
--- a/resources/js/i18n/en.js
+++ b/resources/js/i18n/en.js
@@ -238,6 +238,10 @@ export default {
 			create: 'Add episode',
 			createError: 'Error saving episode',
 			createSuccess: 'Episode added',
+			delete: 'Delete episode',
+			deleteError: 'Error deleting episode',
+			deleteQuestion: 'Are you sure you want to delete this episode? All associated restreams will be called off and created Discord events cancelled.',
+			deleteSuccess: 'Episode deleted',
 			edit: 'Edit episode',
 			editError: 'Error saving episode',
 			editSuccess: 'Saved changes',
diff --git a/resources/sass/episodes.scss b/resources/sass/episodes.scss
index e8ae7ed..37e6c4a 100644
--- a/resources/sass/episodes.scss
+++ b/resources/sass/episodes.scss
@@ -55,10 +55,6 @@
 			margin-bottom: 0;
 		}
 	}
-	.episode-players {
-		display: grid;
-		grid-template-columns: 1fr 1fr;
-	}
 	@include media-breakpoint-down(md) {
 		.episode-event {
 			margin-left: 5rem;
@@ -73,6 +69,14 @@
 			text-decoration: underline;
 		}
 	}
+}
+
+.episodes-item,
+.episode-delete-dialog {
+	.episode-players {
+		display: grid;
+		grid-template-columns: 1fr 1fr;
+	}
 	.player-link {
 		border: none;
 
-- 
2.47.3