fix(FR-2606): clear residual build-time warnings (BUI dts + module directive)

[nowgnuesLee]

Resolves #6809(FR-2606)

Summary

Cleans up residual pnpm run build warnings introduced or surfaced by the Vite migration (FR-2611). All non-fatal in the original log (build was already exiting 0); cleared here as a follow-up to the FR-2606 series.

Three classes of warnings are addressed:

1. BUI dts emit type errors (TS2742 + TS2591 + a follow-on TS2339)
2. Module-level 'use memo' directive ignored by Rollup
3. Components ↔ hooks circular dependency in BUI, surfaced via ResourceTypeIcon re-export through the components barrel

1. BUI dts emit (vite-plugin-dts) — three TS diagnostics

TS2742 — i18n inferred type (packages/backend.ai-ui/src/locale/index.ts:92)

The inferred type of 'i18n' cannot be named without a reference to '../../node_modules/i18next'.

createInstance(...)'s inferred return type referenced i18next internal types, breaking portable .d.ts emit. Added explicit annotation:

import { createInstance, type i18n as I18nInstance } from 'i18next';
export const i18n: I18nInstance = createInstance({ ... });

TS2591 — process not defined (packages/backend.ai-ui/src/hooks/useBAILogger.tsx:47)

BUI's tsconfig.types is intentionally ["vite-plugin-svgr/client"] (no node types) because BUI is a browser-only library. The single process.env.NODE_ENV read violated that policy. Switched to Vite's first-class env API:

private enabled: boolean = !import.meta.env.PROD;

TS2339 — import.meta.env not typed (follow-up to TS2591 fix)

For import.meta.env.PROD to be typed in BUI's dts emit, vite/client ambient types had to be wired in. Three coordinated changes:

• packages/backend.ai-ui/vite-env.d.ts — added /// <reference types="vite/client" />. The file already existed at the package root but was orphaned; included it so it actually gets picked up.
• packages/backend.ai-ui/tsconfig.json — added vite-env.d.ts to include.
• packages/backend.ai-ui/vite.config.ts — added vite-env.d.ts to the dts plugin's own include array (separate from tsconfig.include; this was the missing piece that made import.meta.env.PROD typed in dts emit context).
• react/src/ambient.d.ts — added the same reference for the react/ tsc check (verify.sh) which compiles BUI source through the path alias.

2. Module-level 'use memo' (react/src/components/SwitchToProjectButton.tsx:1)

Module level directives cause errors when bundled, "use memo" in "..." was ignored.

Moved the directive from module level to the inner function body (SwitchToProjectButtonContent), matching .claude/rules/react-compiler-memoization.md convention. The wrapper component (SwitchToProjectButton) renders only Suspense + child and does not need its own memo directive.

3. BUI components ↔ hooks circular dependency

Rollup chunk-graph warning:

Export "ResourceTypeIcon" of module ".../BAIResourceNumberWithIcon.tsx" was reexported through module ".../components/index.ts" while both modules are dependencies of each other...

The actual cycle traced:

components/index.ts (barrel)
  ↓ re-exports BAIResourceNumberWithIcon
BAIResourceNumberWithIcon.tsx
  ↓ imports './provider' (provider barrel)
provider barrel
  ↓ exports BAIMetaDataProvider, BAIClientProvider hooks
BAIMetaDataProvider/hooks/useBAIDeviceMetaData.ts:1
BAIClientProvider/hooks/useAnonymousBAIClient.ts:1
BAIMetaDataProvider/types.ts:1
  ↓ each imports from '../../../[..]/hooks' (hooks barrel)
hooks/index.ts:1-5
  ↓ imports value names from '../components'         🔴 cycle closes

The cycle was reachable through three back-edges from the components/provider/... subtree into the hooks barrel, plus the hooks barrel's own value imports back into the components barrel. Six coordinated edits broke it:

• BUI/src/hooks/index.ts:1-5 — barrel-to-barrel import replaced with three direct module imports + one import type (for the type-only ResourceSlotName).
• BUI/src/hooks/useBAISignedRequestWithPromise.ts:1 — same pattern; barrel → direct module path.
• BUI/src/components/provider/BAIMetaDataProvider/hooks/useBAIDeviceMetaData.ts:1 — barrel → direct module path on the hooks side.
• BUI/src/components/provider/BAIClientProvider/hooks/useAnonymousBAIClient.ts:1 — same pattern.
• BUI/src/components/provider/BAIMetaDataProvider/types.ts:1 — value-style import of a type promoted to import type.

