format

kentcdodds · kentcdodds · commit 21f377782b34 · 2024-10-02T18:34:42.000-06:00
Closes #865
diff --git a/app/components/ui/input-otp.tsx b/app/components/ui/input-otp.tsx
@@ -40,7 +40,7 @@ const InputOTPSlot = React.forwardRef<
 		<div
 			ref={ref}
 			className={cn(
-				'relative flex h-10 w-10 items-center justify-center border-y border-r border-input text-base md:text-sm transition-all first:rounded-l-md first:border-l last:rounded-r-md',
+				'relative flex h-10 w-10 items-center justify-center border-y border-r border-input text-base transition-all first:rounded-l-md first:border-l last:rounded-r-md md:text-sm',
 				isActive && 'z-10 ring-2 ring-ring ring-offset-background',
 				className,
 			)}
diff --git a/app/components/ui/input.tsx b/app/components/ui/input.tsx
@@ -11,7 +11,7 @@ const Input = React.forwardRef<HTMLInputElement, InputProps>(
 			<input
 				type={type}
 				className={cn(
-					'flex h-10 w-full rounded-md border border-input bg-background px-3 py-2 text-base md:text-sm ring-offset-background file:border-0 file:bg-transparent file:text-base md:file:text-sm file:font-medium placeholder:text-muted-foreground focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-offset-2 disabled:cursor-not-allowed disabled:opacity-50 aria-[invalid]:border-input-invalid',
+					'flex h-10 w-full rounded-md border border-input bg-background px-3 py-2 text-base ring-offset-background file:border-0 file:bg-transparent file:text-base file:font-medium placeholder:text-muted-foreground focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-offset-2 disabled:cursor-not-allowed disabled:opacity-50 aria-[invalid]:border-input-invalid md:text-sm md:file:text-sm',
 					className,
 				)}
 				ref={ref}
diff --git a/app/components/ui/textarea.tsx b/app/components/ui/textarea.tsx
@@ -10,7 +10,7 @@ const Textarea = React.forwardRef<HTMLTextAreaElement, TextareaProps>(
 		return (
 			<textarea
 				className={cn(
-					'flex min-h-[80px] w-full rounded-md border border-input bg-background px-3 py-2 text-base md:text-sm ring-offset-background placeholder:text-muted-foreground focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-offset-2 disabled:cursor-not-allowed disabled:opacity-50 aria-[invalid]:border-input-invalid',
+					'flex min-h-[80px] w-full rounded-md border border-input bg-background px-3 py-2 text-base ring-offset-background placeholder:text-muted-foreground focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-offset-2 disabled:cursor-not-allowed disabled:opacity-50 aria-[invalid]:border-input-invalid md:text-sm',
 					className,
 				)}
 				ref={ref}
diff --git a/app/routes/_auth+/onboarding.tsx b/app/routes/_auth+/onboarding.tsx
@@ -228,7 +228,7 @@ export default function OnboardingRoute() {
 					<div className="flex items-center justify-between gap-6">
 						<StatusButton
 							className="w-full"
-							status={isPending ? 'pending' : form.status ?? 'idle'}
+							status={isPending ? 'pending' : (form.status ?? 'idle')}
 							type="submit"
 							disabled={isPending}
 						>
diff --git a/app/routes/_auth+/onboarding_.$provider.tsx b/app/routes/_auth+/onboarding_.$provider.tsx
@@ -271,7 +271,7 @@ export default function OnboardingProviderRoute() {
 					<div className="flex items-center justify-between gap-6">
 						<StatusButton
 							className="w-full"
-							status={isPending ? 'pending' : form.status ?? 'idle'}
+							status={isPending ? 'pending' : (form.status ?? 'idle')}
 							type="submit"
 							disabled={isPending}
 						>
diff --git a/app/routes/settings+/profile.change-email.tsx b/app/routes/settings+/profile.change-email.tsx
@@ -138,7 +138,7 @@ export default function ChangeEmailIndex() {
 					<ErrorList id={form.errorId} errors={form.errors} />
 					<div>
 						<StatusButton
-							status={isPending ? 'pending' : form.status ?? 'idle'}
+							status={isPending ? 'pending' : (form.status ?? 'idle')}
 						>
 							Send Confirmation
 						</StatusButton>
diff --git a/app/routes/settings+/profile.connections.tsx b/app/routes/settings+/profile.connections.tsx
@@ -197,7 +197,7 @@ function Connection({
 									status={
 										deleteFetcher.state !== 'idle'
 											? 'pending'
-											: deleteFetcher.data?.status ?? 'idle'
+											: (deleteFetcher.data?.status ?? 'idle')
 									}
 								>
 									<Icon name="cross-1" />
diff --git a/app/routes/settings+/profile.index.tsx b/app/routes/settings+/profile.index.tsx
@@ -262,7 +262,9 @@ function UpdateProfile() {
 					size="wide"
 					name="intent"
 					value={profileUpdateActionIntent}
-					status={fetcher.state !== 'idle' ? 'pending' : form.status ?? 'idle'}
+					status={
+						fetcher.state !== 'idle' ? 'pending' : (form.status ?? 'idle')
+					}
 				>
 					Save changes
 				</StatusButton>
@@ -309,7 +311,7 @@ function SignOutOfSessions() {
 						status={
 							fetcher.state !== 'idle'
 								? 'pending'
-								: fetcher.data?.status ?? 'idle'
+								: (fetcher.data?.status ?? 'idle')
 						}
 					>
 						<Icon name="avatar">
diff --git a/app/routes/settings+/profile.password.tsx b/app/routes/settings+/profile.password.tsx
@@ -167,7 +167,7 @@ export default function ChangePasswordRoute() {
 				</Button>
 				<StatusButton
 					type="submit"
-					status={isPending ? 'pending' : form.status ?? 'idle'}
+					status={isPending ? 'pending' : (form.status ?? 'idle')}
 				>
 					Change Password
 				</StatusButton>
diff --git a/app/routes/settings+/profile.password_.create.tsx b/app/routes/settings+/profile.password_.create.tsx
@@ -118,7 +118,7 @@ export default function CreatePasswordRoute() {
 				</Button>
 				<StatusButton
 					type="submit"
-					status={isPending ? 'pending' : form.status ?? 'idle'}
+					status={isPending ? 'pending' : (form.status ?? 'idle')}
 				>
 					Create Password
 				</StatusButton>
diff --git a/app/routes/settings+/profile.photo.tsx b/app/routes/settings+/profile.photo.tsx
@@ -202,7 +202,7 @@ export default function PhotoRoute() {
 							pendingIntent === 'submit'
 								? 'pending'
 								: lastSubmissionIntent === 'submit'
-									? form.status ?? 'idle'
+									? (form.status ?? 'idle')
 									: 'idle'
 						}
 					>
@@ -228,7 +228,7 @@ export default function PhotoRoute() {
 								pendingIntent === 'delete'
 									? 'pending'
 									: lastSubmissionIntent === 'delete'
-										? form.status ?? 'idle'
+										? (form.status ?? 'idle')
 										: 'idle'
 							}
 						>
diff --git a/app/routes/settings+/profile.two-factor.verify.tsx b/app/routes/settings+/profile.two-factor.verify.tsx
@@ -201,7 +201,7 @@ export default function TwoFactorRoute() {
 									pendingIntent === 'verify'
 										? 'pending'
 										: lastSubmissionIntent === 'verify'
-											? form.status ?? 'idle'
+											? (form.status ?? 'idle')
 											: 'idle'
 								}
 								type="submit"
@@ -217,7 +217,7 @@ export default function TwoFactorRoute() {
 									pendingIntent === 'cancel'
 										? 'pending'
 										: lastSubmissionIntent === 'cancel'
-											? form.status ?? 'idle'
+											? (form.status ?? 'idle')
 											: 'idle'
 								}
 								type="submit"
diff --git a/app/routes/users+/$username_+/notes.$noteId.tsx b/app/routes/users+/$username_+/notes.$noteId.tsx
@@ -172,7 +172,7 @@ export function DeleteNote({ id }: { id: string }) {
 				name="intent"
 				value="delete-note"
 				variant="destructive"
-				status={isPending ? 'pending' : form.status ?? 'idle'}
+				status={isPending ? 'pending' : (form.status ?? 'idle')}
 				disabled={isPending}
 				className="w-full max-md:aspect-square max-md:px-0"
 			>
diff --git a/app/utils/auth.server.ts b/app/utils/auth.server.ts
@@ -53,7 +53,7 @@ export async function requireUserId(
 		redirectTo =
 			redirectTo === null
 				? null
-				: redirectTo ?? `${requestUrl.pathname}${requestUrl.search}`
+				: (redirectTo ?? `${requestUrl.pathname}${requestUrl.search}`)
 		const loginParams = redirectTo ? new URLSearchParams({ redirectTo }) : null
 		const loginRedirect = ['/login', loginParams?.toString()]
 			.filter(Boolean)
diff --git a/docs/fonts.md b/docs/fonts.md
@@ -6,7 +6,8 @@ easy to do so.
 
 ## Using Custom Fonts
 
-You can use custom fonts by creating the `./public/fonts` directory (if it doesn't already exist) and adding them to it.
+You can use custom fonts by creating the `./public/fonts` directory (if it
+doesn't already exist) and adding them to it.
 [Google Fonts](https://fonts.google.com/) is a good place to find open source
 fonts. You will also need to add the `css` file for the font to the
 `./app/styles` directory, if your font doesn't come with one (Google Fonts
diff --git a/public/favicons/README.md b/public/favicons/README.md
@@ -1,10 +1,12 @@
 # Favicon
 
-This directory has the icons used for android devices. In
-some cases, we cannot reliably detect light/dark mode preference. Hence these icons should not have a transparent background. These icons are
-referenced in the `site.webmanifest` file.
+This directory has the icons used for android devices. In some cases, we cannot
+reliably detect light/dark mode preference. Hence these icons should not have a
+transparent background. These icons are referenced in the `site.webmanifest`
+file.
 
-The icons used by modern browsers and Apple devices are in `app/assets/favicons` as they can be imported with a fingerprint to bust the browser cache.
+The icons used by modern browsers and Apple devices are in `app/assets/favicons`
+as they can be imported with a fingerprint to bust the browser cache.
 
 Note, there's also a `favicon.ico` in the root of `/public` which some older
 browsers will request automatically. This is a fallback for those browsers.

Original file line number	Diff line number	Diff line change
`@@ -228,7 +228,7 @@ export default function OnboardingRoute() {`
`228`	`228`	`<div className="flex items-center justify-between gap-6">`
`229`	`229`	`<StatusButton`
`230`	`230`	`className="w-full"`
`231`		`- status={isPending ? 'pending' : form.status ?? 'idle'}`
	`231`	`+ status={isPending ? 'pending' : (form.status ?? 'idle')}`
`232`	`232`	`type="submit"`
`233`	`233`	`disabled={isPending}`
`234`	`234`	`>`
Original file line number	Diff line number	Diff line change
`@@ -271,7 +271,7 @@ export default function OnboardingProviderRoute() {`
`271`	`271`	`<div className="flex items-center justify-between gap-6">`
`272`	`272`	`<StatusButton`
`273`	`273`	`className="w-full"`
`274`		`- status={isPending ? 'pending' : form.status ?? 'idle'}`
	`274`	`+ status={isPending ? 'pending' : (form.status ?? 'idle')}`
`275`	`275`	`type="submit"`
`276`	`276`	`disabled={isPending}`
`277`	`277`	`>`
Original file line number	Diff line number	Diff line change
`@@ -138,7 +138,7 @@ export default function ChangeEmailIndex() {`
`138`	`138`	`<ErrorList id={form.errorId} errors={form.errors} />`
`139`	`139`	`<div>`
`140`	`140`	`<StatusButton`
`141`		`- status={isPending ? 'pending' : form.status ?? 'idle'}`
	`141`	`+ status={isPending ? 'pending' : (form.status ?? 'idle')}`
`142`	`142`	`>`
`143`	`143`	`Send Confirmation`
`144`	`144`	`</StatusButton>`
Original file line number	Diff line number	Diff line change
`@@ -197,7 +197,7 @@ function Connection({`
`197`	`197`	`status={`
`198`	`198`	`deleteFetcher.state !== 'idle'`
`199`	`199`	`? 'pending'`
`200`		`- : deleteFetcher.data?.status ?? 'idle'`
	`200`	`+ : (deleteFetcher.data?.status ?? 'idle')`
`201`	`201`	`}`
`202`	`202`	`>`
`203`	`203`	`<Icon name="cross-1" />`
Original file line number	Diff line number	Diff line change
`@@ -262,7 +262,9 @@ function UpdateProfile() {`
`262`	`262`	`size="wide"`
`263`	`263`	`name="intent"`
`264`	`264`	`value={profileUpdateActionIntent}`
`265`		`- status={fetcher.state !== 'idle' ? 'pending' : form.status ?? 'idle'}`
	`265`	`+ status={`
	`266`	`+ fetcher.state !== 'idle' ? 'pending' : (form.status ?? 'idle')`
	`267`	`+ }`
`266`	`268`	`>`
`267`	`269`	`Save changes`
`268`	`270`	`</StatusButton>`
`@@ -309,7 +311,7 @@ function SignOutOfSessions() {`
`309`	`311`	`status={`
`310`	`312`	`fetcher.state !== 'idle'`
`311`	`313`	`? 'pending'`
`312`		`- : fetcher.data?.status ?? 'idle'`
	`314`	`+ : (fetcher.data?.status ?? 'idle')`
`313`	`315`	`}`
`314`	`316`	`>`
`315`	`317`	`<Icon name="avatar">`
Original file line number	Diff line number	Diff line change
`@@ -167,7 +167,7 @@ export default function ChangePasswordRoute() {`
`167`	`167`	`</Button>`
`168`	`168`	`<StatusButton`
`169`	`169`	`type="submit"`
`170`		`- status={isPending ? 'pending' : form.status ?? 'idle'}`
	`170`	`+ status={isPending ? 'pending' : (form.status ?? 'idle')}`
`171`	`171`	`>`
`172`	`172`	`Change Password`
`173`	`173`	`</StatusButton>`
Original file line number	Diff line number	Diff line change
`@@ -118,7 +118,7 @@ export default function CreatePasswordRoute() {`
`118`	`118`	`</Button>`
`119`	`119`	`<StatusButton`
`120`	`120`	`type="submit"`
`121`		`- status={isPending ? 'pending' : form.status ?? 'idle'}`
	`121`	`+ status={isPending ? 'pending' : (form.status ?? 'idle')}`
`122`	`122`	`>`
`123`	`123`	`Create Password`
`124`	`124`	`</StatusButton>`