Add prettier with pre-commit hook

.gitignore

@@ -4,3 +4,4 @@ dist
 .idea
 .docz
 docs
+*.sw*

.husky/pre-commit

@@ -0,0 +1,3 @@
+#!/bin/sh
+. "$(dirname "$0")/_/husky.sh"
+npx lint-staged 

.prettierrc

@@ -0,0 +1,4 @@
+{
+  "singleQuote": true,
+  "printWidth": 100
+}

package.json

@@ -99,9 +99,11 @@
     "eslint-plugin-react-hooks": "^1.7.0",
     "extract-text-webpack-plugin": "^3.0.2",
     "gh-pages": "^2.2.0",
+    "husky": "^7.0.4",
     "jest": "^24.9.0",
+    "lint-staged": "^12.3.4",
     "node-sass": "^4.13.1",
-    "prettier": "^1.16.0",
+    "prettier": "^1.19.1",
     "react-dom": "^16.13.1",
     "react-scripts": "^4.0.3",
     "react-test-renderer": "^16.9.0",
@@ -115,5 +117,10 @@
   "files": [
     "lib",
     "dist"
-  ]
+  ],
+  "lint-staged": {
+    "src/**/*.{js,jsx,ts,tsx,json}": [
+      "npx prettier --write"
+    ]
+  }
 }

src/hooks/useDatastore/fetch.js

@@ -1,13 +1,26 @@
 import axios from 'axios';
-import qs from 'qs'
+import qs from 'qs';
 
 export async function fetchDataFromQuery(id, rootUrl, options, additionalParams) {
-  const { keys, limit, offset, conditions, sort, prepareColumns, properties, setValues, setCount, setColumns, setLoading, setSchema } = options;
-  if(!id) {
+  const {
+    keys,
+    limit,
+    offset,
+    conditions,
+    sort,
+    prepareColumns,
+    properties,
+    setValues,
+    setCount,
+    setColumns,
+    setLoading,
+    setSchema
+  } = options;
+  if (!id) {
     // TODO: Throw error
     return false;
   }
-  if(typeof setLoading === 'function') {
+  if (typeof setLoading === 'function') {
     setLoading(true);
   }
   return await axios({
@@ -20,24 +33,23 @@ export async function fetchDataFromQuery(id, rootUrl, options, additionalParams)
       conditions: conditions,
       sorts: sort,
       properties: properties,
-      ...additionalParams,
+      ...additionalParams
     },
-    paramsSerializer: (params) => {
-      return qs.stringify(params)
+    paramsSerializer: params => {
+      return qs.stringify(params);
     }
-  })
-  .then((res) => {
+  }).then(res => {
     const { data } = res;
-    const propertyKeys = data.schema[id] && data.schema[id].fields ? Object.keys(data.schema[id].fields) : [];
-    setValues(data.results),
-    setCount(data.count)
-    if(propertyKeys.length) {
-      setColumns(prepareColumns ? prepareColumns(propertyKeys) : propertyKeys)
+    const propertyKeys =
+      data.schema[id] && data.schema[id].fields ? Object.keys(data.schema[id].fields) : [];
+    setValues(data.results), setCount(data.count);
+    if (propertyKeys.length) {
+      setColumns(prepareColumns ? prepareColumns(propertyKeys) : propertyKeys);
     }
-    setSchema(data.schema)
-    if(typeof setLoading === 'function') {
+    setSchema(data.schema);
+    if (typeof setLoading === 'function') {
       setLoading(false);
     }
     return data;
-  })
+  });
 }

src/hooks/useDatastore/fetch.test.js

@@ -5,18 +5,18 @@ jest.mock('axios');
 const rootUrl = 'http://dkan.com/api/1';
 const data = {
   data: {
-    results: [{record_id: '1', column_1: 'fizz', column_2: 'dkan'}],
+    results: [{ record_id: '1', column_1: 'fizz', column_2: 'dkan' }],
     count: '1'
   }
-}
+};
 const distribution = {
-  identifier: "1234-1234",
+  identifier: '1234-1234',
   data: {
     downloadURL: `${rootUrl}/files/file.csv`,
-    format: "csv",
-    title: "Dist Title"
+    format: 'csv',
+    title: 'Dist Title'
   }
-}
+};
 
 describe('fetchDataFromQuery', () => {
   test('returns data from datastore query endpoint', async () => {
@@ -31,8 +31,8 @@ describe('fetchDataFromQuery', () => {
       setCount: () => {},
       setColumns: () => {},
       setSchema: () => {}
-    })
+    });
     expect(results.count).toEqual(data.data.count);
     expect(results.results).toEqual(data.data.results);
-  })
-});
+  });
+});

src/hooks/useDatastore/index.jsx

