From 5b7595d9d7e313271c692a849fc915e73fcea108 Mon Sep 17 00:00:00 2001 From: futchitwo <74236683+futchitwo@users.noreply.github.com> Date: Sat, 18 Jun 2022 18:27:09 +0900 Subject: Improve: unclip (#8823) * Refactor clip page to use Composition API * Refactor clip page * Refactor clip page * Refactor clip page * Improve: unclip * Fix unclip * Fix unclip * chore: better type and name * Fix * Fix clipPage vue provider Co-authored-by: syuilo --- packages/client/src/scripts/get-note-menu.ts | 42 ++++++++++++++++++++++++++-- 1 file changed, 39 insertions(+), 3 deletions(-) (limited to 'packages/client/src/scripts') diff --git a/packages/client/src/scripts/get-note-menu.ts b/packages/client/src/scripts/get-note-menu.ts index 78749ad6bb..e56d519493 100644 --- a/packages/client/src/scripts/get-note-menu.ts +++ b/packages/client/src/scripts/get-note-menu.ts @@ -1,4 +1,4 @@ -import { defineAsyncComponent, Ref } from 'vue'; +import { defineAsyncComponent, Ref, inject } from 'vue'; import * as misskey from 'misskey-js'; import { $i } from '@/account'; import { i18n } from '@/i18n'; @@ -14,6 +14,8 @@ export function getNoteMenu(props: { menuButton: Ref; translation: Ref; translating: Ref; + isDeleted: Ref; + cullentClipPage?: Ref; }) { const isRenote = ( props.note.renote != null && @@ -125,12 +127,37 @@ export function getNoteMenu(props: { }, null, ...clips.map(clip => ({ text: clip.name, action: () => { - os.apiWithDialog('clips/add-note', { clipId: clip.id, noteId: appearNote.id }); + os.promiseDialog( + os.api('clips/add-note', { clipId: clip.id, noteId: appearNote.id }), + null, + async (err) => { + if (err.id === '734806c4-542c-463a-9311-15c512803965') { + const confirm = await os.confirm({ + type: 'warning', + text: i18n.t('confirmToUnclipAlreadyClippedNote', { name: clip.name }), + }); + if (!confirm.canceled) { + os.apiWithDialog('clips/remove-note', { clipId: clip.id, noteId: appearNote.id }); + if (props.cullentClipPage?.value.id === clip.id) props.isDeleted.value = true; + } + } else { + os.alert({ + type: 'error', + text: err.message + '\n' + err.id, + }); + } + } + ); } }))], props.menuButton.value, { }).then(focus); } + async function unclip(): Promise { + os.apiWithDialog('clips/remove-note', { clipId: props.cullentClipPage.value.id, noteId: appearNote.id }); + props.isDeleted.value = true; + } + async function promote(): Promise { const { canceled, result: days } = await os.inputNumber({ title: i18n.ts.numberOfDays, @@ -169,7 +196,16 @@ export function getNoteMenu(props: { noteId: appearNote.id }); - menu = [{ + menu = [ + ...( + props.cullentClipPage?.value.userId === $i.id ? [{ + icon: 'fas fa-circle-minus', + text: i18n.ts.unclip, + danger: true, + action: unclip, + }, null] : [] + ), + { icon: 'fas fa-copy', text: i18n.ts.copyContent, action: copyContent -- cgit v1.2.3-freya From 802a35d4b6f438f9f931eb5cd791e950deaa445b Mon Sep 17 00:00:00 2001 From: syuilo Date: Sat, 18 Jun 2022 18:27:47 +0900 Subject: fix typo --- packages/client/src/components/note.vue | 6 +++--- packages/client/src/pages/clip.vue | 2 +- packages/client/src/scripts/get-note-menu.ts | 8 ++++---- 3 files changed, 8 insertions(+), 8 deletions(-) (limited to 'packages/client/src/scripts') diff --git a/packages/client/src/components/note.vue b/packages/client/src/components/note.vue index b06f4edd0a..9ec1e53c1e 100644 --- a/packages/client/src/components/note.vue +++ b/packages/client/src/components/note.vue @@ -225,7 +225,7 @@ function undoReact(note): void { }); } -const cullentClipPage = inject>('cullentClipPage'); +const currentClipPage = inject>('currentClipPage'); function onContextmenu(ev: MouseEvent): void { const isLink = (el: HTMLElement) => { @@ -241,12 +241,12 @@ function onContextmenu(ev: MouseEvent): void { ev.preventDefault(); react(); } else { - os.contextMenu(getNoteMenu({ note: note, translating, translation, menuButton, isDeleted, cullentClipPage }), ev).then(focus); + os.contextMenu(getNoteMenu({ note: note, translating, translation, menuButton, isDeleted, currentClipPage }), ev).then(focus); } } function menu(viaKeyboard = false): void { - os.popupMenu(getNoteMenu({ note: note, translating, translation, menuButton, isDeleted, cullentClipPage }), menuButton.value, { + os.popupMenu(getNoteMenu({ note: note, translating, translation, menuButton, isDeleted, currentClipPage }), menuButton.value, { viaKeyboard, }).then(focus); } diff --git a/packages/client/src/pages/clip.vue b/packages/client/src/pages/clip.vue index bfe1578b13..163384337e 100644 --- a/packages/client/src/pages/clip.vue +++ b/packages/client/src/pages/clip.vue @@ -47,7 +47,7 @@ watch(() => props.clipId, async () => { immediate: true, }); -provide('cullentClipPage', $$(clip)); +provide('currentClipPage', $$(clip)); defineExpose({ [symbols.PAGE_INFO]: computed(() => clip ? { diff --git a/packages/client/src/scripts/get-note-menu.ts b/packages/client/src/scripts/get-note-menu.ts index e56d519493..283c90362c 100644 --- a/packages/client/src/scripts/get-note-menu.ts +++ b/packages/client/src/scripts/get-note-menu.ts @@ -15,7 +15,7 @@ export function getNoteMenu(props: { translation: Ref; translating: Ref; isDeleted: Ref; - cullentClipPage?: Ref; + currentClipPage?: Ref; }) { const isRenote = ( props.note.renote != null && @@ -138,7 +138,7 @@ export function getNoteMenu(props: { }); if (!confirm.canceled) { os.apiWithDialog('clips/remove-note', { clipId: clip.id, noteId: appearNote.id }); - if (props.cullentClipPage?.value.id === clip.id) props.isDeleted.value = true; + if (props.currentClipPage?.value.id === clip.id) props.isDeleted.value = true; } } else { os.alert({ @@ -154,7 +154,7 @@ export function getNoteMenu(props: { } async function unclip(): Promise { - os.apiWithDialog('clips/remove-note', { clipId: props.cullentClipPage.value.id, noteId: appearNote.id }); + os.apiWithDialog('clips/remove-note', { clipId: props.currentClipPage.value.id, noteId: appearNote.id }); props.isDeleted.value = true; } @@ -198,7 +198,7 @@ export function getNoteMenu(props: { menu = [ ...( - props.cullentClipPage?.value.userId === $i.id ? [{ + props.currentClipPage?.value.userId === $i.id ? [{ icon: 'fas fa-circle-minus', text: i18n.ts.unclip, danger: true, -- cgit v1.2.3-freya From b70473ed60f64d97c0758f864043b850a5728770 Mon Sep 17 00:00:00 2001 From: tamaina Date: Mon, 20 Jun 2022 00:33:46 +0900 Subject: feat: Add Badge Image to Push Notification (#8012) MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit * fix * nanka iroiro * wip * wip * fix lint * fix loginId * fix * refactor * refactor * remove follow action * clean up * Revert "remove follow action" This reverts commit defbb416480905af2150d1c92f10d8e1d1288c0a. * Revert "clean up" This reverts commit f94919cb9cff41e274044fc69c56ad36a33974f2. * remove fetch specification * renoteの条件追加 * apiFetch => cli * bypass fetch? * fix * refactor: use path alias * temp: add submodule * remove submodule * enhane: unison-reloadに指定したパスに移動できるように * null * null * feat: ログインするアカウントのIDをクエリ文字列で指定する機能 * null * await? * rename * rename * Update read.ts * merge * get-note-summary * fix * swパッケージに * add missing packages * fix getNoteSummary * add webpack-cli * :v: * remove plugins * sw-inject分離したがテストしてない * fix notification.vue * remove a blank line * disconnect intersection observer * disconnect2 * fix notification.vue * remove a blank line * disconnect intersection observer * disconnect2 * fix * :v: * clean up config * typesを戻した * backend/src/web/index.ts * notification-badges * add scripts * change create-notification.ts * Update packages/client/src/components/notification.vue Co-authored-by: Acid Chicken (硫酸鶏) * disconnect * oops * Failed to load the script unexpectedly回避 sw.jsとlib.tsを分離してみた * truncate notification * Update packages/client/src/ui/_common_/common.vue Co-authored-by: syuilo * clean up * clean up * refactor * キャッシュ対策 * Truncate push notification message * fix * クライアントがあったらストリームに接続しているということなので通知しない判定の位置を修正 * components/drive-file-thumbnail.vue * components/drive-select-dialog.vue * components/drive-window.vue * merge * fix * Service Workerのビルドにesbuildを使うようにする * return createEmptyNotification() * fix * fix * i18n.ts * update * :v: * remove ts-loader * fix * fix * enhance: Service Workerを常に登録するように * pollEnded * pollEnded * URLをsw.jsに戻す * clean up * fix lint * changelog * alpha-test * also with twemoji * add isMimeImage function * catch * Colour => Color * char2file => char2filePath * Update autocomplete.vue * remove clone? Co-authored-by: Acid Chicken (硫酸鶏) Co-authored-by: syuilo --- CHANGELOG.md | 1 + .../backend/assets/notification-badges/LICENSE | 5 ++ packages/backend/assets/notification-badges/at.png | Bin 0 -> 1752 bytes .../backend/assets/notification-badges/check.png | Bin 0 -> 577 bytes .../notification-badges/clipboard-check-solid.png | Bin 0 -> 1402 bytes .../backend/assets/notification-badges/clock.png | Bin 0 -> 1131 bytes .../assets/notification-badges/comments.png | Bin 0 -> 1134 bytes .../assets/notification-badges/id-card-alt.png | Bin 0 -> 844 bytes .../backend/assets/notification-badges/null.png | Bin 0 -> 174 bytes .../backend/assets/notification-badges/plus.png | Bin 0 -> 507 bytes .../backend/assets/notification-badges/poll-h.png | Bin 0 -> 689 bytes .../assets/notification-badges/quote-right.png | Bin 0 -> 772 bytes .../backend/assets/notification-badges/reply.png | Bin 0 -> 930 bytes .../backend/assets/notification-badges/retweet.png | Bin 0 -> 798 bytes .../assets/notification-badges/user-plus.png | Bin 0 -> 991 bytes packages/backend/src/misc/is-mime-image.ts | 8 +++ packages/backend/src/server/proxy/proxy-media.ts | 49 +++++++++++++++++-- packages/backend/src/server/web/index.ts | 44 +++++++++++++++++ packages/client/src/components/autocomplete.vue | 12 ++--- packages/client/src/components/global/emoji.vue | 9 ++-- packages/client/src/scripts/twemoji-base.ts | 11 +++++ packages/sw/src/scripts/create-notification.ts | 54 ++++++++++++++++++++- packages/sw/src/scripts/twemoji-base.ts | 12 +++++ packages/sw/src/scripts/url.ts | 13 +++++ 24 files changed, 197 insertions(+), 21 deletions(-) create mode 100644 packages/backend/assets/notification-badges/LICENSE create mode 100644 packages/backend/assets/notification-badges/at.png create mode 100644 packages/backend/assets/notification-badges/check.png create mode 100644 packages/backend/assets/notification-badges/clipboard-check-solid.png create mode 100644 packages/backend/assets/notification-badges/clock.png create mode 100644 packages/backend/assets/notification-badges/comments.png create mode 100644 packages/backend/assets/notification-badges/id-card-alt.png create mode 100644 packages/backend/assets/notification-badges/null.png create mode 100644 packages/backend/assets/notification-badges/plus.png create mode 100644 packages/backend/assets/notification-badges/poll-h.png create mode 100644 packages/backend/assets/notification-badges/quote-right.png create mode 100644 packages/backend/assets/notification-badges/reply.png create mode 100644 packages/backend/assets/notification-badges/retweet.png create mode 100644 packages/backend/assets/notification-badges/user-plus.png create mode 100644 packages/backend/src/misc/is-mime-image.ts create mode 100644 packages/sw/src/scripts/twemoji-base.ts create mode 100644 packages/sw/src/scripts/url.ts (limited to 'packages/client/src/scripts') diff --git a/CHANGELOG.md b/CHANGELOG.md index 5853b982a7..01b179f13f 100644 --- a/CHANGELOG.md +++ b/CHANGELOG.md @@ -15,6 +15,7 @@ You should also include the user name that made the change. - Server: Add rate limit to i/notifications @tamaina - Client: Improve files page of control panel @syuilo - Improve player detection in URL preview @mei23 +- Add Badge Image to Push Notification #8012 @tamaina ### Bugfixes - Server: Fix GenerateVideoThumbnail failed @mei23 diff --git a/packages/backend/assets/notification-badges/LICENSE b/packages/backend/assets/notification-badges/LICENSE new file mode 100644 index 0000000000..841c4c682b --- /dev/null +++ b/packages/backend/assets/notification-badges/LICENSE @@ -0,0 +1,5 @@ +Font Awesome Icons +------------------------- + +Ⓒ Font Awesome +CC BY 4.0 (https://creativecommons.org/licenses/by/4.0/) diff --git a/packages/backend/assets/notification-badges/at.png b/packages/backend/assets/notification-badges/at.png new file mode 100644 index 0000000000..d1492856de Binary files /dev/null and b/packages/backend/assets/notification-badges/at.png differ diff --git a/packages/backend/assets/notification-badges/check.png b/packages/backend/assets/notification-badges/check.png new file mode 100644 index 0000000000..baeb76babf Binary files /dev/null and b/packages/backend/assets/notification-badges/check.png differ diff --git a/packages/backend/assets/notification-badges/clipboard-check-solid.png b/packages/backend/assets/notification-badges/clipboard-check-solid.png new file mode 100644 index 0000000000..d8cdfa9da4 Binary files /dev/null and b/packages/backend/assets/notification-badges/clipboard-check-solid.png differ diff --git a/packages/backend/assets/notification-badges/clock.png b/packages/backend/assets/notification-badges/clock.png new file mode 100644 index 0000000000..9323f8f307 Binary files /dev/null and b/packages/backend/assets/notification-badges/clock.png differ diff --git a/packages/backend/assets/notification-badges/comments.png b/packages/backend/assets/notification-badges/comments.png new file mode 100644 index 0000000000..bc8a1c35b4 Binary files /dev/null and b/packages/backend/assets/notification-badges/comments.png differ diff --git a/packages/backend/assets/notification-badges/id-card-alt.png b/packages/backend/assets/notification-badges/id-card-alt.png new file mode 100644 index 0000000000..67e1410e34 Binary files /dev/null and b/packages/backend/assets/notification-badges/id-card-alt.png differ diff --git a/packages/backend/assets/notification-badges/null.png b/packages/backend/assets/notification-badges/null.png new file mode 100644 index 0000000000..be1384df13 Binary files /dev/null and b/packages/backend/assets/notification-badges/null.png differ diff --git a/packages/backend/assets/notification-badges/plus.png b/packages/backend/assets/notification-badges/plus.png new file mode 100644 index 0000000000..05362c122b Binary files /dev/null and b/packages/backend/assets/notification-badges/plus.png differ diff --git a/packages/backend/assets/notification-badges/poll-h.png b/packages/backend/assets/notification-badges/poll-h.png new file mode 100644 index 0000000000..3b7ded6659 Binary files /dev/null and b/packages/backend/assets/notification-badges/poll-h.png differ diff --git a/packages/backend/assets/notification-badges/quote-right.png b/packages/backend/assets/notification-badges/quote-right.png new file mode 100644 index 0000000000..0fa4837654 Binary files /dev/null and b/packages/backend/assets/notification-badges/quote-right.png differ diff --git a/packages/backend/assets/notification-badges/reply.png b/packages/backend/assets/notification-badges/reply.png new file mode 100644 index 0000000000..77021f71a7 Binary files /dev/null and b/packages/backend/assets/notification-badges/reply.png differ diff --git a/packages/backend/assets/notification-badges/retweet.png b/packages/backend/assets/notification-badges/retweet.png new file mode 100644 index 0000000000..dc61060481 Binary files /dev/null and b/packages/backend/assets/notification-badges/retweet.png differ diff --git a/packages/backend/assets/notification-badges/user-plus.png b/packages/backend/assets/notification-badges/user-plus.png new file mode 100644 index 0000000000..9d376d04d6 Binary files /dev/null and b/packages/backend/assets/notification-badges/user-plus.png differ diff --git a/packages/backend/src/misc/is-mime-image.ts b/packages/backend/src/misc/is-mime-image.ts new file mode 100644 index 0000000000..8993ede33a --- /dev/null +++ b/packages/backend/src/misc/is-mime-image.ts @@ -0,0 +1,8 @@ +import { FILE_TYPE_BROWSERSAFE } from '@/const.js'; + +const dictionary = { + 'safe-file': FILE_TYPE_BROWSERSAFE, + 'sharp-convertible-image': ['image/jpeg', 'image/png', 'image/gif', 'image/apng', 'image/vnd.mozilla.apng', 'image/webp', 'image/svg+xml'], +}; + +export const isMimeImage = (mime: string, type: keyof typeof dictionary): boolean => dictionary[type].includes(mime); diff --git a/packages/backend/src/server/proxy/proxy-media.ts b/packages/backend/src/server/proxy/proxy-media.ts index 48887bf12f..ca036e8fdf 100644 --- a/packages/backend/src/server/proxy/proxy-media.ts +++ b/packages/backend/src/server/proxy/proxy-media.ts @@ -1,13 +1,16 @@ import * as fs from 'node:fs'; import Koa from 'koa'; -import { serverLogger } from '../index.js'; +import sharp from 'sharp'; import { IImage, convertToWebp } from '@/services/drive/image-processor.js'; import { createTemp } from '@/misc/create-temp.js'; import { downloadUrl } from '@/misc/download-url.js'; import { detectType } from '@/misc/get-file-info.js'; import { StatusError } from '@/misc/fetch.js'; import { FILE_TYPE_BROWSERSAFE } from '@/const.js'; +import { serverLogger } from '../index.js'; +import { isMimeImage } from '@/misc/is-mime-image.js'; +// eslint-disable-next-line @typescript-eslint/explicit-function-return-type export async function proxyMedia(ctx: Koa.Context) { const url = 'url' in ctx.query ? ctx.query.url : 'https://' + ctx.params.url; @@ -23,14 +26,50 @@ export async function proxyMedia(ctx: Koa.Context) { await downloadUrl(url, path); const { mime, ext } = await detectType(path); + const isConvertibleImage = isMimeImage(mime, 'sharp-convertible-image'); let image: IImage; - if ('static' in ctx.query && ['image/png', 'image/gif', 'image/apng', 'image/vnd.mozilla.apng', 'image/webp', 'image/svg+xml'].includes(mime)) { + if ('static' in ctx.query && isConvertibleImage) { image = await convertToWebp(path, 498, 280); - } else if ('preview' in ctx.query && ['image/jpeg', 'image/png', 'image/gif', 'image/apng', 'image/vnd.mozilla.apng', 'image/svg+xml'].includes(mime)) { + } else if ('preview' in ctx.query && isConvertibleImage) { image = await convertToWebp(path, 200, 200); - } else if (['image/svg+xml'].includes(mime)) { + } else if ('badge' in ctx.query) { + if (!isConvertibleImage) { + // 画像でないなら404でお茶を濁す + throw new StatusError('Unexpected mime', 404); + } + + const mask = sharp(path) + .resize(96, 96, { + fit: 'inside', + withoutEnlargement: false, + }) + .greyscale() + .normalise() + .linear(1.75, -(128 * 1.75) + 128) // 1.75x contrast + .flatten({ background: '#000' }) + .toColorspace('b-w'); + + const stats = await mask.clone().stats(); + + if (stats.entropy < 0.1) { + // エントロピーがあまりない場合は404にする + throw new StatusError('Skip to provide badge', 404); + } + + const data = sharp({ + create: { width: 96, height: 96, channels: 4, background: { r: 0, g: 0, b: 0, alpha: 0 } }, + }) + .pipelineColorspace('b-w') + .boolean(await mask.png().toBuffer(), 'eor'); + + image = { + data: await data.png().toBuffer(), + ext: 'png', + type: 'image/png', + }; + } else if (mime === 'image/svg+xml') { image = await convertToWebp(path, 2048, 2048, 1); } else if (!mime.startsWith('image/') || !FILE_TYPE_BROWSERSAFE.includes(mime)) { throw new StatusError('Rejected type', 403, 'Rejected type'); @@ -48,7 +87,7 @@ export async function proxyMedia(ctx: Koa.Context) { } catch (e) { serverLogger.error(`${e}`); - if (e instanceof StatusError && e.isClientError) { + if (e instanceof StatusError && (e.statusCode === 302 || e.isClientError)) { ctx.status = e.statusCode; } else { ctx.status = 500; diff --git a/packages/backend/src/server/web/index.ts b/packages/backend/src/server/web/index.ts index 2feee72be7..be95becb68 100644 --- a/packages/backend/src/server/web/index.ts +++ b/packages/backend/src/server/web/index.ts @@ -11,6 +11,7 @@ import Router from '@koa/router'; import send from 'koa-send'; import favicon from 'koa-favicon'; import views from 'koa-views'; +import sharp from 'sharp'; import { createBullBoard } from '@bull-board/api'; import { BullAdapter } from '@bull-board/api/bullAdapter.js'; import { KoaAdapter } from '@bull-board/koa'; @@ -140,6 +141,49 @@ router.get('/twemoji/(.*)', async ctx => { }); }); +router.get('/twemoji-badge/(.*)', async ctx => { + const path = ctx.path.replace('/twemoji-badge/', ''); + + if (!path.match(/^[0-9a-f-]+\.png$/)) { + ctx.status = 404; + return; + } + + const mask = await sharp( + `${_dirname}/../../../node_modules/@discordapp/twemoji/dist/svg/${path.replace('.png', '')}.svg`, + { density: 1000 }, + ) + .resize(488, 488) + .greyscale() + .normalise() + .linear(1.75, -(128 * 1.75) + 128) // 1.75x contrast + .flatten({ background: '#000' }) + .extend({ + top: 12, + bottom: 12, + left: 12, + right: 12, + background: '#000', + }) + .toColorspace('b-w') + .png() + .toBuffer(); + + const buffer = await sharp({ + create: { width: 512, height: 512, channels: 4, background: { r: 0, g: 0, b: 0, alpha: 0 } }, + }) + .pipelineColorspace('b-w') + .boolean(mask, 'eor') + .resize(96, 96) + .png() + .toBuffer(); + + ctx.set('Content-Security-Policy', 'default-src \'none\'; style-src \'unsafe-inline\''); + ctx.set('Cache-Control', 'max-age=2592000'); + ctx.set('Content-Type', 'image/png'); + ctx.body = buffer; +}); + // ServiceWorker router.get(`/sw.js`, async ctx => { await send(ctx as any, `/sw.js`, { diff --git a/packages/client/src/components/autocomplete.vue b/packages/client/src/components/autocomplete.vue index 1e4a4506f7..ae708026e0 100644 --- a/packages/client/src/components/autocomplete.vue +++ b/packages/client/src/components/autocomplete.vue @@ -35,6 +35,7 @@ diff --git a/packages/client/src/directives/sticky-container.ts b/packages/client/src/directives/sticky-container.ts index 9610eba4da..3cf813054b 100644 --- a/packages/client/src/directives/sticky-container.ts +++ b/packages/client/src/directives/sticky-container.ts @@ -5,8 +5,10 @@ export default { //const query = binding.value; const header = src.children[0]; + const body = src.children[1]; const currentStickyTop = getComputedStyle(src).getPropertyValue('--stickyTop') || '0px'; src.style.setProperty('--stickyTop', `calc(${currentStickyTop} + ${header.offsetHeight}px)`); + if (body) body.dataset.stickyContainerHeaderHeight = header.offsetHeight.toString(); header.style.setProperty('--stickyTop', currentStickyTop); header.style.position = 'sticky'; header.style.top = 'var(--stickyTop)'; diff --git a/packages/client/src/pages/messaging/messaging-room.form.vue b/packages/client/src/pages/messaging/messaging-room.form.vue index 8e779c4f39..38bab90502 100644 --- a/packages/client/src/pages/messaging/messaging-room.form.vue +++ b/packages/client/src/pages/messaging/messaging-room.form.vue @@ -1,223 +1,223 @@ - diff --git a/packages/client/src/components/global/page-header.vue b/packages/client/src/components/global/page-header.vue new file mode 100644 index 0000000000..c01631c6a3 --- /dev/null +++ b/packages/client/src/components/global/page-header.vue @@ -0,0 +1,300 @@ + + + + + diff --git a/packages/client/src/components/global/router-view.vue b/packages/client/src/components/global/router-view.vue new file mode 100644 index 0000000000..393ba30c3d --- /dev/null +++ b/packages/client/src/components/global/router-view.vue @@ -0,0 +1,39 @@ + + + diff --git a/packages/client/src/components/index.ts b/packages/client/src/components/index.ts index 26bac63245..aa8a591e51 100644 --- a/packages/client/src/components/index.ts +++ b/packages/client/src/components/index.ts @@ -10,15 +10,17 @@ import MkEllipsis from './global/ellipsis.vue'; import MkTime from './global/time.vue'; import MkUrl from './global/url.vue'; import I18n from './global/i18n'; +import RouterView from './global/router-view.vue'; import MkLoading from './global/loading.vue'; import MkError from './global/error.vue'; import MkAd from './global/ad.vue'; -import MkHeader from './global/header.vue'; +import MkPageHeader from './global/page-header.vue'; import MkSpacer from './global/spacer.vue'; import MkStickyContainer from './global/sticky-container.vue'; export default function(app: App) { app.component('I18n', I18n); + app.component('RouterView', RouterView); app.component('Mfm', Mfm); app.component('MkA', MkA); app.component('MkAcct', MkAcct); @@ -31,7 +33,7 @@ export default function(app: App) { app.component('MkLoading', MkLoading); app.component('MkError', MkError); app.component('MkAd', MkAd); - app.component('MkHeader', MkHeader); + app.component('MkPageHeader', MkPageHeader); app.component('MkSpacer', MkSpacer); app.component('MkStickyContainer', MkStickyContainer); } @@ -39,6 +41,7 @@ export default function(app: App) { declare module '@vue/runtime-core' { export interface GlobalComponents { I18n: typeof I18n; + RouterView: typeof RouterView; Mfm: typeof Mfm; MkA: typeof MkA; MkAcct: typeof MkAcct; @@ -51,7 +54,7 @@ declare module '@vue/runtime-core' { MkLoading: typeof MkLoading; MkError: typeof MkError; MkAd: typeof MkAd; - MkHeader: typeof MkHeader; + MkPageHeader: typeof MkPageHeader; MkSpacer: typeof MkSpacer; MkStickyContainer: typeof MkStickyContainer; } diff --git a/packages/client/src/components/modal-page-window.vue b/packages/client/src/components/modal-page-window.vue index 21bdb657b7..aef70f113b 100644 --- a/packages/client/src/components/modal-page-window.vue +++ b/packages/client/src/components/modal-page-window.vue @@ -1,163 +1,118 @@ - diff --git a/packages/client/src/pages/admin/abuses.vue b/packages/client/src/pages/admin/abuses.vue index e1d0361c0b..2b6dadf7c6 100644 --- a/packages/client/src/pages/admin/abuses.vue +++ b/packages/client/src/pages/admin/abuses.vue @@ -1,28 +1,31 @@ diff --git a/packages/client/src/pages/admin/ads.vue b/packages/client/src/pages/admin/ads.vue index b18e08db96..05557469e7 100644 --- a/packages/client/src/pages/admin/ads.vue +++ b/packages/client/src/pages/admin/ads.vue @@ -1,21 +1,23 @@ diff --git a/packages/client/src/pages/admin/announcements.vue b/packages/client/src/pages/admin/announcements.vue index 97774975de..025897d093 100644 --- a/packages/client/src/pages/admin/announcements.vue +++ b/packages/client/src/pages/admin/announcements.vue @@ -1,34 +1,40 @@ diff --git a/packages/client/src/pages/admin/bot-protection.vue b/packages/client/src/pages/admin/bot-protection.vue index 30fee5015a..d2e7919b4f 100644 --- a/packages/client/src/pages/admin/bot-protection.vue +++ b/packages/client/src/pages/admin/bot-protection.vue @@ -51,7 +51,6 @@ import FormButton from '@/components/ui/button.vue'; import FormSuspense from '@/components/form/suspense.vue'; import FormSlot from '@/components/form/slot.vue'; import * as os from '@/os'; -import * as symbols from '@/symbols'; import { fetchInstance } from '@/instance'; const MkCaptcha = defineAsyncComponent(() => import('@/components/captcha.vue')); diff --git a/packages/client/src/pages/admin/database.vue b/packages/client/src/pages/admin/database.vue index d3519922b1..b9c5f9e393 100644 --- a/packages/client/src/pages/admin/database.vue +++ b/packages/client/src/pages/admin/database.vue @@ -1,12 +1,13 @@ -