On my NextJs-project I have the following three documents.
page.tsx in src/app/[id]/dashboard:

import { Button } from 'components/ui/button';
import Link from 'next/link';
import { cookies } from 'next/headers';
import { AppDataSource } from 'data-source';
import { Task } from 'entity/Tasks';
import TaskCard from 'components/ui/taskCard';
import { Not } from 'typeorm';
import LogoutButton from 'components/ui/logoutButton';

export default async function EisenhowerMatrix() {

    if (!AppDataSource.isInitialized){
        await AppDataSource.initialize()
    }

    const tasks = (await AppDataSource.manager.find(Task, {
        relations: ["user"],
        where: {taskState: Not("erledigt")}
    })).filter((task) => {return task.user.id == Number(cookies().get("userId")?.value)})

    const tasksWithDaysLeft = tasks.map((task) => {
        return {
        "id": task.id,
        "title": task.title,
        "priority": task.priority,
        "taskState": task.taskState,
        "user": task.user.id,
        "toDelegate": task.toDelegate,
        "deadline": task.deadline,
        "difficulty": task.difficulty,
        "daysLeft": Math.ceil((new Date(task.deadline).getTime() - new Date().getTime())/1000/60/60/24)
        }
    })

    const tasksToDo = tasksWithDaysLeft.filter((task) => {return (task.daysLeft < 5 && task.priority > 7 && task.toDelegate === false)}).sort(
        (a, b) => {
            if (a.daysLeft == b.daysLeft){ return b.priority - a.priority}
            return a.daysLeft - b.daysLeft
            }
    )
    const tasksToDelegate = tasksWithDaysLeft.filter((task) => {return ((task.daysLeft < 5 && task.priority < 8) || (task.daysLeft < 5 && task.priority > 7 && task.toDelegate === true))}).sort(
        (a, b) => {
            if (a.daysLeft == b.daysLeft){ return b.priority - a.priority}
            return a.daysLeft - b.daysLeft
            }
    )
    const tasksToPostpone = tasksWithDaysLeft.filter((task) => {return ((task.daysLeft > 4 && task.priority > 7 && task.toDelegate === false) || (task.daysLeft > 4 && task.priority > 7 && task.toDelegate === true))}).sort(
        (a, b) => {
            if (a.daysLeft == b.daysLeft){ return b.priority - a.priority}
            return a.daysLeft - b.daysLeft
            }
    )
    const tasksToDelete = tasksWithDaysLeft.filter((task) => {return (task.daysLeft > 4 && task.priority < 8)}).sort(
        (a, b) => {
            if (a.daysLeft == b.daysLeft){ return b.priority - a.priority}
            return a.daysLeft - b.daysLeft
            }
    )

    return (
        <>
            <div className="flex items-center justify-left min-h-10 bg-green-800 gap-4">
                {cookies().get("uname") && <p className="ml-10">{cookies().get("uname")?.value}</p>}
                <LogoutButton />
            </div>
            <div className="grid grid-cols-1 md:grid-cols-2 lg:grid-cols-2 gap-4 mt-4 ml-4 mr-4 h-[100%]">
                <TaskCard cardName='machen' tasks={tasksToDo} />
                <TaskCard cardName='verschieben' tasks={tasksToPostpone} />
                <TaskCard cardName='delegieren' tasks={tasksToDelegate} />
                <TaskCard cardName='löschen' tasks={tasksToDelete} />
                <div></div>
                <Button className='w-full ml-0 md:w-[50%] md:ml-[50%] lg:w-[50%] lg:ml-[50%]' >
                    <Link href={`/${cookies().get('userId')?.value}/neu`}>new Task</Link>
                </Button>
            </div>
        </>
    );
}

taskCard.tsx:

"use client"

