@igstack/app-catalog-frontend-core 6.9.0 → 6.10.1

package/src/__tests__/modules/appCatalog/ui/detail/AppDetails.behindThisCard.test.tsx

@@ -0,0 +1,402 @@
+import type { Resource } from '@igstack/app-catalog-backend-core'
+import { act, fireEvent, render, screen, within } from '@testing-library/react'
+import { beforeEach, describe, expect, it, vi } from 'vitest'
+import '@testing-library/jest-dom/vitest'
+import type { AcPlugin } from '~/modules/extensions'
+import { ExtensionsContext } from '~/modules/extensions'
+
+const search: Record<string, unknown> = {}
+const feedback = vi.hoisted(() => ({
+  items: [] as unknown[],
+  error: null as Error | null,
+  hasData: true,
+}))
+
+vi.mock('@tanstack/react-router', () => ({
+  useSearch: vi.fn(() => search),
+  useNavigate: vi.fn(() => vi.fn()),
+  useRouter: vi.fn(() => ({
+    state: { location: { pathname: '/app/thing', search } },
+  })),
+  Link: ({ children, ...rest }: { children?: React.ReactNode }) => (
+    <a {...rest}>{children}</a>
+  ),
+}))
+vi.mock('~/modules/appCatalog/context/AppCatalogContext', () => ({
+  useAppCatalogContext: vi.fn(() => ({ approvalMethods: [], resources: [] })),
+}))
+vi.mock('~/modules/appCatalog/hooks/useAppClickHistory', () => ({
+  useAppClickHistory: vi.fn(() => ({ recordClick: vi.fn() })),
+}))
+vi.mock('~/modules/appCatalog/hooks/useUpdateApp', () => ({
+  useUpdateApp: vi.fn(() => ({ mutate: vi.fn() })),
+}))
+vi.mock('~/modules/appCatalog/ui/context/AppCatalogFiltersContext', () => ({
+  useAppCatalogFilters: vi.fn(() => ({
+    state: { searchValue: '' },
+    actions: {},
+  })),
+}))
+vi.mock('~/modules/auth', () => ({ useUser: vi.fn(() => null) }))
+// CommunitySection and the count are real: the Share button's whole job is to
+// focus the input, and the count has to agree with the feed's Pending badges.
+vi.mock('@tanstack/react-query', () => ({
+  useQuery: vi.fn(() => ({
+    data: feedback.hasData
+      ? { items: feedback.items, openCount: 0 }
+      : undefined,
+    error: feedback.error,
+  })),
+  useMutation: vi.fn(() => ({
+    mutate: vi.fn(),
+    isPending: false,
+    isError: false,
+  })),
+  useQueryClient: vi.fn(() => ({ invalidateQueries: vi.fn() })),
+}))
+vi.mock('~/api/infra/trpc', () => ({
+  useTRPC: vi.fn(() => ({
+    feedback: {
+      add: { mutationOptions: (o: unknown) => o },
+      edit: { mutationOptions: (o: unknown) => o },
+      dismiss: { mutationOptions: (o: unknown) => o },
+      list: {
+        queryOptions: () => ({ queryKey: ['feedback', 'list'] }),
+        queryKey: () => ['feedback', 'list'],
+      },
+    },
+  })),
+}))
+
+const { AppDetails } = await import('~/modules/appCatalog/ui/detail/AppDetails')
+
+const app = {
+  id: 'thing',
+  slug: 'thing',
+  displayName: 'Thing',
+  description: 'Does a thing.',
+  links: [{ title: 'User guide', url: 'https://docs.example.com/guide' }],
+  background: 'Built to replace the spreadsheet.',
+  sources: ['https://wiki.example.com/thing'],
+  createdAt: '2026-01-01T00:00:00.000Z',
+  aiPrompt: 'Keep the scope explicit.',
+  aiMemory: 'Maps to the legacy portal.',
+  freshness: {
+    lastCheckedAt: '2026-10-19T00:00:00.000Z',
+    lastContentChangeAt: null,
+    isStale: false,
+  },
+} as Resource
+
+const tabNames = () =>
+  screen.getAllByRole('tab').map((tab) => tab.textContent.trim())
+
+const behindTab = () => screen.getByRole('tab', { name: /^Behind this card/ })
+const input = () =>
+  screen.getByRole('textbox', { name: 'Know more about Thing?' })
+
+beforeEach(() => {
+  feedback.items = []
+  feedback.error = null
+  feedback.hasData = true
+  for (const key of Object.keys(search)) delete search[key]
+})
+
+describe('the tab strip', () => {
+  it('is Overview, Access, Documentation, Behind this card', () => {
+    render(<AppDetails app={app} />)
+    expect(tabNames()).toEqual([
+      'Overview',
+      expect.stringMatching(/^Access/),
+      'Documentation',
+      'Behind this card',
+    ])
+  })
+
+  it('drops Documentation when the entry has neither links nor background', () => {
+    render(<AppDetails app={{ ...app, links: [], background: undefined }} />)
+    expect(screen.queryByRole('tab', { name: 'Documentation' })).toBeNull()
+    expect(behindTab()).toBeInTheDocument()
+  })
+
+  it('sends ?tab=documentation to Behind this card when the entry has no Documentation', () => {
+    search.tab = 'documentation'
+    render(<AppDetails app={{ ...app, links: [], background: undefined }} />)
+    expect(behindTab()).toHaveAttribute('aria-selected', 'true')
+  })
+
+  it('sends an old ?tab=notes link to Behind this card', () => {
+    search.tab = 'notes'
+    render(<AppDetails app={app} />)
+    expect(behindTab()).toHaveAttribute('aria-selected', 'true')
+  })
+})
+
+describe('Documentation', () => {
+  it('holds the links and Background, and no provenance', () => {
+    search.tab = 'documentation'
+    render(<AppDetails app={app} />)
+    const panel = screen.getByRole('tabpanel')
+    expect(within(panel).getByText('User guide')).toBeVisible()
+    expect(
+      within(panel).getByRole('heading', { name: 'Background' }),
+    ).toBeVisible()
+    expect(within(panel).queryByRole('heading', { name: /Sources/ })).toBeNull()
+    expect(within(panel).queryByText(/Keep the scope explicit/)).toBeNull()
+  })
+})
+
+describe('Behind this card', () => {
+  it('holds the three groups in order', () => {
+    search.tab = 'behind'
+    render(<AppDetails app={app} />)
+    const panel = screen.getByRole('tabpanel')
+    const groups = within(panel)
+      .getAllByRole('heading', { level: 2 })
+      .map((h) => h.textContent)
+    expect(groups).toEqual([
+      'Comments',
+      'Kept up to date from',
+      'How the AI maintains this card',
+    ])
+    expect(within(panel).getByText('Keep the scope explicit.')).toBeVisible()
+    expect(within(panel).getByText('Maps to the legacy portal.')).toBeVisible()
+    expect(within(panel).getByText(/wiki\.example\.com\/thing/)).toBeVisible()
+    expect(
+      within(panel).getByText(/^Last checked .+ · added .+$/),
+    ).toBeVisible()
+  })
+
+  it('has no AI group when the entry has neither prompt nor memory', () => {
+    search.tab = 'behind'
+    render(
+      <AppDetails app={{ ...app, aiPrompt: undefined, aiMemory: undefined }} />,
+    )
+    expect(
+      screen.queryByRole('heading', { name: 'How the AI maintains this card' }),
+    ).toBeNull()
+  })
+
+  it('puts the input above the Comments heading and the feed', () => {
+    search.tab = 'behind'
+    render(
+      <AppDetails
+        app={{
+          ...app,
+          claims: [
+            { text: 'Lead approves.', addedAt: '2026-10-01', status: 'active' },
+          ],
+        }}
+      />,
+    )
+    const field = input()
+    const heading = screen.getByRole('heading', { name: 'Comments' })
+    const fact = screen.getByText('Lead approves.')
+    expect(fact).toBeVisible()
+    expect(
+      field.compareDocumentPosition(heading) & Node.DOCUMENT_POSITION_FOLLOWING,
+    ).toBeTruthy()
+    expect(
+      heading.compareDocumentPosition(fact) & Node.DOCUMENT_POSITION_FOLLOWING,
+    ).toBeTruthy()
+  })
+
+  it('has no input on the other tabs', () => {
+    render(<AppDetails app={app} />)
+    for (const name of ['Overview', /^Access/, 'Documentation']) {
+      fireEvent.click(screen.getByRole('tab', { name }))
+      expect(screen.queryByRole('textbox', { name: /Know more/ })).toBeNull()
+    }
+  })
+})
+
+describe('Share what you know', () => {
+  it('opens Behind this card with the input focused and highlighted, every time', () => {
+    vi.useFakeTimers()
+    try {
+      render(<AppDetails app={app} />)
+      const share = screen.getByRole('button', { name: 'Share what you know' })
+
+      fireEvent.click(share)
+      expect(behindTab()).toHaveAttribute('aria-selected', 'true')
+      expect(input()).toHaveFocus()
+      expect(input().closest('form')).toHaveClass('is-flash')
+
+      act(() => vi.advanceTimersByTime(1000))
+      expect(input().closest('form')).not.toHaveClass('is-flash')
+
+      // Again, from another tab.
+      fireEvent.click(screen.getByRole('tab', { name: 'Overview' }))
+      fireEvent.click(share)
+      expect(behindTab()).toHaveAttribute('aria-selected', 'true')
+      expect(input()).toHaveFocus()
+
+      // And again while already there: re-focuses and re-highlights.
+      act(() => vi.advanceTimersByTime(1000))
+      input().blur()
+      fireEvent.click(share)
+      expect(input()).toHaveFocus()
+      expect(input().closest('form')).toHaveClass('is-flash')
+    } finally {
+      vi.useRealTimers()
+    }
+  })
+
+  it('does not steal focus when the reader opens the tab themselves', () => {
+    render(<AppDetails app={app} />)
+    fireEvent.click(screen.getByRole('button', { name: 'Share what you know' }))
+    fireEvent.click(screen.getByRole('tab', { name: 'Overview' }))
+    fireEvent.click(behindTab())
+    expect(input()).not.toHaveFocus()
+  })
+
+  it('keeps accessible name "Share what you know" in compact variant', () => {
+    render(<AppDetails app={app} />)
+    const share = screen.getByRole('button', { name: 'Share what you know' })
+    expect(share).toBeInTheDocument()
+  })
+
+  it('scrolls the active tab into view when selecting via Share', async () => {
+    const scrollIntoView = vi.fn()
+    Element.prototype.scrollIntoView = scrollIntoView
+    render(<AppDetails app={app} />)
+    fireEvent.click(screen.getByRole('button', { name: 'Share what you know' }))
+    // scrollIntoView is called in a requestAnimationFrame callback.
+    await new Promise((resolve) => requestAnimationFrame(resolve))
+    expect(scrollIntoView).toHaveBeenCalledWith({
+      behavior: 'smooth',
+      block: 'nearest',
+      inline: 'center',
+    })
+  })
+})
+
+const pendingNote = {
+  id: 'n1',
+  authorName: 'Merry Mole',
+  body: 'Leads approve.',
+  subject: null,
+  resourceSlug: 'thing',
+  resourceName: 'Thing',
+  attachmentIds: [],
+  createdAt: '2026-10-10T10:00:00.000Z',
+  reviewedAt: null,
+  editedAt: null,
+  isMine: false,
+  canEditUntil: null,
+  status: null,
+  reviewerReply: null,
+}
+
+describe('the Behind this card count', () => {
+  it('is the number of Pending badges in the feed', () => {
+    search.tab = 'behind'
+    feedback.items = [
+      pendingNote,
+      { ...pendingNote, id: 'n2', status: 'acknowledged' },
+    ]
+    render(
+      <AppDetails
+        app={{
+          ...app,
+          claims: [
+            // The open note's own claim: one entry, one Pending.
+            {
+              text: 'A.',
+              addedAt: '2026-10-11',
+              origin: 'feedback:n1',
+              status: 'review',
+            },
+            { text: 'B.', addedAt: '2026-10-01', status: 'review' },
+            { text: 'C.', addedAt: '2026-10-01', status: 'active' },
+          ],
+        }}
+      />,
+    )
+    expect(screen.getAllByText('Pending')).toHaveLength(2)
+    expect(behindTab()).toHaveTextContent(/^Behind this card2$/)
+  })
+
+  it('is hidden at zero', () => {
+    render(<AppDetails app={app} />)
+    expect(behindTab().textContent).toBe('Behind this card')
+  })
+
+  it('does not show standalone claims before the list arrives', () => {
+    search.tab = 'behind'
+    feedback.hasData = false
+    render(
+      <AppDetails
+        app={{
+          ...app,
+          claims: [
+            {
+              text: 'Early claim.',
+              addedAt: '2026-10-01',
+              origin: 'feedback:gone',
+              status: 'review',
+            },
+          ],
+        }}
+      />,
+    )
+    expect(screen.queryByText('Early claim.')).toBeNull()
+    expect(behindTab().textContent).toBe('Behind this card')
+  })
+
+  it('on list error, the badge count equals Pending entries from claims only', () => {
+    search.tab = 'behind'
+    feedback.hasData = false
+    feedback.error = new Error('Network')
+    render(
+      <AppDetails
+        app={{
+          ...app,
+          claims: [
+            { text: 'A.', addedAt: '2026-10-01', status: 'review' },
+            { text: 'B.', addedAt: '2026-10-02', status: 'active' },
+          ],
+        }}
+      />,
+    )
+    const panel = screen.getByRole('tabpanel')
+    expect(within(panel).getByText('A.')).toBeVisible()
+    expect(within(panel).getByText('B.')).toBeVisible()
+    expect(within(panel).getAllByText('Pending')).toHaveLength(1)
+    expect(within(panel).getAllByText('Used as source')).toHaveLength(1)
+    expect(behindTab()).toHaveTextContent(/^Behind this card1$/)
+  })
+})
+
+describe('the card-source slot', () => {
+  it("renders a plugin's content on Behind this card", () => {
+    search.tab = 'behind'
+    let received: unknown = null
+    const plugin: AcPlugin = {
+      name: 'card-source',
+      slots: {
+        resourceDetailCardSource: (props) => {
+          received = props
+          return <a href="https://example.com/src">View this card's source</a>
+        },
+      },
+    }
+    render(
+      <ExtensionsContext value={[plugin]}>
+        <AppDetails app={app} />
+      </ExtensionsContext>,
+    )
+    expect(
+      within(screen.getByRole('tabpanel')).getByRole('link', {
+        name: "View this card's source",
+      }),
+    ).toBeVisible()
+    expect(received).toEqual({ appSlug: 'thing', appName: 'Thing' })
+  })
+
+  it('renders nothing by default', () => {
+    search.tab = 'behind'
+    render(<AppDetails app={app} />)
+    expect(screen.queryByRole('link', { name: /source/i })).toBeNull()
+  })
+})

