Merge branch 'main' into feat/DOC-170-add-name-field

packages/features/uploadDocument.ts

@@ -1,9 +1,10 @@
 import router from "next/router";
 import { NEXT_PUBLIC_WEBAPP_URL } from "../lib/constants";
 import toast from "react-hot-toast";
+import { ChangeEvent } from "react";
 
-export const uploadDocument = async (event: any) => {
-  if (event.target.files && event.target.files[0]) {
+export const uploadDocument = async (event: ChangeEvent) => {
+  if (event.target instanceof HTMLInputElement && event.target?.files && event.target.files[0]) {
     const body = new FormData();
     const document = event.target.files[0];
     const fileName: string = event.target.files[0].name;
@@ -12,8 +13,10 @@ export const uploadDocument = async (event: any) => {
       toast.error("Non-PDF documents are not supported yet.");
       return;
     }
+
     body.append("document", document || "");
-    const response: any = await toast
+
+    await toast
       .promise(
         fetch("/api/documents", {
           method: "POST",

packages/prisma/migrations/20230421134018_doc_214_add_signed_at_field/migration.sql

@@ -0,0 +1,2 @@
+-- AlterTable
+ALTER TABLE "Recipient" ADD COLUMN     "signedAt" TIMESTAMP(3);

packages/prisma/package.json

@@ -3,20 +3,20 @@
   "version": "0.0.0",
   "private": true,
   "main": "index.ts",
-  "devDependencies": {
-    "@types/node": "^18.11.18",
-    "ts-node": "^10.9.1",
-    "typescript": "4.8.4"
+  "scripts": {
+    "db-studio": "prisma studio",
+    "db-seed": "prisma db seed"
   },
   "dependencies": {
     "@prisma/client": "^4.8.1",
     "prisma": "^4.8.1"
   },
-  "scripts": {
-    "db-studio": "prisma studio",
-    "db-seed": "prisma db seed"
+  "devDependencies": {
+    "@types/node": "^18.11.18",
+    "ts-node": "^10.9.1",
+    "typescript": "4.8.4"
   },
   "prisma": {
     "seed": "ts-node --transpile-only ./seed.ts"
   }
-}
+}

packages/prisma/schema.prisma

@@ -92,6 +92,7 @@ model Recipient {
   name          String        @default("") @db.VarChar(255)
   token         String
   expired       DateTime?
+  signedAt      DateTime?
   readStatus    ReadStatus    @default(NOT_OPENED)
   signingStatus SigningStatus @default(NOT_SIGNED)
   sendStatus    SendStatus    @default(NOT_SENT)

packages/ui/components/button/Button.tsx

@@ -6,8 +6,8 @@ export function Button(props: any) {
   const isLink = typeof props.href !== "undefined" && !props.disabled;
   const { color = "primary", icon, disabled, onClick } = props;
   const baseStyles =
-    "inline-flex items-center justify-center min-w-[80px] rounded-md border border-transparent px-4 py-2 text-sm font-medium shadow-sm disabled:bg-gray-300";
-  const primaryStyles = "text-white bg-neon hover:bg-neon-dark";
+    "inline-flex gap-x-2 items-center justify-center min-w-[80px] rounded-md border border-transparent px-4 py-2 text-sm font-medium shadow-sm disabled:bg-gray-300 duration-200";
+  const primaryStyles = "text-gray-900 bg-neon hover:bg-neon-dark";
   const secondaryStyles = "border-gray-300 bg-white text-gray-700 hover:bg-gray-50";
 
   return isLink ? (
@@ -21,7 +21,7 @@ export function Button(props: any) {
       )}
       hidden={props.hidden}>
       {props.icon ? (
-        <props.icon className="mr-1 inline h-5 text-inherit" aria-hidden="true"></props.icon>
+        <props.icon className="inline-block h-5 text-inherit" aria-hidden="true"></props.icon>
       ) : (
         ""
       )}
@@ -40,7 +40,7 @@ export function Button(props: any) {
       disabled={props.disabled || props.loading}
       hidden={props.hidden}>
       {props.icon ? (
-        <props.icon className="mr-1 inline h-5 text-inherit" aria-hidden="true"></props.icon>
+        <props.icon className="inline h-5 text-inherit" aria-hidden="true"></props.icon>
       ) : (
         ""
       )}

packages/ui/components/tooltip/Tooltip.tsx

@@ -0,0 +1,34 @@
+import React, { useState } from "react";
+import { classNames } from "@documenso/lib";
+
+export function Tooltip(props: any) {
+  let timeout: NodeJS.Timeout;
+  const [active, setActive] = useState(false);
+
+  const showTip = () => {
+    timeout = setTimeout(() => {
+      setActive(true);
+    }, props.delay || 40);
+  };
+
+  const hideTip = () => {
+    clearInterval(timeout);
+    setActive(false);
+  };
+
+  return (
+    <div className="relative" onPointerEnter={showTip} onPointerLeave={hideTip}>
+      {props.children}
+      <div
+        className={classNames(
+          "absolute left-1/4 -translate-x-1/2 transform px-4 transition-all delay-50 duration-120",
+          active && "bottom-9 opacity-100",
+          !active && "pointer-events-none bottom-6 opacity-0"
+        )}>
+        <span className="text-neon-800 bg-neon-200 inline-block rounded py-1 px-2 text-xs">
+          {props.label}
+        </span>
+      </div>
+    </div>
+  );
+};

packages/ui/components/tooltip/index.ts

@@ -0,0 +1 @@
+export { Tooltip } from "./Tooltip";

packages/ui/index.ts

@@ -2,3 +2,4 @@ export { Button, IconButton } from "./components/button/index";
 export { SelectBox } from "./components/selectBox/index";
 export { Breadcrumb } from "./components/breadcrumb/index";
 export { Dialog } from "./components/dialog/index";
+export { Tooltip } from "./components/tooltip/index";