import { MoreVertical } from "lucide-react";
import { Card, CardContent, CardHeader, CardTitle } from "./card";
import { DropdownMenu, DropdownMenuContent, DropdownMenuItem, DropdownMenuTrigger } from "./dropdown-menu";
import { Table, TableBody, TableCell, TableHead, TableHeader, TableRow } from "./table";
import Link from "next/link";
import { startTransition } from "react";
import deleteTaskById from "actions/deleteTask";
import { useRouter } from "next/navigation";
import { Button } from "./button";

type TaskProps = {
    id: number,
    title: string,
    priority: number,
    taskState: string,
    user: number,
    toDelegate: boolean,
    deadline: Date,
    difficulty: string,
    daysLeft: number
};

export default function TaskCard({ cardName, tasks }: { cardName: string, tasks: TaskProps[] }) {
    const router = useRouter();
    return (
        <Card>
            <CardHeader>
                <CardTitle className='flex justify-center items-center underline'>{cardName}</CardTitle>
            </CardHeader>
            <CardContent>
                {tasks.length > 0 &&
                    <Table>
                        <TableHeader>
                            <TableRow>
                                <TableHead>Aufgabe</TableHead>
                                <TableHead>Tage</TableHead>
                                <TableHead>Status</TableHead>
                                <TableHead>Schwierikeitsgrad</TableHead>
                                <TableHead>Aktion</TableHead>
                                <TableHead>id</TableHead>
                            </TableRow>
                        </TableHeader>
                        <TableBody>
                            {tasks.map((task) => {
                                return (
                                    <TableRow key={task.id} className="hover:bg-gray-100">
                                        <TableCell>{task.title}</TableCell>
                                        <TableCell>{task.daysLeft}</TableCell>
                                        <TableCell>{task.taskState}</TableCell>
                                        <TableCell>{task.difficulty}</TableCell>
                                        <TableCell>
                                            <DropdownMenu>
                                                <DropdownMenuTrigger>
                                                    <MoreVertical />
                                                    <span className="sr-only">Actions</span>
                                                </DropdownMenuTrigger>
                                                <DropdownMenuContent>
                                                    <DropdownMenuItem asChild>
                                                        <Link href={{pathname: `/${task.user}/${task.id}/edit`, query:{post: task.id}}}>
                                                            Bearbeiten
                                                        </Link>
                                                    </DropdownMenuItem>
                                                    <DropdownMenuItem onClick={() => {
                                                        startTransition(async () => {
                                                            await deleteTaskById(task.id);
                                                            router.refresh();
                                                        });
                                                    }}
                                                    >
                                                        Löschen
                                                    </DropdownMenuItem>
                                                </DropdownMenuContent>
                                            </DropdownMenu>
                                        </TableCell>
                                        <TableCell>
                                            {typeof task.id}
                                        </TableCell>
                                    </TableRow>
                                );
                            })}
                        </TableBody>
                    </Table>
                }
            </CardContent>
        </Card>
    );
}

page.tsx in src/app/[id]/[task]/edit:

import "reflect-metadata"
import { Task } from "entity/Tasks"
import TaskForm from "components/ui/taskForm"
import { AppDataSource } from "data-source"

export default async function editTask({ params: { taskId }, }: { params: { taskId: number } }) {

  console.log("übermittelte id:", taskId)

  if (!AppDataSource.isInitialized){
    await AppDataSource.initialize()
  }

  const task = await AppDataSource.manager.findOneBy(Task, {id: taskId})

  console.log("task:",task)
  const loadedTask = {
    id: Number(task?.id),
    title: task?.title,
    priority: Number(task?.priority),
    deadline: task?.deadline.toDateString(),
    difficulty: task?.difficulty,
    taskState: task?.taskState,
    toDelegate: Boolean(task?.toDelegate),
    user: Number(task?.user)
  }

  return (
    <div>
        <TaskForm task={loadedTask} />
    </div>
  )
}

Unfortunately the permitted parameter taskId is always undefined. How do I get the respective task ID when I click on the “bearbeiten” link in a row in the dashboard?

The expected outcome should be form with value of a task with the correct id.