set useCallback for submitHandler

packages/app/src/components/Admin/App/AppSetting.jsx

@@ -1,4 +1,4 @@
-import React from 'react';
+import React, { useCallback } from 'react';
 
 import PropTypes from 'prop-types';
 import { useTranslation } from 'react-i18next';
@@ -19,7 +19,7 @@ const AppSetting = (props) => {
   const { adminAppContainer } = props;
   const { t } = useTranslation();
 
-  const submitHandler = async() => {
+  const submitHandler = useCallback(async() => {
     try {
       await adminAppContainer.updateAppSettingHandler();
       toastSuccess(t('toaster.update_successed', { target: t('App Settings') }));
@@ -28,7 +28,7 @@ const AppSetting = (props) => {
       toastError(err);
       logger.error(err);
     }
-  };
+  }, [adminAppContainer, t]);
 
 
   return (

packages/app/src/components/Admin/App/FileUploadSetting.tsx

@@ -1,4 +1,4 @@
-import React from 'react';
+import React, { useCallback } from 'react';
 
 import { useTranslation } from 'react-i18next';
 
@@ -23,7 +23,7 @@ const FileUploadSetting = (props: Props) => {
   const { fileUploadType } = adminAppContainer.state;
   const fileUploadTypes = ['aws', 'gcs', 'gridfs', 'local'];
 
-  const submitHandler = async() => {
+  const submitHandler = useCallback(async() => {
     try {
       await adminAppContainer.updateFileUploadSettingHandler();
       toastSuccess(t('toaster.update_successed', { target: t('admin:app_setting.file_upload_settings') }));
@@ -31,10 +31,10 @@ const FileUploadSetting = (props: Props) => {
     catch (err) {
       toastError(err);
     }
-  };
+  }, [adminAppContainer, t]);
 
   return (
-    <React.Fragment>
+    <>
       <p className="card well my-3">
         {t('admin:app_setting.file_upload')}
         <br />
@@ -82,8 +82,7 @@ const FileUploadSetting = (props: Props) => {
       {fileUploadType === 'gcs' && <GcsSettings />}
 
       <AdminUpdateButtonRow onClick={submitHandler} disabled={adminAppContainer.state.retrieveError != null} />
-
-    </React.Fragment>
+    </>
   );
 };
 

packages/app/src/components/Admin/App/PluginSetting.tsx

@@ -1,4 +1,4 @@
-import React from 'react';
+import React, { useCallback } from 'react';
 
 import { useTranslation } from 'react-i18next';
 
@@ -20,7 +20,7 @@ const PluginSetting = (props: Props) => {
   const { adminAppContainer } = props;
 
 
-  const submitHandler = async() => {
+  const submitHandler = useCallback(async() => {
     try {
       await adminAppContainer.updatePluginSettingHandler();
       toastSuccess(t('toaster.update_successed', { target: t('admin:app_setting.plugin_settings') }));
@@ -29,7 +29,7 @@ const PluginSetting = (props: Props) => {
       toastError(err);
       logger.error(err);
     }
-  };
+  }, [adminAppContainer, t]);
 
   return (
     <>

packages/app/src/components/Admin/App/SiteUrlSetting.tsx

@@ -1,4 +1,4 @@
-import React from 'react';
+import React, { useCallback } from 'react';
 
 import { useTranslation } from 'react-i18next';
 
@@ -21,7 +21,7 @@ const SiteUrlSetting = (props: Props) => {
   const { adminAppContainer } = props;
 
 
-  const submitHandler = async() => {
+  const submitHandler = useCallback(async() => {
     try {
       await adminAppContainer.updateSiteUrlSettingHandler();
       toastSuccess(t('toaster.update_successed', { target: t('Site URL settings') }));
@@ -30,7 +30,7 @@ const SiteUrlSetting = (props: Props) => {
       toastError(err);
       logger.error(err);
     }
-  };
+  }, [adminAppContainer, t]);
 
   return (
     <React.Fragment>