[Enhancement] Adds ability to enable/disable sources (#481)

* [Unrelated] updated module name for existing liveview module

* Updated toggle component and moved MP index table to a liveview

* [WIP] reverted MP index table; added source count to MP index

* Moved new live table to sources index

* Added 'enabled' boolean to sources

* Got 'enabled' logic working re: downloading pending media

* Updated sources context to do the right thing when a source is updated

* Docs and tests

* Updated slow indexing to maintain its old schedule if re-enabled

* Hooked up the enabled toggle to the sources page

* [Unrelated] added direct links to various tabs on the sources table

* More tests

* Removed unneeded guard in

* Removed outdated comment

assets/js/alpine_helpers.js

@@ -35,3 +35,10 @@ window.markVersionAsSeen = (versionString) => {
 window.isVersionSeen = (versionString) => {
   return localStorage.getItem('seenVersion') === versionString
 }
+
+window.dispatchFor = (elementOrId, eventName, detail = {}) => {
+  const element =
+    typeof elementOrId === 'string' ? document.getElementById(elementOrId) : elementOrId
+
+  element.dispatchEvent(new CustomEvent(eventName, { detail }))
+}

assets/js/app.js

@@ -39,7 +39,7 @@ let liveSocket = new LiveSocket(document.body.dataset.socketPath, Socket, {
     }
   },
   hooks: {
-    supressEnterSubmission: {
+    'supress-enter-submission': {
       mounted() {
         this.el.addEventListener('keypress', (event) => {
           if (event.key === 'Enter') {
@@ -47,6 +47,29 @@ let liveSocket = new LiveSocket(document.body.dataset.socketPath, Socket, {
           }
         })
       }
+    },
+    'formless-input': {
+      mounted() {
+        const subscribedEvents = this.el.dataset.subscribe.split(' ')
+        const eventName = this.el.dataset.eventName || ''
+        const identifier = this.el.dataset.identifier || ''
+
+        subscribedEvents.forEach((domEvent) => {
+          this.el.addEventListener(domEvent, () => {
+            // This ensures that the event is pushed to the server after the input value has been updated
+            // so that the server has the most up-to-date value
+            setTimeout(() => {
+              this.pushEvent('formless-input', {
+                value: this.el.value,
+                id: identifier,
+                event: eventName,
+                dom_id: this.el.id,
+                dom_event: domEvent
+              })
+            }, 0)
+          })
+        })
+      }
     }
   }
 })