Merge pull request #519 from LibCrowds/dev

v1.0.0-beta.8

.babelrc

@@ -18,13 +18,16 @@
         "backpack-core/babel"
       ],
       "plugins": [
-        ["module-resolver", {
-          "root": ["./"],
-          "alias": {
-            "~": ".",
-            "@": "."
+        [
+          "module-resolver",
+          {
+            "root": ["./"],
+            "alias": {
+              "~": ".",
+              "@": "."
+            }
           }
-        }]
+        ]
       ]
     }
   }

.travis.yml

@@ -4,20 +4,19 @@ language: node_js
 node_js:
 - '8'
 before_install:
-# Remove hte line below once node 9 moves to LTS (and so does this repo)
+# Remove the line below once node 9 moves to LTS (and npm 5 is standard)
 - npm install -g npm@5
 - npm install -g greenkeeper-lockfile@1
-# Deploy key used to push to the server
-- openssl aes-256-cbc -K $encrypted_1cd83addbd20_key -iv $encrypted_1cd83addbd20_iv
-  -in deploy-key.enc -out deploy-key -d
 install:
 - npm install
 before_script:
-- greenkeeper-lockfile-upload
+- greenkeeper-lockfile-update
 script:
+- cp local.config.js.tmpl local.config.js
+- npm run build
 - npm run test
-after_success:
-- bash bin/deploy.sh
+after_script:
+- greenkeeper-lockfile-upload
 env:
   global:
     # GH_TOKEN used for greenkeeper-lockfile

README.md

@@ -20,6 +20,7 @@ $ npm install
 $ npm run dev
 
 # build for production and launch server
+$ npm run build
 $ npm start
 ```
 

assets/style/partials/_cards.scss

@@ -7,4 +7,20 @@
   .tab-content.card-body {
     padding: 0;
   }
+
+  &.options-card {
+    font-size: $font-size-sm;
+    margin-top: 0;
+
+    .card-header {
+      background-color: $gray-100;
+      text-align: center;
+      padding: $list-group-item-padding-y $list-group-item-padding-x;
+    }
+  }
+
+  .search-control {
+    border-radius: 100px;
+    padding: 0.5rem 0.75rem;
+  }
 }

assets/style/partials/_tables.scss

@@ -1,10 +1,10 @@
 .table {
   display: table;
+  width: 100%;
   font-size: $font-size-sm;
   margin-bottom: 0;
   background-color: $white;
   border: $table-border-width solid $table-border-color;
-  overflow-y: auto;
 
   th {
     font-weight: 400;
@@ -16,19 +16,4 @@
   td {
     vertical-align: middle;
   }
-
-  .markdown {
-    h1, h2, h3, h4, h5, h6 {
-      font-family: $font-family-base;
-      margin-bottom: 5px;
-      font-size: $font-size-sm;
-      text-transform: uppercase;
-      font-weight: 600;
-    }
-
-    p {
-      margin: 0;
-      margin-bottom: 5px;
-    }
-  }
 }

assets/style/partials/_transitions.scss

@@ -8,12 +8,9 @@
   opacity: 0;
 }
 
-.fade-up-enter-active {
-  transition: all .3s ease;
-}
-
+.fade-up-enter-active,
 .fade-up-leave-active {
-  transition: all .8s cubic-bezier(1.0, 0.5, 0.8, 1.0);
+  transition: all .3s ease;
 }
 
 .fade-up-enter,

components/InfiniteLoad.vue

@@ -15,7 +15,6 @@
 </template>
 
 <script>
-import orderBy from 'lodash/orderBy'
 import merge from 'lodash/merge'
 
 export default {
@@ -40,11 +39,6 @@ export default {
         offset: this.value.length
       })
 
-      if (this.domainObject === 'project') {
-        this.infiniteLoadOrderedProjects($state, params)
-        return
-      }
-
       try {
         // Get the data
         let data = await this.$axios.$get(`/api/${this.domainObject}`, {
@@ -65,79 +59,24 @@ export default {
     },
 
     /**
-     * Handler to infinitely load projects.
-     *
-     * We have to deal with ordered projects slightly differently from other
-     * domain objects as the project stats are stored in a different table. So,
-     * we request all filtered projects and then sort. Not as efficient but it
-     * is a solution for now.
-     * @param {Object} $state
-     *   The vue-inifinite-loading state.
-     * @param {Object} params
-     *   The query params.
+     * Reset the loaded items.
      */
-    async infiniteLoadOrderedProjects ($state, params) {
-      params.limit = 100
-
-      // Pull out order params
-      const orderby = params.orderby || 'created'
-      const order = params.desc ? 'desc' : 'asc'
-      delete params.orderby
-      delete params.desc
-
-      let items = []
-
-      // Load all items
-      while (true) {
-        try {
-          const data = await this.$axios.$get(`/api/${this.domainObject}`, {
-            params: merge(params, {
-              offset: items.length ? items[items.length - 1].id : 0
-            })
-          })
-
-          if (!data.length) {
-            break
-          }
-
-          const statsData = await this.$axios.$get('/api/projectstats', {
-            params: {
-              project_id: data.map(project => project.id).toString()
-            }
-          })
-
-          const enrichedData = data.map((project, idx) => {
-            return merge(statsData[idx], project)
-          })
-
-          items = items.concat(enrichedData)
-        } catch (err) {
-          this.$nuxt.error(err)
-          break
-        }
-      }
-
-      // Sort
-      const sorted = orderBy(items, [ orderby ], [ order ])
-
-      this.$emit('input', sorted)
-      if (sorted.length) {
-        $state.loaded()
-      }
-      $state.complete()
+    reset () {
+      this.$emit('input', [])
+      this.$nextTick(() => {
+        this.page = 1
+        this.$refs.infiniteload.$emit('$InfiniteLoading:reset')
+      })
     },
 
     /**
-     * Reset the loaded domain objects.
+     * Trigger a manual load.
      */
-    reset () {
+    load () {
       this.$nextTick(() => {
-        this.$emit('input', [])
-        this.$refs.infiniteload.$emit('$InfiniteLoading:reset')
-        this.$refs.infiniteload.$emit(
-          '$InfiniteLoading:infinite',
-          this.$refs.stateChanger
-        )
+        if (!this.$refs.infiniteload.isLoading) {
+          this.$refs.infiniteload.attemptLoad()
+        }
       })
     }
   },