From f880d0631c7daf9cffbc388dcb81fd1f7f4259fb Mon Sep 17 00:00:00 2001 From: syuilo Date: Tue, 21 Jun 2022 17:55:38 +0900 Subject: [PATCH 1/2] tweak client --- locales/ja-JP.yml | 2 + .../src/models/repositories/instance.ts | 3 + .../src/models/schema/federation-instance.ts | 4 + .../client/src/components/abuse-report.vue | 3 +- .../client/src/components/instance-info.vue | 96 ++++++++++++ packages/client/src/pages/federation.vue | 137 ++---------------- packages/client/src/pages/instance-info.vue | 93 +++++++----- packages/client/src/scripts/i18n.ts | 4 +- 8 files changed, 175 insertions(+), 167 deletions(-) create mode 100644 packages/client/src/components/instance-info.vue diff --git a/locales/ja-JP.yml b/locales/ja-JP.yml index 082b8a24bc..2383d8f436 100644 --- a/locales/ja-JP.yml +++ b/locales/ja-JP.yml @@ -848,6 +848,8 @@ rateLimitExceeded: "レート制限を超えました" cropImage: "画像のクロップ" cropImageAsk: "画像をクロップしますか？" file: "ファイル" +recentNHours: "直近{n}時間" +recentNDays: "直近{n}日" _emailUnavailable: used: "既に使用されています" diff --git a/packages/backend/src/models/repositories/instance.ts b/packages/backend/src/models/repositories/instance.ts index 4594d86346..e9ee18ea35 100644 --- a/packages/backend/src/models/repositories/instance.ts +++ b/packages/backend/src/models/repositories/instance.ts @@ -1,11 +1,13 @@ import { db } from '@/db/postgre.js'; import { Instance } from '@/models/entities/instance.js'; import { Packed } from '@/misc/schema.js'; +import { fetchMeta } from '@/misc/fetch-meta.js'; export const InstanceRepository = db.getRepository(Instance).extend({ async pack( instance: Instance, ): Promise> { + const meta = await fetchMeta(); return { id: instance.id, caughtAt: instance.caughtAt.toISOString(), @@ -18,6 +20,7 @@ export const InstanceRepository = db.getRepository(Instance).extend({ lastCommunicatedAt: instance.lastCommunicatedAt.toISOString(), isNotResponding: instance.isNotResponding, isSuspended: instance.isSuspended, + isBlocked: meta.blockedHosts.includes(instance.host), softwareName: instance.softwareName, softwareVersion: instance.softwareVersion, openRegistrations: instance.openRegistrations, diff --git a/packages/backend/src/models/schema/federation-instance.ts b/packages/backend/src/models/schema/federation-instance.ts index 9f27aab985..3efff6ca9c 100644 --- a/packages/backend/src/models/schema/federation-instance.ts +++ b/packages/backend/src/models/schema/federation-instance.ts @@ -52,6 +52,10 @@ export const packedFederationInstanceSchema = { type: 'boolean', optional: false, nullable: false, }, + isBlocked: { + type: 'boolean', + optional: false, nullable: false, + }, softwareName: { type: 'string', optional: false, nullable: true, diff --git a/packages/client/src/components/abuse-report.vue b/packages/client/src/components/abuse-report.vue index 86eccd6276..e8ab6f600e 100644 --- a/packages/client/src/components/abuse-report.vue +++ b/packages/client/src/components/abuse-report.vue @@ -79,7 +79,8 @@ function resolve() { align-items: center; padding: 14px; border-radius: 8px; - background-image: linear-gradient(45deg, rgb(255 196 0 / 15%) 16.67%, transparent 16.67%, transparent 50%, rgb(255 196 0 / 15%) 50%, rgb(255 196 0 / 15%) 66.67%, transparent 66.67%, transparent 100%); + --c: rgb(255 196 0 / 15%); + background-image: linear-gradient(45deg, var(--c) 16.67%, transparent 16.67%, transparent 50%, var(--c) 50%, var(--c) 66.67%, transparent 66.67%, transparent 100%); background-size: 16px 16px; > .avatar { diff --git a/packages/client/src/components/instance-info.vue b/packages/client/src/components/instance-info.vue new file mode 100644 index 0000000000..e55c1d8215 --- /dev/null +++ b/packages/client/src/components/instance-info.vue @@ -0,0 +1,96 @@ + + + + + diff --git a/packages/client/src/pages/federation.vue b/packages/client/src/pages/federation.vue index eda46b9aa3..38d42f2be4 100644 --- a/packages/client/src/pages/federation.vue +++ b/packages/client/src/pages/federation.vue @@ -41,51 +41,8 @@
- -
{{ instance.host }}
-
-
-
{{ $ts.registeredAt }}
-
-
-
-
{{ $ts.software }}
-
{{ instance.softwareName || `(${$ts.unknown})` }}
-
-
-
{{ $ts.version }}
-
{{ instance.softwareVersion || `(${$ts.unknown})` }}
-
-
-
{{ $ts.users }}
-
{{ instance.usersCount }}
-
-
-
{{ $ts.notes }}
-
{{ instance.notesCount }}
-
-
-
{{ $ts.sent }}
-
N/A
-
-
-
{{ $ts.received }}
-
N/A
-
-
-
- {{ getStatus(instance) }} - - Sub - - - Pub - - - - - {{ instance.latestStatus || '-' }} - - -
+ +
@@ -100,6 +57,7 @@ import MkButton from '@/components/ui/button.vue'; import MkInput from '@/components/form/input.vue'; import MkSelect from '@/components/form/select.vue'; import MkPagination from '@/components/ui/pagination.vue'; +import MkInstanceInfo from '@/components/instance-info.vue'; import FormSplit from '@/components/form/split.vue'; import * as os from '@/os'; import { i18n } from '@/i18n'; @@ -127,9 +85,10 @@ const pagination = { }; function getStatus(instance) { - if (instance.isSuspended) return 'suspended'; - if (instance.isNotResponding) return 'error'; - return 'alive'; + if (instance.isSuspended) return 'Suspended'; + if (instance.isBlocked) return 'Blocked'; + if (instance.isNotResponding) return 'Error'; + return 'Alive'; } const headerActions = $computed(() => []); @@ -156,86 +115,8 @@ definePageMetadata({ grid-template-columns: repeat(auto-fill, minmax(270px, 1fr)); grid-gap: 12px; - > .instance { - padding: 16px; - background: var(--panel); - border-radius: 8px; - - &:hover { - text-decoration: none; - } - - > .host { - font-weight: bold; - white-space: nowrap; - overflow: hidden; - text-overflow: ellipsis; - - > img { - width: 18px; - height: 18px; - margin-right: 6px; - vertical-align: middle; - } - } - - > .table { - display: grid; - grid-template-columns: repeat(auto-fill, minmax(60px, 1fr)); - grid-gap: 6px; - margin: 6px 0; - font-size: 70%; - - > .cell { - > .key, > .value { - white-space: nowrap; - overflow: hidden; - text-overflow: ellipsis; - } - - > .key { - opacity: 0.7; - } - - > .value { - } - } - } - - > .footer { - display: flex; - align-items: center; - font-size: 0.9em; - - > .status { - &.suspended { - opacity: 0.5; - } - - &.error { - color: var(--error); - } - - &.alive { - color: var(--success); - } - } - - > .pubSub { - margin-left: 8px; - } - - > .right { - margin-left: auto; - - > .latestStatus { - border: solid 1px var(--divider); - border-radius: 4px; - margin: 0 8px; - padding: 0 4px; - } - } - } + > .instance:hover { + text-decoration: none; } } diff --git a/packages/client/src/pages/instance-info.vue b/packages/client/src/pages/instance-info.vue index 231b1dfd18..11e3618574 100644 --- a/packages/client/src/pages/instance-info.vue +++ b/packages/client/src/pages/instance-info.vue @@ -1,8 +1,8 @@ @@ -125,17 +123,18 @@ import number from '@/filters/number'; import bytes from '@/filters/bytes'; import { iAmModerator } from '@/account'; import { definePageMetadata } from '@/scripts/page-metadata'; +import { i18n } from '@/i18n'; const props = defineProps<{ host: string; }>(); +let tab = $ref('overview'); let meta = $ref(null); let instance = $ref(null); let suspended = $ref(false); let isBlocked = $ref(false); let chartSrc = $ref('instance-requests'); -let chartSpan = $ref('hour'); async function fetch() { if (iAmModerator) { @@ -184,11 +183,26 @@ const headerActions = $computed(() => [{ }, }]); -const headerTabs = $computed(() => []); +const headerTabs = $computed(() => [{ + active: tab === 'overview', + title: i18n.ts.overview, + icon: 'fas fa-info-circle', + onClick: () => { tab = 'overview'; }, +}, { + active: tab === 'chart', + title: i18n.ts.charts, + icon: 'fas fa-chart-simple', + onClick: () => { tab = 'chart'; }, +}, { + active: tab === 'raw', + title: 'Raw data', + icon: 'fas fa-code', + onClick: () => { tab = 'raw'; }, +}]); definePageMetadata({ title: props.host, - icon: 'fas fa-info-circle', + icon: 'fas fa-server', bg: 'var(--bg)', }); @@ -208,5 +222,12 @@ definePageMetadata({ display: flex; margin: 0 0 16px 0; } + + > .charts { + > .label { + margin-bottom: 12px; + font-weight: bold; + } + } } diff --git a/packages/client/src/scripts/i18n.ts b/packages/client/src/scripts/i18n.ts index 3fe88e5514..54184386da 100644 --- a/packages/client/src/scripts/i18n.ts +++ b/packages/client/src/scripts/i18n.ts @@ -11,13 +11,13 @@ export class I18n> { // string にしているのは、ドット区切りでのパス指定を許可するため // なるべくこのメソッド使うよりもlocale直接参照の方がvueのキャッシュ効いてパフォーマンスが良いかも - public t(key: string, args?: Record): string { + public t(key: string, args?: Record): string { try { let str = key.split('.').reduce((o, i) => o[i], this.ts) as unknown as string; if (args) { for (const [k, v] of Object.entries(args)) { - str = str.replace(`{${k}}`, v); + str = str.replace(`{${k}}`, v.toString()); } } return str; From 2d181ba5afcc141befde4bcbe540bdf106d79083 Mon Sep 17 00:00:00 2001 From: syuilo Date: Tue, 21 Jun 2022 19:48:28 +0900 Subject: [PATCH 2/2] enhance(client): show warning in control panel when there is an unresolved abuse report --- CHANGELOG.md | 1 + locales/ja-JP.yml | 4 ++++ packages/client/src/pages/admin/email-settings.vue | 2 +- packages/client/src/pages/admin/index.vue | 11 +++++++++++ 4 files changed, 17 insertions(+), 1 deletion(-) diff --git a/CHANGELOG.md b/CHANGELOG.md index 904083e7b1..eb91425e89 100644 --- a/CHANGELOG.md +++ b/CHANGELOG.md @@ -14,6 +14,7 @@ You should also include the user name that made the change. ### Improvements - Server: Add rate limit to i/notifications @tamaina - Client: Improve files page of control panel @syuilo +- Client: Show warning in control panel when there is an unresolved abuse report @syuilo - Improve player detection in URL preview @mei23 - Add Badge Image to Push Notification #8012 @tamaina diff --git a/locales/ja-JP.yml b/locales/ja-JP.yml index 2383d8f436..bbbb037a8e 100644 --- a/locales/ja-JP.yml +++ b/locales/ja-JP.yml @@ -850,6 +850,10 @@ cropImageAsk: "画像をクロップしますか？" file: "ファイル" recentNHours: "直近{n}時間" recentNDays: "直近{n}日" +noEmailServerWarning: "メールサーバーの設定がされていません。" +thereIsUnresolvedAbuseReportWarning: "未対応の通報があります。" +recommended: "推奨" +check: "チェック" _emailUnavailable: used: "既に使用されています" diff --git a/packages/client/src/pages/admin/email-settings.vue b/packages/client/src/pages/admin/email-settings.vue index 5487c5f333..c0ff94fad2 100644 --- a/packages/client/src/pages/admin/email-settings.vue +++ b/packages/client/src/pages/admin/email-settings.vue @@ -5,7 +5,7 @@
- + diff --git a/packages/client/src/pages/admin/index.vue b/packages/client/src/pages/admin/index.vue index 5db91101d7..b91330e1b7 100644 --- a/packages/client/src/pages/admin/index.vue +++ b/packages/client/src/pages/admin/index.vue @@ -7,8 +7,10 @@
+ {{ $ts.thereIsUnresolvedAbuseReportWarning }} {{ $ts.check }} {{ $ts.noMaintainerInformationWarning }} {{ $ts.configure }} {{ $ts.noBotProtectionWarning }} {{ $ts.configure }} + {{ $ts.noEmailServerWarning }} {{ $ts.configure }} @@ -58,6 +60,15 @@ let el = $ref(null); let pageProps = $ref({}); let noMaintainerInformation = isEmpty(instance.maintainerName) || isEmpty(instance.maintainerEmail); let noBotProtection = !instance.enableHcaptcha && !instance.enableRecaptcha; +let noEmailServer = !instance.enableEmail; +let thereIsUnresolvedAbuseReport = $ref(false); + +os.api('admin/abuse-user-reports', { + state: 'unresolved', + limit: 1, +}).then(reports => { + if (reports.length > 0) thereIsUnresolvedAbuseReport = true; +}); const NARROW_THRESHOLD = 600; const ro = new ResizeObserver((entries, observer) => {