Merge commit 'b42aa6c960d7adfc435a7386ae0d983df1b5739c'

app/apis/admin/get-staff.ts

@@ -0,0 +1,21 @@
+import { z } from 'zod'
+
+import { HttpServer, type THttpServer } from '~/libs/http-server'
+
+const staffSchema = z.object({
+  data: z.object({
+    id: z.string(),
+    email: z.string(),
+    username: z.string(),
+  }),
+})
+
+export const getStaff = async (parameters: THttpServer) => {
+  try {
+    const { data } = await HttpServer(parameters).get(`/api/staff/profile`)
+    return staffSchema.parse(data)
+  } catch (error) {
+    // eslint-disable-next-line unicorn/no-useless-promise-resolve-reject
+    return Promise.reject(error)
+  }
+}

app/apis/admin/login-staff.ts

@@ -0,0 +1,20 @@
+import { z } from 'zod'
+
+import { type TLoginSchema } from '~/layouts/news/form-login'
+import { HttpServer } from '~/libs/http-server'
+
+const loginResponseSchema = z.object({
+  data: z.object({
+    token: z.string(),
+  }),
+})
+
+export const staffLoginRequest = async (payload: TLoginSchema) => {
+  try {
+    const { data } = await HttpServer().post('/api/staff/login', payload)
+    return loginResponseSchema.parse(data)
+  } catch (error) {
+    // eslint-disable-next-line unicorn/no-useless-promise-resolve-reject
+    return Promise.reject(error)
+  }
+}

app/apis/news/login-user.ts

@@ -9,7 +9,7 @@ const loginResponseSchema = z.object({
   }),
 })
 
-export const newsLoginRequest = async (payload: TLoginSchema) => {
+export const userLoginRequest = async (payload: TLoginSchema) => {
   try {
     const { data } = await HttpServer().post('/api/user/login', payload)
     return loginResponseSchema.parse(data)

app/apis/news/register-user.ts

@@ -9,7 +9,7 @@ const loginResponseSchema = z.object({
   }),
 })
 
-export const newsRegisterRequest = async (payload: TRegisterSchema) => {
+export const userRegisterRequest = async (payload: TRegisterSchema) => {
   try {
     const { subscribe_plan, ...restPayload } = payload
     const transformedPayload = {

app/components/ui/banner.tsx

@@ -1,21 +1,38 @@
+import useEmblaCarousel from 'embla-carousel-react'
 import { Link } from 'react-router'
 
-import { APP } from '~/configs/meta'
+import { BANNER } from '~/data/contents'
 
 export const Banner = () => {
+  const [emblaReference] = useEmblaCarousel({ loop: false })
+
   return (
-    <div className="min-h-[65px]">
+    <div className="">
       <div className="relative">
-        <Link
+        <div
-          to="/#"
+          className="embla overflow-hidden"
-          className="mt-2 h-full py-2"
+          ref={emblaReference}
         >
-          <img
+          <div className="embla__container flex">
-            src={'/images/banner.png'}
+            {BANNER.map(({ urlImage, alt, link }, index) => (
-            alt={APP.title}
+              <div
-            className="h-[70px] w-[100%] content-center sm:h-full"
+                key={index}
-          />
+                className="embla__slide max-h-[100px] min-h-[65px] w-full min-w-0 flex-none"
-        </Link>
+              >
+                <Link
+                  to={link}
+                  className="mt-2 h-full py-2"
+                >
+                  <img
+                    src={urlImage}
+                    alt={alt}
+                    className="h-[70px] w-[100%] content-center sm:h-full"
+                  />
+                </Link>
+              </div>
+            ))}
+          </div>
+        </div>
       </div>
     </div>
   )

app/data/contents.ts

@@ -1,4 +1,9 @@
 import type { TNews } from '~/types/news'
+type TBanner = {
+  urlImage: string
+  alt: string
+  link: string
+}
 
 export const DUMMY_DESCRIPTION = 'Berita Terhangat hari ini'
 
@@ -147,3 +152,21 @@ export const KAJIAN: TNews = {
     },
   ],
 }
+
+export const BANNER: TBanner[] = [
+  {
+    urlImage: '/images/banner.png',
+    alt: 'banner',
+    link: '/category/spotlight',
+  },
+  {
+    urlImage: 'https://placehold.co/1000x65.png',
+    alt: 'banner',
+    link: '/#',
+  },
+  {
+    urlImage: '/images/banner.png',
+    alt: 'banner',
+    link: '/#',
+  },
+]

app/routes/_admin.lg-admin.tsx

@@ -1,7 +1,26 @@
 import { Outlet } from 'react-router'
 
+import { getStaff } from '~/apis/admin/get-staff'
 import { AdminProvider } from '~/contexts/admin'
 import { AdminDefaultLayout } from '~/layouts/admin/default'
+import { handleCookie } from '~/libs/cookies'
+
+import type { Route } from './+types/_admin.lg-admin'
+
+export const loader = async ({ request }: Route.LoaderArgs) => {
+  const { adminToken } = await handleCookie(request)
+  let adminData
+  if (adminToken) {
+    const { data } = await getStaff({
+      accessToken: adminToken,
+    })
+    adminData = data
+  }
+
+  return {
+    adminData,
+  }
+}
 
 const AdminLayout = () => {
   return (

app/routes/actions.login.ts

@@ -4,7 +4,7 @@ import { getValidatedFormData } from 'remix-hook-form'
 import { XiorError } from 'xior'
 
 import { getUser } from '~/apis/news/get-user'
-import { newsLoginRequest } from '~/apis/news/login'
+import { userLoginRequest } from '~/apis/news/login-user'
 import { loginSchema, type TLoginSchema } from '~/layouts/news/form-login'
 import { generateTokenCookie } from '~/utils/token'
 
@@ -26,7 +26,7 @@ export const action = async ({ request }: Route.ActionArgs) => {
       return data({ success: false, errors, defaultValues }, { status: 400 })
     }
 
-    const { data: loginData } = await newsLoginRequest(payload)
+    const { data: loginData } = await userLoginRequest(payload)
     const { token } = loginData
     const { data: userData } = await getUser({
       accessToken: token,

app/routes/actions.register.ts

@@ -4,7 +4,7 @@ import { getValidatedFormData } from 'remix-hook-form'
 import { XiorError } from 'xior'
 
 import { getUser } from '~/apis/news/get-user'
-import { newsRegisterRequest } from '~/apis/news/register'
+import { userRegisterRequest } from '~/apis/news/register-user'
 import {
   registerSchema,
   type TRegisterSchema,
@@ -29,7 +29,7 @@ export const action = async ({ request }: Route.ActionArgs) => {
       return data({ success: false, errors, defaultValues }, { status: 400 })
     }
 
-    const { data: registerData } = await newsRegisterRequest(payload)
+    const { data: registerData } = await userRegisterRequest(payload)
     const { token } = registerData
     const { data: userData } = await getUser({
       accessToken: token,