From 0cab3acd62c240254c3943ca4b83013ead3acddb Mon Sep 17 00:00:00 2001
From: Max Leiter <max.leiter@vercel.com>
Date: Sun, 20 Nov 2022 21:02:09 -0800
Subject: [PATCH] enforce label or aria-label on input props

---
 .../edit-document-list/edit-document/index.tsx      |  9 ++++-----
 .../components/post-page/view-document/index.tsx    |  1 +
 client/app/components/input/index.tsx               | 13 ++++++++++++-
 3 files changed, 17 insertions(+), 6 deletions(-)

diff --git a/client/app/(posts)/new/components/edit-document-list/edit-document/index.tsx b/client/app/(posts)/new/components/edit-document-list/edit-document/index.tsx
index 3c8225a3..e4f0c302 100644
--- a/client/app/(posts)/new/components/edit-document-list/edit-document/index.tsx
+++ b/client/app/(posts)/new/components/edit-document-list/edit-document/index.tsx
@@ -5,13 +5,12 @@ import Button from "@components/button"
 import Input from "@components/input"
 import DocumentTabs from "app/(posts)/components/tabs"
 
-// import Link from "next/link"
 type Props = {
 	title?: string
 	content?: string
 	setTitle?: (title: string) => void
 	handleOnContentChange?: (e: ChangeEvent<HTMLTextAreaElement>) => void
-	initialTab?: "edit" | "preview"
+	defaultTab?: "edit" | "preview"
 	remove?: () => void
 	onPaste?: (e: any) => void
 }
@@ -22,7 +21,7 @@ const Document = ({
 	title,
 	content,
 	setTitle,
-	initialTab = "edit",
+	defaultTab = "edit",
 	handleOnContentChange
 }: Props) => {
 	// const height = editable ? "500px" : '100%'
@@ -86,7 +85,7 @@ const Document = ({
 				<div className={styles.descriptionContainer}>
 					<DocumentTabs
 						isEditing={true}
-						defaultTab={"edit"}
+						defaultTab={defaultTab}
 						handleOnContentChange={handleOnContentChange}
 						onPaste={onPaste}
 						title={title}
@@ -98,4 +97,4 @@ const Document = ({
 	)
 }
 
-export default memo(Document)
+export default Document
diff --git a/client/app/(posts)/post/[id]/components/post-page/view-document/index.tsx b/client/app/(posts)/post/[id]/components/post-page/view-document/index.tsx
index 034d7211..3ba83587 100644
--- a/client/app/(posts)/post/[id]/components/post-page/view-document/index.tsx
+++ b/client/app/(posts)/post/[id]/components/post-page/view-document/index.tsx
@@ -90,6 +90,7 @@ const Document = ({
 						style={{ borderRadius: 0 }}
 						value={title || "Untitled"}
 						disabled
+						aria-label="Document title"
 					/>
 				</Link>
 				<div className={styles.descriptionContainer}>
diff --git a/client/app/components/input/index.tsx b/client/app/components/input/index.tsx
index 0c3faed7..7f7185d4 100644
--- a/client/app/components/input/index.tsx
+++ b/client/app/components/input/index.tsx
@@ -2,6 +2,15 @@ import clsx from "clsx"
 import React from "react"
 import styles from "./input.module.css"
 
+type RequireOnlyOne<T, Keys extends keyof T = keyof T> = Pick<
+	T,
+	Exclude<keyof T, Keys>
+> &
+	{
+		[K in Keys]-?: Required<Pick<T, K>> &
+			Partial<Record<Exclude<Keys, K>, undefined>>
+	}[Keys]
+
 type Props = React.HTMLProps<HTMLInputElement> & {
 	label?: string
 	width?: number | string
@@ -9,8 +18,10 @@ type Props = React.HTMLProps<HTMLInputElement> & {
 	labelClassName?: string
 }
 
+type InputProps = RequireOnlyOne<Props, "label" | "aria-label">
+
 // eslint-disable-next-line react/display-name
-const Input = React.forwardRef<HTMLInputElement, Props>(
+const Input = React.forwardRef<HTMLInputElement, InputProps>(
 	({ label, className, width, height, labelClassName, ...props }, ref) => {
 		return (
 			<div