refactor: update news types and enhance news data handling in components

app/routes/_news._index.tsx

@@ -1,5 +1,24 @@
+import { getCategories } from '~/apis/common/get-categories'
+import { getNews } from '~/apis/common/get-news'
 import { NewsPage } from '~/pages/news'
 
+import type { Route } from './+types/_news._index'
+
+export const loader = async ({}: Route.LoaderArgs) => {
+  const { data: categoriesData } = await getCategories()
+  const spotlightCode = 'spotlight'
+  const spotlightCategory = categoriesData.find(
+    (category) => category.code === spotlightCode,
+  )
+  const { data: spotlightNews } = await getNews({ categories: [spotlightCode] })
+  const beritaCode = 'berita'
+  const beritaCategory = categoriesData.find(
+    (category) => category.code === beritaCode,
+  )
+  const { data: beritaNews } = await getNews({ categories: [beritaCode] })
+  return { spotlightCategory, spotlightNews, beritaCategory, beritaNews }
+}
+
 const NewsIndexLayout = () => <NewsPage />
 
 export default NewsIndexLayout

app/routes/_news.detail.$slug.tsx

@@ -1,3 +1,5 @@
+import { getCategories } from '~/apis/common/get-categories'
+import { getNews } from '~/apis/common/get-news'
 import { getNewsBySlug } from '~/apis/common/get-news-by-slug'
 import { APP } from '~/configs/meta'
 import { handleCookie } from '~/libs/cookies'
@@ -11,9 +13,17 @@ export const loader = async ({ request, params }: Route.LoaderArgs) => {
     slug: params.slug,
     accessToken: userToken,
   })
+  const { data: categoriesData } = await getCategories()
+  const beritaCode = 'berita'
+  const beritaCategory = categoriesData.find(
+    (category) => category.code === beritaCode,
+  )
+  const { data: beritaNews } = await getNews({ categories: [beritaCode] })
 
   return {
     newsDetailData,
+    beritaCategory,
+    beritaNews,
   }
 }