package/src/__tests__/modules/appCatalog/ui/detail/AppDetails.doorAndTabs.test.tsx

@@ -36,8 +36,11 @@ vi.mock('~/modules/appCatalog/ui/context/AppCatalogFiltersContext', () => ({
   })),
 }))
 vi.mock('~/modules/auth', () => ({ useUser: vi.fn(() => null) }))
-vi.mock('~/modules/appCatalog/ui/detail/FeedbackSection', () => ({
-  FeedbackSection: () => <div />,
+vi.mock('~/modules/appCatalog/ui/detail/CommunitySection', () => ({
+  CommunitySection: () => <div />,
+}))
+vi.mock('~/modules/appCatalog/ui/detail/usePendingCount', () => ({
+  usePendingCount: () => 0,
 }))
 
 const { AppDetails } = await import('~/modules/appCatalog/ui/detail/AppDetails')
@@ -48,6 +51,7 @@ const withUrl = {
   displayName: 'Thing',
   description: 'Does a thing.',
   appUrl: 'https://thing.example.com/portal',
+  links: [{ title: 'Guide', url: 'https://thing.example.com/guide' }],
 } as Resource
 
 const withoutUrl = {
@@ -88,7 +92,7 @@ describe('the door', () => {
 
 describe('the tab strip', () => {
   // The reason the active tab lives in the url at all: a card is linkable
-  // mid-conversation, and a maintainer's reply on the notes tab is addressable.
+  // mid-conversation, and a maintainer's reply on Behind this card is addressable.
   it('writes the selected tab to the url', () => {
     render(<AppDetails app={withUrl} />)
 
@@ -187,7 +191,7 @@ describe('the tab strip', () => {
     })
 
     expect(
-      screen.getByRole('tab', { name: 'Notes & requests' }),
+      screen.getByRole('tab', { name: 'Behind this card' }),
     ).toHaveAttribute('aria-selected', 'true')
   })
 })

package/src/__tests__/modules/appCatalog/ui/detail/AppDetails.escape.test.tsx

@@ -29,8 +29,11 @@ vi.mock('~/modules/appCatalog/ui/context/AppCatalogFiltersContext', () => ({
   useAppCatalogFilters: vi.fn(() => ({ selectedTags: [], toggleTag: vi.fn() })),
 }))
 vi.mock('~/modules/auth', () => ({ useUser: vi.fn(() => null) }))
-vi.mock('~/modules/appCatalog/ui/detail/FeedbackSection', () => ({
-  FeedbackSection: () => <div />,
+vi.mock('~/modules/appCatalog/ui/detail/CommunitySection', () => ({
+  CommunitySection: () => <div />,
+}))
+vi.mock('~/modules/appCatalog/ui/detail/usePendingCount', () => ({
+  usePendingCount: () => 0,
 }))
 
 const { AppDetails } = await import('~/modules/appCatalog/ui/detail/AppDetails')

package/src/__tests__/modules/appCatalog/ui/detail/AppDetails.knowMore.test.tsx

@@ -0,0 +1,175 @@
+import type { Resource } from '@igstack/app-catalog-backend-core'
+import { fireEvent, render, screen, within } from '@testing-library/react'
+import { useRef } from 'react'
+import { describe, expect, it, vi } from 'vitest'
+import '@testing-library/jest-dom/vitest'
+
+// Same stubs as the escape test: AppDetails drags the whole panel data layer in
+// and none of it decides where the input sits or what Esc does.
+vi.mock('@tanstack/react-router', () => ({
+  useSearch: vi.fn(() => ({})),
+  useNavigate: vi.fn(() => vi.fn()),
+  useRouter: vi.fn(() => ({
+    state: { location: { pathname: '/', search: {} } },
+  })),
+  Link: ({ children, ...rest }: { children?: React.ReactNode }) => (
+    <a {...rest}>{children}</a>
+  ),
+}))
+vi.mock('~/modules/appCatalog/context/AppCatalogContext', () => ({
+  useAppCatalogContext: vi.fn(() => ({ approvalMethods: [], resources: [] })),
+}))
+vi.mock('~/modules/appCatalog/hooks/useAppClickHistory', () => ({
+  useAppClickHistory: vi.fn(() => ({ recordClick: vi.fn() })),
+}))
+vi.mock('~/modules/appCatalog/hooks/useUpdateApp', () => ({
+  useUpdateApp: vi.fn(() => ({ mutate: vi.fn() })),
+}))
+vi.mock('~/modules/appCatalog/ui/context/AppCatalogFiltersContext', () => ({
+  useAppCatalogFilters: vi.fn(() => ({ selectedTags: [], toggleTag: vi.fn() })),
+}))
+vi.mock('~/modules/auth', () => ({ useUser: vi.fn(() => null) }))
+vi.mock('~/modules/appCatalog/ui/detail/usePendingCount', () => ({
+  usePendingCount: () => 0,
+}))
+
+// CommunitySection is real — the Esc contract lives in it, so mocking it would
+// test the mock. Only its data layer is stubbed.
+const state = vi.hoisted(() => ({
+  sent: [] as unknown[],
+  fail: false,
+  invalidated: 0,
+}))
+
+vi.mock('@tanstack/react-query', async () => {
+  const React = await import('react')
+  return {
+    useQuery: vi.fn(() => ({ data: { items: [], openCount: 0 } })),
+    // A real error state, so the component's failure branch is reachable.
+    useMutation: vi.fn((options?: { onSuccess?: () => void }) => {
+      const [isError, setIsError] = React.useState(false)
+      return {
+        mutate: (vars: unknown) => {
+          state.sent.push(vars)
+          if (state.fail) setIsError(true)
+          else options?.onSuccess?.()
+        },
+        isPending: false,
+        isError,
+      }
+    }),
+    useQueryClient: vi.fn(() => ({
+      invalidateQueries: () => {
+        state.invalidated++
+      },
+    })),
+  }
+})
+vi.mock('~/api/infra/trpc', () => ({
+  useTRPC: vi.fn(() => ({
+    feedback: {
+      add: { mutationOptions: (o: unknown) => o },
+      edit: { mutationOptions: (o: unknown) => o },
+      dismiss: { mutationOptions: (o: unknown) => o },
+      list: {
+        queryOptions: () => ({ queryKey: ['feedback', 'list'] }),
+        queryKey: () => ['feedback', 'list'],
+      },
+    },
+  })),
+}))
+
+const { AppDetails } = await import('~/modules/appCatalog/ui/detail/AppDetails')
+const { useDismissable } = await import('~/modules/dismiss/DismissStack')
+
+/** Stands in for the card: the layer AppDetails is rendered inside. */
+function CardLayer({
+  onClose,
+  children,
+}: {
+  onClose: () => void
+  children: React.ReactNode
+}) {
+  const ref = useRef<HTMLDivElement>(null)
+  useDismissable(ref, onClose)
+  return (
+    <div ref={ref} role="dialog" aria-label="card">
+      {children}
+    </div>
+  )
+}
+
+const app = {
+  id: 'example-app',
+  slug: 'example-app',
+  displayName: 'Example App',
+  description: 'Does things.',
+} as Resource
+
+const input = () =>
+  screen.getByRole('textbox', {
+    name: 'Know more about Example App?',
+  })
+
+const openBehind = () =>
+  fireEvent.click(screen.getByRole('tab', { name: /^Behind this card/ }))
+
+describe('AppDetails — Know more?', () => {
+  it('sits on Behind this card and on no other tab', () => {
+    render(<AppDetails app={app} />)
+    const withField = screen.getAllByRole('tab').filter((tab) => {
+      fireEvent.click(tab)
+      return !!within(screen.getByRole('tabpanel')).queryByRole('textbox', {
+        name: /Know more/,
+      })
+    })
+    expect(withField.map((tab) => tab.id)).toEqual(['detail-tab-behind'])
+  })
+
+  it('is gone from the band', () => {
+    render(<AppDetails app={app} />)
+    expect(
+      screen.queryByRole('button', { name: /Suggest a change/ }),
+    ).toBeNull()
+  })
+
+  it('Esc with a draft clears it and keeps the card open', () => {
+    const onClose = vi.fn()
+    render(
+      <CardLayer onClose={onClose}>
+        <AppDetails app={app} />
+      </CardLayer>,
+    )
+    openBehind()
+    fireEvent.change(input(), { target: { value: 'draft' } })
+    fireEvent.keyDown(input(), { key: 'Escape', code: 'Escape' })
+    expect(input()).toHaveValue('')
+    expect(onClose).not.toHaveBeenCalled()
+  })
+
+  it('Esc on an empty field still closes the card', () => {
+    const onClose = vi.fn()
+    render(
+      <CardLayer onClose={onClose}>
+        <AppDetails app={app} />
+      </CardLayer>,
+    )
+    openBehind()
+    fireEvent.keyDown(input(), { key: 'Escape', code: 'Escape' })
+    expect(onClose).toHaveBeenCalledTimes(1)
+  })
+
+  it('A send creates feedback without leaving Behind this card', () => {
+    render(<AppDetails app={app} />)
+    openBehind()
+    const behind = screen.getByRole('tab', { name: /^Behind this card/ })
+    const panel = screen.getByRole('tabpanel')
+    fireEvent.change(input(), { target: { value: 'approval detail' } })
+    fireEvent.keyDown(input(), { key: 'Enter' })
+    expect(state.sent).toEqual([
+      { resourceSlug: 'example-app', body: 'approval detail' },
+    ])
+    expect(behind).toHaveAttribute('aria-selected', 'true')
+    expect(screen.getByRole('tabpanel')).toBe(panel)
+  })
+})

package/src/__tests__/modules/appCatalog/ui/detail/AppDetails.sectionOrder.test.tsx

@@ -30,8 +30,11 @@ vi.mock('~/modules/appCatalog/ui/context/AppCatalogFiltersContext', () => ({
   useAppCatalogFilters: vi.fn(() => ({ selectedTags: [], toggleTag: vi.fn() })),
 }))
 vi.mock('~/modules/auth', () => ({ useUser: vi.fn(() => null) }))
-vi.mock('~/modules/appCatalog/ui/detail/FeedbackSection', () => ({
-  FeedbackSection: () => <div />,
+vi.mock('~/modules/appCatalog/ui/detail/CommunitySection', () => ({
+  CommunitySection: () => <div />,
+}))
+vi.mock('~/modules/appCatalog/ui/detail/usePendingCount', () => ({
+  usePendingCount: () => 0,
 }))
 
 const { AppDetails } = await import('~/modules/appCatalog/ui/detail/AppDetails')

package/src/__tests__/modules/appCatalog/ui/detail/AppDetails.subResourceTab.test.tsx

@@ -66,8 +66,11 @@ vi.mock('~/modules/appCatalog/ui/context/AppCatalogFiltersContext', () => ({
   })),
 }))
 vi.mock('~/modules/auth', () => ({ useUser: vi.fn(() => null) }))
-vi.mock('~/modules/appCatalog/ui/detail/FeedbackSection', () => ({
-  FeedbackSection: () => <div />,
+vi.mock('~/modules/appCatalog/ui/detail/CommunitySection', () => ({
+  CommunitySection: () => <div />,
+}))
+vi.mock('~/modules/appCatalog/ui/detail/usePendingCount', () => ({
+  usePendingCount: () => 0,
 }))
 
 const { AppDetails } = await import('~/modules/appCatalog/ui/detail/AppDetails')

package/src/__tests__/modules/appCatalog/ui/detail/AppDetails.tags.test.tsx

@@ -28,8 +28,11 @@ vi.mock('~/modules/appCatalog/ui/context/AppCatalogFiltersContext', () => ({
   useAppCatalogFilters: vi.fn(() => ({ selectedTags: [], toggleTag: vi.fn() })),
 }))
 vi.mock('~/modules/auth', () => ({ useUser: vi.fn(() => null) }))
-vi.mock('~/modules/appCatalog/ui/detail/FeedbackSection', () => ({
-  FeedbackSection: () => <div />,
+vi.mock('~/modules/appCatalog/ui/detail/CommunitySection', () => ({
+  CommunitySection: () => <div />,
+}))
+vi.mock('~/modules/appCatalog/ui/detail/usePendingCount', () => ({
+  usePendingCount: () => 0,
 }))
 
 const { AppDetails } = await import('~/modules/appCatalog/ui/detail/AppDetails')