From 4de77784c9ee5bf787e7bda41aae84d81edff78a Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?=E3=81=8B=E3=81=A3=E3=81=93=E3=81=8B=E3=82=8A?=
<67428053+kakkokari-gtyih@users.noreply.github.com>
Date: Sun, 21 Jan 2024 11:50:05 +0900
Subject: [PATCH] =?UTF-8?q?enhance(sw):=20=E3=82=AA=E3=83=95=E3=83=A9?=
=?UTF-8?q?=E3=82=A4=E3=83=B3=E8=A1=A8=E7=A4=BA=E3=81=AE=E3=83=87=E3=82=B6?=
=?UTF-8?q?=E3=82=A4=E3=83=B3=E3=82=92=E6=94=B9=E5=96=84=20(#13052)?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit
* enhance(sw): オフライン表示のデザインを改善
* Update Changelog
* fix
* fix
* fix
* 言語が取得できなかった場合のフォールバックを追加
* (change) translation key
---
CHANGELOG.md | 3 +++
locales/index.d.ts | 10 ++++++++++
locales/ja-JP.yml | 4 ++++
packages/sw/src/sw.ts | 17 +++++++++++++----
4 files changed, 30 insertions(+), 4 deletions(-)
diff --git a/CHANGELOG.md b/CHANGELOG.md
index 993899ca2..716937d62 100644
--- a/CHANGELOG.md
+++ b/CHANGELOG.md
@@ -58,6 +58,9 @@
- Fix: ipv4とipv6の両方が利用可能な環境でallowedPrivateNetworksが設定されていた場合プライベートipの検証ができていなかった問題を修正
- Fix: properly handle cc followers
+### Service Worker
+- Enhance: オフライン表示のデザインを改善・多言語対応
+
## 2023.12.2
### General
diff --git a/locales/index.d.ts b/locales/index.d.ts
index 6e763cda1..910b1edad 100644
--- a/locales/index.d.ts
+++ b/locales/index.d.ts
@@ -9554,6 +9554,16 @@ export interface Locale extends ILocale {
*/
"lookingForPlayer": string;
};
+ "_offlineScreen": {
+ /**
+ * オフライン - サーバーに接続できません
+ */
+ "title": string;
+ /**
+ * サーバーに接続できません
+ */
+ "header": string;
+ };
}
declare const locales: {
[lang: string]: Locale;
diff --git a/locales/ja-JP.yml b/locales/ja-JP.yml
index fd1c891ee..6460397db 100644
--- a/locales/ja-JP.yml
+++ b/locales/ja-JP.yml
@@ -2544,3 +2544,7 @@ _reversi:
timeLimitForEachTurn: "1ターンの時間制限"
freeMatch: "フリーマッチ"
lookingForPlayer: "対戦相手を探しています"
+
+_offlineScreen:
+ title: "オフライン - サーバーに接続できません"
+ header: "サーバーに接続できません"
diff --git a/packages/sw/src/sw.ts b/packages/sw/src/sw.ts
index b79fd8ce7..f423eaca2 100644
--- a/packages/sw/src/sw.ts
+++ b/packages/sw/src/sw.ts
@@ -6,6 +6,7 @@
import { get } from 'idb-keyval';
import * as Misskey from 'misskey-js';
import type { PushNotificationDataMap } from '@/types.js';
+import type { I18n, Locale } from '@/scripts/i18n.js';
import { createEmptyNotification, createNotification } from '@/scripts/create-notification.js';
import { swLang } from '@/scripts/lang.js';
import * as swos from '@/scripts/operations.js';
@@ -26,8 +27,15 @@ globalThis.addEventListener('activate', ev => {
);
});
-function offlineContentHTML(): string {
- return `Offline. Service Worker @${_VERSION_} `;
+async function offlineContentHTML() {
+ const i18n = await (swLang.i18n ?? swLang.fetchLocale()) as Partial>;
+ const messages = {
+ title: i18n.ts?._offlineScreen?.title ?? 'Offline - Could not connect to server',
+ header: i18n.ts?._offlineScreen?.header ?? 'Could not connect to server',
+ reload: i18n.ts?.reload ?? 'Reload',
+ };
+
+ return `${messages.title}${messages.header}
v${_VERSION_}
`;
}
globalThis.addEventListener('fetch', ev => {
@@ -43,8 +51,9 @@ globalThis.addEventListener('fetch', ev => {
if (!isHTMLRequest) return;
ev.respondWith(
fetch(ev.request)
- .catch(() => {
- return new Response(offlineContentHTML(), {
+ .catch(async () => {
+ const html = await offlineContentHTML();
+ return new Response(html, {
status: 200,
headers: {
'content-type': 'text/html',