Squashed commit of the following:

commit 7cc6c3565466b330043e0a811a6e1e2db487ec8d Merge: e7a558a5 228679e4 Author: FloatingGhost <hannah@coffee-and-dreams.uk> Date: Sat Feb 24 13:55:57 2024 +0000 Merge branch 'develop' into stable commit 228679e49efefe9695b5866511a1521282af0c6e Author: FloatingGhost <hannah@coffee-and-dreams.uk> Date: Sat Feb 24 13:55:10 2024 +0000 2024.02 release commit d610a46c32b4763749fd82e40432a0ce145721b4 Merge: ed0b403c 09257632 Author: Weblate <noreply@weblate.org> Date: Tue Feb 20 16:24:40 2024 +0000 Merge branch 'origin/develop' into Weblate. commit ed0b403c33 Merge: 0f842b30 a77a9e04 Author: floatingghost <hannah@coffee-and-dreams.uk> Date: Tue Feb 20 16:24:37 2024 +0000 Merge pull request 'Auto-approve followbacks (frontend part)' (#365) from Oneric/akkoma-fe:followbacks-fe into develop Reviewed-on: AkkomaGang/akkoma-fe#365 commit 092576326761b79c817e760ff400c627f77b5324 Merge: 0f842b30 e292af42 Author: Weblate <noreply@weblate.org> Date: Tue Feb 20 16:20:18 2024 +0000 Merge branch 'origin/develop' into Weblate. commit 0f842b300b Merge: 865cb6f9 050c7df2 Author: floatingghost <hannah@coffee-and-dreams.uk> Date: Tue Feb 20 16:20:14 2024 +0000 Merge pull request 'Display profile background of other users' (#371) from Oneric/akkoma-fe:profile-backgrounds into develop Reviewed-on: AkkomaGang/akkoma-fe#371 commit e292af42118299cedc6b9c6e1f5a83bc15a86c3c Merge: 865cb6f9 4e7d5d3a Author: Weblate <noreply@weblate.org> Date: Mon Feb 19 14:04:37 2024 +0000 Merge branch 'origin/develop' into Weblate. commit 865cb6f96a Merge: 8dce31d0 a5733499 Author: floatingghost <hannah@coffee-and-dreams.uk> Date: Mon Feb 19 14:04:34 2024 +0000 Merge pull request 'Add Indonesian translation' (#366) from leap123/akkoma-fe:leap123-patch-1 into develop Reviewed-on: AkkomaGang/akkoma-fe#366 commit 4e7d5d3a08182b1d0ab07a997212e297ab08093a Author: Weblate <noreply@weblate.org> Date: Thu Feb 15 17:32:33 2024 +0000 Translated using Weblate (Vietnamese) Currently translated at 92.2% (965 of 1046 strings) Translated using Weblate (Vietnamese) Currently translated at 92.2% (965 of 1046 strings) Translated using Weblate (Vietnamese) Currently translated at 84.3% (882 of 1046 strings) Translated using Weblate (Vietnamese) Currently translated at 84.3% (882 of 1046 strings) Translated using Weblate (Vietnamese) Currently translated at 79.8% (835 of 1046 strings) Translated using Weblate (Vietnamese) Currently translated at 79.8% (835 of 1046 strings) Co-authored-by: Nguyễn Gia Phong <cnx@loang.net> Co-authored-by: Weblate <noreply@weblate.org> Co-authored-by: xarvos <huyngo@disroot.org> Translate-URL: http://translate.akkoma.dev/projects/akkoma/pleroma-fe/vi/ Translation: Pleroma fe/pleroma-fe commit f2d0c4c7d57ef05b223b58d599f4f66bd4e9bcd3 Author: Weblate <noreply@weblate.org> Date: Thu Feb 15 17:32:33 2024 +0000 Translated using Weblate (Japanese) Currently translated at 0.2% (3 of 1046 strings) Added translation using Weblate (Japanese) Co-authored-by: Nakaya <s_fpfb_sub-second@yahoo.co.jp> Co-authored-by: Weblate <noreply@weblate.org> Translate-URL: http://translate.akkoma.dev/projects/akkoma/pleroma-fe/ja/ Translation: Pleroma fe/pleroma-fe commit 02a6591f2059748fd42765893116c5b36e5bb1ba Author: Weblate <noreply@weblate.org> Date: Thu Feb 15 17:32:33 2024 +0000 Translated using Weblate (Greek) Currently translated at 15.9% (167 of 1046 strings) Co-authored-by: Weblate <noreply@weblate.org> Co-authored-by: getimiskon <getimiskon@disroot.org> Translate-URL: http://translate.akkoma.dev/projects/akkoma/pleroma-fe/el/ Translation: Pleroma fe/pleroma-fe commit 94c70f89142fcdcdd08899c7de50ed153ee8459b Author: Weblate <noreply@weblate.org> Date: Thu Feb 15 17:32:33 2024 +0000 Merge branch 'origin/develop' into Weblate. Translated using Weblate (Chinese (Simplified)) Currently translated at 100.0% (1046 of 1046 strings) Co-authored-by: Poesty Li <poesty7450@gmail.com> Co-authored-by: Weblate <noreply@weblate.org> Translate-URL: http://translate.akkoma.dev/projects/akkoma/pleroma-fe/zh_Hans/ Translation: Pleroma fe/pleroma-fe commit 3ba8c90e1ea52510eacf582e88ef2c3933cfbe4c Author: Weblate <noreply@weblate.org> Date: Thu Feb 15 17:32:33 2024 +0000 Translated using Weblate (Russian) Currently translated at 68.7% (719 of 1046 strings) Co-authored-by: Mel <hi@mel.gg> Co-authored-by: Weblate <noreply@weblate.org> Translate-URL: http://translate.akkoma.dev/projects/akkoma/pleroma-fe/ru/ Translation: Pleroma fe/pleroma-fe commit 83db80f88c0fdcf3848b511940ebcfcfd5ec8078 Author: Weblate <noreply@weblate.org> Date: Thu Feb 15 17:32:32 2024 +0000 Translated using Weblate (Polish) Currently translated at 100.0% (1046 of 1046 strings) Translated using Weblate (Polish) Currently translated at 100.0% (1046 of 1046 strings) Co-authored-by: Weblate <noreply@weblate.org> Co-authored-by: subtype <subtype@hollow.capital> Translate-URL: http://translate.akkoma.dev/projects/akkoma/pleroma-fe/pl/ Translation: Pleroma fe/pleroma-fe commit 1489d92997854c44c3dad65699faf100e340b3a5 Author: Weblate <noreply@weblate.org> Date: Thu Feb 15 17:32:32 2024 +0000 Translated using Weblate (Japanese (ja_EASY)) Currently translated at 72.3% (757 of 1046 strings) Co-authored-by: Weblate <noreply@weblate.org> Co-authored-by: kazari <6c577a54-aac9-482a-955e-745c858445e3@simplelogin.com> Translate-URL: http://translate.akkoma.dev/projects/akkoma/pleroma-fe/ja_EASY/ Translation: Pleroma fe/pleroma-fe commit db5c9572dc9d09de38b93a70eee23b05e813aeda Author: Weblate <noreply@weblate.org> Date: Thu Feb 15 17:32:32 2024 +0000 Translated using Weblate (Italian) Currently translated at 80.4% (841 of 1045 strings) Translated using Weblate (Italian) Currently translated at 65.3% (683 of 1045 strings) Co-authored-by: Cuche <cuche@mailbox.org> Co-authored-by: Weblate <noreply@weblate.org> Translate-URL: http://translate.akkoma.dev/projects/akkoma/pleroma-fe/it/ Translation: Pleroma fe/pleroma-fe commit 5bb53c8b0dd37e1b0048ba150d55fe840aa7f3ec Author: Weblate <noreply@weblate.org> Date: Thu Feb 15 17:32:32 2024 +0000 Translated using Weblate (Spanish) Currently translated at 93.9% (983 of 1046 strings) Translated using Weblate (Spanish) Currently translated at 92.5% (967 of 1045 strings) Co-authored-by: Weblate <noreply@weblate.org> Co-authored-by: taretka <info@tarteka.net> Translate-URL: http://translate.akkoma.dev/projects/akkoma/pleroma-fe/es/ Translation: Pleroma fe/pleroma-fe commit 665f88f5c79bd56e6dd1450e85063c708bda15ee Author: Weblate <noreply@weblate.org> Date: Thu Feb 15 17:32:32 2024 +0000 Translated using Weblate (Indonesian) Currently translated at 71.9% (753 of 1046 strings) Co-authored-by: Aldiantoro Nugroho <kriwil@gmail.com> Co-authored-by: Weblate <noreply@weblate.org> Translate-URL: http://translate.akkoma.dev/projects/akkoma/pleroma-fe/id/ Translation: Pleroma fe/pleroma-fe commit 050c7df2e6 Author: Oneric <oneric@oneric.stub> Date: Wed Feb 14 17:44:57 2024 +0000 Display profile background of other users And add a new frontend setting to hide other people's background. commit a77a9e04d9 Author: Oneric <oneric@oneric.stub> Date: Wed Jan 17 19:50:47 2024 +0000 Expose new server-side permit_followback setting Added to backend in AkkomaGang/akkoma#674 commit a57334991e Author: leap123 <leapofazzam@protonmail.com> Date: Fri Jan 19 04:27:26 2024 +0000 Add Indonesian translation The Indonesian translation is technically almost complete, just not added to messages.js commit 8dce31d0ad Merge: d304be65 ea9ad4d6 Author: floatingghost <hannah@coffee-and-dreams.uk> Date: Wed Dec 20 18:49:40 2023 +0000 Merge pull request 'Improve UX of subject / Content Warning field' (#362) from hazelnoot/akkoma-fe:develop into develop Reviewed-on: AkkomaGang/akkoma-fe#362 commit ea9ad4d600 Author: Hazel Koehler <acomputerdog@gmail.com> Date: Wed Dec 20 12:39:31 2023 -0500 fix "always show content warning" setting commit 34e2800f59 Author: Hazel Koehler <acomputerdog@gmail.com> Date: Sat Dec 16 14:44:26 2023 -0500 add button to toggle the spoiler / CW field commit 3d65eccf04 Author: Hazel Koehler <acomputerdog@gmail.com> Date: Sat Dec 16 13:37:59 2023 -0500 use main emoji button for spoiler / CW field commit d304be654f Merge: aee97fa9 1de62fff Author: floatingghost <hannah@coffee-and-dreams.uk> Date: Fri Dec 15 12:24:33 2023 +0000 Merge pull request 'Update build setup instructions' (#343) from norm/pleroma-fe:update-build-setup into develop Reviewed-on: AkkomaGang/akkoma-fe#343 commit aee97fa948 Merge: 7da1687f d9e1bc4d Author: floatingghost <hannah@coffee-and-dreams.uk> Date: Fri Dec 15 12:24:07 2023 +0000 Merge pull request 'Re-added extension checking for still-image' (#346) from Mergan/pleroma-fe:still-image-ultimate into develop Reviewed-on: AkkomaGang/akkoma-fe#346 commit 7da1687f31 Merge: a8f193d4 235c734d Author: floatingghost <hannah@coffee-and-dreams.uk> Date: Fri Dec 15 12:12:28 2023 +0000 Merge pull request 'Use relative font size and set appropriate overflow behavior' (#355) from xarvos/pleroma-fe:update-css into develop Reviewed-on: AkkomaGang/akkoma-fe#355 commit a8f193d4bd Merge: 81c82e11 beee99e7 Author: floatingghost <hannah@coffee-and-dreams.uk> Date: Fri Dec 15 11:57:47 2023 +0000 Merge pull request 'Stop constant movement of notifications due to changing timestamps' (#353) from Oneric/akkoma-fe:notification-writhing into develop Reviewed-on: AkkomaGang/akkoma-fe#353 commit 81c82e11bc Merge: 00cadce5 ab250c2f Author: floatingghost <hannah@coffee-and-dreams.uk> Date: Fri Dec 15 11:54:15 2023 +0000 Merge pull request 'Explicitly set SameSite attribute for cookies' (#352) from Oneric/akkoma-fe:cookie-samesite into develop Reviewed-on: AkkomaGang/akkoma-fe#352 commit 00cadce5b4 Merge: 40a08f27 1b28ec3b Author: floatingghost <hannah@coffee-and-dreams.uk> Date: Fri Dec 15 11:52:59 2023 +0000 Merge pull request 'Format dates, times with window.navigator.language instead of UI i18n locale' (#354) from smitten/akkoma-fe:date-locale-fix-cherrypick into develop Reviewed-on: AkkomaGang/akkoma-fe#354 commit 40a08f279b Merge: 52b0b6f0 c524a47e Author: floatingghost <hannah@coffee-and-dreams.uk> Date: Thu Nov 16 10:41:17 2023 +0000 Merge pull request 'Drop broken "@ symbol as icon" setting' (#359) from Oneric/akkoma-fe:at-icon into develop Reviewed-on: AkkomaGang/akkoma-fe#359 commit c524a47e6f Author: Oneric <oneric@oneric.stub> Date: Wed Nov 15 23:36:19 2023 +0100 Drop broken "@ symbol as icon" setting It was merged into pleroma-fe on 2022-02-03 in 76547fe66d and imported into akkoma-fe on 2022-06-08 with the merge commit f6cf509a04. However, something went wrong in the merge and while the setting and its infrastructure exist, it is never used anywhere and @ is always displayed as text. Given it existed in this broken state for nearly one and a half years, never worked on akkoma-fe and no bugs were filed about this, it appears nobody cares, so let’s just remove it. commit 235c734d37 Author: Ngô Ngọc Đức Huy <huyngo@disroot.org> Date: Sun Nov 5 09:21:49 2023 +0700 Use overflow: auto for description Previously it sets overflow: scroll, so there's an unnecessary horizontal scroll. overflow: auto only shows scrollbar when it overflows commit deaef1d0b9 Author: Ngô Ngọc Đức Huy <huyngo@disroot.org> Date: Sun Nov 5 09:21:01 2023 +0700 Use relative unit for font size commit 1b28ec3b72 Author: smitten <everything-cozy@pm.me> Date: Wed Nov 1 23:10:57 2023 -0400 Match UI i18n configuration to browser locales commit c9dc8f00f9 Author: smitten <everything-cozy@pm.me> Date: Mon Oct 30 18:54:07 2023 -0400 Use window.navigator.language before interface i18n language commit beee99e733 Author: Oneric <oneric@oneric.stub> Date: Wed Oct 18 22:51:24 2023 +0200 Stop notifications boxes from change size over time Notifications about favourites and follows use .notification-right, notifications about replies instead use .heading-right. Previously only the former set a min-width, however the chosen value of 3em was too small to fit the worst case. As a consequence, when the timestamp text changes over time, its element width changes, which may result in neighbouring text (no longer) needing to wrap to a new line in turn changing the size of the whole notification box pushing older notification boxes down/up. These constant movements at the side of the screen can be quite annoying and confusing when the cause cannot be immediately discerned. Avoid this, by reserving enough space for any timestamp. For English, the worst case is the five-character 'XXmin', since the short identifier for minutes is the longest with three letters. With two exceptions, all other current localisation also do not exceed three letters in any short unit identifier up to days. However, some localisations (e.g. Polish) additionally insert a space between numerical value and unit. This matches SI recommendations pushing the worst case to 6 characters. 6 characters will be sufficient for timestamps up to 3 weeks in all languages (minus prev exceptions), which seems reasonable enough as beyond this timestamps rarely change anyway. The aforementioned exceptions being Vietnamese and Occitan, but in the current localisation all or the relevant short unit identifiers are identical to the long forms indicating this is just due to incomplete translation. Indeed, Vietnamese Wikipedia (read through machine translation) suggests “ph” is commonly used as unit identifiers for minutes, but the current localisation fully spells it out as “phút”. commit ccb0ffdc8a Author: Oneric <oneric@oneric.stub> Date: Tue Oct 24 18:23:47 2023 +0200 Don't show direction in notification timestamps Currently all notifications except follow-related once include and explicit direction text. (It missing in follow notifs is due to an omission in 804ba0cdb6b353e0c959c68f44c6a1316c0d6b10 which only added the newly introduced with-direction to status-related notifs. Before, presumably all notifs included direction text.) But in the notification tray horizontal space is scarce and notifs can already be assumed to only come from the past. While it might not be too bad for the English localisation’s 4-letter ' ago' suffix, e.g. the Indonesian localisation’s ' yang lalu' needs 10 letters. Thus instead of fixing the omission for follow-related notifs, drop direction text from all notification timestamps. commit ab250c2f3a Author: Oneric <oneric@oneric.stub> Date: Thu Oct 19 00:45:11 2023 +0200 Explicitly set SameSite attribute for cookies Modern browsers start to tighten down on third-party access to cookies. E.g. in current Firefox, a warning about the userLanguage cookie was shown since it did not yet explicitly set the SameSite attribute and the default is about to change. The cookie name being referred to as BACKEND_LANGUAGE_COOKIE_NAME suggests it should be readable by the actual Akkoma backend, which can live at a different domain than akkoma-fe. Thus explicitly enable sharing with third-party sites. No warnings were shown for other cookies, so I assume this was the only one not yet setting SameSite. commit 1de62fffcd Author: Norm <normandy@biribiri.dev> Date: Sat Sep 23 20:34:30 2023 -0400 Update config.example.json link and example domain commit 306cea04a1 Author: Norm <normandy@biribiri.dev> Date: Sat Sep 23 20:33:46 2023 -0400 Use corepack in build instructions commit d9e1bc4d99 Author: Mergan <mergan@viridianpatriots.com> Date: Mon Oct 2 15:29:54 2023 -0700 Re-added extension checking for still-image - Bonus refactoring commit 52b0b6f008 Author: FloatingGhost <hannah@coffee-and-dreams.uk> Date: Mon Oct 2 13:28:23 2023 +0100 add VI to messages.js commit 8afbe5e3bc Merge: 58be48d1 1056b89f Author: floatingghost <hannah@coffee-and-dreams.uk> Date: Mon Sep 25 13:29:29 2023 +0000 Merge pull request 'Making still-image better' (#341) from Mergan/pleroma-fe:still-image-ultimate into develop Reviewed-on: AkkomaGang/akkoma-fe#341 commit 58be48d164 Merge: 174f98b1 6a1409e0 Author: floatingghost <hannah@coffee-and-dreams.uk> Date: Mon Sep 25 13:24:12 2023 +0000 Merge pull request 'Do not copy all emojis in recentEmoji getter' (#340) from sn0w/akkoma-fe:feature/optimize-recent-emojis into develop Reviewed-on: AkkomaGang/akkoma-fe#340 commit 1056b89fd1 Author: Mergan <mergan@viridianpatriots.com> Date: Tue Sep 12 04:19:08 2023 -0700 Disabled aggressive matching for reduced motion (we search for gif now) commit 3e64d78d05 Author: Mergan <mergan@viridianpatriots.com> Date: Tue Sep 12 04:17:28 2023 -0700 An oopsie commit 3947aafeba Author: Mergan <mergan@viridianpatriots.com> Date: Tue Sep 12 04:08:47 2023 -0700 Aligning canvas to image commit 345934c2f3 Author: Mergan <mergan@viridianpatriots.com> Date: Tue Sep 12 03:36:14 2023 -0700 Make label visible on avatar commit 42a13b0f1b Author: Mergan <mergan@viridianpatriots.com> Date: Tue Sep 12 03:05:42 2023 -0700 Modify label commit e13c4b6b85 Author: Mergan <mergan@viridianpatriots.com> Date: Tue Sep 12 02:48:53 2023 -0700 Revamped still-image commit 6a1409e09b Author: sn0w <me@sn0w.cx> Date: Sun Sep 3 16:05:56 2023 +0200 Do not copy all emojis in recentEmoji getter commit e7a558a533dd31de174791f130afdaa5b6893b74 Merge: 5106fced 174f98b1 Author: FloatingGhost <hannah@coffee-and-dreams.uk> Date: Sat Aug 5 14:17:53 2023 +0100 Merge branch 'develop' into stable commit 174f98b1cb Author: FloatingGhost <hannah@coffee-and-dreams.uk> Date: Sat Aug 5 14:17:42 2023 +0100 don't die on my arm box please commit 5106fcedd6b46ee5cbe1a1ece0cc4bab25eb3ac4 Merge: 1db322ba ab146b67 Author: FloatingGhost <hannah@coffee-and-dreams.uk> Date: Sat Aug 5 13:29:55 2023 +0100 Merge branch 'develop' into stable commit ab146b67ec Author: FloatingGhost <hannah@coffee-and-dreams.uk> Date: Sat Aug 5 13:29:44 2023 +0100 version commit 1db322bae645611b1e56ff8dcc7ea1618a70beed Merge: e530c2b4 3b4208ea Author: FloatingGhost <hannah@coffee-and-dreams.uk> Date: Sat Aug 5 13:29:26 2023 +0100 Merge branch 'develop' into stable commit 3b4208ea41 Author: FloatingGhost <hannah@coffee-and-dreams.uk> Date: Fri Aug 4 16:48:13 2023 +0100 debounce emoji searching commit 856324fa26 Merge: 5a9322d2 0da0e2c8 Author: floatingghost <hannah@coffee-and-dreams.uk> Date: Fri Aug 4 15:09:56 2023 +0000 Merge pull request 'Make favicon next to post username use Still-Image functionality' (#327) from Mergan/pleroma-fe:still-image-instance-favicon into develop Reviewed-on: AkkomaGang/akkoma-fe#327 commit 5a9322d2c7 Merge: b52bfbcb 43d0a245 Author: floatingghost <hannah@coffee-and-dreams.uk> Date: Fri Aug 4 15:09:32 2023 +0000 Merge pull request 'StillImage: Improved animated image detection' (#335) from yukijoou/akkoma-fe:still-image-better-gif-detection into develop Reviewed-on: AkkomaGang/akkoma-fe#335 commit b52bfbcba0 Merge: 2b05a738 fa5d31b7 Author: Weblate <noreply@weblate.org> Date: Fri Aug 4 14:56:22 2023 +0000 Merge branch 'origin/develop' into Weblate. commit 2b05a738c9 Merge: 29cfdcbb 7c14e1a5 Author: floatingghost <hannah@coffee-and-dreams.uk> Date: Fri Aug 4 14:56:20 2023 +0000 Merge pull request 'Add replying info for redraft' (#332) from xarvos/pleroma-fe:fix-reply-redraft into develop Reviewed-on: AkkomaGang/akkoma-fe#332 commit fa5d31b793 Merge: 29cfdcbb 5174b959 Author: Weblate <noreply@weblate.org> Date: Fri Aug 4 14:54:38 2023 +0000 Merge branch 'origin/develop' into Weblate. commit 29cfdcbbcd Author: tusooa <tusooa@kazv.moe> Date: Fri Aug 4 15:54:04 2023 +0100 Add load more to blocks/mutes commit 5174b95918 Author: Weblate <noreply@weblate.org> Date: Fri Aug 4 13:34:26 2023 +0000 Translated using Weblate (Greek) Currently translated at 15.4% (162 of 1046 strings) Added translation using Weblate (Greek) Co-authored-by: Weblate <noreply@weblate.org> Co-authored-by: getimiskon <getimiskon@disroot.org> Translate-URL: http://translate.akkoma.dev/projects/akkoma/pleroma-fe/el/ Translation: Pleroma fe/pleroma-fe commit 56528206b8 Author: Weblate <noreply@weblate.org> Date: Fri Aug 4 13:34:26 2023 +0000 Translated using Weblate (Portuguese) Currently translated at 62.7% (656 of 1046 strings) Co-authored-by: Jonathan Soares <jontix@murena.io> Co-authored-by: Weblate <noreply@weblate.org> Translate-URL: http://translate.akkoma.dev/projects/akkoma/pleroma-fe/pt/ Translation: Pleroma fe/pleroma-fe commit 590380c084 Author: Weblate <noreply@weblate.org> Date: Fri Aug 4 13:34:26 2023 +0000 Translated using Weblate (Thai) Currently translated at 1.7% (18 of 1046 strings) Added translation using Weblate (Thai) Co-authored-by: Chanakan Mungtin <chanakan5591@chanakancloud.net> Co-authored-by: Pongsatorn Paewsoongnern <akkoma@miraiverse.me> Co-authored-by: Weblate <noreply@weblate.org> Translate-URL: http://translate.akkoma.dev/projects/akkoma/pleroma-fe/th/ Translation: Pleroma fe/pleroma-fe commit dfcbb3c1ec Author: Weblate <noreply@weblate.org> Date: Fri Aug 4 13:34:26 2023 +0000 Translated using Weblate (Ukrainian) Currently translated at 100.0% (1046 of 1046 strings) Co-authored-by: Denys Nykula <vegan@libre.net.ua> Co-authored-by: Weblate <noreply@weblate.org> Translate-URL: http://translate.akkoma.dev/projects/akkoma/pleroma-fe/uk/ Translation: Pleroma fe/pleroma-fe commit 9b01c31283 Author: Weblate <noreply@weblate.org> Date: Fri Aug 4 13:34:26 2023 +0000 Translated using Weblate (Chinese (Simplified)) Currently translated at 100.0% (1046 of 1046 strings) Co-authored-by: Poesty Li <poesty7450@gmail.com> Co-authored-by: Weblate <noreply@weblate.org> Translate-URL: http://translate.akkoma.dev/projects/akkoma/pleroma-fe/zh_Hans/ Translation: Pleroma fe/pleroma-fe commit 6be003b2f8 Author: Weblate <noreply@weblate.org> Date: Fri Aug 4 13:34:26 2023 +0000 Translated using Weblate (French) Currently translated at 98.3% (1029 of 1046 strings) Co-authored-by: Thomate <thomas@burdick.fr> Co-authored-by: Weblate <noreply@weblate.org> Translate-URL: http://translate.akkoma.dev/projects/akkoma/pleroma-fe/fr/ Translation: Pleroma fe/pleroma-fe commit cc302fb0e2 Author: Weblate <noreply@weblate.org> Date: Fri Aug 4 13:34:26 2023 +0000 Translated using Weblate (Japanese (ja_EASY)) Currently translated at 72.3% (757 of 1046 strings) Translated using Weblate (Japanese (ja_EASY)) Currently translated at 71.9% (753 of 1046 strings) Co-authored-by: Hikaru Shinagawa <hikali.47041@gmail.com> Co-authored-by: Weblate <noreply@weblate.org> Co-authored-by: kazari <6c577a54-aac9-482a-955e-745c858445e3@simplelogin.com> Translate-URL: http://translate.akkoma.dev/projects/akkoma/pleroma-fe/ja_EASY/ Translation: Pleroma fe/pleroma-fe commit c4e768f977 Author: Weblate <noreply@weblate.org> Date: Fri Aug 4 13:34:26 2023 +0000 Translated using Weblate (Indonesian) Currently translated at 67.8% (710 of 1046 strings) Co-authored-by: Weblate <noreply@weblate.org> Co-authored-by: Yonle <yonle@lecturify.net> Translate-URL: http://translate.akkoma.dev/projects/akkoma/pleroma-fe/id/ Translation: Pleroma fe/pleroma-fe commit d8a7217335 Author: Weblate <noreply@weblate.org> Date: Fri Aug 4 13:34:26 2023 +0000 Translated using Weblate (Turkish) Currently translated at 9.7% (102 of 1046 strings) Co-authored-by: Hasan Yıldız <hasanyildiz0@yaani.com> Co-authored-by: Weblate <noreply@weblate.org> Translate-URL: http://translate.akkoma.dev/projects/akkoma/pleroma-fe/tr/ Translation: Pleroma fe/pleroma-fe commit 35d10ab9ff Merge: af97dd74 51ebe643 Author: floatingghost <hannah@coffee-and-dreams.uk> Date: Fri Aug 4 13:34:23 2023 +0000 Merge pull request 'components: Honour 'prefers reduced motion' setting in many components' (#333) from yukijoou/akkoma-fe:fix-reduced-motion into develop Reviewed-on: AkkomaGang/akkoma-fe#333 commit 43d0a24547 Author: Yuki Joou <yukijoou@laposte.net> Date: Thu Aug 3 16:03:12 2023 +0200 StillImage: Improved animated image detection This patch makes StillImage's animation detection return early in cases where we can't detect the mimetype of the image. It also sets the image as animated in those cases if the user agent wants reduced motion. As reduced motion is an accessibility setting, I think it's best to use a "better safe than sorry" approach, it's better to accidentally mark something as animated that isn't than to have unblocked animations. commit 51ebe643d5 Author: Yuki Joou <yukijoou@laposte.net> Date: Wed Aug 2 12:45:18 2023 +0200 components: Honour 'prefers reduced motion' setting in many components This helps accessibility for motion-sensitive people such as myself, and can improve battery life in "battery saving" mode on most devices commit 7c14e1a5bd Author: Ngô Ngọc Đức Huy <huyngo@disroot.org> Date: Wed Aug 2 08:40:19 2023 +0700 Add replying info for redraft commit 0da0e2c814 Author: David <dmgf2008@hotmail.com> Date: Mon Jul 24 01:08:11 2023 -0700 Make favicon next to post username use Still-Image functionality commit af97dd7484 Merge: 28bf5974 2d387e2e Author: floatingghost <hannah@coffee-and-dreams.uk> Date: Fri Jul 21 19:44:25 2023 +0000 Merge pull request 'docs: Update Pleroma references to Akkoma' (#318) from norm/pleroma-fe:update-docs into develop Reviewed-on: AkkomaGang/akkoma-fe#318 commit 28bf597443 Merge: a249baea 14ed359c Author: floatingghost <hannah@coffee-and-dreams.uk> Date: Fri Jul 21 19:43:14 2023 +0000 Merge pull request '[workaround] fix: emoji picker not scrollable on ios' (#323) from SukinoVerse/akkoma-fe:fix/emoji-picker-not-scrollable-ios into develop Reviewed-on: AkkomaGang/akkoma-fe#323 commit a249baea8c Merge: a4e82f78 32dc55b0 Author: floatingghost <hannah@coffee-and-dreams.uk> Date: Fri Jul 21 19:42:41 2023 +0000 Merge pull request 'Make emoji reactions use Still-Image functionality' (#326) from Mergan/pleroma-fe:still-image-emoji-reactions into develop Reviewed-on: AkkomaGang/akkoma-fe#326 commit a4e82f7886 Merge: 42ffce97 91eab22d Author: floatingghost <hannah@coffee-and-dreams.uk> Date: Fri Jul 21 19:37:43 2023 +0000 Merge pull request '[feat] Support prefers-reduced-motion disabling auto-play of animated images (#324)' (#325) from Mergan/pleroma-fe:support-prefers-reduced-motion into develop Reviewed-on: AkkomaGang/akkoma-fe#325 commit 32dc55b07c Author: David <dmgf2008@hotmail.com> Date: Thu Jul 20 17:20:54 2023 -0700 Make emoji reactions use Still-Image functionality commit 91eab22d77 Author: David <dmgf2008@hotmail.com> Date: Thu Jul 20 17:18:59 2023 -0700 Simplified and fixed and/or oopsie commit e2125c57d6 Author: David <dmgf2008@hotmail.com> Date: Thu Jul 20 16:26:52 2023 -0700 Turn on by default commit e0a6418e91 Author: David <dmgf2008@hotmail.com> Date: Thu Jul 20 16:14:36 2023 -0700 Add prefers-reduced-motion support commit 14ed359c33 Author: SukinoVERSΞ <github@miraiverse.me> Date: Tue Jul 11 22:16:37 2023 +0700 fix: emoji picker not scrollable on ios commit 2d387e2eb4 Author: Francis Dinh <normandy@biribiri.dev> Date: Fri May 26 23:02:38 2023 -0400 update more images commit 57f70371a9 Author: Francis Dinh <normandy@biribiri.dev> Date: Fri May 26 22:59:55 2023 -0400 use better example emoji commit 8feffbcdf6 Author: Francis Dinh <normandy@biribiri.dev> Date: Fri May 26 22:49:29 2023 -0400 docs: Update Pleroma references to Akkoma commit e530c2b4626fab3bc94736cb7d0774809717911f Merge: 9aa64d82 42ffce97 Author: FloatingGhost <hannah@coffee-and-dreams.uk> Date: Tue May 23 14:10:31 2023 +0100 Merge branch 'develop' into stable commit 42ffce97d6 Merge: 2f479c67 ee6e7026 Author: FloatingGhost <hannah@coffee-and-dreams.uk> Date: Tue May 23 13:47:14 2023 +0100 Merge remote-tracking branch 'origin/translations' into dm-privacy commit 2f479c670f Author: FloatingGhost <hannah@coffee-and-dreams.uk> Date: Tue May 23 13:46:59 2023 +0100 Add DM settings commit ee6e7026ab Merge: 17c05a5c 42896c2a Author: Weblate <noreply@weblate.org> Date: Tue May 23 11:38:58 2023 +0000 Merge branch 'origin/develop' into Weblate. commit 17c05a5ca2 Merge: ecb6be21 6b3b5545 Author: floatingghost <hannah@coffee-and-dreams.uk> Date: Tue May 23 11:38:57 2023 +0000 Merge pull request 'paper theme: more contrast and fix setting tab hover' (#314) from denys/akkoma-fe:cool-paper-theme into develop Reviewed-on: AkkomaGang/akkoma-fe#314 commit 42896c2abf Merge: ecb6be21 6c92983a Author: Weblate <noreply@weblate.org> Date: Tue May 23 11:38:30 2023 +0000 Merge branch 'origin/develop' into Weblate. commit ecb6be2152 Merge: 9e4985e2 8c6ccc32 Author: floatingghost <hannah@coffee-and-dreams.uk> Date: Tue May 23 11:38:28 2023 +0000 Merge pull request 'fix unfinished post being sent when scrolling' (#312) from denys/akkoma-fe:accidental-mobile-posts into develop Reviewed-on: AkkomaGang/akkoma-fe#312 commit 6c92983af6 Merge: 9e4985e2 60ff715a Author: Weblate <noreply@weblate.org> Date: Tue May 23 11:37:26 2023 +0000 Merge branch 'origin/develop' into Weblate. commit 9e4985e225 Merge: 596ae7e3 2a76be56 Author: floatingghost <hannah@coffee-and-dreams.uk> Date: Tue May 23 11:37:24 2023 +0000 Merge pull request 'fix apply theme button without page refresh' (#309) from denys/akkoma-fe:fix-apply-theme into develop Reviewed-on: AkkomaGang/akkoma-fe#309 commit 60ff715aff Author: Weblate <noreply@weblate.org> Date: Sun May 21 20:58:06 2023 +0000 Translated using Weblate (Chinese (Simplified)) Currently translated at 100.0% (1042 of 1042 strings) Co-authored-by: Poesty Li <poesty7450@gmail.com> Co-authored-by: Weblate <noreply@weblate.org> Translate-URL: http://translate.akkoma.dev/projects/akkoma/pleroma-fe/zh_Hans/ Translation: Pleroma fe/pleroma-fe commit 04bcf7d804 Author: Weblate <noreply@weblate.org> Date: Sun May 21 20:58:06 2023 +0000 Translated using Weblate (Polish) Currently translated at 66.1% (689 of 1042 strings) Co-authored-by: Jeder <jeder@jeder.pl> Co-authored-by: Weblate <noreply@weblate.org> Translate-URL: http://translate.akkoma.dev/projects/akkoma/pleroma-fe/pl/ Translation: Pleroma fe/pleroma-fe commit 5fa305c58c Author: Weblate <noreply@weblate.org> Date: Sun May 21 20:58:06 2023 +0000 Translated using Weblate (Japanese (ja_EASY)) Currently translated at 72.0% (751 of 1042 strings) Co-authored-by: Weblate <noreply@weblate.org> Co-authored-by: kazari <6c577a54-aac9-482a-955e-745c858445e3@simplelogin.com> Translate-URL: http://translate.akkoma.dev/projects/akkoma/pleroma-fe/ja_EASY/ Translation: Pleroma fe/pleroma-fe commit a2ceb89d5e Author: Weblate <noreply@weblate.org> Date: Sun May 21 20:58:06 2023 +0000 Translated using Weblate (Turkish) Currently translated at 4.0% (42 of 1042 strings) Added translation using Weblate (Turkish) Co-authored-by: Hasan Yıldız <hasanyildiz0@yaani.com> Co-authored-by: Weblate <noreply@weblate.org> Translate-URL: http://translate.akkoma.dev/projects/akkoma/pleroma-fe/tr/ Translation: Pleroma fe/pleroma-fe commit 6b3b55455d Author: Denys Nykula <vegan@libre.net.ua> Date: Thu May 18 23:05:19 2023 +0300 paper theme: more contrast and fix setting tab hover commit 8c6ccc321d Author: Denys Nykula <vegan@libre.net.ua> Date: Mon May 15 03:11:07 2023 +0300 fix unfinished post being sent when scrolling commit 596ae7e377 Merge: 0d22a22a 94d640f9 Author: floatingghost <hannah@coffee-and-dreams.uk> Date: Mon May 8 15:29:58 2023 +0000 Merge pull request 'fix dropdown-item-icon and form controls using missing variables' (#307) from denys/akkoma-fe:missing-sass-vars into develop Reviewed-on: AkkomaGang/akkoma-fe#307 commit 0d22a22a10 Merge: 1f943ce8 661a98d3 Author: floatingghost <hannah@coffee-and-dreams.uk> Date: Mon May 8 15:28:54 2023 +0000 Merge pull request 'order bubble after public in sidebar like in other two menus' (#306) from denys/akkoma-fe:consistent-bubble-order into develop Reviewed-on: AkkomaGang/akkoma-fe#306 commit 2a76be56e7 Author: Denys Nykula <vegan@libre.net.ua> Date: Mon May 1 20:54:18 2023 +0300 fix apply theme button without page refresh commit 661a98d38d Author: Denys Nykula <vegan@libre.net.ua> Date: Mon May 1 20:53:29 2023 +0300 order bubble after public in sidebar like in other two menus commit 94d640f9f1 Author: Denys Nykula <vegan@libre.net.ua> Date: Mon May 1 20:50:31 2023 +0300 fix dropdown-item-icon and form controls using missing variables commit 9aa64d82c964265133be97b08b0cdf0e75680419 Merge: 85abc622 1f943ce8 Author: FloatingGhost <hannah@coffee-and-dreams.uk> Date: Fri Apr 14 18:10:41 2023 +0100 Merge branch 'develop' into stable commit 1f943ce8a5 Merge: c5407644 a4dfdc08 Author: Weblate <noreply@weblate.org> Date: Fri Apr 14 16:43:42 2023 +0000 Merge branch 'origin/develop' into Weblate. commit c540764408 Author: FloatingGhost <hannah@coffee-and-dreams.uk> Date: Fri Apr 14 17:43:05 2023 +0100 ensure we only fetch reports when we're an admin Ref #288 commit a4dfdc0853 Merge: ddea499a f1bf2243 Author: Weblate <noreply@weblate.org> Date: Fri Apr 14 16:30:56 2023 +0000 Merge branch 'origin/develop' into Weblate. commit ddea499a36 Merge: 14cedc5e db33fe8e Author: floatingghost <hannah@coffee-and-dreams.uk> Date: Fri Apr 14 16:30:55 2023 +0000 Merge pull request 'Fix edits and redrafts being erased by drafts' (#297) from solidsanek/pleroma-fe:drafts-edit-redraft-fix into develop Reviewed-on: AkkomaGang/akkoma-fe#297 commit db33fe8ee2 Author: solidsanek <solidsanek@outerheaven.club> Date: Sun Apr 9 11:02:13 2023 +0200 Drafts: Fix drafts erasing edits and redrafts commit f1bf22436d Author: Weblate <noreply@weblate.org> Date: Wed Apr 5 18:57:45 2023 +0000 Translated using Weblate (Portuguese) Currently translated at 62.8% (655 of 1042 strings) Co-authored-by: cel <8cbv6di5@duck.com> Translate-URL: http://translate.akkoma.dev/projects/akkoma/pleroma-fe/pt/ Translation: Pleroma fe/pleroma-fe commit 459c73ec02 Author: Weblate <noreply@weblate.org> Date: Wed Apr 5 18:57:45 2023 +0000 Translated using Weblate (Chinese (Simplified)) Currently translated at 100.0% (1041 of 1041 strings) Translated using Weblate (Chinese (Simplified)) Currently translated at 99.9% (1040 of 1041 strings) Translated using Weblate (Chinese (Simplified)) Currently translated at 99.9% (1040 of 1041 strings) Translated using Weblate (Chinese (Simplified)) Currently translated at 99.9% (1039 of 1040 strings) Co-authored-by: Poesty Li <poesty7450@gmail.com> Co-authored-by: SevicheCC <sevicheee@outlook.com> Co-authored-by: Weblate <noreply@weblate.org> Translate-URL: http://translate.akkoma.dev/projects/akkoma/pleroma-fe/zh_Hans/ Translation: Pleroma fe/pleroma-fe commit 2acf1e5c59 Author: Weblate <noreply@weblate.org> Date: Wed Apr 5 18:57:45 2023 +0000 Translated using Weblate (Ukrainian) Currently translated at 87.2% (908 of 1041 strings) Co-authored-by: Denys Nykula <vegan@libre.net.ua> Co-authored-by: Weblate <noreply@weblate.org> Translate-URL: http://translate.akkoma.dev/projects/akkoma/pleroma-fe/uk/ Translation: Pleroma fe/pleroma-fe commit 33c4459744 Author: Weblate <noreply@weblate.org> Date: Wed Apr 5 18:57:45 2023 +0000 Translated using Weblate (French) Currently translated at 98.5% (1027 of 1042 strings) Translated using Weblate (French) Currently translated at 98.3% (1024 of 1041 strings) Translated using Weblate (French) Currently translated at 96.9% (1002 of 1033 strings) Co-authored-by: Thomate <thomas@burdick.fr> Co-authored-by: Weblate <noreply@weblate.org> Translate-URL: http://translate.akkoma.dev/projects/akkoma/pleroma-fe/fr/ Translation: Pleroma fe/pleroma-fe commit b00487e51f Author: Weblate <noreply@weblate.org> Date: Wed Apr 5 18:57:45 2023 +0000 Translated using Weblate (Japanese (ja_EASY)) Currently translated at 71.6% (747 of 1042 strings) Translated using Weblate (Japanese (ja_EASY)) Currently translated at 71.6% (747 of 1042 strings) Translated using Weblate (Japanese (ja_EASY)) Currently translated at 54.1% (564 of 1042 strings) Co-authored-by: Hikaru Shinagawa <hikali.47041@gmail.com> Co-authored-by: Weblate <noreply@weblate.org> Co-authored-by: kazari <6c577a54-aac9-482a-955e-745c858445e3@simplelogin.com> Translate-URL: http://translate.akkoma.dev/projects/akkoma/pleroma-fe/ja_EASY/ Translation: Pleroma fe/pleroma-fe commit 1e1cab643c Author: Weblate <noreply@weblate.org> Date: Wed Apr 5 18:57:45 2023 +0000 Translated using Weblate (Dutch) Currently translated at 99.7% (1038 of 1041 strings) Co-authored-by: Fristi <fristi@subcon.town> Co-authored-by: Weblate <noreply@weblate.org> Translate-URL: http://translate.akkoma.dev/projects/akkoma/pleroma-fe/nl/ Translation: Pleroma fe/pleroma-fe commit 8d3219a6d2 Author: Weblate <noreply@weblate.org> Date: Wed Apr 5 18:57:45 2023 +0000 Translated using Weblate (Indonesian) Currently translated at 65.4% (676 of 1033 strings) Translated using Weblate (Indonesian) Currently translated at 65.4% (676 of 1033 strings) Co-authored-by: Weblate <noreply@weblate.org> Co-authored-by: t1 <taaa@fedora.email> Translate-URL: http://translate.akkoma.dev/projects/akkoma/pleroma-fe/id/ Translation: Pleroma fe/pleroma-fe commit ec9753758f Author: Weblate <noreply@weblate.org> Date: Wed Apr 5 18:57:45 2023 +0000 Translated using Weblate (Spanish) Currently translated at 90.8% (938 of 1033 strings) Co-authored-by: Weblate <noreply@weblate.org> Co-authored-by: taretka <info@tarteka.net> Translate-URL: http://translate.akkoma.dev/projects/akkoma/pleroma-fe/es/ Translation: Pleroma fe/pleroma-fe commit 97ff4a7241 Author: Weblate <noreply@weblate.org> Date: Wed Apr 5 18:57:45 2023 +0000 Translated using Weblate (German) Currently translated at 99.5% (1036 of 1041 strings) Co-authored-by: Johann <johann@qwertqwefsday.eu> Co-authored-by: Weblate <noreply@weblate.org> Translate-URL: http://translate.akkoma.dev/projects/akkoma/pleroma-fe/de/ Translation: Pleroma fe/pleroma-fe commit 14cedc5ed1 Author: FloatingGhost <hannah@coffee-and-dreams.uk> Date: Sat Apr 1 07:55:47 2023 +0100 don't crash if `class` isn't a list commit 5911777aa2 Merge: 7e1b1e79 47fc082f Author: floatingghost <hannah@coffee-and-dreams.uk> Date: Thu Mar 30 09:49:38 2023 +0000 Merge pull request 'Fix floating point error for poll expiry' (#294) from xarvos/pleroma-fe:fix-poll-expire into develop Reviewed-on: AkkomaGang/akkoma-fe#294 commit 47fc082fb9 Author: Ngô Ngọc Đức Huy <huyngo@disroot.org> Date: Fri Mar 24 20:44:29 2023 +0700 Fix floating point error for poll expiry Previous code multiply with 0.001 before multiplication which leads to a floating point error. By changing it to division by 1000 after multiplication this is avoided. commit 7e1b1e79f4 Author: FloatingGhost <hannah@coffee-and-dreams.uk> Date: Sat Mar 18 20:22:47 2023 +0000 simplify timeline vibility checks commit b92b2f74a4 Author: FloatingGhost <hannah@coffee-and-dreams.uk> Date: Sat Mar 18 20:01:05 2023 +0000 add timeline visibility setting parsing commit 7361f4e77e Author: FloatingGhost <hannah@coffee-and-dreams.uk> Date: Thu Mar 16 16:41:37 2023 +0000 Add checks for currentUser on sidebar commit 9f7f9e2798 Author: FloatingGhost <hannah@coffee-and-dreams.uk> Date: Wed Mar 15 23:00:31 2023 +0000 Remove unused bits and bobs commit 42ab3eada4 Author: FloatingGhost <hannah@coffee-and-dreams.uk> Date: Wed Mar 15 22:20:54 2023 +0000 Remove links from navs if we can't see the timeline commit 85abc622136c2f346f7855824290f6093afe2794 Merge: 8569b594 6fdef479 Author: FloatingGhost <hannah@coffee-and-dreams.uk> Date: Sat Mar 11 17:27:22 2023 +0000 Merge branch 'develop' into stable commit 6fdef479d0 Author: flisk <akkomadev.mvch71fq@flisk.xyz> Date: Fri Mar 10 19:10:42 2023 +0000 add recently used emojis panel to emoji picker (#283) ~~(not intended for merging yet, just submitting this for preliminary review and discussion)~~ this patch adds a tab with recently used emojis to the emoji picker: https://akko.lain.gay/notice/ASoGCtyoiXbYPJjqpk there's a couple of things i'm ~~still trying to work out~~ not totally happy with and i'd appreciate any feedback on them: * the recentEmojis getter is called very frequently and has to do a possibly somewhat expensive lookup of emoji objects by their `displayName` each time, which i'm not sure is ideal * ~~emoji reactions on posts added through the picker are picked up by the recentEmojis module, but clicks on existing emoji reactions are not, because `addReaction` in `react_button.js` only currently receives the replacement and not the full emoji object (if there even is one wherever that method is called from)~~ this works now and does the same stupid full search of all emojis by their name which i guess is less bad because this only happens when you hit a reaction emoji button that already existed Reviewed-on: AkkomaGang/akkoma-fe#283 Co-authored-by: flisk <akkomadev.mvch71fq@flisk.xyz> Co-committed-by: flisk <akkomadev.mvch71fq@flisk.xyz> commit fe08691f05 Merge: 6a976495 626c8800 Author: floatingghost <hannah@coffee-and-dreams.uk> Date: Fri Mar 10 18:57:38 2023 +0000 Merge pull request 'support Misskey's oblong reactions' (#284) from yheuhtozr/pleroma-fe:oblong-reactions into develop Reviewed-on: AkkomaGang/akkoma-fe#284 commit 6a9764951f Merge: 0f33b1cd 999c3859 Author: floatingghost <hannah@coffee-and-dreams.uk> Date: Fri Mar 10 18:56:31 2023 +0000 Merge pull request 'fix realtime updates in 'following' replies filter' (#285) from flisk/akkoma-fe:fix-realtime-reply-filter into develop Reviewed-on: AkkomaGang/akkoma-fe#285 commit 0f33b1cd79 Merge: 6a9d169e 2c007f06 Author: floatingghost <hannah@coffee-and-dreams.uk> Date: Fri Mar 10 18:55:03 2023 +0000 Merge pull request 'Post drafting' (#282) from solidsanek/pleroma-fe:drafts into develop Reviewed-on: AkkomaGang/akkoma-fe#282 commit 999c38594e Author: flisk <akkomadev.mvch71fq@flisk.xyz> Date: Fri Feb 24 00:23:53 2023 +0100 fix realtime updates in 'following' replies filter i'm not sure how this code was supposed to work, but the way it was written would only add statuses to the timeline if they were in reply to someone the user is following and erroneously filter out posts that aren't replies. commit 626c880038 Author: Yhëhtozr <conlang2012@outlook.com> Date: Wed Feb 22 10:20:25 2023 +0900 oblong emoji in status commit 6d7761c7e5 Author: Yhëhtozr <conlang2012@outlook.com> Date: Mon Feb 20 23:27:41 2023 +0900 perhaps more graceful cqw commit 996ce3dde3 Author: Yhëhtozr <conlang2012@outlook.com> Date: Mon Feb 20 23:18:04 2023 +0900 support oblong reactions commit 2c007f06e3 Author: solidsanek <solidsanek@outerheaven.club> Date: Sun Feb 19 18:58:53 2023 +0100 Post: remove debug logs commit 00704bd88c Author: solidsanek <solidsanek@outerheaven.club> Date: Fri Feb 17 13:56:01 2023 +0100 Post: Add drafting feature commit 8569b5946eebdb4e7c91252e1dcf88795c8e2538 Merge: 9c9b4cc0 6a9d169e Author: FloatingGhost <hannah@coffee-and-dreams.uk> Date: Sat Feb 11 10:50:04 2023 +0000 Merge branch 'develop' into stable commit 6a9d169e24 Merge: 9e04e4fd 581c53a1 Author: floatingghost <hannah@coffee-and-dreams.uk> Date: Sat Feb 11 10:41:00 2023 +0000 Merge pull request 'components: emoji_reactions: force custom emoji reaction height' (#280) from a1batross/akkoma-fe:a1batross-patch-1 into develop Reviewed-on: AkkomaGang/akkoma-fe#280 commit 581c53a15e Author: a1batross <a1ba.omarov@gmail.com> Date: Fri Feb 10 23:28:46 2023 +0000 components: emoji_reactions: force custom emoji reaction height Prevents the usage of too long emoji reactions commit 9e04e4fd80 Author: yanchan09 <yan@omg.lol> Date: Sat Feb 4 21:10:06 2023 +0000 Improve emoji picker performance (#275) A simple virtual scroller is now used for the emoji grid. This avoids loading all emoji images at once, saving network bandwidth and reducing load on the server, while also putting less work on the browser's DOM and layout engine. Co-authored-by: yan <yan@omg.lol> Reviewed-on: AkkomaGang/akkoma-fe#275 Co-authored-by: yanchan09 <yan@omg.lol> Co-committed-by: yanchan09 <yan@omg.lol> commit 88d5149db5 Author: floatingghost <hannah@coffee-and-dreams.uk> Date: Sat Feb 4 21:09:09 2023 +0000 paginate-follow-requests (#277) Co-authored-by: FloatingGhost <hannah@coffee-and-dreams.uk> Reviewed-on: AkkomaGang/akkoma-fe#277 commit b4b13d777f Merge: 56fd2e77 7f4dd9ff Author: floatingghost <hannah@coffee-and-dreams.uk> Date: Fri Jan 27 10:08:17 2023 +0000 Merge pull request 'Add indicator to user card if user blocks you' (#274) from eris/pleroma-fe:block-indicator into develop Reviewed-on: AkkomaGang/akkoma-fe#274 commit 7f4dd9ff03 Author: eris <femmediscord@gmail.com> Date: Fri Jan 27 00:26:50 2023 +0000 Disable follow button if blocked by user commit a9a95e9120 Author: eris <femmediscord@gmail.com> Date: Thu Jan 26 20:49:07 2023 +0000 Add indicator if user blocks you commit 56fd2e773b Merge: 236bc2c7 42dc1a02 Author: FloatingGhost <hannah@coffee-and-dreams.uk> Date: Sun Jan 15 17:59:50 2023 +0000 Merge branch 'languages' into develop commit 42dc1a027a Author: FloatingGhost <hannah@coffee-and-dreams.uk> Date: Sun Jan 15 17:59:32 2023 +0000 add language input commit 236bc2c762 Merge: f288d0c2 e9f47509 Author: floatingghost <hannah@coffee-and-dreams.uk> Date: Mon Jan 9 22:20:31 2023 +0000 Merge pull request 'Only show "keep open" emoji checkbox on post form' (#269) from sfr/pleroma-fe:fix/keepopen into develop Reviewed-on: AkkomaGang/akkoma-fe#269 commit e9f47509ae Author: Sol Fisher Romanoff <sol@solfisher.com> Date: Tue Jan 3 16:04:26 2023 +0200 Only show "keep open" emoji checkbox on post form commit f288d0c219 Author: FloatingGhost <hannah@coffee-and-dreams.uk> Date: Mon Jan 2 15:16:42 2023 +0000 Make everything work with a strict CSP commit d973396c96 Author: FloatingGhost <hannah@coffee-and-dreams.uk> Date: Sun Jan 1 21:06:02 2023 +0000 Remove console.log commit 62287fffae Author: FloatingGhost <hannah@coffee-and-dreams.uk> Date: Sun Jan 1 21:05:25 2023 +0000 add follow/unfollow to followed tags list commit e9f16af82d Author: FloatingGhost <hannah@coffee-and-dreams.uk> Date: Sun Jan 1 20:11:07 2023 +0000 Add list of followed hashtags to profile commit dfba8be134 Author: floatingghost <hannah@coffee-and-dreams.uk> Date: Fri Dec 30 05:03:25 2022 +0000 Fall back to nsfw image if no blurhash commit 313ddcebcb Author: FloatingGhost <hannah@coffee-and-dreams.uk> Date: Fri Dec 30 04:57:23 2022 +0000 Add blurhash support commit 236b19e854 Merge: ea941d7c 2e5001e5 Author: FloatingGhost <hannah@coffee-and-dreams.uk> Date: Fri Dec 30 03:20:30 2022 +0000 Merge branch 'develop' of akkoma.dev:AkkomaGang/akkoma-fe into develop commit ea941d7cfa Author: FloatingGhost <hannah@coffee-and-dreams.uk> Date: Fri Dec 30 03:20:12 2022 +0000 remove IHBA assets commit 2e5001e5de Author: Beefox <bee@beefox.xyz> Date: Fri Dec 30 03:04:15 2022 +0000 Allow follow(er) lists to be acessible by account owner even if follower counts are disabled (#246) Currently, if a user has their follower/follow counts hidden, they cannot access their own list of followers/follows. This makes no real sense and means that they cannot modify those lists without disabling their privacy options. This fix simply allows those tabs to be accessed no matter if the counts are hidden or not. Reviewed-on: AkkomaGang/akkoma-fe#246 Co-authored-by: Beefox <bee@beefox.xyz> Co-committed-by: Beefox <bee@beefox.xyz> commit 014f8b0dd2 Author: Norm <normandy@biribiri.dev> Date: Fri Dec 30 03:01:17 2022 +0000 Make minimum width for 3-column layout 1280px (#255) (#256) 1280px is a pretty common screen width for several resolutions (1280x720, 1280x800, 1280x1024, etc.). Since it is only 20px less than the current 1300px minimum, this shouldn't be a big issue to lower the minimum screen width for the 3-column layout to 1280px. Closes: AkkomaGang/pleroma-fe#255 Co-authored-by: Francis Dinh <normandy@biribiri.dev> Reviewed-on: AkkomaGang/akkoma-fe#256 Co-authored-by: Norm <normandy@biribiri.dev> Co-committed-by: Norm <normandy@biribiri.dev> commit dd403b295f Merge: f668455d 9cd62fe0 Author: floatingghost <hannah@coffee-and-dreams.uk> Date: Fri Dec 30 03:00:49 2022 +0000 Merge pull request 'Remove stray debug log' (#265) from sfr/pleroma-fe:del-log into develop Reviewed-on: AkkomaGang/akkoma-fe#265 commit 9cd62fe08d Author: Sol Fisher Romanoff <sol@solfisher.com> Date: Fri Dec 30 01:03:31 2022 +0200 Remove stray debug log commit f668455dff Merge: 5a431538 da491f32 Author: FloatingGhost <hannah@coffee-and-dreams.uk> Date: Thu Dec 29 20:56:22 2022 +0000 Merge branch 'link-verification' into develop commit 5a4315384e Author: FloatingGhost <hannah@coffee-and-dreams.uk> Date: Thu Dec 29 15:25:03 2022 +0000 force CI build commit 401dfa8fa6 Author: FloatingGhost <hannah@coffee-and-dreams.uk> Date: Thu Dec 29 15:22:06 2022 +0000 update readme commit bb243168b3 Author: FloatingGhost <hannah@coffee-and-dreams.uk> Date: Thu Dec 29 15:18:13 2022 +0000 Revert "Merge pull request 'Don't show timeline links if disabled and logged out' (#250) from sfr/pleroma-fe:fix/hide-timelines into develop" This reverts commit 0b5793c1e0, reversing changes made to 72ef2e7454. commit da491f3278 Author: FloatingGhost <hannah@coffee-and-dreams.uk> Date: Thu Dec 29 15:17:35 2022 +0000 add verification of links commit d00e28d5e9 Author: FloatingGhost <hannah@coffee-and-dreams.uk> Date: Thu Dec 22 05:43:01 2022 +0000 fix emoji picker in replies in notifications commit 7ff17ab722 Author: FloatingGhost <hannah@coffee-and-dreams.uk> Date: Tue Dec 20 13:20:13 2022 +0000 don't crash out if notification status is null commit b009428814 Merge: 7bec96a1 c39332c1 Author: floatingghost <hannah@coffee-and-dreams.uk> Date: Wed Dec 14 12:09:03 2022 +0000 Merge pull request 'Revert "Revert "use v1 urls""' (#254) from v1-urls into develop Reviewed-on: AkkomaGang/pleroma-fe#254 commit 7bec96a1bf Merge: 0b5793c1 830e8fdb Author: floatingghost <hannah@coffee-and-dreams.uk> Date: Wed Dec 14 12:08:27 2022 +0000 Merge pull request 'Fix user moderation dropdown clipping' (#249) from sfr/pleroma-fe:fix/dropdown into develop Reviewed-on: AkkomaGang/pleroma-fe#249 commit 0b5793c1e0 Merge: 72ef2e74 6e1ba218 Author: floatingghost <hannah@coffee-and-dreams.uk> Date: Wed Dec 14 12:08:08 2022 +0000 Merge pull request 'Don't show timeline links if disabled and logged out' (#250) from sfr/pleroma-fe:fix/hide-timelines into develop Reviewed-on: AkkomaGang/pleroma-fe#250 commit 72ef2e7454 Merge: 8c6cf86d 413acbc7 Author: floatingghost <hannah@coffee-and-dreams.uk> Date: Wed Dec 14 12:07:27 2022 +0000 Merge pull request 'Fix 404 when reacting with Keycap Number Sign' (#252) from fef/pleroma-fe:develop into develop Reviewed-on: AkkomaGang/pleroma-fe#252 commit c39332c1bf Author: FloatingGhost <hannah@coffee-and-dreams.uk> Date: Wed Dec 14 09:39:01 2022 +0000 Revert "Revert "use v1 urls"" This reverts commit 8c6cf86de3. commit 8c6cf86de3 Author: FloatingGhost <hannah@coffee-and-dreams.uk> Date: Wed Dec 14 09:38:46 2022 +0000 Revert "use v1 urls" This reverts commit 909271c764. commit 909271c764 Author: FloatingGhost <hannah@coffee-and-dreams.uk> Date: Wed Dec 14 09:38:07 2022 +0000 use v1 urls commit 413acbc7dd Author: fef <owo@fef.moe> Date: Mon Dec 12 18:59:57 2022 +0100 fix 404 when reacting with Keycap Number Sign The Unicode sequence for the Keycap Number Sign emoji starts with an ASCII "#" character, which the browser's URL parser will interpret as a URI fragment and truncate it before sending the request to the backend. commit 6e1ba218df Author: Sol Fisher Romanoff <sol@solfisher.com> Date: Sat Dec 10 21:17:41 2022 +0200 Don't show timeline links if disabled and logged out commit 830e8fdb45 Author: Sol Fisher Romanoff <sol@solfisher.com> Date: Sat Dec 10 21:03:12 2022 +0200 Fix user moderation dropdown clipping commit 9c9b4cc07c018a21c8261dd7680a97aa3a670756 Merge: 2c9b7364 9bf310d5 Author: FloatingGhost <hannah@coffee-and-dreams.uk> Date: Sat Dec 10 14:52:00 2022 +0000 Merge branch 'develop' into stable commit 9bf310d509 Author: FloatingGhost <hannah@coffee-and-dreams.uk> Date: Sat Dec 10 14:51:08 2022 +0000 bump version commit e3e8b19df3 Author: FloatingGhost <hannah@coffee-and-dreams.uk> Date: Sat Dec 10 00:17:33 2022 +0000 fix ES translation having weird o in a key commit e86c7abb39 Merge: 8a0da886 b33d15a7 Author: Weblate <noreply@weblate.org> Date: Thu Dec 8 18:41:37 2022 +0000 Merge branch 'origin/develop' into Weblate. commit 8a0da8861d Merge: 40e86998 6c7e691a Author: floatingghost <hannah@coffee-and-dreams.uk> Date: Thu Dec 8 18:41:36 2022 +0000 Merge pull request 'Add YAML bug and feat templates' (#247) from sfr/pleroma-fe:issue-template into develop Reviewed-on: AkkomaGang/pleroma-fe#247 commit 6c7e691aea Author: Sol Fisher Romanoff <sol@solfisher.com> Date: Thu Dec 8 20:24:21 2022 +0200 Add YAML bug and feat templates commit b33d15a739 Merge: 40e86998 177f3440 Author: Weblate <noreply@weblate.org> Date: Wed Dec 7 22:37:54 2022 +0000 Merge branch 'origin/develop' into Weblate. commit 40e86998e6 Author: floatingghost <hannah@coffee-and-dreams.uk> Date: Wed Dec 7 22:37:52 2022 +0000 Update 'ISSUE_TEMPLATE.md' commit 177f344033 Merge: 9079ac4a dfc4e0a0 Author: Weblate <noreply@weblate.org> Date: Wed Dec 7 22:32:07 2022 +0000 Merge branch 'origin/develop' into Weblate. commit 9079ac4afa Author: floatingghost <hannah@coffee-and-dreams.uk> Date: Wed Dec 7 22:31:49 2022 +0000 Update 'ISSUE_TEMPLATE.md' commit dfc4e0a026 Author: Weblate <noreply@weblate.org> Date: Wed Dec 7 22:31:39 2022 +0000 Translated using Weblate (Japanese (ja_PEDANTIC)) Currently translated at 99.8% (1031 of 1033 strings) Co-authored-by: Weblate Admin <hannah.ward9001@gmail.com> Translate-URL: http://translate.akkoma.dev/projects/akkoma/pleroma-fe/ja_PEDANTIC/ Translation: Pleroma fe/pleroma-fe commit 3d732d1d28 Author: Weblate <noreply@weblate.org> Date: Wed Dec 7 22:31:39 2022 +0000 Translated using Weblate (Indonesian) Currently translated at 59.4% (614 of 1033 strings) Translated using Weblate (Indonesian) Currently translated at 53.0% (548 of 1033 strings) Co-authored-by: Weblate <noreply@weblate.org> Co-authored-by: t1 <taaa@fedora.email> Translate-URL: http://translate.akkoma.dev/projects/akkoma/pleroma-fe/id/ Translation: Pleroma fe/pleroma-fe commit e8ee31afed Author: Weblate <noreply@weblate.org> Date: Wed Dec 7 22:31:39 2022 +0000 Translated using Weblate (English) Currently translated at 100.0% (1033 of 1033 strings) Co-authored-by: Weblate Admin <hannah.ward9001@gmail.com> Translate-URL: http://translate.akkoma.dev/projects/akkoma/pleroma-fe/en/ Translation: Pleroma fe/pleroma-fe commit d9d6b1e80b Author: Weblate <noreply@weblate.org> Date: Wed Dec 7 22:31:39 2022 +0000 Translated using Weblate (Spanish) Currently translated at 89.2% (918 of 1029 strings) Co-authored-by: Weblate <noreply@weblate.org> Co-authored-by: taretka <info@tarteka.net> Translate-URL: http://translate.akkoma.dev/projects/akkoma/pleroma-fe/es/ Translation: Pleroma fe/pleroma-fe commit 1dd7a89544 Author: Weblate <noreply@weblate.org> Date: Wed Dec 7 22:31:38 2022 +0000 Translated using Weblate (German) Currently translated at 93.9% (967 of 1029 strings) Co-authored-by: Johann <johann@qwertqwefsday.eu> Co-authored-by: Weblate <noreply@weblate.org> Translate-URL: http://translate.akkoma.dev/projects/akkoma/pleroma-fe/de/ Translation: Pleroma fe/pleroma-fe commit d3280c4ab3 Author: floatingghost <hannah@coffee-and-dreams.uk> Date: Wed Dec 7 22:31:29 2022 +0000 Add issue template commit abc75c360b Author: FloatingGhost <hannah@coffee-and-dreams.uk> Date: Wed Dec 7 11:01:58 2022 +0000 Ensure only content gets clipped commit a8e119b0f1 Merge: 17e574b1 71d2e0b0 Author: FloatingGhost <hannah@coffee-and-dreams.uk> Date: Tue Dec 6 15:56:06 2022 +0000 Merge branch 'develop' of akkoma.dev:AkkomaGang/pleroma-fe into develop commit 17e574b173 Author: FloatingGhost <hannah@coffee-and-dreams.uk> Date: Tue Dec 6 15:55:39 2022 +0000 Move theme apply/reset to new row Fixes #225 commit 71d2e0b0ce Merge: b68e968b 337a30fe Author: floatingghost <hannah@coffee-and-dreams.uk> Date: Tue Dec 6 15:32:40 2022 +0000 Merge pull request 'fix scope selector icon spacing' (#243) from nocebo/crt-fe:shared/fix-scope-spacing into develop Reviewed-on: AkkomaGang/pleroma-fe#243 commit b68e968bf9 Author: FloatingGhost <hannah@coffee-and-dreams.uk> Date: Tue Dec 6 15:26:16 2022 +0000 Add ability to include custom CSS commit eb49295422 Author: floatingghost <hannah@coffee-and-dreams.uk> Date: Sun Dec 4 17:31:41 2022 +0000 Add hashtag following button (#244) Co-authored-by: FloatingGhost <hannah@coffee-and-dreams.uk> Reviewed-on: AkkomaGang/pleroma-fe#244 commit 337a30fe01 Author: astra akari <nocebo@noreply.akkoma> Date: Sat Dec 3 07:12:55 2022 +0000 remove whitespace between scope selector icons when i originally wrote this, for reasons unclear to the present me, i used literal whitespaces to space out the icons on the scope selector this causes strange inconsistencies in spacing depending on the font being used akkoma also did not include the whitespace when adding the local-only scope, resulting in even weirder spacing this corrects all of that by removing the whitespaces and using css instead commit 105ecd3836 Merge: b86f12ce a3e490ed Author: floatingghost <hannah@coffee-and-dreams.uk> Date: Fri Dec 2 12:01:43 2022 +0000 Merge pull request 'pwa config' (#242) from pwa into develop Reviewed-on: AkkomaGang/pleroma-fe#242 commit a3e490edcd Author: FloatingGhost <hannah@coffee-and-dreams.uk> Date: Fri Dec 2 12:00:30 2022 +0000 use cutout of 512 logo commit f8f5e1c89b Author: FloatingGhost <hannah@coffee-and-dreams.uk> Date: Fri Dec 2 11:57:45 2022 +0000 fix SW path commit e132814478 Author: FloatingGhost <hannah@coffee-and-dreams.uk> Date: Fri Dec 2 11:56:15 2022 +0000 Register serviceworker commit 6af1df8bef Author: FloatingGhost <hannah@coffee-and-dreams.uk> Date: Fri Dec 2 11:27:24 2022 +0000 Add logo files commit b86f12cede Merge: 0900a9d8 c6697017 Author: floatingghost <hannah@coffee-and-dreams.uk> Date: Fri Dec 2 10:21:32 2022 +0000 Merge pull request 'Add a small margin to search bar' (#240) from karl/pleroma-fe:search-bar-margin into develop Reviewed-on: AkkomaGang/pleroma-fe#240 commit c669701762 Author: Karl Prieb <karl@prieb.me> Date: Tue Nov 29 18:04:33 2022 -0300 add a left margin on search bar commit 0900a9d87b Merge: 7860c885 0a01a2bd Author: floatingghost <hannah@coffee-and-dreams.uk> Date: Mon Nov 28 13:35:08 2022 +0000 Merge pull request 'Add post expiry inputs' (#239) from default-post-expiry into develop Reviewed-on: AkkomaGang/pleroma-fe#239 commit 0a01a2bdf0 Author: FloatingGhost <hannah@coffee-and-dreams.uk> Date: Mon Nov 28 12:08:18 2022 +0000 Add post expiry inputs commit 7860c885c4 Author: darkkirb <lotte@chir.rs> Date: Sat Nov 26 20:57:04 2022 +0000 Add link to RSS feed to the profile (#234) Today I learned that akkoma and mastodon (and potentially other activitypub services) offer RSS/Atom feeds for user profiles at `[user profile url].rss`. This PR adds a direct link to the feed because I haven’t seen anything link to the feed on either mastodon-fe or pleroma-fe Co-authored-by: Charlotte 🦝 Delenk <lotte@chir.rs> Reviewed-on: AkkomaGang/pleroma-fe#234 Co-authored-by: darkkirb <lotte@chir.rs> Co-committed-by: darkkirb <lotte@chir.rs> commit 1c3bd60af2 Merge: c01c62f1 b8faee5d Author: floatingghost <hannah@coffee-and-dreams.uk> Date: Sat Nov 26 18:32:35 2022 +0000 Merge pull request 'fix formatting for large number of favorites/interactions' (#236) from drudge/pleroma-fe:develop into develop Reviewed-on: AkkomaGang/pleroma-fe#236 commit b8faee5d6d Author: Sean Meininger <sean.meininger@pm.me> Date: Sat Nov 26 00:15:12 2022 -0800 added maintainer code commit c01c62f149 Author: floatingghost <hannah@coffee-and-dreams.uk> Date: Tue Nov 22 14:44:44 2022 +0000 Redirect users to "awaiting approval" message on register (#231) Ref #81 - this implements a "your request has been sent" message ![image](/attachments/61dc3f5e-2706-46f9-a1ca-4efe3f526ff3) Co-authored-by: FloatingGhost <hannah@coffee-and-dreams.uk> Reviewed-on: AkkomaGang/pleroma-fe#231 commit 105b934f90 Author: floatingghost <hannah@coffee-and-dreams.uk> Date: Tue Nov 22 14:40:25 2022 +0000 Only reload user if it _is_ a user (#232) Ref #181 Co-authored-by: FloatingGhost <hannah@coffee-and-dreams.uk> Reviewed-on: AkkomaGang/pleroma-fe#232 commit b1f41add0e Author: FloatingGhost <hannah@coffee-and-dreams.uk> Date: Mon Nov 21 17:08:53 2022 +0000 Don't error out if we can't fetch reports commit e4e8ed812b Merge: 684894ae e06348ee Author: floatingghost <hannah@coffee-and-dreams.uk> Date: Mon Nov 21 16:51:30 2022 +0000 Merge pull request 'Allow using mouse wheel to navigate through the emoji tabs (#179)' (#222) from Mergan/pleroma-fe:emoji-picker-allow-scroll into develop Reviewed-on: AkkomaGang/pleroma-fe#222 commit 684894aee3 Author: Beefox <bee@beefox.xyz> Date: Mon Nov 21 16:49:18 2022 +0000 mobile-newline (#226) Allows the handle of users to drop down onto the next line if there isn't enough room in order to improve useability on mobile Reviewed-on: AkkomaGang/pleroma-fe#226 Co-authored-by: Beefox <bee@beefox.xyz> Co-committed-by: Beefox <bee@beefox.xyz> commit f8a796b234 Merge: 70ea9e77 862c9370 Author: floatingghost <hannah@coffee-and-dreams.uk> Date: Mon Nov 21 16:46:29 2022 +0000 Merge pull request 'move domain block to drop down menu (#223)' (#224) from nocebo/crt-fe:shared/move-domain-mute into develop Reviewed-on: AkkomaGang/pleroma-fe#224 commit 70ea9e772c Merge: efe0f537 fcbbbad8 Author: floatingghost <hannah@coffee-and-dreams.uk> Date: Mon Nov 21 10:11:19 2022 +0000 Merge pull request 'Allow for searching unicode emoji via inputting emoji (#163 & #227)' (#230) from Mergan/pleroma-fe:beefox-emoji-search into develop Reviewed-on: AkkomaGang/pleroma-fe#230 commit efe0f53736 Author: Mergan <mergan@noreply.akkoma> Date: Mon Nov 21 10:10:50 2022 +0000 Constrain content to status content (#218) (#220) MFM No longer overflows ![image](/attachments/7bbf519a-9fd2-492d-aba0-9a0e1ded6373) Co-authored-by: David <dmgf2008@hotmail.com> Reviewed-on: AkkomaGang/pleroma-fe#220 Co-authored-by: Mergan <mergan@noreply.akkoma> Co-committed-by: Mergan <mergan@noreply.akkoma> commit fcbbbad8d4 Author: Beefox <bee@beefox.xyz> Date: Sat Sep 10 16:36:12 2022 +1000 Allow for searching unicode emoji via inputting emoji (This is needed for the react menu) commit 39b6b0b49f Merge: 867a86d8 2d4b2f2e Author: FloatingGhost <hannah@coffee-and-dreams.uk> Date: Sun Nov 20 22:26:32 2022 +0000 Merge remote-tracking branch 'origin/translations' into develop commit 867a86d887 Author: FloatingGhost <hannah@coffee-and-dreams.uk> Date: Sun Nov 20 22:26:16 2022 +0000 Fix build commit 7538369fa1 Author: FloatingGhost <hannah@coffee-and-dreams.uk> Date: Sun Nov 20 22:18:34 2022 +0000 Copy conversation display style from instance Fixes #210 commit 2d4b2f2e20 Author: Weblate <noreply@weblate.org> Date: Sat Nov 19 21:22:45 2022 +0000 Translated using Weblate (Spanish) Currently translated at 87.1% (893 of 1025 strings) Co-authored-by: taretka <info@tarteka.net> Translate-URL: http://translate.akkoma.dev/projects/akkoma/pleroma-fe/es/ Translation: Pleroma fe/pleroma-fe commit 862c93706c Author: astra <nocebo@cathoderay.tube> Date: Fri Nov 18 08:49:57 2022 -0500 move domain block to drop down menu commit e06348ee33 Author: David <dmgf2008@hotmail.com> Date: Thu Nov 17 14:45:32 2022 -0800 Allow using mouse wheel to navigate through the emoji tabs
Bruh I forgot the custom.css elements
2024-05-16 00:35:53 +02:00 · 2023-05-09 19:41:36 +02:00 · 2023-05-09 19:11:12 +02:00 · 2023-05-09 19:11:12 +02:00 · 2023-05-09 19:11:12 +02:00 · 2023-05-09 19:11:12 +02:00
361 changed files with 39592 additions and 31356 deletions
--- a/.eslintrc.js
+++ b/.eslintrc.js
@ -1,17 +1,17 @@
 module.exports = {
  root: true,
  parserOptions: {
-    parser: 'babel-eslint',
+    parser: '@babel/eslint-parser',
    sourceType: 'module'
  },
  // https://github.com/feross/standard/blob/master/RULES.md#javascript-standard-style
  extends: [
-    'standard',
    'plugin:vue/recommended'
  ],
  // required to lint *.vue files
  plugins: [
-    'vue'
+    'vue',
+    'import'
  ],
  // add your custom rules here
  rules: {
@ -23,6 +23,8 @@ module.exports = {
    'no-debugger': process.env.NODE_ENV === 'production' ? 2 : 0,
    'vue/require-prop-types': 0,
    'vue/no-unused-vars': 0,
-    'no-tabs': 0
+    'no-tabs': 0,
+    'vue/multi-word-component-names': 0,
+    'vue/no-reserved-component-names': 0
  }
 }
--- a/.gitea/issue_template/bug.yml
+++ b/.gitea/issue_template/bug.yml
@ -0,0 +1,49 @@
+name: "Bug report"
+about: "Something isn't working as expected"
+title: "[bug] "
+body:
+  - type: markdown
+    attributes:
+      value: "Thanks for taking the time to file this bug report! Please try to be as specific and detailed as you can, so we can track down the issue and fix it as soon as possible."
+  - type: input
+    id: version
+    attributes:
+      label: "Version"
+      description: "Which version of pleroma-fe are you running? If running develop, specify the commit hash."
+      placeholder: "e.g. 2022.11, 40e86998e6"
+  - type: textarea
+    id: attempt
+    attributes:
+      label: "What were you trying to do?"
+      validations:
+        required: true
+  - type: textarea
+    id: expectation
+    attributes:
+      label: "What did you expect to happen?"
+      validations:
+        required: true
+  - type: textarea
+    id: reality
+    attributes:
+      label: "What actually happened?"
+      validations:
+        required: true
+  - type: dropdown
+    id: severity
+    attributes:
+      label: "Severity"
+      description: "Does this issue prevent you from using the software as normal?"
+      options:
+        - "I cannot use the software"
+        - "I cannot use it as easily as I'd like"
+        - "I can manage"
+      validations:
+        required: true
+  - type: checkboxes
+    id: searched
+    attributes:
+      label: "Have you searched for this issue?"
+      description: "Please double-check that your issue is not already being tracked on [the forums](https://meta.akkoma.dev) or [the issue tracker](https://akkoma.dev/AkkomaGang/pleroma-fe/issues)."
+      options:
+        - label: "I have double-checked and have not found this issue mentioned anywhere."
--- a/.gitea/issue_template/feat.yml
+++ b/.gitea/issue_template/feat.yml
@ -0,0 +1,29 @@
+name: "Feature request"
+about: "I'd like something to be added to pleroma-fe"
+title: "[feat] "
+body:
+  - type: markdown
+    attributes:
+      value: "Thanks for taking the time to request a new feature! Please be as concise and clear as you can in your proposal, so we could understand what you're going for."
+  - type: textarea
+    id: idea
+    attributes:
+      label: "The idea"
+      description: "What do you think you should be able to do in pleroma-fe?"
+      validations:
+        required: true
+  - type: textarea
+    id: reason
+    attributes:
+      label: "The reasoning"
+      description: "Why would this be a worthwhile feature? Does it solve any problems? Have people talked about wanting it?"
+      validations:
+        required: true
+  - type: checkboxes
+    id: searched
+    attributes:
+      label: "Have you searched for this feature request?"
+      description: "Please double-check that your issue is not already being tracked on [the forums](https://meta.akkoma.dev), [the issue tracker](https://akkoma.dev/AkkomaGang/pleroma-fe/issues), or the one for [the backend](https://akkoma.dev/AkkomaGang/akkoma/issues)."
+      options:
+        - label: "I have double-checked and have not found this feature request mentioned anywhere."
+        - label: "This feature is related to the pleroma-fe Akkoma frontend specifically, and not the backend."
--- a/.gitignore
+++ b/.gitignore
@ -8,3 +8,5 @@ selenium-debug.log
 .idea/
 config/local.json
 config/local.*.json
+docs/site/
+.vscode/
--- a/.gitlab-ci.yml
+++ b/.gitlab-ci.yml
@ -1,47 +0,0 @@
-# This file is a template, and might need editing before it works on your project.
-# Official framework image. Look for the different tagged releases at:
-# https://hub.docker.com/r/library/node/tags/
-image: node:12
-
-stages:
-  - lint
-  - build
-  - test
-  - deploy
-
-lint:
-  stage: lint
-  script:
-    - yarn
-    - npm run lint
-    - npm run stylelint
-
-test:
-  stage: test
-  variables:
-    APT_CACHE_DIR: apt-cache
-  script:
-    - mkdir -pv $APT_CACHE_DIR && apt-get -qq update
-    - apt install firefox-esr -y --no-install-recommends
-    - firefox --version
-    - yarn
-    - yarn unit
-
-build:
-  stage: build
-  script:
-    - yarn
-    - npm run build
-  artifacts:
-    paths:
-    - dist/
-
-docs-deploy:
-  stage: deploy
-  image: alpine:latest
-  only:
-  - develop@pleroma/pleroma-fe
-  before_script:
-  - apk add curl
-  script:
-  - curl -X POST -F"token=$DOCS_PIPELINE_TRIGGER" -F'ref=master' https://git.pleroma.social/api/v4/projects/673/trigger/pipeline
--- a/.stylelintrc.json
+++ b/.stylelintrc.json
@ -1,19 +1,13 @@
 {
  "extends": [
-    "stylelint-rscss/config",
+    "stylelint-config-recommended-vue/scss",
    "stylelint-config-recommended",
    "stylelint-config-standard"
  ],
+  "customSyntax": "postcss-scss",
  "rules": {
    "declaration-no-important": true,
-    "rscss/no-descendant-combinator": false,
-    "rscss/class-format": [
-      true,
-      {
-        "component": "pascal-case",
-        "variant": "^-[a-z]\\w+",
-        "element": "^[a-z]\\w+"
-      }
-    ]
+    "selector-class-pattern": null,
+    "custom-property-pattern": null
  }
 }
--- a/.woodpecker.yml
+++ b/.woodpecker.yml
@ -1,21 +1,20 @@
+platform: linux/amd64
 pipeline:
  lint:
    when:
      event:
-      - push
      - pull_request
-    image: node:16
+    image: node:18
    commands:
    - yarn
    - yarn lint
-    - yarn stylelint
+    #- yarn stylelint

  test:
    when:
      event:
-      - push
      - pull_request
-    image: node:16
+    image: node:18
    commands:
    - apt update
    - apt install firefox-esr -y --no-install-recommends
@ -25,8 +24,11 @@ pipeline:
  build:
    when:
      event:
-      - tag
-    image: node:16
+      - push
+      branch:
+      - develop
+      - stable
+    image: node:18
    commands:
    - yarn
    - yarn build
@ -34,8 +36,11 @@ pipeline:
  release:
    when:
      event:
-      - tag
-    image: node:16
+      - push
+      branch:
+      - develop
+      - stable
+    image: node:18
    secrets:
    - SCW_ACCESS_KEY
    - SCW_SECRET_KEY
@ -47,4 +52,31 @@ pipeline:
      - chmod +x scaleway-cli
      - ./scaleway-cli object config install type=rclone
      - zip akkoma-fe.zip -r dist
-      - rclone copyto akkoma-fe.zip scaleway:akkoma-updates/frontend/akkoma-fe.zip
+      - rclone copyto akkoma-fe.zip scaleway:akkoma-updates/frontend/$CI_COMMIT_BRANCH/akkoma-fe.zip
+
+  docs:
+    when:
+      event:
+      - push
+      branch:
+      - develop
+      - stable
+    environment:
+      CI: "true"
+    image: python:3.10-slim
+    secrets:
+    - SCW_ACCESS_KEY
+    - SCW_SECRET_KEY
+    - 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
+    - chmod +x scaleway-cli
+    - ./scaleway-cli object config install type=rclone
+    - cd docs
+    - pip install -r requirements.txt
+    - mkdocs build
+    - zip -r docs.zip site/*
+    - cd site
+    - rclone copy . scaleway:akkoma-docs/frontend/$CI_COMMIT_BRANCH/
--- a/CHANGELOG.md
+++ b/CHANGELOG.md
@ -4,6 +4,33 @@ All notable changes to this project will be documented in this file.
 The format is based on [Keep a Changelog](https://keepachangelog.com/en/1.0.0/).

 ## Unreleased
+### Added
+- Implemented remote interaction with statuses
+
+
+## 2022.09 - 2022-09-10
+### Added
+- Automatic post translations. Must be configured on the backend in order to work.
+- Post editing, including a log of previous edits.
+
+### Changed
+- Top bar now has navigation shortcuts. Can be enabled or disabled by admins or users.
+- Optional replacement of timeline drop-down with navigation buttons. Also configurable.
+- Posts and posts with replies are now separated on user profiles.
+- Custom emoji from remote instances on a post can now also be used.
+
+## 2022.08 - 2022-08-12
+### Added
+- Ability to quote public and unlisted posts
+- Bubble timeline
+
+### Changed
+- Emoji in emoji picker is separated by packs
+
+### Removed
+- Chats, they were half-baked. Just use PMs.
+
+## 2022.07 - 2022-07-16
 ### Fixed
 - AdminFE button no longer scrolls page to top when clicked
 - Pinned statuses no longer appear at bottom of user timeline (still appear as part of the timeline when fetched deep enough)
@ -16,6 +43,8 @@ The format is based on [Keep a Changelog](https://keepachangelog.com/en/1.0.0/).
 - Attachments are ALWAYS in same order as user uploaded, no more "videos first"
 - Attachment description is prefilled with backend-provided default when uploading
 - Proper visual feedback that next image is loading when browsing
+- Misskey-Flavoured Markdown support
+- Custom emoji reactions

 ### Changed
 - (You)s are optional (opt-in) now, bolding your nickname is also optional (opt-out)
@ -37,6 +66,7 @@ The format is based on [Keep a Changelog](https://keepachangelog.com/en/1.0.0/).
 - Media modal now also displays description and counter position in gallery (i.e. 1/5)
 - Ability to rearrange order of attachments when uploading
 - Enabled users to zoom and pan images in media viewer with mouse and touch
+- Added frontend ui for account migration


 ## [2.4.2] - 2022-01-09
--- a/CODE_OF_CONDUCT.md
+++ b/CODE_OF_CONDUCT.md
@ -0,0 +1,24 @@
+# Akkoma Code of Conduct
+
+The Akkoma project aims to be **enjoyable** for anyone to participate in, regardless of their identity or level of expertise. To achieve this, the community must create an environment which is **safe** and **equitable**; the following guidelines have been created with these goals in mind.
+
+1. **Treat individuals with respect.** Differing experiences and viewpoints deserve to be respected, and bigotry and harassment are not tolerated under any circumstances.
+    - Individuals should at all times be treated as equals, regardless of their age, gender, sexuality, race, ethnicity, _or any other characteristic_, intrinsic or otherwise.
+    - Behaviour that is harmful in nature should be addressed and corrected *regardless of intent*.
+    - Respect personal boundaries and ask for clarification whenever they are unclear.
+    - (Obviously, hate does not count as merely a "differing viewpoint", because it is harmful in nature.)
+
+2. **Be understanding of differences in communication.** Not everyone is aware of unspoken social cues, and speech that is not intended to be offensive should not be treated as such simply due to an atypical manner of communication.
+    - Somebody who speaks bluntly is not necessarily rude, and somebody who swears a lot is not necessarily volatile.
+    - Try to confirm your interpretation of their intent rather than assuming bad faith.
+    - Someone may not communicate as, or come across as a picture of "professionalism", but this should not be seen as a reason to dismiss them. This is a **casual** space, and communication styles can reflect that.
+
+3. **"Uncomfortable" does not mean "unsafe".** In an ideal world, the community would be safe, equitable, enjoyable, *and* comfortable for all members at all times. Unfortunately, this is not always possible in reality.
+    - Safety and equity will be prioritized over comfort whenever it is necessary to do so.
+    - Weaponizing one's own discomfort to deflect accountability or censor an individual (e.g. "white fragility") is a form of discriminatory conduct.
+
+4. **Let people grow from their mistakes.** Nobody is perfect; even the most well-meaning individual can do something hurtful. Everyone should be given a fair opportunity to explain themselves and correct their behaviour. Portraying someone as inherently malicious prevents improvement and shifts focus away from the *action* that was problematic.
+    - Avoid bringing up past events that do not accurately reflect an individual's current actions or beliefs. (This is, of course, different from providing evidence of a recurring pattern of behaviour.)
+
+---
+This document was adapted from one created by ~keith as part of punks default repository template, and is licensed under CC-BY-SA 4.0. The original template is here: <https://bytes.keithhacks.cyou/keith/default-template>
--- a/COFE_OF_CONDUCT.md
+++ b/COFE_OF_CONDUCT.md
@ -1,49 +0,0 @@
-```
-                                    o$$$$$$oo
-                                 o$"        "$oo
-                                 $   o""""$o  "$o
-                                "$  o  "o  "o   $
-                                "$   $o $   $   o$
-                                 "$       o$"$  o$
-                                  "$ooooo$$  $  o$
-                        o$ """ $     " $$$   "  $
-                      o$        $o    $$"   "   "
-                     $$  $ " $   $$$o"$    o  o$"
-                     $"  o "" $   $" "   o"  $$
-                     $o  " "  $  o$"   o"  o$"
-                      "$o    $$  $   o"  o$$"
-                       ""o$o"$"  $oo"  o$"
-                        o$$ $   $$$  o$$
-                        o" o oo""  "" "$o
-                       o$o" ""          $
-                      $" " o"   " " "   "o
-                     $$ "  "  o$ o$o "   $
-                    o$ $  $  o$$ "  "   ""
-                    o  $ $"  " "o      o$
-                    $ o         $o$oo$""
-                   $o $   o  o  o"$$
-                   $o  o  $  $    "$o
-                   $o  $   o  $  $ "o
-                    $  $   "o  $  "o"$o
-                    $   "   o   $   o $$
-            $o$o$o$o$$o$$$o$$o$o$$o$$o$$$o$o$o$o$o$o$o$o$o$ooo
-            $$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$o
-            $$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$   " $$$$$
-            $$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$      "$$$$
-            $$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$       $$$$
-            $$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$       $$$$
-            $$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$       $$$$
-            $$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$     o$$$$"
-            $$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$ooooo$$$$
-            $$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$"
-            $$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$"""""
-            $$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$
-            $$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$
-            $$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$
-            $$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$
-            $$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$"
-"$o$o$o$o$o$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$"
-  "$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$"
-    "$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$"""
-       """""""""""""""""""""""""""""""""""""""""""""""""""""
-```
--- a/CONTRIBUTORS.md
+++ b/CONTRIBUTORS.md
@ -10,3 +10,5 @@ Contributors of this project.
 - shpuld (shpuld@shitposter.club): CSS and styling
 - Vincent Guth (https://unsplash.com/photos/XrwVIFy6rTw): Background images.
 - hj (hj@shigusegubu.club): Code
+- Sean King (seanking@freespeechextremist.com): Code
+- Tusooa Zhu (tusooa@kazv.moe): Code
--- a/README.md
+++ b/README.md
@ -1,22 +1,30 @@
-# Pleroma-FE 
+# Akkoma-FE

-> A single column frontend designed for Pleroma.
+![English OK](https://img.shields.io/badge/English-OK-blueviolet) ![日本語OK](https://img.shields.io/badge/%E6%97%A5%E6%9C%AC%E8%AA%9E-OK-blueviolet)

-![screenshot](/uploads/796c5ecf985ed1e2b0943ee0df131ed0/DJVqSJ0.png)
+This is a fork of Akkoma-FE from the Pleroma project, with support for new Akkoma features such as:
+- MFM support via [marked-mfm](https://akkoma.dev/sfr/marked-mfm)
+- Custom emoji reactions
+
+And specificly, this is a tweaked version with all the hyena.network themes and tweaks in place

 # For Translators

-To translate Pleroma-FE, add your language to [src/i18n/messages.js](https://git.pleroma.social/pleroma/pleroma-fe/blob/develop/src/i18n/messages.js). Pleroma-FE will set your language by your browser locale, but you can temporarily force it in the code by changing the locale in main.js.
+The [Weblate UI](https://translate.akkoma.dev/projects/akkoma/pleroma-fe/) is recommended for adding or modifying translations for Akkoma-FE.
+
+Alternatively, edit/create `src/i18n/$LANGUAGE_CODE.json` (where `$LANGUAGE_CODE` is the [ISO 639-1 code](https://en.wikipedia.org/wiki/List_of_ISO_639-1_codes) for your language), then add your language to [src/i18n/messages.js](https://akkoma.dev/AkkomaGang/pleroma-fe/src/branch/develop/src/i18n/messages.js) if it doesn't already exist there.
+
+Akkoma-FE will set your language by your browser locale, but you can temporarily force it in the code by changing the locale in main.js.

 # FOR ADMINS

-You don't need to build Pleroma-FE yourself. Those using the Pleroma backend will be able to use it out of the box.
+To use Akkoma-FE in Akkoma, use the [frontend](https://docs.akkoma.dev/stable/administration/CLI_tasks/frontend/) CLI task to install Akkoma-FE, then modify your configuration as described in the [Frontend Management](https://docs.akkoma.dev/stable/configuration/frontend_management/) doc.

 ## Build Setup

 ``` bash
 # install dependencies
-npm install -g yarn
+corepack enable
 yarn

 # serve with hot reload at localhost:8080
@ -31,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/dev-server.js
+++ b/build/dev-server.js
@ -29,18 +29,6 @@ var devMiddleware = require('webpack-dev-middleware')(compiler, {
 })

 var hotMiddleware = require('webpack-hot-middleware')(compiler)
-// force page reload when html-webpack-plugin template changes
-compiler.plugin('compilation', function (compilation) {
-  compilation.plugin('html-webpack-plugin-after-emit', function (data, cb) {
-    // FIXME: This supposed to reload whole page when index.html is changed,
-    // however now it reloads entire page on every breath, i suppose the order
-    // of plugins changed or something. It's a minor thing and douesn't hurt
-    // disabling it, constant reloads hurt much more
-
-    // hotMiddleware.publish({ action: 'reload' })
-    // cb()
-  })
-})

 // proxy api requests
 Object.keys(proxyTable).forEach(function (context) {
--- a/build/webpack.base.conf.js
+++ b/build/webpack.base.conf.js
@ -2,8 +2,6 @@ var path = require('path')
 var config = require('../config')
 var utils = require('./utils')
 var projectRoot = path.resolve(__dirname, '../')
-var ServiceWorkerWebpackPlugin = require('serviceworker-webpack-plugin')
-var CopyPlugin = require('copy-webpack-plugin');
 var { VueLoaderPlugin } = require('vue-loader')

 var env = process.env.NODE_ENV
@ -20,6 +18,7 @@ module.exports = {
    app: './src/main.js'
  },
  output: {
+    hashFunction: "sha256", // Workaround for builds with OpenSSL 3.
    path: config.build.assetsRoot,
    publicPath: process.env.NODE_ENV === 'production' ? config.build.assetsPublicPath : config.dev.assetsPublicPath,
    filename: '[name].js'
@ -30,10 +29,13 @@ module.exports = {
    }
  },
  resolve: {
-    extensions: ['.js', '.jsx', '.vue'],
+    extensions: ['.js', '.jsx', '.vue', '.mjs'],
    modules: [
      path.join(__dirname, '../node_modules')
    ],
+    fallback: {
+      "url": require.resolve("url/"),
+    },
    alias: {
      'static': path.resolve(__dirname, '../static'),
      'src': path.resolve(__dirname, '../src'),
@ -68,6 +70,11 @@ module.exports = {
          path.resolve(__dirname, '../src/i18n')
        ]
      },
+      {
+          test: /\.mjs$/,
+          include: /node_modules/,
+          type: "javascript/auto"
+      },
      {
        test: /\.vue$/,
        loader: 'vue-loader',
@ -111,23 +118,6 @@ module.exports = {
    ]
  },
  plugins: [
-    new ServiceWorkerWebpackPlugin({
-      entry: path.join(__dirname, '..', 'src/sw.js'),
-      filename: 'sw-pleroma.js'
-    }),
-    new VueLoaderPlugin(),
-    // This copies Ruffle's WASM to a directory so that JS side can access it
-    new CopyPlugin({
-      patterns: [
-        {
-          from: "node_modules/ruffle-mirror/*",
-          to: "static/ruffle",
-          flatten: true
-        },
-      ],
-      options: {
-        concurrency: 100,
-      },
-    })
+    new VueLoaderPlugin()
  ]
 }
--- a/build/webpack.dev.conf.js
+++ b/build/webpack.dev.conf.js
@ -1,6 +1,6 @@
 var config = require('../config')
 var webpack = require('webpack')
-var merge = require('webpack-merge')
+var { merge } = require('webpack-merge')
 var utils = require('./utils')
 var baseWebpackConfig = require('./webpack.base.conf')
 var HtmlWebpackPlugin = require('html-webpack-plugin')
@ -16,7 +16,7 @@ module.exports = merge(baseWebpackConfig, {
  },
  mode: 'development',
  // eval-source-map is faster for development
-  devtool: '#eval-source-map',
+  devtool: 'eval-source-map',
  plugins: [
    new webpack.DefinePlugin({
      'process.env': config.dev.env,
--- a/build/webpack.prod.conf.js
+++ b/build/webpack.prod.conf.js
@ -2,7 +2,8 @@ var path = require('path')
 var config = require('../config')
 var utils = require('./utils')
 var webpack = require('webpack')
-var merge = require('webpack-merge')
+const WorkboxPlugin = require('workbox-webpack-plugin');
+var { merge } = require('webpack-merge')
 var baseWebpackConfig = require('./webpack.base.conf')
 var MiniCssExtractPlugin = require('mini-css-extract-plugin')
 var HtmlWebpackPlugin = require('html-webpack-plugin')
@ -19,7 +20,7 @@ var webpackConfig = merge(baseWebpackConfig, {
  module: {
    rules: utils.styleLoaders({ sourceMap: config.dev.cssSourceMap, extract: true })
  },
-  devtool: config.build.productionSourceMap ? '#source-map' : false,
+  devtool: 'source-map',
  optimization: {
    minimize: true,
    splitChunks: {
@ -32,6 +33,11 @@ var webpackConfig = merge(baseWebpackConfig, {
    chunkFilename: utils.assetsPath('js/[name].[chunkhash].js')
  },
  plugins: [
+    new WorkboxPlugin.InjectManifest({
+      swSrc: path.join(__dirname, '..', 'src/sw.js'),
+      swDest: 'sw-pleroma.js',
+      maximumFileSizeToCacheInBytes: 15 * 1024 * 1024,
+    }),
    // http://vuejs.github.io/vue-loader/workflow/production.html
    new webpack.DefinePlugin({
      'process.env': env,
@ -62,7 +68,7 @@ var webpackConfig = merge(baseWebpackConfig, {
        // https://github.com/kangax/html-minifier#options-quick-reference
      },
      // necessary to consistently work with multiple chunks via CommonsChunkPlugin
-      chunksSortMode: 'dependency'
+      chunksSortMode: 'auto'
    }),
    // split vendor js into its own file
    // extract webpack runtime and module manifest to its own file in order to
--- a/config/dev.env.js
+++ b/config/dev.env.js
@ -1,4 +1,4 @@
-var merge = require('webpack-merge')
+var { merge } = require('webpack-merge')
 var prodEnv = require('./prod.env')

 module.exports = merge(prodEnv, {
--- a/config/ihba.json
+++ b/config/ihba.json
@ -0,0 +1,4 @@
+{
+  "target": "https://ihatebeinga.live",
+  "staticConfigPreference": false
+}
--- a/config/index.js
+++ b/config/index.js
@ -38,6 +38,11 @@ module.exports = {
    assetsSubDirectory: 'static',
    assetsPublicPath: '/',
    proxyTable: {
+     '/manifest.json': {
+        target,
+        changeOrigin: true,
+        cookieDomainRewrite: 'localhost'
+      },
      '/api': {
        target,
        changeOrigin: true,
@ -61,7 +66,17 @@ module.exports = {
        target,
        changeOrigin: true,
        cookieDomainRewrite: 'localhost'
-      }
+      },
+      '/static/stickers.json': {
+        target,
+        changeOrigin: true,
+        cookieDomainRewrite: 'localhost'
+      },
+      '/static/stickers': {
+        target,
+        changeOrigin: true,
+        cookieDomainRewrite: 'localhost'
+      },
    },
    // CSS Sourcemaps off by default because relative paths are "buggy"
    // with this option, according to the CSS-Loader README
--- 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
@ -1,4 +1,4 @@
-var merge = require('webpack-merge')
+var { merge } = require('webpack-merge')
 var devEnv = require('./dev.env')

 module.exports = merge(devEnv, {
--- a/docs/Makefile
+++ b/docs/Makefile
@ -0,0 +1,7 @@
+all:	install
+	pipenv run mkdocs build
+
+install:
+	pipenv install
+clean:
+	rm -rf site
--- a/docs/Pipfile
+++ b/docs/Pipfile
@ -0,0 +1,10 @@
+[[source]]
+name = "pypi"
+url = "https://pypi.org/simple"
+verify_ssl = true
+
+[dev-packages]
+
+[packages]
+mkdocs-material = "*"
+markdown-include = "*"
--- a/docs/Pipfile.lock
+++ b/docs/Pipfile.lock
@ -0,0 +1,277 @@
+{
+    "_meta": {
+        "hash": {
+            "sha256": "926d34630c729228bb015cb958c04f8269c57f5ca1ffc2ceab1dfd1798884772"
+        },
+        "pipfile-spec": 6,
+        "requires": {},
+        "sources": [
+            {
+                "name": "pypi",
+                "url": "https://pypi.org/simple",
+                "verify_ssl": true
+            }
+        ]
+    },
+    "default": {
+        "click": {
+            "hashes": [
+                "sha256:7682dc8afb30297001674575ea00d1814d808d6a36af415a82bd481d37ba7b8e",
+                "sha256:bb4d8133cb15a609f44e8213d9b391b0809795062913b383c62be0ee95b1db48"
+            ],
+            "markers": "python_version >= '3.7'",
+            "version": "==8.1.3"
+        },
+        "ghp-import": {
+            "hashes": [
+                "sha256:8337dd7b50877f163d4c0289bc1f1c7f127550241988d568c1db512c4324a619",
+                "sha256:9c535c4c61193c2df8871222567d7fd7e5014d835f97dc7b7439069e2413d343"
+            ],
+            "version": "==2.1.0"
+        },
+        "importlib-metadata": {
+            "hashes": [
+                "sha256:637245b8bab2b6502fcbc752cc4b7a6f6243bb02b31c5c26156ad103d3d45670",
+                "sha256:7401a975809ea1fdc658c3aa4f78cc2195a0e019c5cbc4c06122884e9ae80c23"
+            ],
+            "markers": "python_version >= '3.7'",
+            "version": "==4.12.0"
+        },
+        "jinja2": {
+            "hashes": [
+                "sha256:31351a702a408a9e7595a8fc6150fc3f43bb6bf7e319770cbc0db9df9437e852",
+                "sha256:6088930bfe239f0e6710546ab9c19c9ef35e29792895fed6e6e31a023a182a61"
+            ],
+            "markers": "python_version >= '3.7'",
+            "version": "==3.1.2"
+        },
+        "markdown": {
+            "hashes": [
+                "sha256:cbb516f16218e643d8e0a95b309f77eb118cb138d39a4f27851e6a63581db874",
+                "sha256:f5da449a6e1c989a4cea2631aa8ee67caa5a2ef855d551c88f9e309f4634c621"
+            ],
+            "markers": "python_version >= '3.6'",
+            "version": "==3.3.7"
+        },
+        "markdown-include": {
+            "hashes": [
+                "sha256:6f5d680e36f7780c7f0f61dca53ca581bd50d1b56137ddcd6353efafa0c3e4a2"
+            ],
+            "index": "pypi",
+            "version": "==0.6.0"
+        },
+        "markupsafe": {
+            "hashes": [
+                "sha256:0212a68688482dc52b2d45013df70d169f542b7394fc744c02a57374a4207003",
+                "sha256:089cf3dbf0cd6c100f02945abeb18484bd1ee57a079aefd52cffd17fba910b88",
+                "sha256:10c1bfff05d95783da83491be968e8fe789263689c02724e0c691933c52994f5",
+                "sha256:33b74d289bd2f5e527beadcaa3f401e0df0a89927c1559c8566c066fa4248ab7",
+                "sha256:3799351e2336dc91ea70b034983ee71cf2f9533cdff7c14c90ea126bfd95d65a",
+                "sha256:3ce11ee3f23f79dbd06fb3d63e2f6af7b12db1d46932fe7bd8afa259a5996603",
+                "sha256:421be9fbf0ffe9ffd7a378aafebbf6f4602d564d34be190fc19a193232fd12b1",
+                "sha256:43093fb83d8343aac0b1baa75516da6092f58f41200907ef92448ecab8825135",
+                "sha256:46d00d6cfecdde84d40e572d63735ef81423ad31184100411e6e3388d405e247",
+                "sha256:4a33dea2b688b3190ee12bd7cfa29d39c9ed176bda40bfa11099a3ce5d3a7ac6",
+                "sha256:4b9fe39a2ccc108a4accc2676e77da025ce383c108593d65cc909add5c3bd601",
+                "sha256:56442863ed2b06d19c37f94d999035e15ee982988920e12a5b4ba29b62ad1f77",
+                "sha256:671cd1187ed5e62818414afe79ed29da836dde67166a9fac6d435873c44fdd02",
+                "sha256:694deca8d702d5db21ec83983ce0bb4b26a578e71fbdbd4fdcd387daa90e4d5e",
+                "sha256:6a074d34ee7a5ce3effbc526b7083ec9731bb3cbf921bbe1d3005d4d2bdb3a63",
+                "sha256:6d0072fea50feec76a4c418096652f2c3238eaa014b2f94aeb1d56a66b41403f",
+                "sha256:6fbf47b5d3728c6aea2abb0589b5d30459e369baa772e0f37a0320185e87c980",
+                "sha256:7f91197cc9e48f989d12e4e6fbc46495c446636dfc81b9ccf50bb0ec74b91d4b",
+                "sha256:86b1f75c4e7c2ac2ccdaec2b9022845dbb81880ca318bb7a0a01fbf7813e3812",
+                "sha256:8dc1c72a69aa7e082593c4a203dcf94ddb74bb5c8a731e4e1eb68d031e8498ff",
+                "sha256:8e3dcf21f367459434c18e71b2a9532d96547aef8a871872a5bd69a715c15f96",
+                "sha256:8e576a51ad59e4bfaac456023a78f6b5e6e7651dcd383bcc3e18d06f9b55d6d1",
+                "sha256:96e37a3dc86e80bf81758c152fe66dbf60ed5eca3d26305edf01892257049925",
+                "sha256:97a68e6ada378df82bc9f16b800ab77cbf4b2fada0081794318520138c088e4a",
+                "sha256:99a2a507ed3ac881b975a2976d59f38c19386d128e7a9a18b7df6fff1fd4c1d6",
+                "sha256:a49907dd8420c5685cfa064a1335b6754b74541bbb3706c259c02ed65b644b3e",
+                "sha256:b09bf97215625a311f669476f44b8b318b075847b49316d3e28c08e41a7a573f",
+                "sha256:b7bd98b796e2b6553da7225aeb61f447f80a1ca64f41d83612e6139ca5213aa4",
+                "sha256:b87db4360013327109564f0e591bd2a3b318547bcef31b468a92ee504d07ae4f",
+                "sha256:bcb3ed405ed3222f9904899563d6fc492ff75cce56cba05e32eff40e6acbeaa3",
+                "sha256:d4306c36ca495956b6d568d276ac11fdd9c30a36f1b6eb928070dc5360b22e1c",
+                "sha256:d5ee4f386140395a2c818d149221149c54849dfcfcb9f1debfe07a8b8bd63f9a",
+                "sha256:dda30ba7e87fbbb7eab1ec9f58678558fd9a6b8b853530e176eabd064da81417",
+                "sha256:e04e26803c9c3851c931eac40c695602c6295b8d432cbe78609649ad9bd2da8a",
+                "sha256:e1c0b87e09fa55a220f058d1d49d3fb8df88fbfab58558f1198e08c1e1de842a",
+                "sha256:e72591e9ecd94d7feb70c1cbd7be7b3ebea3f548870aa91e2732960fa4d57a37",
+                "sha256:e8c843bbcda3a2f1e3c2ab25913c80a3c5376cd00c6e8c4a86a89a28c8dc5452",
+                "sha256:efc1913fd2ca4f334418481c7e595c00aad186563bbc1ec76067848c7ca0a933",
+                "sha256:f121a1420d4e173a5d96e47e9a0c0dcff965afdf1626d28de1460815f7c4ee7a",
+                "sha256:fc7b548b17d238737688817ab67deebb30e8073c95749d55538ed473130ec0c7"
+            ],
+            "markers": "python_version >= '3.7'",
+            "version": "==2.1.1"
+        },
+        "mergedeep": {
+            "hashes": [
+                "sha256:0096d52e9dad9939c3d975a774666af186eda617e6ca84df4c94dec30004f2a8",
+                "sha256:70775750742b25c0d8f36c55aed03d24c3384d17c951b3175d898bd778ef0307"
+            ],
+            "markers": "python_version >= '3.6'",
+            "version": "==1.3.4"
+        },
+        "mkdocs": {
+            "hashes": [
+                "sha256:26bd2b03d739ac57a3e6eed0b7bcc86168703b719c27b99ad6ca91dc439aacde",
+                "sha256:b504405b04da38795fec9b2e5e28f6aa3a73bb0960cb6d5d27ead28952bd35ea"
+            ],
+            "markers": "python_version >= '3.6'",
+            "version": "==1.3.0"
+        },
+        "mkdocs-material": {
+            "hashes": [
+                "sha256:263f2721f3abe533b61f7c8bed435a0462620912742c919821ac2d698b4bfe67",
+                "sha256:dc82b667d2a83f0de581b46a6d0949732ab77e7638b87ea35b770b33bc02e75a"
+            ],
+            "index": "pypi",
+            "version": "==8.3.9"
+        },
+        "mkdocs-material-extensions": {
+            "hashes": [
+                "sha256:a82b70e533ce060b2a5d9eb2bc2e1be201cf61f901f93704b4acf6e3d5983a44",
+                "sha256:bfd24dfdef7b41c312ede42648f9eb83476ea168ec163b613f9abd12bbfddba2"
+            ],
+            "markers": "python_version >= '3.6'",
+            "version": "==1.0.3"
+        },
+        "packaging": {
+            "hashes": [
+                "sha256:dd47c42927d89ab911e606518907cc2d3a1f38bbd026385970643f9c5b8ecfeb",
+                "sha256:ef103e05f519cdc783ae24ea4e2e0f508a9c99b2d4969652eed6a2e1ea5bd522"
+            ],
+            "markers": "python_version >= '3.6'",
+            "version": "==21.3"
+        },
+        "pygments": {
+            "hashes": [
+                "sha256:5eb116118f9612ff1ee89ac96437bb6b49e8f04d8a13b514ba26f620208e26eb",
+                "sha256:dc9c10fb40944260f6ed4c688ece0cd2048414940f1cea51b8b226318411c519"
+            ],
+            "markers": "python_version >= '3.6'",
+            "version": "==2.12.0"
+        },
+        "pymdown-extensions": {
+            "hashes": [
+                "sha256:3ef2d998c0d5fa7eb09291926d90d69391283561cf6306f85cd588a5eb5befa0",
+                "sha256:ec141c0f4983755349f0c8710416348d1a13753976c028186ed14f190c8061c4"
+            ],
+            "markers": "python_version >= '3.7'",
+            "version": "==9.5"
+        },
+        "pyparsing": {
+            "hashes": [
+                "sha256:2b020ecf7d21b687f219b71ecad3631f644a47f01403fa1d1036b0c6416d70fb",
+                "sha256:5026bae9a10eeaefb61dab2f09052b9f4307d44aee4eda64b309723d8d206bbc"
+            ],
+            "markers": "python_full_version >= '3.6.8'",
+            "version": "==3.0.9"
+        },
+        "python-dateutil": {
+            "hashes": [
+                "sha256:0123cacc1627ae19ddf3c27a5de5bd67ee4586fbdd6440d9748f8abb483d3e86",
+                "sha256:961d03dc3453ebbc59dbdea9e4e11c5651520a876d0f4db161e8674aae935da9"
+            ],
+            "markers": "python_version >= '2.7' and python_version not in '3.0, 3.1, 3.2, 3.3'",
+            "version": "==2.8.2"
+        },
+        "pyyaml": {
+            "hashes": [
+                "sha256:0283c35a6a9fbf047493e3a0ce8d79ef5030852c51e9d911a27badfde0605293",
+                "sha256:055d937d65826939cb044fc8c9b08889e8c743fdc6a32b33e2390f66013e449b",
+                "sha256:07751360502caac1c067a8132d150cf3d61339af5691fe9e87803040dbc5db57",
+                "sha256:0b4624f379dab24d3725ffde76559cff63d9ec94e1736b556dacdfebe5ab6d4b",
+                "sha256:0ce82d761c532fe4ec3f87fc45688bdd3a4c1dc5e0b4a19814b9009a29baefd4",
+                "sha256:1e4747bc279b4f613a09eb64bba2ba602d8a6664c6ce6396a4d0cd413a50ce07",
+                "sha256:213c60cd50106436cc818accf5baa1aba61c0189ff610f64f4a3e8c6726218ba",
+                "sha256:231710d57adfd809ef5d34183b8ed1eeae3f76459c18fb4a0b373ad56bedcdd9",
+                "sha256:277a0ef2981ca40581a47093e9e2d13b3f1fbbeffae064c1d21bfceba2030287",
+                "sha256:2cd5df3de48857ed0544b34e2d40e9fac445930039f3cfe4bcc592a1f836d513",
+                "sha256:40527857252b61eacd1d9af500c3337ba8deb8fc298940291486c465c8b46ec0",
+                "sha256:473f9edb243cb1935ab5a084eb238d842fb8f404ed2193a915d1784b5a6b5fc0",
+                "sha256:48c346915c114f5fdb3ead70312bd042a953a8ce5c7106d5bfb1a5254e47da92",
+                "sha256:50602afada6d6cbfad699b0c7bb50d5ccffa7e46a3d738092afddc1f9758427f",
+                "sha256:68fb519c14306fec9720a2a5b45bc9f0c8d1b9c72adf45c37baedfcd949c35a2",
+                "sha256:77f396e6ef4c73fdc33a9157446466f1cff553d979bd00ecb64385760c6babdc",
+                "sha256:819b3830a1543db06c4d4b865e70ded25be52a2e0631ccd2f6a47a2822f2fd7c",
+                "sha256:897b80890765f037df3403d22bab41627ca8811ae55e9a722fd0392850ec4d86",
+                "sha256:98c4d36e99714e55cfbaaee6dd5badbc9a1ec339ebfc3b1f52e293aee6bb71a4",
+                "sha256:9df7ed3b3d2e0ecfe09e14741b857df43adb5a3ddadc919a2d94fbdf78fea53c",
+                "sha256:9fa600030013c4de8165339db93d182b9431076eb98eb40ee068700c9c813e34",
+                "sha256:a80a78046a72361de73f8f395f1f1e49f956c6be882eed58505a15f3e430962b",
+                "sha256:b3d267842bf12586ba6c734f89d1f5b871df0273157918b0ccefa29deb05c21c",
+                "sha256:b5b9eccad747aabaaffbc6064800670f0c297e52c12754eb1d976c57e4f74dcb",
+                "sha256:c5687b8d43cf58545ade1fe3e055f70eac7a5a1a0bf42824308d868289a95737",
+                "sha256:cba8c411ef271aa037d7357a2bc8f9ee8b58b9965831d9e51baf703280dc73d3",
+                "sha256:d15a181d1ecd0d4270dc32edb46f7cb7733c7c508857278d3d378d14d606db2d",
+                "sha256:d4db7c7aef085872ef65a8fd7d6d09a14ae91f691dec3e87ee5ee0539d516f53",
+                "sha256:d4eccecf9adf6fbcc6861a38015c2a64f38b9d94838ac1810a9023a0609e1b78",
+                "sha256:d67d839ede4ed1b28a4e8909735fc992a923cdb84e618544973d7dfc71540803",
+                "sha256:daf496c58a8c52083df09b80c860005194014c3698698d1a57cbcfa182142a3a",
+                "sha256:e61ceaab6f49fb8bdfaa0f92c4b57bcfbea54c09277b1b4f7ac376bfb7a7c174",
+                "sha256:f84fbc98b019fef2ee9a1cb3ce93e3187a6df0b2538a651bfb890254ba9f90b5"
+            ],
+            "markers": "python_version >= '3.6'",
+            "version": "==6.0"
+        },
+        "pyyaml-env-tag": {
+            "hashes": [
+                "sha256:70092675bda14fdec33b31ba77e7543de9ddc88f2e5b99160396572d11525bdb",
+                "sha256:af31106dec8a4d68c60207c1886031cbf839b68aa7abccdb19868200532c2069"
+            ],
+            "markers": "python_version >= '3.6'",
+            "version": "==0.1"
+        },
+        "six": {
+            "hashes": [
+                "sha256:1e61c37477a1626458e36f7b1d82aa5c9b094fa4802892072e49de9c60c4c926",
+                "sha256:8abb2f1d86890a2dfb989f9a77cfcfd3e47c2a354b01111771326f8aa26e0254"
+            ],
+            "markers": "python_version >= '2.7' and python_version not in '3.0, 3.1, 3.2, 3.3'",
+            "version": "==1.16.0"
+        },
+        "watchdog": {
+            "hashes": [
+                "sha256:083171652584e1b8829581f965b9b7723ca5f9a2cd7e20271edf264cfd7c1412",
+                "sha256:117ffc6ec261639a0209a3252546b12800670d4bf5f84fbd355957a0595fe654",
+                "sha256:186f6c55abc5e03872ae14c2f294a153ec7292f807af99f57611acc8caa75306",
+                "sha256:195fc70c6e41237362ba720e9aaf394f8178bfc7fa68207f112d108edef1af33",
+                "sha256:226b3c6c468ce72051a4c15a4cc2ef317c32590d82ba0b330403cafd98a62cfd",
+                "sha256:247dcf1df956daa24828bfea5a138d0e7a7c98b1a47cf1fa5b0c3c16241fcbb7",
+                "sha256:255bb5758f7e89b1a13c05a5bceccec2219f8995a3a4c4d6968fe1de6a3b2892",
+                "sha256:43ce20ebb36a51f21fa376f76d1d4692452b2527ccd601950d69ed36b9e21609",
+                "sha256:4f4e1c4aa54fb86316a62a87b3378c025e228178d55481d30d857c6c438897d6",
+                "sha256:5952135968519e2447a01875a6f5fc8c03190b24d14ee52b0f4b1682259520b1",
+                "sha256:64a27aed691408a6abd83394b38503e8176f69031ca25d64131d8d640a307591",
+                "sha256:6b17d302850c8d412784d9246cfe8d7e3af6bcd45f958abb2d08a6f8bedf695d",
+                "sha256:70af927aa1613ded6a68089a9262a009fbdf819f46d09c1a908d4b36e1ba2b2d",
+                "sha256:7a833211f49143c3d336729b0020ffd1274078e94b0ae42e22f596999f50279c",
+                "sha256:8250546a98388cbc00c3ee3cc5cf96799b5a595270dfcfa855491a64b86ef8c3",
+                "sha256:97f9752208f5154e9e7b76acc8c4f5a58801b338de2af14e7e181ee3b28a5d39",
+                "sha256:9f05a5f7c12452f6a27203f76779ae3f46fa30f1dd833037ea8cbc2887c60213",
+                "sha256:a735a990a1095f75ca4f36ea2ef2752c99e6ee997c46b0de507ba40a09bf7330",
+                "sha256:ad576a565260d8f99d97f2e64b0f97a48228317095908568a9d5c786c829d428",
+                "sha256:b530ae007a5f5d50b7fbba96634c7ee21abec70dc3e7f0233339c81943848dc1",
+                "sha256:bfc4d351e6348d6ec51df007432e6fe80adb53fd41183716017026af03427846",
+                "sha256:d3dda00aca282b26194bdd0adec21e4c21e916956d972369359ba63ade616153",
+                "sha256:d9820fe47c20c13e3c9dd544d3706a2a26c02b2b43c993b62fcd8011bcc0adb3",
+                "sha256:ed80a1628cee19f5cfc6bb74e173f1b4189eb532e705e2a13e3250312a62e0c9",
+                "sha256:ee3e38a6cc050a8830089f79cbec8a3878ec2fe5160cdb2dc8ccb6def8552658"
+            ],
+            "markers": "python_version >= '3.6'",
+            "version": "==2.1.9"
+        },
+        "zipp": {
+            "hashes": [
+                "sha256:56bf8aadb83c24db6c4b577e13de374ccfb67da2078beba1d037c17980bf43ad",
+                "sha256:c4f6e5bbf48e74f7a38e7cc5b0480ff42b0ae5178957d564d18932525d5cf099"
+            ],
+            "markers": "python_version >= '3.7'",
+            "version": "==3.8.0"
+        }
+    },
+    "develop": {}
+}
--- a/docs/assets/example_emoji.png
+++ b/docs/assets/example_emoji.png
--- a/docs/docs/CONFIGURATION.md
+++ b/docs/docs/CONFIGURATION.md
@ -1,15 +1,15 @@
-# Pleroma-FE configuration and customization for instance administrators
+# Akkoma-FE configuration and customization for instance administrators

-* *For user configuration, see [Pleroma-FE user guide](../user_guide)*
+* *For user configuration, see [Akkoma-FE user guide](../user_guide)*
 * *For local development server configuration, see [Hacking, tweaking, contributing](HACKING.md)*

 ## Where configuration is stored

-PleromaFE gets its configuration from several sources, in order of preference (the one above overrides ones below it)
+Akkoma-FE gets its configuration from several sources, in order of preference (the one above overrides ones below it)

-1. `/api/statusnet/config.json` - this is generated on Backend and contains multiple things including instance name, char limit etc. It also contains FE/Client-specific data, PleromaFE uses `pleromafe` field of it. For more info on changing config on BE, look [here](../backend/configuration/cheatsheet.md#frontend_configurations)
-2. `/static/config.json` - this is a static FE-provided file, containing only FE specific configuration. This file is completely optional and could be removed but is useful as a fallback if some configuration JSON property isn't present in BE-provided config. It's also a reference point to check what default configuration are and what JSON properties even exist. In local dev mode it could be used to override BE configuration, more about that in HACKING.md. File is located [here](https://git.pleroma.social/pleroma/pleroma-fe/blob/develop/static/config.json).
-3. Built-in defaults. Those are hard-coded defaults that are used when `/static/config.json` is not available and BE-provided configuration JSON is missing some JSON properties. ( [Code](https://git.pleroma.social/pleroma/pleroma-fe/blob/develop/src/modules/instance.js) )
+1. `/api/statusnet/config.json` - this is generated on Backend and contains multiple things including instance name, char limit etc. It also contains FE/Client-specific data, Akkoma-FE uses `pleromafe` field of it. For more info on changing config on BE, look [here](https://docs.akkoma.dev/stable/configuration/cheatsheet.md#frontend_configurations)
+2. `/static/config.json` - this is a static FE-provided file, containing only FE specific configuration. This file is completely optional and could be removed but is useful as a fallback if some configuration JSON property isn't present in BE-provided config. It's also a reference point to check what default configuration are and what JSON properties even exist. In local dev mode it could be used to override BE configuration, more about that in HACKING.md. File is located [here](https://akkoma.dev/AkkomaGang/akkoma-fe/src/branch/develop/static/config.json).
+3. Built-in defaults. Those are hard-coded defaults that are used when `/static/config.json` is not available and BE-provided configuration JSON is missing some JSON properties. ( [Code](https://akkoma.dev/AkkomaGang/akkoma-fe/src/branch/develop/src/modules/instance.js) )

 ## Instance-defaults

@ -59,7 +59,7 @@ Instance `logo`, could be any image, including svg. By default it assumes logo u
 `logoMargin` allows you to adjust vertical margins between logo boundary and navbar borders. The idea is that to have logo's image without any extra margins and instead adjust them to your need in layout.

 ### `minimalScopesMode`
-Limit scope selection to *Direct*, *User default* and *Scope of post replying to*. This also makes it impossible to reply to a DM with a non-DM post from PleromaFE.
+Limit scope selection to *Direct*, *User default* and *Scope of post replying to*. This also makes it impossible to reply to a DM with a non-DM post from Akkoma-FE.

 ### `nsfwCensorImage`
 Use custom image for NSFW'd images
@ -70,9 +70,6 @@ Default post formatting option (markdown/bbcode/plaintext/etc...)
 ### `redirectRootNoLogin`, `redirectRootLogin`
 These two settings should point to where FE should redirect visitor when they login/open up website root

-### `scopeCopy`
-Copy post scope (visibility) when replying to a post. Instance-default.
-
 ### `sidebarRight`
 Change alignment of sidebar and panels to the right. Defaults to `false`.

@ -80,7 +77,7 @@ Change alignment of sidebar and panels to the right. Defaults to `false`.
 Show panel showcasing instance features/settings to logged-out visitors

 ### `showInstanceSpecificPanel`
-This allows you to include arbitrary HTML content in a panel below navigation menu. PleromaFE looks for an html page `instance/panel.html`, by default it's not provided in FE, but BE bundles some [default one](https://git.pleroma.social/pleroma/pleroma/blob/develop/priv/static/instance/panel.html). De-facto instance-defaults, since user can hide instance-specific panel.
+This allows you to include arbitrary HTML content in a panel below navigation menu. Akkoma-FE looks for an html page `instance/panel.html`, by default it's not provided in FE, but BE bundles some [default one](https://git.pleroma.social/pleroma/pleroma/blob/develop/priv/static/instance/panel.html). De-facto instance-defaults, since user can hide instance-specific panel.

 ### `subjectLineBehavior`
 How to handle subject line (CW) when replying to a post.
--- a/docs/docs/HACKING.md
+++ b/docs/docs/HACKING.md
@ -1,8 +1,8 @@
 # Hacking, tweaking, contributing

-## What PleromaFE even is, how it works
+## What Akkoma-FE even is, how it works

-PleromaFE is an SPA (Single-Page Application) backed by [Vue](https://vuejs.org/) framework. It means that it's just a nearly-empty HTML page with bunch of JavaScript that actually generates and controls DOM (i.e. html elements) in Runtime. Currently, there's no way around it - you have to have Javascript enabled in the browser to make it work, there is a theoretical possibility to generate some HTML server-side but it's not implemented yet.
+Akkoma-FE is an SPA (Single-Page Application) backed by [Vue](https://vuejs.org/) framework. It means that it's just a nearly-empty HTML page with bunch of JavaScript that actually generates and controls DOM (i.e. html elements) in Runtime. Currently, there's no way around it - you have to have Javascript enabled in the browser to make it work, there is a theoretical possibility to generate some HTML server-side but it's not implemented yet.

 You can serve static html page and everything from any HTTP(S) server but currently it will try to access /api/ path at same domain it's running on, meaning that as of right now you cannot put it on one domain and access the other without proxying requests.

@ -25,7 +25,7 @@ This could be a bit trickier, you basically need steps 1-4 from *develop build*

 ### Replacing your instance's frontend with custom FE build

-This is the most easiest way to use and test FE build: you just need to copy or symlink contents of `dist` folder into backend's [static directory](../backend/configuration/static_dir.md), by default it is located in `instance/static`, or in `/var/lib/pleroma/static` for OTP release installations, create it if it doesn't exist already. Be aware that running `yarn build` wipes the contents of `dist` folder.
+This is the most easiest way to use and test FE build: you just need to copy or symlink contents of `dist` folder into backend's [static directory](https://docs.akkoma.dev/stable/configuration/static_dir/), by default it is located in `instance/static`, or in `/var/lib/pleroma/static` for OTP release installations, create it if it doesn't exist already. Be aware that running `yarn build` wipes the contents of `dist` folder.

 ### Running production build locally or on a separate server

@ -67,19 +67,19 @@ server {

 ### API, Data, Operations

-In 99% cases PleromaFE uses [MastoAPI](https://docs.joinmastodon.org/api/) with [Pleroma Extensions](../backend/API/differences_in_mastoapi_responses.md) to fetch the data. The rest is either QvitterAPI leftovers or pleroma-exclusive APIs. QvitterAPI doesn't exactly have documentation and uses different JSON structure and sometimes different parameters and workflows, [this](https://twitter-api.readthedocs.io/en/latest/index.html) could be a good reference though. Some pleroma-exclusive API may still be using QvitterAPI JSON structure.
+In 99% cases Akkoma-FE uses [MastoAPI](https://docs.joinmastodon.org/api/) with [Pleroma Extensions](https://docs.akkoma.dev/stable/differences_in_mastoapi_responses.md) to fetch the data. The rest is either QvitterAPI leftovers or pleroma-exclusive APIs. QvitterAPI doesn't exactly have documentation and uses different JSON structure and sometimes different parameters and workflows, [this](https://twitter-api.readthedocs.io/en/latest/index.html) could be a good reference though. Some pleroma-exclusive API may still be using QvitterAPI JSON structure.

-PleromaFE supports both formats by transforming them into internal format which is basically QvitterAPI one with some additions and renaming. All data is passed trough [Entity Normalizer](https://git.pleroma.social/pleroma/pleroma-fe/-/blob/develop/src/services/entity_normalizer/entity_normalizer.service.js) which can serve as a reference of API and what's actually used, it's also a host for all the hacks and data transformation.
+Akkoma-FE supports both formats by transforming them into internal format which is basically QvitterAPI one with some additions and renaming. All data is passed trough [Entity Normalizer](https://akkoma.dev/AkkomaGang/akkoma-fe/src/branch/develop/src/services/entity_normalizer/entity_normalizer.service.js) which can serve as a reference of API and what's actually used, it's also a host for all the hacks and data transformation.

-For most part, PleromaFE tries to store all the info it can get in global vuex store - every user and post are passed trough updating mechanism where data is either added or merged with existing data, reactively updating the information throughout UI, so if in newest request user's post counter increased, it will be instantly updated in open user profile cards. This is also used to find users, posts and sometimes to build timelines and/or request parameters.
+For most part, Akkoma-FE tries to store all the info it can get in global vuex store - every user and post are passed trough updating mechanism where data is either added or merged with existing data, reactively updating the information throughout UI, so if in newest request user's post counter increased, it will be instantly updated in open user profile cards. This is also used to find users, posts and sometimes to build timelines and/or request parameters.

-PleromaFE also tries to persist this store, however only stable data is stored, such as user authentication and preferences, user highlights. Persistence is performed by saving and loading chunk of vuex store in browser's LocalStorage/IndexedDB.
+Akkoma-FE also tries to persist this store, however only stable data is stored, such as user authentication and preferences, user highlights. Persistence is performed by saving and loading chunk of vuex store in browser's LocalStorage/IndexedDB.

 TODO: Refactor API code and document it here

 ### Themes

-PleromaFE uses custom theme "framework" which is pretty much just a style tag rendered by vue which only contains CSS3 variables. Every color used in UI should be derived from theme. Theme is stored in a JSON object containing color, opacity, shadow and font information, with most of it being optional.
+Akkoma-FE uses custom theme "framework" which is pretty much just a style tag rendered by vue which only contains CSS3 variables. Every color used in UI should be derived from theme. Theme is stored in a JSON object containing color, opacity, shadow and font information, with most of it being optional.

 The most basic theme can consist of 4 to 8 "basic colors", which is also what previous version of themes allowed, with all other colors being derived from those basic colors, i.e. "light background" will be "background" color lightened/darkened, "panel header" will be same as "foreground". The idea is that you can specify just basic color palette and everything else will be generated automatically, but if you really need to tweak some specific color - you can.

--- a/docs/docs/assets/example_emoji.png
+++ b/docs/docs/assets/example_emoji.png
--- a/docs/docs/assets/example_markdown.png
+++ b/docs/docs/assets/example_markdown.png
--- a/docs/docs/css/extra.css
+++ b/docs/docs/css/extra.css
@ -0,0 +1,74 @@
+p, a, li, pre {
+  font-family: "Tiresias PCFont", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, "Noto Sans", sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji" !important;
+}
+
+code,
+.codehilite pre {
+  font-weight: bold;
+}
+
+:root > * {
+  --md-primary-fg-color:        #593196;
+  --md-accent-fg-color:         #455a63;
+}
+
+#app { background-repeat: repeat !important; }
+@media all and (min-width: 800px) { .tab-icon { display: none !important; } }
+.tab-switcher .tab-icon { color: #fff !important; }
+.site-name {  font-family: BLACKOUT; font-size: 3rem !important; line-height: 4rem;}
+.site-name::before  { content: "%"; }
+.dropdown-item { color: #fff !important; }
+
+@font-face {
+  font-family: 'Tiresias PCFont';
+  font-style: normal;
+  font-weight: 400;
+  src: local('Tiresias PCFont'), local('Tiresias PCFont'),
+       url('./fonts/Tiresias_PCfont.ttf') format('truetype')
+}
+@font-face {
+  font-family: 'Tiresias Infofont';
+  font-style: normal;
+  font-weight: 400;
+  src: local('Tiresias Infofont'), local('Tiresias Infofont'),
+       url('./fonts/Tiresias_Infofont.ttf') format('truetype')
+}
+
+@font-face{
+  font-family:'blockzone';
+  src:url('./fonts/blockzone-webfont.woff2') format("woff2"),
+    url('./fonts/blockzone-webfont.woff') format("woff");
+  font-style:normal;
+  font-weight:400
+}
+@font-face{
+  font-family:'PeanutMoney';
+  src:url('./fonts/PeanutMoney.ttf') format("opentype");
+  font-style:normal;
+  font-weight:400
+}
+@font-face{
+  font-family:'Heading';
+  src:url('./fonts/heading.woff');
+  font-style:normal;
+  font-weight:400
+}
+
+@font-face{
+  font-family:'MonoMMM_5';
+  src:url('./fonts/monoMMM_5.woff');
+  font-style:normal;
+  font-weight:400
+}
+@font-face{
+  font-family:'Tiny';
+  src:url('./fonts/tiny.woff');
+  font-style:normal;
+  font-weight:400
+}
+@font-face{
+  font-family:'BLACKOUT';
+  src:url('./fonts/BLACKOUT.woff');
+  font-style:normal;
+  font-weight:400
+}
--- a/docs/docs/fonts/Tiresias_Infofont.ttf
+++ b/docs/docs/fonts/Tiresias_Infofont.ttf
--- a/docs/docs/fonts/Tiresias_PCfont.ttf
+++ b/docs/docs/fonts/Tiresias_PCfont.ttf
--- a/docs/docs/images/akkoma_logo_vector_bg_32.png
+++ b/docs/docs/images/akkoma_logo_vector_bg_32.png
--- a/docs/docs/images/akkoma_logo_vector_nobg.svg
+++ b/docs/docs/images/akkoma_logo_vector_nobg.svg
@ -0,0 +1,24 @@
+<?xml version="1.0" encoding="UTF-8"?>
+<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 362.83 362.83">
+  <defs>
+    <style>
+      .cls-1, .cls-2 {
+        fill: #fff;
+      }
+
+      .cls-2 {
+        stroke: #fff;
+        stroke-miterlimit: 10;
+      }
+    </style>
+  </defs>
+  <g id="Layer_6" data-name="Layer 6">
+    <path class="cls-1" d="M115.2,131.89c6.26-6.54,20.19-20.63,42.39-26.14,15.79-3.92,28.51-1.28,33.51,0,83.72,21.41,116.03,201.78,77.79,226.32-10.28,6.6-26.86,2.7-36.77-3.3-32.63-19.78-29.3-72.87-44.44-73.73-5.11-.29-7.15,5.8-20.91,24.94-19.63,27.3-31.49,43.44-49.21,50.87-2.53,1.06-26.91,12.07-41.84,1.23-38.55-28-2.96-155.84,39.49-200.18Zm56.31,10.45c-27.39-.52-46.38,38.21-37.98,54.55,10.09,19.62,65.5,18.26,74.77-3.3,7.21-16.78-11.38-50.77-36.79-51.24Z"/>
+  </g>
+  <g id="Layer_4" data-name="Layer 4">
+    <path class="cls-1" d="M68.93,86.51c-6.55,27.74,252.45,113.97,267.56,89.66,9.24-14.87-64.9-83.62-163.53-97.57-39.06-5.52-100.95-5.14-104.03,7.91Z"/>
+  </g>
+  <g id="Layer_5" data-name="Layer 5">
+    <path class="cls-2" d="M138.96,93.76c.41-5.25,6.51-5.74,28.85-19.42,26.97-16.51,28.85-22.38,56.86-40.83,30.07-19.81,48.46-31.94,54.82-26.61,9.72,8.15-25.18,43.33-21.31,99.35,.87,12.61,3.12,17.79-.86,23.01-18.25,23.95-120.07-13.68-118.35-35.5Z"/>
+  </g>
+</svg>
--- a/docs/docs/index.md
+++ b/docs/docs/index.md
@ -0,0 +1,8 @@
+# Introduction to Akkoma-FE
+## What is Akkoma-FE?
+
+Akkoma-FE is the default user-facing frontend for Pleroma. It's user interface is modeled after Qvitter which is modeled after an older Twitter design. It provides a simple 2-column interface for microblogging. While being simple by default it also provides many powerful customization options.
+
+## How can I use it?
+
+If your instance uses Akkoma-FE, you can acces it by going to your instance (e.g. <https://pleroma.soykaf.com>). You can read more about it's basic functionality in the [Akkoma-FE User Guide](./user_guide/). We also have [a guide for administrators](./CONFIGURATION.md) and for [hackers/contributors](./HACKING.md).
--- a/docs/docs/stickers.md
+++ b/docs/docs/stickers.md
@ -0,0 +1,53 @@
+# Adding stickers
+
+Akkoma-FE supports stickers, which are essentially little images stored server-side
+which can be selected by a user to automatically attach them to a post.
+
+There's no explicit setting for these, they just rely on the existence of certain files.
+
+## Initialising the sticker config file
+
+You're probably serving Akkoma-FE from your instance's `instance/static/` directory -
+this directy can also override files served at a given path.
+
+The first thing we need to do is set up our `stickers.json` file. At `instance/static/static/stickers.json`,
+put a file that looks like this
+
+```json
+{
+  "myPack": "/static/stickers/myPack"
+}
+```
+
+This file is a mapping from name to pack directory location. It says "we have a pack called myPack, look for
+it at `/static/stickers/myPack`". You can add as many packs as you like in this manner.
+
+## Creating the pack
+
+First, create your pack directory
+
+```bash
+mkdir -p instance/static/static/stickers/myPack
+```
+
+Now you need to give it some config.
+
+At `instance/static/static/stickers/myPack/pack.json`, put a file that looks like:
+
+```json
+{
+    "title": "myPack",
+    "author": "me for i am very cool",
+    "tabIcon": "tab.png",
+	"stickers": [
+        "mySticker.png"
+    ]
+}
+```
+
+This should be relatively self-explanatory, it declares a pack with a title `myPack` which has only one sticker in it.
+The `tabIcon` will appear on the sticker picker itself as a representative of the pack.
+
+You can add as many stickers as you like. They should all be in the same directory as your `pack.json`.
+
+Now you should find that there's a sticky note icon on the emoji picker on Akkoma-FE that allows you to attach stickers.
--- a/docs/docs/user_guide/index.md
+++ b/docs/docs/user_guide/index.md
@ -8,13 +8,13 @@
 >
 > --Catbag

-Pleroma-FE is the default user-facing frontend for Pleroma. If your instance uses Pleroma-FE, you can access it by going to your instance (e.g. <https://pleroma.soykaf.com>). After logging in you will have two columns in front of you. Here we're going to keep it to the default behaviour, but some instances swap the left and right columns. If you're on such an instance what we refer to as the left column will be on your right and vice versa.
+Akkoma-FE is the default user-facing frontend for Pleroma. If your instance uses Akkoma-FE, you can access it by going to your instance (e.g. <https://pleroma.soykaf.com>). After logging in you will have two columns in front of you. Here we're going to keep it to the default behaviour, but some instances swap the left and right columns. If you're on such an instance what we refer to as the left column will be on your right and vice versa.

 ### Left column

 - first block: This section is dedicated to [posting](posting_reading_basic_functions.md)
 - second block: Here you can switch between the different views for the right column.
- Optional third block: This is the Instance panel that can be activated, but is deactivated by default. It's fully customisable by instance admins and by default has links to the Pleroma-FE and Mastodon-FE.
+- Optional third block: This is the Instance panel that can be activated, but is deactivated by default. It's fully customisable by instance admins and by default has links to the Akkoma-FE and Mastodon-FE.
 - fourth block: This is the Notifications block, here you will get notified whenever somebody mentions you, follows you, repeats or favorites one of your statuses

 ### Right column
--- a/docs/docs/user_guide/posting_reading_basic_functions.md
+++ b/docs/docs/user_guide/posting_reading_basic_functions.md
@ -15,13 +15,13 @@ Posts will contain the text you are posting, but some content will be modified:
 Let's clear up some basic stuff. When you post something it's called a **post** or it could be called a **status** or even a **toot** or a **prööt** depending on whom you ask. Post has body/content but it also has some other stuff in it - from attachments, visibility scope, subject line...

 **Emoji** are small images embedded in text, there are two major types of emoji: [unicode emoji](https://en.wikipedia.org/wiki/Emoji) and custom emoji. While unicode emoji are universal and standardized, they can appear differently depending on where you are using them or may not appear at all on older systems. Custom emoji are a more *fun* kind - instance administrator can define many images as *custom emoji* for their users. This works very simple - custom emoji is defined by its *shortcode* and an image, so that any shortcode enclosed in colons get replaced with image if such shortcode exist.
-Let's say there's a `:pleroma:` emoji defined on an instance. That means  
-> First time using :pleroma: pleroma!  
+Let's say there's a `:akkoma:` emoji defined on an instance. That means
+> First time using :akkoma: akkoma!

-will become  
-> First time using ![pleroma](../assets/example_emoji.png) pleroma!  
+will become
+> First time using ![akkoma](../assets/example_emoji.png) akkoma!

-Note that you can only use emoji defined on your instance, you cannot "copy" someone else's emoji, and will have to ask your administrator to copy emoji from other instance to yours.  
+Note that you can only use emoji defined on your instance, you cannot "copy" someone else's emoji, and will have to ask your administrator to copy emoji from other instance to yours.
 Lastly, there's two convenience options for emoji: an emoji picker (smiley face to the right of "submit" button) and autocomplete suggestions - when you start typing :shortcode: it will automatically try to suggest you emoji and complete the shortcode for you if you select one. If emoji doesn't show up in suggestions nor in emoji picker it means there's no such emoji on your instance, if shortcode doesn't match any defined emoji it will appear as text.

 **Attachments** are fairly simple - you can attach any file to a post as long as the file is within maximum size limits. If you're uploading explicit material you can mark all of your attachments as sensitive (or add the `#nsfw` tag) - it will hide the images and videos behind a warning so that it won't be displayed instantly.
@ -42,7 +42,7 @@ A few things to consider about the security and usage of these scopes:
 - Changing scopes during a thread or adding people to a direct message will not retroactively make them see the whole conversation. If you add someone to a direct message conversation, they will not see the post that happened before they were mentioned.
 * **Reply-to** if you are replying to someone, your post will also contain a note that your post is referring to the post you're replying to. Person you're replying to will receive a notification *even* if you remove them from mentioned people. You won't receive notifications when replying to your own posts, but it's useful to reply to your own posts to provide people some context if it's a follow-up to a previous post. There's a small "Reply to ..." label under post author's name which you can hover on to see what post it's referring to.

-Sometimes you may encounter posts that seem different than what they are supposed to. For example, you might see a direct message without any mentions in the text. This can happen because internally, the Fediverse has a different addressing mechanism similar to email, with `to` and `cc` fields. While these are not directly accessible in PleromaFE, other software in the Fediverse might generate those posts. Do not worry in these cases, these are normal and not a bug.
+Sometimes you may encounter posts that seem different than what they are supposed to. For example, you might see a direct message without any mentions in the text. This can happen because internally, the Fediverse has a different addressing mechanism similar to email, with `to` and `cc` fields. While these are not directly accessible in Akkoma-FE, other software in the Fediverse might generate those posts. Do not worry in these cases, these are normal and not a bug.

 ## Rich text

@ -51,7 +51,7 @@ By default new posts you make are plaintext, meaning you can't make text **bold*
 Here is a small example of some text in markdown.

 ```
-This is an example of markdown text using **bold** and *cursive* text.  
+This is an example of markdown text using **bold** and *cursive* text.
 To get a newline we add two spaces at the end of the previous line.

 Let's also add a list
@ -65,6 +65,16 @@ If you set the input-method to Markdown, and post this, it will look something l

 ![example_markdown](../assets/example_markdown.png)

+## Misskey markdown
+
+Akkoma-FE includes support for writing and rendering
+misskey markdown (MFM). To write this you will need to select "MFM" from
+the content type dropdown (if supported), and then you can format text
+[in MFM](https://akkoma.dev/sfr/marked-mfm/src/branch/master/docs/syntax.md).
+
+To render MFM, you will need to turn on "Render Misskey Markdown" in
+the settings modal.
+
 ## Other actions

 In addition to posting you can also *favorite* posts also known as *liking* them and *repeat* posts (also known as *retweeting*, *boosting* and even *reprööting*). Favoriting a post increments a counter on it, notifies the post author of your affection towards that post and also adds that post to your "favorited" posts list (in your own profile, "Favorites" tab). Reprööting a post does all that and also repeats this post to your followers and your profile page with a note "*user* repeated post".
--- a/docs/docs/user_guide/settings.md
+++ b/docs/docs/user_guide/settings.md
@ -83,7 +83,7 @@ Here you can change your password, revoke access tokens, configure 2-factor auth

 ## Theme

-Here you can change the look and feel of Pleroma-FE. You can choose from several instance-provided presets and you can load one from file and save current theme to file. Before you apply new theme you can see what it will look like approximately in preview section.
+Here you can change the look and feel of Akkoma-FE. You can choose from several instance-provided presets and you can load one from file and save current theme to file. Before you apply new theme you can see what it will look like approximately in preview section.

 The themes engine was made to be easy to use while giving an option for powerful in-depth customization - you can just tweak colors on "Common" tab and leave everything else as is.

--- a/docs/docs/user_guide/timelines.md
+++ b/docs/docs/user_guide/timelines.md
@ -6,6 +6,7 @@ You have several timelines to browse trough
 - **Bookmarks** all the posts you've bookmarked. You can bookmark a post by clicking the three dots on the bottom right of the post and choose Bookmark.
 - **Direct Messages** all posts with `direct` scope addressed to you or mentioning you.
 - **Public Timelines** all public posts made by users on the instance you're on
+- **Bubble Timeline** all public posts from instances recommended by your admin(s) in the instance settings. This won't appear if they haven't set anything up for it.
 - **The Whole Known Network** also known as **TWKN** or **Federated Timeline** - all public posts known by your instance. Due to nature of the network your instance may not know *all* the posts on the network, so only posts known by your instance are shown there.

 Note that by default you will see all posts made by other users on your Home Timeline, this contrast behavior of Twitter and Mastodon, which shows you only non-reply posts and replies to people you follow. You can change said behavior in the [settings](settings.md#filtering).
--- a/docs/docs/user_guide/users_follow_mute_block.md
+++ b/docs/docs/user_guide/users_follow_mute_block.md
@ -4,7 +4,7 @@ When you see someone, you can click on their user picture to view their profile,

 **Following** is self-explanatory, it adds them to your Home Timeline, lists you as a follower and gives you access to follower-only posts if they have any.

-**Muting** collapses posts and notifications made by them, giving you an option to see the post if you're curious. Clients other than PleromaFE may completely remove their posts.
+**Muting** collapses posts and notifications made by them, giving you an option to see the post if you're curious. Clients other than Akkoma-FE may completely remove their posts.

 **Blocking** a user removes them from your timeline and notifications and prevents them from following you (automatically unfollows them from you).

--- a/docs/index.md
+++ b/docs/index.md
@ -1,8 +0,0 @@
-# Introduction to Pleroma-FE
-## What is Pleroma-FE?
-
-Pleroma-FE is the default user-facing frontend for Pleroma. It's user interface is modeled after Qvitter which is modeled after an older Twitter design. It provides a simple 2-column interface for microblogging. While being simple by default it also provides many powerful customization options.
-
-## How can I use it?
-
-If your instance uses Pleroma-FE, you can acces it by going to your instance (e.g. <https://pleroma.soykaf.com>). You can read more about it's basic functionality in the [Pleroma-FE User Guide](./user_guide/). We also have [a guide for administrators](./CONFIGURATION.md) and for [hackers/contributors](./HACKING.md).
--- a/docs/mkdocs.yml
+++ b/docs/mkdocs.yml
@ -0,0 +1,37 @@
+site_name: Akkoma-FE Documentation
+theme:
+  favicon: 'images/akkoma_logo_vector_bg_32.png'
+  name: 'material'
+  custom_dir: 'theme'
+  # Disable google fonts
+  font: false
+  logo: 'images/akkoma_logo_vector_nobg.svg'
+  features:
+    - tabs
+  palette:
+    primary: 'deep purple'
+    accent: 'blue grey'
+
+extra_css:
+  - css/extra.css
+repo_name: 'AkkomaGang/akkoma-fe'
+repo_url: 'https://akkoma.dev/AkkomaGang/akkoma-fe'
+
+extra:
+  repo_icon: gitea
+
+markdown_extensions:
+  # Note/warning blocks https://squidfunk.github.io/mkdocs-material/extensions/admonition/
+  - admonition
+  - codehilite:
+      guess_lang: false
+  # Make it possible to link to every header https://squidfunk.github.io/mkdocs-material/extensions/permalinks/
+  - toc:
+      permalink: true
+  - pymdownx.tasklist:
+      custom_checkbox: true
+  - pymdownx.superfences
+  - pymdownx.tabbed
+  - pymdownx.details
+  - markdown_include.include:
+      base_path: docs
--- a/docs/requirements.txt
+++ b/docs/requirements.txt
@ -0,0 +1,22 @@
+click==8.1.3
+ghp-import==2.1.0
+importlib-metadata==4.12.0
+Jinja2==3.1.2
+Markdown==3.3.7
+markdown-include==0.6.0
+MarkupSafe==2.1.1
+mergedeep==1.3.4
+mkdocs==1.3.0
+mkdocs-bootswatch==1.1
+mkdocs-material==8.1.8
+mkdocs-material-extensions==1.0.3
+packaging==21.3
+Pygments==2.11.2
+pymdown-extensions==9.1
+pyparsing==3.0.9
+python-dateutil==2.8.2
+PyYAML==6.0
+pyyaml_env_tag==0.1
+six==1.16.0
+watchdog==2.1.9
+zipp==3.8.0
--- a/docs/theme/partials/source.html
+++ b/docs/theme/partials/source.html
@ -0,0 +1,64 @@
+<!--
+  Copyright (c) 2016-2019 Martin Donath <martin.donath@squidfunk.com>
+
+  Permission is hereby granted, free of charge, to any person obtaining a copy
+  of this software and associated documentation files (the "Software"), to
+  deal in the Software without restriction, including without limitation the
+  rights to use, copy, modify, merge, publish, distribute, sublicense, and/or
+  sell copies of the Software, and to permit persons to whom the Software is
+  furnished to do so, subject to the following conditions:
+
+  The above copyright notice and this permission notice shall be included in
+  all copies or substantial portions of the Software.
+
+  THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
+  IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
+  FITNESS FOR A PARTICULAR PURPOSE AND NON-INFRINGEMENT. IN NO EVENT SHALL THE
+  AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
+  LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING
+  FROM, OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS
+  IN THE SOFTWARE.
+-->
+
+{% import "partials/language.html" as lang with context %}
+
+<!--
+  Check whether the repository is hosted on one of the supported code hosting
+  platforms (GitHub, GitLab or Bitbucket) to show icon.
+-->
+{% set platform = config.extra.repo_icon or config.repo_url %}
+{% if "github" in platform %}
+  {% set repo_type = "github" %}
+{% elif "gitlab" in platform %}
+  {% set repo_type = "gitlab" %}
+{% elif "bitbucket" in platform %}
+  {% set repo_type = "bitbucket" %}
+{% else %}
+  {% set repo_type = "" %}
+{% endif %}
+
+{% if page and page.url.startswith('backend') %}
+  {% set repo_url = "https://akkoma.dev/AkkomaGang/akkoma" %}
+  {% set repo_name = "AkkomaGang/akkoma" %}
+{% elif page and page.url.startswith('frontend') %}
+  {% set repo_url = "https://akkoma.dev/AkkomaGang/akkoma-fe" %}
+  {% set repo_name = "AkkomaGang/akkoma-fe" %}
+{% else %}
+  {% set repo_url = config.repo_url %}
+  {% set repo_name = config.repo_name %}
+{% endif %}
+
+<!-- Repository containing source -->
+<a href="{{ repo_url }}" title="{{ lang.t('source.link.title') }}"
+    class="md-source" data-md-source="{{ repo_type }}">
+  {% if repo_type %}
+    <div class="md-source__icon">
+      <svg viewBox="0 0 24 24" width="24" height="24">
+        <use xlink:href="#__{{ repo_type }}" width="24" height="24"></use>
+      </svg>
+    </div>
+  {% endif %}
+  <div class="md-source__repository">
+    {{ repo_name }}
+  </div>
+</a>
--- a/index.html
+++ b/index.html
@ -3,18 +3,20 @@
  <head>
    <meta charset="utf-8">
    <meta name="viewport" content="width=device-width, initial-scale=1,user-scalable=no">
-    <title>Pleroma</title>
-    <link rel="stylesheet" href="/static/font/css/fontello.css">
-    <link rel="stylesheet" href="/static/font/css/animation.css">
+    <title>Akkoma</title>
    <link rel="stylesheet" href="/static/font/tiresias.css">
    <link rel="stylesheet" href="/static/font/css/lato.css">
    <link rel="stylesheet" href="/static/mfm.css">
+    <link rel="stylesheet" href="/static/custom.css">
+    <link rel="stylesheet" href="/static/theme-holder.css" id="theme-holder">
    <!--server-generated-meta-->
    <link rel="icon" type="image/png" href="/favicon.png">
+    <link rel="manifest" href="/manifest.json">
  </head>
  <body class="hidden">
-    <noscript>To use Pleroma, please enable JavaScript.</noscript>
+    <noscript>To use Akkoma, please enable JavaScript.</noscript>
    <div id="app"></div>
+    <div id="modal"></div>
    <!-- built files will be auto injected -->
  </body>
 </html>
--- a/package.json
+++ b/package.json
@ -1,7 +1,7 @@
 {
  "name": "pleroma_fe",
-  "version": "1.0.0",
-  "description": "A Qvitter-style frontend for certain GS servers.",
+  "version": "3.11.0",
+  "description": "A frontend for Akkoma instances",
  "author": "Roger Braun <roger@rogerbraun.net>",
  "private": true,
  "scripts": {
@ -11,42 +11,44 @@
    "unit:watch": "karma start test/unit/karma.conf.js --single-run=false",
    "e2e": "node test/e2e/runner.js",
    "test": "npm run unit && npm run e2e",
-    "stylelint": "npx stylelint src/components/status/status.scss",
+    "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"
  },
  "dependencies": {
    "@babel/runtime": "7.17.8",
    "@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": "5.15.4",
-    "@fortawesome/free-solid-svg-icons": "5.15.4",
-    "@fortawesome/vue-fontawesome": "3.0.0-5",
-    "@kazvmoe-infra/pinch-zoom-element": "1.2.0",
-    "@vuelidate/core": "2.0.0-alpha.41",
-    "@vuelidate/validators": "2.0.0-alpha.27",
+    "@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",
+    "iso-639-1": "^2.1.15",
    "js-cookie": "^3.0.1",
    "localforage": "1.10.0",
-    "mfm-js": "^0.22.1",
-    "parse-link-header": "1.0.1",
+    "parse-link-header": "^2.0.0",
    "phoenix": "1.6.2",
    "punycode.js": "2.1.0",
    "qrcode": "1",
-    "ruffle-mirror": "2021.12.31",
+    "url": "^0.11.0",
    "vue": "^3.2.31",
-    "vue-i18n": "^9.2.0-beta.34",
+    "vue-i18n": "^9.2.2",
    "vue-router": "4.0.14",
    "vue-template-compiler": "2.6.11",
    "vuex": "4.0.2"
  },
  "devDependencies": {
    "@babel/core": "7.17.8",
+    "@babel/eslint-parser": "^7.19.1",
    "@babel/plugin-transform-runtime": "7.17.0",
    "@babel/preset-env": "7.16.11",
    "@babel/register": "7.17.7",
@ -55,36 +57,33 @@
    "@vue/babel-helper-vue-jsx-merge-props": "1.2.1",
    "@vue/babel-plugin-jsx": "1.1.1",
    "@vue/compiler-sfc": "^3.1.0",
-    "@vue/test-utils": "2.0.0-rc.17",
+    "@vue/test-utils": "^2.0.2",
    "autoprefixer": "6.7.7",
-    "babel-eslint": "7.2.3",
-    "babel-loader": "8.2.4",
+    "babel-loader": "^9.1.0",
    "babel-plugin-lodash": "3.3.4",
-    "chai": "3.5.0",
+    "chai": "^4.3.7",
    "chalk": "1.1.3",
-    "chromedriver": "87.0.7",
-    "connect-history-api-fallback": "1.6.0",
-    "copy-webpack-plugin": "6.4.1",
-    "cross-spawn": "4.0.2",
-    "css-loader": "0.28.11",
-    "custom-event-polyfill": "1.0.7",
-    "eslint": "5.16.0",
-    "eslint-config-standard": "12.0.0",
-    "eslint-friendly-formatter": "2.0.7",
-    "eslint-loader": "2.2.1",
-    "eslint-plugin-import": "2.25.4",
-    "eslint-plugin-node": "7.0.1",
-    "eslint-plugin-promise": "4.3.1",
-    "eslint-plugin-standard": "4.1.0",
-    "eslint-plugin-vue": "5.2.3",
+    "chromedriver": "^107.0.3",
+    "connect-history-api-fallback": "^2.0.0",
+    "cross-spawn": "^7.0.3",
+    "css-loader": "^6.7.2",
+    "custom-event-polyfill": "^1.0.7",
+    "eslint": "^7.32.0",
+    "eslint-config-standard": "^17.0.0",
+    "eslint-friendly-formatter": "^4.0.1",
+    "eslint-loader": "^4.0.2",
+    "eslint-plugin-import": "^2.26.0",
+    "eslint-plugin-node": "^11.1.0",
+    "eslint-plugin-promise": "^6.1.1",
+    "eslint-plugin-standard": "^5.0.0",
+    "eslint-plugin-vue": "^9.7.0",
    "eventsource-polyfill": "0.9.6",
    "express": "4.17.3",
-    "file-loader": "3.0.1",
+    "file-loader": "^6.2.0",
    "function-bind": "1.1.1",
-    "html-webpack-plugin": "3.2.0",
+    "html-webpack-plugin": "^5.5.0",
    "http-proxy-middleware": "0.21.0",
    "inject-loader": "2.0.1",
-    "iso-639-1": "2.1.13",
    "isparta-loader": "2.0.0",
    "json-loader": "0.5.7",
    "karma": "6.3.17",
@ -95,7 +94,7 @@
    "karma-sinon-chai": "2.0.2",
    "karma-sourcemap-loader": "0.3.8",
    "karma-spec-reporter": "0.0.33",
-    "karma-webpack": "4.0.2",
+    "karma-webpack": "^5.0.0",
    "lodash": "4.17.21",
    "lolex": "1.6.0",
    "mini-css-extract-plugin": "0.12.0",
@ -103,29 +102,33 @@
    "nightwatch": "0.9.21",
    "opn": "4.0.2",
    "ora": "0.4.1",
+    "postcss-html": "^1.5.0",
    "postcss-loader": "3.0.0",
+    "postcss-sass": "^0.5.0",
    "raw-loader": "0.5.1",
-    "sass": "1.20.1",
-    "sass-loader": "7.2.0",
+    "sass": "^1.56.0",
+    "sass-loader": "^13.2.0",
    "selenium-server": "2.53.1",
    "semver": "5.7.1",
-    "serviceworker-webpack-plugin": "1.0.1",
    "shelljs": "0.8.5",
    "sinon": "2.4.1",
    "sinon-chai": "2.14.0",
-    "stylelint": "13.6.1",
-    "stylelint-config-standard": "20.0.0",
-    "stylelint-rscss": "0.4.0",
-    "url-loader": "1.1.2",
-    "vue-loader": "^16.0.0",
-    "vue-style-loader": "4.1.2",
-    "webpack": "4.46.0",
-    "webpack-dev-middleware": "3.7.3",
-    "webpack-hot-middleware": "2.24.3",
-    "webpack-merge": "0.20.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"
  },
  "engines": {
-    "node": ">= 4.0.0",
+    "node": ">= 16.0.0",
    "npm": ">= 3.0.0"
  }
 }
--- a/src/App.js
+++ b/src/App.js
@ -3,15 +3,17 @@ import NavPanel from './components/nav_panel/nav_panel.vue'
 import InstanceSpecificPanel from './components/instance_specific_panel/instance_specific_panel.vue'
 import FeaturesPanel from './components/features_panel/features_panel.vue'
 import WhoToFollowPanel from './components/who_to_follow_panel/who_to_follow_panel.vue'
-import ShoutPanel from './components/shout_panel/shout_panel.vue'
 import SettingsModal from './components/settings_modal/settings_modal.vue'
 import MediaModal from './components/media_modal/media_modal.vue'
+import ModModal from './components/mod_modal/mod_modal.vue'
 import SideDrawer from './components/side_drawer/side_drawer.vue'
 import MobilePostStatusButton from './components/mobile_post_status_button/mobile_post_status_button.vue'
 import MobileNav from './components/mobile_nav/mobile_nav.vue'
 import DesktopNav from './components/desktop_nav/desktop_nav.vue'
 import UserReportingModal from './components/user_reporting_modal/user_reporting_modal.vue'
+import EditStatusModal from './components/edit_status_modal/edit_status_modal.vue'
 import PostStatusModal from './components/post_status_modal/post_status_modal.vue'
+import StatusHistoryModal from './components/status_history_modal/status_history_modal.vue'
 import GlobalNoticeList from './components/global_notice_list/global_notice_list.vue'
 import { windowWidth, windowHeight } from './services/window_utils/window_utils'
 import { mapGetters } from 'vuex'
@ -26,15 +28,17 @@ export default {
    InstanceSpecificPanel,
    FeaturesPanel,
    WhoToFollowPanel,
-    ShoutPanel,
    MediaModal,
    SideDrawer,
    MobilePostStatusButton,
    MobileNav,
    DesktopNav,
    SettingsModal,
+    ModModal,
    UserReportingModal,
    PostStatusModal,
+    EditStatusModal,
+    StatusHistoryModal,
    GlobalNoticeList
  },
  data: () => ({
@ -60,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 () {
@ -67,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 {
@ -75,27 +84,17 @@ export default {
        }
      }
    },
-    shout () { return this.$store.state.shout.joined },
    suggestionsEnabled () { return this.$store.state.instance.suggestionsEnabled },
    showInstanceSpecificPanel () {
      return this.$store.state.instance.showInstanceSpecificPanel &&
        !this.$store.getters.mergedConfig.hideISP &&
        this.$store.state.instance.instanceSpecificPanelContent
    },
-    isChats () {
-      return this.$route.name === 'chat' || this.$route.name === 'chats'
-    },
    newPostButtonShown () {
-      if (this.isChats) return false
      return this.$store.getters.mergedConfig.alwaysShowNewPostButton || this.layoutType === 'mobile'
    },
    showFeaturesPanel () { return this.$store.state.instance.showFeaturesPanel },
-    shoutboxPosition () {
-      return this.$store.getters.mergedConfig.alwaysShowNewPostButton || false
-    },
-    hideShoutbox () {
-      return this.$store.getters.mergedConfig.hideShoutbox
-    },
+    editingAvailable () { return this.$store.state.instance.editingAvailable },
    layoutType () { return this.$store.state.interface.layoutType },
    privateMode () { return this.$store.state.instance.private },
    reverseLayout () {
--- a/src/App.scss
+++ b/src/App.scss
@ -1,13 +1,14 @@
 // stylelint-disable rscss/class-format
@import './_variables.scss';
-
+@import '@fortawesome/fontawesome-svg-core/styles.css';
+@import '@floatingghost/pinch-zoom-element/dist/pinch-zoom.css';
 :root {
  --navbar-height: 3.5rem;
  --post-line-height: 1.4;
 }

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

@ -310,7 +311,6 @@ nav {
      border-top-right-radius: 0;
    }

-    .underlay,
    #sidebar,
    #notifs-column {
      display: none;
@ -469,7 +469,7 @@ textarea,
  color: $fallback--lightText;
  color: var(--inputText, $fallback--lightText);
  font-family: sans-serif;
-  font-family: var(--inputFont, sans-serif);
+  font-family: var(--interfaceFont, sans-serif);
  font-size: 1em;
  margin: 0;
  box-sizing: border-box;
--- a/src/App.vue
+++ b/src/App.vue
@ -33,7 +33,7 @@
      <div
        id="main-scroller"
        class="column main"
-        :class="{ '-full-height': isChats }"
+        :class="{ '-full-height': false }"
      >
        <div
          v-if="!currentUser"
@ -55,17 +55,13 @@
      />
    </div>
    <media-modal />
-    <shout-panel
-      v-if="currentUser && shout && !hideShoutbox"
-      :floating="true"
-      class="floating-shout mobile-hidden"
-      :class="{ '-left': shoutboxPosition }"
-    />
    <MobilePostStatusButton />
    <UserReportingModal />
    <PostStatusModal />
+    <EditStatusModal v-if="editingAvailable" />
+    <StatusHistoryModal v-if="editingAvailable" />
    <SettingsModal />
-    <div id="modal" />
+    <ModModal />
    <GlobalNoticeList />
  </div>
 </template>
--- a/src/_variables.scss
+++ b/src/_variables.scss
@ -27,7 +27,6 @@ $fallback--tooltipRadius: 5px;
 $fallback--avatarRadius: 4px;
 $fallback--avatarAltRadius: 10px;
 $fallback--attachmentRadius: 10px;
-$fallback--chatMessageRadius: 10px;

 $fallback--buttonShadow: 0px 0px 2px 0px rgba(0, 0, 0, 1), 0px 1px 0px 0px rgba(255, 255, 255, 0.2) inset, 0px -1px 0px 0px rgba(0, 0, 0, 0.2) inset;

--- a/src/assets/nsfw.png
+++ b/src/assets/nsfw.png
--- a/src/boot/after_store.js
+++ b/src/boot/after_store.js
@ -1,8 +1,11 @@
+import Cookies from 'js-cookie'
 import { createApp } from 'vue'
 import { createRouter, createWebHistory } from 'vue-router'
 import vClickOutside from 'click-outside-vue3'

 import { FontAwesomeIcon, FontAwesomeLayers } from '@fortawesome/vue-fontawesome'
+import { config } from '@fortawesome/fontawesome-svg-core';
+config.autoAddCss = false

 import App from '../App.vue'
 import routes from './routes'
@ -48,6 +51,20 @@ const preloadFetch = async (request) => {
  }
 }

+const resolveLanguage = (instanceLanguages) => {
+  // First language in navigator.languages that is listed as an instance language
+  // falls back to first instance language
+  const navigatorLanguages = navigator.languages.map((x) => x.split('-')[0])
+
+  for (const navLanguage of navigatorLanguages) {
+    if (instanceLanguages.includes(navLanguage)) {
+      return navLanguage
+    }
+  }
+
+  return instanceLanguages[0]
+}
+
 const getInstanceConfig = async ({ store }) => {
  try {
    const res = await preloadFetch('/api/v1/instance')
@ -58,6 +75,10 @@ const getInstanceConfig = async ({ store }) => {

      store.dispatch('setInstanceOption', { name: 'textlimit', value: textlimit })
      store.dispatch('setInstanceOption', { name: 'accountApprovalRequired', value: data.approval_required })
+      // don't override cookie if set
+      if (!Cookies.get('userLanguage')) {
+        store.dispatch('setOption', { name: 'interfaceLanguage', value: resolveLanguage(data.languages) })
+      }

      if (vapidPublicKey) {
        store.dispatch('setInstanceOption', { name: 'vapidPublicKey', value: vapidPublicKey })
@ -124,7 +145,14 @@ const setSettings = async ({ apiConfig, staticConfig, store }) => {
  copyInstanceOption('hideBotIndication')
  copyInstanceOption('hideUserStats')
  copyInstanceOption('hideFilteredStatuses')
+  copyInstanceOption('hideSiteName')
+  copyInstanceOption('hideSiteFavicon')
+  copyInstanceOption('showWiderShortcuts')
+  copyInstanceOption('showNavShortcuts')
+  copyInstanceOption('showPanelNavShortcuts')
+  copyInstanceOption('stopGifs')
  copyInstanceOption('logo')
+  copyInstanceOption('conversationDisplay')

  store.dispatch('setInstanceOption', {
    name: 'logoMask',
@ -145,15 +173,14 @@ const setSettings = async ({ apiConfig, staticConfig, store }) => {
  copyInstanceOption('redirectRootNoLogin')
  copyInstanceOption('redirectRootLogin')
  copyInstanceOption('showInstanceSpecificPanel')
-  copyInstanceOption('minimalScopesMode')
  copyInstanceOption('hideMutedPosts')
  copyInstanceOption('collapseMessageWithSubject')
-  copyInstanceOption('scopeCopy')
  copyInstanceOption('subjectLineBehavior')
  copyInstanceOption('postContentType')
  copyInstanceOption('alwaysShowSubjectInput')
  copyInstanceOption('showFeaturesPanel')
  copyInstanceOption('hideSitename')
+  copyInstanceOption('renderMisskeyMarkdown')
  copyInstanceOption('sidebarRight')

  return store.dispatch('setTheme', config['theme'])
@ -247,12 +274,11 @@ const getNodeInfo = async ({ store }) => {
      store.dispatch('setInstanceOption', { name: 'registrationOpen', value: data.openRegistrations })
      store.dispatch('setInstanceOption', { name: 'mediaProxyAvailable', value: features.includes('media_proxy') })
      store.dispatch('setInstanceOption', { name: 'safeDM', value: features.includes('safe_dm_mentions') })
-      store.dispatch('setInstanceOption', { name: 'shoutAvailable', value: features.includes('chat') })
-      store.dispatch('setInstanceOption', { name: 'pleromaChatMessagesAvailable', value: features.includes('pleroma_chat_messages') })
-      store.dispatch('setInstanceOption', { name: 'gopherAvailable', value: features.includes('gopher') })
      store.dispatch('setInstanceOption', { name: 'pollsAvailable', value: features.includes('polls') })
+      store.dispatch('setInstanceOption', { name: 'editingAvailable', value: features.includes('editing') })
      store.dispatch('setInstanceOption', { name: 'pollLimits', value: metadata.pollLimits })
      store.dispatch('setInstanceOption', { name: 'mailerEnabled', value: metadata.mailerEnabled })
+      store.dispatch('setInstanceOption', { name: 'translationEnabled', value: features.includes('akkoma:machine_translation') })

      const uploadLimits = metadata.uploadLimits
      store.dispatch('setInstanceOption', { name: 'uploadlimit', value: parseInt(uploadLimits.general) })
@ -288,6 +314,7 @@ const getNodeInfo = async ({ store }) => {
      })

      store.dispatch('setInstanceOption', { name: 'federationPolicy', value: federation })
+      store.dispatch('setInstanceOption', { name: 'localBubbleInstances', value: metadata.localBubbleInstances })
      store.dispatch('setInstanceOption', {
        name: 'federating',
        value: typeof federation.enabled === 'undefined'
@ -295,6 +322,9 @@ const getNodeInfo = async ({ store }) => {
          : federation.enabled
      })

+      store.dispatch('setInstanceOption', { name: 'publicTimelineVisibility', value: metadata.publicTimelineVisibility })
+      store.dispatch('setInstanceOption', { name: 'federatedTimelineAvailable', value: metadata.federatedTimelineAvailable })
+
      const accountActivationRequired = metadata.accountActivationRequired
      store.dispatch('setInstanceOption', { name: 'accountActivationRequired', value: accountActivationRequired })

@ -369,7 +399,6 @@ const afterStoreSetup = async ({ store, i18n }) => {
  ])

  // Start fetching things that don't need to block the UI
-  store.dispatch('fetchMutes')
  getTOS({ store })
  getStickers({ store })

@ -378,8 +407,9 @@ const afterStoreSetup = async ({ store, i18n }) => {
    routes: routes(store),
    scrollBehavior: (to, _from, savedPosition) => {
      if (to.matched.some(m => m.meta.dontScroll)) {
-        return false
+        return {}
      }
+
      return savedPosition || { left: 0, top: 0 }
    }
  })
--- a/src/boot/routes.js
+++ b/src/boot/routes.js
@ -2,12 +2,11 @@ import PublicTimeline from 'components/public_timeline/public_timeline.vue'
 import PublicAndExternalTimeline from 'components/public_and_external_timeline/public_and_external_timeline.vue'
 import FriendsTimeline from 'components/friends_timeline/friends_timeline.vue'
 import TagTimeline from 'components/tag_timeline/tag_timeline.vue'
+import BubbleTimeline from 'components/bubble_timeline/bubble_timeline.vue'
 import BookmarkTimeline from 'components/bookmark_timeline/bookmark_timeline.vue'
 import ConversationPage from 'components/conversation-page/conversation-page.vue'
 import Interactions from 'components/interactions/interactions.vue'
 import DMs from 'components/dm_timeline/dm_timeline.vue'
-import ChatList from 'components/chat_list/chat_list.vue'
-import Chat from 'components/chat/chat.vue'
 import UserProfile from 'components/user_profile/user_profile.vue'
 import Search from 'components/search/search.vue'
 import Registration from 'components/registration/registration.vue'
@ -16,13 +15,15 @@ import FollowRequests from 'components/follow_requests/follow_requests.vue'
 import OAuthCallback from 'components/oauth_callback/oauth_callback.vue'
 import Notifications from 'components/notifications/notifications.vue'
 import AuthForm from 'components/auth_form/auth_form.js'
-import ShoutPanel from 'components/shout_panel/shout_panel.vue'
 import WhoToFollow from 'components/who_to_follow/who_to_follow.vue'
 import About from 'components/about/about.vue'
 import RemoteUserResolver from 'components/remote_user_resolver/remote_user_resolver.vue'
 import Lists from 'components/lists/lists.vue'
 import ListTimeline from 'components/list_timeline/list_timeline.vue'
 import ListEdit from 'components/list_edit/list_edit.vue'
+import AnnouncementsPage from 'components/announcements_page/announcements_page.vue'
+import RegistrationRequestSent from 'components/registration_request_sent/registration_request_sent.vue'
+import AwaitingEmailConfirmation from 'components/awaiting_email_confirmation/awaiting_email_confirmation.vue'

 export default (store) => {
  const validateAuthenticatedRoute = (to, from, next) => {
@ -44,6 +45,7 @@ export default (store) => {
    },
    { name: 'public-external-timeline', path: '/main/all', component: PublicAndExternalTimeline },
    { name: 'public-timeline', path: '/main/public', component: PublicTimeline },
+    { name: 'bubble-timeline', path: '/main/bubble', component: BubbleTimeline },
    { name: 'friends', path: '/main/friends', component: FriendsTimeline, beforeEnter: validateAuthenticatedRoute },
    { name: 'tag-timeline', path: '/tag/:tag', component: TagTimeline },
    { name: 'bookmarks', path: '/bookmarks', component: BookmarkTimeline },
@ -58,32 +60,27 @@ export default (store) => {
      component: RemoteUserResolver,
      beforeEnter: validateAuthenticatedRoute
    },
-    { name: 'external-user-profile', path: '/users/:id', component: UserProfile },
+    { name: 'external-user-profile', path: '/users/:id', component: UserProfile, meta: { dontScroll: true } },
    { name: 'interactions', path: '/users/:username/interactions', component: Interactions, beforeEnter: validateAuthenticatedRoute },
    { name: 'dms', path: '/users/:username/dms', component: DMs, beforeEnter: validateAuthenticatedRoute },
    { name: 'registration', path: '/registration', component: Registration },
+    { name: 'registration-request-sent', path: '/registration-request-sent', component: RegistrationRequestSent },
+    { name: 'awaiting-email-confirmation', path: '/awaiting-email-confirmation', component: AwaitingEmailConfirmation },
    { name: 'password-reset', path: '/password-reset', component: PasswordReset, props: true },
    { name: 'registration-token', path: '/registration/:token', component: Registration },
    { name: 'friend-requests', path: '/friend-requests', component: FollowRequests, beforeEnter: validateAuthenticatedRoute },
    { name: 'notifications', path: '/:username/notifications', component: Notifications, props: () => ({ disableTeleport: true }), beforeEnter: validateAuthenticatedRoute },
    { name: 'login', path: '/login', component: AuthForm },
-    { name: 'shout-panel', path: '/shout-panel', component: ShoutPanel, props: () => ({ floating: false }) },
    { name: 'oauth-callback', path: '/oauth-callback', component: OAuthCallback, props: (route) => ({ code: route.query.code }) },
    { name: 'search', path: '/search', component: Search, props: (route) => ({ query: route.query.query }) },
    { name: 'who-to-follow', path: '/who-to-follow', component: WhoToFollow, beforeEnter: validateAuthenticatedRoute },
    { name: 'about', path: '/about', component: About },
-    { name: 'user-profile', path: '/:_(users)?/:name', component: UserProfile },
    { name: 'lists', path: '/lists', component: Lists },
    { name: 'list-timeline', path: '/lists/:id', component: ListTimeline },
-    { name: 'list-edit', path: '/lists/:id/edit', component: ListEdit }
+    { name: 'list-edit', path: '/lists/:id/edit', component: ListEdit },
+    { name: 'announcements', path: '/announcements', component: AnnouncementsPage },
+    { name: 'user-profile', path: '/:_(users)?/:name', component: UserProfile, meta: { dontScroll: true } }
  ]

-  if (store.state.instance.pleromaChatMessagesAvailable) {
-    routes = routes.concat([
-      { name: 'chat', path: '/users/:username/chats/:recipient_id', component: Chat, meta: { dontScroll: false }, beforeEnter: validateAuthenticatedRoute },
-      { name: 'chats', path: '/users/:username/chats', component: ChatList, meta: { dontScroll: false }, beforeEnter: validateAuthenticatedRoute }
-    ])
-  }
-
  return routes
 }
--- a/src/components/about/about.js
+++ b/src/components/about/about.js
@ -3,6 +3,7 @@ import FeaturesPanel from '../features_panel/features_panel.vue'
 import TermsOfServicePanel from '../terms_of_service_panel/terms_of_service_panel.vue'
 import StaffPanel from '../staff_panel/staff_panel.vue'
 import MRFTransparencyPanel from '../mrf_transparency_panel/mrf_transparency_panel.vue'
+import LocalBubblePanel from '../local_bubble_panel/local_bubble_panel.vue'

 const About = {
  components: {
@ -10,7 +11,8 @@ const About = {
    FeaturesPanel,
    TermsOfServicePanel,
    StaffPanel,
-    MRFTransparencyPanel
+    MRFTransparencyPanel,
+    LocalBubblePanel
  },
  computed: {
    showFeaturesPanel () { return this.$store.state.instance.showFeaturesPanel },
@ -18,6 +20,9 @@ const About = {
      return this.$store.state.instance.showInstanceSpecificPanel &&
        !this.$store.getters.mergedConfig.hideISP &&
        this.$store.state.instance.instanceSpecificPanelContent
+    },
+    showLocalBubblePanel () {
+      return this.$store.state.instance.localBubbleInstances.length > 0
    }
  }
 }
--- a/src/components/about/about.vue
+++ b/src/components/about/about.vue
@ -3,6 +3,7 @@
    <instance-specific-panel v-if="showInstanceSpecificPanel" />
    <staff-panel />
    <terms-of-service-panel />
+    <LocalBubblePanel v-if="showLocalBubblePanel" />
    <MRFTransparencyPanel />
    <features-panel v-if="showFeaturesPanel" />
  </div>
--- a/src/components/account_actions/account_actions.js
+++ b/src/components/account_actions/account_actions.js
@ -1,7 +1,8 @@
-import { mapState } from 'vuex'
 import ProgressButton from '../progress_button/progress_button.vue'
 import Popover from '../popover/popover.vue'
+import ConfirmModal from '../confirm_modal/confirm_modal.vue'
 import { library } from '@fortawesome/fontawesome-svg-core'
+import { mapState } from 'vuex'
 import {
  faEllipsisV
 } from '@fortawesome/free-solid-svg-icons'
@ -15,13 +16,25 @@ const AccountActions = {
    'user', 'relationship'
  ],
  data () {
-    return { }
+    return {
+      showingConfirmBlock: false
+    }
  },
  components: {
    ProgressButton,
-    Popover
+    Popover,
+    ConfirmModal
  },
  methods: {
+    refetchRelationship () {
+      return this.$store.dispatch('fetchUserRelationship', this.user.id)
+    },
+    showConfirmBlock () {
+      this.showingConfirmBlock = true
+    },
+    hideConfirmBlock () {
+      this.showingConfirmBlock = false
+    },
    showRepeats () {
      this.$store.dispatch('showReblogs', this.user.id)
    },
@ -29,22 +42,38 @@ const AccountActions = {
      this.$store.dispatch('hideReblogs', this.user.id)
    },
    blockUser () {
+      if (!this.shouldConfirmBlock) {
+        this.doBlockUser()
+      } else {
+        this.showConfirmBlock()
+      }
+    },
+    doBlockUser () {
      this.$store.dispatch('blockUser', this.user.id)
+      this.hideConfirmBlock()
    },
    unblockUser () {
      this.$store.dispatch('unblockUser', this.user.id)
    },
+    removeUserFromFollowers () {
+      this.$store.dispatch('removeUserFromFollowers', this.user.id)
+    },
    reportUser () {
      this.$store.dispatch('openUserReportingModal', { userId: this.user.id })
    },
-    openChat () {
-      this.$router.push({
-        name: 'chat',
-        params: { username: this.$store.state.users.currentUser.screen_name, recipient_id: this.user.id }
-      })
+    muteDomain () {
+      this.$store.dispatch('muteDomain', this.user.screen_name.split('@')[1])
+        .then(() => this.refetchRelationship())
+    },
+    unmuteDomain () {
+      this.$store.dispatch('unmuteDomain', this.user.screen_name.split('@')[1])
+        .then(() => this.refetchRelationship())
    }
  },
  computed: {
+    shouldConfirmBlock () {
+      return this.$store.getters.mergedConfig.modalOnBlock
+    },
    ...mapState({
      pleromaChatMessagesAvailable: state => state.instance.pleromaChatMessagesAvailable
    })
--- a/src/components/account_actions/account_actions.vue
+++ b/src/components/account_actions/account_actions.vue
@ -28,6 +28,13 @@
              class="dropdown-divider"
            />
          </template>
+          <button
+            v-if="relationship.followed_by"
+            class="btn button-default btn-block dropdown-item"
+            @click="removeUserFromFollowers"
+          >
+            {{ $t('user_card.remove_follower') }}
+          </button>
          <button
            v-if="relationship.blocking"
            class="btn button-default btn-block dropdown-item"
@ -49,11 +56,18 @@
            {{ $t('user_card.report') }}
          </button>
          <button
-            v-if="pleromaChatMessagesAvailable"
+            v-if="relationship.domain_blocking"
            class="btn button-default btn-block dropdown-item"
-            @click="openChat"
+            @click="unmuteDomain"
          >
-            {{ $t('user_card.message') }}
+            {{ $t('user_card.domain_muted') }}
+          </button>
+          <button
+            v-else-if="!user.is_local"
+            class="btn button-default btn-block dropdown-item"
+            @click="muteDomain"
+          >
+            {{ $t('user_card.mute_domain') }}
          </button>
        </div>
      </template>
@ -66,6 +80,27 @@
        </button>
      </template>
    </Popover>
+    <teleport to="#modal">
+      <confirm-modal
+        v-if="showingConfirmBlock"
+        :title="$t('user_card.block_confirm_title')"
+        :confirm-text="$t('user_card.block_confirm_accept_button')"
+        :cancel-text="$t('user_card.block_confirm_cancel_button')"
+        @accepted="doBlockUser"
+        @cancelled="hideConfirmBlock"
+      >
+        <i18n-t
+          keypath="user_card.block_confirm"
+          tag="span"
+        >
+          <template v-slot:user>
+            <span
+              v-text="user.screen_name_ui"
+            />
+          </template>
+        </i18n-t>
+      </confirm-modal>
+    </teleport>
  </div>
 </template>

--- a/src/components/announcement/announcement.js
+++ b/src/components/announcement/announcement.js
@ -0,0 +1,105 @@
+import { mapState } from 'vuex'
+import AnnouncementEditor from '../announcement_editor/announcement_editor.vue'
+import RichContent from '../rich_content/rich_content.jsx'
+import localeService from '../../services/locale/locale.service.js'
+
+const Announcement = {
+  components: {
+    AnnouncementEditor,
+    RichContent
+  },
+  data () {
+    return {
+      editing: false,
+      editedAnnouncement: {
+        content: '',
+        startsAt: undefined,
+        endsAt: undefined,
+        allDay: undefined
+      },
+      editError: ''
+    }
+  },
+  props: {
+    announcement: Object
+  },
+  computed: {
+    ...mapState({
+      currentUser: state => state.users.currentUser
+    }),
+    content () {
+      return this.announcement.content
+    },
+    isRead () {
+      return this.announcement.read
+    },
+    publishedAt () {
+      const time = this.announcement['published_at']
+      if (!time) {
+        return
+      }
+
+      return this.formatTimeOrDate(time, localeService.internalToBrowserLocale(this.$i18n.locale))
+    },
+    startsAt () {
+      const time = this.announcement['starts_at']
+      if (!time) {
+        return
+      }
+
+      return this.formatTimeOrDate(time, localeService.internalToBrowserLocale(this.$i18n.locale))
+    },
+    endsAt () {
+      const time = this.announcement['ends_at']
+      if (!time) {
+        return
+      }
+
+      return this.formatTimeOrDate(time, localeService.internalToBrowserLocale(this.$i18n.locale))
+    },
+    inactive () {
+      return this.announcement.inactive
+    }
+  },
+  methods: {
+    markAsRead () {
+      if (!this.isRead) {
+        return this.$store.dispatch('markAnnouncementAsRead', this.announcement.id)
+      }
+    },
+    deleteAnnouncement () {
+      return this.$store.dispatch('deleteAnnouncement', this.announcement.id)
+    },
+    formatTimeOrDate (time, locale) {
+      const d = new Date(time)
+      return this.announcement['all_day'] ? d.toLocaleDateString(locale) : d.toLocaleString(locale)
+    },
+    enterEditMode () {
+      this.editedAnnouncement.content = this.announcement.pleroma['raw_content']
+      this.editedAnnouncement.startsAt = this.announcement['starts_at']
+      this.editedAnnouncement.endsAt = this.announcement['ends_at']
+      this.editedAnnouncement.allDay = this.announcement['all_day']
+      this.editing = true
+    },
+    submitEdit () {
+      this.$store.dispatch('editAnnouncement', {
+        id: this.announcement.id,
+        ...this.editedAnnouncement
+      })
+        .then(() => {
+          this.editing = false
+        })
+        .catch(error => {
+          this.editError = error.error
+        })
+    },
+    cancelEdit () {
+      this.editing = false
+    },
+    clearError () {
+      this.editError = undefined
+    }
+  }
+}
+
+export default Announcement
--- a/src/components/announcement/announcement.vue
+++ b/src/components/announcement/announcement.vue
@ -0,0 +1,136 @@
+<template>
+  <div class="announcement">
+    <div class="heading">
+      <h4>{{ $t('announcements.title') }}</h4>
+    </div>
+    <div class="body">
+      <rich-content
+        v-if="!editing"
+        :html="content"
+        :emoji="announcement.emojis"
+        :handle-links="true"
+      />
+      <announcement-editor
+        v-else
+        :announcement="editedAnnouncement"
+      />
+    </div>
+    <div class="footer">
+      <div
+        v-if="!editing"
+        class="times"
+      >
+        <span v-if="publishedAt">
+          {{ $t('announcements.published_time_display', { time: publishedAt }) }}
+        </span>
+        <span v-if="startsAt">
+          {{ $t('announcements.start_time_display', { time: startsAt }) }}
+        </span>
+        <span v-if="endsAt">
+          {{ $t('announcements.end_time_display', { time: endsAt }) }}
+        </span>
+      </div>
+      <div
+        v-if="!editing"
+        class="actions"
+      >
+        <button
+          v-if="currentUser"
+          class="btn button-default"
+          :class="{ toggled: isRead }"
+          :disabled="inactive"
+          :title="inactive ? $t('announcements.inactive_message') : ''"
+          @click="markAsRead"
+        >
+          {{ $t('announcements.mark_as_read_action') }}
+        </button>
+        <button
+          v-if="currentUser && currentUser.role === 'admin'"
+          class="btn button-default"
+          @click="enterEditMode"
+        >
+          {{ $t('announcements.edit_action') }}
+        </button>
+        <button
+          v-if="currentUser && currentUser.role === 'admin'"
+          class="btn button-default"
+          @click="deleteAnnouncement"
+        >
+          {{ $t('announcements.delete_action') }}
+        </button>
+      </div>
+      <div
+        v-else
+        class="actions"
+      >
+        <button
+          class="btn button-default"
+          @click="submitEdit"
+        >
+          {{ $t('announcements.submit_edit_action') }}
+        </button>
+        <button
+          class="btn button-default"
+          @click="cancelEdit"
+        >
+          {{ $t('announcements.cancel_edit_action') }}
+        </button>
+        <div
+          v-if="editing && editError"
+          class="alert error"
+        >
+          {{ $t('announcements.edit_error', { error }) }}
+          <button
+            class="button-unstyled"
+            @click="clearError"
+          >
+            <FAIcon
+              class="fa-scale-110 fa-old-padding"
+              icon="times"
+              :title="$t('announcements.close_error')"
+            />
+          </button>
+        </div>
+      </div>
+    </div>
+  </div>
+</template>
+
+<script src="./announcement.js"></script>
+
+<style lang="scss">
+@import "../../variables";
+
+.announcement {
+  border-bottom-width: 1px;
+  border-bottom-style: solid;
+  border-bottom-color: var(--border, $fallback--border);
+  border-radius: 0;
+  padding: var(--status-margin, $status-margin);
+
+  .heading, .body {
+    margin-bottom: var(--status-margin, $status-margin);
+  }
+
+  .footer {
+    display: flex;
+    flex-direction: column;
+    .times {
+      display: flex;
+      flex-direction: column;
+    }
+  }
+
+  .footer .actions {
+    display: flex;
+    flex-direction: row;
+    justify-content: space-evenly;
+
+    .btn {
+      flex: 1;
+      margin: 1em;
+      max-width: 10em;
+    }
+  }
+}
+</style>
--- a/src/components/announcement_editor/announcement_editor.js
+++ b/src/components/announcement_editor/announcement_editor.js
@ -0,0 +1,13 @@
+import Checkbox from '../checkbox/checkbox.vue'
+
+const AnnouncementEditor = {
+  components: {
+    Checkbox
+  },
+  props: {
+    announcement: Object,
+    disabled: Boolean
+  }
+}
+
+export default AnnouncementEditor
--- a/src/components/announcement_editor/announcement_editor.vue
+++ b/src/components/announcement_editor/announcement_editor.vue
@ -0,0 +1,60 @@
+<template>
+  <div class="announcement-editor">
+    <textarea
+      ref="textarea"
+      v-model="announcement.content"
+      class="post-textarea"
+      rows="1"
+      cols="1"
+      :placeholder="$t('announcements.post_placeholder')"
+      :disabled="disabled"
+    />
+    <span class="announcement-metadata">
+      <label for="announcement-start-time">{{ $t('announcements.start_time_prompt') }}</label>
+      <input
+        id="announcement-start-time"
+        v-model="announcement.startsAt"
+        :type="announcement.allDay ? 'date' : 'datetime-local'"
+        :disabled="disabled"
+      >
+    </span>
+    <span class="announcement-metadata">
+      <label for="announcement-end-time">{{ $t('announcements.end_time_prompt') }}</label>
+      <input
+        id="announcement-end-time"
+        v-model="announcement.endsAt"
+        :type="announcement.allDay ? 'date' : 'datetime-local'"
+        :disabled="disabled"
+      >
+    </span>
+    <span class="announcement-metadata">
+      <Checkbox
+        id="announcement-all-day"
+        v-model="announcement.allDay"
+        :disabled="disabled"
+      />
+      <label for="announcement-all-day">{{ $t('announcements.all_day_prompt') }}</label>
+    </span>
+  </div>
+</template>
+
+<script src="./announcement_editor.js"></script>
+
+<style lang="scss">
+.announcement-editor {
+  display: flex;
+  align-items: stretch;
+  flex-direction: column;
+
+  .announcement-metadata {
+    margin-top: 0.5em;
+  }
+
+  .post-textarea {
+    resize: vertical;
+    height: 10em;
+    overflow: none;
+    box-sizing: content-box;
+  }
+}
+</style>
--- a/src/components/announcements_page/announcements_page.js
+++ b/src/components/announcements_page/announcements_page.js
@ -0,0 +1,55 @@
+import { mapState } from 'vuex'
+import Announcement from '../announcement/announcement.vue'
+import AnnouncementEditor from '../announcement_editor/announcement_editor.vue'
+
+const AnnouncementsPage = {
+  components: {
+    Announcement,
+    AnnouncementEditor
+  },
+  data () {
+    return {
+      newAnnouncement: {
+        content: '',
+        startsAt: undefined,
+        endsAt: undefined,
+        allDay: false
+      },
+      posting: false,
+      error: undefined
+    }
+  },
+  mounted () {
+    this.$store.dispatch('fetchAnnouncements')
+  },
+  computed: {
+    ...mapState({
+      currentUser: state => state.users.currentUser
+    }),
+    announcements () {
+      return this.$store.state.announcements.announcements
+    }
+  },
+  methods: {
+    postAnnouncement () {
+      this.posting = true
+      this.$store.dispatch('postAnnouncement', this.newAnnouncement)
+        .then(() => {
+          this.newAnnouncement.content = ''
+          this.startsAt = undefined
+          this.endsAt = undefined
+        })
+        .catch(error => {
+          this.error = error.error
+        })
+        .finally(() => {
+          this.posting = false
+        })
+    },
+    clearError () {
+      this.error = undefined
+    }
+  }
+}
+
+export default AnnouncementsPage
--- a/src/components/announcements_page/announcements_page.vue
+++ b/src/components/announcements_page/announcements_page.vue
@ -0,0 +1,79 @@
+<template>
+  <div class="panel panel-default announcements-page">
+    <div class="panel-heading">
+      <div class="title">
+        {{ $t('announcements.page_header') }}
+      </div>
+    </div>
+    <div class="panel-body">
+      <section
+        v-if="currentUser && currentUser.role === 'admin'"
+      >
+        <div class="post-form">
+          <div class="heading">
+            <h4>{{ $t('announcements.post_form_header') }}</h4>
+          </div>
+          <div class="body">
+            <announcement-editor
+              :announcement="newAnnouncement"
+              :disabled="posting"
+            />
+          </div>
+          <div class="footer">
+            <button
+              class="btn button-default post-button"
+              :disabled="posting"
+              @click.prevent="postAnnouncement"
+            >
+              {{ $t('announcements.post_action') }}
+            </button>
+            <div
+              v-if="error"
+              class="alert error"
+            >
+              {{ $t('announcements.post_error', { error }) }}
+              <button
+                class="button-unstyled"
+                @click="clearError"
+              >
+                <FAIcon
+                  class="fa-scale-110 fa-old-padding"
+                  icon="times"
+                  :title="$t('announcements.close_error')"
+                />
+              </button>
+            </div>
+          </div>
+        </div>
+      </section>
+      <section
+        v-for="announcement in announcements"
+        :key="announcement.id"
+      >
+        <announcement
+          :announcement="announcement"
+        />
+      </section>
+    </div>
+  </div>
+</template>
+
+<script src="./announcements_page.js"></script>
+
+<style lang="scss">
+@import "../../variables";
+
+.announcements-page {
+  .post-form {
+    padding: var(--status-margin, $status-margin);
+
+    .heading, .body {
+      margin-bottom: var(--status-margin, $status-margin);
+    }
+
+    .post-button {
+      min-width: 10em;
+    }
+  }
+}
+</style>
--- a/src/components/attachment/attachment.js
+++ b/src/components/attachment/attachment.js
@ -18,6 +18,7 @@ import {
  faPencilAlt,
  faAlignRight
 } from '@fortawesome/free-solid-svg-icons'
+import Blurhash from '../blurhash/Blurhash.vue'

 library.add(
  faFile,
@ -63,7 +64,8 @@ const Attachment = {
  components: {
    Flash,
    StillImage,
-    VideoAttachment
+    VideoAttachment,
+    Blurhash
  },
  computed: {
    classNames () {
@ -84,6 +86,9 @@ const Attachment = {
    useContainFit () {
      return this.$store.getters.mergedConfig.useContainFit
    },
+    useBlurhash () {
+      return this.$store.getters.mergedConfig.useBlurhash
+    },
    placeholderName () {
      if (this.attachment.description === '' || !this.attachment.description) {
        return this.type.toUpperCase()
@ -126,9 +131,15 @@ const Attachment = {
    videoTag () {
      return this.useModal ? 'button' : 'span'
    },
+    statusForm () {
+      return this.$parent.$parent
+    },
    ...mapGetters(['mergedConfig'])
  },
  watch: {
+    'attachment.description' (newVal) {
+      this.localDescription = newVal
+    },
    localDescription (newVal) {
      this.onEdit(newVal)
    }
@ -199,6 +210,29 @@ const Attachment = {
      const width = image.naturalWidth
      const height = image.naturalHeight
      this.$emit('naturalSizeLoad', { id: this.attachment.id, width, height })
+    },
+    resize (e) {
+      const target = e.target || e
+      if (!(target instanceof window.Element)) { return }
+
+      // Reset to default height for empty form, nothing else to do here.
+      if (target.value === '') {
+        target.style.height = null
+        this.$emit('resize')
+        return
+      }
+
+      const paddingString = getComputedStyle(target)['padding']
+      // remove -px suffix
+      const padding = Number(paddingString.substring(0, paddingString.length - 2))
+
+      target.style.height = 'auto'
+      const newHeight = Math.floor(target.scrollHeight - padding * 2)
+      target.style.height = `${newHeight}px`
+      this.$emit('resize', newHeight)
+    },
+    postStatus (event) {
+      this.statusForm.postStatus(event, this.statusForm.newStatus)
    }
  }
 }
--- a/src/components/attachment/attachment.scss
+++ b/src/components/attachment/attachment.scss
@ -16,7 +16,7 @@

  .attachment-wrapper {
    flex: 1 1 auto;
-    height: 100%;
+    height: 200px;
    position: relative;
    overflow: hidden;
  }
@ -26,6 +26,7 @@
    display: flex;
    padding-top: 0.5em;
    z-index: 1;
+    max-height: 50%;

    p {
      flex: 1;
@ -33,9 +34,10 @@
      line-height: 1.5;
      padding: 0.5em;
      margin: 0;
-      white-space: nowrap;
+      white-space: pre-line;
+      word-break: break-word;
      text-overflow: ellipsis;
-      overflow: hidden;
+      overflow: auto;
    }

    &.-static {
@ -52,6 +54,19 @@
  .description-field {
    flex: 1;
    min-width: 0;
+
+    box-sizing: content-box;
+    overflow: hidden;
+    transition: min-height 200ms 100ms;
+
+    padding-bottom: var(--_padding);
+    height: calc(var(--post-line-height) * 1em);
+    min-height: calc(var(--post-line-height) * 1em);
+    resize: none;
+
+    &.scrollable-form {
+      overflow-y: auto;
+    }
  }

  & .placeholder-container,
--- a/src/components/attachment/attachment.vue
+++ b/src/components/attachment/attachment.vue
@ -64,7 +64,15 @@
        :title="attachment.description"
        @click.prevent.stop="toggleHidden"
      >
+        <Blurhash
+          v-if="useBlurhash && attachment.blurhash"
+          :height="512"
+          :width="1024"
+          :hash="attachment.blurhash"
+          :punch="1"
+        />
        <img
+          v-else
          :key="nsfwImage"
          class="nsfw"
          :src="nsfwImage"
@ -248,14 +256,16 @@
      class="description-container"
      :class="{ '-static': !edit }"
    >
-      <input
+      <textarea
        v-if="edit"
        v-model="localDescription"
-        type="text"
        class="description-field"
        :placeholder="$t('post_status.media_description')"
-        @keydown.enter.prevent=""
-      >
+        rows="1"
+        cols="1"
+        @keydown.ctrl.enter="postStatus()"
+        @input="resize"
+      />
      <p v-else>
        {{ localDescription }}
      </p>
--- a/src/components/awaiting_email_confirmation/awaiting_email_confirmation.js
+++ b/src/components/awaiting_email_confirmation/awaiting_email_confirmation.js
@ -0,0 +1,4 @@
+export default {
+  computed: {
+  }
+}
--- a/src/components/awaiting_email_confirmation/awaiting_email_confirmation.vue
+++ b/src/components/awaiting_email_confirmation/awaiting_email_confirmation.vue
@ -0,0 +1,12 @@
+<template>
+  <div class="panel panel-default">
+    <div class="panel-heading">
+      <h4>{{ $t('registration.awaiting_email_confirmation_title') }}</h4>
+    </div>
+    <div class="panel-body">
+      <p>{{ $t('registration.awaiting_email_confirmation') }}</p>
+    </div>
+  </div>
+</template>
+
+<script src="./awaiting_email_confirmation.js"></script>
--- a/src/components/blurhash/Blurhash.vue
+++ b/src/components/blurhash/Blurhash.vue
@ -0,0 +1,66 @@
+<template>
+  <canvas
+    ref="canvas"
+    class="blurhash"
+  />
+</template>
+
+<script>
+import { decode } from "blurhash";
+
+export default {
+  name: 'Blurhash',
+  props: {
+    hash: {
+      type: String,
+      required: true,
+    },
+    width: {
+      type: Number,
+      required: true,
+    },
+    height: {
+      type: Number,
+      required: true,
+    },
+    punch: {
+      type: Number,
+      default: null,
+    },
+  },
+  data() {
+    return {
+      canvas: null,
+      ctx: null,
+    };
+  },
+  mounted() {
+    this.canvas = this.$refs.canvas;
+    this.ctx = this.canvas.getContext('2d');
+    this.canvas.width = 1024;
+    this.canvas.height = 512;
+    this.draw();
+  },
+  methods: {
+    draw() {
+      const pixels = decode(this.hash, this.width, this.height, this.punch);
+      const imageData = this.ctx.createImageData(this.width, this.height);
+      imageData.data.set(pixels);
+      this.ctx.putImageData(imageData, 0, 0);
+      fetch("/static/blurhash-overlay.png")
+        .then((response) => response.blob())
+        .then((blob) => {
+          const img = new Image();
+          img.src = URL.createObjectURL(blob);
+          img.onload = () => {
+            this.ctx.drawImage(img, 0, 0, this.width, this.height);
+          };
+        });
+    },
+  }
+}
+</script>
+
+<style scoped>
+
+</style>
--- a/src/components/bubble_timeline/bubble_timeline.js
+++ b/src/components/bubble_timeline/bubble_timeline.js
@ -0,0 +1,18 @@
+import Timeline from '../timeline/timeline.vue'
+const PublicTimeline = {
+  components: {
+    Timeline
+  },
+  computed: {
+    timeline () { return this.$store.state.statuses.timelines.bubble }
+  },
+  created () {
+    this.$store.dispatch('startFetchingTimeline', { timeline: 'bubble' })
+  },
+  unmounted () {
+    this.$store.dispatch('stopFetchingTimeline', 'bubble')
+  }
+
+}
+
+export default PublicTimeline
--- a/src/components/bubble_timeline/bubble_timeline.vue
+++ b/src/components/bubble_timeline/bubble_timeline.vue
@ -0,0 +1,9 @@
+<template>
+  <Timeline
+    :title="$t('nav.bubble_timeline')"
+    :timeline="timeline"
+    :timeline-name="'bubble'"
+  />
+</template>
+
+<script src="./bubble_timeline.js"></script>
--- a/src/components/chat/chat.js
+++ b/src/components/chat/chat.js
@ -1,346 +0,0 @@
-import _ from 'lodash'
-import { WSConnectionStatus } from '../../services/api/api.service.js'
-import { mapGetters, mapState } from 'vuex'
-import ChatMessage from '../chat_message/chat_message.vue'
-import PostStatusForm from '../post_status_form/post_status_form.vue'
-import ChatTitle from '../chat_title/chat_title.vue'
-import chatService from '../../services/chat_service/chat_service.js'
-import { promiseInterval } from '../../services/promise_interval/promise_interval.js'
-import { getScrollPosition, getNewTopPosition, isBottomedOut, isScrollable } from './chat_layout_utils.js'
-import { library } from '@fortawesome/fontawesome-svg-core'
-import {
-  faChevronDown,
-  faChevronLeft
-} from '@fortawesome/free-solid-svg-icons'
-import { buildFakeMessage } from '../../services/chat_utils/chat_utils.js'
-
-library.add(
-  faChevronDown,
-  faChevronLeft
-)
-
-const BOTTOMED_OUT_OFFSET = 10
-const JUMP_TO_BOTTOM_BUTTON_VISIBILITY_OFFSET = 10
-const SAFE_RESIZE_TIME_OFFSET = 100
-const MARK_AS_READ_DELAY = 1500
-const MAX_RETRIES = 10
-
-const Chat = {
-  components: {
-    ChatMessage,
-    ChatTitle,
-    PostStatusForm
-  },
-  data () {
-    return {
-      jumpToBottomButtonVisible: false,
-      hoveredMessageChainId: undefined,
-      lastScrollPosition: {},
-      scrollableContainerHeight: '100%',
-      errorLoadingChat: false,
-      messageRetriers: {}
-    }
-  },
-  created () {
-    this.startFetching()
-    window.addEventListener('resize', this.handleResize)
-  },
-  mounted () {
-    window.addEventListener('scroll', this.handleScroll)
-    if (typeof document.hidden !== 'undefined') {
-      document.addEventListener('visibilitychange', this.handleVisibilityChange, false)
-    }
-
-    this.$nextTick(() => {
-      this.handleResize()
-    })
-  },
-  unmounted () {
-    window.removeEventListener('scroll', this.handleScroll)
-    if (typeof document.hidden !== 'undefined') document.removeEventListener('visibilitychange', this.handleVisibilityChange, false)
-    this.$store.dispatch('clearCurrentChat')
-  },
-  computed: {
-    recipient () {
-      return this.currentChat && this.currentChat.account
-    },
-    recipientId () {
-      return this.$route.params.recipient_id
-    },
-    formPlaceholder () {
-      if (this.recipient) {
-        return this.$t('chats.message_user', { nickname: this.recipient.screen_name_ui })
-      } else {
-        return ''
-      }
-    },
-    chatViewItems () {
-      return chatService.getView(this.currentChatMessageService)
-    },
-    newMessageCount () {
-      return this.currentChatMessageService && this.currentChatMessageService.newMessageCount
-    },
-    streamingEnabled () {
-      return this.mergedConfig.useStreamingApi && this.mastoUserSocketStatus === WSConnectionStatus.JOINED
-    },
-    ...mapGetters([
-      'currentChat',
-      'currentChatMessageService',
-      'findOpenedChatByRecipientId',
-      'mergedConfig'
-    ]),
-    ...mapState({
-      backendInteractor: state => state.api.backendInteractor,
-      mastoUserSocketStatus: state => state.api.mastoUserSocketStatus,
-      mobileLayout: state => state.interface.layoutType === 'mobile',
-      currentUser: state => state.users.currentUser
-    })
-  },
-  watch: {
-    chatViewItems () {
-      // We don't want to scroll to the bottom on a new message when the user is viewing older messages.
-      // Therefore we need to know whether the scroll position was at the bottom before the DOM update.
-      const bottomedOutBeforeUpdate = this.bottomedOut(BOTTOMED_OUT_OFFSET)
-      this.$nextTick(() => {
-        if (bottomedOutBeforeUpdate) {
-          this.scrollDown()
-        }
-      })
-    },
-    '$route': function () {
-      this.startFetching()
-    },
-    mastoUserSocketStatus (newValue) {
-      if (newValue === WSConnectionStatus.JOINED) {
-        this.fetchChat({ isFirstFetch: true })
-      }
-    }
-  },
-  methods: {
-    // Used to animate the avatar near the first message of the message chain when any message belonging to the chain is hovered
-    onMessageHover ({ isHovered, messageChainId }) {
-      this.hoveredMessageChainId = isHovered ? messageChainId : undefined
-    },
-    onFilesDropped () {
-      this.$nextTick(() => {
-        this.handleResize()
-      })
-    },
-    handleVisibilityChange () {
-      this.$nextTick(() => {
-        if (!document.hidden && this.bottomedOut(BOTTOMED_OUT_OFFSET)) {
-          this.scrollDown({ forceRead: true })
-        }
-      })
-    },
-    // "Sticks" scroll to bottom instead of top, helps with OSK resizing the viewport
-    handleResize (opts = {}) {
-      const { expand = false, delayed = false } = opts
-
-      if (delayed) {
-        setTimeout(() => {
-          this.handleResize({ ...opts, delayed: false })
-        }, SAFE_RESIZE_TIME_OFFSET)
-        return
-      }
-
-      this.$nextTick(() => {
-        const { offsetHeight = undefined } = getScrollPosition()
-        const diff = this.lastScrollPosition.offsetHeight - offsetHeight
-        if (diff !== 0 || (!this.bottomedOut() && expand)) {
-          this.$nextTick(() => {
-            window.scrollTo({ top: window.scrollY + diff })
-          })
-        }
-        this.lastScrollPosition = getScrollPosition()
-      })
-    },
-    scrollDown (options = {}) {
-      const { behavior = 'auto', forceRead = false } = options
-      this.$nextTick(() => {
-        window.scrollTo({ top: document.documentElement.scrollHeight, behavior })
-      })
-      if (forceRead) {
-        this.readChat()
-      }
-    },
-    readChat () {
-      if (!(this.currentChatMessageService && this.currentChatMessageService.maxId)) { return }
-      if (document.hidden) { return }
-      const lastReadId = this.currentChatMessageService.maxId
-      this.$store.dispatch('readChat', {
-        id: this.currentChat.id,
-        lastReadId
-      })
-    },
-    bottomedOut (offset) {
-      return isBottomedOut(offset)
-    },
-    reachedTop () {
-      return window.scrollY <= 0
-    },
-    cullOlderCheck () {
-      window.setTimeout(() => {
-        if (this.bottomedOut(JUMP_TO_BOTTOM_BUTTON_VISIBILITY_OFFSET)) {
-          this.$store.dispatch('cullOlderMessages', this.currentChatMessageService.chatId)
-        }
-      }, 5000)
-    },
-    handleScroll: _.throttle(function () {
-      if (!this.currentChat) { return }
-
-      if (this.reachedTop()) {
-        this.fetchChat({ maxId: this.currentChatMessageService.minId })
-      } else if (this.bottomedOut(JUMP_TO_BOTTOM_BUTTON_VISIBILITY_OFFSET)) {
-        this.jumpToBottomButtonVisible = false
-        this.cullOlderCheck()
-        if (this.newMessageCount > 0) {
-          // Use a delay before marking as read to prevent situation where new messages
-          // arrive just as you're leaving the view and messages that you didn't actually
-          // get to see get marked as read.
-          window.setTimeout(() => {
-            // Don't mark as read if the element doesn't exist, user has left chat view
-            if (this.$el) this.readChat()
-          }, MARK_AS_READ_DELAY)
-        }
-      } else {
-        this.jumpToBottomButtonVisible = true
-      }
-    }, 200),
-    handleScrollUp (positionBeforeLoading) {
-      const positionAfterLoading = getScrollPosition()
-      window.scrollTo({
-        top: getNewTopPosition(positionBeforeLoading, positionAfterLoading)
-      })
-    },
-    fetchChat ({ isFirstFetch = false, fetchLatest = false, maxId }) {
-      const chatMessageService = this.currentChatMessageService
-      if (!chatMessageService) { return }
-      if (fetchLatest && this.streamingEnabled) { return }
-
-      const chatId = chatMessageService.chatId
-      const fetchOlderMessages = !!maxId
-      const sinceId = fetchLatest && chatMessageService.maxId
-
-      return this.backendInteractor.chatMessages({ id: chatId, maxId, sinceId })
-        .then((messages) => {
-          // Clear the current chat in case we're recovering from a ws connection loss.
-          if (isFirstFetch) {
-            chatService.clear(chatMessageService)
-          }
-
-          const positionBeforeUpdate = getScrollPosition()
-          this.$store.dispatch('addChatMessages', { chatId, messages }).then(() => {
-            this.$nextTick(() => {
-              if (fetchOlderMessages) {
-                this.handleScrollUp(positionBeforeUpdate)
-              }
-
-              // In vertical screens, the first batch of fetched messages may not always take the
-              // full height of the scrollable container.
-              // If this is the case, we want to fetch the messages until the scrollable container
-              // is fully populated so that the user has the ability to scroll up and load the history.
-              if (!isScrollable() && messages.length > 0) {
-                this.fetchChat({ maxId: this.currentChatMessageService.minId })
-              }
-            })
-          })
-        })
-    },
-    async startFetching () {
-      let chat = this.findOpenedChatByRecipientId(this.recipientId)
-      if (!chat) {
-        try {
-          chat = await this.backendInteractor.getOrCreateChat({ accountId: this.recipientId })
-        } catch (e) {
-          console.error('Error creating or getting a chat', e)
-          this.errorLoadingChat = true
-        }
-      }
-      if (chat) {
-        this.$nextTick(() => {
-          this.scrollDown({ forceRead: true })
-        })
-        this.$store.dispatch('addOpenedChat', { chat })
-        this.doStartFetching()
-      }
-    },
-    doStartFetching () {
-      this.$store.dispatch('startFetchingCurrentChat', {
-        fetcher: () => promiseInterval(() => this.fetchChat({ fetchLatest: true }), 5000)
-      })
-      this.fetchChat({ isFirstFetch: true })
-    },
-    handleAttachmentPosting () {
-      this.$nextTick(() => {
-        this.handleResize()
-        // When the posting form size changes because of a media attachment, we need an extra resize
-        // to account for the potential delay in the DOM update.
-        this.scrollDown({ forceRead: true })
-      })
-    },
-    sendMessage ({ status, media, idempotencyKey }) {
-      const params = {
-        id: this.currentChat.id,
-        content: status,
-        idempotencyKey
-      }
-
-      if (media[0]) {
-        params.mediaId = media[0].id
-      }
-
-      const fakeMessage = buildFakeMessage({
-        attachments: media,
-        chatId: this.currentChat.id,
-        content: status,
-        userId: this.currentUser.id,
-        idempotencyKey
-      })
-
-      this.$store.dispatch('addChatMessages', {
-        chatId: this.currentChat.id,
-        messages: [fakeMessage]
-      }).then(() => {
-        this.handleAttachmentPosting()
-      })
-
-      return this.doSendMessage({ params, fakeMessage, retriesLeft: MAX_RETRIES })
-    },
-    doSendMessage ({ params, fakeMessage, retriesLeft = MAX_RETRIES }) {
-      if (retriesLeft <= 0) return
-
-      this.backendInteractor.sendChatMessage(params)
-        .then(data => {
-          this.$store.dispatch('addChatMessages', {
-            chatId: this.currentChat.id,
-            updateMaxId: false,
-            messages: [{ ...data, fakeId: fakeMessage.id }]
-          })
-
-          return data
-        })
-        .catch(error => {
-          console.error('Error sending message', error)
-          this.$store.dispatch('handleMessageError', {
-            chatId: this.currentChat.id,
-            fakeId: fakeMessage.id,
-            isRetry: retriesLeft !== MAX_RETRIES
-          })
-          if ((error.statusCode >= 500 && error.statusCode < 600) || error.message === 'Failed to fetch') {
-            this.messageRetriers[fakeMessage.id] = setTimeout(() => {
-              this.doSendMessage({ params, fakeMessage, retriesLeft: retriesLeft - 1 })
-            }, 1000 * (2 ** (MAX_RETRIES - retriesLeft)))
-          }
-          return {}
-        })
-
-      return Promise.resolve(fakeMessage)
-    },
-    goBack () {
-      this.$router.push({ name: 'chats', params: { username: this.currentUser.screen_name } })
-    }
-  }
-}
-
-export default Chat
--- a/src/components/chat/chat.scss
+++ b/src/components/chat/chat.scss
@ -1,108 +0,0 @@
-.chat-view {
-  display: flex;
-  height: 100%;
-
-  .chat-view-inner {
-    height: auto;
-    width: 100%;
-    overflow: visible;
-    display: flex;
-  }
-
-  .chat-view-body {
-    box-sizing: border-box;
-    background-color: var(--chatBg, $fallback--bg);
-    display: flex;
-    flex-direction: column;
-    width: 100%;
-    overflow: visible;
-    min-height: calc(100vh - var(--navbar-height));
-    margin: 0 0 0 0;
-    border-radius: 10px 10px 0 0;
-    border-radius: var(--panelRadius, 10px) var(--panelRadius, 10px) 0 0;
-
-    &::after {
-      border-radius: 0;
-    }
-  }
-
-  .message-list {
-    padding: 0 0.8em;
-    height: 100%;
-    display: flex;
-    flex-direction: column;
-    justify-content: end;
-  }
-
-  .footer {
-    position: sticky;
-    bottom: 0;
-    background-color: $fallback--bg;
-    background-color: var(--bg, $fallback--bg);
-    z-index: 1;
-  }
-
-  .chat-view-heading {
-    grid-template-columns: auto minmax(50%, 1fr);
-  }
-
-  .go-back-button {
-    text-align: center;
-    line-height: 1;
-    height: 100%;
-    align-self: start;
-    width: var(--__panel-heading-height-inner);
-  }
-
-  .jump-to-bottom-button {
-    width: 2.5em;
-    height: 2.5em;
-    border-radius: 100%;
-    position: absolute;
-    right: 1.3em;
-    top: -3.2em;
-    background-color: $fallback--fg;
-    background-color: var(--btn, $fallback--fg);
-    display: flex;
-    justify-content: center;
-    align-items: center;
-    box-shadow: 0 1px 1px rgba(0, 0, 0, 0.3), 0 2px 4px rgba(0, 0, 0, 0.3);
-    z-index: 10;
-    transition: 0.35s all;
-    transition-timing-function: cubic-bezier(0, 1, 0.5, 1);
-    opacity: 0;
-    visibility: hidden;
-    cursor: pointer;
-
-    &.visible {
-      opacity: 1;
-      visibility: visible;
-    }
-
-    i {
-      font-size: 1em;
-      color: $fallback--text;
-      color: var(--text, $fallback--text);
-    }
-
-    .unread-message-count {
-      font-size: 0.8em;
-      left: 50%;
-      margin-top: -1rem;
-      padding: 0.1em;
-      border-radius: 50px;
-      position: absolute;
-    }
-
-    .chat-loading-error {
-      width: 100%;
-      display: flex;
-      align-items: flex-end;
-      height: 100%;
-
-      .error {
-        width: 100%;
-      }
-    }
-  }
-}
--- a/src/components/chat/chat.vue
+++ b/src/components/chat/chat.vue
@ -1,100 +0,0 @@
-<template>
-  <div class="chat-view">
-    <div class="chat-view-inner">
-      <div
-        ref="inner"
-        class="panel-default panel chat-view-body"
-      >
-        <div
-          ref="header"
-          class="panel-heading -sticky chat-view-heading"
-        >
-          <button
-            class="button-unstyled go-back-button"
-            @click="goBack"
-          >
-            <FAIcon
-              size="lg"
-              icon="chevron-left"
-            />
-          </button>
-          <div class="title text-center">
-            <ChatTitle
-              :user="recipient"
-              :with-avatar="true"
-            />
-          </div>
-        </div>
-        <div
-          class="message-list"
-          :style="{ height: scrollableContainerHeight }"
-        >
-          <template v-if="!errorLoadingChat">
-            <ChatMessage
-              v-for="chatViewItem in chatViewItems"
-              :key="chatViewItem.id"
-              :author="recipient"
-              :chat-view-item="chatViewItem"
-              :hovered-message-chain="chatViewItem.messageChainId === hoveredMessageChainId"
-              @hover="onMessageHover"
-            />
-          </template>
-          <div
-            v-else
-            class="chat-loading-error"
-          >
-            <div class="alert error">
-              {{ $t('chats.error_loading_chat') }}
-            </div>
-          </div>
-        </div>
-        <div
-          ref="footer"
-          class="panel-body footer"
-        >
-          <div
-            class="jump-to-bottom-button"
-            :class="{ 'visible': jumpToBottomButtonVisible }"
-            @click="scrollDown({ behavior: 'smooth' })"
-          >
-            <span>
-              <FAIcon icon="chevron-down" />
-              <div
-                v-if="newMessageCount"
-                class="badge badge-notification unread-chat-count unread-message-count"
-              >
-                {{ newMessageCount }}
-              </div>
-            </span>
-          </div>
-          <PostStatusForm
-            :disable-subject="true"
-            :disable-scope-selector="true"
-            :disable-notice="true"
-            :disable-lock-warning="true"
-            :disable-polls="true"
-            :disable-sensitivity-checkbox="true"
-            :disable-submit="errorLoadingChat || !currentChat"
-            :disable-preview="true"
-            :optimistic-posting="true"
-            :post-handler="sendMessage"
-            :submit-on-enter="!mobileLayout"
-            :preserve-focus="!mobileLayout"
-            :auto-focus="!mobileLayout"
-            :placeholder="formPlaceholder"
-            :file-limit="1"
-            max-height="160"
-            emoji-picker-placement="top"
-            @resize="handleResize"
-          />
-        </div>
-      </div>
-    </div>
-  </div>
-</template>
-
-<script src="./chat.js"></script>
-<style lang="scss">
-@import '../../_variables.scss';
-@import './chat.scss';
-</style>
--- a/src/components/chat/chat_layout_utils.js
+++ b/src/components/chat/chat_layout_utils.js
@ -1,24 +0,0 @@
-// Captures a scroll position
-export const getScrollPosition = () => {
-  return {
-    scrollTop: window.scrollY,
-    scrollHeight: document.documentElement.scrollHeight,
-    offsetHeight: window.innerHeight
-  }
-}
-
-// A helper function that is used to keep the scroll position fixed as the new elements are added to the top
-// Takes two scroll positions, before and after the update.
-export const getNewTopPosition = (previousPosition, newPosition) => {
-  return previousPosition.scrollTop + (newPosition.scrollHeight - previousPosition.scrollHeight)
-}
-
-export const isBottomedOut = (offset = 0) => {
-  const scrollHeight = window.scrollY + offset
-  const totalHeight = document.documentElement.scrollHeight - window.innerHeight
-  return totalHeight <= scrollHeight
-}
-// Returns whether or not the scrollbar is visible.
-export const isScrollable = () => {
-  return document.documentElement.scrollHeight > window.innerHeight
-}
--- a/src/components/chat_list/chat_list.js
+++ b/src/components/chat_list/chat_list.js
@ -1,37 +0,0 @@
-import { mapState, mapGetters } from 'vuex'
-import ChatListItem from '../chat_list_item/chat_list_item.vue'
-import ChatNew from '../chat_new/chat_new.vue'
-import List from '../list/list.vue'
-
-const ChatList = {
-  components: {
-    ChatListItem,
-    List,
-    ChatNew
-  },
-  computed: {
-    ...mapState({
-      currentUser: state => state.users.currentUser
-    }),
-    ...mapGetters(['sortedChatList'])
-  },
-  data () {
-    return {
-      isNew: false
-    }
-  },
-  created () {
-    this.$store.dispatch('fetchChats', { latest: true })
-  },
-  methods: {
-    cancelNewChat () {
-      this.isNew = false
-      this.$store.dispatch('fetchChats', { latest: true })
-    },
-    newChat () {
-      this.isNew = true
-    }
-  }
-}
-
-export default ChatList
--- a/src/components/chat_list/chat_list.vue
+++ b/src/components/chat_list/chat_list.vue
@ -1,64 +0,0 @@
-<template>
-  <div v-if="isNew">
-    <ChatNew @cancel="cancelNewChat" />
-  </div>
-  <div
-    v-else
-    class="chat-list panel panel-default"
-  >
-    <div class="panel-heading -sticky">
-      <span class="title">
-        {{ $t("chats.chats") }}
-      </span>
-      <button
-        class="button-default"
-        @click="newChat"
-      >
-        {{ $t("chats.new") }}
-      </button>
-    </div>
-    <div class="panel-body">
-      <div
-        v-if="sortedChatList.length > 0"
-        class="timeline"
-      >
-        <List :items="sortedChatList">
-          <template v-slot:item="{item}">
-            <ChatListItem
-              :key="item.id"
-              :compact="false"
-              :chat="item"
-            />
-          </template>
-        </List>
-      </div>
-      <div
-        v-else
-        class="emtpy-chat-list-alert"
-      >
-        <span>{{ $t('chats.empty_chat_list_placeholder') }}</span>
-      </div>
-    </div>
-  </div>
-</template>
-
-<script src="./chat_list.js"></script>
-
-<style lang="scss">
-@import '../../_variables.scss';
-
-.chat-list {
-  min-height: 25em;
-  margin-bottom: 0;
-}
-
-.emtpy-chat-list-alert {
-  padding: 3em;
-  font-size: 1.2em;
-  display: flex;
-  justify-content: center;
-  color: $fallback--text;
-  color: var(--faint, $fallback--text);
-}
-
-</style>
--- a/src/components/chat_list_item/chat_list_item.js
+++ b/src/components/chat_list_item/chat_list_item.js
@ -1,69 +0,0 @@
-import { mapState } from 'vuex'
-import StatusBody from '../status_content/status_content.vue'
-import fileType from 'src/services/file_type/file_type.service'
-import UserAvatar from '../user_avatar/user_avatar.vue'
-import AvatarList from '../avatar_list/avatar_list.vue'
-import Timeago from '../timeago/timeago.vue'
-import ChatTitle from '../chat_title/chat_title.vue'
-
-const ChatListItem = {
-  name: 'ChatListItem',
-  props: [
-    'chat'
-  ],
-  components: {
-    UserAvatar,
-    AvatarList,
-    Timeago,
-    ChatTitle,
-    StatusBody
-  },
-  computed: {
-    ...mapState({
-      currentUser: state => state.users.currentUser
-    }),
-    attachmentInfo () {
-      if (this.chat.lastMessage.attachments.length === 0) { return }
-
-      const types = this.chat.lastMessage.attachments.map(file => fileType.fileType(file.mimetype))
-      if (types.includes('video')) {
-        return this.$t('file_type.video')
-      } else if (types.includes('audio')) {
-        return this.$t('file_type.audio')
-      } else if (types.includes('image')) {
-        return this.$t('file_type.image')
-      } else {
-        return this.$t('file_type.file')
-      }
-    },
-    messageForStatusContent () {
-      const message = this.chat.lastMessage
-      const messageEmojis = message ? message.emojis : []
-      const isYou = message && message.account_id === this.currentUser.id
-      const content = message ? (this.attachmentInfo || message.content) : ''
-      const messagePreview = isYou ? `<i>${this.$t('chats.you')}</i> ${content}` : content
-      return {
-        summary: '',
-        emojis: messageEmojis,
-        raw_html: messagePreview,
-        text: messagePreview,
-        attachments: []
-      }
-    }
-  },
-  methods: {
-    openChat (_e) {
-      if (this.chat.id) {
-        this.$router.push({
-          name: 'chat',
-          params: {
-            username: this.currentUser.screen_name,
-            recipient_id: this.chat.account.id
-          }
-        })
-      }
-    }
-  }
-}
-
-export default ChatListItem
--- a/src/components/chat_list_item/chat_list_item.scss
+++ b/src/components/chat_list_item/chat_list_item.scss
@ -1,91 +0,0 @@
-.chat-list-item {
-  display: flex;
-  flex-direction: row;
-  padding: 0.75em;
-  height: 5em;
-  overflow: hidden;
-  box-sizing: border-box;
-  cursor: pointer;
-
-  :focus {
-    outline: none;
-  }
-
-  &:hover {
-    background-color: var(--selectedPost, $fallback--lightBg);
-    box-shadow: 0 0 3px 1px rgba(0, 0, 0, 0.1);
-  }
-
-  .chat-list-item-left {
-    margin-right: 1em;
-  }
-
-  .chat-list-item-center {
-    width: 100%;
-    box-sizing: border-box;
-    overflow: hidden;
-    word-wrap: break-word;
-  }
-
-  .heading {
-    width: 100%;
-    display: inline-flex;
-    justify-content: space-between;
-    line-height: 1em;
-  }
-
-  .heading-right {
-    white-space: nowrap;
-  }
-
-  .name-and-account-name {
-    text-overflow: ellipsis;
-    white-space: nowrap;
-    overflow: hidden;
-    flex-shrink: 1;
-    line-height: var(--post-line-height);
-  }
-
-  .chat-preview {
-    display: inline-flex;
-    overflow: hidden;
-    white-space: nowrap;
-    text-overflow: ellipsis;
-    margin: 0.35em 0;
-    color: $fallback--text;
-    color: var(--faint, $fallback--text);
-    width: 100%;
-  }
-
-  a {
-    color: var(--faintLink, $fallback--link);
-    text-decoration: none;
-    pointer-events: none;
-  }
-
-  &:hover .animated.avatar {
-    canvas {
-      display: none;
-    }
-    img {
-      visibility: visible;
-    }
-  }
-
-  .Avatar {
-    border-radius: $fallback--avatarAltRadius;
-    border-radius: var(--avatarAltRadius, $fallback--avatarAltRadius);
-  }
-
-  .chat-preview-body {
-    --emoji-size: 1.4em;
-  }
-
-  .time-wrapper {
-    line-height: var(--post-line-height);
-  }
-
-  .chat-preview-body {
-    padding-right: 1em;
-  }
-}
--- a/src/components/chat_list_item/chat_list_item.vue
+++ b/src/components/chat_list_item/chat_list_item.vue
@ -1,53 +0,0 @@
-<template>
-  <div
-    class="chat-list-item"
-    @click.capture.prevent="openChat"
-  >
-    <div class="chat-list-item-left">
-      <UserAvatar
-        :user="chat.account"
-        height="48px"
-        width="48px"
-      />
-    </div>
-    <div class="chat-list-item-center">
-      <div class="heading">
-        <span
-          v-if="chat.account"
-          class="name-and-account-name"
-        >
-          <ChatTitle
-            :user="chat.account"
-          />
-        </span>
-        <span class="heading-right" />
-        <div class="time-wrapper">
-          <Timeago
-            :time="chat.updated_at"
-            :auto-update="60"
-          />
-        </div>
-      </div>
-      <div class="chat-preview">
-        <StatusBody
-          class="chat-preview-body"
-          :status="messageForStatusContent"
-          :single-line="true"
-        />
-        <div
-          v-if="chat.unread > 0"
-          class="badge badge-notification unread-chat-count"
-        >
-          {{ chat.unread }}
-        </div>
-      </div>
-    </div>
-  </div>
-</template>
-
-<script src="./chat_list_item.js"></script>
-
-<style lang="scss">
-@import '../../_variables.scss';
-@import './chat_list_item.scss';
-</style>
--- a/src/components/chat_message/chat_message.js
+++ b/src/components/chat_message/chat_message.js
@ -1,108 +0,0 @@
-import { mapState, mapGetters } from 'vuex'
-import Popover from '../popover/popover.vue'
-import Attachment from '../attachment/attachment.vue'
-import UserAvatar from '../user_avatar/user_avatar.vue'
-import Gallery from '../gallery/gallery.vue'
-import LinkPreview from '../link-preview/link-preview.vue'
-import StatusContent from '../status_content/status_content.vue'
-import ChatMessageDate from '../chat_message_date/chat_message_date.vue'
-import generateProfileLink from 'src/services/user_profile_link_generator/user_profile_link_generator'
-import { library } from '@fortawesome/fontawesome-svg-core'
-import {
-  faTimes,
-  faEllipsisH
-} from '@fortawesome/free-solid-svg-icons'
-
-library.add(
-  faTimes,
-  faEllipsisH
-)
-
-const ChatMessage = {
-  name: 'ChatMessage',
-  props: [
-    'author',
-    'edited',
-    'noHeading',
-    'chatViewItem',
-    'hoveredMessageChain'
-  ],
-  emits: ['hover'],
-  components: {
-    Popover,
-    Attachment,
-    StatusContent,
-    UserAvatar,
-    Gallery,
-    LinkPreview,
-    ChatMessageDate
-  },
-  computed: {
-    // Returns HH:MM (hours and minutes) in local time.
-    createdAt () {
-      const time = this.chatViewItem.data.created_at
-      return time.toLocaleTimeString('en', { hour: '2-digit', minute: '2-digit', hour12: false })
-    },
-    isCurrentUser () {
-      return this.message.account_id === this.currentUser.id
-    },
-    message () {
-      return this.chatViewItem.data
-    },
-    userProfileLink () {
-      return generateProfileLink(this.author.id, this.author.screen_name, this.$store.state.instance.restrictedNicknames)
-    },
-    isMessage () {
-      return this.chatViewItem.type === 'message'
-    },
-    messageForStatusContent () {
-      return {
-        summary: '',
-        emojis: this.message.emojis,
-        raw_html: this.message.content || '',
-        text: this.message.content || '',
-        attachments: this.message.attachments
-      }
-    },
-    hasAttachment () {
-      return this.message.attachments.length > 0
-    },
-    ...mapState({
-      betterShadow: state => state.interface.browserSupport.cssFilter,
-      currentUser: state => state.users.currentUser,
-      restrictedNicknames: state => state.instance.restrictedNicknames
-    }),
-    popoverMarginStyle () {
-      if (this.isCurrentUser) {
-        return {}
-      } else {
-        return { left: 50 }
-      }
-    },
-    ...mapGetters(['mergedConfig', 'findUser'])
-  },
-  data () {
-    return {
-      hovered: false,
-      menuOpened: false
-    }
-  },
-  methods: {
-    onHover (bool) {
-      this.$emit('hover', { isHovered: bool, messageChainId: this.chatViewItem.messageChainId })
-    },
-    async deleteMessage () {
-      const confirmed = window.confirm(this.$t('chats.delete_confirm'))
-      if (confirmed) {
-        await this.$store.dispatch('deleteChatMessage', {
-          messageId: this.chatViewItem.data.id,
-          chatId: this.chatViewItem.data.chat_id
-        })
-      }
-      this.hovered = false
-      this.menuOpened = false
-    }
-  }
-}
-
-export default ChatMessage
--- a/src/components/chat_message/chat_message.scss
+++ b/src/components/chat_message/chat_message.scss
@ -1,179 +0,0 @@
-@import '../../_variables.scss';
-
-.chat-message-wrapper {
-
-  &.hovered-message-chain {
-    .animated.Avatar {
-      canvas {
-        display: none;
-      }
-      img {
-        visibility: visible;
-      }
-    }
-  }
-
-  .chat-message-menu {
-    transition: opacity 0.1s;
-    opacity: 0;
-    position: absolute;
-    top: -0.8em;
-
-    button {
-      padding-top: 0.2em;
-      padding-bottom: 0.2em;
-    }
-  }
-
-  .menu-icon {
-    cursor: pointer;
-
-    &:hover, .extra-button-popover.open & {
-      color: $fallback--text;
-      color: var(--text, $fallback--text);
-    }
-  }
-
-  .popover {
-    width: 12em;
-  }
-
-  .chat-message {
-    display: flex;
-    padding-bottom: 0.5em;
-
-    .status-body:hover {
-      --_still-image-img-visibility: visible;
-      --_still-image-canvas-visibility: hidden;
-      --_still-image-label-visibility: hidden;
-    }
-  }
-
-  .avatar-wrapper {
-    margin-right: 0.72em;
-    width: 32px;
-  }
-
-  .link-preview, .attachments {
-    margin-bottom: 1em;
-  }
-
-  .chat-message-inner {
-    display: flex;
-    flex-direction: column;
-    align-items: flex-start;
-    max-width: 80%;
-    min-width: 10em;
-    width: 100%;
-
-    &.with-media {
-      width: 100%;
-
-      .status {
-        width: 100%;
-      }
-    }
-  }
-
-  .status {
-    border-radius: $fallback--chatMessageRadius;
-    border-radius: var(--chatMessageRadius, $fallback--chatMessageRadius);
-    display: flex;
-    padding: 0.75em;
-  }
-
-  .created-at {
-    position: relative;
-    float: right;
-    font-size: 0.8em;
-    margin: -1em 0 -0.5em 0;
-    font-style: italic;
-    opacity: 0.8;
-  }
-
-  .without-attachment {
-    .message-content {
-      // TODO figure out how to do it properly
-      .RichContent::after {
-        margin-right: 5.4em;
-        content: " ";
-        display: inline-block;
-      }
-    }
-  }
-
-  .pending {
-    .status-content.media-body, .created-at {
-      color: var(--faint);
-    }
-  }
-
-  .error {
-    .status-content.media-body, .created-at {
-      color: $fallback--cRed;
-      color: var(--badgeNotification, $fallback--cRed);
-    }
-  }
-
-  .incoming {
-    a {
-      color: var(--chatMessageIncomingLink, $fallback--link);
-    }
-
-    .status {
-      color: var(--chatMessageIncomingText, $fallback--text);
-      background-color: var(--chatMessageIncomingBg, $fallback--bg);
-      border: 1px solid var(--chatMessageIncomingBorder, --border);
-    }
-
-    .created-at {
-      a {
-        color: var(--chatMessageIncomingText, $fallback--text);
-      }
-    }
-
-    .chat-message-menu {
-      left: 0.4rem;
-    }
-  }
-
-  .outgoing {
-    display: flex;
-    flex-direction: row;
-    flex-wrap: wrap;
-    align-content: end;
-    justify-content: flex-end;
-
-    a {
-      color: var(--chatMessageOutgoingLink, $fallback--link);
-    }
-
-    .status {
-      color: var(--chatMessageOutgoingText, $fallback--text);
-      background-color: var(--chatMessageOutgoingBg, $fallback--lightBg);
-      border: 1px solid var(--chatMessageOutgoingBorder, --lightBg);
-    }
-
-    .chat-message-inner {
-      align-items: flex-end;
-    }
-
-    .chat-message-menu {
-      right: 0.4rem;
-    }
-  }
-
-  .visible {
-    opacity: 1;
-  }
-
-}
-
-.chat-message-date-separator {
-  text-align: center;
-  margin: 1.4em 0;
-  font-size: 0.9em;
-  user-select: none;
-  color: $fallback--text;
-  color: var(--faintedText, $fallback--text);
-}
--- a/src/components/chat_message/chat_message.vue
+++ b/src/components/chat_message/chat_message.vue
@ -1,103 +0,0 @@
-<template>
-  <div
-    v-if="isMessage"
-    class="chat-message-wrapper"
-    :class="{ 'hovered-message-chain': hoveredMessageChain }"
-    @mouseover="onHover(true)"
-    @mouseleave="onHover(false)"
-  >
-    <div
-      class="chat-message"
-      :class="[{ 'outgoing': isCurrentUser, 'incoming': !isCurrentUser }]"
-    >
-      <div
-        v-if="!isCurrentUser"
-        class="avatar-wrapper"
-      >
-        <router-link
-          v-if="chatViewItem.isHead"
-          :to="userProfileLink"
-        >
-          <UserAvatar
-            :compact="true"
-            :better-shadow="betterShadow"
-            :user="author"
-          />
-        </router-link>
-      </div>
-      <div class="chat-message-inner">
-        <div
-          class="status-body"
-          :style="{ 'min-width': message.attachment ? '80%' : '' }"
-        >
-          <div
-            class="media status"
-            :class="{ 'without-attachment': !hasAttachment, 'pending': chatViewItem.data.pending, 'error': chatViewItem.data.error }"
-            style="position: relative"
-            @mouseenter="hovered = true"
-            @mouseleave="hovered = false"
-          >
-            <div
-              class="chat-message-menu"
-              :class="{ 'visible': hovered || menuOpened }"
-            >
-              <Popover
-                trigger="click"
-                placement="top"
-                :bound-to-selector="isCurrentUser ? '' : '.scrollable-message-list'"
-                :bound-to="{ x: 'container' }"
-                :margin="popoverMarginStyle"
-                @show="menuOpened = true"
-                @close="menuOpened = false"
-              >
-                <template v-slot:content>
-                  <div class="dropdown-menu">
-                    <button
-                      class="button-default dropdown-item dropdown-item-icon"
-                      @click="deleteMessage"
-                    >
-                      <FAIcon icon="times" /> {{ $t("chats.delete") }}
-                    </button>
-                  </div>
-                </template>
-                <template v-slot:trigger>
-                  <button
-                    class="button-default menu-icon"
-                    :title="$t('chats.more')"
-                  >
-                    <FAIcon icon="ellipsis-h" />
-                  </button>
-                </template>
-              </Popover>
-            </div>
-            <StatusContent
-              class="message-content"
-              :status="messageForStatusContent"
-              :full-content="true"
-            >
-              <template v-slot:footer>
-                <span
-                  class="created-at"
-                >
-                  {{ createdAt }}
-                </span>
-              </template>
-            </StatusContent>
-          </div>
-        </div>
-      </div>
-    </div>
-  </div>
-  <div
-    v-else
-    class="chat-message-date-separator"
-  >
-    <ChatMessageDate :date="chatViewItem.date" />
-  </div>
-</template>
-
-<script src="./chat_message.js" ></script>
-<style lang="scss">
-@import './chat_message.scss';
-
-</style>
--- a/src/components/chat_new/chat_new.js
+++ b/src/components/chat_new/chat_new.js
@ -1,83 +0,0 @@
-import { mapState, mapGetters } from 'vuex'
-import BasicUserCard from '../basic_user_card/basic_user_card.vue'
-import UserAvatar from '../user_avatar/user_avatar.vue'
-import { library } from '@fortawesome/fontawesome-svg-core'
-import {
-  faSearch,
-  faChevronLeft
-} from '@fortawesome/free-solid-svg-icons'
-
-library.add(
-  faSearch,
-  faChevronLeft
-)
-
-const chatNew = {
-  components: {
-    BasicUserCard,
-    UserAvatar
-  },
-  data () {
-    return {
-      suggestions: [],
-      userIds: [],
-      loading: false,
-      query: ''
-    }
-  },
-  async created () {
-    const { chats } = await this.backendInteractor.chats()
-    chats.forEach(chat => this.suggestions.push(chat.account))
-  },
-  computed: {
-    users () {
-      return this.userIds.map(userId => this.findUser(userId))
-    },
-    availableUsers () {
-      if (this.query.length !== 0) {
-        return this.users
-      } else {
-        return this.suggestions
-      }
-    },
-    ...mapState({
-      currentUser: state => state.users.currentUser,
-      backendInteractor: state => state.api.backendInteractor
-    }),
-    ...mapGetters(['findUser'])
-  },
-  methods: {
-    goBack () {
-      this.$emit('cancel')
-    },
-    goToChat (user) {
-      this.$router.push({ name: 'chat', params: { recipient_id: user.id } })
-    },
-    onInput () {
-      this.search(this.query)
-    },
-    addUser (user) {
-      this.selectedUserIds.push(user.id)
-      this.query = ''
-    },
-    removeUser (userId) {
-      this.selectedUserIds = this.selectedUserIds.filter(id => id !== userId)
-    },
-    search (query) {
-      if (!query) {
-        this.loading = false
-        return
-      }
-
-      this.loading = true
-      this.userIds = []
-      this.$store.dispatch('search', { q: query, resolve: true, type: 'accounts' })
-        .then(data => {
-          this.loading = false
-          this.userIds = data.accounts.map(a => a.id)
-        })
-    }
-  }
-}
-
-export default chatNew
--- a/src/components/chat_new/chat_new.scss
+++ b/src/components/chat_new/chat_new.scss
@ -1,31 +0,0 @@
-.chat-new {
-  .input-wrap {
-    display: flex;
-    margin: 0.7em 0.5em 0.7em 0.5em;
-
-    input {
-      width: 100%;
-    }
-  }
-
-  .search-icon {
-    margin-right: 0.3em;
-  }
-
-  .member-list {
-    padding-bottom: 0.7rem;
-  }
-
-  .basic-user-card:hover {
-    cursor: pointer;
-    background-color: var(--selectedPost, $fallback--lightBg);
-  }
-
-  .go-back-button {
-    text-align: center;
-    line-height: 1;
-    height: 100%;
-    align-self: start;
-    width: var(--__panel-heading-height-inner);
-  }
-}
--- a/src/components/chat_new/chat_new.vue
+++ b/src/components/chat_new/chat_new.vue
@ -1,51 +0,0 @@
-<template>
-  <div
-    class="panel-default panel chat-new"
-  >
-    <div
-      ref="header"
-      class="panel-heading"
-    >
-      <button
-        class="button-unstyled go-back-button"
-        @click="goBack"
-      >
-        <FAIcon
-          size="lg"
-          icon="chevron-left"
-        />
-      </button>
-    </div>
-    <div class="input-wrap">
-      <div class="input-search">
-        <FAIcon
-          class="search-icon fa-scale-110 fa-old-padding"
-          icon="search"
-        />
-      </div>
-      <input
-        ref="search"
-        v-model="query"
-        placeholder="Search people"
-        @input="onInput"
-      >
-    </div>
-    <div class="member-list">
-      <div
-        v-for="user in availableUsers"
-        :key="user.id"
-        class="member"
-      >
-        <div @click.capture.prevent="goToChat(user)">
-          <BasicUserCard :user="user" />
-        </div>
-      </div>
-    </div>
-  </div>
-</template>
-
-<script src="./chat_new.js"></script>
-<style lang="scss">
-@import '../../_variables.scss';
-@import './chat_new.scss';
-</style>
--- a/src/components/chat_title/chat_title.js
+++ b/src/components/chat_title/chat_title.js
@ -1,27 +0,0 @@
-import generateProfileLink from 'src/services/user_profile_link_generator/user_profile_link_generator'
-import UserAvatar from '../user_avatar/user_avatar.vue'
-import RichContent from 'src/components/rich_content/rich_content.jsx'
-
-export default {
-  name: 'ChatTitle',
-  components: {
-    UserAvatar,
-    RichContent
-  },
-  props: [
-    'user', 'withAvatar'
-  ],
-  computed: {
-    title () {
-      return this.user ? this.user.screen_name_ui : ''
-    },
-    htmlTitle () {
-      return this.user ? this.user.name_html : ''
-    }
-  },
-  methods: {
-    getUserProfileLink (user) {
-      return generateProfileLink(user.id, user.screen_name)
-    }
-  }
-}
--- a/src/components/chat_title/chat_title.vue
+++ b/src/components/chat_title/chat_title.vue
@ -1,65 +0,0 @@
-<template>
-  <div
-    class="chat-title"
-    :title="title"
-  >
-    <router-link
-      v-if="withAvatar && user"
-      class="avatar-container"
-      :to="getUserProfileLink(user)"
-    >
-      <UserAvatar
-        class="titlebar-avatar"
-        :user="user"
-      />
-    </router-link>
-    <RichContent
-      v-if="user"
-      class="username"
-      :title="'@'+(user && user.screen_name_ui)"
-      :html="htmlTitle"
-      :emoji="user.emoji || []"
-    />
-  </div>
-</template>
-
-<script src="./chat_title.js"></script>
-
-<style lang="scss">
-@import '../../_variables.scss';
-
-.chat-title {
-  display: flex;
-  overflow: hidden;
-  text-overflow: ellipsis;
-  white-space: nowrap;
-
-  --emoji-size: 14px;
-
-  .username {
-    max-width: 100%;
-    text-overflow: ellipsis;
-    white-space: nowrap;
-    display: inline;
-    word-wrap: break-word;
-    overflow: hidden;
-  }
-
-  .avatar-container {
-    align-self: center;
-    line-height: 1;
-  }
-
-  .titlebar-avatar {
-    margin-right: 0.5em;
-    height: 1.5em;
-    width: 1.5em;
-    border-radius: $fallback--avatarAltRadius;
-    border-radius: var(--avatarAltRadius, $fallback--avatarAltRadius);
-
-    &.animated::before {
-      display: none;
-    }
-  }
-}
-</style>
--- a/src/components/color_input/color_input.scss
+++ b/src/components/color_input/color_input.scss
@ -28,7 +28,7 @@
        flex: 0 0 2em;
        min-width: 2em;
        align-self: center;
-        height: 100%;
+        height: 2em;
      }
    }
    .computedIndicator,
--- a/src/components/confirm_modal/confirm_modal.js
+++ b/src/components/confirm_modal/confirm_modal.js
@ -0,0 +1,37 @@
+import DialogModal from '../dialog_modal/dialog_modal.vue'
+
+/**
+ * This component emits the following events:
+ * cancelled, emitted when the action should not be performed;
+ * accepted, emitted when the action should be performed;
+ *
+ * The caller should close this dialog after receiving any of the two events.
+ */
+const ConfirmModal = {
+  components: {
+    DialogModal
+  },
+  props: {
+    title: {
+      type: String
+    },
+    cancelText: {
+      type: String
+    },
+    confirmText: {
+      type: String
+    }
+  },
+  computed: {
+  },
+  methods: {
+    onCancel () {
+      this.$emit('cancelled')
+    },
+    onAccept () {
+      this.$emit('accepted')
+    }
+  }
+}
+
+export default ConfirmModal
--- a/src/components/confirm_modal/confirm_modal.vue
+++ b/src/components/confirm_modal/confirm_modal.vue
@ -0,0 +1,39 @@
+<template>
+  <dialog-modal
+    v-body-scroll-lock="true"
+    class="confirm-modal"
+    :on-cancel="onCancel"
+  >
+    <template #header>
+      <span v-text="title" />
+    </template>
+
+    <slot />
+
+    <template #footer>
+      <button
+        class="btn button-default"
+        @click.prevent="onCancel"
+        v-text="cancelText"
+      />
+      <button
+        class="btn button-default button-positive"
+        @click.prevent="onAccept"
+        v-text="confirmText"
+      />
+    </template>
+  </dialog-modal>
+</template>
+
+<style lang="scss" scoped>
+@import '../../_variables';
+
+.confirm-modal {
+  .button-positive {
+    border: 3px solid var(--accent, $fallback--link);
+    border-radius: var(--btnRadius, $fallback--btnRadius);
+  }
+}
+</style>
+
+<script src="./confirm_modal.js"></script>
--- a/src/components/conversation/conversation.js
+++ b/src/components/conversation/conversation.js
@ -1,6 +1,8 @@
 import { reduce, filter, findIndex, clone, get } from 'lodash'
 import Status from '../status/status.vue'
 import ThreadTree from '../thread_tree/thread_tree.vue'
+import { WSConnectionStatus } from '../../services/api/api.service.js'
+import { mapGetters, mapState } from 'vuex'

 import { library } from '@fortawesome/fontawesome-svg-core'
 import {
@ -77,6 +79,9 @@ const conversation = {
      const maxDepth = this.$store.getters.mergedConfig.maxDepthInThread - 2
      return maxDepth >= 1 ? maxDepth : 1
    },
+    streamingEnabled () {
+      return this.mergedConfig.useStreamingApi && this.mastoUserSocketStatus === WSConnectionStatus.JOINED
+    },
    displayStyle () {
      return this.$store.getters.mergedConfig.conversationDisplay
    },
@ -339,7 +344,11 @@ const conversation = {
    },
    maybeHighlight () {
      return this.isExpanded ? this.highlight : null
-    }
+    },
+    ...mapGetters(['mergedConfig']),
+    ...mapState({
+      mastoUserSocketStatus: state => state.api.mastoUserSocketStatus
+    })
  },
  components: {
    Status,
@ -395,6 +404,11 @@ const conversation = {
    setHighlight (id) {
      if (!id) return
      this.highlight = id
+
+      if (!this.streamingEnabled) {
+        this.$store.dispatch('fetchStatus', id)
+      }
+
      this.$store.dispatch('fetchFavsAndRepeats', id)
      this.$store.dispatch('fetchEmojiReactionsBy', id)
    },
--- a/src/components/desktop_nav/desktop_nav.js
+++ b/src/components/desktop_nav/desktop_nav.js
@ -1,36 +1,54 @@
 import SearchBar from 'components/search_bar/search_bar.vue'
+import ConfirmModal from '../confirm_modal/confirm_modal.vue'
 import { library } from '@fortawesome/fontawesome-svg-core'
+import {
+  publicTimelineVisible,
+  federatedTimelineVisible,
+  bubbleTimelineVisible,
+} from '../../lib/timeline_visibility'
 import {
  faSignInAlt,
  faSignOutAlt,
  faHome,
  faComments,
-  faBell,
  faUserPlus,
  faBullhorn,
  faSearch,
  faTachometerAlt,
  faCog,
-  faInfoCircle
+  faGlobe,
+  faBolt,
+  faUsers,
+  faCommentMedical,
+  faBookmark,
+  faInfoCircle,
+  faUserTie
 } from '@fortawesome/free-solid-svg-icons'
+import { mapState } from 'vuex'

 library.add(
  faSignInAlt,
  faSignOutAlt,
  faHome,
  faComments,
-  faBell,
  faUserPlus,
  faBullhorn,
  faSearch,
  faTachometerAlt,
  faCog,
-  faInfoCircle
+  faGlobe,
+  faBolt,
+  faUsers,
+  faCommentMedical,
+  faBookmark,
+  faInfoCircle,
+  faUserTie
 )

 export default {
  components: {
-    SearchBar
+    SearchBar,
+    ConfirmModal
  },
  data: () => ({
    searchBarHidden: true,
@ -40,7 +58,8 @@ export default {
        window.CSS.supports('-moz-mask-size', 'contain') ||
        window.CSS.supports('-ms-mask-size', 'contain') ||
        window.CSS.supports('-o-mask-size', 'contain')
-    )
+    ),
+    showingConfirmLogout: false
  }),
  computed: {
    enableMask () { return this.supportsMask && this.$store.state.instance.logoMask },
@ -65,25 +84,50 @@ export default {
      })
    },
    logo () { return this.$store.state.instance.logo },
+    mergedConfig () {
+      return this.$store.getters.mergedConfig
+    },
    sitename () { return this.$store.state.instance.name },
+    showNavShortcuts () {
+      return this.mergedConfig.showNavShortcuts
+    },
+    showWiderShortcuts () {
+      return this.mergedConfig.showWiderShortcuts
+    },
+    hideSiteFavicon () {
+      return this.mergedConfig.hideSiteFavicon
+    },
+    hideSiteName () {
+      return this.mergedConfig.hideSiteName
+    },
    hideSitename () { return this.$store.state.instance.hideSitename },
    logoLeft () { return this.$store.state.instance.logoLeft },
    currentUser () { return this.$store.state.users.currentUser },
-    privateMode () { return this.$store.state.instance.private }
+    privateMode () { return this.$store.state.instance.private },
+    shouldConfirmLogout () {
+      return this.$store.getters.mergedConfig.modalOnLogout
+    },
+    showBubbleTimeline () {
+      return this.$store.state.instance.localBubbleInstances.length > 0
+    },
+    ...mapState({
+      publicTimelineVisible,
+      federatedTimelineVisible,
+      bubbleTimelineVisible,
+    })
  },
  methods: {
    scrollToTop () {
      window.scrollTo(0, 0)
    },
-    logout () {
-      this.$router.replace('/main/public')
-      this.$store.dispatch('logout')
-    },
    onSearchBarToggled (hidden) {
      this.searchBarHidden = hidden
    },
    openSettingsModal () {
      this.$store.dispatch('openSettingsModal')
+    },
+    openModModal () {
+      this.$store.dispatch('openModModal')
    }
  }
 }
