12.13.0

* New translations ja-JP.yml (Kannada)

* New translations ja-JP.yml (Kannada)

* New translations ja-JP.yml (Kannada)

* New translations ja-JP.yml (Kannada)

* New translations ja-JP.yml (Chinese Simplified)

* New translations ja-JP.yml (English)

* New translations ja-JP.yml (French)

* New translations ja-JP.yml (Korean)

* New translations ja-JP.yml (Spanish)

CHANGELOG.md

@@ -1,6 +1,87 @@
 ChangeLog
 =========
 
+12.13.0 (2020/02/18)
+-------------------
+### ✨Improvements
+* プロモーションノート機能を実装
+	* インスタンス管理者が、重要なお知らせやユーザーにやってもらいたいアンケートなどをタイムラインの途中に挿入する機能
+	* プロモーションされる期限を設定できる
+	* 複数のプロモーションがある場合はランダムに選択されて表示される
+	* ユーザーがプロモーションを個別に非表示にすることもできる
+* ハイライトインジェクション機能を実装
+	* タイムラインの途中におすすめのノートを表示できる機能
+	* 設定で有効/無効を切り替えられる
+* アクティビティウィジェットを実装
+* フォトウィジェットを実装
+* タイムラインの一番上までスクロールできるように
+* 管理者はモデレーターに変更できないように
+
+### 🐛Fixes
+* admin/show-users APIがadminかつmoderator設定されているとき使えない問題を修正
+
+12.12.0 (2020/02/17)
+-------------------
+### ✨Improvements
+* インスタンス情報ページを強化
+* インスタンス設定ページを強化
+* 設定ページをアカウント設定ページとクライアント設定ページに分離
+* UIの調整
+
+12.11.0 (2020/02/16)
+-------------------
+### ✨Improvements
+* 投稿詳細ページで前後の投稿を見れるように
+* 自分のfollowersノートはRenoteできるように
+* 画像ダイアログを実装
+* フォロー申請ページの調整
+* 壁紙設定の強化
+* 画面が狭い状態でMisskeyを起動した場合でも、画面幅が広がったときにウィジェットを表示するように
+* 「もっと読み込む」したときの読み込み量を増量
+
+### 🐛Fixes
+* 認証なしでグローバルTLにアクセスすると妙なエラーが返る問題を修正
+* API docが見れない問題を修正
+* 画面右上に当たり判定があるのを修正
+
+12.10.0 (2020/02/15)
+-------------------
+### ✨Improvements
+* アンテナの受信ソースにグループを指定できるように
+* 時計ウィジェットを追加
+* ログアウトせずに新しいアカウントを追加できるように
+* フォントサイズを設定できるように
+* APIキー設定を実装
+
+### 🐛Fixes
+* v12アップデート後にトップページアクセスでOops!になっちゃうのを修正
+* drive/files APIのパフォーマンスを改善
+
+12.9.0 (2020/02/14)
+-------------------
+### ✨Improvements
+* カスタム絵文字の管理を強化
+* 動きのあるMFMを無効にするオプションを追加
+
+### 🐛Fixes
+* タイムラインに自分の返信と自分への返信と投稿者自身への返信以外の返信が含まれている問題を修正
+* グループがない状態でグループチャットを開始しようとするとフリーズする問題を修正
+* 通知インジケーターがずれる問題を修正
+* AP: 投稿を削除したときに関係する投稿の削除アクティビティが連合されない問題を修正
+
+12.8.0 (2020/02/13)
+--------------------
+### ✨Improvements
+* タイムラインなどを遡っているときは新しいアイテムが来てもスクロールしないように
+* 表示言語を切り替えられるように
+* グループに招待されたときの通知を追加
+* フランス語と関西弁を有効に
+* OSネイティブの絵文字を使用オプションを追加
+
+### 🐛Fixes
+* リストを追加するとエラーが出る問題を修正
+* タイムラインを放置すると先頭の投稿が見えなくなるのを修正
+
 12.7.1 (2020/02/11)
 --------------------
 ### 🐛Fixes

locales/cs-CZ.yml

@@ -1 +1,2 @@
 ---
+_lang_: "Čeština"

locales/da-DK.yml

@@ -1 +1,2 @@
 ---
+_lang_: "Dansk"

locales/de-DE.yml

@@ -1 +1,39 @@
 ---
+_lang_: "Deutsch"
+monthAndDay: "{day}/{month}"
+search: "Suchen"
+notifications: "Benachrichtigungen"
+username: "Benutzername"
+password: "Passwort"
+fetchingAsApObject: "Aus Fediverse holen"
+ok: "OK"
+gotIt: "Verstanden!"
+cancel: "Abbrechen"
+enterUsername: "Benutzername eingeben"
+renotedBy: "Renote von {user}"
+noNotes: "Keine Notizen"
+noNotifications: "Keine Benachrichtigungen"
+instance: "Instanz"
+settings: "Einstellungen"
+profile: "Profil"
+timeline: "Zeitleiste"
+noAccountDescription: "Keine Selbsteinführung"
+login: "Einloggen"
+loggingIn: "Einloggen in bearbeitung"
+logout: "Ausloggen"
+signup: "Registrieren"
+uploading: "Upload läuft"
+save: "Speichern"
+users: "Benutzer"
+addUser: "Benutzer hinzufügen"
+copyUsername: "Benutzernamen kopieren"
+selectUser: "Benutzer wählen"
+instances: "Instanz"
+mutedUsers: "Stummgestellte Benutzer"
+blockedUsers: "Blockierte Benutzer"
+noUsers: "Keine Benutzer"
+_widgets:
+  notifications: "Benachrichtigungen"
+  timeline: "Zeitleiste"
+_profile:
+  username: "Benutzername"

locales/en-US.yml

@@ -1,21 +1,6 @@
 ---
-_ago:
-  unknown: "Unknown"
-  future: "Future"
-  justNow: "Just now"
-  secondsAgo: "{n}s ago"
-  minutesAgo: "{n}m ago"
-  hoursAgo: "{n}h ago"
-  daysAgo: "{n}d ago"
-  weeksAgo: "{n}week(s) ago"
-  monthsAgo: "{n}month(s) ago"
-  yearsAgo: "{n}year(s) ago"
-_time:
-  second: "s"
-  minute: "m"
-  hour: "h"
-  day: "d"
-introMisskey: "Welcome! Misskey is an open source distributed microblogging service.\nCreate \"notes\" to share what's happening or to tell everyone about you📡\nThen send \"reactions\" to respond quickly to everyone's notes👍\nLet's explore a new world🚀"
+_lang_: "English"
+introMisskey: "Welcome! Misskey is an open source and also decentralized microblogging service.\nWrite the \"notes\" to share what is happening now, or send out your own words to everyone 📡\nWith the \"reactions\", you can add your feelings to everyone's notes faster than anyone 👍\nLet's explore the new world 🚀"
 monthAndDay: "{month}/{day}"
 search: "Search"
 notifications: "Notifications"
@@ -84,7 +69,7 @@ enterListName: "List name"
 privacy: "Privacy"
 makeFollowManuallyApprove: "Follow requests require approval"
 defaultNoteVisibility: "Default visibility"
-follow: "Following"
+follow: "Follow"
 followRequest: "Request follow"
 followRequests: "Follow requests"
 unfollow: "Unfollow"
@@ -127,7 +112,7 @@ flagAsBot: "This account is a bot"
 flagAsCat: "This account is a cat"
 autoAcceptFollowed: "Automatically approve follow requests from users you're following"
 addAcount: "Add Account"
-loginFailed: "Sign in failure"
+loginFailed: "Failed to sign in"
 showOnRemote: "View on remote instance"
 general: "General"
 wallpaper: "Wallpaper"
@@ -264,12 +249,12 @@ instanceDescription: "Instance description"
 maintainerName: "Maintainer"
 maintainerEmail: "Maintainer email"
 tosUrl: "Terms of Service URL"
-thisYear: "This year"
-thisMonth: "This month"
+thisYear: "Year"
+thisMonth: "Month"
 today: "Today"
-dayX: "{day} days"
-monthX: "{month} months"
-yearX: "{year} years"
+dayX: "{day}"
+monthX: "{month}"
+yearX: "{year}　/"
 pages: "Pages"
 integration: "Integration"
 connectSerice: "Connect"
@@ -326,6 +311,7 @@ aboutMisskey: "About Misskey"
 aboutMisskeyText: "Misskey is an open-source software developed by syuilo since 2014."
 misskeyMembers: "It is currently developed an maintained by the members listed below:"
 misskeySource: "Source code is available here:"
+misskeyTranslation: "Help us with your contribution to translate Misskey:"
 misskeyDonate: "Help us to keep improving the software by donating here:"
 morePatrons: "We really appreciate the support of many other helpers not listed here. Thank you! 🥰"
 patrons: "Backers"
@@ -370,12 +356,78 @@ members: "Members"
 transfer: "Transfer"
 messagingWithUser: "Messaging with other user"
 messagingWithGroup: "Messaging within group"
+title: "Title"
+text: "Text"
 enable: "Enable"
 next: "Next"
 retype: "Enter again"
 noteOf: "{user}'s notes"
 inviteToGroup: "Invite to group"
 maxNoteTextLength: "Character limit of the note"
+quoteAttached: "Quoted"
+quoteQuestion: "Do you want to append a quote?"
+noMessagesYet: "No messages yet"
+newMessageExists: "You've got a new message"
+onlyOneFileCanBeAttached: "You can only attach one file to a message"
+signinRequired: "Please sign in"
+invitationCode: "Invitation code"
+checking: "Checking"
+available: "Available"
+unavailable: "Not available"
+usernameInvalidFormat: "letters, numbers and _ are acceptable."
+tooShort: "Too short"
+tooLong: "Too long"
+weakPassword: "Weak password"
+normalPassword: "Good password"
+strongPassword: "Strong password"
+passwordMatched: "Matched"
+passwordNotMatched: "Doesn't match"
+signinWith: "Sign in with {x}"
+tapSecurityKey: "Tap your security key"
+or: "Or"
+uiLanguage: "UI display language"
+groupInvited: "Invited to group"
+aboutX: "About {x}"
+useOsNativeEmojis: "Use the OS native Emojis"
+noGroups: "No groups"
+joinOrCreateGroup: "Get invited to join the groups or you can create your own group."
+noHistory: "No history items"
+disableAnimatedMfm: "Disable MFM which has animations"
+doing: "On my way"
+category: "Category"
+tags: "Tags"
+docSource: "Source of this document"
+createAccount: "Create account"
+existingAcount: "Existing accounts"
+regenerate: "Regenerate"
+fontSize: "Font size"
+noFollowRequests: "You don't have any pending follow requests"
+openImageInNewTab: "Open image in new tab"
+dashboard: "Dashboard"
+local: "Local"
+remote: "Remote"
+total: "Total"
+weekOverWeekChanges: "Weekly"
+dayOverDayChanges: "Daily"
+accessibility: "Accessibility"
+clinetSettings: "Client Settings"
+accountSettings: "Account Settings"
+_ago:
+  unknown: "Unknown"
+  future: "Future"
+  justNow: "Just now"
+  secondsAgo: "{n}s ago"
+  minutesAgo: "{n}m ago"
+  hoursAgo: "{n}h ago"
+  daysAgo: "{n}d ago"
+  weeksAgo: "{n}week(s) ago"
+  monthsAgo: "{n}month(s) ago"
+  yearsAgo: "{n}year(s) ago"
+_time:
+  second: "s"
+  minute: "m"
+  hour: "h"
+  day: "d"
 _tutorial:
   title: "How to use Misskey"
   step1_1: "Welcome!"
@@ -386,7 +438,7 @@ _tutorial:
   step3_1: "Finished setting up your profile?"
   step3_2: "The next step is to post a note. You can do this by pressing a pencil icon on the screen."
   step3_3: "Fill in the modal and press the button on the right top to post."
-  step3_4: "Have nothing to say? Try \"I just started Misskey!\""
+  step3_4: "Have nothing to say? Try \"just setting up my msky\"!"
   step4_1: "Finished posting your first note?"
   step4_2: "Hurray! Now your first note is displayed on your timeline."
   step5_1: "Now, let's try making your timeline more lively by following other people."
@@ -443,6 +495,7 @@ _antennaSources:
   homeTimeline: "Notes from following users"
   users: "Notes from specific users"
   userList: "Notes from specific list"
+  userGroup: "Notes from users in the specified group"
 _weekday:
   sunday: "Sunday"
   monday: "Monday"
@@ -459,6 +512,7 @@ _widgets:
   trends: "Trending"
   clock: "Clock"
   rss: "RSS reader"
+  activity: "Activity"
 _cw:
   hide: "Hide"
   show: "Load more"

locales/es-ES.yml

@@ -1,21 +1,6 @@
 ---
-_ago:
-  unknown: "Desconocido"
-  future: "Futuro"
-  justNow: "Recién ahora"
-  secondsAgo: "Hace {n} segundos"
-  minutesAgo: "Hace {n} minutos"
-  hoursAgo: "Hace {n} horas"
-  daysAgo: "Hace {n} días"
-  weeksAgo: "Hace {n} semanas"
-  monthsAgo: "Hace {n} meses"
-  yearsAgo: "Hace {n} años"
-_time:
-  second: "Segundos"
-  minute: "Minutos"
-  hour: "Horas"
-  day: "Días"
-introMisskey: "¡Bienvenido/a! Misskey es un servicio de microblogging descentralizado de código abierto. Escribe \"notas\" para compartir lo que te ocurre ahora o para contar sobre ti a todos. 📡\nCon la función de \"reacciones\", puedes también añadir una reacción rápida a las notas de todos.👍\nExplora un nuevo mundo.🚀"
+_lang_: "Español"
+introMisskey: "¡Bienvenido/a! Misskey es un servicio de microblogging descentralizado de código abierto.\nEscribe \"notas\" para compartir lo que te ocurre ahora o para contar sobre ti a todos 📡\nCon la función de \"reacciones\", puedes también añadir una reacción rápida a las notas de todos 👍\nExplora un nuevo mundo 🚀"
 monthAndDay: "{day}/{month}"
 search: "Buscar"
 notifications: "Notificaciones"
@@ -326,6 +311,7 @@ aboutMisskey: "Sobre Misskey"
 aboutMisskeyText: "Misskey es un software de código abierto, desarrollado por syuilo desde el 2014"
 misskeyMembers: "Es creado y mantenido por los miembros aquí listados:"
 misskeySource: "El código fuente está disponible aquí:"
+misskeyTranslation: "Ayúdanos con tu contribución para traducir Misskey:"
 misskeyDonate: "Puedes contribuir al desarrollo de Misskey donando aquí:"
 morePatrons: "Muchas más personas nos apoyan. Muchas gracias🥰"
 patrons: "Patrocinadores"
@@ -370,12 +356,78 @@ members: "Miembros"
 transfer: "Transferir"
 messagingWithUser: "Chatear con usuario"
 messagingWithGroup: "Chatear en grupo"
+title: "Título"
+text: "Texto"
 enable: "Activar"
 next: "Siguiente"
 retype: "Intentar de nuevo"
 noteOf: "Notas de {user}"
 inviteToGroup: "Invitar al grupo"
 maxNoteTextLength: "Límite de caracteres en una nota"
+quoteAttached: "Cita añadida"
+quoteQuestion: "¿Quiere añadir una cita?"
+noMessagesYet: "Aún no hay chat"
+newMessageExists: "Tienes un mensaje nuevo"
+onlyOneFileCanBeAttached: "Solo se puede añadir un archivo al mensaje"
+signinRequired: "Iniciar sesión"
+invitationCode: "Código de invitación"
+checking: "Comprobando"
+available: "Disponible"
+unavailable: "No disponible"
+usernameInvalidFormat: "utiliza letras, números y/o -."
+tooShort: "Demasiado corto"
+tooLong: "Demasiado largo"
+weakPassword: "Contraseña débil"
+normalPassword: "Buena contraseña"
+strongPassword: "Muy buena contraseña"
+passwordMatched: "Correcto"
+passwordNotMatched: "Las contraseñas no son las mismas"
+signinWith: "Inicie sesión con {x}"
+tapSecurityKey: "Toque la clave de seguridad"
+or: "O"
+uiLanguage: "Idioma de visualización de la interfaz"
+groupInvited: "Invitado al grupo"
+aboutX: "Acerca de {x}"
+useOsNativeEmojis: "Usa los emojis nativos de la plataforma"
+noGroups: "Sin grupos"
+joinOrCreateGroup: "Obtenga una invitación para unirse al grupos o puede crear su propio grupo."
+noHistory: "No hay datos en el historial"
+disableAnimatedMfm: "Deshabilitar MFM que tiene animaciones"
+doing: "Voy en camino"
+category: "Categoría"
+tags: "Etiqueta"
+docSource: "Fuente de este documento"
+createAccount: "Crear cuenta"
+existingAcount: "Cuentas existentes"
+regenerate: "Regenerar"
+fontSize: "Tamaño de la letra"
+noFollowRequests: "No hay solicitudes de seguimiento"
+openImageInNewTab: "Abrir imagen en nueva pestaña"
+dashboard: "Panel de control"
+local: "Local"
+remote: "Remoto"
+total: "Total"
+weekOverWeekChanges: "Dif semanal"
+dayOverDayChanges: "Dif diaria"
+accessibility: "Accesibilidad"
+clinetSettings: "Ajustes del cliente"
+accountSettings: "Ajustes de cuenta"
+_ago:
+  unknown: "Desconocido"
+  future: "Futuro"
+  justNow: "Recién ahora"
+  secondsAgo: "Hace {n} segundos"
+  minutesAgo: "Hace {n} minutos"
+  hoursAgo: "Hace {n} horas"
+  daysAgo: "Hace {n} días"
+  weeksAgo: "Hace {n} semanas"
+  monthsAgo: "Hace {n} meses"
+  yearsAgo: "Hace {n} años"
+_time:
+  second: "Segundos"
+  minute: "Minutos"
+  hour: "Horas"
+  day: "Días"
 _tutorial:
   title: "Cómo usar Misskey"
   step1_1: "Bienvenido"
@@ -443,6 +495,7 @@ _antennaSources:
   homeTimeline: "Notas de los usuarios que sigues"
   users: "Notas de un usuario o varios"
   userList: "Notas de los usuarios de una lista"
+  userGroup: "Notas de los usuarios de una grupo"
 _weekday:
   sunday: "Domingo"
   monday: "Lunes"
@@ -459,6 +512,7 @@ _widgets:
   trends: "Tendencias"
   clock: "Reloj"
   rss: "Lector RSS"
+  activity: "Actividad"
 _cw:
   hide: "Ocultar"
   show: "Ver más"

locales/fr-FR.yml

@@ -1 +1,864 @@
 ---
