diff --git a/.env.local b/.env.local index 0c27cf7..2ae4e13 100644 --- a/.env.local +++ b/.env.local @@ -1 +1 @@ -NEXT_PUBLIC_COMMIT_SHA=591faca +NEXT_PUBLIC_COMMIT_SHA=f721213 diff --git a/app/components/RootLayoutClient.tsx b/app/components/RootLayoutClient.tsx index c054919..69ae609 100644 --- a/app/components/RootLayoutClient.tsx +++ b/app/components/RootLayoutClient.tsx @@ -6,6 +6,7 @@ import { NavidromeProvider, useNavidrome } from "../components/NavidromeContext" import { NavidromeConfigProvider } from "../components/NavidromeConfigContext"; import { ThemeProvider } from "../components/ThemeProvider"; import { PostHogProvider } from "../components/PostHogProvider"; +import { WhatsNewPopup } from "../components/WhatsNewPopup"; import Ihateserverside from "./ihateserverside"; import DynamicViewportTheme from "./DynamicViewportTheme"; import { LoginForm } from "./start-screen"; @@ -43,6 +44,7 @@ export default function RootLayoutClient({ children }: { children: React.ReactNo {children} + diff --git a/app/components/WhatsNewPopup.tsx b/app/components/WhatsNewPopup.tsx new file mode 100644 index 0000000..89b47ce --- /dev/null +++ b/app/components/WhatsNewPopup.tsx @@ -0,0 +1,139 @@ +'use client'; + +import { useState, useEffect } from 'react'; +import { Dialog, DialogContent, DialogHeader, DialogTitle } from '@/components/ui/dialog'; +import { Button } from '@/components/ui/button'; +import { Badge } from '@/components/ui/badge'; +import { ScrollArea } from '@/components/ui/scroll-area'; +import { X } from 'lucide-react'; + +// Current app version from package.json +const APP_VERSION = '1.0.0'; + +// Changelog data - add new versions at the top +const CHANGELOG = [ + { + version: '1.0.0', + date: '2024-01-10', + title: 'Initial Release', + changes: [ + 'Complete redesign with modern UI', + 'Added Favorites functionality for albums, songs, and artists', + 'Integrated standalone Last.fm scrobbling support', + 'Added collapsible sidebar with icon-only mode', + 'Improved search and browsing experience', + 'Added history tracking for played songs', + 'Enhanced audio player with better controls', + 'Added settings page for customization options' + ], + breaking: [], + fixes: [] + } +]; + +export function WhatsNewPopup() { + const [isOpen, setIsOpen] = useState(false); + + useEffect(() => { + // Check if we've shown the popup for this version + const lastShownVersion = localStorage.getItem('whats-new-last-shown'); + + if (lastShownVersion !== APP_VERSION) { + setIsOpen(true); + } + }, []); + + const handleClose = () => { + // Mark this version as shown + localStorage.setItem('whats-new-last-shown', APP_VERSION); + setIsOpen(false); + }; + + const currentVersionChangelog = CHANGELOG.find(entry => entry.version === APP_VERSION); + + if (!currentVersionChangelog) { + return null; + } + + return ( + + + +
+ + What's New in mice + {currentVersionChangelog.version} + +

+ Released on {currentVersionChangelog.date} +

+
+ + + +
+ {currentVersionChangelog.title && ( +
+

{currentVersionChangelog.title}

+
+ )} + + {currentVersionChangelog.changes.length > 0 && ( +
+

+ ✨ New Features & Improvements +

+
    + {currentVersionChangelog.changes.map((change, index) => ( +
  • + • + {change} +
    • + ))} +
+
+ )} + + {currentVersionChangelog.fixes.length > 0 && ( +
+

+ 🐛 Bug Fixes +

+
    + {currentVersionChangelog.fixes.map((fix, index) => ( +
  • + • + {fix} +
    • + ))} +
+
+ )} + + {currentVersionChangelog.breaking.length > 0 && ( +
+

+ ⚠️ Breaking Changes +

+
    + {currentVersionChangelog.breaking.map((breaking, index) => ( +
  • + • + {breaking} +
    • + ))} +
+
+ )} +
+ + +
+ +
+ + + ); +} diff --git a/app/components/sidebar.tsx b/app/components/sidebar.tsx index f3840b1..09ab212 100644 --- a/app/components/sidebar.tsx +++ b/app/components/sidebar.tsx @@ -16,18 +16,32 @@ interface SidebarProps extends React.HTMLAttributes { } export function Sidebar({ className, playlists, collapsed = false, onToggle }: SidebarProps) { - const isRoot = usePathname() === "/"; - const isBrowse = usePathname() === "/browse"; - const isSearch = usePathname() === "/search"; - const isAlbums = usePathname() === "/library/albums"; - const isArtists = usePathname() === "/library/artists"; - const isQueue = usePathname() === "/queue"; - const isRadio = usePathname() === "/radio"; - const isHistory = usePathname() === "/history"; - const isSongs = usePathname() === "/library/songs"; - const isPlaylists = usePathname() === "/library/playlists"; - const isFavorites = usePathname() === "/favorites"; - const isNew = usePathname() === "/new"; + const pathname = usePathname(); + + // Define all routes and their active states + const routes = { + isRoot: pathname === "/", + isBrowse: pathname === "/browse", + isSearch: pathname === "/search", + isQueue: pathname === "/queue", + isRadio: pathname === "/radio", + isPlaylists: pathname === "/library/playlists", + isSongs: pathname === "/library/songs", + isArtists: pathname === "/library/artists", + isAlbums: pathname === "/library/albums", + isHistory: pathname === "/history", + isFavorites: pathname === "/favorites", + isSettings: pathname === "/settings", + // Handle dynamic routes + isAlbumPage: pathname.startsWith("/album/"), + isArtistPage: pathname.startsWith("/artist/"), + isPlaylistPage: pathname.startsWith("/playlist/"), + isNewPage: pathname === "/new", + }; + + // Helper function to determine if any sidebar route is active + // This prevents highlights on pages not defined in sidebar + const isAnySidebarRouteActive = Object.values(routes).some(Boolean); return (
@@ -49,7 +63,7 @@ export function Sidebar({ className, playlists, collapsed = false, onToggle }: S
+
+
+ + + +
+
);