Bookmarks in web app (#177)

* Bookmarks api * Lint fix * first pass * Lint fix * comment * bookmarks, loading feedSources, and pagination * comment * null check --------- Co-authored-by: github-action linter <githubaction@githubaction.com>
iBicha · Oct 24, 2023 · 57fa1c5 · 57fa1c5
1 parent 58ce2d6
commit 57fa1c5
Show file tree

Hide file tree

Showing 23 changed files with 510 additions and 192 deletions.
diff --git a/playlet-lib/src/components/ChannelView/ChannelView.bs b/playlet-lib/src/components/ChannelView/ChannelView.bs
@@ -147,12 +147,12 @@ function CreateChannelFeed(title as string, endpoint as string, ucid as string,
     return {
         title: title,
         feedSources: [{
-            id: `inv_${endpoint}_${ucid}`,
-            title: `${author} - ${title}`,
-            apiType: "Invidious",
-            endpoint: endpoint,
-            pathParams: {
-                ucid: ucid
+            "id": `inv_${endpoint}_${ucid}`,
+            "title": `${author} - ${title}`,
+            "apiType": "Invidious",
+            "endpoint": endpoint,
+            "pathParams": {
+                "ucid": ucid
             }
         }]
     }

diff --git a/playlet-lib/src/components/MainScene.xml b/playlet-lib/src/components/MainScene.xml
@@ -63,7 +63,8 @@
                 applicationInfo="bind:../ApplicationInfo"
                 invidious="bind:../Invidious"
                 preferences="bind:../Preferences"
-                playQueue="bind:../PlayQueue" />
+                playQueue="bind:../PlayQueue"
+                bookmarks="bind:../Bookmarks" />
         </AppController>
     </children>
 </component>
diff --git a/playlet-lib/src/components/MainScene_bindings.transpiled.brs b/playlet-lib/src/components/MainScene_bindings.transpiled.brs
@@ -24,7 +24,8 @@ function InitializeBindings()
                 "applicationInfo": "../ApplicationInfo", 
                 "invidious": "../Invidious", 
                 "preferences": "../Preferences", 
-                "playQueue": "../PlayQueue"
+                "playQueue": "../PlayQueue", 
+                "bookmarks": "../Bookmarks"
             }
         }
     }

diff --git a/playlet-lib/src/components/Screens/BookmarksScreen/BookmarksScreen.bs b/playlet-lib/src/components/Screens/BookmarksScreen/BookmarksScreen.bs
@@ -73,16 +73,15 @@ function SetRowListContent(bookmarksContent as object)
     feeds = []
     for each bookmarkGroupNode in bookmarkGroupNodes
         bookmarkNodes = bookmarkGroupNode.getChildren(-1, 0)
-        feed = {
-            title: bookmarkGroupNode.title,
-            feedSources: []
-        }
-
+        feedSources = []
         for each bookmarkNode in bookmarkNodes
-            feed.feedSources.push(bookmarkNode.feedSource)
+            feedSources.push(bookmarkNode.feedSource)
         end for
 
-        feeds.push(feed)
+        feeds.push({
+            "title": bookmarkGroupNode.title,
+            "feedSources": feedSources
+        })
     end for
 
     m.rowList.feeds = feeds

