ユーザーの表示名を「displayName」から「name」に (#531)

ttizze · Jan 23, 2025 · 6801d83 · 6801d83
2 parents 1f77246 + 2733d59
commit 6801d83
Show file tree

Hide file tree

Showing 28 changed files with 64 additions and 74 deletions.
diff --git a/web/app/components/BaseHeaderLayout.tsx b/web/app/components/BaseHeaderLayout.tsx
@@ -47,10 +47,7 @@ export function BaseHeaderLayout({
 						<DropdownMenu>
 							<DropdownMenuTrigger>
 								<Avatar className="w-6 h-6">
-									<AvatarImage
-										src={currentUser.icon}
-										alt={currentUser.displayName}
-									/>
+									<AvatarImage src={currentUser.icon} alt={currentUser.name} />
 									<AvatarFallback>{currentUser.handle}</AvatarFallback>
 								</Avatar>
 							</DropdownMenuTrigger>
@@ -65,7 +62,7 @@ export function BaseHeaderLayout({
 										}
 									>
 										<div className="flex flex-col items-start">
-											{currentUser.displayName}
+											{currentUser.name}
 											<span className="text-xs text-gray-500">
 												@{currentUser.handle}
 											</span>

diff --git a/web/app/components/PageCard.tsx b/web/app/components/PageCard.tsx
@@ -59,17 +59,12 @@ export function PageCard({
 				<div className="flex justify-between items-center">
 					<LocaleLink to={userLink} className="flex items-center">
 						<Avatar className="w-6 h-6 mr-2">
-							<AvatarImage
-								src={pageCard.user.icon}
-								alt={pageCard.user.displayName}
-							/>
+							<AvatarImage src={pageCard.user.icon} alt={pageCard.user.name} />
 							<AvatarFallback>
-								{pageCard.user.displayName.charAt(0).toUpperCase()}
+								{pageCard.user.handle.charAt(0).toUpperCase()}
 							</AvatarFallback>
 						</Avatar>
-						<span className="text-sm text-gray-600">
-							{pageCard.user.displayName}
-						</span>
+						<span className="text-sm text-gray-600">{pageCard.user.name}</span>
 					</LocaleLink>
 
 					<LikeButton

diff --git a/web/app/features/translate/functions/mutations.server.ts b/web/app/features/translate/functions/mutations.server.ts
@@ -6,7 +6,7 @@ export async function getOrCreateAIUser(name: string): Promise<number> {
 		update: {},
 		create: {
 			handle: name,
-			displayName: name,
+			name: name,
 			isAI: true,
 			icon: "",
 			userEmail: {

diff --git a/web/app/features/translate/lib/translate.server.test.ts b/web/app/features/translate/lib/translate.server.test.ts
@@ -24,7 +24,7 @@ describe("translate関数テスト (geminiのみモック)", () => {
 		const user = await prisma.user.create({
 			data: {
 				handle: "testuser",
-				displayName: "testuser",
+				name: "testuser",
 				icon: "testuser",
 			},
 		});

diff --git a/web/app/routes/$locale+/functions/queries.server.ts b/web/app/routes/$locale+/functions/queries.server.ts
@@ -10,7 +10,7 @@ export function createPageCardSelect(locale?: string) {
 		user: {
 			select: {
 				handle: true,
-				displayName: true,
+				name: true,
 				icon: true,
 				profile: true,
 			},

diff --git a/web/app/routes/$locale+/search/functions/queries.server.ts b/web/app/routes/$locale+/search/functions/queries.server.ts
@@ -185,12 +185,12 @@ export async function searchUsers(
 			skip,
 			take,
 			where: {
-				displayName: { contains: query, mode: "insensitive" },
+				name: { contains: query, mode: "insensitive" },
 			},
 		}),
 		prisma.user.count({
 			where: {
-				displayName: { contains: query, mode: "insensitive" },
+				name: { contains: query, mode: "insensitive" },
 			},
 		}),
 	]);

diff --git a/web/app/routes/$locale+/search/route.tsx b/web/app/routes/$locale+/search/route.tsx
@@ -276,7 +276,7 @@ export default function SearchPage() {
 							>
 								<div className="flex-1">
 									<LocaleLink to={`/user/${usr.handle}`}>
-										<h3 className="text-xl font-bold">{usr.displayName}</h3>
+										<h3 className="text-xl font-bold">{usr.name}</h3>
 										<span className="text-gray-500 text-sm">@{usr.handle}</span>
 									</LocaleLink>
 								</div>

diff --git a/web/app/routes/$locale+/user.$handle+/components/FollowListDialog.tsx b/web/app/routes/$locale+/user.$handle+/components/FollowListDialog.tsx
@@ -36,7 +36,7 @@ export function FollowListDialog({
 							{users.map((user) => (
 								<li key={user.id}>
 									<a href={`/user/${user.handle}`} className="underline">
-										{user.displayName} (@{user.handle})
+										{user.name} (@{user.handle})
 									</a>
 								</li>
 							))}

diff --git a/web/app/routes/$locale+/user.$handle+/edit/functions/mutations.server.ts b/web/app/routes/$locale+/user.$handle+/edit/functions/mutations.server.ts
@@ -4,7 +4,7 @@ import { isHandleTaken } from "./queries.server";
 export async function updateUser(
 	userId: number,
 	data: {
-		displayName: string;
+		name: string;
 		handle: string;
 		profile: string | undefined;
 		icon: string;

diff --git a/web/app/routes/$locale+/user.$handle+/edit/route.tsx b/web/app/routes/$locale+/user.$handle+/edit/route.tsx
@@ -32,7 +32,7 @@ export const meta: MetaFunction = () => {
 
 const RESERVED_HANDLES = [...new Set([...reservedHandles])];
 const schema = z.object({
-	displayName: z
+	name: z
 		.string()
 		.min(1, "Display name is required")
 		.max(25, "Too Long. Must be 25 characters or less"),
@@ -84,11 +84,11 @@ export async function action({ request }: ActionFunctionArgs) {
 		return submission.reply();
 	}
 
-	const { displayName, handle, profile, icon } = submission.value;
+	const { name, handle, profile, icon } = submission.value;
 
 	try {
 		const updatedUser = await updateUser(currentUser.id, {
-			displayName,
+			name,
 			handle,
 			profile,
 			icon,
@@ -120,7 +120,7 @@ export default function EditProfile() {
 		shouldValidate: "onBlur",
 		shouldRevalidate: "onInput",
 		defaultValue: {
-			displayName: currentUser.displayName,
+			name: currentUser.name,
 			handle: currentUser.handle,
 			profile: currentUser.profile,
 			icon: currentUser.icon,
@@ -228,14 +228,11 @@ export default function EditProfile() {
 					</div>
 					<div>
 						<Input
-							{...getInputProps(fields.displayName, { type: "text" })}
+							{...getInputProps(fields.name, { type: "text" })}
 							className="w-full h-10 px-3 py-2 border rounded-lg  bg-white dark:bg-black/50 focus:outline-none"
 						/>
-						<div
-							id={fields.displayName.errorId}
-							className="text-red-500 text-sm mt-1"
-						>
-							{fields.displayName.errors}
+						<div id={fields.name.errorId} className="text-red-500 text-sm mt-1">
+							{fields.name.errors}
 						</div>
 					</div>
 					<div>

diff --git a/web/app/routes/$locale+/user.$handle+/functions/queries.server.ts b/web/app/routes/$locale+/user.$handle+/functions/queries.server.ts
@@ -15,7 +15,7 @@ export async function getComments(pageId: number) {
 			user: {
 				select: {
 					handle: true,
-					displayName: true,
+					name: true,
 					icon: true,
 				},
 			},

diff --git a/web/app/routes/$locale+/user.$handle+/index.test.tsx b/web/app/routes/$locale+/user.$handle+/index.test.tsx
@@ -20,7 +20,7 @@ describe("UserProfile", () => {
 		const createdUser = await prisma.user.create({
 			data: {
 				handle: "testuser",
-				displayName: "Test User",
+				name: "Test User",
 				icon: "https://example.com/icon.jpg",
 				profile: "This is a test profile",
 				pages: {
@@ -69,7 +69,7 @@ describe("UserProfile", () => {
 		const createdUser2 = await prisma.user.create({
 			data: {
 				handle: "testuser2",
-				displayName: "Test User2",
+				name: "Test User2",
 				icon: "https://example.com/icon2.jpg",
 				profile: "This is a test profile2",
 			},

diff --git a/web/app/routes/$locale+/user.$handle+/index.tsx b/web/app/routes/$locale+/user.$handle+/index.tsx
@@ -54,7 +54,7 @@ export const meta: MetaFunction<typeof loader> = ({ data }) => {
 	if (!data) {
 		return [{ title: "Profile" }];
 	}
-	return [{ title: data.pageOwner.displayName }];
+	return [{ title: data.pageOwner.name }];
 };
 
 export async function loader({ params, request }: LoaderFunctionArgs) {
@@ -203,20 +203,17 @@ export default function UserPage() {
 						<div>
 							<Link to={`${pageOwner.icon}`}>
 								<Avatar className="w-20 h-20 md:w-24 md:h-24">
-									<AvatarImage
-										src={pageOwner.icon}
-										alt={pageOwner.displayName}
-									/>
+									<AvatarImage src={pageOwner.icon} alt={pageOwner.name} />
 									<AvatarFallback>
-										{pageOwner.displayName.charAt(0).toUpperCase()}
+										{pageOwner.name.charAt(0).toUpperCase()}
 									</AvatarFallback>
 								</Avatar>
 							</Link>
 						</div>
 						<div className="mt-2 md:mt-0 md:ml-4 flex items-center justify-between w-full">
 							<div>
 								<CardTitle className="text-xl md:text-2xl font-bold">
-									{pageOwner.displayName}
+									{pageOwner.name}
 								</CardTitle>
 								<div>
 									<CardDescription className="text-sm text-gray-500">

diff --git a/web/app/routes/$locale+/user.$handle+/page+/$slug+/components/ContentWithTranslations.tsx b/web/app/routes/$locale+/user.$handle+/page+/$slug+/components/ContentWithTranslations.tsx
@@ -65,16 +65,14 @@ export function ContentWithTranslations({
 					<Avatar className="w-10 h-10 flex-shrink-0 mr-3 ">
 						<AvatarImage
 							src={pageWithTranslations.user.icon}
-							alt={pageWithTranslations.user.displayName}
+							alt={pageWithTranslations.user.name}
 						/>
 						<AvatarFallback>
-							{pageWithTranslations.user.displayName.charAt(0).toUpperCase()}
+							{pageWithTranslations.user.name.charAt(0).toUpperCase()}
 						</AvatarFallback>
 					</Avatar>
 					<div className="flex flex-col">
-						<span className="text-sm">
-							{pageWithTranslations.user.displayName}
-						</span>
+						<span className="text-sm">{pageWithTranslations.user.name}</span>
 						<span className="text-xs text-gray-500">
 							{pageWithTranslations.page.createdAt}
 						</span>

diff --git a/...r.$handle+/page+/$slug+/components/sourceTextAndTranslationSection/TranslationSection.tsx b/...r.$handle+/page+/$slug+/components/sourceTextAndTranslationSection/TranslationSection.tsx
@@ -51,7 +51,7 @@ export function TranslationSection({
 							className="!no-underline mr-2"
 						>
 							<p className="text-sm text-gray-500 text-right flex justify-end items-center">
-								by: {bestTranslationWithVote?.translateText.user.displayName}
+								by: {bestTranslationWithVote?.translateText.user.name}
 							</p>
 						</LocaleLink>
 						<VoteButtons translationWithVote={bestTranslationWithVote} />

diff --git a/web/app/routes/$locale+/user.$handle+/page+/$slug+/edit/_edit.test.tsx b/web/app/routes/$locale+/user.$handle+/page+/$slug+/edit/_edit.test.tsx
@@ -54,7 +54,7 @@ describe("EditPage", () => {
 		const user = await prisma.user.create({
 			data: {
 				handle: "testuser",
-				displayName: "Test User",
+				name: "Test User",
 				icon: "https://example.com/icon.jpg",
 				profile: "This is a test profile",
 				pages: {

diff --git a/web/app/routes/$locale+/user.$handle+/page+/$slug+/edit/utils/processHtmlContent.test.ts b/web/app/routes/$locale+/user.$handle+/page+/$slug+/edit/utils/processHtmlContent.test.ts
@@ -16,7 +16,7 @@ describe("processHtmlContent", () => {
 			create: {
 				id: 10,
 				handle: "htmltester",
-				displayName: "htmltester",
+				name: "htmltester",
 				icon: "htmltester",
 			},
 			update: {},
@@ -85,7 +85,7 @@ describe("processHtmlContent", () => {
 			create: {
 				id: 11,
 				handle: "htmleditor",
-				displayName: "htmleditor",
+				name: "htmleditor",
 				icon: "htmleditor",
 			},
 			update: {},
@@ -180,7 +180,7 @@ describe("processHtmlContent", () => {
 			create: {
 				id: 12,
 				handle: "titleduplicateuser",
-				displayName: "titleduplicateuser",
+				name: "titleduplicateuser",
 				icon: "titleduplicateuser",
 			},
 			update: {},
@@ -265,7 +265,7 @@ describe("processHtmlContent", () => {
 			create: {
 				id: 13,
 				handle: "noedit",
-				displayName: "noedit",
+				name: "noedit",
 				icon: "noedit",
 			},
 			update: {},
@@ -341,7 +341,7 @@ describe("processHtmlContent", () => {
 			create: {
 				id: 14,
 				handle: "imagetester",
-				displayName: "imagetester",
+				name: "imagetester",
 				icon: "imagetester",
 			},
 			update: {},

diff --git a/web/app/routes/$locale+/user.$handle+/page+/$slug+/functions/queries.server.ts b/web/app/routes/$locale+/user.$handle+/page+/$slug+/functions/queries.server.ts
@@ -160,7 +160,7 @@ export async function fetchCommentsWithUser(pageId: number, locale: string) {
 			user: {
 				select: {
 					handle: true,
-					displayName: true,
+					name: true,
 					icon: true,
 				},
 			},

diff --git a/web/app/routes/resources+/comment/components/CommentList.tsx b/web/app/routes/resources+/comment/components/CommentList.tsx
@@ -26,19 +26,16 @@ export function CommentList({
 				<div key={comment.id} className="p-2 bg-card rounded-xl">
 					<div className="flex items-center">
 						<Avatar className="w-6 h-6 mr-3">
-							<AvatarImage
-								src={comment.user.icon}
-								alt={comment.user.displayName}
-							/>
+							<AvatarImage src={comment.user.icon} alt={comment.user.name} />
 							<AvatarFallback>
-								{comment.user?.displayName.charAt(0) || "?"}
+								{comment.user?.name.charAt(0) || "?"}
 							</AvatarFallback>
 						</Avatar>
 						<div className="flex-1">
 							<div className="flex items-center justify-between">
 								<div>
 									<span className="font-semibold text-sm">
-										{comment.user?.displayName || "deleted_user"}
+										{comment.user?.name || "deleted_user"}
 									</span>
 									<span className="text-sm text-muted-foreground ml-2">
 										{comment.createdAt}

diff --git a/web/app/routes/resources+/comment/route.test.tsx b/web/app/routes/resources+/comment/route.test.tsx
@@ -43,7 +43,7 @@ describe("resource+/comment/route.ts action", () => {
 			updatedAt: new Date(),
 			user: {
 				handle: "testuser",
-				displayName: "Test User",
+				name: "Test User",
 				icon: "test.png",
 			},
 		};
@@ -72,7 +72,7 @@ describe("resource+/comment/route.ts action", () => {
 				user: {
 					select: {
 						handle: true,
-						displayName: true,
+						name: true,
 						icon: true,
 					},
 				},

diff --git a/web/app/routes/resources+/comment/route.tsx b/web/app/routes/resources+/comment/route.tsx
@@ -46,7 +46,7 @@ export async function action({ request }: ActionFunctionArgs) {
 					user: {
 						select: {
 							handle: true,
-							displayName: true,
+							name: true,
 							icon: true,
 						},
 					},

diff --git a/web/app/routes/resources+/functions/mutations.server.test.ts b/web/app/routes/resources+/functions/mutations.server.test.ts
@@ -11,7 +11,7 @@ describe("toggleLike 実際のDB統合テスト", () => {
 		const createdUser = await prisma.user.create({
 			data: {
 				handle: "testuser",
-				displayName: "Test User",
+				name: "Test User",
 				icon: "https://example.com/icon.jpg",
 				profile: "This is a test profile",
 				pages: {

diff --git a/web/app/routes/resources+/translation-list-item.tsx b/web/app/routes/resources+/translation-list-item.tsx
@@ -85,7 +85,7 @@ export function TranslationListItem({
 					className="!no-underline mr-2"
 				>
 					<p className="text-sm text-gray-500 text-right flex justify-end items-center  ">
-						by: {translation.translateText.user.displayName}
+						by: {translation.translateText.user.name}
 					</p>
 				</LocaleLink>
 				<VoteButtons translationWithVote={translation} />

diff --git a/web/app/utils/auth.server.ts b/web/app/utils/auth.server.ts
@@ -80,7 +80,7 @@ const googleStrategy = new GoogleStrategy<User>(
 					},
 				},
 				handle: generateTemporaryHandle(),
-				displayName: profile.displayName || "New User",
+				name: profile.displayName || "New User",
 				icon: profile.photos[0].value || "",
 				provider: "Google",
 			},
@@ -117,7 +117,7 @@ const magicLinkStrategy = new EmailLinkStrategy(
 				},
 				icon: `${process.env.CLIENT_URL}/avatar.png`,
 				handle: generateTemporaryHandle(),
-				displayName: String(email).split("@")[0],
+				name: String(email).split("@")[0],
 				provider: "MagicLink",
 			},
 		});