<commit_before><template>
	<div class="modal modal-sm" :class="{ active: active }">
		<a href="#" class="modal-overlay" aria-label="Close" @click.prevent="$emit('closed')"></a>
		<div class="modal-container">
			<div class="modal-header">
				<a href="#" class="btn btn-clear float-right" aria-label="Close" @click.prevent="$emit('closed')"></a>
				<div class="modal-title h5">{{ $t('modal.deleteSong') }}</div>
			</div>
			<div class="modal-body">
				<div class="content">
					<p>{{ $t('text.reallyDeleteSong', { title: title }) }}</p>
					<p>{{ $t('text.cannotBeUndone') }}</p>
				</div>
			</div>
			<div class="modal-footer">
				<a class="btn btn-link btn-gray" href="#" aria-label="Cancel" @click.prevent="$emit('closed')">
					{{ $t('button.cancel') }}
				</a>
				<button class="btn btn-error ml-2" @click="deleteSong">{{ $t('button.delete') }}</button>
			</div>
		</div>
	</div>
</template>

<script>
import { defineComponent } from 'vue';
import { throwError } from '@/utils.js';

export default defineComponent({
	name: 'song-delete',
	props: {
		active: Boolean,
		title: String,
		id: String,
		songs: Object
	},
	methods: {
		deleteSong () {
			this.$db.collection('songs').doc(this.id).delete().then(() => {
				this.$emit('closed');
				// check existing song translations for this song id and delete corresponding references
				for (const songId in this.songs) {
					const song = this.songs[songId];
					let existingSongKey = null;
					song.translations.forEach((translation, key) => {
						if (translation == this.id) existingSongKey = key;
					});
					if (existingSongKey !== null) {
						let updatedTranslationsList = song.translations.filter(t => t != this.id);
						this.$db.collection('songs').doc(songId).update({ translations: updatedTranslationsList });
					}
				}
				// go back to songs list if not already there
				if (this.$route.name != 'songs') {
					this.$router.push({ name: 'songs' });
				}
				// toast success message
				this.$notify({
					title: this.$t('toast.songDeleted'),
					text: this.$t('toast.songDeletedText'),
					type: 'primary'
				});
			}).catch((error) => throwError(error));
		},
	}
});
</script><commit_msg>🔨 migrate songdelete  component<commit_after><template>
	<div class="modal modal-sm" :class="{ active: active }">
		<a href="#" class="modal-overlay" aria-label="Close" @click.prevent="emit('closed')"></a>
		<div class="modal-container">
			<div class="modal-header">
				<a href="#" class="btn btn-clear float-right" aria-label="Close" @click.prevent="emit('closed')"></a>
				<div class="modal-title h5">{{ t('modal.deleteSong') }}</div>
			</div>
			<div class="modal-body">
				<div class="content">
					<p>{{ t('text.reallyDeleteSong', { title: title }) }}</p>
					<p>{{ t('text.cannotBeUndone') }}</p>
				</div>
			</div>
			<div class="modal-footer">
				<a class="btn btn-link btn-gray" href="#" aria-label="Cancel" @click.prevent="emit('closed')">
					{{ t('button.cancel') }}
				</a>
				<button class="btn btn-error ml-2" @click="deleteSong">{{ t('button.delete') }}</button>
			</div>
		</div>
	</div>
</template>

<script setup>
import { inject } from 'vue';
import { useI18n } from "vue-i18n";
const { t } = useI18n();
import { notify } from '@kyvg/vue3-notification';
import { throwError } from '@/utils.js';
import { useRoute, useRouter } from 'vue-router'
const route = useRoute()
const router = useRouter()

// global properties
const db = inject('db');

// inherited properties
const props = defineProps({
	active: Boolean, // state of modal display, true to show modal
	title: String,   // title of setlist to delete
	id: String,      // id of setlist to delete
	songs: Object,   // list of songs assigned to this setlist
});

// emits
const emit = defineEmits(['closed']);

const deleteSong = () => {
	db.collection('songs').doc(props.id).delete().then(() => {
		emit('closed');
		// check existing song translations for this song id and delete corresponding references
		for (const songId in props.songs) {
			const song = props.songs[songId];
			let existingSongKey = null;
			song.translations.forEach((translation, key) => {
				if (translation == props.id) existingSongKey = key;
			});
			if (existingSongKey !== null) {
				let updatedTranslationsList = song.translations.filter(t => t != props.id);
				db.collection('songs').doc(songId).update({ translations: updatedTranslationsList });
			}
		}
		// go back to songs list if not already there
		if (route.name != 'songs') {
			router.push({ name: 'songs' });
		}
		// toast success message
		notify({
			title: t('toast.songDeleted'),
			text: t('toast.songDeletedText'),
			type: 'primary'
		});
	}).catch((error) => throwError(error));
};
</script>
{'fraction_non_alphanumeric': 0.1957257723233178, 'fraction_numerical': 0.0023275497249259417, 'mean_word_length': 3.708167330677291, 'pattern_counts': {'":': 0, '<': 63, '<?xml version=': 0, '>': 72, 'https://': 0, 'lorem ipsum': 0, 'www.': 0, 'xml': 0}, 'pii_count': 0, 'substrings_counts': 0, 'word_list_counts': {'cursed_substrings.json': 0, 'profanity_word_list.json': 0, 'sexual_word_list.json': 0, 'zh_pornsignals.json': 0}}
{'dir': 'git-commits-cleaned', 'id': '5493160', 'n_tokens_mistral': 1811, 'n_tokens_neox': 1539, 'n_words': 380}