Files
LogisicsApp_Client/src/hooks/useClients.ts
m7amedez5511 db64b79fe3 first action update user pages .
2-update driver pages [fixed image display and notyfi]
3-update car pages [fixed image]
4-build tripe pages crud
5-build some role pages
6-build audit page
7-update ui compounants
8-update saidebar and topbar
9-cheange view to be ar view
10-cheange stractcher to be app,src
11-add validation layer by yup
12-add api image-proxy to broke image corse bloken
2026-06-23 15:54:07 +03:00

191 lines
6.6 KiB
TypeScript

"use client";
import { useCallback, useEffect, useReducer, useState } from "react";
import { getStoredToken } from "@/src/lib/auth";
import { clientService } from "@/src/services/client.service";
import type {
Client,
ClientFormData,
ClientTableAction,
ClientTableState,
} from "@/src/types/client";
// ── Notification (mirrors useUsers Notification) ───────────────────────────
export interface Notification {
type: "success" | "error";
message: string;
}
// ── Reducer ────────────────────────────────────────────────────────────────
function reducer(s: ClientTableState, a: ClientTableAction): ClientTableState {
switch (a.type) {
case "LOAD_START":
return { ...s, loading: true, error: null };
case "LOAD_OK":
return {
...s,
loading: false,
clients: a.clients,
total: a.total,
pages: a.pages,
};
case "LOAD_ERR":
return { ...s, loading: false, error: a.error };
case "ADD":
return { ...s, clients: [a.client, ...s.clients], total: s.total + 1 };
case "UPDATE":
return {
...s,
clients: s.clients.map((c) => (c.id === a.client.id ? a.client : c)),
};
case "DELETE":
return {
...s,
clients: s.clients.filter((c) => c.id !== a.id),
total: Math.max(0, s.total - 1),
};
case "CLEAR_ERR":
return { ...s, error: null };
default:
return s;
}
}
const initialState: ClientTableState = {
clients: [],
loading: true,
total: 0,
pages: 1,
error: null,
};
// ── Main hook ──────────────────────────────────────────────────────────────
export function useClients() {
const [state, dispatch] = useReducer(reducer, initialState);
const [search, setSearch] = useState("");
const [page, setPage] = useState(1);
const [notification, setNotification] = useState<Notification | null>(null);
const [roles, setRoles] = useState<[]>([]); // placeholder — extend if needed
const [branches, setBranches] = useState<[]>([]); // placeholder — extend if needed
/** Show a toast for 4 seconds then auto-dismiss — identical to useUsers. */
const notify = useCallback((n: Notification) => {
setNotification(n);
setTimeout(() => setNotification(null), 4000);
}, []);
// ── Fetch clients ────────────────────────────────────────────────────────
const loadClients = useCallback(async (p: number, q: string) => {
dispatch({ type: "LOAD_START" });
try {
const token = getStoredToken();
const res = await clientService.getAll(p, q, token);
// Normalise both pagination shapes the backend might return
const payload = (res as any).data ?? res;
dispatch({
type: "LOAD_OK",
clients: payload.data ?? [],
total: payload.meta?.total ?? payload.pagination?.total ?? 0,
pages: payload.meta?.pages ?? payload.pagination?.pages ?? 1,
});
} catch {
dispatch({
type: "LOAD_ERR",
error: "تعذّر تحميل بيانات العملاء. يرجى المحاولة مجدداً.",
});
}
}, []);
// Reload whenever page or search changes
useEffect(() => {
loadClients(page, search);
}, [page, search, loadClients]);
// ── Search helper (resets to page 1) ────────────────────────────────────
const handleSearch = useCallback((q: string) => {
setSearch(q);
setPage(1);
}, []);
// ── CREATE ───────────────────────────────────────────────────────────────
const createClient = useCallback(
async (data: ClientFormData): Promise<boolean> => {
try {
const token = getStoredToken();
const res = await clientService.create(data, token);
dispatch({ type: "ADD", client: res.data });
notify({ type: "success", message: "تم إضافة العميل بنجاح." });
return true;
} catch (err) {
notify({
type: "error",
message: err instanceof Error ? err.message : "تعذّر إضافة العميل.",
});
return false;
}
},
[notify],
);
// ── UPDATE ───────────────────────────────────────────────────────────────
const updateClient = useCallback(
async (id: string, data: ClientFormData): Promise<boolean> => {
try {
const token = getStoredToken();
const res = await clientService.update(id, data, token);
dispatch({ type: "UPDATE", client: res.data });
notify({ type: "success", message: "تم تحديث بيانات العميل." });
return true;
} catch (err) {
notify({
type: "error",
message: err instanceof Error ? err.message : "تعذّر تحديث العميل.",
});
return false;
}
},
[notify],
);
// ── DELETE ───────────────────────────────────────────────────────────────
const deleteClient = useCallback(
async (id: string): Promise<boolean> => {
try {
const token = getStoredToken();
await clientService.delete(id, token);
dispatch({ type: "DELETE", id });
notify({ type: "success", message: "تم حذف العميل بنجاح." });
return true;
} catch (err) {
notify({
type: "error",
message: err instanceof Error ? err.message : "تعذّر حذف العميل.",
});
return false;
}
},
[notify],
);
return {
// table state
...state,
// pagination & search
page,
search,
setPage,
handleSearch,
clearError: () => dispatch({ type: "CLEAR_ERR" }),
// CRUD
createClient,
updateClient,
deleteClient,
// toast
notification,
// extras (currently unused, kept for future parity with useUsers)
roles,
branches,
reload: () => loadClients(page, search),
};
}