Implement UI for automatically updating lists.

CHANGELOG.md

@@ -1,13 +1,17 @@
 ## Changelog
 
-### v0.0.12
+### v0.1.0
 
 #### Fixed
 
 - The screen no longer appears to be blank when the LastPass browser extension is enabled.
 - The advanced search input fields are now correctly aligned in Firefox.
 - Spurious bullets have been removed from the search result and list entry lists.
 
+#### Updated
+
+- Lists can now be automatically updated using the configured search parameters.
+
 ### v0.0.11
 
 #### Fixed

src/actions.ts

@@ -1043,6 +1043,11 @@ export default class ActionCreator extends BaseActionCreator {
       if (url) {
         return dispatch(this.fetchCollection(url));
       }
+
+      // If there isn't a viable search URL (i.e, no filters have been added to the advanced search
+      // query), just clear the results.
+
+      return dispatch(this.clear(ActionCreator.COLLECTION));
     };
   }
 

src/components/AdvancedSearchBuilder.tsx

@@ -17,7 +17,7 @@ export interface AdvancedSearchBuilderProps {
 }
 
 export const fields = [
-  { value: "distributor", label: "distributor" },
+  { value: "data_source", label: "distributor" },
   { value: "publisher", label: "publisher" },
   { value: "published", label: "publication date" },
   { value: "genre", label: "genre" },

src/components/CustomListEditor.tsx

@@ -25,7 +25,9 @@ type CustomListEditorProps = {
   entries?: CustomListEditorEntriesData;
   entryPoints?: string[];
   isFetchingMoreCustomListEntries: boolean;
+  isFetchingSearchResults: boolean;
   isFetchingMoreSearchResults: boolean;
+  isLoaded?: boolean;
   isModified?: boolean;
   isValid?: boolean;
   languages: LanguagesData;
@@ -67,7 +69,9 @@ export default function CustomListEditor({
   entries,
   entryPoints,
   isFetchingMoreCustomListEntries,
+  isFetchingSearchResults,
   isFetchingMoreSearchResults,
+  isLoaded,
   isModified,
   isValid,
   languages,
@@ -97,6 +101,13 @@ export default function CustomListEditor({
 }: CustomListEditorProps) {
   const { collections: listCollections, name } = properties;
 
+  // Automatically execute the search when the list being edited changes, or finishes loading
+  // (which means a stored query may have been loaded).
+
+  React.useEffect(() => {
+    search?.();
+  }, [listId, isLoaded]);
+
   return (
     <div className="custom-list-editor">
       <div className="custom-list-editor-header">
@@ -164,7 +175,9 @@ export default function CustomListEditor({
           )}
 
           <CustomListSearch
+            autoUpdate={properties.autoUpdate}
             searchParams={searchParams}
+            updateAutoUpdate={(value) => updateProperty?.("autoUpdate", value)}
             updateSearchParam={updateSearchParam}
             search={search}
             entryPoints={entryPoints}
@@ -180,10 +193,12 @@ export default function CustomListEditor({
         </section>
 
         <CustomListEntriesEditor
+          autoUpdate={properties.autoUpdate}
           searchResults={searchResults}
           entries={entries.current}
           loadMoreSearchResults={loadMoreSearchResults}
           loadMoreEntries={loadMoreEntries}
+          isFetchingSearchResults={isFetchingSearchResults}
           isFetchingMoreSearchResults={isFetchingMoreSearchResults}
           isFetchingMoreCustomListEntries={isFetchingMoreCustomListEntries}
           opdsFeedUrl={`${library?.short_name}/${
@@ -195,6 +210,7 @@ export default function CustomListEditor({
           addAllEntries={addAllEntries}
           deleteEntry={deleteEntry}
           deleteAllEntries={deleteAllEntries}
+          refreshResults={search}
         />
       </div>
     </div>