fix(dimentorin): For util React key + backoffice dashboard stats akurat

- For(): bungkus item dalam Fragment dgn key=idx — hilangkan warning
  'Each child in a list should have a unique key prop' di semua list backoffice
- Dashboard backoffice: fetch per_page=100 (bukan 5/1) supaya stat total
  akurat; Mentor Terdaftar dihitung dari user list role=Mentor (bukan
  unique mentor_id dalam 5 sesi pertama)

apps/dimentorin/src/app/(public)/mentoring/backoffice/page.tsx

@@ -58,21 +58,21 @@ const StatCard: FC<{
 );
 
 const Components: FC = (): ReactElement => {
-  const { data: users } = useGetUsersList({ page: 1, per_page: 1 });
-  const { data: sessions } = useGetAdminSessions({ page: 1, per_page: 5 });
+  const { data: users } = useGetUsersList({ page: 1, per_page: 100 });
+  const { data: sessions } = useGetAdminSessions({ page: 1, per_page: 100 });
   const { data: materials } = useGetMaterialsList();
 
   const stats = useMemo(() => {
     const all = sessions?.data ?? [];
-    const uniqueMentors = new Set(all.map((x) => x.mentor_id)).size;
+    const usersArr = users?.data ?? [];
     const byStatus = (s: string) => all.filter((x) => x.status === s).length;
     const withRating = all.filter((x) => x.rating != null).length;
     const avgRating = withRating
       ? all.reduce((acc, x) => acc + (x.rating ?? 0), 0) / withRating
       : 0;
     return {
-      totalUsers: users?.meta?.total ?? 0,
-      totalMentors: uniqueMentors,
+      totalUsers: users?.meta?.total ?? usersArr.length,
+      totalMentors: usersArr.filter((u) => (u.role as string)?.toLowerCase() === 'mentor').length,
       totalSessions: sessions?.meta?.total ?? 0,
       pending: byStatus('pending'),
       confirmed: byStatus('confirmed'),

libs/utils/src/logic/for.tsx

@@ -1,3 +1,5 @@
+import { Fragment } from 'react'
+
 export interface ForProps<T, U> {
   data: readonly T[]
   children: (item: T, index: number) => U | null
@@ -23,5 +25,7 @@ export function For<T, U extends React.JSX.Element>({
 }: ForProps<T, U>): (U | null)[] | React.ReactNode | null {
   if (!Array.isArray(data) || !data?.length) return fallback
 
-  return data.map((item, idx) => children(item, idx))
+  return data.map((item, idx) => (
+    <Fragment key={idx}>{children(item, idx)}</Fragment>
+  ))
 }