refactor: handle 401 errors in staff and user data loading with logout headers

app/routes/_news.tsx

@@ -1,4 +1,5 @@
 import { Outlet } from 'react-router'
+import { XiorError } from 'xior'
 
 import { getCategories } from '~/apis/common/get-categories'
 import { getSubscriptions } from '~/apis/common/get-subscriptions'
@@ -6,6 +7,7 @@ import { getUser } from '~/apis/news/get-user'
 import { NewsProvider } from '~/contexts/news'
 import { NewsDefaultLayout } from '~/layouts/news/default'
 import { handleCookie } from '~/libs/cookies'
+import { setUserLogoutHeaders } from '~/libs/logout-header.server'
 
 import type { Route } from './+types/_news'
 
@@ -13,10 +15,16 @@ export const loader = async ({ request }: Route.LoaderArgs) => {
   const { userToken } = await handleCookie(request)
   let userData
   if (userToken) {
-    const { data } = await getUser({
-      accessToken: userToken,
-    })
-    userData = data
+    try {
+      const { data } = await getUser({
+        accessToken: userToken,
+      })
+      userData = data
+    } catch (error) {
+      if (error instanceof XiorError && error.response?.status === 401) {
+        setUserLogoutHeaders()
+      }
+    }
   }
   const { data: subscriptionsData } = await getSubscriptions()
   const { data: categoriesData } = await getCategories()