Ryan/documenso
1
0
Fork 1
mirror of https://github.com/documenso/documenso.git synced 2026-07-27 02:15:05 +10:00
Code Issues Packages Projects Releases Wiki Activity

Inline items, left aligned

Browse Source
This commit is contained in:
litaesther10
2023-03-22 17:12:15 +01:00
parent 2f2b708bfe
commit d4324538cc
1 changed files with 88 additions and 86 deletions
Download Patch File Download Diff File Expand all files Collapse all files
apps/web/pages/documents/[id]/recipients.tsx
+88 -86
View File
@@ -139,7 +139,7 @@ const RecipientsPage: NextPageWithLayout = (props: any) => {
</div> </div>
<div className="p-4 mt-10 overflow-hidden bg-white rounded-md shadow sm:p-6"> <div className="p-4 mt-10 overflow-hidden bg-white rounded-md shadow sm:p-6">
<div className="pb-3 border-b border-gray-200 sm:pb-5"> <div className="pb-3 border-b border-gray-200 sm:pb-5">
<h3 className="text-base font-medium leading-4 text-gray-900 sm:leading-6 sm:text-lg"> <h3 className="text-lg font-medium leading-6 text-gray-900 ">
Signers Signers
</h3> </h3>
<p className="max-w-4xl mt-2 text-sm text-gray-500"> <p className="max-w-4xl mt-2 text-sm text-gray-500">
@@ -248,99 +248,101 @@ const RecipientsPage: NextPageWithLayout = (props: any) => {
placeholder="John Dorian" placeholder="John Dorian"
/> />
</div> </div>
<div className="flex mx-2 sm:ml-auto sm:mx-0"> <div className="flex items-center space-x-2">
<div key={item.id} className="space-x-2 sm:space-x-0"> <div className="flex mb-2 mr-2 sm:ml-auto sm:mr-0">
{item.sendStatus === "NOT_SENT" ? ( <div key={item.id} className="space-x-2">
<span {item.sendStatus === "NOT_SENT" ? (
id="sent_icon"
className="inline-block mt-3 flex-shrink-0 rounded-full bg-gray-200 px-2 py-0.5 text-xs font-medium text-gray-800"
>
Not Sent
</span>
) : (
""
)}
{item.sendStatus === "SENT" &&
item.readStatus !== "OPENED" ? (
<span id="sent_icon">
<span <span
id="sent_icon" id="sent_icon"
className="inline-block mt-3 flex-shrink-0 rounded-full bg-yellow-200 px-2 py-0.5 text-xs font-medium text-gray-800" className="inline-block mt-3 flex-shrink-0 rounded-full bg-gray-200 px-2 py-0.5 text-xs font-medium text-gray-800"
> >
<CheckIcon className="inline h-5 mr-1" /> Sent Not Sent
</span> </span>
</span> ) : (
) : ( ""
"" )}
)} {item.sendStatus === "SENT" &&
{item.readStatus === "OPENED" && item.readStatus !== "OPENED" ? (
item.signingStatus === "NOT_SIGNED" ? ( <span id="sent_icon">
<span id="read_icon"> <span
<span id="sent_icon"
id="sent_icon" className="inline-block mt-3 flex-shrink-0 rounded-full bg-yellow-200 px-2 py-0.5 text-xs font-medium text-gray-800"
className="inline-block mt-3 flex-shrink-0 rounded-full bg-yellow-200 px-2 py-0.5 text-xs font-medium text-gray-800" >
> <CheckIcon className="inline h-5 mr-1" /> Sent
<CheckIcon className="inline h-5 -mr-2"></CheckIcon> </span>
<CheckIcon className="inline h-5 mr-1"></CheckIcon>
Seen
</span> </span>
</span> ) : (
) : ( ""
"" )}
)} {item.readStatus === "OPENED" &&
{item.signingStatus === "SIGNED" ? ( item.signingStatus === "NOT_SIGNED" ? (
<span id="signed_icon"> <span id="read_icon">
<span <span
id="sent_icon" id="sent_icon"
className="inline-block mt-3 flex-shrink-0 rounded-full bg-green-100 px-2 py-0.5 text-xs font-medium text-green-800" className="inline-block mt-3 flex-shrink-0 rounded-full bg-yellow-200 px-2 py-0.5 text-xs font-medium text-gray-800"
> >
<CheckBadgeIcon className="inline h-5 mr-1"></CheckBadgeIcon> <CheckIcon className="inline h-5 -mr-2"></CheckIcon>
Signed <CheckIcon className="inline h-5 mr-1"></CheckIcon>
Seen
</span>
</span> </span>
</span> ) : (
) : ( ""
"" )}
)} {item.signingStatus === "SIGNED" ? (
<span id="signed_icon">
<span
id="sent_icon"
className="inline-block mt-3 flex-shrink-0 rounded-full bg-green-100 px-2 py-0.5 text-xs font-medium text-green-800"
>
<CheckBadgeIcon className="inline h-5 mr-1"></CheckBadgeIcon>
Signed
</span>
</span>
) : (
""
)}
</div>
</div> </div>
</div> <div className="mr-1 ">
<div className="flex ml-auto mr-1"> <IconButton
<IconButton icon={PaperAirplaneIcon}
icon={PaperAirplaneIcon} disabled={
disabled={ !item.id ||
!item.id || item.sendStatus !== "SENT" ||
item.sendStatus !== "SENT" || item.signingStatus === "SIGNED" ||
item.signingStatus === "SIGNED" || loading
loading
}
color="secondary"
className="my-auto mr-4 h-9"
onClick={() => {
if (confirm("Resend this signing request?")) {
setLoading(true);
sendSigningRequests(props.document, [
item.id,
]).finally(() => {
setLoading(false);
});
} }
}} color="secondary"
> className="my-auto mr-4 h-9"
Resend onClick={() => {
</IconButton> if (confirm("Resend this signing request?")) {
<IconButton setLoading(true);
icon={TrashIcon} sendSigningRequests(props.document, [
disabled={ item.id,
!item.id || item.sendStatus === "SENT" || loading ]).finally(() => {
} setLoading(false);
onClick={() => { });
const removedItem = { ...fields }[index]; }
remove(index); }}
deleteRecipient(item)?.catch((err) => { >
append(removedItem); Resend
}); </IconButton>
}} <IconButton
className="group-hover:text-neon-dark group-hover:disabled:text-gray-400" icon={TrashIcon}
/> disabled={
!item.id || item.sendStatus === "SENT" || loading
}
onClick={() => {
const removedItem = { ...fields }[index];
remove(index);
deleteRecipient(item)?.catch((err) => {
append(removedItem);
});
}}
className="group-hover:text-neon-dark group-hover:disabled:text-gray-400"
/>
</div>
</div> </div>
</div> </div>
</li> </li>