Merge branch 'develop' into swn

packages/backend/src/server/web/feed.ts

@@ -1,8 +1,8 @@
 import { Feed } from 'feed';
+import { In, IsNull } from 'typeorm';
 import config from '@/config/index.js';
 import { User } from '@/models/entities/user.js';
-import { Notes, DriveFiles, UserProfiles } from '@/models/index.js';
-import { In, IsNull } from 'typeorm';
+import { Notes, DriveFiles, UserProfiles, Users } from '@/models/index.js';
 
 export default async function(user: User) {
 	const author = {
@@ -29,7 +29,7 @@ export default async function(user: User) {
 		generator: 'Misskey',
 		description: `${user.notesCount} Notes, ${profile.ffVisibility === 'public' ? user.followingCount : '?'} Following, ${profile.ffVisibility === 'public' ? user.followersCount : '?'} Followers${profile.description ? ` · ${profile.description}` : ''}`,
 		link: author.link,
-		image: user.avatarUrl ? user.avatarUrl : undefined,
+		image: await Users.getAvatarUrl(user),
 		feedLinks: {
 			json: `${author.link}.json`,
 			atom: `${author.link}.atom`,

packages/backend/src/server/web/index.ts

@@ -11,20 +11,20 @@ import send from 'koa-send';
 import favicon from 'koa-favicon';
 import views from 'koa-views';
 import { createBullBoard } from '@bull-board/api';
-import { BullAdapter  } from '@bull-board/api/bullAdapter.js';
+import { BullAdapter } from '@bull-board/api/bullAdapter.js';
 import { KoaAdapter } from '@bull-board/koa';
 
-import packFeed from './feed.js';
+import { IsNull } from 'typeorm';
 import { fetchMeta } from '@/misc/fetch-meta.js';
-import { genOpenapiSpec } from '../api/openapi/gen-spec.js';
 import config from '@/config/index.js';
 import { Users, Notes, UserProfiles, Pages, Channels, Clips, GalleryPosts } from '@/models/index.js';
 import * as Acct from '@/misc/acct.js';
 import { getNoteSummary } from '@/misc/get-note-summary.js';
+import { queues } from '@/queue/queues.js';
+import { genOpenapiSpec } from '../api/openapi/gen-spec.js';
 import { urlPreviewHandler } from './url-preview.js';
 import { manifestHandler } from './manifest.js';
-import { queues } from '@/queue/queues.js';
-import { IsNull } from 'typeorm';
+import packFeed from './feed.js';
 
 const _filename = fileURLToPath(import.meta.url);
 const _dirname = dirname(_filename);
@@ -128,7 +128,7 @@ router.get('/twemoji/(.*)', async ctx => {
 		return;
 	}
 
-	ctx.set('Content-Security-Policy', `default-src 'none'; style-src 'unsafe-inline'`);
+	ctx.set('Content-Security-Policy', 'default-src \'none\'; style-src \'unsafe-inline\'');
 
 	await send(ctx as any, path, {
 		root: `${_dirname}/../../../node_modules/@discordapp/twemoji/dist/svg/`,
@@ -237,6 +237,7 @@ router.get(['/@:user', '/@:user/:sub'], async (ctx, next) => {
 
 		await ctx.render('user', {
 			user, profile, me,
+			avatarUrl: await Users.getAvatarUrl(user),
 			sub: ctx.params.sub,
 			instanceName: meta.name || 'Misskey',
 			icon: meta.iconUrl,
@@ -276,6 +277,7 @@ router.get('/notes/:note', async (ctx, next) => {
 		await ctx.render('note', {
 			note: _note,
 			profile,
+			avatarUrl: await Users.getAvatarUrl(await Users.findOneByOrFail({ id: note.userId })),
 			// TODO: Let locale changeable by instance setting
 			summary: getNoteSummary(_note),
 			instanceName: meta.name || 'Misskey',
@@ -317,6 +319,7 @@ router.get('/@:user/pages/:page', async (ctx, next) => {
 		await ctx.render('page', {
 			page: _page,
 			profile,
+			avatarUrl: await Users.getAvatarUrl(await Users.findOneByOrFail({ id: page.userId })),
 			instanceName: meta.name || 'Misskey',
 			icon: meta.iconUrl,
 			themeColor: meta.themeColor,
@@ -348,6 +351,7 @@ router.get('/clips/:clip', async (ctx, next) => {
 		await ctx.render('clip', {
 			clip: _clip,
 			profile,
+			avatarUrl: await Users.getAvatarUrl(await Users.findOneByOrFail({ id: clip.userId })),
 			instanceName: meta.name || 'Misskey',
 			icon: meta.iconUrl,
 			themeColor: meta.themeColor,
@@ -372,6 +376,7 @@ router.get('/gallery/:post', async (ctx, next) => {
 		await ctx.render('gallery-post', {
 			post: _post,
 			profile,
+			avatarUrl: await Users.getAvatarUrl(await Users.findOneByOrFail({ id: post.userId })),
 			instanceName: meta.name || 'Misskey',
 			icon: meta.iconUrl,
 			themeColor: meta.themeColor,
@@ -436,7 +441,7 @@ router.get('/cli', async ctx => {
 	});
 });
 
-const override = (source: string, target: string, depth: number = 0) =>
+const override = (source: string, target: string, depth = 0) =>
 	[, ...target.split('/').filter(x => x), ...source.split('/').filter(x => x).splice(depth)].join('/');
 
 router.get('/flush', async ctx => {

packages/backend/src/server/web/style.css

@@ -16,7 +16,7 @@ html {
 	transition: opacity 0.5s ease;
 }
 
-#splash > img {
+#splashIcon {
 	position: absolute;
 	top: 0;
 	right: 0;
@@ -27,3 +27,48 @@ html {
 	height: 64px;
 	pointer-events: none;
 }
+
+#splashSpinner {
+	position: absolute;
+	top: 0;
+	right: 0;
+	bottom: 0;
+	left: 0;
+	margin: auto;
+	display: inline-block;
+	width: 28px;
+	height: 28px;
+	transform: translateY(70px);
+}
+
+#splashSpinner:before,
+#splashSpinner:after {
+	content: " ";
+	display: block;
+	box-sizing: border-box;
+	width: 28px;
+	height: 28px;
+	border-radius: 50%;
+	border: solid 4px;
+}
+
+#splashSpinner:before {
+	border-color: currentColor;
+	opacity: 0.3;
+}
+
+#splashSpinner:after {
+	position: absolute;
+	top: 0;
+	border-color: currentColor transparent transparent transparent;
+	animation: splashSpinner 0.5s linear infinite;
+}
+
+@keyframes splashSpinner {
+	0% {
+		transform: rotate(0deg);
+	}
+	100% {
+		transform: rotate(360deg);
+	}
+}

packages/backend/src/server/web/views/base.pug

@@ -59,5 +59,6 @@ html
 			br
 			| Please turn on your JavaScript
 		div#splash
-			img(src= icon || '/static-assets/splash.png')
+			img#splashIcon(src= icon || '/static-assets/splash.png')
+			div#splashSpinner
 		block content

packages/backend/src/server/web/views/clip.pug

@@ -16,7 +16,7 @@ block og
 	meta(property='og:title'       content= title)
 	meta(property='og:description' content= clip.description)
 	meta(property='og:url'         content= url)
-	meta(property='og:image'       content= user.avatarUrl)
+	meta(property='og:image'       content= avatarUrl)
 
 block meta
 	if profile.noCrawle

packages/backend/src/server/web/views/note.pug

@@ -17,7 +17,7 @@ block og
 	meta(property='og:title'       content= title)
 	meta(property='og:description' content= summary)
 	meta(property='og:url'         content= url)
-	meta(property='og:image'       content= user.avatarUrl)
+	meta(property='og:image'       content= avatarUrl)
 
 block meta
 	if user.host || isRenote || profile.noCrawle

packages/backend/src/server/web/views/page.pug

@@ -16,7 +16,7 @@ block og
 	meta(property='og:title'       content= title)
 	meta(property='og:description' content= page.summary)
 	meta(property='og:url'         content= url)
-	meta(property='og:image'       content= page.eyeCatchingImage ? page.eyeCatchingImage.thumbnailUrl : user.avatarUrl)
+	meta(property='og:image'       content= page.eyeCatchingImage ? page.eyeCatchingImage.thumbnailUrl : avatarUrl)
 
 block meta
 	if profile.noCrawle

packages/backend/src/server/web/views/user.pug

@@ -3,7 +3,6 @@ extends ./base
 block vars
 	- const title = user.name ? `${user.name} (@${user.username})` : `@${user.username}`;
 	- const url = `${config.url}/@${(user.host ? `${user.username}@${user.host}` : user.username)}`;
-	- const img = user.avatarUrl || null;
 
 block title
 	= `${title} | ${instanceName}`
@@ -16,7 +15,7 @@ block og
 	meta(property='og:title'       content= title)
 	meta(property='og:description' content= profile.description)
 	meta(property='og:url'         content= url)
-	meta(property='og:image'       content= img)
+	meta(property='og:image'       content= avatarUrl)
 
 block meta
 	if user.host || profile.noCrawle