implement filtered bookmarks that error check the provider

Co-authored-by: William Oldham <wegg7250@gmail.com>

README.md

@@ -63,6 +63,7 @@ Check out [this project's issues](https://github.com/JamesHawkinss/movie-web/iss
 - [ ] Implement all scrapers
   - [ ] implement sources that are not mp4
 - [ ] Migrate old video progress
+- [ ] Bug: go back doesn't work if used directly from link
 
 ## After all rewrite code has been written
 

src/providers/methods/helpers.ts

@@ -1,16 +1,40 @@
-import { MWMediaType } from "providers";
-import { mediaProviders } from "./providers";
+import { MWMediaType, MWMediaProviderMetadata } from "providers";
+import { mediaProviders, mediaProvidersUnchecked } from "./providers";
 
 /*
  ** Fetch all enabled providers for a specific type
  */
- export function GetProvidersForType(type: MWMediaType) {
+export function GetProvidersForType(type: MWMediaType) {
   return mediaProviders.filter((v) => v.type.includes(type));
 }
 
 /*
  ** Get a provider by a id
  */
- export function getProviderFromId(id: string) {
+export function getProviderFromId(id: string) {
   return mediaProviders.find((v) => v.id === id);
 }
+
+/*
+ ** Get a provider metadata
+ */
+export function getProviderMetadata(id: string): MWMediaProviderMetadata {
+  const provider = mediaProvidersUnchecked.find((v) => v.id === id);
+
+  if (!provider) {
+    return {
+      exists: false,
+      type: [],
+      enabled: false,
+      id,
+    };
+  }
+
+  return {
+    exists: true,
+    type: provider.type,
+    enabled: provider.enabled,
+    id,
+    provider,
+  };
+}

src/providers/methods/providers.ts

@@ -2,9 +2,10 @@ import { tempScraper } from "providers/list/temp";
 import { theFlixScraper } from "providers/list/theflix";
 import { MWWrappedMediaProvider, WrapProvider } from "providers/wrapper";
 
-const mediaProvidersUnchecked: MWWrappedMediaProvider[] = [
+export const mediaProvidersUnchecked: MWWrappedMediaProvider[] = [
   WrapProvider(theFlixScraper),
   WrapProvider(tempScraper),
 ];
+
 export const mediaProviders: MWWrappedMediaProvider[] =
   mediaProvidersUnchecked.filter((v) => v.enabled);

src/providers/types.ts

@@ -43,6 +43,14 @@ export interface MWMediaProvider {
   getStream(media: MWPortableMedia): Promise<MWMediaStream>;
 }
 
+export interface MWMediaProviderMetadata {
+  exists: boolean;
+  id?: string;
+  enabled: boolean;
+  type: MWMediaType[];
+  provider?: MWMediaProvider;
+}
+
 export interface MWMassProviderOutput {
   providers: {
     id: string;

src/state/bookmark/context.tsx

@@ -1,4 +1,4 @@
-import { MWMediaMeta } from "providers";
+import { getProviderMetadata, MWMediaMeta } from "providers";
 import { createContext, ReactNode, useContext, useState } from "react";
 import { BookmarkStore } from "./store";
 
@@ -8,11 +8,13 @@ interface BookmarkStoreData {
 
 interface BookmarkStoreDataWrapper {
   setItemBookmark(media: MWMediaMeta, bookedmarked: boolean): void;
+  getFilteredBookmarks(): MWMediaMeta[];
   bookmarkStore: BookmarkStoreData;
 }
 
 const BookmarkedContext = createContext<BookmarkStoreDataWrapper>({
   setItemBookmark: () => {},
+  getFilteredBookmarks: () => [],
   bookmarkStore: {
     bookmarks: [],
   },
@@ -40,7 +42,7 @@ export function BookmarkContextProvider(props: { children: ReactNode }) {
     setItemBookmark(media: MWMediaMeta, bookmarked: boolean) {
       setBookmarked((data: BookmarkStoreData) => {
         if (bookmarked) {
-          const itemIndex = getBookmarkIndexFromPortable(data, media);
+          const itemIndex = getBookmarkIndexFromMedia(data.bookmarks, media);
           if (itemIndex === -1) {
             const item = {
               mediaId: media.mediaId,
@@ -54,7 +56,7 @@ export function BookmarkContextProvider(props: { children: ReactNode }) {
             data.bookmarks.push(item);
           }
         } else {
-          const itemIndex = getBookmarkIndexFromPortable(data, media);
+          const itemIndex = getBookmarkIndexFromMedia(data.bookmarks, media);
           if (itemIndex !== -1) {
             data.bookmarks.splice(itemIndex);
           }
@@ -62,6 +64,11 @@ export function BookmarkContextProvider(props: { children: ReactNode }) {
         return data;
       });
     },
+    getFilteredBookmarks() {
+      return bookmarkStorage.bookmarks.filter((bookmark) => {
+        return getProviderMetadata(bookmark.providerId)?.enabled;
+      });
+    },
     bookmarkStore: bookmarkStorage,
   };
 
@@ -76,11 +83,11 @@ export function useBookmarkContext() {
   return useContext(BookmarkedContext);
 }
 
-function getBookmarkIndexFromPortable(
-  store: BookmarkStoreData,
+function getBookmarkIndexFromMedia(
+  bookmarks: MWMediaMeta[],
   media: MWMediaMeta
 ): number {
-  const a = store.bookmarks.findIndex((v) => {
+  const a = bookmarks.findIndex((v) => {
     return (
       v.mediaId === media.mediaId &&
       v.providerId === media.providerId &&
@@ -92,9 +99,9 @@ function getBookmarkIndexFromPortable(
 }
 
 export function getIfBookmarkedFromPortable(
-  store: BookmarkStoreData,
+  bookmarks: MWMediaMeta[],
   media: MWMediaMeta
 ): boolean {
-  const bookmarked = getBookmarkIndexFromPortable(store, media);
+  const bookmarked = getBookmarkIndexFromMedia(bookmarks, media);
   return bookmarked !== -1;
 }

src/views/MediaView.tsx

@@ -36,8 +36,11 @@ function StyledMediaView(props: StyledMediaViewProps) {
     store.watched,
     props.media
   )?.progress;
-  const { setItemBookmark, bookmarkStore } = useBookmarkContext();
-  const isBookmarked = getIfBookmarkedFromPortable(bookmarkStore, props.media);
+  const { setItemBookmark, getFilteredBookmarks } = useBookmarkContext();
+  const isBookmarked = getIfBookmarkedFromPortable(
+    getFilteredBookmarks(),
+    props.media
+  );
 
   function updateProgress(e: Event) {
     if (!props.media) return;

src/views/SearchView.tsx

@@ -171,20 +171,22 @@ export function SearchView() {
 }
 
 function ExtraItems() {
-  const { bookmarkStore } = useBookmarkContext();
+  const { getFilteredBookmarks } = useBookmarkContext();
   const { watched } = useWatchedContext();
+
+  const bookmarks = getFilteredBookmarks();
+
   const watchedItems = watched.items.filter(
-    (v) => !getIfBookmarkedFromPortable(bookmarkStore, v)
+    (v) => !getIfBookmarkedFromPortable(bookmarks, v)
   );
 
-  if (watchedItems.length === 0 && bookmarkStore.bookmarks.length === 0)
-    return null;
+  if (watchedItems.length === 0 && bookmarks.length === 0) return null;
 
   return (
     <div className="mb-16 mt-32">
-      {bookmarkStore.bookmarks.length > 0 ? (
+      {bookmarks.length > 0 ? (
         <SectionHeading title="Bookmarks" icon={Icons.BOOKMARK}>
-          {bookmarkStore.bookmarks.map((v) => (
+          {bookmarks.map((v) => (
             <WatchedMediaCard
               key={[v.mediaId, v.providerId].join("|")}
               media={v}