@automerge/automerge-repo-react-hooks 1.0.3 → 1.0.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.
- package/dist/useBootstrap.d.ts +8 -8
- package/dist/useBootstrap.d.ts.map +1 -1
- package/dist/useBootstrap.js +19 -22
- package/package.json +8 -9
- package/src/useBootstrap.ts +23 -30
package/dist/useBootstrap.d.ts
CHANGED
|
@@ -6,25 +6,25 @@ export interface UseBootstrapOptions<T> {
|
|
|
6
6
|
key?: string;
|
|
7
7
|
/** Function returning a document handle called if lookup fails. Defaults to repo.create() */
|
|
8
8
|
onNoDocument?: (repo: Repo) => DocHandle<T>;
|
|
9
|
-
/** Function to call if
|
|
10
|
-
|
|
9
|
+
/** Function to call if automerge URL is invalid */
|
|
10
|
+
onInvalidAutomergeUrl?(repo: Repo, error: Error): DocHandle<T>;
|
|
11
11
|
}
|
|
12
12
|
/**
|
|
13
13
|
* This hook is used to set up a single document as the base of an app session.
|
|
14
14
|
* This is a common pattern for simple multiplayer apps with shareable URLs.
|
|
15
15
|
*
|
|
16
|
-
* It will first check for the
|
|
17
|
-
* //myapp/#
|
|
18
|
-
* Failing that, it will check for a `
|
|
16
|
+
* It will first check for the automergeUrl in the URL hash:
|
|
17
|
+
* //myapp/#automergeUrl=[document URL]
|
|
18
|
+
* Failing that, it will check for a `automergeUrl` key in localStorage.
|
|
19
19
|
* Failing that, it will call onNoDocument, expecting a handle to be returned.
|
|
20
20
|
*
|
|
21
21
|
* The URL and localStorage will then be updated.
|
|
22
|
-
* Finally, it will return the document
|
|
22
|
+
* Finally, it will return the Automerge document's URL.
|
|
23
23
|
*
|
|
24
24
|
* @param {string?} props.key Key to use for the URL hash and localStorage
|
|
25
25
|
* @param {function?} props.fallback Function returning a document handle called if lookup fails. Defaults to repo.create()
|
|
26
|
-
* @param {function?} props.
|
|
26
|
+
* @param {function?} props.onInvalidAutomergeUrl Function to call if URL is invalid; signature (error) => (repo, onCreate)
|
|
27
27
|
* @returns {DocHandle} The document handle
|
|
28
28
|
*/
|
|
29
|
-
export declare const useBootstrap: <T>({ key, onNoDocument,
|
|
29
|
+
export declare const useBootstrap: <T>({ key, onNoDocument, onInvalidAutomergeUrl, }?: UseBootstrapOptions<T>) => DocHandle<T>;
|
|
30
30
|
//# sourceMappingURL=useBootstrap.d.ts.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"useBootstrap.d.ts","sourceRoot":"","sources":["../src/useBootstrap.ts"],"names":[],"mappings":"AAAA,OAAO,
|
|
1
|
+
{"version":3,"file":"useBootstrap.d.ts","sourceRoot":"","sources":["../src/useBootstrap.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,SAAS,EAAE,IAAI,EAAqB,MAAM,2BAA2B,CAAA;AAK9E,eAAO,MAAM,OAAO,SAAU,MAAM,8BAUnC,CAAA;AAGD,eAAO,MAAM,OAAO,cAQnB,CAAA;AAwBD,MAAM,WAAW,mBAAmB,CAAC,CAAC;IACpC,mDAAmD;IACnD,GAAG,CAAC,EAAE,MAAM,CAAA;IACZ,6FAA6F;IAC7F,YAAY,CAAC,EAAE,CAAC,IAAI,EAAE,IAAI,KAAK,SAAS,CAAC,CAAC,CAAC,CAAA;IAC3C,mDAAmD;IACnD,qBAAqB,CAAC,CAAC,IAAI,EAAE,IAAI,EAAE,KAAK,EAAE,KAAK,GAAG,SAAS,CAAC,CAAC,CAAC,CAAA;CAC/D;AAED;;;;;;;;;;;;;;;;GAgBG;AACH,eAAO,MAAM,YAAY,6FA8BxB,CAAA"}
|
package/dist/useBootstrap.js
CHANGED
|
@@ -1,4 +1,3 @@
|
|
|
1
|
-
import { generateAutomergeUrl, } from "@automerge/automerge-repo";
|
|
2
1
|
import { useEffect, useState, useMemo } from "react";
|
|
3
2
|
import { useRepo } from "./useRepo.js";
|
|
4
3
|
// Set URL hash
|
|
@@ -28,56 +27,54 @@ const setQueryParamValue = (key, value, hash) => {
|
|
|
28
27
|
u.set(key, value);
|
|
29
28
|
return u.toString();
|
|
30
29
|
};
|
|
31
|
-
const
|
|
32
|
-
const
|
|
30
|
+
const getAutomergeUrl = (key, hash) => key && (getQueryParamValue(key, hash) || localStorage.getItem(key));
|
|
31
|
+
const setAutomergeUrl = (key, automergeUrl) => {
|
|
33
32
|
if (key) {
|
|
34
|
-
// Only set URL hash if
|
|
35
|
-
if (
|
|
36
|
-
setHash(setQueryParamValue(key,
|
|
33
|
+
// Only set URL hash if automerge URL changed
|
|
34
|
+
if (automergeUrl !== getQueryParamValue(key, window.location.hash))
|
|
35
|
+
setHash(setQueryParamValue(key, automergeUrl, window.location.hash));
|
|
37
36
|
}
|
|
38
37
|
if (key)
|
|
39
|
-
localStorage.setItem(key,
|
|
38
|
+
localStorage.setItem(key, automergeUrl);
|
|
40
39
|
};
|
|
41
40
|
/**
|
|
42
41
|
* This hook is used to set up a single document as the base of an app session.
|
|
43
42
|
* This is a common pattern for simple multiplayer apps with shareable URLs.
|
|
44
43
|
*
|
|
45
|
-
* It will first check for the
|
|
46
|
-
* //myapp/#
|
|
47
|
-
* Failing that, it will check for a `
|
|
44
|
+
* It will first check for the automergeUrl in the URL hash:
|
|
45
|
+
* //myapp/#automergeUrl=[document URL]
|
|
46
|
+
* Failing that, it will check for a `automergeUrl` key in localStorage.
|
|
48
47
|
* Failing that, it will call onNoDocument, expecting a handle to be returned.
|
|
49
48
|
*
|
|
50
49
|
* The URL and localStorage will then be updated.
|
|
51
|
-
* Finally, it will return the document
|
|
50
|
+
* Finally, it will return the Automerge document's URL.
|
|
52
51
|
*
|
|
53
52
|
* @param {string?} props.key Key to use for the URL hash and localStorage
|
|
54
53
|
* @param {function?} props.fallback Function returning a document handle called if lookup fails. Defaults to repo.create()
|
|
55
|
-
* @param {function?} props.
|
|
54
|
+
* @param {function?} props.onInvalidAutomergeUrl Function to call if URL is invalid; signature (error) => (repo, onCreate)
|
|
56
55
|
* @returns {DocHandle} The document handle
|
|
57
56
|
*/
|
|
58
|
-
export const useBootstrap = ({ key = "
|
|
57
|
+
export const useBootstrap = ({ key = "automergeUrl", onNoDocument = repo => repo.create(), onInvalidAutomergeUrl, } = {}) => {
|
|
59
58
|
const repo = useRepo();
|
|
60
59
|
const hash = useHash();
|
|
61
60
|
// Try to get existing document; else create a new one
|
|
62
61
|
const handle = useMemo(() => {
|
|
63
|
-
const
|
|
62
|
+
const url = getAutomergeUrl(key, hash);
|
|
64
63
|
try {
|
|
65
|
-
return
|
|
66
|
-
? repo.find(generateAutomergeUrl({ documentId }))
|
|
67
|
-
: onNoDocument(repo);
|
|
64
|
+
return url ? repo.find(url) : onNoDocument(repo);
|
|
68
65
|
}
|
|
69
66
|
catch (error) {
|
|
70
|
-
// Presumably the
|
|
71
|
-
if (
|
|
72
|
-
return
|
|
67
|
+
// Presumably the URL was invalid
|
|
68
|
+
if (url && onInvalidAutomergeUrl)
|
|
69
|
+
return onInvalidAutomergeUrl(repo, error);
|
|
73
70
|
// Forward other errors
|
|
74
71
|
throw error;
|
|
75
72
|
}
|
|
76
|
-
}, [hash, repo, onNoDocument,
|
|
73
|
+
}, [hash, repo, onNoDocument, onInvalidAutomergeUrl]);
|
|
77
74
|
// Update hashroute & localStorage on changes
|
|
78
75
|
useEffect(() => {
|
|
79
76
|
if (handle) {
|
|
80
|
-
|
|
77
|
+
setAutomergeUrl(key, handle.url);
|
|
81
78
|
}
|
|
82
79
|
}, [hash, handle]);
|
|
83
80
|
return handle;
|
package/package.json
CHANGED
|
@@ -1,11 +1,10 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@automerge/automerge-repo-react-hooks",
|
|
3
|
-
"version": "1.0.
|
|
3
|
+
"version": "1.0.5",
|
|
4
4
|
"description": "Hooks to access an Automerge Repo from your react app.",
|
|
5
|
-
"repository": "https://github.com/automerge/automerge-repo",
|
|
5
|
+
"repository": "https://github.com/automerge/automerge-repo/tree/master/packages/automerge-repo-react-hooks",
|
|
6
6
|
"author": "Peter van Hardenberg <pvh@pvh.ca>",
|
|
7
7
|
"license": "MIT",
|
|
8
|
-
"private": false,
|
|
9
8
|
"type": "module",
|
|
10
9
|
"main": "dist/index.js",
|
|
11
10
|
"scripts": {
|
|
@@ -17,18 +16,18 @@
|
|
|
17
16
|
"@automerge/automerge": "^2.1.0"
|
|
18
17
|
},
|
|
19
18
|
"dependencies": {
|
|
20
|
-
"@automerge/automerge-repo": "^1.0.
|
|
21
|
-
"eventemitter3": "^5.0.
|
|
19
|
+
"@automerge/automerge-repo": "^1.0.5",
|
|
20
|
+
"eventemitter3": "^5.0.1",
|
|
22
21
|
"react": "^18.2.0",
|
|
23
22
|
"react-usestateref": "^1.0.8"
|
|
24
23
|
},
|
|
25
24
|
"devDependencies": {
|
|
25
|
+
"@automerge/automerge": "^2.1.0",
|
|
26
26
|
"@testing-library/react": "^14.0.0",
|
|
27
|
-
"@vitejs/plugin-react": "^
|
|
27
|
+
"@vitejs/plugin-react": "^3.0.0",
|
|
28
28
|
"jsdom": "^22.1.0",
|
|
29
|
-
"react": "^18.2.0",
|
|
30
29
|
"react-dom": "^18.2.0",
|
|
31
|
-
"vite-plugin-top-level-await": "^1.3.
|
|
30
|
+
"vite-plugin-top-level-await": "^1.3.0",
|
|
32
31
|
"vite-plugin-wasm": "^3.2.2",
|
|
33
32
|
"vitest": "^0.33.0"
|
|
34
33
|
},
|
|
@@ -43,5 +42,5 @@
|
|
|
43
42
|
"publishConfig": {
|
|
44
43
|
"access": "public"
|
|
45
44
|
},
|
|
46
|
-
"gitHead": "
|
|
45
|
+
"gitHead": "09256d61e0e4e0afd5d8deb1e187b57cb2413e1e"
|
|
47
46
|
}
|
package/src/useBootstrap.ts
CHANGED
|
@@ -1,9 +1,4 @@
|
|
|
1
|
-
import {
|
|
2
|
-
DocHandle,
|
|
3
|
-
Repo,
|
|
4
|
-
type DocumentId,
|
|
5
|
-
generateAutomergeUrl,
|
|
6
|
-
} from "@automerge/automerge-repo"
|
|
1
|
+
import { DocHandle, Repo, type AutomergeUrl } from "@automerge/automerge-repo"
|
|
7
2
|
import { useEffect, useState, useMemo } from "react"
|
|
8
3
|
import { useRepo } from "./useRepo.js"
|
|
9
4
|
|
|
@@ -41,16 +36,16 @@ const setQueryParamValue = (key: string, value, hash): string => {
|
|
|
41
36
|
return u.toString()
|
|
42
37
|
}
|
|
43
38
|
|
|
44
|
-
const
|
|
39
|
+
const getAutomergeUrl = (key: string, hash: string) =>
|
|
45
40
|
key && (getQueryParamValue(key, hash) || localStorage.getItem(key))
|
|
46
41
|
|
|
47
|
-
const
|
|
42
|
+
const setAutomergeUrl = (key: string, automergeUrl: AutomergeUrl) => {
|
|
48
43
|
if (key) {
|
|
49
|
-
// Only set URL hash if
|
|
50
|
-
if (
|
|
51
|
-
setHash(setQueryParamValue(key,
|
|
44
|
+
// Only set URL hash if automerge URL changed
|
|
45
|
+
if (automergeUrl !== getQueryParamValue(key, window.location.hash))
|
|
46
|
+
setHash(setQueryParamValue(key, automergeUrl, window.location.hash))
|
|
52
47
|
}
|
|
53
|
-
if (key) localStorage.setItem(key,
|
|
48
|
+
if (key) localStorage.setItem(key, automergeUrl)
|
|
54
49
|
}
|
|
55
50
|
|
|
56
51
|
export interface UseBootstrapOptions<T> {
|
|
@@ -58,55 +53,53 @@ export interface UseBootstrapOptions<T> {
|
|
|
58
53
|
key?: string
|
|
59
54
|
/** Function returning a document handle called if lookup fails. Defaults to repo.create() */
|
|
60
55
|
onNoDocument?: (repo: Repo) => DocHandle<T>
|
|
61
|
-
/** Function to call if
|
|
62
|
-
|
|
56
|
+
/** Function to call if automerge URL is invalid */
|
|
57
|
+
onInvalidAutomergeUrl?(repo: Repo, error: Error): DocHandle<T>
|
|
63
58
|
}
|
|
64
59
|
|
|
65
60
|
/**
|
|
66
61
|
* This hook is used to set up a single document as the base of an app session.
|
|
67
62
|
* This is a common pattern for simple multiplayer apps with shareable URLs.
|
|
68
63
|
*
|
|
69
|
-
* It will first check for the
|
|
70
|
-
* //myapp/#
|
|
71
|
-
* Failing that, it will check for a `
|
|
64
|
+
* It will first check for the automergeUrl in the URL hash:
|
|
65
|
+
* //myapp/#automergeUrl=[document URL]
|
|
66
|
+
* Failing that, it will check for a `automergeUrl` key in localStorage.
|
|
72
67
|
* Failing that, it will call onNoDocument, expecting a handle to be returned.
|
|
73
68
|
*
|
|
74
69
|
* The URL and localStorage will then be updated.
|
|
75
|
-
* Finally, it will return the document
|
|
70
|
+
* Finally, it will return the Automerge document's URL.
|
|
76
71
|
*
|
|
77
72
|
* @param {string?} props.key Key to use for the URL hash and localStorage
|
|
78
73
|
* @param {function?} props.fallback Function returning a document handle called if lookup fails. Defaults to repo.create()
|
|
79
|
-
* @param {function?} props.
|
|
74
|
+
* @param {function?} props.onInvalidAutomergeUrl Function to call if URL is invalid; signature (error) => (repo, onCreate)
|
|
80
75
|
* @returns {DocHandle} The document handle
|
|
81
76
|
*/
|
|
82
77
|
export const useBootstrap = <T>({
|
|
83
|
-
key = "
|
|
78
|
+
key = "automergeUrl",
|
|
84
79
|
onNoDocument = repo => repo.create(),
|
|
85
|
-
|
|
80
|
+
onInvalidAutomergeUrl,
|
|
86
81
|
}: UseBootstrapOptions<T> = {}): DocHandle<T> => {
|
|
87
82
|
const repo = useRepo()
|
|
88
83
|
const hash = useHash()
|
|
89
84
|
|
|
90
85
|
// Try to get existing document; else create a new one
|
|
91
86
|
const handle = useMemo((): DocHandle<T> => {
|
|
92
|
-
const
|
|
87
|
+
const url = getAutomergeUrl(key, hash) as AutomergeUrl | undefined
|
|
93
88
|
try {
|
|
94
|
-
return
|
|
95
|
-
? repo.find(generateAutomergeUrl({ documentId }))
|
|
96
|
-
: onNoDocument(repo)
|
|
89
|
+
return url ? repo.find(url) : onNoDocument(repo)
|
|
97
90
|
} catch (error) {
|
|
98
|
-
// Presumably the
|
|
99
|
-
if (
|
|
100
|
-
return
|
|
91
|
+
// Presumably the URL was invalid
|
|
92
|
+
if (url && onInvalidAutomergeUrl)
|
|
93
|
+
return onInvalidAutomergeUrl(repo, error)
|
|
101
94
|
// Forward other errors
|
|
102
95
|
throw error
|
|
103
96
|
}
|
|
104
|
-
}, [hash, repo, onNoDocument,
|
|
97
|
+
}, [hash, repo, onNoDocument, onInvalidAutomergeUrl])
|
|
105
98
|
|
|
106
99
|
// Update hashroute & localStorage on changes
|
|
107
100
|
useEffect(() => {
|
|
108
101
|
if (handle) {
|
|
109
|
-
|
|
102
|
+
setAutomergeUrl(key, handle.url)
|
|
110
103
|
}
|
|
111
104
|
}, [hash, handle])
|
|
112
105
|
|