--- a/src/components/desktop_nav/desktop_nav.scss
+++ b/src/components/desktop_nav/desktop_nav.scss
@ -3,6 +3,10 @@
 .DesktopNav {
  width: 100%;

+  input {
+    color: var(--inputTopbarText, var(--inputText));
+  }
+
  a {
    color: var(--topBarLink, $fallback--link);
  }
@ -11,16 +15,16 @@
    display: grid;
    grid-template-rows: var(--navbar-height);
    grid-template-columns: 2fr auto 2fr;
-    grid-template-areas: "sitename logo actions";
+    grid-template-areas: "nav-left logo actions";
    box-sizing: border-box;
    padding: 0 1.2em;
    margin: auto;
-    max-width: 980px;
+    max-width: 1110px;
  }

  &.-logoLeft .inner-nav {
    grid-template-columns: auto 2fr 2fr;
-    grid-template-areas: "logo sitename actions";
+    grid-template-areas: "logo nav-left actions";
  }

  .button-default {
@ -85,14 +89,43 @@
    height: 100%;
    text-align: center;

+    &.router-link-active {
+      font-size: 1.2em;
+      margin-top: 0.05em;
+
+      .svg-inline--fa {
+        font-weight: bolder;
+        color: $fallback--text;
+        color: var(--selectedMenuText, $fallback--text);
+        --lightText: var(--selectedMenuLightText, $fallback--lightText);
+      }
+    }
+
    .svg-inline--fa {
      color: $fallback--link;
      color: var(--topBarLink, $fallback--link);
    }
  }

