@yorkie-js/react 0.6.2 → 0.6.5
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.
|
@@ -1,8 +1,10 @@
|
|
|
1
|
+
import { default as default_2 } from 'react';
|
|
1
2
|
import { Indexable } from '@yorkie-js/sdk';
|
|
2
3
|
import { JSONArray } from '@yorkie-js/sdk';
|
|
3
4
|
import { JSONObject } from '@yorkie-js/sdk';
|
|
4
5
|
import { JSX } from 'react/jsx-dev-runtime';
|
|
5
6
|
import { PropsWithChildren } from 'react';
|
|
7
|
+
import { StreamConnectionStatus } from '@yorkie-js/sdk';
|
|
6
8
|
|
|
7
9
|
/**
|
|
8
10
|
* `DocumentProvider` is a component that provides a document to its children.
|
|
@@ -13,13 +15,18 @@ export declare const DocumentProvider: <R, P extends Indexable = Indexable>({ do
|
|
|
13
15
|
docKey: string;
|
|
14
16
|
initialRoot?: R | undefined;
|
|
15
17
|
initialPresence?: P | undefined;
|
|
16
|
-
children?:
|
|
18
|
+
children?: default_2.ReactNode;
|
|
17
19
|
}) => JSX.Element;
|
|
18
20
|
|
|
19
21
|
export { JSONArray }
|
|
20
22
|
|
|
21
23
|
export { JSONObject }
|
|
22
24
|
|
|
25
|
+
/**
|
|
26
|
+
* `useConnection` is a custom hook that returns the connection status of the document.
|
|
27
|
+
*/
|
|
28
|
+
export declare const useConnection: () => StreamConnectionStatus;
|
|
29
|
+
|
|
23
30
|
/**
|
|
24
31
|
* `useDocument` is a custom hook that returns the root object and update function of the document.
|
|
25
32
|
* This hook must be used within a `DocumentProvider`.
|
|
@@ -30,6 +37,7 @@ export declare const useDocument: <R, P extends Indexable = Indexable>() => {
|
|
|
30
37
|
clientID: string;
|
|
31
38
|
presence: P;
|
|
32
39
|
}[];
|
|
40
|
+
connection: StreamConnectionStatus;
|
|
33
41
|
update: (callback: (root: R, presence: P) => void) => void;
|
|
34
42
|
loading: boolean;
|
|
35
43
|
error: Error | undefined;
|
|
@@ -2,7 +2,7 @@ var __defProp = Object.defineProperty;
|
|
|
2
2
|
var __defNormalProp = (obj, key, value) => key in obj ? __defProp(obj, key, { enumerable: true, configurable: true, writable: true, value }) : obj[key] = value;
|
|
3
3
|
var __publicField = (obj, key, value) => __defNormalProp(obj, typeof key !== "symbol" ? key + "" : key, value);
|
|
4
4
|
var _a, _b, _c, _d, _e, _f, _g, _h, _i;
|
|
5
|
-
import { useState, useEffect, useCallback, createContext, useContext } from "react";
|
|
5
|
+
import { useState, useEffect, useCallback, createContext, useRef, useContext } from "react";
|
|
6
6
|
import { jsx } from "react/jsx-runtime";
|
|
7
7
|
var Code$1;
|
|
8
8
|
(function(Code2) {
|
|
@@ -7557,6 +7557,7 @@ var Code = /* @__PURE__ */ ((Code2) => {
|
|
|
7557
7557
|
Code2["ErrPermissionDenied"] = "ErrPermissionDenied";
|
|
7558
7558
|
Code2["ErrUnauthenticated"] = "ErrUnauthenticated";
|
|
7559
7559
|
Code2["ErrTooManySubscribers"] = "ErrTooManySubscribers";
|
|
7560
|
+
Code2["ErrTooManyAttachments"] = "ErrTooManyAttachments";
|
|
7560
7561
|
return Code2;
|
|
7561
7562
|
})(Code || {});
|
|
7562
7563
|
class YorkieError extends Error {
|
|
@@ -20174,7 +20175,7 @@ function createAuthInterceptor(apiKey, token) {
|
|
|
20174
20175
|
};
|
|
20175
20176
|
}
|
|
20176
20177
|
const name = "@yorkie-js/sdk";
|
|
20177
|
-
const version = "0.6.
|
|
20178
|
+
const version = "0.6.5";
|
|
20178
20179
|
const pkg = {
|
|
20179
20180
|
name,
|
|
20180
20181
|
version
|
|
@@ -20963,6 +20964,9 @@ class Client {
|
|
|
20963
20964
|
logger.error(`[WD] c:"${this.getKey()}" err :`, err.rawMessage);
|
|
20964
20965
|
return true;
|
|
20965
20966
|
}
|
|
20967
|
+
if (errorCodeOf(err) === Code.ErrTooManyAttachments) {
|
|
20968
|
+
return false;
|
|
20969
|
+
}
|
|
20966
20970
|
if (errorCodeOf(err) === Code.ErrClientNotActivated || errorCodeOf(err) === Code.ErrClientNotFound) {
|
|
20967
20971
|
this.deactivateInternal();
|
|
20968
20972
|
}
|
|
@@ -21084,15 +21088,23 @@ const YorkieProvider = ({ apiKey, rpcAddr = "https://api.yorkie.dev", children }
|
|
|
21084
21088
|
const [client, setClient] = useState(void 0);
|
|
21085
21089
|
const [loading, setLoading] = useState(true);
|
|
21086
21090
|
const [error, setError] = useState(void 0);
|
|
21091
|
+
const clientRef = useRef(void 0);
|
|
21087
21092
|
useEffect(() => {
|
|
21088
21093
|
setLoading(true);
|
|
21089
21094
|
setError(void 0);
|
|
21090
21095
|
async function activateClient() {
|
|
21096
|
+
var _a2;
|
|
21091
21097
|
try {
|
|
21098
|
+
if ((_a2 = clientRef.current) == null ? void 0 : _a2.isActive()) {
|
|
21099
|
+
setClient(clientRef.current);
|
|
21100
|
+
setLoading(false);
|
|
21101
|
+
return;
|
|
21102
|
+
}
|
|
21092
21103
|
const newClient = new Client(rpcAddr, {
|
|
21093
21104
|
apiKey
|
|
21094
21105
|
});
|
|
21095
21106
|
await newClient.activate();
|
|
21107
|
+
clientRef.current = newClient;
|
|
21096
21108
|
setClient(newClient);
|
|
21097
21109
|
} catch (e) {
|
|
21098
21110
|
setError(
|
|
@@ -21104,8 +21116,10 @@ const YorkieProvider = ({ apiKey, rpcAddr = "https://api.yorkie.dev", children }
|
|
|
21104
21116
|
}
|
|
21105
21117
|
activateClient();
|
|
21106
21118
|
return () => {
|
|
21107
|
-
|
|
21108
|
-
|
|
21119
|
+
var _a2;
|
|
21120
|
+
if ((_a2 = clientRef.current) == null ? void 0 : _a2.isActive()) {
|
|
21121
|
+
clientRef.current.deactivate({ keepalive: true });
|
|
21122
|
+
clientRef.current = void 0;
|
|
21109
21123
|
}
|
|
21110
21124
|
};
|
|
21111
21125
|
}, [apiKey, rpcAddr]);
|
|
@@ -21135,6 +21149,9 @@ const DocumentProvider = ({
|
|
|
21135
21149
|
const [error, setError] = useState(void 0);
|
|
21136
21150
|
const [root, setRoot] = useState(initialRoot);
|
|
21137
21151
|
const [presences, setPresences] = useState([]);
|
|
21152
|
+
const [connection, setConnection] = useState(
|
|
21153
|
+
StreamConnectionStatus.Disconnected
|
|
21154
|
+
);
|
|
21138
21155
|
useEffect(() => {
|
|
21139
21156
|
if (clientError) {
|
|
21140
21157
|
setLoading(false);
|
|
@@ -21148,20 +21165,31 @@ const DocumentProvider = ({
|
|
|
21148
21165
|
setLoading(true);
|
|
21149
21166
|
setError(void 0);
|
|
21150
21167
|
const newDoc = new Document(docKey);
|
|
21168
|
+
const unsubs = [];
|
|
21169
|
+
unsubs.push(
|
|
21170
|
+
newDoc.subscribe(() => {
|
|
21171
|
+
setRoot(newDoc.getRoot());
|
|
21172
|
+
})
|
|
21173
|
+
);
|
|
21174
|
+
unsubs.push(
|
|
21175
|
+
newDoc.subscribe("presence", () => {
|
|
21176
|
+
setPresences(newDoc.getPresences());
|
|
21177
|
+
})
|
|
21178
|
+
);
|
|
21179
|
+
unsubs.push(
|
|
21180
|
+
newDoc.subscribe("connection", (event) => {
|
|
21181
|
+
setConnection(event.value);
|
|
21182
|
+
})
|
|
21183
|
+
);
|
|
21151
21184
|
async function attachDocument() {
|
|
21152
21185
|
try {
|
|
21153
21186
|
await (client == null ? void 0 : client.attach(newDoc, {
|
|
21154
21187
|
initialRoot,
|
|
21155
21188
|
initialPresence
|
|
21156
21189
|
}));
|
|
21157
|
-
newDoc.subscribe(() => {
|
|
21158
|
-
setRoot(newDoc.getRoot());
|
|
21159
|
-
});
|
|
21160
|
-
newDoc.subscribe("presence", () => {
|
|
21161
|
-
setPresences(newDoc.getPresences());
|
|
21162
|
-
});
|
|
21163
21190
|
setDoc(newDoc);
|
|
21164
21191
|
setRoot(newDoc.getRoot());
|
|
21192
|
+
setPresences(newDoc.getPresences());
|
|
21165
21193
|
} catch (err) {
|
|
21166
21194
|
setError(
|
|
21167
21195
|
err instanceof Error ? err : new Error("Failed to attach document")
|
|
@@ -21175,6 +21203,9 @@ const DocumentProvider = ({
|
|
|
21175
21203
|
if (client && client.hasDocument(docKey)) {
|
|
21176
21204
|
client.detach(newDoc);
|
|
21177
21205
|
}
|
|
21206
|
+
for (const unsub of unsubs) {
|
|
21207
|
+
unsub();
|
|
21208
|
+
}
|
|
21178
21209
|
};
|
|
21179
21210
|
}, [client, clientLoading, clientError, docKey]);
|
|
21180
21211
|
const update = useCallback(
|
|
@@ -21195,7 +21226,7 @@ const DocumentProvider = ({
|
|
|
21195
21226
|
return /* @__PURE__ */ jsx(
|
|
21196
21227
|
DocumentContext.Provider,
|
|
21197
21228
|
{
|
|
21198
|
-
value: { root, presences, update, loading, error },
|
|
21229
|
+
value: { root, presences, connection, update, loading, error },
|
|
21199
21230
|
children
|
|
21200
21231
|
}
|
|
21201
21232
|
);
|
|
@@ -21208,6 +21239,7 @@ const useDocument = () => {
|
|
|
21208
21239
|
return {
|
|
21209
21240
|
root: context.root,
|
|
21210
21241
|
presences: context.presences,
|
|
21242
|
+
connection: context.connection,
|
|
21211
21243
|
update: context.update,
|
|
21212
21244
|
loading: context.loading,
|
|
21213
21245
|
error: context.error
|
|
@@ -21227,9 +21259,17 @@ const usePresences = () => {
|
|
|
21227
21259
|
}
|
|
21228
21260
|
return context.presences;
|
|
21229
21261
|
};
|
|
21262
|
+
const useConnection = () => {
|
|
21263
|
+
const context = useContext(DocumentContext);
|
|
21264
|
+
if (!context) {
|
|
21265
|
+
throw new Error("useConnection must be used within a DocumentProvider");
|
|
21266
|
+
}
|
|
21267
|
+
return context.connection;
|
|
21268
|
+
};
|
|
21230
21269
|
export {
|
|
21231
21270
|
DocumentProvider,
|
|
21232
21271
|
YorkieProvider,
|
|
21272
|
+
useConnection,
|
|
21233
21273
|
useDocument,
|
|
21234
21274
|
usePresences,
|
|
21235
21275
|
useRoot,
|