enable pull-to-refresh

add support for repeat with visibility
This requires backend changes to work properly. Currently Akkoma maps: * public and unlisted (and local?) to public * private to private
2024-10-05 11:07:08 +02:00 · 2024-10-05 11:07:08 +02:00 · 2024-10-05 11:07:06 +02:00 · 2024-10-05 11:01:41 +02:00 · 2024-10-05 11:01:41 +02:00 · 2024-10-05 10:59:46 +02:00
150 changed files with 8535 additions and 5962 deletions
--- a/.eslintignore
+++ b/.eslintignore
@ -1,2 +0,0 @@
-build/*.js
-config/*.js
--- a/.eslintrc.js
+++ b/.eslintrc.js
@ -1,30 +0,0 @@
-module.exports = {
-  root: true,
-  parserOptions: {
-    parser: '@babel/eslint-parser',
-    sourceType: 'module'
-  },
-  // https://github.com/feross/standard/blob/master/RULES.md#javascript-standard-style
-  extends: [
-    'plugin:vue/recommended'
-  ],
-  // required to lint *.vue files
-  plugins: [
-    'vue',
-    'import'
-  ],
-  // add your custom rules here
-  rules: {
-    // allow paren-less arrow functions
-    'arrow-parens': 0,
-    // allow async-await
-    'generator-star-spacing': 0,
-    // allow debugger during development
-    'no-debugger': process.env.NODE_ENV === 'production' ? 2 : 0,
-    'vue/require-prop-types': 0,
-    'vue/no-unused-vars': 0,
-    'no-tabs': 0,
-    'vue/multi-word-component-names': 0,
-    'vue/no-reserved-component-names': 0
-  }
-}
--- a/.node-version
+++ b/.node-version
@ -1 +0,0 @@
-7.2.1
--- a/.tool-versions
+++ b/.tool-versions
@ -0,0 +1 @@
+nodejs 20.12.2
--- a/.woodpecker.yml
+++ b/.woodpecker.yml
@ -1,20 +1,21 @@
+labels:
  platform: linux/amd64
-pipeline:
+
+steps:
  lint:
    when:
      event:
      - pull_request
-    image: node:18
+    image: node:20
    commands:
    - yarn
    - yarn lint
-    #- yarn stylelint

  test:
    when:
      event:
      - pull_request
-    image: node:18
+    image: node:20
    commands:
    - apt update
    - apt install firefox-esr -y --no-install-recommends
@ -28,7 +29,7 @@ pipeline:
      branch:
      - develop
      - stable
-    image: node:18
+    image: node:20
    commands:
    - yarn
    - yarn build
@ -40,15 +41,15 @@ pipeline:
      branch:
      - develop
      - stable
-    image: node:18
+    image: node:20
    secrets:
    - SCW_ACCESS_KEY
    - SCW_SECRET_KEY
    - SCW_DEFAULT_ORGANIZATION_ID
    commands:
      - apt-get update && apt-get install -y rclone wget zip
-      - wget https://github.com/scaleway/scaleway-cli/releases/download/v2.5.1/scaleway-cli_2.5.1_linux_amd64
-      - mv scaleway-cli_2.5.1_linux_amd64 scaleway-cli
+      - wget https://github.com/scaleway/scaleway-cli/releases/download/v2.30.0/scaleway-cli_2.30.0_linux_amd64
+      - mv scaleway-cli_2.30.0_linux_amd64 scaleway-cli
      - chmod +x scaleway-cli
      - ./scaleway-cli object config install type=rclone
      - zip akkoma-fe.zip -r dist
@ -70,8 +71,8 @@ pipeline:
    - SCW_DEFAULT_ORGANIZATION_ID
    commands:
    - apt-get update && apt-get install -y rclone wget git zip
-    - wget https://github.com/scaleway/scaleway-cli/releases/download/v2.5.1/scaleway-cli_2.5.1_linux_amd64
-    - mv scaleway-cli_2.5.1_linux_amd64 scaleway-cli
+    - wget https://github.com/scaleway/scaleway-cli/releases/download/v2.30.0/scaleway-cli_2.30.0_linux_amd64
+    - mv scaleway-cli_2.30.0_linux_amd64 scaleway-cli
    - chmod +x scaleway-cli
    - ./scaleway-cli object config install type=rclone
    - cd docs
--- a/README.md
+++ b/README.md
@ -20,9 +20,11 @@ To use Akkoma-FE in Akkoma, use the [frontend](https://docs.akkoma.dev/stable/ad

 ## Build Setup

+Make sure you have [Node.js](https://nodejs.org/) installed. You can check `/.woodpecker.yml` for which node version the Akkoma CI currently uses.
+
 ``` bash
 # install dependencies
-npm install -g yarn
+corepack enable
 yarn

 # serve with hot reload at localhost:8080
@ -37,7 +39,7 @@ npm run unit

 # For Contributors:

-You can create file `/config/local.json` (see [example](https://git.pleroma.social/pleroma/pleroma-fe/blob/develop/config/local.example.json)) to enable some convenience dev options:
+You can create file `/config/local.json` (see [example](https://akkoma.dev/AkkomaGang/akkoma-fe/src/branch/develop/config/local.example.json)) to enable some convenience dev options:

 * `target`: makes local dev server redirect to some existing instance's BE instead of local BE, useful for testing things in near-production environment and searching for real-life use-cases.
 * `staticConfigPreference`: makes FE's `/static/config.json` take preference of BE-served `/api/statusnet/config.json`. Only works in dev mode.
--- a/build/build.js
+++ b/build/build.js
@ -1,36 +1,36 @@
 // https://github.com/shelljs/shelljs
-require('./check-versions')()
-require('shelljs/global')
-env.NODE_ENV = 'production'
+require("./check-versions")();
+require("shelljs/global");
+env.NODE_ENV = "production";

-var path = require('path')
-var config = require('../config')
-var ora = require('ora')
-var webpack = require('webpack')
-var webpackConfig = require('./webpack.prod.conf')
+var path = require("path");
+var config = require("../config");
+var webpack = require("webpack");
+var webpackConfig = require("./webpack.prod.conf");

 console.log(
-  '  Tip:\n' +
-  '  Built files are meant to be served over an HTTP server.\n' +
-  '  Opening index.html over file:// won\'t work.\n'
-)
+  "  Tip:\n" +
+    "  Built files are meant to be served over an HTTP server.\n" +
+    "  Opening index.html over file:// won't work.\n",
+);

-var spinner = ora('building for production...')
-spinner.start()
-
-var assetsPath = path.join(config.build.assetsRoot, config.build.assetsSubDirectory)
-rm('-rf', assetsPath)
-mkdir('-p', assetsPath)
-cp('-R', 'static/*', assetsPath)
+var assetsPath = path.join(
+  config.build.assetsRoot,
+  config.build.assetsSubDirectory,
+);
+rm("-rf", assetsPath);
+mkdir("-p", assetsPath);
+cp("-R", "static/*", assetsPath);

 webpack(webpackConfig, function (err, stats) {
-  spinner.stop()
-  if (err) throw err
-  process.stdout.write(stats.toString({
+  if (err) throw err;
+  process.stdout.write(
+    stats.toString({
      colors: true,
      modules: false,
      children: false,
      chunks: false,
-    chunkModules: false
-  }) + '\n')
-})
+      chunkModules: false,
+    }) + "\n",
+  );
+});
--- a/build/dev-server.js
+++ b/build/dev-server.js
@ -5,7 +5,7 @@ var path = require('path')
 var express = require('express')
 var webpack = require('webpack')
 var opn = require('opn')
-var proxyMiddleware = require('http-proxy-middleware')
+const { createProxyMiddleware } = require('http-proxy-middleware');
 var webpackConfig = process.env.NODE_ENV === 'testing'
  ? require('./webpack.prod.conf')
  : require('./webpack.dev.conf')
@ -36,7 +36,13 @@ Object.keys(proxyTable).forEach(function (context) {
  if (typeof options === 'string') {
    options = { target: options }
  }
-  app.use(proxyMiddleware(context, options))
+  const targetUrl = new URL(options.target);
+  // add path
+  targetUrl.pathname = context;
+  options.target = targetUrl.toString();
+
+  console.log("Proxying", context, "to", options.target);
+  app.use(context, createProxyMiddleware(options))
 })

 // handle fallback for HTML5 history API
--- a/build/webpack.base.conf.js
+++ b/build/webpack.base.conf.js
@ -3,6 +3,7 @@ var config = require('../config')
 var utils = require('./utils')
 var projectRoot = path.resolve(__dirname, '../')
 var { VueLoaderPlugin } = require('vue-loader')
+const ESLintPlugin = require('eslint-webpack-plugin');

 var env = process.env.NODE_ENV
 // check env & config/index.js to decide weither to enable CSS Sourcemaps for the
@ -35,6 +36,7 @@ module.exports = {
    ],
    fallback: {
      "url": require.resolve("url/"),
+      querystring: require.resolve("querystring-es3")
    },
    alias: {
      'static': path.resolve(__dirname, '../static'),
@ -47,20 +49,6 @@ module.exports = {
  module: {
    noParse: /node_modules\/localforage\/dist\/localforage.js/,
    rules: [
-      {
-        enforce: 'pre',
-        test: /\.(js|vue)$/,
-        include: projectRoot,
-        exclude: /node_modules/,
-        use: {
-          loader: 'eslint-loader',
-          options: {
-            formatter: require('eslint-friendly-formatter'),
-            sourceMap: config.build.productionSourceMap,
-            extract: true
-          }
-        }
-      },
      {
        enforce: 'post',
        test: /\.(json5?|ya?ml)$/, // target json, json5, yaml and yml files
@ -118,6 +106,9 @@ module.exports = {
    ]
  },
  plugins: [
-    new VueLoaderPlugin()
+    new VueLoaderPlugin(),
+    new ESLintPlugin({
+      configType: 'flat'
+    })
  ]
 }
--- a/config/local.example.json
+++ b/config/local.example.json
@ -1,4 +1,4 @@
 {
-  "target": "https://pleroma.soykaf.com/",
+  "target": "https://otp.akkoma.dev/",
  "staticConfigPreference": false
 }
--- a/config/test.env.js
+++ b/config/test.env.js
@ -2,5 +2,4 @@ var { merge } = require('webpack-merge')
 var devEnv = require('./dev.env')

 module.exports = merge(devEnv, {
-  NODE_ENV: '"testing"'
 })
--- a/eslint.config.js
+++ b/eslint.config.js
@ -0,0 +1,31 @@
+const pluginVue = require('eslint-plugin-vue')
+const pluginImport = require('eslint-plugin-import')
+
+module.exports = [
+  ...pluginVue.configs['flat/recommended'],
+  {
+    languageOptions: {
+      parserOptions: {
+        parser: '@babel/eslint-parser',
+        sourceType: 'module'
+      }
+    },
+    rules: {
+      // allow paren-less arrow functions
+      'arrow-parens': 0,
+      // allow async-await
+      'generator-star-spacing': 0,
+      // allow debugger during development
+      'no-debugger': process.env.NODE_ENV === 'production' ? 2 : 0,
+      'vue/require-prop-types': 0,
+      'vue/no-unused-vars': 0,
+      'no-tabs': 0,
+      'vue/multi-word-component-names': 0,
+      'vue/no-reserved-component-names': 0
+    },
+    ignores: [
+      'build/*.js',
+      'config/*.js'
+    ]
+  }
+]
--- a/package.json
+++ b/package.json
@ -12,120 +12,118 @@
    "e2e": "node test/e2e/runner.js",
    "test": "npm run unit && npm run e2e",
    "stylelint": "stylelint src/**/*.scss",
-    "lint": "eslint --ext .js,.vue src test/unit/specs test/e2e/specs",
-    "lint-fix": "eslint --fix --ext .js,.vue src test/unit/specs test/e2e/specs"
+    "lint": "eslint src test/unit/specs test/e2e/specs",
+    "lint-fix": "eslint --fix src test/unit/specs test/e2e/specs"
  },
  "dependencies": {
    "@babel/runtime": "7.17.8",
-    "@chenfengyuan/vue-qrcode": "2.0.0",
+    "@chenfengyuan/vue-qrcode": "^2.0.0",
    "@floatingghost/pinch-zoom-element": "^1.3.1",
-    "@fortawesome/fontawesome-svg-core": "1.3.0",
-    "@fortawesome/free-regular-svg-icons": "^6.1.2",
-    "@fortawesome/free-solid-svg-icons": "^6.2.0",
-    "@fortawesome/vue-fontawesome": "3.0.1",
-    "@vuelidate/core": "^2.0.0",
-    "@vuelidate/validators": "^2.0.0",
-    "blurhash": "^2.0.4",
-    "body-scroll-lock": "2.7.1",
-    "chromatism": "3.0.0",
-    "click-outside-vue3": "4.0.1",
-    "cropperjs": "1.5.12",
-    "diff": "3.5.0",
-    "escape-html": "1.0.3",
+    "@fortawesome/fontawesome-svg-core": "^6.5.2",
+    "@fortawesome/free-regular-svg-icons": "^6.5.2",
+    "@fortawesome/free-solid-svg-icons": "^6.5.2",
+    "@fortawesome/vue-fontawesome": "^3.0.8",
+    "@vuelidate/core": "^2.0.3",
+    "@vuelidate/validators": "^2.0.4",
+    "blurhash": "^2.0.5",
+    "body-scroll-lock": "^3.1.5",
+    "chromatism": "^3.0.0",
+    "click-outside-vue3": "^4.0.1",
+    "cropperjs": "^1.6.2",
+    "diff": "^5.2.0",
+    "escape-html": "^1.0.3",
    "iso-639-1": "^2.1.15",
    "js-cookie": "^3.0.1",
-    "localforage": "1.10.0",
+    "localforage": "^1.10.0",
    "parse-link-header": "^2.0.0",
-    "phoenix": "1.6.2",
-    "punycode.js": "2.1.0",
-    "qrcode": "1",
-    "url": "^0.11.0",
-    "vue": "^3.2.31",
-    "vue-i18n": "^9.2.2",
-    "vue-router": "4.0.14",
-    "vue-template-compiler": "2.6.11",
-    "vuex": "4.0.2"
+    "phoenix": "^1.7.12",
+    "punycode.js": "^2.3.1",
+    "qrcode": "^1.5.3",
+    "querystring-es3": "^0.2.1",
+    "url": "^0.11.3",
+    "vue": "^3.4.38",
+    "vue-i18n": "^9.14.0",
+    "vue-router": "^4.4.3",
+    "vue-template-compiler": "^2.7.16",
+    "vuex": "^4.1.0"
  },
  "devDependencies": {
-    "@babel/core": "7.17.8",
+    "@babel/core": "^7.24.6",
    "@babel/eslint-parser": "^7.19.1",
-    "@babel/plugin-transform-runtime": "7.17.0",
-    "@babel/preset-env": "7.16.11",
-    "@babel/register": "7.17.7",
+    "@babel/plugin-transform-runtime": "^7.24.6",
+    "@babel/preset-env": "^7.24.6",
+    "@babel/register": "^7.24.6",
    "@intlify/vue-i18n-loader": "^5.0.0",
-    "@ungap/event-target": "0.2.3",
-    "@vue/babel-helper-vue-jsx-merge-props": "1.2.1",
-    "@vue/babel-plugin-jsx": "1.1.1",
+    "@ungap/event-target": "^0.2.4",
+    "@vue/babel-helper-vue-jsx-merge-props": "^1.4.0",
+    "@vue/babel-plugin-jsx": "^1.2.2",
    "@vue/compiler-sfc": "^3.1.0",
    "@vue/test-utils": "^2.0.2",
-    "autoprefixer": "6.7.7",
+    "autoprefixer": "^10.4.19",
    "babel-loader": "^9.1.0",
-    "babel-plugin-lodash": "3.3.4",
+    "babel-plugin-lodash": "^3.3.4",
    "chai": "^4.3.7",
-    "chalk": "1.1.3",
-    "chromedriver": "^107.0.3",
+    "chalk": "^1.1.3",
+    "chromedriver": "^119.0.1",
    "connect-history-api-fallback": "^2.0.0",
    "cross-spawn": "^7.0.3",
-    "css-loader": "^6.7.2",
+    "css-loader": "^7.1.2",
    "custom-event-polyfill": "^1.0.7",
-    "eslint": "^7.32.0",
-    "eslint-config-standard": "^17.0.0",
+    "eslint": "^9.3.0",
+    "eslint-config-standard": "^17.1.0",
    "eslint-friendly-formatter": "^4.0.1",
-    "eslint-loader": "^4.0.2",
-    "eslint-plugin-import": "^2.26.0",
+    "eslint-plugin-import": "^2.29.1",
    "eslint-plugin-node": "^11.1.0",
-    "eslint-plugin-promise": "^6.1.1",
+    "eslint-plugin-promise": "^6.2.0",
    "eslint-plugin-standard": "^5.0.0",
-    "eslint-plugin-vue": "^9.7.0",
-    "eventsource-polyfill": "0.9.6",
-    "express": "4.17.3",
+    "eslint-plugin-vue": "^9.26.0",
+    "eslint-webpack-plugin": "^4.2.0",
+    "eventsource-polyfill": "^0.9.6",
+    "express": "^4.19.2",
    "file-loader": "^6.2.0",
-    "function-bind": "1.1.1",
+    "function-bind": "^1.1.2",
    "html-webpack-plugin": "^5.5.0",
-    "http-proxy-middleware": "0.21.0",
-    "inject-loader": "2.0.1",
-    "isparta-loader": "2.0.0",
-    "json-loader": "0.5.7",
-    "karma": "6.3.17",
-    "karma-coverage": "1.1.2",
-    "karma-firefox-launcher": "1.3.0",
-    "karma-mocha": "2.0.1",
-    "karma-mocha-reporter": "2.2.5",
-    "karma-sinon-chai": "2.0.2",
-    "karma-sourcemap-loader": "0.3.8",
-    "karma-spec-reporter": "0.0.33",
+    "http-proxy-middleware": "^3.0.0",
+    "json-loader": "^0.5.7",
+    "karma": "^6.4.3",
+    "karma-coverage": "^2.2.1",
+    "karma-firefox-launcher": "^2.1.3",
+    "karma-mocha": "^2.0.1",
+    "karma-mocha-reporter": "^2.2.5",
+    "karma-sinon-chai": "^2.0.2",
+    "karma-sourcemap-loader": "^0.4.0",
+    "karma-spec-reporter": "^0.0.36",
    "karma-webpack": "^5.0.0",
-    "lodash": "4.17.21",
-    "lolex": "1.6.0",
-    "mini-css-extract-plugin": "0.12.0",
-    "mocha": "3.5.3",
-    "nightwatch": "0.9.21",
-    "opn": "4.0.2",
-    "ora": "0.4.1",
+    "lodash": "^4.17.21",
+    "lolex": "^6.0.0",
+    "mini-css-extract-plugin": "^2.9.0",
+    "mocha": "^10.4.0",
+    "nightwatch": "^3.6.3",
+    "opn": "^6.0.0",
    "postcss-html": "^1.5.0",
-    "postcss-loader": "3.0.0",
+    "postcss-loader": "^8.1.1",
    "postcss-sass": "^0.5.0",
-    "raw-loader": "0.5.1",
-    "sass": "^1.56.0",
-    "sass-loader": "^13.2.0",
-    "selenium-server": "2.53.1",
-    "semver": "5.7.1",
-    "shelljs": "0.8.5",
-    "sinon": "2.4.1",
-    "sinon-chai": "2.14.0",
+    "raw-loader": "^4.0.2",
+    "sass": "^1.77.2",
+    "sass-loader": "^14.2.1",
+    "selenium-server": "^3.141.59",
+    "semver": "^7.6.2",
+    "shelljs": "^0.8.5",
+    "sinon": "^18.0.0",
+    "sinon-chai": "^3.7.0",
    "stylelint": "^14.15.0",
    "stylelint-config-recommended-vue": "^1.4.0",
    "stylelint-config-standard": "^29.0.0",
    "stylelint-config-standard-scss": "^6.1.0",
    "stylelint-rscss": "^0.4.0",
    "url-loader": "^4.1.1",
-    "vue-loader": "^17.0.0",
-    "vue-style-loader": "^4.1.2",
-    "webpack": "^5.75.0",
-    "webpack-dev-middleware": "^5.3.3",
-    "webpack-hot-middleware": "^2.25.1",
-    "webpack-merge": "^5.8.0",
-    "workbox-webpack-plugin": "^6.5.4"
+    "vue-loader": "^17.4.2",
+    "vue-style-loader": "^4.1.3",
+    "webpack": "^5.91.0",
+    "webpack-dev-middleware": "^7.2.1",
+    "webpack-hot-middleware": "^2.26.1",
+    "webpack-merge": "^5.10.0",
+    "workbox-webpack-plugin": "^7.1.0"
  },
  "engines": {
    "node": ">= 16.0.0",
--- a/src/App.js
+++ b/src/App.js
@ -64,6 +64,11 @@ export default {
        '-' + this.layoutType
      ]
    },
