feat: update data-table

src/app/(auth)/signin/page.tsx

@@ -10,7 +10,7 @@ import {
   CardHeader,
   CardTitle,
 } from "@/components/ui/card"
-import { Shell } from "@/components/shells/shell"
+import { Shell } from "@/components/shell"
 import { OAuthSignIn } from "@/app/(auth)/_components/oauth-signin"
 import { SignInForm } from "@/app/(auth)/_components/signin-form"
 

src/app/(auth)/signin/reset-password/confirm/page.tsx

@@ -8,7 +8,7 @@ import {
   CardHeader,
   CardTitle,
 } from "@/components/ui/card"
-import { Shell } from "@/components/shells/shell"
+import { Shell } from "@/components/shell"
 import { ResetPasswordConfirmForm } from "@/app/(auth)/_components/reset-password-confirm-form"
 
 export const metadata: Metadata = {

src/app/(auth)/signin/reset-password/page.tsx

@@ -8,7 +8,7 @@ import {
   CardHeader,
   CardTitle,
 } from "@/components/ui/card"
-import { Shell } from "@/components/shells/shell"
+import { Shell } from "@/components/shell"
 import { ResetPasswordForm } from "@/app/(auth)/_components/reset-password-form"
 
 export const metadata: Metadata = {

src/app/(auth)/signout/loading.tsx

@@ -4,7 +4,7 @@ import {
   PageHeaderDescription,
   PageHeaderHeading,
 } from "@/components/page-header"
-import { Shell } from "@/components/shells/shell"
+import { Shell } from "@/components/shell"
 
 export default function SignOutLoading() {
   return (

src/app/(auth)/signout/page.tsx

@@ -6,7 +6,7 @@ import {
   PageHeaderDescription,
   PageHeaderHeading,
 } from "@/components/page-header"
-import { Shell } from "@/components/shells/shell"
+import { Shell } from "@/components/shell"
 import { LogOutButtons } from "@/app/(auth)/_components/logout-buttons"
 
 export const metadata: Metadata = {

src/app/(auth)/signup/page.tsx

@@ -10,7 +10,7 @@ import {
   CardHeader,
   CardTitle,
 } from "@/components/ui/card"
-import { Shell } from "@/components/shells/shell"
+import { Shell } from "@/components/shell"
 import { OAuthSignIn } from "@/app/(auth)/_components/oauth-signin"
 import { SignUpForm } from "@/app/(auth)/_components/signup-form"
 

src/app/(auth)/signup/verify-email/page.tsx

@@ -8,7 +8,7 @@ import {
   CardHeader,
   CardTitle,
 } from "@/components/ui/card"
-import { Shell } from "@/components/shells/shell"
+import { Shell } from "@/components/shell"
 import { VerifyEmailForm } from "@/app/(auth)/_components/verify-email-form"
 
 export const metadata: Metadata = {

src/app/(auth)/sso-callback/page.tsx

@@ -1,6 +1,6 @@
 import { type HandleOAuthCallbackParams } from "@clerk/types"
 
-import { Shell } from "@/components/shells/shell"
+import { Shell } from "@/components/shell"
 import { SSOCallback } from "@/app/(auth)/_components/sso-callback"
 
 export interface SSOCallbackPageProps {

src/app/(checkout)/cart/loading.tsx

@@ -8,7 +8,7 @@ import {
   PageHeaderDescription,
   PageHeaderHeading,
 } from "@/components/page-header"
-import { Shell } from "@/components/shells/shell"
+import { Shell } from "@/components/shell"
 
 export default function CartLoading() {
   return (

src/app/(checkout)/cart/page.tsx

@@ -12,7 +12,7 @@ import {
   PageHeaderDescription,
   PageHeaderHeading,
 } from "@/components/page-header"
-import { Shell } from "@/components/shells/shell"
+import { Shell } from "@/components/shell"
 
 export const metadata: Metadata = {
   metadataBase: new URL(env.NEXT_PUBLIC_APP_URL),

src/app/(checkout)/checkout/[storeId]/error.tsx

@@ -4,7 +4,7 @@
 import * as React from "react"
 
 import { ErrorCard } from "@/components/cards/error-card"
-import { Shell } from "@/components/shells/shell"
+import { Shell } from "@/components/shell"
 
 export default function StoreCheckoutError({
   error,

src/app/(checkout)/checkout/[storeId]/page.tsx

@@ -17,7 +17,7 @@ import { Separator } from "@/components/ui/separator"
 import { CartLineItems } from "@/components/checkout/cart-line-items"
 import { CheckoutForm } from "@/components/checkout/checkout-form"
 import { CheckoutShell } from "@/components/checkout/checkout-shell"
-import { Shell } from "@/components/shells/shell"
+import { Shell } from "@/components/shell"
 
 export const metadata: Metadata = {
   metadataBase: new URL(env.NEXT_PUBLIC_APP_URL),

src/app/(dashboard)/dashboard/account/loading.tsx

@@ -4,12 +4,12 @@ import {
   PageHeaderDescription,
   PageHeaderHeading,
 } from "@/components/page-header"
-import { Shell } from "@/components/shells/shell"
+import { Shell } from "@/components/shell"
 
 export default function AccountLoading() {
   return (
     <Shell variant="sidebar">
-      <PageHeader separated>
+      <PageHeader>
         <PageHeaderHeading size="sm">Account</PageHeaderHeading>
         <PageHeaderDescription size="sm">
           Manage your account settings

src/app/(dashboard)/dashboard/account/page.tsx

@@ -1,13 +1,14 @@
 import type { Metadata } from "next"
 import { env } from "@/env.js"
 
-import { UserProfile } from "@/components/auth/user-profile"
 import {
   PageHeader,
   PageHeaderDescription,
   PageHeaderHeading,
 } from "@/components/page-header"
-import { Shell } from "@/components/shells/shell"
+import { Shell } from "@/components/shell"
+
+import { UserProfile } from "./_components/user-profile"
 
 export const metadata: Metadata = {
   metadataBase: new URL(env.NEXT_PUBLIC_APP_URL),
@@ -18,21 +19,13 @@ export const metadata: Metadata = {
 export default function AccountPage() {
   return (
     <Shell variant="sidebar">
-      <PageHeader
-        id="account-header"
-        aria-labelledby="account-header-heading"
-        separated
-      >
+      <PageHeader>
         <PageHeaderHeading size="sm">Account</PageHeaderHeading>
         <PageHeaderDescription size="sm">
           Manage your account settings
         </PageHeaderDescription>
       </PageHeader>
-      <section
-        id="user-account-info"
-        aria-labelledby="user-account-info-heading"
-        className="w-full overflow-hidden"
-      >
+      <section className="w-full overflow-hidden">
         <UserProfile />
       </section>
     </Shell>

src/app/(dashboard)/dashboard/billing/page.tsx

@@ -13,15 +13,15 @@ import {
   PageHeaderDescription,
   PageHeaderHeading,
 } from "@/components/page-header"
-import { Shell } from "@/components/shells/shell"
+import { Shell } from "@/components/shell"
 
 import { Billing } from "./_components/billing"
 import { BillingSkeleton } from "./_components/billing-skeleton"
 
 export const metadata: Metadata = {
   metadataBase: new URL(env.NEXT_PUBLIC_APP_URL),
   title: "Billing",
-  description: "Manage your billing and subscription",
+  description: "Manage your billing and subscription plan",
 }
 
 export default async function BillingPage() {
@@ -40,7 +40,7 @@ export default async function BillingPage() {
       <PageHeader>
         <PageHeaderHeading size="sm">Billing</PageHeaderHeading>
         <PageHeaderDescription size="sm">
-          Manage your billing and subscription
+          Manage your billing and subscription plan
         </PageHeaderDescription>
       </PageHeader>
       <Alert>
@@ -53,7 +53,7 @@ export default async function BillingPage() {
             href="https://stripe.com/docs/testing"
             target="_blank"
             rel="noopener noreferrer"
-            className="font-medium underline underline-offset-4 transition-colors hover:text-foreground/90"
+            className="font-medium underline underline-offset-4 transition-colors hover:text-foreground/80"
           >
             Stripe docs
           </a>

src/app/(dashboard)/dashboard/purchases/[purchaseId]/loading.tsx

@@ -1,7 +1,7 @@
 import { Card, CardContent, CardHeader } from "@/components/ui/card"
 import { Skeleton } from "@/components/ui/skeleton"
 import { PageHeader } from "@/components/page-header"
-import { Shell } from "@/components/shells/shell"
+import { Shell } from "@/components/shell"
 
 export default function PurchaseLoading() {
   return (

src/app/(dashboard)/dashboard/purchases/[purchaseId]/page.tsx

@@ -20,7 +20,7 @@ import {
   PageHeaderDescription,
   PageHeaderHeading,
 } from "@/components/page-header"
-import { Shell } from "@/components/shells/shell"
+import { Shell } from "@/components/shell"
 
 export const metadata: Metadata = {
   metadataBase: new URL(env.NEXT_PUBLIC_APP_URL),

src/app/(dashboard)/dashboard/purchases/page.tsx

@@ -16,8 +16,8 @@ import {
   PageHeaderDescription,
   PageHeaderHeading,
 } from "@/components/page-header"
+import { Shell } from "@/components/shell"
 import { PurchasesTableShell } from "@/components/shells/purchases-table-shell"
-import { Shell } from "@/components/shells/shell"
 
 export const metadata: Metadata = {
   metadataBase: new URL(env.NEXT_PUBLIC_APP_URL),

src/app/(dashboard)/dashboard/stores/[storeId]/layout.tsx

@@ -13,7 +13,7 @@ import {
 } from "@/components/page-header"
 import { StoreSwitcher } from "@/components/pagers/store-switcher"
 import { StoreTabs } from "@/components/pagers/store-tabs"
-import { Shell } from "@/components/shells/shell"
+import { Shell } from "@/components/shell"
 
 interface StoreLayoutProps extends React.PropsWithChildren {
   params: {

src/app/(dashboard)/dashboard/stores/[storeId]/not-found.tsx

@@ -1,5 +1,5 @@
 import { ErrorCard } from "@/components/cards/error-card"
-import { Shell } from "@/components/shells/shell"
+import { Shell } from "@/components/shell"
 
 export default function StoreNotFound() {
   return (

src/app/(dashboard)/dashboard/stores/[storeId]/products/[productId]/not-found.tsx

@@ -1,5 +1,5 @@
 import { ErrorCard } from "@/components/cards/error-card"
-import { Shell } from "@/components/shells/shell"
+import { Shell } from "@/components/shell"
 
 interface ProductNotFoundProps {
   params: {

src/app/(dashboard)/dashboard/stores/page.tsx

@@ -11,7 +11,7 @@ import {
   PageHeaderDescription,
   PageHeaderHeading,
 } from "@/components/page-header"
-import { Shell } from "@/components/shells/shell"
+import { Shell } from "@/components/shell"
 import { StoreCardSkeleton } from "@/components/skeletons/store-card-skeleton"
 
 import { AddStoreDialog } from "./_components/add-store-dialog"

src/app/(experimental)/ai/_components/empty-chat-screen.tsx

@@ -2,7 +2,7 @@ import { type UseChatHelpers } from "ai/react"
 
 import { Button } from "@/components/ui/button"
 import { Card } from "@/components/ui/card"
-import { Shell } from "@/components/shells/shell"
+import { Shell } from "@/components/shell"
 
 const examples = [
   "Get me the top 5 stories on Hacker News in markdown table format. Use columns like title, link, score, and comments.",

src/app/(lobby)/(content)/(helps)/[...slug]/not-found.tsx

@@ -1,5 +1,5 @@
 import { ErrorCard } from "@/components/cards/error-card"
-import { Shell } from "@/components/shells/shell"
+import { Shell } from "@/components/shell"
 
 export default function PageNotFound() {
   return (

src/app/(lobby)/(content)/(helps)/[...slug]/page.tsx

@@ -15,7 +15,7 @@ import {
   PageHeaderHeading,
 } from "@/components/page-header"
 import { MdxPager } from "@/components/pagers/mdx-pager"
-import { Shell } from "@/components/shells/shell"
+import { Shell } from "@/components/shell"
 
 interface PageProps {
   params: {

src/app/(lobby)/(content)/blog/[...slug]/loading.tsx

@@ -3,7 +3,7 @@ import "@/styles/mdx.css"
 import { AspectRatio } from "@/components/ui/aspect-ratio"
 import { Separator } from "@/components/ui/separator"
 import { Skeleton } from "@/components/ui/skeleton"
-import { Shell } from "@/components/shells/shell"
+import { Shell } from "@/components/shell"
 
 export default function PostLoading() {
   return (

src/app/(lobby)/(content)/blog/[...slug]/not-found.tsx

@@ -1,5 +1,5 @@
 import { ErrorCard } from "@/components/cards/error-card"
-import { Shell } from "@/components/shells/shell"
+import { Shell } from "@/components/shell"
 
 export default function BlogNotFound() {
   return (

src/app/(lobby)/(content)/blog/[...slug]/page.tsx

@@ -16,7 +16,7 @@ import { AspectRatio } from "@/components/ui/aspect-ratio"
 import { buttonVariants } from "@/components/ui/button"
 import { Separator } from "@/components/ui/separator"
 import { MdxPager } from "@/components/pagers/mdx-pager"
-import { Shell } from "@/components/shells/shell"
+import { Shell } from "@/components/shell"
 
 interface PostPageProps {
   params: {

src/app/(lobby)/(content)/blog/page.tsx

@@ -9,7 +9,7 @@ import {
   PageHeaderDescription,
   PageHeaderHeading,
 } from "@/components/page-header"
-import { Shell } from "@/components/shells/shell"
+import { Shell } from "@/components/shell"
 
 import { PostCard } from "./_components/post-card"
 import { PostCardSkeleton } from "./_components/post-card-skeleton"

src/app/(lobby)/(content)/notifications/loading.tsx

@@ -7,7 +7,7 @@ import {
 } from "@/components/ui/card"
 import { Skeleton } from "@/components/ui/skeleton"
 import { PageHeader } from "@/components/page-header"
-import { Shell } from "@/components/shells/shell"
+import { Shell } from "@/components/shell"
 
 export default function EmailPreferencesLoading() {
   return (

src/app/(lobby)/(content)/notifications/not-found.tsx

@@ -1,5 +1,5 @@
 import { ErrorCard } from "@/components/cards/error-card"
-import { Shell } from "@/components/shells/shell"
+import { Shell } from "@/components/shell"
 
 export default function EmailPreferencesNotFound() {
   return (

src/app/(lobby)/(content)/notifications/page.tsx

@@ -14,7 +14,7 @@ import {
 } from "@/components/ui/card"
 import { UpdateNotificationForm } from "@/components/forms/update-notification-form"
 import { PageHeader } from "@/components/page-header"
-import { Shell } from "@/components/shells/shell"
+import { Shell } from "@/components/shell"
 
 export const metadata: Metadata = {
   metadataBase: new URL(env.NEXT_PUBLIC_APP_URL),

src/app/(lobby)/@modal/(.)preview/product/[productId]/loading.tsx

@@ -1,7 +1,7 @@
 import { cn } from "@/lib/utils"
 import { Skeleton } from "@/components/ui/skeleton"
+import { DialogShell } from "@/components/dialog-shell"
 import { PlaceholderImage } from "@/components/placeholder-image"
-import { DialogShell } from "@/components/shells/dialog-shell"
 
 export default function ProductModalLoading() {
   return (

src/app/(lobby)/@modal/(.)preview/product/[productId]/not-found.tsx

@@ -1,5 +1,5 @@
 import { ErrorCard } from "@/components/cards/error-card"
-import { Shell } from "@/components/shells/shell"
+import { Shell } from "@/components/shell"
 
 export default function ProductModalNotFound() {
   return (

src/app/(lobby)/@modal/(.)preview/product/[productId]/page.tsx

@@ -11,9 +11,9 @@ import { cn, formatPrice } from "@/lib/utils"
 import { AlertDialogAction } from "@/components/ui/alert-dialog"
 import { AspectRatio } from "@/components/ui/aspect-ratio"
 import { buttonVariants } from "@/components/ui/button"
+import { DialogShell } from "@/components/dialog-shell"
 import { PlaceholderImage } from "@/components/placeholder-image"
 import { Rating } from "@/components/rating"
-import { DialogShell } from "@/components/shells/dialog-shell"
 
 interface ProductModalPageProps {
   params: {

src/app/(lobby)/_components/lobby-skeleton.tsx

@@ -2,8 +2,8 @@ import Link from "next/link"
 
 import { Button } from "@/components/ui/button"
 import { Skeleton } from "@/components/ui/skeleton"
-import { ContentSection } from "@/components/shells/content-section"
-import { Shell } from "@/components/shells/shell"
+import { ContentSection } from "@/components/content-section"
+import { Shell } from "@/components/shell"
 import { ProductCardSkeleton } from "@/components/skeletons/product-card-skeleton"
 import { StoreCardSkeleton } from "@/components/skeletons/store-card-skeleton"
 

src/app/(lobby)/_components/lobby.tsx

@@ -8,9 +8,9 @@ import { Badge } from "@/components/ui/badge"
 import { Button } from "@/components/ui/button"
 import { ProductCard } from "@/components/cards/product-card"
 import { StoreCard } from "@/components/cards/store-card"
+import { ContentSection } from "@/components/content-section"
 import { Icons } from "@/components/icons"
-import { ContentSection } from "@/components/shells/content-section"
-import { Shell } from "@/components/shells/shell"
+import { Shell } from "@/components/shell"
 
 import { CategoryCard } from "./category-card"