move all components to components dir

src/components/AccessPageHeaderAndNav.tsx

@@ -0,0 +1,48 @@
+"use client";
+
+import { HorizontalTabs } from "@app/components/HorizontalTabs";
+import SettingsSectionTitle from "@app/components/SettingsSectionTitle";
+import { useTranslations } from "next-intl";
+
+interface AccessPageHeaderAndNavProps {
+    children: React.ReactNode;
+    hasInvitations: boolean;
+}
+
+export default function AccessPageHeaderAndNav({
+    children,
+    hasInvitations
+}: AccessPageHeaderAndNavProps) {
+    const t = useTranslations();
+    
+    const navItems = [
+        {
+            title: t('users'),
+            href: `/{orgId}/settings/access/users`
+        },
+        {
+            title: t('roles'),
+            href: `/{orgId}/settings/access/roles`
+        }
+    ];
+
+    if (hasInvitations) {
+        navItems.push({
+            title: t('invite'),
+            href: `/{orgId}/settings/access/invitations`
+        });
+    }
+
+    return (
+        <>
+            <SettingsSectionTitle
+                title={t('accessUsersRoles')}
+                description={t('accessUsersRolesDescription')}
+            />
+
+            <HorizontalTabs items={navItems}>
+                {children}
+            </HorizontalTabs>
+        </>
+    );
+}