Respect fetch params in Vue template

templates/vue/utils/fetch.js

@@ -16,6 +16,9 @@ const transformRelationToIri = (payload) => {
   return payload;
 };
 
+const makeParamArray = (key, arr) =>
+  arr.map(val => `${key}[]=${val}`).join('&');
+
 export default function(id, options = {}) {
   if ('undefined' === typeof options.headers) options.headers = new Headers();
 
@@ -33,6 +36,18 @@ export default function(id, options = {}) {
   if (isObject(payload) && payload['@id'])
     options.body = JSON.stringify(transformRelationToIri(payload));
 
+  if (options.params) {
+    const params = normalize(options.params);
+    let queryString = Object.keys(params)
+      .map(key =>
+        Array.isArray(params[key])
+          ? makeParamArray(key, params[key])
+          : `${key}=${params[key]}`
+      )
+      .join('&');
+    id = `${id}?${queryString}`;
+  }
+
   return global.fetch(new URL(id, ENTRYPOINT), options).then(response => {
     if (response.ok) return response;
 

templates/vue/utils/hydra.js

@@ -0,0 +1,19 @@
+import get from 'lodash/get';
+import has from 'lodash/has';
+import mapValues from 'lodash/mapValues';
+
+export function normalize(data) {
+  if (has(data, 'hydra:member')) {
+    // Normalize items in collections
+    data['hydra:member'] = data['hydra:member'].map(item => normalize(item));
+
+    return data;
+  }
+
+  // Flatten nested documents
+  return mapValues(data, value =>
+    Array.isArray(value)
+      ? value.map(v => get(v, '@id', v))
+      : get(value, '@id', value)
+  );
+}