Net structural change: the BUI hooks barrel no longer imports anything from the components barrel, and the surviving provider/* → hooks edges all go through direct module paths whose target files have no further cycle exposure. Components-subtree files are still free to use the hooks barrel; the dependency arrow is now one-way only.

Locale Prettier config — fixed parent override (in earlier amend)

packages/backend.ai-ui/src/locale/.prettierrc was a per-directory override containing only the JSON-sort plugin, with no other options set. Prettier's config resolution picks the nearest config file and does NOT cascade from parents, so singleQuote defaulted to false for files in src/locale/ — including index.ts, which kept getting double-quoted whenever lint-staged ran.

Fix: deleted src/locale/.prettierrc and moved the JSON-sort options into the parent BUI .prettierrc.json as an overrides entry scoped to src/locale/*.json. The directory now inherits the rest of the BUI Prettier config (including singleQuote: true) while retaining the JSON-only sort behavior.

Verification

• bash scripts/verify.sh — Relay / Lint / Format / TypeScript all PASS
• pnpm run build — exit 0; the following diagnostics are no longer present in the log:
  • TS2742 (i18n portable)
  • TS2591 (process not defined)
  • TS2339 (import.meta.env.PROD not typed)
  • "Module level directives cause errors" ('use memo')
  • "reexported through ... while both modules are dependencies of each other" (ResourceTypeIcon cycle)

Remaining build warnings (5 mixed dynamic+static imports, 2 chunks > 2 MB, several runtime-resolved CSS/manifest assets) are out of scope and tracked separately.

Stack

Sits on top of #7104 (FR-2606 Monaco self-hosting). Top of the Vite migration follow-up stack.

[nowgnuesLee]

• fix(FR-2529): include backend.ai-client src in craco TS loader and tsconfig paths #6615
• refactor(FR-2529): extract backend.ai-client as standalone workspace package #6614
• fix(FR-2607): align Electron publicPath patch with Vite output #7189
• fix(FR-2606): clear residual build-time warnings (BUI dts + module directive) #7113 👈 (View in Graphite)
• fix(FR-2606): restore Monaco self-hosting in Vite dev server #7104
• feat(FR-2748): fully migrate test files from jest.* to vi.* and align TS globals #7083
• feat(FR-2746): re-enable 5 tests skipped during Vitest migration #7071
• feat(FR-2744): restore Vitest coverage reporting in CI #7065
• fix(FR-2606): replace webpackIgnore with @vite-ignore in dynamic plugin imports #6879
• fix(FR-2606): replace global.packageVersion with globalThis.packageVersion in WebUISider #6878
• fix(FR-2608): disable vite-plugin-pwa auto-manifest to preserve existing manifest.json #6877
• feat(FR-2611): retire Craco/Webpack — build, Makefile, CI all on Vite/Vitest #6876
• feat: migrate BUI + root tests from Jest to Vitest (follow-up to FR-2609) #6875
• feat(FR-2609): Vitest migration for react/ (100% pass, 856/856 tests) #6874
• feat(FR-2608): Vite production build with vite-plugin-pwa service worker #6873
• feat(FR-2610): Vite dev-reload plugin for i18n / theme / config.toml file changes #6872
• feat(FR-2607): Vite spike answer — es6:// Electron publicPath works via renderBuiltUrl #6871
• feat(FR-2606): restore BUI i18n context isolation under Vite dep optimization #6870
• feat(FR-2606): Vite PoC phase 1 — dev server + HMR + React Compiler parity #6869
• main

---

How to use the Graphite Merge Queue

Add either label to this PR to merge it via the merge queue:

• flow:merge-queue - adds this PR to the back of the merge queue
• flow:hotfix - for urgent changes, fast-track this PR to the front of the merge queue

You must have a Graphite account in order to use the merge queue. Sign up using this link.

An organization admin has required the Graphite Merge Queue in this repository.

Please do not merge from GitHub as this will restart CI on PRs being processed by the merge queue.

This stack of pull requests is managed by Graphite. Learn more about stacking.

[github-actions]

Coverage Report for backend-ai-ui-coverage (./packages/backend.ai-ui)

Status	Category	Percentage	Covered / Total
🔵	Lines	7.91%	322 / 4066
🔵	Statements	7.2%	368 / 5106
🔵	Functions	8.72%	88 / 1009
🔵	Branches	6.39%	321 / 5020

File Coverage

File	Stmts	Branches	Functions	Lines	Uncovered Lines
Changed Files
packages/backend.ai-ui/src/components/provider/BAIClientProvider/hooks/useAnonymousBAIClient.ts	0%	0%	0%	0%	6-19
packages/backend.ai-ui/src/components/provider/BAIMetaDataProvider/types.ts	0%	100%	100%	0%	7-22
packages/backend.ai-ui/src/components/provider/BAIMetaDataProvider/hooks/useBAIDeviceMetaData.ts	0%	0%	0%	0%	5-17
packages/backend.ai-ui/src/hooks/index.ts	0%	0%	0%	0%	32-145
packages/backend.ai-ui/src/hooks/useBAILogger.tsx	0%	0%	0%	0%	1-195
packages/backend.ai-ui/src/hooks/useBAISignedRequestWithPromise.ts	0%	0%	0%	0%	3-34

Generated in workflow #113 for commit 5adac3e by the Vitest Coverage Report Action

[github-actions]

Coverage Report for react-coverage (./react)

Status	Category	Percentage	Covered / Total
🔵	Lines	6.89%	1781 / 25826
🔵	Statements	5.79%	1976 / 34105
🔵	Functions	5.35%	296 / 5523
🔵	Branches	4.11%	1291 / 31365

File Coverage

File	Stmts	Branches	Functions	Lines	Uncovered Lines
Changed Files
react/src/ambient.d.ts	100%	100%	100%	100%
react/src/components/SwitchToProjectButton.tsx	0%	0%	0%	0%	21-72

Generated in workflow #113 for commit 5adac3e by the Vitest Coverage Report Action

[Copilot]

Pull request overview

Cleans up non-fatal build-time warnings surfaced after the Vite migration by fixing .d.ts emit typing issues, moving a misplaced React Compiler directive, and breaking a Rollup-detected circular dependency between backend.ai-ui components and hooks.

Changes:

• Fixes backend.ai-ui type generation warnings by adding explicit i18n typing, wiring vite/client ambient typings into both TS and vite-plugin-dts, and replacing process.env.NODE_ENV usage with import.meta.env.PROD.
• Moves a module-level 'use memo' directive into the correct component function body to avoid bundler directive warnings.
• Breaks a components↔hooks cycle in backend.ai-ui by replacing barrel-to-barrel imports with direct module imports and converting a value import to import type.

Reviewed changes

Copilot reviewed 13 out of 15 changed files in this pull request and generated no comments.

Show a summary per file

File	Description
react/src/components/SwitchToProjectButton.tsx	Moves 'use memo' from module scope into the component function body.
react/src/components/STokenLoginBoundary.test.tsx	Converts Jest-style mocks to Vitest (vi.*) APIs.
react/src/ambient.d.ts	Adds vite/client type reference to type import.meta.env in React TS checks.
packages/backend.ai-ui/vite.config.ts	Ensures vite-env.d.ts is included in vite-plugin-dts processing.
packages/backend.ai-ui/vite-env.d.ts	Adds vite/client ambient typings for import.meta.env.*.
packages/backend.ai-ui/tsconfig.json	Includes vite-env.d.ts so TS picks up Vite ambient types during builds.
packages/backend.ai-ui/src/locale/index.ts	Adds explicit i18n instance type annotation to keep emitted .d.ts portable.
packages/backend.ai-ui/src/locale/.prettierrc	Removes per-directory Prettier config to restore parent config inheritance.
packages/backend.ai-ui/src/hooks/useBAISignedRequestWithPromise.ts	Replaces hooks→components barrel import with a direct provider-hook import.
packages/backend.ai-ui/src/hooks/useBAILogger.tsx	Switches environment gating to import.meta.env.PROD to avoid process usage.
packages/backend.ai-ui/src/hooks/index.ts	Removes components-barrel dependency by using direct imports and type-only imports.
packages/backend.ai-ui/src/components/provider/BAIMetaDataProvider/types.ts	Converts hooks import to import type to eliminate runtime dependency edges.
packages/backend.ai-ui/src/components/provider/BAIMetaDataProvider/hooks/useBAIDeviceMetaData.ts	Replaces hooks-barrel import with direct leaf-module import to avoid cycles.
packages/backend.ai-ui/src/components/provider/BAIClientProvider/hooks/useAnonymousBAIClient.ts	Replaces hooks-barrel import with direct leaf-module import to avoid cycles.
packages/backend.ai-ui/.prettierrc.json	Moves JSON-sort options into a scoped override for src/locale/*.json.

[graphite-app]

Merge activity

• Apr 30, 12:12 PM UTC: yomybaby added this pull request to the Graphite merge queue.
• Apr 30, 12:39 PM UTC: Merged by the Graphite merge queue.