1 files changed, 68 insertions, 73 deletions
diff --git a/app/assets/javascripts/vue_shared/components/sidebar/collapsed_grouped_date_picker.vue b/app/assets/javascripts/vue_shared/components/sidebar/collapsed_grouped_date_picker.vue
index 6e7194ccc9e..174c29809ac 100644
--- a/app/assets/javascripts/vue_shared/components/sidebar/collapsed_grouped_date_picker.vue
+++ b/app/assets/javascripts/vue_shared/components/sidebar/collapsed_grouped_date_picker.vue
@@ -1,84 +1,79 @@
 <script>
-  import { __ } from '~/locale';
-  import timeagoMixin from '~/vue_shared/mixins/timeago';
-  import { dateInWords, timeFor } from '~/lib/utils/datetime_utility';
-  import collapsedCalendarIcon from './collapsed_calendar_icon.vue';
+import { __ } from '~/locale';
+import timeagoMixin from '~/vue_shared/mixins/timeago';
+import { dateInWords, timeFor } from '~/lib/utils/datetime_utility';
+import collapsedCalendarIcon from './collapsed_calendar_icon.vue';
 
-  export default {
-    name: 'SidebarCollapsedGroupedDatePicker',
-    components: {
-      collapsedCalendarIcon,
+export default {
+  name: 'SidebarCollapsedGroupedDatePicker',
+  components: {
+    collapsedCalendarIcon,
+  },
+  mixins: [timeagoMixin],
+  props: {
+    collapsed: {
+      type: Boolean,
+      required: false,
+      default: true,
     },
-    mixins: [
-      timeagoMixin,
-    ],
-    props: {
-      collapsed: {
-        type: Boolean,
-        required: false,
-        default: true,
-      },
-      minDate: {
-        type: Date,
-        required: false,
-        default: null,
-      },
-      maxDate: {
-        type: Date,
-        required: false,
-        default: null,
-      },
-      disableClickableIcons: {
-        type: Boolean,
-        required: false,
-        default: false,
-      },
+    minDate: {
+      type: Date,
+      required: false,
+      default: null,
     },
-    computed: {
-      hasMinAndMaxDates() {
-        return this.minDate && this.maxDate;
-      },
-      hasNoMinAndMaxDates() {
-        return !this.minDate && !this.maxDate;
-      },
-      showMinDateBlock() {
-        return this.minDate || this.hasNoMinAndMaxDates;
-      },
-      showFromText() {
-        return !this.maxDate && this.minDate;
-      },
-      iconClass() {
-        const disabledClass = this.disableClickableIcons ? 'disabled' : '';
-        return `sidebar-collapsed-icon calendar-icon ${disabledClass}`;
-      },
+    maxDate: {
+      type: Date,
+      required: false,
+      default: null,
     },
-    methods: {
-      toggleSidebar() {
-        this.$emit('toggleCollapse');
-      },
-      dateText(dateType = 'min') {
-        const date = this[`${dateType}Date`];
-        const dateWords = dateInWords(date, true);
-        const parsedDateWords = dateWords ? dateWords.replace(',', '') : dateWords;
+    disableClickableIcons: {
+      type: Boolean,
+      required: false,
+      default: false,
+    },
+  },
+  computed: {
+    hasMinAndMaxDates() {
+      return this.minDate && this.maxDate;
+    },
+    hasNoMinAndMaxDates() {
+      return !this.minDate && !this.maxDate;
+    },
+    showMinDateBlock() {
+      return this.minDate || this.hasNoMinAndMaxDates;
+    },
+    showFromText() {
+      return !this.maxDate && this.minDate;
+    },
+    iconClass() {
+      const disabledClass = this.disableClickableIcons ? 'disabled' : '';
+      return `sidebar-collapsed-icon calendar-icon ${disabledClass}`;
+    },
+  },
+  methods: {
+    toggleSidebar() {
+      this.$emit('toggleCollapse');
+    },
+    dateText(dateType = 'min') {
+      const date = this[`${dateType}Date`];
+      const dateWords = dateInWords(date, true);
+      const parsedDateWords = dateWords ? dateWords.replace(',', '') : dateWords;
 
-        return date ? parsedDateWords : __('None');
-      },
-      tooltipText(dateType = 'min') {
-        const defaultText = dateType === 'min' ? __('Start date') : __('Due date');
-        const date = this[`${dateType}Date`];
-        const timeAgo = dateType === 'min' ? this.timeFormated(date) : timeFor(date);
-        const dateText = date ? [
-          this.dateText(dateType),
-          `(${timeAgo})`,
-        ].join(' ') : '';
+      return date ? parsedDateWords : __('None');
+    },
+    tooltipText(dateType = 'min') {
+      const defaultText = dateType === 'min' ? __('Start date') : __('Due date');
+      const date = this[`${dateType}Date`];
+      const timeAgo = dateType === 'min' ? this.timeFormated(date) : timeFor(date);
+      const dateText = date ? [this.dateText(dateType), `(${timeAgo})`].join(' ') : '';
 
-        if (date) {
-          return [defaultText, dateText].join('<br />');
-        }
-        return __('Start and due date');
-      },
+      if (date) {
+        return [defaultText, dateText].join('<br />');
+      }
+      return __('Start and due date');
     },
-  };
+  },
+};
 </script>
 
 <template>