@trackunit/react-core-hooks 0.2.192 → 0.2.194

package/index.cjs.js

@@ -162,6 +162,89 @@ const useFilterBarContext = () => {
  */
 const FilterBarProvider = (props) => jsxRuntime.jsx(FilterBarContext.Provider, Object.assign({}, props));
 
+const TokenContext = React__namespace.createContext(null);
+/**
+ * This is a hook to use the TokenContext.
+ *
+ * @requires TokenProvider
+ * @example
+ * import { useToken } from "@trackunit/react-core-hooks";
+ * const { token } = useToken();
+ * @see {@link ITokenContext}
+ */
+const useToken = () => {
+    const context = React__namespace.useContext(TokenContext);
+    if (!context) {
+        throw new Error("useToken must be used within the TokenContext");
+    }
+    return context;
+};
+/**
+ * This is a provider for the TokenContext.
+ */
+const TokenProvider = (props) => {
+    return jsxRuntime.jsx(TokenContext.Provider, Object.assign({}, props));
+};
+
+const base64ToBlob = (base64, contentType = "") => {
+    const result = base64.split(",");
+    if (result.length === 2 && result[1]) {
+        const byteCharacters = atob(result[1]);
+        const byteArrays = [];
+        for (let offset = 0; offset < byteCharacters.length; offset += 512) {
+            const slice = byteCharacters.slice(offset, offset + 512);
+            const byteNumbers = new Array(slice.length);
+            for (let i = 0; i < slice.length; i++) {
+                byteNumbers[i] = slice.charCodeAt(i);
+            }
+            const byteArray = new Uint8Array(byteNumbers);
+            byteArrays.push(byteArray);
+        }
+        return new Blob(byteArrays, { type: contentType });
+    }
+    throw new Error();
+};
+/**
+ * useImageUploader
+ *
+ * @description Hook for uploading an image
+ * @param {Function} uploadImage - function for uploading an image
+ * @param {boolean} loading - loading state
+ * @returns {object} uploadImage - function for uploading an image, loading - loading state
+ */
+const useImageUploader = () => {
+    const { token } = useToken();
+    const [loading, setLoading] = React.useState(false);
+    const uploadImage = React.useCallback(({ postUrl, base64Image, type }) => {
+        setLoading(true);
+        return new Promise((resolve, reject) => {
+            const formData = new FormData();
+            const blob = base64ToBlob(base64Image);
+            formData.append("file", blob, `file.${type}`);
+            fetch(postUrl, {
+                method: "POST",
+                body: formData,
+                headers: {
+                    Authorization: `Bearer ${token}`,
+                },
+            }).then(response => {
+                setLoading(false);
+                if (response.status === 413) {
+                    reject("status 413 - maximumSizeExceeded");
+                }
+                if (!response.ok) {
+                    reject("response not OK - saveError");
+                }
+                resolve(true);
+            });
+        });
+    }, [token]);
+    return {
+        uploadImage,
+        loading,
+    };
+};
+
 const OemBrandingContext = React.createContext(null);
 /**
  * This is a hook to use the IOemBrandingContext.
@@ -562,30 +645,6 @@ const useToast = () => {
     return toastContext;
 };
 
-const TokenContext = React__namespace.createContext(null);
-/**
- * This is a hook to use the TokenContext.
- *
- * @requires TokenProvider
- * @example
- * import { useToken } from "@trackunit/react-core-hooks";
- * const { token } = useToken();
- * @see {@link ITokenContext}
- */
-const useToken = () => {
-    const context = React__namespace.useContext(TokenContext);
-    if (!context) {
-        throw new Error("useToken must be used within the TokenContext");
-    }
-    return context;
-};
-/**
- * This is a provider for the TokenContext.
- */
-const TokenProvider = (props) => {
-    return jsxRuntime.jsx(TokenContext.Provider, Object.assign({}, props));
-};
-
 /**
  * Hook for filtering a list of items by text search, client side search in a list.
  *
@@ -743,6 +802,7 @@ exports.useEnvironment = useEnvironment;
 exports.useEventRuntime = useEventRuntime;
 exports.useFilterBarContext = useFilterBarContext;
 exports.useHasAccessTo = useHasAccessTo;
+exports.useImageUploader = useImageUploader;
 exports.useIrisAppId = useIrisAppId;
 exports.useIrisAppName = useIrisAppName;
 exports.useNavigateInHost = useNavigateInHost;

package/index.esm.js

@@ -1,5 +1,5 @@
 import * as React from 'react';
-import { createContext, useContext, useState, useEffect, useMemo } from 'react';
+import { createContext, useContext, useState, useCallback, useEffect, useMemo } from 'react';
 import { jsx } from 'react/jsx-runtime';
 import { AssetRuntime, CustomerRuntime, EventRuntime, ParamsRuntime, SiteRuntime } from '@trackunit/iris-app-runtime-core';
 import { filterByMultiple } from '@trackunit/shared-utils';
@@ -139,6 +139,89 @@ const useFilterBarContext = () => {
  */
 const FilterBarProvider = (props) => jsx(FilterBarContext.Provider, Object.assign({}, props));
 
+const TokenContext = React.createContext(null);
+/**
+ * This is a hook to use the TokenContext.
+ *
+ * @requires TokenProvider
+ * @example
+ * import { useToken } from "@trackunit/react-core-hooks";
+ * const { token } = useToken();
+ * @see {@link ITokenContext}
+ */
+const useToken = () => {
+    const context = React.useContext(TokenContext);
+    if (!context) {
+        throw new Error("useToken must be used within the TokenContext");
+    }
+    return context;
+};
+/**
+ * This is a provider for the TokenContext.
+ */
+const TokenProvider = (props) => {
+    return jsx(TokenContext.Provider, Object.assign({}, props));
+};
+
+const base64ToBlob = (base64, contentType = "") => {
+    const result = base64.split(",");
+    if (result.length === 2 && result[1]) {
+        const byteCharacters = atob(result[1]);
+        const byteArrays = [];
+        for (let offset = 0; offset < byteCharacters.length; offset += 512) {
+            const slice = byteCharacters.slice(offset, offset + 512);
+            const byteNumbers = new Array(slice.length);
+            for (let i = 0; i < slice.length; i++) {
+                byteNumbers[i] = slice.charCodeAt(i);
+            }
+            const byteArray = new Uint8Array(byteNumbers);
+            byteArrays.push(byteArray);
+        }
+        return new Blob(byteArrays, { type: contentType });
+    }
+    throw new Error();
+};
+/**
+ * useImageUploader
+ *
+ * @description Hook for uploading an image
+ * @param {Function} uploadImage - function for uploading an image
+ * @param {boolean} loading - loading state
+ * @returns {object} uploadImage - function for uploading an image, loading - loading state
+ */
+const useImageUploader = () => {
+    const { token } = useToken();
+    const [loading, setLoading] = useState(false);
+    const uploadImage = useCallback(({ postUrl, base64Image, type }) => {
+        setLoading(true);
+        return new Promise((resolve, reject) => {
+            const formData = new FormData();
+            const blob = base64ToBlob(base64Image);
+            formData.append("file", blob, `file.${type}`);
+            fetch(postUrl, {
+                method: "POST",
+                body: formData,
+                headers: {
+                    Authorization: `Bearer ${token}`,
+                },
+            }).then(response => {
+                setLoading(false);
+                if (response.status === 413) {
+                    reject("status 413 - maximumSizeExceeded");
+                }
+                if (!response.ok) {
+                    reject("response not OK - saveError");
+                }
+                resolve(true);
+            });
+        });
+    }, [token]);
+    return {
+        uploadImage,
+        loading,
+    };
+};
+
 const OemBrandingContext = createContext(null);
 /**
  * This is a hook to use the IOemBrandingContext.
@@ -539,30 +622,6 @@ const useToast = () => {
     return toastContext;
 };
 
-const TokenContext = React.createContext(null);
-/**
- * This is a hook to use the TokenContext.
- *
- * @requires TokenProvider
- * @example
- * import { useToken } from "@trackunit/react-core-hooks";
- * const { token } = useToken();
- * @see {@link ITokenContext}
- */
-const useToken = () => {
-    const context = React.useContext(TokenContext);
-    if (!context) {
-        throw new Error("useToken must be used within the TokenContext");
-    }
-    return context;
-};
-/**
- * This is a provider for the TokenContext.
- */
-const TokenProvider = (props) => {
-    return jsx(TokenContext.Provider, Object.assign({}, props));
-};
-
 /**
  * Hook for filtering a list of items by text search, client side search in a list.
  *
@@ -694,4 +753,4 @@ const useCurrentUser = () => {
     return context;
 };
 
-export { AnalyticsContext, AnalyticsContextProvider, AssetSortingProvider, ConfirmationDialogProvider, CurrentUserPreferenceProvider, CurrentUserProvider, EnvironmentContextProvider, FilterBarProvider, NavigationContextProvider, OemBrandingContextProvider, ToastProvider, TokenProvider, UserSubscriptionProvider, useAnalytics, useAssetRuntime, useAssetSorting, useConfirmationDialog, useCurrentUser, useCurrentUserLanguage, useCurrentUserSystemOfMeasurement, useCurrentUserTimeZonePreference, useCustomerRuntime, useEnvironment, useEventRuntime, useFilterBarContext, useHasAccessTo, useIrisAppId, useIrisAppName, useNavigateInHost, useOemBrandingContext, useSiteRuntime, useTextSearch, useToast, useToken, useUserSubscription };
+export { AnalyticsContext, AnalyticsContextProvider, AssetSortingProvider, ConfirmationDialogProvider, CurrentUserPreferenceProvider, CurrentUserProvider, EnvironmentContextProvider, FilterBarProvider, NavigationContextProvider, OemBrandingContextProvider, ToastProvider, TokenProvider, UserSubscriptionProvider, useAnalytics, useAssetRuntime, useAssetSorting, useConfirmationDialog, useCurrentUser, useCurrentUserLanguage, useCurrentUserSystemOfMeasurement, useCurrentUserTimeZonePreference, useCustomerRuntime, useEnvironment, useEventRuntime, useFilterBarContext, useHasAccessTo, useImageUploader, useIrisAppId, useIrisAppName, useNavigateInHost, useOemBrandingContext, useSiteRuntime, useTextSearch, useToast, useToken, useUserSubscription };

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@trackunit/react-core-hooks",
-  "version": "0.2.192",
+  "version": "0.2.194",
   "repository": "https://github.com/Trackunit/manager",
   "license": "SEE LICENSE IN LICENSE.txt",
   "engines": {

package/src/images/useImageUploader.d.ts

@@ -0,0 +1,21 @@
+export interface UploadedFile {
+    id: string;
+    name: string;
+    __typename?: string;
+}
+/**
+ * useImageUploader
+ *
+ * @description Hook for uploading an image
+ * @param {Function} uploadImage - function for uploading an image
+ * @param {boolean} loading - loading state
+ * @returns {object} uploadImage - function for uploading an image, loading - loading state
+ */
+export declare const useImageUploader: () => {
+    uploadImage: ({ postUrl, base64Image, type }: {
+        base64Image: string;
+        postUrl: URL;
+        type: "jpeg" | "png";
+    }) => Promise<unknown>;
+    loading: boolean;
+};

package/src/index.d.ts

@@ -3,6 +3,7 @@ export * from "./assetSorting/AssetSortingProvider";
 export * from "./confirmationDialog/ConfirmationDialogProvider";
 export * from "./environment/EnvironmentContextProvider";
 export * from "./filter-bar/FilterBarProvider";
+export * from "./images/useImageUploader";
 export * from "./irisOemApp/IrisOemAppContextProvider";
 export * from "./navigation/NavigationContextProvider";
 export * from "./runtimes/useAssetRuntime";