Merge branch 'main' of https://github.com/LukeHagar/plex-api-oauth

README.md

@@ -13,13 +13,11 @@ Examples Assume React Syntax
 
 ### Loading a Saved Session
 
-The LoadPlexSession Function returns an object that contains the plexClientInformation and plexTVAuthToken keys/values according to how they were created
+LoadPlexSession:  
+Function returns an object that contains the plexClientInformation and plexTVAuthToken keys/values according to how they were created
 ``` JavaScript
- const loadedSession = LoadPlexSession();
-if (
-    loadedSession.plexClientInformation === null ||
-    loadedSession.plexClientInformation === undefined
-){
+const loadedSession = LoadPlexSession();
+if (loadedSession.plexClientInformation == null){
     loadedSession.plexClientInformation = CreatePlexClientInformation();
 }
 
@@ -51,3 +49,121 @@ const [plexTVAuthToken, setPlexTVAuthToken] = useState(
     SavePlexSession(plexClientInformation, tempPlexTVAuthToken);
   }
 ```
+
+### Refresh Data with Saved Session
+``` JavaScript
+ async function Refresh() {
+    const tempPlexTVUserData = await GetPlexUserData(
+      plexClientInformation,
+      plexTVAuthToken
+    );
+    const tempPlexServers = await GetPlexServers(
+      plexClientInformation,
+      plexTVAuthToken
+    );
+    const tempPlexDevices = await GetPlexDevices(
+      plexClientInformation,
+      plexTVAuthToken
+    );
+    const tempPlexLibraries = await GetPlexLibraries(tempPlexServers);
+    UpdateHubs(tempPlexServers, tempPlexLibraries);
+    setPlexServers(tempPlexServers);
+    setPlexDevices(tempPlexDevices);
+    setPlexTVUserData(tempPlexTVUserData);
+    setPlexLibraries(tempPlexLibraries);
+    setIsRefreshing(false);
+  }
+```
+
+### Update Library list when the topic is changed (artists. albums, songs)
+``` JavaScript
+ async function UpdateLibrary() {
+    setIsLoading(true);
+    const returnObject = await GetLibraryPages(
+      plexServers,
+      plexLibraries,
+      topic,
+      pageNumber,
+      250
+    );
+    console.log(returnObject);
+    const tempItemArray = Array.from([
+      ...new Set([...libraryItems, ...returnObject.items]),
+    ]);
+
+    setLibraryItems(tempItemArray);
+    setLibraryHasMore(returnObject.hasMore);
+    setIsLoading(false);
+  }
+```
+
+### Intersection observer to load more library items when the callbackref object comes into view
+``` JavaScript
+ const observer = useRef();
+  const lastLibraryItem = useCallback(
+    (node) => {
+      if (isLoading) return;
+      if (observer.current) observer.current.disconnect();
+      observer.current = new IntersectionObserver((entries) => {
+        if (entries[0].isIntersecting && libraryHasMore) {
+          setPageNumber(pageNumber + 1);
+        }
+      });
+      if (node) observer.current.observe(node);
+      console.log(node);
+    },
+    [isLoading, libraryHasMore]
+  );
+```
+
+### Intersection observer Callback usage
+``` JavaScript
+                    if (libraryItems?.length === index + 100) {
+                      return (
+                        <Grid item xs="12" key={Obj.guid + index}>
+                          <ListItem ref={lastLibraryItem}>
+                            <ListItemAvatar>
+                              <Avatar alt={NoArt} src={Obj.thumb} />
+                            </ListItemAvatar>
+                            <Typography variant="h6" noWrap>
+                              {Obj.title} - {Obj.grandparentTitle} -{' '}
+                              {Obj.parentTitle}
+                            </Typography>
+                          </ListItem>
+                        </Grid>
+                      );
+                    }
+```
+
+### Intersection observer to load more library items when the callbackref object comes into view
+``` JavaScript
+ const observer = useRef();
+  const lastLibraryItem = useCallback(
+    (node) => {
+      if (isLoading) return;
+      if (observer.current) observer.current.disconnect();
+      observer.current = new IntersectionObserver((entries) => {
+        if (entries[0].isIntersecting && libraryHasMore) {
+          setPageNumber(pageNumber + 1);
+        }
+      });
+      if (node) observer.current.observe(node);
+      console.log(node);
+    },
+    [isLoading, libraryHasMore]
+  );
+```
+
+### Get Plex Music Hub data
+``` JavaScript
+ async function UpdateHubs(plexClientInformation, plexServers, plexLibraries) {
+    const tempMusicHubs = await GetMusicHub(
+      plexClientInformation,
+      plexServers, // No Auth Token is needed since the server entries have their own access tokens
+      plexLibraries
+    );
+    setMusicHubs(tempMusicHubs);
+  }
+```
+
+