+_lang_: "Français"
+introMisskey: "Bienvenue! Misskey est un service de microblogage décentralisé open source.\nÉcrivez des «notes» pour partager ce qui vous arrive maintenant ou pour parler de vous à tout le monde 📡\nAvec la fonction «réactions», vous pouvez également ajouter une réaction rapide aux notes de chacun 👍\nExplorez un nouveau monde 🚀"
+monthAndDay: "{day}/{month}"
+search: "Rechercher"
+notifications: "Notifications"
+username: "Nom d'utilisateur·rice"
+password: "Mot de passe"
+fetchingAsApObject: "Récupération depuis le fédiverse"
+ok: "D'accord"
+gotIt: "J'ai compris !"
+cancel: "Annuler"
+enterUsername: "Entrer un nom d'utilisateur·rice"
+renotedBy: "Renoté par {user}"
+noNotes: "Pas de notes"
+noNotifications: "Pas de notifications"
+instance: "Instance"
+settings: "Paramètres"
+profile: "Profil"
+timeline: "Fil d'actualité"
+noAccountDescription: "L'utilisateur·rice n'a pas renseigné de présentation sur son profil"
+login: "Se connecter"
+loggingIn: "Connexion en cours"
+logout: "Se déconnecter"
+signup: "S'enregistrer"
+uploading: "Envoi en cours"
+save: "Enregistrer"
+users: "Utilisateur·rice·s"
+addUser: "Ajouter un·e utilisateur·rice"
+favorite: "Ajouter aux favoris"
+favorites: "Favoris"
+unfavorite: "Retirer des favoris"
+pin: "Épingler sur le profil"
+unpin: "Désépingler"
+copyContent: "Copier le contenu"
+copyLink: "Copier le lien"
+delete: "Supprimer"
+addToList: "Ajouter à une liste"
+sendMessage: "Envoyer un message"
+copyUsername: "Copier le nom d'utilisateur"
+reply: "Répondre"
+loadMore: "Voir plus"
+youGotNewFollower: "Vous a suivi"
+receiveFollowRequest: "Demande de suivi reçue"
+followRequestAccepted: "Suivre la demande acceptée"
+mentions: "Mentions"
+directNotes: "Messages directs"
+importAndExport: "Import et export"
+import: "Importer"
+export: "Exporter"
+files: "Fichier·s"
+download: "Télécharger"
+driveFileDeleteConfirm: "Êtes-vous sûr·e de vouloir supprimer le fichier \"{name}\" ? Les notes avec ce fichier joint seront aussi supprimées."
+unfollowConfirm: "Êtes-vous sûr·e ne plus vouloir suivre {name} ?"
+exportRequested: "Vous avez demandé une exportation. Cela pourrait prendre un peu de temps. Une fois l'exportation terminée, le fichier résultant sera ajouté dans le Drive."
+importRequested: "Vous avez initié un import. Cela pourrait prendre un peu de temps."
+lists: "Listes"
+noLists: "Aucune liste"
+note: "Note"
+notes: "Notes"
+following: "Abonnements"
+followers: "Abonné·e·s"
+followsYou: "Votre abonné"
+createList: "Créer une liste"
+manageLists: "Gérer les listes"
+error: "Une erreur est survenue"
+retry: "Réessayer"
+enterListName: "Nom de la liste"
+privacy: "Vie privée"
+makeFollowManuallyApprove: "Demandes d’abonnements requiert l’approbation"
+defaultNoteVisibility: "Visibilité par défaut"
+follow: "Abonnement"
+followRequest: "Demande d’abonnement"
+followRequests: "Demandes d’abonnement"
+unfollow: "Se désabonner"
+followRequestPending: "En attente d’approbation"
+enterEmoji: "ou entrez un émoji"
+renote: "Renote"
+unrenote: "Annuler Renote"
+quote: "Citation"
+pinnedNote: "Note épinglée"
+you: "Vous"
+clickToShow: "Cliquer pour afficher"
+sensitive: "Contenu sensible"
+add: "Ajouter"
+reaction: "Réactions"
+reactionSettingDescription: "Personnaliser les émojis à afficher dans le sélecteur de réactions, délimités par les sauts de ligne."
+rememberNoteVisibility: "Se souvenir de la visibilité des notes"
+renameFile: "Renommer le ficher"
+attachCancel: "Enlever le fichier attaché"
+markAsSensitive: "Marquer comme sensible"
+unmarkAsSensitive: "Enlever le marquage comme sensible"
+enterFileName: "Entrer le nom du fichier"
+mute: "Mettre en sourdine"
+unmute: "Enlever la sourdine"
+block: "Bloquer"
+unblock: "Débloquer"
+suspend: "Suspendre"
+unsuspend: "Annuler la suspension"
+blockConfirm: "Désirez-vous bloquer ce compte ?"
+unblockConfirm: "Désirez-vous débloquer ce compte ?"
+suspendConfirm: "Désirez-vous suspendre ce compte ?"
+unsuspendConfirm: "Désirez-vous annuler la suspension de ce compte ?"
+selectList: "Sélectionner une liste"
+customEmojis: "Émojis personnalisés"
+emojiName: "Nom de l’émoji"
+emojiUrl: "URL de l’émoji"
+addEmoji: "Ajouter un émoji"
+cacheRemoteFiles: "Mettre en cache des fichiers distants"
+cacheRemoteFilesDescription: "Quand ce paramètre est désactivé, les fichiers distants sont chargés directement de l'instance distante. Désactiver cela diminuera l'utilisation du stockage mais augmentera le trafic parce les miniatures ne seront pas générées."
+flagAsBot: "Ce compte est un robot"
+flagAsCat: "Ce compte est un chat"
+autoAcceptFollowed: "Approuver automatiquement les abonnements des utilisateurs abonné·e·s"
+addAcount: "Ajouter un compte"
+loginFailed: "Échec de la connexion"
+showOnRemote: "Voir sur l'instance distante"
+general: "Général"
+wallpaper: "Arrière plan"
+removeWallpaper: "Supprimer l'arrière plan"
+searchWith: "Recherche : {q}"
+youHaveNoLists: "Vous n'avez aucune liste"
+followConfirm: "Désirez-vous suivre {name} ?"
+proxyAccount: "Compte proxy"
+proxyAccountDescription: "Un compte proxy se comporte, dans certaines conditions, comme un·e abonné·e distant pour les utilisateurs d'autres instances.\nExemple : quand un·e utilisateur·rice distant·e est ajouté·e à une liste, ses notes ne serait pas visibles sur l'instance si personne ne le·la suit. Le compte proxy va donc le·la suivre pour que ses notes soient acheminées."
+host: "Hôte"
+selectUser: "Sélectionner un·e utilisateur·rice"
+recipient: "Correspondant·e"
+annotation: "Commentaires"
+federation: "Fédération"
+instances: "Instance"
+registeredAt: "Premier contact le"
+latestRequestSentAt: "Dernière requête envoyée"
+latestRequestReceivedAt: "Dernière requête reçue"
+latestStatus: "Dernière statut"
+storageUsage: "Stockage utilisé"
+charts: "Graphiques"
+perHour: "par heure"
+perDay: "par jour"
+stopActivityDelivery: "Arrêter l'envoi d'activités"
+blockThisInstance: "Bloquer cette instnce"
+operations: "Opérations"
+software: "Logiciel"
+version: "Version"
+metadata: "Métadonnées"
+withNFiles: "{n} fichier(s)"
+monitor: "Écran de contrôle"
+jobQueue: "File d’attente"
+cpuAndMemory: "Processeur et mémoire"
+network: "Réseau"
+disk: "Disque"
+instanceInfo: "Informations sur l'instance"
+statistics: "Statistiques"
+clearQueue: "Vider la file d'attente"
+clearQueueConfirmTitle: "Êtes-vous sûr·e de vouloir vider la file d'attente ?"
+clearQueueConfirmText: "Les notes non distribuées ne seront pas livrées. Normalement, vous n'avez PAS besoin d'effectuer cette opération."
+clearCachedFiles: "Vider le cache"
+clearCachedFilesConfirm: "Êtes-vous sûr·e de vouloir vider le cache de fichiers distants ?"
+blockedInstances: "Instances bloquées"
+blockedInstancesDescription: "Listez les instance que vous désirez bloquer, une par ligne. Ces instances bloquées ne seront pas capable d'interagir avec cette instance."
+muteAndBlock: "Masqués / Bloqués"
+mutedUsers: "Utilisateur·rice·s en sourdine"
+blockedUsers: "Utilisateur·rice·s bloqué·e·s"
+noUsers: "Il n'y a aucun utilisateur·rice"
+editProfile: "Modifier votre profil"
+noteDeleteConfirm: "Confirmez-vous la suppression de cette note ?"
+pinLimitExceeded: "Je ne peux plus épingler"
+intro: "L'installation de Misskey est terminée! Créons le compte administrateur."
+done: "Terminé"
+processing: "Traitement en cours"
+preview: "Prévisualisation"
+noCustomEmojis: "Il a pas d’émoji"
+customEmojisOfRemote: "Émojis l'instance distante"
+noJobs: "Il n'y a aucune tâche planifiée"
+federating: "En cours de fédération"
+blocked: "Bloqué"
+suspended: "Suspendu"
+all: "Tous"
+subscribing: "Abonné"
+publishing: "Publié"
+notResponding: "Ne répond pas"
+instanceFollowing: "Abonnements une instance"
+instanceFollowers: "Abonné·e·s de l'instance"
+instanceUsers: "Utilisateur·e·s de l'instance"
+changePassword: "Modifier votre mot de passe"
+security: "Sécurité"
+retypedNotMatch: "Les saisies ne correspondent pas."
+currentPassword: "Mot de passe actuel"
+newPassword: "Nouveau mot de passe"
+newPasswordRetype: "Nouveau mot de passe (répéter)"
+attachFile: "Joindre un fichier"
+more: "Plus !"
+featured: "Surlignage"
+usernameOrUserId: "Nom d'utilisateur ou ID utilisateur"
+noSuchUser: "Utilisateur non trouvé"
+lookup: "Recherche"
+announcements: "Annonces"
+imageUrl: "URL de l’image"
+remove: "Supprimer"
+removed: "Supprimé"
+removeAreYouSure: "Supprimer «{x}» ?"
+saved: "Enregistré"
+messaging: "Discuter"
+upload: "Téléchargez"
+fromDrive: "Depuis le Drive"
+fromUrl: "De l'URL"
+explore: "Découvrir"
+games: "Jeux de Misskey"
+messageRead: "Lus"
+recentUsedEmojis: "Emoji récemment utilisé"
+noMoreHistory: "Plus d'histoire passée"
+startMessaging: "Commencer à écrire un discutez"
+nUsersRead: "{n} personnes ont lu"
+agreeTo: "D'accord {0}"
+tos: "Conditions d'utilisation"
+start: "Commencer"
+home: "Principal"
+remoteUserCaution: "Les informations sont incomplètes en raison de l'utilisateur distant."
+activity: "Activités"
+images: "Images"
+birthday: "Date de naissance"
+yearsOld: "{age} ans"
+registeredDate: "Date de création"
+location: "Localisation"
+theme: "Thème"
+lightThemes: "Thème lumineux"
+darkThemes: "Thème sombre"
+drive: "Drive"
+selectFile: "Choisir le fichier"
+selectFiles: "Choisir le fichiers"
+renameFolder: "Renommer le dossier"
+createFolder: "Créer un dossier"
+deleteFolder: "Supprimer le dossier"
+addFile: "Ajoutez un fichier"
+emptyDrive: "Le Drive est vide"
+emptyFolder: "Le dossier est vide"
+copyUrl: "Copier l’URL"
+rename: "Renommer"
+avatar: "Avatar"
+banner: "Bannière"
+nsfw: "Contenu sensible"
+disconnectedFromServer: "Déconnecté du serveur"
+reloadConfirm: "Voulez-vous recharger?"
+watch: "Surveiller"
+unwatch: "Ne plus surveiller"
+accept: "Autoriser"
+reject: "Refuser"
+instanceName: "Nom de l’instance"
+instanceDescription: "Description de l’instance"
+maintainerName: "Nom d'administrateur"
+maintainerEmail: "Email de l'administrateur"
+tosUrl: "URL des conditions d'utilisation"
+thisYear: "Cette année"
+thisMonth: "Ce mois-ci"
+today: "Aujourd'hui"
+dayX: "{day} jour"
+monthX: "{month} mois"
+yearX: "{year} année"
+pages: "Pages"
+integration: "Intégrations"
+connectSerice: "Connecter"
+disconnectSerice: "Déconnecter"
+enableLocalTimeline: "Activer le fil local"
+enableGlobalTimeline: "Activer le fil global"
+disablingTimelinesInfo: "Si vous désactivez ces le fils, les administrateurs et les modérateurs pourront toujours y accéder pour plus de commodité."
+registration: "S'inscrire"
+enableRegistration: "Autoriser n’importe qui à s’enregistrés"
+invite: "Inviter"
+proxyRemoteFiles: "Proxy fichiers distants"
+proxyRemoteFilesDescription: "Si vous activez ce paramètre, les fichiers distants non stockés ou supprimés en raison d'une capacité excédentaire seront affichés via un proxy local et généreront une miniature. Cela n'affectera pas le stockage du serveur."
+driveCapacityPerLocalAccount: "Volume du Drive par utilisateur local"
+driveCapacityPerRemoteAccount: "Volume du Drive par utilisateur distant"
+inMb: "en mégaoctets"
+iconUrl: "URL de l'image de l'icône"
+bannerUrl: "URL de l'image de la bannière"
+basicInfo: "Informations basiques"
+pinnedUsers: "Utilisateur·rice épinglé·e"
+pinnedUsersDescription: "Décrivez les utilisateurs que vous souhaitez définir sur la page \"Découvrir\" séparés par une nouvelle ligne"
+recaptcha: "reCAPTCHA"
+enableRecaptcha: "Activation de reCAPTCHA"
+recaptchaSiteKey: "Clé du site"
+recaptchaSecretKey: "Clé secrète"
+antennas: "Antenne"
+manageAntennas: "Gestion d'antenne"
+name: "Nom"
+antennaSource: "Recevoir la source"
+antennaKeywords: "Mots clés entrants"
+antennaKeywordsDescription: "Lorsqu'il est séparé par un espace, il devient une spécification ET, et lorsqu'il est séparé par un saut de ligne, il devient une spécification OU."
+notifyAntenna: "Notifier les nouvelles notes"
+withFileAntenna: "Notes uniquement avec fichiers joints"
+serviceworker: "ServiceWorker"
+enableServiceworker: "Activer ServiceWorker"
+antennaUsersDescription: "Spécifiez les noms d'utilisateurs séparés par des sauts de ligne"
+caseSensitive: "Sensible à la casse"
+withReplies: "Y compris répondres"
+connectedTo: "Vous êtes connectés aux services suivants"
+notesAndReplies: "Notes et Répondres"
+withFiles: "Avec fichiers joints"
+silence: "Mettre en masquer"
+silenceConfirm: "Mettre l'utilisateur sous masquer ?"
+unsilenceConfirm: "Voulez-vous annuler le masquer ?"
+popularUsers: "Utilisateur·rice·s populaires"
+recentlyUpdatedUsers: "Utilisateur·rice·s actif·ve·s récemment"
+recentlyRegisteredUsers: "Utilisateur·rice·s récemment enregistrés"
+recentlyDiscoveredUsers: "Utilisateur·rice·s récemment découverts"
+exploreUsersCount: "Il y a {count} utilisateur·rice·s"
+exploreFediverse: "Explorer le Fédiverse"
+popularTags: "Mots-clés populaires"
+userList: "Listes"
+about: "Informations"
+aboutMisskey: "À propos de Misskey"
+aboutMisskeyText: "Misskey est un logiciel open source, développé par syuilo depuis 2014."
+misskeyMembers: "Il est développé et maintenu par les membres répertoriés ici:"
+misskeySource: "Le code source est disponible ici:"
+misskeyTranslation: "Aidez-nous avec votre contribution à traduire Misskey:"
+misskeyDonate: "Vous pouvez contribuer au développement de Misskey en faisant un don ici:"
+morePatrons: "Nous apprécions vraiment le soutien de nombreux autres les soutiens non répertoriés ici. Merci beaucoup à tous! 🥰"
+patrons: "Supporteurs"
+administrator: "Administrateur"
+token: "Jeton"
+twoStepAuthentication: "Authentification à deux facteurs"
+moderator: "Modérateurs"
+nUsersMentioned: "{n} utilisateur·rice·s mentionné·e·s"
+securityKey: "Clé de sécurité"
+securityKeyName: "Nom de la clé"
+registerSecurityKey: "S’inscrire la clé de sécurité"
+lastUsed: "Dernier utilisé"
+unregister: "Se désinscrire"
+passwordLessLogin: "Connectez-vous sans mot de passe"
+resetPassword: "Réinitialiser mot de passe"
+newPasswordIs: "Votre nouveau mot de passe est \"{password}\""
+post: "Notes"
+posted: "Publié !"
+autoReloadWhenDisconnected: "Rechargement automatique lorsque le serveur se déconnecte"
+autoNoteWatch: "Surveiller automatique pour les notes"
+autoNoteWatchDescription: "Soyez informé des notes auxquelles vous avez réagi ou répondu."
+reduceUiAnimation: "Réduire l'animation de l'interface"
+share: "Partager"
+notFound: "Non trouvé"
+notFoundDescription: "Aucune page ne correspond à l'URL spécifiée."
+uploadFolder: "Emplacement de téléversement par défaut"
+cacheClear: "Vider le cache"
+markAsReadAllNotifications: "Marquer toutes les notifications comme lues"
+markAsReadAllUnreadNotes: "Marquer toutes les notes comme lues"
+markAsReadAllTalkMessages: "Marquer toutes les discutez comme lues"
+help: "Aide"
+inputMessageHere: "Tapez ici votre message"
+close: "Fermer"
+group: "Groupe"
+groups: "Groupes"
+createGroup: "Créer un groupe"
+ownedGroups: "Groupe propriétaire"
+joinedGroups: "Membre dans les groupes"
+invites: "Inviter"
+groupName: "Nom du groupe"
+members: "Membres"
+transfer: "Transférer"
+messagingWithUser: "Discutez avec les utilisateurs"
+messagingWithGroup: "Discuter en groupe"
+title: "Titre"
+text: "Texte"
+enable: "Activer"
+next: "Suivant"
+retype: "Retapez"
+noteOf: "{user} notes"
+inviteToGroup: "Inviter au groupe"
+maxNoteTextLength: "Limite de note caractères"
+quoteAttached: "Avec citation"
+quoteQuestion: "Souhaitez-vous ajoutez une citation ?"
+noMessagesYet: "Pas encore discuté"
+newMessageExists: "Vous avez un nouveau message"
+onlyOneFileCanBeAttached: "Vous ne pouvez joindre qu'un seul fichier au message"
+signinRequired: "Veuillez vous connecter"
+invitationCode: "Code d’invitation"
+checking: "Vérification"
+available: "Disponible"
+unavailable: "Non disponible"
+usernameInvalidFormat: "Vous pouvez utiliser des lettres, des nombres et _"
+tooShort: "Est trop court"
+tooLong: "Est trop long"
+weakPassword: "Faible mot de passe"
+normalPassword: "Bon mot de passe"
+strongPassword: "Fort mot de passe"
+passwordMatched: "Correcte"
+passwordNotMatched: "Ne correspond pas"
+signinWith: "Connectez-vous avec {x}"
+tapSecurityKey: "Touchez la clé de sécurité"
+or: "OU"
+uiLanguage: "Langue d'affichage de l'interface"
+groupInvited: "Invité au groupe"
+aboutX: "À propos de {x}"
+useOsNativeEmojis: "Utilisez les emojis natifs de la plateforme"
+noGroups: "Pas de groupes"
+joinOrCreateGroup: "Soyez invité à rejoindre les groupes ou vous pouvez créer votre propre groupe."
+noHistory: "Pas d'historique"
+disableAnimatedMfm: "Désactiver MFM qui a des animations"
+doing: "Attends une seconde"
+category: "Catégories"
+tags: "Étiquettes"
+docSource: "Source de ce document"
+createAccount: "Créer compte"
+existingAcount: "Comptes existants"
+regenerate: "Régénérer"
+fontSize: "Taille de la police"
+noFollowRequests: "Vous n'avez aucune demandes d'abonnement en attente"
+openImageInNewTab: "Ouvrir l'image dans un nouvel onglet"
+dashboard: "Tableau de bord"
+local: "Local"
+remote: "Distant"
+total: "Total"
+weekOverWeekChanges: "Diff hebdo"
+dayOverDayChanges: "Diff quotidien"
+accessibility: "Accessibilité"
+clinetSettings: "Paramètres du client"
+accountSettings: "Paramètres du compte"
+_ago:
+  unknown: "Inconnu"
+  future: "Futur"
+  justNow: "à l’instant"
+  secondsAgo: "Il y a {n}s"
+  minutesAgo: "Il y a {n}min"
+  hoursAgo: "Il y a {n} heures"
+  daysAgo: "Il y a {n} jours"
+  weeksAgo: "Il y a {n} semaines"
+  monthsAgo: "Il y a {n} mois"
+  yearsAgo: "Il y a {n} ans"
+_time:
+  second: "s"
+  minute: "min"
+  hour: "h"
+  day: "j"
+_tutorial:
+  title: "Comment utiliser Misskey"
+  step1_1: "Bienvenue,"
+_2fa:
+  alreadyRegistered: "Cette étape à déjà été complétée"
+  registerDevice: "S’inscrire l'appareil"
+  registerKey: "S’inscrire la clé"
+  step1: "Tout d'abord, installez une application d'authentification, telle que {a} ou {b}, sur votre appareil."
+  step2: "Ensuite, scannez le code QR affiché avec l'application."
+  step3: "Entrez le jeton affiché sur l'application et vous avez terminé."
+  step4: "Lorsque vous vous connectez, entrez le jeton de la même manière."
+  securityKeyInfo: "Vous pouvez configurer l'authentification WebAuthN pour sécuriser davantage le processus de connexion avec non seulement la clé de sécurité matérielle qui prend en charge FIDO2, mais également l'authentification par empreinte digitale ou PIN sur votre appareil."
+_permissions:
+  "read:account": "Afficher les informations du compte"
+  "write:account": "Mettre à jour les informations de votre compte"
+  "read:blocks": "Voir les blocs"
+  "write:blocks": "Écrire des blocs"
+  "read:drive": "Parcourir le Drive"
+  "write:drive": "Écrire sur le Drive"
+  "read:favorites": "Afficher les favoris"
+  "write:favorites": "Écrire des favoris"
+  "read:following": "Voir les informations de l'abonné"
+  "write:following": "Abonnements/Se désabonner"
+  "read:messaging": "Cherche à discuter"
+  "write:messaging": "Contrôler le discuter"
+  "read:mutes": "Voir les comptes muets"
+  "write:mutes": "Gérer les comptes muets"
+  "write:notes": "Créer / supprimer des notes"
+  "read:notifications": "Afficher les notifications"
+  "write:notifications": "Gérer vos notifications"
+  "read:reactions": "Lire les réactions"
+  "write:reactions": "Gérer vos réactions"
+  "write:votes": "Voter"
+  "read:pages": "Afficher la page"
+  "write:pages": "Mettre à jour les Pages"
+  "read:page-likes": "Lire les favoris sur les Pages"
+  "write:page-likes": "Mettre à jour les favoris sur les Pages"
+  "read:user-groups": "Voir les groupes d'utilisateur·rice·s"
+  "write:user-groups": "Éditer les groupes des utilisateur·rice·s"
+_auth:
+  shareAccess: "Autoriser \"{name}\" à accéder à votre compte ?"
+  permissionAsk: "Cette application nécessite les autorisations suivantes "
+_antennaSources:
+  all: "Toutes les notes"
+  homeTimeline: "Notes de l'utilisateur auquel je m'abonne"
+  users: "Notes des un ou plusieurs utilisateurs spécifiés"
+  userList: "Notes pour les utilisateurs de la liste spécifiée"
+  userGroup: "Notes pour les utilisateurs de la groupe spécifiée"
+_weekday:
+  sunday: "Dimanche"
+  monday: "Lundi"
+  tuesday: "Mardi"
+  wednesday: "Mercredi"
+  thursday: "Jeudi"
+  friday: "Vendredi"
+  saturday: "Samedi"
+_widgets:
+  memo: "Note collante"
+  notifications: "Notifications"
+  timeline: "Fil d'actualité"
+  calendar: "Calendrier"
+  trends: "Tendances"
+  clock: "Horloge"
+  rss: "Lecteur de flux RSS"
+  activity: "Activités"
+_cw:
+  hide: "Masquer"
+  show: "Voir plus"
+  chars: "{count} caractères"
+  files: "{count} fichiers"
+  poll: "Sondage"
+_poll:
+  noOnlyOneChoice: "Au moins 2 réponses nécéssaires"
+  choiceN: "Choix {n}"
+  noMore: "Vous ne pouvez pas en ajouter davantage"
+  canMultipleVote: "Autoriser le multi-choix"
+  expiration: "Fin du sondage"
+  infinite: "Illimité"
+  at: "Choisir une date"
+  after: "Chosir une durée"
+  deadlineDate: "Date de fin"
+  deadlineTime: "Heure de fin"
+  duration: "Durée"
+  votesCount: "{n} votes"
+  totalVotes: "{n} votes au total"
+  vote: "Voter"
+  showResult: "Voir les résultats"
+  voted: "Déjà voté"
+  closed: "Terminé"
+  remainingDays: "{d} jours, {h} heures restantes"
+  remainingHours: "{h} heures et {m} minutes restantes"
+  remainingMinutes: "{m} minutes et {s} secondes restantes"
+  remainingSeconds: "{s} secondes restantes"
+_visibility:
+  public: "Public"
+  publicDescription: "Publier à tou·te·s les utilisateur·rice·s"
+  home: "Principal"
+  homeDescription: "Publier sur le fil principal uniquement"
+  followers: "Abonné·e·s"
+  followersDescription: "Publier à vos abonné·e·s uniquement"
+  specified: "Direct"
+  specifiedDescription: "Publier uniquement aux utilisateur·rice·s mentionné·e·s"
+  localOnly: "Local seulement"
+_postForm:
+  replyPlaceholder: "Répondre à cette note ..."
+  quotePlaceholder: "Citez cette note ..."
+  _placeholders:
+    a: "Qu'est-ce qu'il se passe ?"
+    b: "Quoi de neuf ?"
+    c: "Qu’avez-vous en tête ?"
+    d: "Désirez-vous publier quelques mots ?"
+    e: "Écrivez ici"
+    f: "En attente de vos écrits ..."
+_profile:
+  name: "Nom"
+  username: "Nom d'utilisateur·rice"
+  description: "À propos de moi"
+  youCanIncludeHashtags: "Vous pouvez également inclure des hashtags."
+  metadata: "Informations complémentaires"
+  metadataLabel: "Étiquette"
+  metadataContent: "Contenu"
+_exportOrImport:
+  allNotes: "Toutes les notes"
+  followingList: "Abonnements"
+  muteList: "Mettre en sourdine"
+  blockingList: "Bloquer"
+  userLists: "Listes"
+_charts:
+  federationInstancesIncDec: "Variation du nombre d'instances"
+  federationInstancesTotal: "Nombre d'instances au total"
+  usersIncDec: "Variation du nombre d'utilisateur·rice·s"
+  usersTotal: "Nombre d'utilsateur·rice·s au total"
+  activeUsers: "Utilisateur·rice·s actif·ve·s"
+  notesIncDec: "Variation du nombre d'notes"
+  localNotesIncDec: "Variation du nombre de notes local"
+  remoteNotesIncDec: "Variation du nombre d’notes distant"
+  notesTotal: "Nombre d'notes au total"
+  filesIncDec: "Variation du nombre de fichiers"
+  filesTotal: "Nombre de fichiers au total"
+  storageUsageIncDec: "Variation de l'utilisation du stockage"
+  storageUsageTotal: "Utilisation totale du stockage"
+_instanceCharts:
+  requests: "Requêtes"
+  users: "Variation du nombre d'utilisateur·rice·s"
+  usersTotal: "Somme du nombre d'utilisateur·rice·s accumulés"
+  notes: "Variation du nombre d'notes"
+  notesTotal: "Somme du nombre d’notes accumulés"
+  ff: "Variation des abonné·e·s"
+  ffTotal: "Somme du nombre d'abonnements accumulés"
+  cacheSize: "Variation de la taille du cache"
+  cacheSizeTotal: "Somme de la taille du cache accumulé"
+  files: "Variation du nombre de fichiers"
+  filesTotal: "Somme du nombre de fichiers accumulés"
+_timelines:
+  home: "Principal"
+  local: "Local"
+  social: "Social"
+  global: "Global"
+_pages:
+  newPage: "Créer une page"
+  editPage: "Modifier une page"
+  readPage: "Voir la source"
+  page-created: "Page a été créée !"
+  page-updated: "A mis à jour la page"
+  name-already-exists: "Une page portant le même nom existe déjà"
+  title-invalid-name: "L’URL de la page spécifiée n’est pas valide"
+  text-invalid-name: "Assurez-vous qu'il n'est pas vide"
+  editThisPage: "Éditer cette page"
+  viewSource: "Afficher la source"
+  viewPage: "Afficher la page"
+  like: "Favori"
+  unlike: "Je n’favoris pas"
+  liked-pages: "Pages favoris"
+  my-pages: "Mes pages"
+  inspector: "Inspecteur"
+  content: "Bloc de page"
+  variables: "Variables"
+  variables-info: "Vous pouvez créer une page dynamique à l'aide de variables. En tapant le <b>{nom de variable}</b> dans le texte, vous pouvez y incorporer la valeur de la variable. Par exemple, si dans le texte <b>Bonjour {chose} monde!</b> la valeur de la variable (chose) est <b>ai</b>, le texte devient est <b>Bonjour ai monde!</b>."
+  variables-info2: "L'évaluation des variables (le calcul des valeurs) se fait de haut en bas, donc l'variable ne peut pas se référer à une autre qui est en dessous. Par exemple, lorsque les variables <b>A、B、C</b> sont définies, <b>C</b> peut faire référence à <b>A</b> ou <b>B</b>, mais <b>A</b> ne peut pas faire référence à <b>B</b> ou <b>C</b>."
+  variables-info3: "Pour recevoir une entrée utilisateur, ajoutez un bloc \"Entrée\" sur la page et définissez le nom des variables que vous souhaitez stocker dans le champ \"Nom de la variable\" (les variables seront créées automatiquement). Les actions seront exécutées en fonction de l'entrée utilisateur de ces variables."
+  variables-info4: "Les fonctions vous permettent d'organiser le processus de calcul des valeurs sous une forme réutilisable. Pour créer une fonction, créez une variable de type \"fonction\". Une fonction peut avoir un slot (argument) et sa valeur peut être utilisée comme variable dans la fonction. Il existe également une fonction qui prend une fonction comme argument dans la norme AiScript (appelée fonction d'ordre supérieur). En plus des fonctions prédéfinies, elles peuvent être définies instantanément dans ces emplacements de fonction d'ordre supérieur."
+  more-details: "Description"
+  title: "Titre"
+  url: "URL de page"
+  summary: "Résumé de page"
+  alignCenter: "Centrée"
+  hide-title-when-pinned: "Masquer le titre de la page lorsque celle-ci est épinglée au profil"
+  font: "Police de caractères"
+  fontSerif: "Serif"
+  fontSansSerif: "Sans Serif"
+  set-eye-catching-image: "Définir une image attirante"
+  remove-eye-catching-image: "Supprimer une image attirante"
+  chooseBlock: "Ajouter un bloc"
+  selectType: "Choisir un type"
+  enterVariableName: "Veuillez entrer un nom de variable"
+  the-variable-name-is-already-used: "Cette variable est déjà utilisée"
+  content-blocks: "Contenu"
+  input-blocks: "Entrée"
+  special-blocks: "Spécial"
+  post-from-post-form: "Publier ce contenu"
+  posted-from-post-form: "Publié !"
+  blocks:
+    text: "Texte"
+    textarea: "Zone de texte"
+    section: "Section"
+    image: "Images"
+    button: "Bouton"
+    if: "Si"
+    _if:
+      variable: "Variables"
+    post: "Formulaire à publier"
+    _post:
+      text: "Contenu"
+    textInput: "Entrée de textuelle"
+    _textInput:
+      name: "Nom de la variable"
+      text: "Titre"
+      default: "Valeur par défaut"
+    textareaInput: "Entrée de textuelle multiligne"
+    _textareaInput:
+      name: "Nom de la variable"
+      text: "Titre"
+      default: "Valeur par défaut"
+    numberInput: "Entrée numérique"
+    _numberInput:
+      name: "Nom de la variable"
+      text: "Titre"
+      default: "Valeur par défaut"
+    switch: "Basculer"
+    _switch:
+      name: "Nom de la variable"
+      text: "Titre"
+      default: "Valeur par défaut"
+    counter: "Compteur"
+    _counter:
+      name: "Nom de la variable"
+      text: "Titre"
+      inc: "Augmenter le chiffre"
+    _button:
+      text: "Titre"
+      colored: "Coloré"
+      action: "L'opération lorsque le bouton sera pressé"
+      _action:
+        dialog: "Afficher une fenêtre de dialogue"
+        _dialog:
+          content: "Contenu"
+        resetRandom: "Réinitialiser le nombre aléatoire"
+        pushEvent: "Envoyer un évènement"
+        _pushEvent:
+          event: "Nom de l'évènement"
+          message: "Message à afficher lorsque appuyé"
+          variable: "Variable à envoyer"
+          no-variable: "Rien"
+    radioButton: "Choix"
+    _radioButton:
+      name: "Nom de la variable"
+      title: "Titre"
+      values: "Choix séparés par des sauts de ligne"
+      default: "Valeur par défaut"
+  script:
+    categories:
+      flow: "Contrôle"
+      logical: "Opération logique"
+      operation: "Calculer"
+      comparison: "Comparer"
+      random: "Aléatoire"
+      value: "Valeur"
+      fn: "Fonction"
+      text: "Manipulation de texte"
+      convert: "Convertir"
+      list: "Listes"
+    blocks:
+      text: "Texte"
+      multiLineText: "Texte (Multi-lignes)"
+      textList: "Liste de texte"
+      _textList:
+        info: "Veuillez séparer chacun avec une nouvelle ligne"
+      strLen: "Longueur d'un texte"
+      _strLen:
+        arg1: "Texte"
+      strPick: "Extraire un caractère"
+      _strPick:
+        arg1: "Texte"
+        arg2: "Position du joueur"
+      strReplace: "Remplacement de texte"
+      _strReplace:
+        arg1: "Texte"
+        arg2: "Avant le remplacement"
+        arg3: "Après le remplacement"
+      strReverse: "Inverser le texte"
+      _strReverse:
+        arg1: "Texte"
+      join: "Concaténer du texte"
+      _join:
+        arg1: "Listes"
+        arg2: "Séparateur"
+      add: "Ajouter"
+      _add:
+        arg1: "A"
+        arg2: "B"
+      subtract: "Soustraire"
+      _subtract:
+        arg1: "A"
+        arg2: "B"
+      multiply: "Multiplier par"
+      _multiply:
+        arg1: "A"
+        arg2: "B"
+      divide: "Diviser par"
+      _divide:
+        arg1: "A"
+        arg2: "B"
+      mod: "Reste"
+      _mod:
+        arg1: "A"
+        arg2: "B"
+      round: "Décimal rond"
+      _round:
+        arg1: "Numérique"
+      eq: "A et B sont équivalents"
+      _eq:
+        arg1: "A"
+        arg2: "B"
+      notEq: "A et B sont différents"
+      _notEq:
+        arg1: "A"
+        arg2: "B"
+      and: "A et B"
+      _and:
+        arg1: "A"
+        arg2: "B"
+      or: "A ou B"
+      _or:
+        arg1: "A"
+        arg2: "B"
+      lt: "A est plus petit que B"
+      _lt:
+        arg1: "A"
+        arg2: "B"
+      gt: "A est supérieur à B"
+      _gt:
+        arg1: "A"
+        arg2: "B"
+      ltEq: "A est plus petit ou égal à B"
+      _ltEq:
+        arg1: "A"
+        arg2: "B"
+      gtEq: "A est supérieur ou égal à B"
+      _gtEq:
+        arg1: "A"
+        arg2: "B"
+      if: "Branche"
+      _if:
+        arg1: "Si"
+        arg2: "Si"
+        arg3: "Sinon"
+      not: "Nier"
+      _not:
+        arg1: "Nier"
+      random: "Aléatoire"
+      _random:
+        arg1: "Probabilité"
+      rannum: "Nombre aléatoire"
+      _rannum:
+        arg1: "Minimum"
+        arg2: "Maximum"
+      randomPick: "Sélectionner au hasard dans la liste"
+      _randomPick:
+        arg1: "Listes"
+      dailyRandom: "Aléatoire (Quotidien pour chaque utilisateur)"
+      _dailyRandom:
+        arg1: "Probabilité"
+      dailyRannum: "Numéros aléatoires (Quotidien pour chaque utilisateur)"
+      _dailyRannum:
+        arg1: "Minimum"
+        arg2: "Maximum"
+      dailyRandomPick: "Sélectionné au hasard dans la liste (Quotidien pour chaque utilisateur)"
+      _dailyRandomPick:
+        arg1: "Listes"
+      seedRandom: "Aléatoire (graine)"
+      _seedRandom:
+        arg1: "Graine"
+        arg2: "Probabilité"
+      seedRannum: "Nombre aléatoire (Graine)"
+      _seedRannum:
+        arg1: "Graine"
+        arg2: "Minimum"
+        arg3: "Maximum"
+      seedRandomPick: "Sélectionné au hasard dans la liste (graine)"
+      _seedRandomPick:
+        arg1: "Graine"
+        arg2: "Listes"
+      DRPWPM: "Sélectionné au hasard dans une liste de probabilités (Quotidien pour chaque utilisateur)"
+      _DRPWPM:
+        arg1: "Liste de texte"
+      pick: "Sélectionner dans la liste"
+      _pick:
+        arg1: "Listes"
+        arg2: "Position"
+      listLen: "Longueur de la liste"
+      _listLen:
+        arg1: "Listes"
+      number: "Numérique"
+      stringToNumber: "Convertir du texte en numérique"
+      _stringToNumber:
+        arg1: "Texte"
+      numberToString: "Convertir du numérique en texte"
+      _numberToString:
+        arg1: "Numérique"
+      splitStrByLine: "Séparer le texte par lignes"
+      _splitStrByLine:
+        arg1: "Texte"
+      ref: "Variables"
+      fn: "Fonction"
+      _fn:
+        slots: "Slots"
+        slots-info: "Veuillez délimiter chaque slot par un saut de ligne"
+        arg1: "Sortie"
+      for: "Répéter"
+      _for:
+        arg1: "Compter"
+        arg2: "Action"
+    typeError: "Le slot {slot} accepte \"{expect}\" mais a \"{actual}\" !"
+    thereIsEmptySlot: "Slot {slot} est vide !"
+    types:
+      string: "Texte"
+      number: "Numérique"
+      boolean: "Marqueur"
+      array: "Listes"
+      stringArray: "Liste de texte"
+    emptySlot: "Slot vide"
+    enviromentVariables: "Variables d'environnement"
+    pageVariables: "Élément de page"
+    argVariables: "Entrée slot"

locales/index.js

