couple minor changes

Author: kentcdodds

app/routes/settings+/profile.index.tsx

@@ -22,7 +22,7 @@ import {
 } from '~/utils/user-validation.ts'
 import { twoFAVerificationType } from './profile.two-factor.tsx'
 
-const profileFormSchema = z.object({
+const ProfileFormSchema = z.object({
 	name: nameSchema.optional(),
 	username: usernameSchema,
 	currentPassword: z
@@ -58,8 +58,19 @@ export async function action({ request }: DataFunctionArgs) {
 	const formData = await request.formData()
 	const submission = await parse(formData, {
 		async: true,
-		schema: profileFormSchema.superRefine(
+		schema: ProfileFormSchema.superRefine(
 			async ({ username, currentPassword, newPassword }, ctx) => {
+				const existingUser = await prisma.user.findUnique({
+					where: { username },
+					select: { id: true },
+				})
+				if (existingUser && existingUser.id !== userId) {
+					ctx.addIssue({
+						path: ['username'],
+						code: 'custom',
+						message: 'A user already exists with this username',
+					})
+				}
 				if (newPassword && !currentPassword) {
 					ctx.addIssue({
 						path: ['newPassword'],
@@ -116,10 +127,10 @@ export default function EditUserProfile() {
 
 	const [form, fields] = useForm({
 		id: 'edit-profile',
-		constraint: getFieldsetConstraint(profileFormSchema),
+		constraint: getFieldsetConstraint(ProfileFormSchema),
 		lastSubmission: actionData?.submission,
 		onValidate({ formData }) {
-			return parse(formData, { schema: profileFormSchema })
+			return parse(formData, { schema: ProfileFormSchema })
 		},
 		defaultValue: {
 			username: data.user.username,

app/routes/settings+/profile.tsx

@@ -1,6 +1,5 @@
 import { json, type DataFunctionArgs } from '@remix-run/node'
 import { Link, Outlet, useMatches } from '@remix-run/react'
-import React from 'react'
 import { Spacer } from '~/components/spacer.tsx'
 import { Icon } from '~/components/ui/icon.tsx'
 import { authenticator, requireUserId } from '~/utils/auth.server.ts'

app/routes/users+/$username_+/notes.tsx

@@ -112,9 +112,9 @@ export default function NotesRoute() {
 						</ul>
 					</div>
 				</div>
-				<main className="relative col-span-3 bg-accent md:rounded-r-3xl">
+				<div className="relative col-span-3 bg-accent md:rounded-r-3xl">
 					<Outlet />
-				</main>
+				</div>
 			</div>
 		</main>
 	)