feat(router-with-profile): App.tsx erweitert um /profile-Route + ToastProvider + active [tsc:fail]
This commit is contained in:
parent
dac8bfafda
commit
0303704c02
@ -5,9 +5,10 @@
|
||||
"empty-loading-states",
|
||||
"time-entries-search-filter"
|
||||
],
|
||||
"current_feature": "api-client-final",
|
||||
"current_feature": "router-with-profile",
|
||||
"started_at": "2026-05-23T04:57:10.921624",
|
||||
"attempted_features": [
|
||||
"user-profile-page"
|
||||
"user-profile-page",
|
||||
"api-client-final"
|
||||
]
|
||||
}
|
||||
@ -430,3 +430,22 @@ src/routes/users.ts(41,34): error TS2339: Property 'id' does not exist on type '
|
||||
undefined
|
||||
/home/dark/Developer/EmberClone/apps/api:
|
||||
ERR_PNPM_RECURSIVE_EXEC_FIRST_FAIL Command failed with exit code 2: tsc --noEmit -p tsconfig.json
|
||||
- `05:00:29` **INFO** Committed feature api-client-final
|
||||
- `05:00:29` **INFO** Pushed: rc=0
|
||||
|
||||
## Phase-3 Feature: router-with-profile (2026-05-23 05:00:29)
|
||||
|
||||
- `05:00:29` **INFO** Description: App.tsx erweitert um /profile-Route + ToastProvider + active-link
|
||||
- `05:00:29` **INFO** Generating apps/web/src/App.tsx (FINALE App.tsx. Behalte bestehende Routes (/, /login, /time-entries, /…)
|
||||
- `05:00:47` **INFO** wrote 2074 chars in 18.1s (attempt 1)
|
||||
- `05:00:47` **INFO** Generating apps/web/src/components/Nav.tsx (FINAL Nav-Bar. Plus Profile-Link rechts neben Logout. Verwende lucide-…)
|
||||
- `05:01:11` **INFO** wrote 2874 chars in 23.9s (attempt 1)
|
||||
- `05:01:11` **INFO** Running tsc --noEmit on api…
|
||||
- `05:01:13` **WARN** tsc errors:
|
||||
src/routes/users.ts(21,34): error TS2339: Property 'id' does not exist on type 'string | object | Buffer<ArrayBufferLike>'.
|
||||
Property 'id' does not exist on type 'string'.
|
||||
src/routes/users.ts(41,34): error TS2339: Property 'id' does not exist on type 'string | object | Buffer<ArrayBufferLike>'.
|
||||
Property 'id' does not exist on type 'string'.
|
||||
undefined
|
||||
/home/dark/Developer/EmberClone/apps/api:
|
||||
ERR_PNPM_RECURSIVE_EXEC_FIRST_FAIL Command failed with exit code 2: tsc --noEmit -p tsconfig.json
|
||||
|
||||
@ -4,7 +4,9 @@ import Login from "./pages/Login"
|
||||
import TimeEntries from "./pages/TimeEntries"
|
||||
import Customers from "./pages/Customers"
|
||||
import Projects from "./pages/Projects"
|
||||
import Profile from "./pages/Profile"
|
||||
import Nav from "./components/Nav"
|
||||
import { ToastProvider } from "./components/Toast"
|
||||
import { api } from "./lib/api"
|
||||
|
||||
const rootRoute = createRootRoute({
|
||||
@ -60,12 +62,20 @@ const projectsRoute = createRoute({
|
||||
component: Projects
|
||||
})
|
||||
|
||||
const profileRoute = createRoute({
|
||||
getParentRoute: () => rootRoute,
|
||||
path: "/profile",
|
||||
beforeLoad: authCheck,
|
||||
component: Profile
|
||||
})
|
||||
|
||||
const routeTree = rootRoute.addChildren([
|
||||
indexRoute,
|
||||
loginRoute,
|
||||
timeEntriesRoute,
|
||||
customersRoute,
|
||||
projectsRoute
|
||||
projectsRoute,
|
||||
profileRoute
|
||||
])
|
||||
|
||||
const router = createRouter({
|
||||
@ -80,5 +90,9 @@ declare module "@tanstack/react-router" {
|
||||
}
|
||||
|
||||
export default function App() {
|
||||
return <RouterProvider router={router} />
|
||||
return (
|
||||
<ToastProvider>
|
||||
<RouterProvider router={router} />
|
||||
</ToastProvider>
|
||||
)
|
||||
}
|
||||
@ -1,20 +1,32 @@
|
||||
import React from "react"
|
||||
import { Link, useLocation } from "@tanstack/react-router"
|
||||
import {
|
||||
Home,
|
||||
Clock,
|
||||
Users,
|
||||
FolderKanban,
|
||||
User,
|
||||
LogOut
|
||||
} from "lucide-react"
|
||||
import { api } from "../lib/api"
|
||||
|
||||
export default function Nav() {
|
||||
const location = useLocation()
|
||||
|
||||
const navItems = [
|
||||
{ label: "Dashboard", to: "/" },
|
||||
{ label: "Time Entries", to: "/time-entries" },
|
||||
{ label: "Customers", to: "/customers" },
|
||||
{ label: "Projects", to: "/projects" },
|
||||
{ label: "Dashboard", to: "/", icon: Home },
|
||||
{ label: "Time Entries", to: "/time-entries", icon: Clock },
|
||||
{ label: "Customers", to: "/customers", icon: Users },
|
||||
{ label: "Projects", to: "/projects", icon: FolderKanban },
|
||||
]
|
||||
|
||||
const handleLogout = async () => {
|
||||
try {
|
||||
await api.logout()
|
||||
window.location.href = "/login"
|
||||
} catch (error) {
|
||||
console.error("Logout failed", error)
|
||||
}
|
||||
}
|
||||
|
||||
return (
|
||||
@ -24,7 +36,7 @@ export default function Nav() {
|
||||
<div className="flex items-center gap-8">
|
||||
<Link
|
||||
to="/"
|
||||
className="text-xl font-bold text-indigo-600 mr-4"
|
||||
className="text-xl font-bold text-indigo-600 mr-4 flex items-center gap-2"
|
||||
>
|
||||
EmberClone
|
||||
</Link>
|
||||
@ -32,16 +44,18 @@ export default function Nav() {
|
||||
<div className="flex items-center gap-1">
|
||||
{navItems.map((item) => {
|
||||
const isActive = location.pathname === item.to
|
||||
const Icon = item.icon
|
||||
return (
|
||||
<Link
|
||||
key={item.to}
|
||||
to={item.to}
|
||||
className={`px-3 py-2 rounded-md text-sm font-medium transition-colors ${
|
||||
className={`flex items-center gap-2 px-3 py-2 rounded-md text-sm font-medium transition-colors ${
|
||||
isActive
|
||||
? "bg-indigo-50 text-indigo-700"
|
||||
: "text-gray-600 hover:bg-gray-50 hover:text-gray-900"
|
||||
}`}
|
||||
>
|
||||
<Icon className="w-4 h-4" />
|
||||
{item.label}
|
||||
</Link>
|
||||
)
|
||||
@ -49,11 +63,24 @@ export default function Nav() {
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div className="flex items-center">
|
||||
<div className="flex items-center gap-2">
|
||||
<Link
|
||||
to="/profile"
|
||||
className={`flex items-center gap-2 px-3 py-2 rounded-md text-sm font-medium transition-colors ${
|
||||
location.pathname === "/profile"
|
||||
? "bg-indigo-50 text-indigo-700"
|
||||
: "text-gray-600 hover:bg-gray-50 hover:text-gray-900"
|
||||
}`}
|
||||
>
|
||||
<User className="w-4 h-4" />
|
||||
Profile
|
||||
</Link>
|
||||
|
||||
<button
|
||||
onClick={handleLogout}
|
||||
className="text-sm font-medium text-gray-500 hover:text-red-600 transition-colors px-3 py-2"
|
||||
className="flex items-center gap-2 text-sm font-medium text-gray-500 hover:text-red-600 transition-colors px-3 py-2"
|
||||
>
|
||||
<LogOut className="w-4 h-4" />
|
||||
Logout
|
||||
</button>
|
||||
</div>
|
||||
|
||||
Loading…
Reference in New Issue
Block a user