Files
supabase/apps/ui-library/registry/utils.ts
abbac3b852 refactor(library): resolve registry dependencies from one source of truth (#50367)
## I have read the
[CONTRIBUTING.md](https://github.com/supabase/supabase/blob/master/CONTRIBUTING.md)
file.

YES

## What kind of change does this PR introduce?

Refactor, bug fix.

Part 1 of 6 in a stack that splits the library redesign into reviewable
pieces. This one is the foundation the rest build on and has no visual
change.

## What is the current behavior?

Three build steps each reimplement "where does this registry file land
in the user's project": `process-registry`'s `getDefaultPath`,
`registry/utils`' `uniqBy` on `file.path`, and the Markdown exporter.
They disagree, which produces real bugs:

- A Vue block whose files come from `node_modules/@supabase/vue-blocks/`
keeps its package path, so the installer writes the package folder into
the user's project.
- `registryItemAppend` builds its `docs` string from `(item.docs,
items.flatMap(...))` — a comma expression, so the item's own docs are
discarded.
- A name collision between a block file and its client's file silently
keeps one of the two.
- Install commands guess the CLI family from substrings in the item
name, so `infinite-query-composable` — a Vue block with neither "vue"
nor "nuxtjs" in its name — gets the React CLI.
- Production Vue installs use `@supabase/<name>`, but the `@supabase`
namespace is registered with shadcn, not shadcn-vue.
- `build:registry`, `build:content`, `build:markdown` and `build:llms`
run in parallel, but the last three read `public/r`.

## What is the new behavior?

`lib/registry-resolution.ts` owns installed-path derivation, first-party
dependency naming, deduplication, and cycle detection, and every
consumer calls it. `build-registry` validates the whole registry against
shadcn's schema and resolves every item, so a broken reference fails the
build instead of shipping. `clean-registry` throws rather than logging
past a failure.

Pages declare their install `framework` explicitly instead of it being
inferred, and production Vue installs use the absolute registry URL.

The build steps are serialized behind `build:prepare`, and a new
`library-tests.yml` workflow runs the library's tests, checks the
generated registry is committed, and builds the app.

## Additional context

Regenerated registry artifacts are the mechanical result of the
resolution fix — the Vue client items and the OAuth consent items that
gained their client's docs.

<!-- This is an auto-generated comment: release notes by coderabbit.ai
-->

## Summary by CodeRabbit

* **New Features**
* Added explicit React and Vue framework selection for library blocks
and installation commands.
* Improved registry resolution, dependency handling, path validation,
and Vue file normalization.
* Added support for reliable local, preview, and production registry
URLs.

* **Documentation**
* Updated Vue and Nuxt installation documentation to identify the Vue
framework explicitly.

* **Bug Fixes**
* Preserved combined documentation and validated generated registry
content more consistently.

* **Tests**
* Added coverage for installation commands, registry resolution,
dependency handling, and generated artifacts.

* **Chores**
  * Added automated pull-request checks for library tests and builds.

<!-- end of auto-generated comment: release notes by coderabbit.ai -->

---------

Co-authored-by: Claude Opus 5 <noreply@anthropic.com>
Co-authored-by: Ivan Vasilov <vasilov.ivan@gmail.com>
2026-09-18 10:38:48 +10:00

36 lines
1.1 KiB
TypeScript

import lodash from 'lodash'
import type { RegistryItem } from 'shadcn/schema'
import { uniqueInstalledFiles } from '../lib/registry-resolution'
const { uniq } = lodash
const registryItemAppend = (item: RegistryItem, items: RegistryItem[]) => {
const neededRegDependencies = [
...(item.registryDependencies || []),
...items.flatMap((i) => i.registryDependencies ?? []),
]
const neededDependencies = [
...(item.dependencies || []),
...items.flatMap((i) => i.dependencies ?? []),
]
const neededFiles = [...(item.files || []), ...items.flatMap((i) => i.files ?? [])]
const registryBlock = {
...item,
registryDependencies: uniq(neededRegDependencies),
dependencies: uniq(neededDependencies),
files: uniqueInstalledFiles(neededFiles, `Registry item "${item.name}"`),
docs: [item.docs, ...items.map((i) => i.docs)].filter(Boolean).join('\n\n'),
// merge all environment variables
envVars: {
...item.envVars,
...items.reduce((acc, i) => ({ ...acc, ...i.envVars }), {}),
},
}
return registryBlock
}
export { registryItemAppend }