Add:Schedule periodic library scans #655

client/components/modals/libraries/EditModal.vue

@@ -12,7 +12,7 @@
     </div>
 
     <div class="px-4 w-full text-sm pt-6 pb-20 rounded-b-lg rounded-tr-lg bg-bg shadow-lg border border-black-300 relative overflow-hidden" style="min-height: 400px; max-height: 80vh">
-      <component v-if="libraryCopy && show" :is="tabName" :is-new="!library" :library="libraryCopy" :processing.sync="processing" @update="updateLibrary" @close="show = false" />
+      <component v-if="libraryCopy && show" ref="tabComponent" :is="tabName" :is-new="!library" :library="libraryCopy" :processing.sync="processing" @update="updateLibrary" @close="show = false" />
 
       <div class="absolute bottom-0 left-0 w-full px-4 py-4 border-t border-white border-opacity-10">
         <div class="flex justify-end">
@@ -144,6 +144,13 @@ export default {
     submit() {
       if (!this.validate()) return
 
+      // If custom expression input is focused then unfocus it instead of submitting
+      if (this.$refs.tabComponent && this.$refs.tabComponent.checkBlurExpressionInput) {
+        if (this.$refs.tabComponent.checkBlurExpressionInput()) {
+          return
+        }
+      }
+
       if (this.library) {
         this.submitUpdateLibrary()
       } else {

client/components/modals/libraries/ScheduleScan.vue

@@ -4,7 +4,7 @@
       <p class="text-lg">Schedule Automatic Library Scans</p>
       <ui-checkbox v-model="enableAutoScan" @input="toggleEnableAutoScan" label="Enable" checkbox-bg="bg" label-class="pl-2 text-base" />
     </div>
-    <widgets-cron-expression-builder v-if="enableAutoScan" v-model="cronExpression" @input="updatedCron" />
+    <widgets-cron-expression-builder ref="cronExpressionBuilder" v-if="enableAutoScan" v-model="cronExpression" @input="updatedCron" />
   </div>
 </template>
 
@@ -25,6 +25,11 @@ export default {
   },
   computed: {},
   methods: {
+    checkBlurExpressionInput() {
+      // returns true if advanced cron input is focused
+      if (!this.$refs.cronExpressionBuilder) return false
+      return this.$refs.cronExpressionBuilder.checkBlurExpressionInput()
+    },
     toggleEnableAutoScan(v) {
       if (!v) this.updatedCron(null)
       else if (!this.cronExpression) {

client/components/ui/TextInput.vue

@@ -36,7 +36,8 @@ export default {
   data() {
     return {
       showPassword: false,
-      isHovering: false
+      isHovering: false,
+      isFocused: false
     }
   },
   computed: {
@@ -66,9 +67,11 @@ export default {
       this.inputValue = ''
     },
     focused() {
+      this.isFocused = true
       this.$emit('focus')
     },
     blurred() {
+      this.isFocused = false
       this.$emit('blur')
     },
     change(e) {

client/components/widgets/CronExpressionBuilder.vue

@@ -24,7 +24,7 @@
       </template>
       <template v-else>
         <p class="px-1 text-sm font-semibold">Cron Expression</p>
-        <ui-text-input v-model="customCronExpression" @blur="cronExpressionBlur" label="Cron Expression" :padding-y="2" text-center class="w-full text-4xl -tracking-widest mb-4 font-mono" />
+        <ui-text-input ref="customExpressionInput" v-model="customCronExpression" @blur="cronExpressionBlur" label="Cron Expression" :padding-y="2" text-center class="w-full text-4xl -tracking-widest mb-4 font-mono" />
 
         <div class="flex items-center justify-center">
           <widgets-loading-spinner v-if="isValidating" class="mr-2" />
@@ -127,6 +127,14 @@ export default {
     }
   },
   methods: {
+    checkBlurExpressionInput() {
+      if (!this.showAdvancedView || !this.$refs.customExpressionInput) return false
+      if (this.$refs.customExpressionInput.isFocused) {
+        this.$refs.customExpressionInput.blur()
+        return true
+      }
+      return false
+    },
     updateCron() {
       if (!this.minuteIsValid || !this.hourIsValid || !this.selectedWeekdays.length) {
         this.cronExpression = null
@@ -168,11 +176,12 @@ export default {
         this.customCronError = 'Invalid cron expression'
         this.isValid = false
         return
-      } else if (this.customCronExpression.split(' ')[0] === '*') {
-        this.customCronError = 'Cannot use * in minutes position'
-        this.isValid = false
-        return
       }
+      // if (this.customCronExpression.split(' ')[0] === '*') {
+      //   this.customCronError = 'Cannot use * in minutes position'
+      //   this.isValid = false
+      //   return
+      // }
 
       if (this.customCronExpression !== this.cronExpression) {
         this.selectedWeekdays = []