chore: learn dify try action same to template

web/app/components/explore/learn-dify/__tests__/item.spec.tsx

@@ -0,0 +1,89 @@
+import type { App } from '@/models/explore'
+import { fireEvent, render, screen } from '@testing-library/react'
+import { AppModeEnum } from '@/types/app'
+import LearnDifyItem from '../item'
+
+const mockConfig = vi.hoisted(() => ({
+  isCloudEdition: true,
+}))
+
+vi.mock('@/config', async (importOriginal) => {
+  const actual = await importOriginal<typeof import('@/config')>()
+  return {
+    ...actual,
+    get IS_CLOUD_EDITION() {
+      return mockConfig.isCloudEdition
+    },
+  }
+})
+
+vi.mock('@/app/components/base/amplitude', () => ({
+  trackEvent: vi.fn(),
+}))
+
+const createApp = (overrides: Partial<App> = {}): App => ({
+  app: {
+    id: overrides.app?.id ?? 'app-basic-id',
+    mode: overrides.app?.mode ?? AppModeEnum.CHAT,
+    icon_type: overrides.app?.icon_type ?? 'emoji',
+    icon: overrides.app?.icon ?? '😀',
+    icon_background: overrides.app?.icon_background ?? '#fff',
+    icon_url: overrides.app?.icon_url ?? '',
+    name: overrides.app?.name ?? 'Learn Dify App',
+    description: overrides.app?.description ?? 'Learn Dify description',
+    use_icon_as_answer_icon: overrides.app?.use_icon_as_answer_icon ?? false,
+  },
+  can_trial: overrides.can_trial ?? true,
+  app_id: overrides.app_id ?? 'learn-dify-app',
+  description: overrides.description ?? 'Learn Dify description',
+  copyright: overrides.copyright ?? '',
+  privacy_policy: overrides.privacy_policy ?? null,
+  custom_disclaimer: overrides.custom_disclaimer ?? null,
+  categories: overrides.categories ?? ['Writing'],
+  position: overrides.position ?? 1,
+  is_listed: overrides.is_listed ?? true,
+  install_count: overrides.install_count ?? 0,
+  installed: overrides.installed ?? false,
+  editable: overrides.editable ?? false,
+  is_agent: overrides.is_agent ?? false,
+})
+
+describe('LearnDifyItem', () => {
+  beforeEach(() => {
+    mockConfig.isCloudEdition = true
+    vi.clearAllMocks()
+  })
+
+  it('should hide try action outside cloud edition', () => {
+    mockConfig.isCloudEdition = false
+
+    render(
+      <LearnDifyItem
+        canCreate
+        item={createApp()}
+        onCreate={vi.fn()}
+        onTry={vi.fn()}
+      />,
+    )
+
+    expect(screen.getByText('explore.appCard.addToWorkspace')).toBeInTheDocument()
+    expect(screen.queryByText('explore.appCard.try')).not.toBeInTheDocument()
+  })
+
+  it('should show try action in cloud edition', () => {
+    const onTry = vi.fn()
+    const app = createApp()
+
+    render(
+      <LearnDifyItem
+        canCreate={false}
+        item={app}
+        onTry={onTry}
+      />,
+    )
+
+    fireEvent.click(screen.getByText('explore.appCard.try'))
+
+    expect(onTry).toHaveBeenCalledWith({ appId: app.app_id, app })
+  })
+})

web/app/components/explore/learn-dify/item.tsx

@@ -3,12 +3,12 @@
 import type { App } from '@/models/explore'
 import type { TryAppSelection } from '@/types/try-app'
 import { Button } from '@langgenius/dify-ui/button'
-import { useSuspenseQuery } from '@tanstack/react-query'
+import { cn } from '@langgenius/dify-ui/cn'
 import * as React from 'react'
 import { useTranslation } from 'react-i18next'
 import { trackEvent } from '@/app/components/base/amplitude'
 import AppIcon from '@/app/components/base/app-icon'
-import { systemFeaturesQueryOptions } from '@/service/system-features'
+import { IS_CLOUD_EDITION } from '@/config'
 
 type LearnDifyItemProps = {
   canCreate: boolean
@@ -25,11 +25,9 @@ const LearnDifyItem = ({
 }: LearnDifyItemProps) => {
   const { t } = useTranslation()
   const appBasicInfo = item.app
-  const { data: systemFeatures } = useSuspenseQuery(systemFeaturesQueryOptions())
-  const isTrialApp = item.can_trial && systemFeatures.enable_trial_app
+  const canViewApp = IS_CLOUD_EDITION
   const canShowCreate = canCreate && !!onCreate
-  const canShowTry = (canCreate || isTrialApp) && !!onTry
-  const showHoverActions = canShowCreate || canShowTry
+  const showHoverActions = canShowCreate || canViewApp
 
   const handleTryApp = () => {
     trackEvent('preview_template', {
@@ -61,14 +59,14 @@ const LearnDifyItem = ({
       </p>
       {showHoverActions && (
         <div className="absolute right-0 bottom-0 left-0 hidden bg-linear-to-t from-components-panel-gradient-2 from-[60.27%] to-transparent p-4 pt-8 group-hover:flex">
-          <div className={canShowCreate && canShowTry ? 'grid h-8 w-full grid-cols-2 gap-2' : 'grid h-8 w-full grid-cols-1 gap-2'}>
+          <div className={cn('grid h-8 w-full gap-2', canShowCreate && canViewApp ? 'grid-cols-2' : 'grid-cols-1')}>
             {canShowCreate && (
               <Button variant="primary" className="h-7" onClick={() => onCreate?.(item)}>
                 <span className="mr-1 i-heroicons-plus-20-solid size-4" />
                 <span className="text-xs">{t('appCard.addToWorkspace', { ns: 'explore' })}</span>
               </Button>
             )}
-            {canShowTry && (
+            {canViewApp && (
               <Button className="h-7" onClick={handleTryApp}>
                 <span className="mr-1 i-ri-information-2-line size-4" />
                 <span>{t('appCard.try', { ns: 'explore' })}</span>