diff --git a/playlet-lib/src/components/Screens/SearchScreen/SearchScreen.bs b/playlet-lib/src/components/Screens/SearchScreen/SearchScreen.bs
@@ -204,12 +204,12 @@ function Search(text as string)
     ShowLoadingScreen()
 
     feedSource = {
-        id: `inv_search_${CryptoUtils.GetMd5(text)}`,
-        title: `Search - ${text}`,
-        apiType: "Invidious",
-        endpoint: "search",
-        queryParams: {
-            q: text
+        "id": `inv_search_${CryptoUtils.GetMd5(text)}`,
+        "title": `Search - ${text}`,
+        "apiType": "Invidious",
+        "endpoint": "search",
+        "queryParams": {
+            "q": text
         }
     }
 
@@ -229,8 +229,8 @@ function Search(text as string)
     end for
 
     m.rowList.feeds = [{
-        title: `Search - ${text}`,
-        feedSources: [feedSource]
+        "title": `Search - ${text}`,
+        "feedSources": [feedSource]
     }]
 end function
 

diff --git a/playlet-lib/src/components/Services/Bookmarks/Bookmarks.bs b/playlet-lib/src/components/Services/Bookmarks/Bookmarks.bs
@@ -53,19 +53,19 @@ function Save() as void
         bookmarkNodes = bookmarkGroupNode.getChildren(-1, 0)
         for each bookmarkNode in bookmarkNodes
             bookmarks.push({
-                id: bookmarkNode.id,
-                feedSource: bookmarkNode.feedSource
+                "id": bookmarkNode.id,
+                "feedSource": bookmarkNode.feedSource
             })
         end for
         groups.push({
-            title: bookmarkGroupNode.title,
-            bookmarks: bookmarks
+            "title": bookmarkGroupNode.title,
+            "bookmarks": bookmarks
         })
     end for
 
     bookmarksString = FormatJson({
-        __version: m.top.__version,
-        groups: groups
+        "__version": m.top.__version,
+        "groups": groups
     })
 
     if m.bookmarksString = bookmarksString
@@ -110,10 +110,10 @@ function AddVideoBookmark(id as string, groupName as string)
     bookmarkGroupNode = GetOrCreateBookmarkGroup(groupName)
 
     feedSource = {
-        apiType: "Invidious",
-        endpoint: "video_info",
-        pathParams: {
-            id: id
+        "apiType": "Invidious",
+        "endpoint": "video_info",
+        "pathParams": {
+            "id": id
         }
     }
     AddFeedSourceBookmark(feedSource, id, bookmarkGroupNode)
@@ -123,10 +123,10 @@ function AddPlaylistBookmark(id as string, groupName as string)
     bookmarkGroupNode = GetOrCreateBookmarkGroup(groupName)
 
     feedSource = {
-        apiType: "Invidious",
-        endpoint: "playlist_info",
-        pathParams: {
-            plid: id
+        "apiType": "Invidious",
+        "endpoint": "playlist_info",
+        "pathParams": {
+            "plid": id
         }
     }
     AddFeedSourceBookmark(feedSource, id, bookmarkGroupNode)
@@ -136,21 +136,21 @@ function AddPlaylistBookmarkWithSpread(id as string, groupName as string)
     bookmarkGroupNode = GetOrCreateBookmarkGroup(groupName)
 
     feedSource = {
-        id: `inv_playlist_${id}`,
-        title: `${groupName} videos`,
-        apiType: "Invidious",
-        endpoint: "playlist",
-        pathParams: {
-            plid: id
+        "id": `inv_playlist_${id}`,
+        "title": `${groupName} videos`,
+        "apiType": "Invidious",
+        "endpoint": "playlist",
+        "pathParams": {
+            "plid": id
         }
     }
     AddFeedSourceBookmark(feedSource, `inv_playlist_${id}`, bookmarkGroupNode)
 
     feedSource = {
-        apiType: "Invidious",
-        endpoint: "playlist_info",
-        pathParams: {
-            plid: id
+        "apiType": "Invidious",
+        "endpoint": "playlist_info",
+        "pathParams": {
+            "plid": id
         }
     }
     AddFeedSourceBookmark(feedSource, id, bookmarkGroupNode)
@@ -160,10 +160,10 @@ function AddChannelBookmark(id as string, groupName as string)
     bookmarkGroupNode = GetOrCreateBookmarkGroup(groupName)
 
     feedSource = {
-        apiType: "Invidious",
-        endpoint: "channel_info",
-        pathParams: {
-            ucid: id
+        "apiType": "Invidious",
+        "endpoint": "channel_info",
+        "pathParams": {
+            "ucid": id
         }
     }
     AddFeedSourceBookmark(feedSource, id, bookmarkGroupNode)
@@ -173,21 +173,21 @@ function AddChannelBookmarkWithSpread(id as string, groupName as string)
     bookmarkGroupNode = GetOrCreateBookmarkGroup(groupName)
 
     feedSource = {
-        id: `inv_channel_videos_${id}`,
-        title: `${groupName} videos`,
-        apiType: "Invidious",
-        endpoint: "channel_videos",
-        pathParams: {
-            ucid: id
+        "id": `inv_channel_videos_${id}`,
+        "title": `${groupName} videos`,
+        "apiType": "Invidious",
+        "endpoint": "channel_videos",
+        "pathParams": {
+            "ucid": id
         }
     }
     AddFeedSourceBookmark(feedSource, `inv_channel_videos_${id}`, bookmarkGroupNode)
 
     feedSource = {
-        apiType: "Invidious",
-        endpoint: "channel_info",
-        pathParams: {
-            ucid: id
+        "apiType": "Invidious",
+        "endpoint": "channel_info",
+        "pathParams": {
+            "ucid": id
         }
     }
     AddFeedSourceBookmark(feedSource, id, bookmarkGroupNode)

diff --git a/playlet-lib/src/components/Services/Invidious/InvidiousService.bs b/playlet-lib/src/components/Services/Invidious/InvidiousService.bs
@@ -169,7 +169,7 @@ namespace Invidious
 
             feedSourceState = feedSource.state
             if not feedSourceState.DoesExist("queryParams")
-                feedSourceState.queryParams = {}
+                feedSourceState["queryParams"] = {}
             end if
 
             feedSourceState.paginationType = endpoint.paginationType

diff --git a/playlet-lib/src/components/Web/PlayletWebServer/Middleware/BookmarksRouter.bs b/playlet-lib/src/components/Web/PlayletWebServer/Middleware/BookmarksRouter.bs
@@ -0,0 +1,65 @@
+import "pkg:/source/utils/RegistryUtils.bs"
+
+namespace Http
+
+    class BookmarksRouter extends HttpRouter
+
+        function new()
+            super()
+
+            m.Get("/api/bookmarks", function(context as object) as boolean
+                response = context.response
+
+                bookmarksString = RegistryUtils.Read(RegistryUtils.BOOKMARKS)
+                if bookmarksString = invalid
+                    response.Json({
+                        groups: []
+                    })
+                    return true
+                end if
+
+                response.SetBodyDataString(bookmarksString)
+                response.ContentType("application/json")
+                response.http_code = 200
+
+                return true
+            end function)
+
+            m.Get("/api/bookmarks/feeds", function(context as object) as boolean
+                response = context.response
+                router = context.router
+                bookmarks = context.server.task.bookmarks
+
+                feeds = router.BookmarksContentToFeeds(bookmarks.content)
+
+                response.Json(feeds)
+
+                return true
+            end function)
+        end function
+
+        ' TODO:P1 refactor to share code with Bookmarks screen
+        function BookmarksContentToFeeds(bookmarksContent as object) as object
+            bookmarkGroupNodes = bookmarksContent.getChildren(-1, 0)
+
+            feeds = []
+            for each bookmarkGroupNode in bookmarkGroupNodes
+                bookmarkNodes = bookmarkGroupNode.getChildren(-1, 0)
+
+                feedSources = []
+                for each bookmarkNode in bookmarkNodes
+                    feedSources.push(bookmarkNode.feedSource)
+                end for
+
+                feeds.push({
+                    "title": bookmarkGroupNode.title,
+                    "feedSources": feedSources
+                })
+            end for
+
+            return feeds
+        end function
+
+    end class
+
+end namespace
diff --git a/playlet-lib/src/components/Web/PlayletWebServer/Middleware/InvidiousRouter.bs b/playlet-lib/src/components/Web/PlayletWebServer/Middleware/InvidiousRouter.bs
@@ -47,14 +47,15 @@ namespace Http
 
             ' This is an endpoint allowing the web app to make an authenticated request
             ' without needing the Invidious token
+            ' TODO:P2 this should be a POST request
             m.Get("/invidious/authenticated-request", function(context as object) as boolean
                 request = context.request
                 response = context.response
                 invidiousNode = context.server.task.invidious
 
-                requestData = request.query["request-data"]
-                if requestData = invalid
-                    response.Default(400, "Expected request-data")
+                feedSource = request.query["feed-source"]
+                if feedSource = invalid
+                    response.Default(400, "Expected feed-source")
                     return true
                 end if
 
@@ -64,12 +65,10 @@ namespace Http
                     return true
                 end if
 
-                requestData = ParseJson(requestData)
+                feedSource = ParseJson(feedSource)
 
-                ' TODO:P0 handle pagination
-                ' Perhaps the page arg can be added to queryParam of requestData directly
                 invService = new Invidious.InvidiousService(invidiousNode)
-                invResponse = invService.MakeRequest(requestData)
+                invResponse = invService.MakeRequest(feedSource, feedSource.state?.queryParams)
                 if not invResponse.success
                     response.Default(500, `Failed to make request: ${invResponse.error}`)
                     return true

diff --git a/playlet-lib/src/components/Web/PlayletWebServer/PlayletWebServer.bs b/playlet-lib/src/components/Web/PlayletWebServer/PlayletWebServer.bs
@@ -1,3 +1,4 @@
+import "pkg:/components/Web/PlayletWebServer/Middleware/BookmarksRouter.bs"
 import "pkg:/components/Web/PlayletWebServer/Middleware/DashRouter.bs"
 import "pkg:/components/Web/PlayletWebServer/Middleware/InvidiousRouter.bs"
 import "pkg:/components/Web/PlayletWebServer/Middleware/PlayletLibUrlsRouter.bs"
@@ -38,6 +39,7 @@ function SetupRoutes(server as object)
     server.UseRouter(new Http.PreferencesRouter())
     server.UseRouter(new Http.InvidiousRouter())
     server.UseRouter(new Http.PlayQueueRouter())
+    server.UseRouter(new Http.BookmarksRouter())
     server.UseRouter(new Http.SearchHistoryRouter())
     server.UseRouter(new Http.PlayletLibUrlsRouter())
 

diff --git a/playlet-lib/src/components/Web/PlayletWebServer/PlayletWebServer.xml b/playlet-lib/src/components/Web/PlayletWebServer/PlayletWebServer.xml
@@ -4,6 +4,7 @@
         <field id="invidious" type="node" />
         <field id="applicationInfo" type="node" />
         <field id="playQueue" type="node" />
+        <field id="bookmarks" type="node" />
         <function name="GetServerAddress" />
     </interface>
 </component>
diff --git a/playlet-web/src/App.svelte b/playlet-web/src/App.svelte
@@ -4,6 +4,7 @@
   import { PlayletApi } from "lib/Api/PlayletApi";
   import {
     appStateStore,
+    bookmarksStore,
     homeLayoutFileStore,
     invidiousVideoApiStore,
     playletStateStore,
@@ -18,6 +19,7 @@
   import SettingsScreen from "lib/Screens/SettingsScreen.svelte";
   import InfoScreen from "lib/Screens/InfoScreen.svelte";
   import LinkDragDrop from "lib/LinkDragDrop.svelte";
+  import BookmarksScreen from "lib/Screens/BookmarksScreen.svelte";
 
   onMount(async () => {
     PlayletApi.getState().then((value) => {
@@ -43,6 +45,10 @@
     PlayletApi.getSearchHistory().then((value) => {
       searchHistoryStore.set(value);
     });
+
+    PlayletApi.getBookmarkFeeds().then((value) => {
+      bookmarksStore.set(value);
+    });
   });
 
   let currentScreen: AppState["screen"];
@@ -61,6 +67,8 @@
 
     <HomeScreen visibility={currentScreen == "home"} />
 
+    <BookmarksScreen visibility={currentScreen == "bookmarks"} />
+
     <SettingsScreen visibility={currentScreen == "settings"} />
 
     <InfoScreen visibility={currentScreen == "info"} />