diff --git a/web/app/components/app-sidebar/app-info.tsx b/web/app/components/app-sidebar/app-info.tsx
index 19a5dd7e28..588ffbcbe5 100644
--- a/web/app/components/app-sidebar/app-info.tsx
+++ b/web/app/components/app-sidebar/app-info.tsx
@@ -11,7 +11,6 @@ import {
   RiFileDownloadLine,
   RiFileUploadLine,
 } from '@remixicon/react'
-import { useQueryClient } from '@tanstack/react-query'
 import dynamic from 'next/dynamic'
 import { useParams, useRouter } from 'next/navigation'
 import * as React from 'react'
@@ -26,7 +25,7 @@ import { NEED_REFRESH_APP_LIST_KEY } from '@/config'
 import { useAppContext } from '@/context/app-context'
 import { useProviderContext } from '@/context/provider-context'
 import { copyApp, deleteApp, exportAppConfig, updateAppInfo } from '@/service/apps'
-import { useAppDetail, useInvalidateAppList } from '@/service/use-apps'
+import { useAppDetail, useInvalidateAppDetail, useInvalidateAppList } from '@/service/use-apps'
 import { fetchWorkflowDraft } from '@/service/workflow'
 import { AppModeEnum } from '@/types/app'
 import { getRedirection } from '@/utils/app-redirection'
@@ -65,9 +64,9 @@ const AppInfo = ({ expand, onlyShowDetail = false, openState = false, onDetailEx
   const { notify } = useContext(ToastContext)
   const { replace } = useRouter()
   const { appId } = useParams()
-  const queryClient = useQueryClient()
   const { onPlanInfoChanged } = useProviderContext()
   const { data: appDetail } = useAppDetail(appId as string)
+  const invalidateAppDetail = useInvalidateAppDetail()
   const invalidateAppList = useInvalidateAppList()
   const [open, setOpen] = useState(openState)
   const [showEditModal, setShowEditModal] = useState(false)
@@ -78,10 +77,6 @@ const AppInfo = ({ expand, onlyShowDetail = false, openState = false, onDetailEx
   const [secretEnvList, setSecretEnvList] = useState<EnvironmentVariable[]>([])
   const [showExportWarning, setShowExportWarning] = useState(false)
 
-  const invalidateAppDetail = useCallback(() => {
-    queryClient.invalidateQueries({ queryKey: ['apps', 'detail', appId] })
-  }, [queryClient, appId])
-
   const onEdit: CreateAppModalProps['onConfirm'] = useCallback(async ({
     name,
     icon_type,
@@ -109,12 +104,12 @@ const AppInfo = ({ expand, onlyShowDetail = false, openState = false, onDetailEx
         type: 'success',
         message: t('editDone', { ns: 'app' }),
       })
-      invalidateAppDetail()
+      invalidateAppDetail(appId as string)
     }
     catch {
       notify({ type: 'error', message: t('editFailed', { ns: 'app' }) })
     }
-  }, [appDetail, notify, invalidateAppDetail, t])
+  }, [appDetail, notify, invalidateAppDetail, appId, t])
 
   const onCopy: DuplicateAppModalProps['onConfirm'] = async ({ name, icon_type, icon, icon_background }) => {
     if (!appDetail)
diff --git a/web/app/components/app/app-publisher/index.tsx b/web/app/components/app/app-publisher/index.tsx
index 393438c032..a2e4a527b3 100644
--- a/web/app/components/app/app-publisher/index.tsx
+++ b/web/app/components/app/app-publisher/index.tsx
@@ -144,7 +144,6 @@ const AppPublisher = ({
   const [published, setPublished] = useState(false)
   const [open, setOpen] = useState(false)
   const [showAppAccessControl, setShowAppAccessControl] = useState(false)
-  const [isAppAccessSet, setIsAppAccessSet] = useState(true)
   const [embeddingModalOpen, setEmbeddingModalOpen] = useState(false)
 
   const { data: appDetail } = useAppDetail(appId as string)
@@ -178,16 +177,12 @@ const AppPublisher = ({
       refetch()
   }, [open, appDetail, refetch, systemFeatures])
 
-  useEffect(() => {
-    if (appDetail && appAccessSubjects) {
-      if (appDetail.access_mode === AccessMode.SPECIFIC_GROUPS_MEMBERS && appAccessSubjects.groups?.length === 0 && appAccessSubjects.members?.length === 0)
-        setIsAppAccessSet(false)
-      else
-        setIsAppAccessSet(true)
-    }
-    else {
-      setIsAppAccessSet(true)
-    }
+  const isAppAccessSet = useMemo(() => {
+    if (!appDetail || !appAccessSubjects)
+      return true
+    if (appDetail.access_mode === AccessMode.SPECIFIC_GROUPS_MEMBERS && appAccessSubjects.groups?.length === 0 && appAccessSubjects.members?.length === 0)
+      return false
+    return true
   }, [appAccessSubjects, appDetail])
 
   const handlePublish = useCallback(async (params?: ModelAndParameter | PublishWorkflowParams) => {
diff --git a/web/eslint-suppressions.json b/web/eslint-suppressions.json
index 2f8bf07bc7..d5a4604de3 100644
--- a/web/eslint-suppressions.json
+++ b/web/eslint-suppressions.json
@@ -253,9 +253,6 @@
     }
   },
   "app/components/app/app-publisher/index.tsx": {
-    "react-hooks-extra/no-direct-set-state-in-use-effect": {
-      "count": 3
-    },
     "ts/no-explicit-any": {
       "count": 6
     }