-  .sitename {
-    grid-area: sitename;
+  .-wide {
+    .nav-icon {
+      margin-left: 0.7em;
+    }
+  }
+
+  .left {
+    padding-left: 5px;
+    display: flex;
+  }
+
+  .nav-left-wrapper {
+    grid-area: nav-left;
+
+    .favicon {
+      height: 28px;
+      vertical-align: middle;
+      padding-right: 5px;
+    }
  }

  .actions {
--- a/src/components/desktop_nav/desktop_nav.vue
+++ b/src/components/desktop_nav/desktop_nav.vue
@ -5,16 +5,81 @@
    :class="{ '-logoLeft': logoLeft }"
    @click="scrollToTop()"
  >
-    <div class="inner-nav">
-      <div class="item sitename">
+    <div
+      class="inner-nav"
+      :class="{ '-wide': showWiderShortcuts }"
+    >
+      <div class="item nav-left-wrapper">
        <router-link
-          v-if="!hideSitename"
-          class="site-name"
+          class="site-brand"
          :to="{ name: 'root' }"
          active-class="home"
        >
-          {{ sitename }}
+          <img
+            v-if="!hideSiteFavicon"
+            class="favicon"
+            src="/favicon.png"
+          >
+          <span
+            v-if="!hideSiteName"
+            class="site-name"
+          >
+            {{ sitename }}
+          </span>
        </router-link>
+        <div
+          v-if="(currentUser || !privateMode) && showNavShortcuts"
+          class="nav-items left"
+        >
+          <router-link
+            v-if="currentUser"
+            :to="{ name: 'friends' }"
+            class="nav-icon"
+          >
+            <FAIcon
+              fixed-width
+              class="fa-scale-110 fa-old-padding"
+              icon="home"
+              :title="$t('nav.home_timeline')"
+            />
+          </router-link>
+          <router-link
+            :to="{ name: 'public-timeline' }"
+            class="nav-icon"
+            v-if="publicTimelineVisible"
+          >
+            <FAIcon
+              fixed-width
+              class="fa-scale-110 fa-old-padding"
+              icon="users"
+              :title="$t('nav.public_tl')"
+            />
+          </router-link>
+          <router-link
+            v-if="bubbleTimelineVisible"
+            :to="{ name: 'bubble-timeline' }"
+            class="nav-icon"
+          >
+            <FAIcon
+              fixed-width
+              class="fa-scale-110 fa-old-padding"
+              icon="circle"
+              :title="$t('nav.bubble_timeline')"
+            />
+          </router-link>
+          <router-link
+            :to="{ name: 'public-external-timeline' }"
+            class="nav-icon"
+            v-if="federatedTimelineVisible"
+          >
+            <FAIcon
+              fixed-width
+              class="fa-scale-110 fa-old-padding"
+              icon="globe"
+              :title="$t('nav.twkn')"
+            />
+          </router-link>
+        </div>
      </div>
      <router-link
        class="logo"
@ -36,6 +101,47 @@
          @toggled="onSearchBarToggled"
          @click.stop
        />
+        <div
+          v-if="(currentUser || !privateMode) && showNavShortcuts"
+          class="nav-items right"
+        >
+          <router-link
+            v-if="currentUser"
+            class="nav-icon"
+            :to="{ name: 'interactions', params: { username: currentUser.screen_name } }"
+          >
+            <FAIcon
+              fixed-width
+              class="fa-scale-110 fa-old-padding"
+              icon="bolt"
+              :title="$t('nav.interactions')"
+            />
+          </router-link>
+          <router-link
+            v-if="currentUser"
+            :to="{ name: 'lists' }"
+            class="nav-icon"
+          >
+            <FAIcon
+              fixed-width
+              class="fa-scale-110 fa-old-padding"
+              icon="list"
+              :title="$t('nav.lists')"
+            />
+          </router-link>
+          <router-link
+            v-if="currentUser"
+            :to="{ name: 'bookmarks' }"
+            class="nav-icon"
+          >
+            <FAIcon
+              fixed-width
+              class="fa-scale-110 fa-old-padding"
+              icon="bookmark"
+              :title="$t('nav.bookmarks')"
+            />
+          </router-link>
+        </div>
        <button
          class="button-unstyled nav-icon"
          @click.stop="openSettingsModal"
@ -47,6 +153,18 @@
            :title="$t('nav.preferences')"
          />
        </button>
+        <button
+          v-if="currentUser && currentUser.role === 'admin' || currentUser.role === 'moderator'"
+          class="button-unstyled nav-icon"
+          @click.stop="openModModal"
+        >
+          <FAIcon
+            fixed-width
+            class="fa-scale-110 fa-old-padding"
+            icon="user-tie"
+            :title="$t('nav.moderation')"
+          />
+        </button>
        <a
          v-if="currentUser && currentUser.role === 'admin'"
          href="/pleroma/admin/#/login-pleroma"
@ -61,20 +179,20 @@
            :title="$t('nav.administration')"
          />
        </a>
-        <button
-          v-if="currentUser"
-          class="button-unstyled nav-icon"
-          @click.prevent="logout"
-        >
-          <FAIcon
-            fixed-width
-            class="fa-scale-110 fa-old-padding"
-            icon="sign-out-alt"
-            :title="$t('login.logout')"
-          />
-        </button>
      </div>
    </div>
+    <teleport to="#modal">
+      <confirm-modal
+        v-if="showingConfirmLogout"
+        :title="$t('login.logout_confirm_title')"
+        :confirm-text="$t('login.logout_confirm_accept_button')"
+        :cancel-text="$t('login.logout_confirm_cancel_button')"
+        @accepted="doLogout"
+        @cancelled="hideConfirmLogout"
+      >
+        {{ $t('login.logout_confirm') }}
+      </confirm-modal>
+    </teleport>
  </nav>
 </template>
 <script src="./desktop_nav.js"></script>
--- a/src/components/dialog_modal/dialog_modal.vue
+++ b/src/components/dialog_modal/dialog_modal.vue
@ -39,7 +39,7 @@
    right: 0;
    top: 0;
    background: rgba(27,31,35,.5);
-    z-index: 99;
+    z-index: 2000;
  }
 }

