refactor(web): narrow app list context (#39802)

web/app/components/app/create-app-dialog/app-card/__tests__/index.spec.tsx

@@ -89,10 +89,7 @@ describe('AppCard', () => {
       // oxlint-disable-next-line eslint-react/no-context-provider
       <AppListContext.Provider
         value={{
-          currentApp: undefined,
-          isShowTryAppPanel: false,
-          setShowTryAppPanel: openPreview,
-          controlHideCreateFromTemplatePanel: 0,
+          openTryAppPanel: openPreview,
         }}
       >
         <AppCard app={app} canCreate onCreate={vi.fn()} />
@@ -105,6 +102,6 @@ describe('AppCard', () => {
       'preview_template',
       expect.objectContaining({ template_id: 'app-1', page: 'studio' }),
     )
-    expect(openPreview).toHaveBeenCalledWith(true, { appId: 'app-1', app })
+    expect(openPreview).toHaveBeenCalledWith({ appId: 'app-1', app })
   })
 })

web/app/components/app/create-app-dialog/app-card/index.tsx

@@ -28,7 +28,7 @@ const AppCard = ({ app, canCreate, onCreate }: AppCardProps) => {
   })
   const { app: appBasicInfo } = app
   const canViewApp = deploymentEdition === 'CLOUD'
-  const setShowTryAppPanel = useContextSelector(AppListContext, (ctx) => ctx.setShowTryAppPanel)
+  const openTryAppPanel = useContextSelector(AppListContext, (ctx) => ctx.openTryAppPanel)
   const handleShowTryAppPanel = useCallback(() => {
     trackEvent('preview_template', {
       template_id: app.app_id,
@@ -37,8 +37,8 @@ const AppCard = ({ app, canCreate, onCreate }: AppCardProps) => {
       template_categories: app.categories,
       page: 'studio',
     })
-    setShowTryAppPanel?.(true, { appId: app.app_id, app })
-  }, [setShowTryAppPanel, app, appBasicInfo])
+    openTryAppPanel({ appId: app.app_id, app })
+  }, [openTryAppPanel, app, appBasicInfo])
   return (
     <div
       className={cn(

web/app/components/apps/__tests__/index.spec.tsx

@@ -107,7 +107,7 @@ vi.mock('../list', () => {
     onCreateLearnDify?: (app: App) => void
     onTryLearnDify?: (params: TryAppSelection) => void
   }) => {
-    const setShowTryAppPanel = useContextSelector(AppListContext, (ctx) => ctx.setShowTryAppPanel)
+    const openTryAppPanel = useContextSelector(AppListContext, (ctx) => ctx.openTryAppPanel)
     return React.createElement(
       'div',
       { 'data-testid': 'apps-list' },
@@ -117,7 +117,7 @@ vi.mock('../list', () => {
         {
           'data-testid': 'open-preview',
           onClick: () =>
-            setShowTryAppPanel(true, {
+            openTryAppPanel({
               appId: mockTemplateApp.app_id,
               app: mockTemplateApp,
             }),

web/app/components/apps/index.tsx

@@ -54,15 +54,14 @@ const AppsContent = () => {
   const hideTryAppPanel = useCallback(() => {
     setIsShowTryAppPanel(false)
   }, [])
-  const setShowTryAppPanel = (showTryAppPanel: boolean, params?: TryAppSelection) => {
-    if (showTryAppPanel) setCurrentTryAppParams(params)
-    else setCurrentTryAppParams(undefined)
-    setIsShowTryAppPanel(showTryAppPanel)
-  }
+  const openTryAppPanel = useCallback((selection: TryAppSelection) => {
+    setCurrentTryAppParams(selection)
+    setIsShowTryAppPanel(true)
+  }, [])
   const [isShowCreateModal, setIsShowCreateModal] = useState(false)
 
   const handleTryLearnDify = (params: TryAppSelection) => {
-    setShowTryAppPanel(true, params)
+    openTryAppPanel(params)
   }
   const handleCreateLearnDify = (app: App) => {
     if (!canCreateApp) return
@@ -97,10 +96,8 @@ const AppsContent = () => {
   )
 
   const [controlRefreshList, setControlRefreshList] = useState(0)
-  const [controlHideCreateFromTemplatePanel, setControlHideCreateFromTemplatePanel] = useState(0)
   const onSuccess = useCallback(() => {
     setControlRefreshList((prev) => prev + 1)
-    setControlHideCreateFromTemplatePanel((prev) => prev + 1)
   }, [])
 
   const [showDSLConfirmModal, setShowDSLConfirmModal] = useState(false)
@@ -196,10 +193,7 @@ const AppsContent = () => {
       <EducationExpireNotice />
       <AppListContext.Provider
         value={{
-          currentApp: currentTryAppParams,
-          isShowTryAppPanel,
-          setShowTryAppPanel,
-          controlHideCreateFromTemplatePanel,
+          openTryAppPanel,
         }}
       >
         <div className="relative flex h-0 shrink-0 grow flex-col overflow-y-auto bg-background-body">

web/context/app-list-context.ts

@@ -1,19 +1,13 @@
-import type { SetTryAppPanel, TryAppSelection } from '@/types/try-app'
+import type { TryAppSelection } from '@/types/try-app'
 import { noop } from 'es-toolkit/function'
 import { createContext } from 'use-context-selector'
 
 type Props = Readonly<{
-  currentApp?: TryAppSelection
-  isShowTryAppPanel: boolean
-  setShowTryAppPanel: SetTryAppPanel
-  controlHideCreateFromTemplatePanel: number
+  openTryAppPanel: (selection: TryAppSelection) => void
 }>
 
 const AppListContext = createContext<Props>({
-  isShowTryAppPanel: false,
-  setShowTryAppPanel: noop,
-  currentApp: undefined,
-  controlHideCreateFromTemplatePanel: 0,
+  openTryAppPanel: noop,
 })
 
 export default AppListContext

web/types/try-app.ts

@@ -4,5 +4,3 @@ export type TryAppSelection = {
   appId: string
   app: App
 }
-
-export type SetTryAppPanel = (showTryAppPanel: boolean, params?: TryAppSelection) => void