@flexnative/authentication 0.0.3

package/README.md

@@ -0,0 +1,10 @@
+# 🔐 Authentication
+
+A package to implement almost full authentication and protect routes with Expo Router.
+FlexNative Authentication is part of the FlexNative and is available under the `@flexnative/authentication` NPM package.
+
+## Dependencies
+- [`expo-secure-store`](https://docs.expo.dev/versions/latest/sdk/securestore/)
+
+
+For more details on how to start and how to use read the [documentation](https://redonalla.github.io/flexnative/docs/theme).x

package/dist/context.d.ts

@@ -0,0 +1,35 @@
+/**
+ * @ Author: Redon Alla
+ * @ Create Time: 2025-01-10 22:28:54
+ * @ Modified by: Redon Alla
+ * @ Modified time: 2025-02-13 22:02:56
+ * @ Description: AuthContext is a React context that provides authentication-related data and methods to its consumers. It allows components within the application to access and manage authentication state, such as the current user, login status.
+ */
+import React from 'react';
+import { AuthContextProps } from './props';
+/**
+ * React context for authentication.
+ *
+ * This context provides authentication state and functions to manage authentication.
+ * It is initialized with `undefined` to allow for proper type checking and to ensure
+ * that the context is provided by a parent component.
+ *
+ * @type {React.Context<AuthContextProps<any, any>>}
+ */
+declare const AuthContext: React.Context<AuthContextProps<any, any>>;
+/**
+ * Default export of the AuthContext.
+ *
+ * This context provides authentication state and functions to manage authentication.
+ * It should be used with a corresponding provider to supply the context value.
+ *
+ * @type {React.Context<AuthContextProps<any, any>>}
+ */
+export default AuthContext;
+/**
+ * This hook provides a convenient way to access the `AuthContext` within your components.
+ * It uses React's `useContext` hook to retrieve the current context value.
+ *
+ * @returns {AuthContextProps<TLoginRequest, TRegisterForm>} The current value of the `AuthContext`.
+ */
+export declare function useAuthContext<TLoginRequest, TRegisterForm>(): AuthContextProps<TLoginRequest, TRegisterForm>;

package/dist/context.js

@@ -0,0 +1,47 @@
+/**
+ * @ Author: Redon Alla
+ * @ Create Time: 2025-01-10 22:28:54
+ * @ Modified by: Redon Alla
+ * @ Modified time: 2025-02-13 22:02:56
+ * @ Description: AuthContext is a React context that provides authentication-related data and methods to its consumers. It allows components within the application to access and manage authentication state, such as the current user, login status.
+ */
+import React from 'react';
+/**
+ * React context for authentication.
+ *
+ * This context provides authentication state and functions to manage authentication.
+ * It is initialized with `undefined` to allow for proper type checking and to ensure
+ * that the context is provided by a parent component.
+ *
+ * @type {React.Context<AuthContextProps<any, any>>}
+ */
+const AuthContext = React.createContext({
+    state: {
+        authenticated: false
+    },
+    onLogin: async (loginForm) => { console.log('loginForm: ', loginForm); },
+    onAuthentication: async () => { }
+});
+/**
+ * Default export of the AuthContext.
+ *
+ * This context provides authentication state and functions to manage authentication.
+ * It should be used with a corresponding provider to supply the context value.
+ *
+ * @type {React.Context<AuthContextProps<any, any>>}
+ */
+export default AuthContext;
+/**
+ * This hook provides a convenient way to access the `AuthContext` within your components.
+ * It uses React's `useContext` hook to retrieve the current context value.
+ *
+ * @returns {AuthContextProps<TLoginRequest, TRegisterForm>} The current value of the `AuthContext`.
+ */
+export function useAuthContext() {
+    const value = React.useContext(AuthContext);
+    if (!value) {
+        throw new Error('useSession must be wrapped in a <AuthProvider />');
+    }
+    return value;
+}
+//# sourceMappingURL=context.js.map

package/dist/context.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"context.js","sourceRoot":"","sources":["../src/context.tsx"],"names":[],"mappings":"AAAA;;;;;;GAMG;AAEH,OAAO,KAAK,MAAM,OAAO,CAAC;AAI1B;;;;;;;;GAQG;AACH,MAAM,WAAW,GACf,KAAK,CAAC,aAAa,CAA6B;IAC9C,KAAK,EAAE;QACL,aAAa,EAAE,KAAK;KACrB;IACD,OAAO,EAAE,KAAK,EAAE,SAAc,EAAE,EAAE,GAAG,OAAO,CAAC,GAAG,CAAC,aAAa,EAAE,SAAS,CAAC,CAAA,CAAA,CAAC;IAC3E,gBAAgB,EAAE,KAAK,IAAI,EAAE,GAAE,CAAC;CACjC,CAAC,CAAC;AAEL;;;;;;;GAOG;AACH,eAAe,WAAW,CAAC;AAE3B;;;;;GAKG;AACH,MAAM,UAAU,cAAc;IAC5B,MAAM,KAAK,GAAG,KAAK,CAAC,UAAU,CAAC,WAAW,CAAC,CAAC;IAC5C,IAAI,CAAC,KAAK,EAAE,CAAC;QACX,MAAM,IAAI,KAAK,CAAC,kDAAkD,CAAC,CAAC;IACtE,CAAC;IAED,OAAO,KAAK,CAAC;AACf,CAAC"}

package/dist/hooks.d.ts

@@ -0,0 +1,33 @@
+/**
+ * @ Author: Redon Alla
+ * @ Create Time: 2025-02-10 23:37:59
+ * @ Modified by: Redon Alla
+ * @ Modified time: 2025-02-13 23:28:34
+ * @ Description: The following code snippet is a basic hook that persists tokens securely on native with `expo-secure-store` and in local storage on web.
+ */
+/**
+ * Type definition for the useState hook.
+ * @template T - The type of the state value.
+ */
+type UseStateHook<T> = [[boolean, T | null], (value: T | null) => void];
+/**
+ * Asynchronously sets an item in storage.
+ * @param { string } key - The key of the item to set.
+ * @param { string | null } value - The value of the item to set. If null, the item is removed.
+ * @returns { Promise<void> } - A promise that resolves when the operation is complete.
+ */
+export declare function setStorageItemAsync(key: string, value: string | null): Promise<void>;
+/**
+ * Asynchronously retrieves an item from storage.
+ *
+ * @param {string} key - The key of the item to retrieve.
+ * @returns {string | null} - The value of the item, or null if the item does not exist.
+ */
+export declare function getStorageItemAsync(key: string): string | null;
+/**
+ * Custom hook to manage authentication state.
+ * @param { string } key - The key of the authentication state item.
+ * @returns { UseStateHook<string> } - The authentication state and the state updater function.
+ */
+export declare function useAuthState(key: string): UseStateHook<string>;
+export {};

package/dist/hooks.js

@@ -0,0 +1,89 @@
+/**
+ * @ Author: Redon Alla
+ * @ Create Time: 2025-02-10 23:37:59
+ * @ Modified by: Redon Alla
+ * @ Modified time: 2025-02-13 23:28:34
+ * @ Description: The following code snippet is a basic hook that persists tokens securely on native with `expo-secure-store` and in local storage on web.
+ */
+import { useEffect, useCallback, useReducer } from 'react';
+import { Platform } from 'react-native';
+import * as SecureStore from 'expo-secure-store';
+const isWeb = Platform.OS === 'web';
+/**
+ * Custom hook to manage asynchronous state.
+ * @template T - The type of the state value.
+ * @param { [boolean, T | null] } [initialValue=[true, null]] - The initial state value.
+ * @returns { UseStateHook<T> } - The state and the state updater function.
+ */
+function useAsyncState(initialValue = [true, null]) {
+    return useReducer((_state, action = null) => [false, action], initialValue);
+}
+/**
+ * Asynchronously sets an item in storage.
+ * @param { string } key - The key of the item to set.
+ * @param { string | null } value - The value of the item to set. If null, the item is removed.
+ * @returns { Promise<void> } - A promise that resolves when the operation is complete.
+ */
+export async function setStorageItemAsync(key, value) {
+    if (isWeb) {
+        try {
+            if (value === null) {
+                localStorage.removeItem(key);
+            }
+            else {
+                localStorage.setItem(key, value);
+            }
+        }
+        catch (e) {
+            console.error('Local storage is unavailable:', e);
+        }
+    }
+    else {
+        if (value == null) {
+            await SecureStore.deleteItemAsync(key);
+        }
+        else {
+            await SecureStore.setItemAsync(key, value);
+        }
+    }
+}
+/**
+ * Asynchronously retrieves an item from storage.
+ *
+ * @param {string} key - The key of the item to retrieve.
+ * @returns {string | null} - The value of the item, or null if the item does not exist.
+ */
+export function getStorageItemAsync(key) {
+    return isWeb ? localStorage.getItem(key) : SecureStore.getItem(key);
+}
+/**
+ * Custom hook to manage authentication state.
+ * @param { string } key - The key of the authentication state item.
+ * @returns { UseStateHook<string> } - The authentication state and the state updater function.
+ */
+export function useAuthState(key) {
+    const [state, setState] = useAsyncState([true, getStorageItemAsync(key)]);
+    useEffect(() => {
+        if (isWeb) {
+            try {
+                if (typeof localStorage !== 'undefined') {
+                    setState(localStorage.getItem(key));
+                }
+            }
+            catch (e) {
+                console.error('Local storage is unavailable:', e);
+            }
+        }
+        else {
+            SecureStore.getItemAsync(key).then(value => {
+                setState(value);
+            });
+        }
+    }, [key]);
+    const setValue = useCallback((value) => {
+        setState(value);
+        setStorageItemAsync(key, value);
+    }, [key]);
+    return [state, setValue];
+}
+//# sourceMappingURL=hooks.js.map

package/dist/hooks.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"hooks.js","sourceRoot":"","sources":["../src/hooks.ts"],"names":[],"mappings":"AAAA;;;;;;GAMG;AAEH,OAAO,EAAE,SAAS,EAAE,WAAW,EAAE,UAAU,EAAE,MAAM,OAAO,CAAC;AAC3D,OAAO,EAAE,QAAQ,EAAE,MAAM,cAAc,CAAC;AACxC,OAAO,KAAK,WAAW,MAAM,mBAAmB,CAAC;AASjD,MAAM,KAAK,GAAG,QAAQ,CAAC,EAAE,KAAK,KAAK,CAAC;AAEpC;;;;;GAKG;AACH,SAAS,aAAa,CACpB,eAAoC,CAAC,IAAI,EAAE,IAAI,CAAC;IAEhD,OAAO,UAAU,CACf,CAAC,MAA2B,EAAE,SAAmB,IAAI,EAAuB,EAAE,CAAC,CAAC,KAAK,EAAE,MAAM,CAAC,EAC9F,YAAY,CACM,CAAC;AACvB,CAAC;AAED;;;;;GAKG;AACH,MAAM,CAAC,KAAK,UAAU,mBAAmB,CAAC,GAAW,EAAE,KAAoB;IACzE,IAAI,KAAK,EAAE,CAAC;QACV,IAAI,CAAC;YACH,IAAI,KAAK,KAAK,IAAI,EAAE,CAAC;gBACnB,YAAY,CAAC,UAAU,CAAC,GAAG,CAAC,CAAC;YAC/B,CAAC;iBAAM,CAAC;gBACN,YAAY,CAAC,OAAO,CAAC,GAAG,EAAE,KAAK,CAAC,CAAC;YACnC,CAAC;QACH,CAAC;QAAC,OAAO,CAAC,EAAE,CAAC;YACX,OAAO,CAAC,KAAK,CAAC,+BAA+B,EAAE,CAAC,CAAC,CAAC;QACpD,CAAC;IACH,CAAC;SAAM,CAAC;QACN,IAAI,KAAK,IAAI,IAAI,EAAE,CAAC;YAClB,MAAM,WAAW,CAAC,eAAe,CAAC,GAAG,CAAC,CAAC;QACzC,CAAC;aAAM,CAAC;YACN,MAAM,WAAW,CAAC,YAAY,CAAC,GAAG,EAAE,KAAK,CAAC,CAAC;QAC7C,CAAC;IACH,CAAC;AACH,CAAC;AAED;;;;;GAKG;AACH,MAAM,UAAU,mBAAmB,CAAC,GAAW;IAC7C,OAAO,KAAK,CAAC,CAAC,CAAC,YAAY,CAAC,OAAO,CAAC,GAAG,CAAC,CAAC,CAAC,CAAC,WAAW,CAAC,OAAO,CAAC,GAAG,CAAC,CAAC;AACtE,CAAC;AAED;;;;GAIG;AACH,MAAM,UAAU,YAAY,CAAC,GAAW;IACtC,MAAM,CAAC,KAAK,EAAE,QAAQ,CAAC,GAAG,aAAa,CAAS,CAAC,IAAI,EAAE,mBAAmB,CAAC,GAAG,CAAC,CAAC,CAAC,CAAC;IAElF,SAAS,CAAC,GAAG,EAAE;QACb,IAAI,KAAK,EAAE,CAAC;YACV,IAAI,CAAC;gBACH,IAAI,OAAO,YAAY,KAAK,WAAW,EAAE,CAAC;oBACxC,QAAQ,CAAC,YAAY,CAAC,OAAO,CAAC,GAAG,CAAC,CAAC,CAAC;gBACtC,CAAC;YACH,CAAC;YAAC,OAAO,CAAC,EAAE,CAAC;gBACX,OAAO,CAAC,KAAK,CAAC,+BAA+B,EAAE,CAAC,CAAC,CAAC;YACpD,CAAC;QACH,CAAC;aAAM,CAAC;YACN,WAAW,CAAC,YAAY,CAAC,GAAG,CAAC,CAAC,IAAI,CAAC,KAAK,CAAC,EAAE;gBACzC,QAAQ,CAAC,KAAK,CAAC,CAAC;YAClB,CAAC,CAAC,CAAC;QACL,CAAC;IACH,CAAC,EAAE,CAAC,GAAG,CAAC,CAAC,CAAC;IAEV,MAAM,QAAQ,GAAG,WAAW,CAC1B,CAAC,KAAoB,EAAE,EAAE;QACvB,QAAQ,CAAC,KAAK,CAAC,CAAC;QAChB,mBAAmB,CAAC,GAAG,EAAE,KAAK,CAAC,CAAC;IAClC,CAAC,EACD,CAAC,GAAG,CAAC,CACN,CAAC;IAEF,OAAO,CAAC,KAAK,EAAE,QAAQ,CAAC,CAAC;AAC3B,CAAC"}

