Fix merge

Author: MarvinSchenkel

src/App.vue

@@ -33,7 +33,7 @@
 <script setup lang="ts">
 import { Toaster } from "@/components/ui/sonner";
 import { api, ConnectionState } from "@/plugins/api";
-import { CoreState, EventType } from "@/plugins/api/interfaces";
+import { CoreState, EventType, ProviderType } from "@/plugins/api/interfaces";
 import { toast } from "vue-sonner";
 import { getDeviceName } from "@/plugins/api/helpers";
 import authManager from "@/plugins/auth";
@@ -219,24 +219,49 @@ const completeInitialization = async () => {
     webPlayer.setBaseUrl(api.baseUrl);
   }
 
-  await api.fetchState();
-  store.libraryArtistsCount = await api.getLibraryArtistsCount();
-  store.libraryAlbumsCount = await api.getLibraryAlbumsCount();
-  store.libraryPlaylistsCount = await api.getLibraryPlaylistsCount();
-  store.libraryRadiosCount = await api.getLibraryRadiosCount();
-  store.libraryTracksCount = await api.getLibraryTracksCount();
-  store.libraryPodcastsCount = await api.getLibraryPodcastsCount();
-  store.libraryAudiobooksCount = await api.getLibraryAudiobooksCount();
-  store.libraryGenresCount = await api.getLibraryGenresCount();
+  const isPartyModeGuest = authManager.isPartyModeGuest();
+
+  if (!isPartyModeGuest) {
+    // Full initialization for regular and non-party guest users
+    await api.fetchState();
+    store.libraryArtistsCount = await api.getLibraryArtistsCount();
+    store.libraryAlbumsCount = await api.getLibraryAlbumsCount();
+    store.libraryPlaylistsCount = await api.getLibraryPlaylistsCount();
+    store.libraryRadiosCount = await api.getLibraryRadiosCount();
+    store.libraryTracksCount = await api.getLibraryTracksCount();
+    store.libraryPodcastsCount = await api.getLibraryPodcastsCount();
+    store.libraryAudiobooksCount = await api.getLibraryAudiobooksCount();
+    store.libraryGenresCount = await api.getLibraryGenresCount();
+  } else {
+    console.debug("[App] Party mode guest - skipping full state fetch");
+  }
+
+  // Check if party mode plugin is enabled
+  try {
+    const partyModeProviders = await api.getProviderConfigs(
+      ProviderType.PLUGIN,
+      "party_mode",
+    );
+    if (partyModeProviders.length > 0 && partyModeProviders[0].enabled) {
+      store.enabledPlugins.add("party_mode");
+    } else {
+      store.enabledPlugins.delete("party_mode");
+    }
+  } catch (error) {
+    console.error("[App] Failed to check party mode status:", error);
+    store.enabledPlugins.delete("party_mode");
+  }
 
   // Enable Sendspin if available and not explicitly disabled
   // Sendspin works over WebRTC DataChannel which requires signaling via the API server
   const webPlayerEnabledPref =
     localStorage.getItem("frontend.settings.web_player_enabled") || "true";
   const browserControlsEnabledPref =
     localStorage.getItem("frontend.settings.enable_browser_controls") || "true";
