configure prettier as pre-commit hook

.husky/pre-commit

@@ -0,0 +1,3 @@
+#!/usr/bin/env sh
+. "$(dirname -- "$0")/_/husky.sh"
+yarn prettier:fix && git add .

package.json

@@ -77,7 +77,10 @@
     "lint": "eslint './src/**/*.ts*'",
     "fix-lint": "eslint './src/**/*.ts*' --fix",
     "tslint": "tsc",
-    "all": "eslint './src/**/*.ts*' & react-scripts test --all & tsc"
+    "prettier:fix": "prettier --write './src/**/*.{ts,tsx}'",
+    "prettier:check": "prettier --check './src/**/*.{ts,tsx}'",
+    "all": "eslint './src/**/*.ts*' & react-scripts test --all & tsc",
+    "prepare": "husky install"
   },
   "browserslist": {
     "production": [
@@ -104,7 +107,8 @@
     "postcss": "^8.4.16",
     "prettier": "^2.0.5",
     "react-hooks-testing-library": "^0.6.0",
-    "react-test-renderer": "^16.13.1"
+    "react-test-renderer": "^16.13.1",
+    "husky": "^8.0.0"
   },
   "engines": {
     "npm": ">=6.14.17",

src/api/apiUrl.ts

@@ -1,3 +1,3 @@
 import { BASE_API_URL } from './constants';
 
-export const apiUrl = (url: string) => `${BASE_API_URL}${url}`;
+export const apiUrl = (url: string) => `${BASE_API_URL}${url}`;

src/api/constants.ts

@@ -9,4 +9,4 @@ export const httpMethods = {
 export const BASE_API_URL = process.env.REACT_APP_BASE_API_URL;
 
 // https://appserver.zenml.io/api/v1
-// http://localhost:8080/api/v1
+// http://localhost:8080/api/v1

src/api/organizations/deleteInviteApi.ts

@@ -16,4 +16,4 @@ const deleteInviteApi = ({
     authenticationToken,
   });
 
-export default deleteInviteApi;
+export default deleteInviteApi;

src/api/session/emailUpdate.ts

@@ -9,8 +9,8 @@ const emailUpdate = ({
   name,
   authenticationToken,
 }: {
-  userId: string,
-  fullName: string
+  userId: string;
+  fullName: string;
   name: string;
   authenticationToken: string;
 }): Promise<TUser> =>
@@ -24,4 +24,4 @@ const emailUpdate = ({
     data: { full_name: fullName, name },
   });
 
-export default emailUpdate;
+export default emailUpdate;

src/api/session/saveUserEmail.ts

@@ -9,10 +9,10 @@ const SaveUserEmail = ({
   email_opted_in,
   authenticationToken,
 }: {
-  userId: string,
-  email: string,
-  email_opted_in: any,
-  authenticationToken: string,
+  userId: string;
+  email: string;
+  email_opted_in: any;
+  authenticationToken: string;
 }): Promise<TUser> =>
   fetchApiWithAuthRequest({
     url: apiUrl(endpoints.userEmail(userId)),
@@ -24,4 +24,4 @@ const SaveUserEmail = ({
     data: { email, email_opted_in },
   });
 
-export default SaveUserEmail;
+export default SaveUserEmail;

src/api/testUtils/mockFetchApi.ts

@@ -1,4 +1,4 @@
 export const getMockFetchApi = () => jest.fn();
 
 export const getMockFetchApiResponse = (): any =>
-  new Promise(resolve => resolve());
+  new Promise((resolve) => resolve());

src/api/workspaces/getMyWorkspaceStatsApi.ts

@@ -18,4 +18,4 @@ const getMyWorkspaceStatsApi = ({
     authenticationToken,
   });
 
-export default getMyWorkspaceStatsApi;
+export default getMyWorkspaceStatsApi;

src/constants/index.ts

@@ -11,4 +11,4 @@ export * from './stripe';
 
 export const DEFAULT_FULL_NAME = 'Jane Doe';
 export const ID_MAX_LENGTH = 8;
-export const DEFAULT_WORKSPACE_NAME = 'default'
+export const DEFAULT_WORKSPACE_NAME = 'default';

src/redux/actionTypes/session.ts

@@ -4,17 +4,17 @@ import { generateApiActionsTypes } from './generateApiActionsTypes';
 export const ACCOUNT_LOGOUT = actionTypes.LOGOUT;
 
 export const loginActionTypes = generateApiActionsTypes(
-  actionTypes.ACCOUNT_LOGIN
+  actionTypes.ACCOUNT_LOGIN,
 );
 
 export const signupActionTypes = generateApiActionsTypes(
-  actionTypes.ACCOUNT_SIGNUP
+  actionTypes.ACCOUNT_SIGNUP,
 );
 
 export const forgotActionTypes = generateApiActionsTypes(
-  actionTypes.FORGOT_PASSWORD
+  actionTypes.FORGOT_PASSWORD,
 );
 
 export const updateEmailTypes = generateApiActionsTypes(
-  actionTypes.UPDATE_EMAIL
+  actionTypes.UPDATE_EMAIL,
 );

src/redux/actionTypes/workspaces.ts

@@ -2,8 +2,12 @@ import { actionTypes } from './constants';
 import { generateApiActionsTypes } from './generateApiActionsTypes';
 
 export const workspaceActionTypes = {
-  getMyWorkspaces: generateApiActionsTypes(actionTypes.WORKSPACES_GET_MY_WORKSPACES),
-  getMyWorkspaceStats: generateApiActionsTypes(actionTypes.GET_MY_WORKSPACE_STATS),
+  getMyWorkspaces: generateApiActionsTypes(
+    actionTypes.WORKSPACES_GET_MY_WORKSPACES,
+  ),
+  getMyWorkspaceStats: generateApiActionsTypes(
+    actionTypes.GET_MY_WORKSPACE_STATS,
+  ),
   selectWorkspace: generateApiActionsTypes(
     actionTypes.SELECT_WORKSPACE_FROM_MY_WORKSPACES,
   ),

src/redux/actions/session/index.ts

@@ -5,5 +5,5 @@ import { emailUpdateAction } from './emailUpdate';
 export const sessionActions = {
   logout: logoutAction,
   forgotPassword: forgotAction,
-  emailUpdate: emailUpdateAction
+  emailUpdate: emailUpdateAction,
 };

src/redux/actions/session/signupAction.ts

@@ -32,7 +32,7 @@ export const signUpAction = ({
         username,
         fullName,
         password,
-        token,    
+        token,
       },
     },
   },

src/redux/reducers/rolesReducer.ts

@@ -23,7 +23,9 @@ const newState = (roles: Roles[]): State => ({
 const rolesReducer = (state: State = initialState, action: Action): State => {
   switch (action.type) {
     case rolesActionTypes.getRoles.success: {
-      const roles: Roles[] = camelCaseArray(action.payload?.items as RolesPayload);
+      const roles: Roles[] = camelCaseArray(
+        action.payload?.items as RolesPayload,
+      );
 
       return { ...newState(roles) };
     }

src/redux/reducers/workspacesReducer.ts

@@ -51,7 +51,7 @@ const workspacesReducer = (
       const workspaces: Workspaces[] = camelCaseArray(
         action.payload.items as WorkspacesPayload,
       );
-      
+
       const myWorkspaceIds: TId[] = workspaces.map(
         (workspace: Workspaces) => workspace.id,
       );
@@ -63,7 +63,11 @@ const workspacesReducer = (
         };
       } else {
         return {
-          ...newState(state, workspaces, action.requestParams.selectedWorkspace),
+          ...newState(
+            state,
+            workspaces,
+            action.requestParams.selectedWorkspace,
+          ),
           myWorkspaceIds,
         };
       }

src/redux/selectors/workspaces.ts

@@ -17,7 +17,6 @@ const getSelectedWorkspaceIds = (state: State): string =>
 const getWorkspaceStats = (state: State): any =>
   _.get(stateKey(state), 'workspaceStats');
 
-
 export const myWorkspaces = (state?: State | null): Workspaces[] => {
   if (!state) return [];
   const myWorkspaceIds = getMyWorkspaceIds(state);
@@ -45,11 +44,10 @@ export const workspaceStats = (state?: State | null): string => {
   return workspaceStats;
 };
 
-
 const workspaceSelectors = {
   myWorkspaces: myWorkspaces,
   selectedWorkspace: selectedWorkspace,
-  myWorkspaceStats: workspaceStats
+  myWorkspaceStats: workspaceStats,
 };
 
-export { workspaceSelectors };
+export { workspaceSelectors };

src/redux/setup/storeSetup.ts

@@ -9,7 +9,7 @@ import rootSaga from '../rootSaga';
 import { persistedReducer, persistConfig } from './storeReduxSetup';
 
 function crossBrowserListener(store: any, persistConfig: any) {
-  return async function() {
+  return async function () {
     const state = await getStoredState(persistConfig);
 
     store.dispatch({

src/serviceWorker.ts

@@ -67,7 +67,7 @@ export function register(config?: Config) {
 function registerValidSW(swUrl: string, config?: Config) {
   navigator.serviceWorker
     .register(swUrl)
-    .then(registration => {
+    .then((registration) => {
       registration.onupdatefound = () => {
         const installingWorker = registration.installing;
         if (installingWorker == null) {
@@ -103,7 +103,7 @@ function registerValidSW(swUrl: string, config?: Config) {
         };
       };
     })
-    .catch(error => {
+    .catch((error) => {
       console.error('Error during service worker registration:', error);
     });
 }
@@ -113,15 +113,15 @@ function checkValidServiceWorker(swUrl: string, config?: Config) {
   fetch(swUrl, {
     headers: { 'Service-Worker': 'script' },
   })
-    .then(response => {
+    .then((response) => {
       // Ensure service worker exists, and that we really are getting a JS file.
       const contentType = response.headers.get('content-type');
       if (
         response.status === 404 ||
         (contentType != null && contentType.indexOf('javascript') === -1)
       ) {
         // No service worker found. Probably a different app. Reload the page.
-        navigator.serviceWorker.ready.then(registration => {
+        navigator.serviceWorker.ready.then((registration) => {
           registration.unregister().then(() => {
             window.location.reload();
           });
@@ -140,7 +140,7 @@ function checkValidServiceWorker(swUrl: string, config?: Config) {
 
 export function unregister() {
   if ('serviceWorker' in navigator) {
-    navigator.serviceWorker.ready.then(registration => {
+    navigator.serviceWorker.ready.then((registration) => {
       registration.unregister();
     });
   }

src/ui/components/buttons/index.tsx

@@ -30,7 +30,9 @@ export const PrimaryButton: React.FC<
       <div className={styles.spinner}>
         <Spinner size="xs" color="white" />
       </div>
-    ) : (children)}
+    ) : (
+      children
+    )}
   </button>
 );
 

src/ui/components/logos/index.tsx

@@ -16,4 +16,4 @@ export const ZenMLLogoWhite: React.FC = () => (
 
 export const ZenMLLogoSmall: React.FC = () => (
   <Image style={{ width: 36, height: 36 }} src={logoSmallWhite} />
-);
+);

src/ui/components/separators/index.tsx

@@ -11,5 +11,5 @@ export const SeparatorNew: React.FC = () => (
 
 export const Separator = {
   Light: SeparatorLight,
-  LightNew: SeparatorNew
+  LightNew: SeparatorNew,
 };