🚀 Launch 1.3.6+3

💄 Optimize the style with background image
🐛 Bug fixes with background image
2024-10-06 19:57:17 +08:00 · 2024-10-06 19:54:32 +08:00 · 2024-10-06 19:41:44 +08:00 · 2024-10-06 19:29:47 +08:00 · 2024-10-06 17:37:07 +08:00 · 2024-10-06 17:31:44 +08:00
120 changed files with 4763 additions and 2968 deletions
--- a/android/app/src/main/AndroidManifest.xml
+++ b/android/app/src/main/AndroidManifest.xml
@ -1,4 +1,4 @@
-<manifest xmlns:android="http://schemas.android.com/apk/res/android">
+<manifest xmlns:android="http://schemas.android.com/apk/res/android" package="dev.solsynth.solian">
    <uses-feature android:name="android.hardware.camera" />
    <uses-feature android:name="android.hardware.camera.autofocus" />
    <uses-permission android:name="android.permission.WAKE_LOCK" />
--- a/android/gradle.properties
+++ b/android/gradle.properties
@ -4,3 +4,4 @@ android.enableJetifier=true
 android.defaults.buildfeatures.buildconfig=true
 android.nonTransitiveRClass=false
 android.nonFinalResIds=false
+kotlin.jvm.target.validation.mode = IGNORE
--- a/android/gradle/wrapper/gradle-wrapper.properties
+++ b/android/gradle/wrapper/gradle-wrapper.properties
@ -2,4 +2,4 @@ distributionBase=GRADLE_USER_HOME
 distributionPath=wrapper/dists
 zipStoreBase=GRADLE_USER_HOME
 zipStorePath=wrapper/dists
-distributionUrl=https\://services.gradle.org/distributions/gradle-8.6-all.zip
+distributionUrl=https\://services.gradle.org/distributions/gradle-8.7-all.zip
--- a/android/settings.gradle
+++ b/android/settings.gradle
@ -18,7 +18,7 @@ pluginManagement {

 plugins {
    id "dev.flutter.flutter-plugin-loader" version "1.0.0"
-    id "com.android.application" version '8.4.0' apply false
+    id "com.android.application" version '8.6.0' apply false
    id "com.google.gms.google-services" version "4.3.15" apply false
    id "com.google.firebase.crashlytics" version "2.8.1" apply false
    id "org.jetbrains.kotlin.android" version '2.0.0' apply false
--- a/assets/locales/en_us.json
+++ b/assets/locales/en_us.json
@ -22,9 +22,9 @@
  "explore": "Explore",
  "posts": "Posts",
  "unlink": "Unlink",
-  "feedSearch": "Search Feed",
-  "feedSearchWithTag": "Searching with tag #@key",
-  "feedSearchWithCategory": "Searching in category @category",
+  "postSearch": "Search Post",
+  "postSearchWithTag": "Searching with tag #@key",
+  "postSearchWithCategory": "Searching in category @category",
  "feedUnreadCount": "@count posts you may missed",
  "messages": "Messages",
  "messagesUnreadCount": "@count messages unread",
@ -55,7 +55,7 @@
  "edit": "Edit",
  "delete": "Delete",
  "settings": "Settings",
-  "settingsNotificationBgService": "Background Notification Service",
+  "settingsNotificationBgService": "Background notification service",
  "settingsNotificationBgServiceDesc": "A notification service is always installed on the device, so that some devices that do not support push notifications can receive notifications in the background. When this feature is enabled, push notifications will not be registered with the server, and you will always appear to be online in the eyes of others (except for invisible). You may need to turn off power and traffic optimization in the settings.",
  "search": "Search",
  "post": "Post",
@ -68,6 +68,11 @@
  "notificationUnreadCount": "@count unread notifications",
  "errorHappened": "An error occurred",
  "errorHappenedUnauthorized": "Unauthorized request, please sign in or try resign in.",
+  "errorHappenedRequestBad": "Request error, the server refused to process the request. Please check your request data.",
+  "errorHappenedRequestForbidden": "Request error, insufficient permissions.",
+  "errorHappenedRequestNotFound": "Request error, the requested data does not exist.",
+  "errorHappenedRequestConnection": "Network request failed. Please check the connection status and service status, then try again.",
+  "errorHappenedRequestUnknown": "Request error, unknown type. Please take a full screenshot of this message and submit feedback.",
  "forgotPassword": "Forgot password",
  "email": "Email",
  "username": "Username",
@ -93,6 +98,8 @@
  "accountFriendBlocked": "Friend blocklist",
  "accountFriendListHint": "Swipe left to decline, right to approve",
  "accountFriendRequestSent": "Friend request sent, waiting for processing...",
+  "accountBlocked": "Account has been blocked",
+  "accountUnblocked": "Account has been unblocked",
  "accountSuspended": "Account was suspended",
  "accountSuspendedAt": "Account was suspended since @date",
  "aspectRatio": "Aspect Ratio",
@ -157,6 +164,9 @@
  "postListNews": "News",
  "postListFriends": "Friends",
  "postListShuffle": "Random",
+  "attachmentThumbnail": "Thumbnail",
+  "attachmentThumbnailAttachmentNew": "Upload thumbnail",
+  "attachmentThumbnailAttachment": "Attachment serial number",
  "postEditorModeStory": "Post a post",
  "postEditorModeArticle": "Post an article",
  "postEditor": "Post editor",
@ -225,6 +235,8 @@
  "realmDescription": "Description",
  "realmPublic": "Public Realm",
  "realmCommunity": "Community Realm",
+  "realmAvatar": "Realm avatar",
+  "realmBanner": "Realm banner",
  "realmDetail": "Realm detail",
  "realmMember": "Realm member",
  "realmMembers": "Realm members",
@ -250,7 +262,8 @@
  "channelName": "Name",
  "channelDescription": "Description",
  "channelDirectDescription": "Direct message with @username",
-  "channelEncrypted": "Encrypted Channel",
+  "channelPublic": "Public channel",
+  "channelCommunity": "Community channel",
  "channelMember": "Channel member",
  "channelMembers": "Channel members",
  "channelMembersAdd": "Add channel members",
@ -344,8 +357,7 @@
  "bsCheckForUpdate": "Checking For Updates",
  "bsCheckForUpdateFailed": "Unable to Check Updates",
  "bsCheckForUpdateNew": "Found New Version",
-  "bsCheckForUpdateDescApple": "Please head to TestFlight and update your app to latest version to prevent error happens and get latest functions.",
-  "bsCheckForUpdateDescCommon": "Please head to our website download and install latest version of application to prevent error happens and get latest functions.",
+  "bsCheckForUpdateDesc": "Please head to app store and update your app to latest version to prevent error happens and get latest functions.",
  "bsCheckingServer": "Checking Server Status",
  "bsCheckingServerFail": "Unable connect to server, check your network connection",
  "bsCheckingServerDown": "Server currently unavailable, please retry later",
@ -407,5 +419,63 @@
  "userLevel13": "Immortal",
  "postBrowsingIn": "Browsing in @region",
  "needRestartToApply": "Restart the application to take effect",
-  "holdToSeeDetail": "Long press / Mouse hover to see detail"
+  "holdToSeeDetail": "Long press / Mouse hover to see detail",
+  "subscribe": "Subscribe",
+  "subscribed": "Subscribed",
+  "unsubscribe": "Unsubscribe",
+  "preferences": "Preferences",
+  "notificationPreferences": "Notification preferences",
+  "notificationTopicPostFeedback": "Post feedbacks",
+  "notificationTopicPostSubscription": "Post subscriptions",
+  "preferencesApplied": "Preferences has been applied.",
+  "save": "Save",
+  "updateAvailable": "Update available",
+  "updateAvailableDesc": "There is an update available (@from to @to). Do you want to download and install it now? You can still use the app normally while waiting for the download to complete.",
+  "update": "Update",
+  "updateCheckStrictly": "Strict mode",
+  "updateCheckStrictlyDesc": "If enabled, the app will ask for updating once the local version is different from remote one.",
+  "updateMayAvailable": "App version @version is available, you can update from app store or our website.",
+  "updateNow": "Update now",
+  "termAccept": "I've read and agree to Solar Network's Terms",
+  "termAcceptDesc": "Including but not limited to \"User Agreement\" and \"Privacy Policy\"",
+  "termAcceptLink": "View terms",
+  "termAcceptNextWithAgree": "By clicking the \"Next\", it means you agree to our terms and its updates. You should already agreed with them while you sign up.",
+  "termRelated": "Related Terms",
+  "appDetails": "App Details",
+  "projectWebsite": "Project Website",
+  "iAmNotRobot": "I'm not a Robot",
+  "report": "Report",
+  "reportAbuse": "Report abuse",
+  "reportAbuseDesc": "Report any violation of service terms",
+  "reportAbuseResource": "Resource identifier",
+  "reportAbuseReason": "Report reason",
+  "reportSubmitted": "Report submitted, thank you for your contribution. We will send a notification about the result of the report within 24 hours for you.",
+  "accountDeletion": "Request account deletion",
+  "accountDeletionDesc": "Delete the current account and all its data. Note that this action is irreversible!",
+  "accountDeletionConfirm": "Confirm request account deletion",
+  "accountDeletionConfirmDesc": "Are you sure to delete account @account? You will receive a confirmation email with a link to confirm the deletion of the account within 24 hours. Note that this action is irreversible, and all data associated with the account will be deleted, and you should be careful about it.",
+  "accountDeletionRequested": "Account deletion requested, check your inbox to confirm the request.",
+  "slideToConfirm": "Slide to confirm",
+  "serviceStatus": "Status of Service",
+  "firstBootTime": "First boot at @time",
+  "rateTheApp": "Rate the app",
+  "rateTheAppDesc": "Rate Solar Network on the App Store to let us serve you better!",
+  "friendAdd": "Add as friend",
+  "blockUser": "Block user",
+  "unblockUser": "Unblock user",
+  "learnMoreAboutPerson": "Learn more about that person",
+  "global": "Global",
+  "all": "All",
+  "unablePreview": "Unable to preview",
+  "dashboardNav": "Dash",
+  "accountNav": "You",
+  "performance": "Performance",
+  "animatedMessageList": "Non-animated message list",
+  "animatedMessageListDesc": "Remove animation effects in message list, to reduce cause lag",
+  "theme": "Theme",
+  "globalTheme": "Global theme",
+  "agedTheme": "Old school style theme",
+  "agedThemeDesc": "Downgrade the global theme to Material Design 2. Unexpected issues may occur. For experimental use only.",
+  "appBackgroundImage": "Global background image",
+  "appBackgroundImageDesc": "The global background image will be displayed on all pages"
 }
--- a/assets/locales/zh_cn.json
+++ b/assets/locales/zh_cn.json
@ -32,9 +32,9 @@
  "dashboard": "仪表盘",
  "today": "今日",
  "yesterday": "昨日",
-  "feedSearch": "搜索资讯",
-  "feedSearchWithTag": "检索带有 #@key 标签的资讯",
-  "feedSearchWithCategory": "检索位于分类 @category 的资讯",
+  "postSearch": "搜索帖子",
+  "postSearchWithTag": "检索带有 #@key 标签的资讯",
+  "postSearchWithCategory": "检索位于分类 @category 的资讯",
  "feedUnreadCount": "@count 条你可能错过的帖子",
  "messages": "消息",
  "messagesUnreadCount": "@count 条未读的消息",
@ -98,6 +98,8 @@
  "accountFriendBlocked": "好友黑名单",
  "accountFriendListHint": "左滑来拒绝，右滑来接受",
  "accountFriendRequestSent": "好友请求已发送，等待处理对方中……",
+  "accountBlocked": "已屏蔽账号",
+  "accountUnblocked": "已解除屏蔽账号",
  "accountSuspended": "帐号被停用",
  "accountSuspendedAt": "该帐号自 @date 起被停用",
  "aspectRatio": "纵横比",
@ -168,6 +170,9 @@
  "postListNews": "新鲜事",
  "postListFriends": "好友圈",
  "postListShuffle": "打乱看",
+  "attachmentThumbnail": "附件缩略图",
+  "attachmentThumbnailAttachmentNew": "上传附件作为缩略图",
+  "attachmentThumbnailAttachment": "附件序列号",
  "postNew": "创建新帖子",
  "postNewInRealmHint": "在领域 @realm 里发表新帖子",
  "postAction": "发表",
@ -226,6 +231,8 @@
  "realmDescription": "领域简介",
  "realmPublic": "公开领域",
  "realmCommunity": "社区领域",
+  "realmAvatar": "领域头像",
+  "realmBanner": "领域横幅",
  "realmDetail": "领域详情",
  "realmMember": "领域成员",
  "realmMembers": "领域成员",
@ -251,14 +258,15 @@
  "channelName": "显示名称",
  "channelDescription": "频道简介",
  "channelDirectDescription": "与 @username 的私聊",
-  "channelEncrypted": "加密频道",
+  "channelPublic": "公开频道",
+  "channelCommunity": "社区频道",
  "channelMember": "频道成员",
  "channelMembers": "频道成员",
  "channelMembersAdd": "添加频道成员",
  "channelMembersAddHint": "到 @channel",
  "channelType": "频道类型",
  "channelTypeCommon": "普通频道",
-  "channelTypeDirect": "私信聊天",
+  "channelTypeDirect": "私信",
  "channelAdjust": "调整频道",
  "channelDetail": "频道详情",
  "channelSettings": "频道设置",
@ -345,8 +353,7 @@
  "bsCheckForUpdate": "正在检查更新",
  "bsCheckForUpdateFailed": "无法检查更新",
  "bsCheckForUpdateNew": "发现新版本",
-  "bsCheckForUpdateDescApple": "请前往 TestFlight 并将您的应用程序更新到最新版本，以防止出现错误并获取最新功能。",
-  "bsCheckForUpdateDescCommon": "请前往我们的网站下载并安装最新版本的应用程序，以防止出现错误并获取最新功能。",
+  "bsCheckForUpdateDesc": "请前往应用商店并将您的应用程序更新到最新版本，以防止出现错误并获取最新功能。",
  "bsCheckingServer": "检查服务器状态中",
  "bsCheckingServerFail": "无法连接至服务器，请检查你的网络连接状态",
  "bsCheckingServerDown": "当前服务器不可用，请稍后重试",
@ -408,5 +415,63 @@
  "userLevel13": "万古流芳",
  "postBrowsingIn": "浏览 @region 内的帖子中",
  "needRestartToApply": "需要重启应用来生效",
-  "holdToSeeDetail": "长按 / 鼠标悬浮来查看详情"
+  "holdToSeeDetail": "长按 / 鼠标悬浮来查看详情",
+  "subscribe": "订阅",
+  "subscribed": "已订阅",
+  "unsubscribe": "取消订阅",
+  "preferences": "偏好设置",
+  "notificationPreferences": "通知偏好设置",
+  "notificationTopicPostFeedback": "帖子反馈",
+  "notificationTopicPostSubscription": "订阅源",
+  "preferencesApplied": "偏好设置已应用",
+  "save": "保存",
+  "updateAvailable": "有可用更新",
+  "updateAvailableDesc": "有可用更新 (@from 到 @to) 你想现在下载安装吗？在等待下载期间你仍可以正常使用。",
+  "update": "更新",
+  "updateCheckStrictly": "严格模式",
+  "updateCheckStrictlyDesc": "如果启用，应用程序将会在本地版本与远程版本不同时询问更新，而不会检查版本号大小。",
+  "updateNow": "立即更新",
+  "updateMayAvailable": "版本 @version 现已可用，你可以前往应用商店或是我们的官网下载更新。",
+  "termAccept": "我已阅读并同意 Solar Network 各项条款",
+  "termAcceptDesc": "包括但不限于《用户守则》和《隐私政策》",
+  "termAcceptLink": "浏览条款",
+  "termAcceptNextWithAgree": "点击 “下一步”，即表示你同意我们的各项条款，包括其之后的更新。你应该在注册时已经同意过了。",
+  "termRelated": "相关条款",
+  "projectWebsite": "项目网站",
+  "appDetails": "应用详情",
+  "iAmNotRobot": "我不是机器人",
+  "report": "举报",
+  "reportAbuse": "举报滥用",
+  "reportAbuseDesc": "举报任何违反服务条款的行为",
+  "reportAbuseResource": "举报的资源",
+  "reportAbuseReason": "举报的原因",
+  "reportSubmitted": "举报已提交，感谢你的贡献。我们将通过通知在 24 小时内通知该举报的处理结果。",
+  "accountDeletion": "请求删除账号",
+  "accountDeletionDesc": "删除目前登陆的账号，及其所有的数据。注意，该操作不可撤销！",
+  "accountDeletionConfirm": "确认账号删除请求",
+  "accountDeletionConfirmDesc": "你确定要删除账号 @account 吗？你将会在其绑定的主要邮件地址收到一封包含着确认删除账号连接的邮件，在二十四小时内使用该连接即可完成删除账号。注意，本操作不可撤销，并且账号创建或关联的所有数据都将被删除，请三思而后行。",
+  "accountDeletionRequested": "已请求删除账号，检查你的收件箱来确认请求。",
+  "slideToConfirm": "滑动来确认",
+  "serviceStatus": "服务状态",
+  "firstBootTime": "首次启动于 @time",
+  "rateTheApp": "给应用评分",
+  "rateTheAppDesc": "在 App Store 上给 Solar Network 评分，让我们更好地为您服务吧！",
+  "friendAdd": "添加好友",
+  "blockUser": "屏蔽用户",
+  "unblockUser": "解除屏蔽用户",
+  "learnMoreAboutPerson": "了解关于 TA 的更多",
+  "global": "全局",
+  "all": "全部",
+  "unablePreview": "无法预览",
+  "dashboardNav": "仪表盘",
+  "accountNav": "您",
+  "performance": "性能",
+  "animatedMessageList": "无动画消息列表",
+  "animatedMessageListDesc": "在消息列表中禁用动画效果",
+  "theme": "主题",
+  "globalTheme": "全局应用主题",
+  "agedTheme": "过时主题",
+  "agedThemeDesc": "将全局主题降级为 Material Design 2，可能发生意料之外的问题，仅供实验使用",
+  "appBackgroundImage": "全局背景图片",
+  "appBackgroundImageDesc": "全局背景图片将会在所有页面中展示"
 }
--- a/ios/Podfile.lock
+++ b/ios/Podfile.lock
@ -54,26 +54,26 @@ PODS:
  - Firebase/Performance (11.0.0):
    - Firebase/CoreOnly
    - FirebasePerformance (~> 11.0.0)
-  - firebase_analytics (11.3.1):
+  - firebase_analytics (11.3.2):
    - Firebase/Analytics (= 11.0.0)
    - firebase_core
    - Flutter
-  - firebase_core (3.4.1):
+  - firebase_core (3.5.0):
    - Firebase/CoreOnly (= 11.0.0)
    - Flutter
-  - firebase_crashlytics (4.1.1):
+  - firebase_crashlytics (4.1.2):
    - Firebase/Crashlytics (= 11.0.0)
    - firebase_core
    - Flutter
-  - firebase_messaging (15.1.1):
+  - firebase_messaging (15.1.2):
    - Firebase/Messaging (= 11.0.0)
    - firebase_core
    - Flutter
-  - firebase_performance (0.10.0-6):
+  - firebase_performance (0.10.0-7):
    - Firebase/Performance (= 11.0.0)
    - firebase_core
    - Flutter
-  - FirebaseABTesting (11.1.0):
+  - FirebaseABTesting (11.2.0):
    - FirebaseCore (~> 11.0)
  - FirebaseAnalytics (11.0.0):
    - FirebaseAnalytics/AdIdSupport (= 11.0.0)
@ -97,9 +97,9 @@ PODS:
    - FirebaseCoreInternal (~> 11.0)
    - GoogleUtilities/Environment (~> 8.0)
    - GoogleUtilities/Logger (~> 8.0)
-  - FirebaseCoreExtension (11.1.0):
+  - FirebaseCoreExtension (11.2.0):
    - FirebaseCore (~> 11.0)
-  - FirebaseCoreInternal (11.1.0):
+  - FirebaseCoreInternal (11.2.0):
    - "GoogleUtilities/NSData+zlib (~> 8.0)"
  - FirebaseCrashlytics (11.0.0):
    - FirebaseCore (~> 11.0)
@ -110,7 +110,7 @@ PODS:
    - GoogleUtilities/Environment (~> 8.0)
    - nanopb (~> 3.30910.0)
    - PromisesObjC (~> 2.4)
-  - FirebaseInstallations (11.1.0):
+  - FirebaseInstallations (11.2.0):
    - FirebaseCore (~> 11.0)
    - GoogleUtilities/Environment (~> 8.0)
    - GoogleUtilities/UserDefaults (~> 8.0)
@ -134,7 +134,7 @@ PODS:
    - GoogleUtilities/MethodSwizzler (~> 8.0)
    - GoogleUtilities/UserDefaults (~> 8.0)
    - nanopb (~> 3.30910.0)
-  - FirebaseRemoteConfig (11.1.0):
+  - FirebaseRemoteConfig (11.2.0):
    - FirebaseABTesting (~> 11.0)
    - FirebaseCore (~> 11.0)
    - FirebaseInstallations (~> 11.0)
@ -142,8 +142,8 @@ PODS:
    - FirebaseSharedSwift (~> 11.0)
    - GoogleUtilities/Environment (~> 8.0)
    - "GoogleUtilities/NSData+zlib (~> 8.0)"
-  - FirebaseRemoteConfigInterop (11.1.0)
-  - FirebaseSessions (11.1.0):
+  - FirebaseRemoteConfigInterop (11.2.0)
+  - FirebaseSessions (11.2.0):
    - FirebaseCore (~> 11.0)
    - FirebaseCoreExtension (~> 11.0)
    - FirebaseInstallations (~> 11.0)
@ -152,8 +152,10 @@ PODS:
    - GoogleUtilities/UserDefaults (~> 8.0)
    - nanopb (~> 3.30910.0)
    - PromisesSwift (~> 2.1)
-  - FirebaseSharedSwift (11.1.0)
+  - FirebaseSharedSwift (11.2.0)
  - Flutter (1.0.0)
+  - flutter_app_update (0.0.1):
+    - Flutter
  - flutter_background_service_ios (0.0.3):
    - Flutter
  - flutter_keyboard_visibility (0.0.1):
@ -225,7 +227,9 @@ PODS:
    - TOCropViewController (~> 2.7.4)
  - image_picker_ios (0.0.1):
    - Flutter
-  - livekit_client (2.2.5):
+  - in_app_review (0.2.0):
+    - Flutter
+  - livekit_client (2.2.6):
    - Flutter
    - WebRTC-SDK (= 125.6422.04)
  - media_kit_libs_ios_video (1.0.4):
@ -306,6 +310,7 @@ DEPENDENCIES:
  - firebase_messaging (from `.symlinks/plugins/firebase_messaging/ios`)
  - firebase_performance (from `.symlinks/plugins/firebase_performance/ios`)
  - Flutter (from `Flutter`)
+  - flutter_app_update (from `.symlinks/plugins/flutter_app_update/ios`)
  - flutter_background_service_ios (from `.symlinks/plugins/flutter_background_service_ios/ios`)
  - flutter_keyboard_visibility (from `.symlinks/plugins/flutter_keyboard_visibility/ios`)
  - flutter_local_notifications (from `.symlinks/plugins/flutter_local_notifications/ios`)
@ -315,6 +320,7 @@ DEPENDENCIES:
  - gal (from `.symlinks/plugins/gal/darwin`)
  - image_cropper (from `.symlinks/plugins/image_cropper/ios`)
  - image_picker_ios (from `.symlinks/plugins/image_picker_ios/ios`)
+  - in_app_review (from `.symlinks/plugins/in_app_review/ios`)
  - livekit_client (from `.symlinks/plugins/livekit_client/ios`)
  - media_kit_libs_ios_video (from `.symlinks/plugins/media_kit_libs_ios_video/ios`)
  - media_kit_native_event_loop (from `.symlinks/plugins/media_kit_native_event_loop/ios`)
@ -383,6 +389,8 @@ EXTERNAL SOURCES:
    :path: ".symlinks/plugins/firebase_performance/ios"
  Flutter:
    :path: Flutter
+  flutter_app_update:
+    :path: ".symlinks/plugins/flutter_app_update/ios"
  flutter_background_service_ios:
    :path: ".symlinks/plugins/flutter_background_service_ios/ios"
  flutter_keyboard_visibility:
@ -401,6 +409,8 @@ EXTERNAL SOURCES:
    :path: ".symlinks/plugins/image_cropper/ios"
  image_picker_ios:
    :path: ".symlinks/plugins/image_picker_ios/ios"
+  in_app_review:
+    :path: ".symlinks/plugins/in_app_review/ios"
  livekit_client:
    :path: ".symlinks/plugins/livekit_client/ios"
  media_kit_libs_ios_video:
@ -445,25 +455,26 @@ SPEC CHECKSUMS:
  DKPhotoGallery: b3834fecb755ee09a593d7c9e389d8b5d6deed60
  file_picker: 09aa5ec1ab24135ccd7a1621c46c84134bfd6655
  Firebase: 9f574c08c2396885b5e7e100ed4293d956218af9
-  firebase_analytics: b8ce6c2c4b245d3c3bb3a147965d09da0f455959
-  firebase_core: ba84e940cf5cbbc601095f86556560937419195c
-  firebase_crashlytics: 4111f8198b78c99471c955af488cecd8224967e6
-  firebase_messaging: c40f84e7a98da956d5262fada373b5c458edcf13
-  firebase_performance: 8b7b9ca5adf3a9b3afa12b4eb96b9cabefc2c248
-  FirebaseABTesting: c2e22c3aab99afa81d0561708b2c1c356c556976
+  firebase_analytics: 4fd10182fd08bb8358f26ac8aca8dad7b6d0f592
+  firebase_core: 2ec6b789859c7c24766344ec71fdf78639402d56
+  firebase_crashlytics: 60630a0f91ee432275fa1660fd8593079761448a
+  firebase_messaging: a18e1e02b2e8e69097c8173e0c851be223b21c50
+  firebase_performance: 12d45fdf120992fa879d990929bf73d4a5ced053
+  FirebaseABTesting: 2104d957ce33888a3d6f3bde298cdee376dde8f1
  FirebaseAnalytics: 27eb78b97880ea4a004839b9bac0b58880f5a92a
  FirebaseCore: 3cf438f431f18c12cdf2aaf64434648b63f7e383
-  FirebaseCoreExtension: aa5c9779c2d0d39d83f1ceb3fdbafe80c4feecfa
-  FirebaseCoreInternal: adefedc9a88dbe393c4884640a73ec9e8e790f8c
+  FirebaseCoreExtension: cda74ddfb001224bd8fd1d6e74698b4ed07803de
+  FirebaseCoreInternal: 0c569513412da9f3b31bd0b340013bbee8f295c5
  FirebaseCrashlytics: 745d8f0221fe49c62865391d1bf56f5a12eeec0b
-  FirebaseInstallations: d0a8fea5a6fa91abc661591cf57c0f0d70863e57
+  FirebaseInstallations: 771177d89d6c451dc6e50085ec82e2fc77ed0a4a
  FirebaseMessaging: d2d1d9c62c46dd2db49a952f7deb5b16ad2c9742
  FirebasePerformance: efdc02bacb1b4710588c9f867011605c081cdf79
-  FirebaseRemoteConfig: 05521e937b72e01847a7128da5a492327364c705
-  FirebaseRemoteConfigInterop: abf8b1bbc0bf1b84abd22b66746926410bf91a87
-  FirebaseSessions: 78f137e68dc01ca71606169ba4ac73b98c13752a
-  FirebaseSharedSwift: 260a35e08943ec810d820a70bc0359136351d0c5
+  FirebaseRemoteConfig: fca0b2d017fc1de52b28a4e5bcf2007c1a840457
+  FirebaseRemoteConfigInterop: 477b26fdeb8fb5fbaf22fa9db5343b42289dc7db
+  FirebaseSessions: adcec8b72d0066a385e3affcd1bcb1ebb3908ce6
+  FirebaseSharedSwift: 7a0d78d155ede78407f0fdc89fbc914014c7c540
  Flutter: e0871f40cf51350855a761d2e70bf5af5b9b5de7
+  flutter_app_update: 65f61da626cb111d1b24674abc4b01728d7723bc
  flutter_background_service_ios: e30e0d3ee69e4cee66272d0c78eacd48c2e94aac
  flutter_keyboard_visibility: 0339d06371254c3eb25eeb90ba8d17dca8f9c069
  flutter_local_notifications: 4cde75091f6327eb8517fa068a0a5950212d2086
@ -476,7 +487,8 @@ SPEC CHECKSUMS:
  GoogleUtilities: 26a3abef001b6533cf678d3eb38fd3f614b7872d
  image_cropper: 37d40f62177c101ff4c164906d259ea2c3aa70cf
  image_picker_ios: c560581cceedb403a6ff17f2f816d7fea1421fc1
-  livekit_client: 9c8080879256a0fb16da13c9be4845248209d896
+  in_app_review: 318597b3a06c22bb46dc454d56828c85f444f99d
+  livekit_client: 20e01637431bc108dad451c8a11c1d206e1dd2cd
  media_kit_libs_ios_video: a5fe24bc7875ccd6378a0978c13185e1344651c1
  media_kit_native_event_loop: e6b2ab20cf0746eb1c33be961fcf79667304fa2a
  media_kit_video: 5da63f157170e5bf303bf85453b7ef6971218a2e
--- a/ios/Runner.xcodeproj/project.pbxproj
+++ b/ios/Runner.xcodeproj/project.pbxproj
@ -616,6 +616,7 @@
 			buildSettings = {
 				ALWAYS_EMBED_SWIFT_STANDARD_LIBRARIES = YES;
 				ASSETCATALOG_COMPILER_APPICON_NAME = AppIcon;
+				CLANG_ALLOW_NON_MODULAR_INCLUDES_IN_FRAMEWORK_MODULES = YES;
 				CLANG_ENABLE_MODULES = YES;
 				CODE_SIGN_ENTITLEMENTS = Runner/Runner.entitlements;
 				CURRENT_PROJECT_VERSION = "$(FLUTTER_BUILD_NUMBER)";
@ -920,6 +921,7 @@
 			buildSettings = {
 				ALWAYS_EMBED_SWIFT_STANDARD_LIBRARIES = YES;
 				ASSETCATALOG_COMPILER_APPICON_NAME = AppIcon;
+				CLANG_ALLOW_NON_MODULAR_INCLUDES_IN_FRAMEWORK_MODULES = YES;
 				CLANG_ENABLE_MODULES = YES;
 				CODE_SIGN_ENTITLEMENTS = Runner/Runner.entitlements;
 				CURRENT_PROJECT_VERSION = "$(FLUTTER_BUILD_NUMBER)";
@ -947,6 +949,7 @@
 			buildSettings = {
 				ALWAYS_EMBED_SWIFT_STANDARD_LIBRARIES = YES;
 				ASSETCATALOG_COMPILER_APPICON_NAME = AppIcon;
+				CLANG_ALLOW_NON_MODULAR_INCLUDES_IN_FRAMEWORK_MODULES = YES;
 				CLANG_ENABLE_MODULES = YES;
 				CODE_SIGN_ENTITLEMENTS = Runner/Runner.entitlements;
 				CURRENT_PROJECT_VERSION = "$(FLUTTER_BUILD_NUMBER)";
--- a/ios/Runner/Info.plist
+++ b/ios/Runner/Info.plist
@ -1,87 +1,92 @@
 <?xml version="1.0" encoding="UTF-8"?>
 <!DOCTYPE plist PUBLIC "-//Apple//DTD PLIST 1.0//EN" "http://www.apple.com/DTDs/PropertyList-1.0.dtd">
 <plist version="1.0">
-	<dict>
-		<key>CFBundleURLTypes</key>
-		<array>
-			<dict>
-				<key>CFBundleURLName</key>
-				<string></string>
-				<key>CFBundleTypeRole</key>
-				<string>Editor</string>
-				<key>CFBundleURLSchemes</key>
-				<array>
-					<string>solink</string>
-				</array>
-			</dict>
-		</array>
-		<key>FirebaseMessagingAutoInitEnabled</key>
-		<false/>
-		<key>CADisableMinimumFrameDurationOnPhone</key>
-		<true/>
-		<key>CFBundleDevelopmentRegion</key>
-		<string>$(DEVELOPMENT_LANGUAGE)</string>
-		<key>CFBundleDisplayName</key>
-		<string>Solian</string>
-		<key>CFBundleExecutable</key>
-		<string>$(EXECUTABLE_NAME)</string>
-		<key>CFBundleIdentifier</key>
-		<string>$(PRODUCT_BUNDLE_IDENTIFIER)</string>
-		<key>CFBundleInfoDictionaryVersion</key>
-		<string>6.0</string>
-		<key>CFBundleName</key>
-		<string>solian</string>
-		<key>CFBundlePackageType</key>
-		<string>APPL</string>
-		<key>CFBundleShortVersionString</key>
-		<string>$(FLUTTER_BUILD_NAME)</string>
-		<key>CFBundleSignature</key>
-		<string>????</string>
-		<key>CFBundleVersion</key>
-		<string>$(FLUTTER_BUILD_NUMBER)</string>
-		<key>ITSAppUsesNonExemptEncryption</key>
-		<false/>
-		<key>LSRequiresIPhoneOS</key>
-		<true/>
-		<key>NSCameraUsageDescription</key>
-		<string>Allow you take photo/video for your message or post</string>
-		<key>NSMicrophoneUsageDescription</key>
-		<string>Allow you record audio for your message or post</string>
-		<key>NSPhotoLibraryUsageDescription</key>
-		<string>Allow you add photo to your message or post</string>
-		<key>UIApplicationSupportsIndirectInputEvents</key>
-		<true/>
-		<key>UIBackgroundModes</key>
-		<array>
-			<string>audio</string>
-			<string>fetch</string>
-			<string>remote-notification</string>
-			<string>voip</string>
-		</array>
-		<key>UILaunchStoryboardName</key>
-		<string>LaunchScreen</string>
-		<key>UIMainStoryboardFile</key>
-		<string>Main</string>
-		<key>UISupportedInterfaceOrientations</key>
-		<array>
-			<string>UIInterfaceOrientationPortrait</string>
-			<string>UIInterfaceOrientationLandscapeLeft</string>
-			<string>UIInterfaceOrientationLandscapeRight</string>
-		</array>
-		<key>FlutterDeepLinkingEnabled</key>
-		<true/>
-		<key>NSUserActivityTypes</key>
-		<array>
-			<string>INSendMessageIntent</string>
-		</array>
-		<key>UISupportedInterfaceOrientations~ipad</key>
-		<array>
-			<string>UIInterfaceOrientationPortrait</string>
-			<string>UIInterfaceOrientationPortraitUpsideDown</string>
-			<string>UIInterfaceOrientationLandscapeLeft</string>
-			<string>UIInterfaceOrientationLandscapeRight</string>
-		</array>
-		<key>UIStatusBarHidden</key>
-		<false/>
-	</dict>
+<dict>
+	<key>CFBundleURLTypes</key>
+	<array>
+		<dict>
+			<key>CFBundleURLName</key>
+			<string></string>
+			<key>CFBundleTypeRole</key>
+			<string>Editor</string>
+			<key>CFBundleURLSchemes</key>
+			<array>
+				<string>solink</string>
+			</array>
+		</dict>
+	</array>
+	<key>FirebaseMessagingAutoInitEnabled</key>
+	<false/>
+	<key>CADisableMinimumFrameDurationOnPhone</key>
+	<true/>
+	<key>CFBundleDevelopmentRegion</key>
+	<string>$(DEVELOPMENT_LANGUAGE)</string>
+	<key>CFBundleDisplayName</key>
+	<string>Solian</string>
+	<key>CFBundleExecutable</key>
+	<string>$(EXECUTABLE_NAME)</string>
+	<key>CFBundleIdentifier</key>
+	<string>$(PRODUCT_BUNDLE_IDENTIFIER)</string>
+	<key>CFBundleInfoDictionaryVersion</key>
+	<string>6.0</string>
+	<key>CFBundleName</key>
+	<string>solian</string>
+	<key>CFBundlePackageType</key>
+	<string>APPL</string>
+	<key>CFBundleShortVersionString</key>
+	<string>$(FLUTTER_BUILD_NAME)</string>
+	<key>CFBundleSignature</key>
+	<string>????</string>
+	<key>CFBundleVersion</key>
+	<string>$(FLUTTER_BUILD_NUMBER)</string>
+	<key>ITSAppUsesNonExemptEncryption</key>
+	<false/>
+	<key>LSRequiresIPhoneOS</key>
+	<true/>
+	<key>NSCameraUsageDescription</key>
+	<string>Allow you take photo/video for your message or post</string>
+	<key>NSMicrophoneUsageDescription</key>
+	<string>Allow you record audio for your message or post</string>
+	<key>NSPhotoLibraryUsageDescription</key>
+	<string>Allow you add photo to your message or post</string>
+	<key>UIApplicationSupportsIndirectInputEvents</key>
+	<true/>
+	<key>UIBackgroundModes</key>
+	<array>
+		<string>audio</string>
+		<string>fetch</string>
+		<string>remote-notification</string>
+		<string>voip</string>
+	</array>
+	<key>UILaunchStoryboardName</key>
+	<string>LaunchScreen</string>
+	<key>UIMainStoryboardFile</key>
+	<string>Main</string>
+	<key>UISupportedInterfaceOrientations</key>
+	<array>
+		<string>UIInterfaceOrientationPortrait</string>
+		<string>UIInterfaceOrientationLandscapeLeft</string>
+		<string>UIInterfaceOrientationLandscapeRight</string>
+	</array>
+	<key>FlutterDeepLinkingEnabled</key>
+	<true/>
+	<key>NSUserActivityTypes</key>
+	<array>
+		<string>INSendMessageIntent</string>
+	</array>
+	<key>UISupportedInterfaceOrientations~ipad</key>
+	<array>
+		<string>UIInterfaceOrientationPortrait</string>
+		<string>UIInterfaceOrientationPortraitUpsideDown</string>
+		<string>UIInterfaceOrientationLandscapeLeft</string>
+		<string>UIInterfaceOrientationLandscapeRight</string>
+	</array>
+	<key>CFBundleLocalizations</key>
+	<array>
+		<string>zh_CN</string>
+		<string>en</string>
+	</array>
+	<key>UIStatusBarHidden</key>
+	<false/>
+</dict>
 </plist>
--- a/lib/bootstrapper.dart
+++ b/lib/bootstrapper.dart
@ -1,19 +1,26 @@
+import 'dart:async';
+import 'dart:developer';
+
 import 'package:flutter/material.dart';
 import 'package:gap/gap.dart';
 import 'package:get/get.dart';
+import 'package:in_app_review/in_app_review.dart';
 import 'package:package_info_plus/package_info_plus.dart';
 import 'package:provider/provider.dart';
+import 'package:shared_preferences/shared_preferences.dart';
+import 'package:solian/exceptions/request.dart';
 import 'package:solian/exts.dart';
 import 'package:solian/platform.dart';
 import 'package:solian/providers/auth.dart';
-import 'package:solian/providers/content/channel.dart';
 import 'package:solian/providers/content/realm.dart';
 import 'package:solian/providers/relation.dart';
-import 'package:solian/providers/stickers.dart';
 import 'package:solian/providers/theme_switcher.dart';
 import 'package:solian/providers/websocket.dart';
 import 'package:solian/services.dart';
+import 'package:solian/widgets/root_container.dart';
 import 'package:solian/widgets/sized_container.dart';
+import 'package:flutter_app_update/flutter_app_update.dart';
+import 'package:version/version.dart';

 class BootstrapperShell extends StatefulWidget {
  final Widget child;
@ -35,6 +42,108 @@ class _BootstrapperShellState extends State<BootstrapperShell> {

  int _periodCursor = 0;

+  final Completer _bootCompleter = Completer();
+
+  void _requestRating() async {
+    final prefs = await SharedPreferences.getInstance();
+    if (prefs.containsKey('first_boot_time')) {
+      final rawTime = prefs.getString('first_boot_time');
+      final time = DateTime.tryParse(rawTime ?? '');
+      if (time != null &&
+          time.isBefore(DateTime.now().subtract(const Duration(days: 3)))) {
+        final inAppReview = InAppReview.instance;
+        if (prefs.getBool('rating_requested') == true) return;
+        if (await inAppReview.isAvailable()) {
+          await inAppReview.requestReview();
+          prefs.setBool('rating_requested', true);
+        } else {
+          log('Unable request app review, unavailable');
+        }
+      }
+    } else {
+      prefs.setString('first_boot_time', DateTime.now().toIso8601String());
+    }
+  }
+
+  void _updateNow(String localVersionString, String remoteVersionString) {
+    context
+        .showConfirmDialog(
+      'updateAvailable'.tr,
+      'updateAvailableDesc'.trParams({
+        'from': localVersionString,
+        'to': remoteVersionString,
+      }),
+    )
+        .then((result) {
+      if (result) {
+        final model = UpdateModel(
+          'https://files.solsynth.dev/d/production01/solian/app-arm64-v8a-release.apk',
+          'solian-app-arm64-v8a-release.apk',
+          'ic_launcher',
+          'https://testflight.apple.com/join/YJ0lmN6O',
+        );
+        AzhonAppUpdate.update(model);
+      }
+    });
+  }
+
+  Future<void> _checkForUpdate() async {
+    if (PlatformInfo.isWeb) return;
+    try {
+      final prefs = await SharedPreferences.getInstance();
+      final info = await PackageInfo.fromPlatform();
+      final localVersionString = '${info.version}+${info.buildNumber}';
+      final resp = await GetConnect(
+        timeout: const Duration(seconds: 60),
+      ).get(
+        'https://git.solsynth.dev/api/v1/repos/hydrogen/solian/tags?page=1&limit=1',
+      );
+      if (resp.statusCode != 200) {
+        throw RequestException(resp);
+      }
+      final remoteVersionString =
+          (resp.body as List).firstOrNull?['name'] ?? '0.0.0+0';
+      final remoteVersion = Version.parse(remoteVersionString.split('+').first);
+      final localVersion = Version.parse(localVersionString.split('+').first);
+      final remoteBuildNumber =
+          int.tryParse(remoteVersionString.split('+').last) ?? 0;
+      final localBuildNumber =
+          int.tryParse(localVersionString.split('+').last) ?? 0;
+      final strictUpdate = prefs.getBool('check_update_strictly') ?? false;
+      if (remoteVersion > localVersion ||
+          (remoteVersion == localVersion &&
+              remoteBuildNumber > localBuildNumber) ||
+          (remoteVersionString != localVersionString && strictUpdate)) {
+        if (PlatformInfo.isAndroid) {
+          _updateNow(localVersionString, remoteVersionString);
+        } else {
+          context.showInfoDialog(
+            'updateAvailable'.tr,
+            'bsCheckForUpdateDesc'.tr,
+          );
+        }
+      } else if (remoteVersionString != localVersionString) {
+        _bootCompleter.future.then((_) {
+          context.showSnackbar(
+            'updateMayAvailable'.trParams({
+              'version': remoteVersionString,
+            }),
+            action: PlatformInfo.isAndroid
+                ? SnackBarAction(
+                    label: 'updateNow'.tr,
+                    onPressed: () {
+                      _updateNow(localVersionString, remoteVersionString);
+                    },
+                  )
+                : null,
+          );
+        });
+      }
+    } catch (e) {
+      context.showErrorDialog('Unable to check update: $e');
+    }
+  }
+
  late final List<({String label, Future<void> Function() action})> _periods = [
    (
      label: 'bsLoadingTheme',
@ -42,32 +151,6 @@ class _BootstrapperShellState extends State<BootstrapperShell> {
        await context.read<ThemeSwitcher>().restoreTheme();
      },
    ),
-    (
-      label: 'bsCheckForUpdate',
-      action: () async {
-        if (PlatformInfo.isWeb) return;
-        try {
-          final info = await PackageInfo.fromPlatform();
-          final localVersionString = '${info.version}+${info.buildNumber}';
-          final resp = await GetConnect().get(
-            'https://git.solsynth.dev/api/v1/repos/hydrogen/solian/tags?limit=1',
-          );
-          if (resp.body[0]['name'] != localVersionString) {
-            setState(() {
-              _isErrored = true;
-              _subtitle = PlatformInfo.isIOS || PlatformInfo.isMacOS
-                  ? 'bsCheckForUpdateDescApple'.tr
-                  : 'bsCheckForUpdateDescCommon'.tr;
-            });
-          }
-        } catch (e) {
-          setState(() {
-            _isErrored = true;
-            _subtitle = 'bsCheckForUpdateFailed'.tr;
-          });
-        }
-      },
-    ),
    (
      label: 'bsCheckingServer',
      action: () async {
@ -115,9 +198,6 @@ class _BootstrapperShellState extends State<BootstrapperShell> {
        final AuthProvider auth = Get.find();
        try {
          await Future.wait([
-            Get.find<StickerProvider>().refreshAvailableStickers(),
-            if (auth.isAuthorized.isTrue)
-              Get.find<ChannelProvider>().refreshAvailableChannel(),
            if (auth.isAuthorized.isTrue)
              Get.find<RelationshipProvider>().refreshRelativeList(),
            if (auth.isAuthorized.isTrue)
@ -156,6 +236,9 @@ class _BootstrapperShellState extends State<BootstrapperShell> {
      }
    } finally {
      setState(() => _isBusy = false);
+      Future.delayed(const Duration(milliseconds: 100), () {
+        _bootCompleter.complete();
+      });
    }
  }

@ -163,14 +246,17 @@ class _BootstrapperShellState extends State<BootstrapperShell> {
  void initState() {
    super.initState();
    _runPeriods();
+    _checkForUpdate();
+    _bootCompleter.future.then((_) {
+      _requestRating();
+    });
  }

  @override
  Widget build(BuildContext context) {
    if (_isBusy || _isErrored) {
      return GestureDetector(
-        child: Material(
-          color: Theme.of(context).colorScheme.surface,
+        child: RootContainer(
          child: Column(
            mainAxisSize: MainAxisSize.max,
            mainAxisAlignment: MainAxisAlignment.spaceAround,
@ -253,6 +339,9 @@ class _BootstrapperShellState extends State<BootstrapperShell> {
              _isBusy = false;
              _isErrored = false;
            });
+            Future.delayed(const Duration(milliseconds: 100), () {
+              _bootCompleter.complete();
+            });
          } else {
            setState(() {
              _isBusy = true;
--- a/lib/controllers/chat_events_controller.dart
+++ b/lib/controllers/chat_events_controller.dart
@ -1,3 +1,5 @@
+import 'dart:math' as math;
+
 import 'package:get/get.dart';
 import 'package:solian/models/channel.dart';
 import 'package:solian/models/event.dart';
@ -30,14 +32,31 @@ class ChatEventController {
    this.channel = channel;
    this.scope = scope;

-    isLoading.value = true;
-    await syncLocal(channel, take: 10);
+    const firstTake = 20;
+    const furtherTake = 100;

-    src.pullRemoteEvents(channel, scope: scope, take: 10).then((result) {
-      totalEvents.value = result?.$2 ?? 0;
-      syncLocal(channel, take: 10);
-    });
+    isLoading.value = true;
+    await syncLocal(channel, take: firstTake);
    isLoading.value = false;
+
+    // Take a small range of messages to check is local database up to date
+    var isUpToDate = true;
+    final result =
+        await src.pullRemoteEvents(channel, scope: scope, take: firstTake);
+    totalEvents.value = result?.$2 ?? 0;
+    if ((result?.$1.length ?? 0) > 0) {
+      final minId = result!.$1.map((x) => x.id).reduce(math.min);
+      isUpToDate = await src.getEventFromLocal(minId) != null;
+    }
+    syncLocal(channel, take: firstTake);
+
+    if (!isUpToDate) {
+      // Loading more content due to isn't up to date
+      final result =
+          await src.pullRemoteEvents(channel, scope: scope, take: furtherTake);
+      totalEvents.value = result?.$2 ?? 0;
+      syncLocal(channel, take: furtherTake);
+    }
  }

  Future<void> loadEvents(Channel channel, String scope) async {
@ -46,7 +65,9 @@ class ChatEventController {

    isLoading.value = true;
    await syncLocal(channel, take: take, offset: offset);
-    src.pullRemoteEvents(channel, scope: scope, offset: offset).then((result) {
+    src
+        .pullRemoteEvents(channel, scope: scope, take: take, offset: offset)
+        .then((result) {
      totalEvents.value = result?.$2 ?? 0;
      syncLocal(channel, take: take, offset: offset);
    });
@ -56,7 +77,11 @@ class ChatEventController {
  Future<bool> syncLocal(Channel channel,
      {required int take, int offset = 0}) async {
    final data = await src.listEvents(channel, take: take, offset: offset);
-    currentEvents.replaceRange(0, currentEvents.length, data);
+    if (currentEvents.length >= offset + take) {
+      currentEvents.replaceRange(offset, offset + take, data);
+    } else {
+      currentEvents.insertAll(currentEvents.length, data);
+    }
    for (final x in data.reversed) {
      applyEvent(x);
    }
--- a/lib/exts.dart
+++ b/lib/exts.dart
@ -1,6 +1,8 @@
 import 'dart:math' as math;

+import 'package:action_slider/action_slider.dart';
 import 'package:flutter/material.dart';
+import 'package:gap/gap.dart';
 import 'package:get/get.dart';
 import 'package:solian/exceptions/request.dart';
 import 'package:solian/exceptions/unauthorized.dart';
@ -51,6 +53,69 @@ extension AppExtensions on BuildContext {
    );
  }

+  Future<bool> showConfirmDialog(String title, body) async {
+    return await showDialog<bool>(
+          useRootNavigator: true,
+          context: this,
+          builder: (ctx) => AlertDialog(
+            title: Text(title),
+            content: Text(body),
+            actions: [
+              TextButton(
+                onPressed: () => Navigator.pop(ctx, false),
+                child: Text('cancel'.tr),
+              ),
+              TextButton(
+                onPressed: () => Navigator.pop(ctx, true),
+                child: Text('okay'.tr),
+              )
+            ],
+          ),
+        ) ??
+        false;
+  }
+
+  Future<bool> showSlideToConfirmDialog(String title, body) async {
+    return await showDialog<bool>(
+          useRootNavigator: true,
+          context: this,
+          builder: (ctx) => AlertDialog(
+            title: Text(title, textAlign: TextAlign.center),
+            content: SizedBox(
+              width: double.maxFinite,
+              child: ListView(
+                shrinkWrap: true,
+                children: [
+                  Text(body, textAlign: TextAlign.center),
+                  const Gap(28),
+                  ActionSlider.standard(
+                    icon: const Icon(Icons.send),
+                    iconAlignment: Alignment.center,
+                    sliderBehavior: SliderBehavior.move,
+                    actionThresholdType: ThresholdType.release,
+                    toggleColor: Colors.red,
+                    action: (controller) async {
+                      controller.success();
+                      await Future.delayed(const Duration(milliseconds: 500));
+                      Navigator.pop(ctx, true);
+                    },
+                    child: Text('slideToConfirm'.tr),
+                  ),
+                ],
+              ),
+            ),
+            actionsAlignment: MainAxisAlignment.center,
+            actions: [
+              TextButton(
+                onPressed: () => Navigator.pop(ctx, false),
+                child: Text('cancel'.tr),
+              )
+            ],
+          ),
+        ) ??
+        false;
+  }
+
  Future<void> showErrorDialog(dynamic exception) {
    Widget content = Text(exception.toString().capitalize!);
    if (exception is UnauthorizedException) {
--- a/lib/main.dart
+++ b/lib/main.dart
@ -9,7 +9,6 @@ import 'package:go_router/go_router.dart';
 import 'package:protocol_handler/protocol_handler.dart';
 import 'package:provider/provider.dart';
 import 'package:solian/background.dart';
-import 'package:solian/bootstrapper.dart';
 import 'package:solian/firebase_options.dart';
 import 'package:solian/platform.dart';
 import 'package:solian/providers/attachment_uploader.dart';
@ -20,6 +19,7 @@ import 'package:solian/providers/last_read.dart';
 import 'package:solian/providers/link_expander.dart';
 import 'package:solian/providers/navigation.dart';
 import 'package:solian/providers/stickers.dart';
+import 'package:solian/providers/subscription.dart';
 import 'package:solian/providers/theme_switcher.dart';
 import 'package:solian/providers/websocket.dart';
 import 'package:solian/providers/auth.dart';
@ -57,13 +57,16 @@ void main() async {

 Future<void> _initializeFirebase() async {
  await Firebase.initializeApp(options: DefaultFirebaseOptions.currentPlatform);
-  FlutterError.onError = (errorDetails) {
-    FirebaseCrashlytics.instance.recordFlutterFatalError(errorDetails);
-  };
-  PlatformDispatcher.instance.onError = (error, stack) {
-    FirebaseCrashlytics.instance.recordError(error, stack, fatal: true);
-    return true;
-  };
+  if (PlatformInfo.isIOS || PlatformInfo.isAndroid || PlatformInfo.isMacOS) {
+    // Initialize firebase crashlytics for the platform that supported
+    FlutterError.onError = (errorDetails) {
+      FirebaseCrashlytics.instance.recordFlutterFatalError(errorDetails);
+    };
+    PlatformDispatcher.instance.onError = (error, stack) {
+      FirebaseCrashlytics.instance.recordError(error, stack, fatal: true);
+      return true;
+    };
+  }
 }

 Future<void> _initializeBackgroundNotificationService() async {
@ -122,9 +125,7 @@ class SolianApp extends StatelessWidget {
          builder: (context, child) {
            return SystemShell(
              child: ScaffoldMessenger(
-                child: BootstrapperShell(
-                  child: child ?? const SizedBox.shrink(),
-                ),
+                child: child ?? const SizedBox.shrink(),
              ),
            );
          },
@ -151,6 +152,7 @@ class SolianApp extends StatelessWidget {
    Get.lazyPut(() => LinkExpandProvider());
    Get.lazyPut(() => DailySignProvider());
    Get.lazyPut(() => LastReadProvider());
+    Get.lazyPut(() => SubscriptionProvider());

    Get.find<WebSocketProvider>().requestPermissions();
  }
--- a/lib/models/account.dart
+++ b/lib/models/account.dart
@ -1,4 +1,4 @@
-import 'package:freezed_annotation/freezed_annotation.dart';
+import 'package:json_annotation/json_annotation.dart';

 part 'account.g.dart';

--- a/lib/models/account_status.dart
+++ b/lib/models/account_status.dart
@ -1,4 +1,4 @@
-import 'package:freezed_annotation/freezed_annotation.dart';
+import 'package:json_annotation/json_annotation.dart';

 part 'account_status.g.dart';

--- a/lib/models/attachment.dart
+++ b/lib/models/attachment.dart
@ -1,4 +1,4 @@
-import 'package:freezed_annotation/freezed_annotation.dart';
+import 'package:json_annotation/json_annotation.dart';
 import 'package:solian/models/account.dart';

 part 'attachment.g.dart';
--- a/lib/models/auth.dart
+++ b/lib/models/auth.dart
@ -1,4 +1,4 @@
-import 'package:freezed_annotation/freezed_annotation.dart';
+import 'package:json_annotation/json_annotation.dart';
 import 'package:solian/models/account.dart';

 part 'auth.g.dart';
--- a/lib/models/call.dart
+++ b/lib/models/call.dart
@ -1,4 +1,4 @@
-import 'package:freezed_annotation/freezed_annotation.dart';
+import 'package:json_annotation/json_annotation.dart';
 import 'package:livekit_client/livekit_client.dart';
 import 'package:solian/models/channel.dart';

--- a/lib/models/channel.dart
+++ b/lib/models/channel.dart
@ -1,4 +1,4 @@
-import 'package:freezed_annotation/freezed_annotation.dart';
+import 'package:json_annotation/json_annotation.dart';
 import 'package:solian/models/account.dart';
 import 'package:solian/models/realm.dart';

@ -19,7 +19,8 @@ class Channel {
  int accountId;
  Realm? realm;
  int? realmId;
-  bool isEncrypted;
+  bool isPublic;
+  bool isCommunity;

  @JsonKey(includeFromJson: false, includeToJson: true)
  bool isAvailable = false;
@ -36,7 +37,8 @@ class Channel {
    required this.members,
    required this.account,
    required this.accountId,
-    required this.isEncrypted,
+    required this.isPublic,
+    required this.isCommunity,
    required this.realm,
    required this.realmId,
  });
--- a/lib/models/channel.g.dart
+++ b/lib/models/channel.g.dart
@ -22,7 +22,8 @@ Channel _$ChannelFromJson(Map<String, dynamic> json) => Channel(
          .toList(),
      account: Account.fromJson(json['account'] as Map<String, dynamic>),
      accountId: (json['account_id'] as num).toInt(),
-      isEncrypted: json['is_encrypted'] as bool,
+      isPublic: json['is_public'] as bool,
+      isCommunity: json['is_community'] as bool,
      realm: json['realm'] == null
          ? null
          : Realm.fromJson(json['realm'] as Map<String, dynamic>),
@ -43,7 +44,8 @@ Map<String, dynamic> _$ChannelToJson(Channel instance) => <String, dynamic>{
      'account_id': instance.accountId,
      'realm': instance.realm?.toJson(),
      'realm_id': instance.realmId,
-      'is_encrypted': instance.isEncrypted,
+      'is_public': instance.isPublic,
+      'is_community': instance.isCommunity,
      'is_available': instance.isAvailable,
    };

--- a/lib/models/daily_sign.dart
+++ b/lib/models/daily_sign.dart
@ -1,4 +1,4 @@
-import 'package:freezed_annotation/freezed_annotation.dart';
+import 'package:json_annotation/json_annotation.dart';
 import 'package:get/get.dart';
 import 'package:solian/models/account.dart';

--- a/lib/models/event.dart
+++ b/lib/models/event.dart
@ -1,4 +1,4 @@
-import 'package:freezed_annotation/freezed_annotation.dart';
+import 'package:json_annotation/json_annotation.dart';
 import 'package:solian/models/channel.dart';

 part 'event.g.dart';
--- a/lib/models/link.dart
+++ b/lib/models/link.dart
@ -1,4 +1,4 @@
-import 'package:freezed_annotation/freezed_annotation.dart';
+import 'package:json_annotation/json_annotation.dart';

 part 'link.g.dart';

--- a/lib/models/notification.dart
+++ b/lib/models/notification.dart
@ -1,4 +1,4 @@
-import 'package:freezed_annotation/freezed_annotation.dart';
+import 'package:json_annotation/json_annotation.dart';

 part 'notification.g.dart';

--- a/lib/models/packet.dart
+++ b/lib/models/packet.dart
@ -1,10 +1,10 @@
-import 'package:freezed_annotation/freezed_annotation.dart';
+import 'package:json_annotation/json_annotation.dart';

 part 'packet.g.dart';

@JsonSerializable()
 class NetworkPackage {
-  @JsonKey(name: 'w')
+  @JsonKey(name: 'w', defaultValue: 'unknown')
  String method;
  @JsonKey(name: 'e')
  String? endpoint;
--- a/lib/models/packet.g.dart
+++ b/lib/models/packet.g.dart
@ -8,7 +8,7 @@ part of 'packet.dart';

 NetworkPackage _$NetworkPackageFromJson(Map<String, dynamic> json) =>
    NetworkPackage(
-      method: json['w'] as String,
+      method: json['w'] as String? ?? 'unknown',
      endpoint: json['e'] as String?,
      message: json['m'] as String?,
      payload: json['p'] as Map<String, dynamic>?,
--- a/lib/models/pagination.dart
+++ b/lib/models/pagination.dart
@ -1,4 +1,4 @@
-import 'package:freezed_annotation/freezed_annotation.dart';
+import 'package:json_annotation/json_annotation.dart';

 part 'pagination.g.dart';

--- a/lib/models/post.dart
+++ b/lib/models/post.dart
@ -1,4 +1,4 @@
-import 'package:freezed_annotation/freezed_annotation.dart';
+import 'package:json_annotation/json_annotation.dart';
 import 'package:solian/models/account.dart';
 import 'package:solian/models/post_categories.dart';
 import 'package:solian/models/realm.dart';
--- a/lib/models/post_categories.dart
+++ b/lib/models/post_categories.dart
@ -1,4 +1,4 @@
-import 'package:freezed_annotation/freezed_annotation.dart';
+import 'package:json_annotation/json_annotation.dart';

 part 'post_categories.g.dart';

--- a/lib/models/realm.dart
+++ b/lib/models/realm.dart
@ -1,4 +1,4 @@
-import 'package:freezed_annotation/freezed_annotation.dart';
+import 'package:json_annotation/json_annotation.dart';
 import 'package:solian/models/account.dart';

 part 'realm.g.dart';
--- a/lib/models/relations.dart
+++ b/lib/models/relations.dart
@ -1,4 +1,4 @@
-import 'package:freezed_annotation/freezed_annotation.dart';
+import 'package:json_annotation/json_annotation.dart';
 import 'package:solian/models/account.dart';

 part 'relations.g.dart';
--- a/lib/models/stickers.dart
+++ b/lib/models/stickers.dart
@ -1,4 +1,4 @@
-import 'package:freezed_annotation/freezed_annotation.dart';
+import 'package:json_annotation/json_annotation.dart';
 import 'package:solian/models/account.dart';
 import 'package:solian/models/attachment.dart';
 import 'package:solian/services.dart';
--- a/lib/models/subscription.dart
+++ b/lib/models/subscription.dart
@ -0,0 +1,41 @@
+import 'package:json_annotation/json_annotation.dart';
+import 'package:solian/models/account.dart';
+import 'package:solian/models/post_categories.dart';
+
+part 'subscription.g.dart';
+
+@JsonSerializable()
+class Subscription {
+  int id;
+  DateTime createdAt;
+  DateTime updatedAt;
+  DateTime? deletedAt;
+  int followerId;
+  Account follower;
+  int? accountId;
+  Account? account;
+  int? tagId;
+  Tag? tag;
+  int? categoryId;
+  Category? category;
+
+  Subscription({
+    required this.id,
+    required this.createdAt,
+    required this.updatedAt,
+    required this.deletedAt,
+    required this.followerId,
+    required this.follower,
+    required this.accountId,
+    required this.account,
+    required this.tagId,
+    required this.tag,
+    required this.categoryId,
+    required this.category,
+  });
+
+  factory Subscription.fromJson(Map<String, dynamic> json) =>
+      _$SubscriptionFromJson(json);
+
+  Map<String, dynamic> toJson() => _$SubscriptionToJson(this);
+}
--- a/lib/models/subscription.g.dart
+++ b/lib/models/subscription.g.dart
@ -0,0 +1,46 @@
+// GENERATED CODE - DO NOT MODIFY BY HAND
+
+part of 'subscription.dart';
+
+// **************************************************************************
+// JsonSerializableGenerator
+// **************************************************************************
+
+Subscription _$SubscriptionFromJson(Map<String, dynamic> json) => Subscription(
+      id: (json['id'] as num).toInt(),
+      createdAt: DateTime.parse(json['created_at'] as String),
+      updatedAt: DateTime.parse(json['updated_at'] as String),
+      deletedAt: json['deleted_at'] == null
+          ? null
+          : DateTime.parse(json['deleted_at'] as String),
+      followerId: (json['follower_id'] as num).toInt(),
+      follower: Account.fromJson(json['follower'] as Map<String, dynamic>),
+      accountId: (json['account_id'] as num?)?.toInt(),
+      account: json['account'] == null
+          ? null
+          : Account.fromJson(json['account'] as Map<String, dynamic>),
+      tagId: (json['tag_id'] as num?)?.toInt(),
+      tag: json['tag'] == null
+          ? null
+          : Tag.fromJson(json['tag'] as Map<String, dynamic>),
+      categoryId: (json['category_id'] as num?)?.toInt(),
+      category: json['category'] == null
+          ? null
+          : Category.fromJson(json['category'] as Map<String, dynamic>),
+    );
+
+Map<String, dynamic> _$SubscriptionToJson(Subscription instance) =>
+    <String, dynamic>{
+      'id': instance.id,
+      'created_at': instance.createdAt.toIso8601String(),
+      'updated_at': instance.updatedAt.toIso8601String(),
+      'deleted_at': instance.deletedAt?.toIso8601String(),
+      'follower_id': instance.followerId,
+      'follower': instance.follower.toJson(),
+      'account_id': instance.accountId,
+      'account': instance.account?.toJson(),
+      'tag_id': instance.tagId,
+      'tag': instance.tag?.toJson(),
+      'category_id': instance.categoryId,
+      'category': instance.category?.toJson(),
+    };
--- a/lib/models/theme.dart
+++ b/lib/models/theme.dart
@ -0,0 +1,50 @@
+import 'dart:ui';
+
+import 'package:json_annotation/json_annotation.dart';
+
+part 'theme.g.dart';
+
+@JsonSerializable(converters: [ColorConverter()])
+class SolianThemeData {
+  String id;
+  Color seedColor;
+  String? fontFamily;
+  List<String>? fontFamilyFallback;
+
+  SolianThemeData({
+    required this.id,
+    required this.seedColor,
+    this.fontFamily,
+    this.fontFamilyFallback,
+  });
+
+  factory SolianThemeData.fromJson(Map<String, dynamic> json) =>
+      _$SolianThemeDataFromJson(json);
+
+  Map<String, dynamic> toJson() => _$SolianThemeDataToJson(this);
+
+  @override
+  int get hashCode => id.hashCode;
+
+  @override
+  bool operator ==(Object other) {
+    if (other is SolianThemeData) {
+      return id == other.id;
+    }
+    return false;
+  }
+}
+
+class ColorConverter extends JsonConverter<Color, int> {
+  const ColorConverter();
+
+  @override
+  Color fromJson(int json) {
+    return Color(json);
+  }
+
+  @override
+  int toJson(Color object) {
+    return object.value;
+  }
+}
--- a/lib/models/theme.g.dart
+++ b/lib/models/theme.g.dart
@ -0,0 +1,26 @@
+// GENERATED CODE - DO NOT MODIFY BY HAND
+
+part of 'theme.dart';
+
+// **************************************************************************
+// JsonSerializableGenerator
+// **************************************************************************
+
+SolianThemeData _$SolianThemeDataFromJson(Map<String, dynamic> json) =>
+    SolianThemeData(
+      id: json['id'] as String,
+      seedColor:
+          const ColorConverter().fromJson((json['seed_color'] as num).toInt()),
+      fontFamily: json['font_family'] as String?,
+      fontFamilyFallback: (json['font_family_fallback'] as List<dynamic>?)
+          ?.map((e) => e as String)
+          .toList(),
+    );
+
+Map<String, dynamic> _$SolianThemeDataToJson(SolianThemeData instance) =>
+    <String, dynamic>{
+      'id': instance.id,
+      'seed_color': const ColorConverter().toJson(instance.seedColor),
+      'font_family': instance.fontFamily,
+      'font_family_fallback': instance.fontFamilyFallback,
+    };
--- a/lib/platform.dart
+++ b/lib/platform.dart
@ -27,6 +27,10 @@ abstract class PlatformInfo {

  static bool get canCacheImage => isAndroid || isIOS || isMacOS;

+  static bool get canRateTheApp => isIOS || isMacOS;
+
+  static bool get canCropImage => isIOS || isAndroid || isWeb;
+
  static bool get canRecord => (isMobile || isMacOS);

  static bool get canPushNotification => isAndroid || isIOS || isMacOS;
@ -38,4 +42,4 @@ abstract class PlatformInfo {
    } catch (_) {}
    return version;
  }
-}
+}
--- a/lib/providers/call.dart
+++ b/lib/providers/call.dart
@ -392,7 +392,7 @@ class ChatCallProvider extends GetxController {
  }

  Future gotoScreen(BuildContext context) {
-    return Navigator.of(context, rootNavigator: true).push(
+    return Navigator.of(context).push(
      MaterialPageRoute(builder: (context) => const CallScreen()),
    );
  }
--- a/lib/providers/content/channel.dart
+++ b/lib/providers/content/channel.dart
@ -9,25 +9,6 @@ import 'package:uuid/uuid.dart';

 class ChannelProvider extends GetxController {
  RxBool isLoading = false.obs;
-  RxList<Channel> availableChannels = RxList.empty(growable: true);
-
-  List<Channel> get groupChannels =>
-      availableChannels.where((x) => x.type == 0).toList();
-  List<Channel> get directChannels =>
-      availableChannels.where((x) => x.type == 1).toList();
-
-  Future<void> refreshAvailableChannel() async {
-    final AuthProvider auth = Get.find();
-    if (auth.isAuthorized.isFalse) throw const UnauthorizedException();
-
-    isLoading.value = true;
-    final resp = await listAvailableChannel();
-    isLoading.value = false;
-
-    availableChannels.value =
-        resp.body.map((x) => Channel.fromJson(x)).toList().cast<Channel>();
-    availableChannels.refresh();
-  }

  Future<Response> getChannel(String alias, {String realm = 'global'}) async {
    final AuthProvider auth = Get.find();
@ -89,18 +70,22 @@ class ChannelProvider extends GetxController {
    return resp;
  }

-  Future<Response> listAvailableChannel({String realm = 'global'}) async {
+  Future<List<Channel>> listAvailableChannel({
+    String scope = 'global',
+    bool isDirect = false,
+  }) async {
    final AuthProvider auth = Get.find();
    if (auth.isAuthorized.isFalse) throw const UnauthorizedException();

    final client = await auth.configureClient('messaging');

-    final resp = await client.get('/channels/$realm/me/available');
+    final resp =
+        await client.get('/channels/$scope/me/available?direct=$isDirect');
    if (resp.statusCode != 200) {
      throw RequestException(resp);
    }

-    return resp;
+    return List.from(resp.body.map((x) => Channel.fromJson(x)));
  }

  Future<Response> createChannel(String scope, dynamic payload) async {
--- a/lib/providers/content/posts.dart
+++ b/lib/providers/content/posts.dart
@ -1,6 +1,7 @@
 import 'package:get/get.dart';
 import 'package:solian/exceptions/request.dart';
 import 'package:solian/exceptions/unauthorized.dart';
+import 'package:solian/models/post.dart';
 import 'package:solian/providers/auth.dart';
 import 'package:solian/services.dart';

@ -96,6 +97,15 @@ class PostProvider extends GetConnect {
    return resp;
  }

+  Future<List<Post>> listPostFeaturedReply(String alias, {int take = 1}) async {
+    final resp = await get('/posts/$alias/replies/featured?take=$take');
+    if (resp.statusCode != 200) {
+      throw RequestException(resp);
+    }
+
+    return List<Post>.from(resp.body.map((x) => Post.fromJson(x)));
+  }
+
  Future<Response> getPost(String alias) async {
    final resp = await get('/posts/$alias');
    if (resp.statusCode != 200) {
--- a/lib/providers/database/services/messages.dart
+++ b/lib/providers/database/services/messages.dart
@ -1,3 +1,6 @@
+import 'dart:convert';
+
+import 'package:collection/collection.dart';
 import 'package:drift/drift.dart';
 import 'package:get/get.dart' hide Value;
 import 'package:solian/exceptions/request.dart';
@ -129,6 +132,14 @@ class MessagesFetchingProvider extends GetxController {
    return await receiveEvent(remoteRecord);
  }

+  Future<LocalMessageEventTableData?> getEventFromLocal(int id) async {
+    final database = Get.find<DatabaseProvider>().database;
+    final localRecord = await (database.select(database.localMessageEventTable)
+          ..where((x) => x.id.equals(id)))
+        .getSingleOrNull();
+    return localRecord;
+  }
+
  /// Pull the remote events to local database
  Future<(List<Event>, int)?> pullRemoteEvents(Channel channel,
      {String scope = 'global', take = 10, offset = 0}) async {
@ -174,4 +185,26 @@ class MessagesFetchingProvider extends GetxController {
          ..orderBy([(t) => OrderingTerm.desc(t.id)]))
        .getSingleOrNull();
  }
+
+  Future<Map<int, List<LocalMessageEventTableData>>>
+      getLastInAllChannels() async {
+    final database = Get.find<DatabaseProvider>().database;
+    final rows = await database.customSelect('''
+    SELECT id, channel_id, data, created_at
+    FROM ${database.localMessageEventTable.actualTableName}
+    WHERE (channel_id, created_at) IN (
+      SELECT channel_id, MAX(created_at)
+      FROM ${database.localMessageEventTable.actualTableName}
+      GROUP BY channel_id
+    )
+    ''', readsFrom: {database.localMessageEventTable}).get();
+    return rows.map((row) {
+      return LocalMessageEventTableData(
+        id: row.read<int>('id'),
+        channelId: row.read<int>('channel_id'),
+        data: Event.fromJson(jsonDecode(row.read<String>('data'))),
+        createdAt: row.read<DateTime>('created_at'),
+      );
+    }).groupListsBy((x) => x.channelId);
+  }
 }
--- a/lib/providers/relation.dart
+++ b/lib/providers/relation.dart
@ -26,6 +26,19 @@ class RelationshipProvider extends GetxController {
    return _friends.any((x) => x.relatedId == account.id);
  }

+  Future<Relationship?> getRelationship(int relatedId) async {
+    final AuthProvider auth = Get.find();
+    final client = await auth.configureClient('auth');
+    final resp = await client.get('/users/me/relations/$relatedId');
+    if (resp.statusCode == 404) {
+      return null;
+    } else if (resp.statusCode != 200) {
+      throw RequestException(resp);
+    }
+
+    return Relationship.fromJson(resp.body);
+  }
+
  Future<Response> listRelation() async {
    final AuthProvider auth = Get.find();
    final client = await auth.configureClient('auth');
@ -38,7 +51,19 @@ class RelationshipProvider extends GetxController {
    return client.get('/users/me/relations?status=$status');
  }

-  Future<Response> makeFriend(String username) async {
+  Future<Relationship?> blockUser(String username) async {
+    final AuthProvider auth = Get.find();
+    final client = await auth.configureClient('auth');
+    final resp =
+        await client.post('/users/me/relations/block?related=$username', {});
+    if (resp.statusCode != 200) {
+      throw RequestException(resp);
+    }
+
+    return Relationship.fromJson(resp.body);
+  }
+
+  Future<Relationship?> makeFriend(String username) async {
    final AuthProvider auth = Get.find();
    final client = await auth.configureClient('auth');
    final resp = await client.post('/users/me/relations?related=$username', {});
@ -46,7 +71,7 @@ class RelationshipProvider extends GetxController {
      throw RequestException(resp);
    }

-    return resp;
+    return Relationship.fromJson(resp.body);
  }

  Future<Response> handleRelation(
@ -64,17 +89,17 @@ class RelationshipProvider extends GetxController {
    return resp;
  }

-  Future<Response> editRelation(Relationship relationship, int status) async {
+  Future<Relationship?> editRelation(int relatedId, int status) async {
    final AuthProvider auth = Get.find();
    final client = await auth.configureClient('auth');
-    final resp = await client.patch(
-      '/users/me/relations/${relationship.relatedId}',
+    final resp = await client.put(
+      '/users/me/relations/$relatedId',
      {'status': status},
    );
    if (resp.statusCode != 200) {
      throw RequestException(resp);
    }

-    return resp;
+    return Relationship.fromJson(resp.body);
  }
 }
--- a/lib/providers/stickers.dart
+++ b/lib/providers/stickers.dart
@ -1,34 +1,48 @@
+import 'dart:async';
+
 import 'package:get/get.dart';
-import 'package:solian/models/pagination.dart';
+import 'package:solian/exceptions/request.dart';
 import 'package:solian/models/stickers.dart';
 import 'package:solian/services.dart';

 class StickerProvider extends GetxController {
-  final RxMap<String, String> aliasImageMapping = RxMap();
-  final RxList<Sticker> availableStickers = RxList.empty(growable: true);
+  final RxMap<String, FutureOr<Sticker?>> stickerCache = RxMap();

-  Future<void> refreshAvailableStickers() async {
-    availableStickers.clear();
-    aliasImageMapping.clear();
+  Future<Sticker?> getStickerByAlias(String alias) {
+    if (stickerCache.containsKey(alias)) {
+      return Future.value(stickerCache[alias]);
+    }

+    stickerCache[alias] = Future(() async {
+      final client = await ServiceFinder.configureClient('files');
+      final resp = await client.get(
+        '/stickers/lookup/$alias',
+      );
+      if (resp.statusCode != 200) {
+        if (resp.statusCode == 404) {
+          stickerCache[alias] = null;
+        }
+        throw RequestException(resp);
+      }
+
+      return Sticker.fromJson(resp.body);
+    }).then((result) {
+      stickerCache[alias] = result;
+      return result;
+    });
+
+    return Future.value(stickerCache[alias]);
+  }
+
+  Future<List<Sticker>> searchStickerByAlias(String alias) async {
    final client = await ServiceFinder.configureClient('files');
    final resp = await client.get(
-      '/stickers/manifest?take=100',
+      '/stickers/lookup?probe=$alias',
    );
-    if (resp.statusCode == 200) {
-      final result = PaginationResult.fromJson(resp.body);
-      final out = result.data?.map((e) => StickerPack.fromJson(e)).toList();
-      if (out == null) return;
-
-      for (final pack in out) {
-        for (final sticker in (pack.stickers ?? List<Sticker>.empty())) {
-          sticker.pack = pack;
-          aliasImageMapping[sticker.textPlaceholder.toUpperCase()] =
-              sticker.imageUrl;
-          availableStickers.add(sticker);
-        }
-      }
+    if (resp.statusCode != 200) {
+      throw RequestException(resp);
    }
-    availableStickers.refresh();
+
+    return List<Sticker>.from(resp.body.map((x) => Sticker.fromJson(x)));
  }
 }
--- a/lib/providers/subscription.dart
+++ b/lib/providers/subscription.dart
@ -0,0 +1,46 @@
+import 'package:get/get.dart';
+import 'package:solian/exceptions/request.dart';
+import 'package:solian/exceptions/unauthorized.dart';
+import 'package:solian/models/subscription.dart';
+import 'package:solian/providers/auth.dart';
+
+class SubscriptionProvider extends GetxController {
+  Future<Subscription?> getSubscriptionOnUser(int userId) async {
+    final auth = Get.find<AuthProvider>();
+    if (!auth.isAuthorized.value) throw const UnauthorizedException();
+
+    final client = await auth.configureClient('co');
+    final resp = await client.get('/subscriptions/users/$userId');
+    if (resp.statusCode == 404) {
+      return null;
+    } else if (resp.statusCode != 200) {
+      throw RequestException(resp);
+    }
+
+    return Subscription.fromJson(resp.body);
+  }
+
+  Future<Subscription> subscribeToUser(int userId) async {
+    final auth = Get.find<AuthProvider>();
+    if (!auth.isAuthorized.value) throw const UnauthorizedException();
+
+    final client = await auth.configureClient('co');
+    final resp = await client.post('/subscriptions/users/$userId', {});
+    if (resp.statusCode != 200) {
+      throw RequestException(resp);
+    }
+
+    return Subscription.fromJson(resp.body);
+  }
+
+  Future<void> unsubscribeFromUser(int userId) async {
+    final auth = Get.find<AuthProvider>();
+    if (!auth.isAuthorized.value) throw const UnauthorizedException();
+
+    final client = await auth.configureClient('co');
+    final resp = await client.delete('/subscriptions/users/$userId');
+    if (resp.statusCode != 200) {
+      throw RequestException(resp);
+    }
+  }
+}
--- a/lib/providers/theme_switcher.dart
+++ b/lib/providers/theme_switcher.dart
@ -1,5 +1,8 @@
+import 'dart:convert';
+
 import 'package:flutter/material.dart';
 import 'package:shared_preferences/shared_preferences.dart';
+import 'package:solian/models/theme.dart';
 import 'package:solian/theme.dart';

 class ThemeSwitcher extends ChangeNotifier {
@ -13,11 +16,21 @@ class ThemeSwitcher extends ChangeNotifier {

  Future<void> restoreTheme() async {
    final prefs = await SharedPreferences.getInstance();
-    if (prefs.containsKey('global_theme_color')) {
-      final value = prefs.getInt('global_theme_color')!;
-      final color = Color(value);
-      lightThemeData = AppTheme.build(Brightness.light, seedColor: color);
-      darkThemeData = AppTheme.build(Brightness.dark, seedColor: color);
+    if (prefs.containsKey('global_theme')) {
+      final value = SolianThemeData.fromJson(
+        jsonDecode(prefs.getString('global_theme')!),
+      );
+      final agedTheme = prefs.getBool('aged_theme');
+      lightThemeData = AppTheme.buildFromData(
+        Brightness.light,
+        value,
+        useMaterial3: agedTheme == null ? true : !agedTheme,
+      );
+      darkThemeData = AppTheme.buildFromData(
+        Brightness.dark,
+        value,
+        useMaterial3: agedTheme == null ? true : !agedTheme,
+      );
      notifyListeners();
    }
  }
@ -27,4 +40,25 @@ class ThemeSwitcher extends ChangeNotifier {
    darkThemeData = dark;
    notifyListeners();
  }
+
+  Future<void> setThemeData(SolianThemeData? data) async {
+    final prefs = await SharedPreferences.getInstance();
+    if (data == null) {
+      prefs.remove('global_theme');
+    } else {
+      prefs.setString(
+        'global_theme',
+        jsonEncode(data.toJson()),
+      );
+      lightThemeData = AppTheme.buildFromData(Brightness.light, data);
+      darkThemeData = AppTheme.buildFromData(Brightness.dark, data);
+      notifyListeners();
+    }
+  }
+
+  Future<void> setAgedTheme(bool enabled) async {
+    final prefs = await SharedPreferences.getInstance();
+    prefs.setBool('aged_theme', enabled);
+    await restoreTheme();
+  }
 }
--- a/lib/router.dart
+++ b/lib/router.dart
@ -1,13 +1,14 @@
 import 'package:animations/animations.dart';
 import 'package:flutter/material.dart';
 import 'package:go_router/go_router.dart';
+import 'package:solian/bootstrapper.dart';
 import 'package:solian/models/realm.dart';
 import 'package:solian/screens/about.dart';
 import 'package:solian/screens/account.dart';
 import 'package:solian/screens/account/friend.dart';
-import 'package:solian/screens/account/personalize.dart';
+import 'package:solian/screens/account/preferences/notifications.dart';
+import 'package:solian/screens/account/profile_edit.dart';
 import 'package:solian/screens/account/profile_page.dart';
-import 'package:solian/screens/account/stickers.dart';
 import 'package:solian/screens/auth/signin.dart';
 import 'package:solian/screens/auth/signup.dart';
 import 'package:solian/screens/channel/channel_chat.dart';
@ -22,19 +23,24 @@ import 'package:solian/screens/realms.dart';
 import 'package:solian/screens/realms/realm_detail.dart';
 import 'package:solian/screens/realms/realm_organize.dart';
 import 'package:solian/screens/realms/realm_view.dart';
-import 'package:solian/screens/feed.dart';
+import 'package:solian/screens/explore.dart';
 import 'package:solian/screens/posts/post_editor.dart';
 import 'package:solian/screens/settings.dart';
 import 'package:solian/shells/root_shell.dart';
 import 'package:solian/shells/title_shell.dart';
+import 'package:solian/theme.dart';
+import 'package:solian/widgets/sidebar/empty_placeholder.dart';

 abstract class AppRouter {
  static GoRouter instance = GoRouter(
    routes: [
      ShellRoute(
-        builder: (context, state, child) => RootShell(
-          state: state,
-          child: child,
+        builder: (context, state, child) => BootstrapperShell(
+          key: const Key('global-bootstrapper'),
+          child: RootShell(
+            state: state,
+            child: child,
+          ),
        ),
        routes: [
          GoRoute(
@ -74,13 +80,18 @@ abstract class AppRouter {
    builder: (context, state, child) => child,
    routes: [
      GoRoute(
-        path: '/feed',
-        name: 'feed',
-        builder: (context, state) => const FeedScreen(),
+        path: '/explore',
+        name: 'explore',
+        builder: (context, state) => const ExploreScreen(),
      ),
      GoRoute(
-        path: '/feed/search',
-        name: 'feedSearch',
+        path: '/drafts',
+        name: 'draftBox',
+        builder: (context, state) => const DraftBoxScreen(),
+      ),
+      GoRoute(
+        path: '/posts/search',
+        name: 'postSearch',
        builder: (context, state) => TitleShell(
          state: state,
          child: FeedSearchScreen(
@ -89,11 +100,6 @@ abstract class AppRouter {
          ),
        ),
      ),
-      GoRoute(
-        path: '/drafts',
-        name: 'draftBox',
-        builder: (context, state) => const DraftBoxScreen(),
-      ),
      GoRoute(
        path: '/posts/view/:id',
        name: 'postDetail',
@ -133,12 +139,15 @@ abstract class AppRouter {
  );

  static final ShellRoute _chatRoute = ShellRoute(
-    builder: (context, state, child) => child,
+    builder: (context, state, child) =>
+        AppTheme.isLargeScreen(context) ? ChatListShell(child: child) : child,
    routes: [
      GoRoute(
        path: '/chat',
        name: 'chat',
-        builder: (context, state) => const ChatScreen(),
+        builder: (context, state) => AppTheme.isLargeScreen(context)
+            ? const EmptyPagePlaceholder()
+            : const ChatScreen(),
      ),
      GoRoute(
        path: '/chat/organize',
@ -238,14 +247,6 @@ abstract class AppRouter {
        name: 'accountFriend',
        builder: (context, state) => const FriendScreen(),
      ),
-      GoRoute(
-        path: '/account/stickers',
-        name: 'accountStickers',
-        builder: (context, state) => TitleShell(
-          state: state,
-          child: const StickerScreen(),
-        ),
-      ),
      GoRoute(
        path: '/account/personalize',
        name: 'accountProfile',
@ -254,6 +255,14 @@ abstract class AppRouter {
          child: const PersonalizeScreen(),
        ),
      ),
+      GoRoute(
+        path: '/account/preferences/notifications',
+        name: 'notificationPreferences',
+        builder: (context, state) => TitleShell(
+          state: state,
+          child: const NotificationPreferencesScreen(),
+        ),
+      ),
      GoRoute(
        path: '/account/view/:name',
        name: 'accountProfilePage',
--- a/lib/screens/about.dart
+++ b/lib/screens/about.dart
@ -1,6 +1,11 @@
 import 'package:flutter/material.dart';
 import 'package:gap/gap.dart';
+import 'package:get/get.dart';
+import 'package:intl/intl.dart';
 import 'package:package_info_plus/package_info_plus.dart';
+import 'package:shared_preferences/shared_preferences.dart';
+import 'package:solian/widgets/root_container.dart';
+import 'package:solian/widgets/sized_container.dart';
 import 'package:url_launcher/url_launcher_string.dart';

 class AboutScreen extends StatelessWidget {
@ -11,8 +16,7 @@ class AboutScreen extends StatelessWidget {
    const denseButtonStyle =
        ButtonStyle(visualDensity: VisualDensity(vertical: -4));

-    return Material(
-      color: Theme.of(context).colorScheme.surface,
+    return RootContainer(
      child: SizedBox(
        width: double.infinity,
        child: Column(
@ -47,31 +51,58 @@ class AboutScreen extends StatelessWidget {
            ),
            Text('Copyright © ${DateTime.now().year} Solsynth LLC'),
            const Gap(16),
-            TextButton(
-              style: denseButtonStyle,
-              child: const Text('App Details'),
-              onPressed: () async {
-                final info = await PackageInfo.fromPlatform();
+            CenteredContainer(
+              maxWidth: 280,
+              child: Wrap(
+                spacing: 4,
+                runSpacing: 4,
+                alignment: WrapAlignment.center,
+                children: [
+                  TextButton(
+                    style: denseButtonStyle,
+                    child: Text('appDetails'.tr),
+                    onPressed: () async {
+                      final info = await PackageInfo.fromPlatform();

-                showAboutDialog(
-                  context: context,
-                  applicationVersion: '${info.version} (${info.buildNumber})',
-                  applicationLegalese:
-                      'The Solar Network App is an intuitive and self-hostable social network and computing platform. Experience the freedom of a user-friendly design that empowers you to create and connect with communities on your own terms. Embrace the future of social networking with a platform that prioritizes your independence and privacy.',
-                  applicationIcon: ClipRRect(
-                    borderRadius: const BorderRadius.all(Radius.circular(16)),
-                    child:
-                        Image.asset('assets/logo.png', width: 60, height: 60),
+                      showAboutDialog(
+                        context: context,
+                        applicationVersion:
+                            '${info.version} (${info.buildNumber})',
+                        applicationLegalese:
+                            'The Solar Network App is an intuitive and open-source social network and computing platform. Experience the freedom of a user-friendly design that empowers you to create and connect with communities on your own terms. Embrace the future of social networking with a platform that prioritizes your independence and privacy.',
+                        applicationIcon: ClipRRect(
+                          borderRadius:
+                              const BorderRadius.all(Radius.circular(16)),
+                          child: Image.asset('assets/logo.png',
+                              width: 60, height: 60),
+                        ),
+                      );
+                    },
                  ),
-                );
-              },
-            ),
-            TextButton(
-              style: denseButtonStyle,
-              child: const Text('Project Website'),
-              onPressed: () {
-                launchUrlString('https://solsynth.dev/products/solar-network');
-              },
+                  TextButton(
+                    style: denseButtonStyle,
+                    child: Text('projectWebsite'.tr),
+                    onPressed: () {
+                      launchUrlString(
+                          'https://solsynth.dev/products/solar-network');
+                    },
+                  ),
+                  TextButton(
+                    style: denseButtonStyle,
+                    child: Text('termRelated'.tr),
+                    onPressed: () {
+                      launchUrlString('https://solsynth.dev/terms');
+                    },
+                  ),
+                  TextButton(
+                    style: denseButtonStyle,
+                    child: Text('serviceStatus'.tr),
+                    onPressed: () {
+                      launchUrlString('https://status.solsynth.dev');
+                    },
+                  ),
+                ],
+              ),
            ),
            const Gap(16),
            const Text(
@ -81,6 +112,34 @@ class AboutScreen extends StatelessWidget {
                fontSize: 12,
              ),
            ),
+            FutureBuilder(
+              future: SharedPreferences.getInstance(),
+              builder: (context, snapshot) {
+                const textStyle = TextStyle(
+                  fontWeight: FontWeight.w300,
+                  fontSize: 12,
+                );
+                if (!snapshot.hasData ||
+                    !snapshot.data!.containsKey('first_boot_time')) {
+                  return Text(
+                    'firstBootTime'.trParams({'time': 'unknown'.tr}),
+                    style: textStyle,
+                  );
+                } else {
+                  return Text(
+                    'firstBootTime'.trParams({
+                      'time': DateFormat('yyyy-MM-dd').format(
+                        DateTime.tryParse(
+                              snapshot.data!.getString('first_boot_time')!,
+                            )?.toLocal() ??
+                            DateTime.now(),
+                      ),
+                    }),
+                    style: textStyle,
+                  );
+                }
+              },
+            ),
          ],
        ),
      ),
--- a/lib/screens/account.dart
+++ b/lib/screens/account.dart
@ -7,6 +7,7 @@ import 'package:solian/providers/account_status.dart';
 import 'package:solian/providers/relation.dart';
 import 'package:solian/router.dart';
 import 'package:solian/widgets/account/account_heading.dart';
+import 'package:solian/widgets/root_container.dart';
 import 'package:solian/widgets/sized_container.dart';
 import 'package:badges/badges.dart' as badges;

@ -45,17 +46,11 @@ class _AccountScreenState extends State<AccountScreen> {
        'accountFriend'.tr,
        'accountFriend',
      ),
-      (
-        const Icon(Icons.emoji_symbols),
-        'accountStickers'.tr,
-        'accountStickers',
-      ),
    ];

    final AuthProvider auth = Get.find();

-    return Material(
-      color: Theme.of(context).colorScheme.surface,
+    return RootContainer(
      child: SafeArea(
        child: Obx(() {
          if (auth.isAuthorized.isFalse) {
@ -136,6 +131,15 @@ class _AccountScreenState extends State<AccountScreen> {
                    AppRouter.instance.pushNamed('settings');
                  },
                ),
+                if (auth.isAuthorized.value)
+                  ListTile(
+                    contentPadding: const EdgeInsets.symmetric(horizontal: 34),
+                    leading: const Icon(Icons.edit_notifications),
+                    title: Text('notificationPreferences'.tr),
+                    onTap: () {
+                      AppRouter.instance.pushNamed('notificationPreferences');
+                    },
+                  ),
                const Divider(thickness: 0.3, height: 1)
                    .paddingSymmetric(vertical: 4),
                ListTile(
--- a/lib/screens/account/friend.dart
+++ b/lib/screens/account/friend.dart
@ -6,6 +6,7 @@ import 'package:solian/models/relations.dart';
 import 'package:solian/providers/relation.dart';
 import 'package:solian/theme.dart';
 import 'package:solian/widgets/account/relative_list.dart';
+import 'package:solian/widgets/root_container.dart';

 class FriendScreen extends StatefulWidget {
  const FriendScreen({super.key});
@ -117,8 +118,7 @@ class _FriendScreenState extends State<FriendScreen>

  @override
  Widget build(BuildContext context) {
-    return Material(
-      color: Theme.of(context).colorScheme.surface,
+    return RootContainer(
      child: Scaffold(
        appBar: AppBar(
          centerTitle: false,
--- a/lib/screens/account/preferences/notifications.dart
+++ b/lib/screens/account/preferences/notifications.dart
@ -0,0 +1,118 @@
+import 'package:flutter/material.dart';
+import 'package:flutter_animate/flutter_animate.dart';
+import 'package:get/get.dart';
+import 'package:get/get_connect/http/src/exceptions/exceptions.dart';
+import 'package:google_fonts/google_fonts.dart';
+import 'package:solian/exceptions/request.dart';
+import 'package:solian/exts.dart';
+import 'package:solian/providers/auth.dart';
+import 'package:solian/widgets/root_container.dart';
+
+class NotificationPreferencesScreen extends StatefulWidget {
+  const NotificationPreferencesScreen({super.key});
+
+  @override
+  State<NotificationPreferencesScreen> createState() =>
+      _NotificationPreferencesScreenState();
+}
+
+class _NotificationPreferencesScreenState
+    extends State<NotificationPreferencesScreen> {
+  bool _isBusy = true;
+
+  Map<String, bool> _config = {};
+
+  final Map<String, String> _topicMap = {
+    'interactive.feedback': 'notificationTopicPostFeedback'.tr,
+    'interactive.subscription': 'notificationTopicPostSubscription'.tr,
+  };
+
+  Future<void> _getPreferences() async {
+    setState(() => _isBusy = true);
+
+    final auth = Get.find<AuthProvider>();
+    if (!auth.isAuthorized.value) throw UnauthorizedException();
+
+    final client = await auth.configureClient('id');
+    final resp = await client.get('/preferences/notifications');
+    if (resp.statusCode != 200 && resp.statusCode != 404) {
+      context.showErrorDialog(RequestException(resp));
+    }
+
+    if (resp.statusCode == 200) {
+      _config = resp.body['config']
+          .map((k, v) => MapEntry(k, v as bool))
+          .cast<String, bool>();
+    }
+
+    setState(() => _isBusy = false);
+  }
+
+  Future<void> _savePreferences() async {
+    setState(() => _isBusy = true);
+
+    final auth = Get.find<AuthProvider>();
+    if (!auth.isAuthorized.value) throw UnauthorizedException();
+
+    final client = await auth.configureClient('id');
+    final resp = await client.put('/preferences/notifications', {
+      'config': _config,
+    });
+    if (resp.statusCode != 200) {
+      context.showErrorDialog(RequestException(resp));
+    }
+
+    context.showSnackbar('preferencesApplied'.tr);
+
+    setState(() => _isBusy = false);
+  }
+
+  @override
+  void initState() {
+    super.initState();
+    _getPreferences();
+  }
+
+  @override
+  Widget build(BuildContext context) {
+    return RootContainer(
+      child: Column(
+        children: [
+          if (_isBusy) const LinearProgressIndicator().animate().scaleX(),
+          ListTile(
+            tileColor: Theme.of(context).colorScheme.surfaceContainer,
+            contentPadding: const EdgeInsets.symmetric(horizontal: 24),
+            leading: const Icon(Icons.save),
+            title: Text('save'.tr),
+            enabled: !_isBusy,
+            onTap: () {
+              _savePreferences();
+            },
+          ),
+          Expanded(
+            child: ListView.builder(
+              itemCount: _topicMap.length,
+              itemBuilder: (context, index) {
+                final element = _topicMap.entries.elementAt(index);
+                return CheckboxListTile(
+                  title: Text(element.value),
+                  subtitle: Text(
+                    element.key,
+                    style: GoogleFonts.robotoMono(fontSize: 12),
+                  ),
+                  value: _config[element.key] ?? true,
+                  contentPadding: const EdgeInsets.symmetric(horizontal: 24),
+                  onChanged: (value) {
+                    setState(() {
+                      _config[element.key] = value ?? false;
+                    });
+                  },
+                );
+              },
+            ),
+          ),
+        ],
+      ),
+    );
+  }
+}
--- a/lib/screens/account/profile_edit.dart
+++ b/lib/screens/account/profile_edit.dart
@ -1,5 +1,3 @@
-import 'dart:io';
-
 import 'package:flutter/material.dart';
 import 'package:flutter_animate/flutter_animate.dart';
 import 'package:gap/gap.dart';
@ -9,10 +7,12 @@ import 'package:image_picker/image_picker.dart';
 import 'package:intl/intl.dart';
 import 'package:solian/exts.dart';
 import 'package:solian/models/attachment.dart';
+import 'package:solian/platform.dart';
 import 'package:solian/providers/auth.dart';
 import 'package:solian/providers/content/attachment.dart';
 import 'package:solian/services.dart';
 import 'package:solian/widgets/account/account_avatar.dart';
+import 'package:solian/widgets/root_container.dart';

 class PersonalizeScreen extends StatefulWidget {
  const PersonalizeScreen({super.key});
@ -77,36 +77,42 @@ class _PersonalizeScreenState extends State<PersonalizeScreen> {
    final AuthProvider auth = Get.find();
    if (auth.isAuthorized.isFalse) return;

+    XFile file;
+
    final image = await _imagePicker.pickImage(source: ImageSource.gallery);
    if (image == null) return;

-    CroppedFile? croppedFile = await ImageCropper().cropImage(
-      sourcePath: image.path,
-      uiSettings: [
-        AndroidUiSettings(
-          toolbarTitle: 'cropImage'.tr,
-          toolbarColor: Theme.of(context).colorScheme.primary,
-          toolbarWidgetColor: Theme.of(context).colorScheme.onPrimary,
-          aspectRatioPresets: [
-            if (position == 'avatar') CropAspectRatioPreset.square,
-            if (position == 'banner') _BannerCropAspectRatioPreset(),
-          ],
-        ),
-        IOSUiSettings(
-          title: 'cropImage'.tr,
-          aspectRatioPresets: [
-            if (position == 'avatar') CropAspectRatioPreset.square,
-            if (position == 'banner') _BannerCropAspectRatioPreset(),
-          ],
-        ),
-        WebUiSettings(
-          context: context,
-        ),
-      ],
-    );
+    if (PlatformInfo.canCropImage) {
+      CroppedFile? croppedFile = await ImageCropper().cropImage(
+        sourcePath: image.path,
+        uiSettings: [
+          AndroidUiSettings(
+            toolbarTitle: 'cropImage'.tr,
+            toolbarColor: Theme.of(context).colorScheme.primary,
+            toolbarWidgetColor: Theme.of(context).colorScheme.onPrimary,
+            aspectRatioPresets: [
+              if (position == 'avatar') CropAspectRatioPreset.square,
+              if (position == 'banner') _BannerCropAspectRatioPreset(),
+            ],
+          ),
+          IOSUiSettings(
+            title: 'cropImage'.tr,
+            aspectRatioPresets: [
+              if (position == 'avatar') CropAspectRatioPreset.square,
+              if (position == 'banner') _BannerCropAspectRatioPreset(),
+            ],
+          ),
+          WebUiSettings(
+            context: context,
+          ),
+        ],
+      );

-    if (croppedFile == null) return;
-    final file = File(croppedFile.path);
+      if (croppedFile == null) return;
+      file = XFile(croppedFile.path);
+    } else {
+      file = XFile(image.path);
+    }

    setState(() => _isBusy = true);

@ -181,8 +187,7 @@ class _PersonalizeScreenState extends State<PersonalizeScreen> {
  Widget build(BuildContext context) {
    const double padding = 32;

-    return Material(
-      color: Theme.of(context).colorScheme.surface,
+    return RootContainer(
      child: ListView(
        children: [
          if (_isBusy) const LinearProgressIndicator().animate().scaleX(),
--- a/lib/screens/account/profile_page.dart
+++ b/lib/screens/account/profile_page.dart
@ -1,23 +1,34 @@
+import 'dart:math';
+
+import 'package:fl_chart/fl_chart.dart';
 import 'package:flutter/material.dart';
 import 'package:gap/gap.dart';
 import 'package:get/get.dart';
 import 'package:infinite_scroll_pagination/infinite_scroll_pagination.dart';
+import 'package:intl/intl.dart';
 import 'package:solian/controllers/post_list_controller.dart';
 import 'package:solian/exts.dart';
 import 'package:solian/models/account.dart';
 import 'package:solian/models/attachment.dart';
+import 'package:solian/models/daily_sign.dart';
 import 'package:solian/models/pagination.dart';
 import 'package:solian/models/post.dart';
+import 'package:solian/models/relations.dart';
+import 'package:solian/models/subscription.dart';
 import 'package:solian/providers/account_status.dart';
 import 'package:solian/providers/relation.dart';
+import 'package:solian/providers/subscription.dart';
 import 'package:solian/services.dart';
 import 'package:solian/theme.dart';
 import 'package:solian/widgets/account/account_avatar.dart';
 import 'package:solian/widgets/account/account_heading.dart';
 import 'package:solian/widgets/app_bar_leading.dart';
 import 'package:solian/widgets/attachments/attachment_list.dart';
+import 'package:solian/widgets/daily_sign/history_chart.dart';
 import 'package:solian/widgets/posts/post_list.dart';
 import 'package:solian/widgets/posts/post_warped_list.dart';
+import 'package:solian/widgets/reports/abuse_report.dart';
+import 'package:solian/widgets/root_container.dart';
 import 'package:solian/widgets/sized_container.dart';

 class AccountProfilePage extends StatefulWidget {
@ -37,16 +48,36 @@ class _AccountProfilePageState extends State<AccountProfilePage> {

  bool _isBusy = true;
  bool _isMakingFriend = false;
+  bool _isSubscribing = false;
  bool _showMature = false;

  Account? _userinfo;
+  Subscription? _subscription;
+  Relationship? _relationship;
  List<Post> _pinnedPosts = List.empty();
+  List<DailySignRecord> _dailySignRecords = List.empty();
  int _totalUpvote = 0, _totalDownvote = 0;

+  Future<void> _getSubscription() async {
+    setState(() => _isSubscribing = true);
+    _subscription = await Get.find<SubscriptionProvider>()
+        .getSubscriptionOnUser(_userinfo!.id);
+    setState(() => _isSubscribing = false);
+  }
+
+  Future<void> _getRelationship() async {
+    setState(() => _isBusy = true);
+
+    final relations = Get.find<RelationshipProvider>();
+    _relationship = await relations.getRelationship(_userinfo!.id);
+
+    setState(() => _isBusy = false);
+  }
+
  Future<void> _getUserinfo() async {
    setState(() => _isBusy = true);

-    var client = await ServiceFinder.configureClient('auth');
+    var client = await ServiceFinder.configureClient('id');
    var resp = await client.get('/users/${widget.name}');
    if (resp.statusCode != 200) {
      context.showErrorDialog(resp.bodyString).then((_) {
@ -56,7 +87,7 @@ class _AccountProfilePageState extends State<AccountProfilePage> {
      _userinfo = Account.fromJson(resp.body);
    }

-    client = await ServiceFinder.configureClient('interactive');
+    client = await ServiceFinder.configureClient('co');
    resp = await client.get('/users/${widget.name}');
    if (resp.statusCode != 200) {
      context.showErrorDialog(resp.bodyString).then((_) {
@ -70,8 +101,8 @@ class _AccountProfilePageState extends State<AccountProfilePage> {
    setState(() => _isBusy = false);
  }

-  Future<void> getPinnedPosts() async {
-    final client = await ServiceFinder.configureClient('interactive');
+  Future<void> _getPinnedPosts() async {
+    final client = await ServiceFinder.configureClient('co');
    final resp = await client.get('/users/${widget.name}/pin');
    if (resp.statusCode != 200) {
      context.showErrorDialog(resp.bodyString).then((_) {
@ -85,6 +116,80 @@ class _AccountProfilePageState extends State<AccountProfilePage> {
    }
  }

+  Future<void> _getDailySignRecords() async {
+    final client = await ServiceFinder.configureClient('id');
+    final resp = await client.get('/users/${widget.name}/daily?take=14');
+    if (resp.statusCode != 200) {
+      context.showErrorDialog(resp.bodyString).then((_) {
+        Navigator.pop(context);
+      });
+    } else {
+      final result = PaginationResult.fromJson(resp.body);
+      setState(() {
+        _dailySignRecords = List.from(
+          result.data?.map((x) => DailySignRecord.fromJson(x)) ?? [],
+        );
+      });
+    }
+  }
+
+  Future<void> _subscribeToUser() async {
+    setState(() => _isSubscribing = true);
+    _subscription =
+        await Get.find<SubscriptionProvider>().subscribeToUser(_userinfo!.id);
+    setState(() => _isSubscribing = false);
+  }
+
+  Future<void> _unsubscribeFromUser() async {
+    setState(() => _isSubscribing = true);
+    await Get.find<SubscriptionProvider>().unsubscribeFromUser(_userinfo!.id);
+    _subscription = null;
+    setState(() => _isSubscribing = false);
+  }
+
+  Future<void> _makeFriend() async {
+    setState(() => _isMakingFriend = true);
+    try {
+      _relationship = await _relationshipProvider.makeFriend(widget.name);
+      context.showSnackbar(
+        'accountFriendRequestSent'.tr,
+      );
+    } catch (e) {
+      context.showErrorDialog(e);
+    } finally {
+      setState(() => _isMakingFriend = false);
+    }
+  }
+
+  Future<void> _blockUser() async {
+    setState(() => _isMakingFriend = true);
+    try {
+      _relationship = await _relationshipProvider.blockUser(widget.name);
+      context.showSnackbar(
+        'accountBlocked'.tr,
+      );
+    } catch (e) {
+      context.showErrorDialog(e);
+    } finally {
+      setState(() => _isMakingFriend = false);
+    }
+  }
+
+  Future<void> _unblockUser() async {
+    setState(() => _isMakingFriend = true);
+    try {
+      _relationship =
+          await _relationshipProvider.editRelation(_userinfo!.id, 1);
+      context.showSnackbar(
+        'accountUnblocked'.tr,
+      );
+    } catch (e) {
+      context.showErrorDialog(e);
+    } finally {
+      setState(() => _isMakingFriend = false);
+    }
+  }
+
  int get _userSocialCreditPoints {
    return _totalUpvote * 2 - _totalDownvote + _postController.postTotal.value;
  }
@ -115,25 +220,12 @@ class _AccountProfilePageState extends State<AccountProfilePage> {
      }
    });

-    _getUserinfo();
-    getPinnedPosts();
-  }
-
-  Widget _buildStatisticsEntry(String label, String content) {
-    return Expanded(
-      child: Column(
-        children: [
-          Text(
-            label,
-            style: Theme.of(context).textTheme.bodySmall,
-          ),
-          Text(
-            content,
-            style: Theme.of(context).textTheme.bodyLarge,
-          ),
-        ],
-      ),
-    );
+    _getUserinfo().then((_) {
+      _getRelationship();
+      _getSubscription();
+      _getPinnedPosts();
+      _getDailySignRecords();
+    });
  }

  @override
@ -142,8 +234,7 @@ class _AccountProfilePageState extends State<AccountProfilePage> {
      return const Center(child: CircularProgressIndicator());
    }

-    return Material(
-      color: Theme.of(context).colorScheme.surface,
+    return RootContainer(
      child: DefaultTabController(
        length: 3,
        child: NestedScrollView(
@ -155,62 +246,71 @@ class _AccountProfilePageState extends State<AccountProfilePage> {
                toolbarHeight: AppTheme.toolbarHeight(context),
                leadingWidth: 24,
                automaticallyImplyLeading: false,
-                flexibleSpace: Row(
-                  children: [
-                    AppBarLeadingButton.adaptive(context) ?? const Gap(8),
-                    const Gap(8),
-                    if (_userinfo != null)
-                      AccountAvatar(content: _userinfo!.avatar, radius: 16),
-                    const Gap(12),
-                    Expanded(
-                      child: Column(
-                        mainAxisAlignment: MainAxisAlignment.center,
-                        crossAxisAlignment: CrossAxisAlignment.start,
-                        children: [
-                          if (_userinfo != null)
-                            Text(
-                              _userinfo!.nick,
-                              style: Theme.of(context).textTheme.bodyLarge,
-                            ),
-                          if (_userinfo != null)
-                            Text(
-                              '@${_userinfo!.name}',
-                              style: Theme.of(context).textTheme.bodySmall,
-                            ),
-                        ],
+                flexibleSpace: SizedBox(
+                  height: 56,
+                  child: Row(
+                    children: [
+                      AppBarLeadingButton.adaptive(context) ?? const Gap(8),
+                      const Gap(8),
+                      if (_userinfo != null)
+                        AccountAvatar(content: _userinfo!.avatar, radius: 16),
+                      const Gap(12),
+                      Expanded(
+                        child: Column(
+                          mainAxisAlignment: MainAxisAlignment.center,
+                          crossAxisAlignment: CrossAxisAlignment.start,
+                          children: [
+                            if (_userinfo != null)
+                              Text(
+                                _userinfo!.nick,
+                                style: Theme.of(context).textTheme.bodyLarge,
+                              ),
+                            if (_userinfo != null)
+                              Text(
+                                '@${_userinfo!.name}',
+                                style: Theme.of(context).textTheme.bodySmall,
+                              ),
+                          ],
+                        ),
                      ),
-                    ),
-                    if (_userinfo != null &&
-                        !_relationshipProvider.hasFriend(_userinfo!))
-                      IconButton(
-                        icon: const Icon(Icons.person_add),
-                        onPressed: _isMakingFriend
-                            ? null
-                            : () async {
-                                setState(() => _isMakingFriend = true);
-                                try {
-                                  await _relationshipProvider
-                                      .makeFriend(widget.name);
-                                  context.showSnackbar(
-                                    'accountFriendRequestSent'.tr,
-                                  );
-                                } catch (e) {
-                                  context.showErrorDialog(e);
-                                } finally {
-                                  setState(() => _isMakingFriend = false);
-                                }
-                              },
-                      )
-                    else
-                      const IconButton(
-                        icon: Icon(Icons.handshake),
-                        onPressed: null,
+                      if (_userinfo != null && _subscription == null)
+                        IconButton(
+                          style: const ButtonStyle(
+                            visualDensity:
+                                VisualDensity(horizontal: -4, vertical: -2),
+                          ),
+                          onPressed: _isSubscribing ? null : _subscribeToUser,
+                          icon: const Icon(Icons.add_circle_outline),
+                          tooltip: 'subscribe'.tr,
+                        )
+                      else if (_userinfo != null)
+                        IconButton(
+                          style: const ButtonStyle(
+                            visualDensity:
+                                VisualDensity(horizontal: -4, vertical: -2),
+                          ),
+                          onPressed:
+                              _isSubscribing ? null : _unsubscribeFromUser,
+                          icon: const Icon(Icons.remove_circle_outline),
+                          tooltip: 'unsubscribe'.tr,
+                        ),
+                      if (_userinfo != null && _relationship == null)
+                        IconButton(
+                          icon: const Icon(Icons.person_add),
+                          onPressed: _isMakingFriend ? null : _makeFriend,
+                          tooltip: 'friendAdd'.tr,
+                        )
+                      else
+                        const IconButton(
+                          icon: Icon(Icons.handshake),
+                          onPressed: null,
+                        ),
+                      SizedBox(
+                        width: AppTheme.isLargeScreen(context) ? 8 : 16,
                      ),
-                    SizedBox(
-                      width: AppTheme.isLargeScreen(context) ? 8 : 16,
-                    ),
-                  ],
-                ),
+                    ],
+                  ),
+                ).paddingOnly(top: MediaQuery.of(context).padding.top),
                bottom: TabBar(
                  tabs: [
                    Tab(text: 'profilePage'.tr),
@ -224,28 +324,212 @@ class _AccountProfilePageState extends State<AccountProfilePage> {
          body: TabBarView(
            physics: const NeverScrollableScrollPhysics(),
            children: [
-              Column(
+              ListView(
+                padding: const EdgeInsets.only(top: 16, bottom: 16),
                children: [
-                  const Gap(16),
-                  AccountHeadingWidget(
-                    name: _userinfo!.name,
-                    nick: _userinfo!.nick,
-                    desc: _userinfo!.description,
-                    badges: _userinfo!.badges,
-                    banner: _userinfo!.banner,
-                    avatar: _userinfo!.avatar,
-                    status: Get.find<StatusProvider>()
-                        .getSomeoneStatus(_userinfo!.name),
-                    detail: _userinfo,
-                    profile: _userinfo!.profile,
-                    extraWidgets: const [],
+                  CenteredContainer(
+                    child: AccountHeadingWidget(
+                      name: _userinfo!.name,
+                      nick: _userinfo!.nick,
+                      desc: _userinfo!.description,
+                      badges: _userinfo!.badges,
+                      banner: _userinfo!.banner,
+                      avatar: _userinfo!.avatar,
+                      status: Get.find<StatusProvider>()
+                          .getSomeoneStatus(_userinfo!.name),
+                      detail: _userinfo,
+                      profile: _userinfo!.profile,
+                      extraWidgets: [
+                        if (_dailySignRecords.isNotEmpty)
+                          Card(
+                            child: SizedBox(
+                              height: 180,
+                              width:
+                                  max(640, MediaQuery.of(context).size.width),
+                              child: LineChart(
+                                LineChartData(
+                                  lineBarsData: [
+                                    LineChartBarData(
+                                      isCurved: true,
+                                      isStrokeCapRound: true,
+                                      isStrokeJoinRound: true,
+                                      color:
+                                          Theme.of(context).colorScheme.primary,
+                                      belowBarData: BarAreaData(
+                                        show: true,
+                                        gradient: LinearGradient(
+                                          colors: List.filled(
+                                            _dailySignRecords.length,
+                                            Theme.of(context)
+                                                .colorScheme
+                                                .primary
+                                                .withOpacity(0.3),
+                                          ).toList(),
+                                        ),
+                                      ),
+                                      spots: _dailySignRecords
+                                          .map(
+                                            (x) => FlSpot(
+                                              x.createdAt
+                                                  .copyWith(
+                                                    hour: 0,
+                                                    minute: 0,
+                                                    second: 0,
+                                                    millisecond: 0,
+                                                    microsecond: 0,
+                                                  )
+                                                  .millisecondsSinceEpoch
+                                                  .toDouble(),
+                                              x.resultTier.toDouble(),
+                                            ),
+                                          )
+                                          .toList(),
+                                    )
+                                  ],
+                                  lineTouchData: LineTouchData(
+                                    touchTooltipData: LineTouchTooltipData(
+                                      getTooltipItems: (spots) => spots
+                                          .map((spot) => LineTooltipItem(
+                                                '${DailySignHistoryChartDialog.signSymbols[spot.y.toInt()]}\n${DateFormat('MM/dd').format(DateTime.fromMillisecondsSinceEpoch(spot.x.toInt()))}',
+                                                TextStyle(
+                                                  color: Theme.of(context)
+                                                      .colorScheme
+                                                      .onSurface,
+                                                ),
+                                              ))
+                                          .toList(),
+                                      getTooltipColor: (_) => Theme.of(context)
+                                          .colorScheme
+                                          .surfaceContainerHigh,
+                                    ),
+                                  ),
+                                  titlesData: FlTitlesData(
+                                    topTitles: const AxisTitles(
+                                      sideTitles: SideTitles(showTitles: false),
+                                    ),
+                                    rightTitles: const AxisTitles(
+                                      sideTitles: SideTitles(showTitles: false),
+                                    ),
+                                    leftTitles: AxisTitles(
+                                      sideTitles: SideTitles(
+                                        showTitles: true,
+                                        reservedSize: 40,
+                                        interval: 1,
+                                        getTitlesWidget: (value, _) => Align(
+                                          alignment: Alignment.centerRight,
+                                          child: Text(
+                                            DailySignHistoryChartDialog
+                                                .signSymbols[value.toInt()],
+                                            textAlign: TextAlign.right,
+                                          ).paddingOnly(right: 8),
+                                        ),
+                                      ),
+                                    ),
+                                    bottomTitles: AxisTitles(
+                                      sideTitles: SideTitles(
+                                        showTitles: true,
+                                        reservedSize: 28,
+                                        interval: 86400000,
+                                        getTitlesWidget: (value, _) => Text(
+                                          DateFormat('dd').format(
+                                            DateTime.fromMillisecondsSinceEpoch(
+                                              value.toInt(),
+                                            ),
+                                          ),
+                                          textAlign: TextAlign.center,
+                                        ).paddingOnly(top: 8),
+                                      ),
+                                    ),
+                                  ),
+                                  gridData: const FlGridData(show: false),
+                                  borderData: FlBorderData(show: false),
+                                ),
+                              ),
+                            ).marginOnly(
+                              right: 24,
+                              left: 12,
+                              bottom: 8,
+                              top: 24,
+                            ),
+                          )
+                      ],
+                      appendWidgets: [
+                        Card(
+                          child: Container(
+                            padding: const EdgeInsets.symmetric(
+                              vertical: 4,
+                              horizontal: 8,
+                            ),
+                            width: double.maxFinite,
+                            child: Wrap(
+                              alignment: WrapAlignment.spaceAround,
+                              children: [
+                                TextButton.icon(
+                                  style: const ButtonStyle(
+                                    visualDensity: VisualDensity(
+                                      horizontal: -4,
+                                      vertical: -2,
+                                    ),
+                                  ),
+                                  onPressed: () {
+                                    showDialog(
+                                      context: context,
+                                      builder: (context) => AbuseReportDialog(
+                                        resourceId: 'user:${_userinfo!.id}',
+                                      ),
+                                    );
+                                  },
+                                  icon: const Icon(
+                                    Icons.flag,
+                                    size: 16,
+                                  ),
+                                  label: Text('reportAbuse'.tr),
+                                ),
+                                if (_relationship?.status != 2)
+                                  TextButton.icon(
+                                    style: const ButtonStyle(
+                                      visualDensity: VisualDensity(
+                                        horizontal: -4,
+                                        vertical: -2,
+                                      ),
+                                    ),
+                                    onPressed:
+                                        _isMakingFriend ? null : _blockUser,
+                                    icon: const Icon(
+                                      Icons.block,
+                                      size: 16,
+                                    ),
+                                    label: Text('blockUser'.tr),
+                                  )
+                                else
+                                  TextButton.icon(
+                                    style: const ButtonStyle(
+                                      visualDensity: VisualDensity(
+                                        horizontal: -4,
+                                        vertical: -2,
+                                      ),
+                                    ),
+                                    onPressed:
+                                        _isMakingFriend ? null : _unblockUser,
+                                    icon: const Icon(
+                                      Icons.add_circle_outline,
+                                      size: 16,
+                                    ),
+                                    label: Text('unblockUser'.tr),
+                                  ),
+                              ],
+                            ),
+                          ),
+                        ),
+                      ],
+                    ),
                  ),
                ],
              ),
              RefreshIndicator(
                onRefresh: () => Future.wait([
                  _postController.reloadAllOver(),
-                  getPinnedPosts(),
+                  _getPinnedPosts(),
                ]),
                child: CustomScrollView(slivers: [
                  SliverToBoxAdapter(
@ -254,7 +538,7 @@ class _AccountProfilePageState extends State<AccountProfilePage> {
                        Row(
                          mainAxisAlignment: MainAxisAlignment.spaceAround,
                          children: [
-                            _buildStatisticsEntry(
+                            _StatsWidget(
                              'totalSocialCreditPoints'.tr,
                              _userinfo != null
                                  ? _userSocialCreditPoints.toString()
@ -267,16 +551,16 @@ class _AccountProfilePageState extends State<AccountProfilePage> {
                          mainAxisAlignment: MainAxisAlignment.spaceAround,
                          children: [
                            Obx(
-                              () => _buildStatisticsEntry(
+                              () => _StatsWidget(
                                'totalPostCount'.tr,
                                _postController.postTotal.value.toString(),
                              ),
                            ),
-                            _buildStatisticsEntry(
+                            _StatsWidget(
                              'totalUpvote'.tr,
                              _totalUpvote.toString(),
                            ),
-                            _buildStatisticsEntry(
+                            _StatsWidget(
                              'totalDownvote'.tr,
                              _totalDownvote.toString(),
                            ),
@ -302,6 +586,7 @@ class _AccountProfilePageState extends State<AccountProfilePage> {
                          isClickable: true,
                          isNestedClickable: true,
                          isShowEmbed: true,
+                          showFeaturedReply: true,
                          onUpdate: () {
                            _postController.reloadAllOver();
                          },
@ -325,8 +610,9 @@ class _AccountProfilePageState extends State<AccountProfilePage> {
              ),
              CenteredContainer(
                child: RefreshIndicator(
-                  onRefresh: () =>
-                      Future.sync(() => _albumPagingController.refresh()),
+                  onRefresh: () => Future.sync(
+                    () => _albumPagingController.refresh(),
+                  ),
                  child: PagedGridView<int, Attachment>(
                    padding: EdgeInsets.zero,
                    pagingController: _albumPagingController,
@ -352,7 +638,7 @@ class _AccountProfilePageState extends State<AccountProfilePage> {
                            child: AttachmentListEntry(
                              item: item,
                              isDense: true,
-                              parentId: 'album',
+                              parentId: 'album-$index',
                              showMature: _showMature,
                              onReveal: (value) {
                                setState(() => _showMature = value);
@ -372,3 +658,28 @@ class _AccountProfilePageState extends State<AccountProfilePage> {
    );
  }
 }
+
+class _StatsWidget extends StatelessWidget {
+  final String label;
+  final String content;
+
+  const _StatsWidget(this.label, this.content);
+
+  @override
+  Widget build(BuildContext context) {
+    return Expanded(
+      child: Column(
+        children: [
+          Text(
+            label,
+            style: Theme.of(context).textTheme.bodySmall,
+          ),
+          Text(
+            content,
+            style: Theme.of(context).textTheme.bodyLarge,
+          ),
+        ],
+      ),
+    );
+  }
+}
--- a/lib/screens/account/stickers.dart
+++ b/lib/screens/account/stickers.dart
@ -1,186 +0,0 @@
-import 'package:flutter/material.dart';
-import 'package:gap/gap.dart';
-import 'package:get/get.dart';
-import 'package:infinite_scroll_pagination/infinite_scroll_pagination.dart';
-import 'package:solian/models/pagination.dart';
-import 'package:solian/models/stickers.dart';
-import 'package:solian/providers/auth.dart';
-import 'package:solian/providers/stickers.dart';
-import 'package:solian/services.dart';
-import 'package:solian/widgets/auto_cache_image.dart';
-import 'package:solian/widgets/stickers/sticker_uploader.dart';
-
-class StickerScreen extends StatefulWidget {
-  const StickerScreen({super.key});
-
-  @override
-  State<StickerScreen> createState() => _StickerScreenState();
-}
-
-class _StickerScreenState extends State<StickerScreen> {
-  final PagingController<int, StickerPack> _pagingController =
-      PagingController(firstPageKey: 0);
-
-  Future<bool> _promptDelete(Sticker item, String prefix) async {
-    final AuthProvider auth = Get.find();
-    if (auth.isAuthorized.isFalse) return false;
-
-    final confirm = await showDialog(
-      context: context,
-      builder: (context) => AlertDialog(
-        title: Text('stickerDeletionConfirm'.tr),
-        content: Text(
-          'stickerDeletionConfirmCaption'.trParams({
-            'name': ':${'$prefix${item.alias}'.camelCase}:',
-          }),
-        ),
-        actions: <Widget>[
-          TextButton(
-            onPressed: () => Navigator.pop(context),
-            child: Text('cancel'.tr),
-          ),
-          TextButton(
-            onPressed: () => Navigator.pop(context, true),
-            child: Text('confirm'.tr),
-          ),
-        ],
-      ),
-    );
-    if (confirm != true) return false;
-
-    final client = await auth.configureClient('files');
-    final resp = await client.delete('/stickers/${item.id}');
-
-    return resp.statusCode == 200;
-  }
-
-  Future<bool?> _promptUploadSticker({Sticker? edit}) {
-    return showDialog(
-      context: context,
-      builder: (context) => StickerUploadDialog(
-        edit: edit,
-      ),
-    );
-  }
-
-  Widget _buildEmoteEntry(Sticker item, String prefix) {
-    final imageUrl = ServiceFinder.buildUrl(
-      'files',
-      '/attachments/${item.attachment.rid}',
-    );
-    return ListTile(
-      title: Text(item.name),
-      subtitle: Text(item.textWarpedPlaceholder),
-      contentPadding: const EdgeInsets.only(left: 16, right: 14),
-      trailing: Row(
-        mainAxisSize: MainAxisSize.min,
-        children: [
-          IconButton(
-            icon: const Icon(Icons.edit_square),
-            onPressed: () {
-              _promptUploadSticker(edit: item).then((value) {
-                if (value == true) _pagingController.refresh();
-              });
-            },
-          ),
-          IconButton(
-            icon: const Icon(Icons.delete),
-            onPressed: () {
-              _promptDelete(item, prefix).then((value) {
-                if (value == true) _pagingController.refresh();
-              });
-            },
-          ),
-        ],
-      ),
-      leading: AutoCacheImage(
-        imageUrl,
-        width: 28,
-        height: 28,
-        noErrorWidget: true,
-      ),
-    );
-  }
-
-  @override
-  void initState() {
-    final AuthProvider auth = Get.find();
-    final name = auth.userProfile.value!['name'];
-    _pagingController.addPageRequestListener((pageKey) async {
-      final client = await ServiceFinder.configureClient('files');
-      final resp = await client.get(
-        '/stickers/manifest?take=10&offset=$pageKey&author=$name',
-      );
-      if (resp.statusCode == 200) {
-        final result = PaginationResult.fromJson(resp.body);
-        final out = result.data?.map((e) => StickerPack.fromJson(e)).toList();
-        if (out != null && result.data!.length >= 10) {
-          _pagingController.appendPage(out, pageKey + out.length);
-        } else if (out != null) {
-          _pagingController.appendLastPage(out);
-        }
-      } else {
-        _pagingController.error = resp.bodyString;
-      }
-    });
-    super.initState();
-  }
-
-  @override
-  void dispose() {
-    final StickerProvider sticker = Get.find();
-    sticker.refreshAvailableStickers();
-    _pagingController.dispose();
-    super.dispose();
-  }
-
-  @override
-  Widget build(BuildContext context) {
-    return Scaffold(
-      floatingActionButton: FloatingActionButton(
-        child: const Icon(Icons.add),
-        onPressed: () {
-          _promptUploadSticker().then((value) {
-            if (value == true) _pagingController.refresh();
-          });
-        },
-      ),
-      body: RefreshIndicator(
-        onRefresh: () => Future.sync(() => _pagingController.refresh()),
-        child: CustomScrollView(
-          slivers: [
-            PagedSliverList<int, StickerPack>(
-              pagingController: _pagingController,
-              builderDelegate: PagedChildBuilderDelegate(
-                itemBuilder: (BuildContext context, item, int index) {
-                  return ExpansionTile(
-                    title: Row(
-                      crossAxisAlignment: CrossAxisAlignment.center,
-                      children: [
-                        Text(item.name),
-                        const Gap(6),
-                        Badge(
-                          label: Text('#${item.id}'),
-                        )
-                      ],
-                    ),
-                    subtitle: Text(
-                      item.description,
-                      maxLines: 1,
-                      overflow: TextOverflow.ellipsis,
-                    ),
-                    children: item.stickers?.map((x) {
-                          x.pack = item;
-                          return _buildEmoteEntry(x, item.prefix);
-                        }).toList() ??
-                        List.empty(),
-                  );
-                },
-              ),
-            ),
-          ],
-        ),
-      ),
-    );
-  }
-}
--- a/lib/screens/auth/signin.dart
+++ b/lib/screens/auth/signin.dart
@ -7,9 +7,13 @@ import 'package:solian/exceptions/request.dart';
 import 'package:solian/exts.dart';
 import 'package:solian/models/auth.dart';
 import 'package:solian/providers/auth.dart';
+import 'package:solian/providers/content/realm.dart';
+import 'package:solian/providers/relation.dart';
 import 'package:solian/providers/websocket.dart';
 import 'package:solian/services.dart';
+import 'package:solian/widgets/root_container.dart';
 import 'package:solian/widgets/sized_container.dart';
+import 'package:url_launcher/url_launcher_string.dart';

 class SignInScreen extends StatefulWidget {
  const SignInScreen({super.key});
@ -153,7 +157,7 @@ class _SignInScreenState extends State<SignInScreen> {

    try {
      // Check ticket
-      final resp = await client.patch('/auth', {
+      final resp = await client.request('/auth', 'PATCH', body: {
        'ticket_id': _currentTicket!.id,
        'factor_id': _factorPicked!,
        'code': password,
@ -173,16 +177,20 @@ class _SignInScreenState extends State<SignInScreen> {
          await auth.refreshAuthorizeStatus();
          await auth.refreshUserProfile();

+          Get.find<RealmProvider>().refreshAvailableRealms();
+          Get.find<RelationshipProvider>().refreshRelativeList();
          Get.find<WebSocketProvider>().registerPushNotifications();
          autoConfigureBackgroundNotificationService();
          autoStartBackgroundNotificationService();

          Navigator.pop(context, true);
+          _passwordController.clear();
        });
      } else {
        // Skip the first step
        _factorPicked = null;
        _factorPickedType = null;
+        _passwordController.clear();
        setState(() => _period += 2);
      }
    } catch (e) {
@ -203,15 +211,13 @@ class _SignInScreenState extends State<SignInScreen> {
      case 2:
        _passwordController.clear();
        _factorPickedType = null;
-      default:
-        setState(() => _period--);
    }
+    setState(() => _period--);
  }

  @override
  Widget build(BuildContext context) {
-    return Material(
-      color: Theme.of(context).colorScheme.surface,
+    return RootContainer(
      child: CenteredContainer(
        maxWidth: 360,
        child: PageTransitionSwitcher(
@ -228,16 +234,18 @@ class _SignInScreenState extends State<SignInScreen> {
            );
          },
          child: switch (_period % 3) {
-            1 => Column(
+            1 => ListView(
+                shrinkWrap: true,
                key: const ValueKey<int>(1),
-                mainAxisAlignment: MainAxisAlignment.center,
-                crossAxisAlignment: CrossAxisAlignment.start,
                children: [
-                  ClipRRect(
-                    borderRadius: const BorderRadius.all(Radius.circular(8)),
-                    child:
-                        Image.asset('assets/logo.png', width: 64, height: 64),
-                  ).paddingOnly(bottom: 8, left: 4),
+                  Align(
+                    alignment: Alignment.centerLeft,
+                    child: ClipRRect(
+                      borderRadius: const BorderRadius.all(Radius.circular(8)),
+                      child:
+                          Image.asset('assets/logo.png', width: 64, height: 64),
+                    ).paddingOnly(bottom: 8, left: 4),
+                  ),
                  Text(
                    'signinPickFactor'.tr,
                    style: const TextStyle(
@ -316,16 +324,18 @@ class _SignInScreenState extends State<SignInScreen> {
                  ),
                ],
              ),
-            2 => Column(
+            2 => ListView(
                key: const ValueKey<int>(2),
-                mainAxisAlignment: MainAxisAlignment.center,
-                crossAxisAlignment: CrossAxisAlignment.start,
+                shrinkWrap: true,
                children: [
-                  ClipRRect(
-                    borderRadius: const BorderRadius.all(Radius.circular(8)),
-                    child:
-                        Image.asset('assets/logo.png', width: 64, height: 64),
-                  ).paddingOnly(bottom: 8, left: 4),
+                  Align(
+                    alignment: Alignment.centerLeft,
+                    child: ClipRRect(
+                      borderRadius: const BorderRadius.all(Radius.circular(8)),
+                      child:
+                          Image.asset('assets/logo.png', width: 64, height: 64),
+                    ).paddingOnly(bottom: 8, left: 4),
+                  ),
                  Text(
                    'signinEnterPassword'.tr,
                    style: const TextStyle(
@ -389,16 +399,18 @@ class _SignInScreenState extends State<SignInScreen> {
                  ),
                ],
              ),
-            _ => Column(
+            _ => ListView(
                key: const ValueKey<int>(0),
-                mainAxisAlignment: MainAxisAlignment.center,
-                crossAxisAlignment: CrossAxisAlignment.start,
+                shrinkWrap: true,
                children: [
-                  ClipRRect(
-                    borderRadius: const BorderRadius.all(Radius.circular(8)),
-                    child:
-                        Image.asset('assets/logo.png', width: 64, height: 64),
-                  ).paddingOnly(bottom: 8, left: 4),
+                  Align(
+                    alignment: Alignment.centerLeft,
+                    child: ClipRRect(
+                      borderRadius: const BorderRadius.all(Radius.circular(8)),
+                      child:
+                          Image.asset('assets/logo.png', width: 64, height: 64),
+                    ).paddingOnly(bottom: 8, left: 4),
+                  ),
                  Text(
                    'signinGreeting'.tr,
                    style: const TextStyle(
@ -444,11 +456,50 @@ class _SignInScreenState extends State<SignInScreen> {
                      ),
                    ],
                  ),
+                  const Gap(12),
+                  Align(
+                    alignment: Alignment.centerRight,
+                    child: Container(
+                      constraints: const BoxConstraints(maxWidth: 290),
+                      child: Column(
+                        crossAxisAlignment: CrossAxisAlignment.end,
+                        children: [
+                          Text(
+                            'termAcceptNextWithAgree'.tr,
+                            textAlign: TextAlign.end,
+                            style:
+                                Theme.of(context).textTheme.bodySmall!.copyWith(
+                                      color: Theme.of(context)
+                                          .colorScheme
+                                          .onSurface
+                                          .withOpacity(0.75),
+                                    ),
+                          ),
+                          Material(
+                            color: Colors.transparent,
+                            child: InkWell(
+                              child: Row(
+                                mainAxisSize: MainAxisSize.min,
+                                children: [
+                                  Text('termAcceptLink'.tr),
+                                  const Gap(4),
+                                  const Icon(Icons.launch, size: 14),
+                                ],
+                              ),
+                              onTap: () {
+                                launchUrlString('https://solsynth.dev/terms');
+                              },
+                            ),
+                          ),
+                        ],
+                      ),
+                    ).paddingSymmetric(horizontal: 16),
+                  ),
                ],
              ),
          },
        ),
-      ),
+      ).paddingAll(24),
    );
  }
 }
--- a/lib/screens/auth/signup.dart
+++ b/lib/screens/auth/signup.dart
@ -3,7 +3,9 @@ import 'package:gap/gap.dart';
 import 'package:get/get.dart';
 import 'package:solian/exts.dart';
 import 'package:solian/services.dart';
+import 'package:solian/widgets/root_container.dart';
 import 'package:solian/widgets/sized_container.dart';
+import 'package:url_launcher/url_launcher_string.dart';

 class SignUpScreen extends StatefulWidget {
  const SignUpScreen({super.key});
@ -18,7 +20,7 @@ class _SignUpScreenState extends State<SignUpScreen> {
  final _nicknameController = TextEditingController();
  final _passwordController = TextEditingController();

-  void performAction(BuildContext context) async {
+  void _performAction(BuildContext context) async {
    final email = _emailController.value.text;
    final username = _usernameController.value.text;
    final nickname = _nicknameController.value.text;
@ -60,20 +62,23 @@ class _SignUpScreenState extends State<SignUpScreen> {
    }
  }

+  bool _isTermAccepted = false;
+
  @override
  Widget build(BuildContext context) {
-    return Material(
-      color: Theme.of(context).colorScheme.surface,
+    return RootContainer(
      child: CenteredContainer(
        maxWidth: 360,
-        child: Column(
-          mainAxisSize: MainAxisSize.min,
-          crossAxisAlignment: CrossAxisAlignment.start,
+        child: ListView(
+          shrinkWrap: true,
          children: [
-            ClipRRect(
-              borderRadius: const BorderRadius.all(Radius.circular(8)),
-              child: Image.asset('assets/logo.png', width: 64, height: 64),
-            ).paddingOnly(bottom: 8, left: 4),
+            Align(
+              alignment: Alignment.centerLeft,
+              child: ClipRRect(
+                borderRadius: const BorderRadius.all(Radius.circular(8)),
+                child: Image.asset('assets/logo.png', width: 64, height: 64),
+              ).paddingOnly(bottom: 8, left: 4),
+            ),
            Text(
              'signupGreeting'.tr,
              style: const TextStyle(
@ -136,12 +141,61 @@ class _SignUpScreenState extends State<SignUpScreen> {
              ),
              onTapOutside: (_) =>
                  FocusManager.instance.primaryFocus?.unfocus(),
-              onSubmitted: (_) => performAction(context),
+              onSubmitted: (_) => _performAction(context),
+            ),
+            const Gap(8),
+            CheckboxListTile(
+              value: _isTermAccepted,
+              title: Text(
+                'termAccept'.tr,
+                style: const TextStyle(height: 1.2),
+              ).paddingOnly(bottom: 4),
+              shape: const RoundedRectangleBorder(
+                borderRadius: BorderRadius.all(
+                  Radius.circular(8),
+                ),
+              ),
+              subtitle: RichText(
+                text: TextSpan(
+                  style: Theme.of(context).textTheme.bodySmall!.copyWith(
+                        color: Theme.of(context)
+                            .colorScheme
+                            .onSurface
+                            .withOpacity(0.75),
+                      ),
+                  children: [
+                    TextSpan(text: 'termAcceptDesc'.tr),
+                    WidgetSpan(
+                      child: Material(
+                        color: Colors.transparent,
+                        child: InkWell(
+                          child: Row(
+                            mainAxisSize: MainAxisSize.min,
+                            children: [
+                              Text('termAcceptLink'.tr),
+                              const Gap(4),
+                              const Icon(Icons.launch, size: 14),
+                            ],
+                          ),
+                          onTap: () {
+                            launchUrlString('https://solsynth.dev/terms');
+                          },
+                        ),
+                      ),
+                    ),
+                  ],
+                ),
+              ),
+              onChanged: (value) {
+                setState(() => _isTermAccepted = value ?? false);
+              },
            ),
            const Gap(16),
            Align(
              alignment: Alignment.centerRight,
              child: TextButton(
+                onPressed:
+                    !_isTermAccepted ? null : () => _performAction(context),
                child: Row(
                  mainAxisSize: MainAxisSize.min,
                  children: [
@ -149,12 +203,11 @@ class _SignUpScreenState extends State<SignUpScreen> {
                    const Icon(Icons.chevron_right),
                  ],
                ),
-                onPressed: () => performAction(context),
              ),
            )
          ],
        ),
-      ),
+      ).paddingAll(24),
    );
  }
 }
--- a/lib/screens/channel/call/call.dart
+++ b/lib/screens/channel/call/call.dart
@ -11,6 +11,7 @@ import 'package:solian/widgets/app_bar_leading.dart';
 import 'package:solian/widgets/chat/call/call_controls.dart';
 import 'package:solian/widgets/chat/call/call_participant.dart';
 import 'package:livekit_client/livekit_client.dart' as livekit;
+import 'package:solian/widgets/root_container.dart';

 class CallScreen extends StatefulWidget {
  final bool hideAppBar;
@ -197,8 +198,7 @@ class _CallScreenState extends State<CallScreen> with TickerProviderStateMixin {
  Widget build(BuildContext context) {
    final ChatCallProvider ctrl = Get.find();

-    return Material(
-      color: Theme.of(context).colorScheme.surface,
+    return RootContainer(
      child: Scaffold(
        appBar: widget.hideAppBar
            ? null
--- a/lib/screens/channel/channel_chat.dart
+++ b/lib/screens/channel/channel_chat.dart
@ -3,6 +3,7 @@ import 'dart:ui';

 import 'package:flutter/material.dart';
 import 'package:get/get.dart';
+import 'package:shared_preferences/shared_preferences.dart';
 import 'package:solian/controllers/chat_events_controller.dart';
 import 'package:solian/exts.dart';
 import 'package:solian/models/call.dart';
@ -25,6 +26,7 @@ import 'package:solian/widgets/chat/chat_event_list.dart';
 import 'package:solian/widgets/chat/chat_message_input.dart';
 import 'package:solian/widgets/chat/chat_typing_indicator.dart';
 import 'package:solian/widgets/current_state_action.dart';
+import 'package:solian/widgets/root_container.dart';

 class ChannelChatScreen extends StatefulWidget {
  final String alias;
@ -179,6 +181,8 @@ class _ChannelChatScreenState extends State<ChannelChatScreen>
    }
  }

+  late SharedPreferences _prefs;
+
  @override
  void initState() {
    super.initState();
@ -189,10 +193,13 @@ class _ChannelChatScreenState extends State<ChannelChatScreen>
    _chatController = ChatEventController();
    _chatController.initialize();

-    _getOngoingCall();
-    _getChannel().then((_) {
-      _chatController.getInitialEvents(_channel!, widget.realm);
-      _listenMessages();
+    SharedPreferences.getInstance().then((inst) {
+      _prefs = inst;
+      _getOngoingCall();
+      _getChannel().then((_) {
+        _chatController.getInitialEvents(_channel!, widget.realm);
+        _listenMessages();
+      });
    });
  }

@ -201,151 +208,159 @@ class _ChannelChatScreenState extends State<ChannelChatScreen>
    String title = _channel?.name ?? 'loading'.tr;
    String? placeholder;

-    if (_channel?.type == 1) {
-      final otherside =
-          _channel!.members!.where((e) => e.account.id != _accountId).first;
+    final otherside =
+        _channel?.members!.where((e) => e.account.id != _accountId).firstOrNull;
+
+    if (_channel?.type == 1 && otherside != null) {
      title = otherside.account.nick;
      placeholder = 'messageInputPlaceholder'.trParams(
        {'channel': '@${otherside.account.name}'},
      );
    }

-    return Scaffold(
-      appBar: AppBar(
-        leading: AppBarLeadingButton.adaptive(context),
-        title: AppBarTitle(title),
-        centerTitle: false,
-        titleSpacing: AppTheme.titleSpacing(context),
-        toolbarHeight: AppTheme.toolbarHeight(context),
-        actions: [
-          const BackgroundStateWidget(),
-          Builder(builder: (context) {
-            if (_isBusy || _channel == null) return const SizedBox.shrink();
+    return RootContainer(
+      child: Scaffold(
+        appBar: AppBar(
+          leading: AppBarLeadingButton.adaptive(context),
+          title: AppBarTitle(title),
+          centerTitle: false,
+          titleSpacing: AppTheme.titleSpacing(context),
+          toolbarHeight: AppTheme.toolbarHeight(context),
+          actions: [
+            const BackgroundStateWidget(),
+            Builder(builder: (context) {
+              if (_isBusy || _channel == null) return const SizedBox.shrink();

-            return ChatCallButton(
-              realm: _channel!.realm,
-              channel: _channel!,
-              ongoingCall: _ongoingCall,
-            );
-          }),
-          IconButton(
-            icon: const Icon(Icons.more_vert),
-            onPressed: () {
-              if (_channel == null) return;
+              return ChatCallButton(
+                realm: _channel!.realm,
+                channel: _channel!,
+                ongoingCall: _ongoingCall,
+              );
+            }),
+            IconButton(
+              icon: const Icon(Icons.more_vert),
+              onPressed: () {
+                if (_channel == null) return;

-              AppRouter.instance
-                  .pushNamed(
-                'channelDetail',
-                pathParameters: {'alias': widget.alias},
-                queryParameters: {'realm': widget.realm},
-                extra: ChannelDetailArguments(
-                  profile: _channelProfile!,
-                  channel: _channel!,
-                ),
-              )
-                  .then((value) {
-                if (value == false) AppRouter.instance.pop();
-                if (value != null) {
-                  final resp = Channel.fromJson(value as Map<String, dynamic>);
-                  _getChannel(alias: resp.alias);
-                }
-              });
-            },
-          ),
-          SizedBox(
-            width: AppTheme.isLargeScreen(context) ? 8 : 16,
-          ),
-        ],
-      ),
-      body: Builder(builder: (context) {
-        if (_isBusy || _channel == null) {
-          return const Center(
-            child: CircularProgressIndicator(),
-          );
-        }
-
-        return Row(
-          children: [
-            Expanded(
-              child: Column(
-                children: [
-                  if (_ongoingCall != null)
-                    ChannelCallIndicator(
-                      channel: _channel!,
-                      ongoingCall: _ongoingCall!,
-                      onJoin: () {
-                        if (!AppTheme.isLargeScreen(context)) {
-                          final ChatCallProvider call = Get.find();
-                          call.gotoScreen(context);
-                        }
-                      },
-                    ),
-                  Expanded(
-                    child: ChatEventList(
-                      scope: widget.realm,
-                      channel: _channel!,
-                      chatController: _chatController,
-                      onEdit: (item) {
-                        setState(() => _messageToEditing = item);
-                      },
-                      onReply: (item) {
-                        setState(() => _messageToReplying = item);
-                      },
-                    ),
+                AppRouter.instance
+                    .pushNamed(
+                  'channelDetail',
+                  pathParameters: {'alias': widget.alias},
+                  queryParameters: {'realm': widget.realm},
+                  extra: ChannelDetailArguments(
+                    profile: _channelProfile!,
+                    channel: _channel!,
                  ),
-                  ClipRect(
-                    child: BackdropFilter(
-                      filter: ImageFilter.blur(sigmaX: 50, sigmaY: 50),
-                      child: SafeArea(
-                        child: Column(
-                          children: [
-                            ChatTypingIndicator(users: _typingUsers),
-                            ChatMessageInput(
-                              edit: _messageToEditing,
-                              reply: _messageToReplying,
-                              realm: widget.realm,
-                              placeholder: placeholder,
-                              channel: _channel!,
-                              onSent: (Event item) {
-                                setState(() {
-                                  _chatController.addPendingEvent(item);
-                                });
-                              },
-                              onReset: () {
-                                setState(() {
-                                  _messageToReplying = null;
-                                  _messageToEditing = null;
-                                });
-                              },
-                            ),
-                          ],
+                )
+                    .then((value) {
+                  if (value == false) AppRouter.instance.pop();
+                  if (value != null) {
+                    final resp =
+                        Channel.fromJson(value as Map<String, dynamic>);
+                    _getChannel(alias: resp.alias);
+                  }
+                });
+              },
+            ),
+            SizedBox(
+              width: AppTheme.isLargeScreen(context) ? 8 : 16,
+            ),
+          ],
+        ),
+        body: Builder(builder: (context) {
+          if (_isBusy || _channel == null) {
+            return const Center(
+              child: CircularProgressIndicator(),
+            );
+          }
+
+          return Row(
+            children: [
+              Expanded(
+                child: Column(
+                  children: [
+                    if (_ongoingCall != null)
+                      ChannelCallIndicator(
+                        channel: _channel!,
+                        ongoingCall: _ongoingCall!,
+                        onJoin: () {
+                          if (!AppTheme.isUltraLargeScreen(context)) {
+                            final ChatCallProvider call = Get.find();
+                            call.gotoScreen(context);
+                          }
+                        },
+                      ),
+                    Expanded(
+                      child: ChatEventList(
+                        noAnimated:
+                            _prefs.getBool('non_animated_message_list') ??
+                                false,
+                        scope: widget.realm,
+                        channel: _channel!,
+                        chatController: _chatController,
+                        onEdit: (item) {
+                          setState(() => _messageToEditing = item);
+                        },
+                        onReply: (item) {
+                          setState(() => _messageToReplying = item);
+                        },
+                      ),
+                    ),
+                    ClipRect(
+                      child: BackdropFilter(
+                        filter: ImageFilter.blur(sigmaX: 50, sigmaY: 50),
+                        child: SafeArea(
+                          child: Column(
+                            children: [
+                              ChatTypingIndicator(users: _typingUsers),
+                              ChatMessageInput(
+                                edit: _messageToEditing,
+                                reply: _messageToReplying,
+                                realm: widget.realm,
+                                placeholder: placeholder,
+                                channel: _channel!,
+                                onSent: (Event item) {
+                                  setState(() {
+                                    _chatController.addPendingEvent(item);
+                                  });
+                                },
+                                onReset: () {
+                                  setState(() {
+                                    _messageToReplying = null;
+                                    _messageToEditing = null;
+                                  });
+                                },
+                              ),
+                            ],
+                          ),
                        ),
                      ),
                    ),
-                  ),
-                ],
+                  ],
+                ),
              ),
-            ),
-            Obx(() {
-              final ChatCallProvider call = Get.find();
-              if (call.isMounted.value && AppTheme.isLargeScreen(context)) {
-                return const Expanded(
-                  child: Row(children: [
-                    VerticalDivider(width: 0.3, thickness: 0.3),
-                    Expanded(
-                      child: CallScreen(
-                        hideAppBar: true,
-                        isExpandable: true,
+              Obx(() {
+                final ChatCallProvider call = Get.find();
+                if (call.isMounted.value &&
+                    AppTheme.isUltraLargeScreen(context)) {
+                  return const Expanded(
+                    child: Row(children: [
+                      VerticalDivider(width: 0.3, thickness: 0.3),
+                      Expanded(
+                        child: CallScreen(
+                          hideAppBar: true,
+                          isExpandable: true,
+                        ),
                      ),
-                    ),
-                  ]),
-                );
-              }
-              return const SizedBox.shrink();
-            }),
-          ],
-        );
-      }),
+                    ]),
+                  );
+                }
+                return const SizedBox.shrink();
+              }),
+            ],
+          );
+        }),
+      ),
    );
  }

--- a/lib/screens/channel/channel_detail.dart
+++ b/lib/screens/channel/channel_detail.dart
@ -114,7 +114,8 @@ class _ChannelDetailScreenState extends State<ChannelDetailScreen> {
      ListTile(
        leading: const Icon(Icons.settings),
        trailing: const Icon(Icons.chevron_right),
-        title: Text('channelSettings'.tr.capitalize!),
+        title: Text('channelSettings'.tr),
+        contentPadding: const EdgeInsets.symmetric(horizontal: 24),
        onTap: () async {
          AppRouter.instance
              .pushNamed(
@ -173,7 +174,8 @@ class _ChannelDetailScreenState extends State<ChannelDetailScreen> {
            children: [
              ListTile(
                leading: const Icon(Icons.notifications_active),
-                title: Text('channelNotifyLevel'.tr.capitalize!),
+                title: Text('channelNotifyLevel'.tr),
+                contentPadding: const EdgeInsets.symmetric(horizontal: 24),
                trailing: DropdownButtonHideUnderline(
                  child: DropdownButton2<int>(
                    isExpanded: true,
@ -206,14 +208,16 @@ class _ChannelDetailScreenState extends State<ChannelDetailScreen> {
                ),
              ),
              ListTile(
+                contentPadding: const EdgeInsets.symmetric(horizontal: 24),
                leading: const Icon(Icons.supervisor_account),
                trailing: const Icon(Icons.chevron_right),
-                title: Text('channelMembers'.tr.capitalize!),
+                title: Text('channelMembers'.tr),
                onTap: () => showMemberList(),
              ),
              ...(_isOwned ? ownerActions : List.empty()),
              const Divider(thickness: 0.3),
              ListTile(
+                contentPadding: const EdgeInsets.symmetric(horizontal: 24),
                leading: _isOwned
                    ? const Icon(Icons.delete)
                    : const Icon(Icons.exit_to_app),
--- a/lib/screens/channel/channel_organize.dart
+++ b/lib/screens/channel/channel_organize.dart
@ -9,6 +9,7 @@ import 'package:solian/providers/content/channel.dart';
 import 'package:solian/router.dart';
 import 'package:solian/theme.dart';
 import 'package:solian/widgets/app_bar_title.dart';
+import 'package:solian/widgets/root_container.dart';
 import 'package:uuid/uuid.dart';

 class ChannelOrganizeArguments {
@ -35,13 +36,14 @@ class _ChannelOrganizeScreenState extends State<ChannelOrganizeScreen> {
  final _nameController = TextEditingController();
  final _descriptionController = TextEditingController();

-  bool _isEncrypted = false;
+  bool _isPublic = false;
+  bool _isCommunity = false;

-  void applyChannel() async {
+  void _applyChannel() async {
    final AuthProvider auth = Get.find();
    if (auth.isAuthorized.isFalse) return;

-    if (_aliasController.value.text.isEmpty) randomizeAlias();
+    if (_aliasController.value.text.isEmpty) _randomizeAlias();

    setState(() => _isBusy = true);

@ -52,7 +54,7 @@ class _ChannelOrganizeScreenState extends State<ChannelOrganizeScreen> {
      'alias': _aliasController.value.text.toLowerCase(),
      'name': _nameController.value.text,
      'description': _descriptionController.value.text,
-      'is_encrypted': _isEncrypted,
+      'is_encrypted': _isPublic,
    };

    Response? resp;
@ -71,41 +73,49 @@ class _ChannelOrganizeScreenState extends State<ChannelOrganizeScreen> {
    setState(() => _isBusy = false);
  }

-  void randomizeAlias() {
+  void _randomizeAlias() {
    _aliasController.text =
        const Uuid().v4().replaceAll('-', '').substring(0, 12);
  }

-  void syncWidget() {
+  void _syncWidget() {
    if (widget.edit != null) {
      _aliasController.text = widget.edit!.alias;
      _nameController.text = widget.edit!.name;
      _descriptionController.text = widget.edit!.description;
-      _isEncrypted = widget.edit!.isEncrypted;
+      _isPublic = widget.edit!.isPublic;
+      _isCommunity = widget.edit!.isCommunity;
    }
  }

-  void cancelAction() {
+  void _cancelAction() {
    AppRouter.instance.pop();
  }

  @override
  void initState() {
-    syncWidget();
+    _syncWidget();
    super.initState();
  }

+  @override
+  void dispose() {
+    _aliasController.dispose();
+    _nameController.dispose();
+    _descriptionController.dispose();
+    super.dispose();
+  }
+
  @override
  Widget build(BuildContext context) {
    final notifyBannerActions = [
      TextButton(
-        onPressed: cancelAction,
+        onPressed: _cancelAction,
        child: Text('cancel'.tr),
      ),
    ];

-    return Material(
-      color: Theme.of(context).colorScheme.surface,
+    return RootContainer(
      child: Scaffold(
        appBar: AppBar(
          title: AppBarTitle('channelOrganizing'.tr),
@ -113,7 +123,7 @@ class _ChannelOrganizeScreenState extends State<ChannelOrganizeScreen> {
          toolbarHeight: AppTheme.toolbarHeight(context),
          actions: [
            TextButton(
-              onPressed: _isBusy ? null : () => applyChannel(),
+              onPressed: _isBusy ? null : () => _applyChannel(),
              child: Text('apply'.tr.toUpperCase()),
            )
          ],
@ -164,7 +174,7 @@ class _ChannelOrganizeScreenState extends State<ChannelOrganizeScreen> {
                      visualDensity:
                          const VisualDensity(horizontal: -2, vertical: -2),
                    ),
-                    onPressed: () => randomizeAlias(),
+                    onPressed: () => _randomizeAlias(),
                    child: const Icon(Icons.refresh),
                  )
                ],
@ -196,12 +206,17 @@ class _ChannelOrganizeScreenState extends State<ChannelOrganizeScreen> {
              ),
              const Divider(thickness: 0.3),
              CheckboxListTile(
-                title: Text('channelEncrypted'.tr),
-                value: _isEncrypted,
-                onChanged: (widget.edit?.isEncrypted ?? false)
-                    ? null
-                    : (newValue) =>
-                        setState(() => _isEncrypted = newValue ?? false),
+                title: Text('channelPublic'.tr),
+                value: _isPublic,
+                onChanged: (value) =>
+                    setState(() => _isPublic = value ?? false),
+                controlAffinity: ListTileControlAffinity.leading,
+              ),
+              CheckboxListTile(
+                title: Text('channelCommunity'.tr),
+                value: _isCommunity,
+                onChanged: (value) =>
+                    setState(() => _isCommunity = value ?? false),
                controlAffinity: ListTileControlAffinity.leading,
              ),
            ],
--- a/lib/screens/chat.dart
+++ b/lib/screens/chat.dart
@ -1,141 +1,326 @@
 import 'package:flutter/material.dart';
 import 'package:font_awesome_flutter/font_awesome_flutter.dart';
+import 'package:gap/gap.dart';
 import 'package:get/get.dart';
+import 'package:solian/controllers/chat_events_controller.dart';
 import 'package:solian/exts.dart';
+import 'package:solian/models/channel.dart';
 import 'package:solian/providers/auth.dart';
 import 'package:solian/providers/content/channel.dart';
+import 'package:solian/providers/content/realm.dart';
+import 'package:solian/providers/database/database.dart';
 import 'package:solian/router.dart';
 import 'package:solian/screens/account/notification.dart';
 import 'package:solian/theme.dart';
+import 'package:solian/widgets/account/account_avatar.dart';
 import 'package:solian/widgets/account/signin_required_overlay.dart';
 import 'package:solian/widgets/app_bar_leading.dart';
 import 'package:solian/widgets/app_bar_title.dart';
 import 'package:solian/widgets/channel/channel_list.dart';
 import 'package:solian/widgets/chat/call/chat_call_indicator.dart';
 import 'package:solian/widgets/current_state_action.dart';
-import 'package:solian/widgets/sized_container.dart';
+import 'package:solian/widgets/root_container.dart';
+import 'package:solian/widgets/sidebar/empty_placeholder.dart';

-class ChatScreen extends StatefulWidget {
+class ChatScreen extends StatelessWidget {
  const ChatScreen({super.key});

  @override
-  State<ChatScreen> createState() => _ChatScreenState();
+  Widget build(BuildContext context) {
+    return const RootContainer(
+      child: ChatList(),
+    );
+  }
 }

-class _ChatScreenState extends State<ChatScreen> {
-  late final ChannelProvider _channels;
+class ChatListShell extends StatelessWidget {
+  final Widget? child;
+
+  const ChatListShell({super.key, required this.child});
+
+  @override
+  Widget build(BuildContext context) {
+    return RootContainer(
+      child: Row(
+        children: [
+          const SizedBox(
+            width: 360,
+            child: ChatList(),
+          ),
+          const VerticalDivider(thickness: 0.3, width: 0.3),
+          Expanded(child: child ?? const EmptyPagePlaceholder()),
+        ],
+      ),
+    );
+  }
+}
+
+class ChatList extends StatefulWidget {
+  const ChatList({super.key});
+
+  @override
+  State<ChatList> createState() => _ChatListState();
+}
+
+class _ChatListState extends State<ChatList> {
+  List<Channel> _normalChannels = List.empty();
+  List<Channel> _directChannels = List.empty();
+  final Map<String, List<Channel>> _realmChannels = {};
+
+  late final ChannelProvider _channels = Get.find();
+
+  List<Channel> _sortChannels(List<Channel> channels) {
+    channels.sort(
+      (a, b) =>
+          _lastMessages?[b.id]?.createdAt.compareTo(
+                _lastMessages?[a.id]?.createdAt ??
+                    DateTime.fromMillisecondsSinceEpoch(0),
+              ) ??
+          0,
+    );
+    return channels;
+  }
+
+  Future<void> _loadNormalChannels() async {
+    final resp = await _channels.listAvailableChannel(isDirect: false);
+    setState(() {
+      _normalChannels = _sortChannels(resp);
+    });
+  }
+
+  Future<void> _loadDirectChannels() async {
+    final resp = await _channels.listAvailableChannel(isDirect: true);
+    setState(() {
+      _directChannels = _sortChannels(resp);
+    });
+  }
+
+  Future<void> _loadRealmChannels(String realm) async {
+    final resp = await _channels.listAvailableChannel(scope: realm);
+    setState(() {
+      _realmChannels[realm] = _sortChannels(List.from(resp));
+    });
+  }
+
+  Future<void> _loadAllChannels() async {
+    final RealmProvider realms = Get.find();
+    Future.wait([
+      _loadNormalChannels(),
+      _loadDirectChannels(),
+      ...realms.availableRealms.map((x) => _loadRealmChannels(x.alias)),
+    ]);
+  }
+
+  Map<int, LocalMessageEventTableData>? _lastMessages;
+
+  Future<void> _loadLastMessages() async {
+    final ctrl = ChatEventController();
+    await ctrl.initialize();
+    final messages = await ctrl.src.getLastInAllChannels();
+    setState(() {
+      _lastMessages = messages
+          .map((k, v) => MapEntry(k, v.firstOrNull))
+          .cast<int, LocalMessageEventTableData>();
+    });
+  }

  @override
  void initState() {
    super.initState();
-    try {
-      _channels = Get.find();
-      _channels.refreshAvailableChannel();
-    } catch (e) {
-      context.showErrorDialog(e);
-    }
+    _loadLastMessages().then((_) {
+      _loadAllChannels();
+    });
  }

  @override
  Widget build(BuildContext context) {
    final AuthProvider auth = Get.find();
+    final RealmProvider realms = Get.find();

-    return Material(
-      color: Theme.of(context).colorScheme.surface,
-      child: Scaffold(
-        appBar: AppBar(
-          leading: AppBarLeadingButton.adaptive(context),
-          title: AppBarTitle('chat'.tr),
-          centerTitle: true,
-          toolbarHeight: AppTheme.toolbarHeight(context),
-          actions: [
-            const BackgroundStateWidget(),
-            const NotificationButton(),
-            PopupMenuButton(
-              icon: const Icon(Icons.add_circle),
-              itemBuilder: (BuildContext context) => [
-                PopupMenuItem(
-                  child: ListTile(
-                    title: Text('channelOrganizeCommon'.tr),
-                    leading: const Icon(Icons.tag),
-                    contentPadding: const EdgeInsets.symmetric(horizontal: 8),
-                  ),
-                  onTap: () {
-                    AppRouter.instance.pushNamed('channelOrganizing').then(
-                      (value) {
-                        if (value != null) {
-                          _channels.refreshAvailableChannel();
-                        }
+    return Obx(
+      () => DefaultTabController(
+        length: 2 + realms.availableRealms.length,
+        child: RootContainer(
+          child: Scaffold(
+            appBar: AppBar(
+              leading: Obx(() {
+                final adaptive = AppBarLeadingButton.adaptive(context);
+                if (adaptive != null) return adaptive;
+                if (_channels.isLoading.value) {
+                  return const CircularProgressIndicator(
+                    strokeWidth: 3,
+                  ).paddingAll(18);
+                }
+                return const SizedBox.shrink();
+              }),
+              title: AppBarTitle('chat'.tr),
+              centerTitle: true,
+              toolbarHeight: AppTheme.toolbarHeight(context),
+              actions: [
+                const BackgroundStateWidget(),
+                const NotificationButton(),
+                PopupMenuButton(
+                  icon: const Icon(Icons.add_circle),
+                  itemBuilder: (BuildContext context) => [
+                    PopupMenuItem(
+                      child: ListTile(
+                        title: Text('channelOrganizeCommon'.tr),
+                        leading: const Icon(Icons.tag),
+                        contentPadding:
+                            const EdgeInsets.symmetric(horizontal: 8),
+                      ),
+                      onTap: () {
+                        AppRouter.instance.pushNamed('channelOrganizing').then(
+                          (value) {
+                            if (value != null) {
+                              _loadAllChannels();
+                            }
+                          },
+                        );
                      },
-                    );
-                  },
-                ),
-                PopupMenuItem(
-                  child: ListTile(
-                    title: Text('channelOrganizeDirect'.tr),
-                    leading: const FaIcon(
-                      FontAwesomeIcons.userGroup,
-                      size: 16,
                    ),
-                    contentPadding: const EdgeInsets.symmetric(horizontal: 8),
-                  ),
-                  onTap: () {
-                    final ChannelProvider channels = Get.find();
-                    channels
-                        .createDirectChannel(context, 'global')
-                        .then((resp) {
-                      if (resp != null) {
-                        _channels.refreshAvailableChannel();
-                      }
-                    }).catchError((e) {
-                      context.showErrorDialog(e);
-                    });
-                  },
+                    PopupMenuItem(
+                      child: ListTile(
+                        title: Text('channelOrganizeDirect'.tr),
+                        leading: const FaIcon(
+                          FontAwesomeIcons.userGroup,
+                          size: 16,
+                        ),
+                        contentPadding:
+                            const EdgeInsets.symmetric(horizontal: 8),
+                      ),
+                      onTap: () {
+                        final ChannelProvider channels = Get.find();
+                        channels
+                            .createDirectChannel(context, 'global')
+                            .then((resp) {
+                          if (resp != null) {
+                            _loadAllChannels();
+                          }
+                        }).catchError((e) {
+                          context.showErrorDialog(e);
+                        });
+                      },
+                    ),
+                  ],
+                ),
+                SizedBox(
+                  width: AppTheme.isLargeScreen(context) ? 8 : 16,
                ),
              ],
-            ),
-            SizedBox(
-              width: AppTheme.isLargeScreen(context) ? 8 : 16,
-            ),
-          ],
-        ),
-        body: Obx(() {
-          if (auth.isAuthorized.isFalse) {
-            return SigninRequiredOverlay(
-              onDone: () => _channels.refreshAvailableChannel(),
-            );
-          }
-
-          final selfId = auth.userProfile.value!['id'];
-
-          return Column(
-            children: [
-              Obx(() {
-                if (_channels.isLoading.isFalse) {
-                  return const SizedBox.shrink();
-                } else {
-                  return const LinearProgressIndicator();
-                }
-              }),
-              const ChatCallCurrentIndicator(),
-              Expanded(
-                child: CenteredContainer(
-                  child: RefreshIndicator(
-                    onRefresh: _channels.refreshAvailableChannel,
-                    child: Obx(
-                      () => ChannelListWidget(
-                        noCategory: true,
-                        channels: _channels.directChannels,
-                        selfId: selfId,
-                        useReplace: true,
-                      ),
+              bottom: TabBar(
+                isScrollable: true,
+                dividerHeight: 0.3,
+                tabAlignment: TabAlignment.startOffset,
+                tabs: [
+                  Tab(
+                    child: Row(
+                      mainAxisSize: MainAxisSize.min,
+                      children: [
+                        CircleAvatar(
+                          radius: 14,
+                          backgroundColor:
+                              Theme.of(context).colorScheme.primary,
+                          child: const Icon(
+                            Icons.forum,
+                            size: 16,
+                            color: Colors.white,
+                          ),
+                        ),
+                        const Gap(8),
+                        Text('all'.tr),
+                      ],
                    ),
                  ),
-                ),
+                  Tab(
+                    child: Row(
+                      mainAxisSize: MainAxisSize.min,
+                      children: [
+                        const CircleAvatar(
+                          radius: 14,
+                          child: Icon(
+                            Icons.chat_bubble,
+                            size: 16,
+                          ),
+                        ),
+                        const Gap(8),
+                        Text('channelTypeDirect'.tr),
+                      ],
+                    ),
+                  ),
+                  ...realms.availableRealms.map((x) => Tab(
+                        child: Row(
+                          mainAxisSize: MainAxisSize.min,
+                          children: [
+                            AccountAvatar(
+                              content: x.avatar,
+                              radius: 14,
+                              fallbackWidget: const Icon(
+                                Icons.workspaces,
+                                size: 16,
+                              ),
+                            ),
+                            const Gap(8),
+                            Text(x.name),
+                          ],
+                        ),
+                      )),
+                ],
              ),
-            ],
-          );
-        }),
+            ),
+            body: Obx(() {
+              if (auth.isAuthorized.isFalse) {
+                return SigninRequiredOverlay(
+                  onDone: () => _loadAllChannels(),
+                );
+              }
+
+              final selfId = auth.userProfile.value!['id'];
+
+              return Column(
+                children: [
+                  const ChatCallCurrentIndicator(),
+                  Expanded(
+                    child: TabBarView(
+                      children: [
+                        RefreshIndicator(
+                          onRefresh: _loadNormalChannels,
+                          child: ChannelListWidget(
+                            channels: _sortChannels([
+                              ..._normalChannels,
+                              ..._directChannels,
+                              ..._realmChannels.values.expand((x) => x),
+                            ]),
+                            selfId: selfId,
+                            useReplace: AppTheme.isLargeScreen(context),
+                          ),
+                        ),
+                        RefreshIndicator(
+                          onRefresh: _loadDirectChannels,
+                          child: ChannelListWidget(
+                            channels: _directChannels,
+                            selfId: selfId,
+                            useReplace: AppTheme.isLargeScreen(context),
+                          ),
+                        ),
+                        ...realms.availableRealms.map(
+                          (x) => RefreshIndicator(
+                            onRefresh: () => _loadRealmChannels(x.alias),
+                            child: ChannelListWidget(
+                              channels: _realmChannels[x.alias] ?? [],
+                              selfId: selfId,
+                              useReplace: AppTheme.isLargeScreen(context),
+                            ),
+                          ),
+                        ),
+                      ],
+                    ),
+                  ),
+                ],
+              );
+            }),
+          ),
+        ),
      ),
    );
  }
--- a/lib/screens/dashboard.dart
+++ b/lib/screens/dashboard.dart
@ -88,7 +88,7 @@ class _DashboardScreenState extends State<DashboardScreen> {
  Future<void> _pullDaily() async {
    try {
      _signRecord = await _dailySign.getToday();
-      _dailySign.listLastRecord(30).then((value) {
+      _dailySign.listLastRecord(14).then((value) {
        setState(() => _signRecordHistory = value);
      });
    } catch (e) {
@ -103,7 +103,7 @@ class _DashboardScreenState extends State<DashboardScreen> {

    try {
      _signRecord = await _dailySign.signToday();
-      _dailySign.listLastRecord(30).then((value) {
+      _dailySign.listLastRecord(14).then((value) {
        setState(() => _signRecordHistory = value);
      });
    } catch (e) {
@ -354,7 +354,7 @@ class _DashboardScreenState extends State<DashboardScreen> {
                    IconButton(
                      icon: const Icon(Icons.arrow_forward),
                      onPressed: () {
-                        AppRouter.instance.goNamed('feed');
+                        AppRouter.instance.goNamed('explore');
                      },
                    ),
                  ],
@ -379,6 +379,7 @@ class _DashboardScreenState extends State<DashboardScreen> {
                                isClickable: true,
                                isShowEmbed: true,
                                isNestedClickable: true,
+                                showFeaturedReply: true,
                                onUpdate: (_) {
                                  _pullPosts();
                                },
--- a/lib/screens/explore.dart
+++ b/lib/screens/explore.dart
@ -10,20 +10,21 @@ import 'package:solian/router.dart';
 import 'package:solian/screens/account/notification.dart';
 import 'package:solian/theme.dart';
 import 'package:solian/widgets/account/signin_required_overlay.dart';
-import 'package:solian/widgets/app_bar_title.dart';
 import 'package:solian/widgets/current_state_action.dart';
 import 'package:solian/widgets/app_bar_leading.dart';
+import 'package:solian/widgets/navigation/realm_switcher.dart';
 import 'package:solian/widgets/posts/post_shuffle_swiper.dart';
 import 'package:solian/widgets/posts/post_warped_list.dart';
+import 'package:solian/widgets/root_container.dart';

-class FeedScreen extends StatefulWidget {
-  const FeedScreen({super.key});
+class ExploreScreen extends StatefulWidget {
+  const ExploreScreen({super.key});

  @override
-  State<FeedScreen> createState() => _FeedScreenState();
+  State<ExploreScreen> createState() => _ExploreScreenState();
 }

-class _FeedScreenState extends State<FeedScreen>
+class _ExploreScreenState extends State<ExploreScreen>
    with SingleTickerProviderStateMixin {
  late final PostListController _postController;
  late final TabController _tabController;
@ -55,10 +56,8 @@ class _FeedScreenState extends State<FeedScreen>
  @override
  Widget build(BuildContext context) {
    final AuthProvider auth = Get.find();
-    final NavigationStateProvider navState = Get.find();

-    return Material(
-      color: Theme.of(context).colorScheme.surface,
+    return RootContainer(
      child: Scaffold(
        floatingActionButton: FloatingActionButton(
          child: const Icon(Icons.add),
@ -82,8 +81,14 @@ class _FeedScreenState extends State<FeedScreen>
          headerSliverBuilder: (BuildContext context, bool innerBoxIsScrolled) {
            return [
              SliverAppBar(
-                title: AppBarTitle('feed'.tr),
-                centerTitle: false,
+                flexibleSpace: SizedBox(
+                  height: 48,
+                  child: const Row(
+                    children: [
+                      RealmSwitcher(),
+                    ],
+                  ).paddingSymmetric(horizontal: 8),
+                ).paddingOnly(top: MediaQuery.of(context).padding.top),
                floating: true,
                toolbarHeight: AppTheme.toolbarHeight(context),
                leading: AppBarLeadingButton.adaptive(context),
@ -96,10 +101,39 @@ class _FeedScreenState extends State<FeedScreen>
                ],
                bottom: TabBar(
                  controller: _tabController,
+                  dividerHeight: 0.3,
+                  tabAlignment: TabAlignment.fill,
                  tabs: [
-                    Tab(text: 'postListNews'.tr),
-                    Tab(text: 'postListFriends'.tr),
-                    Tab(text: 'postListShuffle'.tr),
+                    Tab(
+                      child: Row(
+                        mainAxisSize: MainAxisSize.min,
+                        children: [
+                          const Icon(Icons.feed, size: 20),
+                          const Gap(8),
+                          Text('postListNews'.tr),
+                        ],
+                      ),
+                    ),
+                    Tab(
+                      child: Row(
+                        mainAxisSize: MainAxisSize.min,
+                        children: [
+                          const Icon(Icons.people, size: 20),
+                          const Gap(8),
+                          Text('postListFriends'.tr),
+                        ],
+                      ),
+                    ),
+                    Tab(
+                      child: Row(
+                        mainAxisSize: MainAxisSize.min,
+                        children: [
+                          const Icon(Icons.shuffle_on_outlined, size: 20),
+                          const Gap(8),
+                          Text('postListShuffle'.tr),
+                        ],
+                      ),
+                    ),
                  ],
                ),
              )
@ -114,16 +148,6 @@ class _FeedScreenState extends State<FeedScreen>

            return Column(
              children: [
-                if (navState.focusedRealm.value != null)
-                  MaterialBanner(
-                    leading: const Icon(Icons.layers),
-                    content: Text(
-                      'postBrowsingIn'.trParams({
-                        'region': '#${navState.focusedRealm.value!.alias}',
-                      }),
-                    ),
-                    actions: const [SizedBox.shrink()],
-                  ),
                Expanded(
                  child: TabBarView(
                    physics: const NeverScrollableScrollPhysics(),
--- a/lib/screens/feed/draft_box.dart
+++ b/lib/screens/feed/draft_box.dart
@ -9,6 +9,7 @@ import 'package:solian/widgets/app_bar_leading.dart';
 import 'package:solian/widgets/app_bar_title.dart';
 import 'package:solian/widgets/posts/post_action.dart';
 import 'package:solian/widgets/posts/post_owned_list.dart';
+import 'package:solian/widgets/root_container.dart';

 class DraftBoxScreen extends StatefulWidget {
  const DraftBoxScreen({super.key});
@ -54,8 +55,7 @@ class _DraftBoxScreenState extends State<DraftBoxScreen> {

  @override
  Widget build(BuildContext context) {
-    return Material(
-      color: Theme.of(context).colorScheme.surface,
+    return RootContainer(
      child: Scaffold(
        appBar: AppBar(
          leading: AppBarLeadingButton.adaptive(context),
--- a/lib/screens/feed/search.dart
+++ b/lib/screens/feed/search.dart
@ -63,13 +63,13 @@ class _FeedSearchScreenState extends State<FeedSearchScreen> {
              ListTile(
                leading: const Icon(Icons.label),
                tileColor: Theme.of(context).colorScheme.surfaceContainer,
-                title: Text('feedSearchWithTag'.trParams({'key': widget.tag!})),
+                title: Text('postSearchWithTag'.trParams({'key': widget.tag!})),
              ),
            if (widget.category != null)
              ListTile(
                leading: const Icon(Icons.category),
                tileColor: Theme.of(context).colorScheme.surfaceContainer,
-                title: Text('feedSearchWithCategory'
+                title: Text('postSearchWithCategory'
                    .trParams({'key': widget.category!})),
              ),
            Expanded(
--- a/lib/screens/posts/post_detail.dart
+++ b/lib/screens/posts/post_detail.dart
@ -3,8 +3,10 @@ import 'package:get/get.dart';
 import 'package:solian/exts.dart';
 import 'package:solian/models/post.dart';
 import 'package:solian/providers/content/posts.dart';
+import 'package:solian/providers/last_read.dart';
 import 'package:solian/widgets/posts/post_item.dart';
 import 'package:solian/widgets/posts/post_replies.dart';
+import 'package:solian/widgets/root_container.dart';

 class PostDetailScreen extends StatefulWidget {
  final String id;
@ -26,6 +28,7 @@ class _PostDetailScreenState extends State<PostDetailScreen> {
  Future<Post?> getDetail() async {
    if (widget.post != null) {
      item = widget.post;
+      Get.find<LastReadProvider>().feedLastReadAt = item?.id;
      return widget.post;
    }

@ -38,13 +41,14 @@ class _PostDetailScreenState extends State<PostDetailScreen> {
      context.showErrorDialog(e).then((_) => Navigator.pop(context));
    }

+    Get.find<LastReadProvider>().feedLastReadAt = item?.id;
+
    return item;
  }

  @override
  Widget build(BuildContext context) {
-    return Material(
-      color: Theme.of(context).colorScheme.surface,
+    return RootContainer(
      child: FutureBuilder(
        future: getDetail(),
        builder: (context, snapshot) {
--- a/lib/screens/posts/post_editor.dart
+++ b/lib/screens/posts/post_editor.dart
@ -19,6 +19,7 @@ import 'package:solian/widgets/app_bar_title.dart';
 import 'package:solian/widgets/markdown_text_content.dart';
 import 'package:solian/widgets/posts/post_item.dart';
 import 'package:badges/badges.dart' as badges;
+import 'package:solian/widgets/root_container.dart';

 class PostPublishArguments {
  final Post? edit;
@ -151,8 +152,7 @@ class _PostPublishScreenState extends State<PostPublishScreen> {
      )
    ];

-    return Material(
-      color: Theme.of(context).colorScheme.surface,
+    return RootContainer(
      child: Scaffold(
        appBar: AppBar(
          leading: AppBarLeadingButton.adaptive(context),
@ -183,18 +183,18 @@ class _PostPublishScreenState extends State<PostPublishScreen> {
          children: [
            ListTile(
              tileColor: Theme.of(context).colorScheme.surfaceContainerLow,
-              title: Row(
+              title: Column(
+                crossAxisAlignment: CrossAxisAlignment.start,
                children: [
                  Text(
                    _editorController.title ?? 'title'.tr,
                    maxLines: 1,
                    overflow: TextOverflow.ellipsis,
                  ),
-                  const Gap(6),
                  if (_editorController.aliasController.text.isNotEmpty)
                    Badge(
                      label: Text('#${_editorController.aliasController.text}'),
-                    ),
+                    ).paddingOnly(bottom: 2),
                ],
              ),
              subtitle: Text(
@ -376,6 +376,7 @@ class _PostPublishScreenState extends State<PostPublishScreen> {
                    Expanded(
                      child: SingleChildScrollView(
                        child: MarkdownTextContent(
+                          isAutoWarp: _editorController.mode.value == 0,
                          content: _editorController.contentController.text,
                          parentId: 'post-editor-preview',
                        ).paddingOnly(top: 12, right: 16),
--- a/lib/screens/realms.dart
+++ b/lib/screens/realms.dart
@ -7,11 +7,15 @@ import 'package:solian/providers/auth.dart';
 import 'package:solian/providers/content/realm.dart';
 import 'package:solian/router.dart';
 import 'package:solian/screens/account/notification.dart';
+import 'package:solian/services.dart';
 import 'package:solian/theme.dart';
+import 'package:solian/widgets/account/account_avatar.dart';
 import 'package:solian/widgets/account/signin_required_overlay.dart';
 import 'package:solian/widgets/app_bar_leading.dart';
 import 'package:solian/widgets/app_bar_title.dart';
+import 'package:solian/widgets/auto_cache_image.dart';
 import 'package:solian/widgets/current_state_action.dart';
+import 'package:solian/widgets/root_container.dart';
 import 'package:solian/widgets/sized_container.dart';

 class RealmListScreen extends StatefulWidget {
@ -55,8 +59,7 @@ class _RealmListScreenState extends State<RealmListScreen> {
  Widget build(BuildContext context) {
    final AuthProvider auth = Get.find();

-    return Material(
-      color: Theme.of(context).colorScheme.surface,
+    return RootContainer(
      child: Scaffold(
        appBar: AppBar(
          leading: AppBarLeadingButton.adaptive(context),
@ -128,19 +131,34 @@ class _RealmListScreenState extends State<RealmListScreen> {
                  children: [
                    Container(
                      color: Theme.of(context).colorScheme.surfaceContainer,
+                      child: (element.banner?.isEmpty ?? true)
+                          ? const SizedBox.shrink()
+                          : AutoCacheImage(
+                              ServiceFinder.buildUrl(
+                                'uc',
+                                '/attachments/${element.banner}',
+                              ),
+                              fit: BoxFit.cover,
+                            ),
                    ),
-                    const Positioned(
+                    Positioned(
                      bottom: -30,
                      left: 18,
-                      child: CircleAvatar(
-                        radius: 24,
-                        backgroundColor: Colors.indigo,
-                        child: FaIcon(
-                          FontAwesomeIcons.globe,
-                          color: Colors.white,
-                          size: 18,
-                        ),
-                      ),
+                      child: (element.avatar?.isEmpty ?? true)
+                          ? CircleAvatar(
+                              radius: 24,
+                              backgroundColor:
+                                  Theme.of(context).colorScheme.primary,
+                              child: const FaIcon(
+                                FontAwesomeIcons.globe,
+                                color: Colors.white,
+                                size: 18,
+                              ),
+                            )
+                          : AccountAvatar(
+                              content: element.avatar!,
+                              bgColor: Theme.of(context).colorScheme.primary,
+                            ),
                    ),
                  ],
                ),
--- a/lib/screens/realms/realm_detail.dart
+++ b/lib/screens/realms/realm_detail.dart
@ -7,6 +7,7 @@ import 'package:solian/router.dart';
 import 'package:solian/screens/realms/realm_organize.dart';
 import 'package:solian/widgets/realms/realm_deletion.dart';
 import 'package:solian/widgets/realms/realm_member.dart';
+import 'package:solian/widgets/root_container.dart';

 class RealmDetailScreen extends StatefulWidget {
  final String alias;
@ -69,7 +70,8 @@ class _RealmDetailScreenState extends State<RealmDetailScreen> {
      ListTile(
        leading: const Icon(Icons.settings),
        trailing: const Icon(Icons.chevron_right),
-        title: Text('realmSettings'.tr.capitalize!),
+        title: Text('realmSettings'.tr),
+        contentPadding: const EdgeInsets.symmetric(horizontal: 24),
        onTap: () async {
          AppRouter.instance
              .pushNamed(
@ -85,59 +87,63 @@ class _RealmDetailScreenState extends State<RealmDetailScreen> {
      ),
    ];

-    return Column(
-      children: [
-        Padding(
-          padding: const EdgeInsets.symmetric(horizontal: 16, vertical: 12),
-          child: Row(
-            children: [
-              const CircleAvatar(
-                radius: 28,
-                backgroundColor: Colors.teal,
-                child: Icon(Icons.group, color: Colors.white),
-              ),
-              const Gap(16),
-              Expanded(
-                child: Column(
-                  crossAxisAlignment: CrossAxisAlignment.start,
-                  children: [
-                    Text(widget.realm.name,
-                        style: Theme.of(context).textTheme.bodyLarge),
-                    Text(widget.realm.description,
-                        style: Theme.of(context).textTheme.bodySmall),
-                    Text(
-                      '#${widget.realm.id.toString().padLeft(8, '0')} · ${widget.realm.alias}',
-                      style: const TextStyle(fontSize: 11),
-                    ),
-                  ],
+    return RootContainer(
+      child: Column(
+        children: [
+          Padding(
+            padding: const EdgeInsets.symmetric(horizontal: 16, vertical: 12),
+            child: Row(
+              children: [
+                const CircleAvatar(
+                  radius: 28,
+                  backgroundColor: Colors.teal,
+                  child: Icon(Icons.group, color: Colors.white),
                ),
-              )
-            ],
+                const Gap(16),
+                Expanded(
+                  child: Column(
+                    crossAxisAlignment: CrossAxisAlignment.start,
+                    children: [
+                      Text(widget.realm.name,
+                          style: Theme.of(context).textTheme.bodyLarge),
+                      Text(widget.realm.description,
+                          style: Theme.of(context).textTheme.bodySmall),
+                      Text(
+                        '#${widget.realm.id.toString().padLeft(8, '0')} · ${widget.realm.alias}',
+                        style: const TextStyle(fontSize: 11),
+                      ),
+                    ],
+                  ),
+                )
+              ],
+            ),
          ),
-        ),
-        const Divider(thickness: 0.3),
-        Expanded(
-          child: ListView(
-            children: [
-              ListTile(
-                leading: const Icon(Icons.supervisor_account),
-                trailing: const Icon(Icons.chevron_right),
-                title: Text('realmMembers'.tr.capitalize!),
-                onTap: () => showMemberList(),
-              ),
-              ...(_isOwned ? ownerActions : List.empty()),
-              const Divider(thickness: 0.3),
-              ListTile(
-                leading: _isOwned
-                    ? const Icon(Icons.delete)
-                    : const Icon(Icons.exit_to_app),
-                title: Text(_isOwned ? 'delete'.tr : 'leave'.tr),
-                onTap: () => promptLeaveChannel(),
-              ),
-            ],
+          const Divider(thickness: 0.3),
+          Expanded(
+            child: ListView(
+              children: [
+                ListTile(
+                  contentPadding: const EdgeInsets.symmetric(horizontal: 24),
+                  leading: const Icon(Icons.supervisor_account),
+                  trailing: const Icon(Icons.chevron_right),
+                  title: Text('realmMembers'.tr),
+                  onTap: () => showMemberList(),
+                ),
+                ...(_isOwned ? ownerActions : List.empty()),
+                const Divider(thickness: 0.3),
+                ListTile(
+                  contentPadding: const EdgeInsets.symmetric(horizontal: 24),
+                  leading: _isOwned
+                      ? const Icon(Icons.delete)
+                      : const Icon(Icons.exit_to_app),
+                  title: Text(_isOwned ? 'delete'.tr : 'leave'.tr),
+                  onTap: () => promptLeaveChannel(),
+                ),
+              ],
+            ),
          ),
-        ),
-      ],
+        ],
+      ),
    );
  }
 }
--- a/lib/screens/realms/realm_organize.dart
+++ b/lib/screens/realms/realm_organize.dart
@ -1,13 +1,19 @@
 import 'package:flutter/material.dart';
 import 'package:flutter_animate/flutter_animate.dart';
 import 'package:get/get.dart';
+import 'package:image_cropper/image_cropper.dart';
+import 'package:image_picker/image_picker.dart';
 import 'package:solian/exts.dart';
+import 'package:solian/models/attachment.dart';
 import 'package:solian/models/realm.dart';
+import 'package:solian/platform.dart';
 import 'package:solian/providers/auth.dart';
+import 'package:solian/providers/content/attachment.dart';
 import 'package:solian/router.dart';
 import 'package:solian/theme.dart';
 import 'package:solian/widgets/app_bar_leading.dart';
 import 'package:solian/widgets/app_bar_title.dart';
+import 'package:solian/widgets/root_container.dart';
 import 'package:uuid/uuid.dart';

 class RealmOrganizeArguments {
@ -29,17 +35,19 @@ class _RealmOrganizeScreenState extends State<RealmOrganizeScreen> {
  bool _isBusy = false;

  final _aliasController = TextEditingController();
+  final _avatarController = TextEditingController();
+  final _bannerController = TextEditingController();
  final _nameController = TextEditingController();
  final _descriptionController = TextEditingController();

  bool _isCommunity = false;
  bool _isPublic = false;

-  void applyRealm() async {
+  void _applyRealm() async {
    final AuthProvider auth = Get.find();
    if (auth.isAuthorized.isFalse) return;

-    if (_aliasController.value.text.isEmpty) randomizeAlias();
+    if (_aliasController.value.text.isEmpty) _randomizeAlias();

    setState(() => _isBusy = true);

@ -49,6 +57,8 @@ class _RealmOrganizeScreenState extends State<RealmOrganizeScreen> {
      'alias': _aliasController.value.text.toLowerCase(),
      'name': _nameController.value.text,
      'description': _descriptionController.value.text,
+      'avatar': _avatarController.value.text,
+      'banner': _bannerController.value.text,
      'is_public': _isPublic,
      'is_community': _isCommunity,
    };
@ -68,35 +78,119 @@ class _RealmOrganizeScreenState extends State<RealmOrganizeScreen> {
    setState(() => _isBusy = false);
  }

-  void randomizeAlias() {
+  final _imagePicker = ImagePicker();
+
+  Future<void> _editImage(String position) async {
+    final AuthProvider auth = Get.find();
+    if (auth.isAuthorized.isFalse) return;
+
+    XFile file;
+
+    final image = await _imagePicker.pickImage(source: ImageSource.gallery);
+    if (image == null) return;
+
+    if (PlatformInfo.canCropImage) {
+      CroppedFile? croppedFile = await ImageCropper().cropImage(
+        sourcePath: image.path,
+        uiSettings: [
+          AndroidUiSettings(
+            toolbarTitle: 'cropImage'.tr,
+            toolbarColor: Theme.of(context).colorScheme.primary,
+            toolbarWidgetColor: Theme.of(context).colorScheme.onPrimary,
+            aspectRatioPresets: [
+              if (position == 'avatar') CropAspectRatioPreset.square,
+              if (position == 'banner') _BannerCropAspectRatioPreset(),
+            ],
+          ),
+          IOSUiSettings(
+            title: 'cropImage'.tr,
+            aspectRatioPresets: [
+              if (position == 'avatar') CropAspectRatioPreset.square,
+              if (position == 'banner') _BannerCropAspectRatioPreset(),
+            ],
+          ),
+          WebUiSettings(
+            context: context,
+          ),
+        ],
+      );
+
+      if (croppedFile == null) return;
+      file = XFile(croppedFile.path);
+    } else {
+      file = XFile(image.path);
+    }
+
+    setState(() => _isBusy = true);
+
+    final AttachmentProvider attach = Get.find();
+
+    Attachment? attachResult;
+    try {
+      attachResult = await attach.createAttachmentDirectly(
+        await file.readAsBytes(),
+        file.path,
+        'avatar',
+        null,
+      );
+    } catch (e) {
+      setState(() => _isBusy = false);
+      context.showErrorDialog(e);
+      return;
+    }
+
+    switch (position) {
+      case 'avatar':
+        _avatarController.text = attachResult.rid;
+        break;
+      case 'banner':
+        _bannerController.text = attachResult.rid;
+        break;
+    }
+
+    setState(() => _isBusy = false);
+  }
+
+  void _randomizeAlias() {
    _aliasController.text =
        const Uuid().v4().replaceAll('-', '').substring(0, 12);
  }

-  void syncWidget() {
+  void _syncWidget() {
    if (widget.edit != null) {
      _aliasController.text = widget.edit!.alias;
      _nameController.text = widget.edit!.name;
      _descriptionController.text = widget.edit!.description;
+      _avatarController.text = widget.edit!.avatar ?? '';
+      _bannerController.text = widget.edit!.banner ?? '';
      _isPublic = widget.edit!.isPublic;
      _isCommunity = widget.edit!.isCommunity;
    }
  }

-  void cancelAction() {
+  void _cancelAction() {
    AppRouter.instance.pop();
  }

  @override
  void initState() {
-    syncWidget();
+    _syncWidget();
    super.initState();
  }

+  @override
+  void dispose() {
+    _aliasController.dispose();
+    _avatarController.dispose();
+    _bannerController.dispose();
+    _nameController.dispose();
+    _descriptionController.dispose();
+    super.dispose();
+  }
+
  @override
  Widget build(BuildContext context) {
-    return Material(
-      color: Theme.of(context).colorScheme.surface,
+    return RootContainer(
      child: Scaffold(
        appBar: AppBar(
          leading: AppBarLeadingButton.adaptive(context),
@ -105,7 +199,7 @@ class _RealmOrganizeScreenState extends State<RealmOrganizeScreen> {
          toolbarHeight: AppTheme.toolbarHeight(context),
          actions: [
            TextButton(
-              onPressed: _isBusy ? null : () => applyRealm(),
+              onPressed: _isBusy ? null : () => _applyRealm(),
              child: Text('apply'.tr.toUpperCase()),
            )
          ],
@ -126,7 +220,7 @@ class _RealmOrganizeScreenState extends State<RealmOrganizeScreen> {
                  ),
                  actions: [
                    TextButton(
-                      onPressed: cancelAction,
+                      onPressed: _cancelAction,
                      child: Text('cancel'.tr),
                    ),
                  ],
@ -150,7 +244,7 @@ class _RealmOrganizeScreenState extends State<RealmOrganizeScreen> {
                      visualDensity:
                          const VisualDensity(horizontal: -2, vertical: -2),
                    ),
-                    onPressed: () => randomizeAlias(),
+                    onPressed: () => _randomizeAlias(),
                    child: const Icon(Icons.refresh),
                  )
                ],
@ -166,6 +260,55 @@ class _RealmOrganizeScreenState extends State<RealmOrganizeScreen> {
                    FocusManager.instance.primaryFocus?.unfocus(),
              ).paddingSymmetric(horizontal: 16, vertical: 8),
              const Divider(thickness: 0.3),
+              Row(
+                children: [
+                  Expanded(
+                    child: TextField(
+                      autofocus: true,
+                      controller: _avatarController,
+                      decoration: InputDecoration.collapsed(
+                        hintText: 'realmAvatar'.tr,
+                      ),
+                      onTapOutside: (_) =>
+                          FocusManager.instance.primaryFocus?.unfocus(),
+                    ),
+                  ),
+                  TextButton(
+                    style: TextButton.styleFrom(
+                      shape: const CircleBorder(),
+                      visualDensity:
+                          const VisualDensity(horizontal: -2, vertical: -2),
+                    ),
+                    onPressed: _isBusy ? null : () => _editImage('avatar'),
+                    child: const Icon(Icons.upload),
+                  )
+                ],
+              ).paddingSymmetric(horizontal: 16, vertical: 2),
+              Row(
+                children: [
+                  Expanded(
+                    child: TextField(
+                      autofocus: true,
+                      controller: _bannerController,
+                      decoration: InputDecoration.collapsed(
+                        hintText: 'realmBanner'.tr,
+                      ),
+                      onTapOutside: (_) =>
+                          FocusManager.instance.primaryFocus?.unfocus(),
+                    ),
+                  ),
+                  TextButton(
+                    style: TextButton.styleFrom(
+                      shape: const CircleBorder(),
+                      visualDensity:
+                          const VisualDensity(horizontal: -2, vertical: -2),
+                    ),
+                    onPressed: _isBusy ? null : () => _editImage('banner'),
+                    child: const Icon(Icons.upload),
+                  )
+                ],
+              ).paddingSymmetric(horizontal: 16, vertical: 2),
+              const Divider(thickness: 0.3),
              Expanded(
                child: TextField(
                  minLines: 5,
@ -202,3 +345,11 @@ class _RealmOrganizeScreenState extends State<RealmOrganizeScreen> {
    );
  }
 }
+
+class _BannerCropAspectRatioPreset extends CropAspectRatioPresetData {
+  @override
+  (int, int)? get data => (16, 7);
+
+  @override
+  String get name => '16x7';
+}
--- a/lib/screens/realms/realm_view.dart
+++ b/lib/screens/realms/realm_view.dart
@ -16,6 +16,7 @@ import 'package:solian/theme.dart';
 import 'package:solian/widgets/app_bar_leading.dart';
 import 'package:solian/widgets/channel/channel_list.dart';
 import 'package:solian/widgets/posts/post_list.dart';
+import 'package:solian/widgets/root_container.dart';

 class RealmViewScreen extends StatefulWidget {
  final String alias;
@ -34,7 +35,7 @@ class _RealmViewScreenState extends State<RealmViewScreen> {
  final List<Channel> _channels = List.empty(growable: true);

  getRealm({String? overrideAlias}) async {
-    final RealmProvider provider = Get.find();
+    final RealmProvider realm = Get.find();

    setState(() => _isBusy = true);

@ -43,7 +44,7 @@ class _RealmViewScreenState extends State<RealmViewScreen> {
    }

    try {
-      final resp = await provider.getRealm(_overrideAlias ?? widget.alias);
+      final resp = await realm.getRealm(_overrideAlias ?? widget.alias);
      setState(() => _realm = Realm.fromJson(resp.body));
    } catch (e) {
      context.showErrorDialog(e);
@ -55,14 +56,21 @@ class _RealmViewScreenState extends State<RealmViewScreen> {
  getChannels() async {
    setState(() => _isBusy = true);

-    final ChannelProvider provider = Get.find();
-    final resp = await provider.listChannel(scope: _realm!.alias);
+    final ChannelProvider channel = Get.find();
+    final resp = await channel.listChannel(scope: _realm!.alias);
+    final availableResp = await channel.listAvailableChannel(
+      scope: _realm!.alias,
+    );
+
+    final Set<int> channelIdx = {};

    setState(() {
      _channels.clear();
      _channels.addAll(
        resp.body.map((e) => Channel.fromJson(e)).toList().cast<Channel>(),
      );
+      _channels.addAll(availableResp);
+      _channels.retainWhere((x) => channelIdx.add(x.id));
    });

    setState(() => _isBusy = false);
@ -79,8 +87,7 @@ class _RealmViewScreenState extends State<RealmViewScreen> {

  @override
  Widget build(BuildContext context) {
-    return Material(
-      color: Theme.of(context).colorScheme.surface,
+    return RootContainer(
      child: DefaultTabController(
        length: 2,
        child: NestedScrollView(
@ -248,7 +255,6 @@ class RealmChannelListWidget extends StatelessWidget {
            child: ChannelListWidget(
              channels: channels,
              selfId: auth.userProfile.value!['id'],
-              noCategory: true,
            ),
          )
        ],
--- a/lib/screens/settings.dart
+++ b/lib/screens/settings.dart
@ -1,13 +1,25 @@
+import 'dart:convert';
+import 'dart:io';
+
+import 'package:dropdown_button2/dropdown_button2.dart';
 import 'package:flutter/material.dart';
+import 'package:gap/gap.dart';
 import 'package:get/get.dart';
+import 'package:image_picker/image_picker.dart';
+import 'package:in_app_review/in_app_review.dart';
+import 'package:path_provider/path_provider.dart';
 import 'package:provider/provider.dart';
 import 'package:shared_preferences/shared_preferences.dart';
+import 'package:solian/exceptions/request.dart';
 import 'package:solian/exts.dart';
+import 'package:solian/models/theme.dart';
 import 'package:solian/platform.dart';
+import 'package:solian/providers/auth.dart';
 import 'package:solian/providers/database/database.dart';
 import 'package:solian/providers/theme_switcher.dart';
 import 'package:solian/router.dart';
-import 'package:solian/theme.dart';
+import 'package:solian/widgets/reports/abuse_report.dart';
+import 'package:solian/widgets/root_container.dart';

 class SettingScreen extends StatefulWidget {
  const SettingScreen({super.key});
@ -18,6 +30,7 @@ class SettingScreen extends StatefulWidget {

 class _SettingScreenState extends State<SettingScreen> {
  SharedPreferences? _prefs;
+  String _docBasepath = '/';

  Widget _buildCaptionHeader(String title) {
    return Container(
@ -28,39 +41,38 @@ class _SettingScreenState extends State<SettingScreen> {
    );
  }

-  Widget _buildThemeColorButton(String label, Color color) {
-    return IconButton(
-      icon: Icon(Icons.circle, color: color),
-      tooltip: label,
-      onPressed: () {
-        context.read<ThemeSwitcher>().setTheme(
-              AppTheme.build(
-                Brightness.light,
-                seedColor: color,
-              ),
-              AppTheme.build(
-                Brightness.dark,
-                seedColor: color,
-              ),
-            );
-        _prefs?.setInt('global_theme_color', color.value);
-        context.clearSnackbar();
-        context.showSnackbar('themeColorApplied'.tr);
-      },
-    );
-  }
-
-  static final List<(String, Color)> _presentTheme = [
-    ('themeColorRed', const Color.fromRGBO(154, 98, 91, 1)),
-    ('themeColorBlue', const Color.fromRGBO(103, 96, 193, 1)),
-    ('themeColorMiku', const Color.fromRGBO(56, 120, 126, 1)),
-    ('themeColorKagamine', const Color.fromRGBO(244, 183, 63, 1)),
-    ('themeColorLuka', const Color.fromRGBO(243, 174, 218, 1)),
+  static final List<SolianThemeData> _presentTheme = [
+    SolianThemeData(
+      id: 'themeColorRed',
+      seedColor: const Color.fromRGBO(154, 98, 91, 1),
+    ),
+    SolianThemeData(
+      id: 'themeColorBlue',
+      seedColor: const Color.fromRGBO(103, 96, 193, 1),
+    ),
+    SolianThemeData(
+      id: 'themeColorMiku',
+      seedColor: const Color.fromRGBO(56, 120, 126, 1),
+    ),
+    SolianThemeData(
+      id: 'themeColorKagamine',
+      seedColor: const Color.fromRGBO(244, 183, 63, 1),
+    ),
+    SolianThemeData(
+      id: 'themeColorLuka',
+      seedColor: const Color.fromRGBO(243, 174, 218, 1),
+    ),
  ];

  @override
  void initState() {
    super.initState();
+    getApplicationDocumentsDirectory().then((dir) {
+      _docBasepath = dir.path;
+      if (mounted) {
+        setState(() {});
+      }
+    });
    SharedPreferences.getInstance().then((inst) {
      _prefs = inst;
      if (mounted) {
@ -71,20 +83,101 @@ class _SettingScreenState extends State<SettingScreen> {

  @override
  Widget build(BuildContext context) {
-    return Material(
-      color: Theme.of(context).colorScheme.surface,
+    return RootContainer(
      child: ListView(
        children: [
-          _buildCaptionHeader('themeColor'.tr),
-          SizedBox(
-            height: 56,
-            child: ListView(
-              scrollDirection: Axis.horizontal,
-              children: _presentTheme
-                  .map((x) => _buildThemeColorButton(x.$1, x.$2))
-                  .toList(),
-            ).paddingSymmetric(horizontal: 12, vertical: 8),
+          _buildCaptionHeader('theme'.tr),
+          ListTile(
+            leading: const Icon(Icons.palette),
+            contentPadding: const EdgeInsets.symmetric(horizontal: 22),
+            title: Text('globalTheme'.tr),
+            trailing: DropdownButtonHideUnderline(
+              child: DropdownButton2<SolianThemeData>(
+                isExpanded: true,
+                hint: Text(
+                  'theme'.tr,
+                  style: TextStyle(
+                    fontSize: 14,
+                    color: Theme.of(context).hintColor,
+                  ),
+                ),
+                items: _presentTheme
+                    .map((SolianThemeData item) =>
+                        DropdownMenuItem<SolianThemeData>(
+                          value: item,
+                          child: Row(
+                            crossAxisAlignment: CrossAxisAlignment.center,
+                            children: [
+                              Icon(Icons.circle, color: item.seedColor),
+                              const Gap(8),
+                              Text(
+                                item.id.tr,
+                                style: const TextStyle(
+                                  fontSize: 14,
+                                ),
+                              ),
+                            ],
+                          ),
+                        ))
+                    .toList(),
+                value: (_prefs?.containsKey('global_theme') ?? false)
+                    ? SolianThemeData.fromJson(
+                        jsonDecode(_prefs!.getString('global_theme')!),
+                      )
+                    : null,
+                onChanged: (SolianThemeData? value) {
+                  context.read<ThemeSwitcher>().setThemeData(value);
+                  setState(() {});
+                },
+                buttonStyleData: const ButtonStyleData(
+                  padding: EdgeInsets.symmetric(horizontal: 8),
+                  height: 40,
+                  width: 140,
+                ),
+                menuItemStyleData: const MenuItemStyleData(
+                  height: 40,
+                ),
+              ),
+            ),
          ),
+          CheckboxListTile(
+            secondary: const Icon(Icons.military_tech),
+            contentPadding: const EdgeInsets.symmetric(horizontal: 22),
+            title: Text('agedTheme'.tr),
+            subtitle: Text('agedThemeDesc'.tr),
+            value: _prefs?.getBool('aged_theme') ?? false,
+            onChanged: (value) {
+              if (value != null) {
+                context.read<ThemeSwitcher>().setAgedTheme(value);
+              }
+              setState(() {});
+            },
+          ),
+          if (!PlatformInfo.isWeb)
+            ListTile(
+              leading: const Icon(Icons.wallpaper),
+              contentPadding: const EdgeInsets.only(left: 22, right: 31),
+              title: Text('appBackgroundImage'.tr),
+              subtitle: Text('appBackgroundImageDesc'.tr),
+              trailing: File('$_docBasepath/app_background_image').existsSync()
+                  ? const Icon(Icons.check_box)
+                  : const Icon(Icons.check_box_outline_blank),
+              onTap: () async {
+                if (File('$_docBasepath/app_background_image').existsSync()) {
+                  File('$_docBasepath/app_background_image').deleteSync();
+                } else {
+                  final image = await ImagePicker().pickImage(
+                    source: ImageSource.gallery,
+                  );
+                  if (image == null) return;
+
+                  await File(image.path)
+                      .copy('$_docBasepath/app_background_image');
+                }
+
+                setState(() {});
+              },
+            ),
          _buildCaptionHeader('notification'.tr),
          Tooltip(
            message: 'settingsNotificationBgServiceDesc'.tr,
@ -114,6 +207,84 @@ class _SettingScreenState extends State<SettingScreen> {
              },
            ),
          ),
+          _buildCaptionHeader('update'.tr),
+          CheckboxListTile(
+            contentPadding: const EdgeInsets.symmetric(horizontal: 22),
+            secondary: const Icon(Icons.sync_alt),
+            title: Text('updateCheckStrictly'.tr),
+            subtitle: Text('updateCheckStrictlyDesc'.tr),
+            value: _prefs?.getBool('check_update_strictly') ?? false,
+            onChanged: (value) {
+              _prefs
+                  ?.setBool('check_update_strictly', value ?? false)
+                  .then((_) {
+                setState(() {});
+              });
+            },
+          ),
+          Obx(() {
+            final AuthProvider auth = Get.find<AuthProvider>();
+            if (!auth.isAuthorized.value) return const SizedBox.shrink();
+            return Column(
+              children: [
+                _buildCaptionHeader('account'.tr),
+                ListTile(
+                  leading: const Icon(Icons.flag),
+                  trailing: const Icon(Icons.chevron_right),
+                  contentPadding: const EdgeInsets.symmetric(horizontal: 22),
+                  title: Text('reportAbuse'.tr),
+                  subtitle: Text('reportAbuseDesc'.tr),
+                  onTap: () {
+                    showDialog(
+                      context: context,
+                      builder: (context) => const AbuseReportDialog(),
+                    );
+                  },
+                ),
+                ListTile(
+                  leading: const Icon(Icons.person_remove),
+                  trailing: const Icon(Icons.chevron_right),
+                  contentPadding: const EdgeInsets.symmetric(horizontal: 22),
+                  title: Text('accountDeletion'.tr),
+                  subtitle: Text('accountDeletionDesc'.tr),
+                  onTap: () {
+                    context
+                        .showSlideToConfirmDialog(
+                      'accountDeletionConfirm'.tr,
+                      'accountDeletionConfirmDesc'.trParams({
+                        'account': '@${auth.userProfile.value!['name']}',
+                      }),
+                    )
+                        .then((value) async {
+                      if (value != true) return;
+                      final client = await auth.configureClient('id');
+                      final resp = await client.post('/users/me/deletion', {});
+                      if (resp.statusCode != 200) {
+                        context.showErrorDialog(RequestException(resp));
+                      } else {
+                        context.showSnackbar('accountDeletionRequested'.tr);
+                      }
+                    });
+                  },
+                ),
+              ],
+            );
+          }),
+          _buildCaptionHeader('performance'.tr),
+          CheckboxListTile(
+            contentPadding: const EdgeInsets.symmetric(horizontal: 22),
+            secondary: const Icon(Icons.message),
+            title: Text('animatedMessageList'.tr),
+            subtitle: Text('animatedMessageListDesc'.tr),
+            value: _prefs?.getBool('non_animated_message_list') ?? false,
+            onChanged: (value) {
+              _prefs
+                  ?.setBool('non_animated_message_list', value ?? false)
+                  .then((_) {
+                setState(() {});
+              });
+            },
+          ),
          _buildCaptionHeader('more'.tr),
          ListTile(
            leading: const Icon(Icons.delete_sweep),
@ -139,6 +310,21 @@ class _SettingScreenState extends State<SettingScreen> {
              });
            },
          ),
+          if (PlatformInfo.canRateTheApp)
+            ListTile(
+              leading: const Icon(Icons.star),
+              trailing: const Icon(Icons.chevron_right),
+              contentPadding: const EdgeInsets.symmetric(horizontal: 22),
+              title: Text('rateTheApp'.tr),
+              subtitle: Text('rateTheAppDesc'.tr),
+              onTap: () {
+                final inAppReview = InAppReview.instance;
+
+                inAppReview.openStoreListing(
+                  appStoreId: '6499032345',
+                );
+              },
+            ),
          ListTile(
            leading: const Icon(Icons.info_outline),
            trailing: const Icon(Icons.chevron_right),
--- a/lib/shells/root_shell.dart
+++ b/lib/shells/root_shell.dart
@ -2,7 +2,9 @@ import 'package:firebase_analytics/firebase_analytics.dart';
 import 'package:flutter/material.dart';
 import 'package:go_router/go_router.dart';
 import 'package:solian/theme.dart';
-import 'package:solian/widgets/navigation/app_navigation_drawer.dart';
+import 'package:solian/widgets/navigation/app_navigation.dart';
+import 'package:solian/widgets/navigation/app_navigation_bottom.dart';
+import 'package:solian/widgets/navigation/app_navigation_rail.dart';

 final GlobalKey<ScaffoldState> rootScaffoldKey = GlobalKey<ScaffoldState>();

@ -39,17 +41,28 @@ class RootShell extends StatelessWidget {
      );
    }

+    final showRailNavigation = AppTheme.isLargeScreen(context);
+
+    final destNames = AppNavigation.destinations.map((x) => x.page).toList();
+    final showBottomNavigation =
+        destNames.contains(routeName) && !showRailNavigation;
+
    return Scaffold(
      key: rootScaffoldKey,
-      drawer: AppTheme.isLargeScreen(context)
-          ? null
-          : AppNavigationDrawer(routeName: routeName),
+      bottomNavigationBar: showBottomNavigation
+          ? AppNavigationBottom(
+              initialIndex: destNames.indexOf(routeName ?? 'page'),
+            )
+          : null,
      body: AppTheme.isLargeScreen(context)
          ? Row(
              children: [
-                if (showNavigation) AppNavigationDrawer(routeName: routeName),
-                if (showNavigation)
-                  const VerticalDivider(thickness: 0.3, width: 1),
+                if (showRailNavigation) const AppNavigationRail(),
+                if (showRailNavigation)
+                  const VerticalDivider(
+                    width: 0.3,
+                    thickness: 0.3,
+                  ),
                Expanded(child: child),
              ],
            )
--- a/lib/shells/sidebar_shell.dart
+++ b/lib/shells/sidebar_shell.dart
@ -1,62 +0,0 @@
-import 'package:flutter/material.dart';
-import 'package:get/get.dart';
-import 'package:go_router/go_router.dart';
-import 'package:solian/theme.dart';
-import 'package:solian/widgets/app_bar_leading.dart';
-import 'package:solian/widgets/app_bar_title.dart';
-import 'package:solian/widgets/sidebar/sidebar_placeholder.dart';
-
-class SidebarShell extends StatelessWidget {
-  final bool showAppBar;
-  final GoRouterState state;
-  final Widget child;
-
-  final bool sidebarFirst;
-  final Widget? sidebar;
-
-  const SidebarShell({
-    super.key,
-    required this.child,
-    required this.state,
-    this.showAppBar = true,
-    this.sidebarFirst = false,
-    this.sidebar,
-  });
-
-  List<Widget> buildContent(BuildContext context) {
-    return [
-      Flexible(
-        flex: 2,
-        child: child,
-      ),
-      if (AppTheme.isExtraLargeScreen(context))
-        const VerticalDivider(thickness: 0.3, width: 1),
-      if (AppTheme.isExtraLargeScreen(context))
-        Flexible(
-          flex: 1,
-          child: sidebar ?? const SidebarPlaceholder(),
-        ),
-    ];
-  }
-
-  @override
-  Widget build(BuildContext context) {
-    return Scaffold(
-      appBar: showAppBar
-          ? AppBar(
-              leading: AppBarLeadingButton.adaptive(context),
-              title: AppBarTitle(state.topRoute?.name?.tr ?? 'page'.tr),
-              centerTitle: false,
-              toolbarHeight: AppTheme.toolbarHeight(context),
-            )
-          : null,
-      body: AppTheme.isLargeScreen(context)
-          ? Row(
-              children: sidebarFirst
-                  ? buildContent(context).reversed.toList()
-                  : buildContent(context),
-            )
-          : child,
-    );
-  }
-}
--- a/lib/shells/title_shell.dart
+++ b/lib/shells/title_shell.dart
@ -5,6 +5,7 @@ import 'package:solian/theme.dart';
 import 'package:solian/widgets/app_bar_title.dart';
 import 'package:solian/widgets/app_bar_leading.dart';
 import 'package:solian/widgets/current_state_action.dart';
+import 'package:solian/widgets/root_container.dart';

 class TitleShell extends StatelessWidget {
  final bool showAppBar;
@ -26,24 +27,26 @@ class TitleShell extends StatelessWidget {
  Widget build(BuildContext context) {
    assert(state != null || title != null);

-    return Scaffold(
-      appBar: showAppBar
-          ? AppBar(
-              leading: AppBarLeadingButton.adaptive(context),
-              title: AppBarTitle(
-                title ?? (state!.topRoute?.name?.tr ?? 'page'.tr),
-              ),
-              centerTitle: isCenteredTitle,
-              toolbarHeight: AppTheme.toolbarHeight(context),
-              actions: [
-                const BackgroundStateWidget(),
-                SizedBox(
-                  width: AppTheme.isLargeScreen(context) ? 8 : 16,
+    return RootContainer(
+      child: Scaffold(
+        appBar: showAppBar
+            ? AppBar(
+                leading: AppBarLeadingButton.adaptive(context),
+                title: AppBarTitle(
+                  title ?? (state!.topRoute?.name?.tr ?? 'page'.tr),
                ),
-              ],
-            )
-          : null,
-      body: child,
+                centerTitle: isCenteredTitle,
+                toolbarHeight: AppTheme.toolbarHeight(context),
+                actions: [
+                  const BackgroundStateWidget(),
+                  SizedBox(
+                    width: AppTheme.isLargeScreen(context) ? 8 : 16,
+                  ),
+                ],
+              )
+            : null,
+        body: child,
+      ),
    );
  }
 }
--- a/lib/theme.dart
+++ b/lib/theme.dart
@ -1,4 +1,5 @@
 import 'package:flutter/material.dart';
+import 'package:solian/models/theme.dart';
 import 'package:solian/platform.dart';

 abstract class AppTheme {
@ -6,7 +7,10 @@ abstract class AppTheme {
      MediaQuery.of(context).size.width > 640;

  static bool isExtraLargeScreen(BuildContext context) =>
-      MediaQuery.of(context).size.width > 720;
+      MediaQuery.of(context).size.width > 920;
+
+  static bool isUltraLargeScreen(BuildContext context) =>
+      MediaQuery.of(context).size.width > 1200;

  static bool isSpecializedMacOS(BuildContext context) =>
      PlatformInfo.isMacOS && !AppTheme.isLargeScreen(context);
@ -35,6 +39,10 @@ abstract class AppTheme {
        brightness: brightness,
        seedColor: seedColor ?? const Color.fromRGBO(154, 98, 91, 1),
      ),
+      scaffoldBackgroundColor: Colors.transparent,
+      snackBarTheme: const SnackBarThemeData(
+        behavior: SnackBarBehavior.floating,
+      ),
      fontFamily: 'Comfortaa',
      fontFamilyFallback: [
        'NotoSansSC',
@ -49,4 +57,36 @@ abstract class AppTheme {
      ),
    );
  }
+
+  static ThemeData buildFromData(
+    Brightness brightness,
+    SolianThemeData data, {
+    bool useMaterial3 = true,
+  }) {
+    return ThemeData(
+      brightness: brightness,
+      useMaterial3: useMaterial3,
+      colorScheme: ColorScheme.fromSeed(
+        brightness: brightness,
+        seedColor: data.seedColor,
+      ),
+      snackBarTheme: const SnackBarThemeData(
+        behavior: SnackBarBehavior.floating,
+      ),
+      scaffoldBackgroundColor: Colors.transparent,
+      fontFamily: data.fontFamily ?? 'Comfortaa',
+      fontFamilyFallback: data.fontFamilyFallback ??
+          [
+            'NotoSansSC',
+            'NotoSansHK',
+            'NotoSansJP',
+            if (PlatformInfo.isWeb) 'NotoSansEmoji',
+          ],
+      typography: Typography.material2021(
+        colorScheme: brightness == Brightness.light
+            ? const ColorScheme.light()
+            : const ColorScheme.dark(),
+      ),
+    );
+  }
 }
--- a/lib/widgets/account/account_avatar.dart
+++ b/lib/widgets/account/account_avatar.dart
@ -7,6 +7,7 @@ class AccountAvatar extends StatelessWidget {
  final Color? bgColor;
  final Color? feColor;
  final double? radius;
+  final Widget? fallbackWidget;

  const AccountAvatar({
    super.key,
@ -14,6 +15,7 @@ class AccountAvatar extends StatelessWidget {
    this.bgColor,
    this.feColor,
    this.radius,
+    this.fallbackWidget,
  });

  @override
@ -35,11 +37,12 @@ class AccountAvatar extends StatelessWidget {
      backgroundColor: bgColor,
      backgroundImage: !isEmpty ? AutoCacheImage.provider(url) : null,
      child: isEmpty
-          ? Icon(
-              Icons.account_circle,
-              size: radius != null ? radius! * 1.2 : 24,
-              color: feColor,
-            )
+          ? (fallbackWidget ??
+              Icon(
+                Icons.account_circle,
+                size: radius != null ? radius! * 1.2 : 24,
+                color: feColor,
+              ))
          : null,
    );
  }
--- a/lib/widgets/account/account_heading.dart
+++ b/lib/widgets/account/account_heading.dart
@ -23,6 +23,7 @@ class AccountHeadingWidget extends StatelessWidget {
  final AccountProfile? profile;
  final List<AccountBadge>? badges;
  final List<Widget>? extraWidgets;
+  final List<Widget>? appendWidgets;

  final Future<Response>? status;
  final Function? onEditStatus;
@ -39,6 +40,7 @@ class AccountHeadingWidget extends StatelessWidget {
    this.profile,
    this.status,
    this.extraWidgets,
+    this.appendWidgets,
    this.onEditStatus,
  });

@ -257,6 +259,7 @@ class AccountHeadingWidget extends StatelessWidget {
              ),
            ),
          ).paddingSymmetric(horizontal: 16),
+          ...?appendWidgets?.map((x) => x.paddingSymmetric(horizontal: 16)),
        ],
      ),
    );
--- a/lib/widgets/account/account_profile_popup.dart
+++ b/lib/widgets/account/account_profile_popup.dart
@ -106,10 +106,14 @@ class _AccountProfilePopupState extends State<AccountProfilePopup> {
            extraWidgets: [
              Card(
                child: ListTile(
+                  leading: const Icon(
+                    Icons.contact_page_outlined,
+                  ),
                  shape: const RoundedRectangleBorder(
                    borderRadius: BorderRadius.all(Radius.circular(8)),
                  ),
                  title: Text('visitProfilePage'.tr),
+                  subtitle: Text('learnMoreAboutPerson'.tr),
                  visualDensity:
                      const VisualDensity(horizontal: -4, vertical: -2),
                  trailing: const Icon(Icons.chevron_right),
--- a/lib/widgets/account/relative_list.dart
+++ b/lib/widgets/account/relative_list.dart
@ -28,42 +28,46 @@ class SilverRelativeList extends StatelessWidget {
          showModalBottomSheet(
            useRootNavigator: true,
            isScrollControlled: true,
-            backgroundColor: Theme
-                .of(context)
-                .colorScheme
-                .surface,
+            backgroundColor: Theme.of(context).colorScheme.surface,
            context: context,
-            builder: (context) =>
-                AccountProfilePopup(
-                  name: element.related.name,
-                ),
+            builder: (context) => AccountProfilePopup(
+              name: element.related.name,
+            ),
          );
        },
      ),
      trailing: Row(
        mainAxisSize: MainAxisSize.min,
        children: [
-          if(element.status != 1 && element.status != 3)
+          if (element.status != 1 && element.status != 3)
            IconButton(
              icon: const Icon(Icons.check),
              onPressed: () {
                final RelationshipProvider provider = Get.find();
                if (element.status == 0) {
-                  provider.handleRelation(element, true).then((_) => onUpdate());
+                  provider
+                      .handleRelation(element, true)
+                      .then((_) => onUpdate());
                } else {
-                  provider.editRelation(element, 1).then((_) => onUpdate());
+                  provider
+                      .editRelation(element.relatedId, 1)
+                      .then((_) => onUpdate());
                }
              },
            ),
-          if(element.status != 2 && element.status != 3)
+          if (element.status != 2 && element.status != 3)
            IconButton(
              icon: const Icon(Icons.close),
              onPressed: () {
                final RelationshipProvider provider = Get.find();
                if (element.status == 0) {
-                  provider.handleRelation(element, false).then((_) => onUpdate());
+                  provider
+                      .handleRelation(element, false)
+                      .then((_) => onUpdate());
                } else {
-                  provider.editRelation(element, 2).then((_) => onUpdate());
+                  provider
+                      .editRelation(element.relatedId, 2)
+                      .then((_) => onUpdate());
                }
              },
            ),
--- a/lib/widgets/attachments/attachment_editor.dart
+++ b/lib/widgets/attachments/attachment_editor.dart
@ -396,7 +396,8 @@ class _AttachmentEditorPopupState extends State<AttachmentEditorPopup> {
                    ),
                  if (!element.isCompleted &&
                      element.error == null &&
-                      canBeCrop)
+                      canBeCrop &&
+                      PlatformInfo.canCropImage)
                    Obx(
                      () => IconButton(
                        color: Colors.teal,
@ -484,7 +485,7 @@ class _AttachmentEditorPopupState extends State<AttachmentEditorPopup> {
                          ),
                        ),
                        Text(
-                          '${fileType[0].toUpperCase()}${fileType.substring(1)} · ${element.size.formatBytes()}',
+                          '${fileType.isNotEmpty ? fileType.capitalize : 'unknown'.tr} · ${element.size.formatBytes()}',
                          style: const TextStyle(fontSize: 12),
                        ),
                      ],
@ -744,8 +745,8 @@ class _AttachmentEditorPopupState extends State<AttachmentEditorPopup> {
              return IgnorePointer(
                ignoring: _uploadController.isUploading.value,
                child: Container(
-                  height: 64,
                  width: MediaQuery.of(context).size.width,
+                  padding: const EdgeInsets.all(8),
                  decoration: BoxDecoration(
                    border: Border(
                      top: BorderSide(
@ -754,67 +755,72 @@ class _AttachmentEditorPopupState extends State<AttachmentEditorPopup> {
                      ),
                    ),
                  ),
-                  child: SingleChildScrollView(
-                    scrollDirection: Axis.horizontal,
-                    child: Wrap(
-                      spacing: 8,
-                      runSpacing: 0,
-                      alignment: WrapAlignment.center,
-                      runAlignment: WrapAlignment.center,
-                      children: [
-                        if ((PlatformInfo.isDesktop ||
-                                PlatformInfo.isIOS ||
-                                PlatformInfo.isWeb) &&
-                            !widget.imageOnly)
-                          ElevatedButton.icon(
-                            icon: const Icon(Icons.paste),
-                            label: Text('attachmentAddClipboard'.tr),
-                            style: const ButtonStyle(visualDensity: density),
-                            onPressed: () => _pasteFileToUpload(),
-                          ),
-                        ElevatedButton.icon(
-                          icon: const Icon(Icons.add_photo_alternate),
-                          label: Text('attachmentAddGalleryPhoto'.tr),
+                  child: Wrap(
+                    spacing: 8,
+                    runSpacing: 8,
+                    alignment: WrapAlignment.center,
+                    runAlignment: WrapAlignment.center,
+                    children: [
+                      if ((PlatformInfo.isDesktop ||
+                              PlatformInfo.isIOS ||
+                              PlatformInfo.isWeb) &&
+                          !widget.imageOnly)
+                        IconButton(
+                          icon: const Icon(Icons.paste),
+                          tooltip: 'attachmentAddClipboard'.tr,
                          style: const ButtonStyle(visualDensity: density),
-                          onPressed: () => _pickPhotoToUpload(),
+                          color: Theme.of(context).colorScheme.primary,
+                          onPressed: () => _pasteFileToUpload(),
                        ),
-                        if (!widget.imageOnly)
-                          ElevatedButton.icon(
-                            icon: const Icon(Icons.add_road),
-                            label: Text('attachmentAddGalleryVideo'.tr),
-                            style: const ButtonStyle(visualDensity: density),
-                            onPressed: () => _pickVideoToUpload(),
-                          ),
-                        ElevatedButton.icon(
-                          icon: const Icon(Icons.photo_camera_back),
-                          label: Text('attachmentAddCameraPhoto'.tr),
+                      IconButton(
+                        icon: const Icon(Icons.add_photo_alternate),
+                        tooltip: 'attachmentAddGalleryPhoto'.tr,
+                        style: const ButtonStyle(visualDensity: density),
+                        color: Theme.of(context).colorScheme.primary,
+                        onPressed: () => _pickPhotoToUpload(),
+                      ),
+                      if (!widget.imageOnly)
+                        IconButton(
+                          icon: const Icon(Icons.add_road),
+                          tooltip: 'attachmentAddGalleryVideo'.tr,
                          style: const ButtonStyle(visualDensity: density),
+                          color: Theme.of(context).colorScheme.primary,
+                          onPressed: () => _pickVideoToUpload(),
+                        ),
+                      if (PlatformInfo.isMobile)
+                        IconButton(
+                          icon: const Icon(Icons.photo_camera_back),
+                          tooltip: 'attachmentAddCameraPhoto'.tr,
+                          style: const ButtonStyle(visualDensity: density),
+                          color: Theme.of(context).colorScheme.primary,
                          onPressed: () => _takeMediaToUpload(false),
                        ),
-                        if (!widget.imageOnly)
-                          ElevatedButton.icon(
-                            icon: const Icon(Icons.video_camera_back_outlined),
-                            label: Text('attachmentAddCameraVideo'.tr),
-                            style: const ButtonStyle(visualDensity: density),
-                            onPressed: () => _takeMediaToUpload(true),
-                          ),
-                        if (!widget.imageOnly)
-                          ElevatedButton.icon(
-                            icon: const Icon(Icons.file_present_rounded),
-                            label: Text('attachmentAddFile'.tr),
-                            style: const ButtonStyle(visualDensity: density),
-                            onPressed: () => _pickFileToUpload(),
-                          ),
-                        if (!widget.imageOnly)
-                          ElevatedButton.icon(
-                            icon: const Icon(Icons.link),
-                            label: Text('attachmentAddFile'.tr),
-                            style: const ButtonStyle(visualDensity: density),
-                            onPressed: () => _linkAttachments(),
-                          ),
-                      ],
-                    ).paddingSymmetric(horizontal: 12),
-                  ),
+                      if (!widget.imageOnly && PlatformInfo.isMobile)
+                        IconButton(
+                          icon: const Icon(Icons.video_camera_back_outlined),
+                          tooltip: 'attachmentAddCameraVideo'.tr,
+                          style: const ButtonStyle(visualDensity: density),
+                          color: Theme.of(context).colorScheme.primary,
+                          onPressed: () => _takeMediaToUpload(true),
+                        ),
+                      if (!widget.imageOnly)
+                        IconButton(
+                          icon: const Icon(Icons.file_present_rounded),
+                          tooltip: 'attachmentAddFile'.tr,
+                          style: const ButtonStyle(visualDensity: density),
+                          color: Theme.of(context).colorScheme.primary,
+                          onPressed: () => _pickFileToUpload(),
+                        ),
+                      if (!widget.imageOnly)
+                        IconButton(
+                          icon: const Icon(Icons.link),
+                          tooltip: 'attachmentAddLink'.tr,
+                          style: const ButtonStyle(visualDensity: density),
+                          color: Theme.of(context).colorScheme.primary,
+                          onPressed: () => _linkAttachments(),
+                        ),
+                    ],
+                  ).paddingSymmetric(horizontal: 12),
                )
                    .animate(
                      target: _uploadController.isUploading.value ? 0 : 1,
--- a/lib/widgets/attachments/attachment_editor_thumbnail.dart
+++ b/lib/widgets/attachments/attachment_editor_thumbnail.dart
@ -93,14 +93,14 @@ class _AttachmentEditorThumbnailDialogState
  @override
  Widget build(BuildContext context) {
    return AlertDialog(
-      title: Text('postThumbnail'.tr),
+      title: Text('attachmentThumbnail'.tr),
      content: Column(
        mainAxisSize: MainAxisSize.min,
        children: [
          Card(
            margin: EdgeInsets.zero,
            child: ListTile(
-              title: Text('postThumbnailAttachmentNew'.tr),
+              title: Text('attachmentThumbnailAttachmentNew'.tr),
              contentPadding: const EdgeInsets.only(left: 12, right: 9),
              trailing: const Icon(Icons.chevron_right),
              shape: const RoundedRectangleBorder(
@ -122,7 +122,7 @@ class _AttachmentEditorThumbnailDialogState
              isDense: true,
              border: const OutlineInputBorder(),
              prefixText: '#',
-              labelText: 'postThumbnailAttachment'.tr,
+              labelText: 'attachmentThumbnailAttachment'.tr,
            ),
            onTapOutside: (_) => FocusManager.instance.primaryFocus?.unfocus(),
          ),
--- a/lib/widgets/attachments/attachment_item.dart
+++ b/lib/widgets/attachments/attachment_item.dart
@ -21,6 +21,7 @@ class AttachmentItem extends StatefulWidget {
  final bool showBadge;
  final bool showHideButton;
  final bool autoload;
+  final bool isDense;
  final BoxFit fit;
  final String? badge;
  final Function? onHide;
@ -34,6 +35,7 @@ class AttachmentItem extends StatefulWidget {
    this.showBadge = true,
    this.showHideButton = true,
    this.autoload = false,
+    this.isDense = false,
    this.onHide,
  });

@ -53,6 +55,7 @@ class _AttachmentItemState extends State<AttachmentItem> {
          fit: widget.fit,
          showBadge: widget.showBadge,
          showHideButton: widget.showHideButton,
+          isDense: widget.isDense,
          onHide: widget.onHide,
        );
      case 'video':
@ -120,6 +123,7 @@ class _AttachmentItemImage extends StatelessWidget {
  final bool showBadge;
  final bool showHideButton;
  final BoxFit fit;
+  final bool isDense;
  final String? badge;
  final Function? onHide;

@ -128,6 +132,7 @@ class _AttachmentItemImage extends StatelessWidget {
    required this.item,
    required this.showBadge,
    required this.showHideButton,
+    required this.isDense,
    required this.fit,
    this.badge,
    this.onHide,
@ -146,6 +151,7 @@ class _AttachmentItemImage extends StatelessWidget {
              '/attachments/${item.rid}',
            ),
            fit: fit,
+            isDense: isDense,
          ),
          if (showBadge && badge != null)
            Positioned(
@ -233,6 +239,7 @@ class _AttachmentItemVideoState extends State<_AttachmentItemVideo> {
    final ratio = widget.item.metadata?['ratio'] ?? 16 / 9;
    if (!_showContent) {
      return GestureDetector(
+        behavior: HitTestBehavior.opaque,
        child: Stack(
          children: [
            if (widget.item.metadata?['thumbnail'] != null)
@ -282,6 +289,8 @@ class _AttachmentItemVideoState extends State<_AttachmentItemVideo> {
                        children: [
                          Text(
                            widget.item.alt,
+                            maxLines: 1,
+                            overflow: TextOverflow.ellipsis,
                            style: const TextStyle(
                              shadows: labelShadows,
                              color: Colors.white,
@ -398,6 +407,7 @@ class _AttachmentItemAudioState extends State<_AttachmentItemAudio> {
    const ratio = 16 / 9;
    if (!_showContent) {
      return GestureDetector(
+        behavior: HitTestBehavior.opaque,
        child: Stack(
          children: [
            if (widget.item.metadata?['thumbnail'] != null)
@ -447,6 +457,8 @@ class _AttachmentItemAudioState extends State<_AttachmentItemAudio> {
                        children: [
                          Text(
                            widget.item.alt,
+                            maxLines: 1,
+                            overflow: TextOverflow.ellipsis,
                            style: const TextStyle(
                              shadows: labelShadows,
                              color: Colors.white,
--- a/lib/widgets/attachments/attachment_list.dart
+++ b/lib/widgets/attachments/attachment_list.dart
@ -177,9 +177,6 @@ class _AttachmentListState extends State<AttachmentList> {
          if (element == null) return const SizedBox.shrink();
          double ratio = element.metadata?['ratio']?.toDouble() ?? 16 / 9;
          return Container(
-            decoration: BoxDecoration(
-              color: Theme.of(context).colorScheme.surfaceContainerHigh,
-            ),
            constraints: BoxConstraints(
              maxWidth: widget.columnMaxWidth,
              maxHeight: 640,
@ -247,7 +244,7 @@ class _AttachmentListState extends State<AttachmentList> {
        maxHeight: widget.flatMaxHeight,
      ),
      decoration: BoxDecoration(
-        color: Theme.of(context).colorScheme.surfaceContainerHigh,
+        color: Colors.transparent,
        border: Border.symmetric(
          horizontal: BorderSide(
            width: 0.3,
@ -257,6 +254,7 @@ class _AttachmentListState extends State<AttachmentList> {
      ),
      child: CarouselSlider.builder(
        options: CarouselOptions(
+          animateToClosest: true,
          aspectRatio: _aspectRatio,
          viewportFraction:
              widget.viewport ?? (widget.attachmentsId.length > 1 ? 0.95 : 1),
@ -319,6 +317,7 @@ class AttachmentListEntry extends StatelessWidget {
        width: width ?? MediaQuery.of(context).size.width,
        height: height,
        decoration: BoxDecoration(
+          color: Colors.transparent,
          border: showBorder
              ? Border.symmetric(
                  vertical: BorderSide(
@ -338,6 +337,7 @@ class AttachmentListEntry extends StatelessWidget {
              badge: showBadge ? badgeContent : null,
              showHideButton: !item!.isMature || showMature,
              autoload: autoload,
+              isDense: isDense,
              onHide: () {
                onReveal(false);
              },
--- a/lib/widgets/auto_cache_image.dart
+++ b/lib/widgets/auto_cache_image.dart
@ -10,6 +10,7 @@ class AutoCacheImage extends StatelessWidget {
  final BoxFit? fit;
  final bool noProgressIndicator;
  final bool noErrorWidget;
+  final bool isDense;

  const AutoCacheImage(
    this.url, {
@ -19,6 +20,7 @@ class AutoCacheImage extends StatelessWidget {
    this.fit,
    this.noProgressIndicator = false,
    this.noErrorWidget = false,
+    this.isDense = false,
  });

  @override
@ -32,8 +34,17 @@ class AutoCacheImage extends StatelessWidget {
        progressIndicatorBuilder: noProgressIndicator
            ? null
            : (context, url, downloadProgress) => Center(
-                  child: CircularProgressIndicator(
-                    value: downloadProgress.progress,
+                  child: TweenAnimationBuilder(
+                    tween: Tween(
+                      begin: 0,
+                      end: downloadProgress.progress ?? 0,
+                    ),
+                    duration: const Duration(milliseconds: 300),
+                    builder: (context, value, _) => CircularProgressIndicator(
+                      value: downloadProgress.progress != null
+                          ? value.toDouble()
+                          : null,
+                    ),
                  ),
                ),
        errorWidget: noErrorWidget
@ -46,13 +57,14 @@ class AutoCacheImage extends StatelessWidget {
                    child: Column(
                      mainAxisAlignment: MainAxisAlignment.center,
                      children: [
-                        const Icon(Icons.close, size: 32)
+                        Icon(Icons.close, size: isDense ? 24 : 32)
                            .animate(onPlay: (e) => e.repeat(reverse: true))
                            .fade(duration: 500.ms),
-                        Text(
-                          error.toString(),
-                          textAlign: TextAlign.center,
-                        ),
+                        if (!isDense)
+                          Text(
+                            error.toString(),
+                            textAlign: TextAlign.center,
+                          ),
                      ],
                    ),
                  ),
@ -71,11 +83,20 @@ class AutoCacheImage extends StatelessWidget {
              ImageChunkEvent? loadingProgress) {
              if (loadingProgress == null) return child;
              return Center(
-                child: CircularProgressIndicator(
-                  value: loadingProgress.expectedTotalBytes != null
-                      ? loadingProgress.cumulativeBytesLoaded /
-                          loadingProgress.expectedTotalBytes!
-                      : null,
+                child: TweenAnimationBuilder(
+                  tween: Tween(
+                    begin: 0,
+                    end: loadingProgress.expectedTotalBytes != null
+                        ? loadingProgress.cumulativeBytesLoaded /
+                            loadingProgress.expectedTotalBytes!
+                        : 0,
+                  ),
+                  duration: const Duration(milliseconds: 300),
+                  builder: (context, value, _) => CircularProgressIndicator(
+                    value: loadingProgress.expectedTotalBytes != null
+                        ? value.toDouble()
+                        : null,
+                  ),
                ),
              );
            },
@ -89,13 +110,14 @@ class AutoCacheImage extends StatelessWidget {
                  child: Column(
                    mainAxisAlignment: MainAxisAlignment.center,
                    children: [
-                      const Icon(Icons.close, size: 32)
+                      Icon(Icons.close, size: isDense ? 24 : 32)
                          .animate(onPlay: (e) => e.repeat(reverse: true))
                          .fade(duration: 500.ms),
-                      Text(
-                        error.toString(),
-                        textAlign: TextAlign.center,
-                      ),
+                      if (!isDense)
+                        Text(
+                          error.toString(),
+                          textAlign: TextAlign.center,
+                        ),
                    ],
                  ),
                ),
--- a/lib/widgets/channel/channel_call_indicator.dart
+++ b/lib/widgets/channel/channel_call_indicator.dart
@ -98,12 +98,12 @@ class ChannelCallIndicator extends StatelessWidget {
              child: Text('callJoin'.tr),
            );
          } else if (call.channel.value?.id == channel.id &&
-              !AppTheme.isLargeScreen(context)) {
+              !AppTheme.isUltraLargeScreen(context)) {
            return TextButton(
              onPressed: () => onJoin(),
              child: Text('callResume'.tr),
            );
-          } else if (!AppTheme.isLargeScreen(context)) {
+          } else if (!AppTheme.isUltraLargeScreen(context)) {
            return TextButton(
              onPressed: null,
              child: Text('callJoin'.tr),
--- a/lib/widgets/channel/channel_list.dart
+++ b/lib/widgets/channel/channel_list.dart
@ -1,18 +1,21 @@
+import 'dart:math';
+
 import 'package:flutter/material.dart';
 import 'package:font_awesome_flutter/font_awesome_flutter.dart';
+import 'package:gap/gap.dart';
 import 'package:get/get.dart';
+import 'package:intl/intl.dart';
 import 'package:solian/controllers/chat_events_controller.dart';
 import 'package:solian/models/channel.dart';
 import 'package:solian/platform.dart';
+import 'package:solian/providers/database/database.dart';
 import 'package:solian/router.dart';
 import 'package:solian/widgets/account/account_avatar.dart';
+import 'package:badges/badges.dart' as badges;

 class ChannelListWidget extends StatefulWidget {
  final List<Channel> channels;
  final int selfId;
-  final bool isDense;
-  final bool isCollapsed;
-  final bool noCategory;
  final bool useReplace;
  final Function(Channel)? onSelected;

@ -20,9 +23,6 @@ class ChannelListWidget extends StatefulWidget {
    super.key,
    required this.channels,
    required this.selfId,
-    this.isDense = false,
-    this.isCollapsed = false,
-    this.noCategory = false,
    this.useReplace = false,
    this.onSelected,
  });
@ -32,43 +32,25 @@ class ChannelListWidget extends StatefulWidget {
 }

 class _ChannelListWidgetState extends State<ChannelListWidget> {
-  final List<Channel> _globalChannels = List.empty(growable: true);
-  final Map<String, List<Channel>> _inRealms = {};
+  Map<int, LocalMessageEventTableData>? _lastMessages;

  final ChatEventController _eventController = ChatEventController();

-  void _mapChannels() {
-    _inRealms.clear();
-    _globalChannels.clear();
-
-    if (widget.noCategory) {
-      _globalChannels.addAll(widget.channels);
-      return;
-    }
-
-    for (final channel in widget.channels) {
-      if (channel.realmId != null) {
-        if (_inRealms[channel.realm!.alias] == null) {
-          _inRealms[channel.realm!.alias] = List.empty(growable: true);
-        }
-        _inRealms[channel.realm!.alias]!.add(channel);
-      } else {
-        _globalChannels.add(channel);
-      }
-    }
-  }
-
-  @override
-  void didUpdateWidget(covariant ChannelListWidget oldWidget) {
-    super.didUpdateWidget(oldWidget);
-    setState(() => _mapChannels());
+  Future<void> _loadLastMessages() async {
+    final messages = await _eventController.src.getLastInAllChannels();
+    setState(() {
+      _lastMessages = messages
+          .map((k, v) => MapEntry(k, v.firstOrNull))
+          .cast<int, LocalMessageEventTableData>();
+    });
  }

  @override
  void initState() {
    super.initState();
-    _mapChannels();
-    _eventController.initialize();
+    _eventController.initialize().then((_) {
+      _loadLastMessages();
+    });
  }

  void _gotoChannel(Channel item) {
@ -95,107 +77,183 @@ class _ChannelListWidgetState extends State<ChannelListWidget> {
    }
  }

-  Widget _buildDirectMessageDescription(Channel item, ChannelMember otherside) {
+  Widget _buildTitle(Channel item, ChannelMember? otherside) {
+    if (otherside != null) {
+      return Row(
+        crossAxisAlignment: CrossAxisAlignment.center,
+        children: [
+          Expanded(child: Text(otherside.account.nick)),
+          if (_lastMessages != null && _lastMessages![item.id] != null)
+            Text(
+              DateFormat('MM/dd').format(
+                _lastMessages![item.id]!.createdAt.toLocal(),
+              ),
+              style: TextStyle(
+                fontSize: 12,
+                color:
+                    Theme.of(context).colorScheme.onSurface.withOpacity(0.75),
+              ),
+            ),
+        ],
+      );
+    }
+    return Row(
+      crossAxisAlignment: CrossAxisAlignment.center,
+      children: [
+        Expanded(child: Text(item.name)),
+        if (_lastMessages != null && _lastMessages![item.id] != null)
+          Text(
+            DateFormat('MM/dd').format(
+              _lastMessages![item.id]!.createdAt.toLocal(),
+            ),
+            style: TextStyle(
+              fontSize: 12,
+              color: Theme.of(context).colorScheme.onSurface.withOpacity(0.75),
+            ),
+          ),
+      ],
+    );
+  }
+
+  Widget _buildSubtitle(Channel item, ChannelMember? otherside) {
    if (PlatformInfo.isWeb) {
-      return Text('channelDirectDescription'.trParams(
-        {'username': '@${otherside.account.name}'},
-      ));
+      return otherside != null
+          ? Text(
+              'channelDirectDescription'.trParams(
+                {'username': '@${otherside.account.name}'},
+              ),
+              maxLines: 1,
+              overflow: TextOverflow.ellipsis,
+            )
+          : Text(
+              item.description,
+              maxLines: 1,
+              overflow: TextOverflow.ellipsis,
+            );
    }

-    return FutureBuilder(
-      future: Future.delayed(
-        const Duration(milliseconds: 500),
-        () => _eventController.src.getLastInChannel(item),
-      ),
-      builder: (context, snapshot) {
-        if (!snapshot.hasData && snapshot.data == null) {
-          return Text('channelDirectDescription'.trParams(
-            {'username': '@${otherside.account.name}'},
-          ));
-        }
-
-        final data = snapshot.data!.data!;
-        return Text(
-          '${data.sender.account.nick}: ${data.body['text'] ?? 'Unsupported message to preview'}',
-          maxLines: 1,
-          overflow: TextOverflow.ellipsis,
+    return AnimatedSwitcher(
+      switchInCurve: Curves.easeIn,
+      switchOutCurve: Curves.easeOut,
+      transitionBuilder: (child, animation) {
+        return FadeTransition(opacity: animation, child: child);
+      },
+      duration: const Duration(milliseconds: 300),
+      child: (_lastMessages == null || _lastMessages![item.id] == null)
+          ? Builder(
+              builder: (context) {
+                return otherside != null
+                    ? Text(
+                        'channelDirectDescription'.trParams(
+                          {'username': '@${otherside.account.name}'},
+                        ),
+                        maxLines: 1,
+                        overflow: TextOverflow.ellipsis,
+                      )
+                    : Text(
+                        item.description,
+                        maxLines: 1,
+                        overflow: TextOverflow.ellipsis,
+                      );
+              },
+            )
+          : Builder(
+              builder: (context) {
+                final data = _lastMessages![item.id]!.data!;
+                return Row(
+                  crossAxisAlignment: CrossAxisAlignment.center,
+                  children: [
+                    if (item.type == 0)
+                      Badge(
+                        label: Text(data.sender.account.nick),
+                        backgroundColor:
+                            Theme.of(context).colorScheme.secondaryContainer,
+                        textColor:
+                            Theme.of(context).colorScheme.onSecondaryContainer,
+                      ),
+                    if (item.type == 0) const Gap(6),
+                    if (data.body['text'] != null)
+                      Expanded(
+                        child: Text(
+                          data.body['text'],
+                          maxLines: 1,
+                          overflow: TextOverflow.ellipsis,
+                        ),
+                      )
+                    else
+                      Badge(label: Text('unablePreview'.tr)),
+                  ],
+                );
+              },
+            ),
+      layoutBuilder: (currentChild, previousChildren) {
+        return Stack(
+          alignment: Alignment.centerLeft,
+          children: <Widget>[
+            ...previousChildren,
+            if (currentChild != null) currentChild,
+          ],
        );
      },
    );
  }

  Widget _buildEntry(Channel item) {
-    final padding = widget.isDense
-        ? const EdgeInsets.symmetric(horizontal: 20)
-        : const EdgeInsets.symmetric(horizontal: 16);
+    const padding = EdgeInsets.symmetric(horizontal: 20);

-    if (item.type == 1) {
-      final otherside =
-          item.members!.where((e) => e.account.id != widget.selfId).first;
+    final otherside =
+        item.members!.where((e) => e.account.id != widget.selfId).firstOrNull;

+    if (item.type == 1 && otherside != null) {
      final avatar = AccountAvatar(
        content: otherside.account.avatar,
-        radius: widget.isDense ? 12 : 20,
+        radius: 20,
        bgColor: Theme.of(context).colorScheme.primary,
        feColor: Theme.of(context).colorScheme.onPrimary,
      );

-      if (widget.isCollapsed) {
-        return Tooltip(
-          message: otherside.account.nick,
-          child: InkWell(
-            child: avatar.paddingSymmetric(vertical: 12),
-            onTap: () => _gotoChannel(item),
-          ),
-        );
-      }
-
      return ListTile(
        leading: avatar,
        contentPadding: padding,
-        title: Text(otherside.account.nick),
-        subtitle: !widget.isDense
-            ? _buildDirectMessageDescription(item, otherside)
-            : null,
+        title: _buildTitle(item, otherside),
+        subtitle: _buildSubtitle(item, otherside),
        onTap: () => _gotoChannel(item),
      );
    } else {
      final avatar = CircleAvatar(
-        backgroundColor: item.realmId == null
-            ? Theme.of(context).colorScheme.primary
-            : Colors.transparent,
-        radius: widget.isDense ? 12 : 20,
+        backgroundColor: Theme.of(context).colorScheme.primary,
+        radius: 20,
        child: FaIcon(
          FontAwesomeIcons.hashtag,
-          color: item.realmId == null
-              ? Theme.of(context).colorScheme.onPrimary
-              : Theme.of(context).colorScheme.primary,
-          size: widget.isDense ? 12 : 16,
+          color: Theme.of(context).colorScheme.onPrimary,
+          size: 16,
        ),
      );

-      if (widget.isCollapsed) {
-        return Tooltip(
-          message: item.name,
-          child: InkWell(
-            child: avatar.paddingSymmetric(vertical: 12),
-            onTap: () => _gotoChannel(item),
-          ),
-        );
-      }
-
      return ListTile(
-        minTileHeight: widget.isDense ? 48 : null,
-        leading: avatar,
+        minTileHeight: null,
+        leading: item.realmId == null
+            ? avatar
+            : badges.Badge(
+                position: badges.BadgePosition.bottomEnd(bottom: -4, end: -6),
+                badgeStyle: badges.BadgeStyle(
+                  badgeColor: Theme.of(context).colorScheme.secondaryContainer,
+                  padding: const EdgeInsets.all(2),
+                  elevation: 8,
+                ),
+                badgeContent: AccountAvatar(
+                  content: item.realm?.avatar,
+                  radius: 10,
+                  fallbackWidget: const Icon(
+                    Icons.workspaces,
+                    size: 16,
+                  ),
+                ),
+                child: avatar,
+              ),
        contentPadding: padding,
-        title: Text(item.name),
-        subtitle: !widget.isDense
-            ? Text(
-                item.description,
-                maxLines: 1,
-                overflow: TextOverflow.ellipsis,
-              )
-            : null,
+        title: _buildTitle(item, null),
+        subtitle: _buildSubtitle(item, null),
        onTap: () => _gotoChannel(item),
      );
    }
@ -203,48 +261,16 @@ class _ChannelListWidgetState extends State<ChannelListWidget> {

  @override
  Widget build(BuildContext context) {
-    if (widget.noCategory) {
-      return CustomScrollView(
-        slivers: [
-          SliverList.builder(
-            itemCount: _globalChannels.length,
-            itemBuilder: (context, index) {
-              final element = _globalChannels[index];
-              return _buildEntry(element);
-            },
-          ),
-        ],
-      );
-    }
-
    return CustomScrollView(
      slivers: [
        SliverList.builder(
-          itemCount: _globalChannels.length,
+          itemCount: widget.channels.length,
          itemBuilder: (context, index) {
-            final element = _globalChannels[index];
+            final element = widget.channels[index];
            return _buildEntry(element);
          },
        ),
-        SliverList.list(
-          children: _inRealms.entries.map((element) {
-            return ExpansionTile(
-              tilePadding: const EdgeInsets.only(left: 20, right: 24),
-              minTileHeight: 48,
-              title: Text(element.value.first.realm!.name),
-              leading: CircleAvatar(
-                backgroundColor: Colors.teal,
-                radius: widget.isDense ? 12 : 24,
-                child: Icon(
-                  Icons.workspaces,
-                  color: Colors.white,
-                  size: widget.isDense ? 12 : 16,
-                ),
-              ),
-              children: element.value.map((x) => _buildEntry(x)).toList(),
-            );
-          }).toList(),
-        ),
+        SliverGap(max(16, MediaQuery.of(context).padding.bottom)),
      ],
    );
  }
--- a/lib/widgets/chat/chat_event_list.dart
+++ b/lib/widgets/chat/chat_event_list.dart
@ -1,4 +1,5 @@
 import 'package:flutter/material.dart';
+import 'package:flutter_animate/flutter_animate.dart';
 import 'package:get/get.dart';
 import 'package:solian/controllers/chat_events_controller.dart';
 import 'package:solian/models/channel.dart';
@ -9,6 +10,7 @@ import 'package:solian/widgets/chat/chat_event_action.dart';
 import 'package:very_good_infinite_list/very_good_infinite_list.dart';

 class ChatEventList extends StatelessWidget {
+  final bool noAnimated;
  final String scope;
  final Channel channel;
  final ChatEventController chatController;
@ -23,6 +25,7 @@ class ChatEventList extends StatelessWidget {
    required this.chatController,
    required this.onEdit,
    required this.onReply,
+    this.noAnimated = false,
  });

  bool _checkMessageMergeable(Event? a, Event? b) {
@ -63,15 +66,32 @@ class ChatEventList extends StatelessWidget {

              return GestureDetector(
                behavior: HitTestBehavior.opaque,
-                child: ChatEvent(
-                  key: Key('m${item!.uuid}'),
-                  item: item,
-                  isMerged: isMerged,
-                  chatController: chatController,
-                ).paddingOnly(
-                  top: !isMerged ? 8 : 0,
-                  bottom: !hasMerged ? 8 : 0,
-                ),
+                child: Builder(builder: (context) {
+                  final widget = ChatEvent(
+                    key: Key('m${item!.uuid}'),
+                    item: item,
+                    isMerged: isMerged,
+                    chatController: chatController,
+                  ).paddingOnly(
+                    top: !isMerged ? 8 : 0,
+                    bottom: !hasMerged ? 8 : 0,
+                  );
+
+                  if (noAnimated) {
+                    return widget;
+                  } else {
+                    return widget
+                        .animate(
+                          key: Key('animated-m${item.uuid}'),
+                        )
+                        .slideY(
+                          curve: Curves.fastLinearToSlowEaseIn,
+                          duration: 250.ms,
+                          begin: 0.5,
+                          end: 0,
+                        );
+                  }
+                }),
                onLongPress: () {
                  showModalBottomSheet(
                    useRootNavigator: true,
@ -79,7 +99,7 @@ class ChatEventList extends StatelessWidget {
                    builder: (context) => ChatEventAction(
                      channel: channel,
                      realm: channel.realm,
-                      item: item,
+                      item: item!,
                      onEdit: () {
                        onEdit(item);
                      },
@ -92,10 +112,13 @@ class ChatEventList extends StatelessWidget {
              );
            },
            onFetchData: () {
-              chatController.loadEvents(
-                chatController.channel!,
-                chatController.scope!,
-              );
+              if (chatController.currentEvents.length <
+                  chatController.totalEvents.value) {
+                chatController.loadEvents(
+                  chatController.channel!,
+                  chatController.scope!,
+                );
+              }
            },
          );
        }),
--- a/lib/widgets/chat/chat_event_message.dart
+++ b/lib/widgets/chat/chat_event_message.dart
@ -49,6 +49,7 @@ class ChatEventMessage extends StatelessWidget {
    return MarkdownTextContent(
      parentId: 'm${item.id}',
      isSelectable: true,
+      isAutoWarp: true,
      content: body.text,
    );
  }
--- a/lib/widgets/chat/chat_message_input.dart
+++ b/lib/widgets/chat/chat_message_input.dart
@ -405,12 +405,9 @@ class _ChatMessageInputState extends State<ChatMessageInput> {
                    if (emojiMatch != null) {
                      final StickerProvider stickers = Get.find();
                      final emoteSearch = emojiMatch[2]!;
-                      return stickers.availableStickers
-                          .where(
-                            (x) => x.textWarpedPlaceholder
-                                .toUpperCase()
-                                .contains(emoteSearch.toUpperCase()),
-                          )
+                      final result = await stickers
+                          .searchStickerByAlias(emoteSearch.substring(1));
+                      return result
                          .map(
                            (x) => ChatMessageSuggestion(
                              type: 'emotes',
@ -418,6 +415,7 @@ class _ChatMessageInputState extends State<ChatMessageInput> {
                                x.imageUrl,
                                width: 28,
                                height: 28,
+                                isDense: true,
                              ),
                              display: x.name,
                              content: x.textWarpedPlaceholder,
--- a/lib/widgets/daily_sign/history_chart.dart
+++ b/lib/widgets/daily_sign/history_chart.dart
@ -12,7 +12,7 @@ class DailySignHistoryChartDialog extends StatelessWidget {

  const DailySignHistoryChartDialog({super.key, required this.data});

-  static List<String> signSymbols = ['大凶', '凶', '中平', '吉', '大吉'];
+  static final List<String> signSymbols = ['大凶', '凶', '中平', '吉', '大吉'];

  DateTime? get _firstRecordDate => data?.map((x) => x.createdAt).reduce(
      (a, b) => DateTime.fromMillisecondsSinceEpoch(
@ -42,215 +42,222 @@ class DailySignHistoryChartDialog extends StatelessWidget {
                child: CircularProgressIndicator(),
              ),
            )
-          : Column(
-              mainAxisSize: MainAxisSize.min,
-              crossAxisAlignment: CrossAxisAlignment.start,
-              children: [
-                Text(
-                  'dailySignHistoryRecent'.tr,
-                  style: Theme.of(context).textTheme.titleMedium,
-                ).paddingOnly(bottom: 18),
-                SizedBox(
-                  height: 180,
-                  width: max(640, MediaQuery.of(context).size.width),
-                  child: LineChart(
-                    LineChartData(
-                      lineBarsData: [
-                        LineChartBarData(
-                          isCurved: true,
-                          isStrokeCapRound: true,
-                          isStrokeJoinRound: true,
-                          color: Theme.of(context).colorScheme.primary,
-                          belowBarData: BarAreaData(
-                            show: true,
-                            gradient: LinearGradient(
-                              colors: List.filled(
-                                data!.length,
-                                Theme.of(context)
-                                    .colorScheme
-                                    .primary
-                                    .withOpacity(0.3),
-                              ).toList(),
-                            ),
-                          ),
-                          spots: data!
-                              .map(
-                                (x) => FlSpot(
-                                  x.createdAt
-                                      .copyWith(
-                                        hour: 0,
-                                        minute: 0,
-                                        second: 0,
-                                        millisecond: 0,
-                                        microsecond: 0,
-                                      )
-                                      .millisecondsSinceEpoch
-                                      .toDouble(),
-                                  x.resultTier.toDouble(),
-                                ),
-                              )
-                              .toList(),
-                        )
-                      ],
-                      lineTouchData: LineTouchData(
-                          touchTooltipData: LineTouchTooltipData(
-                        getTooltipItems: (spots) => spots
-                            .map((spot) => LineTooltipItem(
-                                  '${signSymbols[spot.y.toInt()]}\n${DateFormat('MM/dd').format(DateTime.fromMillisecondsSinceEpoch(spot.x.toInt()))}',
-                                  TextStyle(
-                                    color:
-                                        Theme.of(context).colorScheme.onSurface,
-                                  ),
-                                ))
-                            .toList(),
-                        getTooltipColor: (_) =>
-                            Theme.of(context).colorScheme.surfaceContainerHigh,
-                      )),
-                      titlesData: FlTitlesData(
-                        topTitles: const AxisTitles(
-                          sideTitles: SideTitles(showTitles: false),
-                        ),
-                        rightTitles: const AxisTitles(
-                          sideTitles: SideTitles(showTitles: false),
-                        ),
-                        leftTitles: AxisTitles(
-                          sideTitles: SideTitles(
-                            showTitles: true,
-                            reservedSize: 40,
-                            interval: 1,
-                            getTitlesWidget: (value, _) => Align(
-                              alignment: Alignment.centerRight,
-                              child: Text(
-                                signSymbols[value.toInt()],
-                                textAlign: TextAlign.right,
-                              ).paddingOnly(right: 8),
-                            ),
-                          ),
-                        ),
-                        bottomTitles: AxisTitles(
-                          sideTitles: SideTitles(
-                            showTitles: true,
-                            reservedSize: 28,
-                            interval: 86400000,
-                            getTitlesWidget: (value, _) => Text(
-                              DateFormat('dd').format(
-                                DateTime.fromMillisecondsSinceEpoch(
-                                  value.toInt(),
-                                ),
+          : SizedBox(
+              width: double.maxFinite,
+              child: ListView(
+                shrinkWrap: true,
+                children: [
+                  Text(
+                    'dailySignHistoryRecent'.tr,
+                    style: Theme.of(context).textTheme.titleMedium,
+                  ).paddingOnly(bottom: 18),
+                  SizedBox(
+                    height: 180,
+                    width: max(640, MediaQuery.of(context).size.width),
+                    child: LineChart(
+                      LineChartData(
+                        lineBarsData: [
+                          LineChartBarData(
+                            isCurved: true,
+                            isStrokeCapRound: true,
+                            isStrokeJoinRound: true,
+                            color: Theme.of(context).colorScheme.primary,
+                            belowBarData: BarAreaData(
+                              show: true,
+                              gradient: LinearGradient(
+                                colors: List.filled(
+                                  data!.length,
+                                  Theme.of(context)
+                                      .colorScheme
+                                      .primary
+                                      .withOpacity(0.3),
+                                ).toList(),
                              ),
-                              textAlign: TextAlign.center,
-                            ).paddingOnly(top: 8),
-                          ),
-                        ),
-                      ),
-                      gridData: const FlGridData(show: false),
-                      borderData: FlBorderData(show: false),
-                    ),
-                  ),
-                ).marginOnly(right: 24, bottom: 8, top: 8),
-                const Gap(16),
-                Text(
-                  'dailySignHistoryReward'.tr,
-                  style: Theme.of(context).textTheme.titleMedium,
-                ).paddingOnly(bottom: 18),
-                SizedBox(
-                  height: 180,
-                  width: max(640, MediaQuery.of(context).size.width),
-                  child: LineChart(
-                    LineChartData(
-                      lineBarsData: [
-                        LineChartBarData(
-                          isCurved: true,
-                          isStrokeCapRound: true,
-                          isStrokeJoinRound: true,
-                          color: Theme.of(context).colorScheme.primary,
-                          belowBarData: BarAreaData(
-                            show: true,
-                            gradient: LinearGradient(
-                              colors: List.filled(
-                                data!.length,
-                                Theme.of(context)
-                                    .colorScheme
-                                    .primary
-                                    .withOpacity(0.3),
-                              ).toList(),
                            ),
-                          ),
-                          spots: data!
-                              .map(
-                                (x) => FlSpot(
-                                  x.createdAt
-                                      .copyWith(
-                                        hour: 0,
-                                        minute: 0,
-                                        second: 0,
-                                        millisecond: 0,
-                                        microsecond: 0,
-                                      )
-                                      .millisecondsSinceEpoch
-                                      .toDouble(),
-                                  x.resultExperience.toDouble(),
-                                ),
-                              )
-                              .toList(),
-                        )
-                      ],
-                      lineTouchData: LineTouchData(
-                          touchTooltipData: LineTouchTooltipData(
-                        getTooltipItems: (spots) => spots
-                            .map((spot) => LineTooltipItem(
-                                  '+${spot.y.toStringAsFixed(0)} EXP\n${DateFormat('MM/dd').format(DateTime.fromMillisecondsSinceEpoch(spot.x.toInt()))}',
-                                  TextStyle(
-                                    color:
-                                        Theme.of(context).colorScheme.onSurface,
+                            spots: data!
+                                .map(
+                                  (x) => FlSpot(
+                                    x.createdAt
+                                        .copyWith(
+                                          hour: 0,
+                                          minute: 0,
+                                          second: 0,
+                                          millisecond: 0,
+                                          microsecond: 0,
+                                        )
+                                        .millisecondsSinceEpoch
+                                        .toDouble(),
+                                    x.resultTier.toDouble(),
                                  ),
-                                ))
-                            .toList(),
-                        getTooltipColor: (_) =>
-                            Theme.of(context).colorScheme.surfaceContainerHigh,
-                      )),
-                      titlesData: FlTitlesData(
-                        topTitles: const AxisTitles(
-                          sideTitles: SideTitles(showTitles: false),
+                                )
+                                .toList(),
+                          )
+                        ],
+                        lineTouchData: LineTouchData(
+                          touchTooltipData: LineTouchTooltipData(
+                            getTooltipItems: (spots) => spots
+                                .map((spot) => LineTooltipItem(
+                                      '${signSymbols[spot.y.toInt()]}\n${DateFormat('MM/dd').format(DateTime.fromMillisecondsSinceEpoch(spot.x.toInt()))}',
+                                      TextStyle(
+                                        color: Theme.of(context)
+                                            .colorScheme
+                                            .onSurface,
+                                      ),
+                                    ))
+                                .toList(),
+                            getTooltipColor: (_) => Theme.of(context)
+                                .colorScheme
+                                .surfaceContainerHigh,
+                          ),
                        ),
-                        rightTitles: const AxisTitles(
-                          sideTitles: SideTitles(showTitles: false),
-                        ),
-                        leftTitles: AxisTitles(
-                          sideTitles: SideTitles(
-                            showTitles: true,
-                            reservedSize: 40,
-                            getTitlesWidget: (value, _) => Align(
-                              alignment: Alignment.centerRight,
-                              child: Text(
-                                value.toStringAsFixed(0),
-                                textAlign: TextAlign.right,
-                              ).paddingOnly(right: 8),
+                        titlesData: FlTitlesData(
+                          topTitles: const AxisTitles(
+                            sideTitles: SideTitles(showTitles: false),
+                          ),
+                          rightTitles: const AxisTitles(
+                            sideTitles: SideTitles(showTitles: false),
+                          ),
+                          leftTitles: AxisTitles(
+                            sideTitles: SideTitles(
+                              showTitles: true,
+                              reservedSize: 40,
+                              interval: 1,
+                              getTitlesWidget: (value, _) => Align(
+                                alignment: Alignment.centerRight,
+                                child: Text(
+                                  signSymbols[value.toInt()],
+                                  textAlign: TextAlign.right,
+                                ).paddingOnly(right: 8),
+                              ),
+                            ),
+                          ),
+                          bottomTitles: AxisTitles(
+                            sideTitles: SideTitles(
+                              showTitles: true,
+                              reservedSize: 28,
+                              interval: 86400000,
+                              getTitlesWidget: (value, _) => Text(
+                                DateFormat('dd').format(
+                                  DateTime.fromMillisecondsSinceEpoch(
+                                    value.toInt(),
+                                  ),
+                                ),
+                                textAlign: TextAlign.center,
+                              ).paddingOnly(top: 8),
                            ),
                          ),
                        ),
-                        bottomTitles: AxisTitles(
-                          sideTitles: SideTitles(
-                            showTitles: true,
-                            reservedSize: 28,
-                            interval: 86400000,
-                            getTitlesWidget: (value, _) => Text(
-                              DateFormat('dd').format(
-                                DateTime.fromMillisecondsSinceEpoch(
-                                  value.toInt(),
-                                ),
+                        gridData: const FlGridData(show: false),
+                        borderData: FlBorderData(show: false),
+                      ),
+                    ),
+                  ).marginOnly(right: 24, bottom: 8, top: 8),
+                  const Gap(16),
+                  Text(
+                    'dailySignHistoryReward'.tr,
+                    style: Theme.of(context).textTheme.titleMedium,
+                  ).paddingOnly(bottom: 18),
+                  SizedBox(
+                    height: 180,
+                    width: max(640, MediaQuery.of(context).size.width),
+                    child: LineChart(
+                      LineChartData(
+                        lineBarsData: [
+                          LineChartBarData(
+                            isCurved: true,
+                            isStrokeCapRound: true,
+                            isStrokeJoinRound: true,
+                            color: Theme.of(context).colorScheme.primary,
+                            belowBarData: BarAreaData(
+                              show: true,
+                              gradient: LinearGradient(
+                                colors: List.filled(
+                                  data!.length,
+                                  Theme.of(context)
+                                      .colorScheme
+                                      .primary
+                                      .withOpacity(0.3),
+                                ).toList(),
                              ),
-                              textAlign: TextAlign.center,
-                            ).paddingOnly(top: 8),
+                            ),
+                            spots: data!
+                                .map(
+                                  (x) => FlSpot(
+                                    x.createdAt
+                                        .copyWith(
+                                          hour: 0,
+                                          minute: 0,
+                                          second: 0,
+                                          millisecond: 0,
+                                          microsecond: 0,
+                                        )
+                                        .millisecondsSinceEpoch
+                                        .toDouble(),
+                                    x.resultExperience.toDouble(),
+                                  ),
+                                )
+                                .toList(),
+                          )
+                        ],
+                        lineTouchData: LineTouchData(
+                            touchTooltipData: LineTouchTooltipData(
+                          getTooltipItems: (spots) => spots
+                              .map((spot) => LineTooltipItem(
+                                    '+${spot.y.toStringAsFixed(0)} EXP\n${DateFormat('MM/dd').format(DateTime.fromMillisecondsSinceEpoch(spot.x.toInt()))}',
+                                    TextStyle(
+                                      color: Theme.of(context)
+                                          .colorScheme
+                                          .onSurface,
+                                    ),
+                                  ))
+                              .toList(),
+                          getTooltipColor: (_) => Theme.of(context)
+                              .colorScheme
+                              .surfaceContainerHigh,
+                        )),
+                        titlesData: FlTitlesData(
+                          topTitles: const AxisTitles(
+                            sideTitles: SideTitles(showTitles: false),
+                          ),
+                          rightTitles: const AxisTitles(
+                            sideTitles: SideTitles(showTitles: false),
+                          ),
+                          leftTitles: AxisTitles(
+                            sideTitles: SideTitles(
+                              showTitles: true,
+                              reservedSize: 40,
+                              getTitlesWidget: (value, _) => Align(
+                                alignment: Alignment.centerRight,
+                                child: Text(
+                                  value.toStringAsFixed(0),
+                                  textAlign: TextAlign.right,
+                                ).paddingOnly(right: 8),
+                              ),
+                            ),
+                          ),
+                          bottomTitles: AxisTitles(
+                            sideTitles: SideTitles(
+                              showTitles: true,
+                              reservedSize: 28,
+                              interval: 86400000,
+                              getTitlesWidget: (value, _) => Text(
+                                DateFormat('dd').format(
+                                  DateTime.fromMillisecondsSinceEpoch(
+                                    value.toInt(),
+                                  ),
+                                ),
+                                textAlign: TextAlign.center,
+                              ).paddingOnly(top: 8),
+                            ),
                          ),
                        ),
+                        gridData: const FlGridData(show: false),
+                        borderData: FlBorderData(show: false),
                      ),
-                      gridData: const FlGridData(show: false),
-                      borderData: FlBorderData(show: false),
                    ),
-                  ),
-                ).marginOnly(right: 24, bottom: 8, top: 8),
-              ],
+                  ).marginOnly(right: 24, bottom: 8, top: 8),
+                ],
+              ),
            ),
    );
  }
--- a/lib/widgets/link_expansion.dart
+++ b/lib/widgets/link_expansion.dart
@ -74,9 +74,13 @@ class LinkExpansion extends StatelessWidget {
                                ),
                              ).paddingOnly(right: 8),
                            if (snapshot.data!.siteName != null)
-                              Text(
-                                snapshot.data!.siteName!,
-                                style: Theme.of(context).textTheme.labelLarge,
+                              Expanded(
+                                child: Text(
+                                  snapshot.data!.siteName!,
+                                  style: Theme.of(context).textTheme.labelLarge,
+                                  maxLines: 1,
+                                  overflow: TextOverflow.ellipsis,
+                                ),
                              ),
                          ],
                        ).paddingOnly(
--- a/lib/widgets/markdown_text_content.dart
+++ b/lib/widgets/markdown_text_content.dart
@ -1,5 +1,6 @@
 import 'package:flutter/material.dart';
 import 'package:flutter_markdown_selectionarea/flutter_markdown.dart';
+import 'package:gap/gap.dart';
 import 'package:get/get.dart';
 import 'package:markdown/markdown.dart' as markdown;
 import 'package:markdown/markdown.dart';
@ -14,129 +15,184 @@ class MarkdownTextContent extends StatelessWidget {
  final String content;
  final String parentId;
  final bool isSelectable;
+  final bool isLargeText;
+  final bool isAutoWarp;

  const MarkdownTextContent({
    super.key,
    required this.content,
    required this.parentId,
    this.isSelectable = false,
+    this.isLargeText = false,
+    this.isAutoWarp = false,
  });

  Widget _buildContent(BuildContext context) {
-    final emojiRegex = RegExp(r':([-\w]+):');
-    final emojiMatch = emojiRegex.allMatches(content);
-    final isOnlyEmoji = content.replaceAll(emojiRegex, '').trim().isEmpty;
+    final stickerRegex = RegExp(r':([-\w]+):');

-    return Markdown(
-      shrinkWrap: true,
-      physics: const NeverScrollableScrollPhysics(),
-      data: content,
-      padding: EdgeInsets.zero,
-      styleSheet: MarkdownStyleSheet.fromTheme(
-        Theme.of(context),
-      ).copyWith(
-        horizontalRuleDecoration: BoxDecoration(
-          border: Border(
-            top: BorderSide(
-              width: 1.0,
-              color: Theme.of(context).dividerColor,
+    // Split the content into paragraphs
+    final paragraphs = content.split(RegExp(r'\n\s*\n'));
+
+    // Iterate over each paragraph to process stickers individually
+    List<Widget> contentWidgets = [];
+    for (var idx = 0; idx < paragraphs.length; idx++) {
+      // Getting paragraph
+      var paragraph = paragraphs[idx];
+
+      // Auto adding new-lines
+      if (isAutoWarp) {
+        paragraph = paragraph.replaceAll('\n', '\\\n');
+      }
+
+      // Matching stickers
+      final stickerMatch = stickerRegex.allMatches(paragraph);
+      final isOnlySticker =
+          paragraph.replaceAll(stickerRegex, '').trim().isEmpty;
+
+      contentWidgets.add(
+        Markdown(
+          shrinkWrap: true,
+          physics: const NeverScrollableScrollPhysics(),
+          data: paragraph,
+          padding: EdgeInsets.zero,
+          styleSheet: MarkdownStyleSheet.fromTheme(
+            Theme.of(context),
+          ).copyWith(
+            textScaleFactor: isLargeText ? 1.1 : 1,
+            blockquote: TextStyle(
+              color: Theme.of(context).colorScheme.onSurfaceVariant,
+            ),
+            blockquoteDecoration: BoxDecoration(
+              color: Theme.of(context).colorScheme.surfaceContainerHigh,
+              borderRadius: const BorderRadius.all(Radius.circular(4)),
+            ),
+            horizontalRuleDecoration: BoxDecoration(
+              border: Border(
+                top: BorderSide(
+                  width: 1.0,
+                  color: Theme.of(context).dividerColor,
+                ),
+              ),
            ),
          ),
-        ),
-      ),
-      extensionSet: markdown.ExtensionSet(
-        markdown.ExtensionSet.gitHubFlavored.blockSyntaxes,
-        <markdown.InlineSyntax>[
-          _UserNameCardInlineSyntax(),
-          _CustomEmoteInlineSyntax(),
-          markdown.EmojiSyntax(),
-          markdown.AutolinkSyntax(),
-          markdown.AutolinkExtensionSyntax(),
-          ...markdown.ExtensionSet.gitHubFlavored.inlineSyntaxes
-        ],
-      ),
-      onTapLink: (text, href, title) async {
-        if (href == null) return;
-        if (href.startsWith('solink://')) {
-          final segments = href.replaceFirst('solink://', '').split('/');
-          switch (segments[0]) {
-            case 'users':
-              showModalBottomSheet(
-                useRootNavigator: true,
-                isScrollControlled: true,
-                backgroundColor: Theme.of(context).colorScheme.surface,
-                context: context,
-                builder: (context) => AccountProfilePopup(
-                  name: segments[1],
-                ),
-              );
-          }
-          return;
-        }
-
-        await launchUrlString(
-          href,
-          mode: LaunchMode.externalApplication,
-        );
-      },
-      imageBuilder: (uri, title, alt) {
-        var url = uri.toString();
-        double? width, height;
-        BoxFit? fit;
-        if (url.startsWith('solink://')) {
-          final segments = url.replaceFirst('solink://', '').split('/');
-          switch (segments[0]) {
-            case 'stickers':
-              double radius = 8;
-              final StickerProvider sticker = Get.find();
-              url = sticker.aliasImageMapping[segments[1].toUpperCase()]!;
-              if (emojiMatch.length <= 1 && isOnlyEmoji) {
-                width = 128;
-                height = 128;
-              } else if (emojiMatch.length <= 3 && isOnlyEmoji) {
-                width = 32;
-                height = 32;
-              } else {
-                radius = 4;
-                width = 16;
-                height = 16;
+          extensionSet: markdown.ExtensionSet(
+            markdown.ExtensionSet.gitHubFlavored.blockSyntaxes,
+            <markdown.InlineSyntax>[
+              _UserNameCardInlineSyntax(),
+              _CustomEmoteInlineSyntax(),
+              markdown.EmojiSyntax(),
+              markdown.AutolinkSyntax(),
+              markdown.AutolinkExtensionSyntax(),
+              ...markdown.ExtensionSet.gitHubFlavored.inlineSyntaxes
+            ],
+          ),
+          onTapLink: (text, href, title) async {
+            if (href == null) return;
+            if (href.startsWith('solink://')) {
+              final segments = href.replaceFirst('solink://', '').split('/');
+              switch (segments[0]) {
+                case 'users':
+                  showModalBottomSheet(
+                    useRootNavigator: true,
+                    isScrollControlled: true,
+                    backgroundColor: Theme.of(context).colorScheme.surface,
+                    context: context,
+                    builder: (context) => AccountProfilePopup(
+                      name: segments[1],
+                    ),
+                  );
              }
-              fit = BoxFit.contain;
-              return ClipRRect(
-                borderRadius: BorderRadius.all(Radius.circular(radius)),
-                child: Container(
-                  color: Theme.of(context).colorScheme.surfaceContainer,
-                  child: AutoCacheImage(
-                    url,
-                    width: width,
-                    height: height,
-                    fit: fit,
-                  ),
-                ),
-              ).paddingSymmetric(vertical: 4);
-            case 'attachments':
-              const radius = BorderRadius.all(Radius.circular(8));
-              return LimitedBox(
-                maxHeight: MediaQuery.of(context).size.width,
-                child: ClipRRect(
-                  borderRadius: radius,
-                  child: AttachmentSelfContainedEntry(
-                    isDense: true,
-                    parentId: parentId,
-                    rid: segments[1],
-                  ),
-                ),
-              ).paddingSymmetric(vertical: 4);
-          }
-        }
+              return;
+            }

-        return AutoCacheImage(
-          url,
-          width: width,
-          height: height,
-          fit: fit,
-        );
-      },
+            await launchUrlString(
+              href,
+              mode: LaunchMode.externalApplication,
+            );
+          },
+          imageBuilder: (uri, title, alt) {
+            var url = uri.toString();
+            double? width, height;
+            BoxFit? fit;
+            if (url.startsWith('solink://')) {
+              final segments = url.replaceFirst('solink://', '').split('/');
+              switch (segments[0]) {
+                case 'stickers':
+                  double radius = 8;
+                  final StickerProvider sticker = Get.find();
+
+                  // Adjust sticker size based on the sticker count in this paragraph
+                  if (stickerMatch.length <= 1 && isOnlySticker) {
+                    width = 128;
+                    height = 128;
+                  } else if (stickerMatch.length <= 3 && isOnlySticker) {
+                    width = 32;
+                    height = 32;
+                  } else {
+                    radius = 4;
+                    width = 16;
+                    height = 16;
+                  }
+                  fit = BoxFit.contain;
+                  return ClipRRect(
+                    borderRadius: BorderRadius.all(Radius.circular(radius)),
+                    child: Container(
+                      width: width,
+                      height: height,
+                      color: Theme.of(context).colorScheme.surfaceContainer,
+                      child: FutureBuilder(
+                        future: sticker.getStickerByAlias(segments[1]),
+                        builder: (context, snapshot) {
+                          if (!snapshot.hasData) {
+                            return const Center(
+                                child: CircularProgressIndicator());
+                          }
+                          return AutoCacheImage(
+                            snapshot.data!.imageUrl,
+                            width: width,
+                            height: height,
+                            fit: fit,
+                            noErrorWidget: true,
+                          );
+                        },
+                      ),
+                    ),
+                  ).paddingSymmetric(vertical: 4);
+                case 'attachments':
+                  const radius = BorderRadius.all(Radius.circular(8));
+                  return LimitedBox(
+                    maxHeight: MediaQuery.of(context).size.width,
+                    child: ClipRRect(
+                      borderRadius: radius,
+                      child: AttachmentSelfContainedEntry(
+                        isDense: true,
+                        parentId: parentId,
+                        rid: segments[1],
+                      ),
+                    ),
+                  ).paddingSymmetric(vertical: 4);
+              }
+            }
+            return AutoCacheImage(
+              url,
+              width: width,
+              height: height,
+              fit: fit,
+            );
+          },
+        ),
+      );
+
+      if (idx < paragraphs.length - 1) {
+        contentWidgets.add(const Gap(4));
+      }
+    }
+
+    // Return the list of widgets for the paragraphs
+    return Column(
+      mainAxisSize: MainAxisSize.min,
+      crossAxisAlignment: CrossAxisAlignment.start,
+      children: contentWidgets,
    );
  }

@ -172,7 +228,8 @@ class _CustomEmoteInlineSyntax extends InlineSyntax {
  bool onMatch(markdown.InlineParser parser, Match match) {
    final StickerProvider sticker = Get.find();
    final alias = match[1]!.toUpperCase();
-    if (sticker.aliasImageMapping[alias] == null) {
+    if (sticker.stickerCache.containsKey(alias) &&
+        sticker.stickerCache[alias] == null) {
      parser.advanceBy(1);
      return false;
    }
--- a/lib/widgets/navigation/app_account_widget.dart
+++ b/lib/widgets/navigation/app_account_widget.dart
@ -0,0 +1,80 @@
+import 'package:flutter/material.dart';
+import 'package:get/get.dart';
+import 'package:solian/models/account_status.dart';
+import 'package:solian/providers/account_status.dart';
+import 'package:solian/providers/auth.dart';
+import 'package:solian/providers/relation.dart';
+import 'package:badges/badges.dart' as badges;
+import 'package:solian/widgets/account/account_avatar.dart';
+
+class AppAccountWidget extends StatefulWidget {
+  const AppAccountWidget({super.key});
+
+  @override
+  State<AppAccountWidget> createState() => _AppAccountWidgetState();
+}
+
+class _AppAccountWidgetState extends State<AppAccountWidget> {
+  AccountStatus? _accountStatus;
+
+  Future<void> _getStatus() async {
+    final StatusProvider provider = Get.find();
+
+    final resp = await provider.getCurrentStatus();
+    final status = AccountStatus.fromJson(resp.body);
+
+    if (mounted) {
+      setState(() {
+        _accountStatus = status;
+      });
+    }
+  }
+
+  @override
+  void initState() {
+    super.initState();
+    _getStatus();
+  }
+
+  @override
+  Widget build(BuildContext context) {
+    final AuthProvider auth = Get.find();
+
+    return Obx(() {
+      if (auth.isAuthorized.isFalse || auth.userProfile.value == null) {
+        return const Icon(Icons.account_circle);
+      }
+
+      final statusBadgeColor = _accountStatus != null
+          ? StatusProvider.determineStatus(_accountStatus!).$2
+          : Colors.grey;
+
+      final RelationshipProvider relations = Get.find();
+      final accountNotifications = relations.friendRequestCount.value;
+
+      return badges.Badge(
+        badgeContent: Text(
+          accountNotifications.toString(),
+          style: const TextStyle(color: Colors.white),
+        ),
+        showBadge: accountNotifications > 0,
+        position: badges.BadgePosition.topEnd(
+          top: -10,
+          end: -6,
+        ),
+        child: badges.Badge(
+          showBadge: _accountStatus != null,
+          badgeStyle: badges.BadgeStyle(badgeColor: statusBadgeColor),
+          position: badges.BadgePosition.bottomEnd(
+            bottom: 0,
+            end: -2,
+          ),
+          child: AccountAvatar(
+            radius: 14,
+            content: auth.userProfile.value!['avatar'],
+          ),
+        ),
+      );
+    });
+  }
+}
--- a/lib/widgets/navigation/app_navigation.dart
+++ b/lib/widgets/navigation/app_navigation.dart
@ -1,27 +1,33 @@
 import 'package:flutter/material.dart';
 import 'package:get/utils.dart';
+import 'package:solian/widgets/navigation/app_account_widget.dart';

 abstract class AppNavigation {
  static List<AppNavigationDestination> destinations = [
    AppNavigationDestination(
-      icon: Icons.dashboard,
-      label: 'dashboard'.tr,
+      icon: const Icon(Icons.dashboard),
+      label: 'dashboardNav'.tr,
      page: 'dashboard',
    ),
    AppNavigationDestination(
-      icon: Icons.newspaper,
-      label: 'feed'.tr,
-      page: 'feed',
+      icon: const Icon(Icons.explore),
+      label: 'explore'.tr,
+      page: 'explore',
    ),
    AppNavigationDestination(
-      icon: Icons.workspaces,
+      icon: const Icon(Icons.forum),
+      label: 'chat'.tr,
+      page: 'chat',
+    ),
+    AppNavigationDestination(
+      icon: const Icon(Icons.workspaces),
      label: 'realms'.tr,
      page: 'realms',
    ),
    AppNavigationDestination(
-      icon: Icons.forum,
-      label: 'chat'.tr,
-      page: 'chat',
+      icon: const AppAccountWidget(),
+      label: 'accountNav'.tr,
+      page: 'account',
    ),
  ];

@ -30,7 +36,7 @@ abstract class AppNavigation {
 }

 class AppNavigationDestination {
-  final IconData icon;
+  final Widget icon;
  final String label;
  final String page;

--- a/lib/widgets/navigation/app_navigation_bottom.dart
+++ b/lib/widgets/navigation/app_navigation_bottom.dart
@ -0,0 +1,47 @@
+import 'package:flutter/material.dart';
+import 'package:solian/router.dart';
+import 'package:solian/widgets/navigation/app_navigation.dart';
+
+class AppNavigationBottom extends StatefulWidget {
+  final int initialIndex;
+
+  const AppNavigationBottom({super.key, this.initialIndex = 0});
+
+  @override
+  State<AppNavigationBottom> createState() => _AppNavigationBottomState();
+}
+
+class _AppNavigationBottomState extends State<AppNavigationBottom> {
+  int _currentIndex = 0;
+
+  @override
+  void initState() {
+    super.initState();
+    if (widget.initialIndex >= 0) {
+      _currentIndex = widget.initialIndex;
+    }
+  }
+
+  @override
+  Widget build(BuildContext context) {
+    return BottomNavigationBar(
+      currentIndex: _currentIndex,
+      type: BottomNavigationBarType.fixed,
+      showUnselectedLabels: false,
+      showSelectedLabels: true,
+      landscapeLayout: BottomNavigationBarLandscapeLayout.centered,
+      items: AppNavigation.destinations
+          .map(
+            (x) => BottomNavigationBarItem(
+              icon: x.icon,
+              label: x.label,
+            ),
+          )
+          .toList(),
+      onTap: (idx) {
+        setState(() => _currentIndex = idx);
+        AppRouter.instance.goNamed(AppNavigation.destinations[idx].page);
+      },
+    );
+  }
+}
--- a/lib/widgets/navigation/app_navigation_drawer.dart
+++ b/lib/widgets/navigation/app_navigation_drawer.dart
@ -1,330 +0,0 @@
-import 'dart:math' as math;
-
-import 'package:flutter/material.dart';
-import 'package:get/get.dart';
-import 'package:solian/models/account_status.dart';
-import 'package:solian/providers/account_status.dart';
-import 'package:solian/providers/auth.dart';
-import 'package:solian/providers/relation.dart';
-import 'package:solian/router.dart';
-import 'package:solian/shells/root_shell.dart';
-import 'package:solian/theme.dart';
-import 'package:solian/widgets/account/account_avatar.dart';
-import 'package:solian/widgets/account/account_status_action.dart';
-import 'package:solian/widgets/navigation/app_navigation.dart';
-import 'package:badges/badges.dart' as badges;
-import 'package:solian/widgets/navigation/app_navigation_region.dart';
-
-class AppNavigationDrawer extends StatefulWidget {
-  final String? routeName;
-
-  const AppNavigationDrawer({super.key, this.routeName});
-
-  @override
-  State<AppNavigationDrawer> createState() => _AppNavigationDrawerState();
-}
-
-class _AppNavigationDrawerState extends State<AppNavigationDrawer>
-    with TickerProviderStateMixin {
-  bool _isCollapsed = true;
-
-  late final AnimationController _drawerAnimationController =
-      AnimationController(
-    duration: const Duration(milliseconds: 500),
-    vsync: this,
-  );
-  late final Animation<double> _drawerAnimation = Tween<double>(
-    begin: 80.0,
-    end: 304.0,
-  ).animate(CurvedAnimation(
-    parent: _drawerAnimationController,
-    curve: Curves.easeInOut,
-  ));
-
-  AccountStatus? _accountStatus;
-
-  Future<void> _getStatus() async {
-    final StatusProvider provider = Get.find();
-
-    final resp = await provider.getCurrentStatus();
-    final status = AccountStatus.fromJson(resp.body);
-
-    if (mounted) {
-      setState(() {
-        _accountStatus = status;
-      });
-    }
-  }
-
-  Color get _unFocusColor =>
-      Theme.of(context).colorScheme.onSurface.withOpacity(0.75);
-
-  Widget _buildUserInfo() {
-    return Obx(() {
-      final AuthProvider auth = Get.find();
-      if (auth.isAuthorized.isFalse || auth.userProfile.value == null) {
-        if (_isCollapsed) {
-          return InkWell(
-            child: const Icon(Icons.account_circle).paddingSymmetric(
-              horizontal: 28,
-              vertical: 20,
-            ),
-            onTap: () {
-              AppRouter.instance.goNamed('account');
-              _closeDrawer();
-            },
-          );
-        }
-
-        return ListTile(
-          contentPadding: const EdgeInsets.symmetric(horizontal: 28),
-          leading: const Icon(Icons.account_circle),
-          title: !_isCollapsed ? Text('guest'.tr) : null,
-          subtitle: !_isCollapsed ? Text('unsignedIn'.tr) : null,
-          onTap: () {
-            AppRouter.instance.goNamed('account');
-            _closeDrawer();
-          },
-        );
-      }
-
-      final leading = Obx(() {
-        final statusBadgeColor = _accountStatus != null
-            ? StatusProvider.determineStatus(_accountStatus!).$2
-            : Colors.grey;
-
-        final RelationshipProvider relations = Get.find();
-        final accountNotifications = relations.friendRequestCount.value;
-
-        return badges.Badge(
-          badgeContent: Text(
-            accountNotifications.toString(),
-            style: const TextStyle(color: Colors.white),
-          ),
-          showBadge: accountNotifications > 0,
-          position: badges.BadgePosition.topEnd(
-            top: -10,
-            end: -6,
-          ),
-          child: badges.Badge(
-            showBadge: _accountStatus != null,
-            badgeStyle: badges.BadgeStyle(badgeColor: statusBadgeColor),
-            position: badges.BadgePosition.bottomEnd(
-              bottom: 0,
-              end: -2,
-            ),
-            child: AccountAvatar(
-              content: auth.userProfile.value!['avatar'],
-            ),
-          ),
-        );
-      });
-
-      return InkWell(
-        child: !_isCollapsed
-            ? Row(
-                children: [
-                  leading,
-                  Expanded(
-                    child: Column(
-                      crossAxisAlignment: CrossAxisAlignment.start,
-                      children: [
-                        Text(
-                          auth.userProfile.value!['nick'],
-                          maxLines: 1,
-                          overflow: TextOverflow.fade,
-                          style: Theme.of(context).textTheme.bodyLarge,
-                        ).paddingOnly(left: 16),
-                        Builder(
-                          builder: (context) {
-                            if (_accountStatus == null) {
-                              return Text(
-                                'loading'.tr,
-                                maxLines: 1,
-                                overflow: TextOverflow.fade,
-                                style: TextStyle(
-                                  color: _unFocusColor,
-                                ),
-                              ).paddingOnly(left: 16);
-                            }
-                            final info = StatusProvider.determineStatus(
-                              _accountStatus!,
-                            );
-                            return Text(
-                              info.$3,
-                              maxLines: 1,
-                              overflow: TextOverflow.fade,
-                              style: TextStyle(
-                                color: _unFocusColor,
-                              ),
-                            ).paddingOnly(left: 16);
-                          },
-                        ),
-                      ],
-                    ),
-                  ),
-                ],
-              ).paddingSymmetric(horizontal: 20, vertical: 16)
-            : leading.paddingSymmetric(horizontal: 20, vertical: 16),
-        onTap: () {
-          AppRouter.instance.goNamed('account');
-          _closeDrawer();
-        },
-        onLongPress: () {
-          showModalBottomSheet(
-            useRootNavigator: true,
-            context: context,
-            builder: (context) => AccountStatusAction(
-              currentStatus: _accountStatus!.status,
-            ),
-          ).then((val) {
-            if (val == true) _getStatus();
-          });
-        },
-      );
-    });
-  }
-
-  void _expandDrawer() {
-    _drawerAnimationController.animateTo(1);
-  }
-
-  void _collapseDrawer() {
-    _drawerAnimationController.animateTo(0);
-  }
-
-  void _closeDrawer() {
-    _autoResize();
-    rootScaffoldKey.currentState!.closeDrawer();
-  }
-
-  void _autoResize() {
-    if (AppTheme.isExtraLargeScreen(context)) {
-      _expandDrawer();
-    } else if (AppTheme.isLargeScreen(context)) {
-      _collapseDrawer();
-    } else {
-      _drawerAnimationController.value = 1;
-    }
-  }
-
-  @override
-  void initState() {
-    super.initState();
-    final AuthProvider auth = Get.find();
-    if (auth.isAuthorized.value) _getStatus();
-    Future.delayed(Duration.zero, () => _autoResize());
-    _drawerAnimationController.addListener(() {
-      if (_drawerAnimation.value > 180 && _isCollapsed) {
-        setState(() => _isCollapsed = false);
-      } else if (_drawerAnimation.value < 180 && !_isCollapsed) {
-        setState(() => _isCollapsed = true);
-      }
-    });
-  }
-
-  @override
-  void dispose() {
-    _drawerAnimationController.dispose();
-    super.dispose();
-  }
-
-  @override
-  Widget build(BuildContext context) {
-    return AnimatedBuilder(
-      animation: _drawerAnimation,
-      builder: (context, child) {
-        return Drawer(
-          width: _drawerAnimation.value,
-          backgroundColor:
-              AppTheme.isLargeScreen(context) ? Colors.transparent : null,
-          child: child,
-        );
-      },
-      child: SafeArea(
-        bottom: false,
-        child: Column(
-          children: [
-            _buildUserInfo().paddingSymmetric(vertical: 8),
-            const Divider(thickness: 0.3, height: 1),
-            SizedBox(
-              width: double.infinity,
-              child: Wrap(
-                runSpacing: 8,
-                spacing: 8,
-                alignment: WrapAlignment.spaceAround,
-                children: AppNavigation.destinations
-                    .map(
-                      (e) => Tooltip(
-                        message: e.label,
-                        child: InkWell(
-                          borderRadius:
-                              const BorderRadius.all(Radius.circular(8)),
-                          child: Icon(
-                            e.icon,
-                            size: 22,
-                            color: Theme.of(context).colorScheme.onSurface,
-                          ).paddingAll(16),
-                          onTap: () {
-                            AppRouter.instance.goNamed(e.page);
-                            _closeDrawer();
-                          },
-                        ),
-                      ),
-                    )
-                    .toList(),
-              ).paddingSymmetric(vertical: 8, horizontal: 12),
-            ),
-            const Divider(thickness: 0.3, height: 1),
-            Expanded(
-              child: Material(
-                color: Theme.of(context).colorScheme.surface,
-                child: AppNavigationRegion(
-                  isCollapsed: _isCollapsed,
-                  onSelected: () {
-                    _closeDrawer();
-                  },
-                ),
-              ),
-            ),
-            const Divider(thickness: 0.3, height: 1),
-            Column(
-              children: [
-                if (_isCollapsed)
-                  Tooltip(
-                    message: 'expand'.tr,
-                    child: InkWell(
-                      child: const Icon(Icons.chevron_right, size: 20)
-                          .paddingSymmetric(
-                        horizontal: 28,
-                        vertical: 10,
-                      ),
-                      onTap: () {
-                        _expandDrawer();
-                      },
-                    ),
-                  )
-                else
-                  ListTile(
-                    minTileHeight: 0,
-                    contentPadding: const EdgeInsets.symmetric(
-                      horizontal: 20,
-                    ),
-                    leading:
-                        const Icon(Icons.chevron_left, size: 20).paddingAll(2),
-                    title: Text('collapse'.tr),
-                    onTap: () {
-                      _collapseDrawer();
-                    },
-                  ),
-              ],
-            ).paddingOnly(
-              top: 8,
-              bottom: math.max(8, MediaQuery.of(context).padding.bottom),
-            ),
-          ],
-        ),
-      ),
-    );
-  }
-}
--- a/lib/widgets/navigation/app_navigation_rail.dart
+++ b/lib/widgets/navigation/app_navigation_rail.dart
@ -0,0 +1,65 @@
+import 'dart:math';
+
+import 'package:flutter/material.dart';
+import 'package:get/get.dart';
+import 'package:solian/router.dart';
+import 'package:solian/widgets/navigation/app_navigation.dart';
+
+class AppNavigationRail extends StatefulWidget {
+  final int initialIndex;
+
+  const AppNavigationRail({super.key, this.initialIndex = 0});
+
+  @override
+  State<AppNavigationRail> createState() => _AppNavigationRailState();
+}
+
+class _AppNavigationRailState extends State<AppNavigationRail> {
+  int? _currentIndex = 0;
+
+  @override
+  void initState() {
+    super.initState();
+    if (widget.initialIndex >= 0) {
+      _currentIndex = widget.initialIndex;
+    }
+  }
+
+  @override
+  Widget build(BuildContext context) {
+    return NavigationRail(
+      selectedIndex: _currentIndex,
+      labelType: NavigationRailLabelType.selected,
+      groupAlignment: -1,
+      destinations: AppNavigation.destinations
+          .sublist(0, AppNavigation.destinations.length - 1)
+          .map(
+            (x) => NavigationRailDestination(
+              icon: x.icon,
+              label: Text(x.label),
+            ),
+          )
+          .toList(),
+      trailing: Expanded(
+        child: Align(
+          alignment: Alignment.bottomCenter,
+          child: IconButton(
+            icon: AppNavigation.destinations.last.icon,
+            tooltip: AppNavigation.destinations.last.label,
+            onPressed: () {
+              setState(() => _currentIndex = null);
+              AppRouter.instance.goNamed(AppNavigation.destinations.last.page);
+            },
+          ),
+        ),
+      ),
+      onDestinationSelected: (idx) {
+        setState(() => _currentIndex = idx);
+        AppRouter.instance.goNamed(AppNavigation.destinations[idx].page);
+      },
+    ).paddingOnly(
+      top: max(16, MediaQuery.of(context).padding.top),
+      bottom: max(16, MediaQuery.of(context).padding.bottom),
+    );
+  }
+}
--- a/lib/widgets/navigation/app_navigation_region.dart
+++ b/lib/widgets/navigation/app_navigation_region.dart
@ -1,218 +0,0 @@
-import 'package:flutter/material.dart';
-import 'package:get/get.dart';
-import 'package:solian/models/realm.dart';
-import 'package:solian/providers/auth.dart';
-import 'package:solian/providers/content/channel.dart';
-import 'package:solian/providers/content/realm.dart';
-import 'package:solian/providers/navigation.dart';
-import 'package:solian/widgets/account/account_avatar.dart';
-import 'package:solian/widgets/channel/channel_list.dart';
-
-class AppNavigationRegion extends StatefulWidget {
-  final bool isCollapsed;
-  final Function onSelected;
-
-  const AppNavigationRegion({
-    super.key,
-    this.isCollapsed = false,
-    required this.onSelected,
-  });
-
-  @override
-  State<AppNavigationRegion> createState() => _AppNavigationRegionState();
-}
-
-class _AppNavigationRegionState extends State<AppNavigationRegion> {
-  bool _isTryingExit = false;
-
-  void _focusRealm(Realm item) {
-    setState(
-      () => Get.find<NavigationStateProvider>().focusedRealm.value = item,
-    );
-  }
-
-  void _unFocusRealm() {
-    setState(
-      () => Get.find<NavigationStateProvider>().focusedRealm.value = null,
-    );
-  }
-
-  @override
-  void dispose() {
-    super.dispose();
-  }
-
-  Widget _buildRealmFocusAvatar() {
-    final focusedRealm = Get.find<NavigationStateProvider>().focusedRealm.value;
-    return GestureDetector(
-      child: MouseRegion(
-        child: AnimatedSwitcher(
-          switchInCurve: Curves.fastOutSlowIn,
-          switchOutCurve: Curves.fastOutSlowIn,
-          duration: const Duration(milliseconds: 300),
-          transitionBuilder: (child, animation) {
-            return ScaleTransition(
-              scale: animation,
-              child: child,
-            );
-          },
-          child: _isTryingExit
-              ? CircleAvatar(
-                  backgroundColor: Theme.of(context).colorScheme.primary,
-                  child: const Icon(
-                    Icons.arrow_back,
-                    color: Colors.white,
-                    size: 16,
-                  ),
-                ).paddingSymmetric(
-                  vertical: 8,
-                )
-              : _buildEntryAvatar(focusedRealm!),
-        ),
-        onEnter: (_) => setState(() => _isTryingExit = true),
-        onExit: (_) => setState(() => _isTryingExit = false),
-      ),
-      onTap: () => _unFocusRealm(),
-    );
-  }
-
-  Widget _buildEntryAvatar(Realm item) {
-    return Hero(
-      tag: Key('region-realm-avatar-${item.id}'),
-      child: (item.avatar?.isNotEmpty ?? false)
-          ? AccountAvatar(content: item.avatar)
-          : CircleAvatar(
-              backgroundColor: Theme.of(context).colorScheme.primary,
-              child: const Icon(
-                Icons.workspaces,
-                color: Colors.white,
-                size: 16,
-              ),
-            ).paddingSymmetric(
-              vertical: 8,
-            ),
-    );
-  }
-
-  Widget _buildEntry(BuildContext context, Realm item) {
-    const padding = EdgeInsets.symmetric(horizontal: 20, vertical: 8);
-
-    if (widget.isCollapsed) {
-      return InkWell(
-        child: _buildEntryAvatar(item).paddingSymmetric(vertical: 8),
-        onTap: () => _focusRealm(item),
-      );
-    }
-
-    return ListTile(
-      minTileHeight: 0,
-      leading: _buildEntryAvatar(item),
-      contentPadding: padding,
-      title: Text(item.name),
-      subtitle: Text(
-        item.description,
-        maxLines: 1,
-        overflow: TextOverflow.ellipsis,
-      ),
-      onTap: () => _focusRealm(item),
-    );
-  }
-
-  @override
-  Widget build(BuildContext context) {
-    final RealmProvider realms = Get.find();
-    final ChannelProvider channels = Get.find();
-    final AuthProvider auth = Get.find();
-    final NavigationStateProvider navState = Get.find();
-
-    return Obx(
-      () => AnimatedSwitcher(
-        switchInCurve: Curves.fastOutSlowIn,
-        switchOutCurve: Curves.fastOutSlowIn,
-        duration: const Duration(milliseconds: 300),
-        transitionBuilder: (child, animation) {
-          return SlideTransition(
-            position: Tween<Offset>(
-              begin: const Offset(1.0, 0.0),
-              end: Offset.zero,
-            ).animate(animation),
-            child: Material(
-              color: Theme.of(context).colorScheme.surface,
-              child: child,
-            ),
-          );
-        },
-        child: navState.focusedRealm.value == null
-            ? widget.isCollapsed
-                ? CustomScrollView(
-                    slivers: [
-                      const SliverPadding(padding: EdgeInsets.only(top: 16)),
-                      SliverList.builder(
-                        itemCount: realms.availableRealms.length,
-                        itemBuilder: (context, index) {
-                          final element = realms.availableRealms[index];
-                          return Tooltip(
-                            message: element.name,
-                            child: _buildEntry(context, element),
-                          );
-                        },
-                      ),
-                    ],
-                  )
-                : CustomScrollView(
-                    slivers: [
-                      SliverList.builder(
-                        itemCount: realms.availableRealms.length,
-                        itemBuilder: (context, index) {
-                          final element = realms.availableRealms[index];
-                          return _buildEntry(context, element);
-                        },
-                      ),
-                    ],
-                  )
-            : Column(
-                children: [
-                  if (widget.isCollapsed)
-                    Tooltip(
-                      message: navState.focusedRealm.value!.name,
-                      child: _buildRealmFocusAvatar().paddingOnly(
-                        top: 24,
-                        bottom: 8,
-                      ),
-                    )
-                  else
-                    ListTile(
-                      minTileHeight: 0,
-                      tileColor:
-                          Theme.of(context).colorScheme.surfaceContainerLow,
-                      leading: _buildRealmFocusAvatar(),
-                      contentPadding: const EdgeInsets.symmetric(
-                          horizontal: 20, vertical: 8),
-                      title: Text(navState.focusedRealm.value!.name),
-                      subtitle: Text(
-                        navState.focusedRealm.value!.description,
-                        maxLines: 1,
-                        overflow: TextOverflow.ellipsis,
-                      ),
-                    ),
-                  Expanded(
-                    child: Obx(
-                      () => ChannelListWidget(
-                        useReplace: true,
-                        channels: channels.availableChannels
-                            .where((x) =>
-                                x.realm?.id == navState.focusedRealm.value?.id)
-                            .toList(),
-                        isCollapsed: widget.isCollapsed,
-                        selfId: auth.userProfile.value!['id'],
-                        noCategory: true,
-                        onSelected: (_) => widget.onSelected(),
-                      ),
-                    ),
-                  ),
-                ],
-              ),
-      ),
-    );
-  }
-}
--- a/lib/widgets/navigation/realm_switcher.dart
+++ b/lib/widgets/navigation/realm_switcher.dart
@ -0,0 +1,92 @@
+import 'dart:math';
+
+import 'package:dropdown_button2/dropdown_button2.dart';
+import 'package:flutter/material.dart';
+import 'package:gap/gap.dart';
+import 'package:get/get.dart';
+import 'package:solian/models/realm.dart';
+import 'package:solian/providers/content/realm.dart';
+import 'package:solian/providers/navigation.dart';
+import 'package:solian/widgets/account/account_avatar.dart';
+
+class RealmSwitcher extends StatelessWidget {
+  const RealmSwitcher({super.key});
+
+  @override
+  Widget build(BuildContext context) {
+    final realms = Get.find<RealmProvider>();
+    final navState = Get.find<NavigationStateProvider>();
+
+    return Obx(() {
+      return DropdownButtonHideUnderline(
+        child: DropdownButton2<Realm?>(
+          iconStyleData: const IconStyleData(iconSize: 0),
+          isExpanded: true,
+          hint: Text(
+            'Realm Region',
+            style: TextStyle(
+              fontSize: 14,
+              color: Theme.of(context).hintColor,
+            ),
+          ),
+          items: [null, ...realms.availableRealms]
+              .map((Realm? item) => DropdownMenuItem<Realm?>(
+                    value: item,
+                    child: Row(
+                      mainAxisAlignment: MainAxisAlignment.center,
+                      children: [
+                        if (item != null)
+                          AccountAvatar(
+                            content: item.avatar,
+                            radius: 14,
+                            fallbackWidget: const Icon(
+                              Icons.workspaces,
+                              size: 16,
+                            ),
+                          )
+                        else
+                          CircleAvatar(
+                            backgroundColor:
+                                Theme.of(context).colorScheme.primary,
+                            radius: 14,
+                            child: const Icon(
+                              Icons.public,
+                              color: Colors.white,
+                              size: 16,
+                            ),
+                          ),
+                        const Gap(8),
+                        Expanded(
+                          child: Text(
+                            item?.name ?? 'global'.tr,
+                            style: const TextStyle(
+                              fontSize: 14,
+                            ),
+                            maxLines: 2,
+                            overflow: TextOverflow.ellipsis,
+                          ),
+                        ),
+                      ],
+                    ),
+                  ))
+              .toList(),
+          value: navState.focusedRealm.value,
+          onChanged: (Realm? value) {
+            navState.focusedRealm.value = value;
+          },
+          buttonStyleData: ButtonStyleData(
+            height: 48,
+            width: max(200, MediaQuery.of(context).size.width * 0.4),
+            padding: const EdgeInsets.symmetric(horizontal: 16),
+            decoration: const BoxDecoration(
+              borderRadius: BorderRadius.all(Radius.circular(16)),
+            ),
+          ),
+          menuItemStyleData: const MenuItemStyleData(
+            height: 48,
+          ),
+        ),
+      );
+    });
+  }
+}
--- a/lib/widgets/posts/editor/post_editor_thumbnail.dart
+++ b/lib/widgets/posts/editor/post_editor_thumbnail.dart
@ -1,5 +1,4 @@
 import 'package:flutter/material.dart';
-import 'package:gap/gap.dart';
 import 'package:get/get.dart';
 import 'package:solian/controllers/post_editor_controller.dart';
 import 'package:solian/widgets/attachments/attachment_editor.dart';
@ -30,7 +29,7 @@ class _PostEditorThumbnailDialogState extends State<PostEditorThumbnailDialog> {
            _attachmentController.text = value.toString();
          });

-          widget.controller.thumbnail.value = value;
+          widget.controller.thumbnail.value = value.isEmpty ? null : value;
        },
        initialAttachments: const [],
        onRemove: (_) {},
@ -58,18 +57,25 @@ class _PostEditorThumbnailDialogState extends State<PostEditorThumbnailDialog> {
      content: Column(
        mainAxisSize: MainAxisSize.min,
        children: [
-          ListTile(
-            title: Text('postThumbnailAttachmentNew'.tr),
-            contentPadding: const EdgeInsets.only(left: 16, right: 13),
-            trailing: const Icon(Icons.chevron_right),
-            shape: const RoundedRectangleBorder(
-              borderRadius: BorderRadius.all(Radius.circular(8)),
+          Card(
+            margin: EdgeInsets.zero,
+            child: ListTile(
+              title: Text('postThumbnailAttachmentNew'.tr),
+              contentPadding: const EdgeInsets.only(left: 12, right: 9),
+              trailing: const Icon(Icons.chevron_right),
+              shape: const RoundedRectangleBorder(
+                borderRadius: BorderRadius.all(Radius.circular(8)),
+              ),
+              onTap: () {
+                _promptUploadNewAttachment();
+              },
            ),
-            onTap: () {
-              _promptUploadNewAttachment();
-            },
          ),
-          const Gap(8),
+          const Row(children: <Widget>[
+            Expanded(child: Divider()),
+            Text('OR'),
+            Expanded(child: Divider()),
+          ]).paddingOnly(top: 12, bottom: 16, left: 16, right: 16),
          TextField(
            controller: _attachmentController,
            decoration: InputDecoration(
@ -85,7 +91,8 @@ class _PostEditorThumbnailDialogState extends State<PostEditorThumbnailDialog> {
      actions: [
        TextButton(
          onPressed: () {
-            widget.controller.thumbnail.value = _attachmentController.text;
+            final text = _attachmentController.text;
+            widget.controller.thumbnail.value = text.isEmpty ? null : text;
            Navigator.pop(context);
          },
          child: Text('confirm'.tr),
--- a/Show More
+++ b/Show More
Author	SHA1	Message	Date
LittleSheep	c5258cb9ca	🚀 Launch 1.3.6+3	2024-10-06 19:57:17 +08:00
LittleSheep	47c535910d	💄 Optimize the style with background image	2024-10-06 19:54:32 +08:00
LittleSheep	66f2f33394	🐛 Bug fixes with background image	2024-10-06 19:41:44 +08:00
LittleSheep	f5fbe1f483	✨ Better theme & background image	2024-10-06 19:29:47 +08:00
LittleSheep	fcf4dc7a2d	♻️ Use unified root container	2024-10-06 17:37:07 +08:00
LittleSheep	43b7059957	🐛 Bug fixes and optimization	2024-10-06 17:31:44 +08:00
LittleSheep	11c913af60	🚀 Launch 1.3.6+1	2024-10-06 11:34:12 +08:00
LittleSheep	db8f0d63e1	🐛 Fix responsive chat issue	2024-10-06 11:12:54 +08:00
LittleSheep	4036a79995	🐛 Fix some building time problem	2024-10-06 01:53:36 +08:00
LittleSheep	859bbd09e0	🚀 Launch 1.3.0+1	2024-10-06 01:43:10 +08:00
LittleSheep	60033fdef3	🐛 Fix platform specific bugs & crashes	2024-10-06 01:42:51 +08:00
LittleSheep	9c3d181deb	📱 Optimize the call experience on landscape device	2024-10-06 01:25:10 +08:00
LittleSheep	9e6829bd5a	📱 New layout for the landscape device	2024-10-06 01:17:49 +08:00
LittleSheep	f50461a7f7	💄 Better chat list	2024-10-05 23:12:23 +08:00
LittleSheep	147879e4d8	⚡ Better last message preview	2024-10-05 15:11:48 +08:00
LittleSheep	f353c05cb5	💄 Better way to switch focused realm	2024-10-05 14:25:57 +08:00
LittleSheep	ac60043ca7	🐛 Bug fixes	2024-10-05 03:38:30 +08:00
LittleSheep	8d79274b0c	🐛 Fix dm channel display error with deleted user	2024-10-05 03:21:53 +08:00
LittleSheep	ad4e4071fa	♻️ Use bottom navigation bar instead	2024-10-05 03:14:52 +08:00
LittleSheep	c59f77c877	🐛 Fix windows rendering lack	2024-09-28 18:41:56 +08:00
LittleSheep	16047a7d57	🚀 Launch 1.2.5+1	2024-09-27 00:20:04 +08:00
LittleSheep	fdc68fc5e1	💄 Optimize attachment editor controls	2024-09-27 00:12:30 +08:00
LittleSheep	bbee825cf4	♻️ Refactor profile page code	2024-09-27 00:02:08 +08:00
LittleSheep	2673c11046	✨ Able to block anyone 💄 Optimize user profile page	2024-09-26 23:47:19 +08:00
LittleSheep	3ac6822ab6	🚀 Launch 1.2.4+1	2024-09-24 22:40:54 +08:00
LittleSheep	7a5fd2e468	✨ In app rating	2024-09-24 22:10:45 +08:00
LittleSheep	e1ddd22e4e	🚀 Launch 1.2.3+2	2024-09-23 23:34:40 +08:00
LittleSheep	22b2ae32e9	✨ Featured replies clickable	2024-09-23 23:34:25 +08:00
LittleSheep	9d5c452eae	🐛 Fix overflow in content	2024-09-23 23:20:01 +08:00
LittleSheep	0fdb1e4ead	💫 Improve loading image animation	2024-09-23 23:19:52 +08:00
LittleSheep	724bd6592e	💄 Improvements and optimize UX	2024-09-23 22:43:13 +08:00
LittleSheep	2d347e0d41	♻️ Refactored post item widget	2024-09-23 22:43:02 +08:00
LittleSheep	de39799301	🚀 Launch 1.2.3	2024-09-22 22:57:00 +08:00
LittleSheep	4b921602a2	🐛 Bug fixes	2024-09-22 22:56:28 +08:00
LittleSheep	6cde218393	💄 Optimization of post item style	2024-09-21 23:28:14 +08:00
LittleSheep	c896185af0	✨ See other user recent fortune	2024-09-21 23:10:20 +08:00
LittleSheep	4cbeafd447	✨ Account deletion	2024-09-21 22:44:08 +08:00
LittleSheep	91a32e6736	✨ Report abuse	2024-09-21 22:10:59 +08:00
LittleSheep	befc647b03	💄 Improved about page	2024-09-19 20:39:09 +08:00
LittleSheep	16b2e3a0c7	✨ Terms that show up let user accept	2024-09-19 20:34:04 +08:00
LittleSheep	0cc842c030	🐛 Fix upgrade detection method	2024-09-18 20:27:13 +08:00
LittleSheep	fb370a484d	🐛 Fix english localization update message placeholder issue	2024-09-18 19:55:42 +08:00
LittleSheep	153c15e5c9	🚀 Launch 1.2.2+2	2024-09-18 13:05:08 +08:00
LittleSheep	6a0f42cdc9	🐛 Fix realm view won't show channels	2024-09-18 13:03:40 +08:00
LittleSheep	01aaa5455e	💄 Fix content padding mis-match	2024-09-18 00:14:16 +08:00
LittleSheep	f3ceb5f967	🚀 Launch 1.2.2+1	2024-09-17 23:50:49 +08:00
LittleSheep	b5e2fa4c25	🐛 Fix post editor alias overflow	2024-09-17 23:08:00 +08:00
LittleSheep	8378024490	🚀 Launch 1.2.1+41	2024-09-17 22:31:37 +08:00
LittleSheep	6d40d6bba3	💄 Optimize content	2024-09-17 21:48:20 +08:00
LittleSheep	77075c8dab	♿ Optimize updater	2024-09-17 21:37:20 +08:00
LittleSheep	dec34e297d	🐛 Bug fixes on attachments and related things	2024-09-17 20:59:01 +08:00
LittleSheep	358677ade0	✨ Android self-update	2024-09-17 20:40:44 +08:00
LittleSheep	d2f37ae45d	🐛 Fix fileType render error	2024-09-17 18:28:53 +08:00
LittleSheep	e4b741ff0c	🚀 Launch 1.2.1+40	2024-09-17 16:02:13 +08:00
LittleSheep	e69abb7f9d	✨ Notification preferences	2024-09-17 15:59:17 +08:00
LittleSheep	565a8e41cc	✨ Realm avatar, banner	2024-09-17 14:21:37 +08:00
LittleSheep	c9fbe47337	✨ Channel isPublic and isCommunity	2024-09-17 13:50:04 +08:00
LittleSheep	01db63e297	🐛 Fix compability on iOS 18 and macOS 15	2024-09-17 13:39:08 +08:00
LittleSheep	d87e67bd17	✨ Subscriptions	2024-09-17 02:14:23 +08:00
LittleSheep	06aa1fb359	🐛 Fix post last read at	2024-09-17 01:23:49 +08:00
LittleSheep	62733bf29f	💄 Optimize featured reply style	2024-09-16 23:39:15 +08:00
LittleSheep	ce16de9c71	✨ Featured replies on post	2024-09-16 23:35:44 +08:00
LittleSheep	47eb6cbc66	✨ Chat list will also show wild group channel	2024-09-16 21:09:19 +08:00
LittleSheep	029e72fb0b	⚡ Improve sticker loading	2024-09-16 21:00:19 +08:00
LittleSheep	152efd97a0	💄 Unified design of single attachment uploader	2024-09-16 20:33:34 +08:00
LittleSheep	ad1dc064e6	🚀 Launch 1.2.1+39	2024-09-16 20:15:36 +08:00
LittleSheep	675b5dea5d	💫 Optimize region animations	2024-09-16 20:06:15 +08:00
LittleSheep	5941cb9fd5	🐛 Fix messages loading	2024-09-16 19:50:49 +08:00
LittleSheep	e11bf204af	🐛 Fix web login error by the cors issue	2024-09-16 18:12:30 +08:00