Handle optional API data in pages

app/pages/admin/songs.vue

@@ -32,7 +32,7 @@ import { type Option } from "~/ui/SearchSelect.vue"
 
 const { data: artistData } = useApiFetch<Artist[]>("/all/artists")
 const artistFetchOptions = async (q?: string): Promise<Option[]> => {
-	return artistData.value.map<Option>((g) => ({
+	return (artistData.value ?? []).map<Option>((g) => ({
 		label: g.name,
 		value: g._id,
 	}))
@@ -40,7 +40,7 @@ const artistFetchOptions = async (q?: string): Promise<Option[]> => {
 
 const { data: albumData } = useApiFetch<Album[]>("/all/albums")
 const albumFetchOptions = async (q?: string): Promise<Option[]> => {
-	return albumData.value.map<Option>((g) => ({
+	return (albumData.value ?? []).map<Option>((g) => ({
 		label: g.name,
 		value: g._id,
 	}))
@@ -48,7 +48,7 @@ const albumFetchOptions = async (q?: string): Promise<Option[]> => {
 
 const { data: genreData } = useApiFetch<Genre[]>("/all/genres")
 const genreFetchOptions = async (): Promise<Option[]> => {
-	return genreData.value.map<Option>((genre) => ({
+	return (genreData.value ?? []).map<Option>((genre) => ({
 		label: genre.name,
 		value: genre._id,
 	}))
@@ -201,7 +201,7 @@ const show = (id?: string) => {
 		return
 	}
 
-	const curItem: any = data.value.filter((i) => i._id == id)[0]
+	const curItem: any = (data.value ?? []).filter((i) => i._id == id)[0]
 
 	if (!curItem) return