feat: show fields on other sections

This commit is contained in:
Ephraim Atta-Duncan
2024-01-30 00:09:22 +00:00
parent a3a4480b03
commit f8125aec54
3 changed files with 11 additions and 6 deletions

View File

@ -28,6 +28,7 @@ import {
DocumentFlowFormContainerHeader, DocumentFlowFormContainerHeader,
DocumentFlowFormContainerStep, DocumentFlowFormContainerStep,
} from './document-flow-root'; } from './document-flow-root';
import { ShowFieldItem } from './show-field-item';
import type { DocumentFlowStep } from './types'; import type { DocumentFlowStep } from './types';
export type AddSignersFormProps = { export type AddSignersFormProps = {
@ -42,7 +43,7 @@ export const AddSignersFormPartial = ({
documentFlow, documentFlow,
recipients, recipients,
document, document,
fields: _fields, fields,
onSubmit, onSubmit,
}: AddSignersFormProps) => { }: AddSignersFormProps) => {
const { toast } = useToast(); const { toast } = useToast();
@ -136,6 +137,10 @@ export const AddSignersFormPartial = ({
/> />
<DocumentFlowFormContainerContent> <DocumentFlowFormContainerContent>
<div className="flex w-full flex-col gap-y-4"> <div className="flex w-full flex-col gap-y-4">
{fields.map((field, index) => (
<ShowFieldItem key={index} field={field} recipients={recipients} />
))}
<AnimatePresence> <AnimatePresence>
{signers.map((signer, index) => ( {signers.map((signer, index) => (
<motion.div <motion.div

View File

@ -38,7 +38,7 @@ import {
DocumentFlowFormContainerHeader, DocumentFlowFormContainerHeader,
DocumentFlowFormContainerStep, DocumentFlowFormContainerStep,
} from './document-flow-root'; } from './document-flow-root';
import { SubjectFieldItem } from './subject-field-item'; import { ShowFieldItem } from './show-field-item';
import type { DocumentFlowStep } from './types'; import type { DocumentFlowStep } from './types';
export type AddSubjectFormProps = { export type AddSubjectFormProps = {
@ -99,7 +99,7 @@ export const AddSubjectFormPartial = ({
<DocumentFlowFormContainerContent> <DocumentFlowFormContainerContent>
<div className="flex flex-col"> <div className="flex flex-col">
{fields.map((field, index) => ( {fields.map((field, index) => (
<SubjectFieldItem key={index} field={field} recipients={recipients} /> <ShowFieldItem key={index} field={field} recipients={recipients} />
))} ))}
<div className="flex flex-col gap-y-4"> <div className="flex flex-col gap-y-4">

View File

@ -2,6 +2,7 @@
import { useCallback, useEffect, useState } from 'react'; import { useCallback, useEffect, useState } from 'react';
import type { Prisma } from '@prisma/client';
import { createPortal } from 'react-dom'; import { createPortal } from 'react-dom';
import { Rnd } from 'react-rnd'; import { Rnd } from 'react-rnd';
@ -10,14 +11,13 @@ import { PDF_VIEWER_PAGE_SELECTOR } from '@documenso/lib/constants/pdf-viewer';
import { cn } from '../../lib/utils'; import { cn } from '../../lib/utils';
import { Card, CardContent } from '../card'; import { Card, CardContent } from '../card';
import { FRIENDLY_FIELD_TYPE } from './types'; import { FRIENDLY_FIELD_TYPE } from './types';
import type { Prisma } from '.prisma/client';
export type FieldItemProps = { export type ShowFieldItemProps = {
field: Prisma.FieldGetPayload<null>; field: Prisma.FieldGetPayload<null>;
recipients: Prisma.RecipientGetPayload<null>[]; recipients: Prisma.RecipientGetPayload<null>[];
}; };
export const SubjectFieldItem = ({ field, recipients }: FieldItemProps) => { export const ShowFieldItem = ({ field, recipients }: ShowFieldItemProps) => {
const [coords, setCoords] = useState({ const [coords, setCoords] = useState({
pageX: Number(field.positionX), pageX: Number(field.positionX),
pageY: Number(field.positionY), pageY: Number(field.positionY),