validate user permission before enter app detail page (#8527)

web/app/(commonLayout)/app/(appDetailLayout)/[appId]/layout.tsx

@@ -109,6 +109,11 @@ const AppDetailLayout: FC<IAppDetailLayoutProps> = (props) => {
     setAppDetail()
     fetchAppDetail({ url: '/apps', id: appId }).then((res) => {
       // redirection
+      const canIEditApp = isCurrentWorkspaceEditor
+      if (!canIEditApp && (pathname.endsWith('configuration') || pathname.endsWith('workflow') || pathname.endsWith('logs'))) {
+        router.replace(`/app/${appId}/overview`)
+        return
+      }
       if ((res.mode === 'workflow' || res.mode === 'advanced-chat') && (pathname).endsWith('configuration')) {
         router.replace(`/app/${appId}/workflow`)
       }
@@ -118,7 +123,7 @@ const AppDetailLayout: FC<IAppDetailLayoutProps> = (props) => {
       else {
         setAppDetail({ ...res, enable_sso: false })
         setNavigation(getNavigations(appId, isCurrentWorkspaceEditor, res.mode))
-        if (systemFeatures.enable_web_sso_switch_component) {
+        if (systemFeatures.enable_web_sso_switch_component && canIEditApp) {
           fetchAppSSO({ appId }).then((ssoRes) => {
             setAppDetail({ ...res, enable_sso: ssoRes.enabled })
           })
@@ -128,7 +133,7 @@ const AppDetailLayout: FC<IAppDetailLayoutProps> = (props) => {
       if (e.status === 404)
         router.replace('/apps')
     })
-  }, [appId, isCurrentWorkspaceEditor, systemFeatures])
+  }, [appId, isCurrentWorkspaceEditor, systemFeatures, getNavigations, pathname, router, setAppDetail])
 
   useUnmount(() => {
     setAppDetail()

web/app/components/app/overview/settings/index.tsx

@@ -16,7 +16,7 @@ import type { AppIconType, AppSSO, Language } from '@/types/app'
 import { useToastContext } from '@/app/components/base/toast'
 import { languages } from '@/i18n/language'
 import Tooltip from '@/app/components/base/tooltip'
-import AppContext from '@/context/app-context'
+import AppContext, { useAppContext } from '@/context/app-context'
 import type { AppIconSelection } from '@/app/components/base/app-icon-picker'
 import AppIconPicker from '@/app/components/base/app-icon-picker'
 
@@ -57,6 +57,7 @@ const SettingsModal: FC<ISettingsModalProps> = ({
   onSave,
 }) => {
   const systemFeatures = useContextSelector(AppContext, state => state.systemFeatures)
+  const { isCurrentWorkspaceEditor } = useAppContext()
   const { notify } = useToastContext()
   const [isShowMore, setIsShowMore] = useState(false)
   const {
@@ -265,7 +266,7 @@ const SettingsModal: FC<ISettingsModalProps> = ({
               }
               asChild={false}
             >
-              <Switch disabled={!systemFeatures.sso_enforced_for_web} defaultValue={systemFeatures.sso_enforced_for_web && inputInfo.enable_sso} onChange={v => setInputInfo({ ...inputInfo, enable_sso: v })}></Switch>
+              <Switch disabled={!systemFeatures.sso_enforced_for_web || !isCurrentWorkspaceEditor} defaultValue={systemFeatures.sso_enforced_for_web && inputInfo.enable_sso} onChange={v => setInputInfo({ ...inputInfo, enable_sso: v })}></Switch>
             </Tooltip>
           </div>
           <p className='body-xs-regular text-gray-500'>{t(`${prefixSettings}.sso.description`)}</p>