@dudousxd/nestjs-telescope-ui 1.18.0 → 1.19.0
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/CHANGELOG.md +49 -0
- package/dist/react/index.d.ts +2 -0
- package/dist/react/index.d.ts.map +1 -1
- package/dist/react/index.js +6 -0
- package/dist/react/index.js.map +1 -1
- package/dist/react/open-console-button.d.ts +28 -0
- package/dist/react/open-console-button.d.ts.map +1 -0
- package/dist/react/open-console-button.js +28 -0
- package/dist/react/open-console-button.js.map +1 -0
- package/dist/react/use-open-console.d.ts +34 -0
- package/dist/react/use-open-console.d.ts.map +1 -0
- package/dist/react/use-open-console.js +46 -0
- package/dist/react/use-open-console.js.map +1 -0
- package/package.json +4 -1
package/CHANGELOG.md
CHANGED
|
@@ -1,5 +1,54 @@
|
|
|
1
1
|
# @dudousxd/nestjs-telescope-ui
|
|
2
2
|
|
|
3
|
+
## 1.19.0
|
|
4
|
+
|
|
5
|
+
### Minor Changes
|
|
6
|
+
|
|
7
|
+
- [#65](https://github.com/DavideCarvalho/nestjs-telescope/pull/65) [`be97836`](https://github.com/DavideCarvalho/nestjs-telescope/commit/be978365f716cbe9e120b4024abb5d0ff6129d3d) Thanks [@DavideCarvalho](https://github.com/DavideCarvalho)! - **React tier for the console launcher: `useOpenTelescopeConsole` and `<OpenTelescopeConsoleButton>`, exported from `@dudousxd/nestjs-telescope-ui/react`.**
|
|
8
|
+
|
|
9
|
+
The headless `openTelescopeConsole` gave hosts the mint-then-navigate call; every host then wrote the
|
|
10
|
+
same three lines of React around it — an `isPending` flag, an error slot, and a button that has to
|
|
11
|
+
remember not to fire twice. Three tiers now, pick the one that fits and drop a level when it stops
|
|
12
|
+
fitting:
|
|
13
|
+
|
|
14
|
+
```tsx
|
|
15
|
+
import {
|
|
16
|
+
OpenTelescopeConsoleButton,
|
|
17
|
+
useOpenTelescopeConsole,
|
|
18
|
+
openTelescopeConsoleMutationOptions,
|
|
19
|
+
} from "@dudousxd/nestjs-telescope-ui/react";
|
|
20
|
+
|
|
21
|
+
// 1. drop-in
|
|
22
|
+
<OpenTelescopeConsoleButton
|
|
23
|
+
className="btn btn-primary"
|
|
24
|
+
headers={authHeaders}
|
|
25
|
+
/>;
|
|
26
|
+
|
|
27
|
+
// 2. state only, your markup
|
|
28
|
+
const { open, isPending, error, reset } = useOpenTelescopeConsole({
|
|
29
|
+
headers: authHeaders,
|
|
30
|
+
});
|
|
31
|
+
|
|
32
|
+
// 3. openTelescopeConsole(...) from `/client` — no React at all
|
|
33
|
+
```
|
|
34
|
+
|
|
35
|
+
- `open()` **never rejects**; the refusal lands in `error` as a `ConsoleSessionError` (with its
|
|
36
|
+
`status` and `url`). It deliberately does not clear `isPending` on success, because the navigation
|
|
37
|
+
is already underway and flipping back to idle flickers "ready to click again" on a page that is
|
|
38
|
+
leaving.
|
|
39
|
+
- `<OpenTelescopeConsoleButton>` is **unstyled on purpose** — a bare `<button>` that forwards
|
|
40
|
+
`className`/`style`/every other button prop, so it inherits the host's design system instead of
|
|
41
|
+
importing CSS that fights it. It renders inside the host app, not inside Telescope's own bundle.
|
|
42
|
+
It disables itself and sets `aria-busy` while in flight, and renders the refusal as
|
|
43
|
+
`<p role="alert">` by default: a launcher that silently does nothing reads as broken rather than
|
|
44
|
+
forbidden. `renderError` substitutes that node; `renderError={null}` opts out entirely.
|
|
45
|
+
- `openTelescopeConsoleMutationOptions()` returns the `{ mutationKey, mutationFn }` shape
|
|
46
|
+
`useMutation` takes, so a host already on TanStack Query gets the launcher in its cache, devtools
|
|
47
|
+
and error handling with no adapter — and this package still never imports `@tanstack/react-query`.
|
|
48
|
+
|
|
49
|
+
React stays an optional peer dependency: a host that only mounts the NestJS module pulls none of
|
|
50
|
+
this in. Additive only; nothing existing changes.
|
|
51
|
+
|
|
3
52
|
## 1.18.0
|
|
4
53
|
|
|
5
54
|
### Minor Changes
|
package/dist/react/index.d.ts
CHANGED
|
@@ -1,6 +1,8 @@
|
|
|
1
1
|
export * from './telescope-context.js';
|
|
2
2
|
export * from './use-telescope-queries.js';
|
|
3
3
|
export * from './use-telescope-stream.js';
|
|
4
|
+
export * from './use-open-console.js';
|
|
5
|
+
export * from './open-console-button.js';
|
|
4
6
|
export * from './components/entry-types.js';
|
|
5
7
|
export * from './components/entries-table.js';
|
|
6
8
|
export * from './components/user-tag.js';
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../src/react/index.ts"],"names":[],"mappings":"AAAA,cAAc,wBAAwB,CAAC;AACvC,cAAc,4BAA4B,CAAC;AAC3C,cAAc,2BAA2B,CAAC;
|
|
1
|
+
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../src/react/index.ts"],"names":[],"mappings":"AAAA,cAAc,wBAAwB,CAAC;AACvC,cAAc,4BAA4B,CAAC;AAC3C,cAAc,2BAA2B,CAAC;AAK1C,cAAc,uBAAuB,CAAC;AACtC,cAAc,0BAA0B,CAAC;AACzC,cAAc,6BAA6B,CAAC;AAC5C,cAAc,+BAA+B,CAAC;AAC9C,cAAc,0BAA0B,CAAC;AACzC,cAAc,gCAAgC,CAAC;AAC/C,cAAc,gCAAgC,CAAC;AAC/C,cAAc,4BAA4B,CAAC;AAC3C,cAAc,iCAAiC,CAAC;AAChD,cAAc,8BAA8B,CAAC;AAC7C,cAAc,6BAA6B,CAAC;AAC5C,cAAc,qCAAqC,CAAC;AACpD,cAAc,wBAAwB,CAAC;AACvC,cAAc,qCAAqC,CAAC;AACpD,cAAc,6BAA6B,CAAC;AAC5C,cAAc,+BAA+B,CAAC;AAC9C,cAAc,8BAA8B,CAAC;AAC7C,cAAc,gCAAgC,CAAC;AAC/C,cAAc,+BAA+B,CAAC;AAC9C,cAAc,kCAAkC,CAAC;AACjD,cAAc,6BAA6B,CAAC;AAC5C,cAAc,8BAA8B,CAAC;AAC7C,cAAc,2BAA2B,CAAC;AAC1C,cAAc,8BAA8B,CAAC;AAC7C,cAAc,iCAAiC,CAAC;AAChD,cAAc,8BAA8B,CAAC;AAC7C,cAAc,8BAA8B,CAAC;AAC7C,cAAc,oBAAoB,CAAC"}
|
package/dist/react/index.js
CHANGED
|
@@ -1,6 +1,12 @@
|
|
|
1
1
|
export * from './telescope-context.js';
|
|
2
2
|
export * from './use-telescope-queries.js';
|
|
3
3
|
export * from './use-telescope-stream.js';
|
|
4
|
+
// Console launcher, three tiers: `openTelescopeConsole` (no React, from `./client`),
|
|
5
|
+
// `useOpenTelescopeConsole` (state only, your markup), `<OpenTelescopeConsoleButton>` (drop-in).
|
|
6
|
+
// `openTelescopeConsoleMutationOptions` wires the same call into TanStack Query without this
|
|
7
|
+
// package depending on TanStack.
|
|
8
|
+
export * from './use-open-console.js';
|
|
9
|
+
export * from './open-console-button.js';
|
|
4
10
|
export * from './components/entry-types.js';
|
|
5
11
|
export * from './components/entries-table.js';
|
|
6
12
|
export * from './components/user-tag.js';
|
package/dist/react/index.js.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.js","sourceRoot":"","sources":["../../src/react/index.ts"],"names":[],"mappings":"AAAA,cAAc,wBAAwB,CAAC;AACvC,cAAc,4BAA4B,CAAC;AAC3C,cAAc,2BAA2B,CAAC;AAC1C,cAAc,6BAA6B,CAAC;AAC5C,cAAc,+BAA+B,CAAC;AAC9C,cAAc,0BAA0B,CAAC;AACzC,cAAc,gCAAgC,CAAC;AAC/C,cAAc,gCAAgC,CAAC;AAC/C,cAAc,4BAA4B,CAAC;AAC3C,cAAc,iCAAiC,CAAC;AAChD,cAAc,8BAA8B,CAAC;AAC7C,cAAc,6BAA6B,CAAC;AAC5C,cAAc,qCAAqC,CAAC;AACpD,cAAc,wBAAwB,CAAC;AACvC,cAAc,qCAAqC,CAAC;AACpD,cAAc,6BAA6B,CAAC;AAC5C,cAAc,+BAA+B,CAAC;AAC9C,cAAc,8BAA8B,CAAC;AAC7C,cAAc,gCAAgC,CAAC;AAC/C,cAAc,+BAA+B,CAAC;AAC9C,cAAc,kCAAkC,CAAC;AACjD,cAAc,6BAA6B,CAAC;AAC5C,cAAc,8BAA8B,CAAC;AAC7C,cAAc,2BAA2B,CAAC;AAC1C,cAAc,8BAA8B,CAAC;AAC7C,cAAc,iCAAiC,CAAC;AAChD,cAAc,8BAA8B,CAAC;AAC7C,cAAc,8BAA8B,CAAC;AAC7C,cAAc,oBAAoB,CAAC"}
|
|
1
|
+
{"version":3,"file":"index.js","sourceRoot":"","sources":["../../src/react/index.ts"],"names":[],"mappings":"AAAA,cAAc,wBAAwB,CAAC;AACvC,cAAc,4BAA4B,CAAC;AAC3C,cAAc,2BAA2B,CAAC;AAC1C,qFAAqF;AACrF,iGAAiG;AACjG,6FAA6F;AAC7F,iCAAiC;AACjC,cAAc,uBAAuB,CAAC;AACtC,cAAc,0BAA0B,CAAC;AACzC,cAAc,6BAA6B,CAAC;AAC5C,cAAc,+BAA+B,CAAC;AAC9C,cAAc,0BAA0B,CAAC;AACzC,cAAc,gCAAgC,CAAC;AAC/C,cAAc,gCAAgC,CAAC;AAC/C,cAAc,4BAA4B,CAAC;AAC3C,cAAc,iCAAiC,CAAC;AAChD,cAAc,8BAA8B,CAAC;AAC7C,cAAc,6BAA6B,CAAC;AAC5C,cAAc,qCAAqC,CAAC;AACpD,cAAc,wBAAwB,CAAC;AACvC,cAAc,qCAAqC,CAAC;AACpD,cAAc,6BAA6B,CAAC;AAC5C,cAAc,+BAA+B,CAAC;AAC9C,cAAc,8BAA8B,CAAC;AAC7C,cAAc,gCAAgC,CAAC;AAC/C,cAAc,+BAA+B,CAAC;AAC9C,cAAc,kCAAkC,CAAC;AACjD,cAAc,6BAA6B,CAAC;AAC5C,cAAc,8BAA8B,CAAC;AAC7C,cAAc,2BAA2B,CAAC;AAC1C,cAAc,8BAA8B,CAAC;AAC7C,cAAc,iCAAiC,CAAC;AAChD,cAAc,8BAA8B,CAAC;AAC7C,cAAc,8BAA8B,CAAC;AAC7C,cAAc,oBAAoB,CAAC"}
|
|
@@ -0,0 +1,28 @@
|
|
|
1
|
+
import type { ButtonHTMLAttributes, ReactNode } from 'react';
|
|
2
|
+
import type { OpenConsoleOptions } from '../client/console-session.js';
|
|
3
|
+
export interface OpenTelescopeConsoleButtonProps extends Omit<ButtonHTMLAttributes<HTMLButtonElement>, 'onClick' | 'children'>, OpenConsoleOptions {
|
|
4
|
+
/** Button label. Defaults to "Open Telescope". */
|
|
5
|
+
children?: ReactNode;
|
|
6
|
+
/** Shown while the session is being minted. Defaults to "Opening…". */
|
|
7
|
+
pendingLabel?: ReactNode;
|
|
8
|
+
/**
|
|
9
|
+
* Render the refusal yourself. Omit and the button renders a plain `<p role="alert">` under
|
|
10
|
+
* itself; pass `null` to render nothing and read the error from {@link useOpenTelescopeConsole}.
|
|
11
|
+
*/
|
|
12
|
+
renderError?: ((error: Error) => ReactNode) | null;
|
|
13
|
+
}
|
|
14
|
+
/**
|
|
15
|
+
* Drop-in launcher: the top tier, for a host that just wants a working button.
|
|
16
|
+
*
|
|
17
|
+
* Deliberately unstyled — it emits a bare `<button>` and forwards `className`/`style`/every other
|
|
18
|
+
* button prop, so it inherits whatever design system the host already has instead of importing CSS
|
|
19
|
+
* that would fight it. That matters more here than for the dashboard's own components: this one
|
|
20
|
+
* renders inside the HOST's app, not inside Telescope's Tailwind bundle. When it doesn't fit, drop
|
|
21
|
+
* to {@link useOpenTelescopeConsole} (same behaviour, your markup) or to `openTelescopeConsole` (no
|
|
22
|
+
* React at all).
|
|
23
|
+
*
|
|
24
|
+
* The error is rendered by default rather than swallowed: a refused mint is the case a launcher most
|
|
25
|
+
* needs to surface, and a button that silently does nothing reads as broken rather than forbidden.
|
|
26
|
+
*/
|
|
27
|
+
export declare function OpenTelescopeConsoleButton({ children, pendingLabel, renderError, basePath, headers, fetch: fetchImpl, signal, navigate, disabled, ...buttonProps }: OpenTelescopeConsoleButtonProps): JSX.Element;
|
|
28
|
+
//# sourceMappingURL=open-console-button.d.ts.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"open-console-button.d.ts","sourceRoot":"","sources":["../../src/react/open-console-button.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,oBAAoB,EAAE,SAAS,EAAE,MAAM,OAAO,CAAC;AAC7D,OAAO,KAAK,EAAE,kBAAkB,EAAE,MAAM,8BAA8B,CAAC;AAGvE,MAAM,WAAW,+BACf,SAAQ,IAAI,CAAC,oBAAoB,CAAC,iBAAiB,CAAC,EAAE,SAAS,GAAG,UAAU,CAAC,EAC3E,kBAAkB;IACpB,kDAAkD;IAClD,QAAQ,CAAC,EAAE,SAAS,CAAC;IACrB,uEAAuE;IACvE,YAAY,CAAC,EAAE,SAAS,CAAC;IACzB;;;OAGG;IACH,WAAW,CAAC,EAAE,CAAC,CAAC,KAAK,EAAE,KAAK,KAAK,SAAS,CAAC,GAAG,IAAI,CAAC;CACpD;AAED;;;;;;;;;;;;GAYG;AACH,wBAAgB,0BAA0B,CAAC,EACzC,QAAQ,EACR,YAAY,EACZ,WAAW,EACX,QAAQ,EACR,OAAO,EACP,KAAK,EAAE,SAAS,EAChB,MAAM,EACN,QAAQ,EACR,QAAQ,EACR,GAAG,WAAW,EACf,EAAE,+BAA+B,GAAG,GAAG,CAAC,OAAO,CAyB/C"}
|
|
@@ -0,0 +1,28 @@
|
|
|
1
|
+
import { jsx as _jsx, Fragment as _Fragment, jsxs as _jsxs } from "react/jsx-runtime";
|
|
2
|
+
import { useOpenTelescopeConsole } from './use-open-console.js';
|
|
3
|
+
/**
|
|
4
|
+
* Drop-in launcher: the top tier, for a host that just wants a working button.
|
|
5
|
+
*
|
|
6
|
+
* Deliberately unstyled — it emits a bare `<button>` and forwards `className`/`style`/every other
|
|
7
|
+
* button prop, so it inherits whatever design system the host already has instead of importing CSS
|
|
8
|
+
* that would fight it. That matters more here than for the dashboard's own components: this one
|
|
9
|
+
* renders inside the HOST's app, not inside Telescope's Tailwind bundle. When it doesn't fit, drop
|
|
10
|
+
* to {@link useOpenTelescopeConsole} (same behaviour, your markup) or to `openTelescopeConsole` (no
|
|
11
|
+
* React at all).
|
|
12
|
+
*
|
|
13
|
+
* The error is rendered by default rather than swallowed: a refused mint is the case a launcher most
|
|
14
|
+
* needs to surface, and a button that silently does nothing reads as broken rather than forbidden.
|
|
15
|
+
*/
|
|
16
|
+
export function OpenTelescopeConsoleButton({ children, pendingLabel, renderError, basePath, headers, fetch: fetchImpl, signal, navigate, disabled, ...buttonProps }) {
|
|
17
|
+
const { open, isPending, error } = useOpenTelescopeConsole({
|
|
18
|
+
...(basePath !== undefined ? { basePath } : {}),
|
|
19
|
+
...(headers !== undefined ? { headers } : {}),
|
|
20
|
+
...(fetchImpl !== undefined ? { fetch: fetchImpl } : {}),
|
|
21
|
+
...(signal !== undefined ? { signal } : {}),
|
|
22
|
+
...(navigate !== undefined ? { navigate } : {}),
|
|
23
|
+
});
|
|
24
|
+
return (_jsxs(_Fragment, { children: [_jsx("button", { type: "button", ...buttonProps, onClick: open, disabled: disabled || isPending, "aria-busy": isPending || undefined, children: isPending ? (pendingLabel ?? 'Opening…') : (children ?? 'Open Telescope') }), error &&
|
|
25
|
+
renderError !== null &&
|
|
26
|
+
(renderError?.(error) ?? _jsx("p", { role: "alert", children: error.message }))] }));
|
|
27
|
+
}
|
|
28
|
+
//# sourceMappingURL=open-console-button.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"open-console-button.js","sourceRoot":"","sources":["../../src/react/open-console-button.tsx"],"names":[],"mappings":";AAEA,OAAO,EAAE,uBAAuB,EAAE,MAAM,uBAAuB,CAAC;AAgBhE;;;;;;;;;;;;GAYG;AACH,MAAM,UAAU,0BAA0B,CAAC,EACzC,QAAQ,EACR,YAAY,EACZ,WAAW,EACX,QAAQ,EACR,OAAO,EACP,KAAK,EAAE,SAAS,EAChB,MAAM,EACN,QAAQ,EACR,QAAQ,EACR,GAAG,WAAW,EACkB;IAChC,MAAM,EAAE,IAAI,EAAE,SAAS,EAAE,KAAK,EAAE,GAAG,uBAAuB,CAAC;QACzD,GAAG,CAAC,QAAQ,KAAK,SAAS,CAAC,CAAC,CAAC,EAAE,QAAQ,EAAE,CAAC,CAAC,CAAC,EAAE,CAAC;QAC/C,GAAG,CAAC,OAAO,KAAK,SAAS,CAAC,CAAC,CAAC,EAAE,OAAO,EAAE,CAAC,CAAC,CAAC,EAAE,CAAC;QAC7C,GAAG,CAAC,SAAS,KAAK,SAAS,CAAC,CAAC,CAAC,EAAE,KAAK,EAAE,SAAS,EAAE,CAAC,CAAC,CAAC,EAAE,CAAC;QACxD,GAAG,CAAC,MAAM,KAAK,SAAS,CAAC,CAAC,CAAC,EAAE,MAAM,EAAE,CAAC,CAAC,CAAC,EAAE,CAAC;QAC3C,GAAG,CAAC,QAAQ,KAAK,SAAS,CAAC,CAAC,CAAC,EAAE,QAAQ,EAAE,CAAC,CAAC,CAAC,EAAE,CAAC;KAChD,CAAC,CAAC;IAEH,OAAO,CACL,8BACE,iBACE,IAAI,EAAC,QAAQ,KACT,WAAW,EACf,OAAO,EAAE,IAAI,EACb,QAAQ,EAAE,QAAQ,IAAI,SAAS,eACpB,SAAS,IAAI,SAAS,YAEhC,SAAS,CAAC,CAAC,CAAC,CAAC,YAAY,IAAI,UAAU,CAAC,CAAC,CAAC,CAAC,CAAC,QAAQ,IAAI,gBAAgB,CAAC,GACnE,EACR,KAAK;gBACJ,WAAW,KAAK,IAAI;gBACpB,CAAC,WAAW,EAAE,CAAC,KAAK,CAAC,IAAI,YAAG,IAAI,EAAC,OAAO,YAAE,KAAK,CAAC,OAAO,GAAK,CAAC,IAC9D,CACJ,CAAC;AACJ,CAAC"}
|
|
@@ -0,0 +1,34 @@
|
|
|
1
|
+
import { ConsoleSessionError, type OpenConsoleOptions } from '../client/console-session.js';
|
|
2
|
+
/**
|
|
3
|
+
* React layer over `openTelescopeConsole` — the middle tier between the bare function
|
|
4
|
+
* (`../client/console-session.ts`) and the drop-in `<OpenTelescopeConsoleButton>`.
|
|
5
|
+
*
|
|
6
|
+
* You get the state a launcher UI actually needs (in-flight, error) and keep full control of the
|
|
7
|
+
* markup. Nothing here is Telescope-specific beyond the endpoint: it is a mint-then-navigate call
|
|
8
|
+
* with the two states that call can be in.
|
|
9
|
+
*/
|
|
10
|
+
export interface UseOpenConsoleResult {
|
|
11
|
+
/** Start the mint-then-navigate. Never rejects — read `error` instead. */
|
|
12
|
+
open: () => void;
|
|
13
|
+
/** True from the click until the navigation starts, or until it fails. */
|
|
14
|
+
isPending: boolean;
|
|
15
|
+
/** The last refusal, or `null`. Cleared when `open()` is called again. */
|
|
16
|
+
error: ConsoleSessionError | null;
|
|
17
|
+
/** Drop a stale error without retrying — e.g. when a dialog closes. */
|
|
18
|
+
reset: () => void;
|
|
19
|
+
}
|
|
20
|
+
export declare function useOpenTelescopeConsole(options?: OpenConsoleOptions): UseOpenConsoleResult;
|
|
21
|
+
/**
|
|
22
|
+
* TanStack Query integration WITHOUT a TanStack dependency: the returned object is the shape
|
|
23
|
+
* `useMutation` takes, so a host that already uses Query wires the launcher into its own cache,
|
|
24
|
+
* devtools and error handling with no extra adapter — and a host that doesn't never pays for it.
|
|
25
|
+
*
|
|
26
|
+
* ```ts
|
|
27
|
+
* const { mutate, isPending } = useMutation(openTelescopeConsoleMutationOptions({ headers }));
|
|
28
|
+
* ```
|
|
29
|
+
*/
|
|
30
|
+
export declare function openTelescopeConsoleMutationOptions(options?: OpenConsoleOptions): {
|
|
31
|
+
mutationKey: readonly unknown[];
|
|
32
|
+
mutationFn: () => Promise<void>;
|
|
33
|
+
};
|
|
34
|
+
//# sourceMappingURL=use-open-console.d.ts.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"use-open-console.d.ts","sourceRoot":"","sources":["../../src/react/use-open-console.ts"],"names":[],"mappings":"AACA,OAAO,EACL,mBAAmB,EACnB,KAAK,kBAAkB,EAGxB,MAAM,8BAA8B,CAAC;AAEtC;;;;;;;GAOG;AACH,MAAM,WAAW,oBAAoB;IACnC,0EAA0E;IAC1E,IAAI,EAAE,MAAM,IAAI,CAAC;IACjB,0EAA0E;IAC1E,SAAS,EAAE,OAAO,CAAC;IACnB,0EAA0E;IAC1E,KAAK,EAAE,mBAAmB,GAAG,IAAI,CAAC;IAClC,uEAAuE;IACvE,KAAK,EAAE,MAAM,IAAI,CAAC;CACnB;AAED,wBAAgB,uBAAuB,CAAC,OAAO,GAAE,kBAAuB,GAAG,oBAAoB,CAoC9F;AAED;;;;;;;;GAQG;AACH,wBAAgB,mCAAmC,CAAC,OAAO,GAAE,kBAAuB,GAAG;IACrF,WAAW,EAAE,SAAS,OAAO,EAAE,CAAC;IAChC,UAAU,EAAE,MAAM,OAAO,CAAC,IAAI,CAAC,CAAC;CACjC,CAKA"}
|
|
@@ -0,0 +1,46 @@
|
|
|
1
|
+
import { useCallback, useRef, useState } from 'react';
|
|
2
|
+
import { ConsoleSessionError, openTelescopeConsole, telescopeConsoleSessionUrl, } from '../client/console-session.js';
|
|
3
|
+
export function useOpenTelescopeConsole(options = {}) {
|
|
4
|
+
const [isPending, setIsPending] = useState(false);
|
|
5
|
+
const [error, setError] = useState(null);
|
|
6
|
+
// Kept in a ref so a caller passing an inline object literal (the common case) doesn't change the
|
|
7
|
+
// identity of `open` on every render, which would defeat memoizing anything downstream.
|
|
8
|
+
const optionsRef = useRef(options);
|
|
9
|
+
optionsRef.current = options;
|
|
10
|
+
const open = useCallback(() => {
|
|
11
|
+
setIsPending(true);
|
|
12
|
+
setError(null);
|
|
13
|
+
void openTelescopeConsole(optionsRef.current)
|
|
14
|
+
.then(() => {
|
|
15
|
+
// Deliberately NOT clearing `isPending` on success: the navigation is already underway and
|
|
16
|
+
// this component is about to be torn down. Flipping the button back to idle first produces
|
|
17
|
+
// a visible flicker of "ready to click again" on a page that is leaving.
|
|
18
|
+
})
|
|
19
|
+
.catch((cause) => {
|
|
20
|
+
setError(cause instanceof ConsoleSessionError
|
|
21
|
+
? cause
|
|
22
|
+
: // A non-`ConsoleSessionError` can only come from the caller's own `navigate`, so name
|
|
23
|
+
// the endpoint this hook was pointed at rather than leaving `url` empty.
|
|
24
|
+
new ConsoleSessionError(String(cause), telescopeConsoleSessionUrl(optionsRef.current.basePath)));
|
|
25
|
+
setIsPending(false);
|
|
26
|
+
});
|
|
27
|
+
}, []);
|
|
28
|
+
const reset = useCallback(() => setError(null), []);
|
|
29
|
+
return { open, isPending, error, reset };
|
|
30
|
+
}
|
|
31
|
+
/**
|
|
32
|
+
* TanStack Query integration WITHOUT a TanStack dependency: the returned object is the shape
|
|
33
|
+
* `useMutation` takes, so a host that already uses Query wires the launcher into its own cache,
|
|
34
|
+
* devtools and error handling with no extra adapter — and a host that doesn't never pays for it.
|
|
35
|
+
*
|
|
36
|
+
* ```ts
|
|
37
|
+
* const { mutate, isPending } = useMutation(openTelescopeConsoleMutationOptions({ headers }));
|
|
38
|
+
* ```
|
|
39
|
+
*/
|
|
40
|
+
export function openTelescopeConsoleMutationOptions(options = {}) {
|
|
41
|
+
return {
|
|
42
|
+
mutationKey: ['telescope', 'console', 'open', options.basePath ?? null],
|
|
43
|
+
mutationFn: () => openTelescopeConsole(options),
|
|
44
|
+
};
|
|
45
|
+
}
|
|
46
|
+
//# sourceMappingURL=use-open-console.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"use-open-console.js","sourceRoot":"","sources":["../../src/react/use-open-console.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,WAAW,EAAE,MAAM,EAAE,QAAQ,EAAE,MAAM,OAAO,CAAC;AACtD,OAAO,EACL,mBAAmB,EAEnB,oBAAoB,EACpB,0BAA0B,GAC3B,MAAM,8BAA8B,CAAC;AAqBtC,MAAM,UAAU,uBAAuB,CAAC,UAA8B,EAAE;IACtE,MAAM,CAAC,SAAS,EAAE,YAAY,CAAC,GAAG,QAAQ,CAAC,KAAK,CAAC,CAAC;IAClD,MAAM,CAAC,KAAK,EAAE,QAAQ,CAAC,GAAG,QAAQ,CAA6B,IAAI,CAAC,CAAC;IAErE,kGAAkG;IAClG,wFAAwF;IACxF,MAAM,UAAU,GAAG,MAAM,CAAC,OAAO,CAAC,CAAC;IACnC,UAAU,CAAC,OAAO,GAAG,OAAO,CAAC;IAE7B,MAAM,IAAI,GAAG,WAAW,CAAC,GAAG,EAAE;QAC5B,YAAY,CAAC,IAAI,CAAC,CAAC;QACnB,QAAQ,CAAC,IAAI,CAAC,CAAC;QACf,KAAK,oBAAoB,CAAC,UAAU,CAAC,OAAO,CAAC;aAC1C,IAAI,CAAC,GAAG,EAAE;YACT,2FAA2F;YAC3F,2FAA2F;YAC3F,yEAAyE;QAC3E,CAAC,CAAC;aACD,KAAK,CAAC,CAAC,KAAc,EAAE,EAAE;YACxB,QAAQ,CACN,KAAK,YAAY,mBAAmB;gBAClC,CAAC,CAAC,KAAK;gBACP,CAAC,CAAC,sFAAsF;oBACtF,yEAAyE;oBACzE,IAAI,mBAAmB,CACrB,MAAM,CAAC,KAAK,CAAC,EACb,0BAA0B,CAAC,UAAU,CAAC,OAAO,CAAC,QAAQ,CAAC,CACxD,CACN,CAAC;YACF,YAAY,CAAC,KAAK,CAAC,CAAC;QACtB,CAAC,CAAC,CAAC;IACP,CAAC,EAAE,EAAE,CAAC,CAAC;IAEP,MAAM,KAAK,GAAG,WAAW,CAAC,GAAG,EAAE,CAAC,QAAQ,CAAC,IAAI,CAAC,EAAE,EAAE,CAAC,CAAC;IAEpD,OAAO,EAAE,IAAI,EAAE,SAAS,EAAE,KAAK,EAAE,KAAK,EAAE,CAAC;AAC3C,CAAC;AAED;;;;;;;;GAQG;AACH,MAAM,UAAU,mCAAmC,CAAC,UAA8B,EAAE;IAIlF,OAAO;QACL,WAAW,EAAE,CAAC,WAAW,EAAE,SAAS,EAAE,MAAM,EAAE,OAAO,CAAC,QAAQ,IAAI,IAAI,CAAU;QAChF,UAAU,EAAE,GAAG,EAAE,CAAC,oBAAoB,CAAC,OAAO,CAAC;KAChD,CAAC;AACJ,CAAC"}
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@dudousxd/nestjs-telescope-ui",
|
|
3
|
-
"version": "1.
|
|
3
|
+
"version": "1.19.0",
|
|
4
4
|
"description": "Bundled dashboard + composable React components for @dudousxd/nestjs-telescope.",
|
|
5
5
|
"license": "MIT",
|
|
6
6
|
"repository": {
|
|
@@ -42,6 +42,9 @@
|
|
|
42
42
|
"peerDependencies": {
|
|
43
43
|
"@nestjs/common": ">=11.0.0",
|
|
44
44
|
"@nestjs/core": ">=11.0.0",
|
|
45
|
+
"react": ">=18.0.0",
|
|
46
|
+
"react-dom": ">=18.0.0",
|
|
47
|
+
"@tanstack/react-query": ">=5.0.0",
|
|
45
48
|
"@dudousxd/nestjs-telescope": "^1.24.0"
|
|
46
49
|
},
|
|
47
50
|
"peerDependenciesMeta": {
|