+    pageBackground () {
+      return this.mergedConfig.displayPageBackgrounds
+        ? this.$store.state.users.displayBackground
+        : null
+    },
    currentUser () { return this.$store.state.users.currentUser },
    userBackground () { return this.currentUser.background_image },
    instanceBackground () {
@ -71,7 +76,7 @@ export default {
        ? null
        : this.$store.state.instance.background
    },
-    background () { return this.userBackground || this.instanceBackground },
+    background () { return this.pageBackground || this.userBackground || this.instanceBackground },
    bgStyle () {
      if (this.background) {
        return {
--- a/src/App.scss
+++ b/src/App.scss
@ -8,7 +8,7 @@
 }

 html {
-  font-size: 14px;
+  font-size: 0.875rem;
  // overflow-x: clip causes my browser's tab to crash with SIGILL lul
 }

@ -20,7 +20,7 @@ body {
  color: var(--text, $fallback--text);
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
-  overscroll-behavior-y: none;
+  overscroll-behavior-y: auto;
  overflow-x: clip;
  overflow-y: scroll;

--- a/src/components/account_actions/account_actions.vue
+++ b/src/components/account_actions/account_actions.vue
@ -6,7 +6,7 @@
      :bound-to="{ x: 'container' }"
      remove-padding
    >
-      <template v-slot:content>
+      <template #content>
        <div class="dropdown-menu">
          <template v-if="relationship.following">
            <button
@ -71,7 +71,7 @@
          </button>
        </div>
      </template>
-      <template v-slot:trigger>
+      <template #trigger>
        <button class="button-unstyled ellipsis-button">
          <FAIcon
            class="icon"
@ -93,7 +93,7 @@
          keypath="user_card.block_confirm"
          tag="span"
        >
-          <template v-slot:user>
+          <template #user>
            <span
              v-text="user.screen_name_ui"
            />
--- a/src/components/attachment/attachment.scss
+++ b/src/components/attachment/attachment.scss
@ -37,7 +37,7 @@
      white-space: pre-line;
      word-break: break-word;
      text-overflow: ellipsis;
-      overflow: scroll;
+      overflow: auto;
    }

    &.-static {
--- a/src/components/attachment/attachment.vue
+++ b/src/components/attachment/attachment.vue
@ -246,8 +246,8 @@
          ref="flash"
          class="flash"
          :src="attachment.large_thumb_url || attachment.url"
-          @playerOpened="setFlashLoaded(true)"
-          @playerClosed="setFlashLoaded(false)"
+          @player-opened="setFlashLoaded(true)"
+          @player-closed="setFlashLoaded(false)"
        />
      </span>
    </div>
--- a/src/components/checkbox/checkbox.vue
+++ b/src/components/checkbox/checkbox.vue
@ -22,12 +22,12 @@

 <script>
 export default {
-  emits: ['update:modelValue'],
  props: [
    'modelValue',
    'indeterminate',
    'disabled'
-  ]
+  ],
+  emits: ['update:modelValue']
 }
 </script>

--- a/src/components/color_input/color_input.vue
+++ b/src/components/color_input/color_input.vue
@ -14,7 +14,7 @@
      :model-value="present"
      :disabled="disabled"
      class="opt"
-      @update:modelValue="$emit('update:modelValue', typeof modelValue === 'undefined' ? fallback : undefined)"
+      @update:model-value="$emit('update:modelValue', typeof modelValue === 'undefined' ? fallback : undefined)"
    />
    <div class="input color-input-field">
      <input
@ -46,7 +46,6 @@
    </div>
  </div>
 </template>
-<style lang="scss" src="./color_input.scss"></style>
 <script>
 import Checkbox from '../checkbox/checkbox.vue'
 import { hex2rgb } from '../../services/color_convert/color_convert.js'
@ -108,6 +107,7 @@ export default {
  }
 }
 </script>
+<style lang="scss" src="./color_input.scss"></style>

 <style lang="scss">
 .color-control {
--- a/src/components/confirm_modal/confirm_modal.vue
+++ b/src/components/confirm_modal/confirm_modal.vue
@ -25,6 +25,8 @@
  </dialog-modal>
 </template>

+<script src="./confirm_modal.js"></script>
+
 <style lang="scss" scoped>
@import '../../_variables';

@ -35,5 +37,3 @@
  }
 }
 </style>
-
-<script src="./confirm_modal.js"></script>
--- a/src/components/conversation/conversation.js
+++ b/src/components/conversation/conversation.js
@ -267,11 +267,11 @@ const conversation = {
    },
    replies () {
      let i = 1
-      // eslint-disable-next-line camelcase
+       
      return reduce(this.conversation, (result, { id, in_reply_to_status_id }) => {
-        /* eslint-disable camelcase */
+         
        const irid = in_reply_to_status_id
-        /* eslint-enable camelcase */
+         
        if (irid) {
          result[irid] = result[irid] || []
          result[irid].push({
--- a/src/components/conversation/conversation.vue
+++ b/src/components/conversation/conversation.vue
@ -91,7 +91,7 @@
              :controlled-set-media-playing="(newVal) => toggleStatusContentProperty(status.id, 'mediaPlaying', newVal)"

              @goto="setHighlight"
-              @toggleExpanded="toggleExpanded"
+              @toggle-expanded="toggleExpanded"
            />
            <div
              v-if="showOtherRepliesButtonBelowStatus && getReplies(status.id).length > 1"
@ -184,7 +184,7 @@
          :toggle-status-content-property="toggleStatusContentProperty"

          @goto="setHighlight"
-          @toggleExpanded="toggleExpanded"
+          @toggle-expanded="toggleExpanded"
        />
      </div>
    </div>
--- a/src/components/desktop_nav/desktop_nav.vue
+++ b/src/components/desktop_nav/desktop_nav.vue
@ -44,9 +44,9 @@
            />
          </router-link>
          <router-link
+            v-if="publicTimelineVisible"
            :to="{ name: 'public-timeline' }"
            class="nav-icon"
-            v-if="publicTimelineVisible"
          >
            <FAIcon
              fixed-width
@ -68,9 +68,9 @@
            />
          </router-link>
          <router-link
+            v-if="federatedTimelineVisible"
            :to="{ name: 'public-external-timeline' }"
            class="nav-icon"
-            v-if="federatedTimelineVisible"
          >
            <FAIcon
              fixed-width
--- a/src/components/domain_mute_card/domain_mute_card.vue
+++ b/src/components/domain_mute_card/domain_mute_card.vue
@ -9,7 +9,7 @@
      class="btn button-default"
    >
      {{ $t('domain_mute_card.unmute') }}
-      <template v-slot:progress>
+      <template #progress>
        {{ $t('domain_mute_card.unmute_progress') }}
      </template>
    </ProgressButton>
@ -19,7 +19,7 @@
      class="btn button-default"
    >
      {{ $t('domain_mute_card.mute') }}
-      <template v-slot:progress>
+      <template #progress>
        {{ $t('domain_mute_card.mute_progress') }}
      </template>
    </ProgressButton>
--- a/src/components/edit_status_modal/edit_status_modal.vue
+++ b/src/components/edit_status_modal/edit_status_modal.vue
@ -2,7 +2,7 @@
  <Modal
    v-if="isFormVisible"
    class="edit-form-modal-view"
-    @backdropClicked="closeModal"
+    @backdrop-clicked="closeModal"
  >
    <div class="edit-form-modal-panel panel">
      <div class="panel-heading">
@ -11,10 +11,10 @@
      <PostStatusForm
        class="panel-body"
        v-bind="params"
-        @posted="closeModal"
-        :disablePolls="true"
-        :disableVisibilitySelector="true"
+        :disable-polls="true"
+        :disable-visibility-selector="true"
        :post-handler="doEditStatus"
+        @posted="closeModal"
      />
    </div>
  </Modal>
--- a/src/components/emoji_input/emoji_input.vue
+++ b/src/components/emoji_input/emoji_input.vue
@ -43,7 +43,10 @@
          :class="{ highlighted: index === highlighted }"
          @click.stop.prevent="onClick($event, suggestion)"
        >
-          <span v-if="!suggestion.mfm" class="image">
+          <span
+            v-if="!suggestion.mfm"
+            class="image"
+          >
            <img
              v-if="suggestion.img"
              :src="suggestion.img"
--- a/src/components/emoji_input/suggestor.js
+++ b/src/components/emoji_input/suggestor.js
@ -122,14 +122,14 @@ export const suggestUsers = ({ dispatch, state }) => {
      const screenNameAlphabetically = a.screen_name > b.screen_name ? 1 : -1

      return diff + nameAlphabetically + screenNameAlphabetically
-      /* eslint-disable camelcase */
+       
    }).map(({ screen_name, screen_name_ui, name, profile_image_url_original }) => ({
      displayText: screen_name_ui,
      detailText: name,
      imageUrl: profile_image_url_original,
      replacement: '@' + screen_name + ' '
    }))
-    /* eslint-enable camelcase */
+     

    suggestions = newSuggestions || []
    return suggestions
--- a/src/components/extra_buttons/extra_buttons.vue
+++ b/src/components/extra_buttons/extra_buttons.vue
@ -7,7 +7,7 @@
    :bound-to="{ x: 'container' }"
    remove-padding
  >
-    <template v-slot:content="{close}">
+    <template #content="{close}">
      <div class="dropdown-menu">
        <button
          v-if="canMute && !status.thread_muted"
@ -172,7 +172,7 @@
        </button>
      </div>
    </template>
-    <template v-slot:trigger>
+    <template #trigger>
      <button class="button-unstyled popover-trigger">
        <FAIcon
          class="fa-scale-110 fa-old-padding"
--- a/src/components/follow_request_card/follow_request_card.vue
+++ b/src/components/follow_request_card/follow_request_card.vue
@ -1,5 +1,8 @@
 <template>
-  <basic-user-card :user="user" v-if="show">
+  <basic-user-card
+    v-if="show"
+    :user="user"
+  >
    <div class="follow-request-card-content-container">
      <button
        class="btn button-default"
--- a/src/components/gallery/gallery.vue
+++ b/src/components/gallery/gallery.vue
@ -31,8 +31,8 @@
            :description="descriptions && descriptions[attachment.id]"
            :hide-description="size === 'small' || tooManyAttachments && hidingLong"
            :style="itemStyle(attachment.id, row.items)"
-            @setMedia="onMedia"
-            @naturalSizeLoad="onNaturalSizeLoad"
+            @set-media="onMedia"
+            @natural-size-load="onNaturalSizeLoad"
          />
        </div>
      </div>
--- a/src/components/list/list.vue
+++ b/src/components/list/list.vue
@ -42,6 +42,7 @@ export default {
@import '../../_variables.scss';

 .list {
+  min-height: 1em;
  &-item:not(:last-child) {
    border-bottom: 1px solid;
    border-bottom-color: $fallback--border;
--- a/src/components/media_modal/media_modal.vue
+++ b/src/components/media_modal/media_modal.vue
@ -2,7 +2,7 @@
  <Modal
    v-if="showing"
    class="media-modal-view"
-    @backdropClicked="hideIfNotSwiped"
+    @backdrop-clicked="hideIfNotSwiped"
  >
    <SwipeClick
      v-if="type === 'image'"
--- a/src/components/media_upload/media_upload.js
+++ b/src/components/media_upload/media_upload.js
@ -42,7 +42,7 @@ const mediaUpload = {
        .then((fileData) => {
          self.$emit('uploaded', fileData)
          self.decreaseUploadCount()
-        }, (error) => { // eslint-disable-line handle-callback-err
+        }, (error) => {  
          self.$emit('upload-failed', 'default')
          self.decreaseUploadCount()
        })
--- a/src/components/mention_link/mention_link.js
+++ b/src/components/mention_link/mention_link.js
@ -93,9 +93,6 @@ const MentionLink = {
        this.highlightType
      ]
    },
-    useAtIcon () {
-      return this.mergedConfig.useAtIcon
-    },
    isRemote () {
      return this.userName !== this.userNameFull
    },
--- a/src/components/mod_modal/tabs/reports_tab/report_card.vue
+++ b/src/components/mod_modal/tabs/reports_tab/report_card.vue
@ -4,7 +4,7 @@
      class="panel-heading"
      @click="toggleHidden"
    >
-      <h4>{{ $t('moderation.reports.report') + ' ' + this.account.screen_name }}</h4>
+      <h4>{{ $t('moderation.reports.report') + ' ' + account.screen_name }}</h4>
      <button
        v-if="isOpen"
        class="button-default"
@ -35,7 +35,10 @@
        <div v-if="content">
          {{ decode(content) }}
        </div>
-        <i v-else class="faint">
+        <i
+          v-else
+          class="faint"
+        >
          {{ $t('moderation.reports.no_content') }}
        </i>
        <div class="report-author">
@ -43,12 +46,12 @@
            class="small-avatar"
            :user="actor"
          />
-          {{ this.actor.screen_name }}
+          {{ actor.screen_name }}
        </div>
      </div>
      <div
+        v-if="!hidden && statuses.length > 0"
        class="dropdown"
-        v-if="!hidden && this.statuses.length > 0"
      >
        <button
          class="button button-unstyled dropdown-header"
@ -74,8 +77,8 @@
        </div>
      </div>
      <div
+        v-if="!hidden && notes.length > 0"
        class="dropdown"
-        v-if="!hidden && this.notes.length > 0"
      >
        <button
          class="button button-unstyled dropdown-header"
@ -99,9 +102,9 @@
      </div>
      <div class="report-add-note">
        <textarea
+          v-model.trim="note"
          rows="1"
          cols="1"
-          v-model.trim="note"
          :placeholder="$t('moderation.reports.note_placeholder')"
        />
        <button
@ -134,7 +137,7 @@
        :offset="{ y: 5 }"
        remove-padding
      >
-        <template v-slot:trigger>
+        <template #trigger>
          <button
            class="btn button-default"
            :disabled="!tagPolicyEnabled"
@ -147,7 +150,7 @@
            />
          </button>
        </template>
-        <template v-slot:content="{close}">
+        <template #content="{close}">
          <div
            class="dropdown-menu"
            :disabled="!tagPolicyEnabled"
--- a/src/components/mod_modal/tabs/reports_tab/report_note.vue
+++ b/src/components/mod_modal/tabs/reports_tab/report_note.vue
@ -6,7 +6,7 @@
          class="small-avatar"
          :user="user"
        />
-        {{ this.user.screen_name }}
+        {{ user.screen_name }}
      </div>
      <div class="header-right">
        <Timeago
--- a/src/components/modal/modal.vue
+++ b/src/components/modal/modal.vue
@ -22,6 +22,9 @@ export default {
      default: false
    }
  },
+  emits: [
+    'backdropClicked',
+  ],
  computed: {
    classes () {
      return {
--- a/src/components/moderation_tools/moderation_tools.vue
+++ b/src/components/moderation_tools/moderation_tools.vue
@ -8,7 +8,7 @@
      @show="setToggled(true)"
      @close="setToggled(false)"
    >
-      <template v-slot:content>
+      <template #content>
        <div class="dropdown-menu">
          <span v-if="user.is_local">
            <button
@ -122,7 +122,7 @@
          </span>
        </div>
      </template>
-      <template v-slot:trigger>
+      <template #trigger>
        <button
          class="btn button-default btn-block moderation-tools-button"
          :class="{ toggled }"
@ -137,11 +137,11 @@
        v-if="showDeleteUserDialog"
        :on-cancel="deleteUserDialog.bind(this, false)"
      >
-        <template v-slot:header>
+        <template #header>
          {{ $t('user_card.admin_menu.delete_user') }}
        </template>
        <p>{{ $t('user_card.admin_menu.delete_user_confirmation') }}</p>
-        <template v-slot:footer>
+        <template #footer>
          <button
            class="btn button-default"
            @click="deleteUserDialog(false)"
--- a/src/components/notification/notification.js
+++ b/src/components/notification/notification.js
@ -6,6 +6,7 @@ import UserCard from '../user_card/user_card.vue'
 import Timeago from '../timeago/timeago.vue'
 import RichContent from 'src/components/rich_content/rich_content.jsx'
 import ConfirmModal from '../confirm_modal/confirm_modal.vue'
+import StillImage from '../still-image/still-image.vue'
 import { isStatusNotification } from '../../services/notification_utils/notification_utils.js'
 import { highlightClass, highlightStyle } from '../../services/user_highlighter/user_highlighter.js'
 import generateProfileLink from 'src/services/user_profile_link_generator/user_profile_link_generator'
@ -50,7 +51,8 @@ const Notification = {
    Timeago,
    Status,
    RichContent,
-    ConfirmModal
+    ConfirmModal,
+    StillImage
  },
  methods: {
    toggleUserExpanded () {
--- a/src/components/notification/notification.vue
+++ b/src/components/notification/notification.vue
@ -116,12 +116,13 @@
                  scope="global"
                  keypath="notifications.reacted_with"
                >
-                  <img
+                  <still-image
                    v-if="notification.emoji_url !== null"
                    class="notification-reaction-emoji"
                    :src="notification.emoji_url"
-                    :name="notification.emoji"
-                  >
+                    :title="notification.emoji"
+                    :alt="notification.emoji"
+                  />
                  <span
                    v-else
                    class="emoji-reaction-emoji"
@ -151,7 +152,6 @@
            >
              <Timeago
                :time="notification.created_at"
-                :with-direction="true"
                :auto-update="240"
              />
            </router-link>
--- a/src/components/notifications/notification_filters.vue
+++ b/src/components/notifications/notification_filters.vue
@ -5,7 +5,7 @@
    placement="bottom"
    :bound-to="{ x: 'container' }"
  >
-    <template v-slot:content>
+    <template #content>
      <div class="dropdown-menu">
        <button
          class="button-default dropdown-item"
@ -72,7 +72,7 @@
        </button>
      </div>
    </template>
-    <template v-slot:trigger>
+    <template #trigger>
      <button class="filter-trigger-button button-unstyled">
        <FAIcon icon="filter" />
      </button>
--- a/src/components/notifications/notifications.scss
+++ b/src/components/notifications/notifications.scss
@ -105,9 +105,12 @@
    flex: 1;
    padding-left: 0.8em;
    min-width: 0;
+  }

+  .heading-right, .notification-right {
    .timeago {
-      min-width: 3em;
+      display: inline-block;
+      min-width: 6em;
      text-align: right;
    }
  }
--- a/src/components/opacity_input/opacity_input.vue
+++ b/src/components/opacity_input/opacity_input.vue
@ -14,7 +14,7 @@
      :model-value="present"
      :disabled="disabled"
      class="opt"
-      @update:modelValue="$emit('update:modelValue', !present ? fallback : undefined)"
+      @update:model-value="$emit('update:modelValue', !present ? fallback : undefined)"
    />
    <input
      :id="name"
--- a/src/components/pinch_zoom/pinch_zoom.vue
+++ b/src/components/pinch_zoom/pinch_zoom.vue
@ -2,7 +2,6 @@
  <pinch-zoom
    class="pinch-zoom-parent"
    v-bind="$attrs"
-    v-on="$listeners"
  >
    <slot />
  </pinch-zoom>
--- a/src/components/post_status_form/post_status_form.js
+++ b/src/components/post_status_form/post_status_form.js
@ -9,11 +9,12 @@ import StatusContent from '../status_content/status_content.vue'
 import fileTypeService from '../../services/file_type/file_type.service.js'
 import { findOffset } from '../../services/offset_finder/offset_finder.service.js'
 import { reject, map, uniqBy, debounce } from 'lodash'
+import { usePostLanguageOptions } from 'src/lib/post_language'
 import suggestor from '../emoji_input/suggestor.js'
 import { mapGetters, mapState } from 'vuex'
 import Checkbox from '../checkbox/checkbox.vue'
 import Select from '../select/select.vue'
-import iso6391 from 'iso-639-1'
+

 import { library } from '@fortawesome/fontawesome-svg-core'
 import {
@ -62,6 +63,13 @@ const deleteDraft = (draftKey) => {
 	localStorage.setItem('drafts', JSON.stringify(draftData));
 }

+const interfaceToISOLanguage = (ilang) => {
+    const sep = ilang.indexOf("_");
+    return sep < 0 ?
+        ilang :
+        ilang.substr(0, sep);
+}
+
 const PostStatusForm = {
  props: [
    'statusId',
@ -129,6 +137,13 @@ const PostStatusForm = {
      this.$refs.textarea.focus()
    }
  },
+  setup() {
+    const {postLanguageOptions} = usePostLanguageOptions()
+
+    return {
+      postLanguageOptions,
+    }
+  },
  data () {
    const preset = this.$route.query.message
    let statusText = preset || ''
@ -138,7 +153,8 @@ const PostStatusForm = {
      statusText = buildMentionsString({ user: this.repliedUser, attentions: this.attentions }, currentUser)
    }

-    const { postContentType: contentType, sensitiveByDefault, sensitiveIfSubject, interfaceLanguage } = this.$store.getters.mergedConfig
+    const { postContentType: contentType, postLanguage: defaultPostLanguage, sensitiveByDefault, sensitiveIfSubject, interfaceLanguage, alwaysShowSubjectInput } = this.$store.getters.mergedConfig
+    const postLanguage = defaultPostLanguage || interfaceToISOLanguage(interfaceLanguage)

    let statusParams = {
      spoilerText: this.subject || '',
@ -149,7 +165,7 @@ const PostStatusForm = {
      poll: {},
      mediaDescriptions: {},
      visibility: this.suggestedVisibility(),
-      language: interfaceLanguage,
+      language: postLanguage,
      contentType
    }

@ -164,7 +180,7 @@ const PostStatusForm = {
        poll: this.statusPoll || {},
        mediaDescriptions: this.statusMediaDescriptions || {},
        visibility: this.statusScope || this.suggestedVisibility(),
-        language: this.statusLanguage || interfaceLanguage,
+        language: this.statusLanguage || postLanguage,
        contentType: statusContentType
      }
    }
@ -199,6 +215,10 @@ const PostStatusForm = {
      }
    }

+    // When first loading the form, hide the subject (CW) field if it's disabled or doesn't have a starting value.
+    // "disableSubject" seems to take priority over "alwaysShowSubjectInput".
+    const showSubject = !this.disableSubject && (statusParams.spoilerText || alwaysShowSubjectInput)
+
    return {
      dropFiles: [],
      uploadingFiles: false,
@ -213,7 +233,10 @@ const PostStatusForm = {
      preview: null,
      previewLoading: false,
      emojiInputShown: false,
-      idempotencyKey: ''
+      idempotencyKey: '',
+      activeEmojiInput: undefined,
+      activeTextInput: undefined,
+      subjectVisible: showSubject
    }
  },
  computed: {
@ -302,9 +325,6 @@ const PostStatusForm = {
    ...mapState({
      mobileLayout: state => state.interface.mobileLayout
    }),
-    isoLanguages () {
-      return iso6391.getAllCodes();
-    }
  },
  watch: {
    'newStatus': {
@ -674,8 +694,33 @@ const PostStatusForm = {
      this.$refs['emoji-input'].resize()
    },
    showEmojiPicker () {
-      this.$refs['textarea'].focus()
-      this.$refs['emoji-input'].triggerShowPicker()
+      if (!this.activeEmojiInput || !this.activeTextInput)
+        this.focusStatusInput()
+
+      this.$refs[this.activeTextInput].focus()
+      this.$refs[this.activeEmojiInput].triggerShowPicker()
+    },
+    focusStatusInput() {
+      this.activeEmojiInput = 'emoji-input'
+      this.activeTextInput = 'textarea'
+    },
+    focusSubjectInput() {
+      this.activeEmojiInput = 'subject-emoji-input'
+      this.activeTextInput = 'subject-input'
+    },
+    toggleSubjectVisible() {
+      // If hiding CW, then we need to clear the subject and reset focus
+      if (this.subjectVisible)
+      {
+        this.focusStatusInput()
+
+        // "nsfw" property is normally set by the @change listener, but this bypasses it.
+        // We need to clear it manually instead.
+        this.newStatus.spoilerText = ''
+        this.newStatus.nsfw = false
+      }
+
+      this.subjectVisible = !this.subjectVisible
    },
    clearError () {
      this.error = null
--- a/src/components/post_status_form/post_status_form.vue
+++ b/src/components/post_status_form/post_status_form.vue
@ -118,13 +118,16 @@
          />
        </div>
        <EmojiInput
-          v-if="!disableSubject && (newStatus.spoilerText || alwaysShowSubject)"
+          v-if="subjectVisible"
+          ref="subject-emoji-input"
          v-model="newStatus.spoilerText"
          enable-emoji-picker
+          hide-emoji-button
          :suggest="emojiSuggestor"
          class="form-control"
        >
          <input
+            ref="subject-input"
            v-model="newStatus.spoilerText"
            type="text"
            :placeholder="$t('post_status.content_warning')"
@ -132,6 +135,7 @@
            size="1"
            class="form-post-subject"
            @input="onSubjectInput"
+            @focus="focusSubjectInput()"
          >
        </EmojiInput>
        <i18n-t
@ -166,13 +170,14 @@
            cols="1"
            :disabled="posting && !optimisticPosting"
            class="form-post-body"
-            :class="{ 'scrollable-form': !!maxHeight }"
+            :class="{ 'scrollable-form': !!maxHeight, '-has-subject': subjectVisible }"
            @keydown.exact.enter="submitOnEnter && postStatus($event, newStatus)"
            @keydown.meta.enter="postStatus($event, newStatus)"
            @keydown.ctrl.enter="!submitOnEnter && postStatus($event, newStatus)"
            @input="resize"
            @compositionupdate="resize"
            @paste="paste"
+            @focus="focusStatusInput()"
          />
          <p
            v-if="hasStatusLengthLimit"
@ -185,6 +190,7 @@
        <div
          v-if="!disableScopeSelector"
          class="visibility-tray"
+          :class="{ 'visibility-tray-edit': isEdit }"
        >
          <scope-selector
            v-if="!disableVisibilitySelector"
@ -195,7 +201,9 @@
          />

          <div
-            class="language-selector"
+            class="format-selector-container">
+            <div
+              class="format-selector"
              >
              <Select
                id="post-language"
@ -203,17 +211,17 @@
                class="form-control"
              >
                <option
-                v-for="language in isoLanguages"
-                :key="language"
-                :value="language"
+                  v-for="language in postLanguageOptions"
+                  :key="language.key"
+                  :value="language.value"
                >
-                {{ language }}
+                  {{ language.label }}
                </option>
              </Select>
            </div>
            <div
              v-if="postFormats.length > 1"
-            class="text-format"
+              class="text-format format-selector"
            >
              <Select
                id="post-content-type"
@ -231,7 +239,7 @@
            </div>
            <div
              v-if="postFormats.length === 1 && postFormats[0] !== 'text/plain'"
-            class="text-format"
+              class="text-format format-selector"
            >
              <span class="only-format">
                {{ $t(`post_status.content_type["${postFormats[0]}"]`) }}
@ -239,6 +247,7 @@
            </div>
          </div>
        </div>
+      </div>
      <poll-form
        v-if="pollsAvailable"
        ref="pollForm"
@ -276,6 +285,15 @@
          >
            <FAIcon icon="poll-h" />
          </button>
+          <button
+            v-if="!disableSubject"
+            class="spoiler-icon button-unstyled"
+            :class="{ selected: subjectVisible }"
+            :title="$t('post_status.toggle_content_warning')"
+            @click="toggleSubjectVisible"
+          >
+            <FAIcon icon="eye-slash" />
+          </button>
        </div>
        <button
          v-if="posting"
@ -446,6 +464,10 @@
    align-items: baseline;
  }

+  .visibility-tray-edit {
+    justify-content: right;
+  }
+
  .visibility-notice.edit-warning {
    > :first-child {
      margin-top: 0;
@ -456,7 +478,13 @@
    }
  }

-  .media-upload-icon, .poll-icon, .emoji-icon {
+  .format-selector-container {
+    .format-selector {
+      display: inline-block;
+    }
+  }
+
+  .media-upload-icon, .poll-icon, .emoji-icon, .spoiler-icon {
    font-size: 1.85em;
    line-height: 1.1;
    flex: 1;
@ -499,6 +527,11 @@

  .poll-icon {
    order: 3;
+    justify-content: center;
+  }
+
+  .spoiler-icon {
+    order: 4;
    justify-content: right;
  }

@ -551,6 +584,11 @@
    line-height: 1.85;
  }

+  .form-post-subject {
+    border-bottom-left-radius: 0;
+    border-bottom-right-radius: 0;
+  }
+
  .form-post-body {
    // TODO: make a resizable textarea component?
    box-sizing: content-box; // needed for easier computation of dynamic size
@ -563,6 +601,11 @@
    min-height: calc(var(--post-line-height) * 1em);
    resize: none;

+    &.-has-subject {
+      border-top-left-radius: 0;
+      border-top-right-radius: 0;
+    }
+
    &.scrollable-form {
      overflow-y: auto;
    }
--- a/src/components/post_status_modal/post_status_modal.vue
+++ b/src/components/post_status_modal/post_status_modal.vue
@ -3,7 +3,7 @@
    v-if="isLoggedIn && !resettingForm"
    :is-open="modalActivated"
    class="post-form-modal-view"
-    @backdropClicked="closeModal"
+    @backdrop-clicked="closeModal"
  >
    <div class="post-form-modal-panel panel">
      <div class="panel-heading">
--- a/src/components/react_button/react_button.vue
+++ b/src/components/react_button/react_button.vue
@ -8,13 +8,13 @@
    remove-padding
    @show="focusInput"
  >
-    <template v-slot:content="{close}">
+    <template #content="{close}">
      <EmojiPicker
        :enable-sticker-picker="false"
        @emoji="addReaction($event, close)"
      />
    </template>
-    <template v-slot:trigger>
+    <template #trigger>
      <button
        class="button-unstyled popover-trigger"
        :title="$t('tool_tip.add_reaction')"
--- a/src/components/remote_follow/remote_follow.js
+++ b/src/components/remote_follow/remote_follow.js
@ -2,7 +2,7 @@ export default {
  props: [ 'user' ],
  computed: {
    subscribeUrl () {
-      // eslint-disable-next-line no-undef
+       
      const serverUrl = new URL(this.user.statusnet_profile_url)
      return `${serverUrl.protocol}//${serverUrl.host}/main/ostatus`
    }
--- a/src/components/retweet_button/retweet_button.js
+++ b/src/components/retweet_button/retweet_button.js
@ -1,12 +1,14 @@
+import Popover from '../popover/popover.vue'
 import ConfirmModal from '../confirm_modal/confirm_modal.vue'
 import { library } from '@fortawesome/fontawesome-svg-core'
-import { faRetweet } from '@fortawesome/free-solid-svg-icons'
+import { faRetweet, faTrash } from '@fortawesome/free-solid-svg-icons'

-library.add(faRetweet)
+library.add(faRetweet, faTrash)

 const RetweetButton = {
  props: ['status', 'loggedIn', 'visibility'],
  components: {
+    Popover,
    ConfirmModal
  },
  data () {
@ -16,16 +18,16 @@ const RetweetButton = {
    }
  },
  methods: {
-    retweet () {
+    retweet (visibility) {
      if (!this.status.repeated && this.shouldConfirmRepeat) {
        this.showConfirmDialog()
      } else {
-        this.doRetweet()
+        this.doRetweet(visibility)
      }
    },
-    doRetweet () {
+    doRetweet (visibility) {
      if (!this.status.repeated) {
-        this.$store.dispatch('retweet', { id: this.status.id })
+        this.$store.dispatch('retweet', { id: this.status.id, visibility: visibility })
      } else {
        this.$store.dispatch('unretweet', { id: this.status.id })
      }
--- a/src/components/retweet_button/retweet_button.vue
+++ b/src/components/retweet_button/retweet_button.vue
@ -1,11 +1,76 @@
 <template>
-  <div class="RetweetButton">
+  <!-- TODO settings the offset like this feels like a hack -->
+  <Popover
+    class="RetweetButton"
+    trigger="click"
+    placement="bottom"
+    :offset="{ y: 22 }"
+    :bound-to="{ x: 'container' }"
+    remove-padding
+  >
+    <template v-slot:content="{close}">
+      <div class="dropdown-menu">
+        <template v-if="status.repeated">
+          <button
+            v-if="status.repeated"
+            class="button-default dropdown-item dropdown-item-icon"
+            @click.prevent="retweet()"
+          >
+            <!-- TODO: i18n -->
+            <FAIcon
+              fixed-width
+              icon="trash"
+            /><span>Undo repeat</span>
+          </button>
+        </template>
+        <template v-else>
+          <!-- TODO: don't show button that would increase post visibility -->
+          <button
+            class="button-default dropdown-item dropdown-item-icon"
+            @click.prevent="retweet('public')"
+          >
+            <FAIcon
+              fixed-width
+              icon="globe"
+            /><span>{{ $t("general.scope_in_timeline.public") }}</span>
+          </button>
+          <button
+            class="button-default dropdown-item dropdown-item-icon"
+            @click.prevent="retweet('unlisted')"
+          >
+            <FAIcon
+              fixed-width
+              icon="lock-open"
+            /><span>{{ $t("general.scope_in_timeline.unlisted") }}</span>
+          </button>
+          <button
+            class="button-default dropdown-item dropdown-item-icon"
+            @click.prevent="retweet('private')"
+          >
+            <FAIcon
+              fixed-width
+              icon="lock"
+            /><span>{{ $t("general.scope_in_timeline.private") }}</span>
+          </button>
+          <button
+            class="button-default dropdown-item dropdown-item-icon"
+            @click.prevent="retweet('local')"
+          >
+            <!-- TODO: "general.scope_in_timeline.local" feels too long for the popover -->
+            <FAIcon
+              fixed-width
+              icon="users"
+            /><span>Local</span>
+          </button>
+        </template>
+      </div>
+    </template>
+    <template v-slot:trigger>
      <button
        v-if="(visibility !== 'private' || isOwn) && visibility !== 'direct' && loggedIn"
-      class="button-unstyled interactive"
+        class="button-unstyled popover-trigger"
        :class="status.repeated && '-repeated'"
        :title="$t('tool_tip.repeat')"
-      @click.prevent="retweet()"
      >
        <FAIcon
          class="fa-scale-110 fa-old-padding"
@ -40,6 +105,7 @@
        {{ status.repeat_num }}
      </span>
      <teleport to="#modal">
+        <!-- TODO does this work for all? -->
        <confirm-modal
          v-if="showingConfirmDialog"
          :title="$t('status.repeat_confirm_title')"
@ -51,7 +117,8 @@
          {{ $t('status.repeat_confirm') }}
        </confirm-modal>
      </teleport>
-  </div>
+    </template>
+  </Popover>
 </template>

 <script src="./retweet_button.js"></script>
@ -72,7 +139,7 @@
    user-select: none;
  }

-  .interactive {
+  .popover-trigger {
    .svg-inline--fa {
      @media (prefers-reduced-motion: reduce) {
        animation: unset;
@ -80,6 +147,7 @@
      animation-duration: 0.6s;
    }

+    /* TODO: don't turn green on hover because it keeps being focused on mobile when the popover is open. Instead make it while(?) like in extra_buttons and only green once it's been repeated. */
    &:hover .svg-inline--fa,
    &.-repeated .svg-inline--fa {
      color: $fallback--cGreen;
--- a/src/components/selectable_list/selectable_list.vue
+++ b/src/components/selectable_list/selectable_list.vue
@ -24,7 +24,7 @@
      :items="items"
      :get-key="getKey"
    >
-      <template v-slot:item="{item}">
+      <template #item="{item}">
        <div
          class="selectable-list-item-inner"
          :class="{ 'selectable-list-item-selected-inner': isSelected(item) }"
@ -41,7 +41,7 @@
          />
        </div>
      </template>
-      <template v-slot:empty>
+      <template #empty>
        <slot name="empty" />
      </template>
    </List>
--- a/src/components/settings_modal/helpers/boolean_setting.vue
+++ b/src/components/settings_modal/helpers/boolean_setting.vue
@ -6,7 +6,7 @@
    <Checkbox
      :model-value="state"
      :disabled="disabled"
-      @update:modelValue="update"
+      @update:model-value="update"
    >
      <span
        v-if="!!$slots.default"
--- a/src/components/settings_modal/helpers/choice_setting.vue
+++ b/src/components/settings_modal/helpers/choice_setting.vue
@ -8,7 +8,7 @@
    <Select
      :model-value="state"
      :disabled="disabled"
-      @update:modelValue="update"
+      @update:model-value="update"
    >
      <option
        v-for="option in options"
--- a/src/components/settings_modal/helpers/modified_indicator.vue
+++ b/src/components/settings_modal/helpers/modified_indicator.vue
@ -6,14 +6,14 @@
    <Popover
      trigger="hover"
    >
-      <template v-slot:trigger>
+      <template #trigger>
        &nbsp;
        <FAIcon
          icon="wrench"
          :aria-label="$t('settings.setting_changed')"
        />
      </template>
-      <template v-slot:content>
+      <template #content>
        <div class="modified-tooltip">
          {{ $t('settings.setting_changed') }}
        </div>
--- a/src/components/settings_modal/helpers/server_side_indicator.vue
+++ b/src/components/settings_modal/helpers/server_side_indicator.vue
@ -6,14 +6,14 @@
    <Popover
      trigger="hover"
    >
-      <template v-slot:trigger>
+      <template #trigger>
        &nbsp;
        <FAIcon
          icon="server"
          :aria-label="$t('settings.setting_server_side')"
        />
      </template>
-      <template v-slot:content>
+      <template #content>
        <div class="serverside-tooltip">
          {{ $t('settings.setting_server_side') }}
        </div>
--- a/src/components/settings_modal/settings_modal.vue
+++ b/src/components/settings_modal/settings_modal.vue
@ -108,7 +108,7 @@
        <Checkbox
          :model-value="!!expertLevel"
          class="expertMode"
-          @update:modelValue="expertLevel = Number($event)"
+          @update:model-value="expertLevel = Number($event)"
        >
          {{ $t("settings.expert_mode") }}
        </Checkbox>
--- a/src/components/settings_modal/tabs/data_import_export_tab.js
+++ b/src/components/settings_modal/tabs/data_import_export_tab.js
@ -72,7 +72,7 @@ const DataImportExportTab = {
        // check is it's a local user
        if (user && user.is_local) {
          // append the instance address
-          // eslint-disable-next-line no-undef
+           
          return user.screen_name + '@' + location.hostname
        }
        return user.screen_name
--- a/src/components/settings_modal/tabs/general_tab.js
+++ b/src/components/settings_modal/tabs/general_tab.js
@ -4,6 +4,7 @@ import ScopeSelector from 'src/components/scope_selector/scope_selector.vue'
 import IntegerSetting from '../helpers/integer_setting.vue'
 import InterfaceLanguageSwitcher from 'src/components/interface_language_switcher/interface_language_switcher.vue'

+import { usePostLanguageOptions } from 'src/lib/post_language'
 import SharedComputedObject from '../helpers/shared_computed_object.js'
 import ServerSideIndicator from '../helpers/server_side_indicator.vue'
 import { library } from '@fortawesome/fontawesome-svg-core'
@ -17,6 +18,11 @@ library.add(
 )

 const GeneralTab = {
+  setup() {
+    const {postLanguageOptions} = usePostLanguageOptions()
+
+    return {postLanguageOptions}
+  },
  data () {
    return {
      subjectLineOptions: ['email', 'noop', 'masto'].map(mode => ({
@ -118,6 +124,12 @@ const GeneralTab = {
        this.$store.dispatch('setOption', { name: 'translationLanguage', value: val })
      }
    },
+    postLanguage: {
+      get: function () { return this.$store.getters.mergedConfig.postLanguage },
+      set: function (val) {
+        this.$store.dispatch('setOption', { name: 'postLanguage', value: val })
+      }
+    },
    ...SharedComputedObject()
  },
  methods: {
--- a/src/components/settings_modal/tabs/general_tab.vue
+++ b/src/components/settings_modal/tabs/general_tab.vue
@ -44,7 +44,6 @@
          <template
            v-if="profilesExpanded"
          >
-
            <div
              v-for="profile in settingsProfiles"
              :key="profile.id"
@ -73,15 +72,24 @@
                </button>
              </template>
            </div>
-            <button class="btn button-default" @click="refreshProfiles()">
+            <button
+              class="btn button-default"
+              @click="refreshProfiles()"
+            >
              {{ $t('settings.settings_profiles_refresh') }}
-              <FAIcon icon="sync" @click="refreshProfiles()" />
+              <FAIcon
+                icon="sync"
+                @click="refreshProfiles()"
+              />
            </button>
            <h3>{{ $t('settings.settings_profile_creation') }}</h3>
            <label for="settings-profile-new-name">
              {{ $t('settings.settings_profile_creation_new_name_label') }}
            </label>
-            <input v-model="newProfileName" id="settings-profile-new-name">
+            <input
+              id="settings-profile-new-name"
+              v-model="newProfileName"
+            >
            <button
              class="btn button-default"
              @click="createSettingsProfile"
@ -146,6 +154,11 @@
            {{ $t('settings.show_wider_shortcuts') }}
          </BooleanSetting>
        </li>
+        <li>
+          <BooleanSetting path="displayPageBackgrounds">
+            {{ $t('settings.show_page_backgrounds') }}
+          </BooleanSetting>
+        </li>
        <li>
          <BooleanSetting path="stopGifs">
            {{ $t('settings.stop_gifs') }}
@ -483,14 +496,6 @@
            </BooleanSetting>
          </li>
        </ul>
-        <li>
-          <BooleanSetting
-            path="useAtIcon"
-            expert="1"
-          >
-            {{ $t('settings.use_at_icon') }}
-          </BooleanSetting>
-        </li>
        <li>
          <BooleanSetting path="mentionLinkShowAvatar">
            {{ $t('settings.mention_link_show_avatar') }}
@ -588,6 +593,15 @@
            {{ $t('settings.post_status_content_type') }}
          </ChoiceSetting>
        </li>
+        <li>
+          <ChoiceSetting
+            id="postLanguage"
+            path="postLanguage"
+            :options="postLanguageOptions"
+          >
+            {{ $t('settings.post_language') }}
+          </ChoiceSetting>
+        </li>
        <li>
          <BooleanSetting
            path="alwaysShowNewPostButton"
--- a/src/components/settings_modal/tabs/mutes_and_blocks_tab.js
+++ b/src/components/settings_modal/tabs/mutes_and_blocks_tab.js
@ -85,7 +85,7 @@ const MutesAndBlocks = {
        // check is it's a local user
        if (user && user.is_local) {
          // append the instance address
-          // eslint-disable-next-line no-undef
+           
          return user.screen_name + '@' + location.hostname
        }
        return user.screen_name
--- a/src/components/settings_modal/tabs/mutes_and_blocks_tab.vue
+++ b/src/components/settings_modal/tabs/mutes_and_blocks_tab.vue
@ -10,7 +10,7 @@
          :query="queryUserIds"
          :placeholder="$t('settings.search_user_to_block')"
        >
-          <template v-slot="row">
+          <template #default="row">
            <BlockCard
              :user-id="row.item"
            />
@ -21,7 +21,7 @@
        :refresh="true"
        :get-key="i => i"
      >
-        <template v-slot:header="{selected}">
+        <template #header="{selected}">
          <div class="bulk-actions">
            <ProgressButton
              v-if="selected.length > 0"
@ -29,7 +29,7 @@
              :click="() => blockUsers(selected)"
            >
              {{ $t('user_card.block') }}
-              <template v-slot:progress>
+              <template #progress>
                {{ $t('user_card.block_progress') }}
              </template>
            </ProgressButton>
@ -39,16 +39,16 @@
              :click="() => unblockUsers(selected)"
            >
              {{ $t('user_card.unblock') }}
-              <template v-slot:progress>
+              <template #progress>
                {{ $t('user_card.unblock_progress') }}
              </template>
            </ProgressButton>
          </div>
        </template>
-        <template v-slot:item="{item}">
+        <template #item="{item}">
          <BlockCard :user-id="item" />
        </template>
-        <template v-slot:empty>
+        <template #empty>
          {{ $t('settings.no_blocks') }}
        </template>
      </BlockList>
@ -63,7 +63,7 @@
              :query="queryUserIds"
              :placeholder="$t('settings.search_user_to_mute')"
            >
-              <template v-slot="row">
+              <template #default="row">
                <MuteCard
                  :user-id="row.item"
                />
@ -74,7 +74,7 @@
            :refresh="true"
            :get-key="i => i"
          >
-            <template v-slot:header="{selected}">
+            <template #header="{selected}">
              <div class="bulk-actions">
                <ProgressButton
                  v-if="selected.length > 0"
@ -82,7 +82,7 @@
                  :click="() => muteUsers(selected)"
                >
                  {{ $t('user_card.mute') }}
-                  <template v-slot:progress>
+                  <template #progress>
                    {{ $t('user_card.mute_progress') }}
                  </template>
                </ProgressButton>
@ -92,16 +92,16 @@
                  :click="() => unmuteUsers(selected)"
                >
                  {{ $t('user_card.unmute') }}
-                  <template v-slot:progress>
+                  <template #progress>
                    {{ $t('user_card.unmute_progress') }}
                  </template>
                </ProgressButton>
              </div>
            </template>
-            <template v-slot:item="{item}">
+            <template #item="{item}">
              <MuteCard :user-id="item" />
            </template>
-            <template v-slot:empty>
+            <template #empty>
              {{ $t('settings.no_mutes') }}
            </template>
          </MuteList>
@ -114,7 +114,7 @@
              :query="queryKnownDomains"
              :placeholder="$t('settings.type_domains_to_mute')"
            >
-              <template v-slot="row">
+              <template #default="row">
                <DomainMuteCard
                  :domain="row.item"
                />
@ -125,7 +125,7 @@
            :refresh="true"
            :get-key="i => i"
          >
-            <template v-slot:header="{selected}">
+            <template #header="{selected}">
              <div class="bulk-actions">
                <ProgressButton
                  v-if="selected.length > 0"
@ -133,16 +133,16 @@
                  :click="() => unmuteDomains(selected)"
                >
                  {{ $t('domain_mute_card.unmute') }}
-                  <template v-slot:progress>
+                  <template #progress>
                    {{ $t('domain_mute_card.unmute_progress') }}
                  </template>
                </ProgressButton>
              </div>
            </template>
-            <template v-slot:item="{item}">
+            <template #item="{item}">
              <DomainMuteCard :domain="item" />
            </template>
-            <template v-slot:empty>
+            <template #empty>
              {{ $t('settings.no_mutes') }}
            </template>
          </DomainMuteList>
--- a/src/components/settings_modal/tabs/profile_tab.js
+++ b/src/components/settings_modal/tabs/profile_tab.js
@ -33,6 +33,7 @@ const ProfileTab = {
      newName: this.$store.state.users.currentUser.name_unescaped,
      newBio: unescape(this.$store.state.users.currentUser.description),
      newLocked: this.$store.state.users.currentUser.locked,
+      newPermitFollowback: this.$store.state.users.currentUser.permit_followback,
      newFields: this.$store.state.users.currentUser.fields.map(field => ({ name: field.name, value: field.value })),
      showRole: this.$store.state.users.currentUser.show_role,
      role: this.$store.state.users.currentUser.role,
@ -129,14 +130,15 @@ const ProfileTab = {
        note: this.newBio,
        locked: this.newLocked,
        // Backend notation.
-        /* eslint-disable camelcase */
+         
        display_name: this.newName,
        fields_attributes: this.newFields.filter(el => el != null),
        bot: this.bot,
        show_role: this.showRole,
        status_ttl_days: this.expirePosts ? this.newPostTTLDays : -1,
+        permit_followback: this.permit_followback,
        accepts_direct_messages_from: this.userAcceptsDirectMessagesFrom
-        /* eslint-enable camelcase */
+         
      }

      if (this.emailLanguage) {
@ -185,7 +187,7 @@ const ProfileTab = {
        })
        return
      }
-      // eslint-disable-next-line no-undef
+       
      const reader = new FileReader()
      reader.onload = ({ target }) => {
        const img = target.result
--- a/src/components/settings_modal/tabs/profile_tab.vue
+++ b/src/components/settings_modal/tabs/profile_tab.vue
@ -110,11 +110,9 @@
          max="730"
          class="expire-posts-days"
          :placeholder="$t('settings.expire_posts_input_placeholder')"
-        />
-      </p>
-      <p>
-
+        >
      </p>
+      <p />
      <p>
        <interface-language-switcher
          :prompt-text="$t('settings.email_language')"
@ -259,6 +257,19 @@
          <BooleanSetting path="serverSide_locked">
            {{ $t('settings.lock_account_description') }}
          </BooleanSetting>
+          <ul
+            class="setting-list suboptions"
+            :class="[{disabled: !serverSide_locked}]"
+          >
+            <li>
+              <BooleanSetting
+                path="serverSide_permitFollowback"
+                :disabled="!serverSide_locked"
+              >
+                {{ $t('settings.permit_followback_description') }}
+              </BooleanSetting>
+            </li>
+          </ul>
        </li>
        <li>
          <BooleanSetting path="serverSide_discoverable">
--- a/src/components/status/status.js
+++ b/src/components/status/status.js
@ -215,6 +215,7 @@ const Status = {
    retweeter () { return this.statusoid.user.name || this.statusoid.user.screen_name_ui },
    retweeterHtml () { return this.statusoid.user.name },
    retweeterProfileLink () { return this.generateUserProfileLink(this.statusoid.user.id, this.statusoid.user.screen_name) },
+    retweeterVisibility () { return this.statusoid.visibility },
    status () {
      if (this.retweet) {
        return this.statusoid.retweeted_status
@ -440,6 +441,9 @@ const Status = {
    visibilityLocalized () {
      return this.$i18n.t('general.scope_in_timeline.' + this.status.visibility)
    },
+    retweeterVisibilityLocalized () {
+      return this.$i18n.t('general.scope_in_timeline.' + this.statusoid.visibility)
+    },
    isEdited () {
      return this.status.edited_at !== null
    },
--- a/src/components/status/status.scss
+++ b/src/components/status/status.scss
@ -42,10 +42,6 @@
    display: flex;
    padding: var(--status-margin, $status-margin);

-    .content {
-      overflow: hidden;
-    }
-
    > * {
      min-width: 0;
    }
@ -266,6 +262,16 @@
      color: $fallback--cGreen;
      color: var(--cGreen, $fallback--cGreen);
    }
+
+    .right-side {
+      display: flex;
+      align-items: center;
+      gap: 0.3em;
+    }
+
+    .repeat-tooltip {
+      flex-shrink: 0;
+    }
  }

  .repeater-avatar {
--- a/src/components/status/status.vue
+++ b/src/components/status/status.vue
@ -83,7 +83,7 @@
          :user="statusoid.user"
        />
        <div class="right-side faint">
-          <span
+          <div
            class="status-username repeater-name"
            :title="retweeter"
          >
@ -100,8 +100,12 @@
              v-else
              :to="retweeterProfileLink"
            >{{ retweeter }}</router-link>
-          </span>
+          </div>
          {{ ' ' }}
+
+          <div
+            class="repeat-tooltip"
+          >
             <FAIcon
               icon="retweet"
               class="repeat-icon"
@ -109,6 +113,19 @@
             />
             {{ $t('timeline.repeated') }}
          </div>
+
+          <span
+            v-if="retweeterVisibility"
+            class="visibility-icon"
+            :title="retweeterVisibilityLocalized"
+          >
+            <FAIcon
+              fixed-width
+              class="fa-scale-110"
+              :icon="visibilityIcon(retweeterVisibility)"
+            />
+          </span>
+        </div>
      </div>

      <div
@ -190,7 +207,7 @@
                >
                  <Timeago
                    :time="status.created_at"
-                    :with-direction="true"
+                    :with-direction="!compact"
                    :auto-update="60"
                  />
                </router-link>
@ -368,7 +385,7 @@
              :controlled-toggle-showing-long-subject="controlledToggleShowingLongSubject"
              @mediaplay="addMediaPlaying($event)"
              @mediapause="removeMediaPlaying($event)"
-              @parseReady="setHeadTailLinks"
+              @parse-ready="setHeadTailLinks"
            />
          </div>

@ -476,8 +493,8 @@
            />
            <extra-buttons
              :status="status"
-              @onError="showError"
-              @onSuccess="clearError"
+              @on-error="showError"
+              @on-success="clearError"
            />
          </div>
        </div>
--- a/src/components/status_body/status_body.vue
+++ b/src/components/status_body/status_body.vue
@ -54,7 +54,7 @@
            :mfm="renderMisskeyMarkdown && (status.media_type === 'text/x.misskeymarkdown')"
            :greentext="mergedConfig.greentext"
            :attentions="status.attentions"
-            @parseReady="onParseReady"
+            @parse-ready="onParseReady"
          />
          <div
            v-if="status.translation"
@ -70,7 +70,7 @@
              :mfm="renderMisskeyMarkdown && (status.media_type === 'text/x.misskeymarkdown')"
              :greentext="mergedConfig.greentext"
              :attentions="status.attentions"
-              @parseReady="onParseReady"
+              @parse-ready="onParseReady"
            />
            <div>
              <label class="label">{{ $t('status.override_translation_source_language') }}</label>
@ -89,7 +89,10 @@
                </option>
              </Select>
              {{ ' ' }}
-              <button @click="translateStatus" class="btn button-default">
+              <button
+                class="btn button-default"
+                @click="translateStatus"
+              >
                {{ $t('status.translate') }}
              </button>
            </div>
--- a/src/components/status_content/status_content.vue
+++ b/src/components/status_content/status_content.vue
@ -14,7 +14,7 @@
      :toggle-showing-tall="toggleShowingTall"
      :toggle-expanding-subject="toggleExpandingSubject"
      :toggle-showing-long-subject="toggleShowingLongSubject"
-      @parseReady="$emit('parseReady', $event)"
+      @parse-ready="$emit('parseReady', $event)"
    >
      <div v-if="status.poll && status.poll.options && !compact">
        <Poll
--- a/src/components/status_history_modal/status_history_modal.vue
+++ b/src/components/status_history_modal/status_history_modal.vue
@ -2,7 +2,7 @@
  <Modal
    v-if="modalActivated"
    class="status-history-modal-view"
-    @backdropClicked="closeModal"
+    @backdrop-clicked="closeModal"
  >
    <div class="status-history-modal-panel panel">
      <div class="panel-heading">
@ -17,7 +17,7 @@
            v-for="status in history"
            :key="status.id"
            :statusoid="status"
-            :isPreview="true"
+            :is-preview="true"
            class="conversation-status status-fadein panel-body"
          />
        </div>
--- a/src/components/status_popover/status_popover.vue
+++ b/src/components/status_popover/status_popover.vue
@ -5,10 +5,10 @@
    :bound-to="{ x: 'container' }"
    @show="enter"
  >
-    <template v-slot:trigger>
+    <template #trigger>
      <slot />
    </template>
-    <template v-slot:content>
+    <template #content>
      <Status
        v-if="status"
        :is-preview="true"
--- a/src/components/still-image/still-image.js
+++ b/src/components/still-image/still-image.js
@ -13,6 +13,7 @@ const StillImage = {
    return {
      stopGifs: this.$store.getters.mergedConfig.stopGifs || window.matchMedia('(prefers-reduced-motion: reduce)').matches,
      isAnimated: false,
+      imageTypeLabel: ''
    }
  },
  computed: {
@ -39,27 +40,24 @@ const StillImage = {
      this.imageLoadError && this.imageLoadError()
    },
    detectAnimation (image) {
-      // If there are no file extensions, the mimetype isn't set, and no mediaproxy is available, we can't figure out
-      // the mimetype of the image.
-      const hasFileExtension = this.src.split('/').pop().includes('.') // TODO: Better check?
      const mediaProxyAvailable = this.$store.state.instance.mediaProxyAvailable
-      if (!hasFileExtension && this.mimetype === undefined && !mediaProxyAvailable) {
+
+      if (!mediaProxyAvailable) {
        // It's a bit aggressive to assume all images we can't find the mimetype of is animated, but necessary for
        // people in need of reduced motion accessibility. As such, we'll consider those images animated if the user
        // agent is set to prefer reduced motion. Otherwise, it'll just be used as an early exit.
-        if (window.matchMedia('(prefers-reduced-motion: reduce)').matches)
+        if (window.matchMedia('(prefers-reduced-motion: reduce)').matches) {
+          // Since the canvas and images are not pixel-perfect matching (due to scaling),
+          // It makes the images jiggle on hover, which is not ideal for accessibility, methinks
          this.isAnimated = true
          return
        }
-
-      if (this.mimetype === 'image/gif' || this.src.endsWith('.gif')) {
-        this.isAnimated = true
-        return
+        this.detectWithoutMediaProxy(image)
+      } else {
+        this.detectWithMediaProxy(image)
      }
-      // harmless CORS errors without-- clean console with
-      if (!mediaProxyAvailable) return
-      // Animated JPEGs?
-      if (!(this.src.endsWith('.webp') || this.src.endsWith('.png'))) return
+    },
+    detectAnimationWithFetch (image) {
      // Browser Cache should ensure image doesn't get loaded twice if cache exists
      fetch(image.src, {
        referrerPolicy: 'same-origin'
@ -68,12 +66,20 @@ const StillImage = {
          // We don't need to read the whole file so only call it once
          data.body.getReader().read()
            .then(reader => {
-              if (this.src.endsWith('.webp') && this.isAnimatedWEBP(reader.value)) {
+              // Ordered from least to most intensive
+              if (this.isGIF(reader.value)) {
                this.isAnimated = true
+                this.setLabel('GIF')
                return
              }
-              if (this.src.endsWith('.png') && this.isAnimatedPNG(reader.value)) {
+              if (this.isAnimatedWEBP(reader.value)) {
                this.isAnimated = true
+                this.setLabel('WEBP')
+                return
+              }
+              if (this.isAnimatedPNG(reader.value)) {
+                this.isAnimated = true
+                this.setLabel('APNG')
              }
            })
        })
@ -81,6 +87,53 @@ const StillImage = {
          // this.imageLoadError && this.imageLoadError()
        })
    },
+    detectWithMediaProxy (image) {
+      this.detectAnimationWithFetch(image)
+    },
+    detectWithoutMediaProxy (image) {
+      // We'll just assume that gifs and webp are animated
+      const extension = image.src.split('.').pop().toLowerCase()
+
+      if (extension === 'gif') {
+        this.isAnimated = true
+        this.setLabel('GIF')
+        return
+      }
+      if (extension === 'webp') {
+        this.isAnimated = true
+        this.setLabel('WEBP')
+        return
+      }
+      // Beware the apng! use this if ye dare
+      // if (extension === 'png') {
+      //  this.isAnimated = true
+      //  this.setLabel('PNG')
+      //  return
+      // }
+      
+      // Hail mary for extensionless
+      if (extension.includes('/')) {
+        // Don't mind the CORS error barrage
+        this.detectAnimationWithFetch(image)
+      }
+    },
+    setLabel (name) {
+      this.imageTypeLabel = name;
+    },
+    isGIF (data) {
+      // I am a perfectly sane individual
+      //
+      // GIF HEADER CHUNK
+      // === START HEADER ===
+      // 47 49 46 38 ("GIF8")
+      const gifHeader = [0x47, 0x49, 0x46];
+      for (let i = 0; i < 3; i++) {
+        if (data[i] !== gifHeader[i]) {
+          return false;
+        }
+      }
+      return true
+    },
    isAnimatedWEBP (data) {
      /**
       * WEBP HEADER CHUNK
@ -115,14 +168,53 @@ const StillImage = {
      return (str.substring(0, idatPos > 0 ? idatPos : 0).indexOf('acTL') > 0)
    },
    drawThumbnail() {
-      const canvas = this.$refs.canvas
-      if (!this.$refs.canvas) return
-      const image = this.$refs.src
-      const width = image.naturalWidth
-      const height = image.naturalHeight
-      canvas.width = width
-      canvas.height = height
-      canvas.getContext('2d').drawImage(image, 0, 0, width, height)
+      const canvas = this.$refs.canvas;
+      if (!canvas) return;
+    
+      const context = canvas.getContext('2d');
+      const image = this.$refs.src;
+      const parentElement = canvas.parentElement;
+    
+      // Draw the quick, unscaled version first
+      context.drawImage(image, 0, 0, parentElement.clientWidth, parentElement.clientHeight);
+    
+      // Use requestAnimationFrame to schedule the scaling to the next frame
+      requestAnimationFrame(() => {
+        // Compute scaling ratio between the natural dimensions of the image and its display dimensions
+        const scalingRatioWidth = parentElement.clientWidth / image.naturalWidth;
+        const scalingRatioHeight = parentElement.clientHeight / image.naturalHeight;
+
+        // Adjust for high-DPI displays
+        const ratio = window.devicePixelRatio || 1;
+        canvas.width = image.naturalWidth * scalingRatioWidth * ratio;
+        canvas.height = image.naturalHeight * scalingRatioHeight * ratio;
+        canvas.style.width = `${parentElement.clientWidth}px`;
+        canvas.style.height = `${parentElement.clientHeight}px`;
+        context.scale(ratio, ratio);
+    
+        // Maintain the aspect ratio of the image
+        const imgAspectRatio = image.naturalWidth / image.naturalHeight;
+        const canvasAspectRatio = parentElement.clientWidth / parentElement.clientHeight;
+    
+        let drawWidth, drawHeight;
+    
+        if (imgAspectRatio > canvasAspectRatio) {
+          drawWidth = parentElement.clientWidth;
+          drawHeight = parentElement.clientWidth / imgAspectRatio;
+        } else {
+          drawHeight = parentElement.clientHeight;
+          drawWidth = parentElement.clientHeight * imgAspectRatio;
+        }
+    
+        context.clearRect(0, 0, canvas.width, canvas.height);  // Clear the previous unscaled image
+        context.imageSmoothingEnabled = true;
+        context.imageSmoothingQuality = 'high';
+
+        // Draw the good one for realsies
+        const dx = (parentElement.clientWidth - drawWidth) / 2;
+        const dy = (parentElement.clientHeight - drawHeight) / 2;
+        context.drawImage(image, dx, dy, drawWidth, drawHeight);
+      });
    }    
  },
  updated () {
--- a/src/components/still-image/still-image.vue
+++ b/src/components/still-image/still-image.vue
@ -1,9 +1,16 @@
 <template>
  <div
+    ref="still-image"
    class="still-image"
    :class="{ animated: animated }"
    :style="style"
  >
+    <div
+      v-if="animated && imageTypeLabel"
+      class="image-type-label"
+    >
+      {{ imageTypeLabel }}
+    </div>
    <canvas
      v-if="animated"
      ref="canvas"
@ -57,30 +64,26 @@
    }
  }

-  &.animated {
-    &::before {
-      zoom: var(--_still_image-label-scale, 1);
-      content: 'gif';
+  .image-type-label {
    position: absolute;
+    top: 0.25em;
+    left: 0.25em;
    line-height: 1;
-      font-size: 0.7em;
-      top: 0.5em;
-      left: 0.5em;
+    font-size: 0.6em;
    background: rgba(127, 127, 127, 0.5);
    color: #fff;
-      display: block;
    padding: 2px 4px;
-      border-radius: $fallback--tooltipRadius;
    border-radius: var(--tooltipRadius, $fallback--tooltipRadius);
    z-index: 2;
    visibility: var(--_still-image-label-visibility, visible);
  }

+  &.animated {
    &:hover canvas {
      display: none;
    }

-    &:hover::before {
+    &:hover .image-type-label {
      visibility: var(--_still-image-label-visibility, hidden);
    }

--- a/src/components/thread_tree/thread_tree.vue
+++ b/src/components/thread_tree/thread_tree.vue
@ -32,7 +32,7 @@
      :dive="dive ? () => dive(status.id) : undefined"

      @goto="setHighlight"
-      @toggleExpanded="toggleExpanded"
+      @toggle-expanded="toggleExpanded"
    />
    <div
      v-if="currentReplies.length && threadShowing"
--- a/src/components/timeline/timeline.scss
+++ b/src/components/timeline/timeline.scss
@ -28,4 +28,7 @@
      }
    }
  }
+  .timeline {
+    min-height: 1em;
+  }
 }
--- a/src/components/timeline/timeline_quick_settings.vue
+++ b/src/components/timeline/timeline_quick_settings.vue
@ -4,7 +4,7 @@
    class="TimelineQuickSettings"
    :bound-to="{ x: 'container' }"
  >
-    <template v-slot:content>
+    <template #content>
      <div class="dropdown-menu">
        <div v-if="loggedIn">
          <button
@ -80,7 +80,7 @@
        </button>
      </div>
    </template>
-    <template v-slot:trigger>
+    <template #trigger>
      <button class="button-unstyled">
        <FAIcon icon="filter" />
      </button>
--- a/src/components/timeline_menu/timeline_menu.vue
+++ b/src/components/timeline_menu/timeline_menu.vue
@ -9,12 +9,12 @@
    @show="openMenu"
    @close="() => isOpen = false"
  >
-    <template v-slot:content>
+    <template #content>
      <div class="timeline-menu-popover popover-default">
        <TimelineMenuContent />
      </div>
    </template>
-    <template v-slot:trigger>
+    <template #trigger>
      <button class="button-unstyled title timeline-menu-title">
        <span class="timeline-title">{{ timelineName() }}</span>
        <span>
--- a/src/components/timeline_menu/timeline_menu_content.vue
+++ b/src/components/timeline_menu/timeline_menu_content.vue
@ -62,7 +62,6 @@
          :title="$t('nav.twkn_timeline_description')"
          :aria-label="$t('nav.twkn_timeline_description')"
        >{{ $t("nav.twkn") }}</span>
-
      </router-link>
    </li>
    <li v-if="currentUser">
--- a/src/components/timeline_menu_tabs/timeline_menu_tabs.vue
+++ b/src/components/timeline_menu_tabs/timeline_menu_tabs.vue
@ -16,9 +16,9 @@
      />
    </router-link>
    <router-link
+      v-if="publicTimelineVisible"
      :to="{ name: 'public-timeline' }"
      class="nav-icon"
-      v-if="publicTimelineVisible"
    >
      <FAIcon
        fixed-width
@ -40,9 +40,9 @@
      />
    </router-link>
    <router-link
+      v-if="federatedTimelineVisible"
      :to="{ name: 'public-external-timeline' }"
      class="nav-icon"
-      v-if="federatedTimelineVisible"
    >
      <FAIcon
        fixed-width
--- a/src/components/user_avatar/user_avatar.vue
+++ b/src/components/user_avatar/user_avatar.vue
@ -33,7 +33,7 @@
  --_avatarShadowBox: var(--avatarStatusShadow);
  --_avatarShadowFilter: var(--avatarStatusShadowFilter);
  --_avatarShadowInset: var(--avatarStatusShadowInset);
-  --_still-image-label-visibility: hidden;
+  // --_still-image-label-visibility: hidden;

  display: inline-block;
  position: relative;
--- a/src/components/user_card/user_card.js
+++ b/src/components/user_card/user_card.js
@ -66,7 +66,7 @@ export default {
      return this.user.id !== this.$store.state.users.currentUser.id
    },
    subscribeUrl () {
-      // eslint-disable-next-line no-undef
+       
      const serverUrl = new URL(this.user.statusnet_profile_url)
      return `${serverUrl.protocol}//${serverUrl.host}/main/ostatus`
    },
--- a/src/components/user_card/user_card.scss
+++ b/src/components/user_card/user_card.scss
@ -41,6 +41,7 @@
    -webkit-mask-composite: xor;
    mask-composite: exclude;
    background-size: cover;
+    background-position: top;
    mask-size: 100% 60%;
    border-top-left-radius: calc(var(--panelRadius) - 1px);
    border-top-right-radius: calc(var(--panelRadius) - 1px);
--- a/src/components/user_list_popover/user_list_popover.vue
+++ b/src/components/user_list_popover/user_list_popover.vue
@ -4,10 +4,10 @@
    placement="top"
    :offset="{ y: 5 }"
  >
-    <template v-slot:trigger>
+    <template #trigger>
      <slot />
    </template>
-    <template v-slot:content>
+    <template #content>
      <div class="user-list-popover">
        <template v-if="users.length">
          <div
--- a/src/components/user_profile/user_profile.js
+++ b/src/components/user_profile/user_profile.js
@ -145,10 +145,12 @@ const UserProfile = {
      if (user) {
        loadById(user.id)
        this.note = user.relationship.note
+        this.$store.dispatch('setDisplayBackground', user.background_image)
      } else {
        this.$store.dispatch('fetchUser', userNameOrId)
-          .then(({ id, relationship }) => {
+          .then(({ id, relationship, background_image }) => {
            this.note = relationship.note
+            this.$store.dispatch('setDisplayBackground', background_image)
            return loadById(id)
          })
          .catch((reason) => {
@ -225,6 +227,9 @@ const UserProfile = {
    Conversation,
    RichContent,
    FollowedTagList
+  },
+  beforeRouteLeave(to, from) {
+    this.$store.dispatch('setDisplayBackground', null)
  }
 }

--- a/src/components/user_profile/user_profile.vue
+++ b/src/components/user_profile/user_profile.vue
@ -121,8 +121,8 @@
              </FriendList>
            </div>
            <div
-              key="tags"
              v-if="isUs"
+              key="tags"
              :label="$t('user_card.followed_tags')"
            >
              <FollowedTagList
--- a/src/components/user_reporting_modal/user_reporting_modal.vue
+++ b/src/components/user_reporting_modal/user_reporting_modal.vue
@ -1,7 +1,7 @@
 <template>
  <Modal
    v-if="isOpen"
-    @backdropClicked="closeModal"
+    @backdrop-clicked="closeModal"
  >
    <div class="user-reporting-panel panel">
      <div class="panel-heading">
@ -45,7 +45,7 @@
        </div>
        <div class="user-reporting-panel-right">
          <List :items="statuses">
-            <template v-slot:item="{item}">
+            <template #item="{item}">
              <div class="status-fadein user-reporting-panel-sitem">
                <Status
                  :in-conversation="false"
--- a/src/i18n/ca.json
+++ b/src/i18n/ca.json
@ -84,6 +84,7 @@
        "keep_open": "Mantindre el selector obert",
        "load_all": "Carregant tots els {emojiAmount} emoji",
        "load_all_hint": "Carregat el primer {saneAmount} emoji, carregar tots els emoji pot causar problemes de rendiment.",
+        "recent": "Recents",
        "search_emoji": "Buscar un emoji",
        "stickers": "Adhesius",
        "unicode": "Emojis unicode"
@ -254,6 +255,10 @@
        "hint": "Entra per a participar en la conversa",
        "login": "Inicia sessió",
        "logout": "Tanca la sessió",
+        "logout_confirm": "Segur que vols tancar la sessió?",
+        "logout_confirm_accept_button": "Surt",
+        "logout_confirm_cancel_button": "Canceŀla",
+        "logout_confirm_title": "Tanca la sessió",
        "password": "Contrasenya",
        "placeholder": "el meu nom d'usuari",
        "recovery_code": "Codi de recuperació",
@ -266,6 +271,32 @@
        "next": "Següent",
        "previous": "Anterior"
    },
+    "moderation": {
+        "moderation": "Moderació",
+        "reports": {
+            "add_note": "Afegeix una nota",
+            "close": "Tanca",
+            "delete_note": "Esborra la nota",
+            "delete_note_accept": "Sí, esborra-la",
+            "delete_note_cancel": "No, conserva-la",
+            "delete_note_confirm": "Segur que vols esborrar aquesta nota?",
+            "delete_note_title": "Cal confirmació",
+            "no_content": "Sense descripció",
+            "no_reports": "No hi ha informes per mostrar",
+            "note_placeholder": "Deixa una nota",
+            "notes": "{ count } nota | { count } notes",
+            "reopen": "Reobre",
+            "report": "Denuncia-ho",
+            "reports": "Denúncies",
+            "resolve": "Resol",
+            "show_closed": "Mostra les tancades",
+            "statuses": "{ count } post| { count } posts",
+            "tag_policy_notice": "Activa la restricció de publicacions segons la TagPolicy MRF",
+            "tags": "Estableix restriccions a les publicacions"
+        },
+        "statuses": "Publicacions",
+        "users": "Usuàries"
+    },
    "nav": {
        "about": "Quant a",
        "administration": "Administració",
@ -282,6 +313,7 @@
        "interactions": "Interaccions",
        "lists": "Llistes",
        "mentions": "Mencions",
+        "moderation": "Moderació",
        "preferences": "Preferències",
        "public_timeline_description": "Apunts públics des d'aquesta instància",
        "public_tl": "Línia de temps Pública",
@ -375,9 +407,12 @@
            "private": "Aquest apunt serà visible només per els teus seguidors",
            "public": "Aquest apunt serà visible per a tothom",
            "unlisted": "Aquest apunt no es veurà ni a la Línia de temps Pública ni a Tota la Xarxa Coneguda"
-        }
+        },
+        "toggle_content_warning": "Des/activa l'avís de contingut"
    },
    "registration": {
+        "awaiting_email_confirmation": "S'ha registrat el teu compte i s'ha enviat un correu a la teva adreça. Consulta el correu per completar el registre.",
+        "awaiting_email_confirmation_title": "Pendent de confirmar l'adreça de correu",
        "bio": "Bio",
        "bio_placeholder": "p.e.\nHola! Benvingut a la meva bio.\nM'encanta veure anime i jugar a jocs. Espero que podrem ser amics!",
        "captcha": "CAPTCHA",
@ -391,6 +426,8 @@
        "reason_placeholder": "Aquesta instància aprova els registres manualment.\nExplica a l'administració per què vols registrar-te.",
        "register": "Registre",
        "registration": "Registre",
+        "request_sent": "La teva soŀlicitud de registre s'ha enviat. Rebràs un correu quan sigui aprovada.",
+        "request_sent_title": "Soŀlicitud de registre",
        "token": "Codi d'invitació",
        "username_placeholder": "p. ex. akko",
        "validations": {
@ -500,6 +537,8 @@
        "enable_web_push_notifications": "Habilitar notificacions del navegador",
        "enter_current_password_to_confirm": "Posa la teva contrasenya actual per a confirmar la teva identitat",
        "expert_mode": "Mostra avançat",
+        "expire_posts_enabled": "Esborra les publicacions després d'un cert nombre de dies",
+        "expire_posts_input_placeholder": "Nombre de dies",
        "export_theme": "Desa el tema",
        "file_export_import": {
            "backup_restore": "Còpia de seguretat de la configuració",
@ -641,6 +680,7 @@
        "pad_emoji": "Acompanya els emojis amb espais al afegir-los des del selector",
        "panelRadius": "Panells",
        "pause_on_unfocused": "Pausa quan la pestanya perdi el focus",
+        "permit_followback_description": "Aprova automàticament les soŀlicituds de seguiment que vinguin d'usuàries que ja segueixes",
        "play_videos_in_modal": "Reproduir vídeos en un marc emergent",
        "post_look_feel": "Aspecte i Sensació dels apunts",
        "post_status_content_type": "Tipus de contingut d'apunt predeterminat",
@ -709,6 +749,7 @@
        "show_admin_badge": "Mostra l'insígnia \"Administrador\" en el meu perfil",
        "show_moderator_badge": "Mostra l'insígnia \"Moderador\" en el meu perfil",
        "show_nav_shortcuts": "Mostra els accessos directes addicionals en el panell superior",
+        "show_page_backgrounds": "Mostra fons de pantalla específics de pàgines, com en les pàgines de perfil d'usuari",
        "show_panel_nav_shortcuts": "Mostra els accessos directes de navegació de la línia de temps en el panell superior",
        "show_scrollbars": "Mostra les barres de desplaçament de la columna lateral",
        "show_wider_shortcuts": "Mostra més separats els accessos directes del panell superior",
@ -884,9 +925,13 @@
        "upload_a_photo": "Pujar una foto",
        "useStreamingApi": "Rebre apunts i notificacions en temps real",
        "useStreamingApiWarning": "És genial emprar-lo. Si es trenca, refresca, suposo?",
-        "use_at_icon": "Mostra el símbol {'@'} com a icona enlloc de text",
+        "use_blurhash": "Fes borroses les miniatures d'imatges NSFW",
        "use_contain_fit": "No retallar els adjunts en miniatures",
        "use_one_click_nsfw": "Obre els adjunts NSFW amb només un clic",
+        "user_accepts_direct_messages_from": "Accepta missatges directes de",
+        "user_accepts_direct_messages_from_everybody": "Qualsevol",
+        "user_accepts_direct_messages_from_nobody": "Ningú",
+        "user_accepts_direct_messages_from_people_i_follow": "Comptes que segueixo",
        "user_mutes": "Usuaris",
        "user_profile_default_tab": "Pestanya per defecte en el Perfil d'Usuari",
        "user_profiles": "Perfils d'usuari",
@ -1009,6 +1054,7 @@
        "collapse": "Replega",
        "conversation": "Conversa",
        "error": "Error carregant la línia de temps: {0}",
+        "follow_tag": "Segueix l'etiqueta",
        "load_older": "Carrega apunts anteriors",
        "no_more_statuses": "No hi ha més apunts",
        "no_retweet_hint": "L'apunt és només per a seguidors o és \"directe\" i no es pot repetir o citar",
@ -1018,6 +1064,7 @@
        "show_new": "Mostra els nous",
        "socket_broke": "Connexió a temps real perduda: codi CloseEvent {0}",
        "socket_reconnected": "Connexió a temps real establerta",
+        "unfollow_tag": "Deixa de seguir l'etiqueta",
        "up_to_date": "Actualitzat"
    },
    "toast": {
@ -1082,6 +1129,7 @@
        "block_confirm_title": "Bloqueja l'usuari",
        "block_progress": "Bloquejant…",
        "blocked": "Bloquejat!",
+        "blocks_you": "Et té bloquejadi!",
        "bot": "Bot",
        "deactivated": "Desactivat",
        "deny": "Denega",
@ -1096,7 +1144,10 @@
        "follow_cancel": "Cancel·la la sol·licitud",
        "follow_progress": "Sol·licitant…",
        "follow_sent": "Petició enviada!",
+        "follow_tag": "Segueix l'etiqueta",
        "follow_unfollow": "Deixa de seguir",
+        "followed_tags": "Etiquetes que segueixes",
+        "followed_users": "Usuaris que segueixes",
        "followees": "Seguint",
        "followers": "Seguidors",
        "following": "Seguint!",
@ -1121,12 +1172,14 @@
        "mute_domain": "Bloqueja el domini",
        "mute_progress": "Silenciant…",
        "muted": "Silenciat",
+        "not_following_any_hashtags": "No estàs seguint cap etiqueta",
        "note": "Nota privada",
        "per_day": "per dia",
        "remote_follow": "Seguiment remot",
        "remove_follower": "Esborra seguidor",
        "replies": "Amb respostes",
        "report": "Informa",
+        "requested_by": "Et vol seguir",
        "show_repeats": "Mostra les repeticions",
        "statuses": "Apunts",
        "subscribe": "Subscriu-te",
@ -1136,11 +1189,13 @@
        "unfollow_confirm_accept_button": "Sí, deixa'l de seguir",
        "unfollow_confirm_cancel_button": "No, no el deixis de seguir",
        "unfollow_confirm_title": "Deixa de seguir l'usuari",
+        "unfollow_tag": "Deixa de seguir l'etiqueta",
        "unmute": "Deixa de silenciar",
        "unmute_progress": "Deixant de silenciar…",
        "unsubscribe": "Anul·la la subscripció"
    },
    "user_profile": {
+        "field_validated": "Enllaç verificat",
        "profile_does_not_exist": "Disculpes, aquest perfil no existeix.",
        "profile_loading_error": "Disculpes, hi ha hagut un error carregant aquest perfil.",
        "timeline_title": "Línia de temps del usuari"
--- a/src/i18n/de.json
+++ b/src/i18n/de.json
@ -916,7 +916,6 @@
        "upload_a_photo": "Lade ein Foto hoch",
        "useStreamingApi": "Empfange Posts und Benachrichtigungen in Echtzeit",
        "useStreamingApiWarning": "(Nicht empfohlen, experimentell, bekannt dafür, Posts zu überspringen)",
-        "use_at_icon": "{'@'}-Symbol als Icon und nicht als Text anzeigen",
        "use_blurhash": "Blurhash für NSFW-Vorschauen verwenden",
        "use_contain_fit": "Vorschaubilder nicht zuschneiden",
        "use_one_click_nsfw": "Heikle Anhänge mit nur einem Klick öffnen",
--- a/src/i18n/el.json
+++ b/src/i18n/el.json
@ -18,7 +18,8 @@
                "reason": "Λόγος",
                "simple_policies": "Πολιτικές του instance"
            }
-        }
+        },
+        "staff": "Προσωπικό"
    },
    "announcements": {
        "all_day_prompt": "Αυτό είναι ένα ολοήμερο συμβάν",
@ -27,10 +28,14 @@
        "delete_action": "Διαγραφή",
        "edit_action": "Επεξεργασία",
        "end_time_display": "Λήγει στις {time}",
+        "end_time_prompt": "Λήξη: ",
+        "inactive_message": "Αυτή η ανακοίνωση είναι ανενεργή",
        "page_header": "Ανακοινώσεις",
+        "post_action": "Ανάρτηση",
        "title": "Ανακοίνωση"
    },
    "chats": {
+        "delete_confirm": "Θέλετε σίγουρα να διαγράψετε αυτό το μήνυμα;",
        "empty_message_error": "Δε μπορεί να σταλεί κενό μήνυμα",
        "error_sending_message": "Κάτι πήγε λάθος κατά την αποστολή του μηνύματος.",
        "message_user": "Στείλε μήνυμα στον/στην {nickname}",
--- a/src/i18n/en.json
+++ b/src/i18n/en.json
@ -380,6 +380,7 @@
            "text/x.misskeymarkdown": "MFM"
        },
        "content_warning": "Content Warning (optional)",
+        "toggle_content_warning": "Toggle content warning",
        "default": "Just arrived at Luna Nova Academy",
        "direct_warning_to_all": "This post will be visible to all the mentioned users.",
        "direct_warning_to_first_only": "This post will only be visible to the mentioned users at the beginning of the message.",
@ -600,6 +601,7 @@
        "list_aliases_error": "Error fetching aliases: {error}",
        "list_backups_error": "Error fetching backup list: {error}",
        "lock_account_description": "Restrict your account to approved followers only",
+        "permit_followback_description": "Automatically approve requests from already followed users",
        "loop_video": "Loop videos",
        "loop_video_silent_only": "Loop only videos without sound (i.e. Mastodon's \"gifs\")",
        "mascot": "Mastodon FE Mascot",
@ -682,6 +684,7 @@
        "play_videos_in_modal": "Play videos in a popup frame",
        "post_look_feel": "Posts Look & Feel",
        "post_status_content_type": "Default post content type",
+        "post_language": "Default post language",
        "posts": "Posts",
        "preload_images": "Preload images",
        "presets": "Presets",
@ -749,6 +752,7 @@
        "show_nav_shortcuts": "Show extra navigation shortcuts in top panel",
        "show_panel_nav_shortcuts": "Show timeline navigation shortcuts at the top of the panel",
        "show_scrollbars": "Show side column's scrollbars",
+        "show_page_backgrounds": "Show page-specific backgrounds, e.g. for user profiles",
        "show_wider_shortcuts": "Show wider gap between top panel shortcuts",
        "show_yous": "Show (You)s",
        "stop_gifs": "Pause animated images until you hover on them",
@ -922,7 +926,6 @@
        "upload_a_photo": "Upload a photo",
        "useStreamingApi": "Receive posts and notifications real-time",
        "useStreamingApiWarning": "It's cool use it. If it breaks refresh I guess?",
-        "use_at_icon": "Display {'@'} symbol as an icon instead of text",
        "use_contain_fit": "Don't crop the attachment in thumbnails",
        "use_one_click_nsfw": "Open NSFW attachments with just one click",
        "user_mutes": "Users",
--- a/src/i18n/es.json
+++ b/src/i18n/es.json
@ -84,6 +84,7 @@
        "keep_open": "Mantener el selector abierto",
        "load_all": "Cargando todos los {emojiAmount} emoji",
        "load_all_hint": "Cargado el primer emoji {saneAmount}, cargar todos los emoji puede causar problemas de rendimiento.",
+        "recent": "Recientemente usado",
        "search_emoji": "Buscar un emoji",
        "stickers": "Pegatinas",
        "unicode": "Emojis unicode"
@ -302,7 +303,7 @@
        "announcements": "Anuncios",
        "back": "Volver",
        "bookmarks": "Marcadores",
-        "bubble_timeline": "Linea temporal burbuja",
+        "bubble_timeline": "Línea temporal burbuja",
        "bubble_timeline_description": "Publicaciones de instancias cercanas a la tuya, recomendadas por los/las administradores/as",
        "chats": "Chats",
        "dms": "Mensajes directos",
@ -915,13 +916,20 @@
        "token": "Token",
        "tooltipRadius": "Información/alertas",
        "translation_language": "Idioma de traducción automática",
+        "tree_advanced": "Mostrar botones extras para abrir y cerrar la cadena de réplicas en los hilos",
        "type_domains_to_mute": "Buscar dominios para silenciar",
        "upload_a_photo": "Subir una foto",
        "useStreamingApi": "Recibir publicaciones y notificaciones en tiempo real",
        "useStreamingApiWarning": "(no recomendado, experimental, puede omitir publicaciones)",
+        "use_blurhash": "Usar miniaturas borrosas para las imágenes sensibles",
        "use_contain_fit": "No recortar los adjuntos en miniaturas",
        "use_one_click_nsfw": "Abrir los adjuntos NSFW con un solo click",
+        "user_accepts_direct_messages_from": "Aceptar mensajes directos de",
+        "user_accepts_direct_messages_from_everybody": "Todos",
+        "user_accepts_direct_messages_from_nobody": "Nadie",
+        "user_accepts_direct_messages_from_people_i_follow": "Personas que sigo",
        "user_mutes": "Usuarios",
+        "user_profiles": "Perfiles de usuario",
        "user_settings": "Ajustes del Usuario",
        "valid_until": "Válido hasta",
        "values": {
@ -934,26 +942,61 @@
            "title": "Versión"
        },
        "virtual_scrolling": "Optimizar la representación de la linea temporal",
-        "word_filter": "Filtro de palabras"
+        "word_filter": "Filtro de palabras",
+        "wordfilter": "Filtro de palabras"
+    },
+    "settings_profile": {
+        "creating": "Creando un nuevo perfil de configuración \"{profile}\"...",
+        "synchronization_error": "No se pudo sincronizar la configuración: {err}",
+        "synchronized": "¡Ajustes sincronizados!",
+        "synchronizing": "Sincronizando los ajustes de perfil \"{profile}\"..."
    },
    "status": {
+        "ancestor_follow": "Vea {numReplies} respuesta en esta publicación | Ver otras {numReplies} respuestas en esta publicación",
+        "ancestor_follow_with_icon": "{icon} {text}",
+        "attachment_stop_flash": "Parar el reproductor Flash",
        "bookmark": "Marcar",
-        "copy_link": "Copiar el enlace al estado",
-        "delete": "Eliminar publicación",
-        "delete_confirm": "¿Realmente quieres borrar la publicación?",
+        "collapse_attachments": "Minimizar adjuntos",
+        "copy_link": "Copiar el enlace al mensaje",
+        "delete": "Eliminar mensaje",
+        "delete_confirm": "¿Realmente quieres borrar el mensaje?",
+        "delete_confirm_accept_button": "Sí, elimínelo",
+        "delete_confirm_cancel_button": "No, mantenerlo",
+        "delete_confirm_title": "Confirmar la eliminación",
+        "edit": "Editar",
+        "edit_history": "Editar el historial",
+        "edit_history_modal_title": "Editado {historyCount} vez | Editado {historyCount} veces",
+        "edited_at": "Editado {time}",
        "expand": "Expandir",
        "external_source": "Fuente externa",
        "favorites": "Favoritos",
+        "hide_attachment": "Ocultar adjuntos",
        "hide_content": "Ocultar el contenido",
-        "hide_full_subject": "Ocultar el tema completo",
+        "hide_full_subject": "Ocultar la advertencia de contenido",
+        "many_attachments": "El mensaje tiene {number} adjunto | El mensaje tiene {number} adjuntos",
        "mentions": "Menciones",
+        "move_down": "Desplazar adjunto a la derecha",
+        "move_up": "Desplazar adjunto a la izquierda",
        "mute_conversation": "Silenciar la conversación",
        "nsfw": "NSFW (No apropiado para el trabajo)",
+        "open_gallery": "Abrir la galería",
+        "override_translation_source_language": "Anular el idioma de origen",
        "pin": "Fijar en tu perfil",
        "pinned": "Fijado",
        "plus_more": "+{number} más",
+        "redraft": "Eliminar y volver a redactar",
+        "redraft_confirm": "¿Realmente deseas eliminar y volver a redactar esta publicación? Las interacciones con la publicación original no se conservarán.",
+        "redraft_confirm_accept_button": "Sí, eliminar y volver a redactar",
+        "redraft_confirm_cancel_button": "No, conserva el original",
+        "redraft_confirm_title": "Confirmar eliminación y volver a redactar",
+        "remove_attachment": "Quitar archivo adjunto",
+        "repeat_confirm": "¿De verdad quieres repetir esta entrada?",
+        "repeat_confirm_accept_button": "Si, repítela",
+        "repeat_confirm_cancel_button": "No, no repitas",
+        "repeat_confirm_title": "Confirmar repetir",
        "repeats": "Repetidos",
        "replies_list": "Respuestas:",
+        "replies_list_with_others": "Ver {numReplies} respuesta | Ver {numReplies} respuestas más",
        "reply_to": "Respondiendo a",
        "show_content": "Mostrar el contenido",
        "show_full_subject": "Mostrar el tema completo",
--- a/src/i18n/fr.json
+++ b/src/i18n/fr.json
@ -920,7 +920,6 @@
        "upload_a_photo": "Envoyer une photo",
        "useStreamingApi": "Recevoir les messages et notifications en temps réel",
        "useStreamingApiWarning": "(Non recommandé, expérimental, connu pour rater des messages)",
-        "use_at_icon": "Afficher le symbol {'@'} comme une image",
        "use_contain_fit": "Ne pas rogner les miniatures des pièces-jointes",
        "use_one_click_nsfw": "Ouvrir les pièces-jointes sensibles avec un seul clic",
        "user_mutes": "Comptes",
--- a/src/i18n/id.json
+++ b/src/i18n/id.json
@ -1,7 +1,7 @@
 {
    "about": {
        "bubble_instances": "Instance Bubble Lokal",
-        "bubble_instances_description": "Instansi yang dipilih oleh admin untuk mewakili instance ini",
+        "bubble_instances_description": "Instansi yang dipilih oleh admin untuk mewakili daerah lokal instansi ini",
        "mrf": {
            "federation": "Federasi",
            "keyword": {
@ -456,8 +456,10 @@
    "settings": {
        "accent": "Aksen",
        "account_alias": "Akun alias",
+        "account_alias_table_head": "Alias",
        "account_backup": "Pencadangan akun",
        "account_backup_description": "Ini memungkinkan kamu untuk mengunduh arsip yang berisi informasi tentang akun dan postingan kamu, namun belum bisa diimpor ke akun Pleroma.",
+        "account_backup_table_head": "Cadangan",
        "account_privacy": "Privasi",
        "add_alias_error": "Gagal menambahkan alias: {error}",
        "add_backup": "Buat cadangan baru",
@ -555,7 +557,8 @@
        "follow_export_button": "Export yang kamu ikuti ke dalam file csv",
        "follow_import": "Import pengikut",
        "follow_import_error": "Terjadi kesalahan ketika mengimpor pengikut",
-        "follows_imported": "Pengguna yang diikuti telak diimpor! Proses mungkin membutuhkan beberapa saat.",
+        "follows_imported": "Daftar mengikuti telah diimpor! Proses mungkin membutuhkan beberapa saat.",
+        "foreground": "Latar depan",
        "fun": "Seru",
        "general": "Umum",
        "greentext": "Panah meme",
@ -563,17 +566,30 @@
        "hide_attachments_in_convo": "Sembunyikan lampiran pada percakapan",
        "hide_attachments_in_tl": "Sembunyikan lampiran di linimasa",
        "hide_bot_indication": "Sembunyikan tanda bot pada postingan",
+        "hide_favorites_description": "Jangan tunjukkan daftar kesukaan saya (orang masih mendapatkan notifikasi)",
        "hide_filtered_statuses": "Sembunyikan semua postingan yang tersaring",
        "hide_followers_count_description": "Jangan tampilkan jumlah pengikut",
        "hide_followers_description": "Jangan tampilkan siapa yang mengikutiku",
        "hide_follows_count_description": "Jangan tampilkan jumlah mengikuti",
        "hide_follows_description": "Jangan tampilkan siapa yang aku ikuti",
+        "hide_isp": "Sembunyikan panel spesifik instansi",
+        "hide_list_aliases_error_action": "Tutup",
+        "hide_media_previews": "Sembunyikan pratinjau media",
        "hide_muted_posts": "Sembunyikan postingan-postingan dari pengguna yang dibisukan",
+        "hide_muted_threads": "Sembunyikan thread yang dibisukan",
        "hide_post_stats": "Sembunyikan statistik postingan (seperti jumlah favorit)",
        "hide_shoutbox": "Sembunyikan kotak suara instansi",
+        "hide_site_favicon": "Sembunyikan favicon instansi di panel atas",
+        "hide_site_name": "Sembunyikan nama instansi di panel atas",
+        "hide_threads_with_blocked_users": "Sembunyikan thread yang menyebut orang yang diblok",
        "hide_user_stats": "Sembunyikan statistik pengguna (seperti jumlah pengikut)",
        "hide_wallpaper": "Sembunyikan latar belakang instansi",
+        "hide_wordfiltered_statuses": "Sembunyikan post yang disaring dengan kata",
        "import_blocks_from_a_csv_file": "Impor blokiran dari berkas csv",
+        "import_followers_from_a_csv_file": "Impor daftar mengikuti dari berkas csv",
+        "import_mutes_from_a_csv_file": "Impor daftar pembisuan dari berkas csv",
+        "import_theme": "Muat preset",
+        "inputRadius": "Bidang masukan",
        "instance_default": "(bawaan: {value})",
        "instance_default_simple": "(bawaan)",
        "interface": "Antarmuka",
@ -581,16 +597,23 @@
        "invalid_theme_imported": "Berkas yang dipilih bukan sebuah tema yang didukung Pleroma. Tidak ada perubahan yang dibuat pada tema kamu.",
        "limited_availability": "Tidak tersedia di browser kamu",
        "links": "Tautan",
+        "list_aliases_error": "Gagal mengambil alias: {error}",
+        "list_backups_error": "Gagal mengambil daftar cadangan: {error}",
        "lock_account_description": "Batasi akunmu kepada pengikut yang sudah disetujui saja",
        "loop_video": "Ulang-ulang video",
        "loop_video_silent_only": "Ulang-ulang video tanpa suara (seperti \"gif\" Mastodon)",
+        "mascot": "Maskot Mastodon FE",
+        "max_depth_in_thread": "Tingat thread maksimum yang ditampilkan oleh bawaan",
        "max_thumbnails": "Jumlah thumbnail maksimum per postingan (kosong = tidak terbatas)",
        "mention_link_bolden_you": "Sorot sebutan kamu apabila kamu disebut",
        "mention_link_display": "Tampilkan tautan sebutan",
        "mention_link_display_full": "selalu sebagai nama lengkap (cth. {'@'}foo{'@'}example.org)",
        "mention_link_display_full_for_remote": "sebagai nama lengkap hanya untuk pengguna di instansi lain (cth. {'@'}foo{'@'}example.org)",
        "mention_link_display_short": "selalu sebagai nama pendek (cth. {'@'}foo)",
+        "mention_link_fade_domain": "Pudarkan domain (contoh: {'@'}example.org di {'@'}foo{'@'}example.org)",
        "mention_link_show_avatar": "Tampilkan avatar pengguna di samping tautan",
+        "mention_link_show_tooltip": "Tunjukkan nama penuh pengguna sebagai tooltip untuk pengguna jauh",
+        "mention_links": "Tautan sebutan",
        "mfa": {
            "authentication_methods": "Metode otentikasi",
            "confirm_and_enable": "Konfirmasi & aktifkan OTP",
@ -599,6 +622,8 @@
            "recovery_codes": "Kode pemulihan.",
            "recovery_codes_warning": "Tulis kodenya atau simpan mereka di tempat yang aman - jika tidak kamu tidak akan melihat mereka lagi. Jika kamu tidak dapat mengakses aplikasi 2FA kamu dan kode pemulihanmu hilang, kamu tidak akan bisa mengakses akun kamu.",
            "scan": {
+                "desc": "Menggunakan aplikasi dua-faktor kamu, pindai kode QR ini atau masukkan kunci teks:",
+                "secret_code": "Kunci",
                "title": "Pindai"
            },
            "setup_otp": "Siapkan OTP",
@ -606,10 +631,19 @@
            "verify": {
                "desc": "Untuk mengaktifkan otentikasi dua-faktor, masukkan kode dari aplikasi dua-faktor kamu:"
            },
+            "wait_pre_setup_otp": "Pengaturan awal OTP",
            "waiting_a_recovery_codes": "Menerima kode cadangan…",
            "warning_of_generate_new_codes": "Ketika kamu menghasilkan kode pemulihan baru, kode lama kamu berhenti bekerja."
        },
+        "minimal_scopes_mode": "Minimalkan pilihan seleksi lingkup posting",
        "more_settings": "Lebih banyak pengaturan",
+        "move_account": "Pindahkan akun",
+        "move_account_error": "Gagal memindahkan akun: {error}",
+        "move_account_notes": "Jika kamu ingin memindahkan akun ini ke tempat lain, kamu harus pergi ke akun tujuan kamu dan menambahkan alias yang mengarah ke sini.",
+        "move_account_target": "Akun tujuan (contoh {example})",
+        "moved_account": "Akun telah dipindahkan.",
+        "mute_bot_posts": "Bisukan posting dari bot",
+        "mute_export": "Expor pembisuan",
        "mutes_and_blocks": "Bisuan dan Blokiran",
        "name": "Nama",
        "name_bio": "Nama & bio",
@ -699,7 +733,7 @@
                "fine_print": "Baca {0} kami untuk belajar sesuatu yang tak ada gunanya!",
                "header": "Pratinjau",
                "header_faint": "Ini baik-baik saja",
-                "input": "Baru saja mendarat di L.A.",
+                "input": "Baru saja mendarat di Luna Nova Academy",
                "link": "sebuah tautan yang kecil nan bagus"
            },
            "shadows": {
@ -720,15 +754,15 @@
                "use_source": "Versi baru"
            }
        },
-        "subject_line_behavior": "Salin subyek ketika membalas",
-        "subject_line_email": "Seperti surel: \"re: subyek\"",
+        "subject_line_behavior": "Salin peringatan isi ketika membalas",
+        "subject_line_email": "Seperti surel: \"re: peringatan\"",
        "subject_line_mastodon": "Seperti mastodon: salin saja",
        "subject_line_noop": "Jangan salin",
        "text": "Teks",
        "theme": "Tema",
        "token": "Token",
        "upload_a_photo": "Unggah foto",
-        "useStreamingApiWarning": "(Tidak disarankan, eksperimental, diketahui dapat melewati postingan-postingan)",
+        "useStreamingApiWarning": "Ini bagus, gunakan. Kalau tidak jalan, mungkin segarkan halaman?",
        "use_one_click_nsfw": "Buka lampiran NSFW hanya dengan satu klik",
        "user_settings": "Pengaturan Pengguna",
        "valid_until": "Valid hingga",
@ -744,7 +778,7 @@
        "word_filter": "Penyaring kata"
    },
    "status": {
-        "delete": "Hapus status",
+        "delete": "Hapus post",
        "delete_confirm": "Apakah kamu benar-benar ingin menghapus postingan ini?",
        "favorites": "Favorit",
        "hide_content": "",
@ -757,7 +791,7 @@
        "reply_to": "Balas ke",
        "show_content": "",
        "status_deleted": "Postingan ini telah dihapus",
-        "status_unavailable": "Status tidak tersedia",
+        "status_unavailable": "Post tidak tersedia",
        "thread_muted_and_words": ", memiliki kata:",
        "unmute_conversation": "Berhenti membisikan percakapan",
        "unpin": "Berhenti menyematkan dari profil"
@ -787,9 +821,9 @@
    "timeline": {
        "conversation": "Percakapan",
        "error": "Terjadi kesalahan memuat linimasa: {0}",
-        "no_more_statuses": "Tidak ada status lagi",
+        "no_more_statuses": "Tidak ada post lagi",
        "no_retweet_hint": "Postingan ditandai sebagai hanya-pengikut atau langsung dan tidak dapat diulang atau dikutip",
-        "no_statuses": "Tidak ada status",
+        "no_statuses": "Tidak ada post",
        "reload": "Muat ulang",
        "repeated": "diulangi"
    },
@ -853,7 +887,7 @@
        "per_day": "per hari",
        "report": "Laporkan",
        "show_repeats": "Tampilkan ulangan",
-        "statuses": "Status",
+        "statuses": "Postingan",
        "unblock": "Berhenti memblokir",
        "unmute": "Berhenti membisukan"
    },
--- a/src/i18n/it.json
+++ b/src/i18n/it.json
@ -1,5 +1,7 @@
 {
    "about": {
+        "bubble_instances": "Istanze della Bolla Locale",
+        "bubble_instances_description": "Istanze selezionate dagli amministratori per rappresentare l'area d'interesse dell'istanza",
        "mrf": {
            "federation": "Federazione",
            "keyword": {
@ -16,12 +18,15 @@
                "accept_desc": "Questa stanza accetta messaggi solo dalle seguenti altre:",
                "ftl_removal": "Rimozione dalla sequenza federale",
                "ftl_removal_desc": "Questa stanza rimuove le seguenti dalla sequenza federale:",
+                "instance": "Istanza",
                "media_nsfw": "Allegati oscurati d'ufficio",
                "media_nsfw_desc": "Questa stanza oscura gli allegati dei messaggi provenienti da queste stanze:",
                "media_removal": "Rimozione multimedia",
                "media_removal_desc": "Questa istanza rimuove gli allegati dalle seguenti stanze:",
+                "not_applicable": "N/D",
                "quarantine": "Quarantena",
-                "quarantine_desc": "Questa stanza inoltrerà solo messaggi pubblici alle seguenti:",
+                "quarantine_desc": "Questa istanza non invierà post alle seguenti istanze:",
+                "reason": "Motivazione",
                "reject": "Rifiuta",
                "reject_desc": "Questa stanza rifiuterà i messaggi provenienti dalle seguenti:",
                "simple_policies": "Regole specifiche alla stanza"
@ -29,6 +34,27 @@
        },
        "staff": "Responsabili"
    },
+    "announcements": {
+        "all_day_prompt": "Evento lungo tutto il giorno",
+        "cancel_edit_action": "Annulla",
+        "close_error": "Chiudi",
+        "delete_action": "Elimina",
+        "edit_action": "Modifica",
+        "end_time_display": "Finisce alle {time}",
+        "end_time_prompt": "Ora di fine: ",
+        "inactive_message": "Questo annuncio è inattivo",
+        "mark_as_read_action": "Segna come già letto",
+        "page_header": "Annunci",
+        "post_action": "Post",
+        "post_error": "Errore: {error}",
+        "post_form_header": "Posta annuncio",
+        "post_placeholder": "Contenuto dell'annuncio",
+        "published_time_display": "Pubblicato alle {time}",
+        "start_time_display": "Inizia alle {time}",
+        "start_time_prompt": "Ora di inizio: ",
+        "submit_edit_action": "Invia",
+        "title": "Annuncio"
+    },
    "chats": {
        "chats": "Conversazioni",
        "delete": "Elimina",
@ -58,6 +84,7 @@
        "keep_open": "Tieni aperto il menù",
        "load_all": "Carico tutti i {emojiAmount} emoji",
        "load_all_hint": "Primi {saneAmount} emoji caricati, caricarli tutti potrebbe causare rallentamenti.",
+        "recent": "Usato di recente",
        "search_emoji": "Cerca un emoji",
        "stickers": "Adesivi",
        "unicode": "Emoji Unicode"
@ -109,6 +136,13 @@
            "admin": "Amministratore",
            "moderator": "Moderatore"
        },
+        "scope_in_timeline": {
+            "direct": "Diretto",
+            "local": "Locale - Solo la tua istanza può vedere questo post",
+            "private": "Solo per i seguaci",
+            "public": "Pubblico",
+            "unlisted": "Non elencato"
+        },
        "show_less": "Ripiega",
        "show_more": "Mostra tutto",
        "submit": "Invia",
@ -131,6 +165,84 @@
        "load_older": "Carica interazioni precedenti",
        "moves": "Utenti migrati"
    },
+    "languages": {
+        "ar": "Arabo",
+        "az": "Azero",
+        "bg": "Bulgaro",
+        "cs": "Ceco",
+        "da": "Danese",
+        "de": "Tedesco",
+        "el": "Greco",
+        "en": "Inglese",
+        "eo": "Esperanto",
+        "es": "Spagnolo",
+        "fa": "Persiano",
+        "fi": "Finlandese",
+        "fr": "Francese",
+        "ga": "Irlandese",
+        "he": "Ebreo",
+        "hi": "Hindi",
+        "hu": "Ungherese",
+        "id": "Indonesiano",
+        "it": "Italiano",
+        "ja": "Giapponese",
+        "ko": "Coreano",
+        "lt": "Lituano",
+        "lv": "Lettone",
+        "nl": "Olandese",
+        "pl": "Polacco",
+        "pt": "Portoghese",
+        "ru": "Russo",
+        "sk": "Slovacco",
+        "sv": "Svedese",
+        "tr": "Turco",
+        "translated_from": {
+            "ar": "Tradotto dall' @:languages.ar",
+            "az": "Tradotto dall' @:languages.az",
+            "bg": "Tradotto dal @:languages.bg",
+            "cs": "Tradotto dal @:languages.cs",
+            "da": "Tradotto dal @:languages.da",
+            "de": "Tradotto dal @:languages.de",
+            "el": "Tradotto dal @:languages.el",
+            "en": "Tradotto dall' @:languages.en",
+            "eo": "Tradotto dal @:languages.eo",
+            "es": "Tradotto dallo @:languages.es",
+            "fa": "Tradotto dal @:languages.fa",
+            "fi": "Tradotto dal @:languages.fi",
+            "fr": "Tradotto dal @:languages.fr",
+            "ga": "Tradotto dal @:languages.ga",
+            "he": "Tradotto dal @:languages.he",
+            "hi": "Tradotto dal @:languages.hi",
+            "hu": "Tradotto dal @:languages.hu",
+            "id": "Tradotto dal @:languages.id",
+            "it": "Tradotto dall' @:languages.it",
+            "ja": "Tradotto dal @:languages.ja",
+            "ko": "Tradotto dal @:languages.ko",
+            "lt": "Tradotto dal @:languages.lt",
+            "lv": "Tradotto dal @:languages.lv",
+            "nl": "Tradotto dall' @:languages.nl",
+            "pl": "Tradotto dal @:languages.pl",
+            "pt": "Tradotto dal @:languages.pt",
+            "ru": "Tradotto dal @:languages.ru",
+            "sk": "Tradotto dal @:languages.sk",
+            "sv": "Tradotto dal @:languages.sv",
+            "tr": "Tradotto dal @:languages.tr",
+            "uk": "Tradotto dal @:languages.uk",
+            "zh": "Tradotto dal @:languages.zh"
+        },
+        "uk": "Ucraino",
+        "zh": "Cinese"
+    },
+    "lists": {
+        "create": "Crea",
+        "delete": "Elimina lista",
+        "following_only": "Limita a chi segui",
+        "lists": "Liste",
+        "new": "Nuova Lista",
+        "save": "Salva cambiamenti",
+        "search": "Cerca utenti",
+        "title": "Titolo della lista"
+    },
    "login": {
        "authentication_code": "Codice di autenticazione",
        "description": "Accedi con OAuth",
@ -143,6 +255,10 @@
        "hint": "Accedi per conversare",
        "login": "Accedi",
        "logout": "Disconnettiti",
+        "logout_confirm": "Sicuro di disconnetterti?",
+        "logout_confirm_accept_button": "Disconnetti",
+        "logout_confirm_cancel_button": "Annulla",
+        "logout_confirm_title": "Disconnetti",
        "password": "Password",
        "placeholder": "es. Lupo Lucio",
        "recovery_code": "Codice di recupero",
@ -150,31 +266,67 @@
        "username": "Nome utente"
    },
    "media_modal": {
+        "counter": "{current} / {total}",
+        "hide": "Chiudi visualizzatore multimediale",
        "next": "Prossimo",
        "previous": "Precedente"
    },
+    "moderation": {
+        "moderation": "Moderazione",
+        "reports": {
+            "add_note": "Aggiungi nota",
+            "close": "Chiudi",
+            "delete_note": "Elimina",
+            "delete_note_accept": "Si, eliminalo",
+            "delete_note_cancel": "No, lascialo stare",
+            "delete_note_confirm": "Sei sicurə di voler eliminare questa nota?",
+            "delete_note_title": "Conferma eliminazione",
+            "no_content": "Nessuna descrizione",
+            "no_reports": "Nessun report da mostrare",
+            "note_placeholder": "Lascia una nota",
+            "notes": "{ count } nota | { count } note",
+            "reopen": "Riapri",
+            "report": "Riporta su",
+            "reports": "Rapporti",
+            "resolve": "Risolvi",
+            "show_closed": "Mostra chiusi",
+            "statuses": "{ count } post| { count } post",
+            "tag_policy_notice": "Abilita il TagPolicy MRF per poter impostare restrizioni sui post",
+            "tags": "Imposta restrizioni sui post"
+        },
+        "statuses": "Post",
+        "users": "Utenti"
+    },
    "nav": {
        "about": "Informazioni",
        "administration": "Amministrazione",
+        "announcements": "Annunci",
        "back": "Indietro",
        "bookmarks": "Segnalibri",
+        "bubble_timeline": "Timeline della Bolla Locale",
+        "bubble_timeline_description": "Post da istanze vicine alla tua e raccomandate dagli amministratori",
        "chats": "Conversazioni",
        "dms": "Messaggi privati",
        "friend_requests": "Vogliono seguirti",
        "home_timeline": "Sequenza personale",
+        "home_timeline_description": "Post dalle persone che segui",
        "interactions": "Interazioni",
+        "lists": "Liste",
        "mentions": "Menzioni",
+        "moderation": "Moderazione",
        "preferences": "Preferenze",
+        "public_timeline_description": "Post pubblici da questa istanza",
        "public_tl": "Sequenza pubblica",
        "search": "Ricerca",
        "timeline": "Sequenza personale",
        "timelines": "Sequenze",
        "twkn": "Sequenza federale",
+        "twkn_timeline_description": "Post da tutta la rete",
        "user_search": "Ricerca utenti",
        "who_to_follow": "Chi seguire"
    },
    "notifications": {
-        "broken_favorite": "Stato sconosciuto, lo sto cercando…",
+        "broken_favorite": "Post sconosciuto, lo sto cercando…",
        "error": "Errore nel caricare le notifiche: {0}",
        "favorited_you": "ha gradito",
        "follow_request": "vuole seguirti",
@ -183,9 +335,10 @@
        "migrated_to": "è migrato verso",
        "no_more_notifications": "Fine delle notifiche",
        "notifications": "Notifiche",
+        "poll_ended": "sondaggio terminato",
        "reacted_with": "ha reagito con {0}",
        "read": "Letto!",
-        "repeated_you": "ha condiviso il tuo messaggio"
+        "repeated_you": "ha condiviso il tuo post"
    },
    "password_reset": {
        "check_email": "Controlla la tua posta elettronica.",
@ -223,15 +376,20 @@
            "text/bbcode": "BBCode",
            "text/html": "HTML",
            "text/markdown": "Markdown",
-            "text/plain": "Testo normale"
+            "text/plain": "Testo normale",
+            "text/x.misskeymarkdown": "MFM"
        },
-        "content_warning": "Oggetto (facoltativo)",
+        "content_warning": "Contenuto Sensibile (facoltativo)",
        "default": "Sono appena atterrato a Città Laggiù.",
        "direct_warning_to_all": "Questo messaggio sarà visibile a tutti i menzionati.",
        "direct_warning_to_first_only": "Questo messaggio sarà visibile solo agli utenti menzionati in testa.",
+        "edit_remote_warning": "Le modifiche fatte al messaggio potrebbero non essere visibili su alcune istanze!",
+        "edit_status": "Modifica Stato",
+        "edit_unsupported_warning": "Sondaggi e menzioni non verranno cambiati in fase di modifica.",
        "empty_status_error": "Aggiungi del testo o degli allegati",
        "media_description": "Descrizione allegati",
        "media_description_error": "Allegati non caricati, riprova",
+        "media_not_sensitive_warning": "C'è un Contenuto Sensibile, ma gli allegati non sono contrassegnati come sensibili!",
        "new_status": "Nuovo messaggio",
        "post": "Pubblica",
        "posting": "Sto pubblicando",
@ -239,21 +397,26 @@
        "preview_empty": "Vuoto",
        "scope": {
            "direct": "Diretto - Visibile solo agli utenti menzionati",
+            "local": "Locale - non federare questo messaggio",
            "private": "Solo per seguaci - Visibile solo dai tuoi seguaci",
            "public": "Pubblico - Visibile sulla sequenza pubblica",
            "unlisted": "Nascosto - Non visibile sulla sequenza pubblica"
        },
        "scope_notice": {
+            "local": "Questo messaggio non sarà visibile sulle altre istanze",
            "private": "Questo messaggio sarà visibile solo ai tuoi seguaci",
            "public": "Questo messaggio sarà visibile a tutti",
            "unlisted": "Questo messaggio non sarà visibile sulla sequenza locale né su quella pubblica"
        }
    },
    "registration": {
+        "awaiting_email_confirmation": "Il tuo account è stato registrato e un'email è stata inviata al tuo indirizzo. Controllala per completare la registrazione.",
+        "awaiting_email_confirmation_title": "Attendo la conferma dell'email",
        "bio": "Introduzione",
        "bio_placeholder": "es.\nCiao, sono Lupo Lucio.\nSono un lupo fantastico che vive nel Fantabosco. Forse mi hai visto alla Melevisione.",
        "captcha": "CAPTCHA",
        "email": "Email",
+        "email_language": "In quale lingua vuoi ricevere email dal server?",
        "fullname": "Nome visualizzato",
        "fullname_placeholder": "es. Lupo Lucio",
        "new_captcha": "Clicca il captcha per averne uno nuovo",
@ -262,6 +425,8 @@
        "reason_placeholder": "L'amministratore esamina ciascuna richiesta.\nFornisci il motivo della tua iscrizione.",
        "register": "Registrati",
        "registration": "Registrazione",
+        "request_sent": "La richiesta di registrazione è stata inoltrata ad un amministratore. Riceverai un'email non appena il tuo account verrà approvato.",
+        "request_sent_title": "Richiesta di registrazione inviata",
        "token": "Codice d'invito",
        "username_placeholder": "es. mister_wolf",
        "validations": {
@ -290,6 +455,17 @@
    },
    "settings": {
        "accent": "Accento",
+        "account_alias": "Alias dell'account",
+        "account_alias_table_head": "Alias",
+        "account_backup": "Backup dell'account",
+        "account_backup_description": "Puoi scaricare un archivio con le tue informazioni ed i tuoi messaggi, ma non possono essere importati in un account Akkoma.",
+        "account_backup_table_head": "Backup",
+        "account_privacy": "Privacy",
+        "add_alias_error": "Errore durante l'aggiunta dell'alias: {error}",
+        "add_backup": "Crea un nuovo backup",
+        "add_backup_error": "Errore durante l'aggiunta di un nuovo backup: {error}",
+        "added_alias": "Alias aggiunto.",
+        "added_backup": "Nuovo backup aggiunto.",
        "allow_following_move": "Consenti l'iscrizione automatica ai profili traslocati",
        "always_show_post_button": "Non nascondere il pulsante di composizione",
        "app_name": "Nome applicazione",
@ -301,6 +477,7 @@
        "avatarRadius": "Icone utente",
        "avatar_size_instruction": "La taglia minima per l'icona personale è 150x150 pixel.",
        "background": "Sfondo",
+        "backup_not_ready": "Questo backup non è ancora pronto.",
        "bio": "Introduzione",
        "block_export": "Esporta blocchi",
        "block_export_button": "Esporta i tuoi blocchi in un file CSV",
@ -322,7 +499,8 @@
        "changed_password": "Password cambiata correttamente!",
        "chatMessageRadius": "Messaggi istantanei",
        "checkboxRadius": "Caselle di selezione",
-        "collapse_subject": "Ripiega messaggi con oggetto",
+        "collapse_subject": "Ripiega messaggi con Contenuto Sensibile",
+        "columns": "Colonne",
        "composing": "Composizione",
        "confirm_new_password": "Conferma la nuova password",
        "current_avatar": "La tua icona attuale",
--- a/src/i18n/ja.json
+++ b/src/i18n/ja.json
@ -0,0 +1,11 @@
+{
+    "about": {
+        "mrf": {
+            "keyword": {
+                "is_replaced_by": "→",
+                "replace": "置き換える"
+            },
+            "mrf_policies": "有効なMRFポリシー"
+        }
+    }
+}
--- a/src/i18n/ja_easy.json
+++ b/src/i18n/ja_easy.json
@ -523,7 +523,7 @@
        "delete_account_description": "あなたのアカウントとメッセージが、きえます。",
        "delete_account_error": "アカウントをけすことが、できなかったかもしれません。インスタンスのアドミニストレーターに、おといあわせください。",
        "delete_account_instructions": "ほんとうにアカウントをけしてもいいなら、パスワードをかいてください。",
-        "disable_sticky_headers": "カラムヘッダーを、がめんのいちばんうえにくっつけない",
+        "disable_sticky_headers": "カラムヘッダーをがめんのいちばんうえにくっつけない",
        "discoverable": "けんさくなどのサービスで、このアカウントをみつけてもよい",
        "domain_mutes": "ドメイン",
        "download_backup": "ダウンロード",
--- a/src/i18n/ja_pedantic.json
+++ b/src/i18n/ja_pedantic.json
@ -921,7 +921,6 @@
        "upload_a_photo": "画像をアップロード",
        "useStreamingApi": "投稿と通知を、すぐに受け取る",
        "useStreamingApiWarning": "（実験中で、投稿を取りこぼすかもしれないので、おすすめしません）",
-        "use_at_icon": "{'@'}マークをアイコンにする",
        "use_contain_fit": "画像のサムネイルを、切り抜かない",
        "use_one_click_nsfw": "NSFWなファイルを1クリックで開く",
        "user_mutes": "ユーザー",
--- a/src/i18n/messages.js
+++ b/src/i18n/messages.js
@ -21,6 +21,7 @@ const loaders = {
  ga: () => import('./ga.json'),
  he: () => import('./he.json'),
  hu: () => import('./hu.json'),
+  id: () => import('./id.json'),
  it: () => import('./it.json'),
  ja: () => import('./ja_pedantic.json'),
  ja_easy: () => import('./ja_easy.json'),
@ -35,6 +36,7 @@ const loaders = {
  sk: () => import('./sk.json'),
  te: () => import('./te.json'),
  uk: () => import('./uk.json'),
+  vi: () => import('./vi.json'),
  zh: () => import('./zh.json'),
  zh_Hant: () => import('./zh_Hant.json')
 }
--- a/src/i18n/nl.json
+++ b/src/i18n/nl.json
@ -918,7 +918,6 @@
        "upload_a_photo": "Foto uploaden",
        "useStreamingApi": "Berichten en meldingen in real-time ontvangen",
        "useStreamingApiWarning": "Iets experimenteels met berichten streamen uwu miss kun je beter uit laten ofzo?",
-        "use_at_icon": "{'@'} symbool als icoon tonen in plaats van tekst",
        "use_blurhash": "Waas tonen over NSFW-miniaturen",
        "use_contain_fit": "Bijlage in miniaturen niet bijsnijden",
        "use_one_click_nsfw": "Gevoelige bijlagen met slechts één klik openen",
--- a/Show more
+++ b/Show more