@plusscommunities/pluss-maintenance-web-forms 1.1.37-beta.5 → 1.1.37-beta.6

package/dist/index.cjs.js

@@ -816,25 +816,11 @@ class JobList extends React.Component {
       }
       return params;
     });
-    /**
-     * Minimum number of items to auto-fill before stopping background fetch.
-     * Because DynamoDB pages are unfiltered and the backend filters after
-     * query, a single page may yield very few matching results. We keep
-     * fetching in the background until we have this many items to display.
-     */
-    _defineProperty__default["default"](this, "MIN_PAGE_SIZE", 20);
     /**
      * Monotonically increasing ID used to ignore stale fetch results.
      * When a filter changes, fetchJobs() increments this counter. Any
-     * in-flight fetch or autoFillPages loop checks the counter before
-     * applying results — if it doesn't match, the results are discarded.
-     *
-     * Alternative: AbortController would actually cancel the HTTP request
-     * (axios supports it via the `signal` config option). That would save
-     * bandwidth and server load but requires threading `signal` through
-     * authedFunction → getJobs2 → fetchPage (3 layers). The fetchId
-     * approach is simpler and sufficient — stale requests still complete
-     * in the background but their results are ignored.
+     * in-flight fetch checks the counter before applying results —
+     * if it doesn't match, the results are discarded.
      */
     _defineProperty__default["default"](this, "_fetchId", 0);
     /**
@@ -850,9 +836,6 @@ class JobList extends React.Component {
     });
     /**
      * Fetch the first page and render immediately.
-     * If fewer than MIN_PAGE_SIZE items returned and there's more data,
-     * kicks off a background loop that keeps fetching and appending
-     * so results appear progressively.
      */
     _defineProperty__default["default"](this, "fetchJobs", async () => {
       const fetchId = ++this._fetchId;
@@ -862,8 +845,7 @@ class JobList extends React.Component {
       }, async () => {
         try {
           const res = await this.fetchPage(null);
-          if (this._fetchId !== fetchId) return; // stale fetch
-
+          if (this._fetchId !== fetchId) return;
           const items = res.data.Items || [];
           const lastKey = res.data.LastKey || null;
           this.setState({
@@ -874,13 +856,8 @@ class JobList extends React.Component {
           });
           this.props.jobsLoaded(items);
           this.setRequesters(items);
-
-          // Auto-fill in background if first page was sparse
-          if (lastKey && items.length < this.MIN_PAGE_SIZE) {
-            this.autoFillPages(items, lastKey, fetchId);
-          }
         } catch (error) {
-          if (this._fetchId !== fetchId) return; // stale fetch
+          if (this._fetchId !== fetchId) return;
           console.error('fetchJobs', error);
           this.setState({
             loading: false
@@ -888,52 +865,8 @@ class JobList extends React.Component {
         }
       });
     });
-    /**
-     * Background loop: keep fetching pages and appending results
-     * until we have MIN_PAGE_SIZE items or run out of data.
-     * Each page is rendered as it arrives so the user sees
-     * results appearing progressively.
-     */
-    _defineProperty__default["default"](this, "autoFillPages", async (existingJobs, startKey, fetchId) => {
-      this.setState({
-        loadingMore: true
-      });
-      let currentJobs = existingJobs;
-      let currentLastKey = startKey;
-      try {
-        while (currentLastKey && currentJobs.length < this.MIN_PAGE_SIZE) {
-          const res = await this.fetchPage(currentLastKey);
-          if (this._fetchId !== fetchId) return; // stale fetch
-
-          const items = res.data.Items || [];
-          currentLastKey = res.data.LastKey || null;
-          currentJobs = [...currentJobs, ...items];
-
-          // Append to UI immediately after each page arrives
-          this.setState({
-            jobs: currentJobs,
-            lastKey: currentLastKey,
-            hasMore: !!currentLastKey
-          });
-          if (items.length > 0) {
-            this.props.jobsLoaded(items);
-            this.setRequesters(currentJobs);
-          }
-        }
-      } catch (error) {
-        if (this._fetchId !== fetchId) return; // stale fetch
-        console.error('autoFillPages', error);
-      } finally {
-        if (this._fetchId === fetchId) {
-          this.setState({
-            loadingMore: false
-          });
-        }
-      }
-    });
     /**
      * Load the next batch of jobs when the user clicks "Load More".
-     * Fetches one page and also auto-fills in background if sparse.
      */
     _defineProperty__default["default"](this, "loadMore", async () => {
       const fetchId = ++this._fetchId;
@@ -946,30 +879,21 @@ class JobList extends React.Component {
       }, async () => {
         try {
           const res = await this.fetchPage(lastKey);
-          if (this._fetchId !== fetchId) return; // stale fetch
-
+          if (this._fetchId !== fetchId) return;
           const items = res.data.Items || [];
           const newLastKey = res.data.LastKey || null;
           const updatedJobs = [...jobs, ...items];
           this.setState({
             jobs: updatedJobs,
             lastKey: newLastKey,
-            hasMore: !!newLastKey
+            hasMore: !!newLastKey,
+            loadingMore: false
           });
           if (items.length > 0) {
             this.props.jobsLoaded(items);
           }
-
-          // Auto-fill in background if this page was sparse
-          if (newLastKey && items.length < this.MIN_PAGE_SIZE) {
-            this.autoFillPages(updatedJobs, newLastKey, fetchId);
-          } else {
-            this.setState({
-              loadingMore: false
-            });
-          }
         } catch (error) {
-          if (this._fetchId !== fetchId) return; // stale fetch
+          if (this._fetchId !== fetchId) return;
           console.error('loadMore', error);
           this.setState({
             loadingMore: false
@@ -1801,16 +1725,24 @@ class JobList extends React.Component {
       }, "Loading more results\u2026"));
     }
     return /*#__PURE__*/React__default["default"].createElement("div", {
-      className: "flex flex-center-row",
       style: {
-        padding: '16px 0'
+        margin: '24px 0 40px 0',
+        position: 'relative',
+        top: -16
       }
     }, /*#__PURE__*/React__default["default"].createElement(Components$7.Button, {
-      inline: true,
-      buttonType: "tertiary",
+      buttonType: "primary",
       onClick: this.loadMore,
-      isActive: true
-    }, "Load More"));
+      isActive: true,
+      style: {
+        width: '100%'
+      }
+    }, "Load More Results", /*#__PURE__*/React__default["default"].createElement(FontAwesome__default["default"], {
+      name: "plus",
+      style: {
+        marginLeft: 8
+      }
+    })));
   }
   renderContent() {
     const {

package/dist/index.esm.js

@@ -785,25 +785,11 @@ class JobList extends Component {
       }
       return params;
     });
-    /**
-     * Minimum number of items to auto-fill before stopping background fetch.
-     * Because DynamoDB pages are unfiltered and the backend filters after
-     * query, a single page may yield very few matching results. We keep
-     * fetching in the background until we have this many items to display.
-     */
-    _defineProperty(this, "MIN_PAGE_SIZE", 20);
     /**
      * Monotonically increasing ID used to ignore stale fetch results.
      * When a filter changes, fetchJobs() increments this counter. Any
-     * in-flight fetch or autoFillPages loop checks the counter before
-     * applying results — if it doesn't match, the results are discarded.
-     *
-     * Alternative: AbortController would actually cancel the HTTP request
-     * (axios supports it via the `signal` config option). That would save
-     * bandwidth and server load but requires threading `signal` through
-     * authedFunction → getJobs2 → fetchPage (3 layers). The fetchId
-     * approach is simpler and sufficient — stale requests still complete
-     * in the background but their results are ignored.
+     * in-flight fetch checks the counter before applying results —
+     * if it doesn't match, the results are discarded.
      */
     _defineProperty(this, "_fetchId", 0);
     /**
@@ -819,9 +805,6 @@ class JobList extends Component {
     });
     /**
      * Fetch the first page and render immediately.
-     * If fewer than MIN_PAGE_SIZE items returned and there's more data,
-     * kicks off a background loop that keeps fetching and appending
-     * so results appear progressively.
      */
     _defineProperty(this, "fetchJobs", async () => {
       const fetchId = ++this._fetchId;
@@ -831,8 +814,7 @@ class JobList extends Component {
       }, async () => {
         try {
           const res = await this.fetchPage(null);
-          if (this._fetchId !== fetchId) return; // stale fetch
-
+          if (this._fetchId !== fetchId) return;
           const items = res.data.Items || [];
           const lastKey = res.data.LastKey || null;
           this.setState({
@@ -843,13 +825,8 @@ class JobList extends Component {
           });
           this.props.jobsLoaded(items);
           this.setRequesters(items);
-
-          // Auto-fill in background if first page was sparse
-          if (lastKey && items.length < this.MIN_PAGE_SIZE) {
-            this.autoFillPages(items, lastKey, fetchId);
-          }
         } catch (error) {
-          if (this._fetchId !== fetchId) return; // stale fetch
+          if (this._fetchId !== fetchId) return;
           console.error('fetchJobs', error);
           this.setState({
             loading: false
@@ -857,52 +834,8 @@ class JobList extends Component {
         }
       });
     });
-    /**
-     * Background loop: keep fetching pages and appending results
-     * until we have MIN_PAGE_SIZE items or run out of data.
-     * Each page is rendered as it arrives so the user sees
-     * results appearing progressively.
-     */
-    _defineProperty(this, "autoFillPages", async (existingJobs, startKey, fetchId) => {
-      this.setState({
-        loadingMore: true
-      });
-      let currentJobs = existingJobs;
-      let currentLastKey = startKey;
-      try {
-        while (currentLastKey && currentJobs.length < this.MIN_PAGE_SIZE) {
-          const res = await this.fetchPage(currentLastKey);
-          if (this._fetchId !== fetchId) return; // stale fetch
-
-          const items = res.data.Items || [];
-          currentLastKey = res.data.LastKey || null;
-          currentJobs = [...currentJobs, ...items];
-
-          // Append to UI immediately after each page arrives
-          this.setState({
-            jobs: currentJobs,
-            lastKey: currentLastKey,
-            hasMore: !!currentLastKey
-          });
-          if (items.length > 0) {
-            this.props.jobsLoaded(items);
-            this.setRequesters(currentJobs);
-          }
-        }
-      } catch (error) {
-        if (this._fetchId !== fetchId) return; // stale fetch
-        console.error('autoFillPages', error);
-      } finally {
-        if (this._fetchId === fetchId) {
-          this.setState({
-            loadingMore: false
-          });
-        }
-      }
-    });
     /**
      * Load the next batch of jobs when the user clicks "Load More".
-     * Fetches one page and also auto-fills in background if sparse.
      */
     _defineProperty(this, "loadMore", async () => {
       const fetchId = ++this._fetchId;
@@ -915,30 +848,21 @@ class JobList extends Component {
       }, async () => {
         try {
           const res = await this.fetchPage(lastKey);
-          if (this._fetchId !== fetchId) return; // stale fetch
-
+          if (this._fetchId !== fetchId) return;
           const items = res.data.Items || [];
           const newLastKey = res.data.LastKey || null;
           const updatedJobs = [...jobs, ...items];
           this.setState({
             jobs: updatedJobs,
             lastKey: newLastKey,
-            hasMore: !!newLastKey
+            hasMore: !!newLastKey,
+            loadingMore: false
           });
           if (items.length > 0) {
             this.props.jobsLoaded(items);
           }
-
-          // Auto-fill in background if this page was sparse
-          if (newLastKey && items.length < this.MIN_PAGE_SIZE) {
-            this.autoFillPages(updatedJobs, newLastKey, fetchId);
-          } else {
-            this.setState({
-              loadingMore: false
-            });
-          }
         } catch (error) {
-          if (this._fetchId !== fetchId) return; // stale fetch
+          if (this._fetchId !== fetchId) return;
           console.error('loadMore', error);
           this.setState({
             loadingMore: false
@@ -1770,16 +1694,24 @@ class JobList extends Component {
       }, "Loading more results\u2026"));
     }
     return /*#__PURE__*/React.createElement("div", {
-      className: "flex flex-center-row",
       style: {
-        padding: '16px 0'
+        margin: '24px 0 40px 0',
+        position: 'relative',
+        top: -16
       }
     }, /*#__PURE__*/React.createElement(Components$7.Button, {
-      inline: true,
-      buttonType: "tertiary",
+      buttonType: "primary",
       onClick: this.loadMore,
-      isActive: true
-    }, "Load More"));
+      isActive: true,
+      style: {
+        width: '100%'
+      }
+    }, "Load More Results", /*#__PURE__*/React.createElement(FontAwesome, {
+      name: "plus",
+      style: {
+        marginLeft: 8
+      }
+    })));
   }
   renderContent() {
     const {

package/dist/index.umd.js

@@ -805,25 +805,11 @@
         }
         return params;
       });
-      /**
-       * Minimum number of items to auto-fill before stopping background fetch.
-       * Because DynamoDB pages are unfiltered and the backend filters after
-       * query, a single page may yield very few matching results. We keep
-       * fetching in the background until we have this many items to display.
-       */
-      _defineProperty__default["default"](this, "MIN_PAGE_SIZE", 20);
       /**
        * Monotonically increasing ID used to ignore stale fetch results.
        * When a filter changes, fetchJobs() increments this counter. Any
-       * in-flight fetch or autoFillPages loop checks the counter before
-       * applying results — if it doesn't match, the results are discarded.
-       *
-       * Alternative: AbortController would actually cancel the HTTP request
-       * (axios supports it via the `signal` config option). That would save
-       * bandwidth and server load but requires threading `signal` through
-       * authedFunction → getJobs2 → fetchPage (3 layers). The fetchId
-       * approach is simpler and sufficient — stale requests still complete
-       * in the background but their results are ignored.
+       * in-flight fetch checks the counter before applying results —
+       * if it doesn't match, the results are discarded.
        */
       _defineProperty__default["default"](this, "_fetchId", 0);
       /**
@@ -839,9 +825,6 @@
       });
       /**
        * Fetch the first page and render immediately.
-       * If fewer than MIN_PAGE_SIZE items returned and there's more data,
-       * kicks off a background loop that keeps fetching and appending
-       * so results appear progressively.
        */
       _defineProperty__default["default"](this, "fetchJobs", async () => {
         const fetchId = ++this._fetchId;
@@ -851,8 +834,7 @@
         }, async () => {
           try {
             const res = await this.fetchPage(null);
-            if (this._fetchId !== fetchId) return; // stale fetch
-
+            if (this._fetchId !== fetchId) return;
             const items = res.data.Items || [];
             const lastKey = res.data.LastKey || null;
             this.setState({
@@ -863,13 +845,8 @@
             });
             this.props.jobsLoaded(items);
             this.setRequesters(items);
-
-            // Auto-fill in background if first page was sparse
-            if (lastKey && items.length < this.MIN_PAGE_SIZE) {
-              this.autoFillPages(items, lastKey, fetchId);
-            }
           } catch (error) {
-            if (this._fetchId !== fetchId) return; // stale fetch
+            if (this._fetchId !== fetchId) return;
             console.error('fetchJobs', error);
             this.setState({
               loading: false
@@ -877,52 +854,8 @@
           }
         });
       });
-      /**
-       * Background loop: keep fetching pages and appending results
-       * until we have MIN_PAGE_SIZE items or run out of data.
-       * Each page is rendered as it arrives so the user sees
-       * results appearing progressively.
-       */
-      _defineProperty__default["default"](this, "autoFillPages", async (existingJobs, startKey, fetchId) => {
-        this.setState({
-          loadingMore: true
-        });
-        let currentJobs = existingJobs;
-        let currentLastKey = startKey;
-        try {
-          while (currentLastKey && currentJobs.length < this.MIN_PAGE_SIZE) {
-            const res = await this.fetchPage(currentLastKey);
-            if (this._fetchId !== fetchId) return; // stale fetch
-
-            const items = res.data.Items || [];
-            currentLastKey = res.data.LastKey || null;
-            currentJobs = [...currentJobs, ...items];
-
-            // Append to UI immediately after each page arrives
-            this.setState({
-              jobs: currentJobs,
-              lastKey: currentLastKey,
-              hasMore: !!currentLastKey
-            });
-            if (items.length > 0) {
-              this.props.jobsLoaded(items);
-              this.setRequesters(currentJobs);
-            }
-          }
-        } catch (error) {
-          if (this._fetchId !== fetchId) return; // stale fetch
-          console.error('autoFillPages', error);
-        } finally {
-          if (this._fetchId === fetchId) {
-            this.setState({
-              loadingMore: false
-            });
-          }
-        }
-      });
       /**
        * Load the next batch of jobs when the user clicks "Load More".
-       * Fetches one page and also auto-fills in background if sparse.
        */
       _defineProperty__default["default"](this, "loadMore", async () => {
         const fetchId = ++this._fetchId;
@@ -935,30 +868,21 @@
         }, async () => {
           try {
             const res = await this.fetchPage(lastKey);
-            if (this._fetchId !== fetchId) return; // stale fetch
-
+            if (this._fetchId !== fetchId) return;
             const items = res.data.Items || [];
             const newLastKey = res.data.LastKey || null;
             const updatedJobs = [...jobs, ...items];
             this.setState({
               jobs: updatedJobs,
               lastKey: newLastKey,
-              hasMore: !!newLastKey
+              hasMore: !!newLastKey,
+              loadingMore: false
             });
             if (items.length > 0) {
               this.props.jobsLoaded(items);
             }
-
-            // Auto-fill in background if this page was sparse
-            if (newLastKey && items.length < this.MIN_PAGE_SIZE) {
-              this.autoFillPages(updatedJobs, newLastKey, fetchId);
-            } else {
-              this.setState({
-                loadingMore: false
-              });
-            }
           } catch (error) {
-            if (this._fetchId !== fetchId) return; // stale fetch
+            if (this._fetchId !== fetchId) return;
             console.error('loadMore', error);
             this.setState({
               loadingMore: false
@@ -1790,16 +1714,24 @@
         }, "Loading more results\u2026"));
       }
       return /*#__PURE__*/React__default["default"].createElement("div", {
-        className: "flex flex-center-row",
         style: {
-          padding: '16px 0'
+          margin: '24px 0 40px 0',
+          position: 'relative',
+          top: -16
         }
       }, /*#__PURE__*/React__default["default"].createElement(Components$7.Button, {
-        inline: true,
-        buttonType: "tertiary",
+        buttonType: "primary",
         onClick: this.loadMore,
-        isActive: true
-      }, "Load More"));
+        isActive: true,
+        style: {
+          width: '100%'
+        }
+      }, "Load More Results", /*#__PURE__*/React__default["default"].createElement(FontAwesome__default["default"], {
+        name: "plus",
+        style: {
+          marginLeft: 8
+        }
+      })));
     }
     renderContent() {
       const {

package/package.json

@@ -1,6 +1,6 @@
 {
 	"name": "@plusscommunities/pluss-maintenance-web-forms",
-	"version": "1.1.37-beta.5",
+	"version": "1.1.37-beta.6",
 	"description": "Extension package to enable maintenance on Pluss Communities Platform",
 	"main": "dist/index.cjs.js",
 	"module": "dist/index.esm.js",
@@ -17,9 +17,9 @@
 		"upload:p": "npm run patch && npm run upload",
 		"copy:add": "run(){ ext=${1:-default}; test -f src/values.config.$ext.js || cp src/values.config.default.js src/values.config.$ext.js; }; run",
 		"copy:get": "echo $npm_package_name",
-		"copy:set": "run(){ target='\\@plusscommunities\\/pluss-maintenance-web'; ext=${1:-default}; [ $ext == 'default' ] && replace=$target || replace=$target'-'$ext; echo 'Setting target to '$replace; test -f src/values.config.$ext.js && cp -f src/values.config.$ext.js src/values.config.js; sed -i'' -e 's/'$target'.*\"/'$replace'\"/g' package.json; }; run",
+		"copy:set": "run(){ target='\\@plusscommunities\\/pluss-maintenance-web'; ext=${1:-default}; [ $ext == 'default' ] && replace=$target || replace=$target'-'$ext; echo 'Setting target to '$replace; test -f src/values.config.$ext.js && cp -f src/values.config.$ext.js src/values.config.js; sed -i '' -e 's/'$target'.*\"/'$replace'\"/g' package.json; }; run",
 		"copy:betaupload": "for file in `ls ./src/values.config.*.js`; do dup=`echo $file | sed 's/.*values\\.config\\.\\(.*\\)\\.js/\\1/'`; npm run copy:set $dup; npm run betaupload; done; npm run copy:set;",
-		"copy:upload": "for file in `ls ./src/values.config.*.js`; do dup=`echo $file | sed 's/.*values\\.config\\.\\(.*\\)\\.js/\\1/'`; npm run copy:set $dup; npm run upload; done; npm run copy:set;"
+		"copy:upload": "npm run patch; for file in `ls ./src/values.config.*.js`; do dup=`echo $file | sed 's/.*values\\.config\\.\\(.*\\)\\.js/\\1/'`; npm run copy:set $dup; npm run upload; done; npm run copy:set;"
 	},
 	"author": "Phillip Suh",
 	"license": "ISC",