make min/max expiry dynamic

src/boot/after_store.js

@@ -194,13 +194,12 @@ const getNodeInfo = async ({ store }) => {
     if (res.ok) {
       const data = await res.json()
       const metadata = data.metadata
-      store.dispatch('setInstanceOption', { name: 'pollLimits', value: metadata.pollLimits })
-
       const features = metadata.features
       store.dispatch('setInstanceOption', { name: 'mediaProxyAvailable', value: features.includes('media_proxy') })
       store.dispatch('setInstanceOption', { name: 'chatAvailable', value: features.includes('chat') })
       store.dispatch('setInstanceOption', { name: 'gopherAvailable', value: features.includes('gopher') })
       store.dispatch('setInstanceOption', { name: 'pollsAvailable', value: features.includes('polls') })
+      store.dispatch('setInstanceOption', { name: 'pollLimits', value: metadata.pollLimits })
 
       store.dispatch('setInstanceOption', { name: 'restrictedNicknames', value: metadata.restrictedNicknames })
       store.dispatch('setInstanceOption', { name: 'postFormats', value: metadata.postFormats })

src/components/media_upload/media_upload.vue

@@ -13,7 +13,8 @@
 <style>
  .media-upload {
      font-size: 26px;
-     flex: 1;
+     min-width: 50px;
+     flex: 0;
  }
 
  .icon-upload {

src/components/poll/poll_form.js

@@ -1,12 +1,13 @@
+import * as DateUtils from 'src/services/date_utils/date_utils.js'
+
 export default {
   name: 'PollForm',
   props: ['visible'],
   data: () => ({
     pollType: 'single',
     options: ['', ''],
-    expiryAmount: 2,
-    expiryUnit: 'hours',
-    expiryUnits: ['minutes', 'hours', 'days']
+    expiryAmount: 10,
+    expiryUnit: 'minutes'
   }),
   computed: {
     pollLimits () {
@@ -17,13 +18,36 @@ export default {
     },
     maxLength () {
       return this.pollLimits.max_option_chars
+    },
+    expiryUnits () {
+      const allUnits = ['minutes', 'hours', 'days']
+      const expiry = this.convertExpiryFromUnit
+      return allUnits.filter(
+        unit => this.pollLimits.max_expiration >= expiry(unit, 1)
+      )
+    },
+    minExpirationInCurrentUnit () {
+      return Math.ceil(
+        this.convertExpiryToUnit(
+          this.expiryUnit,
+          this.pollLimits.min_expiration
+        )
+      )
+    },
+    maxExpirationInCurrentUnit () {
+      return Math.floor(
+        this.convertExpiryToUnit(
+          this.expiryUnit,
+          this.pollLimits.max_expiration
+        )
+      )
     }
   },
   methods: {
     clear () {
       this.pollType = 'single'
       this.options = ['', '']
-      this.expiryAmount = 1
+      this.expiryAmount = 10
       this.expiryUnit = 'minutes'
     },
     nextOption (index) {
@@ -52,17 +76,34 @@ export default {
         this.options.splice(index, 1)
       }
     },
+    convertExpiryToUnit (unit, amount) {
+      // Note: we want seconds and not milliseconds
+      switch (unit) {
+        case 'minutes': return (1000 * amount) / DateUtils.MINUTE
+        case 'hours': return (1000 * amount) / DateUtils.HOUR
+        case 'days': return (1000 * amount) / DateUtils.DAY
+      }
+    },
+    convertExpiryFromUnit (unit, amount) {
+      // Note: we want seconds and not milliseconds
+      switch (unit) {
+        case 'minutes': return 0.001 * amount * DateUtils.MINUTE
+        case 'hours': return 0.001 * amount * DateUtils.HOUR
+        case 'days': return 0.001 * amount * DateUtils.DAY
+      }
+    },
     expiryAmountChange () {
-      this.expiryAmount = Math.max(1, this.expiryAmount)
-      this.expiryAmount = Math.min(120, this.expiryAmount)
+      this.expiryAmount =
+        Math.max(this.minExpirationInCurrentUnit, this.expiryAmount)
+      this.expiryAmount =
+        Math.min(this.maxExpirationInCurrentUnit, this.expiryAmount)
       this.updatePollToParent()
     },
     updatePollToParent () {
-      const unitMultiplier = this.expiryUnit === 'minutes' ? 60
-        : this.expiryUnit === 'hours' ? 60 * 60
-          : 60 * 60 * 24
-
-      const expiresIn = this.expiryAmount * unitMultiplier
+      const expiresIn = this.convertExpiryFromUnit(
+        this.expiryUnit,
+        this.expiryAmount
+      )
 
       this.$emit('update-poll', {
         options: this.options,

src/components/poll/poll_form.vue

@@ -39,13 +39,16 @@
         <input 
           type="number"
           class="expiry-amount hide-number-spinner"
-          min="1"
-          max="120"
+          :min="minExpirationInCurrentUnit"
+          :max="maxExpirationInCurrentUnit"
           v-model="expiryAmount"
           @change="expiryAmountChange"
         >
         <label class="expiry-unit select">
-          <select v-model="expiryUnit" @change="updatePollToParent">
+          <select 
+            v-model="expiryUnit"
+            @change="expiryAmountChange"
+          >
             <option v-for="unit in expiryUnits" :value="unit">
               {{ $t(`time.${unit}_short`, ['']) }}
             </option>
@@ -83,12 +86,14 @@
   .input-container {
     width: 100%;
     input {
+      // Hack: dodge the floating X icon
+      padding-right: 2.5em;
       width: 100%;
     }
   }
 
   .icon-container {
-    // Move the icon over the input box
+    // Hack: Move the icon over the input box
     width: 2em;
     margin-left: -2em;
     z-index: 1;

src/components/post_status_form/post_status_form.js

@@ -188,7 +188,8 @@ const PostStatusForm = {
       return this.$store.state.instance.safeDM
     },
     pollsAvailable () {
-      return this.$store.state.instance.pollsAvailable
+      return this.$store.state.instance.pollsAvailable &&
+        this.$store.state.instance.pollLimits.max_options >= 2
     },
     hideScopeNotice () {
       return this.$store.state.config.hideScopeNotice