@@ -1,11 +1,13 @@
-import {useState, useEffect, useRef} from 'react';
+import { useState, useEffect, useRef } from 'react';
 import { fetchDataFromQuery } from './fetch';
 
-const useDatastore = (resourceId, rootAPIUrl, options, additionalParams={}) => {
+const useDatastore = (resourceId, rootAPIUrl, options, additionalParams = {}) => {
   const keys = options.keys ? options.keys : true;
   const { prepareColumns } = options;
   const [manual, setManual] = useState(options.manual ? options.manual : false);
-  const [requireConditions, setRequireConditions] = useState(options.requireConditions ? options.requireConditions : false);
+  const [requireConditions, setRequireConditions] = useState(
+    options.requireConditions ? options.requireConditions : false
+  );
   const [values, setValues] = useState([]);
   const [id, setResource] = useState(resourceId);
   const [rootUrl, setRootUrl] = useState(rootAPIUrl);
@@ -18,43 +20,56 @@ const useDatastore = (resourceId, rootAPIUrl, options, additionalParams={}) => {
   const [sort, setSort] = useState(options.sort ? options.sort : undefined);
   const [schema, setSchema] = useState({});
   // const [joins, setJoins] = useState()
-  const [properties, setProperties] = useState(options.properties ? options.properties : undefined)
+  const [properties, setProperties] = useState(options.properties ? options.properties : undefined);
   const prevLimitRef = useRef();
   const prevOffsetRef = useRef();
 
   useEffect(() => {
     prevLimitRef.current = limit;
     prevOffsetRef.current = offset;
-  })
+  });
   const prevLimit = prevLimitRef.current;
   const prevOffset = prevOffsetRef.current;
-  
+
   function fetchData() {
-    let newOffset = prevLimit === limit ? prevOffset !== offset ? offset : 0 : 0;
-    setOffset(newOffset)
-    fetchDataFromQuery(id, rootUrl,
-      { keys, limit, offset: newOffset, conditions, sort, prepareColumns, properties, setValues, setCount, setColumns, setLoading, setSchema, setProperties },
+    let newOffset = prevLimit === limit ? (prevOffset !== offset ? offset : 0) : 0;
+    setOffset(newOffset);
+    fetchDataFromQuery(
+      id,
+      rootUrl,
+      {
+        keys,
+        limit,
+        offset: newOffset,
+        conditions,
+        sort,
+        prepareColumns,
+        properties,
+        setValues,
+        setCount,
+        setColumns,
+        setLoading,
+        setSchema,
+        setProperties
+      },
       additionalParams
     );
   }
 
   useEffect(() => {
-    if(!loading && !manual) {
+    if (!loading && !manual) {
       if (!requireConditions) {
-        fetchData()
-      }
-      else if(requireConditions) {
+        fetchData();
+      } else if (requireConditions) {
         if (conditions && conditions.length) {
-          fetchData()
-        }
-        else {
+          fetchData();
+        } else {
           setCount(null);
           setValues([]);
         }
       }
     }
-
-  }, [id, rootUrl, offset, conditions, sort, limit, requireConditions])
+  }, [id, rootUrl, offset, conditions, sort, limit, requireConditions]);
 
   return {
     loading,
@@ -75,8 +90,8 @@ const useDatastore = (resourceId, rootAPIUrl, options, additionalParams={}) => {
     setSort,
     setManual,
     setRequireConditions,
-    fetchData,
-  }
-}
+    fetchData
+  };
+};
 
 export default useDatastore;

src/hooks/useDatastore/transformConditions.js

