Sticky headers fix, added Heliports
This commit is contained in:
@@ -73,6 +73,11 @@ export const VerticalNav = async () => {
|
||||
<Link href="/admin/keyword">Stichworte</Link>
|
||||
</li>
|
||||
)}
|
||||
{session.user.permissions.includes("ADMIN_HELIPORT") && (
|
||||
<li>
|
||||
<Link href="/admin/heliport">Heliports</Link>
|
||||
</li>
|
||||
)}
|
||||
{session.user.permissions.includes("ADMIN_EVENT") && (
|
||||
<li>
|
||||
<Link href="/admin/event">Events</Link>
|
||||
|
||||
@@ -3,7 +3,7 @@ import { useState, Ref, useImperativeHandle, useEffect, useCallback } from "reac
|
||||
import SortableTable, { Pagination, RowsPerPage, SortableTableProps } from "./Table";
|
||||
import { PrismaClient } from "@repo/db";
|
||||
import { getData } from "./pagiantedTableActions";
|
||||
import { useDebounce } from "@repo/shared-components";
|
||||
import { cn, useDebounce } from "@repo/shared-components";
|
||||
|
||||
export interface PaginatedTableRef {
|
||||
refresh: () => void;
|
||||
@@ -11,6 +11,7 @@ export interface PaginatedTableRef {
|
||||
|
||||
interface PaginatedTableProps<TData> extends Omit<SortableTableProps<TData>, "data"> {
|
||||
prismaModel: keyof PrismaClient;
|
||||
stickyHeaders?: boolean;
|
||||
filter?: Record<string, unknown>;
|
||||
initialRowsPerPage?: number;
|
||||
searchFields?: string[];
|
||||
@@ -31,6 +32,7 @@ export function PaginatedTable<TData>({
|
||||
include,
|
||||
ref,
|
||||
strictQuery = false,
|
||||
stickyHeaders = false,
|
||||
leftOfSearch,
|
||||
rightOfSearch,
|
||||
leftOfPagination,
|
||||
@@ -110,7 +112,7 @@ export function PaginatedTable<TData>({
|
||||
// useEffect to show loading spinner
|
||||
useEffect(() => {
|
||||
setLoading(true);
|
||||
}, [searchTerm, page, rowsPerPage, orderBy, filter, setLoading, refreshTableData]);
|
||||
}, [searchTerm, page, rowsPerPage, orderBy, filter, setLoading]);
|
||||
|
||||
useDebounce(
|
||||
() => {
|
||||
@@ -122,25 +124,32 @@ export function PaginatedTable<TData>({
|
||||
|
||||
return (
|
||||
<div className="space-y-4 m-4">
|
||||
<div className="flex items-center gap-2">
|
||||
<div className="flex-1 flex gap-2">
|
||||
<div>{leftOfSearch}</div>
|
||||
<div>{loading && <span className="loading loading-dots loading-md" />}</div>
|
||||
{(rightOfSearch || leftOfSearch || searchFields.length > 0) && (
|
||||
<div
|
||||
className={cn(
|
||||
"flex items-center gap-2 sticky py-2 z-20",
|
||||
stickyHeaders && "sticky top-0 bg-base-100/80 backdrop-blur border-b",
|
||||
)}
|
||||
>
|
||||
<div className="flex-1 flex gap-2">
|
||||
<div>{leftOfSearch}</div>
|
||||
<div>{loading && <span className="loading loading-dots loading-md" />}</div>
|
||||
</div>
|
||||
{searchFields.length > 0 && (
|
||||
<input
|
||||
type="text"
|
||||
placeholder="Suchen..."
|
||||
value={searchTerm}
|
||||
onChange={(e) => {
|
||||
setSearchTerm(e.target.value);
|
||||
setPage(0); // Reset to first page on search
|
||||
}}
|
||||
className="input input-bordered w-full max-w-xs justify-end"
|
||||
/>
|
||||
)}
|
||||
<div className="flex justify-center">{rightOfSearch}</div>
|
||||
</div>
|
||||
{searchFields.length > 0 && (
|
||||
<input
|
||||
type="text"
|
||||
placeholder="Suchen..."
|
||||
value={searchTerm}
|
||||
onChange={(e) => {
|
||||
setSearchTerm(e.target.value);
|
||||
setPage(0); // Reset to first page on search
|
||||
}}
|
||||
className="input input-bordered w-full max-w-xs justify-end"
|
||||
/>
|
||||
)}
|
||||
<div className="flex justify-center">{rightOfSearch}</div>
|
||||
</div>
|
||||
)}
|
||||
{!hide && (
|
||||
<SortableTable
|
||||
data={data}
|
||||
|
||||
Reference in New Issue
Block a user