package/dist/index.d.ts

@@ -0,0 +1,3 @@
+export { default as AuthContext, useAuthContext } from './context';
+export type { AuthContextProps, AuthStateProps } from './props';
+export { setStorageItemAsync, getStorageItemAsync, useAuthState } from './hooks';

package/dist/index.js

@@ -0,0 +1,3 @@
+export { default as AuthContext, useAuthContext } from './context';
+export { setStorageItemAsync, getStorageItemAsync, useAuthState } from './hooks';
+//# sourceMappingURL=index.js.map

package/dist/index.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.js","sourceRoot":"","sources":["../src/index.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,OAAO,IAAI,WAAW,EAAE,cAAc,EAAE,MAAM,WAAW,CAAC;AAEnE,OAAO,EAAE,mBAAmB,EAAE,mBAAmB,EAAE,YAAY,EAAE,MAAM,SAAS,CAAC"}

package/dist/props.d.ts

@@ -0,0 +1,64 @@
+/**
+ * @ Author: Redon Alla
+ * @ Create Time: 2025-02-13 21:21:15
+ * @ Modified by: Redon Alla
+ * @ Modified time: 2025-02-13 21:42:14
+ * @ Description: The provided TypeScript code defines several type aliases that outline the structure and expected properties for an authentication context in a React application.
+ */
+/**
+ * This is a generic type alias used to define the properties expected in an authentication context.
+ *
+ * It accepts a generic type parameter `TLoginRequest`,
+ * which allows the `onLogin` method to be defined with a specific login request type.
+ */
+export type AuthContextProps<TLoginRequest, TRegisterForm> = {
+    /**
+     * It accepts a generic type parameter `TLoginRequest`,
+     * which allows the `onLogin` method to be defined with a specific login request type.
+     */
+    state: AuthStateProps;
+    /**
+     * An optional function that handles user registration.
+     * It takes a `registerForm` parameter of type `TRegisterForm` and returns a `Promise<void>`.
+     *
+     * @param registerForm of type `TRegisterForm`
+     * @returns `Promise<void>`
+     */
+    onRegister?: (registerForm: TRegisterForm) => Promise<void>;
+    /**
+     * An optional function for handling user logout, returning a `Promise<void>`.
+     *
+     * @returns `Promise<void>`
+     */
+    onLogout?: () => Promise<void>;
+    /**
+     * A required function that handles user login.
+     * It takes a `loginForm` parameter of type `TLoginRequest` (specified by the consumer of this type), and it returns a `Promise<void>`.
+     *
+     * @param loginForm of type `TLoginRequest`
+     * @returns `Promise<void>`
+     */
+    onLogin: (loginForm: TLoginRequest) => Promise<void>;
+    /**
+     * A required function that triggers authentication logic, returning a `Promise<void>`.
+     *
+     * @returns `Promise<void>`
+     */
+    onAuthentication: () => Promise<void>;
+};
+/**
+ * Defines the structure of the state object related to authentication.
+ */
+export type AuthStateProps = {
+    /**
+     * An optional string that may store session information or identifiers.
+     */
+    session?: string;
+    /**
+     * A boolean indicating whether the user is currently authenticated.
+     */
+    authenticated: boolean;
+};
+/**
+ * These type definitions help ensure that the components interacting with authentication logic within the application have well-defined interfaces, improving type safety and readability across the codebase.
+ */ 