@@ -9,19 +9,19 @@
 // like
 
 export function transformTableFilterToQueryCondition(filterArray) {
-  const conditions = filterArray.map((f) => {
+  const conditions = filterArray.map(f => {
     return {
       resource: 't',
       property: f.id,
       value: `%${f.value}%`,
-      operator: 'LIKE',
-    }
+      operator: 'LIKE'
+    };
   });
   return conditions;
 }
 
 export function transformTableFilterToSQLCondition(filterArray) {
-  if(!filterArray || filterArray.length === 0) {
+  if (!filterArray || filterArray.length === 0) {
     return '';
   }
 

src/hooks/useDatastore/transformConditions.test.js

@@ -2,15 +2,18 @@ import { transformTableFilterToQueryCondition } from './transformConditions';
 
 describe('transformTableFilterToQueryCondition', () => {
   test('transform an array from of filters from React Table into DKAN query format', async () => {
-    const testArray1 = [{id: "my_label", value: 'abcd'}];
-    const testArray2 = [{id: "my_label", value: 'abcd'}, {id: "another_label", value: '1234'}];
+    const testArray1 = [{ id: 'my_label', value: 'abcd' }];
+    const testArray2 = [
+      { id: 'my_label', value: 'abcd' },
+      { id: 'another_label', value: '1234' }
+    ];
 
     expect(transformTableFilterToQueryCondition(testArray1)).toEqual([
-      {resource: 't', property: 'my_label', value: '%abcd%', operator: 'LIKE'}
+      { resource: 't', property: 'my_label', value: '%abcd%', operator: 'LIKE' }
     ]);
     expect(transformTableFilterToQueryCondition(testArray2)).toEqual([
-      {resource: 't', property: 'my_label', value: '%abcd%', operator: 'LIKE'},
-      {resource: 't', property: 'another_label', value: '%1234%', operator: 'LIKE'}
+      { resource: 't', property: 'my_label', value: '%abcd%', operator: 'LIKE' },
+      { resource: 't', property: 'another_label', value: '%1234%', operator: 'LIKE' }
     ]);
   });
 });

src/hooks/useDatastore/transformSorts.js

@@ -1,7 +1,7 @@
 export function transformTableSortToQuerySort(sortArray) {
   let newQuery = [];
-  sortArray.forEach((s) => {
-    return newQuery.push({property: s.id, order: s.desc ? 'desc' : 'asc'})
-  })
+  sortArray.forEach(s => {
+    return newQuery.push({ property: s.id, order: s.desc ? 'desc' : 'asc' });
+  });
   return newQuery;
-}
+}

src/hooks/useDatastore/transformSorts.test.js

@@ -2,11 +2,14 @@ import { transformTableSortToQuerySort } from './transformSorts';
 
 describe('transformTableSortToQuerySort', () => {
   test('transform an array from of sorts from React Table into DKAN query format', async () => {
-    const testArray1 = [{id: "my_label", desc: true}]
-    const testArray2 = [{id: "another_label", desc: false}]
+    const testArray1 = [{ id: 'my_label', desc: true }];
+    const testArray2 = [{ id: 'another_label', desc: false }];
 
-    expect(transformTableSortToQuerySort(testArray1)).toEqual({asc: [], desc:['my_label']});
-    expect(transformTableSortToQuerySort(testArray2)).toEqual({asc: ['another_label'], desc:[]});
-    expect(transformTableSortToQuerySort(testArray1.concat(testArray2))).toEqual({asc: ['another_label'], desc:['my_label']});
+    expect(transformTableSortToQuerySort(testArray1)).toEqual({ asc: [], desc: ['my_label'] });
+    expect(transformTableSortToQuerySort(testArray2)).toEqual({ asc: ['another_label'], desc: [] });
+    expect(transformTableSortToQuerySort(testArray1.concat(testArray2))).toEqual({
+      asc: ['another_label'],
+      desc: ['my_label']
+    });
   });
 });

src/hooks/useDatastore/useDatastore.test.jsx

@@ -1,37 +1,41 @@
 import axios from 'axios';
-import {renderHook, act} from '@testing-library/react-hooks'
+import { renderHook, act } from '@testing-library/react-hooks';
 import '@testing-library/jest-dom/extend-expect';
 import useDatastore from './';
 jest.mock('axios');
 const rootUrl = 'http://dkan.com/api/1';
 const data = {
   data: {
-    results: [{record_id: '1', column_1: 'fizz', column_2: 'dkan'}],
+    results: [{ record_id: '1', column_1: 'fizz', column_2: 'dkan' }],
     count: '1'
   }
-}
+};
 const distribution = {
-  identifier: "1234-1234",
+  identifier: '1234-1234',
   data: {
     downloadURL: `${rootUrl}/files/file.csv`,
-    format: "csv",
-    title: "Dist Title"
+    format: 'csv',
+    title: 'Dist Title'
   }
-}
+};
 
 describe('useDatastore Custom Hook', () => {
   test('returns data from datastore query endpoint', async () => {
     axios.post.mockImplementation(() => Promise.resolve(data));
-    const { result } = renderHook(() => useDatastore(distribution.identifier, rootUrl, {}))
-    await act(async () => { });
+    const { result } = renderHook(() => useDatastore(distribution.identifier, rootUrl, {}));
+    await act(async () => {});
     expect(result.current.values).toEqual(data.data.results);
     expect(result.current.limit).toEqual(20);
     expect(result.current.offset).toEqual(0);
     expect(result.current.count).toEqual('1');
     expect(result.current.columns).toEqual(['record_id', 'column_1', 'column_2']);
-    await act(async () => { result.current.setLimit(100) });
+    await act(async () => {
+      result.current.setLimit(100);
+    });
     expect(result.current.limit).toEqual(100);
-    await act(async () => { result.current.setOffset(25) });
+    await act(async () => {
+      result.current.setOffset(25);
+    });
     expect(result.current.offset).toEqual(25);
-  })
+  });
 });