Fix indentation on requests-list component

js/components/requests_list.js

@@ -4,145 +4,145 @@ import { parse } from 'date-fns'
 import { compose, partial, indexBy, prop, sortBy, reverse, pipe } from 'ramda'
 
 export default {
-    name: 'requests-list',
+  name: 'requests-list',
 
-    components: {
+  components: {
-      LocalDatetime,
+    LocalDatetime,
+  },
+
+  props: {
+    requests: {
+      type: Array,
+      default: [],
     },
+    isExtended: {
+      type: Boolean,
+      default: false,
+    },
+    statuses: {
+      type: Array,
+      default: [],
+    },
+    dodComponents: {
+      type: Array,
+      default: [],
+    }
+  },
 
-    props: {
+  data: function () {
-      requests: {
+    const defaultSort = (sort, requests) => sortBy(prop(sort.columnName), requests)
-        type: Array,
+    const dateSort = (sort, requests) => {
-        default: [],
+      const parseDate = compose(partial(parse), prop(sort.columnName))
+      return sortBy(parseDate, requests)
+    }
+
+    const columnList = [
+      {
+        displayName: 'JEDI Cloud Request Name',
+        attr: 'name',
+        sortFunc: defaultSort,
       },
-      isExtended: {
+      {
-        type: Boolean,
+        displayName: 'Date Request Submitted',
-        default: false,
+        attr: 'last_submission_timestamp',
+        sortFunc: dateSort,
       },
-      statuses: {
+      {
-        type: Array,
+        displayName: 'Date Request Last Edited',
-        default: [],
+        attr: 'last_edited_timestamp',
+        extendedOnly: true,
+        sortFunc: dateSort,
       },
-      dodComponents: {
+      {
-        type: Array,
+        displayName: 'Requester',
-        default: [],
+        attr: 'full_name',
+        extendedOnly: true,
+        sortFunc: defaultSort,
+      },
+      {
+        displayName: 'Projected Annual Usage ($)',
+        attr: 'annual_usage',
+        sortFunc: defaultSort,
+      },
+      {
+        displayName: 'Request Status',
+        attr: 'status',
+        sortFunc: defaultSort,
+      },
+      {
+        displayName: 'DOD Component',
+        attr: 'dod_component',
+        extendedOnly: true,
+        sortFunc: defaultSort,
+      },
+    ]
+
+    return {
+      searchValue: '',
+      statusValue: '',
+      dodComponentValue: '',
+      sort: {
+        columnName: '',
+        isAscending: true
+      },
+      columns: indexBy(prop('attr'), columnList),
+    }
+  },
+
+  computed: {
+    filteredRequests: function () {
+      return pipe(
+        partial(this.applySearch, [this.searchValue]),
+        partial(this.applyFilters, [this.statusValue, this.dodComponentValue]),
+        partial(this.applySort, [this.sort]),
+      )(this.requests)
+    }
+  },
+
+  methods: {
+    getColumns: function() {
+      return Object.values(this.columns)
+        .filter((column) => !column.extendedOnly || this.isExtended)
+    },
+    applySearch: (query, requests) => {
+      return requests.filter(
+        (request) => query !== '' ?
+          request.name.toLowerCase().includes(query.toLowerCase()) :
+          true
+      )
+    },
+    applyFilters: (status, dodComponent, requests) => {
+      return requests.filter(
+        (request) => status !== '' ?
+          request.status === status :
+          true
+      ).filter(
+        (request) => dodComponent !== '' ?
+          request.dod_component === dodComponent :
+          true
+      )
+    },
+    applySort: function(sort, requests) {
+      if (sort.columnName === '') {
+        return requests
+      } else {
+        const { sortFunc } = this.columns[sort.columnName]
+        const sorted = sortFunc(sort, requests)
+        return sort.isAscending ?
+          sorted :
+          reverse(sorted)
       }
     },
+    dollars: (value) => formatDollars(value, false),
+    updateSortValue: function(columnName) {
+      if (!this.isExtended) { return }
 
-    data: function () {
+      // toggle ascending / descending if column is clicked twice
-      const defaultSort = (sort, requests) => sortBy(prop(sort.columnName), requests)
+      if (columnName === this.sort.columnName) {
-      const dateSort = (sort, requests) => {
+        this.sort.isAscending = !this.sort.isAscending
-        const parseDate = compose(partial(parse), prop(sort.columnName))
-        return sortBy(parseDate, requests)
       }
 
-      const columnList = [
+      this.sort.columnName = columnName;
-        {
-          displayName: 'JEDI Cloud Request Name',
-          attr: 'name',
-          sortFunc: defaultSort,
-        },
-        {
-          displayName: 'Date Request Submitted',
-          attr: 'last_submission_timestamp',
-          sortFunc: dateSort,
-        },
-        {
-          displayName: 'Date Request Last Edited',
-          attr: 'last_edited_timestamp',
-          extendedOnly: true,
-          sortFunc: dateSort,
-        },
-        {
-          displayName: 'Requester',
-          attr: 'full_name',
-          extendedOnly: true,
-          sortFunc: defaultSort,
-        },
-        {
-          displayName: 'Projected Annual Usage ($)',
-          attr: 'annual_usage',
-          sortFunc: defaultSort,
-        },
-        {
-          displayName: 'Request Status',
-          attr: 'status',
-          sortFunc: defaultSort,
-        },
-        {
-          displayName: 'DOD Component',
-          attr: 'dod_component',
-          extendedOnly: true,
-          sortFunc: defaultSort,
-        },
-      ]
-
-      return {
-        searchValue: '',
-        statusValue: '',
-        dodComponentValue: '',
-        sort: {
-          columnName: '',
-          isAscending: true
-        },
-        columns: indexBy(prop('attr'), columnList),
-      }
     },
-
+  },
-    computed: {
+}
-      filteredRequests: function () {
-        return pipe(
-          partial(this.applySearch, [this.searchValue]),
-          partial(this.applyFilters, [this.statusValue, this.dodComponentValue]),
-          partial(this.applySort, [this.sort]),
-        )(this.requests)
-      }
-    },
-
-    methods: {
-      getColumns: function() {
-        return Object.values(this.columns)
-          .filter((column) => !column.extendedOnly || this.isExtended)
-      },
-      applySearch: (query, requests) => {
-        return requests.filter(
-          (request) => query !== '' ?
-            request.name.toLowerCase().includes(query.toLowerCase()) :
-            true
-        )
-      },
-      applyFilters: (status, dodComponent, requests) => {
-        return requests.filter(
-          (request) => status !== '' ?
-            request.status === status :
-            true
-        ).filter(
-          (request) => dodComponent !== '' ?
-            request.dod_component === dodComponent :
-            true
-        )
-      },
-      applySort: function(sort, requests) {
-        if (sort.columnName === '') {
-          return requests
-        } else {
-          const { sortFunc } = this.columns[sort.columnName]
-          const sorted = sortFunc(sort, requests)
-          return sort.isAscending ?
-            sorted :
-            reverse(sorted)
-        }
-      },
-      dollars: (value) => formatDollars(value, false),
-      updateSortValue: function(columnName) {
-        if (!this.isExtended) { return }
-
-        // toggle ascending / descending if column is clicked twice
-        if (columnName === this.sort.columnName) {
-          this.sort.isAscending = !this.sort.isAscending
-        }
-
-        this.sort.columnName = columnName;
-      },
-    },
-  }