izen-react-starter 2.3.7 → 2.4.0

package/README.md

@@ -681,6 +681,127 @@ export function UsersPage() {
 ```
 > **Tip:** You only need to set the baseURL once per app session. After that, all requests will use this base URL automatically. The token will always be injected from AuthProvider for every request.
 
+#### Refresh token endpoint (optional)
+
+If your backend uses a refresh endpoint, set it alongside the base URL so auth-aware hooks can reuse it:
+
+```tsx
+import { useEffect } from 'react';
+import { useApiService } from 'izen-react-starter';
+
+function App() {
+  const apiService = useApiService();
+
+  useEffect(() => {
+    apiService.setBaseURL('https://api.example.com');
+    apiService.setRefreshTokenUrl('/auth/refresh');
+  }, [apiService]);
+
+  return <YourApp />;
+}
+```
+
+### Auth Axios hook (useAxiosAuth)
+
+`useAxiosAuth` returns an axios instance with auth interceptors and automatic token refresh. It uses the `baseURL` and optional refresh URL you set on `apiService`.
+
+```tsx
+import { useEffect } from 'react';
+import { useApiService } from 'izen-react-starter';
+import { useAxiosAuth } from 'izen-react-starter';
+
+function Profile() {
+  const apiService = useApiService();
+
+  // Ensure base URL (and refresh URL if needed) are set once
+  useEffect(() => {
+    apiService.setBaseURL('https://api.example.com');
+    apiService.setRefreshTokenUrl('/auth/refresh');
+  }, [apiService]);
+
+  const axiosAuth = useAxiosAuth();
+
+  const loadProfile = async () => {
+    const res = await axiosAuth.get('/me');
+    return res.data;
+  };
+
+  // ...use loadProfile inside effects or react-query
+  return null;
+}
+```
+
+### Generic queries (useGet / useGetSingle)
+
+React Query wrappers that reuse the auth axios instance. Make sure `apiService` has a base URL set before calling them.
+
+```tsx
+import { useEffect } from 'react';
+import { useApiService, useGet, useGetSingle } from 'izen-react-starter';
+
+function UsersScreen() {
+  const apiService = useApiService();
+
+  useEffect(() => {
+    apiService.setBaseURL('https://api.example.com');
+  }, [apiService]);
+
+  const usersQuery = useGet<{ id: string; name: string }>('/users');
+  const userQuery = useGetSingle<{ id: string; name: string }>(`/users/${usersQuery.data?.[0]?.id}`, undefined, undefined, '/users/1');
+
+  if (usersQuery.isLoading) return <div>Loading users...</div>;
+  if (usersQuery.error) return <div>Error: {String(usersQuery.error)}</div>;
+
+  return (
+    <div>
+      {usersQuery.data?.map((u) => (
+        <div key={u.id}>{u.name}</div>
+      ))}
+      <div>User detail: {userQuery.data?.name}</div>
+    </div>
+  );
+}
+```
+
+### Utility helpers (payload, time, HTML)
+
+These utilities are exported from `izen-react-starter/lib`:
+
+- `formatPayloadForEndpoint` (alias: `formatAxiosData`) — normalize payloads per endpoint (e.g., multipart for file-heavy routes, boolean fixes, role permissions, employee shifts).
+- `buildMultipartFormData`, `buildRolePermissionsFormData`, `buildEmployeeShiftFormData` — helpers used by `formatPayloadForEndpoint` that you can also call directly.
+- `removeHtmlTags` — strip HTML tags from strings.
+- Time helpers: `parseTimeToMilliseconds`, `diffHoursFromTimestamps` (alias: `TimeDiffHours`), `subtractTimeStrings`, `sumTimeStrings`, `formatSecondsToHms` (aliases: `secondsToTime`, `formatTimeStr`).
+- Date helpers: `toUTCDateString`/`toUTCDateTimeString`, `getWeekRange` (alias: `getWeekBounds`).
+
+Example payload formatting:
+
+```ts
+import { formatPayloadForEndpoint } from 'izen-react-starter/lib';
+
+// Multipart for file upload endpoints
+const payload = { name: 'Test', image: myFile };
+const body = formatPayloadForEndpoint(payload, '/lessons');
+await axios.post('/lessons', body);
+
+// Role permissions (only true values become permissions[])
+const roleBody = formatPayloadForEndpoint({ name: 'admin', manage_users: true }, '/roles');
+await axios.post('/roles', roleBody);
+
+// Employee shifts schedule
+const shiftBody = formatPayloadForEndpoint({ employeeShifts: { mon: { start: '09:00', end: '17:00' } } }, '/employee-shifts/schedule-update');
+await axios.post('/employee-shifts/schedule-update', shiftBody);
+```
+
+Example time helpers:
+
+```ts
+import { parseTimeToMilliseconds, subtractTimeStrings, formatSecondsToHms } from 'izen-react-starter/lib';
+
+const ms = parseTimeToMilliseconds('09:30'); // 34200000
+const diff = subtractTimeStrings('10:30', '09:00'); // "01:30:00"
+const pretty = formatSecondsToHms(3661); // "01:01:01"
+```
+
 ### Role-Based Access Control (RBAC)
 
 The RBAC system is now fully configurable! Define your own roles, resources, and rules.

package/dist/{2SSKDMRQ-BWxJ7KHy.js → 2SSKDMRQ-D50rlKfr.js}

@@ -1,5 +1,5 @@
-import { c as s, T as c, P as u, a as i, b as m, C as P, Q as d } from "./AP7HFJJL-uVnY5RPz.js";
-import { g as h, c as v, a as e } from "./index-BWKXTVrJ.js";
+import { c as s, T as c, P as u, a as i, b as m, C as P, Q as d } from "./AP7HFJJL-B_liWFpt.js";
+import { g as h, c as v, a as e } from "./index-Gs1Xd6jo.js";
 var C = (r) => {
   const [t, o] = s({
     prefix: "TanstackQueryDevtools"

package/dist/{AP7HFJJL-uVnY5RPz.js → AP7HFJJL-B_liWFpt.js}

@@ -1,7 +1,7 @@
 var xs = Object.defineProperty;
 var $s = (e, t, n) => t in e ? xs(e, t, { enumerable: !0, configurable: !0, writable: !0, value: n }) : e[t] = n;
 var Re = (e, t, n) => $s(e, typeof t != "symbol" ? t + "" : t, n);
-import { b as $e, d as B, o as ft, e as H, c as P, a as m, P as No, m as ve, S as K, t as _, i as k, f as U, h as F, j as Cs, k as ur, u as Ce, l as V, s as Qn, n as Yn, p as gt, q as T, r as Ss, v as Ut, w as _t, x as qe, y as ks, z as Rt, A as Bt, B as Es, C as Ds, D as En, F as As, E as Ht, $ as Ho, G as Ms, H as Ts, I as W, J as Vr, K as Fs, L as Is, M as cr, N as Os, O as Ls, Q as Hn, R as Ps, T as qs, U as ie, V as _s, W as Rs } from "./index-BWKXTVrJ.js";
+import { b as $e, d as B, o as ft, e as H, c as P, a as m, P as No, m as ve, S as K, t as _, i as k, f as U, h as F, j as Cs, k as ur, u as Ce, l as V, s as Qn, n as Yn, p as gt, q as T, r as Ss, v as Ut, w as _t, x as qe, y as ks, z as Rt, A as Bt, B as Es, C as Ds, D as En, F as As, E as Ht, $ as Ho, G as Ms, H as Ts, I as W, J as Vr, K as Fs, L as Is, M as cr, N as Os, O as Ls, Q as Hn, R as Ps, T as qs, U as ie, V as _s, W as Rs } from "./index-Gs1Xd6jo.js";
 var zs = (e) => e != null, Ks = (e) => e.filter(zs);
 function Bs(e) {
   return (...t) => {

package/dist/{WDYDFRGG-Pjnjsi2V.js → WDYDFRGG-Cml_4Hf-.js}

@@ -1,5 +1,5 @@
-import { c, T as l, P as m, a as u, D as v, Q as i } from "./AP7HFJJL-uVnY5RPz.js";
-import { g as d, c as f, a as e } from "./index-BWKXTVrJ.js";
+import { c, T as l, P as m, a as u, D as v, Q as i } from "./AP7HFJJL-B_liWFpt.js";
+import { g as d, c as f, a as e } from "./index-Gs1Xd6jo.js";
 var h = (t) => {
   const [r, o] = c({
     prefix: "TanstackQueryDevtools"

package/dist/components/form/FormLayout.d.ts

@@ -1,4 +1,3 @@
-import { AxiosInstance } from 'axios';
 import { z } from 'zod';
 export interface FormLayoutProps<TFieldValues extends Record<string, any> = Record<string, any>> {
     item?: Partial<TFieldValues>;
@@ -17,7 +16,6 @@ export interface FormLayoutProps<TFieldValues extends Record<string, any> = Reco
     dataFormatter?: Partial<Record<keyof TFieldValues | string, (data: any) => unknown>>;
     baseURL?: string;
     multipartUrls?: string[];
-    axiosInstance?: AxiosInstance;
 }
-export default function FormLayout<TFieldValues extends Record<string, any> = Record<string, any>>({ item, url, redirectUrl, edit, showCancelBtn, showNewBtn, onSave, onReset, onError, children, resetForm, validationSchema, requestHeaders, dataFormatter, baseURL, multipartUrls, axiosInstance, }: FormLayoutProps<TFieldValues>): import("react/jsx-runtime").JSX.Element;
+export default function FormLayout<TFieldValues extends Record<string, any> = Record<string, any>>({ item, url, redirectUrl, edit, showCancelBtn, showNewBtn, onSave, onReset, onError, children, resetForm, validationSchema, requestHeaders, dataFormatter, baseURL, multipartUrls, }: FormLayoutProps<TFieldValues>): import("react/jsx-runtime").JSX.Element;
 //# sourceMappingURL=FormLayout.d.ts.map

package/dist/components/form/FormLayout.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"FormLayout.d.ts","sourceRoot":"","sources":["../../../src/components/form/FormLayout.tsx"],"names":[],"mappings":"AACA,OAAO,EAAE,aAAa,EAAsB,MAAM,OAAO,CAAC;AAG1D,OAAO,EAAE,CAAC,EAAE,MAAM,KAAK,CAAC;AAiBxB,MAAM,WAAW,eAAe,CAAC,YAAY,SAAS,MAAM,CAAC,MAAM,EAAE,GAAG,CAAC,GAAG,MAAM,CAAC,MAAM,EAAE,GAAG,CAAC;IAC7F,IAAI,CAAC,EAAE,OAAO,CAAC,YAAY,CAAC,CAAC;IAC7B,GAAG,EAAE,MAAM,CAAC;IACZ,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB,IAAI,CAAC,EAAE,OAAO,CAAC;IACf,aAAa,CAAC,EAAE,OAAO,CAAC;IACxB,UAAU,CAAC,EAAE,OAAO,CAAC;IACrB,MAAM,CAAC,EAAE,CAAC,IAAI,EAAE,GAAG,EAAE,IAAI,EAAE,KAAK,GAAG,MAAM,KAAK,IAAI,CAAC;IACnD,OAAO,CAAC,EAAE,MAAM,IAAI,CAAC;IACrB,OAAO,CAAC,EAAE,CAAC,KAAK,EAAE,OAAO,KAAK,IAAI,CAAC;IACnC,QAAQ,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;IAC3B,SAAS,CAAC,EAAE,OAAO,CAAC;IACpB,gBAAgB,CAAC,EAAE,CAAC,CAAC,OAAO,CAAC,YAAY,CAAC,CAAC;IAC3C,cAAc,CAAC,EAAE,MAAM,CAAC,MAAM,EAAE,MAAM,CAAC,CAAC;IACxC,aAAa,CAAC,EAAE,OAAO,CAAC,MAAM,CAAC,MAAM,YAAY,GAAG,MAAM,EAAE,CAAC,IAAI,EAAE,GAAG,KAAK,OAAO,CAAC,CAAC,CAAC;IACrF,OAAO,CAAC,EAAE,MAAM,CAAC;IACjB,aAAa,CAAC,EAAE,MAAM,EAAE,CAAC;IACzB,aAAa,CAAC,EAAE,aAAa,CAAC;CAC/B;AAoCD,MAAM,CAAC,OAAO,UAAU,UAAU,CAAC,YAAY,SAAS,MAAM,CAAC,MAAM,EAAE,GAAG,CAAC,GAAG,MAAM,CAAC,MAAM,EAAE,GAAG,CAAC,EAAE,EACjG,IAAI,EACJ,GAAG,EACH,WAAW,EACX,IAAW,EACX,aAAqB,EACrB,UAAiB,EACjB,MAAM,EACN,OAAO,EACP,OAAO,EACP,QAAQ,EACR,SAAiB,EACjB,gBAAgB,EAChB,cAAc,EACd,aAAa,EACb,OAAY,EACZ,aAAkB,EAClB,aAAa,GACd,EAAE,eAAe,CAAC,YAAY,CAAC,2CA4K/B"}
+{"version":3,"file":"FormLayout.d.ts","sourceRoot":"","sources":["../../../src/components/form/FormLayout.tsx"],"names":[],"mappings":"AAIA,OAAO,EAAE,CAAC,EAAE,MAAM,KAAK,CAAC;AAgBxB,MAAM,WAAW,eAAe,CAAC,YAAY,SAAS,MAAM,CAAC,MAAM,EAAE,GAAG,CAAC,GAAG,MAAM,CAAC,MAAM,EAAE,GAAG,CAAC;IAC7F,IAAI,CAAC,EAAE,OAAO,CAAC,YAAY,CAAC,CAAC;IAC7B,GAAG,EAAE,MAAM,CAAC;IACZ,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB,IAAI,CAAC,EAAE,OAAO,CAAC;IACf,aAAa,CAAC,EAAE,OAAO,CAAC;IACxB,UAAU,CAAC,EAAE,OAAO,CAAC;IACrB,MAAM,CAAC,EAAE,CAAC,IAAI,EAAE,GAAG,EAAE,IAAI,EAAE,KAAK,GAAG,MAAM,KAAK,IAAI,CAAC;IACnD,OAAO,CAAC,EAAE,MAAM,IAAI,CAAC;IACrB,OAAO,CAAC,EAAE,CAAC,KAAK,EAAE,OAAO,KAAK,IAAI,CAAC;IACnC,QAAQ,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;IAC3B,SAAS,CAAC,EAAE,OAAO,CAAC;IACpB,gBAAgB,CAAC,EAAE,CAAC,CAAC,OAAO,CAAC,YAAY,CAAC,CAAC;IAC3C,cAAc,CAAC,EAAE,MAAM,CAAC,MAAM,EAAE,MAAM,CAAC,CAAC;IACxC,aAAa,CAAC,EAAE,OAAO,CAAC,MAAM,CAAC,MAAM,YAAY,GAAG,MAAM,EAAE,CAAC,IAAI,EAAE,GAAG,KAAK,OAAO,CAAC,CAAC,CAAC;IACrF,OAAO,CAAC,EAAE,MAAM,CAAC;IACjB,aAAa,CAAC,EAAE,MAAM,EAAE,CAAC;CAC1B;AAoCD,MAAM,CAAC,OAAO,UAAU,UAAU,CAAC,YAAY,SAAS,MAAM,CAAC,MAAM,EAAE,GAAG,CAAC,GAAG,MAAM,CAAC,MAAM,EAAE,GAAG,CAAC,EAAE,EACjG,IAAI,EACJ,GAAG,EACH,WAAW,EACX,IAAW,EACX,aAAqB,EACrB,UAAiB,EACjB,MAAM,EACN,OAAO,EACP,OAAO,EACP,QAAQ,EACR,SAAiB,EACjB,gBAAgB,EAChB,cAAc,EACd,aAAa,EACb,OAAY,EACZ,aAAkB,GACjB,EAAE,eAAe,CAAC,YAAY,CAAC,2CAyKjC"}

package/dist/components/form/inputs/FileUpload.d.ts

@@ -16,5 +16,5 @@ export interface FileUploadProps {
     axiosInstance?: AxiosInstance;
     mapResponseToAttachment?: (response: any, file: File) => Attachment;
 }
-export default function FileUpload({ title, name, uploadUrl, downloadBaseUrl, accept, headers, baseURL, axiosInstance, mapResponseToAttachment, }: FileUploadProps): import("react/jsx-runtime").JSX.Element;
+export default function FileUpload({ title, name, uploadUrl, downloadBaseUrl, accept, headers, baseURL, mapResponseToAttachment, }: FileUploadProps): import("react/jsx-runtime").JSX.Element;
 //# sourceMappingURL=FileUpload.d.ts.map

package/dist/components/form/inputs/FileUpload.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"FileUpload.d.ts","sourceRoot":"","sources":["../../../../src/components/form/inputs/FileUpload.tsx"],"names":[],"mappings":"AACA,OAAO,EAAe,MAAM,EAAE,MAAM,gBAAgB,CAAC;AACrD,OAAO,EAAE,aAAa,EAAsB,MAAM,OAAO,CAAC;AAU1D,MAAM,MAAM,UAAU,GAAG;IACvB,IAAI,EAAE,MAAM,CAAC;IACb,IAAI,EAAE,MAAM,CAAC;IACb,WAAW,CAAC,EAAE,MAAM,CAAC;CACtB,CAAC;AAEF,MAAM,WAAW,eAAe;IAC9B,IAAI,EAAE,MAAM,CAAC;IACb,KAAK,EAAE,MAAM,CAAC;IACd,SAAS,EAAE,MAAM,CAAC;IAClB,eAAe,CAAC,EAAE,MAAM,CAAC;IACzB,MAAM,CAAC,EAAE,MAAM,CAAC;IAChB,OAAO,CAAC,EAAE,MAAM,CAAC,MAAM,EAAE,MAAM,CAAC,CAAC;IACjC,OAAO,CAAC,EAAE,MAAM,CAAC;IACjB,aAAa,CAAC,EAAE,aAAa,CAAC;IAC9B,uBAAuB,CAAC,EAAE,CAAC,QAAQ,EAAE,GAAG,EAAE,IAAI,EAAE,IAAI,KAAK,UAAU,CAAC;CACrE;AAMD,MAAM,CAAC,OAAO,UAAU,UAAU,CAAC,EACjC,KAAK,EACL,IAAI,EACJ,SAAS,EACT,eAAe,EACf,MAAsB,EACtB,OAAO,EACP,OAAY,EACZ,aAAa,EACb,uBAAuB,GACxB,EAAE,eAAe,2CA+LjB"}
+{"version":3,"file":"FileUpload.d.ts","sourceRoot":"","sources":["../../../../src/components/form/inputs/FileUpload.tsx"],"names":[],"mappings":"AACA,OAAO,EAAe,MAAM,EAAE,MAAM,gBAAgB,CAAC;AACrD,OAAO,EAAE,aAAa,EAAsB,MAAM,OAAO,CAAC;AAS1D,MAAM,MAAM,UAAU,GAAG;IACvB,IAAI,EAAE,MAAM,CAAC;IACb,IAAI,EAAE,MAAM,CAAC;IACb,WAAW,CAAC,EAAE,MAAM,CAAC;CACtB,CAAC;AAEF,MAAM,WAAW,eAAe;IAC9B,IAAI,EAAE,MAAM,CAAC;IACb,KAAK,EAAE,MAAM,CAAC;IACd,SAAS,EAAE,MAAM,CAAC;IAClB,eAAe,CAAC,EAAE,MAAM,CAAC;IACzB,MAAM,CAAC,EAAE,MAAM,CAAC;IAChB,OAAO,CAAC,EAAE,MAAM,CAAC,MAAM,EAAE,MAAM,CAAC,CAAC;IACjC,OAAO,CAAC,EAAE,MAAM,CAAC;IACjB,aAAa,CAAC,EAAE,aAAa,CAAC;IAC9B,uBAAuB,CAAC,EAAE,CAAC,QAAQ,EAAE,GAAG,EAAE,IAAI,EAAE,IAAI,KAAK,UAAU,CAAC;CACrE;AAMD,MAAM,CAAC,OAAO,UAAU,UAAU,CAAC,EACjC,KAAK,EACL,IAAI,EACJ,SAAS,EACT,eAAe,EACf,MAAsB,EACtB,OAAO,EACP,OAAY,EACZ,uBAAuB,GACxB,EAAE,eAAe,2CA4LjB"}