-  if (companionMode.value) {
-    // the webplayer is completely disabled if we're running companion mode (no sendspin, no controls)
+
+  // Disable web player for party mode guests, companion mode, and party dashboard
+  const isPartyDashboard = router.currentRoute.value.path.startsWith("/party");
+  if (isPartyModeGuest || companionMode.value || isPartyDashboard) {
     webPlayer.setMode(WebPlayerMode.DISABLED);
   } else if (
     webPlayerEnabledPref !== "false" &&
@@ -268,6 +293,9 @@ const completeInitialization = async () => {
   ) {
     store.isOnboarding = true;
     router.push("/settings/providers");
+  } else if (isPartyModeGuest) {
+    // Party mode guests should always be redirected to the guest view
+    router.push("/guest");
   }
   // Don't push to any route here - let the router handle navigation naturally
   // from the URL hash. The router config already redirects "/" to "/discover"
@@ -408,6 +436,23 @@ onMounted(async () => {
   ) {
     await completeInitialization();
   }
+
+  // Subscribe to PROVIDERS_UPDATED to keep enabledPlugins in sync
+  api.subscribe(EventType.PROVIDERS_UPDATED, async () => {
+    try {
+      const partyModeProviders = await api.getProviderConfigs(
+        ProviderType.PLUGIN,
+        "party_mode",
+      );
+      if (partyModeProviders.length > 0 && partyModeProviders[0].enabled) {
+        store.enabledPlugins.add("party_mode");
+      } else {
+        store.enabledPlugins.delete("party_mode");
+      }
+    } catch (error) {
+      console.error("[App] Failed to update party mode status:", error);
+    }
+  });
 });
 
 onUnmounted(() => {

src/components/ItemsListing.vue

@@ -680,7 +680,11 @@ const redirectSearch = function () {
   router.push({ name: "search" });
 };
 
-const loadNextPage = async function ({ done }: { done: (status: "ok" | "empty" | "loading" | "error") => void }) {
+const loadNextPage = async function ({
+  done,
+}: {
+  done: (status: "ok" | "empty" | "loading" | "error") => void;
+}) {
   if (allItemsReceived.value) {
     done("empty");
     return;
@@ -1380,7 +1384,9 @@ onMounted(async () => {
         if (idx >= 0) {
           const playData = evt.data as Record<string, unknown>;
           if ("fully_played" in pagedItems.value[idx])
-            pagedItems.value[idx].fully_played = playData["fully_played"] as boolean;
+            pagedItems.value[idx].fully_played = playData[
+              "fully_played"
+            ] as boolean;
           if ("resume_position_ms" in pagedItems.value[idx])
             pagedItems.value[idx].resume_position_ms =
               (playData["seconds_played"] as number) * 1000;

src/components/navigation/AppSidebar.vue

@@ -19,16 +19,15 @@ import { getMenuItems } from "./utils/getMenuItems";
 const router = useRouter();
 const { t } = useI18n();
 
-const menuItems = getMenuItems();
-
 const navItems = computed(() => {
-  return menuItems
+  return getMenuItems()
     .filter((item) => !item.hidden)
     .map((item) => ({
       title: t(item.label),
       url: item.path,
       icon: item.icon,
       disabled: item.disabled,
+      openInNewTab: item.openInNewTab,
     }));
 });
 

src/components/navigation/NavMain.vue

@@ -1,6 +1,6 @@
 <script setup lang="ts">
 import { markRaw, type Component } from "vue";
-import { RouterLink, useRoute } from "vue-router";
+import { RouterLink, useRoute, useRouter } from "vue-router";
 
 const RouterLinkComponent = markRaw(RouterLink);
 
@@ -18,19 +18,25 @@ interface NavItem {
   url: string;
   icon?: Component;
   disabled?: boolean;
+  openInNewTab?: boolean;
 }
 
 const props = defineProps<{
   items: NavItem[];
 }>();
 
 const route = useRoute();
+const router = useRouter();
 const { isMobile, setOpenMobile } = useSidebar();
 
 const isActive = (url: string) =>
   route.path === url || route.path.startsWith(url + "/");
 
-const handleClick = () => {
+const handleClick = (item: NavItem, event: Event) => {
+  if (item.openInNewTab) {
+    event.preventDefault();
+    window.open(router.resolve(item.url).href, "_blank");
+  }
   if (isMobile.value) {
     setOpenMobile(false);
   }
@@ -43,8 +49,12 @@ const handleClick = () => {
       <SidebarMenu>
         <SidebarMenuItem v-for="item in items" :key="item.title" class="mr-1.5">
           <SidebarMenuButton
-            :as="item.disabled ? 'button' : RouterLinkComponent"
-            v-bind="item.disabled ? {} : { to: item.url }"
+            :as="
+              item.disabled || item.openInNewTab
+                ? 'button'
+                : RouterLinkComponent
+            "
+            v-bind="item.disabled || item.openInNewTab ? {} : { to: item.url }"
             :is-active="isActive(item.url)"
             :tooltip="item.title"
             :disabled="item.disabled"
@@ -54,7 +64,7 @@ const handleClick = () => {
                 : 'no-underline font-medium text-sm',
               item.disabled ? 'opacity-50 cursor-not-allowed' : '',
             ]"
-            @click="handleClick"
+            @click="(e: Event) => handleClick(item, e)"
           >
             <component
               :is="item.icon"

src/components/navigation/utils/getMenuItems.ts

@@ -8,6 +8,7 @@ import {
   House,
   ListMusic,
   Music2,
+  PartyPopper,
   Podcast,
   Radio,
   Search,
@@ -23,6 +24,7 @@ export interface MenuItem {
   isLibraryNode: boolean;
   hidden?: boolean;
   disabled?: boolean;
+  openInNewTab?: boolean;
 }
 
 export const getMenuItems = function () {
@@ -52,6 +54,16 @@ export const getMenuItems = function () {
         isLibraryNode: false,
       });
     }
+    if (enabledMenuItemStr === "party") {
+      items.push({
+        label: "Party Mode",
+        icon: PartyPopper,
+        path: "/party",
+        isLibraryNode: false,
+        hidden: !store.enabledPlugins.has("party_mode"),
+        openInNewTab: true,
+      });
+    }
     if (enabledMenuItemStr === "artists") {
       items.push({
         label: "artists",

src/components/party-mode/PartyModePlayerBadge.vue

@@ -0,0 +1,45 @@
+<template>
+  <span class="party-mode-badge">
+    <v-icon size="x-small">{{ icon }}</v-icon>
+    {{ label }}
+  </span>
+</template>
+
+<script setup lang="ts">
+import { $t } from "@/plugins/i18n";
+import { computed } from "vue";
+
+interface Props {
+  type: "request" | "boost";
+  badgeColor?: string;
+}
+
+const props = defineProps<Props>();
+
+const icon = computed(() =>
+  props.type === "boost" ? "mdi-rocket-launch" : "mdi-account-music",
+);
+
+const label = computed(() =>
+  props.type === "boost"
+    ? $t("providers.party_mode.boost")
+    : $t("providers.party_mode.request"),
+);
+</script>
+
+<style scoped>
+.party-mode-badge {
+  display: inline-flex;
+  align-items: center;
+  gap: 0.25rem;
+  background: v-bind("props.badgeColor");
+  padding: 2px 8px;
+  border-radius: 999px;
+  font-size: 0.55rem;
+  font-weight: 600;
+  text-transform: uppercase;
+  letter-spacing: 0.5px;
+  color: #fff;
+  margin-right: 0.5rem;
+}
+</style>