From 77b50ea5696128ea3ba8b7ac1aa3554ca433ef49 Mon Sep 17 00:00:00 2001 From: Owen Pearson Date: Mon, 20 Nov 2023 12:18:26 +0000 Subject: [PATCH] fix: use 'ably' as import path from react-hooks The import paths here only worked before by accident - tsc would compile then to `from '../../../ably'` which in most cases would resolve to `node_modules/ably` however in certain environments (pnpm) this would not be the case and therefore the types would not be imported correctly. I've updated the tsconfig compilerOptions.paths field so that these are resolved correctly for development, and when consumed as a library these will just import directly from the 'ably' module. --- src/platform/react-hooks/src/AblyProvider.tsx | 8 +++----- src/platform/react-hooks/src/AblyReactHooks.ts | 2 +- src/platform/react-hooks/src/hooks/useChannel.ts | 2 +- .../react-hooks/src/hooks/useChannelStateListener.ts | 2 +- .../react-hooks/src/hooks/useConnectionStateListener.ts | 2 +- src/platform/react-hooks/src/hooks/useEventListener.ts | 2 +- src/platform/react-hooks/src/hooks/usePresence.ts | 2 +- src/platform/react-hooks/src/hooks/useStateErrors.ts | 2 +- src/platform/react-hooks/tsconfig.json | 5 ++++- 9 files changed, 14 insertions(+), 13 deletions(-) diff --git a/src/platform/react-hooks/src/AblyProvider.tsx b/src/platform/react-hooks/src/AblyProvider.tsx index c26f8e12a4..56eca00604 100644 --- a/src/platform/react-hooks/src/AblyProvider.tsx +++ b/src/platform/react-hooks/src/AblyProvider.tsx @@ -1,7 +1,5 @@ -// eslint-disable-next-line @typescript-eslint/ban-ts-comment -// @ts-ignore import * as Ably from 'ably'; -import { Types } from '../../../../ably.js'; +import { Types } from 'ably'; import React, { useMemo } from 'react'; const canUseSymbol = typeof Symbol === 'function' && typeof Symbol.for === 'function'; @@ -31,7 +29,7 @@ export const AblyProvider = ({ client, children, id = 'default' }: AblyProviderP throw new Error('AblyProvider: the `client` prop is required'); } - if (!(client instanceof Ably.Realtime) && !client?.options?.promises) { + if (!(client instanceof Ably.Realtime) && !(client as any)?.options?.promises) { throw new Error('AblyProvider: the `client` prop must take an instance of Ably.Realtime.Promise'); } @@ -39,7 +37,7 @@ export const AblyProvider = ({ client, children, id = 'default' }: AblyProviderP let context = getContext(id); if (!context) { - context = ctxMap[id] = React.createContext(realtime ?? 1); + context = ctxMap[id] = React.createContext(realtime); } return {children}; diff --git a/src/platform/react-hooks/src/AblyReactHooks.ts b/src/platform/react-hooks/src/AblyReactHooks.ts index 0b31381c87..1ab6bb7f94 100644 --- a/src/platform/react-hooks/src/AblyReactHooks.ts +++ b/src/platform/react-hooks/src/AblyReactHooks.ts @@ -1,4 +1,4 @@ -import { Types } from '../../../../ably.js'; +import { Types } from 'ably'; export type ChannelNameAndOptions = { channelName: string; diff --git a/src/platform/react-hooks/src/hooks/useChannel.ts b/src/platform/react-hooks/src/hooks/useChannel.ts index 2321f5e3f7..e8d45b50ae 100644 --- a/src/platform/react-hooks/src/hooks/useChannel.ts +++ b/src/platform/react-hooks/src/hooks/useChannel.ts @@ -1,4 +1,4 @@ -import { Types } from '../../../../../ably.js'; +import { Types } from 'ably'; import { useEffect, useMemo, useRef } from 'react'; import { channelOptionsWithAgent, ChannelParameters } from '../AblyReactHooks.js'; import { useAbly } from './useAbly.js'; diff --git a/src/platform/react-hooks/src/hooks/useChannelStateListener.ts b/src/platform/react-hooks/src/hooks/useChannelStateListener.ts index 4c38c92a4a..dcb5d7d31e 100644 --- a/src/platform/react-hooks/src/hooks/useChannelStateListener.ts +++ b/src/platform/react-hooks/src/hooks/useChannelStateListener.ts @@ -1,5 +1,5 @@ import { useEffect, useRef } from 'react'; -import { Types } from '../../../../../ably.js'; +import { Types } from 'ably'; import { ChannelNameAndId, ChannelNameAndOptions, channelOptionsWithAgent } from '../AblyReactHooks.js'; import { useAbly } from './useAbly.js'; import { useEventListener } from './useEventListener.js'; diff --git a/src/platform/react-hooks/src/hooks/useConnectionStateListener.ts b/src/platform/react-hooks/src/hooks/useConnectionStateListener.ts index 3df2ac16b1..74b18fa718 100644 --- a/src/platform/react-hooks/src/hooks/useConnectionStateListener.ts +++ b/src/platform/react-hooks/src/hooks/useConnectionStateListener.ts @@ -1,4 +1,4 @@ -import { Types } from '../../../../../ably.js'; +import { Types } from 'ably'; import { useAbly } from './useAbly.js'; import { useEventListener } from './useEventListener.js'; diff --git a/src/platform/react-hooks/src/hooks/useEventListener.ts b/src/platform/react-hooks/src/hooks/useEventListener.ts index 8c3d487819..adf6476c64 100644 --- a/src/platform/react-hooks/src/hooks/useEventListener.ts +++ b/src/platform/react-hooks/src/hooks/useEventListener.ts @@ -1,4 +1,4 @@ -import { Types } from '../../../../../ably.js'; +import { Types } from 'ably'; import { useEffect, useRef } from 'react'; type EventListener = (stateChange: T) => any; diff --git a/src/platform/react-hooks/src/hooks/usePresence.ts b/src/platform/react-hooks/src/hooks/usePresence.ts index c328a6055b..4cf32115f9 100644 --- a/src/platform/react-hooks/src/hooks/usePresence.ts +++ b/src/platform/react-hooks/src/hooks/usePresence.ts @@ -1,4 +1,4 @@ -import { Types } from '../../../../../ably.js'; +import { Types } from 'ably'; import { useCallback, useEffect, useMemo, useRef, useState } from 'react'; import { channelOptionsWithAgent, ChannelParameters } from '../AblyReactHooks.js'; import { useAbly } from './useAbly.js'; diff --git a/src/platform/react-hooks/src/hooks/useStateErrors.ts b/src/platform/react-hooks/src/hooks/useStateErrors.ts index ff991bb55e..9921b6cac0 100644 --- a/src/platform/react-hooks/src/hooks/useStateErrors.ts +++ b/src/platform/react-hooks/src/hooks/useStateErrors.ts @@ -1,4 +1,4 @@ -import { Types } from '../../../../../ably.js'; +import { Types } from 'ably'; import { useState } from 'react'; import { useConnectionStateListener } from './useConnectionStateListener.js'; import { useChannelStateListener } from './useChannelStateListener.js'; diff --git a/src/platform/react-hooks/tsconfig.json b/src/platform/react-hooks/tsconfig.json index d455d743b2..ed956b2d1d 100644 --- a/src/platform/react-hooks/tsconfig.json +++ b/src/platform/react-hooks/tsconfig.json @@ -14,6 +14,9 @@ "allowJs": true, "jsx": "react-jsx", "lib": ["DOM", "DOM.Iterable", "ESNext"], - "types": ["vitest/globals"] + "types": ["vitest/globals"], + "paths": { + "ably": ["../../../"] + } } }