key fixes, fields

This commit is contained in:
Timur Ercan
2023-02-09 13:14:40 +01:00
parent 3366611d7a
commit 4cb9a3a65a
2 changed files with 13 additions and 5 deletions

View File

@ -1,6 +1,7 @@
import { Fragment, useState } from "react"; import { Fragment, useState } from "react";
import { Document, Page } from "react-pdf/dist/esm/entry.webpack5"; import { Document, Page } from "react-pdf/dist/esm/entry.webpack5";
import Field from "./editor/field"; import Field from "./editor/field";
import short from "short-uuid";
export default function PDFViewer(props) { export default function PDFViewer(props) {
const [file, setFile] = useState(""); const [file, setFile] = useState("");
@ -30,8 +31,9 @@ export default function PDFViewer(props) {
options={options} options={options}
> >
{Array.from({ length: numPages }, (_, index) => ( {Array.from({ length: numPages }, (_, index) => (
<Fragment> <Fragment key={short.generate().toString()}>
<div <div
key={short.generate().toString()}
style={{ style={{
position: "relative", position: "relative",
background: "green", background: "green",
@ -51,9 +53,14 @@ export default function PDFViewer(props) {
renderTextLayer={false} renderTextLayer={false}
onLoadSuccess={() => setLoading(false)} onLoadSuccess={() => setLoading(false)}
onRenderError={() => setLoading(false)} onRenderError={() => setLoading(false)}
> ></Page>
<Field></Field> {props.fields.map((item) => (
</Page> <Field
key={short.generate().toString()}
position={{ x: 0, y: -500 }}
className="absolute"
></Field>
))}
</div> </div>
</div> </div>
</Fragment> </Fragment>

View File

@ -15,6 +15,7 @@ import {
import { getDocument } from "@documenso/lib/query"; import { getDocument } from "@documenso/lib/query";
import { Document as PrismaDocument } from "@prisma/client"; import { Document as PrismaDocument } from "@prisma/client";
import { Button, Breadcrumb } from "@documenso/ui"; import { Button, Breadcrumb } from "@documenso/ui";
import short from "short-uuid";
const PDFViewer = dynamic(() => import("../../../components/pdf-viewer"), { const PDFViewer = dynamic(() => import("../../../components/pdf-viewer"), {
ssr: false, ssr: false,
@ -100,7 +101,7 @@ const DocumentsDetailPage: NextPageWithLayout = (props: any) => {
defaultValue={props?.document?.Recipient[0]} defaultValue={props?.document?.Recipient[0]}
> >
{props?.document?.Recipient?.map((item: any) => ( {props?.document?.Recipient?.map((item: any) => (
<option key={item.email}> <option key={item.email + short.generate().toString()}>
{item.name ? `${item.name} <${item.email}>` : item.email} {item.name ? `${item.name} <${item.email}>` : item.email}
</option> </option>
))} ))}