Merge pull request #3128 from metabrainz/back-button-playlist-page

Add back button and secondary navbar to playlist pages
metabrainz · Jan 16, 2025 · f95b376 · f95b376
2 parents 5d5289a + 46a036e
commit f95b376
Show file tree

Hide file tree

Showing 3 changed files with 17 additions and 6 deletions.
diff --git a/frontend/js/src/layout/EntityPages.tsx → ...nd/js/src/layout/LayoutWithBackButton.tsx b/frontend/js/src/layout/EntityPages.tsx → ...nd/js/src/layout/LayoutWithBackButton.tsx
@@ -1,7 +1,7 @@
 import React from "react";
 import { Outlet, ScrollRestoration, useNavigate } from "react-router-dom";
 
-export default function EntityPageLayout() {
+export default function LayoutWithBackButton() {
   const navigate = useNavigate();
 
   const goBack = () => {

diff --git a/frontend/js/src/routes/EntityPages.tsx b/frontend/js/src/routes/EntityPages.tsx
@@ -6,7 +6,7 @@ const getEntityPages = (): RouteObject[] => {
     {
       path: "/",
       lazy: async () => {
-        const EntityPageLayout = await import("../layout/EntityPages");
+        const EntityPageLayout = await import("../layout/LayoutWithBackButton");
         return { Component: EntityPageLayout.default };
       },
       children: [

diff --git a/frontend/js/src/routes/index.tsx b/frontend/js/src/routes/index.tsx
@@ -78,12 +78,23 @@ const getIndexRoutes = (): RouteObject[] => {
           },
         },
         {
-          path: "playlist/:playlistID/",
+          path: "playlist/",
           lazy: async () => {
-            const PlaylistPage = await import("../playlists/Playlist");
-            return { Component: PlaylistPage.default };
+            const LayoutWithBackButton = await import(
+              "../layout/LayoutWithBackButton"
+            );
+            return { Component: LayoutWithBackButton.default };
           },
-          loader: RouteLoader,
+          children: [
+            {
+              path: ":playlistID/",
+              lazy: async () => {
+                const PlaylistPage = await import("../playlists/Playlist");
+                return { Component: PlaylistPage.default };
+              },
+              loader: RouteLoader,
+            },
+          ],
         },
         {
           path: "/statistics/",