fixing so much trouble

apps/backoffice/src/app/(protected)/accounts/page.tsx

@@ -18,7 +18,7 @@ import {
   RowSelectionState,
 } from '@tanstack/react-table';
 import ModalEditAccount from './_components/modal-edit-account';
-import { useQueryState } from '../../hook/use-query-state';
+import { useQueryState } from '@imphnen-frontend-service/utils';
 
 interface Account {
   id: number;
@@ -166,7 +166,7 @@ export const Components: FC = (): ReactElement => {
               </Button>
               {showFilter && (
                 <div className="absolute right-0 top-[calc(100%+12px)] z-10 shadow-lg">
-                  <Filter onClose={() => setShowFilter(false)} />
+                  <Filter onClose={() => setShowFilter(false)} options={[]} />
                 </div>
               )}
             </div>

apps/backoffice/src/app/(protected)/dashboard/page.tsx

@@ -10,7 +10,7 @@ import { FC, Fragment, ReactElement, useState } from 'react';
 import ModalAddItem from './_components/modal-add-item';
 import ModalEditItem from './_components/modal-edit-item';
 import ModalDeleteItem from './_components/modal-delete-item';
-import { useQueryState } from '../../hook/use-query-state';
+import { useQueryState } from '@imphnen-frontend-service/utils';
 
 export const Components: FC = (): ReactElement => {
   const [showModalAddItem, setShowModalAddItem] = useState(false);

apps/backoffice/src/app/(public)/auth/login/_hooks/use-login.ts

@@ -2,24 +2,19 @@ import { useForm } from 'react-hook-form';
 import {
   authLoginSchema,
   TLoginRequest,
-  usePostLogin,
 } from '@imphnen-frontend-service/service';
 import { zodResolver } from '@hookform/resolvers/zod';
-import { toast } from 'sonner';
+import { useSession } from '@imphnen-frontend-service/utils';
 
 export const useLogin = () => {
-  const postLogin = usePostLogin();
   const form = useForm<TLoginRequest>({
     resolver: zodResolver(authLoginSchema),
     mode: 'all',
   });
 
-  const onSubmit = form.handleSubmit((data) => {
-    postLogin.mutate(data, {
-      onSuccess: () => toast.success("Login sukses"),
-      onError: (error) => toast.error(error.message),
-    });
-  });
+  const { signIn } = useSession();
+
+  const onSubmit = form.handleSubmit((data) => signIn(data));
 
   return {
     form,

apps/backoffice/src/app/(public)/auth/login/page.tsx

@@ -32,7 +32,16 @@ export const Components: FC = (): ReactElement => {
             size="lg"
             className="w-full"
           />
-          <Button type="submit" size="md" className="w-full">
+          <Button
+            disabled={
+              form.formState.isSubmitting ||
+              form.formState.isValidating ||
+              !form.formState.isValid
+            }
+            type="submit"
+            size="md"
+            className="w-full"
+          >
             Login
           </Button>
         </form>

apps/backoffice/src/app/dashboard/layout.tsx

@@ -1,18 +0,0 @@
-import { FC, ReactElement } from 'react';
-import { Outlet } from 'react-router-dom';
-import { BackofficeSidebar } from '@imphnen-frontend-service/ui/organisms';
-
-export const AppLayout: FC = (): ReactElement => {
-  return (
-    <div className="bg-primary-50 min-h-screen flex justify-center">
-      <div className="bg-primary-50 min-h-screen w-full flex">
-        <BackofficeSidebar />
-        <div className="flex-1 overflow-auto lg:max-w-[1000px] 2xl:max-w-[1280px] mx-auto">
-          <Outlet />
-        </div>
-      </div>
-    </div>
-  );
-};
-
-export default AppLayout;

apps/backoffice/src/app/gacha-roll/layout.tsx

@@ -1,18 +0,0 @@
-import { FC, ReactElement } from 'react';
-import { Outlet } from 'react-router-dom';
-import { BackofficeSidebar } from '@imphnen-frontend-service/ui/organisms';
-
-export const AppLayout: FC = (): ReactElement => {
-  return (
-    <div className="bg-primary-50 min-h-screen flex justify-center">
-      <div className="bg-primary-50 min-h-screen w-full flex">
-        <BackofficeSidebar />
-        <div className="flex-1 overflow-auto lg:max-w-[1000px] 2xl:max-w-[1280px] mx-auto">
-          <Outlet />
-        </div>
-      </div>
-    </div>
-  );
-};
-
-export default AppLayout;

apps/backoffice/src/app/permissions/layout.tsx

@@ -1,18 +0,0 @@
-import { FC, ReactElement } from 'react';
-import { Outlet } from 'react-router-dom';
-import { BackofficeSidebar } from '@imphnen-frontend-service/ui/organisms';
-
-export const AppLayout: FC = (): ReactElement => {
-  return (
-    <div className="bg-primary-50 min-h-screen flex justify-center">
-      <div className="bg-primary-50 min-h-screen w-full flex">
-        <BackofficeSidebar />
-        <div className="flex-1 overflow-auto lg:max-w-[1000px] 2xl:max-w-[1280px] mx-auto">
-          <Outlet />
-        </div>
-      </div>
-    </div>
-  );
-};
-
-export default AppLayout;

apps/backoffice/src/app/prizes/layout.tsx

@@ -1,18 +0,0 @@
-import { FC, ReactElement } from 'react';
-import { Outlet } from 'react-router-dom';
-import { BackofficeSidebar } from '@imphnen-frontend-service/ui/organisms';
-
-export const AppLayout: FC = (): ReactElement => {
-  return (
-    <div className="bg-primary-50 min-h-screen flex justify-center">
-      <div className="bg-primary-50 min-h-screen w-full flex">
-        <BackofficeSidebar />
-        <div className="flex-1 overflow-auto lg:max-w-[1000px] 2xl:max-w-[1280px] mx-auto">
-          <Outlet />
-        </div>
-      </div>
-    </div>
-  );
-};
-
-export default AppLayout;

apps/backoffice/src/app/roles/layout.tsx

@@ -1,18 +0,0 @@
-import { FC, ReactElement } from 'react';
-import { Outlet } from 'react-router-dom';
-import { BackofficeSidebar } from '@imphnen-frontend-service/ui/organisms';
-
-export const AppLayout: FC = (): ReactElement => {
-  return (
-    <div className="bg-primary-50 min-h-screen flex justify-center">
-      <div className="bg-primary-50 min-h-screen w-full flex">
-        <BackofficeSidebar />
-        <div className="flex-1 overflow-auto lg:max-w-[1000px] 2xl:max-w-[1280px] mx-auto">
-          <Outlet />
-        </div>
-      </div>
-    </div>
-  );
-};
-
-export default AppLayout;

apps/backoffice/src/app/transactions/layout.tsx

@@ -1,18 +0,0 @@
-import { FC, ReactElement } from 'react';
-import { Outlet } from 'react-router-dom';
-import { BackofficeSidebar } from '@imphnen-frontend-service/ui/organisms';
-
-export const AppLayout: FC = (): ReactElement => {
-  return (
-    <div className="bg-primary-50 min-h-screen flex justify-center">
-      <div className="bg-primary-50 min-h-screen w-full flex">
-        <BackofficeSidebar />
-        <div className="flex-1 overflow-auto lg:max-w-[1000px] 2xl:max-w-[1280px] mx-auto">
-          <Outlet />
-        </div>
-      </div>
-    </div>
-  );
-};
-
-export default AppLayout;

apps/backoffice/src/middleware.ts

@@ -1,11 +1,108 @@
-import { LoaderFunctionArgs } from 'react-router-dom';
+import {
+  PERMISSIONS,
+  SessionToken,
+  SessionUser,
+} from '@imphnen-frontend-service/utils';
+import { LoaderFunctionArgs, redirect } from 'react-router';
+
+const mappingPublicRoutes = [
+  '/auth/login',
+  '/auth/forgot',
+  '/auth/new-password',
+];
+
+const mappingRoutePermissions = [
+  {
+    path: '/dashboard',
+    permissions: [],
+  },
+  {
+    path: '/users',
+    permissions: [PERMISSIONS.USERS.READ_LIST],
+  },
+  {
+    path: '/users/create',
+    permissions: [PERMISSIONS.USERS.CREATE],
+  },
+  {
+    path: '/users/update',
+    permissions: [PERMISSIONS.USERS.UPDATE],
+  },
+  {
+    path: '/users/detail',
+    permissions: [PERMISSIONS.USERS.READ_DETAIL],
+  },
+  {
+    path: '/roles',
+    permissions: [PERMISSIONS.ROLES.READ_LIST],
+  },
+  {
+    path: '/roles/create',
+    permissions: [PERMISSIONS.ROLES.CREATE],
+  },
+  {
+    path: '/roles/update',
+    permissions: [PERMISSIONS.ROLES.UPDATE],
+  },
+  {
+    path: '/roles/detail',
+    permissions: [PERMISSIONS.ROLES.READ_DETAIL],
+  },
+  {
+    path: '/permissions',
+    permissions: [PERMISSIONS.PERMISSIONS.READ_LIST],
+  },
+  {
+    path: '/permissions/create',
+    permissions: [PERMISSIONS.PERMISSIONS.CREATE],
+  },
+  {
+    path: '/permissions/update',
+    permissions: [PERMISSIONS.PERMISSIONS.UPDATE],
+  },
+  {
+    path: '/permissions/detail',
+    permissions: [PERMISSIONS.PERMISSIONS.READ_DETAIL],
+  },
+];
+
+//TODO : Fix this later
+// const redirectToFirstAccessibleRoute = (userPermissions: string[]) => {
+//   const fallback = mappingRoutePermissions.find((route) =>
+//     route.permissions.some((perm) => userPermissions.includes(perm))
+//   );
+//   return redirect(fallback?.path ?? '/auth/login');
+// };
 
 export const middleware = async ({ request }: LoaderFunctionArgs) => {
   const url = new URL(request.url);
-
   const pathname = url.pathname;
+  const session = SessionUser.get();
+  const session_token = SessionToken.get();
+  const token = session_token?.token?.access_token;
+  const userPermissions =
+    session?.role?.permissions?.map?.((perm) => perm?.name) ?? [];
 
-  if (pathname) return null;
+  if (mappingPublicRoutes.includes(pathname)) {
+    if (token) return redirect('/dashboard');
+    return null;
+  }
+
+  if (!session) return redirect('/auth/login');
+
+  const matchedRoute = mappingRoutePermissions.find(
+    (route) => route.path === pathname
+  );
+
+  if (matchedRoute) {
+    const hasPermission =
+      !matchedRoute.permissions ||
+      matchedRoute.permissions.some((perm) => userPermissions.includes(perm));
+
+    if (!hasPermission) {
+      return '/dashboard';
+    }
+  }
 
   return null;
 };

apps/dimentorin/src/app/_hooks/use-login.ts

@@ -2,24 +2,19 @@ import { useForm } from 'react-hook-form';
 import {
   authLoginSchema,
   TLoginRequest,
-  usePostLogin,
 } from '@imphnen-frontend-service/service';
 import { zodResolver } from '@hookform/resolvers/zod';
-import { toast } from 'sonner';
+import { useSession } from '@imphnen-frontend-service/utils';
 
 export const useLogin = () => {
-  const postLogin = usePostLogin();
   const form = useForm<TLoginRequest>({
     resolver: zodResolver(authLoginSchema),
     mode: 'all',
   });
 
-  const onSubmit = form.handleSubmit((data) => {
-    postLogin.mutate(data, {
-      onSuccess: () => toast.success("Login sukses"),
-      onError: (error) => toast.error(error.message),
-    });
-  });
+  const { signIn } = useSession();
+
+  const onSubmit = form.handleSubmit((data) => signIn(data));
 
   return {
     form,

apps/dimentorin/src/middleware.ts

@@ -1,11 +1,109 @@
-import { LoaderFunctionArgs } from 'react-router-dom';
+import {
+  PERMISSIONS,
+  SessionToken,
+  SessionUser,
+} from '@imphnen-frontend-service/utils';
+import { LoaderFunctionArgs, redirect } from 'react-router';
+
+const mappingPublicRoutes = [
+  '/',
+  '/auth/login',
+  '/auth/forgot',
+  '/auth/new-password',
+];
+
+const mappingRoutePermissions = [
+  {
+    path: '/dashboard',
+    permissions: [],
+  },
+  {
+    path: '/users',
+    permissions: [PERMISSIONS.USERS.READ_LIST],
+  },
+  {
+    path: '/users/create',
+    permissions: [PERMISSIONS.USERS.CREATE],
+  },
+  {
+    path: '/users/update',
+    permissions: [PERMISSIONS.USERS.UPDATE],
+  },
+  {
+    path: '/users/detail',
+    permissions: [PERMISSIONS.USERS.READ_DETAIL],
+  },
+  {
+    path: '/roles',
+    permissions: [PERMISSIONS.ROLES.READ_LIST],
+  },
+  {
+    path: '/roles/create',
+    permissions: [PERMISSIONS.ROLES.CREATE],
+  },
+  {
+    path: '/roles/update',
+    permissions: [PERMISSIONS.ROLES.UPDATE],
+  },
+  {
+    path: '/roles/detail',
+    permissions: [PERMISSIONS.ROLES.READ_DETAIL],
+  },
+  {
+    path: '/permissions',
+    permissions: [PERMISSIONS.PERMISSIONS.READ_LIST],
+  },
+  {
+    path: '/permissions/create',
+    permissions: [PERMISSIONS.PERMISSIONS.CREATE],
+  },
+  {
+    path: '/permissions/update',
+    permissions: [PERMISSIONS.PERMISSIONS.UPDATE],
+  },
+  {
+    path: '/permissions/detail',
+    permissions: [PERMISSIONS.PERMISSIONS.READ_DETAIL],
+  },
+];
+
+//TODO : Fix this later
+// const redirectToFirstAccessibleRoute = (userPermissions: string[]) => {
+//   const fallback = mappingRoutePermissions.find((route) =>
+//     route.permissions.some((perm) => userPermissions.includes(perm))
+//   );
+//   return redirect(fallback?.path ?? '/auth/login');
+// };
 
 export const middleware = async ({ request }: LoaderFunctionArgs) => {
   const url = new URL(request.url);
-
   const pathname = url.pathname;
+  const session = SessionUser.get();
+  const session_token = SessionToken.get();
+  const token = session_token?.token?.access_token;
+  const userPermissions =
+    session?.role?.permissions?.map?.((perm) => perm?.name) ?? [];
 
-  if (pathname) return null;
+  if (mappingPublicRoutes.includes(pathname)) {
+    if (token) return redirect('/dashboard');
+    return null;
+  }
+
+  if (!session) return redirect('/auth/login');
+
+  const matchedRoute = mappingRoutePermissions.find(
+    (route) => route.path === pathname
+  );
+
+  if (matchedRoute) {
+    const hasPermission =
+      !matchedRoute.permissions ||
+      matchedRoute.permissions.some((perm) => userPermissions.includes(perm));
+
+    if (!hasPermission) {
+      return '/dashboard';
+    }
+  }
 
   return null;
 };

apps/gacha/src/app/_hooks/use-login.ts

@@ -2,22 +2,19 @@ import { useForm } from 'react-hook-form';
 import {
   authLoginSchema,
   TLoginRequest,
-  usePostLogin,
 } from '@imphnen-frontend-service/service';
 import { zodResolver } from '@hookform/resolvers/zod';
+import { useSession } from '@imphnen-frontend-service/utils';
 
 export const useLogin = () => {
-  const postLogin = usePostLogin();
   const form = useForm<TLoginRequest>({
     resolver: zodResolver(authLoginSchema),
     mode: 'all',
   });
 
-  const onSubmit = form.handleSubmit((data) => {
-    postLogin.mutate(data, {
-      onSuccess: () => console.log('Success Login'),
-    });
-  });
+  const { signIn } = useSession();
+
+  const onSubmit = form.handleSubmit((data) => signIn(data));
 
   return {
     form,

apps/gacha/src/app/_hooks/use-register.ts

@@ -1,14 +1,11 @@
 import { useForm } from 'react-hook-form';
 import {
   authRegisterSchema,
-  stepOneRegisterSchema,
   TRegisterRequest,
   usePostRegister,
 } from '@imphnen-frontend-service/service';
-import { z } from 'zod';
 import { zodResolver } from '@hookform/resolvers/zod';
 import { toast } from 'sonner';
-import { useEffect, useState } from 'react';
 
 export const useRegister = () => {
   const postRegister = usePostRegister();
@@ -21,31 +18,12 @@ export const useRegister = () => {
       password: '',
       confirm_password: '',
       phone_number: '',
-      referral_code: '',
-      referred_by: '',
-      student_type: '',
     },
   });
 
-  const [stepValid, setStepValid] = useState(false);
-
-  useEffect(() => {
-    const subscription = form.watch(() => {
-      const { fullname, email, password, confirm_password } = form.getValues();
-      const valid = stepOneRegisterSchema.safeParse({
-        fullname,
-        email,
-        password,
-        confirm_password,
-      }).success;
-      setStepValid(valid);
-    });
-    return () => subscription.unsubscribe();
-  }, [form]);
-
   const onSubmit = form.handleSubmit((data) => {
     postRegister.mutate(data, {
-      onSuccess: (data) => toast.success(data.message),
+      onSuccess: () => toast.success('Registrasi sukses'),
       onError: (error) => toast.error(error.message),
     });
   });
@@ -53,6 +31,5 @@ export const useRegister = () => {
   return {
     form,
     onSubmit,
-    isStepOneValid: stepValid,
   };
 };

apps/gacha/src/middleware.ts

@@ -1,11 +1,109 @@
-import { LoaderFunctionArgs } from 'react-router-dom';
+import {
+  PERMISSIONS,
+  SessionToken,
+  SessionUser,
+} from '@imphnen-frontend-service/utils';
+import { LoaderFunctionArgs, redirect } from 'react-router';
+
+const mappingPublicRoutes = [
+  '/',
+  '/auth/login',
+  '/auth/forgot',
+  '/auth/new-password',
+];
+
+const mappingRoutePermissions = [
+  {
+    path: '/dashboard',
+    permissions: [],
+  },
+  {
+    path: '/users',
+    permissions: [PERMISSIONS.USERS.READ_LIST],
+  },
+  {
+    path: '/users/create',
+    permissions: [PERMISSIONS.USERS.CREATE],
+  },
+  {
+    path: '/users/update',
+    permissions: [PERMISSIONS.USERS.UPDATE],
+  },
+  {
+    path: '/users/detail',
+    permissions: [PERMISSIONS.USERS.READ_DETAIL],
+  },
+  {
+    path: '/roles',
+    permissions: [PERMISSIONS.ROLES.READ_LIST],
+  },
+  {
+    path: '/roles/create',
+    permissions: [PERMISSIONS.ROLES.CREATE],
+  },
+  {
+    path: '/roles/update',
+    permissions: [PERMISSIONS.ROLES.UPDATE],
+  },
+  {
+    path: '/roles/detail',
+    permissions: [PERMISSIONS.ROLES.READ_DETAIL],
+  },
+  {
+    path: '/permissions',
+    permissions: [PERMISSIONS.PERMISSIONS.READ_LIST],
+  },
+  {
+    path: '/permissions/create',
+    permissions: [PERMISSIONS.PERMISSIONS.CREATE],
+  },
+  {
+    path: '/permissions/update',
+    permissions: [PERMISSIONS.PERMISSIONS.UPDATE],
+  },
+  {
+    path: '/permissions/detail',
+    permissions: [PERMISSIONS.PERMISSIONS.READ_DETAIL],
+  },
+];
+
+//TODO : Fix this later
+// const redirectToFirstAccessibleRoute = (userPermissions: string[]) => {
+//   const fallback = mappingRoutePermissions.find((route) =>
+//     route.permissions.some((perm) => userPermissions.includes(perm))
+//   );
+//   return redirect(fallback?.path ?? '/auth/login');
+// };
 
 export const middleware = async ({ request }: LoaderFunctionArgs) => {
   const url = new URL(request.url);
-
   const pathname = url.pathname;
+  const session = SessionUser.get();
+  const session_token = SessionToken.get();
+  const token = session_token?.token?.access_token;
+  const userPermissions =
+    session?.role?.permissions?.map?.((perm) => perm?.name) ?? [];
 
-  if (pathname) return null;
+  if (mappingPublicRoutes.includes(pathname)) {
+    if (token) return redirect('/dashboard');
+    return null;
+  }
+
+  if (!session) return redirect('/auth/login');
+
+  const matchedRoute = mappingRoutePermissions.find(
+    (route) => route.path === pathname
+  );
+
+  if (matchedRoute) {
+    const hasPermission =
+      !matchedRoute.permissions ||
+      matchedRoute.permissions.some((perm) => userPermissions.includes(perm));
+
+    if (!hasPermission) {
+      return '/dashboard';
+    }
+  }
 
   return null;
 };

libs/service/src/hooks/auth/index.ts

@@ -6,7 +6,6 @@ import {
   TRegisterRequest,
   TVerifyEmailRequest,
 } from '../../types/auth';
-import { SessionToken, SessionUser } from '@imphnen-frontend-service/utils';
 
 import { TResponseError, TResponseMessage } from '../../types/common';
 
@@ -19,11 +18,6 @@ export const usePostLogin = (): UseMutationResult<
   return useMutation({
     mutationKey: ['post-login'],
     mutationFn: async (payload) => await postLogin(payload),
-    onSuccess: (res) => {
-      SessionUser.set(res.data.user);
-      SessionToken.set(res.data.token);
-      window.location.reload();
-    },
   });
 };
 

libs/service/src/schemas/auth/index.ts

@@ -16,7 +16,7 @@ export const authLoginSchema = z.object({
     .min(1, 'Password tidak boleh kosong'),
 });
 
-export const stepOneRegisterSchema = z
+export const authRegisterSchema = z
   .object({
     email: z
       .string({
@@ -25,6 +25,12 @@ export const stepOneRegisterSchema = z
       })
       .min(1, 'Email tidak boleh kosong')
       .email('Email harus valid'),
+    phone_number: z
+      .string({
+        required_error: 'Nomor telepon tidak boleh kosong',
+      })
+      .min(1, 'Nomor telepon tidak boleh kosong')
+      .max(15, 'Nomor telepon tidak boleh lebih dari 15 digit'),
     fullname: z
       .string({
         required_error: 'Nama tidak boleh kosong',
@@ -51,28 +57,3 @@ export const stepOneRegisterSchema = z
     message: 'Password dan Konfirmasi Password harus sama',
     path: ['confirm_password'],
   });
-
-const stepTwoRegisterSchema = z.object({
-  phone_number: z
-    .string({
-      required_error: 'Nomor telepon tidak boleh kosong',
-      invalid_type_error: 'Nomor telepon harus berupa string',
-    })
-    .min(1, 'Nomor telepon tidak boleh kosong')
-    .max(15, 'Nomor telepon tidak boleh lebih dari 15 karakter'),
-  referral_code: z
-    .string()
-    .min(1, 'Kode referral tidak boleh kosong')
-    .max(4, 'Kode referral tidak boleh lebih dari 4 karakter')
-    .optional(),
-  referred_by: z
-    .string()
-    .min(1, 'Kode referral tidak boleh kosong')
-    .max(50, 'Kode referral tidak boleh lebih dari 50 karakter')
-    .optional(),
-  student_type: z.string(),
-});
-
-export const authRegisterSchema = stepOneRegisterSchema.and(
-  stepTwoRegisterSchema
-);

libs/service/src/types/auth/index.ts

@@ -1,29 +1,26 @@
+import { z } from 'zod';
+import { authLoginSchema, authRegisterSchema } from '../../schemas';
+import { TResponseDetail, TResponseMessage } from '../common';
 import { TUserItem } from '../users';
 
-export type TLoginRequest = {
-  email: string;
-  password: string;
+export type TTokenItem = {
+  access_token: string;
+  refresh_token: string;
 };
 
-export type TLoginResponse = {
-  data: {
-    token: {
-      access_token: string;
-      refresh_token: string;
-    };
-    user: TUserItem;
-  };
+export type TLoginItem = {
+  token?: TTokenItem;
+  user?: TUserItem;
 };
 
-export type TRegisterRequest = {
-  email: string;
-  fullname: string;
-  password: string;
-  phone_number: string;
-  referral_code?: string;
-  referred_by?: string;
-  student_type: string;
-  confirm_password: string;
+export type TLoginRequest = z.infer<typeof authLoginSchema>;
+export type TLoginResponse = TResponseDetail<TLoginItem>;
+
+export type TRegisterRequest = z.infer<typeof authRegisterSchema>;
+export type TRegisterResponse = TResponseDetail<TResponseMessage>;
+
+export type TVerifyOtpRequest = {
+  otp: number;
 };
 
 export type TVerifyEmailRequest = {

libs/service/src/types/common/index.ts

@@ -1,7 +1,19 @@
 import { AxiosError } from 'axios';
 
-export type TResponse<T = unknown> = {
+export type TMetaResponse = {
+  page: number;
+  per_page: number;
+  total: number;
+};
+
+export type TResponseDetail<T = unknown> = {
   data: T;
+  message: string;
+};
+
+export type TResponseList<T = unknown> = {
+  data: T[];
+  meta: TMetaResponse;
 };
 
 export type TResponseMessage = {

libs/service/src/types/roles/index.ts

@@ -1,9 +1,17 @@
 import { TPermissionItem } from '../permissions';
 
-export type TRoleItem = {
+export type TRoleDetailItem = {
   id: string;
   name: string;
+  permissions: TPermissionItem[];
+  created_at: string;
+  updated_at: string;
+};
+
+export type TRolesListItem = {
+  id: string;
+  name: string;
+  permissions_count: number;
   created_at: string;
   updated_at: string;
-  permissions: TPermissionItem[];
 };

libs/service/src/types/users/index.ts

@@ -1,4 +1,4 @@
-import { TRoleItem } from '../roles';
+import { TRoleDetailItem } from '../roles';
 
 export type TUserItem = {
   id: string;
@@ -7,13 +7,7 @@ export type TUserItem = {
   email: string;
   fullname: string;
   gender: string;
-  identity_number: string;
   is_active: boolean;
-  is_profile_completed: boolean;
   phone_number: string;
-  referral_code: string;
-  referred_by: string;
-  religion: string;
-  student_type: string;
-  role: TRoleItem;
+  role: TRoleDetailItem;
 };

libs/utils/src/constants/index.ts

@@ -0,0 +1 @@
+export * from './permissions';

libs/utils/src/constants/permissions.ts

@@ -0,0 +1,40 @@
+export const PERMISSIONS = {
+  USERS: {
+    READ_LIST: 'Read List Users',
+    READ_DETAIL: 'Read Detail Users',
+    CREATE: 'Create Users',
+    UPDATE: 'Update Users',
+    DELETE: 'Delete Users',
+    ACTIVATE: 'Activate Users',
+  },
+  ROLES: {
+    READ_LIST: 'Read List Roles',
+    READ_DETAIL: 'Read Detail Roles',
+    CREATE: 'Create Roles',
+    UPDATE: 'Update Roles',
+    DELETE: 'Delete Roles',
+  },
+  PERMISSIONS: {
+    READ_LIST: 'Read List Permissions',
+    READ_DETAIL: 'Read Detail Permissions',
+    CREATE: 'Create Permissions',
+    UPDATE: 'Update Permissions',
+    DELETE: 'Delete Permissions',
+  },
+  GACHA_CLAIMS: {
+    CREATE: 'Create Gacha Claims',
+    READ_DETAIL: 'Read Detail Gacha Claims',
+  },
+  GACHA_ITEMS: {
+    READ_LIST: 'Read List Gacha Items',
+    READ_DETAIL: 'Read Detail Gacha Items',
+    CREATE: 'Create Gacha Items',
+    UPDATE: 'Update Gacha Items',
+    DELETE: 'Delete Gacha Items',
+  },
+  GACHA_ROLLS: {
+    READ_DETAIL: 'Read Detail Gacha Rolls',
+    CREATE: 'Create Gacha Rolls',
+    EXECUTE: 'Execute Gacha Rolls',
+  },
+};