jazz-react-auth-clerk 0.8.31 → 0.8.32

Sign up to get free protection for your applications and to get access to all the features.
Files changed (3) hide show
  1. package/CHANGELOG.md +13 -0
  2. package/README.md +52 -3
  3. package/package.json +5 -5
package/CHANGELOG.md CHANGED
@@ -1,5 +1,18 @@
1
1
  # jazz-browser-media-images
2
2
 
3
+ ## 0.8.32
4
+
5
+ ### Patch Changes
6
+
7
+ - 1a4bda0: Document usage in readme
8
+ - Updated dependencies [df42b2b]
9
+ - Updated dependencies [1a4bda0]
10
+ - Updated dependencies [df42b2b]
11
+ - cojson@0.8.32
12
+ - jazz-browser-auth-clerk@0.8.32
13
+ - jazz-tools@0.8.32
14
+ - jazz-react@0.8.32
15
+
3
16
  ## 0.8.31
4
17
 
5
18
  ### Patch Changes
package/README.md CHANGED
@@ -1,5 +1,54 @@
1
- # `jazz-browser-media-images`
1
+ # `jazz-react-auth-clerk`
2
2
 
3
- This is an optional add-on for `jazz-browser` or `jazz-react` that provides support for creating `ImageDefinition`-compatible image sets from images provided as `File` or `Blob` objects.
3
+ This package provides a [Clerk-based](https://clerk.com/) authentication strategy for Jazz's React bindings.
4
4
 
5
- In particular, it implements multi-resolution resizing based on `pica`.
5
+ ## Usage
6
+
7
+ `useJazzClerkAuth` is a hook that returns a `JazzAuth` object and a `JazzAuthState` object. Provide a Clerk instance to `useJazzClerkAuth`, and it will return the appropriate `JazzAuth` object. Once authenticated, authentication will persist across page reloads, even if the device is offline.
8
+
9
+
10
+ See the full [minimal example app](https://github.com/gardencmp/jazz/tree/main/examples/minimal-auth-clerk) for a complete example.
11
+
12
+ ```tsx
13
+ import { ClerkProvider, SignInButton, useClerk } from "@clerk/clerk-react";
14
+ import { useJazzClerkAuth } from "jazz-react-auth-clerk";
15
+
16
+ const PUBLISHABLE_KEY = import.meta.env.VITE_CLERK_PUBLISHABLE_KEY;
17
+
18
+ const Jazz = createJazzReactApp();
19
+ export const { useAccount, useCoState } = Jazz;
20
+
21
+ function JazzAndAuth({ children }: { children: React.ReactNode }) {
22
+ const clerk = useClerk();
23
+ const [auth, state] = useJazzClerkAuth(clerk);
24
+
25
+ return (
26
+ <>
27
+ {state?.errors?.map((error) => (
28
+ <div key={error}>{error}</div>
29
+ ))}
30
+ {clerk.user && auth ? (
31
+ <Jazz.Provider
32
+ auth={auth}
33
+ peer="wss://cloud.jazz.tools/?key=your-email-address"
34
+ >
35
+ {children}
36
+ </Jazz.Provider>
37
+ ) : (
38
+ <SignInButton />
39
+ )}
40
+ </>
41
+ );
42
+ }
43
+
44
+ createRoot(document.getElementById("root")!).render(
45
+ <StrictMode>
46
+ <ClerkProvider publishableKey={PUBLISHABLE_KEY} afterSignOutUrl="/">
47
+ <JazzAndAuth>
48
+ <App />
49
+ </JazzAndAuth>
50
+ </ClerkProvider>
51
+ </StrictMode>,
52
+ );
53
+
54
+ ```
package/package.json CHANGED
@@ -1,15 +1,15 @@
1
1
  {
2
2
  "name": "jazz-react-auth-clerk",
3
- "version": "0.8.31",
3
+ "version": "0.8.32",
4
4
  "type": "module",
5
5
  "main": "dist/index.js",
6
6
  "types": "src/index.tsx",
7
7
  "license": "MIT",
8
8
  "dependencies": {
9
- "cojson": "0.8.31",
10
- "jazz-browser-auth-clerk": "0.8.31",
11
- "jazz-react": "0.8.31",
12
- "jazz-tools": "0.8.31"
9
+ "cojson": "0.8.32",
10
+ "jazz-browser-auth-clerk": "0.8.32",
11
+ "jazz-react": "0.8.32",
12
+ "jazz-tools": "0.8.32"
13
13
  },
14
14
  "peerDependencies": {
15
15
  "react": "^18.2.0"