@ -51,9 +51,10 @@
  margin: 15vh auto;
  position: fixed;
  transform: translateX(-50%);
-  z-index: 999;
+  z-index: 2001;
  cursor: default;
  display: block;
+  width: max-content;
  background-color: $fallback--bg;
  background-color: var(--bg, $fallback--bg);

--- a/src/components/edit_status_modal/edit_status_modal.js
+++ b/src/components/edit_status_modal/edit_status_modal.js
@ -0,0 +1,75 @@
+import PostStatusForm from '../post_status_form/post_status_form.vue'
+import Modal from '../modal/modal.vue'
+import statusPosterService from '../../services/status_poster/status_poster.service.js'
+import get from 'lodash/get'
+
+const EditStatusModal = {
+  components: {
+    PostStatusForm,
+    Modal
+  },
+  data () {
+    return {
+      resettingForm: false
+    }
+  },
+  computed: {
+    isLoggedIn () {
+      return !!this.$store.state.users.currentUser
+    },
+    modalActivated () {
+      return this.$store.state.editStatus.modalActivated
+    },
+    isFormVisible () {
+      return this.isLoggedIn && !this.resettingForm && this.modalActivated
+    },
+    params () {
+      return this.$store.state.editStatus.params || {}
+    }
+  },
+  watch: {
+    params (newVal, oldVal) {
+      if (get(newVal, 'statusId') !== get(oldVal, 'statusId')) {
+        this.resettingForm = true
+        this.$nextTick(() => {
+          this.resettingForm = false
+        })
+      }
+    },
+    isFormVisible (val) {
+      if (val) {
+        this.$nextTick(() => this.$el && this.$el.querySelector('textarea').focus())
+      }
+    }
+  },
+  methods: {
+    doEditStatus ({ status, spoilerText, sensitive, media, contentType, poll }) {
+      const params = {
+        store: this.$store,
+        statusId: this.$store.state.editStatus.params.statusId,
+        status,
+        spoilerText,
+        sensitive,
+        poll,
+        media,
+        contentType
+      }
+
+      return statusPosterService.editStatus(params)
+        .then((data) => {
+          return data
+        })
+        .catch((err) => {
+          console.error('Error editing status', err)
+          return {
+            error: err.message
+          }
+        })
+    },
+    closeModal () {
+      this.$store.dispatch('closeEditStatusModal')
+    }
+  }
+}
+
+export default EditStatusModal
--- a/src/components/edit_status_modal/edit_status_modal.vue
+++ b/src/components/edit_status_modal/edit_status_modal.vue
@ -0,0 +1,48 @@
+<template>
+  <Modal
+    v-if="isFormVisible"
+    class="edit-form-modal-view"
+    @backdropClicked="closeModal"
+  >
+    <div class="edit-form-modal-panel panel">
+      <div class="panel-heading">
+        {{ $t('post_status.edit_status') }}
+      </div>
+      <PostStatusForm
+        class="panel-body"
+        v-bind="params"
+        @posted="closeModal"
+        :disablePolls="true"
+        :disableVisibilitySelector="true"
+        :post-handler="doEditStatus"
+      />
+    </div>
+  </Modal>
+</template>
+
+<script src="./edit_status_modal.js"></script>
+
+<style lang="scss">
+.modal-view.edit-form-modal-view {
+  align-items: flex-start;
+}
+.edit-form-modal-panel {
+  flex-shrink: 0;
+  margin-top: 25%;
+  margin-bottom: 2em;
+  width: 100%;
+  max-width: 700px;
+
+  @media (orientation: landscape) {
+    margin-top: 8%;
+  }
+
+  .form-bottom-left {
+    max-width: 6.5em;
+
+    .emoji-icon {
+      justify-content: right;
+    }
+  }
+}
+</style>
--- a/src/components/emoji_grid/emoji_grid.js
+++ b/src/components/emoji_grid/emoji_grid.js
@ -0,0 +1,133 @@
+const EMOJI_SIZE = 32 + 8
+const GROUP_TITLE_HEIGHT = 24
+const BUFFER_SIZE = 3 * EMOJI_SIZE
+
+const EmojiGrid = {
+  props: {
+    groups: {
+      required: true,
+      type: Array
+    }
+  },
+  data () {
+    return {
+      containerWidth: 0,
+      containerHeight: 0,
+      scrollPos: 0,
+      resizeObserver: null
+    }
+  },
+  mounted () {
+    const rect = this.$refs.container.getBoundingClientRect()
+    this.containerWidth = rect.width
+    this.containerHeight = rect.height
+    this.resizeObserver = new ResizeObserver((entries) => {
+      for (const entry of entries) {
+        this.containerWidth = entry.contentRect.width
+        this.containerHeight = entry.contentRect.height
+      }
+    })
+    this.resizeObserver.observe(this.$refs.container)
+  },
+  beforeUnmount () {
+    this.resizeObserver.disconnect()
+    this.resizeObserver = null
+  },
+  watch: {
+    groups () {
+      // Scroll to top when grid content changes
+      if (this.$refs.container) {
+        this.$refs.container.scrollTo(0, 0)
+      }
+    },
+    activeGroup (group) {
+      this.$emit('activeGroup', group)
+    }
+  },
+  methods: {
+    onScroll () {
+      this.scrollPos = this.$refs.container.scrollTop
+    },
+    onEmoji (emoji) {
+      this.$emit('emoji', emoji)
+    },
+    scrollToItem (itemId) {
+      const container = this.$refs.container
+      if (!container) return
+
+      for (const item of this.itemList) {
+        if (item.id === itemId) {
+          container.scrollTo(0, item.position.y)
+          return
+        }
+      }
+    }
+  },
+  computed: {
+    // Total height of scroller content
+    gridHeight () {
+      if (this.itemList.length === 0) return 0
+      const lastItem = this.itemList[this.itemList.length - 1]
+      return (
+        lastItem.position.y +
+        ('title' in lastItem ? GROUP_TITLE_HEIGHT : EMOJI_SIZE)
+      )
+    },
+    activeGroup () {
+      const items = this.itemList
+      for (let i = items.length - 1; i >= 0; i--) {
+        const item = items[i]
+        if ('title' in item && item.position.y <= this.scrollPos) {
+          return item.id
+        }
+      }
+      return null
+    },
+    itemList () {
+      const items = []
+      let x = 0
+      let y = 0
+      for (const group of this.groups) {
+        items.push({ position: { x, y }, id: group.id, title: group.text })
+        if (group.text.length) {
+          y += GROUP_TITLE_HEIGHT
+        }
+        for (const emoji of group.emojis) {
+          items.push({
+            position: { x, y },
+            id: `${group.id}-${emoji.displayText}`,
+            emoji
+          })
+          x += EMOJI_SIZE
+          if (x + EMOJI_SIZE > this.containerWidth) {
+            y += EMOJI_SIZE
+            x = 0
+          }
+        }
+        if (x > 0) {
+          y += EMOJI_SIZE
+          x = 0
+        }
+      }
+      return items
+    },
+    visibleItems () {
+      const startPos = this.scrollPos - BUFFER_SIZE
+      const endPos = this.scrollPos + this.containerHeight + BUFFER_SIZE
+      return this.itemList.filter((i) => {
+        return i.position.y >= startPos && i.position.y < endPos
+      })
+    },
+    scrolledClass () {
+      if (this.scrollPos <= 5) {
+        return 'scrolled-top'
+      } else if (this.scrollPos >= this.gridHeight - this.containerHeight - 5) {
+        return 'scrolled-bottom'
+      } else {
+        return 'scrolled-middle'
+      }
+    }
+  }
+}
+
+export default EmojiGrid
--- a/Show more
+++ b/Show more