package/dist/props.js

@@ -0,0 +1,12 @@
+/**
+ * @ Author: Redon Alla
+ * @ Create Time: 2025-02-13 21:21:15
+ * @ Modified by: Redon Alla
+ * @ Modified time: 2025-02-13 21:42:14
+ * @ Description: The provided TypeScript code defines several type aliases that outline the structure and expected properties for an authentication context in a React application.
+ */
+export {};
+/**
+ * These type definitions help ensure that the components interacting with authentication logic within the application have well-defined interfaces, improving type safety and readability across the codebase.
+ */ 
+//# sourceMappingURL=props.js.map

package/dist/props.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"props.js","sourceRoot":"","sources":["../src/props.ts"],"names":[],"mappings":"AAAA;;;;;;GAMG;;AAgEH;;GAEG"}

package/package.json

@@ -0,0 +1,42 @@
+{
+  "name": "@flexnative/authentication",
+  "version": "0.0.3",
+  "description": "A package to implement almost full authentication and protect routes with Expo Router.",
+  "main": "dist/index.js",
+  "types": "dist/index.d.ts",
+  "module": "dist/index.js",
+  "exports": {
+    "./hooks": "./dist/hooks.js",
+    "./context": "./dist/context.js",
+    "./context/props": "./dist/props.js"
+  },
+  "files": [
+    "dist/**/*"
+  ],
+  "scripts": {
+    "build": "tsc",
+    "prepare": "npm run build",
+    "test": "echo \"Error: no test specified\" && exit 1"
+  },
+  "repository": {
+    "type": "git",
+    "url": "git+https://github.com/RedonAlla/flexnative.git",
+    "directory": "npm-packages/src/packages/authentication"
+  },
+  "keywords": [
+    "expo-router",
+    "authentication",
+    "protected",
+    "react",
+    "react-native"
+  ],
+  "author": "Redon Alla <redon.alla@gmail.com>",
+  "license": "MIT",
+  "bugs": {
+    "url": "https://github.com/RedonAlla/flexnative/issues"
+  },
+  "homepage": "https://redonalla.github.io/flexnative/",
+  "devDependencies": {
+    "expo-secure-store": "*"
+  }
+}