added participant overview, (admin), Date input

apps/hub/app/_components/PaginatedTable.tsx

@@ -24,6 +24,7 @@ interface PaginatedTableProps<TData>
 	include?: Record<string, boolean>;
 	leftOfSearch?: React.ReactNode;
 	rightOfSearch?: React.ReactNode;
+	leftOfPagination?: React.ReactNode;
 	ref?: Ref<PaginatedTableRef>;
 }
 
@@ -37,6 +38,7 @@ export function PaginatedTable<TData>({
 	ref,
 	leftOfSearch,
 	rightOfSearch,
+	leftOfPagination,
 	...restProps
 }: PaginatedTableProps<TData>) {
 	const [data, setData] = useState<TData[]>([]);
@@ -62,6 +64,10 @@ export function PaginatedTable<TData>({
 		});
 	};
 
+	useEffect(() => {
+		RefreshTableData();
+	}, [filter]);
+
 	useImperativeHandle(ref, () => ({
 		refresh: () => {
 			RefreshTableData();
@@ -111,11 +117,14 @@ export function PaginatedTable<TData>({
 				showEditButton={showEditButton}
 				{...restProps}
 			/>
-			<Pagination
-				totalPages={Math.ceil(total / rowsPerPage)}
-				page={page}
-				setPage={setPage}
-			/>
+			<div className="flex items-between">
+				{leftOfPagination}
+				<Pagination
+					totalPages={Math.ceil(total / rowsPerPage)}
+					page={page}
+					setPage={setPage}
+				/>
+			</div>
 		</div>
 	);
 }

apps/hub/app/_components/ui/Input.tsx

@@ -1,48 +1,47 @@
 import React from "react";
 import {
-  FieldValues,
-  Path,
-  RegisterOptions,
-  UseFormReturn,
+	FieldValues,
+	Path,
+	RegisterOptions,
+	UseFormReturn,
 } from "react-hook-form";
 import { cn } from "../../../helper/cn";
 
 interface InputProps<T extends FieldValues>
-  extends Omit<React.InputHTMLAttributes<HTMLInputElement>, "form"> {
-  name: Path<T>;
-  form: UseFormReturn<T>;
-  formOptions?: RegisterOptions<T>;
-  label?: string;
-  placeholder?: string;
+	extends Omit<React.InputHTMLAttributes<HTMLInputElement>, "form"> {
+	name: Path<T>;
+	form: UseFormReturn<T>;
+	formOptions?: RegisterOptions<T>;
+	label?: string;
+	placeholder?: string;
 }
 
 export const Input = <T extends FieldValues>({
-  name,
-  label = name,
-  placeholder = label,
-  form,
-  formOptions,
-  className,
-  ...inputProps
+	name,
+	label = name,
+	placeholder = label,
+	form,
+	formOptions,
+	className,
+	...inputProps
 }: InputProps<T>) => {
-  return (
-    <label className="floating-label w-full mt-5">
-      <span className="text-lg flex items-center gap-2">{label}</span>
-      <input
-        {...form.register(name, formOptions)}
-        type="text"
-        className={cn(
-          "input input-bordered w-full placeholder:text-neutral-600",
-          className
-        )}
-        placeholder={placeholder}
-        {...inputProps}
-      />
-      {form.formState.errors[name] && (
-        <p className="text-error">
-          {form.formState.errors[name].message as string}
-        </p>
-      )}
-    </label>
-  );
+	return (
+		<label className="floating-label w-full mt-5">
+			<span className="text-lg flex items-center gap-2">{label}</span>
+			<input
+				{...form.register(name, formOptions)}
+				className={cn(
+					"input input-bordered w-full placeholder:text-neutral-600",
+					className,
+				)}
+				placeholder={placeholder}
+				{...inputProps}
+			/>
+			{form.formState.errors[name] && (
+				<p className="text-error">
+					{form.formState.errors[name].message as string}
+				</p>
+			)}
+		</label>
+	);
 };

apps/hub/app/_components/ui/Select.tsx

@@ -17,7 +17,7 @@ interface SelectProps<T extends FieldValues>
 	extends Omit<SelectTemplateProps, "form"> {
 	label?: any;
 	name: Path<T>;
-	form: UseFormReturn<T>;
+	form: UseFormReturn<T> | any;
 	formOptions?: RegisterOptions<T>;
 	// eslint-disable-next-line @typescript-eslint/no-explicit-any
 }