diff options
Diffstat (limited to 'app')
| -rw-r--r-- | app/[lng]/evcp/(evcp)/items-tech/layout.tsx | 13 | ||||
| -rw-r--r-- | app/[lng]/evcp/(evcp)/items-tech/page.tsx | 24 |
2 files changed, 20 insertions, 17 deletions
diff --git a/app/[lng]/evcp/(evcp)/items-tech/layout.tsx b/app/[lng]/evcp/(evcp)/items-tech/layout.tsx index 5eb88325..d375059b 100644 --- a/app/[lng]/evcp/(evcp)/items-tech/layout.tsx +++ b/app/[lng]/evcp/(evcp)/items-tech/layout.tsx @@ -1,6 +1,7 @@ import * as React from "react"
import { ItemTechContainer } from "@/components/items-tech/item-tech-container"
import { Shell } from "@/components/shell"
+import { DataTableSkeleton } from "@/components/data-table/data-table-skeleton"
// Layout 컴포넌트는 서버 컴포넌트입니다
export default function ItemsShipLayout({
@@ -17,9 +18,21 @@ export default function ItemsShipLayout({ return (
<Shell className="gap-4">
+ <React.Suspense
+ fallback={
+ <DataTableSkeleton
+ columnCount={6}
+ searchableColumnCount={1}
+ filterableColumnCount={2}
+ cellWidths={["10rem", "40rem", "12rem", "12rem", "8rem", "8rem"]}
+ shrinkZero
+ />
+ }
+ >
<ItemTechContainer itemTypes={itemTypes}>
{children}
</ItemTechContainer>
+ </React.Suspense>
</Shell>
)
}
diff --git a/app/[lng]/evcp/(evcp)/items-tech/page.tsx b/app/[lng]/evcp/(evcp)/items-tech/page.tsx index 0680f78b..52ff519d 100644 --- a/app/[lng]/evcp/(evcp)/items-tech/page.tsx +++ b/app/[lng]/evcp/(evcp)/items-tech/page.tsx @@ -15,26 +15,16 @@ interface IndexPageProps { searchParams: Promise<SearchParams>
}
-export default async function IndexPage(props: IndexPageProps) {
- const searchParams = await props.searchParams
- const search = searchParamsCache.parse(searchParams)
- const validFilters = getValidFilters(search.filters)
+export default async function IndexPage({ searchParams }: IndexPageProps) {
+ const params = await searchParams
+ const search = searchParamsCache.parse(params)
+ const validFilters = getValidFilters(search.filters || [])
// URL에서 아이템 타입 가져오기
- const itemType = searchParams.type || "ship"
+ const itemType = params.type || "ship"
return (
- <React.Suspense
- fallback={
- <DataTableSkeleton
- columnCount={6}
- searchableColumnCount={1}
- filterableColumnCount={2}
- cellWidths={["10rem", "40rem", "12rem", "12rem", "8rem", "8rem"]}
- shrinkZero
- />
- }
- >
+ <div>
{itemType === "ship" && (
<ItemsShipTable
promises={Promise.all([
@@ -67,6 +57,6 @@ export default async function IndexPage(props: IndexPageProps) { ]).then(([result]) => result)}
/>
)}
- </React.Suspense>
+ </div>
)
}
|