@quiltt/react 3.8.2 → 3.9.0

package/CHANGELOG.md

@@ -1,5 +1,19 @@
 # @quiltt/react
 
+## 3.9.0
+
+### Minor Changes
+
+- [#307](https://github.com/quiltt/quiltt-js/pull/307) [`d0033cd`](https://github.com/quiltt/quiltt-js/commit/d0033cdbdaf33f9227afa55c9a6078156809a563) Thanks [@rubendinho](https://github.com/rubendinho)! - - Significantly reduce bundle size by migrating @apollo/client to "deep entrypoint import style"
+  - Bump @apollo/client to v3.11.8
+
+### Patch Changes
+
+- [#305](https://github.com/quiltt/quiltt-js/pull/305) [`803a4d0`](https://github.com/quiltt/quiltt-js/commit/803a4d09e458ed2e72781fcd475ad5f9639f2bf2) Thanks [@zubairaziz](https://github.com/zubairaziz)! - Optimize connector WebView implementation
+
+- Updated dependencies [[`803a4d0`](https://github.com/quiltt/quiltt-js/commit/803a4d09e458ed2e72781fcd475ad5f9639f2bf2), [`d0033cd`](https://github.com/quiltt/quiltt-js/commit/d0033cdbdaf33f9227afa55c9a6078156809a563)]:
+  - @quiltt/core@3.9.0
+
 ## 3.8.2
 
 ### Patch Changes

package/dist/QuilttAuthProvider-client-pXeKB9BO.js

@@ -0,0 +1,137 @@
+'use client';
+import { useCallback, useMemo, useEffect } from 'react';
+import { JsonWebTokenParse, QuilttClient, InMemoryCache } from '@quiltt/core';
+import '@apollo/client/react/hooks';
+import './useQuilttSettings-client-DU_Qfc8X.js';
+import './useSession-client-CG5lGS9F.js';
+import { jsx } from 'react/jsx-runtime';
+import { ApolloProvider } from '@apollo/client/react';
+import { u as useQuilttSession } from './useQuilttSession-client-C0lMwHkc.js';
+
+const useIdentifySession = (auth, setSession)=>{
+    const identifySession = useCallback(async (payload, callbacks)=>{
+        const response = await auth.identify(payload);
+        switch(response.status){
+            case 201:
+                setSession(response.data.token);
+                if (callbacks.onSuccess) return callbacks.onSuccess();
+                break;
+            case 202:
+                if (callbacks.onChallenged) return callbacks.onChallenged();
+                break;
+            case 422:
+                if (callbacks.onError) return callbacks.onError(response.data);
+                break;
+            default:
+                throw new Error(`AuthAPI.identify: Unexpected response status ${response.status}`);
+        }
+    }, [
+        auth,
+        setSession
+    ]);
+    return identifySession;
+};
+
+const useAuthenticateSession = (auth, setSession)=>{
+    const authenticateSession = useCallback(async (payload, callbacks)=>{
+        const response = await auth.authenticate(payload);
+        switch(response.status){
+            case 201:
+                setSession(response.data.token);
+                if (callbacks.onSuccess) return callbacks.onSuccess();
+                break;
+            case 401:
+                if (callbacks.onFailure) return callbacks.onFailure();
+                break;
+            case 422:
+                if (callbacks.onError) return callbacks.onError(response.data);
+                break;
+            default:
+                throw new Error(`AuthAPI.authenticate: Unexpected response status ${response.status}`);
+        }
+    }, [
+        auth,
+        setSession
+    ]);
+    return authenticateSession;
+};
+
+/**
+ * Optionally Accepts environmentId to validate session is from with your desired environment
+ */ const useImportSession = (auth, session, setSession, environmentId)=>{
+    const importSession = useCallback(async (token)=>{
+        // Is there a token?
+        if (!token) return !!session;
+        // Is this token already imported?
+        if (session && session.token === token) return true;
+        const jwt = JsonWebTokenParse(token);
+        // Is this token a valid JWT?
+        if (!jwt) return false;
+        // Is this token within the expected environment?
+        if (environmentId && jwt.claims.eid !== environmentId) return false;
+        // Is this token active?
+        const response = await auth.ping(token);
+        switch(response.status){
+            case 200:
+                setSession(token);
+                return true;
+            case 401:
+                return false;
+            default:
+                throw new Error(`AuthAPI.ping: Unexpected response status ${response.status}`);
+        }
+    }, [
+        auth,
+        session,
+        setSession,
+        environmentId
+    ]);
+    return importSession;
+};
+
+const useRevokeSession = (auth, session, setSession)=>{
+    const revokeSession = useCallback(async ()=>{
+        if (!session) return;
+        await auth.revoke(session.token);
+        setSession(null);
+    }, [
+        auth,
+        session,
+        setSession
+    ]);
+    return revokeSession;
+};
+
+/**
+ * If a token is provided, will validate the token against the api and then import
+ * it into trusted storage. While this process is happening, the component is put
+ * into a loading state and the children are not rendered to prevent race conditions
+ * from triggering within the transitionary state.
+ *
+ */ const QuilttAuthProvider = ({ token, children })=>{
+    const { session, importSession } = useQuilttSession();
+    // @todo: extract into a provider so it can accessed by child components
+    const graphQLClient = useMemo(()=>new QuilttClient({
+            cache: new InMemoryCache()
+        }), []);
+    // Import passed in token
+    useEffect(()=>{
+        if (token) importSession(token);
+    }, [
+        token,
+        importSession
+    ]);
+    // Reset Client Store when logging in or out
+    // biome-ignore lint/correctness/useExhaustiveDependencies: We should reset the store whenever the session changes
+    useEffect(()=>{
+        graphQLClient.resetStore();
+    }, [
+        session
+    ]);
+    return /*#__PURE__*/ jsx(ApolloProvider, {
+        client: graphQLClient,
+        children: children
+    });
+};
+
+export { QuilttAuthProvider as Q, useIdentifySession as a, useAuthenticateSession as b, useRevokeSession as c, useImportSession as u };

package/dist/{QuilttSettingsProvider-client-BJFjBWHn.js → QuilttSettingsProvider-client-DK_eTIy6.js}

@@ -2,6 +2,7 @@
 import { jsx } from 'react/jsx-runtime';
 import { useState } from 'react';
 import '@quiltt/core';
+import '@apollo/client/react/hooks';
 import { Q as QuilttSettings } from './useQuilttSettings-client-DU_Qfc8X.js';
 import './useSession-client-CG5lGS9F.js';
 

package/dist/index.d.ts

@@ -2,7 +2,7 @@ import { Maybe, QuilttJWT, UsernamePayload, UnprocessableData, AuthAPI, Passcode
 export * from '@quiltt/core';
 import * as react from 'react';
 import { RefObject, useLayoutEffect, Dispatch, SetStateAction, FC, PropsWithChildren, Component, ComponentType } from 'react';
-import { useApolloClient } from '@apollo/client/index.js';
+import { useApolloClient } from '@apollo/client/react/hooks';
 import * as react_jsx_runtime from 'react/jsx-runtime';
 
 declare function useEventListener<K extends keyof MediaQueryListEventMap>(eventName: K, handler: (event: MediaQueryListEventMap[K]) => void, element: RefObject<MediaQueryList>, options?: boolean | AddEventListenerOptions): void;

package/dist/index.js

@@ -1,16 +1,16 @@
 export * from '@quiltt/core';
 export { u as useEventListener } from './useEventListener-client-DVM5xwKY.js';
 export { u as useIsomorphicLayoutEffect } from './useIsomorphicLayoutEffect-client-DeTHOKz1.js';
-import { Q as QuilttAuthProvider } from './QuilttAuthProvider-client-DE7DRmFG.js';
-export { c as useAuthenticateSession, b as useIdentifySession, a as useImportSession, d as useRevokeSession } from './QuilttAuthProvider-client-DE7DRmFG.js';
-export { u as useQuilttClient } from './useQuilttClient-client-D5o2Whsn.js';
-import { u as useQuilttConnector } from './useQuilttConnector-client-_DPRlIM5.js';
-export { u as useQuilttSession } from './useQuilttSession-client-YSZevZF3.js';
+import { Q as QuilttAuthProvider } from './QuilttAuthProvider-client-pXeKB9BO.js';
+export { b as useAuthenticateSession, a as useIdentifySession, u as useImportSession, c as useRevokeSession } from './QuilttAuthProvider-client-pXeKB9BO.js';
+export { u as useQuilttClient } from './useQuilttClient-client-vI5KrJv2.js';
+import { u as useQuilttConnector } from './useQuilttConnector-client-D1pfKDpI.js';
+export { u as useQuilttSession } from './useQuilttSession-client-C0lMwHkc.js';
 export { Q as QuilttSettings, u as useQuilttSettings } from './useQuilttSettings-client-DU_Qfc8X.js';
 export { u as useSession } from './useSession-client-CG5lGS9F.js';
 export { u as useStorage } from './useStorage-client-B3keU-oI.js';
 import { jsx } from 'react/jsx-runtime';
-import { Q as QuilttSettingsProvider } from './QuilttSettingsProvider-client-BJFjBWHn.js';
+import { Q as QuilttSettingsProvider } from './QuilttSettingsProvider-client-DK_eTIy6.js';
 
 const QuilttProvider = ({ clientId, token, children })=>{
     return /*#__PURE__*/ jsx(QuilttSettingsProvider, {

package/dist/{useQuilttClient-client-D5o2Whsn.js → useQuilttClient-client-vI5KrJv2.js}

@@ -1,5 +1,5 @@
 'use client';
-import { u as useApolloClient } from './QuilttAuthProvider-client-DE7DRmFG.js';
+import { useApolloClient } from '@apollo/client/react/hooks';
 
 const useQuilttClient = useApolloClient;
 

package/dist/{useQuilttConnector-client-_DPRlIM5.js → useQuilttConnector-client-D1pfKDpI.js}

@@ -1,11 +1,10 @@
 'use client';
 import { useState, useEffect, useCallback } from 'react';
 import { cdnBase } from '@quiltt/core';
-import { u as useQuilttSession } from './useQuilttSession-client-YSZevZF3.js';
+import { u as useQuilttSession } from './useQuilttSession-client-C0lMwHkc.js';
 import { u as useScript } from './useScript-client-Cx5nb9RW.js';
 
-// Generated by genversion.
-const version = '3.8.2';
+var version = "3.9.0";
 
 const useQuilttConnector = (connectorId, options)=>{
     const status = useScript(`${cdnBase}/v1/connector.js?agent=react-${version}`);

package/dist/{useQuilttSession-client-YSZevZF3.js → useQuilttSession-client-C0lMwHkc.js}

@@ -1,7 +1,7 @@
 'use client';
 import { useCallback } from 'react';
 import { AuthAPI } from '@quiltt/core';
-import { a as useImportSession, b as useIdentifySession, c as useAuthenticateSession, d as useRevokeSession } from './QuilttAuthProvider-client-DE7DRmFG.js';
+import { u as useImportSession, a as useIdentifySession, b as useAuthenticateSession, c as useRevokeSession } from './QuilttAuthProvider-client-pXeKB9BO.js';
 import { u as useQuilttSettings } from './useQuilttSettings-client-DU_Qfc8X.js';
 import { u as useSession } from './useSession-client-CG5lGS9F.js';
 

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@quiltt/react",
-  "version": "3.8.2",
+  "version": "3.9.0",
   "description": "React components and hooks for Quiltt Connector",
   "keywords": [
     "quiltt",
@@ -35,12 +35,12 @@
     "CHANGELOG.md"
   ],
   "dependencies": {
-    "@quiltt/core": "3.8.2"
+    "@apollo/client": "^3.11.8",
+    "@quiltt/core": "3.9.0"
   },
   "devDependencies": {
-    "@apollo/client": "3.9.11",
     "@biomejs/biome": "1.9.4",
-    "@types/node": "22.9.0",
+    "@types/node": "22.10.2",
     "@types/react": "18.3.12",
     "@types/react-dom": "18.3.1",
     "bunchee": "5.6.1",
@@ -57,8 +57,7 @@
     "access": "public"
   },
   "scripts": {
-    "addVersion": "genversion --esm -f src/version.ts",
-    "build": "pnpm run addVersion && bunchee",
+    "build": "bunchee",
     "clean": "rimraf .turbo dist",
     "dev": "bunchee --watch",
     "lint": "TIMING=1 biome check src/ tests/ --fix",

package/src/hooks/useQuilttClient.ts

@@ -1,6 +1,6 @@
 'use client'
 
-import { useApolloClient } from '@apollo/client/index.js'
+import { useApolloClient } from '@apollo/client/react/hooks'
 
 export const useQuilttClient = useApolloClient
 

package/src/providers/QuilttAuthProvider.tsx

@@ -3,8 +3,10 @@
 import type { FC, PropsWithChildren } from 'react'
 import { useEffect, useMemo } from 'react'
 
-import { ApolloProvider } from '@apollo/client'
+import { ApolloProvider } from '@apollo/client/react'
+
 import { InMemoryCache, QuilttClient } from '@quiltt/core'
+
 import { useQuilttSession } from '../hooks'
 
 type QuilttAuthProviderProps = PropsWithChildren & {

package/src/version.ts

@@ -1,2 +1 @@
-// Generated by genversion.
-export const version = '3.8.2'
+export { version } from '../package.json'