wip: clip

2 files changed, 25 insertions, 2 deletions

diff --git a/src/client/pages/clip.vue b/src/client/pages/clip.vue
index ad9e076fd6..7535e4de2e 100644
--- a/src/client/pages/clip.vue
+++ b/src/client/pages/clip.vue
@@ -4,6 +4,9 @@
 		<div class="description" v-if="clip.description">
 			<Mfm :text="clip.description" :is-note="false" :i="$store.state.i"/>
 		</div>
+		<div class="user">
+			<MkAvatar :user="clip.user" class="avatar"/> <MkUserName :user="clip.user" :nowrap="false"/>
+		</div>
 	</div>
 
 	<XNotes class="_content _vMargin" :pagination="pagination" :detail="true"/>
@@ -135,5 +138,17 @@ export default defineComponent({
 	> .description {
 		padding: 16px;
 	}
+
+	> .user {
+		$height: 32px;
+		padding: 16px;
+		border-top: solid 1px var(--divider);
+		line-height: $height;
+
+		> .avatar {
+			width: $height;
+			height: $height;
+		}
+	}
 }
 </style>
diff --git a/src/models/repositories/clip.ts b/src/models/repositories/clip.ts
index f5c70a1829..2830546528 100644
--- a/src/models/repositories/clip.ts
+++ b/src/models/repositories/clip.ts
@@ -2,6 +2,8 @@ import { EntityRepository, Repository } from 'typeorm';
 import { Clip } from '../entities/clip';
 import { ensure } from '../../prelude/ensure';
 import { SchemaType } from '../../misc/schema';
+import { Users } from '..';
+import { awaitAll } from '../../prelude/await-all';
 
 export type PackedClip = SchemaType<typeof packedClipSchema>;
 
@@ -12,14 +14,15 @@ export class ClipRepository extends Repository<Clip> {
 	): Promise<PackedClip> {
 		const clip = typeof src === 'object' ? src : await this.findOne(src).then(ensure);
 
-		return {
+		return await awaitAll({
 			id: clip.id,
 			createdAt: clip.createdAt.toISOString(),
 			userId: clip.userId,
+			user: Users.pack(clip.user || clip.userId),
 			name: clip.name,
 			description: clip.description,
 			isPublic: clip.isPublic,
-		};
+		});
 	}
 }
 
@@ -45,6 +48,11 @@ export const packedClipSchema = {
 			optional: false as const, nullable: false as const,
 			format: 'id',
 		},
+		user: {
+			type: 'object' as const,
+			ref: 'User',
+			optional: false as const, nullable: false as const,
+		},
 		name: {
 			type: 'string' as const,
 			optional: false as const, nullable: false as const,