diff --git a/packages/npm/src/NpmClientContext.tsx b/packages/npm/src/NpmClientContext.tsx new file mode 100644 index 0000000..3b8c413 --- /dev/null +++ b/packages/npm/src/NpmClientContext.tsx @@ -0,0 +1,14 @@ +import { createContext, useContext, useMemo } from 'react'; +import { NpmClient } from 'npmjs-api-client'; + +const NpmClientContext = createContext(null); + +export function NpmClientProvider({ children }: { children: React.ReactNode }) { + const client = useMemo(() => new NpmClient(), []); + return {children}; +} + +export function useNpmClient(): NpmClient { + const client = useContext(NpmClientContext); + return client ?? new NpmClient(); +} diff --git a/packages/npm/src/hooks/useNpmMaintainer.ts b/packages/npm/src/hooks/useNpmMaintainer.ts index 81c8386..b43c45c 100644 --- a/packages/npm/src/hooks/useNpmMaintainer.ts +++ b/packages/npm/src/hooks/useNpmMaintainer.ts @@ -1,7 +1,8 @@ -import { useMemo } from 'react'; + import { useQuery, type UseQueryResult } from '@tanstack/react-query'; -import { NpmClient, type NpmUser } from 'npmjs-api-client'; +import { type NpmUser } from 'npmjs-api-client'; import { npmQueryKeys } from '../keys/npmQueryKeys.js'; +import { useNpmClient } from '../NpmClientContext.js'; export interface UseNpmMaintainerOptions { enabled?: boolean; @@ -12,7 +13,7 @@ export function useNpmMaintainer( options: UseNpmMaintainerOptions = {} ): UseQueryResult { const { enabled = true } = options; - const client = useMemo(() => new NpmClient(), []); + const client = useNpmClient(); return useQuery({ queryKey: npmQueryKeys.maintainer(username), diff --git a/packages/npm/src/hooks/useNpmMaintainerPackages.ts b/packages/npm/src/hooks/useNpmMaintainerPackages.ts index c1440f2..f10e66f 100644 --- a/packages/npm/src/hooks/useNpmMaintainerPackages.ts +++ b/packages/npm/src/hooks/useNpmMaintainerPackages.ts @@ -1,7 +1,8 @@ -import { useMemo } from 'react'; + import { useQuery, type UseQueryResult } from '@tanstack/react-query'; -import { NpmClient, type NpmSearchResult, type MaintainerPackagesParams } from 'npmjs-api-client'; +import { type NpmSearchResult, type MaintainerPackagesParams } from 'npmjs-api-client'; import { npmQueryKeys } from '../keys/npmQueryKeys.js'; +import { useNpmClient } from '../NpmClientContext.js'; export interface UseNpmMaintainerPackagesOptions extends MaintainerPackagesParams { enabled?: boolean; @@ -12,7 +13,7 @@ export function useNpmMaintainerPackages( options: UseNpmMaintainerPackagesOptions = {} ): UseQueryResult { const { enabled = true, ...params } = options; - const client = useMemo(() => new NpmClient(), []); + const client = useNpmClient(); const queryParams = Object.keys(params).length > 0 ? params : undefined; diff --git a/packages/npm/src/hooks/useNpmPackage.ts b/packages/npm/src/hooks/useNpmPackage.ts index 6c3e117..639004e 100644 --- a/packages/npm/src/hooks/useNpmPackage.ts +++ b/packages/npm/src/hooks/useNpmPackage.ts @@ -1,6 +1,6 @@ -import { useMemo } from 'react'; import { useQuery, type UseQueryResult } from '@tanstack/react-query'; -import { NpmClient, type NpmPackument } from 'npmjs-api-client'; +import { type NpmPackument } from 'npmjs-api-client'; +import { useNpmClient } from '../NpmClientContext.js'; import { npmQueryKeys } from '../keys/npmQueryKeys.js'; export interface UseNpmPackageOptions { @@ -12,7 +12,7 @@ export function useNpmPackage( options: UseNpmPackageOptions = {} ): UseQueryResult { const { enabled = true } = options; - const client = useMemo(() => new NpmClient(), []); + const client = useNpmClient(); return useQuery({ queryKey: npmQueryKeys.package(name), diff --git a/packages/npm/src/hooks/useNpmPackageDistTags.ts b/packages/npm/src/hooks/useNpmPackageDistTags.ts index c936a01..0e14734 100644 --- a/packages/npm/src/hooks/useNpmPackageDistTags.ts +++ b/packages/npm/src/hooks/useNpmPackageDistTags.ts @@ -1,7 +1,8 @@ -import { useMemo } from 'react'; + import { useQuery, type UseQueryResult } from '@tanstack/react-query'; -import { NpmClient, type NpmDistTags } from 'npmjs-api-client'; +import { type NpmDistTags } from 'npmjs-api-client'; import { npmQueryKeys } from '../keys/npmQueryKeys.js'; +import { useNpmClient } from '../NpmClientContext.js'; export interface UseNpmPackageDistTagsOptions { enabled?: boolean; @@ -12,7 +13,7 @@ export function useNpmPackageDistTags( options: UseNpmPackageDistTagsOptions = {} ): UseQueryResult { const { enabled = true } = options; - const client = useMemo(() => new NpmClient(), []); + const client = useNpmClient(); return useQuery({ queryKey: npmQueryKeys.packageDistTags(name), diff --git a/packages/npm/src/hooks/useNpmPackageDownloadRange.ts b/packages/npm/src/hooks/useNpmPackageDownloadRange.ts index 9bd6764..61299c0 100644 --- a/packages/npm/src/hooks/useNpmPackageDownloadRange.ts +++ b/packages/npm/src/hooks/useNpmPackageDownloadRange.ts @@ -1,7 +1,8 @@ -import { useMemo } from 'react'; + import { useQuery, type UseQueryResult } from '@tanstack/react-query'; -import { NpmClient, type NpmDownloadRange, type NpmDownloadPeriod } from 'npmjs-api-client'; +import { type NpmDownloadRange, type NpmDownloadPeriod } from 'npmjs-api-client'; import { npmQueryKeys } from '../keys/npmQueryKeys.js'; +import { useNpmClient } from '../NpmClientContext.js'; export interface UseNpmPackageDownloadRangeOptions { period?: NpmDownloadPeriod; @@ -13,7 +14,7 @@ export function useNpmPackageDownloadRange( options: UseNpmPackageDownloadRangeOptions = {} ): UseQueryResult { const { period = 'last-month', enabled = true } = options; - const client = useMemo(() => new NpmClient(), []); + const client = useNpmClient(); return useQuery({ queryKey: npmQueryKeys.packageDownloadRange(name, period), diff --git a/packages/npm/src/hooks/useNpmPackageDownloads.ts b/packages/npm/src/hooks/useNpmPackageDownloads.ts index 89d9ca0..0982d5e 100644 --- a/packages/npm/src/hooks/useNpmPackageDownloads.ts +++ b/packages/npm/src/hooks/useNpmPackageDownloads.ts @@ -1,7 +1,8 @@ -import { useMemo } from 'react'; + import { useQuery, type UseQueryResult } from '@tanstack/react-query'; -import { NpmClient, type NpmDownloadPoint, type NpmDownloadPeriod } from 'npmjs-api-client'; +import { type NpmDownloadPoint, type NpmDownloadPeriod } from 'npmjs-api-client'; import { npmQueryKeys } from '../keys/npmQueryKeys.js'; +import { useNpmClient } from '../NpmClientContext.js'; export interface UseNpmPackageDownloadsOptions { period?: NpmDownloadPeriod; @@ -13,7 +14,7 @@ export function useNpmPackageDownloads( options: UseNpmPackageDownloadsOptions = {} ): UseQueryResult { const { period = 'last-month', enabled = true } = options; - const client = useMemo(() => new NpmClient(), []); + const client = useNpmClient(); return useQuery({ queryKey: npmQueryKeys.packageDownloads(name, period), diff --git a/packages/npm/src/hooks/useNpmPackageLatest.ts b/packages/npm/src/hooks/useNpmPackageLatest.ts index 60cf05a..2def1ba 100644 --- a/packages/npm/src/hooks/useNpmPackageLatest.ts +++ b/packages/npm/src/hooks/useNpmPackageLatest.ts @@ -1,6 +1,7 @@ -import { useMemo } from 'react'; + import { useQuery, type UseQueryResult } from '@tanstack/react-query'; -import { NpmClient, type NpmPackageVersion } from 'npmjs-api-client'; +import { type NpmPackageVersion } from 'npmjs-api-client'; +import { useNpmClient } from '../NpmClientContext.js'; import { npmQueryKeys } from '../keys/npmQueryKeys.js'; export interface UseNpmPackageLatestOptions { @@ -12,7 +13,7 @@ export function useNpmPackageLatest( options: UseNpmPackageLatestOptions = {} ): UseQueryResult { const { enabled = true } = options; - const client = useMemo(() => new NpmClient(), []); + const client = useNpmClient(); return useQuery({ queryKey: npmQueryKeys.packageVersion(name, 'latest'), diff --git a/packages/npm/src/hooks/useNpmPackageMaintainers.ts b/packages/npm/src/hooks/useNpmPackageMaintainers.ts index 317eb21..784c6f5 100644 --- a/packages/npm/src/hooks/useNpmPackageMaintainers.ts +++ b/packages/npm/src/hooks/useNpmPackageMaintainers.ts @@ -1,7 +1,8 @@ -import { useMemo } from 'react'; + import { useQuery, type UseQueryResult } from '@tanstack/react-query'; -import { NpmClient, type NpmPerson } from 'npmjs-api-client'; +import { type NpmPerson } from 'npmjs-api-client'; import { npmQueryKeys } from '../keys/npmQueryKeys.js'; +import { useNpmClient } from '../NpmClientContext.js'; export interface UseNpmPackageMaintainersOptions { enabled?: boolean; @@ -12,7 +13,7 @@ export function useNpmPackageMaintainers( options: UseNpmPackageMaintainersOptions = {} ): UseQueryResult { const { enabled = true } = options; - const client = useMemo(() => new NpmClient(), []); + const client = useNpmClient(); return useQuery({ queryKey: npmQueryKeys.packageMaintainers(name), diff --git a/packages/npm/src/hooks/useNpmPackageVersion.ts b/packages/npm/src/hooks/useNpmPackageVersion.ts index 584fdd5..6e29410 100644 --- a/packages/npm/src/hooks/useNpmPackageVersion.ts +++ b/packages/npm/src/hooks/useNpmPackageVersion.ts @@ -1,7 +1,8 @@ -import { useMemo } from 'react'; + import { useQuery, type UseQueryResult } from '@tanstack/react-query'; -import { NpmClient, type NpmPackageVersion } from 'npmjs-api-client'; +import { type NpmPackageVersion } from 'npmjs-api-client'; import { npmQueryKeys } from '../keys/npmQueryKeys.js'; +import { useNpmClient } from '../NpmClientContext.js'; export interface UseNpmPackageVersionOptions { enabled?: boolean; @@ -13,7 +14,7 @@ export function useNpmPackageVersion( options: UseNpmPackageVersionOptions = {} ): UseQueryResult { const { enabled = true } = options; - const client = useMemo(() => new NpmClient(), []); + const client = useNpmClient(); return useQuery({ queryKey: npmQueryKeys.packageVersion(name, version), diff --git a/packages/npm/src/hooks/useNpmPackageVersions.ts b/packages/npm/src/hooks/useNpmPackageVersions.ts index ade7d94..26cc4ab 100644 --- a/packages/npm/src/hooks/useNpmPackageVersions.ts +++ b/packages/npm/src/hooks/useNpmPackageVersions.ts @@ -1,7 +1,8 @@ -import { useMemo } from 'react'; + import { useQuery, type UseQueryResult } from '@tanstack/react-query'; -import { NpmClient, type NpmPackageVersion } from 'npmjs-api-client'; +import { type NpmPackageVersion } from 'npmjs-api-client'; import { npmQueryKeys } from '../keys/npmQueryKeys.js'; +import { useNpmClient } from '../NpmClientContext.js'; export interface UseNpmPackageVersionsOptions { enabled?: boolean; @@ -12,7 +13,7 @@ export function useNpmPackageVersions( options: UseNpmPackageVersionsOptions = {} ): UseQueryResult { const { enabled = true } = options; - const client = useMemo(() => new NpmClient(), []); + const client = useNpmClient(); return useQuery({ queryKey: npmQueryKeys.packageVersions(name), diff --git a/packages/npm/src/hooks/useNpmSearch.ts b/packages/npm/src/hooks/useNpmSearch.ts index eb2c029..e06fc08 100644 --- a/packages/npm/src/hooks/useNpmSearch.ts +++ b/packages/npm/src/hooks/useNpmSearch.ts @@ -1,7 +1,8 @@ -import { useMemo } from 'react'; + import { useQuery, type UseQueryResult } from '@tanstack/react-query'; -import { NpmClient, type NpmSearchResult, type NpmSearchParams } from 'npmjs-api-client'; +import { type NpmSearchResult, type NpmSearchParams } from 'npmjs-api-client'; import { npmQueryKeys } from '../keys/npmQueryKeys.js'; +import { useNpmClient } from '../NpmClientContext.js'; export interface UseNpmSearchOptions extends Omit { enabled?: boolean; @@ -12,7 +13,7 @@ export function useNpmSearch( options: UseNpmSearchOptions = {} ): UseQueryResult { const { enabled = true, ...rest } = options; - const client = useMemo(() => new NpmClient(), []); + const client = useNpmClient(); const params: NpmSearchParams = { text, ...rest }; diff --git a/packages/npm/src/index.ts b/packages/npm/src/index.ts index ed4c392..e3c882b 100644 --- a/packages/npm/src/index.ts +++ b/packages/npm/src/index.ts @@ -3,6 +3,7 @@ // - npmjs-api-client (https://www.npmjs.com/package/npmjs-api-client) // - @tanstack/react-query +export * from './NpmClientContext.js'; export * from './hooks/useNpmPackage.js'; export * from './hooks/useNpmPackageVersion.js'; export * from './hooks/useNpmPackageLatest.js';