refactor: reorganize API imports and simplify parameter handling in various components

app/apis/admin/update-tag.ts

@@ -15,10 +15,10 @@ type TParameters = {
 }
 
 export const updateTagRequest = async (parameters: TParameters) => {
-  const { accessToken, payload } = parameters
+  const { payload, ...restParameters } = parameters
-  try {
   const { id, ...restPayload } = payload
-    const { data } = await HttpServer({ accessToken }).put(
+  try {
+    const { data } = await HttpServer(restParameters).put(
       `/api/tag/${id}/update`,
       restPayload,
     )

app/apis/common/get-news-by-slug.ts

@@ -1,6 +1,6 @@
 import { z } from 'zod'
 
-import { newsResponseSchema } from '~/apis/admin/get-news'
+import { newsResponseSchema } from '~/apis/common/get-news'
 import { HttpServer, type THttpServer } from '~/libs/http-server'
 
 const dataResponseSchema = z.object({

app/apis/common/get-news.ts

@@ -30,10 +30,20 @@ const dataResponseSchema = z.object({
 
 export type TNewsResponse = z.infer<typeof newsResponseSchema>
 export type TAuthor = z.infer<typeof authorSchema>
+type TParameters = {
+  categories?: string[]
+  tags?: string[]
+} & THttpServer
 
-export const getNews = async (parameters: THttpServer) => {
+export const getNews = async (parameters: TParameters) => {
+  const { categories, tags, ...restParameters } = parameters
   try {
-    const { data } = await HttpServer(parameters).get(`/api/news`)
+    const { data } = await HttpServer(restParameters).get(`/api/news`, {
+      params: {
+        ...(categories && { categories: categories.join('+') }),
+        ...(tags && { tags: tags.join('+') }),
+      },
+    })
     return dataResponseSchema.parse(data)
   } catch (error) {
     // eslint-disable-next-line unicorn/no-useless-promise-resolve-reject

app/components/ui/card.tsx

@@ -3,11 +3,11 @@ import type { ComponentProps, FC, PropsWithChildren } from 'react'
 type TProperties = PropsWithChildren<ComponentProps<'div'>>
 
 export const Card: FC<TProperties> = (properties) => {
-  const { children, ...rest } = properties
+  const { children, ...restProperties } = properties
   return (
     <div
       className="border-[.2px] border-black/20 bg-white p-[30px]"
-      {...rest}
+      {...restProperties}
     >
       {children}
     </div>

app/components/ui/combobox.tsx

@@ -53,7 +53,7 @@ export const Combobox = <TFormValues extends Record<string, unknown>>(
     className,
     labelClassName,
     containerClassName,
-    ...rest
+    ...restProperties
   } = properties
   const {
     control,
@@ -88,7 +88,7 @@ export const Combobox = <TFormValues extends Record<string, unknown>>(
             onChange={field.onChange}
             disabled={disabled}
             immediate
-            {...rest}
+            {...restProperties}
           >
             <div className="relative">
               <ComboboxInput

app/components/ui/input.tsx

@@ -40,7 +40,7 @@ export const Input = <TFormValues extends Record<string, unknown>>(
     className,
     containerClassName,
     labelClassName,
-    ...rest
+    ...restProperties
   } = properties
   const [inputType, setInputType] = useState(type)
 
@@ -68,7 +68,7 @@ export const Input = <TFormValues extends Record<string, unknown>>(
         )}
         placeholder={inputType === 'password' ? '******' : placeholder}
         {...register(name, rules)}
-        {...rest}
+        {...restProperties}
       />
       {type === 'password' && (
         <Button

app/components/ui/news-author.tsx

@@ -1,4 +1,4 @@
-import type { TAuthor } from '~/apis/admin/get-news'
+import type { TAuthor } from '~/apis/common/get-news'
 import { ProfileIcon } from '~/components/icons/profile'
 import { formatDate } from '~/utils/formatter'
 

app/pages/dashboard-contents/index.tsx

@@ -2,8 +2,8 @@ import DT from 'datatables.net-dt'
 import DataTable from 'datatables.net-react'
 import { Link, useRouteLoaderData } from 'react-router'
 
-import type { TNewsResponse } from '~/apis/admin/get-news'
 import type { TCategoryResponse } from '~/apis/common/get-categories'
+import type { TNewsResponse } from '~/apis/common/get-news'
 import type { TTagResponse } from '~/apis/common/get-tags'
 import { Button } from '~/components/ui/button'
 import { UiTable } from '~/components/ui/table'

app/pages/form-contents/index.tsx

@@ -5,7 +5,7 @@ import { useFetcher, useNavigate, useRouteLoaderData } from 'react-router'
 import { RemixFormProvider, useRemixForm } from 'remix-hook-form'
 import { z } from 'zod'
 
-import type { newsResponseSchema } from '~/apis/admin/get-news'
+import type { newsResponseSchema } from '~/apis/common/get-news'
 import { TextEditor } from '~/components/text-editor'
 import { Button } from '~/components/ui/button'
 import { Combobox } from '~/components/ui/combobox'

app/routes/_admin.lg-admin._dashboard.contents._index.tsx

@@ -1,4 +1,4 @@
-import { getNews } from '~/apis/admin/get-news'
+import { getNews } from '~/apis/common/get-news'
 import { handleCookie } from '~/libs/cookies'
 import { ContentsPage } from '~/pages/dashboard-contents'