tyler/route-commerce
1
0
Fork 1
Code Issues Pull Requests 3 Actions Packages Projects Releases Wiki Activity

Consolidate admin pages into tabbed layouts with warm stone theme

Browse Source 
- Add SettingsClient with tabs: General, Users, Integrations
- Add RouteTracePage with tabs: Dashboard, Lots, Lookup, Settings
- Fix dark styling in AdminMeClient.tsx (red/green alerts)
- Fix dark styling in AIClient.tsx (emerald/amber/green/red/blue)
- Fix ImportCenterClient.tsx (already correct, no changes needed)
- Fix TypeScript errors in LotListTable, RouteTraceDashboard
- Convert lot.id to lot.lot_id for HaulingLot compatibility
- Update route-trace components to warm stone theme
This commit is contained in:
default
2026-06-01 20:45:58 +00:00
parent 3274470737
commit 809e0061ca
20 changed files with 834 additions and 560 deletions
Download Patch File Download Diff File Expand all files Collapse all files
src/app/admin/settings/page.tsx
+22 -72
View File
@@ -1,10 +1,7 @@
import { redirect } from "next/navigation";
import { getAdminUser } from "@/lib/admin-permissions";
import { getAdminUsers, getBrands } from "@/actions/admin/users";
import TimeTrackingSettingsClient from "@/components/admin/TimeTrackingSettingsClient";
import UsersPage from "@/components/admin/UsersPage";
import SettingsSections from "@/components/admin/SettingsSections";
import IntegrationsInner from "@/components/admin/IntegrationsInner";
import SettingsClient from "@/components/admin/SettingsClient";
export default async function AdminSettingsPage() {
const adminUser = await getAdminUser();
@@ -17,75 +14,28 @@ export default async function AdminSettingsPage() {
getBrands(),
]);
// Breadcrumb nav (for page context)
const breadcrumb = (
<nav className="flex items-center gap-2 text-xs text-stone-500 mb-3">
<a href="/admin" className="hover:text-stone-600 transition-colors">Admin</a>
<span>/</span>
<span className="text-stone-600">Settings</span>
</nav>
);
return (
<main className="min-h-screen px-6 py-10">
<div className="mx-auto max-w-5xl space-y-10">
{/* Header */}
<div>
<nav className="flex items-center gap-2 text-xs text-stone-500 mb-3">
<a href="/admin" className="hover:text-stone-600 transition-colors">Admin</a>
<span>/</span>
<span className="text-stone-600">Settings</span>
</nav>
<h1 className="text-3xl font-bold text-stone-950 tracking-tight">Settings</h1>
<p className="mt-1.5 text-sm text-stone-500">Manage your brand, workers, tasks, users, and integrations.</p>
</div>
{/* Nav to anchor sections */}
<div className="flex flex-wrap gap-3 border-b border-stone-200 pb-4">
<a href="#general" className="text-xs font-medium text-stone-500 hover:text-stone-800 transition-colors">General</a>
<span className="text-stone-300">·</span>
<a href="#workers" className="text-xs font-medium text-stone-500 hover:text-stone-800 transition-colors">Workers & PINs</a>
<span className="text-stone-300">·</span>
<a href="#tasks" className="text-xs font-medium text-stone-500 hover:text-stone-800 transition-colors">Tasks</a>
<span className="text-stone-300">·</span>
<a href="#users" className="text-xs font-medium text-stone-500 hover:text-stone-800 transition-colors">Users & Permissions</a>
<span className="text-stone-300">·</span>
<a href="#integrations" className="text-xs font-medium text-stone-500 hover:text-stone-800 transition-colors">Integrations</a>
</div>
{/* Section 1: General Settings */}
<section id="general">
<SettingsSections brandId={brandId} />
</section>
{/* Section 4: Users & Permissions */}
<section id="users">
<div className="border-t border-stone-200 pt-10">
<h2 className="text-lg font-bold text-stone-950 mb-4">Users & Permissions</h2>
<UsersPage
initialUsers={error ? [] : users}
brands={brands}
currentUser={{
id: adminUser.id ?? adminUser.user_id,
role: adminUser.role,
can_manage_users: adminUser.can_manage_users,
}}
/>
</div>
</section>
{/* Section 5: Integrations */}
<section id="integrations">
<div className="border-t border-stone-200 pt-10">
<h2 className="text-lg font-bold text-stone-950 mb-4">Integrations & Exports</h2>
<IntegrationsInner brandId={brandId} brands={brands} />
{/* Time Tracking Exports */}
<div className="mt-6 border-t border-stone-200 pt-6">
<h3 className="text-base font-semibold text-stone-800 mb-4">Time Tracking Exports</h3>
<TimeTrackingSettingsClient brandId={brandId} />
</div>
<p className="text-xs text-stone-500 mt-3">
For more settings, see{" "}
<a href="/admin/settings/ai" className="text-emerald-600 hover:text-emerald-700 underline underline-offset-2">AI Tools</a>
{" "}and{" "}
<a href="/admin/settings/shipping" className="text-emerald-600 hover:text-emerald-700 underline underline-offset-2">Shipping</a>
.
</p>
</div>
</section>
</div>
<main>
{breadcrumb}
<SettingsClient
brandId={brandId}
users={error ? [] : users}
brands={brands}
currentUser={{
id: adminUser.id ?? adminUser.user_id,
role: adminUser.role,
can_manage_users: adminUser.can_manage_users,
}}
/>
</main>
);
}