Merge pull request #255 from bento-platform/lint/enforce-hook-deps-tsx

lint: enforce hook dependencies + CustomEmpty -> tsx

.eslintrc.js

@@ -16,6 +16,7 @@ module.exports = {
   extends: [
     'eslint:recommended',
     'plugin:react/recommended',
+    'plugin:@typescript-eslint/eslint-recommended',
     'plugin:@typescript-eslint/recommended',
     'plugin:prettier/recommended',
     'plugin:react-hooks/recommended',
@@ -40,6 +41,7 @@ module.exports = {
     ],
     semi: ['error', 'always'],
     'react/react-in-jsx-scope': 'off',
+    'react-hooks/exhaustive-deps': ['error'],
   },
   settings: {
     react: {

src/js/components/Beacon/BeaconCommon/BeaconQueryFormUi.tsx

@@ -81,7 +81,7 @@ const BeaconQueryFormUi = ({
       }
       return payload;
     },
-    [scope]
+    [scope, isNetworkQuery]
   );
 
   const launchEmptyQuery = useCallback(
@@ -107,7 +107,7 @@ const BeaconQueryFormUi = ({
 
     // set assembly id options matching what's in gohan (for local beacon) or in network
     form.setFieldsValue(formInitialValues);
-  }, [beaconAssemblyIds.length, form, formInitialValues, isAuthenticated, isNetworkQuery, launchEmptyQuery]);
+  }, [scopeSet, beaconAssemblyIds.length, form, formInitialValues, isAuthenticated, isNetworkQuery, launchEmptyQuery]);
 
   // Disables max query param if user is authenticated and authorized
   useQueryWithAuthIfAllowed();

src/js/components/Util/CustomEmpty.js → src/js/components/Util/CustomEmpty.tsx

@@ -1,7 +1,7 @@
 import { Empty } from 'antd';
 import { useTranslationFn } from '@/hooks';
 
-const CustomEmpty = ({ text }) => {
+const CustomEmpty = ({ text }: { text: string }) => {
   const t = useTranslationFn();
 
   return <Empty description={t(text)} />;