Skip to content

Commit 685e24e

Browse files
tilyupotilyupo
committed
chore: refactor types
1 parent da6a0c9 commit 685e24e

30 files changed

Lines changed: 2005 additions & 477 deletions

‎packages/admin/src/version.ts‎

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -1,3 +1,3 @@
11
// Auto-generated - do not edit manually
2-
export const VERSION = "0.8.20";
2+
export const VERSION = "0.9.0";
33
export const DEFAULT_AGENT = `replane-js-admin/${VERSION}`;

‎packages/next/README.md‎

Lines changed: 24 additions & 14 deletions
Original file line numberDiff line numberDiff line change
@@ -34,7 +34,7 @@ export default async function RootLayout({ children }: { children: React.ReactNo
3434
<html lang="en">
3535
<body>
3636
<ReplaneRoot<AppConfigs>
37-
options={{
37+
connection={{
3838
baseUrl: process.env.NEXT_PUBLIC_REPLANE_BASE_URL!,
3939
sdkKey: process.env.NEXT_PUBLIC_REPLANE_SDK_KEY!,
4040
}}
@@ -84,7 +84,7 @@ export default function MyApp({ Component, pageProps, replaneSnapshot }: AppProp
8484
return (
8585
<ReplaneProvider
8686
snapshot={replaneSnapshot}
87-
options={{
87+
connection={{
8888
baseUrl: process.env.NEXT_PUBLIC_REPLANE_BASE_URL!,
8989
sdkKey: process.env.NEXT_PUBLIC_REPLANE_SDK_KEY!,
9090
}}
@@ -99,8 +99,10 @@ MyApp.getInitialProps = async (appContext: AppContext) => {
9999
const appProps = await App.getInitialProps(appContext);
100100

101101
const replaneSnapshot = await getReplaneSnapshot<AppConfigs>({
102-
baseUrl: process.env.REPLANE_BASE_URL!,
103-
sdkKey: process.env.REPLANE_SDK_KEY!,
102+
connection: {
103+
baseUrl: process.env.REPLANE_BASE_URL!,
104+
sdkKey: process.env.REPLANE_SDK_KEY!,
105+
},
104106
});
105107

106108
return { ...appProps, replaneSnapshot };
@@ -174,22 +176,29 @@ export function ConfigDisplay() {
174176
}
175177
```
176178

177-
## Client Options
179+
## Provider Props
180+
181+
| Prop | Type | Required | Description |
182+
| ------------ | ------------------------- | -------- | ------------------------------------------------------- |
183+
| `connection` | `ConnectOptions` | No | Connection options (see below) |
184+
| `defaults` | `Record<string, unknown>` | No | Default values if server is unavailable |
185+
| `context` | `Record<string, unknown>` | No | Default context for override evaluations |
186+
| `snapshot` | `ReplaneSnapshot` | No | Snapshot for SSR hydration |
187+
| `logger` | `ReplaneLogger` | No | Custom logger (default: console) |
178188

179-
The `options` prop accepts the following options:
189+
## Connection Options
190+
191+
The `connection` prop accepts the following options:
180192

181193
| Option | Type | Required | Description |
182194
| --------------------- | --------------------- | -------- | ---------------------------------------- |
183195
| `baseUrl` | `string` | Yes | Replane server URL |
184196
| `sdkKey` | `string` | Yes | SDK key for authentication |
185-
| `context` | `Record<string, any>` | No | Default context for override evaluations |
186-
| `defaults` | `Record<string, any>` | No | Default values if server is unavailable |
187197
| `connectTimeoutMs` | `number` | No | SDK connection timeout (default: 5000) |
188198
| `requestTimeoutMs` | `number` | No | Timeout for SSE requests (default: 2000) |
189199
| `retryDelayMs` | `number` | No | Base delay between retries (default: 200)|
190200
| `inactivityTimeoutMs` | `number` | No | SSE inactivity timeout (default: 30000) |
191201
| `fetchFn` | `typeof fetch` | No | Custom fetch implementation |
192-
| `logger` | `ReplaneLogger` | No | Custom logger (default: console) |
193202

194203
See [`@replanejs/sdk` documentation](https://github.com/replane-dev/replane-javascript/tree/main/packages/sdk#api) for more details.
195204

@@ -203,10 +212,9 @@ Server component for App Router that fetches configs and provides them to the ap
203212

204213
```tsx
205214
<ReplaneRoot<AppConfigs>
206-
options={{
215+
connection={{
207216
baseUrl: string;
208217
sdkKey: string;
209-
// ... other ReplaneClientOptions
210218
}}
211219
>
212220
{children}
@@ -220,7 +228,7 @@ Client-side provider for Pages Router or custom setups.
220228
```tsx
221229
<ReplaneProvider
222230
snapshot={replaneSnapshot}
223-
options={{
231+
connection={{
224232
baseUrl: string;
225233
sdkKey: string;
226234
}}
@@ -275,8 +283,10 @@ Fetches a snapshot of all configs. Use in `getServerSideProps`, `getStaticProps`
275283

276284
```tsx
277285
const snapshot = await getReplaneSnapshot<AppConfigs>({
278-
baseUrl: process.env.REPLANE_BASE_URL!,
279-
sdkKey: process.env.REPLANE_SDK_KEY!,
286+
connection: {
287+
baseUrl: process.env.REPLANE_BASE_URL!,
288+
sdkKey: process.env.REPLANE_SDK_KEY!,
289+
},
280290
// by default, getReplaneSnapshot will reuse the created client for 60 seconds for fast subsequent calls, the client will be syncing with the server in the background during this time
281291
keepAliveMs: 60_000,
282292
});

‎packages/next/examples/next-app-router/app/layout.tsx‎

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -7,7 +7,7 @@ export default async function RootLayout({ children }: { children: React.ReactNo
77
<body>
88
{/* ReplaneRoot fetches configs on the server and provides them to the client */}
99
<ReplaneRoot<AppConfigs>
10-
options={{
10+
connection={{
1111
baseUrl: process.env.NEXT_PUBLIC_REPLANE_BASE_URL!,
1212
sdkKey: process.env.NEXT_PUBLIC_REPLANE_SDK_KEY!,
1313
}}

‎packages/next/examples/next-pages-router/pages/_app.tsx‎

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -12,7 +12,7 @@ export default function MyApp({ Component, pageProps, replaneSnapshot }: AppProp
1212
return (
1313
<ReplaneProvider
1414
snapshot={replaneSnapshot}
15-
options={{
15+
connection={{
1616
baseUrl: process.env.NEXT_PUBLIC_REPLANE_BASE_URL!,
1717
sdkKey: process.env.NEXT_PUBLIC_REPLANE_SDK_KEY!,
1818
}}

‎packages/next/examples/next-pages-router/replane/server.ts‎

Lines changed: 4 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -21,7 +21,9 @@ export type { ReplaneSnapshot };
2121
*/
2222
export async function fetchReplaneSnapshot(): Promise<ReplaneSnapshot<AppConfigs>> {
2323
return getReplaneSnapshot<AppConfigs>({
24-
baseUrl: process.env.REPLANE_BASE_URL!,
25-
sdkKey: process.env.REPLANE_SDK_KEY!,
24+
connection: {
25+
baseUrl: process.env.REPLANE_BASE_URL!,
26+
sdkKey: process.env.REPLANE_SDK_KEY!,
27+
},
2628
});
2729
}

‎packages/next/src/index.tsx‎

Lines changed: 6 additions & 5 deletions
Original file line numberDiff line numberDiff line change
@@ -14,7 +14,7 @@
1414
* <html>
1515
* <body>
1616
* <ReplaneRoot
17-
* options={{
17+
* connection={{
1818
* baseUrl: process.env.NEXT_PUBLIC_REPLANE_BASE_URL!,
1919
* sdkKey: process.env.NEXT_PUBLIC_REPLANE_SDK_KEY!,
2020
* }}
@@ -45,7 +45,7 @@
4545
* return (
4646
* <ReplaneProvider
4747
* snapshot={pageProps.replaneSnapshot}
48-
* options={{
48+
* connection={{
4949
* baseUrl: process.env.NEXT_PUBLIC_REPLANE_BASE_URL!,
5050
* sdkKey: process.env.NEXT_PUBLIC_REPLANE_SDK_KEY!,
5151
* }}
@@ -60,8 +60,10 @@
6060
*
6161
* export async function getServerSideProps() {
6262
* const snapshot = await getReplaneSnapshot({
63-
* baseUrl: process.env.REPLANE_BASE_URL!,
64-
* sdkKey: process.env.REPLANE_SDK_KEY!,
63+
* connection: {
64+
* baseUrl: process.env.REPLANE_BASE_URL!,
65+
* sdkKey: process.env.REPLANE_SDK_KEY!,
66+
* },
6567
* });
6668
* return { props: { replaneSnapshot: snapshot } };
6769
* }
@@ -95,7 +97,6 @@ export type {
9597
ReplaneProviderProps,
9698
ReplaneProviderWithClientProps,
9799
ReplaneProviderWithOptionsProps,
98-
ReplaneProviderOptions,
99100
GetReplaneSnapshotOptions,
100101
ReplaneSnapshot,
101102
ReplaneContext,

‎packages/next/src/root.tsx‎

Lines changed: 17 additions & 16 deletions
Original file line numberDiff line numberDiff line change
@@ -4,19 +4,14 @@
44
*/
55

66
import type { ReactNode } from "react";
7-
import { getReplaneSnapshot } from "@replanejs/sdk";
8-
import { ReplaneProvider, type ReplaneProviderOptions } from "@replanejs/react";
7+
import { getReplaneSnapshot, type GetReplaneSnapshotOptions } from "@replanejs/sdk";
8+
import { ReplaneProvider } from "@replanejs/react";
99
import { DEFAULT_AGENT } from "./version";
1010

1111
/**
1212
* Props for ReplaneRoot server component
1313
*/
14-
export interface ReplaneRootProps<T extends object> {
15-
/**
16-
* Options for Replane client.
17-
* Used for both server-side fetching and client-side live updates.
18-
*/
19-
options: ReplaneProviderOptions<T>;
14+
export interface ReplaneRootProps<T extends object> extends GetReplaneSnapshotOptions<T> {
2015
/**
2116
* React children to render inside the provider
2217
*/
@@ -37,7 +32,7 @@ export interface ReplaneRootProps<T extends object> {
3732
* <html>
3833
* <body>
3934
* <ReplaneRoot
40-
* options={{
35+
* connection={{
4136
* baseUrl: process.env.NEXT_PUBLIC_REPLANE_BASE_URL!,
4237
* sdkKey: process.env.NEXT_PUBLIC_REPLANE_SDK_KEY!,
4338
* }}
@@ -50,15 +45,21 @@ export interface ReplaneRootProps<T extends object> {
5045
* }
5146
* ```
5247
*/
53-
export async function ReplaneRoot<T extends object>({ options, children }: ReplaneRootProps<T>) {
54-
const optionsWithAgent = {
55-
...options,
56-
agent: options.agent ?? DEFAULT_AGENT,
57-
};
58-
const snapshot = await getReplaneSnapshot(optionsWithAgent);
48+
export async function ReplaneRoot<T extends object>({ children, ...options }: ReplaneRootProps<T>) {
49+
const { connection: originalConnection, ...replaneOptions } = options;
50+
const connectionWithAgent = originalConnection
51+
? {
52+
...originalConnection,
53+
agent: originalConnection.agent ?? DEFAULT_AGENT,
54+
}
55+
: null;
56+
const snapshot = await getReplaneSnapshot({
57+
...replaneOptions,
58+
connection: connectionWithAgent,
59+
});
5960

6061
return (
61-
<ReplaneProvider options={optionsWithAgent} snapshot={snapshot}>
62+
<ReplaneProvider connection={connectionWithAgent} snapshot={snapshot} {...replaneOptions}>
6263
{children}
6364
</ReplaneProvider>
6465
);

‎packages/next/src/version.ts‎

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -1,3 +1,3 @@
11
// Auto-generated - do not edit manually
2-
export const VERSION = "0.8.20";
2+
export const VERSION = "0.9.0";
33
export const DEFAULT_AGENT = `replane-js-next/${VERSION}`;

‎packages/react/README.md‎

Lines changed: 41 additions & 14 deletions
Original file line numberDiff line numberDiff line change
@@ -29,7 +29,7 @@ import { ReplaneProvider, useConfig } from "@replanejs/react";
2929
function App() {
3030
return (
3131
<ReplaneProvider
32-
options={{
32+
connection={{
3333
baseUrl: "https://your-replane-server.com",
3434
sdkKey: "your-sdk-key",
3535
}}
@@ -51,9 +51,9 @@ function MyComponent() {
5151

5252
### ReplaneProvider
5353

54-
Provider component that makes the Replane client available to your component tree. Supports four usage patterns:
54+
Provider component that makes the Replane client available to your component tree. Supports multiple usage patterns:
5555

56-
#### 1. With options (recommended)
56+
#### 1. With connection (recommended)
5757

5858
The provider creates and manages the client internally. Use an Error Boundary to handle initialization errors:
5959

@@ -62,7 +62,7 @@ import { ErrorBoundary } from "react-error-boundary";
6262

6363
<ErrorBoundary fallback={<div>Failed to load configuration</div>}>
6464
<ReplaneProvider
65-
options={{
65+
connection={{
6666
baseUrl: "https://your-replane-server.com",
6767
sdkKey: "your-sdk-key",
6868
}}
@@ -73,22 +73,32 @@ import { ErrorBoundary } from "react-error-boundary";
7373
</ErrorBoundary>;
7474
```
7575

76-
#### Client Options
76+
#### Provider Props
7777

78-
The `options` prop accepts the following options:
78+
| Prop | Type | Required | Description |
79+
| ------------ | --------------------------- | -------- | ------------------------------------------------------- |
80+
| `connection` | `ConnectOptions \| null` | Yes | Connection options (see below), or `null` to skip connection |
81+
| `defaults` | `Record<string, unknown>` | No | Default values if server is unavailable |
82+
| `context` | `Record<string, unknown>` | No | Default context for override evaluations |
83+
| `snapshot` | `ReplaneSnapshot` | No | Snapshot for SSR hydration |
84+
| `logger` | `ReplaneLogger` | No | Custom logger (default: console) |
85+
| `loader` | `ReactNode` | No | Component to show while loading |
86+
| `suspense` | `boolean` | No | Use React Suspense for loading state |
87+
| `async` | `boolean` | No | Connect asynchronously (renders immediately with defaults) |
88+
89+
#### Connection Options
90+
91+
The `connection` prop accepts the following options:
7992

8093
| Option | Type | Required | Description |
8194
| -------------------- | --------------------- | -------- | -------------------------------------------- |
8295
| `baseUrl` | `string` | Yes | Replane server URL |
8396
| `sdkKey` | `string` | Yes | SDK key for authentication |
84-
| `context` | `Record<string, any>` | No | Default context for override evaluations |
85-
| `defaults` | `Record<string, any>` | No | Default values if server is unavailable |
8697
| `connectTimeoutMs` | `number` | No | SDK connection timeout (default: 5000) |
8798
| `requestTimeoutMs` | `number` | No | Timeout for SSE requests (default: 2000) |
8899
| `retryDelayMs` | `number` | No | Base delay between retries (default: 200) |
89100
| `inactivityTimeoutMs`| `number` | No | SSE inactivity timeout (default: 30000) |
90101
| `fetchFn` | `typeof fetch` | No | Custom fetch implementation |
91-
| `logger` | `ReplaneLogger` | No | Custom logger (default: console) |
92102

93103
See [`@replanejs/sdk` documentation](https://github.com/replane-dev/replane-javascript/tree/main/packages/sdk#api) for more details.
94104

@@ -118,7 +128,7 @@ Integrates with React Suspense for loading states:
118128
<ErrorBoundary fallback={<div>Failed to load configuration</div>}>
119129
<Suspense fallback={<LoadingSpinner />}>
120130
<ReplaneProvider
121-
options={{
131+
connection={{
122132
baseUrl: "https://your-replane-server.com",
123133
sdkKey: "your-sdk-key",
124134
}}
@@ -130,7 +140,24 @@ Integrates with React Suspense for loading states:
130140
</ErrorBoundary>
131141
```
132142

133-
#### 4. With snapshot (for SSR/hydration)
143+
#### 4. With async mode
144+
145+
Connect in the background while rendering immediately with defaults:
146+
147+
```tsx
148+
<ReplaneProvider
149+
connection={{
150+
baseUrl: "https://your-replane-server.com",
151+
sdkKey: "your-sdk-key",
152+
}}
153+
defaults={{ featureEnabled: false }}
154+
async
155+
>
156+
<App />
157+
</ReplaneProvider>
158+
```
159+
160+
#### 5. With snapshot (for SSR/hydration)
134161

135162
Restore a client from a snapshot obtained on the server. This is synchronous and useful for SSR scenarios:
136163

@@ -143,7 +170,7 @@ const snapshot = serverClient.getSnapshot();
143170

144171
// On the client
145172
<ReplaneProvider
146-
options={{
173+
connection={{
147174
baseUrl: "https://your-replane-server.com",
148175
sdkKey: "your-sdk-key",
149176
}}
@@ -353,7 +380,7 @@ class ErrorBoundary extends Component<
353380

354381
// Usage
355382
<ErrorBoundary fallback={<div>Configuration failed to load</div>}>
356-
<ReplaneProvider options={options} loader={<Loading />}>
383+
<ReplaneProvider connection={connection} loader={<Loading />}>
357384
<App />
358385
</ReplaneProvider>
359386
</ErrorBoundary>;
@@ -373,7 +400,7 @@ import { ErrorBoundary } from "react-error-boundary";
373400
)}
374401
onReset={() => clearSuspenseCache()}
375402
>
376-
<ReplaneProvider options={options} loader={<Loading />}>
403+
<ReplaneProvider connection={connection} loader={<Loading />}>
377404
<App />
378405
</ReplaneProvider>
379406
</ErrorBoundary>;

‎packages/react/examples/basic/src/main.tsx‎

Lines changed: 9 additions & 9 deletions
Original file line numberDiff line numberDiff line change
@@ -13,18 +13,18 @@ createRoot(document.getElementById("root")!).render(
1313
<StrictMode>
1414
<Suspense fallback={<LoadingScreen />}>
1515
<ReplaneProvider<AppConfigs>
16-
options={{
16+
connection={{
1717
sdkKey,
1818
baseUrl,
19-
defaults: {
20-
"theme-config": { primaryColor: "#3b82f6", darkMode: false },
21-
"feature-flags": {
22-
newHeader: true,
23-
showBanner: true,
24-
experimentalFeatures: false,
25-
},
26-
"banner-message": "Welcome to the Replane React Example!",
19+
}}
20+
defaults={{
21+
"theme-config": { primaryColor: "#3b82f6", darkMode: false },
22+
"feature-flags": {
23+
newHeader: true,
24+
showBanner: true,
25+
experimentalFeatures: false,
2726
},
27+
"banner-message": "Welcome to the Replane React Example!",
2828
}}
2929
suspense
3030
>

0 commit comments

Comments
 (0)