fix(frontend): handle currentLibrary possibly being null on first manual sync

src/components/Settings/SettingsPlex.tsx

@@ -48,7 +48,7 @@ interface SyncStatus {
   running: boolean;
   progress: number;
   total: number;
-  currentLibrary: Library;
+  currentLibrary?: Library;
   libraries: Library[];
 }
 
@@ -86,12 +86,17 @@ const SettingsPlex: React.FC<SettingsPlexProps> = ({ onComplete }) => {
 
   const syncLibraries = async () => {
     setIsSyncing(true);
-    await axios.get('/api/v1/settings/plex/library', {
+
-      params: {
+    const params: { sync: boolean; enable?: string } = {
       sync: true,
-        enable:
+    };
-          activeLibraries.length > 0 ? activeLibraries.join(',') : undefined,
+
-      },
+    if (activeLibraries.length > 0) {
+      params.enable = activeLibraries.join(',');
+    }
+
+    await axios.get('/api/v1/settings/plex/library', {
+      params,
     });
     setIsSyncing(false);
     revalidate();
@@ -118,13 +123,16 @@ const SettingsPlex: React.FC<SettingsPlexProps> = ({ onComplete }) => {
   const toggleLibrary = async (libraryId: string) => {
     setIsSyncing(true);
     if (activeLibraries.includes(libraryId)) {
+      const params: { enable?: string } = {};
+
+      if (activeLibraries.length > 1) {
+        params.enable = activeLibraries
+          .filter((id) => id !== libraryId)
+          .join(',');
+      }
+
       await axios.get('/api/v1/settings/plex/library', {
-        params: {
+        params,
-          enable:
-            activeLibraries.length > 0
-              ? activeLibraries.filter((id) => id !== libraryId).join(',')
-              : undefined,
-        },
       });
     } else {
       await axios.get('/api/v1/settings/plex/library', {
@@ -369,6 +377,7 @@ const SettingsPlex: React.FC<SettingsPlexProps> = ({ onComplete }) => {
             <div className="flex flex-col w-full sm:flex-row">
               {dataSync?.running && (
                 <>
+                  {dataSync.currentLibrary && (
                     <div className="flex items-center mb-2 mr-0 sm:mb-0 sm:mr-2">
                       <Badge>
                         <FormattedMessage
@@ -377,17 +386,20 @@ const SettingsPlex: React.FC<SettingsPlexProps> = ({ onComplete }) => {
                         />
                       </Badge>
                     </div>
+                  )}
                   <div className="flex items-center">
                     <Badge badgeType="warning">
                       <FormattedMessage
                         {...messages.librariesRemaining}
                         values={{
-                          count: dataSync.libraries.slice(
+                          count: dataSync.currentLibrary
+                            ? dataSync.libraries.slice(
                                 dataSync.libraries.findIndex(
                                   (library) =>
-                                library.id === dataSync.currentLibrary.id
+                                    library.id === dataSync.currentLibrary?.id
                                 ) + 1
-                          ).length,
+                              ).length
+                            : 0,
                         }}
                       />
                     </Badge>