45 lines
1.3 KiB
TypeScript
45 lines
1.3 KiB
TypeScript
"use client";
|
|
|
|
import { FC } from "react";
|
|
import { Grid } from "@mui/material";
|
|
import { DisplayTextField } from "ui";
|
|
import { Selectable } from "kysely";
|
|
import { Database } from "@/app/_lib/database";
|
|
import { Detail as InternalDetail } from "@/app/_components/Detail";
|
|
import { generateDeleteAction } from "@/app/_lib/actions";
|
|
import { serviceConfig } from "@/app/_config/config";
|
|
|
|
type DetailProps = {
|
|
service: string;
|
|
row: Selectable<keyof Database>;
|
|
};
|
|
|
|
export const Detail: FC<DetailProps> = ({ service, row }) => {
|
|
const {
|
|
[service]: { entity, table, displayName, displayFields: fields },
|
|
} = serviceConfig;
|
|
const deleteAction = generateDeleteAction({ entity, table });
|
|
|
|
return (
|
|
<InternalDetail
|
|
title={`${displayName}: ${row.name}`}
|
|
entity={entity}
|
|
id={row.id as string}
|
|
deleteAction={deleteAction}
|
|
>
|
|
<Grid container direction="row" rowSpacing={3} columnSpacing={2}>
|
|
{fields.map((field) => (
|
|
<Grid item xs={field.size ?? 6} key={field.name}>
|
|
<DisplayTextField
|
|
name={field.name}
|
|
label={field.label}
|
|
lines={field.lines ?? 1}
|
|
value={row[field.name] as string}
|
|
copyable={field.copyable ?? false}
|
|
/>
|
|
</Grid>
|
|
))}
|
|
</Grid>
|
|
</InternalDetail>
|
|
);
|
|
};
|