@@ -19,9 +19,9 @@ const languages = [
 	//'de-DE',
 	'en-US',
 	'es-ES',
-	//'fr-FR',
+	'fr-FR',
 	'ja-JP',
-	//'ja-KS',
+	'ja-KS',
 	'ko-KR',
 	//'nl-NL',
 	//'pl-PL',

locales/ja-JP.yml

@@ -1,20 +1,4 @@
-_ago:
-  unknown: "謎"
-  future: "未来"
-  justNow: "たった今"
-  secondsAgo: "{n}秒前"
-  minutesAgo: "{n}分前"
-  hoursAgo: "{n}時間前"
-  daysAgo: "{n}日前"
-  weeksAgo: "{n}週間前"
-  monthsAgo: "{n}ヶ月前"
-  yearsAgo: "{n}年前"
-
-_time:
-  second: "秒"
-  minute: "分"
-  hour: "時間"
-  day: "日"
+_lang_: "日本語"
 
 introMisskey: "ようこそ！Misskeyは、オープンソースの分散型マイクロブログサービスです。\n「ノート」を作成して、いま起こっていることを共有したり、あなたについて皆に発信しよう📡\n「リアクション」機能で、皆のノートに素早く反応を追加することもできます👍\n新しい世界を探検しよう🚀"
 monthAndDay: "{month}月 {day}日"
@@ -327,6 +311,7 @@ aboutMisskey: "Misskeyについて"
 aboutMisskeyText: "Misskeyはsyuiloによって2014年から開発されている、オープンソースのソフトウェアです。"
 misskeyMembers: "現在以下のメンバーによって開発・メンテナンスされています:"
 misskeySource: "ソースコードはここで公開されています:"
+misskeyTranslation: "Misskeyの翻訳にご協力をお願いします:"
 misskeyDonate: "Misskeyに寄付をして開発をサポートできます:"
 morePatrons: "他にも多くの方が支援してくれています。ありがとうございます🥰"
 patrons: "支援者"
@@ -371,12 +356,85 @@ members: "メンバー"
 transfer: "譲渡"
 messagingWithUser: "ユーザーとチャット"
 messagingWithGroup: "グループでチャット"
+title: "タイトル"
+text: "テキスト"
 enable: "有効にする"
 next: "次"
 retype: "再入力"
 noteOf: "{user}のノート"
 inviteToGroup: "グループに招待"
 maxNoteTextLength: "ノートの文字数制限"
+quoteAttached: "引用付き"
+quoteQuestion: "引用として添付しますか？"
+noMessagesYet: "まだチャットはありません"
+newMessageExists: "新しいメッセージがあります"
+onlyOneFileCanBeAttached: "メッセージに添付できるファイルはひとつです"
+signinRequired: "ログインしてください"
+invitationCode: "招待コード"
+checking: "確認しています"
+available: "利用できます"
+unavailable: "利用できません"
+usernameInvalidFormat: "a~z、A~Z、0~9、_が使えます"
+tooShort: "短すぎます"
+tooLong: "長すぎます"
+weakPassword: "弱いパスワード"
+normalPassword: "普通のパスワード"
+strongPassword: "強いパスワード"
+passwordMatched: "一致しました"
+passwordNotMatched: "一致していません"
+signinWith: "{x}でログイン"
+tapSecurityKey: "セキュリティーキーにタッチ"
+or: "もしくは"
+uiLanguage: "UIの表示言語"
+groupInvited: "グループに招待されました"
+aboutX: "{x}について"
+useOsNativeEmojis: "OSネイティブの絵文字を使用"
+noGroups: "グループがありません"
+joinOrCreateGroup: "既存のグループに招待してもらうか、新しくグループを作成してください。"
+noHistory: "履歴はありません"
+disableAnimatedMfm: "動きのあるMFMを無効にする"
+doing: "やっています"
+category: "カテゴリ"
+tags: "タグ"
+docSource: "このドキュメントのソース"
+createAccount: "アカウントを作成"
+existingAcount: "既存のアカウント"
+regenerate: "再生成"
+fontSize: "フォントサイズ"
+noFollowRequests: "フォロー申請はありません"
+openImageInNewTab: "画像を新しいタブで開く"
+dashboard: "ダッシュボード"
+local: "ローカル"
+remote: "リモート"
+total: "合計"
+weekOverWeekChanges: "前週比"
+dayOverDayChanges: "前日比"
+accessibility: "アクセシビリティ"
+clinetSettings: "クライアント設定"
+accountSettings: "アカウント設定"
+promotion: "プロモーション"
+promote: "プロモート"
+numberOfDays: "日数"
+hideThisNote: "このノートを非表示"
+showFeaturedNotesInTimeline: "タイムラインにおすすめのノートを表示する"
+
+_ago:
+  unknown: "謎"
+  future: "未来"
+  justNow: "たった今"
+  secondsAgo: "{n}秒前"
+  minutesAgo: "{n}分前"
+  hoursAgo: "{n}時間前"
+  daysAgo: "{n}日前"
+  weeksAgo: "{n}週間前"
+  monthsAgo: "{n}ヶ月前"
+  yearsAgo: "{n}年前"
+
+_time:
+  second: "秒"
+  minute: "分"
+  hour: "時間"
+  day: "日"
 
 _tutorial:
   title: "Misskeyの使い方"
@@ -449,6 +507,7 @@ _antennaSources:
   homeTimeline: "フォローしているユーザーのノート"
   users: "指定した一人または複数のユーザーのノート"
   userList: "指定したリストのユーザーのノート"
+  userGroup: "指定したグループのユーザーのノート"
 
 _weekday:
   sunday: "日曜日"
@@ -467,6 +526,8 @@ _widgets:
   trends: "トレンド"
   clock: "時計"
   rss: "RSSリーダー"
+  activity: "アクティビティ"
+  photos: "フォト"
 
 _cw:
   hide: "隠す"

locales/ja-KS.yml

@@ -1,20 +1,5 @@
 ---
-_ago:
-  unknown: "謎"
-  future: "未来"
-  justNow: "たった今"
-  secondsAgo: "{n}秒前"
-  minutesAgo: "{n}分前"
-  hoursAgo: "{n}時間前"
-  daysAgo: "{n}日前"
-  weeksAgo: "{n}週間前"
-  monthsAgo: "{n}ヶ月前"
-  yearsAgo: "{n}年前"
-_time:
-  second: "秒"
-  minute: "分"
-  hour: "時間"
-  day: "日"
+_lang_: "日本語 (関西弁)"
 introMisskey: "ようこそ！Misskeyは、オープンソースの分散型マイクロブログサービスやねん。\n「ノート」を作成しぃ、いま起こっとることを共有したり、あんたについて皆に発信しよう📡\n「リアクション」機能で、皆のノートに素はよ反応を追加することもできます✌\n新しい世界を探検しよう🚀"
 monthAndDay: "{month}月 {day}日"
 search: "探す"
@@ -124,6 +109,22 @@ aboutMisskey: "Misskeyってなんや？"
 notFoundDescription: "指定されたURLに該当するページはあらへんやった。"
 close: "さいなら"
 joinedGroups: "参加しとるグループ"
+_ago:
+  unknown: "謎"
+  future: "未来"
+  justNow: "たった今"
+  secondsAgo: "{n}秒前"
+  minutesAgo: "{n}分前"
+  hoursAgo: "{n}時間前"
+  daysAgo: "{n}日前"
+  weeksAgo: "{n}週間前"
+  monthsAgo: "{n}ヶ月前"
+  yearsAgo: "{n}年前"
+_time:
+  second: "秒"
+  minute: "分"
+  hour: "時間"
+  day: "日"
 _2fa:
   alreadyRegistered: "もう設定終わっとるわ"
 _auth:

locales/kn-IN.yml

@@ -0,0 +1,31 @@
+---
+_lang_: "ಕನ್ನಡ"
+introMisskey: "ಸ್ವಾಗತ! Misskey ಓಪನ್ ಸೋರ್ಸ್ ಒಕ್ಕೂಟ ಮೈಕ್ರೋಬ್ಲಾಗಿಂಗ್ ಸೇವೆಯಾಗಿದೆ.\n ಏನಾಗುತ್ತಿದೆ ಎಂಬುದನ್ನು ಹಂಚಿಕೊಳ್ಳಲು ಅಥವಾ ನಿಮ್ಮ ಬಗ್ಗೆ ಎಲ್ಲರಿಗೂ ಹೇಳಲು \"ಟಿಪ್ಪಣಿ\"ಗಳನ್ನು ರಚಿಸಿ📡\n \"ಸ್ಪಂದನೆ\" ಕ್ರಿಯೆಯೊಂದಿಗೆ, ನೀವು ಎಲ್ಲರ ಟಿಪ್ಪಣಿಗಳಿಗೆ ತ್ವರಿತವಾಗಿ ಸ್ಪಂದನೆಗಳನ್ನು ಕೂಡ ಸೇರಿಸಬಹುದು.👍\n ಹೊಸ ಜಗತ್ತನ್ನು ಅನ್ವೇಷಿಸಿ🚀"
+monthAndDay: "{month}ನೇ ತಿಂಗಳ {day}ನೇ ದಿನ"
+search: "ಹುಡುಕು"
+notifications: "ಅಧಿಸೂಚನೆಗಳು"
+username: "ಬಳಕೆಹೆಸರು"
+password: "ಗುಪ್ತಪದ"
+fetchingAsApObject: "ಒಕ್ಕೂಟದಿಂದ ಪಡೆಯಲಾಗುತ್ತಿದೆ..."
+ok: "ಸರಿ"
+gotIt: "ಅರ್ಥವಾಯಿತು!"
+cancel: "ರದ್ದು"
+enterUsername: "ಬಳಕೆಹೆಸರನ್ನು ಭರ್ತಿ ಮಾಡಿ"
+renotedBy: "{user} ಪುನರಾವರ್ತಿಸಿದರು"
+noNotes: "ಟಿಪ್ಪಣಿಗಳಿಲ್ಲ"
+noNotifications: "ಅಧಿಸೂಚನೆಗಳಿಲ್ಲ"
+instance: "ನಿದರ್ಶನ"
+settings: "ಸಿದ್ಧತೆಗಳು"
+profile: "ಪ್ರೊಫೈಲು"
+timeline: "ಸಮಯಸಾಲು"
+noAccountDescription: "ಇವರು ಸ್ವಯಂ ಪರಿಚಯ ರಚಿಸಿಲ್ಲ"
+login: "ಪ್ರವೇಶ"
+loggingIn: "ಪ್ರವೇಶಿಸುತ್ತಾ..."
+logout: "ಆಚೆಗೆ"
+signup: "ನೋಂದಣಿ"
+instances: "ನಿದರ್ಶನ"
+_widgets:
+  notifications: "ಅಧಿಸೂಚನೆಗಳು"
+  timeline: "ಸಮಯಸಾಲು"
+_profile:
+  username: "ಬಳಕೆಹೆಸರು"

locales/ko-KR.yml

@@ -1,20 +1,5 @@
 ---
-_ago:
-  unknown: "알 수 없음"
-  future: "미래"
-  justNow: "방금 전"
-  secondsAgo: "{n}초 전"
-  minutesAgo: "{n}분 전"
-  hoursAgo: "{n}시간 전"
-  daysAgo: "{n}일 전"
-  weeksAgo: "{n}주 전"
-  monthsAgo: "{n}개월 전"
-  yearsAgo: "{n}년 전"
-_time:
-  second: "초"
-  minute: "분"
-  hour: "시간"
-  day: "일"
+_lang_: "한국어"
 introMisskey: "환영합니다! Misskey 는 오픈 소스 분산형 마이크로 블로그 서비스입니다.\n\"노트\" 를 작성해서, 지금 일어나고 있는 일을 공유하거나, 당신만의 이야기를 모두에게 발신하세요📡\n\"리액션\" 기능으로, 친구의 노트에 총알같이 반응을 추가할 수도 있습니다👍\n새로운 세계를 탐험해 보세요🚀"
 monthAndDay: "{month}월 {day}일"
 search: "검색"
@@ -121,8 +106,8 @@ customEmojis: "커스텀 이모지"
 emojiName: "이모지 이름"
 emojiUrl: "이모지 URL"
 addEmoji: "이모지 추가"
-cacheRemoteFiles: "원격 파일을 캐시"
-cacheRemoteFilesDescription: "이 설정을 해지하면 원격 파일을 캐시하지 않고 해당 파일을 직접 링크하게 됩니다. 그에 따라 서버의 저장 공간을 절약할 수 있지만, 썸네일이 생성되지 않기 때문에 통신량이 증가합니다."
+cacheRemoteFiles: "리모트 파일을 캐시"
+cacheRemoteFilesDescription: "이 설정을 해지하면 리모트 파일을 캐시하지 않고 해당 파일을 직접 링크하게 됩니다. 그에 따라 서버의 저장 공간을 절약할 수 있지만, 썸네일이 생성되지 않기 때문에 통신량이 증가합니다."
 flagAsBot: "나는 봇입니다"
 flagAsCat: "나는 고양이다냥"
 autoAcceptFollowed: "팔로우 중인 유저로부터의 팔로우 요청을 자동 수락"
@@ -169,7 +154,7 @@ clearQueue: "대기열 비우기"
 clearQueueConfirmTitle: "대기열을 비우시겠습니까?"
 clearQueueConfirmText: "대기열에 남아 있는 노트는 더이상 연합되지 않습니다. 보통의 경우 이 작업은 필요하지 않습니다."
 clearCachedFiles: "캐시 비우기"
-clearCachedFilesConfirm: "캐시된 원격 파일을 모두 삭제하시겠습니까?"
+clearCachedFilesConfirm: "캐시된 리모트 파일을 모두 삭제하시겠습니까?"
 blockedInstances: "차단된 인스턴스"
 blockedInstancesDescription: "차단하려는 인스턴스의 호스트 이름을 줄바꿈으로 구분하여 설정합니다. 차단된 인스턴스는 이 인스턴스와 통신할 수 없게 됩니다."
 muteAndBlock: "뮤트 및 차단"
@@ -268,7 +253,7 @@ thisYear: "올해"
 thisMonth: "이번 달"
 today: "오늘"
 dayX: "{day}일"
-monthX: "{month}개월"
+monthX: "{month}월"
 yearX: "{year}년"
 pages: "페이지"
 integration: "연동"
@@ -280,8 +265,8 @@ disablingTimelinesInfo: "특정 타임라인을 비활성화하더라도 관리
 registration: "등록"
 enableRegistration: "신규 회원가입을 활성화"
 invite: "초대"
-proxyRemoteFiles: "원격 파일 프록시"
-proxyRemoteFilesDescription: "이 설정을 활성화할 경우, 저장되지 않았거나 저장용량 초과로 삭제된 원격 파일을 로컬에서 프록시하여 썸네일을 생성하게 됩니다. 서버의 스토리지에는 영향을 주지 않습니다."
+proxyRemoteFiles: "리모트 파일 프록시"
+proxyRemoteFilesDescription: "이 설정을 활성화할 경우, 저장되지 않았거나 저장용량 초과로 삭제된 리모트 파일을 로컬에서 프록시하여 썸네일을 생성하게 됩니다. 서버의 스토리지에는 영향을 주지 않습니다."
 driveCapacityPerLocalAccount: "로컬 유저 한 명당 드라이브 용량"
 driveCapacityPerRemoteAccount: "리모트 유저 한 명당 드라이브 용량"
 inMb: "메가바이트 단위"
@@ -323,9 +308,10 @@ popularTags: "인기 태그"
 userList: "리스트"
 about: "정보"
 aboutMisskey: "Misskey에 대하여"
-aboutMisskeyText: "Misskey는 syuilo에 의해 2014년부터 개발된 오픈 소스 소프트웨어입니다."
-misskeyMembers: "현재는 아래 멤버들에 의해 개발 및 유지보수 되고 있습니다."
-misskeySource: "소스 코드는 여기에서 보실 수 있습니다:"
+aboutMisskeyText: "Misskey는 syuilo에 의해서 2014년부터 개발되어 온 오픈소스 소프트웨어 입니다."
+misskeyMembers: "현재는 아래 멤버들에 의해 개발 및 유지보수 되고 있습니다:"
+misskeySource: "소스코드는 여기에 공개되어 있습니다:"
+misskeyTranslation: "Misskey의 번역을 함께해 주시길 부탁드립니다:"
 misskeyDonate: "Misskey에 기부하심으로써 개발에 도움을 주실 수 있습니다:"
 morePatrons: "이 외에도 다른 많은 분들이 도움을 주시고 계십니다. 감사합니다🥰"
 patrons: "후원자들"
@@ -370,12 +356,78 @@ members: "멤버"
 transfer: "양도"
 messagingWithUser: "유저와 대화하기"
 messagingWithGroup: "그룹끼리 대화하기"
+title: "제목"
+text: "텍스트"
 enable: "사용"
 next: "다음"
 retype: "다시 입력"
 noteOf: "{user}의 노트"
 inviteToGroup: "그룹에 초대하기"
 maxNoteTextLength: "노트의 문자 수 제한"
+quoteAttached: "인용함"
+quoteQuestion: "인용해서 작성하시겠습니까?"
+noMessagesYet: "아직 대화가 없습니다"
+newMessageExists: "새 메시지가 있습니다"
+onlyOneFileCanBeAttached: "메시지에 첨부할 수 있는 파일은 하나까지입니다"
+signinRequired: "로그인 해주세요"
+invitationCode: "초대 코드"
+checking: "확인하는 중입니다"
+available: "사용 가능합니다"
+unavailable: "사용할 수 없습니다"
+usernameInvalidFormat: "a~z, A~Z, 0-9, _를 사용할 수 있습니다"
+tooShort: "너무 짧습니다"
+tooLong: "너무 깁니다"
+weakPassword: "약한 비밀번호"
+normalPassword: "좋은 비밀번호"
+strongPassword: "강한 비밀번호"
+passwordMatched: "일치합니다"
+passwordNotMatched: "일치하지 않습니다"
+signinWith: "{x}로 로그인"
+tapSecurityKey: "보안 키를 터치"
+or: "혹은"
+uiLanguage: "UI 표시 언어"
+groupInvited: "그룹에 초대되었습니다"
+aboutX: "{x}에 대하여"
+useOsNativeEmojis: "OS 기본 이모지를 사용"
+noGroups: "그룹이 없습니다"
+joinOrCreateGroup: "다른 그룹의 초대를 받거나, 직접 새 그룹을 만들어 보세요."
+noHistory: "기록이 없습니다"
+disableAnimatedMfm: "움직임이 있는 MFM을 비활성화"
+doing: "잠시만요"
+category: "카테고리"
+tags: "태그"
+docSource: "이 문서의 소스"
+createAccount: "계정 만들기"
+existingAcount: "기존 계정"
+regenerate: "다시 생성"
+fontSize: "글자 크기"
+noFollowRequests: "처리되지 않은 팔로우 요청이 없습니다"
+openImageInNewTab: "새 탭에서 이미지 열기"
+dashboard: "대시보드"
+local: "로컬"
+remote: "리모트"
+total: "합계"
+weekOverWeekChanges: "지난주보다"
+dayOverDayChanges: "어제보다"
+accessibility: "접근성"
+clinetSettings: "클라이언트 설정"
+accountSettings: "계정 설정"
+_ago:
+  unknown: "알 수 없음"
+  future: "미래"
+  justNow: "방금 전"
+  secondsAgo: "{n}초 전"
+  minutesAgo: "{n}분 전"
+  hoursAgo: "{n}시간 전"
+  daysAgo: "{n}일 전"
+  weeksAgo: "{n}주 전"
+  monthsAgo: "{n}개월 전"
+  yearsAgo: "{n}년 전"
+_time:
+  second: "초"
+  minute: "분"
+  hour: "시간"
+  day: "일"
 _tutorial:
   title: "Misskey의 사용 방법"
   step1_1: "환영합니다!"
@@ -407,7 +459,7 @@ _2fa:
   step2: "그 후, 표시되어 있는 QR코드를 앱으로 스캔합니다."
   step3: "앱에 표시된 토큰을 입력하시면 완료됩니다."
   step4: "다음 로그인부터는 토큰을 입력해야 합니다."
-  securityKeyInfo: "FIDO2를 지원하는 하드웨어 시큐리티 키 혹은 휴대전화의 지문인식이나 화면잠금 PIN을 이용해서 로그인하도록 설정할 수 있습니다."
+  securityKeyInfo: "FIDO2를 지원하는 하드웨어 보안 키 혹은 디바이스의 지문인식이나 화면잠금 PIN을 이용해서 로그인하도록 설정할 수 있습니다."
 _permissions:
   "read:account": "계정의 정보를 봅니다"
   "write:account": "계정의 정보를 변경합니다"
@@ -443,6 +495,7 @@ _antennaSources:
   homeTimeline: "팔로우중인 유저의 노트"
   users: "지정한 한 명 혹은 여러 명의 유저의 노트"
   userList: "지정한 리스트에 속한 유저의 노트"
+  userGroup: "지정한 그룹에 속한 유저의 노트"
 _weekday:
   sunday: "일요일"
   monday: "월요일"
@@ -459,6 +512,7 @@ _widgets:
   trends: "트렌드"
   clock: "시계"
   rss: "RSS 리더"
+  activity: "활동"
 _cw:
   hide: "숨기기"
   show: "더 보기"

locales/nl-NL.yml

@@ -1 +1,2 @@
 ---
+_lang_: "Nederlands"

locales/no-NO.yml

@@ -1 +1,2 @@
 ---
+_lang_: "Norsk Bokmål"

locales/pl-PL.yml

@@ -1 +1,2 @@
 ---
+_lang_: "język polski"

locales/pt-PT.yml

@@ -1 +1,2 @@
 ---
+_lang_: "Português"

locales/ru-RU.yml

@@ -1 +1,2 @@
 ---
+_lang_: "Русский язык"

locales/zh-CN.yml

@@ -1,20 +1,5 @@
 ---
-_ago:
-  unknown: "未知"
-  future: "未来"
-  justNow: "最近"
-  secondsAgo: "{n}秒前"
-  minutesAgo: "{n}分前"
-  hoursAgo: "{n}小时前"
-  daysAgo: "{n}日前"
-  weeksAgo: "{n}周前"
-  monthsAgo: "{n}月前"
-  yearsAgo: "{n}年前"
-_time:
-  second: "秒"
-  minute: "分"
-  hour: "小时"
-  day: "日"
+_lang_: "中文(简体)"
 introMisskey: "欢迎！Misskey是一个开源的分散型SNS服务。\n通过「帖子」来分享现在发生的事情吧！📡\n「反应」功能，可以让你快速的对大家的「帖子」来表达感情👍\n一起来探索新的世界吧！🚀"
 monthAndDay: "{month}月 {day}日"
 search: "搜索"
@@ -136,18 +121,23 @@ searchWith: "搜索:{q}"
 youHaveNoLists: "列表为空"
 followConfirm: "你确定要关注{name}吗？"
 proxyAccount: "代理账户"
+proxyAccountDescription: "代理帐户是在某些情况下充当用户的远程关注者的帐户。 例如，当一个用户列出一个远程用户时，如果没有人跟随该列出的用户，则该活动将不会传递到该实例，因此将代之以代理帐户。"
 host: "主机名"
 selectUser: "选择用户"
 recipient: "收件人"
 annotation: "注解"
 federation: "联合"
 instances: "实例"
+registeredAt: "初次观察"
 latestRequestSentAt: "上次发送的请求"
 latestRequestReceivedAt: "上次收到的请求"
+latestStatus: "最后状态"
 storageUsage: "已用存储"
 charts: "图表"
 perHour: "每小时"
 perDay: "每天"
+stopActivityDelivery: "停止发送活动"
+blockThisInstance: "阻止此实例"
 operations: "操作"
 software: "软件"
 version: "版本"
@@ -162,6 +152,7 @@ instanceInfo: "实例情报"
 statistics: "统计"
 clearQueue: "清除队列"
 clearQueueConfirmTitle: "确定清除队列？"
+clearQueueConfirmText: "未送达的帖子将不会送达。 通常，您不需要这样做。"
 clearCachedFiles: "清除缓存"
 clearCachedFilesConfirm: "确定要清除缓存文件？"
 blockedInstances: "被阻拦的实例"
@@ -288,6 +279,7 @@ recaptcha: "reCAPTCHA"
 enableRecaptcha: "启用 reCAPTCHA\n(请注意, 此功能在中国大陆不可用. 如果启用, 可能导致无法正常使用登录或注册等功能)"
 recaptchaSiteKey: "网站密钥"
 recaptchaSecretKey: "reCAPTCHA 密钥"
+antennas: "天线"
 name: "名称"
 antennaKeywordsDescription: "使用空格分隔会产生AND规范，并且使用换行符分隔会产生OR规范"
 serviceworker: "ServiceWorker"
@@ -312,6 +304,7 @@ aboutMisskey: "关于 Misskey"
 aboutMisskeyText: "Misskey是由syuilo于2014年开发的开放源代码软件。"
 misskeyMembers: "现在由以下成员进行开发和维护："
 misskeySource: "源代码在这里公开："
+misskeyTranslation: "与我们一同进行Misskey的翻译工作："
 misskeyDonate: "可以向 Misskey 进行捐款以支持开发："
 morePatrons: "还有很多其他的人也在支持我们，非常感谢🥰"
 patrons: "支持者"
@@ -350,15 +343,78 @@ invites: "邀请"
 groupName: "群组名"
 members: "成员"
 transfer: "转让"
+title: "标题"
+text: "文本"
 enable: "启用"
 next: "下一个"
 retype: "重新输入"
 noteOf: "{user}的帖子"
 inviteToGroup: "群组邀请"
 maxNoteTextLength: "帖子的字数限制"
+quoteAttached: "已引用"
+quoteQuestion: "是否将其作为引用附上？"
+newMessageExists: "新信息"
+onlyOneFileCanBeAttached: "只能添加一个附件"
+signinRequired: "请先登录"
+invitationCode: "邀请码"
+checking: "正在确认"
+available: "可用"
+unavailable: "不可用"
+usernameInvalidFormat: "可使用大小写英文字母、数字和下划线。"
+tooShort: "过短"
+tooLong: "过长"
+weakPassword: "密码强度：弱"
+normalPassword: "密码强度：中等"
+strongPassword: "密码强度：强"
+passwordMatched: "密码一致"
+passwordNotMatched: "密码不一致"
+or: "或者"
+uiLanguage: "显示语言"
+groupInvited: "群组招待"
+aboutX: "关于 {x}"
+useOsNativeEmojis: "使用OS原生Emoji"
+noGroups: "没有组"
+joinOrCreateGroup: "加入或者创建群组"
+noHistory: "没有历史记录"
+disableAnimatedMfm: "禁用MFM动画"
+doing: "正在进行"
+category: "类别"
+tags: "标签"
+createAccount: "注册账户"
+existingAcount: "现有的帐户"
+regenerate: "重新生成"
+fontSize: "字体大小"
+noFollowRequests: "没有关注申请"
+openImageInNewTab: "在新标签页中打开图片"
+dashboard: "Dashboard"
+local: "本地"
+remote: "远程"
+total: "总计"
+weekOverWeekChanges: "与前一周相比"
+dayOverDayChanges: "与前一日相比"
+accessibility: "辅助功能"
+clinetSettings: "客户端设置"
+accountSettings: "账户设置"
+_ago:
+  unknown: "未知"
+  future: "未来"
+  justNow: "最近"
+  secondsAgo: "{n}秒前"
+  minutesAgo: "{n}分前"
+  hoursAgo: "{n}小时前"
+  daysAgo: "{n}日前"
+  weeksAgo: "{n}周前"
+  monthsAgo: "{n}月前"
+  yearsAgo: "{n}年前"
+_time:
+  second: "秒"
+  minute: "分"
+  hour: "小时"
+  day: "日"
 _tutorial:
   title: "Misskey的使用方法"
   step1_1: "欢迎！"
+  step7_3: "接下来，享受Misskey带来的乐趣吧🚀"
 _2fa:
   alreadyRegistered: "此设备已被注册"
   registerDevice: "注册设备"
@@ -389,6 +445,8 @@ _permissions:
   "write:user-groups": "操作用户组"
 _auth:
   permissionAsk: "这个应用程序需要以下权限"
+_antennaSources:
+  all: "所有帖子"
 _weekday:
   sunday: "星期日"
   monday: "星期一"
@@ -405,6 +463,7 @@ _widgets:
   trends: "趋势"
   clock: "时钟"
   rss: "RSS阅读器"
+  activity: "活动"
 _cw:
   hide: "隐藏"
   show: "查看更多"
@@ -436,13 +495,27 @@ _poll:
 _visibility:
   public: "公开"
   home: "首页"
+  homeDescription: "仅发送至首页的时间线"
   followers: "关注者"
+  followersDescription: "仅发送至关注者"
   specified: "指定用户"
+  specifiedDescription: "仅发送至指定用户"
   localOnly: "仅限本地"
+_postForm:
+  replyPlaceholder: "回复这个帖子..."
+  quotePlaceholder: "引用这个帖子..."
+  _placeholders:
+    a: "现在如何？"
+    b: "发生了什么？"
+    c: "你有什么想法？"
+    d: "你想要发布些什么吗？"
+    e: "请写下来吧"
+    f: "等待您的发布..."
 _profile:
   name: "名称"
   username: "用户名"
   description: "个人简介"
+  youCanIncludeHashtags: "您可以包含一个哈希标签。"
   metadata: "额外信息"
   metadataLabel: "标签"
   metadataContent: "内容"
@@ -464,6 +537,7 @@ _instanceCharts:
   users: "用户数量：增加/减少"
   usersTotal: "用户总数"
   notes: "帖子：增加/减少"
+  notesTotal: "帖子：总数"
   ff: "关注/被关注：数量变化"
   ffTotal: "关注/被关注：总数"
   cacheSize: "缓存大小：增加/减少"

locales/zh-TW.yml

@@ -1 +1,2 @@
 ---
+_lang_: "中文(繁体)"

migration/1581526429287-user-group-invitation.ts

@@ -0,0 +1,38 @@
+import {MigrationInterface, QueryRunner} from "typeorm";
+
+export class userGroupInvitation1581526429287 implements MigrationInterface {
+    name = 'userGroupInvitation1581526429287'
+
+    public async up(queryRunner: QueryRunner): Promise<any> {
+        await queryRunner.query(`CREATE TABLE "user_group_invitation" ("id" character varying(32) NOT NULL, "createdAt" TIMESTAMP WITH TIME ZONE NOT NULL, "userId" character varying(32) NOT NULL, "userGroupId" character varying(32) NOT NULL, CONSTRAINT "PK_160c63ec02bf23f6a5c5e8140d6" PRIMARY KEY ("id"))`, undefined);
+        await queryRunner.query(`CREATE INDEX "IDX_bfbc6305547539369fe73eb144" ON "user_group_invitation" ("userId") `, undefined);
+        await queryRunner.query(`CREATE INDEX "IDX_5cc8c468090e129857e9fecce5" ON "user_group_invitation" ("userGroupId") `, undefined);
+        await queryRunner.query(`CREATE UNIQUE INDEX "IDX_e9793f65f504e5a31fbaedbf2f" ON "user_group_invitation" ("userId", "userGroupId") `, undefined);
+        await queryRunner.query(`ALTER TABLE "notification" ADD "userGroupInvitationId" character varying(32)`, undefined);
+        await queryRunner.query(`ALTER TYPE "public"."notification_type_enum" RENAME TO "notification_type_enum_old"`, undefined);
+        await queryRunner.query(`CREATE TYPE "notification_type_enum" AS ENUM('follow', 'mention', 'reply', 'renote', 'quote', 'reaction', 'pollVote', 'receiveFollowRequest', 'followRequestAccepted', 'groupInvited')`, undefined);
+        await queryRunner.query(`ALTER TABLE "notification" ALTER COLUMN "type" TYPE "notification_type_enum" USING "type"::"text"::"notification_type_enum"`, undefined);
+        await queryRunner.query(`DROP TYPE "notification_type_enum_old"`, undefined);
+        await queryRunner.query(`COMMENT ON COLUMN "notification"."type" IS 'The type of the Notification.'`, undefined);
+        await queryRunner.query(`ALTER TABLE "user_group_invitation" ADD CONSTRAINT "FK_bfbc6305547539369fe73eb144a" FOREIGN KEY ("userId") REFERENCES "user"("id") ON DELETE CASCADE ON UPDATE NO ACTION`, undefined);
+        await queryRunner.query(`ALTER TABLE "user_group_invitation" ADD CONSTRAINT "FK_5cc8c468090e129857e9fecce5a" FOREIGN KEY ("userGroupId") REFERENCES "user_group"("id") ON DELETE CASCADE ON UPDATE NO ACTION`, undefined);
+        await queryRunner.query(`ALTER TABLE "notification" ADD CONSTRAINT "FK_8fe87814e978053a53b1beb7e98" FOREIGN KEY ("userGroupInvitationId") REFERENCES "user_group_invitation"("id") ON DELETE CASCADE ON UPDATE NO ACTION`, undefined);
+    }
+
+    public async down(queryRunner: QueryRunner): Promise<any> {
+        await queryRunner.query(`ALTER TABLE "notification" DROP CONSTRAINT "FK_8fe87814e978053a53b1beb7e98"`, undefined);
+        await queryRunner.query(`ALTER TABLE "user_group_invitation" DROP CONSTRAINT "FK_5cc8c468090e129857e9fecce5a"`, undefined);
+        await queryRunner.query(`ALTER TABLE "user_group_invitation" DROP CONSTRAINT "FK_bfbc6305547539369fe73eb144a"`, undefined);
+        await queryRunner.query(`COMMENT ON COLUMN "notification"."type" IS ''`, undefined);
+        await queryRunner.query(`CREATE TYPE "notification_type_enum_old" AS ENUM('follow', 'mention', 'reply', 'renote', 'quote', 'reaction', 'pollVote', 'receiveFollowRequest', 'followRequestAccepted')`, undefined);
+        await queryRunner.query(`ALTER TABLE "notification" ALTER COLUMN "type" TYPE "notification_type_enum_old" USING "type"::"text"::"notification_type_enum_old"`, undefined);
+        await queryRunner.query(`DROP TYPE "notification_type_enum"`, undefined);
+        await queryRunner.query(`ALTER TYPE "notification_type_enum_old" RENAME TO  "notification_type_enum"`, undefined);
+        await queryRunner.query(`ALTER TABLE "notification" DROP COLUMN "userGroupInvitationId"`, undefined);
+        await queryRunner.query(`DROP INDEX "IDX_e9793f65f504e5a31fbaedbf2f"`, undefined);
+        await queryRunner.query(`DROP INDEX "IDX_5cc8c468090e129857e9fecce5"`, undefined);
+        await queryRunner.query(`DROP INDEX "IDX_bfbc6305547539369fe73eb144"`, undefined);
+        await queryRunner.query(`DROP TABLE "user_group_invitation"`, undefined);
+    }
+
+}

migration/1581695816408-user-group-antenna.ts

@@ -0,0 +1,28 @@
+import {MigrationInterface, QueryRunner} from "typeorm";
+
+export class userGroupAntenna1581695816408 implements MigrationInterface {
+    name = 'userGroupAntenna1581695816408'
+
+    public async up(queryRunner: QueryRunner): Promise<any> {
+        await queryRunner.query(`ALTER TABLE "antenna" ADD "userGroupJoiningId" character varying(32)`, undefined);
+        await queryRunner.query(`ALTER TYPE "public"."antenna_src_enum" RENAME TO "antenna_src_enum_old"`, undefined);
+        await queryRunner.query(`CREATE TYPE "antenna_src_enum" AS ENUM('home', 'all', 'users', 'list', 'group')`, undefined);
+        await queryRunner.query(`ALTER TABLE "antenna" ALTER COLUMN "src" TYPE "antenna_src_enum" USING "src"::"text"::"antenna_src_enum"`, undefined);
+        await queryRunner.query(`DROP TYPE "antenna_src_enum_old"`, undefined);
+        await queryRunner.query(`ALTER TABLE "antenna" DROP COLUMN "users"`, undefined);
+        await queryRunner.query(`ALTER TABLE "antenna" ADD "users" character varying(1024) array NOT NULL DEFAULT '{}'::varchar[]`, undefined);
+        await queryRunner.query(`ALTER TABLE "antenna" ADD CONSTRAINT "FK_ccbf5a8c0be4511133dcc50ddeb" FOREIGN KEY ("userGroupJoiningId") REFERENCES "user_group_joining"("id") ON DELETE CASCADE ON UPDATE NO ACTION`, undefined);
+    }
+
+    public async down(queryRunner: QueryRunner): Promise<any> {
+        await queryRunner.query(`ALTER TABLE "antenna" DROP CONSTRAINT "FK_ccbf5a8c0be4511133dcc50ddeb"`, undefined);
+        await queryRunner.query(`ALTER TABLE "antenna" DROP COLUMN "users"`, undefined);
+        await queryRunner.query(`ALTER TABLE "antenna" ADD "users" character varying array NOT NULL DEFAULT '{}'`, undefined);
+        await queryRunner.query(`CREATE TYPE "antenna_src_enum_old" AS ENUM('home', 'all', 'users', 'list')`, undefined);
+        await queryRunner.query(`ALTER TABLE "antenna" ALTER COLUMN "src" TYPE "antenna_src_enum_old" USING "src"::"text"::"antenna_src_enum_old"`, undefined);
+        await queryRunner.query(`DROP TYPE "antenna_src_enum"`, undefined);
+        await queryRunner.query(`ALTER TYPE "antenna_src_enum_old" RENAME TO  "antenna_src_enum"`, undefined);
+        await queryRunner.query(`ALTER TABLE "antenna" DROP COLUMN "userGroupJoiningId"`, undefined);
+    }
+
+}

migration/1581708415836-drive-user-folder-id-index.ts

@@ -0,0 +1,14 @@
+import {MigrationInterface, QueryRunner} from "typeorm";
+
+export class driveUserFolderIdIndex1581708415836 implements MigrationInterface {
+    name = 'driveUserFolderIdIndex1581708415836'
+
+    public async up(queryRunner: QueryRunner): Promise<any> {
+        await queryRunner.query(`CREATE INDEX "IDX_55720b33a61a7c806a8215b825" ON "drive_file" ("userId", "folderId", "id") `, undefined);
+    }
+
+    public async down(queryRunner: QueryRunner): Promise<any> {
+        await queryRunner.query(`DROP INDEX "IDX_55720b33a61a7c806a8215b825"`, undefined);
+    }
+
+}

migration/1581979837262-promo.ts

@@ -0,0 +1,28 @@
+import {MigrationInterface, QueryRunner} from "typeorm";
+
+export class promo1581979837262 implements MigrationInterface {
+    name = 'promo1581979837262'
+
+    public async up(queryRunner: QueryRunner): Promise<any> {
+        await queryRunner.query(`CREATE TABLE "promo_note" ("noteId" character varying(32) NOT NULL, "expiresAt" TIMESTAMP WITH TIME ZONE NOT NULL, "userId" character varying(32) NOT NULL, CONSTRAINT "REL_e263909ca4fe5d57f8d4230dd5" UNIQUE ("noteId"), CONSTRAINT "PK_e263909ca4fe5d57f8d4230dd5c" PRIMARY KEY ("noteId"))`, undefined);
+        await queryRunner.query(`CREATE INDEX "IDX_83f0862e9bae44af52ced7099e" ON "promo_note" ("userId") `, undefined);
+        await queryRunner.query(`CREATE TABLE "promo_read" ("id" character varying(32) NOT NULL, "createdAt" TIMESTAMP WITH TIME ZONE NOT NULL, "userId" character varying(32) NOT NULL, "noteId" character varying(32) NOT NULL, CONSTRAINT "PK_61917c1541002422b703318b7c9" PRIMARY KEY ("id"))`, undefined);
+        await queryRunner.query(`CREATE INDEX "IDX_9657d55550c3d37bfafaf7d4b0" ON "promo_read" ("userId") `, undefined);
+        await queryRunner.query(`CREATE UNIQUE INDEX "IDX_2882b8a1a07c7d281a98b6db16" ON "promo_read" ("userId", "noteId") `, undefined);
+        await queryRunner.query(`ALTER TABLE "promo_note" ADD CONSTRAINT "FK_e263909ca4fe5d57f8d4230dd5c" FOREIGN KEY ("noteId") REFERENCES "note"("id") ON DELETE CASCADE ON UPDATE NO ACTION`, undefined);
+        await queryRunner.query(`ALTER TABLE "promo_read" ADD CONSTRAINT "FK_9657d55550c3d37bfafaf7d4b05" FOREIGN KEY ("userId") REFERENCES "user"("id") ON DELETE CASCADE ON UPDATE NO ACTION`, undefined);
+        await queryRunner.query(`ALTER TABLE "promo_read" ADD CONSTRAINT "FK_a46a1a603ecee695d7db26da5f4" FOREIGN KEY ("noteId") REFERENCES "note"("id") ON DELETE CASCADE ON UPDATE NO ACTION`, undefined);
+    }
+
+    public async down(queryRunner: QueryRunner): Promise<any> {
+        await queryRunner.query(`ALTER TABLE "promo_read" DROP CONSTRAINT "FK_a46a1a603ecee695d7db26da5f4"`, undefined);
+        await queryRunner.query(`ALTER TABLE "promo_read" DROP CONSTRAINT "FK_9657d55550c3d37bfafaf7d4b05"`, undefined);
+        await queryRunner.query(`ALTER TABLE "promo_note" DROP CONSTRAINT "FK_e263909ca4fe5d57f8d4230dd5c"`, undefined);
+        await queryRunner.query(`DROP INDEX "IDX_2882b8a1a07c7d281a98b6db16"`, undefined);
+        await queryRunner.query(`DROP INDEX "IDX_9657d55550c3d37bfafaf7d4b0"`, undefined);
+        await queryRunner.query(`DROP TABLE "promo_read"`, undefined);
+        await queryRunner.query(`DROP INDEX "IDX_83f0862e9bae44af52ced7099e"`, undefined);
+        await queryRunner.query(`DROP TABLE "promo_note"`, undefined);
+    }
+
+}

migration/1582019042083-featured-injecttion.ts

@@ -0,0 +1,14 @@
+import {MigrationInterface, QueryRunner} from "typeorm";
+
+export class featuredInjecttion1582019042083 implements MigrationInterface {
+    name = 'featuredInjecttion1582019042083'
+
+    public async up(queryRunner: QueryRunner): Promise<any> {
+        await queryRunner.query(`ALTER TABLE "user_profile" ADD "injectFeaturedNote" boolean NOT NULL DEFAULT true`, undefined);
+    }
+
+    public async down(queryRunner: QueryRunner): Promise<any> {
+        await queryRunner.query(`ALTER TABLE "user_profile" DROP COLUMN "injectFeaturedNote"`, undefined);
+    }
+
+}

package.json

@@ -1,7 +1,7 @@
 {
 	"name": "misskey",
 	"author": "syuilo <syuilotan@yahoo.co.jp>",
-	"version": "12.7.1",
+	"version": "12.13.0",
 	"codename": "indigo",
 	"repository": {
 		"type": "git",
@@ -30,16 +30,16 @@
 		"lodash": "^4.17.13"
 	},
 	"dependencies": {
-		"@elastic/elasticsearch": "7.5.0",
-		"@fortawesome/fontawesome-svg-core": "1.2.26",
-		"@fortawesome/free-brands-svg-icons": "5.12.0",
-		"@fortawesome/free-regular-svg-icons": "5.12.0",
-		"@fortawesome/free-solid-svg-icons": "5.12.0",
+		"@elastic/elasticsearch": "7.6.0",
+		"@fortawesome/fontawesome-svg-core": "1.2.27",
+		"@fortawesome/free-brands-svg-icons": "5.12.1",
+		"@fortawesome/free-regular-svg-icons": "5.12.1",
+		"@fortawesome/free-solid-svg-icons": "5.12.1",
 		"@fortawesome/vue-fontawesome": "0.1.9",
 		"@juggle/resize-observer": "3.0.2",
 		"@koa/cors": "3.0.0",
 		"@koa/multer": "2.0.2",
-		"@koa/router": "8.0.6",
+		"@koa/router": "8.0.8",
 		"@types/bcryptjs": "2.4.2",
 		"@types/bull": "3.12.0",
 		"@types/cbor": "5.0.0",
@@ -54,7 +54,7 @@
 		"@types/js-yaml": "3.12.2",
 		"@types/jsdom": "12.2.4",
 		"@types/katex": "0.11.0",
-		"@types/koa": "2.11.0",
+		"@types/koa": "2.11.1",
 		"@types/koa-bodyparser": "4.3.0",
 		"@types/koa-compress": "2.0.9",
 		"@types/koa-cors": "0.0.0",
@@ -69,7 +69,7 @@
 		"@types/lolex": "5.1.0",
 		"@types/markdown-it": "0.0.9",
 		"@types/mocha": "7.0.1",
-		"@types/node": "13.7.0",
+		"@types/node": "13.7.1",
 		"@types/nodemailer": "6.4.0",
 		"@types/nprogress": "0.2.0",
 		"@types/oauth": "0.9.1",
@@ -80,7 +80,7 @@
 		"@types/qrcode": "1.3.4",
 		"@types/random-seed": "0.3.3",
 		"@types/ratelimiter": "2.1.28",
-		"@types/redis": "2.8.14",
+		"@types/redis": "2.8.15",
 		"@types/rename": "1.0.1",
 		"@types/request": "2.48.4",
 		"@types/request-promise-native": "1.0.17",
@@ -95,18 +95,18 @@
 		"@types/tmp": "0.1.0",
 		"@types/uuid": "3.4.7",
 		"@types/web-push": "3.3.0",
-		"@types/webpack": "4.41.3",
+		"@types/webpack": "4.41.6",
 		"@types/webpack-stream": "3.2.10",
 		"@types/websocket": "1.0.0",
 		"@types/ws": "7.2.1",
-		"@typescript-eslint/parser": "2.18.0",
+		"@typescript-eslint/parser": "2.19.2",
 		"agentkeepalive": "4.1.0",
 		"animejs": "3.1.0",
-		"apexcharts": "3.15.3",
+		"apexcharts": "3.15.6",
 		"autobind-decorator": "2.4.0",
 		"autosize": "4.0.2",
 		"autwh": "0.1.0",
-		"aws-sdk": "2.610.0",
+		"aws-sdk": "2.617.0",
 		"bcryptjs": "2.4.3",
 		"bull": "3.12.1",
 		"cafy": "15.2.1",
@@ -115,7 +115,7 @@
 		"chalk": "3.0.0",
 		"chart.js": "2.9.3",
 		"cli-highlight": "2.1.4",
-		"commander": "4.1.0",
+		"commander": "4.1.1",
 		"content-disposition": "0.5.3",
 		"crc-32": "1.2.0",
 		"css-loader": "3.4.2",
@@ -128,7 +128,7 @@
 		"eventemitter3": "4.0.0",
 		"feed": "4.1.0",
 		"fibers": "4.0.2",
-		"file-type": "13.1.2",
+		"file-type": "14.1.2",
 		"fluent-ffmpeg": "2.1.2",
 		"glob": "7.1.6",
 		"gulp": "4.0.2",
@@ -144,12 +144,12 @@
 		"hard-source-webpack-plugin": "0.13.1",
 		"html-minifier": "4.0.0",
 		"http-signature": "1.3.1",
-		"https-proxy-agent": "4.0.0",
+		"https-proxy-agent": "5.0.0",
 		"insert-text-at-cursor": "0.3.0",
 		"is-root": "2.1.0",
 		"is-svg": "4.2.1",
 		"js-yaml": "3.13.1",
-		"jsdom": "16.0.1",
+		"jsdom": "16.1.0",
 		"json5": "2.1.1",
 		"json5-loader": "3.0.0",
 		"jsrsasign": "8.0.12",
@@ -198,16 +198,16 @@
 		"randomcolor": "0.5.4",
 		"ratelimiter": "3.4.0",
 		"recaptcha-promise": "0.1.3",
-		"reconnecting-websocket": "4.3.0",
-		"redis": "2.8.0",
+		"reconnecting-websocket": "4.4.0",
+		"redis": "3.0.2",
 		"redis-lock": "0.1.4",
 		"reflect-metadata": "0.1.13",
 		"rename": "1.0.4",
-		"request": "2.88.0",
+		"request": "2.88.2",
 		"request-promise-native": "1.0.8",
 		"request-stats": "3.0.0",
 		"require-all": "3.0.0",
-		"rimraf": "3.0.1",
+		"rimraf": "3.0.2",
 		"rndstr": "1.0.0",
 		"s-age": "1.1.2",
 		"sass": "1.25.0",
@@ -221,7 +221,7 @@
 		"style-loader": "1.1.3",
 		"summaly": "2.3.1",
 		"syslog-pro": "1.0.0",
-		"systeminformation": "4.21.1",
+		"systeminformation": "4.21.2",
 		"syuilo-password-strength": "0.0.1",
 		"terser-webpack-plugin": "2.3.4",
 		"textarea-caret": "3.1.0",
@@ -245,7 +245,7 @@
 		"vue-cropperjs": "4.0.1",
 		"vue-i18n": "8.15.3",
 		"vue-json-pretty": "1.6.3",
-		"vue-loader": "15.8.3",
+		"vue-loader": "15.9.0",
 		"vue-marquee-text-component": "1.1.1",
 		"vue-meta": "2.3.2",
 		"vue-prism-component": "1.1.1",
@@ -256,10 +256,10 @@
 		"vue-template-compiler": "2.6.11",
 		"vuedraggable": "2.23.2",
 		"vuex": "3.1.2",
-		"vuex-persistedstate": "2.7.0",
+		"vuex-persistedstate": "2.7.1",
 		"web-push": "3.4.3",
-		"webpack": "4.41.5",
-		"webpack-cli": "3.3.10",
+		"webpack": "4.41.6",
+		"webpack-cli": "3.3.11",
 		"websocket": "1.0.31",
 		"ws": "7.2.1",
 		"xev": "2.0.1"

src/client/app.vue

@@ -25,6 +25,7 @@
 				<input type="search" :placeholder="$t('search')" v-model="searchQuery" v-autocomplete="{ model: 'searchQuery' }" :disabled="searchWait" @keypress="searchKeypress"/>
 			</div>
 			<button v-if="$store.getters.isSignedIn" class="post _buttonPrimary" @click="post()"><fa :icon="faPencilAlt"/></button>
+			<x-clock v-if="isDesktop" class="clock"/>
 		</div>
 	</header>
 
@@ -43,11 +44,11 @@
 					<mk-avatar :user="$store.state.i" class="avatar"/><mk-acct class="text" :user="$store.state.i"/>
 				</button>
 				<div class="divider"></div>
-				<router-link class="item index" active-class="active" to="/" exact v-if="$store.getters.isSignedIn">
-					<fa :icon="faHome" fixed-width/><span class="text">{{ $t('timeline') }}</span>
-				</router-link>
+				<button class="item _button index active" @click="top()" v-if="$route.name === 'index'">
+					<fa :icon="faHome" fixed-width/><span class="text">{{ $store.getters.isSignedIn ? $t('timeline') : $t('home') }}</span>
+				</button>
 				<router-link class="item index" active-class="active" to="/" exact v-else>
-					<fa :icon="faHome" fixed-width/><span class="text">{{ $t('home') }}</span>
+					<fa :icon="faHome" fixed-width/><span class="text">{{ $store.getters.isSignedIn ? $t('timeline') : $t('home') }}</span>
 				</router-link>
 				<button class="item _button notifications" @click="notificationsOpen = !notificationsOpen" ref="notificationButton" v-if="$store.getters.isSignedIn">
 					<fa :icon="faBell" fixed-width/><span class="text">{{ $t('notifications') }}</span>
@@ -57,13 +58,13 @@
 					<fa :icon="faComments" fixed-width/><span class="text">{{ $t('messaging') }}</span>
 					<i v-if="$store.state.i.hasUnreadMessagingMessage"><fa :icon="faCircle"/></i>
 				</router-link>
-				<router-link class="item" active-class="active" to="/my/follow-requests" v-if="$store.getters.isSignedIn && $store.state.i.isLocked">
-					<fa :icon="faUserClock" fixed-width/><span class="text">{{ $t('followRequests') }}</span>
-					<i v-if="$store.state.i.pendingReceivedFollowRequestsCount"><fa :icon="faCircle"/></i>
-				</router-link>
 				<router-link class="item" active-class="active" to="/my/drive" v-if="$store.getters.isSignedIn">
 					<fa :icon="faCloud" fixed-width/><span class="text">{{ $t('drive') }}</span>
 				</router-link>
+				<router-link class="item" active-class="active" to="/my/follow-requests" v-if="$store.getters.isSignedIn && $store.state.i.isLocked">
+					<fa :icon="faUserClock" fixed-width/><span class="text">{{ $t('followRequests') }}</span>
+					<i v-if="$store.state.i.hasPendingReceivedFollowRequest"><fa :icon="faCircle"/></i>
+				</router-link>
 				<div class="divider"></div>
 				<router-link class="item" active-class="active" to="/featured">
 					<fa :icon="faFireAlt" fixed-width/><span class="text">{{ $t('featured') }}</span>
@@ -86,11 +87,14 @@
 					<fa :icon="faEllipsisH" fixed-width/><span class="text">{{ $t('more') }}</span>
 					<i v-if="$store.getters.isSignedIn && ($store.state.i.hasUnreadMentions || $store.state.i.hasUnreadSpecifiedNotes)"><fa :icon="faCircle"/></i>
 				</button>
+				<router-link class="item" active-class="active" to="/settings">
+					<fa :icon="faCog" fixed-width/><span class="text">{{ $t('settings') }}</span>
+				</router-link>
 			</div>
 		</nav>
 	</transition>
 
-	<div class="contents" ref="contents">
+	<div class="contents" ref="contents" :class="{ wallpaper }">
 		<main ref="main">
 			<div class="content">
 				<transition :name="$store.state.device.animation ? 'page' : ''" mode="out-in" @enter="onTransition">
@@ -107,7 +111,7 @@
 
 		<div class="widgets">
 			<div ref="widgets" :class="{ edit: widgetsEditMode }">
-				<template v-if="enableWidgets && $store.getters.isSignedIn">
+				<template v-if="isDesktop && $store.getters.isSignedIn">
 					<template v-if="widgetsEditMode">
 						<mk-button primary @click="addWidget" class="add"><fa :icon="faPlus"/></mk-button>
 						<x-draggable
@@ -136,8 +140,9 @@
 	</div>
 
 	<div class="buttons">
-		<button v-if="$store.getters.isSignedIn" class="button nav _button" @click="showNav = true" ref="navButton"><fa :icon="faBars"/><i v-if="$store.state.i.hasUnreadSpecifiedNotes || $store.state.i.pendingReceivedFollowRequestsCount || $store.state.i.hasUnreadMessagingMessage || $store.state.i.hasUnreadAnnouncement"><fa :icon="faCircle"/></i></button>
-		<button v-if="$store.getters.isSignedIn" class="button home _button" :disabled="$route.path === '/'" @click="$router.push('/')"><fa :icon="faHome"/></button>
+		<button class="button nav _button" @click="showNav = true" ref="navButton"><fa :icon="faBars"/><i v-if="$store.getters.isSignedIn && ($store.state.i.hasUnreadSpecifiedNotes || $store.state.i.hasPendingReceivedFollowRequest || $store.state.i.hasUnreadMessagingMessage || $store.state.i.hasUnreadAnnouncement)"><fa :icon="faCircle"/></i></button>
+		<button v-if="$route.name === 'index'" class="button home _button" @click="top()"><fa :icon="faHome"/></button>
+		<button v-else class="button home _button" @click="$router.push('/')"><fa :icon="faHome"/></button>
 		<button v-if="$store.getters.isSignedIn" class="button notifications _button" @click="notificationsOpen = !notificationsOpen" ref="notificationButton2"><fa :icon="notificationsOpen ? faTimes : faBell"/><i v-if="$store.state.i.hasUnreadNotification"><fa :icon="faCircle"/></i></button>
 		<button v-if="$store.getters.isSignedIn" class="button post _buttonPrimary" @click="post()"><fa :icon="faPencilAlt"/></button>
 	</div>
@@ -157,15 +162,18 @@ import { faBell, faEnvelope, faLaugh, faComments } from '@fortawesome/free-regul
 import { ResizeObserver } from '@juggle/resize-observer';
 import { v4 as uuid } from 'uuid';
 import i18n from './i18n';
-import { host } from './config';
+import { host, instanceName } from './config';
 import { search } from './scripts/search';
 import contains from './scripts/contains';
 import MkToast from './components/toast.vue';
 
+const DESKTOP_THRESHOLD = 1100;
+
 export default Vue.extend({
 	i18n,
 
 	components: {
+		XClock: () => import('./components/header-clock.vue').then(m => m.default),
 		XNotifications: () => import('./components/notifications.vue').then(m => m.default),
 		MkButton: () => import('./components/ui/button.vue').then(m => m.default),
 		XDraggable: () => import('vuedraggable'),
@@ -184,9 +192,10 @@ export default Vue.extend({
 			searchQuery: '',
 			searchWait: false,
 			widgetsEditMode: false,
-			enableWidgets: window.innerWidth >= 1100,
+			isDesktop: window.innerWidth >= DESKTOP_THRESHOLD,
 			canBack: false,
 			disconnectedDialog: null as Promise<void> | null,
+			wallpaper: localStorage.getItem('wallpaper') != null,
 			faGripVertical, faChevronLeft, faComments, faHashtag, faBroadcastTower, faFireAlt, faEllipsisH, faPencilAlt, faBars, faTimes, faBell, faSearch, faUserCog, faCog, faUser, faHome, faStar, faCircle, faAt, faEnvelope, faListUl, faPlus, faUserClock, faLaugh, faUsers, faTachometerAlt, faExchangeAlt, faGlobe, faChartBar, faCloud, faServer
 		};
 	},
@@ -224,6 +233,10 @@ export default Vue.extend({
 					el.removeEventListener('mousedown', this.onMousedown);
 				}
 			}
+		},
+
+		isDesktop() {
+			if (this.isDesktop) this.adjustWidgetsWidth();
 		}
 	},
 
@@ -247,11 +260,15 @@ export default Vue.extend({
 		}
 
 		this.$root.stream.on('_disconnected_', () => {
-			if (!this.disconnectedDialog) {
+			if (this.disconnectedDialog) return;
 			if (this.$store.state.device.autoReload) {
 				location.reload();
 				return;
 			}
+
+			setTimeout(() => {
+				if (this.$root.stream.state !== 'reconnecting') return;
+
 				this.disconnectedDialog = this.$root.dialog({
 					type: 'warning',
 					showCancelButton: true,
@@ -263,22 +280,12 @@ export default Vue.extend({
 					}
 					this.disconnectedDialog = null;
 				});
-			}
+			}, 150)
 		});
 	},
 
 	mounted() {
-		// https://stackoverflow.com/questions/33891709/when-flexbox-items-wrap-in-column-mode-container-does-not-grow-its-width
-		if (this.enableWidgets) {
-			const adjustWidgetsWidth = () => {
-				const lastChild = this.$refs.widgets.children[this.$refs.widgets.children.length - 1];
-				if (lastChild == null) return;
-
-				const width = lastChild.offsetLeft + 300;
-				this.$refs.widgets.style.width = width + 'px';
-			};
-			setInterval(adjustWidgetsWidth, 1000);
-		}
+		if (this.isDesktop) this.adjustWidgetsWidth();
 
 		const adjustTitlePosition = () => {
 			this.$refs.title.style.left = (this.$refs.main.getBoundingClientRect().left - this.$refs.nav.offsetWidth) + 'px';
@@ -292,10 +299,33 @@ export default Vue.extend({
 
 		ro.observe(this.$refs.contents);
 
-		window.addEventListener('resize', adjustTitlePosition);
+		window.addEventListener('resize', adjustTitlePosition, { passive: true });
+
+		if (!this.isDesktop) {
+			window.addEventListener('resize', () => {
+				if (window.innerWidth >= DESKTOP_THRESHOLD) this.isDesktop = true;
+			}, { passive: true });
+		}
 	},
 
 	methods: {
+		adjustWidgetsWidth() {
+			// https://stackoverflow.com/questions/33891709/when-flexbox-items-wrap-in-column-mode-container-does-not-grow-its-width
+			const adjust = () => {
+				const lastChild = this.$refs.widgets.children[this.$refs.widgets.children.length - 1];
+				if (lastChild == null) return;
+
+				const width = lastChild.offsetLeft + 300 + 16;
+				this.$refs.widgets.style.width = width + 'px';
+			};
+			setInterval(adjust, 1000);
+			setTimeout(adjust, 100);
+		},
+
+		top() {
+			window.scroll({ top: 0, behavior: 'smooth' });
+		},
+
 		help() {
 			this.$router.push('/docs/keyboard-shortcut');
 		},
@@ -344,7 +374,7 @@ export default Vue.extend({
 			const accountItems = accounts.map(account => ({
 				type: 'user',
 				user: account,
-				action: () => { this.switchAccount(account) }
+				action: () => { this.switchAccount(account); }
 			}));
 
 			this.$root.menu({
@@ -355,15 +385,28 @@ export default Vue.extend({
 					avatar: this.$store.state.i,
 				}, {
 					type: 'link',
-					text: this.$t('settings'),
+					text: this.$t('accountSettings'),
 					to: '/my/settings',
 					icon: faCog,
-				}, null, {
-					type: 'item',
-					text: this.$t('addAcount'),
+				}, null, ...accountItems, {
 					icon: faPlus,
-					action: () => { this.addAcount() },
-				}], ...accountItems],
+					text: this.$t('addAcount'),
+					action: () => {
+						this.$root.menu({
+							items: [{
+								text: this.$t('existingAcount'),
+								action: () => { this.addAcount(); },
+							}, {
+								text: this.$t('createAccount'),
+								action: () => { this.createAccount(); },
+							}],
+							align: 'left',
+							fixed: true,
+							width: 240,
+							source: ev.currentTarget || ev.target,
+						});
+					},
+				}]],
 				align: 'left',
 				fixed: true,
 				width: 240,
@@ -375,9 +418,14 @@ export default Vue.extend({
 			this.$root.menu({
 				items: [{
 					type: 'link',
-					text: this.$t('statistics'),
-					to: '/instance/stats',
-					icon: faChartBar,
+					text: this.$t('dashboard'),
+					to: '/instance',
+					icon: faTachometerAlt,
+				}, null, {
+					type: 'link',
+					text: this.$t('settings'),
+					to: '/instance/settings',
+					icon: faCog,
 				}, {
 					type: 'link',
 					text: this.$t('customEmojis'),
@@ -393,11 +441,6 @@ export default Vue.extend({
 					text: this.$t('files'),
 					to: '/instance/files',
 					icon: faCloud,
-				}, {
-					type: 'link',
-					text: this.$t('monitor'),
-					to: '/instance/monitor',
-					icon: faTachometerAlt,
 				}, {
 					type: 'link',
 					text: this.$t('jobQueue'),
@@ -413,11 +456,6 @@ export default Vue.extend({
 					text: this.$t('announcements'),
 					to: '/instance/announcements',
 					icon: faBroadcastTower,
-				}, null, {
-					type: 'link',
-					text: this.$t('general'),
-					to: '/instance',
-					icon: faCog,
 				}],
 				align: 'left',
 				fixed: true,
@@ -477,9 +515,14 @@ export default Vue.extend({
 					icon: faQuestionCircle,
 				}, {
 					type: 'link',
-					text: this.$t('about'),
+					text: this.$t('aboutX', { x: instanceName || host }),
 					to: '/about',
 					icon: faInfoCircle,
+				}, {
+					type: 'link',
+					text: this.$t('aboutMisskey'),
+					to: '/about-misskey',
+					icon: faInfoCircle,
 				}],
 				align: 'left',
 				fixed: true,
@@ -498,9 +541,25 @@ export default Vue.extend({
 			});
 		},
 
-		async switchAccount(account) {
-			const token = this.$store.state.device.accounts.find(x => x.id === account.id).token;
-			this.$root.api('i', {}, token).then(i => {
+		async createAccount() {
+			this.$root.new(await import('./components/signup-dialog.vue').then(m => m.default)).$once('signup', res => {
+				this.$store.dispatch('addAcount', res);
+				this.switchAccountWithToken(res.i);
+			});
+		},
+
+		async switchAccount(account: any) {
+			const token = this.$store.state.device.accounts.find((x: any) => x.id === account.id).token;
+			this.switchAccountWithToken(token);
+		},
+
+		switchAccountWithToken(token: string) {
+			this.$root.dialog({
+				type: 'waiting',
+				iconOnly: true
+			});
+
+			this.$root.api('i', {}, token).then((i: any) => {
 				this.$store.dispatch('switchAccount', {
 					...i,
 					token: token
@@ -547,6 +606,9 @@ export default Vue.extend({
 				'calendar',
 				'rss',
 				'trends',
+				'clock',
+				'activity',
+				'photos',
 			];
 
 			this.$root.menu({
@@ -744,10 +806,9 @@ export default Vue.extend({
 				position: relative;
 
 				> input {
-					$margin: 8px;
-					width: 200px;
+					width: 220px;
 					box-sizing: border-box;
-					margin-right: $margin;
+					margin-right: 8px;
 					padding: 0 12px 0 42px;
 					font-size: 1rem;
 					line-height: 38px;
@@ -778,6 +839,10 @@ export default Vue.extend({
 				border-radius: 100%;
 				font-size: 16px;
 			}
+
+			> .clock {
+				margin-left: 8px;
+			}
 		}
 	}
 
@@ -823,6 +888,7 @@ export default Vue.extend({
 			width: $nav-width;
 			height: 100vh;
 			padding: 16px 0;
+			padding-bottom: calc(3.7rem + 24px);
 			box-sizing: border-box;
 			overflow: auto;
 			background: var(--navBg);
@@ -836,6 +902,7 @@ export default Vue.extend({
 			@media (max-width: $nav-icon-only-threshold) and (min-width: $nav-hide-threshold + 1px) {
 				width: $nav-icon-only-width;
 				padding: 8px 0;
+				padding-bottom: calc(3.7rem + 24px);
 
 				> .divider {
 					margin: 8px auto;
@@ -883,12 +950,24 @@ export default Vue.extend({
 
 				&:hover {
 					text-decoration: none;
+					color: var(--navHoverFg);
 				}
 
 				&.active {
 					color: var(--navActive);
 				}
 
+				&:last-child {
+					position: fixed;
+					bottom: 0;
+					width: inherit;
+					padding-top: 8px;
+					padding-bottom: 8px;
+					background: var(--navBg);
+					border-top: solid 1px var(--divider);
+					border-right: solid 1px var(--divider);
+				}
+
 				@media (max-width: $nav-icon-only-threshold) and (min-width: $nav-hide-threshold + 1px) {
 					padding-left: 0;
 					width: 100%;
@@ -925,6 +1004,10 @@ export default Vue.extend({
 		margin: 0 auto;
 		min-width: 0;
 
+		&.wallpaper {
+			background: var(--wallpaperOverlay);
+		}
+
 		> main {
 			width: $main-width;
 			min-width: $main-width;
@@ -1121,7 +1204,7 @@ export default Vue.extend({
 					position: absolute;
 					top: 0;
 					left: 0;
-					color: var(--accent);
+					color: var(--indicator);
 					font-size: 16px;
 					animation: blink 1s infinite;
 				}

src/client/assets/redoc.html

@@ -0,0 +1,24 @@
+<!DOCTYPE html>
+<html>
+	<head>
+		<title>Misskey API</title>
+		<!-- needed for adaptive design -->
+		<meta charset="utf-8"/>
+		<meta name="viewport" content="width=device-width, initial-scale=1">
+		<link href="https://fonts.googleapis.com/css?family=Montserrat:300,400,700|Roboto:300,400,700" rel="stylesheet">
+
+		<!--
+		ReDoc doesn't change outer page styles
+		-->
+		<style>
+			body {
+				margin: 0;
+				padding: 0;
+			}
+		</style>
+	</head>
+	<body>
+		<redoc spec-url='/api.json'></redoc>
+		<script src="https://cdn.jsdelivr.net/npm/redoc@next/bundles/redoc.standalone.js"> </script>
+	</body>
+</html>

src/client/components/analog-clock.vue

@@ -0,0 +1,156 @@
+<template>
+<svg class="mbcofsoe" viewBox="0 0 10 10" preserveAspectRatio="none">
+	<circle v-for="(angle, i) in graduations"
+					:cx="5 + (Math.sin(angle) * (5 - graduationsPadding))"
+					:cy="5 - (Math.cos(angle) * (5 - graduationsPadding))"
+					:r="i % 5 == 0 ? 0.125 : 0.05"
+					:fill="i % 5 == 0 ? majorGraduationColor : minorGraduationColor"
+					:key="i"/>
+
+	<line
+		:x1="5 - (Math.sin(sAngle) * (sHandLengthRatio * handsTailLength))"
+		:y1="5 + (Math.cos(sAngle) * (sHandLengthRatio * handsTailLength))"
+		:x2="5 + (Math.sin(sAngle) * ((sHandLengthRatio * 5) - handsPadding))"
+		:y2="5 - (Math.cos(sAngle) * ((sHandLengthRatio * 5) - handsPadding))"
+		:stroke="sHandColor"
+		stroke-width="0.05"/>
+
+	<line
+		:x1="5 - (Math.sin(mAngle) * (mHandLengthRatio * handsTailLength))"
+		:y1="5 + (Math.cos(mAngle) * (mHandLengthRatio * handsTailLength))"
+		:x2="5 + (Math.sin(mAngle) * ((mHandLengthRatio * 5) - handsPadding))"
+		:y2="5 - (Math.cos(mAngle) * ((mHandLengthRatio * 5) - handsPadding))"
+		:stroke="mHandColor"
+		stroke-width="0.1"/>
+
+	<line
+		:x1="5 - (Math.sin(hAngle) * (hHandLengthRatio * handsTailLength))"
+		:y1="5 + (Math.cos(hAngle) * (hHandLengthRatio * handsTailLength))"
+		:x2="5 + (Math.sin(hAngle) * ((hHandLengthRatio * 5) - handsPadding))"
+		:y2="5 - (Math.cos(hAngle) * ((hHandLengthRatio * 5) - handsPadding))"
+		:stroke="hHandColor"
+		stroke-width="0.1"/>
+</svg>
+</template>
+
+<script lang="ts">
+import Vue from 'vue';
+import * as tinycolor from 'tinycolor2';
+
+export default Vue.extend({
+	props: {
+		smooth: {
+			type: Boolean,
+			default: false
+		}
+	},
+
+	data() {
+		return {
+			now: new Date(),
+			enabled: true,
+
+			graduationsPadding: 0.5,
+			handsPadding: 1,
+			handsTailLength: 0.7,
+			hHandLengthRatio: 0.75,
+			mHandLengthRatio: 1,
+			sHandLengthRatio: 1,
+
+			computedStyle: getComputedStyle(document.documentElement)
+		};
+	},
+
+	computed: {
+		dark(): boolean {
+			return tinycolor(this.computedStyle.getPropertyValue('--bg')).isDark();
+		},
+
+		majorGraduationColor(): string {
+			return this.dark ? 'rgba(255, 255, 255, 0.3)' : 'rgba(0, 0, 0, 0.3)';
+		},
+		minorGraduationColor(): string {
+			return this.dark ? 'rgba(255, 255, 255, 0.2)' : 'rgba(0, 0, 0, 0.2)';
+		},
+
+		sHandColor(): string {
+			return this.dark ? 'rgba(255, 255, 255, 0.5)' : 'rgba(0, 0, 0, 0.3)';
+		},
+		mHandColor(): string {
+			return tinycolor(this.computedStyle.getPropertyValue('--fg')).toHexString();
+		},
+		hHandColor(): string {
+			return tinycolor(this.computedStyle.getPropertyValue('--accent')).toHexString();
+		},
+
+		ms(): number {
+			return this.now.getMilliseconds() * (this.smooth ? 1 : 0);
+		},
+		s(): number {
+			return this.now.getSeconds();
+		},
+		m(): number {
+			return this.now.getMinutes();
+		},
+		h(): number {
+			return this.now.getHours();
+		},
+
+		hAngle(): number {
+			return Math.PI * (this.h % 12 + (this.m + (this.s + this.ms / 1000) / 60) / 60) / 6;
+		},
+		mAngle(): number {
+			return Math.PI * (this.m + (this.s + this.ms / 1000) / 60) / 30;
+		},
+		sAngle(): number {
+			return Math.PI * (this.s + this.ms / 1000) / 30;
+		},
+
+		graduations(): any {
+			const angles = [];
+			for (let i = 0; i < 60; i++) {
+				const angle = Math.PI * i / 30;
+				angles.push(angle);
+			}
+
+			return angles;
+		}
+	},
+
+	mounted() {
+		const update = () => {
+			if (this.enabled) {
+				this.tick();
+				requestAnimationFrame(update);
+			}
+		};
+		update();
+
+		this.$store.subscribe((mutation, state) => {
+			if (mutation.type !== 'device/set') return;
+
+			if (mutation?.payload?.key !== 'theme') return;
+
+			setTimeout(() => {
+				this.computedStyle = getComputedStyle(document.documentElement);
+			}, 250);
+		});
+	},
+
+	beforeDestroy() {
+		this.enabled = false;
+	},
+
+	methods: {
+		tick() {
+			this.now = new Date();
+		}
+	}
+});
+</script>
+
+<style lang="scss" scoped>
+.mbcofsoe {
+	display: block;
+}
+</style>

src/client/components/autocomplete.vue

@@ -2,7 +2,7 @@
 <div class="swhvrteh" @contextmenu.prevent="() => {}">
 	<ol class="users" ref="suggests" v-if="type === 'user'">
 		<li v-for="user in users" @click="complete(type, user)" @keydown="onKeydown" tabindex="-1" class="user">
-			<img class="avatar" :src="user.avatarUrl" alt=""/>
+			<img class="avatar" :src="user.avatarUrl"/>
 			<span class="name">
 				<mk-user-name :user="user" :key="user.id"/>
 			</span>
@@ -18,7 +18,7 @@
 	<ol class="emojis" ref="suggests" v-if="emojis.length > 0">
 		<li v-for="emoji in emojis" @click="complete(type, emoji.emoji)" @keydown="onKeydown" tabindex="-1">
 			<span class="emoji" v-if="emoji.isCustomEmoji"><img :src="$store.state.device.disableShowingAnimatedImages ? getStaticImageUrl(emoji.url) : emoji.url" :alt="emoji.emoji"/></span>
-			<span class="emoji" v-else-if="!useOsDefaultEmojis"><img :src="emoji.url" :alt="emoji.emoji"/></span>
+			<span class="emoji" v-else-if="!useOsNativeEmojis"><img :src="emoji.url" :alt="emoji.emoji"/></span>
 			<span class="emoji" v-else>{{ emoji.emoji }}</span>
 			<span class="name" v-html="emoji.name.replace(q, `<b>${q}</b>`)"></span>
 			<span class="alias" v-if="emoji.aliasOf">({{ emoji.aliasOf }})</span>
@@ -130,8 +130,8 @@ export default Vue.extend({
 			return (this.$refs.suggests as Element).children;
 		},
 
-		useOsDefaultEmojis(): boolean {
-			return this.$store.state.device.useOsDefaultEmojis;
+		useOsNativeEmojis(): boolean {
+			return this.$store.state.device.useOsNativeEmojis;
 		}
 	},
 

src/client/components/date-separated-list.vue

@@ -2,7 +2,7 @@
 <sequential-entrance class="sqadhkmv" ref="list" :direction="direction" :reversed="reversed">
 	<template v-for="(item, i) in items">
 		<slot :item="item" :i="i"></slot>
-		<div class="separator" :key="item.id + '_date'" v-if="i != items.length - 1 && new Date(item.createdAt).getDate() != new Date(items[i + 1].createdAt).getDate()">
+		<div class="separator" :key="item.id + '_date'" v-if="showDate(i, item)">
 			<p class="date">
 				<span><fa class="icon" :icon="faAngleUp"/>{{ getDateText(item.createdAt) }}</span>
 				<span>{{ getDateText(items[i + 1].createdAt) }}<fa class="icon" :icon="faAngleDown"/></span>
@@ -52,6 +52,16 @@ export default Vue.extend({
 			});
 		},
 
+		showDate(i, item) {
+			return (
+				i != this.items.length - 1 &&
+				new Date(item.createdAt).getDate() != new Date(this.items[i + 1].createdAt).getDate() &&
+				!item._prId_ &&
+				!this.items[i + 1]._prId_ &&
+				!item._featuredId_ &&
+				!this.items[i + 1]._featuredId_);
+		},
+
 		focus() {
 			this.$refs.list.focus();
 		}

src/client/components/dialog.vue

@@ -1,9 +1,9 @@
 <template>
 <div class="mk-dialog" :class="{ iconOnly }">
-	<transition name="bg-fade" appear>
+	<transition :name="$store.state.device.animation ? 'bg-fade' : ''" appear>
 		<div class="bg" ref="bg" @click="onBgClick" v-if="show"></div>
 	</transition>
-	<transition name="dialog" appear @after-leave="() => { destroyDom(); }">
+	<transition :name="$store.state.device.animation ? 'dialog' : ''" appear @after-leave="() => { destroyDom(); }">
 		<div class="main" ref="main" v-if="show">
 			<template v-if="type == 'signin'">
 				<mk-signin/>

src/client/components/drive-file-thumbnail.vue

@@ -12,7 +12,7 @@
 		preload="metadata"
 		controls
 		v-else-if="detail && is === 'video'"/>
-	<img :src="file.thumbnailUrl" alt="" @load="onThumbnailLoaded" :style="`object-fit: ${ fit }`" v-else-if="isThumbnailAvailable"/>
+	<img :src="file.thumbnailUrl" @load="onThumbnailLoaded" :style="`object-fit: ${ fit }`" v-else-if="isThumbnailAvailable"/>
 	<fa :icon="faFileImage" class="icon" v-else-if="is === 'image'"/>
 	<fa :icon="faFileVideo" class="icon" v-else-if="is === 'video'"/>
 

src/client/components/drive.file.vue

@@ -83,17 +83,14 @@ export default Vue.extend({
 			} else {
 				this.$root.menu({
 					items: [{
-						type: 'item',
 						text: this.$t('rename'),
 						icon: faICursor,
 						action: this.rename
 					}, {
-						type: 'item',
 						text: this.file.isSensitive ? this.$t('unmarkAsSensitive') : this.$t('markAsSensitive'),
 						icon: this.file.isSensitive ? faEye : faEyeSlash,
 						action: this.toggleSensitive
 					}, null, {
-						type: 'item',
 						text: this.$t('copyUrl'),
 						icon: faLink,
 						action: this.copyUrl
@@ -105,7 +102,6 @@ export default Vue.extend({
 						icon: faDownload,
 						download: this.file.name
 					}, null, {
-						type: 'item',
 						text: this.$t('delete'),
 						icon: faTrashAlt,
 						action: this.deleteFile
@@ -113,11 +109,9 @@ export default Vue.extend({
 						type: 'nest',
 						text: this.$t('contextmenu.else-files'),
 						menu: [{
-							type: 'item',
 							text: this.$t('contextmenu.set-as-avatar'),
 							action: this.setAsAvatar
 						}, {
-							type: 'item',
 							text: this.$t('contextmenu.set-as-banner'),
 							action: this.setAsBanner
 						}]

src/client/components/drive.vue

@@ -23,13 +23,13 @@
 				<x-folder v-for="folder in folders" :key="folder.id" class="folder" :folder="folder"/>
 				<!-- SEE: https://stackoverflow.com/questions/18744164/flex-box-align-last-row-to-grid -->
 				<div class="padding" v-for="n in 16"></div>
-				<mk-button v-if="moreFolders">{{ $t('@.load-more') }}</mk-button>
+				<mk-button v-if="moreFolders">{{ $t('loadMore') }}</mk-button>
 			</div>
 			<div class="files" ref="filesContainer" v-if="files.length > 0">
 				<x-file v-for="file in files" :key="file.id" class="file" :file="file" :select-mode="selectMode"/>
 				<!-- SEE: https://stackoverflow.com/questions/18744164/flex-box-align-last-row-to-grid -->
 				<div class="padding" v-for="n in 16"></div>
-				<mk-button v-if="moreFiles" @click="fetchMoreFiles">{{ $t('@.load-more') }}</mk-button>
+				<mk-button v-if="moreFiles" @click="fetchMoreFiles">{{ $t('loadMore') }}</mk-button>
 			</div>
 			<div class="empty" v-if="files.length == 0 && folders.length == 0 && !fetching">
 				<p v-if="draghover">{{ $t('empty-draghover') }}</p>

src/client/components/emoji.vue

@@ -1,7 +1,7 @@
 <template>
 <img v-if="customEmoji" class="mk-emoji custom" :class="{ normal, noStyle }" :src="url" :alt="alt" :title="alt"/>
-<img v-else-if="char && !useOsDefaultEmojis" class="mk-emoji" :src="url" :alt="alt" :title="alt"/>
-<span v-else-if="char && useOsDefaultEmojis">{{ char }}</span>
+<img v-else-if="char && !useOsNativeEmojis" class="mk-emoji" :src="url" :alt="alt" :title="alt"/>
+<span v-else-if="char && useOsNativeEmojis">{{ char }}</span>
 <span v-else>:{{ name }}:</span>
 </template>
 
@@ -53,8 +53,8 @@ export default Vue.extend({
 			return this.customEmoji ? `:${this.customEmoji.name}:` : this.char;
 		},
 
-		useOsDefaultEmojis(): boolean {
-			return this.$store.state.device.useOsDefaultEmojis && !this.isReaction;
+		useOsNativeEmojis(): boolean {
+			return this.$store.state.device.useOsNativeEmojis && !this.isReaction;
 		},
 
 		ce() {

src/client/components/error.vue

@@ -1,6 +1,6 @@
 <template>
 <div class="mjndxjcg _panel">
-	<img src="https://xn--931a.moe/assets/error.jpg" alt=""/>
+	<img src="https://xn--931a.moe/assets/error.png" class="_ghost"/>
 	<p><fa :icon="faExclamationTriangle"/> {{ $t('error') }}</p>
 	<mk-button @click="() => $emit('retry')" class="button">{{ $t('retry') }}</mk-button>
 </div>
@@ -45,8 +45,6 @@ export default Vue.extend({
 		height: 150px;
 		margin-bottom: 16px;
 		border-radius: 16px;
-		pointer-events: none;
-		user-select: none;
 	}
 }
 </style>

src/client/components/google.vue

@@ -1,7 +1,7 @@
 <template>
 <div class="mk-google">
 	<input type="search" v-model="query" :placeholder="q">
-	<button @click="search"><fa icon="search"/> {{ $t('@.search') }}</button>
+	<button @click="search"><fa icon="search"/> {{ $t('search') }}</button>
 </div>
 </template>
 

src/client/components/header-clock.vue

@@ -0,0 +1,101 @@
+<template>
+<div class="eqryymyo">
+	<div class="header">
+		<time ref="time" class="_ghost">
+			<span class="yyyymmdd">{{ yyyy }}/{{ mm }}/{{ dd }}</span>
+			<br>
+			<span class="hhnn">{{ hh }}<span :style="{ visibility: now.getSeconds() % 2 == 0 ? 'visible' : 'hidden' }">:</span>{{ nn }}</span>
+		</time>
+	</div>
+	<div class="content _panel _ghost">
+		<mk-clock/>
+	</div>
+</div>
+</template>
+
+<script lang="ts">
+import Vue from 'vue';
+import MkClock from './analog-clock.vue';
+
+export default Vue.extend({
+	components: {
+		MkClock
+	},
+	data() {
+		return {
+			now: new Date(),
+			clock: null
+		};
+	},
+	computed: {
+		yyyy(): number {
+			return this.now.getFullYear();
+		},
+		mm(): string {
+			return ('0' + (this.now.getMonth() + 1)).slice(-2);
+		},
+		dd(): string {
+			return ('0' + this.now.getDate()).slice(-2);
+		},
+		hh(): string {
+			return ('0' + this.now.getHours()).slice(-2);
+		},
+		nn(): string {
+			return ('0' + this.now.getMinutes()).slice(-2);
+		}
+	},
+	mounted() {
+		this.tick();
+		this.clock = setInterval(this.tick, 1000);
+	},
+	beforeDestroy() {
+		clearInterval(this.clock);
+	},
+	methods: {
+		tick() {
+			this.now = new Date();
+		}
+	}
+});
+</script>
+
+<style lang="scss" scoped>
+.eqryymyo {
+	display: inline-block;
+	overflow: visible;
+
+	> .header {
+		padding: 0 12px;
+		padding-top: 4px;
+		text-align: center;
+		font-size: 12px;
+		font-family: Lucida Console, Courier, monospace;
+
+		&:hover + .content {
+			opacity: 1;
+		}
+
+		> time {
+			display: table-cell;
+			vertical-align: middle;
+			height: 48px;
+
+			> .yyyymmdd {
+				opacity: 0.7;
+			}
+		}
+	}
+
+	> .content {
+		opacity: 0;
+		display: block;
+		position: absolute;
+		top: auto;
+		right: 0;
+		margin: 16px 0 0 0;
+		padding: 16px;
+		width: 230px;
+		transition: opacity 0.2s ease;
+	}
+}
+</style>

src/client/components/image-viewer.vue

@@ -0,0 +1,54 @@
+<template>
+<x-modal ref="modal" @closed="() => { $emit('closed'); destroyDom(); }">
+	<img class="xubzgfga" ref="img" :src="image.url" :alt="image.name" :title="image.name" @click="close" tabindex="-1"/>
+</x-modal>
+</template>
+
+<script lang="ts">
+import Vue from 'vue';
+import i18n from '../i18n';
+import XModal from './modal.vue';
+
+export default Vue.extend({
+	i18n,
+
+	components: {
+		XModal,
+	},
+
+	props: {
+		image: {
+			type: Object,
+			required: true
+		},
+	},
+
+	mounted() {
+		this.$nextTick(() => {
+			this.$refs.img.focus();
+		});
+	},
+
+	methods: {
+		close() {
+			this.$refs.modal.close();
+		},
+	}
+});
+</script>
+
+<style lang="scss" scoped>
+.xubzgfga {
+	position: fixed;
+	z-index: 2;
+	top: 0;
+	right: 0;
+	bottom: 0;
+	left: 0;
+	max-width: 100%;
+	max-height: 100%;
+	margin: auto;
+	cursor: zoom-out;
+	image-orientation: from-image;
+}
+</style>

src/client/components/instance-stats.vue

@@ -1,8 +1,91 @@
 <template>
-<div class="mk-instance-stats">
+<div class="zbcjwnqg">
+	<div class="stats" v-if="info">
+		<div class="_panel">
+			<div>
+				<b><fa :icon="faUser"/>{{ $t('users') }}</b>
+				<small>{{ $t('local') }}</small>
+			</div>
+			<div>
+				<dl class="total">
+					<dt>{{ $t('total') }}</dt>
+					<dd>{{ info.originalUsersCount | number }}</dd>
+				</dl>
+				<dl class="diff" :class="{ inc: usersLocalDoD > 0 }">
+					<dt>{{ $t('dayOverDayChanges') }}</dt>
+					<dd>{{ usersLocalDoD | number }}</dd>
+				</dl>
+				<dl class="diff" :class="{ inc: usersLocalWoW > 0 }">
+					<dt>{{ $t('weekOverWeekChanges') }}</dt>
+					<dd>{{ usersLocalWoW | number }}</dd>
+				</dl>
+			</div>
+		</div>
+		<div class="_panel">
+			<div>
+				<b><fa :icon="faUser"/>{{ $t('users') }}</b>
+				<small>{{ $t('remote') }}</small>
+			</div>
+			<div>
+				<dl class="total">
+					<dt>{{ $t('total') }}</dt>
+					<dd>{{ (info.usersCount - info.originalUsersCount) | number }}</dd>
+				</dl>
+				<dl class="diff" :class="{ inc: usersRemoteDoD > 0 }">
+					<dt>{{ $t('dayOverDayChanges') }}</dt>
+					<dd>{{ usersRemoteDoD | number }}</dd>
+				</dl>
+				<dl class="diff" :class="{ inc: usersRemoteWoW > 0 }">
+					<dt>{{ $t('weekOverWeekChanges') }}</dt>
+					<dd>{{ usersRemoteWoW | number }}</dd>
+				</dl>
+			</div>
+		</div>
+		<div class="_panel">
+			<div>
+				<b><fa :icon="faPencilAlt"/>{{ $t('notes') }}</b>
+				<small>{{ $t('local') }}</small>
+			</div>
+			<div>
+				<dl class="total">
+					<dt>{{ $t('total') }}</dt>
+					<dd>{{ info.originalNotesCount | number }}</dd>
+				</dl>
+				<dl class="diff" :class="{ inc: notesLocalDoD > 0 }">
+					<dt>{{ $t('dayOverDayChanges') }}</dt>
+					<dd>{{ notesLocalDoD | number }}</dd>
+				</dl>
+				<dl class="diff" :class="{ inc: notesLocalWoW > 0 }">
+					<dt>{{ $t('weekOverWeekChanges') }}</dt>
+					<dd>{{ notesLocalWoW | number }}</dd>
+				</dl>
+			</div>
+		</div>
+		<div class="_panel">
+			<div>
+				<b><fa :icon="faPencilAlt"/>{{ $t('notes') }}</b>
+				<small>{{ $t('remote') }}</small>
+			</div>
+			<div>
+				<dl class="total">
+					<dt>{{ $t('total') }}</dt>
+					<dd>{{ (info.notesCount - info.originalNotesCount) | number }}</dd>
+				</dl>
+				<dl class="diff" :class="{ inc: notesRemoteDoD > 0 }">
+					<dt>{{ $t('dayOverDayChanges') }}</dt>
+					<dd>{{ notesRemoteDoD | number }}</dd>
+				</dl>
+				<dl class="diff" :class="{ inc: notesRemoteWoW > 0 }">
+					<dt>{{ $t('weekOverWeekChanges') }}</dt>
+					<dd>{{ notesRemoteWoW | number }}</dd>
+				</dl>
+			</div>
+		</div>
+	</div>
+
 	<section class="_card">
 		<div class="_title"><fa :icon="faChartBar"/> {{ $t('statistics') }}</div>
-		<div class="_content" style="margin-top: -8px; margin-bottom: -12px;">
+		<div class="_content" style="margin-top: -8px;">
 			<div class="selects" style="display: flex;">
 				<mk-select v-model="chartSrc" style="margin: 0; flex: 1;">
 					<optgroup :label="$t('federation')">
@@ -40,10 +123,10 @@
 
 <script lang="ts">
 import Vue from 'vue';
-import { faChartBar } from '@fortawesome/free-solid-svg-icons';
+import { faChartBar, faUser, faPencilAlt } from '@fortawesome/free-solid-svg-icons';
 import Chart from 'chart.js';
-import i18n from '../../i18n';
-import MkSelect from '../../components/ui/select.vue';
+import i18n from '../i18n';
+import MkSelect from './ui/select.vue';
 
 const chartLimit = 90;
 const sum = (...arr) => arr.reduce((r, a) => r.map((b, i) => a[i] + b));
@@ -59,24 +142,27 @@ const alpha = (hex, a) => {
 export default Vue.extend({
 	i18n,
 
-	metaInfo() {
-		return {
-			title: `${this.$t('statistics')} | ${this.$t('instance')}`
-		};
-	},
-
 	components: {
 		MkSelect
 	},
 
 	data() {
 		return {
+			info: null,
+			notesLocalWoW: 0,
+			notesLocalDoD: 0,
+			notesRemoteWoW: 0,
+			notesRemoteDoD: 0,
+			usersLocalWoW: 0,
+			usersLocalDoD: 0,
+			usersRemoteWoW: 0,
+			usersRemoteDoD: 0,
 			now: null,
 			chart: null,
 			chartInstance: null,
 			chartSrc: 'notes',
 			chartSpan: 'hour',
-			faChartBar
+			faChartBar, faUser, faPencilAlt
 		}
 	},
 
@@ -121,6 +207,8 @@ export default Vue.extend({
 	},
 
 	async created() {
+		this.info = await this.$root.api('stats');
+
 		this.now = new Date();
 
 		const [perHour, perDay] = await Promise.all([Promise.all([
@@ -154,6 +242,15 @@ export default Vue.extend({
 			}
 		};
 
+		this.notesLocalWoW = this.info.originalNotesCount - chart.perDay.notes.local.total[7];
+		this.notesLocalDoD = this.info.originalNotesCount - chart.perDay.notes.local.total[1];
+		this.notesRemoteWoW = (this.info.notesCount - this.info.originalNotesCount) - chart.perDay.notes.remote.total[7];
+		this.notesRemoteDoD = (this.info.notesCount - this.info.originalNotesCount) - chart.perDay.notes.remote.total[1];
+		this.usersLocalWoW = this.info.originalUsersCount - chart.perDay.users.local.total[7];
+		this.usersLocalDoD = this.info.originalUsersCount - chart.perDay.users.local.total[1];
+		this.usersRemoteWoW = (this.info.usersCount - this.info.originalUsersCount) - chart.perDay.users.remote.total[7];
+		this.usersRemoteDoD = (this.info.usersCount - this.info.originalUsersCount) - chart.perDay.users.remote.total[1];
+
 		this.chart = chart;
 
 		this.renderChart();
@@ -489,3 +586,80 @@ export default Vue.extend({
 	}
 });
 </script>
+
+<style lang="scss" scoped>
+.zbcjwnqg {
+	> .stats {
+		display: flex;
+		justify-content: space-between;
+		flex-wrap: wrap;
+		margin: calc(0px - var(--margin) / 2);
+		margin-bottom: calc(var(--margin) / 2);
+
+		> div {
+			display: flex;
+			flex: 1 0 213px;
+			margin: calc(var(--margin) / 2);
+			box-sizing: border-box;
+			padding: 16px 20px;
+
+			> div {
+				width: 50%;
+
+				&:first-child {
+					> b {
+						display: block;
+
+						> [data-icon] {
+							width: 16px;
+							margin-right: 8px;
+						}
+					}
+
+					> small {
+						margin-left: 16px + 8px;
+						opacity: 0.7;
+					}
+				}
+
+				&:last-child {
+					> dl {
+						display: flex;
+						margin: 0;
+						line-height: 1.5em;
+
+						> dt,
+						> dd {
+							width: 50%;
+							margin: 0;
+						}
+
+						> dt {
+							text-overflow: ellipsis;
+							overflow: hidden;
+							white-space: nowrap;
+						}
+
+						&.total {
+							> dt,
+							> dd {
+								font-weight: bold;
+							}
+						}
+
+						&.diff.inc {
+							> dd {
+								color: #82c11c;
+
+								&:before {
+									content: "+";
+								}
+							}
+						}
+					}
+				}
+			}
+		}
+	}
+}
+</style>

src/client/components/loading.vue

@@ -1,5 +1,5 @@
 <template>
-<div class="yxspomdl">
+<div class="yxspomdl" :class="{ inline }">
 	<div class="ring"></div>
 </div>
 </template>
@@ -8,6 +8,13 @@
 import Vue from 'vue';
 
 export default Vue.extend({
+	props: {
+		inline: {
+			type: Boolean,
+			required: false,
+			default: false
+		}
+	}
 });
 </script>
 
@@ -25,22 +32,31 @@ export default Vue.extend({
 	padding: 32px;
 	text-align: center;
 
+	&.inline {
+		display: inline;
+		padding: 0;
+
+		> .ring:after {
+			width: 32px;
+			height: 32px;
+		}
+	}
+
 	> .ring {
 		display: inline-block;
-		width: 80px;
-		height: 80px;
 		opacity: 0.7;
+		vertical-align: middle;
 	}
 
 	> .ring:after {
 		content: " ";
 		display: block;
-		width: 64px;
-		height: 64px;
-		margin: 8px;
+		box-sizing: border-box;
+		width: 48px;
+		height: 48px;
 		border-radius: 50%;
-		border: solid 6px;
-		border-color: var(--fg) transparent transparent transparent;
+		border: solid 4px;
+		border-color: currentColor transparent transparent transparent;
 		animation: ring 0.5s linear infinite;
 	}
 }

src/client/components/media-image.vue

@@ -20,6 +20,7 @@ import Vue from 'vue';
 import { faExclamationTriangle } from '@fortawesome/free-solid-svg-icons';
 import i18n from '../i18n';
 import { getStaticImageUrl } from '../scripts/get-static-image-url';
+import ImageViewer from './image-viewer.vue';
 
 export default Vue.extend({
 	i18n,
@@ -60,7 +61,16 @@ export default Vue.extend({
 	},
 	methods: {
 		onClick() {
+			if (this.$store.state.device.imageNewTab) {
 				window.open(this.image.url, '_blank');
+			} else {
+				const viewer = this.$root.new(ImageViewer, {
+					image: this.image
+				});
+				this.$once('hook:beforeDestroy', () => {
+					viewer.close();
+				});
+			}
 		}
 	}
 });

src/client/components/menu.vue

@@ -125,11 +125,13 @@ export default Vue.extend({
 
 	> .item {
 		display: block;
+		position: relative;
 		padding: 8px 16px;
 		width: 100%;
 		box-sizing: border-box;
 		white-space: nowrap;
 		font-size: 0.9em;
+		line-height: 20px;
 		text-align: center;
 		overflow: hidden;
 		text-overflow: ellipsis;
@@ -174,7 +176,7 @@ export default Vue.extend({
 			position: absolute;
 			top: 5px;
 			left: 13px;
-			color: var(--accent);
+			color: var(--indicator);
 			font-size: 12px;
 			animation: blink 1s infinite;
 		}

src/client/components/mfm.ts

@@ -82,10 +82,10 @@ export default Vue.component('misskey-flavored-markdown', {
 						attrs: {
 							style: `display: inline-block; font-size: 150%;`
 						},
-						directives: [this.$store.state.settings.disableAnimatedMfm ? {} : {
+						directives: [this.$store.state.device.animatedMfm ? {
 							name: 'animate-css',
 							value: { classes: 'tada', iteration: 'infinite' }
-						}]
+						}: {}]
 					}, genEl(token.children));
 				}
 
@@ -110,10 +110,10 @@ export default Vue.component('misskey-flavored-markdown', {
 						attrs: {
 							style: 'display: inline-block;'
 						},
-						directives: [this.$store.state.settings.disableAnimatedMfm ? {} : {
+						directives: [this.$store.state.device.animatedMfm ? {
 							name: 'animate-css',
 							value: { classes: 'rubberBand', iteration: 'infinite' }
-						}]
+						} : {}]
 					}, genEl(token.children));
 				}
 
@@ -122,9 +122,8 @@ export default Vue.component('misskey-flavored-markdown', {
 						token.node.props.attr == 'left' ? 'reverse' :
 						token.node.props.attr == 'alternate' ? 'alternate' :
 						'normal';
-					const style = (this.$store.state.settings.disableAnimatedMfm)
-						? ''
-						: `animation: spin 1.5s linear infinite; animation-direction: ${direction};`;
+					const style = this.$store.state.device.animatedMfm
+						? `animation: spin 1.5s linear infinite; animation-direction: ${direction};` : '';
 					return (createElement as any)('span', {
 						attrs: {
 							style: 'display: inline-block;' + style
@@ -135,7 +134,7 @@ export default Vue.component('misskey-flavored-markdown', {
 				case 'jump': {
 					return (createElement as any)('span', {
 						attrs: {
-							style: (this.$store.state.settings.disableAnimatedMfm) ? 'display: inline-block;' : 'display: inline-block; animation: jump 0.75s linear infinite;'
+							style: this.$store.state.device.animatedMfm ? 'display: inline-block; animation: jump 0.75s linear infinite;' : 'display: inline-block;'
 						},
 					}, genEl(token.children));
 				}

src/client/components/modal.vue

@@ -1,5 +1,5 @@
 <template>
-<div class="mk-modal">
+<div class="mk-modal" v-hotkey.global="keymap">
 	<transition :name="$store.state.device.animation ? 'bg-fade' : ''" appear>
 		<div class="bg" ref="bg" v-if="show" @click="close()"></div>
 	</transition>
@@ -20,6 +20,13 @@ export default Vue.extend({
 			show: true,
 		};
 	},
+	computed: {
+		keymap(): any {
+			return {
+				'esc': this.close,
+			};
+		},
+	},
 	methods: {
 		close() {
 			this.show = false;

src/client/components/note-header.vue

@@ -77,23 +77,19 @@ export default Vue.extend({
 	> .admin,
 	> .moderator {
 		margin-right: 0.5em;
+		color: var(--badge);
 	}
 
 	> .username {
 		margin: 0 .5em 0 0;
 		overflow: hidden;
 		text-overflow: ellipsis;
-		color: var(--noteHeaderAcct);
 	}
 
 	> .info {
 		margin-left: auto;
 		font-size: 0.9em;
 
-		> * {
-			color: var(--noteHeaderInfo);
-		}
-
 		> .mobile {
 			margin-right: 8px;
 		}

src/client/components/note.vue

@@ -9,7 +9,9 @@
 >
 	<x-sub v-for="note in conversation" :key="note.id" :note="note"/>
 	<x-sub :note="appearNote.reply" class="reply-to" v-if="appearNote.reply"/>
-	<div class="pinned" v-if="pinned"><fa :icon="faThumbtack"/> {{ $t('pinnedNote') }}</div>
+	<div class="info" v-if="pinned"><fa :icon="faThumbtack"/> {{ $t('pinnedNote') }}</div>
+	<div class="info" v-if="appearNote._prId_"><fa :icon="faBullhorn"/> {{ $t('promotion') }}<button class="_textButton hide" @click="readPromo()">{{ $t('hideThisNote') }} <fa :icon="faTimes"/></button></div>
+	<div class="info" v-if="appearNote._featuredId_"><fa :icon="faBolt"/> {{ $t('featured') }}</div>
 	<div class="renote" v-if="isRenote">
 		<mk-avatar class="avatar" :user="note.user"/>
 		<fa :icon="faRetweet"/>
@@ -58,7 +60,7 @@
 					<template v-else><fa :icon="faReply"/></template>
 					<p class="count" v-if="appearNote.repliesCount > 0">{{ appearNote.repliesCount }}</p>
 				</button>
-				<button v-if="['public', 'home'].includes(appearNote.visibility)" @click="renote()" class="button _button" ref="renoteButton">
+				<button v-if="canRenote" @click="renote()" class="button _button" ref="renoteButton">
 					<fa :icon="faRetweet"/><p class="count" v-if="appearNote.renoteCount > 0">{{ appearNote.renoteCount }}</p>
 				</button>
 				<button v-else class="button _button">
@@ -83,7 +85,7 @@
 
 <script lang="ts">
 import Vue from 'vue';
-import { faStar, faLink, faExternalLinkSquareAlt, faPlus, faMinus, faRetweet, faReply, faReplyAll, faEllipsisH, faHome, faUnlock, faEnvelope, faThumbtack, faBan, faQuoteRight } from '@fortawesome/free-solid-svg-icons';
+import { faBolt, faTimes, faBullhorn, faStar, faLink, faExternalLinkSquareAlt, faPlus, faMinus, faRetweet, faReply, faReplyAll, faEllipsisH, faHome, faUnlock, faEnvelope, faThumbtack, faBan, faQuoteRight } from '@fortawesome/free-solid-svg-icons';
 import { faCopy, faTrashAlt, faEye, faEyeSlash } from '@fortawesome/free-regular-svg-icons';
 import { parse } from '../../mfm/parse';
 import { sum, unique } from '../../prelude/array';
@@ -140,7 +142,7 @@ export default Vue.extend({
 			replies: [],
 			showContent: false,
 			hideThisNote: false,
-			faPlus, faMinus, faRetweet, faReply, faReplyAll, faEllipsisH, faHome, faUnlock, faEnvelope, faThumbtack, faBan
+			faBolt, faTimes, faBullhorn, faPlus, faMinus, faRetweet, faReply, faReplyAll, faEllipsisH, faHome, faUnlock, faEnvelope, faThumbtack, faBan
 		};
 	},
 
@@ -190,16 +192,16 @@ export default Vue.extend({
 			return this.$store.getters.isSignedIn && (this.$store.state.i.id === this.appearNote.userId);
 		},
 
+		canRenote(): boolean {
+			return ['public', 'home'].includes(this.appearNote.visibility) || this.isMyNote;
+		},
+
 		reactionsCount(): number {
 			return this.appearNote.reactions
 				? sum(Object.values(this.appearNote.reactions))
 				: 0;
 		},
 
-		title(): string {
-			return '';
-		},
-
 		urls(): string[] {
 			if (this.appearNote.text) {
 				const ast = parse(this.appearNote.text);
@@ -263,6 +265,13 @@ export default Vue.extend({
 	},
 
 	methods: {
+		readPromo() {
+			(this as any).$root.api('promo/read', {
+				noteId: this.appearNote.id
+			});
+			this.hideThisNote = true;
+		},
+
 		capture(withHandler = false) {
 			if (this.$store.getters.isSignedIn) {
 				this.connection.send(document.body.contains(this.$el) ? 'sn' : 's', { id: this.appearNote.id });
@@ -522,6 +531,15 @@ export default Vue.extend({
 					text: this.$t('pin'),
 					action: () => this.togglePin(true)
 				} : undefined,
+				...(this.$store.state.i.isModerator || this.$store.state.i.isAdmin ? [
+					null,
+					{
+						icon: faBullhorn,
+						text: this.$t('promote'),
+						action: this.promote
+					}]
+					: []
+				),
 				...(this.appearNote.userId == this.$store.state.i.id ? [
 					null,
 					{
@@ -614,6 +632,30 @@ export default Vue.extend({
 			});
 		},
 
+		async promote() {
+			const { canceled, result: days } = await this.$root.dialog({
+				title: this.$t('numberOfDays'),
+				input: { type: 'number' }
+			});
+
+			if (canceled) return;
+
+			this.$root.api('admin/promo/create', {
+				noteId: this.appearNote.id,
+				expiresAt: Date.now() + (86400000 * days)
+			}).then(() => {
+				this.$root.dialog({
+					type: 'success',
+					iconOnly: true, autoClose: true
+				});
+			}).catch(e => {
+				this.$root.dialog({
+					type: 'error',
+					text: e
+				});
+			});
+		},
+
 		focus() {
 			this.$el.focus();
 		},
@@ -710,7 +752,9 @@ export default Vue.extend({
 		border-radius: 0 0 var(--radius) var(--radius);
 	}
 
-	> .pinned {
+	> .info {
+		display: flex;
+		align-items: center;
 		padding: 16px 32px 8px 32px;
 		line-height: 24px;
 		font-size: 90%;
@@ -724,9 +768,14 @@ export default Vue.extend({
 		> [data-icon] {
 			margin-right: 4px;
 		}
+
+		> .hide {
+			margin-left: auto;
+			color: inherit;
+		}
 	}
 
-	> .pinned + .article {
+	> .info + .article {
 		padding-top: 8px;
 	}
 
@@ -863,7 +912,7 @@ export default Vue.extend({
 					}
 
 					&:hover {
-						color: var(--mkykhqkw);
+						color: var(--fgHighlighted);
 					}
 
 					> .count {

src/client/components/notes.vue

@@ -1,38 +1,45 @@
 <template>
 <div class="mk-notes" v-size="[{ max: 500 }]">
 	<div class="empty" v-if="empty">
-		<img src="https://xn--931a.moe/assets/info.jpg" alt=""/>
+		<img src="https://xn--931a.moe/assets/info.png" class="_ghost"/>
 		<div>{{ $t('noNotes') }}</div>
 	</div>
 
 	<mk-error v-if="error" @retry="init()"/>
 
-	<x-list ref="notes" class="notes" :items="notes" v-slot="{ item: note }">
-		<x-note :note="note" :detail="detail" :key="note.id"/>
+	<div class="more" v-if="more && reversed" style="margin-bottom: var(--margin);">
+		<mk-button class="button" :disabled="moreFetching" :style="{ cursor: moreFetching ? 'wait' : 'pointer' }" @click="fetchMore()" primary>
+			<template v-if="!moreFetching">{{ $t('loadMore') }}</template>
+			<template v-if="moreFetching"><mk-loading inline/></template>
+		</mk-button>
+	</div>
+
+	<x-list ref="notes" class="notes" :items="notes" v-slot="{ item: note }" :direction="reversed ? 'up' : 'down'" :reversed="reversed">
+		<x-note :note="note" :detail="detail" :key="note._featuredId_ || note._prId_ || note.id"/>
 	</x-list>
 
-	<footer v-if="more">
-		<button @click="fetchMore()" :disabled="moreFetching" :style="{ cursor: moreFetching ? 'wait' : 'pointer' }" class="_buttonPrimary">
+	<div class="more" v-if="more && !reversed" style="margin-top: var(--margin);">
+		<mk-button class="button" :disabled="moreFetching" :style="{ cursor: moreFetching ? 'wait' : 'pointer' }" @click="fetchMore()" primary>
 			<template v-if="!moreFetching">{{ $t('loadMore') }}</template>
-			<template v-if="moreFetching"><fa :icon="faSpinner" pulse fixed-width/></template>
-		</button>
-	</footer>
+			<template v-if="moreFetching"><mk-loading inline/></template>
+		</mk-button>
+	</div>
 </div>
 </template>
 
 <script lang="ts">
 import Vue from 'vue';
-import { faSpinner } from '@fortawesome/free-solid-svg-icons';
 import i18n from '../i18n';
 import paging from '../scripts/paging';
 import XNote from './note.vue';
 import XList from './date-separated-list.vue';
+import MkButton from './ui/button.vue';
 
 export default Vue.extend({
 	i18n,
 
 	components: {
-		XNote, XList
+		XNote, XList, MkButton
 	},
 
 	mixins: [
@@ -63,16 +70,14 @@ export default Vue.extend({
 		}
 	},
 
-	data() {
-		return {
-			faSpinner
-		};
-	},
-
 	computed: {
 		notes(): any[] {
 			return this.extract ? this.extract(this.items) : this.items;
 		},
+
+		reversed(): boolean {
+			return this.pagination.reversed;
+		}
 	},
 
 	methods: {
@@ -94,42 +99,28 @@ export default Vue.extend({
 			height: 128px;
 			margin-bottom: 16px;
 			border-radius: 16px;
-			pointer-events: none;
-			user-select: none;
 		}
 	}
 
 	> .notes {
-		> ::v-deep * {
+		> ::v-deep *:not(:last-child) {
 			margin-bottom: var(--marginFull);
 		}
 	}
 
 	&.max-width_500px {
 		> .notes {
-			> ::v-deep * {
+			> ::v-deep *:not(:last-child) {
 				margin-bottom: var(--marginHalf);
 			}
 		}
 	}
 
-	> footer {
-		text-align: center;
-
-		&:empty {
-			display: none;
-		}
-
-		> button {
-			margin: 0;
-			padding: 16px;
+	> .more > .button {
+		margin-left: auto;
+		margin-right: auto;
+		height: 48px;
 		width: 100%;
-			border-radius: var(--radius);
-
-			&:disabled {
-				opacity: 0.7;
-			}
-		}
 	}
 }
 </style>

src/client/components/notification.vue

@@ -6,6 +6,7 @@
 			<fa :icon="faPlus" v-if="notification.type === 'follow'"/>
 			<fa :icon="faClock" v-if="notification.type === 'receiveFollowRequest'"/>
 			<fa :icon="faCheck" v-if="notification.type === 'followRequestAccepted'"/>
+			<fa :icon="faIdCardAlt" v-if="notification.type === 'groupInvited'"/>
 			<fa :icon="faRetweet" v-if="notification.type === 'renote'"/>
 			<fa :icon="faReply" v-if="notification.type === 'reply'"/>
 			<fa :icon="faAt" v-if="notification.type === 'mention'"/>
@@ -40,13 +41,14 @@
 		<span v-if="notification.type === 'follow'" class="text" style="opacity: 0.6;">{{ $t('youGotNewFollower') }}<div v-if="full"><mk-follow-button :user="notification.user" :full="true"/></div></span>
 		<span v-if="notification.type === 'followRequestAccepted'" class="text" style="opacity: 0.6;">{{ $t('followRequestAccepted') }}</span>
 		<span v-if="notification.type === 'receiveFollowRequest'" class="text" style="opacity: 0.6;">{{ $t('receiveFollowRequest') }}<div v-if="full && !followRequestDone"><button class="_textButton" @click="acceptFollowRequest()">{{ $t('accept') }}</button> | <button class="_textButton" @click="rejectFollowRequest()">{{ $t('reject') }}</button></div></span>
+		<span v-if="notification.type === 'groupInvited'" class="text" style="opacity: 0.6;">{{ $t('groupInvited') }}: <b>{{ notification.invitation.group.name }}</b><div v-if="full && !groupInviteDone"><button class="_textButton" @click="acceptGroupInvitation()">{{ $t('accept') }}</button> | <button class="_textButton" @click="rejectGroupInvitation()">{{ $t('reject') }}</button></div></span>
 	</div>
 </div>
 </template>
 
 <script lang="ts">
 import Vue from 'vue';
-import { faPlus, faQuoteLeft, faQuoteRight, faRetweet, faReply, faAt, faCheck } from '@fortawesome/free-solid-svg-icons';
+import { faIdCardAlt, faPlus, faQuoteLeft, faQuoteRight, faRetweet, faReply, faAt, faCheck } from '@fortawesome/free-solid-svg-icons';
 import { faClock } from '@fortawesome/free-regular-svg-icons';
 import getNoteSummary from '../../misc/get-note-summary';
 import XReactionIcon from './reaction-icon.vue';
@@ -78,7 +80,8 @@ export default Vue.extend({
 		return {
 			getNoteSummary,
 			followRequestDone: false,
-			faPlus, faQuoteLeft, faQuoteRight, faRetweet, faReply, faAt, faClock, faCheck
+			groupInviteDone: false,
+			faIdCardAlt, faPlus, faQuoteLeft, faQuoteRight, faRetweet, faReply, faAt, faClock, faCheck
 		};
 	},
 	methods: {
@@ -90,6 +93,18 @@ export default Vue.extend({
 			this.followRequestDone = true;
 			this.$root.api('following/requests/reject', { userId: this.notification.user.id });
 		},
+		acceptGroupInvitation() {
+			this.groupInviteDone = true;
+			this.$root.api('users/groups/invitations/accept', { invitationId: this.notification.invitation.id });
+			this.$root.dialog({
+				type: 'success',
+				iconOnly: true, autoClose: true
+			});
+		},
+		rejectGroupInvitation() {
+			this.groupInviteDone = true;
+			this.$root.api('users/groups/invitations/reject', { invitationId: this.notification.invitation.id });
+		},
 	}
 });
 </script>
@@ -149,12 +164,12 @@ export default Vue.extend({
 				height: 100%;
 			}
 
-			&.follow, &.followRequestAccepted, &.receiveFollowRequest {
+			&.follow, &.followRequestAccepted, &.receiveFollowRequest, &.groupInvited {
 				padding: 3px;
 				background: #36aed2;
 			}
 
-			&.retweet {
+			&.renote {
 				padding: 3px;
 				background: #36d298;
 			}

src/client/components/page/page.image.vue

@@ -1,6 +1,6 @@
 <template>
 <div class="lzyxtsnt">
-	<img v-if="image" :src="image.url" alt=""/>
+	<img v-if="image" :src="image.url"/>
 </div>
 </template>
 

src/client/components/post-form.vue

@@ -21,7 +21,7 @@
 	<div class="form">
 		<x-note-preview class="preview" v-if="reply" :note="reply"/>
 		<x-note-preview class="preview" v-if="renote" :note="renote"/>
-		<div class="with-quote" v-if="quoteId"><fa icon="quote-left"/> {{ $t('@.post-form.quote-attached') }}<button @click="quoteId = null"><fa icon="times"/></button></div>
+		<div class="with-quote" v-if="quoteId"><fa icon="quote-left"/> {{ $t('quoteAttached') }}<button @click="quoteId = null"><fa icon="times"/></button></div>
 		<div v-if="visibility === 'specified'" class="to-specified">
 			<span style="margin-right: 8px;">{{ $t('recipient') }}</span>
 			<div class="visibleUsers">
@@ -445,7 +445,7 @@ export default Vue.extend({
 
 				this.$root.dialog({
 					type: 'info',
-					text: this.$t('@.post-form.quote-question'),
+					text: this.$t('quoteQuestion'),
 					showCancelButton: true
 				}).then(({ canceled }) => {
 					if (canceled) {
@@ -610,6 +610,7 @@ export default Vue.extend({
 			right: 0;
 
 			> .text-count {
+				opacity: 0.7;
 				line-height: 66px;
 
 				@media (max-width: 500px) {

src/client/components/reaction-picker.vue

@@ -13,7 +13,7 @@
 			mode="out-in"
 			appear
 		>
-			<button class="_button" v-for="(reaction, i) in rs" :key="reaction" @click="react(reaction)" :tabindex="i + 1" :title="/^[a-z]+$/.test(reaction) ? $t('@.reactions.' + reaction) : reaction"><x-reaction-icon :reaction="reaction"/></button>
+			<button class="_button" v-for="(reaction, i) in rs" :key="reaction" @click="react(reaction)" :tabindex="i + 1" :title="reaction"><x-reaction-icon :reaction="reaction"/></button>
 		</transition-group>
 		<input class="text" v-model="text" :placeholder="$t('enterEmoji')" @keyup.enter="reactText" @input="tryReactText" v-autocomplete="{ model: 'text' }">
 	</div>

src/client/components/sequential-entrance.vue

@@ -1,12 +1,10 @@
 <template>
 <transition-group v-if="$store.state.device.animation"
-	name="staggered-fade"
+	class="uupnnhew"
+	:data-direction="direction"
+	:data-reversed="reversed ? 'true' : 'false'"
+	name="staggered"
 	tag="div"
-	:css="false"
-	@before-enter="beforeEnter"
-	@enter="enter"
-	@leave="leave"
-	mode="out-in"
 	appear
 >
 	<slot></slot>
@@ -37,40 +35,46 @@ export default Vue.extend({
 			default: false
 		}
 	},
-	i: 0,
 	methods: {
-		beforeEnter(el) {
-			el.style.opacity = 0;
-			el.style.transform = this.direction === 'down' ? 'translateY(-64px)' : 'translateY(64px)';
-			let index = this.$options.i;
-			const delay = this.delay * index;
-			el.style.transition = [getComputedStyle(el).transition, `transform 0.7s cubic-bezier(0.23, 1, 0.32, 1) ${delay}ms`, `opacity 0.7s cubic-bezier(0.23, 1, 0.32, 1) ${delay}ms`].filter(x => x != '').join(',');
-			this.$options.i++;
-		},
-		enter(el, done) {
-			setTimeout(() => {
-				el.style.opacity = 1;
-				el.style.transform = 'translateY(0px)';
-				el.addEventListener('transitionend', () => {
-					el.style.transition = '';
-					this.$options.i--;
-					done();
-				}, { once: true });
-			});
-		},
-		leave(el) {
-			el.style.opacity = 0;
-			el.style.transform = this.direction === 'down' ? 'translateY(64px)' : 'translateY(-64px)';
-		},
 		focus() {
 			this.$slots.default[0].elm.focus();
 		}
-	}
+	},
 });
 </script>
 
 <style lang="scss">
-.staggered-fade-move {
-	transition: transform 0.7s !important;
+.staggered-move {
+	transition: transform 0.7s cubic-bezier(0.23, 1, 0.32, 1) !important;
+}
+
+.uupnnhew[data-direction="up"] {
+	.staggered-enter {
+		opacity: 0;
+		transform: translateY(64px);
+	}
+}
+
+.uupnnhew[data-direction="down"] {
+	.staggered-enter {
+		opacity: 0;
+		transform: translateY(-64px);
+	}
+}
+
+.uupnnhew[data-reversed="true"] {
+	@for $i from 1 through 30 {
+		.staggered-enter-active:nth-last-child(#{$i}) {
+			transition: transform 0.7s cubic-bezier(0.23, 1, 0.32, 1) (15ms * ($i - 1)), opacity 0.7s cubic-bezier(0.23, 1, 0.32, 1) (15ms * ($i - 1));
+		}
+	}
+}
+
+.uupnnhew[data-reversed="false"] {
+	@for $i from 1 through 30 {
+		.staggered-enter-active:nth-child(#{$i}) {
+			transition: transform 0.7s cubic-bezier(0.23, 1, 0.32, 1) (15ms * ($i - 1)), opacity 0.7s cubic-bezier(0.23, 1, 0.32, 1) (15ms * ($i - 1));
+		}
+	}
 }
 </style>

src/client/components/signin.vue

@@ -12,15 +12,15 @@
 			<template #prefix><fa :icon="faLock"/></template>
 		</mk-input>
 		<mk-button type="submit" primary :disabled="signing" style="margin: 0 auto;">{{ signing ? $t('loggingIn') : $t('login') }}</mk-button>
-		<p v-if="meta && meta.enableTwitterIntegration" style="margin: 8px 0;"><a :href="`${apiUrl}/signin/twitter`"><fa :icon="['fab', 'twitter']"/> {{ $t('signin-with-twitter') }}</a></p>
-		<p v-if="meta && meta.enableGithubIntegration"  style="margin: 8px 0;"><a :href="`${apiUrl}/signin/github`"><fa :icon="['fab', 'github']"/> {{ $t('signin-with-github') }}</a></p>
-		<p v-if="meta && meta.enableDiscordIntegration" style="margin: 8px 0;"><a :href="`${apiUrl}/signin/discord`"><fa :icon="['fab', 'discord']"/> {{ $t('signin-with-discord') /* TODO: Make these layouts better */ }}</a></p>
+		<p v-if="meta && meta.enableTwitterIntegration" style="margin: 8px 0;"><a :href="`${apiUrl}/signin/twitter`"><fa :icon="faTwitter"/> {{ $t('signinWith', { x: 'Twitter' }) }}</a></p>
+		<p v-if="meta && meta.enableGithubIntegration"  style="margin: 8px 0;"><a :href="`${apiUrl}/signin/github`"><fa :icon="faGithub"/> {{ $t('signinWith', { x: 'GitHub' }) }}</a></p>
+		<p v-if="meta && meta.enableDiscordIntegration" style="margin: 8px 0;"><a :href="`${apiUrl}/signin/discord`"><fa :icon="faDiscord"/> {{ $t('signinWith', { x: 'Discord' }) }}</a></p>
 	</div>
 	<div class="2fa-signin" v-if="totpLogin" :class="{ securityKeys: user && user.securityKeys }">
 		<div v-if="user && user.securityKeys" class="twofa-group tap-group">
-			<p>{{ $t('tap-key') }}</p>
+			<p>{{ $t('tapSecurityKey') }}</p>
 			<mk-button @click="queryKey" v-if="!queryingKey">
-				{{ $t('@.error.retry') }}
+				{{ $t('retry') }}
 			</mk-button>
 		</div>
 		<div class="or-hr" v-if="user && user.securityKeys">
@@ -46,6 +46,7 @@
 import Vue from 'vue';
 import { toUnicode } from 'punycode';
 import { faLock, faGavel } from '@fortawesome/free-solid-svg-icons';
+import { faTwitter, faDiscord, faGithub } from '@fortawesome/free-brands-svg-icons';
 import MkButton from './ui/button.vue';
 import MkInput from './ui/input.vue';
 import i18n from '../i18n';
@@ -86,7 +87,7 @@ export default Vue.extend({
 			credential: null,
 			challengeData: null,
 			queryingKey: false,
-			faLock, faGavel
+			faLock, faGavel, faTwitter, faDiscord, faGithub
 		};
 	},
 

src/client/components/signup-dialog.vue

@@ -1,7 +1,7 @@
 <template>
-<x-window @closed="() => { $emit('closed'); destroyDom(); }">
+<x-window ref="window" @closed="() => { $emit('closed'); destroyDom(); }">
 	<template #header>{{ $t('signup') }}</template>
-	<x-signup/>
+	<x-signup :auto-set="autoSet" @signup="onSignup"/>
 </x-window>
 </template>
 
@@ -18,5 +18,20 @@ export default Vue.extend({
 		XSignup,
 		XWindow,
 	},
+
+	props: {
+		autoSet: {
+			type: Boolean,
+			required: false,
+			default: false,
+		}
+	},
+
+	methods: {
+		onSignup(res) {
+			this.$emit('signup', res);
+			this.$refs.window.close();
+		}
+	}
 });
 </script>

src/client/components/signup.vue

@@ -2,9 +2,8 @@
 <form class="mk-signup" @submit.prevent="onSubmit" :autocomplete="Math.random()">
 	<template v-if="meta">
 		<mk-input v-if="meta.disableRegistration" v-model="invitationCode" type="text" :autocomplete="Math.random()" spellcheck="false" required>
-			<span>{{ $t('invitation-code') }}</span>
-			<template #prefix><fa icon="id-card-alt"/></template>
-			<template #desc v-html="this.$t('invitation-info').replace('{}', 'mailto:' + meta.maintainerEmail)"></template>
+			<span>{{ $t('invitationCode') }}</span>
+			<template #prefix><fa :icon="faKey"/></template>
 		</mk-input>
 		<mk-input v-model="username" type="text" pattern="^[a-zA-Z0-9_]{1,20}$" :autocomplete="Math.random()" spellcheck="false" required @input="onChangeUsername">
 			<span>{{ $t('username') }}</span>
@@ -15,26 +14,26 @@
 				<span v-if="usernameState == 'ok'" style="color:#3CB7B5"><fa :icon="faCheck" fixed-width/> {{ $t('available') }}</span>
 				<span v-if="usernameState == 'unavailable'" style="color:#FF1161"><fa :icon="faExclamationTriangle" fixed-width/> {{ $t('unavailable') }}</span>
 				<span v-if="usernameState == 'error'" style="color:#FF1161"><fa :icon="faExclamationTriangle" fixed-width/> {{ $t('error') }}</span>
-				<span v-if="usernameState == 'invalid-format'" style="color:#FF1161"><fa :icon="faExclamationTriangle" fixed-width/> {{ $t('invalid-format') }}</span>
-				<span v-if="usernameState == 'min-range'" style="color:#FF1161"><fa :icon="faExclamationTriangle" fixed-width/> {{ $t('too-short') }}</span>
-				<span v-if="usernameState == 'max-range'" style="color:#FF1161"><fa :icon="faExclamationTriangle" fixed-width/> {{ $t('too-long') }}</span>
+				<span v-if="usernameState == 'invalid-format'" style="color:#FF1161"><fa :icon="faExclamationTriangle" fixed-width/> {{ $t('usernameInvalidFormat') }}</span>
+				<span v-if="usernameState == 'min-range'" style="color:#FF1161"><fa :icon="faExclamationTriangle" fixed-width/> {{ $t('tooShort') }}</span>
+				<span v-if="usernameState == 'max-range'" style="color:#FF1161"><fa :icon="faExclamationTriangle" fixed-width/> {{ $t('tooLong') }}</span>
 			</template>
 		</mk-input>
 		<mk-input v-model="password" type="password" :autocomplete="Math.random()" required @input="onChangePassword">
 			<span>{{ $t('password') }}</span>
 			<template #prefix><fa :icon="faLock"/></template>
 			<template #desc>
-				<p v-if="passwordStrength == 'low'" style="color:#FF1161"><fa :icon="faExclamationTriangle" fixed-width/> {{ $t('weak-password') }}</p>
-				<p v-if="passwordStrength == 'medium'" style="color:#3CB7B5"><fa :icon="faCheck" fixed-width/> {{ $t('normal-password') }}</p>
-				<p v-if="passwordStrength == 'high'" style="color:#3CB7B5"><fa :icon="faCheck" fixed-width/> {{ $t('strong-password') }}</p>
+				<p v-if="passwordStrength == 'low'" style="color:#FF1161"><fa :icon="faExclamationTriangle" fixed-width/> {{ $t('weakPassword') }}</p>
+				<p v-if="passwordStrength == 'medium'" style="color:#3CB7B5"><fa :icon="faCheck" fixed-width/> {{ $t('normalPassword') }}</p>
+				<p v-if="passwordStrength == 'high'" style="color:#3CB7B5"><fa :icon="faCheck" fixed-width/> {{ $t('strongPassword') }}</p>
 			</template>
 		</mk-input>
 		<mk-input v-model="retypedPassword" type="password" :autocomplete="Math.random()" required @input="onChangePasswordRetype">
 			<span>{{ $t('password') }} ({{ $t('retype') }})</span>
 			<template #prefix><fa :icon="faLock"/></template>
 			<template #desc>
-				<p v-if="passwordRetypeState == 'match'" style="color:#3CB7B5"><fa :icon="faCheck" fixed-width/> {{ $t('password-matched') }}</p>
-				<p v-if="passwordRetypeState == 'not-match'" style="color:#FF1161"><fa :icon="faExclamationTriangle" fixed-width/> {{ $t('password-not-matched') }}</p>
+				<p v-if="passwordRetypeState == 'match'" style="color:#3CB7B5"><fa :icon="faCheck" fixed-width/> {{ $t('passwordMatched') }}</p>
+				<p v-if="passwordRetypeState == 'not-match'" style="color:#FF1161"><fa :icon="faExclamationTriangle" fixed-width/> {{ $t('passwordNotMatched') }}</p>
 			</template>
 		</mk-input>
 		<mk-switch v-model="ToSAgreement" v-if="meta.tosUrl">
@@ -50,7 +49,7 @@
 
 <script lang="ts">
 import Vue from 'vue';
-import { faLock, faExclamationTriangle, faSpinner, faCheck } from '@fortawesome/free-solid-svg-icons';
+import { faLock, faExclamationTriangle, faSpinner, faCheck, faKey } from '@fortawesome/free-solid-svg-icons';
 const getPasswordStrength = require('syuilo-password-strength');
 import { toUnicode } from 'punycode';
 import i18n from '../i18n';
@@ -81,7 +80,15 @@ export default Vue.extend({
 			passwordRetypeState: null,
 			submitting: false,
 			ToSAgreement: false,
-			faLock, faExclamationTriangle, faSpinner, faCheck
+			faLock, faExclamationTriangle, faSpinner, faCheck, faKey
+		}
+	},
+
+	props: {
+		autoSet: {
+			type: Boolean,
+			required: false,
+			default: false,
 		}
 	},
 
@@ -98,6 +105,15 @@ export default Vue.extend({
 		}
 	},
 
+	created() {
+		if (this.autoSet) {
+			this.$once('signup', res => {
+				localStorage.setItem('i', res.i);
+				location.reload();
+			});
+		}
+	},
+
 	mounted() {
 		const head = document.getElementsByTagName('head')[0];
 		const script = document.createElement('script');
@@ -167,15 +183,14 @@ export default Vue.extend({
 					username: this.username,
 					password: this.password
 				}).then(res => {
-					localStorage.setItem('i', res.i);
-					location.href = '/';
+					this.$emit('signup', res);
 				});
 			}).catch(() => {
 				this.submitting = false;
 
 				this.$root.dialog({
 					type: 'error',
-					text: this.$t('some-error')
+					text: this.$t('error')
 				});
 
 				if (this.meta.enableRecaptcha) {

src/client/components/time.vue

@@ -48,7 +48,7 @@ export default Vue.extend({
 				ago >= 10       ? this.$t('_ago.secondsAgo', { n: (~~(ago % 60)).toString() }) :
 				ago >= -1       ? this.$t('_ago.justNow') :
 				ago <  -1       ? this.$t('_ago.future') :
-				this.$t('@.time.unknown'));
+				this.$t('_ago.unknown'));
 		}
 	},
 	created() {

src/client/components/ui/button.vue

@@ -105,7 +105,7 @@ export default Vue.extend({
 	padding: 8px 14px;
 	text-align: center;
 	font-weight: normal;
-	font-size: 14px;
+	font-size: 0.9em;
 	line-height: 24px;
 	box-shadow: none;
 	text-decoration: none;

src/client/components/ui/input.vue

@@ -239,6 +239,14 @@ export default Vue.extend({
 	position: relative;
 	margin: 32px 0;
 
+	&:not(.inline):first-child {
+		margin-top: 8px;
+	}
+
+	&:not(.inline):last-child {
+		margin-bottom: 8px;
+	}
+
 	> .icon {
 		position: absolute;
 		top: 0;

src/client/components/ui/pagination.vue

@@ -5,9 +5,9 @@
 		<slot name="empty"></slot>
 	</div>
 	<div class="more" v-if="more" key="_more_">
-		<mk-button :disabled="moreFetching" :style="{ cursor: moreFetching ? 'wait' : 'pointer' }" @click="fetchMore()">
+		<mk-button class="button" :disabled="moreFetching" :style="{ cursor: moreFetching ? 'wait' : 'pointer' }" @click="fetchMore()" primary>
 			<template v-if="!moreFetching">{{ $t('loadMore') }}</template>
-			<template v-if="moreFetching"><fa :icon="faSpinner" pulse fixed-width/></template>
+			<template v-if="moreFetching"><mk-loading inline/></template>
 		</mk-button>
 	</div>
 </sequential-entrance>
@@ -15,7 +15,6 @@
 
 <script lang="ts">
 import Vue from 'vue';
-import { faSpinner } from '@fortawesome/free-solid-svg-icons';
 import MkButton from './button.vue';
 import paging from '../../scripts/paging';
 
@@ -37,12 +36,6 @@ export default Vue.extend({
 			default: true
 		}
 	},
-
-	data() {
-		return {
-			faSpinner
-		};
-	},
 });
 </script>
 
@@ -55,5 +48,12 @@ export default Vue.extend({
 			margin-bottom: 8px;
 		}
 	}
+
+	> .more > .button {
+		margin-left: auto;
+		margin-right: auto;
+		height: 48px;
+		min-width: 150px;
+	}
 }
 </style>

src/client/components/ui/select.vue

@@ -77,6 +77,14 @@ export default Vue.extend({
 	position: relative;
 	margin: 32px 0;
 
+	&:not(.inline):first-child {
+		margin-top: 8px;
+	}
+
+	&:not(.inline):last-child {
+		margin-bottom: 8px;
+	}
+
 	> .icon {
 		position: absolute;
 		top: 0;

src/client/components/ui/switch.vue

@@ -129,7 +129,6 @@ export default Vue.extend({
 	> .label {
 		margin-left: 8px;
 		display: block;
-		font-size: 16px;
 		cursor: pointer;
 		transition: inherit;
 		color: var(--fg);

src/client/components/ui/textarea.vue

@@ -85,6 +85,10 @@ export default Vue.extend({
 	margin: 42px 0 32px 0;
 	position: relative;
 
+	&:first-child {
+		margin-top: 16px;
+	}
+
 	&:last-child {
 		margin-bottom: 0;
 	}

src/client/components/user-list.vue

@@ -23,7 +23,7 @@
 			<mk-follow-button class="koudoku-button" v-if="$store.getters.isSignedIn && user.id != $store.state.i.id" :user="user" mini/>
 		</div>
 		<button class="more" :class="{ fetching: moreFetching }" v-if="more" @click="fetchMore()" :disabled="moreFetching">
-			<template v-if="moreFetching"><fa icon="spinner" pulse fixed-width/></template>{{ moreFetching ? $t('@.loading') : $t('@.load-more') }}
+			<template v-if="moreFetching"><fa icon="spinner" pulse fixed-width/></template>{{ moreFetching ? $t('loading') : $t('loadMore') }}
 		</button>
 	</div>
 </mk-container>

src/client/components/user-moderate-dialog.vue

@@ -3,7 +3,7 @@
 	<template #header><mk-user-name :user="user"/></template>
 	<div class="vrcsvlkm">
 		<mk-button @click="resetPassword()" primary>{{ $t('resetPassword') }}</mk-button>
-		<mk-switch v-if="$store.state.i.isAdmin" @change="toggleModerator()" v-model="moderator">{{ $t('moderator') }}</mk-switch>
+		<mk-switch v-if="$store.state.i.isAdmin && !user.isAdmin" @change="toggleModerator()" v-model="moderator">{{ $t('moderator') }}</mk-switch>
 		<mk-switch @change="toggleSilence()" v-model="silenced">{{ $t('silence') }}</mk-switch>
 		<mk-switch @change="toggleSuspend()" v-model="suspended">{{ $t('suspend') }}</mk-switch>
 	</div>

src/client/config.ts

@@ -3,7 +3,7 @@ declare const _VERSION_: string;
 declare const _ENV_: string;
 
 const address = new URL(location.href);
-const siteName = document.querySelector('meta[property="og:site_name"]') as HTMLMetaElement;
+const siteName = (document.querySelector('meta[property="og:site_name"]') as HTMLMetaElement)?.content;
 
 export const host = address.host;
 export const hostname = address.hostname;
@@ -15,4 +15,4 @@ export const langs = _LANGS_;
 export const locale = JSON.parse(localStorage.getItem('locale'));
 export const version = _VERSION_;
 export const env = _ENV_;
-export const instanceName = siteName && siteName.content ? siteName.content : 'Misskey';
+export const instanceName = siteName === 'Misskey' ? null : siteName;

src/client/directives/size.ts

@@ -54,6 +54,8 @@ export default {
 
 		calc();
 
+		vn.context.$on('hook:activated', calc);
+
 		const ro = new ResizeObserver((entries, observer) => {
 			calc();
 		});

src/client/init.ts

@@ -61,20 +61,22 @@ if (localStorage.getItem('theme') == null) {
 }
 
 //#region Detect the user language
-let lang = null;
+let lang = localStorage.getItem('lang');
 
-if (langs.map(x => x[0]).includes(navigator.language)) {
+if (lang == null) {
+	if (langs.map(x => x[0]).includes(navigator.language)) {
 		lang = navigator.language;
-} else {
+	} else {
 		lang = langs.map(x => x[0]).find(x => x.split('-')[0] == navigator.language);
 
 		if (lang == null) {
 			// Fallback
 			lang = 'en-US';
 		}
-}
+	}
 
-localStorage.setItem('lang', lang);
+	localStorage.setItem('lang', lang);
+}
 //#endregion
 
 // Detect the user agent
@@ -134,8 +136,6 @@ document.body.innerHTML = '<div id="app"></div>';
 const os = new MiOS();
 
 os.init(async () => {
-	if (os.store.state.settings.wallpaper) document.documentElement.style.backgroundImage = `url(${os.store.state.settings.wallpaper})`;
-
 	if ('Notification' in window && os.store.getters.isSignedIn) {
 		// 許可を得ていなかったらリクエスト
 		if (Notification.permission === 'default') {
@@ -147,7 +147,7 @@ os.init(async () => {
 		store: os.store,
 		metaInfo: {
 			title: null,
-			titleTemplate: title => title ? `${title} | ${instanceName}` : instanceName
+			titleTemplate: title => title ? `${title} | ${(instanceName || 'Misskey')}` : (instanceName || 'Misskey')
 		},
 		data() {
 			return {

src/client/mios.ts

@@ -42,9 +42,9 @@ export default class MiOS extends EventEmitter {
 	 * @param callback A function that call when initialized
 	 */
 	@autobind
-	public async init(_callback) {
-		const callback = () => {
-			_callback();
+	public async init(callback) {
+		const finish = () => {
+			callback();
 
 			this.store.dispatch('instance/fetch').then(() => {
 				// Init service worker
@@ -59,7 +59,7 @@ export default class MiOS extends EventEmitter {
 			let me = null;
 
 			// Return when not signed in
-			if (token == null) {
+			if (token == null || token === 'null') {
 				return done();
 			}
 
@@ -104,7 +104,7 @@ export default class MiOS extends EventEmitter {
 			this.initStream();
 
 			// Finish init
-			callback();
+			finish();
 		};
 
 		// キャッシュがあったとき
@@ -133,7 +133,7 @@ export default class MiOS extends EventEmitter {
 					this.initStream();
 
 					// Finish init
-					callback();
+					finish();
 				}
 			});
 		}
@@ -227,7 +227,6 @@ export default class MiOS extends EventEmitter {
 			// トークンが再生成されたとき
 			// このままではMisskeyが利用できないので強制的にサインアウトさせる
 			main.on('myTokenRegenerated', () => {
-				alert(locale['common']['my-token-regenerated']);
 				this.signout();
 			});
 		}

src/client/pages/about-misskey.vue

@@ -0,0 +1,79 @@
+<template>
+<div class="znqjceqz">
+	<portal to="title">🍀 {{ $t('aboutMisskey') }}</portal>
+
+	<section class="_card">
+		<div class="_title">🍀 {{ $t('aboutMisskey') }}</div>
+		<div class="_content">
+			<div style="margin-bottom: 1em;">{{ $t('aboutMisskeyText') }}</div>
+			<div>🛠️ {{ $t('misskeyMembers') }}</div>
+			<ul class="members">
+				<li><mk-link url="https://github.com/syuilo" class="at">@syuilo</mk-link></li>
+				<li><mk-link url="https://github.com/AyaMorisawa" class="at">@AyaMorisawa</mk-link></li>
+				<li><mk-link url="https://github.com/mei23" class="at">@mei23</mk-link></li>
+				<li><mk-link url="https://github.com/acid-chicken" class="at">@acid-chicken</mk-link></li>
+				<li><mk-link url="https://github.com/tamaina" class="at">@tamaina</mk-link></li>
+				<li><mk-link url="https://github.com/rinsuki" class="at">@rinsuki</mk-link></li>
+			</ul>
+			<div style="margin-top: 1em;">📦 {{ $t('misskeySource') }}</div>
+			<mk-url url="https://github.com/syuilo/misskey"/>
+			<div style="margin-top: 1em;">🌏 {{ $t('misskeyTranslation') }}</div>
+			<mk-url url="https://crowdin.com/project/misskey"/>
+			<div style="margin-top: 1em;">💴 {{ $t('misskeyDonate') }}</div>
+			<mk-url url="https://www.patreon.com/syuilo"/>
+		</div>
+		<div class="_content">
+			<span><mfm text="<motion>❤</motion>"/> {{ $t('patrons') }}</span>
+			<ul>
+				<li>Gargron</li>
+				<li>Satsuki Yanagi</li>
+				<li>noellabo</li>
+				<li>naga_rus</li>
+				<li>Melilot</li>
+				<li>AureoleArk</li>
+				<li>Peter G.</li>
+				<li>motcha</li>
+				<li>Atsuko Tominaga</li>
+				<li>dansup</li>
+				<li>Nokotaro Takeda</li>
+				<li>YUKIMOCHI</li>
+				<li>nanami kan</li>
+				<li>Hekovic</li>
+				<li>wara</li>
+				<li>Takashi Shibuya</li>
+				<li>Noizeman</li>
+			</ul>
+			<span>{{ $t('morePatrons') }}</span>
+		</div>
+	</section>
+</div>
+</template>
+
+<script lang="ts">
+import Vue from 'vue';
+import { faInfoCircle } from '@fortawesome/free-solid-svg-icons';
+import { version } from '../config';
+import i18n from '../i18n';
+import MkLink from '../components/link.vue';
+
+export default Vue.extend({
+	i18n,
+
+	components: {
+		MkLink
+	},
+
+	metaInfo() {
+		return {
+			title: this.$t('aboutMisskey') as string
+		};
+	},
+
+	data() {
+		return {
+			version,
+			faInfoCircle
+		}
+	},
+});
+</script>

src/client/pages/about.vue

@@ -6,63 +6,18 @@
 	<section class="_card info" v-if="meta">
 		<div class="_title"><fa :icon="faInfoCircle"/> {{ $t('instanceInfo') }}</div>
 		<div class="_content" v-if="meta.description">
-			<div>{{ meta.description }}</div>
+			<div v-html="meta.description"></div>
 		</div>
 		<div class="_content table">
 			<div><b>{{ $t('administrator') }}</b><span>{{ meta.maintainerName }}</span></div>
 			<div><b></b><span>{{ meta.maintainerEmail }}</span></div>
 		</div>
-		<div class="_content table" v-if="stats">
-			<div><b>{{ $t('users') }}</b><span>{{ stats.originalUsersCount | number }}</span></div>
-			<div><b>{{ $t('notes') }}</b><span>{{ stats.originalNotesCount | number }}</span></div>
-		</div>
 		<div class="_content table">
 			<div><b>Misskey</b><span>v{{ version }}</span></div>
 		</div>
 	</section>
 
-	<section class="_card aboutMisskey">
-		<div class="_title"><fa :icon="faInfoCircle"/> {{ $t('aboutMisskey') }}</div>
-		<div class="_content">
-			<div style="margin-bottom: 1em;">{{ $t('aboutMisskeyText') }}</div>
-			<div>{{ $t('misskeyMembers') }}</div>
-			<span class="members">
-				<a href="https://github.com/syuilo" target="_blank" class="_link">@syuilo</a>
-				<a href="https://github.com/AyaMorisawa" target="_blank" class="_link">@AyaMorisawa</a>
-				<a href="https://github.com/mei23" target="_blank" class="_link">@mei23</a>
-				<a href="https://github.com/acid-chicken" target="_blank" class="_link">@acid-chicken</a>
-				<a href="https://github.com/tamaina" target="_blank" class="_link">@tamaina</a>
-				<a href="https://github.com/rinsuki" target="_blank" class="_link">@rinsuki</a>
-			</span>
-			<div style="margin-top: 1em;">{{ $t('misskeySource') }}</div>
-			<mk-url url="https://github.com/syuilo/misskey"/>
-			<div style="margin-top: 1em;">{{ $t('misskeyDonate') }}</div>
-			<mk-url url="https://www.patreon.com/syuilo"/>
-		</div>
-		<div class="_content">
-			<span><mfm text="<motion>❤</motion>"/> {{ $t('patrons') }}</span>
-			<ul>
-				<li>Gargron</li>
-				<li>Satsuki Yanagi</li>
-				<li>noellabo</li>
-				<li>naga_rus</li>
-				<li>Melilot</li>
-				<li>AureoleArk</li>
-				<li>Peter G.</li>
-				<li>motcha</li>
-				<li>Atsuko Tominaga</li>
-				<li>dansup</li>
-				<li>Nokotaro Takeda</li>
-				<li>YUKIMOCHI</li>
-				<li>nanami kan</li>
-				<li>Hekovic</li>
-				<li>wara</li>
-				<li>Takashi Shibuya</li>
-				<li>Noizeman</li>
-			</ul>
-			<span>{{ $t('morePatrons') }}</span>
-		</div>
-	</section>
+	<mk-instance-stats style="margin-top: var(--margin);"/>
 </div>
 </template>
 
@@ -71,6 +26,7 @@ import Vue from 'vue';
 import { faInfoCircle } from '@fortawesome/free-solid-svg-icons';
 import { version } from '../config';
 import i18n from '../i18n';
+import MkInstanceStats from '../components/instance-stats.vue';
 
 export default Vue.extend({
 	i18n,
@@ -81,10 +37,13 @@ export default Vue.extend({
 		};
 	},
 
+	components: {
+		MkInstanceStats
+	},
+
 	data() {
 		return {
 			version,
-			stats: null,
 			serverInfo: null,
 			faInfoCircle
 		}
@@ -95,12 +54,6 @@ export default Vue.extend({
 			return this.$store.state.instance.meta;
 		},
 	},
-
-	created() {
-		this.$root.api('stats').then(res => {
-			this.stats = res;
-		});
-	},
 });
 </script>
 
@@ -117,15 +70,5 @@ export default Vue.extend({
 			}
 		}
 	}
-
-	> .aboutMisskey {
-		> ._content {
-			> .members {
-				> a {
-					margin-right: 0.5em;
-				}
-			}
-		}
-	}
 }
 </style>

src/client/pages/announcements.vue

@@ -8,7 +8,7 @@
 			<div class="_title"><span v-if="$store.getters.isSignedIn && !announcement.isRead">🆕 </span>{{ announcement.title }}</div>
 			<div class="_content">
 				<mfm :text="announcement.text"/>
-				<img v-if="announcement.imageUrl" :src="announcement.imageUrl" alt=""/>
+				<img v-if="announcement.imageUrl" :src="announcement.imageUrl"/>
 			</div>
 			<div class="_footer" v-if="$store.getters.isSignedIn && !announcement.isRead">
 				<mk-button @click="read(announcement)" primary><fa :icon="faCheck"/> {{ $t('gotIt') }}</mk-button>

src/client/pages/doc.vue

@@ -3,9 +3,13 @@
 	<portal to="icon"><fa :icon="faFileAlt"/></portal>
 	<portal to="title">{{ title }}</portal>
 	<main class="_card">
+		<div class="_title"><fa :icon="faFileAlt"/> {{ title }}</div>
 		<div class="_content">
 			<div v-html="body" class="qyqbqfal"></div>
 		</div>
+		<div class="_footer">
+			<mk-link :url="`https://github.com/syuilo/misskey/blob/master/src/docs/${doc}.ja-JP.md`" class="at">{{ $t('docSource') }}</mk-link>
+		</div>
 	</main>
 </div>
 </template>
@@ -14,19 +18,27 @@
 import Vue from 'vue';
 import { faFileAlt } from '@fortawesome/free-solid-svg-icons'
 import MarkdownIt from 'markdown-it';
+import i18n from '../i18n';
 import { url, lang } from '../config';
+import MkLink from '../components/link.vue';
 
 const markdown = MarkdownIt({
 	html: true
 });
 
 export default Vue.extend({
+	i18n,
+
 	metaInfo() {
 		return {
 			title: this.title,
 		};
 	},
 
+	components: {
+		MkLink
+	},
+
 	props: {
 		doc: {
 			type: String,

src/client/pages/follow-requests.vue

@@ -1,6 +1,17 @@
 <template>
-<mk-pagination :pagination="pagination" #default="{items}" class="mk-follow-requests" ref="list">
-	<div class="user _panel" v-for="(req, i) in items" :key="req.id">
+<div>
+	<portal to="icon"><fa :icon="faUserClock"/></portal>
+	<portal to="title">{{ $t('followRequests') }}</portal>
+
+	<mk-pagination :pagination="pagination" class="mk-follow-requests" ref="list">
+		<template #empty>
+			<div class="tkdrhpxr">
+				<img src="https://xn--931a.moe/assets/info.png" class="_ghost"/>
+				<div>{{ $t('noFollowRequests') }}</div>
+			</div>
+		</template>
+		<template #default="{items}">
+			<div class="user _panel" v-for="req in items" :key="req.id">
 				<mk-avatar class="avatar" :user="req.follower"/>
 				<div class="body">
 					<div class="name">
@@ -16,12 +27,14 @@
 					</div>
 				</div>
 			</div>
-</mk-pagination>
+		</template>
+	</mk-pagination>
+</div>
 </template>
 
 <script lang="ts">
 import Vue from 'vue';
-import { faCheck, faTimes } from '@fortawesome/free-solid-svg-icons';
+import { faUserClock, faCheck, faTimes } from '@fortawesome/free-solid-svg-icons';
 import MkPagination from '../components/ui/pagination.vue';
 
 export default Vue.extend({
@@ -41,7 +54,7 @@ export default Vue.extend({
 				endpoint: 'following/requests/list',
 				limit: 10,
 			},
-			faCheck, faTimes
+			faCheck, faTimes, faUserClock
 		};
 	},
 
@@ -62,6 +75,18 @@ export default Vue.extend({
 
 <style lang="scss" scoped>
 .mk-follow-requests {
+	.tkdrhpxr {
+		padding: 32px;
+		text-align: center;
+
+		> img {
+			vertical-align: bottom;
+			height: 128px;
+			margin-bottom: 16px;
+			border-radius: 16px;
+		}
+	}
+
 	> .user {
 		display: flex;
 		padding: 16px;

src/client/pages/index.home.vue

@@ -184,7 +184,7 @@ export default Vue.extend({
 		position: absolute;
 		top: 16px;
 		right: 8px;
-		color: var(--accent);
+		color: var(--indicator);
 		font-size: 12px;
 		animation: blink 1s infinite;
 	}

src/client/pages/index.welcome.entrance.vue

@@ -62,7 +62,9 @@ export default Vue.extend({
 		},
 
 		signup() {
-			this.$root.new(XSignupDialog);
+			this.$root.new(XSignupDialog, {
+				autoSet: true
+			});
 		}
 	}
 });

src/client/pages/index.welcome.vue

@@ -10,7 +10,7 @@
 import Vue from 'vue';
 import XSetup from './index.welcome.setup.vue';
 import XEntrance from './index.welcome.entrance.vue';
-import { getInstanceName } from '../scripts/get-instance-name';
+import { instanceName } from '../config';
 
 export default Vue.extend({
 	components: {
@@ -20,7 +20,7 @@ export default Vue.extend({
 
 	data() {
 		return {
-			instanceName: getInstanceName(),
+			instanceName: instanceName || 'Misskey',
 		}
 	},
 

src/client/pages/instance/announcements.vue

@@ -5,7 +5,7 @@
 	<mk-button @click="add()" primary style="margin: 0 auto 16px auto;"><fa :icon="faPlus"/> {{ $t('add') }}</mk-button>
 	<section class="_card announcements">
 		<div class="_content announcement" v-for="announcement in announcements">
-			<mk-input v-model="announcement.title" style="margin-top: 8px;">
+			<mk-input v-model="announcement.title">
 				<span>{{ $t('title') }}</span>
 			</mk-input>
 			<mk-textarea v-model="announcement.text">

src/client/pages/instance/emojis.vue

@@ -2,10 +2,10 @@
 <div class="mk-instance-emojis">
 	<portal to="icon"><fa :icon="faLaugh"/></portal>
 	<portal to="title">{{ $t('customEmojis') }}</portal>
+
 	<section class="_card local">
 		<div class="_title"><fa :icon="faLaugh"/> {{ $t('customEmojis') }}</div>
 		<div class="_content">
-			<input ref="file" type="file" style="display: none;" @change="onChangeFile"/>
 			<mk-pagination :pagination="pagination" class="emojis" ref="emojis">
 				<template #empty><span>{{ $t('noCustomEmojis') }}</span></template>
 				<template #default="{items}">
@@ -13,20 +13,30 @@
 						<img :src="emoji.url" class="img" :alt="emoji.name"/>
 						<div class="body">
 							<span class="name">{{ emoji.name }}</span>
+							<span class="info">
+								<b class="category">{{ emoji.category }}</b>
+								<span class="aliases">{{ emoji.aliases.join(' ') }}</span>
+							</span>
 						</div>
 					</div>
 				</template>
 			</mk-pagination>
 		</div>
-		<div class="_footer">
-			<mk-button inline primary @click="add()"><fa :icon="faPlus"/> {{ $t('addEmoji') }}</mk-button>
+		<div class="_content" v-if="selected">
+			<mk-input v-model="name"><span>{{ $t('name') }}</span></mk-input>
+			<mk-input v-model="category" :datalist="categories"><span>{{ $t('category') }}</span></mk-input>
+			<mk-input v-model="aliases"><span>{{ $t('tags') }}</span></mk-input>
+			<mk-button inline primary @click="update"><fa :icon="faSave"/> {{ $t('save') }}</mk-button>
 			<mk-button inline :disabled="selected == null" @click="del()"><fa :icon="faTrashAlt"/> {{ $t('delete') }}</mk-button>
 		</div>
+		<div class="_footer">
+			<mk-button inline primary @click="add"><fa :icon="faPlus"/> {{ $t('addEmoji') }}</mk-button>
+		</div>
 	</section>
 	<section class="_card remote">
 		<div class="_title"><fa :icon="faLaugh"/> {{ $t('customEmojisOfRemote') }}</div>
 		<div class="_content">
-			<mk-input v-model="host" :debounce="true" style="margin-top: 0;"><span>{{ $t('host') }}</span></mk-input>
+			<mk-input v-model="host" :debounce="true"><span>{{ $t('host') }}</span></mk-input>
 			<mk-pagination :pagination="remotePagination" class="emojis" ref="remoteEmojis">
 				<template #empty><span>{{ $t('noCustomEmojis') }}</span></template>
 				<template #default="{items}">
@@ -34,7 +44,7 @@
 						<img :src="emoji.url" class="img" :alt="emoji.name"/>
 						<div class="body">
 							<span class="name">{{ emoji.name }}</span>
-							<span class="host">{{ emoji.host }}</span>
+							<span class="info">{{ emoji.host }}</span>
 						</div>
 					</div>
 				</template>
@@ -49,12 +59,13 @@
 
 <script lang="ts">
 import Vue from 'vue';
-import { faPlus } from '@fortawesome/free-solid-svg-icons';
+import { faPlus, faSave } from '@fortawesome/free-solid-svg-icons';
 import { faTrashAlt, faLaugh } from '@fortawesome/free-regular-svg-icons';
 import MkButton from '../../components/ui/button.vue';
 import MkInput from '../../components/ui/input.vue';
 import MkPagination from '../../components/ui/pagination.vue';
-import { apiUrl } from '../../config';
+import { selectFile } from '../../scripts/select-file';
+import { unique } from '../../../prelude/array';
 
 export default Vue.extend({
 	metaInfo() {
@@ -71,9 +82,11 @@ export default Vue.extend({
 
 	data() {
 		return {
-			name: null,
 			selected: null,
 			selectedRemote: null,
+			name: null,
+			category: null,
+			aliases: null,
 			host: '',
 			pagination: {
 				endpoint: 'admin/emoji/list',
@@ -86,52 +99,48 @@ export default Vue.extend({
 					host: this.host ? this.host : null
 				})
 			},
-			faTrashAlt, faPlus, faLaugh
+			faTrashAlt, faPlus, faLaugh, faSave
+		}
+	},
+
+	computed: {
+		categories() {
+			if (this.$store.state.instance.meta) {
+				return unique(this.$store.state.instance.meta.emojis.map((x: any) => x.category || '').filter((x: string) => x !== ''));
+			} else {
+				return [];
+			}
 		}
 	},
 
 	watch: {
 		host() {
 			this.$refs.remoteEmojis.reload();
+		},
+
+		selected() {
+			this.name = this.selected ? this.selected.name : null;
+			this.category = this.selected ? this.selected.category : null;
+			this.aliases = this.selected ? this.selected.aliases.join(' ') : null;
 		}
 	},
 
 	methods: {
-		async add() {
-			const { canceled: canceled, result: name } = await this.$root.dialog({
-				title: this.$t('emojiName'),
-				input: true
-			});
-			if (canceled) return;
-
-			this.name = name;
-
-			(this.$refs.file as any).click();
-		},
-
-		onChangeFile() {
-			const [file] = Array.from((this.$refs.file as any).files);
-			if (file == null) return;
-			
-			const data = new FormData();
-			data.append('file', file);
-			data.append('name', this.name);
-			data.append('i', this.$store.state.i.token);
+		async add(e) {
+			const files = await selectFile(this, e.currentTarget || e.target, null, true);
 
 			const dialog = this.$root.dialog({
 				type: 'waiting',
-				text: this.$t('uploading') + '...',
+				text: this.$t('doing') + '...',
 				showOkButton: false,
 				showCancelButton: false,
 				cancelableByBgClick: false
 			});
 			
-			fetch(apiUrl + '/admin/emoji/add', {
-				method: 'POST',
-				body: data
-			})
-			.then(response => response.json())
-			.then(f => {
+			Promise.all(files.map(file => this.$root.api('admin/emoji/add', {
+				fileId: file.id,
+			})))
+			.then(() => {
 				this.$refs.emojis.reload();
 				this.$root.dialog({
 					type: 'success',
@@ -143,6 +152,22 @@ export default Vue.extend({
 			});
 		},
 
+		async update() {
+			await this.$root.api('admin/emoji/update', {
+				id: this.selected.id,
+				name: this.name,
+				category: this.category,
+				aliases: this.aliases.split(' '),
+			});
+
+			this.$root.dialog({
+				type: 'success',
+				iconOnly: true, autoClose: true
+			});
+
+			this.$refs.emojis.reload();
+		},
+
 		async del() {
 			const { canceled } = await this.$root.dialog({
 				type: 'warning',
@@ -207,6 +232,18 @@ export default Vue.extend({
 						> .name {
 							display: block;
 						}
+
+						> .info {
+							opacity: 0.5;
+
+							> .category {
+								margin-right: 16px;
+							}
+
+							> .aliases {
+								font-style: oblique;
+							}
+						}
 					}
 				}
 			}
@@ -241,7 +278,7 @@ export default Vue.extend({
 							display: block;
 						}
 
-						> .host {
+						> .info {
 							opacity: 0.5;
 						}
 					}

src/client/pages/instance/index.vue

@@ -1,165 +1,58 @@
 <template>
-<div v-if="meta" class="mk-instance-page">
+<div v-if="meta" class="xhexznfu">
 	<portal to="icon"><fa :icon="faServer"/></portal>
 	<portal to="title">{{ $t('instance') }}</portal>
 
-	<section class="_card info">
-		<div class="_title"><fa :icon="faInfoCircle"/> {{ $t('basicInfo') }}</div>
-		<div class="_content">
-			<mk-input v-model="name" style="margin-top: 8px;">{{ $t('instanceName') }}</mk-input>
-			<mk-textarea v-model="description">{{ $t('instanceDescription') }}</mk-textarea>
-			<mk-input v-model="iconUrl"><template #icon><fa :icon="faLink"/></template>{{ $t('iconUrl') }}</mk-input>
-			<mk-input v-model="bannerUrl"><template #icon><fa :icon="faLink"/></template>{{ $t('bannerUrl') }}</mk-input>
-			<mk-input v-model="tosUrl"><template #icon><fa :icon="faLink"/></template>{{ $t('tosUrl') }}</mk-input>
-			<mk-input v-model="maintainerName">{{ $t('maintainerName') }}</mk-input>
-			<mk-input v-model="maintainerEmail" type="email"><template #icon><fa :icon="faEnvelope"/></template>{{ $t('maintainerEmail') }}</mk-input>
+	<mk-instance-stats style="margin-bottom: var(--margin);"/>
+
+	<section class="_card chart">
+		<div class="_title"><fa :icon="faMicrochip"/> {{ $t('cpuAndMemory') }}</div>
+		<div class="_content" style="margin-top: -8px; margin-bottom: -12px;">
+			<canvas ref="cpumem"></canvas>
+		</div>
+		<div class="_content" v-if="serverInfo">
+			<div class="table">
+				<div class="row">
+					<div class="cell"><div class="label">CPU</div>{{ serverInfo.cpu.model }}</div>
+				</div>
+				<div class="row">
+					<div class="cell"><div class="label">MEM total</div>{{ serverInfo.mem.total | bytes }}</div>
+					<div class="cell"><div class="label">MEM used</div>{{ memUsage | bytes }} ({{ (memUsage / serverInfo.mem.total * 100).toFixed(0) }}%)</div>
+					<div class="cell"><div class="label">MEM free</div>{{ serverInfo.mem.total - memUsage | bytes }} ({{ ((serverInfo.mem.total - memUsage) / serverInfo.mem.total * 100).toFixed(0) }}%)</div>
+				</div>
+			</div>
+		</div>
+	</section>
+	<section class="_card chart">
+		<div class="_title"><fa :icon="faHdd"/> {{ $t('disk') }}</div>
+		<div class="_content" style="margin-top: -8px; margin-bottom: -12px;">
+			<canvas ref="disk"></canvas>
+		</div>
+		<div class="_content" v-if="serverInfo">
+			<div class="table">
+				<div class="row">
+					<div class="cell"><div class="label">Disk total</div>{{ serverInfo.fs.total | bytes }}</div>
+					<div class="cell"><div class="label">Disk used</div>{{ serverInfo.fs.used | bytes }} ({{ (serverInfo.fs.used / serverInfo.fs.total * 100).toFixed(0) }}%)</div>
+					<div class="cell"><div class="label">Disk free</div>{{ serverInfo.fs.total - serverInfo.fs.used | bytes }} ({{ ((serverInfo.fs.total - serverInfo.fs.used) / serverInfo.fs.total * 100).toFixed(0) }}%)</div>
+				</div>
+			</div>
+		</div>
+	</section>
+	<section class="_card chart">
+		<div class="_title"><fa :icon="faExchangeAlt"/> {{ $t('network') }}</div>
+		<div class="_content" style="margin-top: -8px; margin-bottom: -12px;">
+			<canvas ref="net"></canvas>
+		</div>
+		<div class="_content" v-if="serverInfo">
+			<div class="table">
+				<div class="row">
+					<div class="cell"><div class="label">Interface</div>{{ serverInfo.net.interface }}</div>
+				</div>
 			</div>
-		<div class="_footer">
-			<mk-button primary @click="save(true)"><fa :icon="faSave"/> {{ $t('save') }}</mk-button>
 		</div>
 	</section>
 
 	<section class="_card info">
-		<div class="_content">
-			<mk-input v-model="maxNoteTextLength" type="number" :save="() => save()" style="margin:0;"><template #icon><fa :icon="faPencilAlt"/></template>{{ $t('maxNoteTextLength') }}</mk-input>
-		</div>
-		<div class="_content">
-			<mk-switch v-model="enableLocalTimeline" @change="save()">{{ $t('enableLocalTimeline') }}</mk-switch>
-			<mk-switch v-model="enableGlobalTimeline" @change="save()">{{ $t('enableGlobalTimeline') }}</mk-switch>
-			<mk-info>{{ $t('disablingTimelinesInfo') }}</mk-info>
-		</div>
-	</section>
-
-	<section class="_card info">
-		<div class="_title"><fa :icon="faUser"/> {{ $t('registration') }}</div>
-		<div class="_content">
-			<mk-switch v-model="enableRegistration" @change="save()">{{ $t('enableRegistration') }}</mk-switch>
-			<mk-button v-if="!enableRegistration" @click="invite">{{ $t('invite') }}</mk-button>
-		</div>
-	</section>
-
-	<section class="_card">
-		<div class="_title"><fa :icon="faShieldAlt"/> {{ $t('recaptcha') }}</div>
-		<div class="_content">
-			<mk-switch v-model="enableRecaptcha">{{ $t('enableRecaptcha') }}</mk-switch>
-			<template v-if="enableRecaptcha">
-				<mk-info>{{ $t('recaptcha-info') }}</mk-info>
-				<mk-info warn>{{ $t('recaptcha-info2') }}</mk-info>
-				<mk-input v-model="recaptchaSiteKey" :disabled="!enableRecaptcha"><template #icon><fa :icon="faKey"/></template>{{ $t('recaptchaSiteKey') }}</mk-input>
-				<mk-input v-model="recaptchaSecretKey" :disabled="!enableRecaptcha"><template #icon><fa :icon="faKey"/></template>{{ $t('recaptchaSecretKey') }}</mk-input>
-			</template>
-		</div>
-		<div class="_content" v-if="enableRecaptcha && recaptchaSiteKey">
-			<header>{{ $t('preview') }}</header>
-			<div ref="recaptcha" style="margin: 16px 0 0 0;" :key="recaptchaSiteKey"></div>
-		</div>
-		<div class="_footer">
-			<mk-button primary @click="save(true)"><fa :icon="faSave"/> {{ $t('save') }}</mk-button>
-		</div>
-	</section>
-
-	<section class="_card">
-		<div class="_title"><fa :icon="faBolt"/> {{ $t('serviceworker') }}</div>
-		<div class="_content">
-			<mk-switch v-model="enableServiceWorker">{{ $t('enableServiceworker') }}<template #desc>{{ $t('serviceworker-info') }}</template></mk-switch>
-			<template v-if="enableServiceWorker">
-				<mk-info>{{ $t('vapid-info') }}<br><code>npm i web-push -g<br>web-push generate-vapid-keys</code></mk-info>
-				<mk-horizon-group inputs class="fit-bottom">
-					<mk-input v-model="swPublicKey" :disabled="!enableServiceWorker"><template #icon><fa :icon="faKey"/></template>{{ $t('vapid-publickey') }}</mk-input>
-					<mk-input v-model="swPrivateKey" :disabled="!enableServiceWorker"><template #icon><fa :icon="faKey"/></template>{{ $t('vapid-privatekey') }}</mk-input>
-				</mk-horizon-group>
-			</template>
-		</div>
-		<div class="_footer">
-			<mk-button primary @click="save(true)"><fa :icon="faSave"/> {{ $t('save') }}</mk-button>
-		</div>
-	</section>
-
-	<section class="_card">
-		<div class="_title"><fa :icon="faThumbtack"/> {{ $t('pinnedUsers') }}</div>
-		<div class="_content">
-			<mk-textarea v-model="pinnedUsers" style="margin-top: 0;">
-				<template #desc>{{ $t('pinnedUsersDescription') }} <button class="_textButton" @click="addPinUser">{{ $t('addUser') }}</button></template>
-			</mk-textarea>
-		</div>
-		<div class="_footer">
-			<mk-button primary @click="save(true)"><fa :icon="faSave"/> {{ $t('save') }}</mk-button>
-		</div>
-	</section>
-
-	<section class="_card">
-		<div class="_title"><fa :icon="faCloud"/> {{ $t('files') }}</div>
-		<div class="_content">
-			<mk-switch v-model="cacheRemoteFiles">{{ $t('cacheRemoteFiles') }}<template #desc>{{ $t('cacheRemoteFilesDescription') }}</template></mk-switch>
-			<mk-switch v-model="proxyRemoteFiles">{{ $t('proxyRemoteFiles') }}<template #desc>{{ $t('proxyRemoteFilesDescription') }}</template></mk-switch>
-			<mk-input v-model="localDriveCapacityMb" type="number">{{ $t('driveCapacityPerLocalAccount') }}<template #suffix>MB</template><template #desc>{{ $t('inMb') }}</template></mk-input>
-			<mk-input v-model="remoteDriveCapacityMb" type="number" :disabled="!cacheRemoteFiles" style="margin-bottom: 0;">{{ $t('driveCapacityPerRemoteAccount') }}<template #suffix>MB</template><template #desc>{{ $t('inMb') }}</template></mk-input>
-		</div>
-		<div class="_footer">
-			<mk-button primary @click="save(true)"><fa :icon="faSave"/> {{ $t('save') }}</mk-button>
-		</div>
-	</section>
-
-	<section class="_card">
-		<div class="_title"><fa :icon="faGhost"/> {{ $t('proxyAccount') }}</div>
-		<div class="_content">
-			<mk-input :value="proxyAccount ? proxyAccount.username : null" style="margin: 0;" disabled><template #prefix>@</template>{{ $t('proxyAccount') }}<template #desc>{{ $t('proxyAccountDescription') }}</template></mk-input>
-			<mk-button primary @click="chooseProxyAccount">{{ $t('chooseProxyAccount') }}</mk-button>
-		</div>
-	</section>
-
-	<section class="_card">
-		<div class="_title"><fa :icon="faBan"/> {{ $t('blockedInstances') }}</div>
-		<div class="_content">
-			<mk-textarea v-model="blockedHosts" style="margin-top: 0;">
-				<template #desc>{{ $t('blockedInstancesDescription') }}</template>
-			</mk-textarea>
-		</div>
-		<div class="_footer">
-			<mk-button primary @click="save(true)"><fa :icon="faSave"/> {{ $t('save') }}</mk-button>
-		</div>
-	</section>
-
-	<section class="_card">
-		<div class="_title"><fa :icon="faShareAlt"/> {{ $t('integration') }}</div>
-		<div class="_content">
-			<header><fa :icon="faTwitter"/> Twitter</header>
-			<mk-switch v-model="enableTwitterIntegration">{{ $t('enable') }}</mk-switch>
-			<template v-if="enableTwitterIntegration">
-				<mk-info>Callback URL: {{ `${url}/api/tw/cb` }}</mk-info>
-				<mk-input v-model="twitterConsumerKey" :disabled="!enableTwitterIntegration"><template #icon><fa :icon="faKey"/></template>Consumer Key</mk-input>
-				<mk-input v-model="twitterConsumerSecret" :disabled="!enableTwitterIntegration"><template #icon><fa :icon="faKey"/></template>Consumer Secret</mk-input>
-			</template>
-		</div>
-		<div class="_content">
-			<header><fa :icon="faGithub"/> GitHub</header>
-			<mk-switch v-model="enableGithubIntegration">{{ $t('enable') }}</mk-switch>
-			<template v-if="enableGithubIntegration">
-				<mk-info>Callback URL: {{ `${url}/api/gh/cb` }}</mk-info>
-				<mk-input v-model="githubClientId" :disabled="!enableGithubIntegration"><template #icon><fa :icon="faKey"/></template>Client ID</mk-input>
-				<mk-input v-model="githubClientSecret" :disabled="!enableGithubIntegration"><template #icon><fa :icon="faKey"/></template>Client Secret</mk-input>
-			</template>
-		</div>
-		<div class="_content">
-			<header><fa :icon="faDiscord"/> Discord</header>
-			<mk-switch v-model="enableDiscordIntegration">{{ $t('enable') }}</mk-switch>
-			<template v-if="enableDiscordIntegration">
-				<mk-info>Callback URL: {{ `${url}/api/dc/cb` }}</mk-info>
-				<mk-input v-model="discordClientId" :disabled="!enableDiscordIntegration"><template #icon><fa :icon="faKey"/></template>Client ID</mk-input>
-				<mk-input v-model="discordClientSecret" :disabled="!enableDiscordIntegration"><template #icon><fa :icon="faKey"/></template>Client Secret</mk-input>
-			</template>
-		</div>
-		<div class="_footer">
-			<mk-button primary @click="save(true)"><fa :icon="faSave"/> {{ $t('save') }}</mk-button>
-		</div>
-	</section>
-
-	<section class="_card info">
-		<div class="_title"><fa :icon="faInfoCircle"/> {{ $t('instanceInfo') }}</div>
-		<div class="_content table" v-if="stats">
-			<div><b>{{ $t('users') }}</b><span>{{ stats.originalUsersCount | number }}</span></div>
-			<div><b>{{ $t('notes') }}</b><span>{{ stats.originalNotesCount | number }}</span></div>
-		</div>
 		<div class="_content table">
 			<div><b>Misskey</b><span>v{{ version }}</span></div>
 		</div>
@@ -174,18 +67,19 @@
 
 <script lang="ts">
 import Vue from 'vue';
-import { faPencilAlt, faShareAlt, faGhost, faCog, faPlus, faCloud, faInfoCircle, faBan, faSave, faServer, faLink, faThumbtack, faUser, faShieldAlt, faKey, faBolt } from '@fortawesome/free-solid-svg-icons';
-import { faTrashAlt, faEnvelope } from '@fortawesome/free-regular-svg-icons';
-import { faTwitter, faDiscord, faGithub } from '@fortawesome/free-brands-svg-icons';
-import MkButton from '../../components/ui/button.vue';
-import MkInput from '../../components/ui/input.vue';
-import MkTextarea from '../../components/ui/textarea.vue';
-import MkSwitch from '../../components/ui/switch.vue';
-import MkInfo from '../../components/ui/info.vue';
-import MkUserSelect from '../../components/user-select.vue';
+import { faServer, faExchangeAlt, faMicrochip, faHdd } from '@fortawesome/free-solid-svg-icons';
+import Chart from 'chart.js';
+import MkInstanceStats from '../../components/instance-stats.vue';
 import { version, url } from '../../config';
 import i18n from '../../i18n';
-import getAcct from '../../../misc/acct/render';
+
+const alpha = (hex, a) => {
+	const result = /^#?([a-f\d]{2})([a-f\d]{2})([a-f\d]{2})$/i.exec(hex)!;
+	const r = parseInt(result[1], 16);
+	const g = parseInt(result[2], 16);
+	const b = parseInt(result[3], 16);
+	return `rgba(${r}, ${g}, ${b}, ${a})`;
+};
 
 export default Vue.extend({
 	i18n,
@@ -197,11 +91,7 @@ export default Vue.extend({
 	},
 
 	components: {
-		MkButton,
-		MkInput,
-		MkTextarea,
-		MkSwitch,
-		MkInfo,
+		MkInstanceStats,
 	},
 
 	data() {
@@ -210,41 +100,11 @@ export default Vue.extend({
 			url,
 			stats: null,
 			serverInfo: null,
-			proxyAccount: null,
-			proxyAccountId: null,
-			cacheRemoteFiles: false,
-			proxyRemoteFiles: false,
-			localDriveCapacityMb: 0,
-			remoteDriveCapacityMb: 0,
-			blockedHosts: '',
-			pinnedUsers: '',
-			maintainerName: null,
-			maintainerEmail: null,
-			name: null,
-			description: null,
-			tosUrl: null,
-			bannerUrl: null,
-			iconUrl: null,
-			maxNoteTextLength: 0,
-			enableRegistration: false,
-			enableLocalTimeline: false,
-			enableGlobalTimeline: false,
-			enableRecaptcha: false,
-			recaptchaSiteKey: null,
-			recaptchaSecretKey: null,
-			enableServiceWorker: false,
-			swPublicKey: null,
-			swPrivateKey: null,
-			enableTwitterIntegration: false,
-			twitterConsumerKey: null,
-			twitterConsumerSecret: null,
-			enableGithubIntegration: false,
-			githubClientId: null,
-			githubClientSecret: null,
-			enableDiscordIntegration: false,
-			discordClientId: null,
-			discordClientSecret: null,
-			faPencilAlt, faTwitter, faDiscord, faGithub, faShareAlt, faTrashAlt, faGhost, faCog, faPlus, faCloud, faInfoCircle, faBan, faSave, faServer, faLink, faEnvelope, faThumbtack, faUser, faShieldAlt, faKey, faBolt
+			connection: null,
+			memUsage: 0,
+			chartCpuMem: null,
+			chartNet: null,
+			faServer, faExchangeAlt, faMicrochip, faHdd
 		}
 	},
 
@@ -254,153 +114,313 @@ export default Vue.extend({
 		},
 	},
 
-	created() {
-		this.name = this.meta.name;
-		this.description = this.meta.description;
-		this.tosUrl = this.meta.tosUrl;
-		this.bannerUrl = this.meta.bannerUrl;
-		this.iconUrl = this.meta.iconUrl;
-		this.maintainerName = this.meta.maintainerName;
-		this.maintainerEmail = this.meta.maintainerEmail;
-		this.maxNoteTextLength = this.meta.maxNoteTextLength;
-		this.enableRegistration = !this.meta.disableRegistration;
-		this.enableLocalTimeline = !this.meta.disableLocalTimeline;
-		this.enableGlobalTimeline = !this.meta.disableGlobalTimeline;
-		this.enableRecaptcha = this.meta.enableRecaptcha;
-		this.recaptchaSiteKey = this.meta.recaptchaSiteKey;
-		this.recaptchaSecretKey = this.meta.recaptchaSecretKey;
-		this.proxyAccountId = this.meta.proxyAccountId;
-		this.cacheRemoteFiles = this.meta.cacheRemoteFiles;
-		this.proxyRemoteFiles = this.meta.proxyRemoteFiles;
-		this.localDriveCapacityMb = this.meta.driveCapacityPerLocalUserMb;
-		this.remoteDriveCapacityMb = this.meta.driveCapacityPerRemoteUserMb;
-		this.blockedHosts = this.meta.blockedHosts.join('\n');
-		this.pinnedUsers = this.meta.pinnedUsers.join('\n');
-		this.enableServiceWorker = this.meta.enableServiceWorker;
-		this.swPublicKey = this.meta.swPublickey;
-		this.swPrivateKey = this.meta.swPrivateKey;
-		this.enableTwitterIntegration = this.meta.enableTwitterIntegration;
-		this.twitterConsumerKey = this.meta.twitterConsumerKey;
-		this.twitterConsumerSecret = this.meta.twitterConsumerSecret;
-		this.enableGithubIntegration = this.meta.enableGithubIntegration;
-		this.githubClientId = this.meta.githubClientId;
-		this.githubClientSecret = this.meta.githubClientSecret;
-		this.enableDiscordIntegration = this.meta.enableDiscordIntegration;
-		this.discordClientId = this.meta.discordClientId;
-		this.discordClientSecret = this.meta.discordClientSecret;
+	mounted() {
+		Chart.defaults.global.defaultFontColor = getComputedStyle(document.documentElement).getPropertyValue('--fg');
 
-		if (this.proxyAccountId) {
-			this.$root.api('users/show', { userId: this.proxyAccountId }).then(proxyAccount => {
-				this.proxyAccount = proxyAccount;
-			});
+		this.chartCpuMem = new Chart(this.$refs.cpumem, {
+			type: 'line',
+			data: {
+				labels: [],
+				datasets: [{
+					label: 'CPU',
+					pointRadius: 0,
+					lineTension: 0,
+					borderWidth: 2,
+					borderColor: '#86b300',
+					backgroundColor: alpha('#86b300', 0.1),
+					data: []
+				}, {
+					label: 'MEM (active)',
+					pointRadius: 0,
+					lineTension: 0,
+					borderWidth: 2,
+					borderColor: '#935dbf',
+					backgroundColor: alpha('#935dbf', 0.02),
+					data: []
+				}, {
+					label: 'MEM (used)',
+					pointRadius: 0,
+					lineTension: 0,
+					borderWidth: 2,
+					borderColor: '#935dbf',
+					borderDash: [5, 5],
+					fill: false,
+					data: []
+				}]
+			},
+			options: {
+				aspectRatio: 3,
+				layout: {
+					padding: {
+						left: 0,
+						right: 0,
+						top: 8,
+						bottom: 0
+					}
+				},
+				legend: {
+					position: 'bottom',
+					labels: {
+						boxWidth: 16,
+					}
+				},
+				scales: {
+					xAxes: [{
+						gridLines: {
+							display: false
+						},
+						ticks: {
+							display: false
+						}
+					}],
+					yAxes: [{
+						position: 'right',
+						ticks: {
+							display: false,
+							max: 100
+						}
+					}]
+				},
+				tooltips: {
+					intersect: false,
+					mode: 'index',
+				}
 			}
-
-		this.$root.api('admin/server-info').then(res => {
-			this.serverInfo = res;
 		});
 
-		this.$root.api('stats').then(res => {
-			this.stats = res;
+		this.chartNet = new Chart(this.$refs.net, {
+			type: 'line',
+			data: {
+				labels: [],
+				datasets: [{
+					label: 'In',
+					pointRadius: 0,
+					lineTension: 0,
+					borderWidth: 2,
+					borderColor: '#94a029',
+					backgroundColor: alpha('#94a029', 0.1),
+					data: []
+				}, {
+					label: 'Out',
+					pointRadius: 0,
+					lineTension: 0,
+					borderWidth: 2,
+					borderColor: '#ff9156',
+					backgroundColor: alpha('#ff9156', 0.1),
+					data: []
+				}]
+			},
+			options: {
+				aspectRatio: 3,
+				layout: {
+					padding: {
+						left: 0,
+						right: 0,
+						top: 8,
+						bottom: 0
+					}
+				},
+				legend: {
+					position: 'bottom',
+					labels: {
+						boxWidth: 16,
+					}
+				},
+				scales: {
+					xAxes: [{
+						gridLines: {
+							display: false
+						},
+						ticks: {
+							display: false
+						}
+					}],
+					yAxes: [{
+						position: 'right',
+						ticks: {
+							display: false,
+						}
+					}]
+				},
+				tooltips: {
+					intersect: false,
+					mode: 'index',
+				}
+			}
+		});
+
+		this.chartDisk = new Chart(this.$refs.disk, {
+			type: 'line',
+			data: {
+				labels: [],
+				datasets: [{
+					label: 'Read',
+					pointRadius: 0,
+					lineTension: 0,
+					borderWidth: 2,
+					borderColor: '#94a029',
+					backgroundColor: alpha('#94a029', 0.1),
+					data: []
+				}, {
+					label: 'Write',
+					pointRadius: 0,
+					lineTension: 0,
+					borderWidth: 2,
+					borderColor: '#ff9156',
+					backgroundColor: alpha('#ff9156', 0.1),
+					data: []
+				}]
+			},
+			options: {
+				aspectRatio: 3,
+				layout: {
+					padding: {
+						left: 0,
+						right: 0,
+						top: 8,
+						bottom: 0
+					}
+				},
+				legend: {
+					position: 'bottom',
+					labels: {
+						boxWidth: 16,
+					}
+				},
+				scales: {
+					xAxes: [{
+						gridLines: {
+							display: false
+						},
+						ticks: {
+							display: false
+						}
+					}],
+					yAxes: [{
+						position: 'right',
+						ticks: {
+							display: false,
+						}
+					}]
+				},
+				tooltips: {
+					intersect: false,
+					mode: 'index',
+				}
+			}
+		});
+
+		this.$root.api('admin/server-info', {}).then(res => {
+			this.serverInfo = res;
+
+			this.connection = this.$root.stream.useSharedConnection('serverStats');
+			this.connection.on('stats', this.onStats);
+			this.connection.on('statsLog', this.onStatsLog);
+			this.connection.send('requestLog', {
+				id: Math.random().toString().substr(2, 8),
+				length: 150
+			});
 		});
 	},
 
-	mounted() {
-		const renderRecaptchaPreview = () => {
-			if (!(window as any).grecaptcha) return;
-			if (!this.$refs.recaptcha) return;
-			if (!this.recaptchaSiteKey) return;
-			(window as any).grecaptcha.render(this.$refs.recaptcha, {
-				sitekey: this.recaptchaSiteKey
-			});
-		};
-		window.onRecaotchaLoad = () => {
-			renderRecaptchaPreview();
-		};
-		const head = document.getElementsByTagName('head')[0];
-		const script = document.createElement('script');
-		script.setAttribute('src', 'https://www.google.com/recaptcha/api.js?onload=onRecaotchaLoad');
-		head.appendChild(script);
-		this.$watch('enableRecaptcha', () => {
-			renderRecaptchaPreview();
-		});
-		this.$watch('recaptchaSiteKey', () => {
-			renderRecaptchaPreview();
-		});
+	beforeDestroy() {
+		this.connection.off('stats', this.onStats);
+		this.connection.off('statsLog', this.onStatsLog);
+		this.connection.dispose();
 	},
 
 	methods: {
-		addPinUser() {
-			this.$root.new(MkUserSelect, {}).$once('selected', user => {
-				this.pinnedUsers = this.pinnedUsers.trim();
-				this.pinnedUsers += '\n@' + getAcct(user);
-				this.pinnedUsers = this.pinnedUsers.trim();
-			});
-		},
+		onStats(stats) {
+			const cpu = (stats.cpu * 100).toFixed(0);
+			const memActive = (stats.mem.active / this.serverInfo.mem.total * 100).toFixed(0);
+			const memUsed = (stats.mem.used / this.serverInfo.mem.total * 100).toFixed(0);
+			this.memUsage = stats.mem.active;
 
-		chooseProxyAccount() {
-			this.$root.new(MkUserSelect, {}).$once('selected', user => {
-				this.proxyAccount = user;
-				this.proxyAccountId = user.id;
-				this.save(true);
-			});
-		},
-
-		save(withDialog = false) {
-			this.$root.api('admin/update-meta', {
-				name: this.name,
-				description: this.description,
-				tosUrl: this.tosUrl,
-				bannerUrl: this.bannerUrl,
-				iconUrl: this.iconUrl,
-				maintainerName: this.maintainerName,
-				maintainerEmail: this.maintainerEmail,
-				maxNoteTextLength: this.maxNoteTextLength,
-				disableRegistration: !this.enableRegistration,
-				disableLocalTimeline: !this.enableLocalTimeline,
-				disableGlobalTimeline: !this.enableGlobalTimeline,
-				enableRecaptcha: this.enableRecaptcha,
-				recaptchaSiteKey: this.recaptchaSiteKey,
-				recaptchaSecretKey: this.recaptchaSecretKey,
-				proxyAccountId: this.proxyAccountId,
-				cacheRemoteFiles: this.cacheRemoteFiles,
-				proxyRemoteFiles: this.proxyRemoteFiles,
-				localDriveCapacityMb: parseInt(this.localDriveCapacityMb, 10),
-				remoteDriveCapacityMb: parseInt(this.remoteDriveCapacityMb, 10),
-				blockedHosts: this.blockedHosts.split('\n') || [],
-				pinnedUsers: this.pinnedUsers ? this.pinnedUsers.split('\n') : [],
-				enableServiceWorker: this.enableServiceWorker,
-				swPublicKey: this.swPublicKey,
-				swPrivateKey: this.swPrivateKey,
-				enableTwitterIntegration: this.enableTwitterIntegration,
-				twitterConsumerKey: this.twitterConsumerKey,
-				twitterConsumerSecret: this.twitterConsumerSecret,
-				enableGithubIntegration: this.enableGithubIntegration,
-				githubClientId: this.githubClientId,
-				githubClientSecret: this.githubClientSecret,
-				enableDiscordIntegration: this.enableDiscordIntegration,
-				discordClientId: this.discordClientId,
-				discordClientSecret: this.discordClientSecret,
-			}).then(() => {
-				this.$store.dispatch('instance/fetch');
-				if (withDialog) {
-					this.$root.dialog({
-						type: 'success',
-						iconOnly: true, autoClose: true
-					});
+			this.chartCpuMem.data.labels.push('');
+			this.chartCpuMem.data.datasets[0].data.push(cpu);
+			this.chartCpuMem.data.datasets[1].data.push(memActive);
+			this.chartCpuMem.data.datasets[2].data.push(memUsed);
+			this.chartNet.data.labels.push('');
+			this.chartNet.data.datasets[0].data.push(stats.net.rx);
+			this.chartNet.data.datasets[1].data.push(stats.net.tx);
+			this.chartDisk.data.labels.push('');
+			this.chartDisk.data.datasets[0].data.push(stats.fs.r);
+			this.chartDisk.data.datasets[1].data.push(stats.fs.w);
+			if (this.chartCpuMem.data.datasets[0].data.length > 150) {
+				this.chartCpuMem.data.labels.shift();
+				this.chartCpuMem.data.datasets[0].data.shift();
+				this.chartCpuMem.data.datasets[1].data.shift();
+				this.chartCpuMem.data.datasets[2].data.shift();
+				this.chartNet.data.labels.shift();
+				this.chartNet.data.datasets[0].data.shift();
+				this.chartNet.data.datasets[1].data.shift();
+				this.chartDisk.data.labels.shift();
+				this.chartDisk.data.datasets[0].data.shift();
+				this.chartDisk.data.datasets[1].data.shift();
+			}
+			this.chartCpuMem.update();
+			this.chartNet.update();
+			this.chartDisk.update();
+		},
+
+		onStatsLog(statsLog) {
+			for (const stats of statsLog.reverse()) {
+				this.onStats(stats);
 			}
-			}).catch(e => {
-				this.$root.dialog({
-					type: 'error',
-					text: e
-				});
-			});
 		}
 	}
 });
 </script>
 
 <style lang="scss" scoped>
-.mk-instance-page {
+.xhexznfu {
+	> .stats {
+		display: flex;
+		justify-content: space-between;
+		flex-wrap: wrap;
+		margin: calc(0px - var(--margin) / 2);
+		margin-bottom: calc(var(--margin) / 2);
+
+		> div {
+			flex: 1 0 213px;
+			margin: calc(var(--margin) / 2);
+			box-sizing: border-box;
+			padding: 16px;
+		}
+	}
+
+	> .chart {
+		> ._content {
+			> .table {
+				> .row {
+					display: flex;
+
+					&:not(:last-child) {
+						margin-bottom: 16px;
+
+						@media (max-width: 500px) {
+							margin-bottom: 8px;
+						}
+					}
+
+					> .cell {
+						flex: 1;
+
+						> .label {
+							font-size: 80%;
+							opacity: 0.7;
+
+							> .icon {
+								margin-right: 4px;
+								display: none;
+							}
+						}
+					}
+				}
+			}
+		}
+	}
+
 	> .info {
 		> .table {
 			> div {

src/client/pages/instance/monitor.vue

@@ -1,381 +0,0 @@
-<template>
-<div class="mk-instance-monitor">
-	<section class="_card">
-		<div class="_title"><fa :icon="faMicrochip"/> {{ $t('cpuAndMemory') }}</div>
-		<div class="_content" style="margin-top: -8px; margin-bottom: -12px;">
-			<canvas ref="cpumem"></canvas>
-		</div>
-		<div class="_content" v-if="serverInfo">
-			<div class="table">
-				<div class="row">
-					<div class="cell"><div class="label">CPU</div>{{ serverInfo.cpu.model }}</div>
-				</div>
-				<div class="row">
-					<div class="cell"><div class="label">MEM total</div>{{ serverInfo.mem.total | bytes }}</div>
-					<div class="cell"><div class="label">MEM used</div>{{ memUsage | bytes }} ({{ (memUsage / serverInfo.mem.total * 100).toFixed(0) }}%)</div>
-					<div class="cell"><div class="label">MEM free</div>{{ serverInfo.mem.total - memUsage | bytes }} ({{ ((serverInfo.mem.total - memUsage) / serverInfo.mem.total * 100).toFixed(0) }}%)</div>
-				</div>
-			</div>
-		</div>
-	</section>
-	<section class="_card">
-		<div class="_title"><fa :icon="faHdd"/> {{ $t('disk') }}</div>
-		<div class="_content" style="margin-top: -8px; margin-bottom: -12px;">
-			<canvas ref="disk"></canvas>
-		</div>
-		<div class="_content" v-if="serverInfo">
-			<div class="table">
-				<div class="row">
-					<div class="cell"><div class="label">Disk total</div>{{ serverInfo.fs.total | bytes }}</div>
-					<div class="cell"><div class="label">Disk used</div>{{ serverInfo.fs.used | bytes }} ({{ (serverInfo.fs.used / serverInfo.fs.total * 100).toFixed(0) }}%)</div>
-					<div class="cell"><div class="label">Disk free</div>{{ serverInfo.fs.total - serverInfo.fs.used | bytes }} ({{ ((serverInfo.fs.total - serverInfo.fs.used) / serverInfo.fs.total * 100).toFixed(0) }}%)</div>
-				</div>
-			</div>
-		</div>
-	</section>
-	<section class="_card">
-		<div class="_title"><fa :icon="faExchangeAlt"/> {{ $t('network') }}</div>
-		<div class="_content" style="margin-top: -8px; margin-bottom: -12px;">
-			<canvas ref="net"></canvas>
-		</div>
-		<div class="_content" v-if="serverInfo">
-			<div class="table">
-				<div class="row">
-					<div class="cell"><div class="label">Interface</div>{{ serverInfo.net.interface }}</div>
-				</div>
-			</div>
-		</div>
-	</section>
-</div>
-</template>
-
-<script lang="ts">
-import Vue from 'vue';
-import { faTachometerAlt, faExchangeAlt, faMicrochip, faHdd } from '@fortawesome/free-solid-svg-icons';
-import Chart from 'chart.js';
-import i18n from '../../i18n';
-
-const alpha = (hex, a) => {
-	const result = /^#?([a-f\d]{2})([a-f\d]{2})([a-f\d]{2})$/i.exec(hex)!;
-	const r = parseInt(result[1], 16);
-	const g = parseInt(result[2], 16);
-	const b = parseInt(result[3], 16);
-	return `rgba(${r}, ${g}, ${b}, ${a})`;
-};
-
-export default Vue.extend({
-	i18n,
-
-	metaInfo() {
-		return {
-			title: `${this.$t('monitor')} | ${this.$t('instance')}`
-		};
-	},
-
-	components: {
-	},
-
-	data() {
-		return {
-			connection: null,
-			serverInfo: null,
-			memUsage: 0,
-			chartCpuMem: null,
-			chartNet: null,
-			faTachometerAlt, faExchangeAlt, faMicrochip, faHdd
-		}
-	},
-
-	mounted() {
-		Chart.defaults.global.defaultFontColor = getComputedStyle(document.documentElement).getPropertyValue('--fg');
-
-		this.chartCpuMem = new Chart(this.$refs.cpumem, {
-			type: 'line',
-			data: {
-				labels: [],
-				datasets: [{
-					label: 'CPU',
-					pointRadius: 0,
-					lineTension: 0,
-					borderWidth: 2,
-					borderColor: '#86b300',
-					backgroundColor: alpha('#86b300', 0.1),
-					data: []
-				}, {
-					label: 'MEM (active)',
-					pointRadius: 0,
-					lineTension: 0,
-					borderWidth: 2,
-					borderColor: '#935dbf',
-					backgroundColor: alpha('#935dbf', 0.02),
-					data: []
-				}, {
-					label: 'MEM (used)',
-					pointRadius: 0,
-					lineTension: 0,
-					borderWidth: 2,
-					borderColor: '#935dbf',
-					borderDash: [5, 5],
-					fill: false,
-					data: []
-				}]
-			},
-			options: {
-				aspectRatio: 3,
-				layout: {
-					padding: {
-						left: 0,
-						right: 0,
-						top: 8,
-						bottom: 0
-					}
-				},
-				legend: {
-					position: 'bottom',
-					labels: {
-						boxWidth: 16,
-					}
-				},
-				scales: {
-					xAxes: [{
-						gridLines: {
-							display: false
-						},
-						ticks: {
-							display: false
-						}
-					}],
-					yAxes: [{
-						position: 'right',
-						ticks: {
-							display: false,
-							max: 100
-						}
-					}]
-				},
-				tooltips: {
-					intersect: false,
-					mode: 'index',
-				}
-			}
-		});
-
-		this.chartNet = new Chart(this.$refs.net, {
-			type: 'line',
-			data: {
-				labels: [],
-				datasets: [{
-					label: 'In',
-					pointRadius: 0,
-					lineTension: 0,
-					borderWidth: 2,
-					borderColor: '#94a029',
-					backgroundColor: alpha('#94a029', 0.1),
-					data: []
-				}, {
-					label: 'Out',
-					pointRadius: 0,
-					lineTension: 0,
-					borderWidth: 2,
-					borderColor: '#ff9156',
-					backgroundColor: alpha('#ff9156', 0.1),
-					data: []
-				}]
-			},
-			options: {
-				aspectRatio: 3,
-				layout: {
-					padding: {
-						left: 0,
-						right: 0,
-						top: 8,
-						bottom: 0
-					}
-				},
-				legend: {
-					position: 'bottom',
-					labels: {
-						boxWidth: 16,
-					}
-				},
-				scales: {
-					xAxes: [{
-						gridLines: {
-							display: false
-						},
-						ticks: {
-							display: false
-						}
-					}],
-					yAxes: [{
-						position: 'right',
-						ticks: {
-							display: false,
-						}
-					}]
-				},
-				tooltips: {
-					intersect: false,
-					mode: 'index',
-				}
-			}
-		});
-
-		this.chartDisk = new Chart(this.$refs.disk, {
-			type: 'line',
-			data: {
-				labels: [],
-				datasets: [{
-					label: 'Read',
-					pointRadius: 0,
-					lineTension: 0,
-					borderWidth: 2,
-					borderColor: '#94a029',
-					backgroundColor: alpha('#94a029', 0.1),
-					data: []
-				}, {
-					label: 'Write',
-					pointRadius: 0,
-					lineTension: 0,
-					borderWidth: 2,
-					borderColor: '#ff9156',
-					backgroundColor: alpha('#ff9156', 0.1),
-					data: []
-				}]
-			},
-			options: {
-				aspectRatio: 3,
-				layout: {
-					padding: {
-						left: 0,
-						right: 0,
-						top: 8,
-						bottom: 0
-					}
-				},
-				legend: {
-					position: 'bottom',
-					labels: {
-						boxWidth: 16,
-					}
-				},
-				scales: {
-					xAxes: [{
-						gridLines: {
-							display: false
-						},
-						ticks: {
-							display: false
-						}
-					}],
-					yAxes: [{
-						position: 'right',
-						ticks: {
-							display: false,
-						}
-					}]
-				},
-				tooltips: {
-					intersect: false,
-					mode: 'index',
-				}
-			}
-		});
-
-		this.$root.api('admin/server-info', {}).then(res => {
-			this.serverInfo = res;
-
-			this.connection = this.$root.stream.useSharedConnection('serverStats');
-			this.connection.on('stats', this.onStats);
-			this.connection.on('statsLog', this.onStatsLog);
-			this.connection.send('requestLog', {
-				id: Math.random().toString().substr(2, 8),
-				length: 150
-			});
-		});
-	},
-
-	beforeDestroy() {
-		this.connection.off('stats', this.onStats);
-		this.connection.off('statsLog', this.onStatsLog);
-		this.connection.dispose();
-	},
-
-	methods: {
-		onStats(stats) {
-			const cpu = (stats.cpu * 100).toFixed(0);
-			const memActive = (stats.mem.active / this.serverInfo.mem.total * 100).toFixed(0);
-			const memUsed = (stats.mem.used / this.serverInfo.mem.total * 100).toFixed(0);
-			this.memUsage = stats.mem.active;
-
-			this.chartCpuMem.data.labels.push('');
-			this.chartCpuMem.data.datasets[0].data.push(cpu);
-			this.chartCpuMem.data.datasets[1].data.push(memActive);
-			this.chartCpuMem.data.datasets[2].data.push(memUsed);
-			this.chartNet.data.labels.push('');
-			this.chartNet.data.datasets[0].data.push(stats.net.rx);
-			this.chartNet.data.datasets[1].data.push(stats.net.tx);
-			this.chartDisk.data.labels.push('');
-			this.chartDisk.data.datasets[0].data.push(stats.fs.r);
-			this.chartDisk.data.datasets[1].data.push(stats.fs.w);
-			if (this.chartCpuMem.data.datasets[0].data.length > 150) {
-				this.chartCpuMem.data.labels.shift();
-				this.chartCpuMem.data.datasets[0].data.shift();
-				this.chartCpuMem.data.datasets[1].data.shift();
-				this.chartCpuMem.data.datasets[2].data.shift();
-				this.chartNet.data.labels.shift();
-				this.chartNet.data.datasets[0].data.shift();
-				this.chartNet.data.datasets[1].data.shift();
-				this.chartDisk.data.labels.shift();
-				this.chartDisk.data.datasets[0].data.shift();
-				this.chartDisk.data.datasets[1].data.shift();
-			}
-			this.chartCpuMem.update();
-			this.chartNet.update();
-			this.chartDisk.update();
-		},
-
-		onStatsLog(statsLog) {
-			for (const stats of statsLog.reverse()) {
-				this.onStats(stats);
-			}
-		}
-	}
-});
-</script>
-
-<style lang="scss" scoped>
-.mk-instance-monitor {
-	> section {
-		> ._content {
-			> .table {
-				> .row {
-					display: flex;
-
-					&:not(:last-child) {
-						margin-bottom: 16px;
-
-						@media (max-width: 500px) {
-							margin-bottom: 8px;
-						}
-					}
-
-					> .cell {
-						flex: 1;
-
-						> .label {
-							font-size: 80%;
-							opacity: 0.7;
-
-							> .icon {
-								margin-right: 4px;
-								display: none;
-							}
-						}
-					}
-				}
-			}
-		}
-	}
-}
-</style>

src/client/pages/instance/settings.vue

@@ -0,0 +1,370 @@
+<template>
+<div v-if="meta">
+	<portal to="icon"><fa :icon="faCog"/></portal>
+	<portal to="title">{{ $t('settings') }}</portal>
+
+	<section class="_card info">
+		<div class="_title"><fa :icon="faInfoCircle"/> {{ $t('basicInfo') }}</div>
+		<div class="_content">
+			<mk-input v-model="name">{{ $t('instanceName') }}</mk-input>
+			<mk-textarea v-model="description">{{ $t('instanceDescription') }}</mk-textarea>
+			<mk-input v-model="iconUrl"><template #icon><fa :icon="faLink"/></template>{{ $t('iconUrl') }}</mk-input>
+			<mk-input v-model="bannerUrl"><template #icon><fa :icon="faLink"/></template>{{ $t('bannerUrl') }}</mk-input>
+			<mk-input v-model="tosUrl"><template #icon><fa :icon="faLink"/></template>{{ $t('tosUrl') }}</mk-input>
+			<mk-input v-model="maintainerName">{{ $t('maintainerName') }}</mk-input>
+			<mk-input v-model="maintainerEmail" type="email"><template #icon><fa :icon="faEnvelope"/></template>{{ $t('maintainerEmail') }}</mk-input>
+		</div>
+		<div class="_footer">
+			<mk-button primary @click="save(true)"><fa :icon="faSave"/> {{ $t('save') }}</mk-button>
+		</div>
+	</section>
+
+	<section class="_card info">
+		<div class="_content">
+			<mk-input v-model="maxNoteTextLength" type="number" :save="() => save()" style="margin:0;"><template #icon><fa :icon="faPencilAlt"/></template>{{ $t('maxNoteTextLength') }}</mk-input>
+		</div>
+		<div class="_content">
+			<mk-switch v-model="enableLocalTimeline" @change="save()">{{ $t('enableLocalTimeline') }}</mk-switch>
+			<mk-switch v-model="enableGlobalTimeline" @change="save()">{{ $t('enableGlobalTimeline') }}</mk-switch>
+			<mk-info>{{ $t('disablingTimelinesInfo') }}</mk-info>
+		</div>
+	</section>
+
+	<section class="_card info">
+		<div class="_title"><fa :icon="faUser"/> {{ $t('registration') }}</div>
+		<div class="_content">
+			<mk-switch v-model="enableRegistration" @change="save()">{{ $t('enableRegistration') }}</mk-switch>
+			<mk-button v-if="!enableRegistration" @click="invite">{{ $t('invite') }}</mk-button>
+		</div>
+	</section>
+
+	<section class="_card">
+		<div class="_title"><fa :icon="faShieldAlt"/> {{ $t('recaptcha') }}</div>
+		<div class="_content">
+			<mk-switch v-model="enableRecaptcha">{{ $t('enableRecaptcha') }}</mk-switch>
+			<template v-if="enableRecaptcha">
+				<mk-input v-model="recaptchaSiteKey" :disabled="!enableRecaptcha"><template #icon><fa :icon="faKey"/></template>{{ $t('recaptchaSiteKey') }}</mk-input>
+				<mk-input v-model="recaptchaSecretKey" :disabled="!enableRecaptcha"><template #icon><fa :icon="faKey"/></template>{{ $t('recaptchaSecretKey') }}</mk-input>
+			</template>
+		</div>
+		<div class="_content" v-if="enableRecaptcha && recaptchaSiteKey">
+			<header>{{ $t('preview') }}</header>
+			<div ref="recaptcha" style="margin: 16px 0 0 0;" :key="recaptchaSiteKey"></div>
+		</div>
+		<div class="_footer">
+			<mk-button primary @click="save(true)"><fa :icon="faSave"/> {{ $t('save') }}</mk-button>
+		</div>
+	</section>
+
+	<section class="_card">
+		<div class="_title"><fa :icon="faBolt"/> {{ $t('serviceworker') }}</div>
+		<div class="_content">
+			<mk-switch v-model="enableServiceWorker">{{ $t('enableServiceworker') }}<template #desc>{{ $t('serviceworkerInfo') }}</template></mk-switch>
+			<template v-if="enableServiceWorker">
+				<mk-horizon-group inputs class="fit-bottom">
+					<mk-input v-model="swPublicKey" :disabled="!enableServiceWorker"><template #icon><fa :icon="faKey"/></template>Public key</mk-input>
+					<mk-input v-model="swPrivateKey" :disabled="!enableServiceWorker"><template #icon><fa :icon="faKey"/></template>Private key</mk-input>
+				</mk-horizon-group>
+			</template>
+		</div>
+		<div class="_footer">
+			<mk-button primary @click="save(true)"><fa :icon="faSave"/> {{ $t('save') }}</mk-button>
+		</div>
+	</section>
+
+	<section class="_card">
+		<div class="_title"><fa :icon="faThumbtack"/> {{ $t('pinnedUsers') }}</div>
+		<div class="_content">
+			<mk-textarea v-model="pinnedUsers">
+				<template #desc>{{ $t('pinnedUsersDescription') }} <button class="_textButton" @click="addPinUser">{{ $t('addUser') }}</button></template>
+			</mk-textarea>
+		</div>
+		<div class="_footer">
+			<mk-button primary @click="save(true)"><fa :icon="faSave"/> {{ $t('save') }}</mk-button>
+		</div>
+	</section>
+
+	<section class="_card">
+		<div class="_title"><fa :icon="faCloud"/> {{ $t('files') }}</div>
+		<div class="_content">
+			<mk-switch v-model="cacheRemoteFiles">{{ $t('cacheRemoteFiles') }}<template #desc>{{ $t('cacheRemoteFilesDescription') }}</template></mk-switch>
+			<mk-switch v-model="proxyRemoteFiles">{{ $t('proxyRemoteFiles') }}<template #desc>{{ $t('proxyRemoteFilesDescription') }}</template></mk-switch>
+			<mk-input v-model="localDriveCapacityMb" type="number">{{ $t('driveCapacityPerLocalAccount') }}<template #suffix>MB</template><template #desc>{{ $t('inMb') }}</template></mk-input>
+			<mk-input v-model="remoteDriveCapacityMb" type="number" :disabled="!cacheRemoteFiles" style="margin-bottom: 0;">{{ $t('driveCapacityPerRemoteAccount') }}<template #suffix>MB</template><template #desc>{{ $t('inMb') }}</template></mk-input>
+		</div>
+		<div class="_footer">
+			<mk-button primary @click="save(true)"><fa :icon="faSave"/> {{ $t('save') }}</mk-button>
+		</div>
+	</section>
+
+	<section class="_card">
+		<div class="_title"><fa :icon="faGhost"/> {{ $t('proxyAccount') }}</div>
+		<div class="_content">
+			<mk-input :value="proxyAccount ? proxyAccount.username : null" style="margin: 0;" disabled><template #prefix>@</template>{{ $t('proxyAccount') }}<template #desc>{{ $t('proxyAccountDescription') }}</template></mk-input>
+			<mk-button primary @click="chooseProxyAccount">{{ $t('chooseProxyAccount') }}</mk-button>
+		</div>
+	</section>
+
+	<section class="_card">
+		<div class="_title"><fa :icon="faBan"/> {{ $t('blockedInstances') }}</div>
+		<div class="_content">
+			<mk-textarea v-model="blockedHosts">
+				<template #desc>{{ $t('blockedInstancesDescription') }}</template>
+			</mk-textarea>
+		</div>
+		<div class="_footer">
+			<mk-button primary @click="save(true)"><fa :icon="faSave"/> {{ $t('save') }}</mk-button>
+		</div>
+	</section>
+
+	<section class="_card">
+		<div class="_title"><fa :icon="faShareAlt"/> {{ $t('integration') }}</div>
+		<div class="_content">
+			<header><fa :icon="faTwitter"/> Twitter</header>
+			<mk-switch v-model="enableTwitterIntegration">{{ $t('enable') }}</mk-switch>
+			<template v-if="enableTwitterIntegration">
+				<mk-info>Callback URL: {{ `${url}/api/tw/cb` }}</mk-info>
+				<mk-input v-model="twitterConsumerKey" :disabled="!enableTwitterIntegration"><template #icon><fa :icon="faKey"/></template>Consumer Key</mk-input>
+				<mk-input v-model="twitterConsumerSecret" :disabled="!enableTwitterIntegration"><template #icon><fa :icon="faKey"/></template>Consumer Secret</mk-input>
+			</template>
+		</div>
+		<div class="_content">
+			<header><fa :icon="faGithub"/> GitHub</header>
+			<mk-switch v-model="enableGithubIntegration">{{ $t('enable') }}</mk-switch>
+			<template v-if="enableGithubIntegration">
+				<mk-info>Callback URL: {{ `${url}/api/gh/cb` }}</mk-info>
+				<mk-input v-model="githubClientId" :disabled="!enableGithubIntegration"><template #icon><fa :icon="faKey"/></template>Client ID</mk-input>
+				<mk-input v-model="githubClientSecret" :disabled="!enableGithubIntegration"><template #icon><fa :icon="faKey"/></template>Client Secret</mk-input>
+			</template>
+		</div>
+		<div class="_content">
+			<header><fa :icon="faDiscord"/> Discord</header>
+			<mk-switch v-model="enableDiscordIntegration">{{ $t('enable') }}</mk-switch>
+			<template v-if="enableDiscordIntegration">
+				<mk-info>Callback URL: {{ `${url}/api/dc/cb` }}</mk-info>
+				<mk-input v-model="discordClientId" :disabled="!enableDiscordIntegration"><template #icon><fa :icon="faKey"/></template>Client ID</mk-input>
+				<mk-input v-model="discordClientSecret" :disabled="!enableDiscordIntegration"><template #icon><fa :icon="faKey"/></template>Client Secret</mk-input>
+			</template>
+		</div>
+		<div class="_footer">
+			<mk-button primary @click="save(true)"><fa :icon="faSave"/> {{ $t('save') }}</mk-button>
+		</div>
+	</section>
+</div>
+</template>
+
+<script lang="ts">
+import Vue from 'vue';
+import { faPencilAlt, faShareAlt, faGhost, faCog, faPlus, faCloud, faInfoCircle, faBan, faSave, faServer, faLink, faThumbtack, faUser, faShieldAlt, faKey, faBolt } from '@fortawesome/free-solid-svg-icons';
+import { faTrashAlt, faEnvelope } from '@fortawesome/free-regular-svg-icons';
+import { faTwitter, faDiscord, faGithub } from '@fortawesome/free-brands-svg-icons';
+import MkButton from '../../components/ui/button.vue';
+import MkInput from '../../components/ui/input.vue';
+import MkTextarea from '../../components/ui/textarea.vue';
+import MkSwitch from '../../components/ui/switch.vue';
+import MkInfo from '../../components/ui/info.vue';
+import MkUserSelect from '../../components/user-select.vue';
+import { url } from '../../config';
+import i18n from '../../i18n';
+import getAcct from '../../../misc/acct/render';
+
+export default Vue.extend({
+	i18n,
+
+	metaInfo() {
+		return {
+			title: this.$t('instance') as string
+		};
+	},
+
+	components: {
+		MkButton,
+		MkInput,
+		MkTextarea,
+		MkSwitch,
+		MkInfo,
+	},
+
+	data() {
+		return {
+			url,
+			proxyAccount: null,
+			proxyAccountId: null,
+			cacheRemoteFiles: false,
+			proxyRemoteFiles: false,
+			localDriveCapacityMb: 0,
+			remoteDriveCapacityMb: 0,
+			blockedHosts: '',
+			pinnedUsers: '',
+			maintainerName: null,
+			maintainerEmail: null,
+			name: null,
+			description: null,
+			tosUrl: null,
+			bannerUrl: null,
+			iconUrl: null,
+			maxNoteTextLength: 0,
+			enableRegistration: false,
+			enableLocalTimeline: false,
+			enableGlobalTimeline: false,
+			enableRecaptcha: false,
+			recaptchaSiteKey: null,
+			recaptchaSecretKey: null,
+			enableServiceWorker: false,
+			swPublicKey: null,
+			swPrivateKey: null,
+			enableTwitterIntegration: false,
+			twitterConsumerKey: null,
+			twitterConsumerSecret: null,
+			enableGithubIntegration: false,
+			githubClientId: null,
+			githubClientSecret: null,
+			enableDiscordIntegration: false,
+			discordClientId: null,
+			discordClientSecret: null,
+			faPencilAlt, faTwitter, faDiscord, faGithub, faShareAlt, faTrashAlt, faGhost, faCog, faPlus, faCloud, faInfoCircle, faBan, faSave, faServer, faLink, faEnvelope, faThumbtack, faUser, faShieldAlt, faKey, faBolt
+		}
+	},
+
+	computed: {
+		meta() {
+			return this.$store.state.instance.meta;
+		},
+	},
+
+	created() {
+		this.name = this.meta.name;
+		this.description = this.meta.description;
+		this.tosUrl = this.meta.tosUrl;
+		this.bannerUrl = this.meta.bannerUrl;
+		this.iconUrl = this.meta.iconUrl;
+		this.maintainerName = this.meta.maintainerName;
+		this.maintainerEmail = this.meta.maintainerEmail;
+		this.maxNoteTextLength = this.meta.maxNoteTextLength;
+		this.enableRegistration = !this.meta.disableRegistration;
+		this.enableLocalTimeline = !this.meta.disableLocalTimeline;
+		this.enableGlobalTimeline = !this.meta.disableGlobalTimeline;
+		this.enableRecaptcha = this.meta.enableRecaptcha;
+		this.recaptchaSiteKey = this.meta.recaptchaSiteKey;
+		this.recaptchaSecretKey = this.meta.recaptchaSecretKey;
+		this.proxyAccountId = this.meta.proxyAccountId;
+		this.cacheRemoteFiles = this.meta.cacheRemoteFiles;
+		this.proxyRemoteFiles = this.meta.proxyRemoteFiles;
+		this.localDriveCapacityMb = this.meta.driveCapacityPerLocalUserMb;
+		this.remoteDriveCapacityMb = this.meta.driveCapacityPerRemoteUserMb;
+		this.blockedHosts = this.meta.blockedHosts.join('\n');
+		this.pinnedUsers = this.meta.pinnedUsers.join('\n');
+		this.enableServiceWorker = this.meta.enableServiceWorker;
+		this.swPublicKey = this.meta.swPublickey;
+		this.swPrivateKey = this.meta.swPrivateKey;
+		this.enableTwitterIntegration = this.meta.enableTwitterIntegration;
+		this.twitterConsumerKey = this.meta.twitterConsumerKey;
+		this.twitterConsumerSecret = this.meta.twitterConsumerSecret;
+		this.enableGithubIntegration = this.meta.enableGithubIntegration;
+		this.githubClientId = this.meta.githubClientId;
+		this.githubClientSecret = this.meta.githubClientSecret;
+		this.enableDiscordIntegration = this.meta.enableDiscordIntegration;
+		this.discordClientId = this.meta.discordClientId;
+		this.discordClientSecret = this.meta.discordClientSecret;
+
+		if (this.proxyAccountId) {
+			this.$root.api('users/show', { userId: this.proxyAccountId }).then(proxyAccount => {
+				this.proxyAccount = proxyAccount;
+			});
+		}
+	},
+
+	mounted() {
+		const renderRecaptchaPreview = () => {
+			if (!(window as any).grecaptcha) return;
+			if (!this.$refs.recaptcha) return;
+			if (!this.recaptchaSiteKey) return;
+			(window as any).grecaptcha.render(this.$refs.recaptcha, {
+				sitekey: this.recaptchaSiteKey
+			});
+		};
+		window.onRecaotchaLoad = () => {
+			renderRecaptchaPreview();
+		};
+		const head = document.getElementsByTagName('head')[0];
+		const script = document.createElement('script');
+		script.setAttribute('src', 'https://www.google.com/recaptcha/api.js?onload=onRecaotchaLoad');
+		head.appendChild(script);
+		this.$watch('enableRecaptcha', () => {
+			renderRecaptchaPreview();
+		});
+		this.$watch('recaptchaSiteKey', () => {
+			renderRecaptchaPreview();
+		});
+	},
+
+	methods: {
+		addPinUser() {
+			this.$root.new(MkUserSelect, {}).$once('selected', user => {
+				this.pinnedUsers = this.pinnedUsers.trim();
+				this.pinnedUsers += '\n@' + getAcct(user);
+				this.pinnedUsers = this.pinnedUsers.trim();
+			});
+		},
+
+		chooseProxyAccount() {
+			this.$root.new(MkUserSelect, {}).$once('selected', user => {
+				this.proxyAccount = user;
+				this.proxyAccountId = user.id;
+				this.save(true);
+			});
+		},
+
+		save(withDialog = false) {
+			this.$root.api('admin/update-meta', {
+				name: this.name,
+				description: this.description,
+				tosUrl: this.tosUrl,
+				bannerUrl: this.bannerUrl,
+				iconUrl: this.iconUrl,
+				maintainerName: this.maintainerName,
+				maintainerEmail: this.maintainerEmail,
+				maxNoteTextLength: this.maxNoteTextLength,
+				disableRegistration: !this.enableRegistration,
+				disableLocalTimeline: !this.enableLocalTimeline,
+				disableGlobalTimeline: !this.enableGlobalTimeline,
+				enableRecaptcha: this.enableRecaptcha,
+				recaptchaSiteKey: this.recaptchaSiteKey,
+				recaptchaSecretKey: this.recaptchaSecretKey,
+				proxyAccountId: this.proxyAccountId,
+				cacheRemoteFiles: this.cacheRemoteFiles,
+				proxyRemoteFiles: this.proxyRemoteFiles,
+				localDriveCapacityMb: parseInt(this.localDriveCapacityMb, 10),
+				remoteDriveCapacityMb: parseInt(this.remoteDriveCapacityMb, 10),
+				blockedHosts: this.blockedHosts.split('\n') || [],
+				pinnedUsers: this.pinnedUsers ? this.pinnedUsers.split('\n') : [],
+				enableServiceWorker: this.enableServiceWorker,
+				swPublicKey: this.swPublicKey,
+				swPrivateKey: this.swPrivateKey,
+				enableTwitterIntegration: this.enableTwitterIntegration,
+				twitterConsumerKey: this.twitterConsumerKey,
+				twitterConsumerSecret: this.twitterConsumerSecret,
+				enableGithubIntegration: this.enableGithubIntegration,
+				githubClientId: this.githubClientId,
+				githubClientSecret: this.githubClientSecret,
+				enableDiscordIntegration: this.enableDiscordIntegration,
+				discordClientId: this.discordClientId,
+				discordClientSecret: this.discordClientSecret,
+			}).then(() => {
+				this.$store.dispatch('instance/fetch');
+				if (withDialog) {
+					this.$root.dialog({
+						type: 'success',
+						iconOnly: true, autoClose: true
+					});
+				}
+			}).catch(e => {
+				this.$root.dialog({
+					type: 'error',
+					text: e
+				});
+			});
+		}
+	}
+});
+</script>

src/client/pages/instance/users.vue

@@ -6,7 +6,7 @@
 	<section class="_card lookup">
 		<div class="_title"><fa :icon="faSearch"/> {{ $t('lookup') }}</div>
 		<div class="_content">
-			<mk-input class="target" v-model="target" type="text" @enter="showUser()" style="margin-top: 0;">
+			<mk-input class="target" v-model="target" type="text" @enter="showUser()">
 				<span>{{ $t('usernameOrUserId') }}</span>
 			</mk-input>
 			<mk-button @click="showUser()" primary><fa :icon="faSearch"/> {{ $t('lookup') }}</mk-button>

src/client/pages/messaging-room.form.vue

@@ -100,7 +100,7 @@ export default Vue.extend({
 					const formatted = `${formatTimeString(new Date(file.lastModified), this.$store.state.settings.pastedFileName).replace(/{{number}}/g, '1')}${ext}`;
 					const name = this.$store.state.settings.pasteDialog
 						? await this.$root.dialog({
-							title: this.$t('@.post-form.enter-file-name'),
+							title: this.$t('enterFileName'),
 							input: {
 								default: formatted
 							},

src/client/pages/messaging-room.message.vue

@@ -3,8 +3,8 @@
 	<mk-avatar class="avatar" :user="message.user"/>
 	<div class="content">
 		<div class="balloon _panel" :data-no-text="message.text == null">
-			<button class="delete-button" v-if="isMe" :title="$t('@.delete')" @click="del">
-				<img src="/assets/desktop/remove.png" alt="Delete"/>
+			<button class="delete-button" v-if="isMe" :title="$t('delete')" @click="del">
+				<img src="/assets/remove.png" alt="Delete"/>
 			</button>
 			<div class="content" v-if="!message.isDeleted">
 				<mfm class="text" v-if="message.text" ref="text" :text="message.text" :i="$store.state.i"/>
@@ -230,7 +230,7 @@ export default Vue.extend({
 		> footer {
 			display: block;
 			margin: 2px 0 0 0;
-			font-size: 10px;
+			font-size: 0.65em;
 
 			> .read {
 				margin: 0 8px;

src/client/pages/messaging-room.vue

@@ -14,10 +14,10 @@
 
 	<div class="body">
 		<mk-loading v-if="fetching"/>
-		<p class="empty" v-if="!fetching && messages.length == 0"><fa icon="info-circle"/>{{ user ? $t('not-talked-user') : $t('not-talked-group') }}</p>
+		<p class="empty" v-if="!fetching && messages.length == 0"><fa :icon="faInfoCircle"/>{{ $t('noMessagesYet') }}</p>
 		<p class="no-history" v-if="!fetching && messages.length > 0 && !existMoreMessages"><fa :icon="faFlag"/>{{ $t('noMoreHistory') }}</p>
 		<button class="more _button" :class="{ fetching: fetchingMoreMessages }" v-if="existMoreMessages" @click="fetchMoreMessages" :disabled="fetchingMoreMessages">
-			<template v-if="fetchingMoreMessages"><fa icon="spinner" pulse fixed-width/></template>{{ fetchingMoreMessages ? $t('@.loading') : $t('@.load-more') }}
+			<template v-if="fetchingMoreMessages"><fa icon="spinner" pulse fixed-width/></template>{{ fetchingMoreMessages ? $t('loading') : $t('loadMore') }}
 		</button>
 		<x-list class="messages" :items="messages" v-slot="{ item: message, i }" direction="up" reversed>
 			<x-message :message="message" :is-group="group != null" :key="message.id"/>
@@ -26,7 +26,7 @@
 	<footer>
 		<transition name="fade">
 			<div class="new-message" v-show="showIndicator">
-				<button class="_buttonPrimary" @click="onIndicatorClick"><i><fa :icon="faArrowCircleDown"/></i>{{ $t('new-message') }}</button>
+				<button class="_buttonPrimary" @click="onIndicatorClick"><i><fa :icon="faArrowCircleDown"/></i>{{ $t('newMessageExists') }}</button>
 			</div>
 		</transition>
 		<x-form v-if="!fetching" :user="user" :group="group" ref="form"/>
@@ -36,7 +36,7 @@
 
 <script lang="ts">
 import Vue from 'vue';
-import { faArrowCircleDown, faFlag, faUsers } from '@fortawesome/free-solid-svg-icons';
+import { faArrowCircleDown, faFlag, faUsers, faInfoCircle } from '@fortawesome/free-solid-svg-icons';
 import i18n from '../i18n';
 import XList from '../components/date-separated-list.vue';
 import XMessage from './messaging-room.message.vue';
@@ -64,7 +64,7 @@ export default Vue.extend({
 			connection: null,
 			showIndicator: false,
 			timer: null,
-			faArrowCircleDown, faFlag, faUsers
+			faArrowCircleDown, faFlag, faUsers, faInfoCircle
 		};
 	},
 
@@ -139,7 +139,7 @@ export default Vue.extend({
 			} else if (e.dataTransfer.files.length > 1) {
 				this.$root.dialog({
 					type: 'error',
-					text: this.$t('only-one-file-attached')
+					text: this.$t('onlyOneFileCanBeAttached')
 				});
 				return;
 			}

src/client/pages/messaging.vue

@@ -31,7 +31,10 @@
 			</div>
 		</router-link>
 	</sequential-entrance>
-	<p class="no-history" v-if="!fetching && messages.length == 0">{{ $t('no-history') }}</p>
+	<div class="no-history" v-if="!fetching && messages.length == 0">
+		<img src="https://xn--931a.moe/assets/info.png" class="_ghost"/>
+		<div>{{ $t('noHistory') }}</div>
+	</div>
 	<mk-loading v-if="fetching"/>
 </div>
 </template>
@@ -139,6 +142,14 @@ export default Vue.extend({
 		async startGroup() {
 			const groups1 = await this.$root.api('users/groups/owned');
 			const groups2 = await this.$root.api('users/groups/joined');
+			if (groups1.length === 0 && groups2.length === 0) {
+				this.$root.dialog({
+					type: 'warning',
+					title: this.$t('noGroups'),
+					text: this.$t('joinOrCreateGroup'),
+				});
+				return;
+			}
 			const { canceled, result: group } = await this.$root.dialog({
 				type: null,
 				title: this.$t('group'),
@@ -277,24 +288,18 @@ export default Vue.extend({
 	}
 
 	> .no-history {
-		margin: 0;
-		padding: 2em 1em;
+		padding: 32px;
 		text-align: center;
-		color: #999;
-		font-weight: 500;
+
+		> img {
+			vertical-align: bottom;
+			height: 128px;
+			margin-bottom: 16px;
+			border-radius: 16px;
+		}
 	}
 
 	@media (max-width: 400px) {
-		> .search {
-			> .result {
-				> .users {
-					> li {
-						padding: 8px 16px;
-					}
-				}
-			}
-		}
-
 		> .history {
 			> .message {
 				&:not([data-is-me]):not([data-is-read]) {
@@ -306,7 +311,7 @@ export default Vue.extend({
 
 				> div {
 					padding: 16px;
-					font-size: 14px;
+					font-size: 0.9em;
 
 					> .avatar {
 						margin: 0 12px 0 0;

src/client/pages/my-antennas/index.antenna.vue

@@ -2,7 +2,7 @@
 <div class="shaynizk _card">
 	<div class="_title" v-if="antenna.name">{{ antenna.name }}</div>
 	<div class="_content body">
-		<mk-input v-model="name" style="margin-top: 8px;">
+		<mk-input v-model="name">
 			<span>{{ $t('name') }}</span>
 		</mk-input>
 		<mk-select v-model="src">
@@ -11,12 +11,17 @@
 			<option value="home">{{ $t('_antennaSources.homeTimeline') }}</option>
 			<option value="users">{{ $t('_antennaSources.users') }}</option>
 			<option value="list">{{ $t('_antennaSources.userList') }}</option>
+			<option value="group">{{ $t('_antennaSources.userGroup') }}</option>
 		</mk-select>
 		<mk-select v-model="userListId" v-if="src === 'list'">
 			<template #label>{{ $t('userList') }}</template>
 			<option v-for="list in userLists" :value="list.id" :key="list.id">{{ list.name }}</option>
 		</mk-select>
-		<mk-textarea v-model="users" v-if="src === 'users'">
+		<mk-select v-model="userGroupId" v-else-if="src === 'group'">
+			<template #label>{{ $t('userGroup') }}</template>
+			<option v-for="group in userGroups" :value="group.id" :key="group.id">{{ group.name }}</option>
+		</mk-select>
+		<mk-textarea v-model="users" v-else-if="src === 'users'">
 			<span>{{ $t('users') }}</span>
 			<template #desc>{{ $t('antennaUsersDescription') }} <button class="_textButton" @click="addUser">{{ $t('addUser') }}</button></template>
 		</mk-textarea>
@@ -67,6 +72,7 @@ export default Vue.extend({
 			name: '',
 			src: '',
 			userListId: null,
+			userGroupId: null,
 			users: '',
 			keywords: '',
 			caseSensitive: false,
@@ -74,6 +80,7 @@ export default Vue.extend({
 			withFile: false,
 			notify: false,
 			userLists: null,
+			userGroups: null,
 			faSave, faTrash
 		};
 	},
@@ -83,6 +90,13 @@ export default Vue.extend({
 			if (this.src === 'list' && this.userLists === null) {
 				this.userLists = await this.$root.api('users/lists/list');
 			}
+
+			if (this.src === 'group' && this.userGroups === null) {
+				const groups1 = await this.$root.api('users/groups/owned');
+				const groups2 = await this.$root.api('users/groups/joined');
+
+				this.userGroups = [...groups1, ...groups2];
+			}
 		}
 	},
 
@@ -90,6 +104,7 @@ export default Vue.extend({
 		this.name = this.antenna.name;
 		this.src = this.antenna.src;
 		this.userListId = this.antenna.userListId;
+		this.userGroupId = this.antenna.userGroupId;
 		this.users = this.antenna.users.join('\n');
 		this.keywords = this.antenna.keywords.map(x => x.join(' ')).join('\n');
 		this.caseSensitive = this.antenna.caseSensitive;
@@ -105,6 +120,7 @@ export default Vue.extend({
 					name: this.name,
 					src: this.src,
 					userListId: this.userListId,
+					userGroupId: this.userGroupId,
 					withReplies: this.withReplies,
 					withFile: this.withFile,
 					notify: this.notify,
@@ -119,6 +135,7 @@ export default Vue.extend({
 					name: this.name,
 					src: this.src,
 					userListId: this.userListId,
+					userGroupId: this.userGroupId,
 					withReplies: this.withReplies,
 					withFile: this.withFile,
 					notify: this.notify,

src/client/pages/my-antennas/index.vue

@@ -50,6 +50,7 @@ export default Vue.extend({
 				name: '',
 				src: 'all',
 				userListId: null,
+				userGroupId: null,
 				users: [],
 				keywords: [],
 				withReplies: false,

src/client/pages/my-groups/index.vue

@@ -17,13 +17,13 @@
 
 	<mk-container :body-togglable="true">
 		<template #header><fa :icon="faEnvelopeOpenText"/> {{ $t('invites') }}</template>
-		<mk-pagination :pagination="invitePagination" #default="{items}" ref="invites">
-			<div class="_frame" v-for="invite in items" :key="invite.id">
-				<div class="_title">{{ invite.group.name }}</div>
-				<div class="_content"><mk-avatars :user-ids="invite.group.userIds"/></div>
+		<mk-pagination :pagination="invitationPagination" #default="{items}" ref="invitations">
+			<div class="_frame" v-for="invitation in items" :key="invitation.id">
+				<div class="_title">{{ invitation.group.name }}</div>
+				<div class="_content"><mk-avatars :user-ids="invitation.group.userIds"/></div>
 				<div class="_footer">
-					<mk-button @click="acceptInvite(invite)" primary inline><fa :icon="faCheck"/> {{ $t('accept') }}</mk-button>
-					<mk-button @click="rejectInvite(invite)" primary inline><fa :icon="faBan"/> {{ $t('reject') }}</mk-button>
+					<mk-button @click="acceptInvite(invitation)" primary inline><fa :icon="faCheck"/> {{ $t('accept') }}</mk-button>
+					<mk-button @click="rejectInvite(invitation)" primary inline><fa :icon="faBan"/> {{ $t('reject') }}</mk-button>
 				</div>
 			</div>
 		</mk-pagination>
@@ -73,7 +73,7 @@ export default Vue.extend({
 				endpoint: 'users/groups/joined',
 				limit: 10,
 			},
-			invitePagination: {
+			invitationPagination: {
 				endpoint: 'i/user-group-invites',
 				limit: 10,
 			},
@@ -95,23 +95,23 @@ export default Vue.extend({
 				iconOnly: true, autoClose: true
 			});
 		},
-		acceptInvite(invite) {
+		acceptInvite(invitation) {
 			this.$root.api('users/groups/invitations/accept', {
-				inviteId: invite.id
+				invitationId: invitation.id
 			}).then(() => {
 				this.$root.dialog({
 					type: 'success',
 					iconOnly: true, autoClose: true
 				});
-				this.$refs.invites.reload();
+				this.$refs.invitations.reload();
 				this.$refs.joined.reload();
 			});
 		},
-		rejectInvite(invite) {
+		rejectInvite(invitation) {
 			this.$root.api('users/groups/invitations/reject', {
-				inviteId: invite.id
+				invitationId: invitation.id
 			}).then(() => {
-				this.$refs.invites.reload();
+				this.$refs.invitations.reload();
 			});
 		}
 	}

src/client/pages/my-settings/api.vue

@@ -0,0 +1,46 @@
+<template>
+<section class="_card">
+	<div class="_title"><fa :icon="faKey"/> API</div>
+	<div class="_content">
+		<mk-input :value="$store.state.i.token" readonly>
+			<span>{{ $t('token') }}</span>
+		</mk-input>
+		<mk-button @click="regenerateToken"><fa :icon="faSyncAlt"/> {{ $t('regenerate') }}</mk-button>
+	</div>
+</section>
+</template>
+
+<script lang="ts">
+import Vue from 'vue';
+import { faKey, faSyncAlt } from '@fortawesome/free-solid-svg-icons';
+import i18n from '../../i18n';
+import MkButton from '../../components/ui/button.vue';
+import MkInput from '../../components/ui/input.vue';
+
+export default Vue.extend({
+	i18n,
+	components: {
+		MkButton, MkInput
+	},
+	data() {
+		return {
+			faKey, faSyncAlt
+		};
+	},
+	methods: {
+		regenerateToken() {
+			this.$root.dialog({
+				title: this.$t('password'),
+				input: {
+					type: 'password'
+				}
+			}).then(({ canceled, result: password }) => {
+				if (canceled) return;
+				this.$root.api('i/regenerate_token', {
+					password: password
+				});
+			});
+		},
+	}
+});
+</script>

src/client/pages/my-settings/import-export.vue

@@ -2,8 +2,7 @@
 <section class="_card">
 	<div class="_title"><fa :icon="faBoxes"/> {{ $t('importAndExport') }}</div>
 	<div class="_content">
-		<input ref="file" type="file" style="display: none;" @change="onChangeFile"/>
-		<mk-select v-model="exportTarget" style="margin-top: 0;">
+		<mk-select v-model="exportTarget">
 			<option value="notes">{{ $t('_exportOrImport.allNotes') }}</option>
 			<option value="following">{{ $t('_exportOrImport.followingList') }}</option>
 			<option value="user-lists">{{ $t('_exportOrImport.userLists') }}</option>
@@ -13,6 +12,7 @@
 		<mk-button inline @click="doExport()"><fa :icon="faDownload"/> {{ $t('export') }}</mk-button>
 		<mk-button inline @click="doImport()" :disabled="!['following', 'user-lists'].includes(exportTarget)"><fa :icon="faUpload"/> {{ $t('import') }}</mk-button>
 	</div>
+	<input ref="file" type="file" style="display: none;" @change="onChangeFile"/>
 </section>
 </template>
 

src/client/pages/my-settings/index.vue

@@ -0,0 +1,109 @@
+<template>
+<div>
+	<portal to="icon"><fa :icon="faCog"/></portal>
+	<portal to="title">{{ $t('accountSettings') }}</portal>
+
+	<x-profile-setting/>
+	<x-privacy-setting/>
+	<x-reaction-setting/>
+
+	<section class="_card">
+		<div class="_title"><fa :icon="faCog"/> {{ $t('general') }}</div>
+		<div class="_content">
+			<mk-switch v-model="$store.state.i.autoWatch" @change="onChangeAutoWatch">
+				{{ $t('autoNoteWatch') }}<template #desc>{{ $t('autoNoteWatchDescription') }}</template>
+			</mk-switch>
+			<mk-switch v-model="$store.state.i.injectFeaturedNote" @change="onChangeInjectFeaturedNote">
+				{{ $t('showFeaturedNotesInTimeline') }}
+			</mk-switch>
+		</div>
+		<div class="_content">
+			<mk-button @click="readAllNotifications">{{ $t('markAsReadAllNotifications') }}</mk-button>
+			<mk-button @click="readAllUnreadNotes">{{ $t('markAsReadAllUnreadNotes') }}</mk-button>
+			<mk-button @click="readAllMessagingMessages">{{ $t('markAsReadAllTalkMessages') }}</mk-button>
+		</div>
+	</section>
+
+	<x-import-export/>
+	<x-drive/>
+	<x-mute-block/>
+	<x-security/>
+	<x-2fa/>
+	<x-integration/>
+	<x-api/>
+
+	<mk-button @click="$root.signout()" primary style="margin: var(--margin) auto;">{{ $t('logout') }}</mk-button>
+</div>
+</template>
+
+<script lang="ts">
+import Vue from 'vue';
+import { faCog } from '@fortawesome/free-solid-svg-icons';
+import XProfileSetting from './profile.vue';
+import XPrivacySetting from './privacy.vue';
+import XImportExport from './import-export.vue';
+import XDrive from './drive.vue';
+import XReactionSetting from './reaction.vue';
+import XMuteBlock from './mute-block.vue';
+import XSecurity from './security.vue';
+import X2fa from './2fa.vue';
+import XIntegration from './integration.vue';
+import XApi from './api.vue';
+import MkButton from '../../components/ui/button.vue';
+import MkSwitch from '../../components/ui/switch.vue';
+
+export default Vue.extend({
+	metaInfo() {
+		return {
+			title: this.$t('settings') as string
+		};
+	},
+
+	components: {
+		XProfileSetting,
+		XPrivacySetting,
+		XImportExport,
+		XDrive,
+		XReactionSetting,
+		XMuteBlock,
+		XSecurity,
+		X2fa,
+		XIntegration,
+		XApi,
+		MkButton,
+		MkSwitch,
+	},
+
+	data() {
+		return {
+			faCog
+		}
+	},
+
+	methods: {
+		onChangeAutoWatch(v) {
+			this.$root.api('i/update', {
+				autoWatch: v
+			});
+		},
+
+		onChangeInjectFeaturedNote(v) {
+			this.$root.api('i/update', {
+				injectFeaturedNote: v
+			});
+		},
+
+		readAllUnreadNotes() {
+			this.$root.api('i/read_all_unread_notes');
+		},
+
+		readAllMessagingMessages() {
+			this.$root.api('i/read_all_messaging_messages');
+		},
+
+		readAllNotifications() {
+			this.$root.api('notifications/mark_all_as_read');
+		},
+	}
+});
+</script>