diff --git a/Work/src/main/res/drawable/ic_launcher_round.png b/Work/src/main/res/drawable/ic_launcher_round.png
new file mode 100644
index 000000000..c66f80092
Binary files /dev/null and b/Work/src/main/res/drawable/ic_launcher_round.png differ
diff --git a/android/app/build.gradle b/android/app/build.gradle
index d181ff5ce..354e0d0d9 100644
--- a/android/app/build.gradle
+++ b/android/app/build.gradle
@@ -108,7 +108,7 @@ android {
         inhouse {
             dimension "env"
             applicationIdSuffix ".inhouse"
-            resValue "string", "app_name", "Autonomy (Dev)"
+            resValue "string", "app_name", "Feral File (Dev)"
             manifestPlaceholders = [
                     appIcon     : "@mipmap/ic_launcher_dev",
                     appIconRound: "@mipmap/ic_launcher_dev_round"
@@ -117,7 +117,7 @@ android {
 
         prd {
             dimension "env"
-            resValue "string", "app_name", "Autonomy"
+            resValue "string", "app_name", "Feral File"
             manifestPlaceholders = [
                     appIcon     : "@mipmap/ic_launcher",
                     appIconRound: "@mipmap/ic_launcher_round"
diff --git a/android/app/src/main/AndroidManifest.xml b/android/app/src/main/AndroidManifest.xml
index 38c01fac0..5fd9bc8df 100644
--- a/android/app/src/main/AndroidManifest.xml
+++ b/android/app/src/main/AndroidManifest.xml
@@ -163,6 +163,16 @@
                 <data
                     android:host="autonomy-app-alternate.app.link"
                     android:scheme="https" />
+
+                <data
+                    android:host="app.feralfile.com"
+                    android:scheme="https" />
+                <data
+                    android:host="feralfile-app.app.link"
+                    android:scheme="https" />
+                <data
+                    android:host="feralfile-app-alternate.app.link"
+                    android:scheme="https" />
             </intent-filter>
 
             <intent-filter android:autoVerify="true">
@@ -177,6 +187,13 @@
                 <data
                     android:host="autonomy-app-alternate.test.app.link"
                     android:scheme="https" />
+
+                <data
+                    android:host="feralfile-app.test.app.link"
+                    android:scheme="https" />
+                <data
+                    android:host="feralfile-app-alternate.test.app.link"
+                    android:scheme="https" />
             </intent-filter>
         </activity>
         <!--
diff --git a/android/app/src/main/ic_launcher_dev-playstore.png b/android/app/src/main/ic_launcher_dev-playstore.png
index 298af5e14..74d26effc 100644
Binary files a/android/app/src/main/ic_launcher_dev-playstore.png and b/android/app/src/main/ic_launcher_dev-playstore.png differ
diff --git a/android/app/src/main/kotlin/com/bitmark/autonomy_flutter/AuthenticatorActivity.kt b/android/app/src/main/kotlin/com/bitmark/autonomy_flutter/AuthenticatorActivity.kt
index 5d093ef64..6bdeb3505 100644
--- a/android/app/src/main/kotlin/com/bitmark/autonomy_flutter/AuthenticatorActivity.kt
+++ b/android/app/src/main/kotlin/com/bitmark/autonomy_flutter/AuthenticatorActivity.kt
@@ -51,13 +51,13 @@ class AuthenticatorActivity : AppCompatActivity() {
         promptInfo = if (android.os.Build.VERSION.SDK_INT >= 30) {
             BiometricPrompt.PromptInfo.Builder()
                 .setTitle("Authentication required")
-                .setDescription("Authentication for \"Autonomy\"")
+                .setDescription("Authentication for \"Feral File\"")
                 .setAllowedAuthenticators(BiometricManager.Authenticators.BIOMETRIC_STRONG or BiometricManager.Authenticators.DEVICE_CREDENTIAL)
                 .build()
         } else {
             BiometricPrompt.PromptInfo.Builder()
                 .setTitle("Authentication required")
-                .setDescription("Authentication for \"Autonomy\"")
+                .setDescription("Authentication for \"Feral File\"")
                 .setDeviceCredentialAllowed(true)
                 .build()
         }
@@ -68,7 +68,8 @@ class AuthenticatorActivity : AppCompatActivity() {
         val keyguardManager = getSystemService(KEYGUARD_SERVICE) as KeyguardManager
 
         if (biometricManager.canAuthenticate(BiometricManager.Authenticators.BIOMETRIC_STRONG)
-            == BiometricManager.BIOMETRIC_SUCCESS || keyguardManager.isDeviceSecure) {
+            == BiometricManager.BIOMETRIC_SUCCESS || keyguardManager.isDeviceSecure
+        ) {
             biometricPrompt.authenticate(promptInfo)
         } else {
             MainActivity.isAuthenticate = true
diff --git a/android/app/src/main/kotlin/com/bitmark/autonomy_flutter/Wc2ConnectPlugin.kt b/android/app/src/main/kotlin/com/bitmark/autonomy_flutter/Wc2ConnectPlugin.kt
index d45c5aa0d..3d344ff60 100644
--- a/android/app/src/main/kotlin/com/bitmark/autonomy_flutter/Wc2ConnectPlugin.kt
+++ b/android/app/src/main/kotlin/com/bitmark/autonomy_flutter/Wc2ConnectPlugin.kt
@@ -15,7 +15,6 @@ import io.flutter.plugin.common.BinaryMessenger
 import io.flutter.plugin.common.EventChannel
 import io.flutter.plugin.common.MethodCall
 import io.flutter.plugin.common.MethodChannel
-import it.airgap.beaconsdk.core.message.BeaconRequest
 import kotlinx.coroutines.*
 import kotlinx.coroutines.flow.MutableSharedFlow
 import kotlinx.coroutines.flow.onEach
@@ -59,8 +58,8 @@ class Wc2ConnectPlugin(private val application: Application) : FlutterPlugin,
     private fun initClient() {
         // Initialize Wallet Connect
         val appMetadata = Core.Model.AppMetaData(
-            name = "Autonomy",
-            description = "Autonomy Wallet",
+            name = "Feral File",
+            description = "Feral File Wallet",
             icons = listOf(),
             url = "autonomy.io",
             redirect = null
diff --git a/android/app/src/main/res/drawable-hdpi/penrose_inhouse.png b/android/app/src/main/res/drawable-hdpi/penrose_inhouse.png
deleted file mode 100644
index 632a76dca..000000000
Binary files a/android/app/src/main/res/drawable-hdpi/penrose_inhouse.png and /dev/null differ
diff --git a/android/app/src/main/res/drawable-hdpi/penrose_large.png b/android/app/src/main/res/drawable-hdpi/penrose_large.png
deleted file mode 100644
index ceff442e9..000000000
Binary files a/android/app/src/main/res/drawable-hdpi/penrose_large.png and /dev/null differ
diff --git a/android/app/src/main/res/drawable-hdpi/splash.png b/android/app/src/main/res/drawable-hdpi/splash.png
index 5cfb7cd67..8c2cab161 100644
Binary files a/android/app/src/main/res/drawable-hdpi/splash.png and b/android/app/src/main/res/drawable-hdpi/splash.png differ
diff --git a/android/app/src/main/res/drawable-hdpi/splash_inhouse.png b/android/app/src/main/res/drawable-hdpi/splash_inhouse.png
index b045c1654..da79d8891 100644
Binary files a/android/app/src/main/res/drawable-hdpi/splash_inhouse.png and b/android/app/src/main/res/drawable-hdpi/splash_inhouse.png differ
diff --git a/android/app/src/main/res/drawable-ldpi/penrose_inhouse.png b/android/app/src/main/res/drawable-ldpi/penrose_inhouse.png
deleted file mode 100644
index 39496bf5c..000000000
Binary files a/android/app/src/main/res/drawable-ldpi/penrose_inhouse.png and /dev/null differ
diff --git a/android/app/src/main/res/drawable-ldpi/penrose_large.png b/android/app/src/main/res/drawable-ldpi/penrose_large.png
deleted file mode 100644
index 6a55e8ee2..000000000
Binary files a/android/app/src/main/res/drawable-ldpi/penrose_large.png and /dev/null differ
diff --git a/android/app/src/main/res/drawable-mdpi/penrose_inhouse.png b/android/app/src/main/res/drawable-mdpi/penrose_inhouse.png
deleted file mode 100644
index 9a997214c..000000000
Binary files a/android/app/src/main/res/drawable-mdpi/penrose_inhouse.png and /dev/null differ
diff --git a/android/app/src/main/res/drawable-mdpi/penrose_large.png b/android/app/src/main/res/drawable-mdpi/penrose_large.png
deleted file mode 100644
index d360d8f0a..000000000
Binary files a/android/app/src/main/res/drawable-mdpi/penrose_large.png and /dev/null differ
diff --git a/android/app/src/main/res/drawable-mdpi/splash.png b/android/app/src/main/res/drawable-mdpi/splash.png
index fe91e5f99..d2fc217e8 100644
Binary files a/android/app/src/main/res/drawable-mdpi/splash.png and b/android/app/src/main/res/drawable-mdpi/splash.png differ
diff --git a/android/app/src/main/res/drawable-mdpi/splash_inhouse.png b/android/app/src/main/res/drawable-mdpi/splash_inhouse.png
index 0efe24cd6..7da7ecadb 100644
Binary files a/android/app/src/main/res/drawable-mdpi/splash_inhouse.png and b/android/app/src/main/res/drawable-mdpi/splash_inhouse.png differ
diff --git a/android/app/src/main/res/drawable-xhdpi/penrose_inhouse.png b/android/app/src/main/res/drawable-xhdpi/penrose_inhouse.png
deleted file mode 100644
index 6c013b357..000000000
Binary files a/android/app/src/main/res/drawable-xhdpi/penrose_inhouse.png and /dev/null differ
diff --git a/android/app/src/main/res/drawable-xhdpi/penrose_large.png b/android/app/src/main/res/drawable-xhdpi/penrose_large.png
deleted file mode 100644
index 16ebde236..000000000
Binary files a/android/app/src/main/res/drawable-xhdpi/penrose_large.png and /dev/null differ
diff --git a/android/app/src/main/res/drawable-xhdpi/splash.png b/android/app/src/main/res/drawable-xhdpi/splash.png
index a543765cd..95228e751 100644
Binary files a/android/app/src/main/res/drawable-xhdpi/splash.png and b/android/app/src/main/res/drawable-xhdpi/splash.png differ
diff --git a/android/app/src/main/res/drawable-xhdpi/splash_inhouse.png b/android/app/src/main/res/drawable-xhdpi/splash_inhouse.png
index cb6d58c6d..0384c9bf2 100644
Binary files a/android/app/src/main/res/drawable-xhdpi/splash_inhouse.png and b/android/app/src/main/res/drawable-xhdpi/splash_inhouse.png differ
diff --git a/android/app/src/main/res/drawable-xxhdpi/penrose_inhouse.png b/android/app/src/main/res/drawable-xxhdpi/penrose_inhouse.png
deleted file mode 100644
index 5e162063f..000000000
Binary files a/android/app/src/main/res/drawable-xxhdpi/penrose_inhouse.png and /dev/null differ
diff --git a/android/app/src/main/res/drawable-xxhdpi/penrose_large.png b/android/app/src/main/res/drawable-xxhdpi/penrose_large.png
deleted file mode 100644
index ea262ae7c..000000000
Binary files a/android/app/src/main/res/drawable-xxhdpi/penrose_large.png and /dev/null differ
diff --git a/android/app/src/main/res/drawable-xxhdpi/splash.png b/android/app/src/main/res/drawable-xxhdpi/splash.png
index fc86469fa..9508935c0 100644
Binary files a/android/app/src/main/res/drawable-xxhdpi/splash.png and b/android/app/src/main/res/drawable-xxhdpi/splash.png differ
diff --git a/android/app/src/main/res/drawable-xxhdpi/splash_inhouse.png b/android/app/src/main/res/drawable-xxhdpi/splash_inhouse.png
index 3d112f963..be39bd6b6 100644
Binary files a/android/app/src/main/res/drawable-xxhdpi/splash_inhouse.png and b/android/app/src/main/res/drawable-xxhdpi/splash_inhouse.png differ
diff --git a/android/app/src/main/res/drawable-xxxhdpi/penrose_inhouse.png b/android/app/src/main/res/drawable-xxxhdpi/penrose_inhouse.png
deleted file mode 100644
index ec44ab55b..000000000
Binary files a/android/app/src/main/res/drawable-xxxhdpi/penrose_inhouse.png and /dev/null differ
diff --git a/android/app/src/main/res/drawable-xxxhdpi/penrose_large.png b/android/app/src/main/res/drawable-xxxhdpi/penrose_large.png
deleted file mode 100644
index d91317deb..000000000
Binary files a/android/app/src/main/res/drawable-xxxhdpi/penrose_large.png and /dev/null differ
diff --git a/android/app/src/main/res/drawable-xxxhdpi/splash.png b/android/app/src/main/res/drawable-xxxhdpi/splash.png
index 25c0de6c2..fdba5d430 100644
Binary files a/android/app/src/main/res/drawable-xxxhdpi/splash.png and b/android/app/src/main/res/drawable-xxxhdpi/splash.png differ
diff --git a/android/app/src/main/res/drawable-xxxhdpi/splash_inhouse.png b/android/app/src/main/res/drawable-xxxhdpi/splash_inhouse.png
index 47c1459f7..d2fc217e8 100644
Binary files a/android/app/src/main/res/drawable-xxxhdpi/splash_inhouse.png and b/android/app/src/main/res/drawable-xxxhdpi/splash_inhouse.png differ
diff --git a/android/app/src/main/res/mipmap-hdpi/ic_launcher.png b/android/app/src/main/res/mipmap-hdpi/ic_launcher.png
index 73b17ae18..6c5dc8027 100644
Binary files a/android/app/src/main/res/mipmap-hdpi/ic_launcher.png and b/android/app/src/main/res/mipmap-hdpi/ic_launcher.png differ
diff --git a/android/app/src/main/res/mipmap-hdpi/ic_launcher_dev.png b/android/app/src/main/res/mipmap-hdpi/ic_launcher_dev.png
index dd95d9ecf..6c5dc8027 100644
Binary files a/android/app/src/main/res/mipmap-hdpi/ic_launcher_dev.png and b/android/app/src/main/res/mipmap-hdpi/ic_launcher_dev.png differ
diff --git a/android/app/src/main/res/mipmap-hdpi/ic_launcher_dev_foreground.png b/android/app/src/main/res/mipmap-hdpi/ic_launcher_dev_foreground.png
index b61a1800a..c293a6d51 100644
Binary files a/android/app/src/main/res/mipmap-hdpi/ic_launcher_dev_foreground.png and b/android/app/src/main/res/mipmap-hdpi/ic_launcher_dev_foreground.png differ
diff --git a/android/app/src/main/res/mipmap-hdpi/ic_launcher_dev_round.png b/android/app/src/main/res/mipmap-hdpi/ic_launcher_dev_round.png
index 935a09434..f8b7d21bd 100644
Binary files a/android/app/src/main/res/mipmap-hdpi/ic_launcher_dev_round.png and b/android/app/src/main/res/mipmap-hdpi/ic_launcher_dev_round.png differ
diff --git a/android/app/src/main/res/mipmap-hdpi/ic_launcher_foreground.png b/android/app/src/main/res/mipmap-hdpi/ic_launcher_foreground.png
index f00314136..c293a6d51 100644
Binary files a/android/app/src/main/res/mipmap-hdpi/ic_launcher_foreground.png and b/android/app/src/main/res/mipmap-hdpi/ic_launcher_foreground.png differ
diff --git a/android/app/src/main/res/mipmap-hdpi/ic_launcher_round.png b/android/app/src/main/res/mipmap-hdpi/ic_launcher_round.png
index 2eabf57bf..f8b7d21bd 100644
Binary files a/android/app/src/main/res/mipmap-hdpi/ic_launcher_round.png and b/android/app/src/main/res/mipmap-hdpi/ic_launcher_round.png differ
diff --git a/android/app/src/main/res/mipmap-mdpi/ic_launcher.png b/android/app/src/main/res/mipmap-mdpi/ic_launcher.png
index fbc34e9e2..e896dedd7 100644
Binary files a/android/app/src/main/res/mipmap-mdpi/ic_launcher.png and b/android/app/src/main/res/mipmap-mdpi/ic_launcher.png differ
diff --git a/android/app/src/main/res/mipmap-mdpi/ic_launcher_dev.png b/android/app/src/main/res/mipmap-mdpi/ic_launcher_dev.png
index 0e370e304..e896dedd7 100644
Binary files a/android/app/src/main/res/mipmap-mdpi/ic_launcher_dev.png and b/android/app/src/main/res/mipmap-mdpi/ic_launcher_dev.png differ
diff --git a/android/app/src/main/res/mipmap-mdpi/ic_launcher_dev_foreground.png b/android/app/src/main/res/mipmap-mdpi/ic_launcher_dev_foreground.png
index 67e9224b0..02ebc0d45 100644
Binary files a/android/app/src/main/res/mipmap-mdpi/ic_launcher_dev_foreground.png and b/android/app/src/main/res/mipmap-mdpi/ic_launcher_dev_foreground.png differ
diff --git a/android/app/src/main/res/mipmap-mdpi/ic_launcher_dev_round.png b/android/app/src/main/res/mipmap-mdpi/ic_launcher_dev_round.png
index fb786be5a..9c22ce6de 100644
Binary files a/android/app/src/main/res/mipmap-mdpi/ic_launcher_dev_round.png and b/android/app/src/main/res/mipmap-mdpi/ic_launcher_dev_round.png differ
diff --git a/android/app/src/main/res/mipmap-mdpi/ic_launcher_foreground.png b/android/app/src/main/res/mipmap-mdpi/ic_launcher_foreground.png
index 4a13c4cf5..02ebc0d45 100644
Binary files a/android/app/src/main/res/mipmap-mdpi/ic_launcher_foreground.png and b/android/app/src/main/res/mipmap-mdpi/ic_launcher_foreground.png differ
diff --git a/android/app/src/main/res/mipmap-mdpi/ic_launcher_round.png b/android/app/src/main/res/mipmap-mdpi/ic_launcher_round.png
index 49d555cd9..9c22ce6de 100644
Binary files a/android/app/src/main/res/mipmap-mdpi/ic_launcher_round.png and b/android/app/src/main/res/mipmap-mdpi/ic_launcher_round.png differ
diff --git a/android/app/src/main/res/mipmap-xhdpi/ic_launcher.png b/android/app/src/main/res/mipmap-xhdpi/ic_launcher.png
index ca96e3be5..1615a7fde 100644
Binary files a/android/app/src/main/res/mipmap-xhdpi/ic_launcher.png and b/android/app/src/main/res/mipmap-xhdpi/ic_launcher.png differ
diff --git a/android/app/src/main/res/mipmap-xhdpi/ic_launcher_dev.png b/android/app/src/main/res/mipmap-xhdpi/ic_launcher_dev.png
index ee66f893c..1615a7fde 100644
Binary files a/android/app/src/main/res/mipmap-xhdpi/ic_launcher_dev.png and b/android/app/src/main/res/mipmap-xhdpi/ic_launcher_dev.png differ
diff --git a/android/app/src/main/res/mipmap-xhdpi/ic_launcher_dev_foreground.png b/android/app/src/main/res/mipmap-xhdpi/ic_launcher_dev_foreground.png
index eaefa9dc1..b2e6dad9b 100644
Binary files a/android/app/src/main/res/mipmap-xhdpi/ic_launcher_dev_foreground.png and b/android/app/src/main/res/mipmap-xhdpi/ic_launcher_dev_foreground.png differ
diff --git a/android/app/src/main/res/mipmap-xhdpi/ic_launcher_dev_round.png b/android/app/src/main/res/mipmap-xhdpi/ic_launcher_dev_round.png
index 842117e69..58f6d9dce 100644
Binary files a/android/app/src/main/res/mipmap-xhdpi/ic_launcher_dev_round.png and b/android/app/src/main/res/mipmap-xhdpi/ic_launcher_dev_round.png differ
diff --git a/android/app/src/main/res/mipmap-xhdpi/ic_launcher_foreground.png b/android/app/src/main/res/mipmap-xhdpi/ic_launcher_foreground.png
index a8af1b7cb..b2e6dad9b 100644
Binary files a/android/app/src/main/res/mipmap-xhdpi/ic_launcher_foreground.png and b/android/app/src/main/res/mipmap-xhdpi/ic_launcher_foreground.png differ
diff --git a/android/app/src/main/res/mipmap-xhdpi/ic_launcher_round.png b/android/app/src/main/res/mipmap-xhdpi/ic_launcher_round.png
index a069a3d1c..58f6d9dce 100644
Binary files a/android/app/src/main/res/mipmap-xhdpi/ic_launcher_round.png and b/android/app/src/main/res/mipmap-xhdpi/ic_launcher_round.png differ
diff --git a/android/app/src/main/res/mipmap-xxhdpi/ic_launcher.png b/android/app/src/main/res/mipmap-xxhdpi/ic_launcher.png
index 41751bd79..4f7671c0f 100644
Binary files a/android/app/src/main/res/mipmap-xxhdpi/ic_launcher.png and b/android/app/src/main/res/mipmap-xxhdpi/ic_launcher.png differ
diff --git a/android/app/src/main/res/mipmap-xxhdpi/ic_launcher_dev.png b/android/app/src/main/res/mipmap-xxhdpi/ic_launcher_dev.png
index fc8b369dd..4f7671c0f 100644
Binary files a/android/app/src/main/res/mipmap-xxhdpi/ic_launcher_dev.png and b/android/app/src/main/res/mipmap-xxhdpi/ic_launcher_dev.png differ
diff --git a/android/app/src/main/res/mipmap-xxhdpi/ic_launcher_dev_foreground.png b/android/app/src/main/res/mipmap-xxhdpi/ic_launcher_dev_foreground.png
index 18792f273..29da4028b 100644
Binary files a/android/app/src/main/res/mipmap-xxhdpi/ic_launcher_dev_foreground.png and b/android/app/src/main/res/mipmap-xxhdpi/ic_launcher_dev_foreground.png differ
diff --git a/android/app/src/main/res/mipmap-xxhdpi/ic_launcher_dev_round.png b/android/app/src/main/res/mipmap-xxhdpi/ic_launcher_dev_round.png
index dee38be33..dbe16dae7 100644
Binary files a/android/app/src/main/res/mipmap-xxhdpi/ic_launcher_dev_round.png and b/android/app/src/main/res/mipmap-xxhdpi/ic_launcher_dev_round.png differ
diff --git a/android/app/src/main/res/mipmap-xxhdpi/ic_launcher_foreground.png b/android/app/src/main/res/mipmap-xxhdpi/ic_launcher_foreground.png
index d4f97e212..29da4028b 100644
Binary files a/android/app/src/main/res/mipmap-xxhdpi/ic_launcher_foreground.png and b/android/app/src/main/res/mipmap-xxhdpi/ic_launcher_foreground.png differ
diff --git a/android/app/src/main/res/mipmap-xxhdpi/ic_launcher_round.png b/android/app/src/main/res/mipmap-xxhdpi/ic_launcher_round.png
index ad6370114..dbe16dae7 100644
Binary files a/android/app/src/main/res/mipmap-xxhdpi/ic_launcher_round.png and b/android/app/src/main/res/mipmap-xxhdpi/ic_launcher_round.png differ
diff --git a/android/app/src/main/res/mipmap-xxxhdpi/ic_launcher.png b/android/app/src/main/res/mipmap-xxxhdpi/ic_launcher.png
index f5c774b5e..221c1e372 100644
Binary files a/android/app/src/main/res/mipmap-xxxhdpi/ic_launcher.png and b/android/app/src/main/res/mipmap-xxxhdpi/ic_launcher.png differ
diff --git a/android/app/src/main/res/mipmap-xxxhdpi/ic_launcher_dev.png b/android/app/src/main/res/mipmap-xxxhdpi/ic_launcher_dev.png
index b5b844104..221c1e372 100644
Binary files a/android/app/src/main/res/mipmap-xxxhdpi/ic_launcher_dev.png and b/android/app/src/main/res/mipmap-xxxhdpi/ic_launcher_dev.png differ
diff --git a/android/app/src/main/res/mipmap-xxxhdpi/ic_launcher_dev_foreground.png b/android/app/src/main/res/mipmap-xxxhdpi/ic_launcher_dev_foreground.png
index 363bc4ec5..806cdfeee 100644
Binary files a/android/app/src/main/res/mipmap-xxxhdpi/ic_launcher_dev_foreground.png and b/android/app/src/main/res/mipmap-xxxhdpi/ic_launcher_dev_foreground.png differ
diff --git a/android/app/src/main/res/mipmap-xxxhdpi/ic_launcher_dev_round.png b/android/app/src/main/res/mipmap-xxxhdpi/ic_launcher_dev_round.png
index a52b42626..d5827f7ca 100644
Binary files a/android/app/src/main/res/mipmap-xxxhdpi/ic_launcher_dev_round.png and b/android/app/src/main/res/mipmap-xxxhdpi/ic_launcher_dev_round.png differ
diff --git a/android/app/src/main/res/mipmap-xxxhdpi/ic_launcher_foreground.png b/android/app/src/main/res/mipmap-xxxhdpi/ic_launcher_foreground.png
index a5e1d3dfa..806cdfeee 100644
Binary files a/android/app/src/main/res/mipmap-xxxhdpi/ic_launcher_foreground.png and b/android/app/src/main/res/mipmap-xxxhdpi/ic_launcher_foreground.png differ
diff --git a/android/app/src/main/res/mipmap-xxxhdpi/ic_launcher_round.png b/android/app/src/main/res/mipmap-xxxhdpi/ic_launcher_round.png
index 216d34047..d5827f7ca 100644
Binary files a/android/app/src/main/res/mipmap-xxxhdpi/ic_launcher_round.png and b/android/app/src/main/res/mipmap-xxxhdpi/ic_launcher_round.png differ
diff --git a/android/app/src/main/res/values/ic_launcher_background.xml b/android/app/src/main/res/values/ic_launcher_background.xml
index a91219585..ab9832824 100644
--- a/android/app/src/main/res/values/ic_launcher_background.xml
+++ b/android/app/src/main/res/values/ic_launcher_background.xml
@@ -1,4 +1,4 @@
 <?xml version="1.0" encoding="utf-8"?>
 <resources>
-    <color name="ic_launcher_background">#04fba3</color>
+    <color name="ic_launcher_background">#ffffff</color>
 </resources>
\ No newline at end of file
diff --git a/android/build/ios/Pods.build/Release-iphonesimulator/Flutter.build/dgph b/android/build/ios/Pods.build/Release-iphonesimulator/Flutter.build/dgph
new file mode 100644
index 000000000..99ca14bb7
Binary files /dev/null and b/android/build/ios/Pods.build/Release-iphonesimulator/Flutter.build/dgph differ
diff --git a/assets b/assets
index 90e5f4ed5..ef719db29 160000
--- a/assets
+++ b/assets
@@ -1 +1 @@
-Subproject commit 90e5f4ed51e01af60ae33ad51f6ad55f0388dfbc
+Subproject commit ef719db290d5d805f505aa20d0545eb1146b9407
diff --git a/ios/ExportOptions-Inhouse-Dist.plist b/ios/ExportOptions-Inhouse-Dist.plist
index 9c661e796..d3b95f1c1 100644
--- a/ios/ExportOptions-Inhouse-Dist.plist
+++ b/ios/ExportOptions-Inhouse-Dist.plist
@@ -7,9 +7,9 @@
     <key>provisioningProfiles</key>
     <dict>
         <key>com.bitmark.autonomy.inhouse</key>
-        <string>Autonomy Inhouse</string>
+        <string>Feral File Inhouse</string>
         <key>com.bitmark.autonomy.inhouse.notification</key>
-        <string>Autonomy Inhouse Notification</string>
+        <string>Feral File Inhouse Notification</string>
     </dict>
     <key>iCloudContainerEnvironment</key>
     <string>Production</string>
diff --git a/ios/ExportOptions-Inhouse.plist b/ios/ExportOptions-Inhouse.plist
index e4135168c..ba17e4e97 100644
--- a/ios/ExportOptions-Inhouse.plist
+++ b/ios/ExportOptions-Inhouse.plist
@@ -7,9 +7,9 @@
     <key>provisioningProfiles</key>
     <dict>
         <key>com.bitmark.autonomy.inhouse</key>
-        <string>Autonomy Dev Inhouse</string>
+        <string>Feral File Dev Inhouse</string>
         <key>com.bitmark.autonomy.inhouse.notification</key>
-        <string>Autonomy Dev Inhouse Notification</string>
+        <string>Feral File Dev Inhouse Notification</string>
     </dict>
     <key>iCloudContainerEnvironment</key>
     <string>Development</string>
diff --git a/ios/Runner-Inhouse-Info.plist b/ios/Runner-Inhouse-Info.plist
index f945df132..c08dd2b85 100644
--- a/ios/Runner-Inhouse-Info.plist
+++ b/ios/Runner-Inhouse-Info.plist
@@ -9,7 +9,7 @@
 	<key>CFBundleDevelopmentRegion</key>
 	<string>$(DEVELOPMENT_LANGUAGE)</string>
 	<key>CFBundleDisplayName</key>
-	<string>Autonomy</string>
+	<string>Feral File</string>
 	<key>CFBundleExecutable</key>
 	<string>$(EXECUTABLE_NAME)</string>
 	<key>CFBundleIdentifier</key>
@@ -62,15 +62,15 @@
 	<key>NSCameraUsageDescription</key>
 	<string>QR code scanning requires camera access.</string>
 	<key>NSFaceIDUsageDescription</key>
-	<string>Allow Autonomy to use Face ID to authenticate.</string>
+	<string>Allow Feral File to use Face ID to authenticate.</string>
 	<key>NSLocalNetworkUsageDescription</key>
 	<string>${PRODUCT_NAME} uses the local network to discover Cast-enabled devices on your WiFi network.</string>
 	<key>NSLocationAlwaysAndWhenInUseUsageDescription</key>
-	<string>Allow Autonomy to use your location</string>
+	<string>Allow Feral File to use your location</string>
 	<key>NSLocationAlwaysUsageDescription</key>
-	<string>Allow Autonomy to use your location</string>
+	<string>Allow Feral File to use your location</string>
 	<key>NSLocationWhenInUseUsageDescription</key>
-	<string>Allow Autonomy to use your location</string>
+	<string>Allow Feral File to use your location</string>
 	<key>NSMicrophoneUsageDescription</key>
 	<string>Viewing artwork with microphone enable.</string>
 	<key>NSPhotoLibraryUsageDescription</key>
@@ -118,6 +118,11 @@
 		<string>autonomy-app-alternate.app.link</string>
 		<string>autonomy-app.test.app.link</string>
 		<string>autonomy-app-alternate.test.app.link</string>
+		<string>app.feralfile.com</string>
+		<string>feralfile-app.app.link</string>
+		<string>feralfile-app-alternate.app.link</string>
+		<string>feralfile-app.test.app.link</string>
+		<string>feralfile-app-alternate.test.app.link</string>
 	</array>
 	<key>io.flutter.embedded_views_preview</key>
 	<true/>
diff --git a/ios/Runner.xcodeproj/project.pbxproj b/ios/Runner.xcodeproj/project.pbxproj
index 9e35343d3..0a5a5aa4f 100644
--- a/ios/Runner.xcodeproj/project.pbxproj
+++ b/ios/Runner.xcodeproj/project.pbxproj
@@ -612,7 +612,7 @@
 			isa = PBXProject;
 			attributes = {
 				LastSwiftUpdateCheck = 1330;
-				LastUpgradeCheck = 1300;
+				LastUpgradeCheck = 1430;
 				ORGANIZATIONNAME = "";
 				TargetAttributes = {
 					588939BA280525C200FE3313 = {
@@ -1146,7 +1146,7 @@
 				MARKETING_VERSION = 0.32.0;
 				PRODUCT_BUNDLE_IDENTIFIER = com.bitmark.autonomywallet;
 				PRODUCT_NAME = "$(TARGET_NAME)";
-				PROVISIONING_PROFILE_SPECIFIER = "Autonomy Wallet Appstore Dev";
+				PROVISIONING_PROFILE_SPECIFIER = "Feral File Wallet Appstore Dev";
 				SWIFT_ACTIVE_COMPILATION_CONDITIONS = prod;
 				SWIFT_OBJC_BRIDGING_HEADER = "Runner/Runner-Bridging-Header.h";
 				SWIFT_OPTIMIZATION_LEVEL = "-Onone";
@@ -1186,7 +1186,7 @@
 				MTL_FAST_MATH = YES;
 				PRODUCT_BUNDLE_IDENTIFIER = com.bitmark.autonomywallet.notification;
 				PRODUCT_NAME = "$(TARGET_NAME)";
-				PROVISIONING_PROFILE_SPECIFIER = "Autonomy Wallet Notification Development";
+				PROVISIONING_PROFILE_SPECIFIER = "Feral File Wallet Notification Development";
 				SKIP_INSTALL = YES;
 				SWIFT_ACTIVE_COMPILATION_CONDITIONS = DEBUG;
 				SWIFT_EMIT_LOC_STRINGS = YES;
@@ -1222,7 +1222,7 @@
 				PRODUCT_BUNDLE_IDENTIFIER = "com.bitmark.autonomy-wallet.inhouse";
 				PRODUCT_NAME = "$(TARGET_NAME)";
 				PROVISIONING_PROFILE_SPECIFIER = "";
-				"PROVISIONING_PROFILE_SPECIFIER[sdk=iphoneos*]" = "Autonomy Inhouse Adhoc";
+				"PROVISIONING_PROFILE_SPECIFIER[sdk=iphoneos*]" = "Feral File Inhouse Adhoc";
 				SWIFT_ACTIVE_COMPILATION_CONDITIONS = INHOUSE;
 				SWIFT_OBJC_BRIDGING_HEADER = "Runner/Runner-Bridging-Header.h";
 				SWIFT_OPTIMIZATION_LEVEL = "-Onone";
@@ -1266,7 +1266,7 @@
 				PRODUCT_BUNDLE_IDENTIFIER = "com.bitmark.autonomy-wallet.inhouse.notification";
 				PRODUCT_NAME = "$(TARGET_NAME)";
 				PROVISIONING_PROFILE_SPECIFIER = "";
-				"PROVISIONING_PROFILE_SPECIFIER[sdk=iphoneos*]" = "Autonomy Inhouse Adhoc Notification";
+				"PROVISIONING_PROFILE_SPECIFIER[sdk=iphoneos*]" = "Feral File Inhouse Adhoc Notification";
 				SKIP_INSTALL = YES;
 				SWIFT_ACTIVE_COMPILATION_CONDITIONS = DEBUG;
 				SWIFT_EMIT_LOC_STRINGS = YES;
@@ -1349,7 +1349,7 @@
 				MARKETING_VERSION = 0.32.0;
 				PRODUCT_BUNDLE_IDENTIFIER = com.bitmark.autonomywallet;
 				PRODUCT_NAME = "$(TARGET_NAME)";
-				PROVISIONING_PROFILE_SPECIFIER = "Autonomy Wallet Appstore";
+				PROVISIONING_PROFILE_SPECIFIER = "Feral File Wallet Appstore";
 				SWIFT_ACTIVE_COMPILATION_CONDITIONS = prod;
 				SWIFT_OBJC_BRIDGING_HEADER = "Runner/Runner-Bridging-Header.h";
 				SWIFT_VERSION = 5.0;
@@ -1387,7 +1387,7 @@
 				MTL_FAST_MATH = YES;
 				PRODUCT_BUNDLE_IDENTIFIER = com.bitmark.autonomywallet.notification;
 				PRODUCT_NAME = "$(TARGET_NAME)";
-				PROVISIONING_PROFILE_SPECIFIER = "Autonomy Wallet Push Notification Appstore";
+				PROVISIONING_PROFILE_SPECIFIER = "Feral File Wallet Push Notification Appstore";
 				SKIP_INSTALL = YES;
 				SWIFT_COMPILATION_MODE = wholemodule;
 				SWIFT_EMIT_LOC_STRINGS = YES;
@@ -1423,7 +1423,7 @@
 				PRODUCT_BUNDLE_IDENTIFIER = "com.bitmark.autonomy-wallet.inhouse";
 				PRODUCT_NAME = "$(TARGET_NAME)";
 				PROVISIONING_PROFILE_SPECIFIER = "";
-				"PROVISIONING_PROFILE_SPECIFIER[sdk=iphoneos*]" = "Autonomy Inhouse Adhoc";
+				"PROVISIONING_PROFILE_SPECIFIER[sdk=iphoneos*]" = "Feral File Inhouse Adhoc";
 				SWIFT_ACTIVE_COMPILATION_CONDITIONS = INHOUSE;
 				SWIFT_OBJC_BRIDGING_HEADER = "Runner/Runner-Bridging-Header.h";
 				SWIFT_VERSION = 5.0;
@@ -1465,7 +1465,7 @@
 				PRODUCT_BUNDLE_IDENTIFIER = "com.bitmark.autonomy-wallet.inhouse.notification";
 				PRODUCT_NAME = "$(TARGET_NAME)";
 				PROVISIONING_PROFILE_SPECIFIER = "";
-				"PROVISIONING_PROFILE_SPECIFIER[sdk=iphoneos*]" = "Autonomy Inhouse Adhoc Notification";
+				"PROVISIONING_PROFILE_SPECIFIER[sdk=iphoneos*]" = "Feral File Inhouse Adhoc Notification";
 				SKIP_INSTALL = YES;
 				SWIFT_COMPILATION_MODE = wholemodule;
 				SWIFT_EMIT_LOC_STRINGS = YES;
diff --git a/ios/Runner.xcodeproj/xcshareddata/xcschemes/Runner.xcscheme b/ios/Runner.xcodeproj/xcshareddata/xcschemes/Runner.xcscheme
index 3db53b6e1..b52b2e698 100644
--- a/ios/Runner.xcodeproj/xcshareddata/xcschemes/Runner.xcscheme
+++ b/ios/Runner.xcodeproj/xcshareddata/xcschemes/Runner.xcscheme
@@ -1,6 +1,6 @@
 <?xml version="1.0" encoding="UTF-8"?>
 <Scheme
-   LastUpgradeVersion = "1300"
+   LastUpgradeVersion = "1430"
    version = "1.3">
    <BuildAction
       parallelizeBuildables = "YES"
diff --git a/ios/Runner/AppDelegate.swift b/ios/Runner/AppDelegate.swift
index 85e753124..ecb62220d 100644
--- a/ios/Runner/AppDelegate.swift
+++ b/ios/Runner/AppDelegate.swift
@@ -170,8 +170,8 @@ import Starscream
         
 
         let metadata = AppMetadata(
-            name: "Autonomy",
-            description: "Autonomy Wallet",
+            name: "Feral File",
+            description: "Feral File Wallet",
             url: "https://autonomy.io",
             icons: [])
         
diff --git a/ios/Runner/Assets.xcassets/.DS_Store b/ios/Runner/Assets.xcassets/.DS_Store
new file mode 100644
index 000000000..51ca591ec
Binary files /dev/null and b/ios/Runner/Assets.xcassets/.DS_Store differ
diff --git a/ios/Runner/Assets.xcassets/AppIcon.appiconset/100.png b/ios/Runner/Assets.xcassets/AppIcon.appiconset/100.png
deleted file mode 100644
index f1a2590e2..000000000
Binary files a/ios/Runner/Assets.xcassets/AppIcon.appiconset/100.png and /dev/null differ
diff --git a/ios/Runner/Assets.xcassets/AppIcon.appiconset/1024.png b/ios/Runner/Assets.xcassets/AppIcon.appiconset/1024.png
deleted file mode 100644
index 790ea2311..000000000
Binary files a/ios/Runner/Assets.xcassets/AppIcon.appiconset/1024.png and /dev/null differ
diff --git a/ios/Runner/Assets.xcassets/AppIcon.appiconset/114.png b/ios/Runner/Assets.xcassets/AppIcon.appiconset/114.png
deleted file mode 100644
index e6d722a79..000000000
Binary files a/ios/Runner/Assets.xcassets/AppIcon.appiconset/114.png and /dev/null differ
diff --git a/ios/Runner/Assets.xcassets/AppIcon.appiconset/120.png b/ios/Runner/Assets.xcassets/AppIcon.appiconset/120.png
deleted file mode 100644
index 6e0594053..000000000
Binary files a/ios/Runner/Assets.xcassets/AppIcon.appiconset/120.png and /dev/null differ
diff --git a/ios/Runner/Assets.xcassets/AppIcon.appiconset/128.png b/ios/Runner/Assets.xcassets/AppIcon.appiconset/128.png
deleted file mode 100644
index da31dfe0b..000000000
Binary files a/ios/Runner/Assets.xcassets/AppIcon.appiconset/128.png and /dev/null differ
diff --git a/ios/Runner/Assets.xcassets/AppIcon.appiconset/144.png b/ios/Runner/Assets.xcassets/AppIcon.appiconset/144.png
deleted file mode 100644
index 5e3e9c40d..000000000
Binary files a/ios/Runner/Assets.xcassets/AppIcon.appiconset/144.png and /dev/null differ
diff --git a/ios/Runner/Assets.xcassets/AppIcon.appiconset/152.png b/ios/Runner/Assets.xcassets/AppIcon.appiconset/152.png
deleted file mode 100644
index b9bc49b27..000000000
Binary files a/ios/Runner/Assets.xcassets/AppIcon.appiconset/152.png and /dev/null differ
diff --git a/ios/Runner/Assets.xcassets/AppIcon.appiconset/16.png b/ios/Runner/Assets.xcassets/AppIcon.appiconset/16.png
deleted file mode 100644
index d30f28914..000000000
Binary files a/ios/Runner/Assets.xcassets/AppIcon.appiconset/16.png and /dev/null differ
diff --git a/ios/Runner/Assets.xcassets/AppIcon.appiconset/167.png b/ios/Runner/Assets.xcassets/AppIcon.appiconset/167.png
deleted file mode 100644
index 4b4b8b6dc..000000000
Binary files a/ios/Runner/Assets.xcassets/AppIcon.appiconset/167.png and /dev/null differ
diff --git a/ios/Runner/Assets.xcassets/AppIcon.appiconset/172.png b/ios/Runner/Assets.xcassets/AppIcon.appiconset/172.png
deleted file mode 100644
index ff0047f9e..000000000
Binary files a/ios/Runner/Assets.xcassets/AppIcon.appiconset/172.png and /dev/null differ
diff --git a/ios/Runner/Assets.xcassets/AppIcon.appiconset/180.png b/ios/Runner/Assets.xcassets/AppIcon.appiconset/180.png
deleted file mode 100644
index ce2c959dd..000000000
Binary files a/ios/Runner/Assets.xcassets/AppIcon.appiconset/180.png and /dev/null differ
diff --git a/ios/Runner/Assets.xcassets/AppIcon.appiconset/196.png b/ios/Runner/Assets.xcassets/AppIcon.appiconset/196.png
deleted file mode 100644
index 2c656120c..000000000
Binary files a/ios/Runner/Assets.xcassets/AppIcon.appiconset/196.png and /dev/null differ
diff --git a/ios/Runner/Assets.xcassets/AppIcon.appiconset/20.png b/ios/Runner/Assets.xcassets/AppIcon.appiconset/20.png
deleted file mode 100644
index 90bfd0f38..000000000
Binary files a/ios/Runner/Assets.xcassets/AppIcon.appiconset/20.png and /dev/null differ
diff --git a/ios/Runner/Assets.xcassets/AppIcon.appiconset/216.png b/ios/Runner/Assets.xcassets/AppIcon.appiconset/216.png
deleted file mode 100644
index e9b53f3e7..000000000
Binary files a/ios/Runner/Assets.xcassets/AppIcon.appiconset/216.png and /dev/null differ
diff --git a/ios/Runner/Assets.xcassets/AppIcon.appiconset/256.png b/ios/Runner/Assets.xcassets/AppIcon.appiconset/256.png
deleted file mode 100644
index 79e07fbbb..000000000
Binary files a/ios/Runner/Assets.xcassets/AppIcon.appiconset/256.png and /dev/null differ
diff --git a/ios/Runner/Assets.xcassets/AppIcon.appiconset/29.png b/ios/Runner/Assets.xcassets/AppIcon.appiconset/29.png
deleted file mode 100644
index eed4e5791..000000000
Binary files a/ios/Runner/Assets.xcassets/AppIcon.appiconset/29.png and /dev/null differ
diff --git a/ios/Runner/Assets.xcassets/AppIcon.appiconset/32.png b/ios/Runner/Assets.xcassets/AppIcon.appiconset/32.png
deleted file mode 100644
index c453d4bdf..000000000
Binary files a/ios/Runner/Assets.xcassets/AppIcon.appiconset/32.png and /dev/null differ
diff --git a/ios/Runner/Assets.xcassets/AppIcon.appiconset/40.png b/ios/Runner/Assets.xcassets/AppIcon.appiconset/40.png
deleted file mode 100644
index 8cf6721d4..000000000
Binary files a/ios/Runner/Assets.xcassets/AppIcon.appiconset/40.png and /dev/null differ
diff --git a/ios/Runner/Assets.xcassets/AppIcon.appiconset/48.png b/ios/Runner/Assets.xcassets/AppIcon.appiconset/48.png
deleted file mode 100644
index 4982015f9..000000000
Binary files a/ios/Runner/Assets.xcassets/AppIcon.appiconset/48.png and /dev/null differ
diff --git a/ios/Runner/Assets.xcassets/AppIcon.appiconset/50.png b/ios/Runner/Assets.xcassets/AppIcon.appiconset/50.png
index 44e8bdf2f..df13c3332 100644
Binary files a/ios/Runner/Assets.xcassets/AppIcon.appiconset/50.png and b/ios/Runner/Assets.xcassets/AppIcon.appiconset/50.png differ
diff --git a/ios/Runner/Assets.xcassets/AppIcon.appiconset/50x2.png b/ios/Runner/Assets.xcassets/AppIcon.appiconset/50x2.png
new file mode 100644
index 000000000..8e4029988
Binary files /dev/null and b/ios/Runner/Assets.xcassets/AppIcon.appiconset/50x2.png differ
diff --git a/ios/Runner/Assets.xcassets/AppIcon.appiconset/512.png b/ios/Runner/Assets.xcassets/AppIcon.appiconset/512.png
deleted file mode 100644
index d72f6ecc6..000000000
Binary files a/ios/Runner/Assets.xcassets/AppIcon.appiconset/512.png and /dev/null differ
diff --git a/ios/Runner/Assets.xcassets/AppIcon.appiconset/55.png b/ios/Runner/Assets.xcassets/AppIcon.appiconset/55.png
deleted file mode 100644
index aa85c1408..000000000
Binary files a/ios/Runner/Assets.xcassets/AppIcon.appiconset/55.png and /dev/null differ
diff --git a/ios/Runner/Assets.xcassets/AppIcon.appiconset/57.png b/ios/Runner/Assets.xcassets/AppIcon.appiconset/57.png
index 28556cb1d..2672338c8 100644
Binary files a/ios/Runner/Assets.xcassets/AppIcon.appiconset/57.png and b/ios/Runner/Assets.xcassets/AppIcon.appiconset/57.png differ
diff --git a/ios/Runner/Assets.xcassets/AppIcon.appiconset/57x2.png b/ios/Runner/Assets.xcassets/AppIcon.appiconset/57x2.png
new file mode 100644
index 000000000..9178b1012
Binary files /dev/null and b/ios/Runner/Assets.xcassets/AppIcon.appiconset/57x2.png differ
diff --git a/ios/Runner/Assets.xcassets/AppIcon.appiconset/58.png b/ios/Runner/Assets.xcassets/AppIcon.appiconset/58.png
deleted file mode 100644
index b14b22dde..000000000
Binary files a/ios/Runner/Assets.xcassets/AppIcon.appiconset/58.png and /dev/null differ
diff --git a/ios/Runner/Assets.xcassets/AppIcon.appiconset/60.png b/ios/Runner/Assets.xcassets/AppIcon.appiconset/60.png
deleted file mode 100644
index ae7f4f61f..000000000
Binary files a/ios/Runner/Assets.xcassets/AppIcon.appiconset/60.png and /dev/null differ
diff --git a/ios/Runner/Assets.xcassets/AppIcon.appiconset/64.png b/ios/Runner/Assets.xcassets/AppIcon.appiconset/64.png
deleted file mode 100644
index c0cb5ff4c..000000000
Binary files a/ios/Runner/Assets.xcassets/AppIcon.appiconset/64.png and /dev/null differ
diff --git a/ios/Runner/Assets.xcassets/AppIcon.appiconset/72.png b/ios/Runner/Assets.xcassets/AppIcon.appiconset/72.png
index 321591a79..84e13e9cb 100644
Binary files a/ios/Runner/Assets.xcassets/AppIcon.appiconset/72.png and b/ios/Runner/Assets.xcassets/AppIcon.appiconset/72.png differ
diff --git a/ios/Runner/Assets.xcassets/AppIcon.appiconset/72x2.png b/ios/Runner/Assets.xcassets/AppIcon.appiconset/72x2.png
new file mode 100644
index 000000000..eeaf02f38
Binary files /dev/null and b/ios/Runner/Assets.xcassets/AppIcon.appiconset/72x2.png differ
diff --git a/ios/Runner/Assets.xcassets/AppIcon.appiconset/76.png b/ios/Runner/Assets.xcassets/AppIcon.appiconset/76.png
deleted file mode 100644
index 01460484f..000000000
Binary files a/ios/Runner/Assets.xcassets/AppIcon.appiconset/76.png and /dev/null differ
diff --git a/ios/Runner/Assets.xcassets/AppIcon.appiconset/80.png b/ios/Runner/Assets.xcassets/AppIcon.appiconset/80.png
deleted file mode 100644
index 1bfa8872c..000000000
Binary files a/ios/Runner/Assets.xcassets/AppIcon.appiconset/80.png and /dev/null differ
diff --git a/ios/Runner/Assets.xcassets/AppIcon.appiconset/87.png b/ios/Runner/Assets.xcassets/AppIcon.appiconset/87.png
deleted file mode 100644
index f08f7add9..000000000
Binary files a/ios/Runner/Assets.xcassets/AppIcon.appiconset/87.png and /dev/null differ
diff --git a/ios/Runner/Assets.xcassets/AppIcon.appiconset/88.png b/ios/Runner/Assets.xcassets/AppIcon.appiconset/88.png
deleted file mode 100644
index 172a9abca..000000000
Binary files a/ios/Runner/Assets.xcassets/AppIcon.appiconset/88.png and /dev/null differ
diff --git a/ios/Runner/Assets.xcassets/AppIcon.appiconset/App 1-1024 1.png b/ios/Runner/Assets.xcassets/AppIcon.appiconset/App 1-1024 1.png
new file mode 100644
index 000000000..00ef0c786
Binary files /dev/null and b/ios/Runner/Assets.xcassets/AppIcon.appiconset/App 1-1024 1.png differ
diff --git a/ios/Runner/Assets.xcassets/AppIcon.appiconset/App 1-1024.png b/ios/Runner/Assets.xcassets/AppIcon.appiconset/App 1-1024.png
new file mode 100644
index 000000000..00ef0c786
Binary files /dev/null and b/ios/Runner/Assets.xcassets/AppIcon.appiconset/App 1-1024.png differ
diff --git a/ios/Runner/Assets.xcassets/AppIcon.appiconset/App 1-1024@1x.png b/ios/Runner/Assets.xcassets/AppIcon.appiconset/App 1-1024@1x.png
new file mode 100644
index 000000000..00ef0c786
Binary files /dev/null and b/ios/Runner/Assets.xcassets/AppIcon.appiconset/App 1-1024@1x.png differ
diff --git a/ios/Runner/Assets.xcassets/AppIcon.appiconset/App 1-108@2x.png b/ios/Runner/Assets.xcassets/AppIcon.appiconset/App 1-108@2x.png
new file mode 100644
index 000000000..b7d23ddb6
Binary files /dev/null and b/ios/Runner/Assets.xcassets/AppIcon.appiconset/App 1-108@2x.png differ
diff --git a/ios/Runner/Assets.xcassets/AppIcon.appiconset/App 1-128.png b/ios/Runner/Assets.xcassets/AppIcon.appiconset/App 1-128.png
new file mode 100644
index 000000000..437375557
Binary files /dev/null and b/ios/Runner/Assets.xcassets/AppIcon.appiconset/App 1-128.png differ
diff --git a/ios/Runner/Assets.xcassets/AppIcon.appiconset/App 1-16.png b/ios/Runner/Assets.xcassets/AppIcon.appiconset/App 1-16.png
new file mode 100644
index 000000000..fd94f86c1
Binary files /dev/null and b/ios/Runner/Assets.xcassets/AppIcon.appiconset/App 1-16.png differ
diff --git a/ios/Runner/Assets.xcassets/AppIcon.appiconset/App 1-20.png b/ios/Runner/Assets.xcassets/AppIcon.appiconset/App 1-20.png
new file mode 100644
index 000000000..ec069e41f
Binary files /dev/null and b/ios/Runner/Assets.xcassets/AppIcon.appiconset/App 1-20.png differ
diff --git a/ios/Runner/Assets.xcassets/AppIcon.appiconset/App 1-20@2x 1.png b/ios/Runner/Assets.xcassets/AppIcon.appiconset/App 1-20@2x 1.png
new file mode 100644
index 000000000..32e9c3440
Binary files /dev/null and b/ios/Runner/Assets.xcassets/AppIcon.appiconset/App 1-20@2x 1.png differ
diff --git a/ios/Runner/Assets.xcassets/AppIcon.appiconset/App 1-20@2x.png b/ios/Runner/Assets.xcassets/AppIcon.appiconset/App 1-20@2x.png
new file mode 100644
index 000000000..32e9c3440
Binary files /dev/null and b/ios/Runner/Assets.xcassets/AppIcon.appiconset/App 1-20@2x.png differ
diff --git a/ios/Runner/Assets.xcassets/AppIcon.appiconset/App 1-20@3x.png b/ios/Runner/Assets.xcassets/AppIcon.appiconset/App 1-20@3x.png
new file mode 100644
index 000000000..82d67eb8f
Binary files /dev/null and b/ios/Runner/Assets.xcassets/AppIcon.appiconset/App 1-20@3x.png differ
diff --git a/ios/Runner/Assets.xcassets/AppIcon.appiconset/App 1-24@2x.png b/ios/Runner/Assets.xcassets/AppIcon.appiconset/App 1-24@2x.png
new file mode 100644
index 000000000..de7c5e988
Binary files /dev/null and b/ios/Runner/Assets.xcassets/AppIcon.appiconset/App 1-24@2x.png differ
diff --git a/ios/Runner/Assets.xcassets/AppIcon.appiconset/App 1-256 1.png b/ios/Runner/Assets.xcassets/AppIcon.appiconset/App 1-256 1.png
new file mode 100644
index 000000000..d96e14036
Binary files /dev/null and b/ios/Runner/Assets.xcassets/AppIcon.appiconset/App 1-256 1.png differ
diff --git a/ios/Runner/Assets.xcassets/AppIcon.appiconset/App 1-256.png b/ios/Runner/Assets.xcassets/AppIcon.appiconset/App 1-256.png
new file mode 100644
index 000000000..d96e14036
Binary files /dev/null and b/ios/Runner/Assets.xcassets/AppIcon.appiconset/App 1-256.png differ
diff --git a/ios/Runner/Assets.xcassets/AppIcon.appiconset/App 1-27-5@2x.png b/ios/Runner/Assets.xcassets/AppIcon.appiconset/App 1-27-5@2x.png
new file mode 100644
index 000000000..22c4915c5
Binary files /dev/null and b/ios/Runner/Assets.xcassets/AppIcon.appiconset/App 1-27-5@2x.png differ
diff --git a/ios/Runner/Assets.xcassets/AppIcon.appiconset/App 1-29 1.png b/ios/Runner/Assets.xcassets/AppIcon.appiconset/App 1-29 1.png
new file mode 100644
index 000000000..bf3e555fb
Binary files /dev/null and b/ios/Runner/Assets.xcassets/AppIcon.appiconset/App 1-29 1.png differ
diff --git a/ios/Runner/Assets.xcassets/AppIcon.appiconset/App 1-29.png b/ios/Runner/Assets.xcassets/AppIcon.appiconset/App 1-29.png
new file mode 100644
index 000000000..bf3e555fb
Binary files /dev/null and b/ios/Runner/Assets.xcassets/AppIcon.appiconset/App 1-29.png differ
diff --git a/ios/Runner/Assets.xcassets/AppIcon.appiconset/App 1-29@2x 1.png b/ios/Runner/Assets.xcassets/AppIcon.appiconset/App 1-29@2x 1.png
new file mode 100644
index 000000000..bdbd7c5a7
Binary files /dev/null and b/ios/Runner/Assets.xcassets/AppIcon.appiconset/App 1-29@2x 1.png differ
diff --git a/ios/Runner/Assets.xcassets/AppIcon.appiconset/App 1-29@2x 2.png b/ios/Runner/Assets.xcassets/AppIcon.appiconset/App 1-29@2x 2.png
new file mode 100644
index 000000000..bdbd7c5a7
Binary files /dev/null and b/ios/Runner/Assets.xcassets/AppIcon.appiconset/App 1-29@2x 2.png differ
diff --git a/ios/Runner/Assets.xcassets/AppIcon.appiconset/App 1-29@2x.png b/ios/Runner/Assets.xcassets/AppIcon.appiconset/App 1-29@2x.png
new file mode 100644
index 000000000..bdbd7c5a7
Binary files /dev/null and b/ios/Runner/Assets.xcassets/AppIcon.appiconset/App 1-29@2x.png differ
diff --git a/ios/Runner/Assets.xcassets/AppIcon.appiconset/App 1-29@3x 1.png b/ios/Runner/Assets.xcassets/AppIcon.appiconset/App 1-29@3x 1.png
new file mode 100644
index 000000000..83f60874c
Binary files /dev/null and b/ios/Runner/Assets.xcassets/AppIcon.appiconset/App 1-29@3x 1.png differ
diff --git a/ios/Runner/Assets.xcassets/AppIcon.appiconset/App 1-29@3x.png b/ios/Runner/Assets.xcassets/AppIcon.appiconset/App 1-29@3x.png
new file mode 100644
index 000000000..83f60874c
Binary files /dev/null and b/ios/Runner/Assets.xcassets/AppIcon.appiconset/App 1-29@3x.png differ
diff --git a/ios/Runner/Assets.xcassets/AppIcon.appiconset/App 1-32 1.png b/ios/Runner/Assets.xcassets/AppIcon.appiconset/App 1-32 1.png
new file mode 100644
index 000000000..51ef0ab1f
Binary files /dev/null and b/ios/Runner/Assets.xcassets/AppIcon.appiconset/App 1-32 1.png differ
diff --git a/ios/Runner/Assets.xcassets/AppIcon.appiconset/App 1-32.png b/ios/Runner/Assets.xcassets/AppIcon.appiconset/App 1-32.png
new file mode 100644
index 000000000..51ef0ab1f
Binary files /dev/null and b/ios/Runner/Assets.xcassets/AppIcon.appiconset/App 1-32.png differ
diff --git a/ios/Runner/Assets.xcassets/AppIcon.appiconset/App 1-40.png b/ios/Runner/Assets.xcassets/AppIcon.appiconset/App 1-40.png
new file mode 100644
index 000000000..32e9c3440
Binary files /dev/null and b/ios/Runner/Assets.xcassets/AppIcon.appiconset/App 1-40.png differ
diff --git a/ios/Runner/Assets.xcassets/AppIcon.appiconset/App 1-40@2x 1.png b/ios/Runner/Assets.xcassets/AppIcon.appiconset/App 1-40@2x 1.png
new file mode 100644
index 000000000..11b96b96a
Binary files /dev/null and b/ios/Runner/Assets.xcassets/AppIcon.appiconset/App 1-40@2x 1.png differ
diff --git a/ios/Runner/Assets.xcassets/AppIcon.appiconset/App 1-40@2x 2.png b/ios/Runner/Assets.xcassets/AppIcon.appiconset/App 1-40@2x 2.png
new file mode 100644
index 000000000..11b96b96a
Binary files /dev/null and b/ios/Runner/Assets.xcassets/AppIcon.appiconset/App 1-40@2x 2.png differ
diff --git a/ios/Runner/Assets.xcassets/AppIcon.appiconset/App 1-40@2x.png b/ios/Runner/Assets.xcassets/AppIcon.appiconset/App 1-40@2x.png
new file mode 100644
index 000000000..11b96b96a
Binary files /dev/null and b/ios/Runner/Assets.xcassets/AppIcon.appiconset/App 1-40@2x.png differ
diff --git a/ios/Runner/Assets.xcassets/AppIcon.appiconset/App 1-40@3x.png b/ios/Runner/Assets.xcassets/AppIcon.appiconset/App 1-40@3x.png
new file mode 100644
index 000000000..14d040dce
Binary files /dev/null and b/ios/Runner/Assets.xcassets/AppIcon.appiconset/App 1-40@3x.png differ
diff --git a/ios/Runner/Assets.xcassets/AppIcon.appiconset/App 1-44@2x.png b/ios/Runner/Assets.xcassets/AppIcon.appiconset/App 1-44@2x.png
new file mode 100644
index 000000000..66eacea7b
Binary files /dev/null and b/ios/Runner/Assets.xcassets/AppIcon.appiconset/App 1-44@2x.png differ
diff --git a/ios/Runner/Assets.xcassets/AppIcon.appiconset/App 1-46@2x.png b/ios/Runner/Assets.xcassets/AppIcon.appiconset/App 1-46@2x.png
new file mode 100644
index 000000000..fa490b09e
Binary files /dev/null and b/ios/Runner/Assets.xcassets/AppIcon.appiconset/App 1-46@2x.png differ
diff --git a/ios/Runner/Assets.xcassets/AppIcon.appiconset/App 1-50@2x.png b/ios/Runner/Assets.xcassets/AppIcon.appiconset/App 1-50@2x.png
new file mode 100644
index 000000000..9f444b53f
Binary files /dev/null and b/ios/Runner/Assets.xcassets/AppIcon.appiconset/App 1-50@2x.png differ
diff --git a/ios/Runner/Assets.xcassets/AppIcon.appiconset/App 1-512 1.png b/ios/Runner/Assets.xcassets/AppIcon.appiconset/App 1-512 1.png
new file mode 100644
index 000000000..d480c531c
Binary files /dev/null and b/ios/Runner/Assets.xcassets/AppIcon.appiconset/App 1-512 1.png differ
diff --git a/ios/Runner/Assets.xcassets/AppIcon.appiconset/App 1-512.png b/ios/Runner/Assets.xcassets/AppIcon.appiconset/App 1-512.png
new file mode 100644
index 000000000..d480c531c
Binary files /dev/null and b/ios/Runner/Assets.xcassets/AppIcon.appiconset/App 1-512.png differ
diff --git a/ios/Runner/Assets.xcassets/AppIcon.appiconset/App 1-60@2x.png b/ios/Runner/Assets.xcassets/AppIcon.appiconset/App 1-60@2x.png
new file mode 100644
index 000000000..14d040dce
Binary files /dev/null and b/ios/Runner/Assets.xcassets/AppIcon.appiconset/App 1-60@2x.png differ
diff --git a/ios/Runner/Assets.xcassets/AppIcon.appiconset/App 1-60@3x.png b/ios/Runner/Assets.xcassets/AppIcon.appiconset/App 1-60@3x.png
new file mode 100644
index 000000000..a30695303
Binary files /dev/null and b/ios/Runner/Assets.xcassets/AppIcon.appiconset/App 1-60@3x.png differ
diff --git a/ios/Runner/Assets.xcassets/AppIcon.appiconset/App 1-64.png b/ios/Runner/Assets.xcassets/AppIcon.appiconset/App 1-64.png
new file mode 100644
index 000000000..d14643973
Binary files /dev/null and b/ios/Runner/Assets.xcassets/AppIcon.appiconset/App 1-64.png differ
diff --git a/ios/Runner/Assets.xcassets/AppIcon.appiconset/App 1-76.png b/ios/Runner/Assets.xcassets/AppIcon.appiconset/App 1-76.png
new file mode 100644
index 000000000..d4bd9a554
Binary files /dev/null and b/ios/Runner/Assets.xcassets/AppIcon.appiconset/App 1-76.png differ
diff --git a/ios/Runner/Assets.xcassets/AppIcon.appiconset/App 1-76@2x.png b/ios/Runner/Assets.xcassets/AppIcon.appiconset/App 1-76@2x.png
new file mode 100644
index 000000000..e0dd5f623
Binary files /dev/null and b/ios/Runner/Assets.xcassets/AppIcon.appiconset/App 1-76@2x.png differ
diff --git a/ios/Runner/Assets.xcassets/AppIcon.appiconset/App 1-83.5@2x.png b/ios/Runner/Assets.xcassets/AppIcon.appiconset/App 1-83.5@2x.png
new file mode 100644
index 000000000..8479e5ed2
Binary files /dev/null and b/ios/Runner/Assets.xcassets/AppIcon.appiconset/App 1-83.5@2x.png differ
diff --git a/ios/Runner/Assets.xcassets/AppIcon.appiconset/App 1-86@2x.png b/ios/Runner/Assets.xcassets/AppIcon.appiconset/App 1-86@2x.png
new file mode 100644
index 000000000..8d8b4642c
Binary files /dev/null and b/ios/Runner/Assets.xcassets/AppIcon.appiconset/App 1-86@2x.png differ
diff --git a/ios/Runner/Assets.xcassets/AppIcon.appiconset/App 1-98@2x.png b/ios/Runner/Assets.xcassets/AppIcon.appiconset/App 1-98@2x.png
new file mode 100644
index 000000000..401ec0655
Binary files /dev/null and b/ios/Runner/Assets.xcassets/AppIcon.appiconset/App 1-98@2x.png differ
diff --git a/ios/Runner/Assets.xcassets/AppIcon.appiconset/Contents.json b/ios/Runner/Assets.xcassets/AppIcon.appiconset/Contents.json
index f78687a21..97123443d 100644
--- a/ios/Runner/Assets.xcassets/AppIcon.appiconset/Contents.json
+++ b/ios/Runner/Assets.xcassets/AppIcon.appiconset/Contents.json
@@ -1,43 +1,43 @@
 {
   "images" : [
     {
-      "filename" : "40.png",
+      "filename" : "App 1-20@2x.png",
       "idiom" : "iphone",
       "scale" : "2x",
       "size" : "20x20"
     },
     {
-      "filename" : "60.png",
+      "filename" : "App 1-20@3x.png",
       "idiom" : "iphone",
       "scale" : "3x",
       "size" : "20x20"
     },
     {
-      "filename" : "29.png",
+      "filename" : "App 1-29.png",
       "idiom" : "iphone",
       "scale" : "1x",
       "size" : "29x29"
     },
     {
-      "filename" : "58.png",
+      "filename" : "App 1-29@2x.png",
       "idiom" : "iphone",
       "scale" : "2x",
       "size" : "29x29"
     },
     {
-      "filename" : "87.png",
+      "filename" : "App 1-29@3x.png",
       "idiom" : "iphone",
       "scale" : "3x",
       "size" : "29x29"
     },
     {
-      "filename" : "80.png",
+      "filename" : "App 1-40@2x.png",
       "idiom" : "iphone",
       "scale" : "2x",
       "size" : "40x40"
     },
     {
-      "filename" : "120.png",
+      "filename" : "App 1-40@3x.png",
       "idiom" : "iphone",
       "scale" : "3x",
       "size" : "40x40"
@@ -49,55 +49,55 @@
       "size" : "57x57"
     },
     {
-      "filename" : "114.png",
+      "filename" : "57x2.png",
       "idiom" : "iphone",
       "scale" : "2x",
       "size" : "57x57"
     },
     {
-      "filename" : "120.png",
+      "filename" : "App 1-60@2x.png",
       "idiom" : "iphone",
       "scale" : "2x",
       "size" : "60x60"
     },
     {
-      "filename" : "180.png",
+      "filename" : "App 1-60@3x.png",
       "idiom" : "iphone",
       "scale" : "3x",
       "size" : "60x60"
     },
     {
-      "filename" : "20.png",
+      "filename" : "App 1-20.png",
       "idiom" : "ipad",
       "scale" : "1x",
       "size" : "20x20"
     },
     {
-      "filename" : "40.png",
+      "filename" : "App 1-20@2x 1.png",
       "idiom" : "ipad",
       "scale" : "2x",
       "size" : "20x20"
     },
     {
-      "filename" : "29.png",
+      "filename" : "App 1-29 1.png",
       "idiom" : "ipad",
       "scale" : "1x",
       "size" : "29x29"
     },
     {
-      "filename" : "58.png",
+      "filename" : "App 1-29@2x 1.png",
       "idiom" : "ipad",
       "scale" : "2x",
       "size" : "29x29"
     },
     {
-      "filename" : "40.png",
+      "filename" : "App 1-40.png",
       "idiom" : "ipad",
       "scale" : "1x",
       "size" : "40x40"
     },
     {
-      "filename" : "80.png",
+      "filename" : "App 1-40@2x 1.png",
       "idiom" : "ipad",
       "scale" : "2x",
       "size" : "40x40"
@@ -109,7 +109,7 @@
       "size" : "50x50"
     },
     {
-      "filename" : "100.png",
+      "filename" : "50x2.png",
       "idiom" : "ipad",
       "scale" : "2x",
       "size" : "50x50"
@@ -121,97 +121,97 @@
       "size" : "72x72"
     },
     {
-      "filename" : "144.png",
+      "filename" : "72x2.png",
       "idiom" : "ipad",
       "scale" : "2x",
       "size" : "72x72"
     },
     {
-      "filename" : "76.png",
+      "filename" : "App 1-76.png",
       "idiom" : "ipad",
       "scale" : "1x",
       "size" : "76x76"
     },
     {
-      "filename" : "152.png",
+      "filename" : "App 1-76@2x.png",
       "idiom" : "ipad",
       "scale" : "2x",
       "size" : "76x76"
     },
     {
-      "filename" : "167.png",
+      "filename" : "App 1-83.5@2x.png",
       "idiom" : "ipad",
       "scale" : "2x",
       "size" : "83.5x83.5"
     },
     {
-      "filename" : "1024.png",
+      "filename" : "App 1-1024.png",
       "idiom" : "ios-marketing",
       "scale" : "1x",
       "size" : "1024x1024"
     },
     {
-      "filename" : "16.png",
+      "filename" : "App 1-16.png",
       "idiom" : "mac",
       "scale" : "1x",
       "size" : "16x16"
     },
     {
-      "filename" : "32.png",
+      "filename" : "App 1-32.png",
       "idiom" : "mac",
       "scale" : "2x",
       "size" : "16x16"
     },
     {
-      "filename" : "32.png",
+      "filename" : "App 1-32 1.png",
       "idiom" : "mac",
       "scale" : "1x",
       "size" : "32x32"
     },
     {
-      "filename" : "64.png",
+      "filename" : "App 1-64.png",
       "idiom" : "mac",
       "scale" : "2x",
       "size" : "32x32"
     },
     {
-      "filename" : "128.png",
+      "filename" : "App 1-128.png",
       "idiom" : "mac",
       "scale" : "1x",
       "size" : "128x128"
     },
     {
-      "filename" : "256.png",
+      "filename" : "App 1-256.png",
       "idiom" : "mac",
       "scale" : "2x",
       "size" : "128x128"
     },
     {
-      "filename" : "256.png",
+      "filename" : "App 1-256 1.png",
       "idiom" : "mac",
       "scale" : "1x",
       "size" : "256x256"
     },
     {
-      "filename" : "512.png",
+      "filename" : "App 1-512.png",
       "idiom" : "mac",
       "scale" : "2x",
       "size" : "256x256"
     },
     {
-      "filename" : "512.png",
+      "filename" : "App 1-512 1.png",
       "idiom" : "mac",
       "scale" : "1x",
       "size" : "512x512"
     },
     {
-      "filename" : "1024.png",
+      "filename" : "App 1-1024 1.png",
       "idiom" : "mac",
       "scale" : "2x",
       "size" : "512x512"
     },
     {
-      "filename" : "48.png",
+      "filename" : "App 1-24@2x.png",
       "idiom" : "watch",
       "role" : "notificationCenter",
       "scale" : "2x",
@@ -219,7 +219,7 @@
       "subtype" : "38mm"
     },
     {
-      "filename" : "55.png",
+      "filename" : "App 1-27-5@2x.png",
       "idiom" : "watch",
       "role" : "notificationCenter",
       "scale" : "2x",
@@ -227,14 +227,14 @@
       "subtype" : "42mm"
     },
     {
-      "filename" : "58.png",
+      "filename" : "App 1-29@2x 2.png",
       "idiom" : "watch",
       "role" : "companionSettings",
       "scale" : "2x",
       "size" : "29x29"
     },
     {
-      "filename" : "87.png",
+      "filename" : "App 1-29@3x 1.png",
       "idiom" : "watch",
       "role" : "companionSettings",
       "scale" : "3x",
@@ -248,7 +248,7 @@
       "subtype" : "45mm"
     },
     {
-      "filename" : "80.png",
+      "filename" : "App 1-40@2x 2.png",
       "idiom" : "watch",
       "role" : "appLauncher",
       "scale" : "2x",
@@ -256,7 +256,7 @@
       "subtype" : "38mm"
     },
     {
-      "filename" : "88.png",
+      "filename" : "App 1-44@2x.png",
       "idiom" : "watch",
       "role" : "appLauncher",
       "scale" : "2x",
@@ -264,6 +264,7 @@
       "subtype" : "40mm"
     },
     {
+      "filename" : "App 1-46@2x.png",
       "idiom" : "watch",
       "role" : "appLauncher",
       "scale" : "2x",
@@ -271,7 +272,7 @@
       "subtype" : "41mm"
     },
     {
-      "filename" : "100.png",
+      "filename" : "App 1-50@2x.png",
       "idiom" : "watch",
       "role" : "appLauncher",
       "scale" : "2x",
@@ -293,7 +294,7 @@
       "subtype" : "49mm"
     },
     {
-      "filename" : "172.png",
+      "filename" : "App 1-86@2x.png",
       "idiom" : "watch",
       "role" : "quickLook",
       "scale" : "2x",
@@ -301,7 +302,7 @@
       "subtype" : "38mm"
     },
     {
-      "filename" : "196.png",
+      "filename" : "App 1-98@2x.png",
       "idiom" : "watch",
       "role" : "quickLook",
       "scale" : "2x",
@@ -309,7 +310,7 @@
       "subtype" : "42mm"
     },
     {
-      "filename" : "216.png",
+      "filename" : "App 1-108@2x.png",
       "idiom" : "watch",
       "role" : "quickLook",
       "scale" : "2x",
@@ -331,7 +332,7 @@
       "subtype" : "49mm"
     },
     {
-      "filename" : "1024.png",
+      "filename" : "App 1-1024@1x.png",
       "idiom" : "watch-marketing",
       "scale" : "1x",
       "size" : "1024x1024"
diff --git a/ios/Runner/Assets.xcassets/InhouseAppIcon.appiconset/App 1-1024.png b/ios/Runner/Assets.xcassets/InhouseAppIcon.appiconset/App 1-1024.png
new file mode 100644
index 000000000..00ef0c786
Binary files /dev/null and b/ios/Runner/Assets.xcassets/InhouseAppIcon.appiconset/App 1-1024.png differ
diff --git a/ios/Runner/Assets.xcassets/InhouseAppIcon.appiconset/App 1-20.png b/ios/Runner/Assets.xcassets/InhouseAppIcon.appiconset/App 1-20.png
new file mode 100644
index 000000000..ec069e41f
Binary files /dev/null and b/ios/Runner/Assets.xcassets/InhouseAppIcon.appiconset/App 1-20.png differ
diff --git a/ios/Runner/Assets.xcassets/InhouseAppIcon.appiconset/App 1-20@2x 1.png b/ios/Runner/Assets.xcassets/InhouseAppIcon.appiconset/App 1-20@2x 1.png
new file mode 100644
index 000000000..32e9c3440
Binary files /dev/null and b/ios/Runner/Assets.xcassets/InhouseAppIcon.appiconset/App 1-20@2x 1.png differ
diff --git a/ios/Runner/Assets.xcassets/InhouseAppIcon.appiconset/App 1-20@2x.png b/ios/Runner/Assets.xcassets/InhouseAppIcon.appiconset/App 1-20@2x.png
new file mode 100644
index 000000000..32e9c3440
Binary files /dev/null and b/ios/Runner/Assets.xcassets/InhouseAppIcon.appiconset/App 1-20@2x.png differ
diff --git a/ios/Runner/Assets.xcassets/InhouseAppIcon.appiconset/App 1-20@3x.png b/ios/Runner/Assets.xcassets/InhouseAppIcon.appiconset/App 1-20@3x.png
new file mode 100644
index 000000000..82d67eb8f
Binary files /dev/null and b/ios/Runner/Assets.xcassets/InhouseAppIcon.appiconset/App 1-20@3x.png differ
diff --git a/ios/Runner/Assets.xcassets/InhouseAppIcon.appiconset/App 1-29 1.png b/ios/Runner/Assets.xcassets/InhouseAppIcon.appiconset/App 1-29 1.png
new file mode 100644
index 000000000..bf3e555fb
Binary files /dev/null and b/ios/Runner/Assets.xcassets/InhouseAppIcon.appiconset/App 1-29 1.png differ
diff --git a/ios/Runner/Assets.xcassets/InhouseAppIcon.appiconset/App 1-29.png b/ios/Runner/Assets.xcassets/InhouseAppIcon.appiconset/App 1-29.png
new file mode 100644
index 000000000..bf3e555fb
Binary files /dev/null and b/ios/Runner/Assets.xcassets/InhouseAppIcon.appiconset/App 1-29.png differ
diff --git a/ios/Runner/Assets.xcassets/InhouseAppIcon.appiconset/App 1-29@2x 1.png b/ios/Runner/Assets.xcassets/InhouseAppIcon.appiconset/App 1-29@2x 1.png
new file mode 100644
index 000000000..bdbd7c5a7
Binary files /dev/null and b/ios/Runner/Assets.xcassets/InhouseAppIcon.appiconset/App 1-29@2x 1.png differ
diff --git a/ios/Runner/Assets.xcassets/InhouseAppIcon.appiconset/App 1-29@2x.png b/ios/Runner/Assets.xcassets/InhouseAppIcon.appiconset/App 1-29@2x.png
new file mode 100644
index 000000000..bdbd7c5a7
Binary files /dev/null and b/ios/Runner/Assets.xcassets/InhouseAppIcon.appiconset/App 1-29@2x.png differ
diff --git a/ios/Runner/Assets.xcassets/InhouseAppIcon.appiconset/App 1-29@3x.png b/ios/Runner/Assets.xcassets/InhouseAppIcon.appiconset/App 1-29@3x.png
new file mode 100644
index 000000000..83f60874c
Binary files /dev/null and b/ios/Runner/Assets.xcassets/InhouseAppIcon.appiconset/App 1-29@3x.png differ
diff --git a/ios/Runner/Assets.xcassets/InhouseAppIcon.appiconset/App 1-40.png b/ios/Runner/Assets.xcassets/InhouseAppIcon.appiconset/App 1-40.png
new file mode 100644
index 000000000..32e9c3440
Binary files /dev/null and b/ios/Runner/Assets.xcassets/InhouseAppIcon.appiconset/App 1-40.png differ
diff --git a/ios/Runner/Assets.xcassets/InhouseAppIcon.appiconset/App 1-40@2x 1.png b/ios/Runner/Assets.xcassets/InhouseAppIcon.appiconset/App 1-40@2x 1.png
new file mode 100644
index 000000000..11b96b96a
Binary files /dev/null and b/ios/Runner/Assets.xcassets/InhouseAppIcon.appiconset/App 1-40@2x 1.png differ
diff --git a/ios/Runner/Assets.xcassets/InhouseAppIcon.appiconset/App 1-40@2x.png b/ios/Runner/Assets.xcassets/InhouseAppIcon.appiconset/App 1-40@2x.png
new file mode 100644
index 000000000..11b96b96a
Binary files /dev/null and b/ios/Runner/Assets.xcassets/InhouseAppIcon.appiconset/App 1-40@2x.png differ
diff --git a/ios/Runner/Assets.xcassets/InhouseAppIcon.appiconset/App 1-40@3x.png b/ios/Runner/Assets.xcassets/InhouseAppIcon.appiconset/App 1-40@3x.png
new file mode 100644
index 000000000..14d040dce
Binary files /dev/null and b/ios/Runner/Assets.xcassets/InhouseAppIcon.appiconset/App 1-40@3x.png differ
diff --git a/ios/Runner/Assets.xcassets/InhouseAppIcon.appiconset/App 1-60@2x.png b/ios/Runner/Assets.xcassets/InhouseAppIcon.appiconset/App 1-60@2x.png
new file mode 100644
index 000000000..14d040dce
Binary files /dev/null and b/ios/Runner/Assets.xcassets/InhouseAppIcon.appiconset/App 1-60@2x.png differ
diff --git a/ios/Runner/Assets.xcassets/InhouseAppIcon.appiconset/App 1-60@3x.png b/ios/Runner/Assets.xcassets/InhouseAppIcon.appiconset/App 1-60@3x.png
new file mode 100644
index 000000000..a30695303
Binary files /dev/null and b/ios/Runner/Assets.xcassets/InhouseAppIcon.appiconset/App 1-60@3x.png differ
diff --git a/ios/Runner/Assets.xcassets/InhouseAppIcon.appiconset/App 1-76.png b/ios/Runner/Assets.xcassets/InhouseAppIcon.appiconset/App 1-76.png
new file mode 100644
index 000000000..d4bd9a554
Binary files /dev/null and b/ios/Runner/Assets.xcassets/InhouseAppIcon.appiconset/App 1-76.png differ
diff --git a/ios/Runner/Assets.xcassets/InhouseAppIcon.appiconset/App 1-76@2x.png b/ios/Runner/Assets.xcassets/InhouseAppIcon.appiconset/App 1-76@2x.png
new file mode 100644
index 000000000..e0dd5f623
Binary files /dev/null and b/ios/Runner/Assets.xcassets/InhouseAppIcon.appiconset/App 1-76@2x.png differ
diff --git a/ios/Runner/Assets.xcassets/InhouseAppIcon.appiconset/App 1-83.5@2x.png b/ios/Runner/Assets.xcassets/InhouseAppIcon.appiconset/App 1-83.5@2x.png
new file mode 100644
index 000000000..8479e5ed2
Binary files /dev/null and b/ios/Runner/Assets.xcassets/InhouseAppIcon.appiconset/App 1-83.5@2x.png differ
diff --git a/ios/Runner/Assets.xcassets/InhouseAppIcon.appiconset/Contents.json b/ios/Runner/Assets.xcassets/InhouseAppIcon.appiconset/Contents.json
index 1e2d7086b..ca4775b49 100644
--- a/ios/Runner/Assets.xcassets/InhouseAppIcon.appiconset/Contents.json
+++ b/ios/Runner/Assets.xcassets/InhouseAppIcon.appiconset/Contents.json
@@ -1,115 +1,115 @@
 {
   "images" : [
     {
-      "filename" : "Icon-App-20x20@2x.png",
+      "filename" : "App 1-20@2x.png",
       "idiom" : "iphone",
       "scale" : "2x",
       "size" : "20x20"
     },
     {
-      "filename" : "Icon-App-20x20@3x.png",
+      "filename" : "App 1-20@3x.png",
       "idiom" : "iphone",
       "scale" : "3x",
       "size" : "20x20"
     },
     {
-      "filename" : "Icon-App-29x29@1x.png",
+      "filename" : "App 1-29.png",
       "idiom" : "iphone",
       "scale" : "1x",
       "size" : "29x29"
     },
     {
-      "filename" : "Icon-App-29x29@2x.png",
+      "filename" : "App 1-29@2x.png",
       "idiom" : "iphone",
       "scale" : "2x",
       "size" : "29x29"
     },
     {
-      "filename" : "Icon-App-29x29@3x.png",
+      "filename" : "App 1-29@3x.png",
       "idiom" : "iphone",
       "scale" : "3x",
       "size" : "29x29"
     },
     {
-      "filename" : "Icon-App-40x40@2x.png",
+      "filename" : "App 1-40@2x.png",
       "idiom" : "iphone",
       "scale" : "2x",
       "size" : "40x40"
     },
     {
-      "filename" : "Icon-App-40x40@3x.png",
+      "filename" : "App 1-40@3x.png",
       "idiom" : "iphone",
       "scale" : "3x",
       "size" : "40x40"
     },
     {
-      "filename" : "Icon-App-60x60@2x.png",
+      "filename" : "App 1-60@2x.png",
       "idiom" : "iphone",
       "scale" : "2x",
       "size" : "60x60"
     },
     {
-      "filename" : "Icon-App-60x60@3x.png",
+      "filename" : "App 1-60@3x.png",
       "idiom" : "iphone",
       "scale" : "3x",
       "size" : "60x60"
     },
     {
-      "filename" : "Icon-App-20x20@1x.png",
+      "filename" : "App 1-20.png",
       "idiom" : "ipad",
       "scale" : "1x",
       "size" : "20x20"
     },
     {
-      "filename" : "Icon-App-20x20@2x.png",
+      "filename" : "App 1-20@2x 1.png",
       "idiom" : "ipad",
       "scale" : "2x",
       "size" : "20x20"
     },
     {
-      "filename" : "Icon-App-29x29@1x.png",
+      "filename" : "App 1-29 1.png",
       "idiom" : "ipad",
       "scale" : "1x",
       "size" : "29x29"
     },
     {
-      "filename" : "Icon-App-29x29@2x.png",
+      "filename" : "App 1-29@2x 1.png",
       "idiom" : "ipad",
       "scale" : "2x",
       "size" : "29x29"
     },
     {
-      "filename" : "Icon-App-40x40@1x.png",
+      "filename" : "App 1-40.png",
       "idiom" : "ipad",
       "scale" : "1x",
       "size" : "40x40"
     },
     {
-      "filename" : "Icon-App-40x40@2x.png",
+      "filename" : "App 1-40@2x 1.png",
       "idiom" : "ipad",
       "scale" : "2x",
       "size" : "40x40"
     },
     {
-      "filename" : "Icon-App-76x76@1x.png",
+      "filename" : "App 1-76.png",
       "idiom" : "ipad",
       "scale" : "1x",
       "size" : "76x76"
     },
     {
-      "filename" : "Icon-App-76x76@2x.png",
+      "filename" : "App 1-76@2x.png",
       "idiom" : "ipad",
       "scale" : "2x",
       "size" : "76x76"
     },
     {
-      "filename" : "Icon-App-83.5x83.5@2x.png",
+      "filename" : "App 1-83.5@2x.png",
       "idiom" : "ipad",
       "scale" : "2x",
       "size" : "83.5x83.5"
     },
     {
-      "filename" : "ItunesArtwork@2x.png",
+      "filename" : "App 1-1024.png",
       "idiom" : "ios-marketing",
       "scale" : "1x",
       "size" : "1024x1024"
diff --git a/ios/Runner/Assets.xcassets/InhouseAppIcon.appiconset/Icon-App-20x20@1x.png b/ios/Runner/Assets.xcassets/InhouseAppIcon.appiconset/Icon-App-20x20@1x.png
deleted file mode 100644
index 962c2e9ca..000000000
Binary files a/ios/Runner/Assets.xcassets/InhouseAppIcon.appiconset/Icon-App-20x20@1x.png and /dev/null differ
diff --git a/ios/Runner/Assets.xcassets/InhouseAppIcon.appiconset/Icon-App-20x20@2x.png b/ios/Runner/Assets.xcassets/InhouseAppIcon.appiconset/Icon-App-20x20@2x.png
deleted file mode 100644
index 05b5796ab..000000000
Binary files a/ios/Runner/Assets.xcassets/InhouseAppIcon.appiconset/Icon-App-20x20@2x.png and /dev/null differ
diff --git a/ios/Runner/Assets.xcassets/InhouseAppIcon.appiconset/Icon-App-20x20@3x.png b/ios/Runner/Assets.xcassets/InhouseAppIcon.appiconset/Icon-App-20x20@3x.png
deleted file mode 100644
index 2373460b3..000000000
Binary files a/ios/Runner/Assets.xcassets/InhouseAppIcon.appiconset/Icon-App-20x20@3x.png and /dev/null differ
diff --git a/ios/Runner/Assets.xcassets/InhouseAppIcon.appiconset/Icon-App-29x29@1x.png b/ios/Runner/Assets.xcassets/InhouseAppIcon.appiconset/Icon-App-29x29@1x.png
deleted file mode 100644
index 823b124ab..000000000
Binary files a/ios/Runner/Assets.xcassets/InhouseAppIcon.appiconset/Icon-App-29x29@1x.png and /dev/null differ
diff --git a/ios/Runner/Assets.xcassets/InhouseAppIcon.appiconset/Icon-App-29x29@2x.png b/ios/Runner/Assets.xcassets/InhouseAppIcon.appiconset/Icon-App-29x29@2x.png
deleted file mode 100644
index dc2a12deb..000000000
Binary files a/ios/Runner/Assets.xcassets/InhouseAppIcon.appiconset/Icon-App-29x29@2x.png and /dev/null differ
diff --git a/ios/Runner/Assets.xcassets/InhouseAppIcon.appiconset/Icon-App-29x29@3x.png b/ios/Runner/Assets.xcassets/InhouseAppIcon.appiconset/Icon-App-29x29@3x.png
deleted file mode 100644
index a83a8deb2..000000000
Binary files a/ios/Runner/Assets.xcassets/InhouseAppIcon.appiconset/Icon-App-29x29@3x.png and /dev/null differ
diff --git a/ios/Runner/Assets.xcassets/InhouseAppIcon.appiconset/Icon-App-40x40@1x.png b/ios/Runner/Assets.xcassets/InhouseAppIcon.appiconset/Icon-App-40x40@1x.png
deleted file mode 100644
index 05b5796ab..000000000
Binary files a/ios/Runner/Assets.xcassets/InhouseAppIcon.appiconset/Icon-App-40x40@1x.png and /dev/null differ
diff --git a/ios/Runner/Assets.xcassets/InhouseAppIcon.appiconset/Icon-App-40x40@2x.png b/ios/Runner/Assets.xcassets/InhouseAppIcon.appiconset/Icon-App-40x40@2x.png
deleted file mode 100644
index dfbde5c0d..000000000
Binary files a/ios/Runner/Assets.xcassets/InhouseAppIcon.appiconset/Icon-App-40x40@2x.png and /dev/null differ
diff --git a/ios/Runner/Assets.xcassets/InhouseAppIcon.appiconset/Icon-App-40x40@3x.png b/ios/Runner/Assets.xcassets/InhouseAppIcon.appiconset/Icon-App-40x40@3x.png
deleted file mode 100644
index 1c23af0a4..000000000
Binary files a/ios/Runner/Assets.xcassets/InhouseAppIcon.appiconset/Icon-App-40x40@3x.png and /dev/null differ
diff --git a/ios/Runner/Assets.xcassets/InhouseAppIcon.appiconset/Icon-App-60x60@2x.png b/ios/Runner/Assets.xcassets/InhouseAppIcon.appiconset/Icon-App-60x60@2x.png
deleted file mode 100644
index 1c23af0a4..000000000
Binary files a/ios/Runner/Assets.xcassets/InhouseAppIcon.appiconset/Icon-App-60x60@2x.png and /dev/null differ
diff --git a/ios/Runner/Assets.xcassets/InhouseAppIcon.appiconset/Icon-App-60x60@3x.png b/ios/Runner/Assets.xcassets/InhouseAppIcon.appiconset/Icon-App-60x60@3x.png
deleted file mode 100644
index dda9fb3c7..000000000
Binary files a/ios/Runner/Assets.xcassets/InhouseAppIcon.appiconset/Icon-App-60x60@3x.png and /dev/null differ
diff --git a/ios/Runner/Assets.xcassets/InhouseAppIcon.appiconset/Icon-App-76x76@1x.png b/ios/Runner/Assets.xcassets/InhouseAppIcon.appiconset/Icon-App-76x76@1x.png
deleted file mode 100644
index d2b94c7ab..000000000
Binary files a/ios/Runner/Assets.xcassets/InhouseAppIcon.appiconset/Icon-App-76x76@1x.png and /dev/null differ
diff --git a/ios/Runner/Assets.xcassets/InhouseAppIcon.appiconset/Icon-App-76x76@2x.png b/ios/Runner/Assets.xcassets/InhouseAppIcon.appiconset/Icon-App-76x76@2x.png
deleted file mode 100644
index 810a3135c..000000000
Binary files a/ios/Runner/Assets.xcassets/InhouseAppIcon.appiconset/Icon-App-76x76@2x.png and /dev/null differ
diff --git a/ios/Runner/Assets.xcassets/InhouseAppIcon.appiconset/Icon-App-83.5x83.5@2x.png b/ios/Runner/Assets.xcassets/InhouseAppIcon.appiconset/Icon-App-83.5x83.5@2x.png
deleted file mode 100644
index 597d71c8c..000000000
Binary files a/ios/Runner/Assets.xcassets/InhouseAppIcon.appiconset/Icon-App-83.5x83.5@2x.png and /dev/null differ
diff --git a/ios/Runner/Assets.xcassets/InhouseAppIcon.appiconset/ItunesArtwork@2x.png b/ios/Runner/Assets.xcassets/InhouseAppIcon.appiconset/ItunesArtwork@2x.png
deleted file mode 100644
index 99a665515..000000000
Binary files a/ios/Runner/Assets.xcassets/InhouseAppIcon.appiconset/ItunesArtwork@2x.png and /dev/null differ
diff --git a/ios/Runner/Assets.xcassets/InhouseLaunchImage.imageset/265.png b/ios/Runner/Assets.xcassets/InhouseLaunchImage.imageset/265.png
new file mode 100644
index 000000000..d2fc217e8
Binary files /dev/null and b/ios/Runner/Assets.xcassets/InhouseLaunchImage.imageset/265.png differ
diff --git a/ios/Runner/Assets.xcassets/InhouseLaunchImage.imageset/265x2.png b/ios/Runner/Assets.xcassets/InhouseLaunchImage.imageset/265x2.png
new file mode 100644
index 000000000..95228e751
Binary files /dev/null and b/ios/Runner/Assets.xcassets/InhouseLaunchImage.imageset/265x2.png differ
diff --git a/ios/Runner/Assets.xcassets/InhouseLaunchImage.imageset/265x3.png b/ios/Runner/Assets.xcassets/InhouseLaunchImage.imageset/265x3.png
new file mode 100644
index 000000000..9508935c0
Binary files /dev/null and b/ios/Runner/Assets.xcassets/InhouseLaunchImage.imageset/265x3.png differ
diff --git a/ios/Runner/Assets.xcassets/InhouseLaunchImage.imageset/Contents.json b/ios/Runner/Assets.xcassets/InhouseLaunchImage.imageset/Contents.json
index c719eb7a3..284569e7d 100644
--- a/ios/Runner/Assets.xcassets/InhouseLaunchImage.imageset/Contents.json
+++ b/ios/Runner/Assets.xcassets/InhouseLaunchImage.imageset/Contents.json
@@ -1,17 +1,17 @@
 {
   "images" : [
     {
-      "filename" : "Inhouse_Logo.png",
+      "filename" : "265.png",
       "idiom" : "universal",
       "scale" : "1x"
     },
     {
-      "filename" : "Inhouse_Logo2x.png",
+      "filename" : "265x2.png",
       "idiom" : "universal",
       "scale" : "2x"
     },
     {
-      "filename" : "Inhouse_Logo3x.png",
+      "filename" : "265x3.png",
       "idiom" : "universal",
       "scale" : "3x"
     }
diff --git a/ios/Runner/Assets.xcassets/InhouseLaunchImage.imageset/Inhouse_Logo.png b/ios/Runner/Assets.xcassets/InhouseLaunchImage.imageset/Inhouse_Logo.png
deleted file mode 100644
index a889223e6..000000000
Binary files a/ios/Runner/Assets.xcassets/InhouseLaunchImage.imageset/Inhouse_Logo.png and /dev/null differ
diff --git a/ios/Runner/Assets.xcassets/InhouseLaunchImage.imageset/Inhouse_Logo2x.png b/ios/Runner/Assets.xcassets/InhouseLaunchImage.imageset/Inhouse_Logo2x.png
deleted file mode 100644
index 5240ec1bb..000000000
Binary files a/ios/Runner/Assets.xcassets/InhouseLaunchImage.imageset/Inhouse_Logo2x.png and /dev/null differ
diff --git a/ios/Runner/Assets.xcassets/InhouseLaunchImage.imageset/Inhouse_Logo3x.png b/ios/Runner/Assets.xcassets/InhouseLaunchImage.imageset/Inhouse_Logo3x.png
deleted file mode 100644
index b24904c5b..000000000
Binary files a/ios/Runner/Assets.xcassets/InhouseLaunchImage.imageset/Inhouse_Logo3x.png and /dev/null differ
diff --git a/ios/Runner/Assets.xcassets/LaunchImage.imageset/265.png b/ios/Runner/Assets.xcassets/LaunchImage.imageset/265.png
new file mode 100644
index 000000000..d2fc217e8
Binary files /dev/null and b/ios/Runner/Assets.xcassets/LaunchImage.imageset/265.png differ
diff --git a/ios/Runner/Assets.xcassets/LaunchImage.imageset/265x2.png b/ios/Runner/Assets.xcassets/LaunchImage.imageset/265x2.png
new file mode 100644
index 000000000..95228e751
Binary files /dev/null and b/ios/Runner/Assets.xcassets/LaunchImage.imageset/265x2.png differ
diff --git a/ios/Runner/Assets.xcassets/LaunchImage.imageset/265x3.png b/ios/Runner/Assets.xcassets/LaunchImage.imageset/265x3.png
new file mode 100644
index 000000000..9508935c0
Binary files /dev/null and b/ios/Runner/Assets.xcassets/LaunchImage.imageset/265x3.png differ
diff --git a/ios/Runner/Assets.xcassets/LaunchImage.imageset/Contents.json b/ios/Runner/Assets.xcassets/LaunchImage.imageset/Contents.json
index 00cabce83..284569e7d 100644
--- a/ios/Runner/Assets.xcassets/LaunchImage.imageset/Contents.json
+++ b/ios/Runner/Assets.xcassets/LaunchImage.imageset/Contents.json
@@ -1,17 +1,17 @@
 {
   "images" : [
     {
-      "filename" : "LaunchImage.png",
+      "filename" : "265.png",
       "idiom" : "universal",
       "scale" : "1x"
     },
     {
-      "filename" : "LaunchImage@2x.png",
+      "filename" : "265x2.png",
       "idiom" : "universal",
       "scale" : "2x"
     },
     {
-      "filename" : "LaunchImage@3x.png",
+      "filename" : "265x3.png",
       "idiom" : "universal",
       "scale" : "3x"
     }
diff --git a/ios/Runner/Assets.xcassets/LaunchImage.imageset/LaunchImage.png b/ios/Runner/Assets.xcassets/LaunchImage.imageset/LaunchImage.png
deleted file mode 100644
index fe91e5f99..000000000
Binary files a/ios/Runner/Assets.xcassets/LaunchImage.imageset/LaunchImage.png and /dev/null differ
diff --git a/ios/Runner/Assets.xcassets/LaunchImage.imageset/LaunchImage@2x.png b/ios/Runner/Assets.xcassets/LaunchImage.imageset/LaunchImage@2x.png
deleted file mode 100644
index a543765cd..000000000
Binary files a/ios/Runner/Assets.xcassets/LaunchImage.imageset/LaunchImage@2x.png and /dev/null differ
diff --git a/ios/Runner/Assets.xcassets/LaunchImage.imageset/LaunchImage@3x.png b/ios/Runner/Assets.xcassets/LaunchImage.imageset/LaunchImage@3x.png
deleted file mode 100644
index fc86469fa..000000000
Binary files a/ios/Runner/Assets.xcassets/LaunchImage.imageset/LaunchImage@3x.png and /dev/null differ
diff --git a/ios/Runner/Assets.xcassets/penrose_onboarding_appcenter.imageset/265x2 1.png b/ios/Runner/Assets.xcassets/penrose_onboarding_appcenter.imageset/265x2 1.png
new file mode 100644
index 000000000..95228e751
Binary files /dev/null and b/ios/Runner/Assets.xcassets/penrose_onboarding_appcenter.imageset/265x2 1.png differ
diff --git a/ios/Runner/Assets.xcassets/penrose_onboarding_appcenter.imageset/265x2.png b/ios/Runner/Assets.xcassets/penrose_onboarding_appcenter.imageset/265x2.png
new file mode 100644
index 000000000..95228e751
Binary files /dev/null and b/ios/Runner/Assets.xcassets/penrose_onboarding_appcenter.imageset/265x2.png differ
diff --git a/ios/Runner/Assets.xcassets/penrose_onboarding_appcenter.imageset/265x3.png b/ios/Runner/Assets.xcassets/penrose_onboarding_appcenter.imageset/265x3.png
new file mode 100644
index 000000000..9508935c0
Binary files /dev/null and b/ios/Runner/Assets.xcassets/penrose_onboarding_appcenter.imageset/265x3.png differ
diff --git a/ios/Runner/Assets.xcassets/penrose_onboarding_appcenter.imageset/Contents.json b/ios/Runner/Assets.xcassets/penrose_onboarding_appcenter.imageset/Contents.json
index 00cabce83..666316ecf 100644
--- a/ios/Runner/Assets.xcassets/penrose_onboarding_appcenter.imageset/Contents.json
+++ b/ios/Runner/Assets.xcassets/penrose_onboarding_appcenter.imageset/Contents.json
@@ -1,17 +1,17 @@
 {
   "images" : [
     {
-      "filename" : "LaunchImage.png",
+      "filename" : "265x2.png",
       "idiom" : "universal",
       "scale" : "1x"
     },
     {
-      "filename" : "LaunchImage@2x.png",
+      "filename" : "265x2 1.png",
       "idiom" : "universal",
       "scale" : "2x"
     },
     {
-      "filename" : "LaunchImage@3x.png",
+      "filename" : "265x3.png",
       "idiom" : "universal",
       "scale" : "3x"
     }
diff --git a/ios/Runner/Assets.xcassets/penrose_onboarding_appcenter.imageset/LaunchImage.png b/ios/Runner/Assets.xcassets/penrose_onboarding_appcenter.imageset/LaunchImage.png
deleted file mode 100644
index fe91e5f99..000000000
Binary files a/ios/Runner/Assets.xcassets/penrose_onboarding_appcenter.imageset/LaunchImage.png and /dev/null differ
diff --git a/ios/Runner/Assets.xcassets/penrose_onboarding_appcenter.imageset/LaunchImage@2x.png b/ios/Runner/Assets.xcassets/penrose_onboarding_appcenter.imageset/LaunchImage@2x.png
deleted file mode 100644
index a543765cd..000000000
Binary files a/ios/Runner/Assets.xcassets/penrose_onboarding_appcenter.imageset/LaunchImage@2x.png and /dev/null differ
diff --git a/ios/Runner/Assets.xcassets/penrose_onboarding_appcenter.imageset/LaunchImage@3x.png b/ios/Runner/Assets.xcassets/penrose_onboarding_appcenter.imageset/LaunchImage@3x.png
deleted file mode 100644
index fc86469fa..000000000
Binary files a/ios/Runner/Assets.xcassets/penrose_onboarding_appcenter.imageset/LaunchImage@3x.png and /dev/null differ
diff --git a/ios/Runner/Constant.swift b/ios/Runner/Constant.swift
index d113ea96c..58fab424b 100644
--- a/ios/Runner/Constant.swift
+++ b/ios/Runner/Constant.swift
@@ -10,9 +10,9 @@ import Foundation
 struct Constant {
     static var appname: String {
         #if INHOUSE
-        return "Autonomy (Dev)";
+        return "Feral File (Dev)";
         #else
-        return "Autonomy";
+        return "Feral File";
         #endif
     }
 
diff --git a/ios/Runner/Info.plist b/ios/Runner/Info.plist
index 573e07b3a..cdf57ba80 100644
--- a/ios/Runner/Info.plist
+++ b/ios/Runner/Info.plist
@@ -12,7 +12,7 @@
 	<key>CFBundleDevelopmentRegion</key>
 	<string>$(DEVELOPMENT_LANGUAGE)</string>
 	<key>CFBundleDisplayName</key>
-	<string>Autonomy</string>
+	<string>Feral File</string>
 	<key>CFBundleExecutable</key>
 	<string>$(EXECUTABLE_NAME)</string>
 	<key>CFBundleIdentifier</key>
@@ -65,15 +65,15 @@
 	<key>NSCameraUsageDescription</key>
 	<string>QR code scanning requires camera access.</string>
 	<key>NSFaceIDUsageDescription</key>
-	<string>Allow Autonomy to use Face ID to authenticate.</string>
+	<string>Allow Feral File to use Face ID to authenticate.</string>
 	<key>NSLocalNetworkUsageDescription</key>
 	<string>Uses the local network to discover Cast-enabled devices on your WiFi network.</string>
 	<key>NSLocationAlwaysAndWhenInUseUsageDescription</key>
-	<string>Allow Autonomy to use your location</string>
+	<string>Allow Feral File to use your location</string>
 	<key>NSLocationAlwaysUsageDescription</key>
-	<string>Allow Autonomy to use your location</string>
+	<string>Allow Feral File to use your location</string>
 	<key>NSLocationWhenInUseUsageDescription</key>
-	<string>Allow Autonomy to use your location</string>
+	<string>Allow Feral File to use your location</string>
 	<key>NSMicrophoneUsageDescription</key>
 	<string>Viewing artwork with microphone enable.</string>
 	<key>NSPhotoLibraryUsageDescription</key>
@@ -123,6 +123,11 @@
 		<string>autonomy-app-alternate.app.link</string>
 		<string>autonomy-app.test.app.link</string>
 		<string>autonomy-app-alternate.test.app.link</string>
+		<string>app.feralfile.com</string>
+		<string>feralfile-app.app.link</string>
+		<string>feralfile-app-alternate.app.link</string>
+		<string>feralfile-app.test.app.link</string>
+		<string>feralfile-app-alternate.test.app.link</string>
 	</array>
 	<key>io.flutter.embedded_views_preview</key>
 	<true/>
diff --git a/ios/Runner/Runner InhouseDebug.entitlements b/ios/Runner/Runner InhouseDebug.entitlements
index 6643da0c5..0dc4ab699 100644
--- a/ios/Runner/Runner InhouseDebug.entitlements	
+++ b/ios/Runner/Runner InhouseDebug.entitlements	
@@ -11,6 +11,9 @@
 		<string>applinks:autonomy-app.app.link</string>
 		<string>applinks:autonomy-app-alternate.app.link</string>
 		<string>applinks:link.autonomy.io</string>
+		<string>applinks:feralfile-app.app.link</string>
+		<string>applinks:feralfile-app-alternate.app.link</string>
+		<string>applinks:app.feralfile.com</string>
 	</array>
 	<key>com.apple.developer.icloud-container-identifiers</key>
 	<array>
diff --git a/ios/Runner/Runner-Inhouse.entitlements b/ios/Runner/Runner-Inhouse.entitlements
index 243662ed7..2bb1df182 100644
--- a/ios/Runner/Runner-Inhouse.entitlements
+++ b/ios/Runner/Runner-Inhouse.entitlements
@@ -11,6 +11,9 @@
 		<string>applinks:autonomy-app.app.link</string>
 		<string>applinks:autonomy-app-alternate.app.link</string>
 		<string>applinks:link.autonomy.io</string>
+		<string>applinks:feralfile-app.app.link</string>
+		<string>applinks:feralfile-app-alternate.app.link</string>
+		<string>applinks:app.feralfile.com</string>
 	</array>
 	<key>com.apple.developer.icloud-container-identifiers</key>
 	<array>
diff --git a/ios/Runner/Runner.entitlements b/ios/Runner/Runner.entitlements
index 2e4420b09..96df78532 100644
--- a/ios/Runner/Runner.entitlements
+++ b/ios/Runner/Runner.entitlements
@@ -11,6 +11,9 @@
 		<string>applinks:autonomy-app.app.link</string>
 		<string>applinks:autonomy-app-alternate.app.link</string>
 		<string>applinks:link.autonomy.io</string>
+		<string>applinks:feralfile-app.app.link</string>
+		<string>applinks:feralfile-app-alternate.app.link</string>
+		<string>applinks:app.feralfile.com</string>
 	</array>
 	<key>com.apple.developer.icloud-container-identifiers</key>
 	<array>
diff --git a/ios/Runner/RunnerDebug.entitlements b/ios/Runner/RunnerDebug.entitlements
index 2ba198bd8..8cddf083d 100644
--- a/ios/Runner/RunnerDebug.entitlements
+++ b/ios/Runner/RunnerDebug.entitlements
@@ -11,6 +11,9 @@
 		<string>applinks:autonomy-app.app.link</string>
 		<string>applinks:autonomy-app-alternate.app.link</string>
 		<string>applinks:link.autonomy.io</string>
+		<string>applinks:feralfile-app.app.link</string>
+		<string>applinks:feralfile-app-alternate.app.link</string>
+		<string>applinks:app.feralfile.com</string>
 	</array>
 	<key>com.apple.developer.icloud-container-identifiers</key>
 	<array>
diff --git a/ios/Runner/Settings.bundle/Root.plist b/ios/Runner/Settings.bundle/Root.plist
index f85ebd450..66d267333 100644
--- a/ios/Runner/Settings.bundle/Root.plist
+++ b/ios/Runner/Settings.bundle/Root.plist
@@ -5,7 +5,7 @@
 	<key>StringsTable</key>
 	<string>Root</string>
 	<key>Title</key>
-	<string>Autonomy Info and Debug</string>
+	<string>Feral File Info and Debug</string>
 	<key>PreferenceSpecifiers</key>
 	<array>
 		<dict>
diff --git a/lib/common/injector.dart b/lib/common/injector.dart
index 7c9ec3f27..5d8869fef 100644
--- a/lib/common/injector.dart
+++ b/lib/common/injector.dart
@@ -26,11 +26,14 @@ import 'package:autonomy_flutter/gateway/iap_api.dart';
 import 'package:autonomy_flutter/gateway/postcard_api.dart';
 import 'package:autonomy_flutter/gateway/pubdoc_api.dart';
 import 'package:autonomy_flutter/gateway/tzkt_api.dart';
+import 'package:autonomy_flutter/screen/bloc/identity/identity_bloc.dart';
 import 'package:autonomy_flutter/screen/chat/chat_bloc.dart';
+import 'package:autonomy_flutter/screen/collection_pro/collection_pro_bloc.dart';
 import 'package:autonomy_flutter/screen/interactive_postcard/claim_empty_postcard/claim_empty_postcard_bloc.dart';
 import 'package:autonomy_flutter/screen/playlists/add_new_playlist/add_new_playlist_bloc.dart';
 import 'package:autonomy_flutter/screen/playlists/edit_playlist/edit_playlist_bloc.dart';
 import 'package:autonomy_flutter/screen/playlists/view_playlist/view_playlist_bloc.dart';
+import 'package:autonomy_flutter/screen/predefined_collection/predefined_collection_bloc.dart';
 import 'package:autonomy_flutter/service/account_service.dart';
 import 'package:autonomy_flutter/service/activation_service.dart';
 import 'package:autonomy_flutter/service/airdrop_service.dart';
@@ -154,6 +157,8 @@ Future<void> setup() async {
   injector.registerLazySingleton(() => NftCollection.database.tokenDao);
   injector.registerLazySingleton(() => NftCollection.database.assetTokenDao);
   injector.registerLazySingleton(() => NftCollection.database.provenanceDao);
+  injector.registerLazySingleton(
+      () => NftCollection.database.predefinedCollectionDao);
   injector.registerLazySingleton(() => cloudDB);
 
   final authenticatedDio = Dio(); // Authenticated dio instance for AU servers
@@ -309,7 +314,7 @@ Future<void> setup() async {
       .registerLazySingleton<TezosService>(() => TezosServiceImpl(injector()));
   injector.registerLazySingleton<AppDatabase>(() => mainnetDB);
   injector.registerLazySingleton<PlaylistService>(
-      () => PlayListServiceImp(injector(), injector(), injector()));
+      () => PlayListServiceImp(injector(), injector(), injector(), injector()));
 
   injector.registerLazySingleton<CanvasClientService>(
       () => CanvasClientService(injector()));
@@ -396,5 +401,10 @@ Future<void> setup() async {
   injector.registerFactory<EditPlaylistBloc>(() => EditPlaylistBloc());
   injector
       .registerFactory<ClaimEmptyPostCardBloc>(() => ClaimEmptyPostCardBloc());
+  injector.registerFactory<CollectionProBloc>(() => CollectionProBloc());
+  injector.registerFactory<PredefinedCollectionBloc>(
+      () => PredefinedCollectionBloc());
+  injector.registerFactory<IdentityBloc>(
+      () => IdentityBloc(injector(), injector()));
   injector.registerFactory<AuChatBloc>(() => AuChatBloc(injector()));
 }
diff --git a/lib/gateway/feralfile_api.dart b/lib/gateway/feralfile_api.dart
index d6e2f4b0d..a4d46ef0e 100644
--- a/lib/gateway/feralfile_api.dart
+++ b/lib/gateway/feralfile_api.dart
@@ -6,37 +6,58 @@
 //
 
 import 'package:autonomy_flutter/model/ff_account.dart';
+import 'package:autonomy_flutter/model/ff_exhibition.dart';
+import 'package:autonomy_flutter/model/ff_exhibition_artworks_response.dart';
+import 'package:autonomy_flutter/model/ff_series.dart';
 import 'package:dio/dio.dart';
 import 'package:retrofit/retrofit.dart';
 
 part 'feralfile_api.g.dart';
 
-@RestApi(baseUrl: "")
+@RestApi(baseUrl: '')
 abstract class FeralFileApi {
   factory FeralFileApi(Dio dio, {String baseUrl}) = _FeralFileApi;
 
-  @GET("/api/exhibitions/{exhibitionId}")
+  @GET('/api/exhibitions/{exhibitionId}')
   Future<ExhibitionResponse> getExhibition(
-      @Path("exhibitionId") String exhibitionId);
+      @Path('exhibitionId') String exhibitionId);
 
-  @GET("/api/series/{seriesId}")
-  Future<FFSeriesResponse> getSeries(@Path("seriesId") String seriesId);
+  @GET('/api/series/{seriesId}')
+  Future<FFSeriesResponse> getSeries(@Path('seriesId') String seriesId);
 
-  @POST("/api/series/{seriesId}/claim")
+  @POST('/api/series/{seriesId}/claim')
   Future<TokenClaimResponse> claimSeries(
-    @Path("seriesId") String seriesId,
+    @Path('seriesId') String seriesId,
     @Body() Map<String, dynamic> body,
   );
 
-  @GET("/api/exhibitions/{exhibitionID}/revenue-setting/resale")
+  @GET('/api/exhibitions/{exhibitionID}/revenue-setting/resale')
   Future<ResaleResponse> getResaleInfo(
-      @Path("exhibitionID") String exhibitionID);
+      @Path('exhibitionID') String exhibitionID);
 
-  @GET("/api/artworks/{tokenID}")
+  @GET('/api/artworks/{tokenID}')
   Future<ArtworkResponse> getArtworks(
-    @Path("tokenID") String tokenID, {
-    @Query("includeSeries") bool includeSeries = true,
-    @Query("includeExhibition") bool includeExhibition = true,
-    @Query("includeArtist") bool includeArtist = true,
+    @Path('tokenID') String tokenID, {
+    @Query('includeSeries') bool includeSeries = true,
+    @Query('includeExhibition') bool includeExhibition = true,
+    @Query('includeArtist') bool includeArtist = true,
+  });
+
+  @GET('/api/exhibitions')
+  Future<ListExhibitionResponse> getAllExhibitions({
+    @Query('sortBy') String? sortBy,
+    @Query('sortOrder') String? sortOrder,
+    @Query('limit') int? limit,
+    @Query('offset') int? offset,
+  });
+
+  @GET('/api/exhibitions/featured')
+  Future<ExhibitionResponse> getFeaturedExhibition();
+
+  @GET('/api/artworks')
+  Future<ArtworksResponse> getListArtworks({
+    @Query('exhibitionID') String? exhibitionId,
+    @Query('seriesID') String? seriesId,
+    @Query('includeActiveSwap') bool includeActiveSwap = true,
   });
 }
diff --git a/lib/gateway/feralfile_api.g.dart b/lib/gateway/feralfile_api.g.dart
index 58f05b963..b3f41142c 100644
--- a/lib/gateway/feralfile_api.g.dart
+++ b/lib/gateway/feralfile_api.g.dart
@@ -166,6 +166,107 @@ class _FeralFileApi implements FeralFileApi {
     return value;
   }
 
+  @override
+  Future<ListExhibitionResponse> getAllExhibitions({
+    String? sortBy,
+    String? sortOrder,
+    int? limit,
+    int? offset,
+  }) async {
+    const _extra = <String, dynamic>{};
+    final queryParameters = <String, dynamic>{
+      r'sortBy': sortBy,
+      r'sortOrder': sortOrder,
+      r'limit': limit,
+      r'offset': offset,
+    };
+    queryParameters.removeWhere((k, v) => v == null);
+    final _headers = <String, dynamic>{};
+    final Map<String, dynamic>? _data = null;
+    final _result = await _dio.fetch<Map<String, dynamic>>(
+        _setStreamType<ListExhibitionResponse>(Options(
+      method: 'GET',
+      headers: _headers,
+      extra: _extra,
+    )
+            .compose(
+              _dio.options,
+              '/api/exhibitions',
+              queryParameters: queryParameters,
+              data: _data,
+            )
+            .copyWith(
+                baseUrl: _combineBaseUrls(
+              _dio.options.baseUrl,
+              baseUrl,
+            ))));
+    final value = ListExhibitionResponse.fromJson(_result.data!);
+    return value;
+  }
+
+  @override
+  Future<ExhibitionResponse> getFeaturedExhibition() async {
+    const _extra = <String, dynamic>{};
+    final queryParameters = <String, dynamic>{};
+    final _headers = <String, dynamic>{};
+    final Map<String, dynamic>? _data = null;
+    final _result = await _dio
+        .fetch<Map<String, dynamic>>(_setStreamType<ExhibitionResponse>(Options(
+      method: 'GET',
+      headers: _headers,
+      extra: _extra,
+    )
+            .compose(
+              _dio.options,
+              '/api/exhibitions/featured',
+              queryParameters: queryParameters,
+              data: _data,
+            )
+            .copyWith(
+                baseUrl: _combineBaseUrls(
+              _dio.options.baseUrl,
+              baseUrl,
+            ))));
+    final value = ExhibitionResponse.fromJson(_result.data!);
+    return value;
+  }
+
+  @override
+  Future<ArtworksResponse> getListArtworks({
+    String? exhibitionId,
+    String? seriesId,
+    bool includeActiveSwap = true,
+  }) async {
+    const _extra = <String, dynamic>{};
+    final queryParameters = <String, dynamic>{
+      r'exhibitionID': exhibitionId,
+      r'seriesID': seriesId,
+      r'includeActiveSwap': includeActiveSwap,
+    };
+    queryParameters.removeWhere((k, v) => v == null);
+    final _headers = <String, dynamic>{};
+    final Map<String, dynamic>? _data = null;
+    final _result = await _dio
+        .fetch<Map<String, dynamic>>(_setStreamType<ArtworksResponse>(Options(
+      method: 'GET',
+      headers: _headers,
+      extra: _extra,
+    )
+            .compose(
+              _dio.options,
+              '/api/artworks',
+              queryParameters: queryParameters,
+              data: _data,
+            )
+            .copyWith(
+                baseUrl: _combineBaseUrls(
+              _dio.options.baseUrl,
+              baseUrl,
+            ))));
+    final value = ArtworksResponse.fromJson(_result.data!);
+    return value;
+  }
+
   RequestOptions _setStreamType<T>(RequestOptions requestOptions) {
     if (T != dynamic &&
         !(requestOptions.responseType == ResponseType.bytes ||
diff --git a/lib/main.dart b/lib/main.dart
index ec813a04c..e4da7b035 100644
--- a/lib/main.dart
+++ b/lib/main.dart
@@ -15,6 +15,7 @@ import 'package:autonomy_flutter/model/eth_pending_tx_amount.dart';
 import 'package:autonomy_flutter/screen/app_router.dart';
 import 'package:autonomy_flutter/service/configuration_service.dart';
 import 'package:autonomy_flutter/service/deeplink_service.dart';
+import 'package:autonomy_flutter/service/iap_service.dart';
 import 'package:autonomy_flutter/service/metric_client_service.dart';
 import 'package:autonomy_flutter/service/navigation_service.dart';
 import 'package:autonomy_flutter/service/notification_service.dart';
@@ -114,6 +115,8 @@ _setupApp() async {
   await notificationService.initNotification();
   await notificationService.startListeningNotificationEvents();
   await disableLandscapeMode();
+  final isPremium = await injector.get<IAPService>().isSubscribed();
+  await injector<ConfigurationService>().setPremium(isPremium);
 
   await SentryFlutter.init(
     (options) {
@@ -229,8 +232,11 @@ enum HomePageTab {
 }
 
 enum HomeNavigatorTab {
-  COLLECTION,
-  WALLET,
+  collection,
+  organization,
+  exhibition,
+  scanQr,
+  menu,
 }
 
 @pragma('vm:entry-point')
diff --git a/lib/model/ff_account.dart b/lib/model/ff_account.dart
index e364b8a4b..78e792c0d 100644
--- a/lib/model/ff_account.dart
+++ b/lib/model/ff_account.dart
@@ -5,15 +5,14 @@
 //  that can be found in the LICENSE file.
 //
 
-import 'package:autonomy_flutter/common/environment.dart';
-import 'package:collection/collection.dart';
+import 'package:autonomy_flutter/model/ff_series.dart';
 import 'package:json_annotation/json_annotation.dart';
 
 part 'ff_account.g.dart';
 
 @JsonSerializable()
 class FFAccount {
-  @JsonKey(name: "ID", defaultValue: '')
+  @JsonKey(name: 'ID', defaultValue: '')
   String id;
   String alias;
   String location;
@@ -33,17 +32,11 @@ class FFAccount {
   Map<String, dynamic> toJson() => _$FFAccountToJson(this);
 
   @override
-  String toString() {
-    return toJson().toString();
-  }
+  String toString() => toJson().toString();
 
-  String? get ethereumAddress {
-    return vaultAddresses?['ethereum'];
-  }
+  String? get ethereumAddress => vaultAddresses?['ethereum'];
 
-  String? get tezosAddress {
-    return vaultAddresses?['tezos'];
-  }
+  String? get tezosAddress => vaultAddresses?['tezos'];
 }
 
 @JsonSerializable()
@@ -60,191 +53,6 @@ class WyreWallet {
   Map<String, dynamic> toJson() => _$WyreWalletToJson(this);
 }
 
-@JsonSerializable()
-class Exhibition {
-  final String id;
-  final String title;
-  final String slug;
-  final DateTime exhibitionStartAt;
-  final DateTime? exhibitionEndAt;
-  final String? coverURI;
-  final String? thumbnailCoverURI;
-  final String mintBlockchain;
-  final List<FFArtist>? artists;
-  final List<FFSeries>? series;
-  final List<FFContract>? contracts;
-  final FFArtist? partner;
-
-  Exhibition(
-    this.id,
-    this.title,
-    this.slug,
-    this.exhibitionStartAt,
-    this.exhibitionEndAt,
-    this.coverURI,
-    this.thumbnailCoverURI,
-    this.artists,
-    this.series,
-    this.contracts,
-    this.mintBlockchain,
-    this.partner,
-  );
-
-  factory Exhibition.fromJson(Map<String, dynamic> json) =>
-      _$ExhibitionFromJson(json);
-
-  Map<String, dynamic> toJson() => _$ExhibitionToJson(this);
-
-  FFArtist? getArtist(FFSeries? series) {
-    final artistId = series?.artistID;
-    return artists?.firstWhereOrNull((artist) => artist.id == artistId);
-  }
-
-  String getThumbnailURL() {
-    return "${Environment.feralFileAssetURL}/$thumbnailCoverURI";
-  }
-}
-
-@JsonSerializable()
-class ExhibitionResponse {
-  final Exhibition result;
-
-  ExhibitionResponse(this.result);
-
-  factory ExhibitionResponse.fromJson(Map<String, dynamic> json) =>
-      _$ExhibitionResponseFromJson(json);
-
-  Map<String, dynamic> toJson() => _$ExhibitionResponseToJson(this);
-}
-
-@JsonSerializable()
-class FFArtist {
-  @JsonKey(name: "ID")
-  final String id;
-  final String alias;
-  final String slug;
-  final bool? verified;
-  final bool? isArtist;
-  final String? fullName;
-  final String? avatarURI;
-  final String? accountNumber;
-  final String? type;
-
-  FFArtist(
-    this.id,
-    this.alias,
-    this.slug,
-    this.verified,
-    this.isArtist,
-    this.fullName,
-    this.avatarURI,
-    this.accountNumber,
-    this.type,
-  );
-
-  factory FFArtist.fromJson(Map<String, dynamic> json) =>
-      _$FFArtistFromJson(json);
-
-  Map<String, dynamic> toJson() => _$FFArtistToJson(this);
-}
-
-@JsonSerializable()
-class FFSeries {
-  final String id;
-  final String artistID;
-  final String? assetID;
-  final String title;
-  final String slug;
-  final String medium;
-  final String? description;
-  final String? thumbnailURI;
-  final String exhibitionID;
-  final Map<String, dynamic>? metadata;
-  final int? displayIndex;
-  final int? featuringIndex;
-  final FFSeriesSettings? settings;
-  final FFArtist? artist;
-  final Exhibition? exhibition;
-  final AirdropInfo? airdropInfo;
-  final DateTime? createdAt;
-  final DateTime? updatedAt;
-
-  FFSeries(
-    this.id,
-    this.artistID,
-    this.assetID,
-    this.title,
-    this.slug,
-    this.medium,
-    this.description,
-    this.thumbnailURI,
-    this.exhibitionID,
-    this.metadata,
-    this.settings,
-    this.artist,
-    this.exhibition,
-    this.airdropInfo,
-    this.createdAt,
-    this.displayIndex,
-    this.featuringIndex,
-    this.updatedAt,
-  );
-
-  int get maxEdition {
-    return settings?.maxArtwork ?? -1;
-  }
-
-  FFContract? get contract {
-    return exhibition?.contracts?.firstWhereOrNull((e) {
-      return e.address == airdropInfo?.contractAddress;
-    });
-  }
-
-  String getThumbnailURL() {
-    return "${Environment.feralFileAssetURL}/$thumbnailURI";
-  }
-
-  bool get isAirdropSeries {
-    return settings?.isAirdrop == true;
-  }
-
-  factory FFSeries.fromJson(Map<String, dynamic> json) =>
-      _$FFSeriesFromJson(json);
-
-  Map<String, dynamic> toJson() => _$FFSeriesToJson(this);
-}
-
-@JsonSerializable()
-class FFSeriesResponse {
-  final FFSeries result;
-
-  FFSeriesResponse(
-    this.result,
-  );
-
-  factory FFSeriesResponse.fromJson(Map<String, dynamic> json) =>
-      _$FFSeriesResponseFromJson(json);
-
-  Map<String, dynamic> toJson() => _$FFSeriesResponseToJson(this);
-}
-
-@JsonSerializable()
-class FFSeriesSettings {
-  final int maxArtwork;
-  final String? saleModel;
-
-  FFSeriesSettings(this.saleModel, this.maxArtwork);
-
-  factory FFSeriesSettings.fromJson(Map<String, dynamic> json) =>
-      _$FFSeriesSettingsFromJson(json);
-
-  Map<String, dynamic> toJson() => _$FFSeriesSettingsToJson(this);
-
-  bool get isAirdrop {
-    return ["airdrop", "shopping_airdrop"].contains(saleModel?.toLowerCase());
-  }
-}
-
 @JsonSerializable()
 class FFContract {
   final String name;
@@ -294,9 +102,7 @@ class AirdropInfo {
 
   Map<String, dynamic> toJson() => _$AirdropInfoToJson(this);
 
-  bool get isAirdropStarted {
-    return startedAt?.isBefore(DateTime.now()) == true;
-  }
+  bool get isAirdropStarted => startedAt?.isBefore(DateTime.now()) == true;
 }
 
 @JsonSerializable()
@@ -311,9 +117,7 @@ class TokenClaimResponse {
   Map<String, dynamic> toJson() => _$TokenClaimResponseToJson(this);
 
   @override
-  String toString() {
-    return 'TokenClaimResponse{result: $result}';
-  }
+  String toString() => 'TokenClaimResponse{result: $result}';
 }
 
 @JsonSerializable()
@@ -342,9 +146,11 @@ class TokenClaimResult {
   Map<String, dynamic> toJson() => _$TokenClaimResultToJson(this);
 
   @override
-  String toString() {
-    return 'TokenClaimResult{id: $id, claimerID: $claimerID, exhibitionID: $exhibitionID, artworkID: $artworkID, txID: $txID}';
-  }
+  String toString() => 'TokenClaimResult{id: $id, '
+      'claimerID: $claimerID, '
+      'exhibitionID: $exhibitionID, '
+      'artworkID: $artworkID, '
+      'txID: $txID}';
 }
 
 @JsonSerializable()
@@ -363,9 +169,7 @@ class FeralfileError {
   Map<String, dynamic> toJson() => _$FeralfileErrorToJson(this);
 
   @override
-  String toString() {
-    return 'FeralfileError{code: $code, message: $message}';
-  }
+  String toString() => 'FeralfileError{code: $code, message: $message}';
 }
 
 @JsonSerializable()
@@ -433,11 +237,15 @@ class Artwork {
   final bool? burned;
   final String blockchainStatus;
   final bool isExternal;
+  final String thumbnailURI;
+  final String previewURI;
+  final Map<String, dynamic> metadata;
   final DateTime mintedAt;
   final DateTime createdAt;
   final DateTime updatedAt;
   final bool? isArchived;
   final FFSeries? series;
+  final ArtworkSwap? swap;
 
   Artwork(
       this.id,
@@ -450,14 +258,105 @@ class Artwork {
       this.burned,
       this.blockchainStatus,
       this.isExternal,
+      this.thumbnailURI,
+      this.previewURI,
+      this.metadata,
       this.mintedAt,
       this.createdAt,
       this.updatedAt,
       this.isArchived,
-      this.series);
+      this.series,
+      this.swap);
 
   factory Artwork.fromJson(Map<String, dynamic> json) =>
       _$ArtworkFromJson(json);
 
   Map<String, dynamic> toJson() => _$ArtworkToJson(this);
 }
+
+class ArtworkSwap {
+  final String id;
+  final String artworkID;
+  final String seriesID;
+  final String? paymentID;
+  final double? fee;
+  final String currency;
+  final int artworkIndex;
+  final String ownerAccount;
+  final String status;
+  final String contractName;
+  final String contractAddress;
+  final String recipientAddress;
+  final String? ipfsCid;
+  final String? token;
+  final String blockchainType;
+  final DateTime createdAt;
+  final DateTime updatedAt;
+  final DateTime expiredAt;
+
+  // Constructor
+  ArtworkSwap({
+    required this.id,
+    required this.artworkID,
+    required this.seriesID,
+    required this.currency,
+    required this.artworkIndex,
+    required this.ownerAccount,
+    required this.status,
+    required this.contractName,
+    required this.contractAddress,
+    required this.recipientAddress,
+    required this.blockchainType,
+    required this.createdAt,
+    required this.updatedAt,
+    required this.expiredAt,
+    this.ipfsCid,
+    this.token,
+    this.paymentID,
+    this.fee,
+  });
+
+  // Factory method to create an ArtworkSwap instance from JSON
+  factory ArtworkSwap.fromJson(Map<String, dynamic> json) => ArtworkSwap(
+        id: json['id'],
+        artworkID: json['artworkID'],
+        seriesID: json['seriesID'],
+        paymentID: json['paymentID'],
+        fee: json['fee']?.toDouble(),
+        currency: json['currency'],
+        artworkIndex: json['artworkIndex'],
+        ownerAccount: json['ownerAccount'],
+        status: json['status'],
+        contractName: json['contractName'],
+        contractAddress: json['contractAddress'],
+        recipientAddress: json['recipientAddress'],
+        ipfsCid: json['ipfsCid'],
+        token: json['token'],
+        blockchainType: json['blockchainType'],
+        createdAt: DateTime.parse(json['createdAt']),
+        updatedAt: DateTime.parse(json['updatedAt']),
+        expiredAt: DateTime.parse(json['expiredAt']),
+      );
+
+  // Method to convert ArtworkSwap instance to JSON
+  Map<String, dynamic> toJson() => {
+        'id': id,
+        'artworkID': artworkID,
+        'seriesID': seriesID,
+        'paymentID': paymentID,
+        'fee': fee,
+        'currency': currency,
+        'artworkIndex': artworkIndex,
+        'ownerAccount': ownerAccount,
+        'status': status,
+        'contractName': contractName,
+        'contractAddress': contractAddress,
+        'recipientAddress': recipientAddress,
+        'ipfsCid': ipfsCid,
+        'token': token,
+        'blockchainType': blockchainType,
+        'createdAt': createdAt.toIso8601String(),
+        'updatedAt': updatedAt.toIso8601String(),
+        'expiredAt': expiredAt.toIso8601String(),
+      };
+}
diff --git a/lib/model/ff_account.g.dart b/lib/model/ff_account.g.dart
index 88e89ed02..4be72c869 100644
--- a/lib/model/ff_account.g.dart
+++ b/lib/model/ff_account.g.dart
@@ -38,157 +38,6 @@ Map<String, dynamic> _$WyreWalletToJson(WyreWallet instance) =>
       'availableBalances': instance.availableBalances,
     };
 
-Exhibition _$ExhibitionFromJson(Map<String, dynamic> json) => Exhibition(
-      json['id'] as String,
-      json['title'] as String,
-      json['slug'] as String,
-      DateTime.parse(json['exhibitionStartAt'] as String),
-      json['exhibitionEndAt'] == null
-          ? null
-          : DateTime.parse(json['exhibitionEndAt'] as String),
-      json['coverURI'] as String?,
-      json['thumbnailCoverURI'] as String?,
-      (json['artists'] as List<dynamic>?)
-          ?.map((e) => FFArtist.fromJson(e as Map<String, dynamic>))
-          .toList(),
-      (json['series'] as List<dynamic>?)
-          ?.map((e) => FFSeries.fromJson(e as Map<String, dynamic>))
-          .toList(),
-      (json['contracts'] as List<dynamic>?)
-          ?.map((e) => FFContract.fromJson(e as Map<String, dynamic>))
-          .toList(),
-      json['mintBlockchain'] as String,
-      json['partner'] == null
-          ? null
-          : FFArtist.fromJson(json['partner'] as Map<String, dynamic>),
-    );
-
-Map<String, dynamic> _$ExhibitionToJson(Exhibition instance) =>
-    <String, dynamic>{
-      'id': instance.id,
-      'title': instance.title,
-      'slug': instance.slug,
-      'exhibitionStartAt': instance.exhibitionStartAt.toIso8601String(),
-      'exhibitionEndAt': instance.exhibitionEndAt?.toIso8601String(),
-      'coverURI': instance.coverURI,
-      'thumbnailCoverURI': instance.thumbnailCoverURI,
-      'mintBlockchain': instance.mintBlockchain,
-      'artists': instance.artists,
-      'series': instance.series,
-      'contracts': instance.contracts,
-      'partner': instance.partner,
-    };
-
-ExhibitionResponse _$ExhibitionResponseFromJson(Map<String, dynamic> json) =>
-    ExhibitionResponse(
-      Exhibition.fromJson(json['result'] as Map<String, dynamic>),
-    );
-
-Map<String, dynamic> _$ExhibitionResponseToJson(ExhibitionResponse instance) =>
-    <String, dynamic>{
-      'result': instance.result,
-    };
-
-FFArtist _$FFArtistFromJson(Map<String, dynamic> json) => FFArtist(
-      json['ID'] as String,
-      json['alias'] as String,
-      json['slug'] as String,
-      json['verified'] as bool?,
-      json['isArtist'] as bool?,
-      json['fullName'] as String?,
-      json['avatarURI'] as String?,
-      json['accountNumber'] as String?,
-      json['type'] as String?,
-    );
-
-Map<String, dynamic> _$FFArtistToJson(FFArtist instance) => <String, dynamic>{
-      'ID': instance.id,
-      'alias': instance.alias,
-      'slug': instance.slug,
-      'verified': instance.verified,
-      'isArtist': instance.isArtist,
-      'fullName': instance.fullName,
-      'avatarURI': instance.avatarURI,
-      'accountNumber': instance.accountNumber,
-      'type': instance.type,
-    };
-
-FFSeries _$FFSeriesFromJson(Map<String, dynamic> json) => FFSeries(
-      json['id'] as String,
-      json['artistID'] as String,
-      json['assetID'] as String?,
-      json['title'] as String,
-      json['slug'] as String,
-      json['medium'] as String,
-      json['description'] as String?,
-      json['thumbnailURI'] as String?,
-      json['exhibitionID'] as String,
-      json['metadata'] as Map<String, dynamic>?,
-      json['settings'] == null
-          ? null
-          : FFSeriesSettings.fromJson(json['settings'] as Map<String, dynamic>),
-      json['artist'] == null
-          ? null
-          : FFArtist.fromJson(json['artist'] as Map<String, dynamic>),
-      json['exhibition'] == null
-          ? null
-          : Exhibition.fromJson(json['exhibition'] as Map<String, dynamic>),
-      json['airdropInfo'] == null
-          ? null
-          : AirdropInfo.fromJson(json['airdropInfo'] as Map<String, dynamic>),
-      json['createdAt'] == null
-          ? null
-          : DateTime.parse(json['createdAt'] as String),
-      json['displayIndex'] as int?,
-      json['featuringIndex'] as int?,
-      json['updatedAt'] == null
-          ? null
-          : DateTime.parse(json['updatedAt'] as String),
-    );
-
-Map<String, dynamic> _$FFSeriesToJson(FFSeries instance) => <String, dynamic>{
-      'id': instance.id,
-      'artistID': instance.artistID,
-      'assetID': instance.assetID,
-      'title': instance.title,
-      'slug': instance.slug,
-      'medium': instance.medium,
-      'description': instance.description,
-      'thumbnailURI': instance.thumbnailURI,
-      'exhibitionID': instance.exhibitionID,
-      'metadata': instance.metadata,
-      'displayIndex': instance.displayIndex,
-      'featuringIndex': instance.featuringIndex,
-      'settings': instance.settings,
-      'artist': instance.artist,
-      'exhibition': instance.exhibition,
-      'airdropInfo': instance.airdropInfo,
-      'createdAt': instance.createdAt?.toIso8601String(),
-      'updatedAt': instance.updatedAt?.toIso8601String(),
-    };
-
-FFSeriesResponse _$FFSeriesResponseFromJson(Map<String, dynamic> json) =>
-    FFSeriesResponse(
-      FFSeries.fromJson(json['result'] as Map<String, dynamic>),
-    );
-
-Map<String, dynamic> _$FFSeriesResponseToJson(FFSeriesResponse instance) =>
-    <String, dynamic>{
-      'result': instance.result,
-    };
-
-FFSeriesSettings _$FFSeriesSettingsFromJson(Map<String, dynamic> json) =>
-    FFSeriesSettings(
-      json['saleModel'] as String?,
-      json['maxArtwork'] as int,
-    );
-
-Map<String, dynamic> _$FFSeriesSettingsToJson(FFSeriesSettings instance) =>
-    <String, dynamic>{
-      'maxArtwork': instance.maxArtwork,
-      'saleModel': instance.saleModel,
-    };
-
 FFContract _$FFContractFromJson(Map<String, dynamic> json) => FFContract(
       json['name'] as String,
       json['blockchainType'] as String,
@@ -335,6 +184,9 @@ Artwork _$ArtworkFromJson(Map<String, dynamic> json) => Artwork(
       json['burned'] as bool?,
       json['blockchainStatus'] as String,
       json['isExternal'] as bool,
+      json['thumbnailURI'] as String,
+      json['previewURI'] as String,
+      json['metadata'] as Map<String, dynamic>,
       DateTime.parse(json['mintedAt'] as String),
       DateTime.parse(json['createdAt'] as String),
       DateTime.parse(json['updatedAt'] as String),
@@ -342,6 +194,9 @@ Artwork _$ArtworkFromJson(Map<String, dynamic> json) => Artwork(
       json['series'] == null
           ? null
           : FFSeries.fromJson(json['series'] as Map<String, dynamic>),
+      json['swap'] == null
+          ? null
+          : ArtworkSwap.fromJson(json['swap'] as Map<String, dynamic>),
     );
 
 Map<String, dynamic> _$ArtworkToJson(Artwork instance) => <String, dynamic>{
@@ -355,9 +210,13 @@ Map<String, dynamic> _$ArtworkToJson(Artwork instance) => <String, dynamic>{
       'burned': instance.burned,
       'blockchainStatus': instance.blockchainStatus,
       'isExternal': instance.isExternal,
+      'thumbnailURI': instance.thumbnailURI,
+      'previewURI': instance.previewURI,
+      'metadata': instance.metadata,
       'mintedAt': instance.mintedAt.toIso8601String(),
       'createdAt': instance.createdAt.toIso8601String(),
       'updatedAt': instance.updatedAt.toIso8601String(),
       'isArchived': instance.isArchived,
       'series': instance.series,
+      'swap': instance.swap,
     };
diff --git a/lib/model/ff_exhibition.dart b/lib/model/ff_exhibition.dart
new file mode 100644
index 000000000..cd5f0b243
--- /dev/null
+++ b/lib/model/ff_exhibition.dart
@@ -0,0 +1,221 @@
+import 'package:autonomy_flutter/common/environment.dart';
+import 'package:autonomy_flutter/model/ff_account.dart';
+import 'package:autonomy_flutter/model/ff_series.dart';
+import 'package:autonomy_flutter/model/ff_user.dart';
+import 'package:collection/collection.dart';
+
+class Exhibition {
+  final String id;
+  final String title;
+  final String slug;
+  final DateTime exhibitionStartAt;
+
+  final String noteTitle;
+  final String noteBrief;
+  final String note;
+
+  final String? coverURI;
+  final String? thumbnailCoverURI;
+  final String mintBlockchain;
+  final FFCurator? curator;
+  final List<FFArtist>? artists;
+  final List<FFSeries>? series;
+  final List<FFContract>? contracts;
+  final FFArtist? partner;
+  final String type;
+  final List<ExhibitionEvent>? resources;
+
+  Exhibition({
+    required this.id,
+    required this.title,
+    required this.slug,
+    required this.exhibitionStartAt,
+    required this.noteTitle,
+    required this.noteBrief,
+    required this.note,
+    required this.mintBlockchain,
+    required this.type,
+    this.coverURI,
+    this.thumbnailCoverURI,
+    this.artists,
+    this.series,
+    this.contracts,
+    this.partner,
+    this.curator,
+    this.resources,
+  });
+
+  factory Exhibition.fromJson(Map<String, dynamic> json) => Exhibition(
+        id: json['id'] as String,
+        title: json['title'] as String,
+        slug: json['slug'] as String,
+        exhibitionStartAt: DateTime.parse(json['exhibitionStartAt'] as String),
+        noteTitle: json['noteTitle'] as String,
+        noteBrief: json['noteBrief'] as String,
+        note: json['note'] as String,
+        coverURI: json['coverURI'] as String?,
+        thumbnailCoverURI: json['thumbnailCoverURI'] as String?,
+        artists: (json['artists'] as List<dynamic>?)
+            ?.map((e) => FFArtist.fromJson(e as Map<String, dynamic>))
+            .toList(),
+        series: (json['series'] as List<dynamic>?)
+            ?.map((e) => FFSeries.fromJson(e as Map<String, dynamic>))
+            .toList(),
+        contracts: (json['contracts'] as List<dynamic>?)
+            ?.map((e) => FFContract.fromJson(e as Map<String, dynamic>))
+            .toList(),
+        mintBlockchain: json['mintBlockchain'] as String,
+        partner: json['partner'] == null
+            ? null
+            : FFArtist.fromJson(json['partner'] as Map<String, dynamic>),
+        type: json['type'] as String,
+        curator: json['curator'] == null
+            ? null
+            : FFCurator.fromJson(json['curator'] as Map<String, dynamic>),
+        resources: (json['resources'] as List<dynamic>?)
+            ?.map((e) => ExhibitionEvent.fromJson(e as Map<String, dynamic>))
+            .toList(),
+      );
+
+  Map<String, dynamic> toJson() => {
+        'id': id,
+        'title': title,
+        'slug': slug,
+        'exhibitionStartAt': exhibitionStartAt.toIso8601String(),
+        'noteTitle': noteTitle,
+        'noteBrief': noteBrief,
+        'note': note,
+        'coverURI': coverURI,
+        'thumbnailCoverURI': thumbnailCoverURI,
+        'artists': artists?.map((e) => e.toJson()).toList(),
+        'series': series?.map((e) => e.toJson()).toList(),
+        'contracts': contracts?.map((e) => e.toJson()).toList(),
+        'mintBlockchain': mintBlockchain,
+        'partner': partner?.toJson(),
+        'type': type,
+        'curator': curator?.toJson(),
+        'resources': resources?.map((e) => e.toJson()).toList(),
+      };
+
+  FFArtist? getArtist(FFSeries? series) {
+    final artistId = series?.artistID;
+    return artists?.firstWhereOrNull((artist) => artist.id == artistId);
+  }
+
+  String getThumbnailURL() =>
+      '${Environment.feralFileAssetURL}/$thumbnailCoverURI';
+}
+
+class ExhibitionResponse {
+  final Exhibition result;
+
+  ExhibitionResponse(this.result);
+
+  factory ExhibitionResponse.fromJson(Map<String, dynamic> json) =>
+      ExhibitionResponse(
+        Exhibition.fromJson(json['result'] as Map<String, dynamic>),
+      );
+
+  Map<String, dynamic> toJson() => {
+        'result': result,
+      };
+}
+
+class ListExhibitionResponse {
+  final List<Exhibition> result;
+
+  ListExhibitionResponse(this.result);
+
+  factory ListExhibitionResponse.fromJson(Map<String, dynamic> json) {
+    final List<dynamic> list = json['result'];
+    return ListExhibitionResponse(
+        list.map((e) => Exhibition.fromJson(e)).toList());
+  }
+}
+
+class ExhibitionDetail {
+  final Exhibition exhibition;
+  List<Artwork>? artworks;
+
+  ExhibitionDetail({required this.exhibition, this.artworks});
+}
+
+class ExhibitionEvent {
+  final String id;
+  final String exhibitionID;
+  final String type;
+  final String title;
+  final DateTime? dateTime;
+  final String? description;
+  final Map<String, String>? links;
+  final DateTime createdAt;
+  final DateTime updatedAt;
+  final MediaUri? mediaUri;
+
+  ExhibitionEvent({
+    required this.id,
+    required this.exhibitionID,
+    required this.type,
+    required this.title,
+    required this.createdAt,
+    required this.updatedAt,
+    this.dateTime,
+    this.description,
+    this.links,
+    this.mediaUri,
+  });
+
+  factory ExhibitionEvent.fromJson(Map<String, dynamic> json) =>
+      ExhibitionEvent(
+        id: json['id'],
+        exhibitionID: json['exhibitionID'],
+        type: json['type'],
+        title: json['title'],
+        dateTime: DateTime.tryParse(json['dateTime'] ?? ''),
+        description: json['description'],
+        links: Map<String, String>.from(json['links'] ?? {}),
+        createdAt: DateTime.parse(json['createdAt']),
+        updatedAt: DateTime.parse(json['updatedAt']),
+        mediaUri: json['mediaUri'] == null
+            ? null
+            : MediaUri.fromJson(json['mediaUri'] as Map<String, dynamic>),
+      );
+
+  // toJson
+  Map<String, dynamic> toJson() => {
+        'id': id,
+        'exhibitionID': exhibitionID,
+        'type': type,
+        'title': title,
+        'dateTime': dateTime?.toIso8601String(),
+        'description': description,
+        'links': links,
+        'createdAt': createdAt.toIso8601String(),
+        'updatedAt': updatedAt.toIso8601String(),
+        'mediaUri': mediaUri?.toJson(),
+      };
+}
+
+class MediaUri {
+  final String url;
+  final String type;
+  final String title;
+
+  MediaUri({
+    required this.url,
+    required this.type,
+    required this.title,
+  });
+
+  factory MediaUri.fromJson(Map<String, dynamic> json) => MediaUri(
+        url: json['url'],
+        type: json['type'],
+        title: json['title'],
+      );
+
+  Map<String, dynamic> toJson() => {
+        'url': url,
+        'type': type,
+        'title': title,
+      };
+}
diff --git a/lib/model/ff_exhibition_artworks_response.dart b/lib/model/ff_exhibition_artworks_response.dart
new file mode 100644
index 000000000..f2941209c
--- /dev/null
+++ b/lib/model/ff_exhibition_artworks_response.dart
@@ -0,0 +1,20 @@
+import 'package:autonomy_flutter/model/ff_account.dart';
+
+class ArtworksResponse {
+  final List<Artwork> result;
+
+  ArtworksResponse({
+    required this.result,
+  });
+
+  factory ArtworksResponse.fromJson(Map<String, dynamic> json) =>
+      ArtworksResponse(
+        result: (json['result'] as List<dynamic>)
+            .map((e) => Artwork.fromJson(e as Map<String, dynamic>))
+            .toList(),
+      );
+
+  Map<String, dynamic> toJson() => {
+        'result': result.map((e) => e.toJson()).toList(),
+      };
+}
diff --git a/lib/model/ff_series.dart b/lib/model/ff_series.dart
new file mode 100644
index 000000000..71bc5559a
--- /dev/null
+++ b/lib/model/ff_series.dart
@@ -0,0 +1,149 @@
+import 'package:autonomy_flutter/common/environment.dart';
+import 'package:autonomy_flutter/model/ff_account.dart';
+import 'package:autonomy_flutter/model/ff_exhibition.dart';
+import 'package:autonomy_flutter/model/ff_user.dart';
+import 'package:collection/collection.dart';
+
+class FFSeries {
+  final String id;
+  final String artistID;
+  final String? assetID;
+  final String title;
+  final String slug;
+  final String medium;
+  final String? description;
+  final String? thumbnailURI;
+  final String exhibitionID;
+  final Map<String, dynamic>? metadata;
+  final int? displayIndex;
+  final int? featuringIndex;
+  final FFSeriesSettings? settings;
+  final FFArtist? artist;
+  final Exhibition? exhibition;
+  final AirdropInfo? airdropInfo;
+  final DateTime? createdAt;
+  final DateTime? updatedAt;
+
+  FFSeries(
+    this.id,
+    this.artistID,
+    this.assetID,
+    this.title,
+    this.slug,
+    this.medium,
+    this.description,
+    this.thumbnailURI,
+    this.exhibitionID,
+    this.metadata,
+    this.settings,
+    this.artist,
+    this.exhibition,
+    this.airdropInfo,
+    this.createdAt,
+    this.displayIndex,
+    this.featuringIndex,
+    this.updatedAt,
+  );
+
+  int get maxEdition => settings?.maxArtwork ?? -1;
+
+  FFContract? get contract => exhibition?.contracts
+      ?.firstWhereOrNull((e) => e.address == airdropInfo?.contractAddress);
+
+  String getThumbnailURL() => '${Environment.feralFileAssetURL}/$thumbnailURI';
+
+  bool get isAirdropSeries => settings?.isAirdrop == true;
+
+  factory FFSeries.fromJson(Map<String, dynamic> json) => FFSeries(
+        json['id'] as String,
+        json['artistID'] as String,
+        json['assetID'] as String?,
+        json['title'] as String,
+        json['slug'] as String,
+        json['medium'] as String,
+        json['description'] as String?,
+        json['thumbnailURI'] as String?,
+        json['exhibitionID'] as String,
+        json['metadata'] as Map<String, dynamic>?,
+        json['settings'] == null
+            ? null
+            : FFSeriesSettings.fromJson(
+                json['settings'] as Map<String, dynamic>),
+        json['artist'] == null
+            ? null
+            : FFArtist.fromJson(json['artist'] as Map<String, dynamic>),
+        json['exhibition'] == null
+            ? null
+            : Exhibition.fromJson(json['exhibition'] as Map<String, dynamic>),
+        json['airdropInfo'] == null
+            ? null
+            : AirdropInfo.fromJson(json['airdropInfo'] as Map<String, dynamic>),
+        json['createdAt'] == null
+            ? null
+            : DateTime.parse(json['createdAt'] as String),
+        json['displayIndex'] as int?,
+        json['featuringIndex'] as int?,
+        json['updatedAt'] == null
+            ? null
+            : DateTime.parse(json['updatedAt'] as String),
+      );
+
+  Map<String, dynamic> toJson() => {
+        'id': id,
+        'artistID': artistID,
+        'assetID': assetID,
+        'title': title,
+        'slug': slug,
+        'medium': medium,
+        'description': description,
+        'thumbnailURI': thumbnailURI,
+        'exhibitionID': exhibitionID,
+        'metadata': metadata,
+        'displayIndex': displayIndex,
+        'featuringIndex': featuringIndex,
+        'settings': settings,
+        'artist': artist,
+        'exhibition': exhibition,
+        'airdropInfo': airdropInfo,
+        'createdAt': createdAt?.toIso8601String(),
+        'updatedAt': updatedAt?.toIso8601String(),
+      };
+}
+
+class FFSeriesResponse {
+  final FFSeries result;
+
+  FFSeriesResponse(
+    this.result,
+  );
+
+  factory FFSeriesResponse.fromJson(Map<String, dynamic> json) =>
+      FFSeriesResponse(
+        FFSeries.fromJson(json['result'] as Map<String, dynamic>),
+      );
+
+  Map<String, dynamic> toJson() => {
+        'result': result,
+      };
+}
+
+class FFSeriesSettings {
+  final int maxArtwork;
+  final String? saleModel;
+
+  FFSeriesSettings(this.saleModel, this.maxArtwork);
+
+  factory FFSeriesSettings.fromJson(Map<String, dynamic> json) =>
+      FFSeriesSettings(
+        json['saleModel'] as String?,
+        json['maxArtwork'] as int,
+      );
+
+  Map<String, dynamic> toJson() => {
+        'maxArtwork': maxArtwork,
+        'saleModel': saleModel,
+      };
+
+  bool get isAirdrop =>
+      ['airdrop', 'shopping_airdrop'].contains(saleModel?.toLowerCase());
+}
diff --git a/lib/model/ff_user.dart b/lib/model/ff_user.dart
new file mode 100644
index 000000000..7d378c8cd
--- /dev/null
+++ b/lib/model/ff_user.dart
@@ -0,0 +1,115 @@
+class FFUser {
+  final String id;
+  final String? slug;
+  final String alias;
+  final String? avatarURI;
+  final String? fullName;
+  String? type;
+  Map<String, dynamic>? metadata;
+  final DateTime? createdAt;
+  final DateTime? updatedAt;
+
+  FFUser({
+    required this.id,
+    required this.alias,
+    this.slug,
+    this.avatarURI,
+    this.fullName,
+    this.type,
+    this.metadata,
+    this.createdAt,
+    this.updatedAt,
+  });
+}
+
+class FFArtist {
+  final String id;
+  final String alias;
+  final String slug;
+  final bool? verified;
+  final bool? isArtist;
+  final String? fullName;
+  final String? avatarURI;
+  final String? accountNumber;
+  final String? type;
+
+  FFArtist(
+    this.id,
+    this.alias,
+    this.slug,
+    this.verified,
+    this.isArtist,
+    this.fullName,
+    this.avatarURI,
+    this.accountNumber,
+    this.type,
+  );
+
+  factory FFArtist.fromJson(Map<String, dynamic> json) => FFArtist(
+        json['ID'] as String,
+        json['alias'] as String,
+        json['slug'] as String,
+        json['verified'] as bool?,
+        json['isArtist'] as bool?,
+        json['fullName'] as String?,
+        json['avatarURI'] as String?,
+        json['accountNumber'] as String?,
+        json['type'] as String?,
+      );
+
+  Map<String, dynamic> toJson() => {
+        'ID': id,
+        'alias': alias,
+        'slug': slug,
+        'verified': verified,
+        'isArtist': isArtist,
+        'fullName': fullName,
+        'avatarURI': avatarURI,
+        'accountNumber': accountNumber,
+        'type': type,
+      };
+}
+
+class FFCurator extends FFUser {
+  final String? email;
+  final String avatarUri;
+
+  FFCurator({
+    required super.id,
+    required super.alias,
+    required String super.slug,
+    required this.avatarUri,
+    this.email,
+    super.fullName,
+    super.type,
+    super.metadata,
+    super.createdAt,
+    super.updatedAt,
+  });
+
+  factory FFCurator.fromJson(Map<String, dynamic> json) => FFCurator(
+        id: json['ID'],
+        alias: json['alias'],
+        slug: json['slug'],
+        email: json['email'],
+        avatarUri: json['avatarURI'],
+        fullName: json['fullName'],
+        type: json['type'],
+        metadata: json['metadata'],
+        createdAt: DateTime.tryParse(json['createdAt']),
+        updatedAt: DateTime.tryParse(json['updatedAt']),
+      );
+
+  Map<String, dynamic> toJson() => {
+        'ID': id,
+        'alias': alias,
+        'slug': slug,
+        'email': email,
+        'avatarURI': avatarURI,
+        'fullName': fullName,
+        'type': type,
+        'metadata': metadata,
+        'createdAt': createdAt?.toIso8601String(),
+        'updatedAt': updatedAt?.toIso8601String(),
+      };
+}
diff --git a/lib/model/play_control_model.dart b/lib/model/play_control_model.dart
index ef123b28e..d05b39a74 100644
--- a/lib/model/play_control_model.dart
+++ b/lib/model/play_control_model.dart
@@ -18,30 +18,28 @@ class PlayControlModel {
   PlayControlModel copyWith({
     int? timer,
     bool? isShuffle,
-  }) {
-    return PlayControlModel(
-      timer: timer ?? this.timer,
-      isShuffle: isShuffle ?? this.isShuffle,
-    );
-  }
-
-  Map<String, dynamic> toJson() {
-    return <String, dynamic>{
-      'timer': timer,
-      'isShuffle': isShuffle,
-    };
-  }
-
-  factory PlayControlModel.fromJson(Map<String, dynamic> map) {
-    return PlayControlModel(
-      timer: map['timer'] as int,
-      isShuffle: map['isShuffle'] as bool,
-    );
-  }
+  }) =>
+      PlayControlModel(
+        timer: timer ?? this.timer,
+        isShuffle: isShuffle ?? this.isShuffle,
+      );
+
+  Map<String, dynamic> toJson() => <String, dynamic>{
+        'timer': timer,
+        'isShuffle': isShuffle,
+      };
+
+  factory PlayControlModel.fromJson(Map<String, dynamic> map) =>
+      PlayControlModel(
+        timer: map['timer'] as int,
+        isShuffle: map['isShuffle'] as bool,
+      );
 
   @override
   bool operator ==(covariant PlayControlModel other) {
-    if (identical(this, other)) return true;
+    if (identical(this, other)) {
+      return true;
+    }
 
     return other.timer == timer && other.isShuffle == isShuffle;
   }
diff --git a/lib/model/play_list_model.dart b/lib/model/play_list_model.dart
index 1e3700520..42d6820e2 100644
--- a/lib/model/play_list_model.dart
+++ b/lib/model/play_list_model.dart
@@ -1,4 +1,5 @@
 import 'package:autonomy_flutter/model/play_control_model.dart';
+import 'package:easy_localization/easy_localization.dart';
 import 'package:flutter/foundation.dart';
 
 class PlayListModel {
@@ -22,24 +23,25 @@ class PlayListModel {
     String? thumbnailURL,
     List<String>? tokenIDs,
     PlayControlModel? playControlModel,
-  }) {
-    return PlayListModel(
-      id: id ?? this.id,
-      name: name ?? this.name,
-      thumbnailURL: thumbnailURL ?? this.thumbnailURL,
-      tokenIDs: tokenIDs ?? this.tokenIDs,
-      playControlModel: playControlModel ?? this.playControlModel,
-    );
-  }
+  }) =>
+      PlayListModel(
+        id: id ?? this.id,
+        name: name ?? this.name,
+        thumbnailURL: thumbnailURL ?? this.thumbnailURL,
+        tokenIDs: tokenIDs ?? this.tokenIDs,
+        playControlModel: playControlModel ?? this.playControlModel,
+      );
 
   @override
-  String toString() {
-    return 'PlayListModel(id: $id, name: $name, thumbnailURL: $thumbnailURL, tokenIDs: $tokenIDs, playControlModel: $playControlModel)';
-  }
+  String toString() =>
+      'PlayListModel(id: $id, name: $name, thumbnailURL: $thumbnailURL, '
+      'tokenIDs: $tokenIDs, playControlModel: $playControlModel)';
 
   @override
   bool operator ==(covariant PlayListModel other) {
-    if (identical(this, other)) return true;
+    if (identical(this, other)) {
+      return true;
+    }
 
     return other.id == id &&
         other.name == name &&
@@ -49,37 +51,63 @@ class PlayListModel {
   }
 
   @override
-  int get hashCode {
-    return id.hashCode ^
-        name.hashCode ^
-        thumbnailURL.hashCode ^
-        tokenIDs.hashCode ^
-        playControlModel.hashCode;
+  int get hashCode =>
+      id.hashCode ^
+      name.hashCode ^
+      thumbnailURL.hashCode ^
+      tokenIDs.hashCode ^
+      playControlModel.hashCode;
+
+  Map<String, dynamic> toJson() => <String, dynamic>{
+        'id': id,
+        'name': name,
+        'thumbnailURL': thumbnailURL,
+        'tokenIDs': tokenIDs,
+        'playControlModel': playControlModel?.toJson(),
+      };
+
+  factory PlayListModel.fromJson(Map<String, dynamic> map) => PlayListModel(
+        id: map['id'] != null ? map['id'] as String : null,
+        name: map['name'] != null ? map['name'] as String : null,
+        thumbnailURL:
+            map['thumbnailURL'] != null ? map['thumbnailURL'] as String : null,
+        tokenIDs: map['tokenIDs'] != null
+            ? List<String>.from(map['tokenIDs'] as List<dynamic>)
+            : null,
+        playControlModel: map['playControlModel'] != null
+            ? PlayControlModel.fromJson(
+                map['playControlModel'] as Map<String, dynamic>)
+            : null,
+      );
+
+  String getName() => name ?? tr('untitled');
+}
+
+extension PlayListModelExtension on PlayListModel {
+  bool get isDefault {
+    final defaultPlaylists = DefaultPlaylistModel.getAll();
+    return defaultPlaylists.any((element) => element.id == id);
   }
+}
 
-  Map<String, dynamic> toJson() {
-    return <String, dynamic>{
-      'id': id,
-      'name': name,
-      'thumbnailURL': thumbnailURL,
-      'tokenIDs': tokenIDs,
-      'playControlModel': playControlModel?.toJson(),
-    };
+enum DefaultPlaylistModel {
+  allNfts;
+
+  String get id {
+    switch (this) {
+      case DefaultPlaylistModel.allNfts:
+        return 'all_nfts';
+    }
   }
 
-  factory PlayListModel.fromJson(Map<String, dynamic> map) {
-    return PlayListModel(
-      id: map['id'] != null ? map['id'] as String : null,
-      name: map['name'] != null ? map['name'] as String : null,
-      thumbnailURL:
-          map['thumbnailURL'] != null ? map['thumbnailURL'] as String : null,
-      tokenIDs: map['tokenIDs'] != null
-          ? List<String>.from((map['tokenIDs'] as List<dynamic>))
-          : null,
-      playControlModel: map['playControlModel'] != null
-          ? PlayControlModel.fromJson(
-              map['playControlModel'] as Map<String, dynamic>)
-          : null,
-    );
+  String get name {
+    switch (this) {
+      case DefaultPlaylistModel.allNfts:
+        return 'all'.tr();
+    }
   }
+
+  static List<DefaultPlaylistModel> getAll() => [
+        DefaultPlaylistModel.allNfts,
+      ];
 }
diff --git a/lib/model/tzkt_operation.g.dart b/lib/model/tzkt_operation.g.dart
index 15677233a..a5ce0497d 100644
--- a/lib/model/tzkt_operation.g.dart
+++ b/lib/model/tzkt_operation.g.dart
@@ -15,6 +15,10 @@ TZKTOperation _$TZKTOperationFromJson(Map<String, dynamic> json) =>
       block: json['block'] as String,
       hash: json['hash'] as String,
       counter: json['counter'] as int,
+      gasLimit: json['gasLimit'] as int,
+      gasUsed: json['gasUsed'] as int,
+      bakerFee: json['bakerFee'] as int,
+      quote: TZKTQuote.fromJson(json['quote'] as Map<String, dynamic>),
       initiator: json['initiator'] == null
           ? null
           : TZKTActor.fromJson(json['initiator'] as Map<String, dynamic>),
@@ -24,17 +28,13 @@ TZKTOperation _$TZKTOperationFromJson(Map<String, dynamic> json) =>
       target: json['target'] == null
           ? null
           : TZKTActor.fromJson(json['target'] as Map<String, dynamic>),
-      gasLimit: json['gasLimit'] as int,
-      gasUsed: json['gasUsed'] as int,
       storageLimit: json['storageLimit'] as int?,
       storageUsed: json['storageUsed'] as int?,
-      bakerFee: json['bakerFee'] as int,
       storageFee: json['storageFee'] as int?,
       allocationFee: json['allocationFee'] as int?,
       amount: json['amount'] as int?,
       status: json['status'] as String?,
       hasInternals: json['hasInternals'] as bool?,
-      quote: TZKTQuote.fromJson(json['quote'] as Map<String, dynamic>),
       parameter: json['parameter'] == null
           ? null
           : TZKTParameter.fromJson(json['parameter'] as Map<String, dynamic>),
diff --git a/lib/screen/app_router.dart b/lib/screen/app_router.dart
index b173cb1e3..a4893a25f 100644
--- a/lib/screen/app_router.dart
+++ b/lib/screen/app_router.dart
@@ -10,7 +10,7 @@ import 'package:autonomy_flutter/database/app_database.dart';
 import 'package:autonomy_flutter/database/cloud_database.dart';
 import 'package:autonomy_flutter/database/entity/connection.dart';
 import 'package:autonomy_flutter/model/connection_request_args.dart';
-import 'package:autonomy_flutter/model/ff_account.dart';
+import 'package:autonomy_flutter/model/ff_series.dart';
 import 'package:autonomy_flutter/model/play_list_model.dart';
 import 'package:autonomy_flutter/model/postcard_claim.dart';
 import 'package:autonomy_flutter/model/wc2_request.dart';
@@ -55,6 +55,11 @@ import 'package:autonomy_flutter/screen/detail/preview/canvas_help_page.dart';
 import 'package:autonomy_flutter/screen/detail/preview/keyboard_control_page.dart';
 import 'package:autonomy_flutter/screen/detail/preview/touchpad_page.dart';
 import 'package:autonomy_flutter/screen/detail/preview_primer.dart';
+import 'package:autonomy_flutter/screen/exhibition_details/exhibition_detail_bloc.dart';
+import 'package:autonomy_flutter/screen/exhibition_details/exhibition_detail_page.dart';
+import 'package:autonomy_flutter/screen/feralfile_artwork_preview/feralfile_artwork_preview_page.dart';
+import 'package:autonomy_flutter/screen/feralfile_series/feralfile_series_bloc.dart';
+import 'package:autonomy_flutter/screen/feralfile_series/feralfile_series_page.dart';
 import 'package:autonomy_flutter/screen/gallery/gallery_bloc.dart';
 import 'package:autonomy_flutter/screen/gallery/gallery_page.dart';
 import 'package:autonomy_flutter/screen/github_doc.dart';
@@ -78,6 +83,7 @@ import 'package:autonomy_flutter/screen/irl_screen/sign_message_screen.dart';
 import 'package:autonomy_flutter/screen/irl_screen/webview_irl_screen.dart';
 import 'package:autonomy_flutter/screen/migration/key_sync_bloc.dart';
 import 'package:autonomy_flutter/screen/migration/key_sync_page.dart';
+import 'package:autonomy_flutter/screen/moma_postcard_page/moma_postcard_page.dart';
 import 'package:autonomy_flutter/screen/notification_onboarding_page.dart';
 import 'package:autonomy_flutter/screen/onboarding/import_address/import_seeds.dart';
 import 'package:autonomy_flutter/screen/onboarding/import_address/name_address_persona.dart';
@@ -89,8 +95,10 @@ import 'package:autonomy_flutter/screen/onboarding/view_address/view_existing_ad
 import 'package:autonomy_flutter/screen/onboarding_page.dart';
 import 'package:autonomy_flutter/screen/participate_user_test_page.dart';
 import 'package:autonomy_flutter/screen/playlists/add_new_playlist/add_new_playlist.dart';
+import 'package:autonomy_flutter/screen/playlists/add_to_playlist/add_to_playlist.dart';
 import 'package:autonomy_flutter/screen/playlists/edit_playlist/edit_playlist.dart';
 import 'package:autonomy_flutter/screen/playlists/view_playlist/view_playlist.dart';
+import 'package:autonomy_flutter/screen/predefined_collection/predefined_collection_screen.dart';
 import 'package:autonomy_flutter/screen/release_notes_page.dart';
 import 'package:autonomy_flutter/screen/scan_qr/scan_qr_page.dart';
 import 'package:autonomy_flutter/screen/send_receive_postcard/receive_postcard_page.dart';
@@ -208,6 +216,12 @@ class AppRouter {
   static const previewActivationClaimPage = 'preview_activation_claim_page';
   static const postcardLeaderboardPage = 'postcard_leaderboard_page';
   static const postcardLocationExplain = 'postcard_location_explain';
+  static const predefinedCollectionPage = 'predefined_collection_page';
+  static const addToCollectionPage = 'add_to_collection_page';
+  static const exhibitionDetailPage = 'exhibition_detail_page';
+  static const ffArtworkPreviewPage = 'ff_artwork_preview_page';
+  static const feralFileSeriesPage = 'feral_file_series_page';
+  static const momaPostcardPage = 'moma_postcard_page';
 
   static Route<dynamic> onGenerateRoute(RouteSettings settings) {
     final ethereumBloc = EthereumBloc(injector(), injector());
@@ -240,7 +254,7 @@ class AppRouter {
               injector(),
             ),
             child: ViewPlaylistScreen(
-              playListModel: settings.arguments as PlayListModel?,
+              payload: settings.arguments! as ViewPlaylistScreenPayload,
             ),
           ),
         );
@@ -469,7 +483,6 @@ class AppRouter {
       case settingsPage:
         return CupertinoPageRoute(
             settings: settings,
-            fullscreenDialog: true,
             builder: (context) => MultiBlocProvider(providers: [
                   BlocProvider.value(value: accountsBloc),
                   BlocProvider(create: (_) => personaBloc),
@@ -766,12 +779,9 @@ class AppRouter {
             ));
 
       case supportCustomerPage:
-        return PageTransition(
+        return CupertinoPageRoute(
             settings: settings,
-            type: PageTransitionType.topToBottom,
-            curve: Curves.easeIn,
-            duration: const Duration(milliseconds: 250),
-            child: const SupportCustomerPage());
+            builder: (context) => const SupportCustomerPage());
 
       case supportListPage:
         return CupertinoPageRoute(
@@ -812,6 +822,48 @@ class AppRouter {
                   ],
                   child: const HiddenArtworksPage(),
                 ));
+      case momaPostcardPage:
+        return CupertinoPageRoute(
+            settings: settings, builder: (context) => const MoMAPostcardPage());
+
+      case exhibitionDetailPage:
+        return CupertinoPageRoute(
+            settings: settings,
+            builder: (context) => MultiBlocProvider(
+                  providers: [
+                    BlocProvider(
+                      create: (_) => ExhibitionDetailBloc(injector()),
+                    ),
+                    BlocProvider(
+                      create: (_) => CanvasDeviceBloc(
+                        injector(),
+                      ),
+                    ),
+                  ],
+                  child: ExhibitionDetailPage(
+                    payload: settings.arguments! as ExhibitionDetailPayload,
+                  ),
+                ));
+      case ffArtworkPreviewPage:
+        return CupertinoPageRoute(
+            settings: settings,
+            builder: (context) => FeralFileArtworkPreviewPage(
+                payload:
+                    settings.arguments! as FeralFileArtworkPreviewPagePayload));
+
+      case feralFileSeriesPage:
+        return CupertinoPageRoute(
+            settings: settings,
+            builder: (context) => MultiBlocProvider(
+                  providers: [
+                    BlocProvider(
+                      create: (_) => FeralFileSeriesBloc(injector()),
+                    ),
+                  ],
+                  child: FeralFileSeriesPage(
+                    payload: settings.arguments! as FeralFileSeriesPagePayload,
+                  ),
+                ));
 
       case githubDocPage:
         return CupertinoPageRoute(
@@ -1144,6 +1196,24 @@ class AppRouter {
           ),
         );
 
+      case predefinedCollectionPage:
+        return CupertinoPageRoute(
+            settings: settings,
+            builder: (context) {
+              final payload =
+                  settings.arguments! as PredefinedCollectionScreenPayload;
+              return PredefinedCollectionScreen(
+                payload: payload,
+              );
+            });
+      case addToCollectionPage:
+        return CupertinoPageRoute(
+          settings: settings,
+          builder: (context) => AddToCollectionScreen(
+            playList: settings.arguments! as PlayListModel,
+          ),
+        );
+
       default:
         throw Exception('Invalid route: ${settings.name}');
     }
diff --git a/lib/screen/bug_bounty_page.dart b/lib/screen/bug_bounty_page.dart
index 2019a58a1..021ee3624 100644
--- a/lib/screen/bug_bounty_page.dart
+++ b/lib/screen/bug_bounty_page.dart
@@ -19,27 +19,27 @@ import 'package:flutter/material.dart';
 import 'package:url_launcher/url_launcher.dart';
 
 class BugBountyPage extends StatelessWidget {
-  const BugBountyPage({Key? key}) : super(key: key);
+  const BugBountyPage({super.key});
 
   @override
   Widget build(BuildContext context) {
     final theme = Theme.of(context);
 
     Map<String, String> guidelines = {
-      "critical".tr(): "guidelines_critical".tr(),
+      'critical'.tr(): 'guidelines_critical'.tr(),
       //"Key leaks or invalid transactions resulting in asset loss: Up to \$5,000",
-      "high".tr(): "guidelines_high".tr(),
+      'high'.tr(): 'guidelines_high'.tr(),
       // "Crashes or user data loss: \$100 - \$500",
-      "medium".tr(): "guidelines_medium".tr(),
+      'medium'.tr(): 'guidelines_medium'.tr(),
       //"Incorrect flows or incompatibility with protocol or dapps: \$50 - \$100",
-      "low".tr(): "guidelines_low".tr(),
+      'low'.tr(): 'guidelines_low'.tr(),
       // "UI typos, alignment errors: \$10 - \$50",
     };
 
     return Scaffold(
       appBar: getBackAppBar(
         context,
-        title: "bug_bounty".tr(),
+        title: 'bug_bounty'.tr(),
         onBack: () => Navigator.of(context).pop(),
       ),
       body: Container(
@@ -50,8 +50,7 @@ class BugBountyPage extends StatelessWidget {
             children: [
               addTitleSpace(),
               Text(
-                "we_value_feedback".tr(),
-                //"We greatly value feedback from our customers and the work done by security researchers in improving the usability and security of Autonomy. We are committed to quickly verify, reproduce, and respond to legitimate reported interface issues and vulnerabilities. ",
+                'we_value_feedback'.tr(),
                 style: theme.textTheme.ppMori400Black16,
               ),
               const SizedBox(height: 32),
@@ -62,8 +61,7 @@ class BugBountyPage extends StatelessWidget {
                       style: theme.textTheme.ppMori400Black16,
                       children: <TextSpan>[
                     TextSpan(
-                      text: "only_accept_new_bug".tr(),
-                      //'We only accept new bug reports for our iPhone or Android Apps; please check our ',
+                      text: 'only_accept_new_bug'.tr(),
                     ),
                     TextSpan(
                       recognizer: TapGestureRecognizer()
@@ -79,16 +77,14 @@ class BugBountyPage extends StatelessWidget {
                           : theme.textTheme.linkStyle16,
                     ),
                     TextSpan(
-                      text: "not_reward_yet".tr(),
-                      //' before submitting. Bug reports for web applications or any other projects are out of scope and will not be considered for rewards.',
+                      text: 'not_reward_yet'.tr(),
                     ),
                   ])),
               const SizedBox(height: 32),
               Text('rewards'.tr(), style: theme.textTheme.ppMori700Black24),
               const SizedBox(height: 32),
               Text(
-                "reward_ranging".tr(),
-                //'We pay rewards ranging from \$10 to \$5,000, administered according to the following guidelines:',
+                'reward_ranging'.tr(),
                 style: theme.textTheme.ppMori400Black16,
               ),
               const SizedBox(height: 32),
@@ -96,7 +92,7 @@ class BugBountyPage extends StatelessWidget {
                 padding: const EdgeInsets.all(10),
                 decoration: BoxDecoration(
                   borderRadius: BorderRadius.circular(10),
-                  color: AppColor.auSuperTeal,
+                  color: AppColor.feralFileHighlight,
                 ),
                 child: Column(
                   crossAxisAlignment: CrossAxisAlignment.start,
@@ -109,44 +105,42 @@ class BugBountyPage extends StatelessWidget {
                           .copyWith(fontWeight: FontWeight.bold),
                     ),
                     const SizedBox(height: 12),
-                    ...guidelines.keys
-                        .map(
-                          (e) => Row(
-                            crossAxisAlignment: CrossAxisAlignment.start,
-                            children: [
-                              const SizedBox(
-                                width: 8,
-                              ),
-                              Text(
-                                ' •  ',
+                    ...guidelines.keys.map(
+                      (e) => Row(
+                        crossAxisAlignment: CrossAxisAlignment.start,
+                        children: [
+                          const SizedBox(
+                            width: 8,
+                          ),
+                          Text(
+                            ' •  ',
+                            style: theme.textTheme.ppMori400Black14,
+                            textAlign: TextAlign.start,
+                          ),
+                          Expanded(
+                            child: RichText(
+                              text: TextSpan(
                                 style: theme.textTheme.ppMori400Black14,
-                                textAlign: TextAlign.start,
-                              ),
-                              Expanded(
-                                child: RichText(
-                                  text: TextSpan(
-                                    style: theme.textTheme.ppMori400Black14,
-                                    children: <TextSpan>[
-                                      TextSpan(
-                                        text: e,
-                                        style: ResponsiveLayout.isMobile
-                                            ? theme.textTheme.ppMori400Black14
-                                            : theme.textTheme.ppMori400Black16,
-                                      ),
-                                      TextSpan(
-                                        text: " – ${guidelines[e]!}",
-                                        style: ResponsiveLayout.isMobile
-                                            ? theme.textTheme.ppMori400Black14
-                                            : theme.textTheme.ppMori400Black16,
-                                      ),
-                                    ],
+                                children: <TextSpan>[
+                                  TextSpan(
+                                    text: e,
+                                    style: ResponsiveLayout.isMobile
+                                        ? theme.textTheme.ppMori400Black14
+                                        : theme.textTheme.ppMori400Black16,
                                   ),
-                                ),
+                                  TextSpan(
+                                    text: ' – ${guidelines[e]!}',
+                                    style: ResponsiveLayout.isMobile
+                                        ? theme.textTheme.ppMori400Black14
+                                        : theme.textTheme.ppMori400Black16,
+                                  ),
+                                ],
                               ),
-                            ],
+                            ),
                           ),
-                        )
-                        .toList(),
+                        ],
+                      ),
+                    ),
                   ],
                 ),
               ),
@@ -159,12 +153,11 @@ class BugBountyPage extends StatelessWidget {
               Text('disclosure_policy'.tr(),
                   style: theme.textTheme.ppMori700Black24),
               const SizedBox(height: 32),
-              Text("support_publication".tr(),
-                  //'We support the open publication of security research. We do ask that you give us a heads-up before any publication so we can do a final sync-up and check. ',
+              Text('support_publication'.tr(),
                   style: theme.textTheme.ppMori400Black16),
               const SizedBox(height: 32),
               PrimaryButton(
-                text: "report_a_bug".tr(),
+                text: 'report_a_bug'.tr(),
                 onTap: () => Navigator.of(context).pushNamed(
                     AppRouter.supportThreadPage,
                     arguments:
diff --git a/lib/screen/claim/activation/claim_activation_page.dart b/lib/screen/claim/activation/claim_activation_page.dart
index b73f771a4..5525203c7 100644
--- a/lib/screen/claim/activation/claim_activation_page.dart
+++ b/lib/screen/claim/activation/claim_activation_page.dart
@@ -1,3 +1,5 @@
+// ignore_for_file: discarded_futures, unawaited_futures
+
 import 'package:auto_size_text/auto_size_text.dart';
 import 'package:autonomy_flutter/common/injector.dart';
 import 'package:autonomy_flutter/gateway/activation_api.dart';
@@ -39,14 +41,12 @@ class ClaimActivationPage extends StatefulWidget {
   final ClaimActivationPagePayload payload;
 
   const ClaimActivationPage({
-    Key? key,
     required this.payload,
-  }) : super(key: key);
+    super.key,
+  });
 
   @override
-  State<ClaimActivationPage> createState() {
-    return _ClaimActivationPageState();
-  }
+  State<ClaimActivationPage> createState() => _ClaimActivationPageState();
 }
 
 class _ClaimActivationPageState extends State<ClaimActivationPage> {
@@ -61,8 +61,8 @@ class _ClaimActivationPageState extends State<ClaimActivationPage> {
   Widget build(BuildContext context) {
     final assetToken = widget.payload.assetToken;
     final artistName = widget.payload.assetToken.artistName!;
-    String gifter = "Gitfer";
-    String giftIntro = "you_can_receive_free_gift".tr();
+    String gifter = 'Gitfer';
+    String giftIntro = 'you_can_receive_free_gift'.tr();
     if (gifter.trim().isNotEmpty) {
       giftIntro += " ${'from'.tr().toLowerCase()} ";
     }
@@ -174,17 +174,17 @@ class _ClaimActivationPageState extends State<ClaimActivationPage> {
                                   },
                                 ),
                                 Text(
-                                  "by".tr(args: [artistName]),
+                                  'by'.tr(args: [artistName]),
                                   style: theme.textTheme.ppMori400White14,
                                 ),
                               ],
                             ),
                           ),
                           SvgPicture.asset(
-                            "assets/images/penrose_moma.svg",
+                            'assets/images/penrose_moma.svg',
                             colorFilter: ColorFilter.mode(
                                 theme.colorScheme.secondary, BlendMode.srcIn),
-                            width: 27,
+                            height: 27,
                           ),
                         ],
                       ),
@@ -207,7 +207,7 @@ class _ClaimActivationPageState extends State<ClaimActivationPage> {
                             style: theme.primaryTextTheme.ppMori700White14,
                           ),
                           TextSpan(
-                            text: ".",
+                            text: '.',
                             style: theme.primaryTextTheme.ppMori400White14,
                           ),
                         ],
@@ -217,14 +217,14 @@ class _ClaimActivationPageState extends State<ClaimActivationPage> {
                       height: 30,
                     ),
                     PrimaryButton(
-                      text: "accept_ownership".tr(),
+                      text: 'accept_ownership'.tr(),
                       enabled: !_processing,
                       isProcessing: _processing,
                       onTap: () async {
                         _metricClient.addEvent(
                           MixpanelEvent.acceptOwnership,
                           data: {
-                            "id": widget.payload.assetToken.id,
+                            'id': widget.payload.assetToken.id,
                           },
                         );
                         setState(() {
@@ -240,7 +240,7 @@ class _ClaimActivationPageState extends State<ClaimActivationPage> {
                               await _accountService.getOrCreateDefaultPersona();
                           final walletAddress =
                               await defaultPersona.insertNextAddress(
-                                  blockchain.toLowerCase() == "tezos"
+                                  blockchain.toLowerCase() == 'tezos'
                                       ? WalletType.Tezos
                                       : WalletType.Ethereum);
                           await _configService.setDoneOnboarding(true);
@@ -282,7 +282,7 @@ class _ClaimActivationPageState extends State<ClaimActivationPage> {
                       height: 30,
                     ),
                     Text(
-                      "accept_ownership_desc".tr(),
+                      'accept_ownership_desc'.tr(),
                       style: theme.primaryTextTheme.ppMori400White14,
                     ),
                     const SizedBox(
@@ -296,14 +296,14 @@ class _ClaimActivationPageState extends State<ClaimActivationPage> {
               height: 10,
             ),
             OutlineButton(
-              text: "decline".tr(),
+              text: 'decline'.tr(),
               enabled: !_processing,
               color: theme.colorScheme.primary,
               onTap: () {
                 _metricClient.addEvent(
                   MixpanelEvent.declineOwnership,
                   data: {
-                    "id": widget.payload.assetToken.id,
+                    'id': widget.payload.assetToken.id,
                   },
                 );
                 memoryValues.branchDeeplinkData.value = null;
@@ -334,7 +334,7 @@ class _ClaimActivationPageState extends State<ClaimActivationPage> {
       _metricClient.addEvent(
         MixpanelEvent.acceptOwnershipSuccess,
         data: {
-          "id": widget.payload.assetToken.id,
+          'id': widget.payload.assetToken.id,
         },
       );
     } catch (e) {
@@ -354,7 +354,7 @@ class _ClaimActivationPageState extends State<ClaimActivationPage> {
       NftCollectionBloc.eventController
           .add(GetTokensByOwnerEvent(pageKey: PageKey.init()));
       final token = widget.payload.assetToken;
-      const caption = "";
+      const caption = '';
       Navigator.of(context).pushNamed(AppRouter.artworkDetailsPage,
           arguments: ArtworkDetailPayload(
               [ArtworkIdentity(token.id, receiveAddress)], 0,
diff --git a/lib/screen/claim/airdrop/claim_airdrop_page.dart b/lib/screen/claim/airdrop/claim_airdrop_page.dart
index 9cdb22e9b..96bce4622 100644
--- a/lib/screen/claim/airdrop/claim_airdrop_page.dart
+++ b/lib/screen/claim/airdrop/claim_airdrop_page.dart
@@ -1,7 +1,9 @@
+import 'dart:async';
+
 import 'package:auto_size_text/auto_size_text.dart';
 import 'package:autonomy_flutter/common/injector.dart';
 import 'package:autonomy_flutter/main.dart';
-import 'package:autonomy_flutter/model/ff_account.dart';
+import 'package:autonomy_flutter/model/ff_series.dart';
 import 'package:autonomy_flutter/screen/app_router.dart';
 import 'package:autonomy_flutter/screen/claim/claim_token_page.dart';
 import 'package:autonomy_flutter/screen/claim/preview_token_claim.dart';
@@ -45,14 +47,12 @@ class ClaimAirdropPage extends StatefulWidget {
   final ClaimTokenPagePayload payload;
 
   const ClaimAirdropPage({
-    Key? key,
     required this.payload,
-  }) : super(key: key);
+    super.key,
+  });
 
   @override
-  State<ClaimAirdropPage> createState() {
-    return _ClaimAirdropPageState();
-  }
+  State<ClaimAirdropPage> createState() => _ClaimAirdropPageState();
 }
 
 class _ClaimAirdropPageState extends State<ClaimAirdropPage> {
@@ -67,11 +67,11 @@ class _ClaimAirdropPageState extends State<ClaimAirdropPage> {
   Widget build(BuildContext context) {
     final artwork = widget.payload.series;
     final artist = artwork.artist;
-    final artistName = artist != null ? artist.getDisplayName() : "";
+    final artistName = artist != null ? artist.getDisplayName() : '';
     final artworkThumbnail = artwork.getThumbnailURL();
     String gifter =
-        artwork.airdropInfo?.gifter?.replaceAll(" ", "\u00A0") ?? "";
-    String giftIntro = "you_can_receive_free_gift".tr();
+        artwork.airdropInfo?.gifter?.replaceAll(' ', '\u00A0') ?? '';
+    String giftIntro = 'you_can_receive_free_gift'.tr();
     if (gifter.trim().isNotEmpty) {
       giftIntro += " ${'from'.tr().toLowerCase()} ";
     }
@@ -150,8 +150,8 @@ class _ClaimAirdropPageState extends State<ClaimAirdropPage> {
                             ),
                           ),
                         ),
-                        onTap: () {
-                          Navigator.push(
+                        onTap: () async {
+                          await Navigator.push(
                             context,
                             MaterialPageRoute(
                               builder: (context) => PreviewTokenClaim(
@@ -179,8 +179,8 @@ class _ClaimAirdropPageState extends State<ClaimAirdropPage> {
                                     minFontSize: 14,
                                     maxLines: 2,
                                   ),
-                                  onTap: () {
-                                    Navigator.push(
+                                  onTap: () async {
+                                    await Navigator.push(
                                       context,
                                       MaterialPageRoute(
                                         builder: (context) => PreviewTokenClaim(
@@ -191,17 +191,17 @@ class _ClaimAirdropPageState extends State<ClaimAirdropPage> {
                                   },
                                 ),
                                 Text(
-                                  "by".tr(args: [artistName]),
+                                  'by'.tr(args: [artistName]),
                                   style: theme.textTheme.ppMori400White14,
                                 ),
                               ],
                             ),
                           ),
                           SvgPicture.asset(
-                            "assets/images/penrose_moma.svg",
+                            'assets/images/penrose_moma.svg',
                             colorFilter: ColorFilter.mode(
                                 theme.colorScheme.secondary, BlendMode.srcIn),
-                            width: 27,
+                            height: 27,
                           ),
                         ],
                       ),
@@ -224,7 +224,7 @@ class _ClaimAirdropPageState extends State<ClaimAirdropPage> {
                             style: theme.primaryTextTheme.ppMori700White14,
                           ),
                           TextSpan(
-                            text: ".",
+                            text: '.',
                             style: theme.primaryTextTheme.ppMori400White14,
                           ),
                         ],
@@ -234,23 +234,23 @@ class _ClaimAirdropPageState extends State<ClaimAirdropPage> {
                       height: 30,
                     ),
                     PrimaryButton(
-                      text: "accept_ownership".tr(),
+                      text: 'accept_ownership'.tr(),
                       enabled: !_processing,
                       isProcessing: _processing,
                       onTap: () async {
-                        _metricClient.addEvent(
+                        unawaited(_metricClient.addEvent(
                           MixpanelEvent.acceptOwnership,
                           data: {
-                            "id": widget.payload.series.id,
+                            'id': widget.payload.series.id,
                           },
-                        );
+                        ));
                         setState(() {
                           _processing = true;
                         });
                         final blockchain = widget
                                 .payload.series.exhibition?.mintBlockchain
                                 .capitalize() ??
-                            "Tezos";
+                            'Tezos';
                         final addresses = await _accountService.getAddress(
                             blockchain,
                             withViewOnly: widget.payload.allowViewOnlyClaim);
@@ -261,11 +261,12 @@ class _ClaimAirdropPageState extends State<ClaimAirdropPage> {
                               await _accountService.getOrCreateDefaultPersona();
                           final walletAddress =
                               await defaultPersona.insertNextAddress(
-                                  blockchain.toLowerCase() == "tezos"
+                                  blockchain.toLowerCase() == 'tezos'
                                       ? WalletType.Tezos
                                       : WalletType.Ethereum);
                           await _configService.setDoneOnboarding(true);
-                          _metricClient.mixPanelClient.initIfDefaultAccount();
+                          unawaited(_metricClient.mixPanelClient
+                              .initIfDefaultAccount());
                           await _configService.setPendingSettings(true);
                           address = walletAddress.first.address;
                         } else if (addresses.length == 1) {
@@ -284,7 +285,7 @@ class _ClaimAirdropPageState extends State<ClaimAirdropPage> {
                         }
 
                         if (address != null && mounted) {
-                          _claimToken(
+                          await _claimToken(
                             context: context,
                             claimID: widget.payload.claimID,
                             shareCode: widget.payload.shareCode,
@@ -302,7 +303,7 @@ class _ClaimAirdropPageState extends State<ClaimAirdropPage> {
                       height: 30,
                     ),
                     Text(
-                      "accept_ownership_desc".tr(),
+                      'accept_ownership_desc'.tr(),
                       style: theme.primaryTextTheme.ppMori400White14,
                     ),
                     const SizedBox(
@@ -310,11 +311,11 @@ class _ClaimAirdropPageState extends State<ClaimAirdropPage> {
                     ),
                     RichText(
                       text: TextSpan(
-                        text: "airdrop_accept_privacy_policy".tr(),
+                        text: 'airdrop_accept_privacy_policy'.tr(),
                         style: theme.textTheme.ppMori400Grey12,
                         children: [
                           TextSpan(
-                              text: "airdrop_privacy_policy".tr(),
+                              text: 'airdrop_privacy_policy'.tr(),
                               style: makeLinkStyle(
                                 theme.textTheme.ppMori400Grey12,
                               ),
@@ -323,7 +324,7 @@ class _ClaimAirdropPageState extends State<ClaimAirdropPage> {
                                   _openFFArtistCollector();
                                 }),
                           TextSpan(
-                            text: ".",
+                            text: '.',
                             style: theme.primaryTextTheme.bodyLarge
                                 ?.copyWith(fontSize: 14),
                           ),
@@ -338,16 +339,16 @@ class _ClaimAirdropPageState extends State<ClaimAirdropPage> {
               height: 10,
             ),
             OutlineButton(
-              text: "decline".tr(),
+              text: 'decline'.tr(),
               enabled: !_processing,
               color: theme.colorScheme.primary,
               onTap: () {
-                _metricClient.addEvent(
+                unawaited(_metricClient.addEvent(
                   MixpanelEvent.declineOwnership,
                   data: {
-                    "id": widget.payload.series.id,
+                    'id': widget.payload.series.id,
                   },
-                );
+                ));
                 memoryValues.branchDeeplinkData.value = null;
                 Navigator.of(context).pop(false);
               },
@@ -371,13 +372,13 @@ class _ClaimAirdropPageState extends State<ClaimAirdropPage> {
           shareCode: shareCode,
           seriesId: seriesId,
           receivingAddress: receiveAddress);
-      _metricClient.addEvent(
+      unawaited(_metricClient.addEvent(
         MixpanelEvent.acceptOwnershipSuccess,
         data: {
-          "id": widget.payload.series.id,
+          'id': widget.payload.series.id,
         },
-      );
-      _configService.setAlreadyClaimedAirdrop(seriesId, true);
+      ));
+      unawaited(_configService.setAlreadyClaimedAirdrop(seriesId, true));
     } catch (e) {
       setState(() {
         _processing = false;
@@ -388,7 +389,7 @@ class _ClaimAirdropPageState extends State<ClaimAirdropPage> {
       _processing = false;
     });
     if (mounted) {
-      Navigator.of(context).pushNamedAndRemoveUntil(
+      await Navigator.of(context).pushNamedAndRemoveUntil(
         AppRouter.homePage,
         (route) => false,
       );
@@ -396,17 +397,19 @@ class _ClaimAirdropPageState extends State<ClaimAirdropPage> {
           .add(GetTokensByOwnerEvent(pageKey: PageKey.init()));
       final token = claimRespone.token;
       final caption = claimRespone.airdropInfo.twitterCaption;
-      Navigator.of(context).pushNamed(AppRouter.artworkDetailsPage,
-          arguments: ArtworkDetailPayload(
-              [ArtworkIdentity(token.id, token.owner)], 0,
-              twitterCaption: caption ?? ""));
+      if (mounted) {
+        await Navigator.of(context).pushNamed(AppRouter.artworkDetailsPage,
+            arguments: ArtworkDetailPayload(
+                [ArtworkIdentity(token.id, token.owner)], 0,
+                twitterCaption: caption ?? ''));
+      }
     }
   }
 
   void _openFFArtistCollector() {
     String uri = (widget.payload.series.exhibition?.id == null)
         ? FF_ARTIST_COLLECTOR
-        : "$FF_ARTIST_COLLECTOR/${widget.payload.series.exhibition?.id}";
-    launchUrl(Uri.parse(uri), mode: LaunchMode.externalApplication);
+        : '$FF_ARTIST_COLLECTOR/${widget.payload.series.exhibition?.id}';
+    unawaited(launchUrl(Uri.parse(uri), mode: LaunchMode.externalApplication));
   }
 }
diff --git a/lib/screen/claim/claim_token_page.dart b/lib/screen/claim/claim_token_page.dart
index 4ed24051d..5b9ffea7b 100644
--- a/lib/screen/claim/claim_token_page.dart
+++ b/lib/screen/claim/claim_token_page.dart
@@ -1,7 +1,10 @@
+import 'dart:async';
+
 import 'package:auto_size_text/auto_size_text.dart';
 import 'package:autonomy_flutter/common/injector.dart';
 import 'package:autonomy_flutter/main.dart';
 import 'package:autonomy_flutter/model/ff_account.dart';
+import 'package:autonomy_flutter/model/ff_series.dart';
 import 'package:autonomy_flutter/model/otp.dart';
 import 'package:autonomy_flutter/screen/app_router.dart';
 import 'package:autonomy_flutter/screen/claim/preview_token_claim.dart';
@@ -48,16 +51,14 @@ class ClaimTokenPage extends StatefulWidget {
   final bool allowViewOnlyClaim;
 
   const ClaimTokenPage({
-    Key? key,
     required this.series,
+    super.key,
     this.otp,
     this.allowViewOnlyClaim = false,
-  }) : super(key: key);
+  });
 
   @override
-  State<StatefulWidget> createState() {
-    return _ClaimTokenPageState();
-  }
+  State<StatefulWidget> createState() => _ClaimTokenPageState();
 }
 
 class _ClaimTokenPageState extends State<ClaimTokenPage> {
@@ -70,11 +71,11 @@ class _ClaimTokenPageState extends State<ClaimTokenPage> {
   Widget build(BuildContext context) {
     final artwork = widget.series;
     final artist = artwork.artist;
-    final artistName = artist != null ? artist.getDisplayName() : "";
+    final artistName = artist != null ? artist.getDisplayName() : '';
     final artworkThumbnail = artwork.getThumbnailURL();
     String gifter =
-        artwork.airdropInfo?.gifter?.replaceAll(" ", "\u00A0") ?? "";
-    String giftIntro = "you_can_receive_free_gift".tr();
+        artwork.airdropInfo?.gifter?.replaceAll(' ', '\u00A0') ?? '';
+    String giftIntro = 'you_can_receive_free_gift'.tr();
     if (gifter.trim().isNotEmpty) {
       giftIntro += " ${'from'.tr().toLowerCase()} ";
     }
@@ -153,8 +154,8 @@ class _ClaimTokenPageState extends State<ClaimTokenPage> {
                             ),
                           ),
                         ),
-                        onTap: () {
-                          Navigator.push(
+                        onTap: () async {
+                          await Navigator.push(
                             context,
                             MaterialPageRoute(
                               builder: (context) => PreviewTokenClaim(
@@ -182,8 +183,8 @@ class _ClaimTokenPageState extends State<ClaimTokenPage> {
                                     minFontSize: 14,
                                     maxLines: 2,
                                   ),
-                                  onTap: () {
-                                    Navigator.push(
+                                  onTap: () async {
+                                    await Navigator.push(
                                       context,
                                       MaterialPageRoute(
                                         builder: (context) => PreviewTokenClaim(
@@ -194,17 +195,17 @@ class _ClaimTokenPageState extends State<ClaimTokenPage> {
                                   },
                                 ),
                                 Text(
-                                  "by".tr(args: [artistName]),
+                                  'by'.tr(args: [artistName]),
                                   style: theme.textTheme.ppMori400White14,
                                 ),
                               ],
                             ),
                           ),
                           SvgPicture.asset(
-                            "assets/images/penrose_moma.svg",
+                            'assets/images/penrose_moma.svg',
                             colorFilter: ColorFilter.mode(
                                 theme.colorScheme.secondary, BlendMode.srcIn),
-                            width: 27,
+                            height: 27,
                           ),
                         ],
                       ),
@@ -227,7 +228,7 @@ class _ClaimTokenPageState extends State<ClaimTokenPage> {
                             style: theme.primaryTextTheme.ppMori700White14,
                           ),
                           TextSpan(
-                            text: ".",
+                            text: '.',
                             style: theme.primaryTextTheme.ppMori400White14,
                           ),
                         ],
@@ -237,23 +238,23 @@ class _ClaimTokenPageState extends State<ClaimTokenPage> {
                       height: 30,
                     ),
                     PrimaryButton(
-                      text: "accept_ownership".tr(),
+                      text: 'accept_ownership'.tr(),
                       enabled: !_processing,
                       isProcessing: _processing,
                       onTap: () async {
-                        metricClient.addEvent(
+                        unawaited(metricClient.addEvent(
                           MixpanelEvent.acceptOwnership,
                           data: {
-                            "id": widget.series.id,
+                            'id': widget.series.id,
                           },
-                        );
+                        ));
                         setState(() {
                           _processing = true;
                         });
                         final blockchain = widget
                                 .series.exhibition?.mintBlockchain
                                 .capitalize() ??
-                            "Tezos";
+                            'Tezos';
                         final accountService = injector<AccountService>();
                         final addresses = await accountService.getAddress(
                             blockchain,
@@ -265,22 +266,24 @@ class _ClaimTokenPageState extends State<ClaimTokenPage> {
                               await accountService.getOrCreateDefaultPersona();
                           final walletAddress =
                               await defaultPersona.insertNextAddress(
-                                  blockchain.toLowerCase() == "tezos"
+                                  blockchain.toLowerCase() == 'tezos'
                                       ? WalletType.Tezos
                                       : WalletType.Ethereum);
 
                           final configService =
                               injector<ConfigurationService>();
                           await configService.setDoneOnboarding(true);
-                          injector<MetricClientService>()
+                          unawaited(injector<MetricClientService>()
                               .mixPanelClient
-                              .initIfDefaultAccount();
+                              .initIfDefaultAccount());
                           await configService.setPendingSettings(true);
                           address = walletAddress.first.address;
                         } else if (addresses.length == 1) {
                           address = addresses.first;
                         } else {
-                          if (!mounted) return;
+                          if (!mounted) {
+                            return;
+                          }
                           await Navigator.of(context).pushNamed(
                             AppRouter.claimSelectAccountPage,
                             arguments: SelectAccountPageArgs(
@@ -292,7 +295,7 @@ class _ClaimTokenPageState extends State<ClaimTokenPage> {
                           );
                         }
                         if (address != null && mounted) {
-                          _claimToken(context, address);
+                          unawaited(_claimToken(context, address));
                         } else {
                           setState(() {
                             _processing = false;
@@ -304,7 +307,7 @@ class _ClaimTokenPageState extends State<ClaimTokenPage> {
                       height: 30,
                     ),
                     Text(
-                      "accept_ownership_desc".tr(),
+                      'accept_ownership_desc'.tr(),
                       style: theme.primaryTextTheme.ppMori400White14,
                     ),
                     const SizedBox(
@@ -312,11 +315,11 @@ class _ClaimTokenPageState extends State<ClaimTokenPage> {
                     ),
                     RichText(
                       text: TextSpan(
-                        text: "airdrop_accept_privacy_policy".tr(),
+                        text: 'airdrop_accept_privacy_policy'.tr(),
                         style: theme.textTheme.ppMori400Grey12,
                         children: [
                           TextSpan(
-                              text: "airdrop_privacy_policy".tr(),
+                              text: 'airdrop_privacy_policy'.tr(),
                               style: makeLinkStyle(
                                 theme.textTheme.ppMori400Grey12,
                               ),
@@ -325,7 +328,7 @@ class _ClaimTokenPageState extends State<ClaimTokenPage> {
                                   _openFFArtistCollector();
                                 }),
                           TextSpan(
-                            text: ".",
+                            text: '.',
                             style: theme.primaryTextTheme.bodyLarge
                                 ?.copyWith(fontSize: 14),
                           ),
@@ -340,16 +343,16 @@ class _ClaimTokenPageState extends State<ClaimTokenPage> {
               height: 10,
             ),
             OutlineButton(
-              text: "decline".tr(),
+              text: 'decline'.tr(),
               enabled: !_processing,
               color: theme.colorScheme.primary,
               onTap: () {
-                metricClient.addEvent(
+                unawaited(metricClient.addEvent(
                   MixpanelEvent.declineOwnership,
                   data: {
-                    "id": widget.series.id,
+                    'id': widget.series.id,
                   },
-                );
+                ));
                 memoryValues.branchDeeplinkData.value = null;
                 Navigator.of(context).pop(false);
               },
@@ -369,16 +372,17 @@ class _ClaimTokenPageState extends State<ClaimTokenPage> {
         address: receiveAddress,
         otp: widget.otp,
       );
-      metricClient.addEvent(
+      unawaited(metricClient.addEvent(
         MixpanelEvent.acceptOwnershipSuccess,
         data: {
-          "id": widget.series.id,
+          'id': widget.series.id,
         },
-      );
-      configurationService.setAlreadyClaimedAirdrop(widget.series.id, true);
+      ));
+      unawaited(configurationService.setAlreadyClaimedAirdrop(
+          widget.series.id, true));
       memoryValues.branchDeeplinkData.value = null;
     } catch (e) {
-      log.info("[ClaimTokenPage] Claim token failed. $e");
+      log.info('[ClaimTokenPage] Claim token failed. $e');
       if (mounted) {
         await UIHelper.showClaimTokenError(
           context,
@@ -392,7 +396,7 @@ class _ClaimTokenPageState extends State<ClaimTokenPage> {
       _processing = false;
     });
     if (mounted) {
-      Navigator.of(context).pushNamedAndRemoveUntil(
+      await Navigator.of(context).pushNamedAndRemoveUntil(
         AppRouter.homePage,
         (route) => false,
       );
@@ -403,18 +407,20 @@ class _ClaimTokenPageState extends State<ClaimTokenPage> {
       if (token == null) {
         return;
       }
-      Navigator.of(context).pushNamed(AppRouter.artworkDetailsPage,
-          arguments: ArtworkDetailPayload(
-              [ArtworkIdentity(token.id, token.owner)], 0,
-              twitterCaption: caption ?? ""));
+      if (mounted) {
+        await Navigator.of(context).pushNamed(AppRouter.artworkDetailsPage,
+            arguments: ArtworkDetailPayload(
+                [ArtworkIdentity(token.id, token.owner)], 0,
+                twitterCaption: caption ?? ''));
+      }
     }
   }
 
   void _openFFArtistCollector() {
     String uri = (widget.series.exhibition?.id == null)
         ? FF_ARTIST_COLLECTOR
-        : "$FF_ARTIST_COLLECTOR/${widget.series.exhibition?.id}";
-    launchUrl(Uri.parse(uri), mode: LaunchMode.externalApplication);
+        : '$FF_ARTIST_COLLECTOR/${widget.series.exhibition?.id}';
+    unawaited(launchUrl(Uri.parse(uri), mode: LaunchMode.externalApplication));
   }
 }
 
diff --git a/lib/screen/claim/preview_token_claim.dart b/lib/screen/claim/preview_token_claim.dart
index 0c435cff1..a89a764e4 100644
--- a/lib/screen/claim/preview_token_claim.dart
+++ b/lib/screen/claim/preview_token_claim.dart
@@ -1,16 +1,17 @@
+import 'dart:async';
 import 'dart:io';
 
 import 'package:after_layout/after_layout.dart';
-import 'package:autonomy_flutter/model/ff_account.dart';
+import 'package:autonomy_flutter/model/ff_series.dart';
 import 'package:autonomy_flutter/screen/app_router.dart';
 import 'package:autonomy_flutter/util/feralfile_extension.dart';
 import 'package:autonomy_flutter/util/style.dart';
 import 'package:autonomy_flutter/view/responsive.dart';
+import 'package:autonomy_theme/autonomy_theme.dart';
 import 'package:cached_network_image/cached_network_image.dart';
+import 'package:easy_localization/easy_localization.dart';
 import 'package:flutter/material.dart';
 import 'package:flutter/services.dart';
-import 'package:autonomy_theme/autonomy_theme.dart';
-import 'package:easy_localization/easy_localization.dart';
 import 'package:flutter_svg/flutter_svg.dart';
 import 'package:shake/shake.dart';
 
@@ -18,9 +19,9 @@ class PreviewTokenClaim extends StatefulWidget {
   final FFSeries series;
 
   const PreviewTokenClaim({
-    Key? key,
     required this.series,
-  }) : super(key: key);
+    super.key,
+  });
 
   @override
   State<PreviewTokenClaim> createState() => _PreviewTokenClaimState();
@@ -37,10 +38,10 @@ class _PreviewTokenClaimState extends State<PreviewTokenClaim>
     WidgetsBinding.instance.removeObserver(this);
     _detector?.stopListening();
     if (Platform.isAndroid) {
-      SystemChrome.setEnabledSystemUIMode(
+      unawaited(SystemChrome.setEnabledSystemUIMode(
         SystemUiMode.manual,
         overlays: [SystemUiOverlay.top, SystemUiOverlay.bottom],
-      );
+      ));
     }
   }
 
@@ -52,10 +53,10 @@ class _PreviewTokenClaimState extends State<PreviewTokenClaim>
         setState(() {
           isFullScreen = false;
         });
-        SystemChrome.setEnabledSystemUIMode(
+        unawaited(SystemChrome.setEnabledSystemUIMode(
           SystemUiMode.manual,
           overlays: SystemUiOverlay.values,
-        );
+        ));
       },
     );
 
@@ -93,7 +94,7 @@ class _PreviewTokenClaimState extends State<PreviewTokenClaim>
                             mainAxisAlignment: MainAxisAlignment.center,
                             children: [
                               SvgPicture.asset(
-                                "assets/images/iconInfo.svg",
+                                'assets/images/iconInfo.svg',
                                 colorFilter: ColorFilter.mode(
                                     theme.colorScheme.secondary,
                                     BlendMode.srcIn),
@@ -115,12 +116,13 @@ class _PreviewTokenClaimState extends State<PreviewTokenClaim>
                                     ),
                                     Row(
                                       children: [
-                                        const SizedBox(height: 4.0),
+                                        const SizedBox(height: 4),
                                         Text(
-                                          "by".tr(args: [
-                                            artist != null
-                                                ? artist.getDisplayName()
-                                                : ""
+                                          'by'.tr(args: [
+                                            if (artist != null)
+                                              artist.getDisplayName()
+                                            else
+                                              ''
                                           ]).trim(),
                                           overflow: TextOverflow.ellipsis,
                                           style: theme
@@ -134,8 +136,8 @@ class _PreviewTokenClaimState extends State<PreviewTokenClaim>
                               const SizedBox(width: 5),
                             ],
                           ),
-                          onTap: () {
-                            Navigator.of(context).pushNamed(
+                          onTap: () async {
+                            await Navigator.of(context).pushNamed(
                               AppRouter.airdropTokenDetailPage,
                               arguments: artwork,
                             );
@@ -157,7 +159,7 @@ class _PreviewTokenClaimState extends State<PreviewTokenClaim>
                       IconButton(
                         onPressed: () => Navigator.of(context).pop(),
                         icon: closeIcon(color: theme.colorScheme.secondary),
-                        tooltip: "CloseArtwork",
+                        tooltip: 'CloseArtwork',
                       )
                     ],
                   ),
diff --git a/lib/screen/claim/select_account_page.dart b/lib/screen/claim/select_account_page.dart
index 2625412a5..63b2107a2 100644
--- a/lib/screen/claim/select_account_page.dart
+++ b/lib/screen/claim/select_account_page.dart
@@ -1,6 +1,8 @@
+import 'dart:async';
+
 import 'package:autonomy_flutter/common/injector.dart';
 import 'package:autonomy_flutter/main.dart';
-import 'package:autonomy_flutter/model/ff_account.dart';
+import 'package:autonomy_flutter/model/ff_series.dart';
 import 'package:autonomy_flutter/model/otp.dart';
 import 'package:autonomy_flutter/screen/app_router.dart';
 import 'package:autonomy_flutter/screen/bloc/accounts/accounts_bloc.dart';
@@ -47,18 +49,16 @@ class SelectAccountPage extends StatefulWidget {
   final bool withViewOnly;
 
   const SelectAccountPage({
-    Key? key,
-    this.blockchain,
     required this.artwork,
+    super.key,
+    this.blockchain,
     this.otp,
     this.fromWebview = false,
     this.withViewOnly = false,
-  }) : super(key: key);
+  });
 
   @override
-  State<StatefulWidget> createState() {
-    return _SelectAccountPageState();
-  }
+  State<StatefulWidget> createState() => _SelectAccountPageState();
 }
 
 class _SelectAccountPageState extends State<SelectAccountPage> with RouteAware {
@@ -67,7 +67,7 @@ class _SelectAccountPageState extends State<SelectAccountPage> with RouteAware {
 
   @override
   void initState() {
-    _isTezos = widget.blockchain?.toLowerCase() == "tezos";
+    _isTezos = widget.blockchain?.toLowerCase() == 'tezos';
     _callAccountEvent();
     super.initState();
   }
@@ -106,7 +106,7 @@ class _SelectAccountPageState extends State<SelectAccountPage> with RouteAware {
         onBack: () {
           Navigator.of(context).pop();
         },
-        title: "gift_edition".tr(),
+        title: 'gift_edition'.tr(),
       ),
       body: Container(
         padding: const EdgeInsets.only(bottom: 32),
@@ -117,7 +117,7 @@ class _SelectAccountPageState extends State<SelectAccountPage> with RouteAware {
             Padding(
               padding: ResponsiveLayout.pageHorizontalEdgeInsets,
               child: Text(
-                "where_do_want_to_receive_gift".tr(),
+                'where_do_want_to_receive_gift'.tr(),
                 style: theme.textTheme.ppMori700Black24,
               ),
             ),
@@ -125,9 +125,9 @@ class _SelectAccountPageState extends State<SelectAccountPage> with RouteAware {
             Padding(
               padding: ResponsiveLayout.pageHorizontalEdgeInsets,
               child: Text(
-                "claim_airdrop_select_account_desc".tr(args: [
-                  widget.blockchain ?? "Tezos",
-                  widget.blockchain ?? "Tezos",
+                'claim_airdrop_select_account_desc'.tr(args: [
+                  widget.blockchain ?? 'Tezos',
+                  widget.blockchain ?? 'Tezos',
                 ]),
                 style: theme.textTheme.ppMori400Black14,
               ),
@@ -139,7 +139,7 @@ class _SelectAccountPageState extends State<SelectAccountPage> with RouteAware {
             Padding(
               padding: ResponsiveLayout.pageHorizontalEdgeInsets,
               child: PrimaryAsyncButton(
-                text: "h_confirm".tr(),
+                text: 'h_confirm'.tr(),
                 enabled: _selectedAddress != null,
                 onTap: () async {
                   if (widget.fromWebview == true) {
@@ -163,22 +163,21 @@ class _SelectAccountPageState extends State<SelectAccountPage> with RouteAware {
     );
   }
 
-  Widget _buildAddressList() {
-    return BlocBuilder<AccountsBloc, AccountsState>(builder: (context, state) {
-      final accounts = state.accounts ?? [];
-      void select(Account value) {
-        setState(() {
-          _selectedAddress = value.accountNumber;
-        });
-      }
-
-      return ListAccountConnect(
-        accounts: accounts,
-        onSelectEth: !_isTezos ? select : null,
-        onSelectTez: _isTezos ? select : null,
-      );
-    });
-  }
+  Widget _buildAddressList() =>
+      BlocBuilder<AccountsBloc, AccountsState>(builder: (context, state) {
+        final accounts = state.accounts ?? [];
+        void select(Account value) {
+          setState(() {
+            _selectedAddress = value.accountNumber;
+          });
+        }
+
+        return ListAccountConnect(
+          accounts: accounts,
+          onSelectEth: !_isTezos ? select : null,
+          onSelectTez: _isTezos ? select : null,
+        );
+      });
 
   Future _claimToken(
     BuildContext context,
@@ -195,15 +194,15 @@ class _SelectAccountPageState extends State<SelectAccountPage> with RouteAware {
         otp: otp,
       );
       final metricClient = injector.get<MetricClientService>();
-      metricClient.addEvent(
+      unawaited(metricClient.addEvent(
         MixpanelEvent.acceptOwnershipSuccess,
         data: {
-          "id": widget.artwork?.id,
+          'id': widget.artwork?.id,
         },
-      );
+      ));
       memoryValues.branchDeeplinkData.value = null;
     } catch (e) {
-      log.info("[SelectAccountPage] Claim token failed. $e");
+      log.info('[SelectAccountPage] Claim token failed. $e');
       if (mounted) {
         await UIHelper.showClaimTokenError(
           context,
@@ -214,8 +213,10 @@ class _SelectAccountPageState extends State<SelectAccountPage> with RouteAware {
       memoryValues.branchDeeplinkData.value = null;
     }
 
-    if (!mounted) return;
-    Navigator.of(context).pushNamedAndRemoveUntil(
+    if (!mounted) {
+      return;
+    }
+    await Navigator.of(context).pushNamedAndRemoveUntil(
       AppRouter.homePage,
       (route) => false,
     );
@@ -224,11 +225,13 @@ class _SelectAccountPageState extends State<SelectAccountPage> with RouteAware {
     if (token == null) {
       return;
     }
-    Navigator.of(context).pushNamed(
-      AppRouter.artworkDetailsPage,
-      arguments: ArtworkDetailPayload(
-          [ArtworkIdentity(token.id, token.owner)], 0,
-          twitterCaption: caption ?? ""),
-    );
+    if (mounted) {
+      await Navigator.of(context).pushNamed(
+        AppRouter.artworkDetailsPage,
+        arguments: ArtworkDetailPayload(
+            [ArtworkIdentity(token.id, token.owner)], 0,
+            twitterCaption: caption ?? ''),
+      );
+    }
   }
 }
diff --git a/lib/screen/claim/token_detail_page.dart b/lib/screen/claim/token_detail_page.dart
index da6531131..0cbd6fa4b 100644
--- a/lib/screen/claim/token_detail_page.dart
+++ b/lib/screen/claim/token_detail_page.dart
@@ -5,7 +5,7 @@
 //  that can be found in the LICENSE file.
 //
 
-import 'package:autonomy_flutter/model/ff_account.dart';
+import 'package:autonomy_flutter/model/ff_series.dart';
 import 'package:autonomy_flutter/util/feralfile_extension.dart';
 import 'package:autonomy_flutter/util/style.dart';
 import 'package:autonomy_flutter/view/artwork_common_widget.dart';
@@ -21,9 +21,9 @@ class TokenDetailPage extends StatefulWidget {
   final FFSeries series;
 
   const TokenDetailPage({
-    Key? key,
     required this.series,
-  }) : super(key: key);
+    super.key,
+  });
 
   @override
   State<TokenDetailPage> createState() => _TokenDetailPageState();
@@ -45,7 +45,7 @@ class _TokenDetailPageState extends State<TokenDetailPage> {
           child: Column(
             crossAxisAlignment: CrossAxisAlignment.start,
             children: [
-              const SizedBox(height: 16.0),
+              const SizedBox(height: 16),
               Padding(
                 padding: ResponsiveLayout.getPadding,
                 child: Text(
@@ -53,22 +53,22 @@ class _TokenDetailPageState extends State<TokenDetailPage> {
                   style: theme.primaryTextTheme.displayLarge,
                 ),
               ),
-              const SizedBox(height: 8.0),
+              const SizedBox(height: 8),
               Padding(
                 padding: ResponsiveLayout.getPadding,
                 child: Text(
-                  "by".tr(args: [artist?.getDisplayName() ?? ""]).trim(),
+                  'by'.tr(args: [artist?.getDisplayName() ?? '']).trim(),
                   style: theme.primaryTextTheme.headlineMedium
                       ?.copyWith(fontSize: 18),
                 ),
               ),
-              const SizedBox(height: 15.0),
+              const SizedBox(height: 15),
               // Show artwork here.
               CachedNetworkImage(
                 imageUrl: series.getThumbnailURL(),
                 fit: BoxFit.fitWidth,
               ),
-              const SizedBox(height: 24.0),
+              const SizedBox(height: 24),
               Padding(
                 padding: ResponsiveLayout.getPadding,
                 child: HtmlWidget(
@@ -77,7 +77,7 @@ class _TokenDetailPageState extends State<TokenDetailPage> {
                   textStyle: theme.primaryTextTheme.bodyLarge,
                 ),
               ),
-              const SizedBox(height: 40.0),
+              const SizedBox(height: 40),
               Padding(
                 padding: ResponsiveLayout.getPadding,
                 child: Column(
@@ -89,7 +89,7 @@ class _TokenDetailPageState extends State<TokenDetailPage> {
                         series: widget.series,
                       ),
                     ),
-                    const SizedBox(height: 40.0),
+                    const SizedBox(height: 40),
                   ],
                 ),
               )
@@ -110,7 +110,7 @@ class _TokenDetailPageState extends State<TokenDetailPage> {
         statusBarBrightness: Brightness.light,
       ),
       leading: const SizedBox(),
-      leadingWidth: 0.0,
+      leadingWidth: 0,
       title: Row(
         mainAxisAlignment: MainAxisAlignment.spaceBetween,
         children: [
@@ -128,7 +128,7 @@ class _TokenDetailPageState extends State<TokenDetailPage> {
                   ),
                   const SizedBox(width: 7),
                   Text(
-                    "BACK",
+                    'BACK',
                     style: theme.primaryTextTheme.labelLarge,
                   ),
                 ],
diff --git a/lib/screen/collection_pro/collection_pro_bloc.dart b/lib/screen/collection_pro/collection_pro_bloc.dart
new file mode 100644
index 000000000..b883f1379
--- /dev/null
+++ b/lib/screen/collection_pro/collection_pro_bloc.dart
@@ -0,0 +1,130 @@
+import 'package:autonomy_flutter/common/injector.dart';
+import 'package:autonomy_flutter/screen/collection_pro/collection_pro_state.dart';
+import 'package:autonomy_flutter/service/configuration_service.dart';
+import 'package:autonomy_flutter/util/medium_category_ext.dart';
+import 'package:flutter_bloc/flutter_bloc.dart';
+import 'package:nft_collection/database/dao/asset_token_dao.dart';
+import 'package:nft_collection/database/dao/predefined_collection_dao.dart';
+import 'package:nft_collection/models/asset_token.dart';
+import 'package:nft_collection/models/predefined_collection_model.dart';
+import 'package:nft_collection/utils/medium_category.dart';
+
+class CollectionProBloc
+    extends Bloc<CollectionProEvent, CollectionLoadedState> {
+  final _predefinedCollectionDao = injector.get<PredefinedCollectionDao>();
+  final _configurationService = injector.get<ConfigurationService>();
+  final _assetTokenDao = injector.get<AssetTokenDao>();
+
+  CollectionProBloc() : super(CollectionLoadedState()) {
+    on<LoadCollectionEvent>((event, emit) async {
+      final hiddenTokenIDs = _configurationService.getHiddenOrSentTokenIDs();
+      final hiddenTokens =
+          await _assetTokenDao.findAllAssetTokensByTokenIDs(hiddenTokenIDs);
+
+      if (event.filterStr.isEmpty) {
+        List<PredefinedCollectionModel> listPredefinedCollectionModelByMedium =
+            await _getAllPredefinedCollectionByMedium(
+                filterStr: event.filterStr);
+        for (final predefinedCollection
+            in listPredefinedCollectionModelByMedium) {
+          final ignoreTokens = hiddenTokens.where((element) {
+            if (predefinedCollection.id == MediumCategory.other) {
+              return !MediumCategoryExt.getAllMimeType()
+                  .contains(element.mimeType);
+            }
+            return MediumCategory.mineTypes(predefinedCollection.id)
+                .contains(element.mimeType);
+          }).toList();
+          predefinedCollection.total =
+              predefinedCollection.total - ignoreTokens.length;
+        }
+        listPredefinedCollectionModelByMedium
+            .removeWhere((element) => element.total <= 0);
+        emit(state.copyWith(
+          listPredefinedCollectionByMedium:
+              listPredefinedCollectionModelByMedium,
+        ));
+      } else {
+        List<CompactedAssetToken> works =
+            await _getAllTokenFilterByTitleOrArtist(filterStr: event.filterStr);
+        emit(
+          state.copyWith(
+            works: works,
+          ),
+        );
+      }
+      final listPredefinedCollectionModelByArtist =
+          await _predefinedCollectionDao.getPredefinedCollectionsByArtist();
+
+      for (final predefinedCollection
+          in listPredefinedCollectionModelByArtist) {
+        final ignoreTokens = hiddenTokens
+            .where((element) => element.artistID == predefinedCollection.id)
+            .toList();
+        predefinedCollection.total =
+            predefinedCollection.total - ignoreTokens.length;
+      }
+      listPredefinedCollectionModelByArtist
+          .removeWhere((element) => element.total <= 0);
+
+      emit(
+        state.copyWith(
+          listPredefinedCollectionByArtist:
+              listPredefinedCollectionModelByArtist,
+        ),
+      );
+    });
+  }
+
+  Future<List<PredefinedCollectionModel>> _getAllPredefinedCollectionByMedium(
+      {String filterStr = ''}) async {
+    final List<PredefinedCollectionModel> listPredefinedCollectionByMedium = [];
+    final listMedium = MediumCategoryExt.getAllCategories();
+    for (final mediumCatalog in listMedium) {
+      final predefinedCollections =
+          await _predefinedCollectionDao.getPredefinedCollectionsByMedium(
+        title: filterStr,
+        mimeTypes: MediumCategory.mineTypes(mediumCatalog),
+        mediums: MediumCategoryExt.mediums(mediumCatalog),
+      );
+      if (predefinedCollections.isNotEmpty &&
+          predefinedCollections.first.total > 0) {
+        final predefinedCollection = predefinedCollections.first
+          ..name = MediumCategoryExt.getName(mediumCatalog)
+          ..id = mediumCatalog;
+        listPredefinedCollectionByMedium.add(predefinedCollection);
+      }
+    }
+    final predefinedCollections =
+        await _predefinedCollectionDao.getPredefinedCollectionsByMedium(
+            title: filterStr,
+            mimeTypes: MediumCategoryExt.getAllMimeType(),
+            mediums: MediumCategoryExt.getAllMediums(),
+            isInMimeTypes: false);
+
+    if (predefinedCollections.isNotEmpty &&
+        predefinedCollections.first.total > 0) {
+      final predefinedCollection = predefinedCollections.first
+        ..name = MediumCategoryExt.getName(MediumCategory.other)
+        ..id = MediumCategory.other;
+      listPredefinedCollectionByMedium.add(predefinedCollection);
+    }
+    return listPredefinedCollectionByMedium;
+  }
+
+  Future<List<CompactedAssetToken>> _getAllTokenFilterByTitleOrArtist(
+      {String filterStr = ''}) async {
+    List<CompactedAssetToken> works = [];
+    final hiddenTokenIDs = _configurationService.getHiddenOrSentTokenIDs();
+    if (filterStr.isNotEmpty) {
+      final assetTokens =
+          await _assetTokenDao.findAllAssetTokensByFilter(filter: filterStr);
+      assetTokens.removeWhere((element) =>
+          hiddenTokenIDs.contains(element.id) || (element.balance ?? 0) <= 0);
+      works = assetTokens
+          .map((e) => CompactedAssetToken.fromAssetToken(e))
+          .toList();
+    }
+    return works;
+  }
+}
diff --git a/lib/screen/collection_pro/collection_pro_screen.dart b/lib/screen/collection_pro/collection_pro_screen.dart
new file mode 100644
index 000000000..c81d91925
--- /dev/null
+++ b/lib/screen/collection_pro/collection_pro_screen.dart
@@ -0,0 +1,704 @@
+import 'dart:async';
+import 'dart:convert';
+
+import 'package:autonomy_flutter/common/injector.dart';
+import 'package:autonomy_flutter/main.dart';
+import 'package:autonomy_flutter/model/play_list_model.dart';
+import 'package:autonomy_flutter/model/shared_postcard.dart';
+import 'package:autonomy_flutter/screen/app_router.dart';
+import 'package:autonomy_flutter/screen/bloc/identity/identity_bloc.dart';
+import 'package:autonomy_flutter/screen/collection_pro/collection_pro_bloc.dart';
+import 'package:autonomy_flutter/screen/collection_pro/collection_pro_state.dart';
+import 'package:autonomy_flutter/screen/detail/artwork_detail_page.dart';
+import 'package:autonomy_flutter/screen/playlists/list_playlists/list_playlists.dart';
+import 'package:autonomy_flutter/screen/playlists/view_playlist/view_playlist.dart';
+import 'package:autonomy_flutter/screen/predefined_collection/predefined_collection_screen.dart';
+import 'package:autonomy_flutter/service/configuration_service.dart';
+import 'package:autonomy_flutter/service/playlist_service.dart';
+import 'package:autonomy_flutter/service/versions_service.dart';
+import 'package:autonomy_flutter/util/collection_ext.dart';
+import 'package:autonomy_flutter/util/medium_category_ext.dart';
+import 'package:autonomy_flutter/util/predefined_collection_ext.dart';
+import 'package:autonomy_flutter/util/string_ext.dart';
+import 'package:autonomy_flutter/util/style.dart';
+import 'package:autonomy_flutter/view/artwork_common_widget.dart';
+import 'package:autonomy_flutter/view/galery_thumbnail_item.dart';
+import 'package:autonomy_flutter/view/header.dart';
+import 'package:autonomy_flutter/view/search_bar.dart';
+import 'package:autonomy_theme/autonomy_theme.dart';
+import 'package:collection/collection.dart';
+import 'package:crypto/crypto.dart';
+import 'package:easy_localization/easy_localization.dart';
+import 'package:flutter/material.dart';
+import 'package:flutter_bloc/flutter_bloc.dart';
+import 'package:flutter_svg/flutter_svg.dart';
+import 'package:nft_collection/models/asset_token.dart';
+import 'package:nft_collection/models/predefined_collection_model.dart';
+
+class CollectionPro extends StatefulWidget {
+  final List<CompactedAssetToken> tokens;
+  final ScrollController scrollController;
+
+  const CollectionPro(
+      {required this.tokens, required this.scrollController, super.key});
+
+  @override
+  State<CollectionPro> createState() => CollectionProState();
+}
+
+class CollectionProState extends State<CollectionPro>
+    with RouteAware, WidgetsBindingObserver {
+  final _bloc = injector.get<CollectionProBloc>();
+  final _identityBloc = injector.get<IdentityBloc>();
+  late ScrollController _scrollController;
+  late ValueNotifier<String> searchStr;
+  late bool isShowSearchBar;
+  final GlobalKey<CollectionSectionState> _collectionSectionKey = GlobalKey();
+  List<PredefinedCollectionModel> _listPredefinedCollectionByArtist = [];
+  List<PredefinedCollectionModel> _listPredefinedCollectionByMedium = [];
+  List<CompactedAssetToken> _works = [];
+  late bool _isLoaded;
+
+  @override
+  void initState() {
+    WidgetsBinding.instance.addObserver(this);
+    _isLoaded = false;
+    searchStr = ValueNotifier('');
+    searchStr.addListener(() {
+      loadCollection();
+    });
+    isShowSearchBar = false;
+    _scrollController = widget.scrollController;
+    loadCollection();
+    super.initState();
+  }
+
+  @override
+  void didChangeDependencies() {
+    super.didChangeDependencies();
+    routeObserver.subscribe(this, ModalRoute.of(context)!);
+  }
+
+  @override
+  void dispose() {
+    super.dispose();
+  }
+
+  @override
+  void didPopNext() {
+    loadCollection();
+    super.didPopNext();
+  }
+
+  void loadCollection() {
+    unawaited(refreshCollectionSection());
+    _bloc.add(LoadCollectionEvent(filterStr: searchStr.value));
+  }
+
+  void fetchIdentities(CollectionLoadedState state) {
+    final listPredefinedCollectionByArtist =
+        state.listPredefinedCollectionByArtist;
+    final neededIdentities = [
+      ...?listPredefinedCollectionByArtist?.map((e) => e.id),
+    ].whereNotNull().toList().unique()
+      ..removeWhere((element) => element == '');
+
+    if (neededIdentities.isNotEmpty) {
+      _identityBloc.add(GetIdentityEvent(neededIdentities));
+    }
+  }
+
+  Future<void> refreshCollectionSection() async {
+    final collectionSectionState = _collectionSectionKey.currentState;
+    if (collectionSectionState != null) {
+      await collectionSectionState.refreshPlaylist();
+    }
+  }
+
+  @override
+  Widget build(BuildContext context) {
+    final paddingTop = MediaQuery.of(context).padding.top;
+    return SafeArea(
+      top: false,
+      child: BlocConsumer(
+        bloc: _bloc,
+        listener: (context, state) {
+          if (state is CollectionLoadedState) {
+            fetchIdentities(state);
+            setState(() {
+              _listPredefinedCollectionByMedium =
+                  state.listPredefinedCollectionByMedium ?? [];
+              _works = state.works;
+              _isLoaded = true;
+            });
+          }
+        },
+        builder: (context, collectionProState) {
+          if (collectionProState is CollectionLoadedState) {
+            return BlocConsumer<IdentityBloc, IdentityState>(
+                listener: (context, identityState) {
+                  final identityMap = identityState.identityMap
+                    ..removeWhere((key, value) => value.isEmpty);
+                  final listPredefinedCollectionByArtist = (collectionProState
+                              .listPredefinedCollectionByArtist ??
+                          [])
+                      .map(
+                        (e) {
+                          String name = identityMap[e.id] ?? e.name ?? e.id;
+                          if (name == e.id) {
+                            name = name.maskOnly(5);
+                          }
+                          e.name = name;
+                          return e;
+                        },
+                      )
+                      .toList()
+                      .filterByName(searchStr.value)
+                    ..sort((a, b) =>
+                        a.name!.toLowerCase().compareTo(b.name!.toLowerCase()));
+                  setState(() {
+                    _listPredefinedCollectionByArtist =
+                        listPredefinedCollectionByArtist;
+                  });
+                },
+                builder: (context, identityState) {
+                  final isEmptyView = _isLoaded &&
+                      searchStr.value.isNotEmpty &&
+                      _isEmptyCollection();
+                  return CustomScrollView(
+                    controller: _scrollController,
+                    shrinkWrap: true,
+                    slivers: [
+                      SliverToBoxAdapter(
+                        child: SizedBox(height: paddingTop),
+                      ),
+                      SliverToBoxAdapter(
+                        child: _pageHeader(context),
+                      ),
+                      SliverToBoxAdapter(
+                        child: ValueListenableBuilder(
+                          valueListenable: searchStr,
+                          builder: (BuildContext context, String value,
+                                  Widget? child) =>
+                              CollectionSection(
+                            key: _collectionSectionKey,
+                            filterString: value,
+                          ),
+                        ),
+                      ),
+                      if (isEmptyView) ...[
+                        SliverToBoxAdapter(
+                          child: Visibility(
+                            visible: isEmptyView,
+                            child: Padding(
+                              padding:
+                                  const EdgeInsets.symmetric(horizontal: 15),
+                              child: _emptyView(context),
+                            ),
+                          ),
+                        ),
+                      ] else ...[
+                        const SliverToBoxAdapter(
+                          child: SizedBox(height: 60),
+                        ),
+                        if (searchStr.value.isEmpty) ...[
+                          SliverList(
+                            delegate: SliverChildBuilderDelegate(
+                              _predefinedCollectionByMediumBuilder,
+                              childCount:
+                                  _listPredefinedCollectionByMedium.length + 1,
+                            ),
+                          ),
+                          const SliverToBoxAdapter(
+                            child: SizedBox(height: 60),
+                          ),
+                        ],
+                        if (searchStr.value.isNotEmpty) ...[
+                          SliverList(
+                            delegate: SliverChildBuilderDelegate(
+                              _worksBuilder,
+                              childCount: _works.length + 1,
+                            ),
+                          ),
+                          const SliverToBoxAdapter(
+                            child: SizedBox(height: 60),
+                          ),
+                        ],
+                        SliverList(
+                          delegate: SliverChildBuilderDelegate(
+                            _predefinedCollectionByArtistBuilder,
+                            childCount:
+                                _listPredefinedCollectionByArtist.length + 1,
+                          ),
+                        ),
+                        const SliverToBoxAdapter(
+                          child: SizedBox(height: 100),
+                        ),
+                      ],
+                    ],
+                  );
+                },
+                bloc: _identityBloc);
+          }
+          return const Center(child: CircularProgressIndicator());
+        },
+      ),
+    );
+  }
+
+  bool _isEmptyCollection() {
+    final collection =
+        _collectionSectionKey.currentState?.filterPlaylist(searchStr.value) ??
+            [];
+    final isEmpty = _listPredefinedCollectionByArtist.isEmpty &&
+            _listPredefinedCollectionByMedium.isEmpty ||
+        (_works.isEmpty &&
+            searchStr.value.isNotEmpty &&
+            _listPredefinedCollectionByArtist.isEmpty &&
+            collection.isEmpty);
+    return isEmpty;
+  }
+
+  Widget _emptyView(BuildContext context) {
+    final theme = Theme.of(context);
+    return Text(
+      'no_results'.tr(),
+      style: theme.textTheme.ppMori400White14,
+    );
+  }
+
+  Widget _predefinedCollectionByArtistBuilder(BuildContext context, int index) {
+    const type = PredefinedCollectionType.artist;
+    return _predefinedCollectionBuilder(context, index, type);
+  }
+
+  Widget _predefinedCollectionByMediumBuilder(BuildContext context, int index) {
+    const type = PredefinedCollectionType.medium;
+    return _predefinedCollectionBuilder(context, index, type);
+  }
+
+  Widget _worksBuilder(BuildContext context, int index) {
+    const padding = EdgeInsets.symmetric(horizontal: 15);
+    final sep = addDivider(color: AppColor.auLightGrey);
+    if (index == 0) {
+      return Padding(
+        padding: padding,
+        child: Column(
+          children: [
+            HeaderView(title: 'works'.tr(), padding: EdgeInsets.zero),
+            const SizedBox(
+              height: 30,
+            ),
+          ],
+        ),
+      );
+    } else {
+      return Padding(
+        padding: const EdgeInsets.symmetric(horizontal: 15),
+        child: Column(
+          children: [
+            Padding(
+              padding: const EdgeInsets.symmetric(vertical: 15),
+              child: SizedBox(
+                height: 164,
+                child: _artworkItem(context, _works[index - 1]),
+              ),
+            ),
+            sep,
+          ],
+        ),
+      );
+    }
+  }
+
+  PredefinedCollectionModel _getPredefinedCollection(
+      int index, PredefinedCollectionType type) {
+    switch (type) {
+      case PredefinedCollectionType.medium:
+        return _listPredefinedCollectionByMedium[index];
+      case PredefinedCollectionType.artist:
+        return _listPredefinedCollectionByArtist[index];
+    }
+  }
+
+  Widget _predefinedCollectionBuilder(
+    BuildContext context,
+    int index,
+    PredefinedCollectionType type,
+  ) {
+    final sep = addOnlyDivider(color: AppColor.auGreyBackground);
+    const padding = EdgeInsets.symmetric(horizontal: 15);
+    if (index == 0) {
+      return Padding(
+        padding: padding,
+        child: Column(
+          children: [
+            _predefinedCollectionHeader(
+              context,
+              type,
+            ),
+            const SizedBox(
+              height: 30,
+            ),
+          ],
+        ),
+      );
+    } else {
+      final predefinedCollection = _getPredefinedCollection(index - 1, type);
+      return Padding(
+        padding: const EdgeInsets.symmetric(horizontal: 15),
+        child: Column(
+          children: [
+            Padding(
+              padding: const EdgeInsets.symmetric(vertical: 15),
+              child: _predefinedCollectionitem(
+                  context, predefinedCollection, type, searchStr.value),
+            ),
+            sep,
+          ],
+        ),
+      );
+    }
+  }
+
+  Widget _predefinedCollectionitem(
+      BuildContext context,
+      PredefinedCollectionModel predefinedCollection,
+      PredefinedCollectionType type,
+      String searchStr) {
+    final theme = Theme.of(context);
+    var title = predefinedCollection.name ?? predefinedCollection.id;
+    if (predefinedCollection.name == predefinedCollection.id) {
+      title = title.maskOnly(5);
+    }
+    final titleStyle = theme.textTheme.ppMori400White14;
+    return GestureDetector(
+      onTap: () async {
+        await Navigator.pushNamed(
+          context,
+          AppRouter.predefinedCollectionPage,
+          arguments: PredefinedCollectionScreenPayload(
+            type: type,
+            predefinedCollection: predefinedCollection,
+            filterStr: searchStr,
+          ),
+        );
+      },
+      child: Container(
+        color: Colors.transparent,
+        child: Row(
+          children: [
+            _predefinedCollectionIcon(
+              predefinedCollection,
+              type,
+            ),
+            const SizedBox(width: 33),
+            Expanded(
+              child: Text(
+                title,
+                style: titleStyle,
+                overflow: TextOverflow.ellipsis,
+              ),
+            ),
+            Text('${predefinedCollection.total}',
+                style: theme.textTheme.ppMori400Grey14),
+          ],
+        ),
+      ),
+    );
+  }
+
+  Widget _predefinedCollectionIcon(
+      PredefinedCollectionModel predefinedCollection,
+      PredefinedCollectionType type) {
+    switch (type) {
+      case PredefinedCollectionType.medium:
+        return Container(
+          padding: const EdgeInsets.symmetric(horizontal: 10),
+          width: 44,
+          height: 44,
+          decoration: BoxDecoration(
+            borderRadius: BorderRadius.circular(8),
+            color: AppColor.auLightGrey,
+          ),
+          child: SvgPicture.asset(
+            MediumCategoryExt.icon(predefinedCollection.id),
+            width: 22,
+            colorFilter:
+                const ColorFilter.mode(AppColor.primaryBlack, BlendMode.srcIn),
+          ),
+        );
+      case PredefinedCollectionType.artist:
+        final compactedAssetTokens = predefinedCollection.compactedAssetToken;
+        return SizedBox(
+          width: 42,
+          height: 42,
+          child: tokenGalleryThumbnailWidget(context, compactedAssetTokens, 100,
+              usingThumbnailID: false,
+              galleryThumbnailPlaceholder: Container(
+                width: 42,
+                height: 42,
+                color: AppColor.auLightGrey,
+              )),
+        );
+    }
+  }
+
+  Widget _predefinedCollectionHeader(
+      BuildContext context, PredefinedCollectionType type) {
+    final title = type == PredefinedCollectionType.medium
+        ? 'medium'.tr()
+        : 'artists'.tr();
+    return HeaderView(
+      title: title,
+      padding: EdgeInsets.zero,
+    );
+  }
+
+  Widget _pageHeader(BuildContext context) {
+    final paddingTop = MediaQuery.of(context).viewPadding.top;
+    return Padding(
+      padding: EdgeInsets.only(top: paddingTop)
+          .add(const EdgeInsets.fromLTRB(12, 33, 12, 42)),
+      child: !isShowSearchBar
+          ? HeaderView(
+              padding: EdgeInsets.zero,
+              title: 'organize'.tr(),
+              action: GestureDetector(
+                child: SvgPicture.asset(
+                  'assets/images/search.svg',
+                  width: 24,
+                  height: 24,
+                  colorFilter:
+                      const ColorFilter.mode(AppColor.white, BlendMode.srcIn),
+                ),
+                onTap: () {
+                  setState(() {
+                    isShowSearchBar = true;
+                  });
+                },
+              ),
+            )
+          : Align(
+              alignment: Alignment.bottomLeft,
+              child: ActionBar(
+                searchBar: AuSearchBar(
+                  onChanged: (text) {},
+                  onSearch: (text) {
+                    setState(() {
+                      searchStr.value = text;
+                    });
+                  },
+                  onClear: (text) {
+                    setState(() {
+                      searchStr.value = text;
+                    });
+                  },
+                ),
+                onCancel: () {
+                  setState(() {
+                    searchStr.value = '';
+                    isShowSearchBar = false;
+                  });
+                },
+              ),
+            ),
+    );
+  }
+
+  Widget _artworkItem(BuildContext context, CompactedAssetToken token) {
+    final theme = Theme.of(context);
+    final title = token.title ?? '';
+    final artistName = token.artistTitle ?? token.artistID ?? '';
+    return GestureDetector(
+      onTap: () async {
+        await Navigator.pushNamed(
+          context,
+          AppRouter.artworkDetailsPage,
+          arguments: ArtworkDetailPayload(
+            [
+              ArtworkIdentity(token.id, token.owner),
+            ],
+            0,
+          ),
+        );
+      },
+      child: Row(
+        children: [
+          AspectRatio(
+            aspectRatio: 1,
+            child: GaleryThumbnailItem(
+              assetToken: token,
+              onTap: () async {
+                await Navigator.pushNamed(
+                  context,
+                  AppRouter.artworkDetailsPage,
+                  arguments: ArtworkDetailPayload(
+                    [
+                      ArtworkIdentity(token.id, token.owner),
+                    ],
+                    0,
+                  ),
+                );
+              },
+            ),
+          ),
+          const SizedBox(width: 19),
+          Expanded(
+            child: Column(
+              crossAxisAlignment: CrossAxisAlignment.start,
+              children: [
+                Text(
+                  title,
+                  style: theme.textTheme.ppMori400White14,
+                  maxLines: 3,
+                  overflow: TextOverflow.ellipsis,
+                ),
+                Text(
+                  artistName,
+                  style: theme.textTheme.ppMori400Black14
+                      .copyWith(color: AppColor.auLightGrey),
+                  maxLines: 3,
+                  overflow: TextOverflow.ellipsis,
+                ),
+              ],
+            ),
+          )
+        ],
+      ),
+    );
+  }
+}
+
+class CollectionSection extends StatefulWidget {
+  final String filterString;
+
+  const CollectionSection({super.key, this.filterString = ''});
+
+  @override
+  State<CollectionSection> createState() => CollectionSectionState();
+}
+
+class CollectionSectionState extends State<CollectionSection>
+    with RouteAware, WidgetsBindingObserver {
+  final _configurationService = injector.get<ConfigurationService>();
+  final _playlistService = injector.get<PlaylistService>();
+  final _versionService = injector.get<VersionService>();
+  late ValueNotifier<List<PlayListModel>?> _playlists;
+  List<PlayListModel>? _currentPlaylists;
+  late bool isDemo;
+
+  Future<List<PlayListModel>?> getPlaylist({bool withDefault = false}) async {
+    if (isDemo) {
+      return _versionService.getDemoAccountFromGithub();
+    }
+    List<PlayListModel> playlists = await _playlistService.getPlayList();
+    if (withDefault) {
+      final defaultPlaylists = await _playlistService.defaultPlaylists();
+      playlists = defaultPlaylists..addAll(playlists);
+    }
+    return playlists;
+  }
+
+  Future<void> _initPlayList() async {
+    _playlists.value = await getPlaylist() ?? [];
+  }
+
+  List<PlayListModel> getPlaylists() => _currentPlaylists ?? [];
+
+  List<PlayListModel> filterPlaylist(String filterString) =>
+      _playlists.value?.filter(filterString) ?? [];
+
+  @override
+  void initState() {
+    _playlists = ValueNotifier(null);
+    _playlists.addListener(() {
+      setState(() {
+        _currentPlaylists = filterPlaylist(widget.filterString);
+      });
+    });
+    isDemo = _configurationService.isDemoArtworksMode();
+    super.initState();
+    unawaited(_initPlayList());
+    WidgetsBinding.instance.addObserver(this);
+  }
+
+  @override
+  void didChangeDependencies() {
+    super.didChangeDependencies();
+    routeObserver.subscribe(this, ModalRoute.of(context)!);
+  }
+
+  @override
+  void dispose() {
+    WidgetsBinding.instance.removeObserver(this);
+    super.dispose();
+  }
+
+  @override
+  void didPopNext() {
+    unawaited(_initPlayList());
+    super.didPopNext();
+  }
+
+  Future<void> _gotoCreatePlaylist(BuildContext context) async {
+    await Navigator.of(context)
+        .pushNamed(AppRouter.createPlayListPage)
+        .then((value) {
+      if (value != null && value is PlayListModel) {
+        Navigator.pushNamed(
+          context,
+          AppRouter.viewPlayListPage,
+          arguments: ViewPlaylistScreenPayload(playListModel: value),
+        );
+      }
+    });
+  }
+
+  Future<void> refreshPlaylist() async {
+    await _initPlayList();
+  }
+
+  @override
+  Widget build(BuildContext context) {
+    if (_currentPlaylists == null) {
+      return const SizedBox.shrink();
+    }
+    final playlists = _currentPlaylists!;
+    final playlistIDsString = playlists.map((e) => e.id).toList().join();
+    final playlistKeyBytes = utf8.encode(playlistIDsString);
+    final playlistKey = sha256.convert(playlistKeyBytes).toString();
+    return Column(
+      crossAxisAlignment: CrossAxisAlignment.start,
+      children: [
+        ListPlaylistsScreen(
+          key: Key(playlistKey),
+          playlists: _playlists,
+          filter: widget.filterString,
+          onReorder: (oldIndex, newIndex) {},
+          onAdd: () async {
+            await _gotoCreatePlaylist(context);
+          },
+        )
+      ],
+    );
+  }
+}
+
+class SectionInfo {
+  Map<CollectionProSection, bool> state;
+
+  SectionInfo({required this.state});
+}
+
+enum CollectionProSection {
+  collection,
+  medium,
+  artist;
+
+  static List<CollectionProSection> get allSections => [
+        CollectionProSection.collection,
+        CollectionProSection.medium,
+        CollectionProSection.artist,
+      ];
+}
diff --git a/lib/screen/collection_pro/collection_pro_state.dart b/lib/screen/collection_pro/collection_pro_state.dart
new file mode 100644
index 000000000..e3dce7e41
--- /dev/null
+++ b/lib/screen/collection_pro/collection_pro_state.dart
@@ -0,0 +1,38 @@
+// ignore_for_file: public_member_api_docs, sort_constructors_first
+import 'package:nft_collection/models/asset_token.dart';
+import 'package:nft_collection/models/predefined_collection_model.dart';
+
+abstract class CollectionProEvent {}
+
+class CollectionLoadedState {
+  final List<PredefinedCollectionModel>? listPredefinedCollectionByMedium;
+  final List<PredefinedCollectionModel>? listPredefinedCollectionByArtist;
+  final List<CompactedAssetToken> works;
+
+  CollectionLoadedState({
+    this.listPredefinedCollectionByMedium,
+    this.listPredefinedCollectionByArtist,
+    this.works = const [],
+  });
+
+  CollectionLoadedState copyWith({
+    List<PredefinedCollectionModel>? listPredefinedCollectionByMedium,
+    List<PredefinedCollectionModel>? listPredefinedCollectionByArtist,
+    List<CompactedAssetToken>? works,
+  }) {
+    final newState = CollectionLoadedState(
+      listPredefinedCollectionByMedium: listPredefinedCollectionByMedium ??
+          this.listPredefinedCollectionByMedium,
+      listPredefinedCollectionByArtist: listPredefinedCollectionByArtist ??
+          this.listPredefinedCollectionByArtist,
+      works: works ?? this.works,
+    );
+    return newState;
+  }
+}
+
+class LoadCollectionEvent extends CollectionProEvent {
+  String filterStr;
+
+  LoadCollectionEvent({this.filterStr = ''});
+}
diff --git a/lib/screen/customer_support/support_thread_page.dart b/lib/screen/customer_support/support_thread_page.dart
index 41a55372a..ca8041b28 100644
--- a/lib/screen/customer_support/support_thread_page.dart
+++ b/lib/screen/customer_support/support_thread_page.dart
@@ -7,6 +7,7 @@
 
 // ignore_for_file: unused_field
 
+import 'dart:async';
 import 'dart:convert';
 
 import 'package:after_layout/after_layout.dart';
@@ -26,6 +27,7 @@ import 'package:autonomy_flutter/service/feralfile_service.dart';
 import 'package:autonomy_flutter/service/metric_client_service.dart';
 import 'package:autonomy_flutter/util/announcement_ext.dart';
 import 'package:autonomy_flutter/util/constants.dart';
+import 'package:autonomy_flutter/util/datetime_ext.dart';
 import 'package:autonomy_flutter/util/log.dart' as log_util;
 import 'package:autonomy_flutter/util/log.dart';
 import 'package:autonomy_flutter/util/string_ext.dart';
@@ -47,8 +49,6 @@ import 'package:image_picker/image_picker.dart';
 import 'package:nft_collection/models/asset_token.dart';
 import 'package:uuid/uuid.dart';
 
-import '../../util/datetime_ext.dart';
-
 abstract class SupportThreadPayload {
   AnnouncementLocal? get announcement;
 }
@@ -75,7 +75,7 @@ class DetailIssuePayload extends SupportThreadPayload {
   DetailIssuePayload(
       {required this.reportIssueType,
       required this.issueID,
-      this.status = "",
+      this.status = '',
       this.isRated = false,
       this.announcement});
 }
@@ -97,9 +97,9 @@ class SupportThreadPage extends StatefulWidget {
   final SupportThreadPayload payload;
 
   const SupportThreadPage({
-    Key? key,
     required this.payload,
-  }) : super(key: key);
+    super.key,
+  });
 
   @override
   State<SupportThreadPage> createState() => _SupportThreadPageState();
@@ -122,7 +122,7 @@ class _SupportThreadPageState extends State<SupportThreadPage>
   Pair<String, List<int>>? _debugLog;
 
   late Object _forceAccountsViewRedraw;
-  var _sendIcon = "assets/images/sendMessage.svg";
+  var _sendIcon = 'assets/images/sendMessage.svg';
   final _introMessengerID = const Uuid().v4();
   final _resolvedMessengerID = const Uuid().v4();
   final _askRatingMessengerID = const Uuid().v4();
@@ -142,33 +142,33 @@ class _SupportThreadPageState extends State<SupportThreadPage>
   types.CustomMessage get _resolvedMessenger => types.CustomMessage(
         id: _resolvedMessengerID,
         author: _bitmark,
-        metadata: const {"status": "resolved"},
+        metadata: const {'status': 'resolved'},
       );
 
   types.CustomMessage get _askRatingMessenger => types.CustomMessage(
         author: _bitmark,
         id: _askRatingMessengerID,
-        metadata: {"status": "rateIssue", "content": "rate_issue".tr()},
+        metadata: {'status': 'rateIssue', 'content': 'rate_issue'.tr()},
         createdAt: DateTime.now().millisecondsSinceEpoch,
       );
 
   types.CustomMessage get _askReviewMessenger => types.CustomMessage(
         author: _bitmark,
         id: _askReviewMessengerID,
-        metadata: {"status": "careToShare", "content": "care_to_share".tr()},
+        metadata: {'status': 'careToShare', 'content': 'care_to_share'.tr()},
         createdAt: DateTime.now().millisecondsSinceEpoch,
       );
 
   types.CustomMessage get _announcementMessenger => types.CustomMessage(
         id: _announcementMessengerID,
         author: _bitmark,
-        metadata: const {"status": "announcement"},
+        metadata: const {'status': 'announcement'},
       );
 
   @override
   void initState() {
-    _fetchCustomerSupportAvailability();
-    injector<CustomerSupportService>().processMessages();
+    unawaited(_fetchCustomerSupportAvailability());
+    unawaited(injector<CustomerSupportService>().processMessages());
     injector<CustomerSupportService>()
         .triggerReloadMessages
         .addListener(_loadIssueDetails);
@@ -183,7 +183,7 @@ class _SupportThreadPageState extends State<SupportThreadPage>
         Future.delayed(const Duration(milliseconds: 300), () {
           _askForAttachCrashLog(context, onConfirm: (attachCrashLog) {
             if (attachCrashLog) {
-              _addDebugLog();
+              unawaited(_addDebugLog());
             } else {
               UIHelper.hideInfoDialog(context);
             }
@@ -201,7 +201,7 @@ class _SupportThreadPageState extends State<SupportThreadPage>
       Future.delayed(const Duration(milliseconds: 300), () {
         _askForAttachCrashLog(context, onConfirm: (attachCrashLog) {
           if (attachCrashLog) {
-            _addDebugLog();
+            unawaited(_addDebugLog());
           } else {
             UIHelper.hideInfoDialog(context);
           }
@@ -213,10 +213,10 @@ class _SupportThreadPageState extends State<SupportThreadPage>
     _forceAccountsViewRedraw = Object();
     super.initState();
 
-    _loadDrafts();
+    unawaited(_loadDrafts());
 
-    if (_issueID != null && !_issueID!.startsWith("TEMP")) {
-      _loadIssueDetails();
+    if (_issueID != null && !_issueID!.startsWith('TEMP')) {
+      unawaited(_loadIssueDetails());
     }
   }
 
@@ -224,13 +224,13 @@ class _SupportThreadPageState extends State<SupportThreadPage>
   void afterFirstLayout(BuildContext context) {
     final payload = widget.payload;
     if (payload.announcement != null && payload.announcement!.unread) {
-      _customerSupportService
-          .markAnnouncementAsRead(payload.announcement!.announcementContextId);
+      unawaited(_customerSupportService
+          .markAnnouncementAsRead(payload.announcement!.announcementContextId));
       _callMixpanelReadAnnouncementEvent(payload.announcement!);
     }
   }
 
-  _fetchCustomerSupportAvailability() async {
+  Future<void> _fetchCustomerSupportAvailability() async {
     final device = DeviceInfo.instance;
     final isAvailable = await device.isSupportOS();
     setState(() {
@@ -250,7 +250,7 @@ class _SupportThreadPageState extends State<SupportThreadPage>
       combinedBytes = combinedBytes.sublist(combinedBytes.length - fileMaxSize);
     }
     final filename =
-        "${combinedBytes.length}_${DateTime.now().microsecondsSinceEpoch}.logs";
+        '${combinedBytes.length}_${DateTime.now().microsecondsSinceEpoch}.logs';
     _debugLog = Pair(filename, combinedBytes);
     setState(() {
       _isFileAttached = true;
@@ -259,14 +259,14 @@ class _SupportThreadPageState extends State<SupportThreadPage>
 
   void _callMixpanelReadAnnouncementEvent(AnnouncementLocal announcement) {
     final metricClient = injector.get<MetricClientService>();
-    metricClient.addEvent(
+    unawaited(metricClient.addEvent(
       MixpanelEvent.readAnnouncement,
       data: {
-        "id": announcement.announcementContextId,
-        "type": announcement.type,
-        "title": announcement.title,
+        'id': announcement.announcementContextId,
+        'type': announcement.type,
+        'title': announcement.title,
       },
-    );
+    ));
   }
 
   @override
@@ -283,37 +283,36 @@ class _SupportThreadPageState extends State<SupportThreadPage>
   void _askForAttachCrashLog(BuildContext context,
       {required void Function(bool attachCrashLog) onConfirm}) {
     final theme = Theme.of(context);
-    UIHelper.showDialog(
+    unawaited(UIHelper.showDialog(
       context,
-      "attach_crash_log".tr(),
+      'attach_crash_log'.tr(),
       Column(
         crossAxisAlignment: CrossAxisAlignment.start,
         children: [
           Text(
-            "ask_attach_crash".tr(),
-            //"Would you like to attach a crash log with your support request? The crash log is anonymous and will help our engineers identify the issue.",
+            'ask_attach_crash'.tr(),
             style: theme.primaryTextTheme.ppMori400White14,
           ),
           const SizedBox(height: 40),
           PrimaryButton(
-            text: "attach_crash_logH".tr(),
+            text: 'attach_crash_logH'.tr(),
             onTap: () => onConfirm(true),
           ),
           const SizedBox(height: 10),
           OutlineButton(
-            text: "conti_no_crash_log".tr(),
+            text: 'conti_no_crash_log'.tr(),
             onTap: () => onConfirm(false),
           ),
           const SizedBox(height: 40),
         ],
       ),
       isDismissible: true,
-    );
+    ));
   }
 
   @override
   Widget build(BuildContext context) {
-    List<types.Message> messages = (_draftMessages + _messages);
+    List<types.Message> messages = _draftMessages + _messages;
     ////// this convert rating messages to customMessage type, then convert the string messages to rating bars
     for (int i = 0; i < messages.length; i++) {
       if (_isRating(messages[i])) {
@@ -322,8 +321,8 @@ class _SupportThreadPageState extends State<SupportThreadPage>
           id: ratingMessengerID,
           author: _user,
           metadata: {
-            "status": "rating",
-            "rating": messages[i].metadata!["rating"],
+            'status': 'rating',
+            'rating': messages[i].metadata!['rating'],
           },
         );
         messages[i] = ratingMessenger;
@@ -332,8 +331,9 @@ class _SupportThreadPageState extends State<SupportThreadPage>
 
     if (_status == 'closed' || _status == 'clickToReopen') {
       final ratingIndex = _firstRatingIndex(messages);
-      messages.insert(ratingIndex + 1, _resolvedMessenger);
-      messages.insert(ratingIndex + 1, _askRatingMessenger);
+      messages
+        ..insert(ratingIndex + 1, _resolvedMessenger)
+        ..insert(ratingIndex + 1, _askRatingMessenger);
       if (ratingIndex > -1 && _status == 'closed') {
         messages.insert(ratingIndex, _askReviewMessenger);
       }
@@ -342,8 +342,9 @@ class _SupportThreadPageState extends State<SupportThreadPage>
     for (int i = 0; i < messages.length; i++) {
       if (_isRatingMessage(messages[i])) {
         if (messages[i + 1] != _askRatingMessenger) {
-          messages.insert(i + 1, _resolvedMessenger);
-          messages.insert(i + 1, _askRatingMessenger);
+          messages
+            ..insert(i + 1, _resolvedMessenger)
+            ..insert(i + 1, _askRatingMessenger);
         }
         if (i > 0 && _isCustomerSupportMessage(messages[i - 1])) {
           messages.insert(i, _askReviewMessenger);
@@ -367,7 +368,7 @@ class _SupportThreadPageState extends State<SupportThreadPage>
             margin: EdgeInsets.zero,
             child: Chat(
               l10n: ChatL10nEn(
-                inputPlaceholder: "write_message".tr(),
+                inputPlaceholder: 'write_message'.tr(),
               ),
               customDateHeaderText: getChatDateTimeRepresentation,
               bubbleBuilder: _bubbleBuilder,
@@ -377,48 +378,54 @@ class _SupportThreadPageState extends State<SupportThreadPage>
               messages: messages,
               onSendPressed: _handleSendPressed,
               user: _user,
-              listBottomWidget: (widget.payload.announcement?.isMemento6 ==
-                      true)
-                  ? FutureBuilder(
-                      future: _airdropService
-                          .getTokenByContract(momaMementoContractAddresses),
-                      builder: (context, snapshot) {
-                        final token = snapshot.data as AssetToken?;
-                        return Padding(
-                          padding: const EdgeInsets.only(
-                              left: 18, right: 18, bottom: 15),
-                          child: PrimaryAsyncButton(
-                            text: "claim_your_gift".tr(),
-                            enabled: token != null,
-                            onTap: () async {
-                              if (token == null) return;
-                              try {
-                                final response = await _airdropService
-                                    .claimRequestGift(token);
-                                final series = await _feralFileService
-                                    .getSeries(response.seriesID);
-                                if (!mounted) return;
-                                Navigator.of(context).pushNamed(
-                                    AppRouter.claimAirdropPage,
-                                    arguments: ClaimTokenPagePayload(
-                                        claimID: response.claimID,
-                                        series: series,
-                                        shareCode: ''));
-                              } catch (e) {
-                                log.info("Claim your gift tap ${e.toString()}");
-                              }
-                            },
-                          ),
-                        );
-                      })
-                  : null,
+              listBottomWidget:
+                  (widget.payload.announcement?.isMemento6 == true)
+                      ? FutureBuilder(
+                          future: _airdropService
+                              // ignore: discarded_futures
+                              .getTokenByContract(momaMementoContractAddresses),
+                          builder: (context, snapshot) {
+                            final token = snapshot.data as AssetToken?;
+                            return Padding(
+                              padding: const EdgeInsets.only(
+                                  left: 18, right: 18, bottom: 15),
+                              child: PrimaryAsyncButton(
+                                text: 'claim_your_gift'.tr(),
+                                enabled: token != null,
+                                onTap: () async {
+                                  if (token == null) {
+                                    return;
+                                  }
+                                  try {
+                                    final response = await _airdropService
+                                        .claimRequestGift(token);
+                                    final series = await _feralFileService
+                                        .getSeries(response.seriesID);
+                                    if (!mounted) {
+                                      return;
+                                    }
+                                    unawaited(Navigator.of(context).pushNamed(
+                                        AppRouter.claimAirdropPage,
+                                        arguments: ClaimTokenPagePayload(
+                                            claimID: response.claimID,
+                                            series: series,
+                                            shareCode: '')));
+                                  } catch (e) {
+                                    log.info('Claim your gift tap $e');
+                                  }
+                                },
+                              ),
+                            );
+                          })
+                      : null,
               customBottomWidget: !isCustomerSupportAvailable
                   ? const SizedBox()
-                  : _isRated == false && _status == 'closed'
+                  : !_isRated && _status == 'closed'
                       ? MyRatingBar(
                           submit: (String messageType,
                                   DraftCustomerSupportData data,
                                   {bool isRating = false}) =>
+                              // ignore: discarded_futures
                               _submit(messageType, data, isRating: isRating))
                       : Column(
                           children: [
@@ -433,25 +440,24 @@ class _SupportThreadPageState extends State<SupportThreadPage>
             )));
   }
 
-  InputOptions _inputOption() {
-    return InputOptions(
-        sendButtonVisibilityMode: SendButtonVisibilityMode.always,
-        onTextChanged: (text) {
-          if (_sendIcon == "assets/images/sendMessageFilled.svg" &&
-                  text.trim() == '' ||
-              _sendIcon == "assets/images/sendMessage.svg" &&
-                  text.trim() != '') {
-            setState(() {
-              _sendIcon = text.trim() != ''
-                  ? "assets/images/sendMessageFilled.svg"
-                  : "assets/images/sendMessage.svg";
-            });
-          }
-        });
-  }
+  InputOptions _inputOption() => InputOptions(
+      sendButtonVisibilityMode: SendButtonVisibilityMode.always,
+      onTextChanged: (text) {
+        if (_sendIcon == 'assets/images/sendMessageFilled.svg' &&
+                text.trim() == '' ||
+            _sendIcon == 'assets/images/sendMessage.svg' && text.trim() != '') {
+          setState(() {
+            _sendIcon = text.trim() != ''
+                ? 'assets/images/sendMessageFilled.svg'
+                : 'assets/images/sendMessage.svg';
+          });
+        }
+      });
 
   Widget debugLogView() {
-    if (_debugLog == null) return const SizedBox();
+    if (_debugLog == null) {
+      return const SizedBox();
+    }
     final debugLog = _debugLog!;
     final theme = Theme.of(context);
     final fileSize = debugLog.second.length;
@@ -462,13 +468,13 @@ class _SupportThreadPageState extends State<SupportThreadPage>
       child: Row(
         children: [
           Text(
-            debugLog.first.split("_").last,
+            debugLog.first.split('_').last,
             style: theme.primaryTextTheme.ppMori400White14
-                .copyWith(color: AppColor.auSuperTeal),
+                .copyWith(color: AppColor.feralFileHighlight),
           ),
           const SizedBox(width: 5),
           Text(
-            "(${fileSizeInMB.toStringAsFixed(2)} MB)",
+            '(${fileSizeInMB.toStringAsFixed(2)} MB)',
             style: theme.primaryTextTheme.ppMori400White14
                 .copyWith(color: AppColor.auQuickSilver),
           ),
@@ -481,7 +487,7 @@ class _SupportThreadPageState extends State<SupportThreadPage>
               });
             },
             child: SvgPicture.asset(
-              "assets/images/iconClose.svg",
+              'assets/images/iconClose.svg',
               width: 20,
               height: 20,
               colorFilter:
@@ -495,8 +501,10 @@ class _SupportThreadPageState extends State<SupportThreadPage>
 
   bool _isRatingMessage(types.Message message) {
     if (message is types.CustomMessage) {
-      if (message.metadata?["rating"] == null) return false;
-      if (message.metadata?["rating"] > 0) {
+      if (message.metadata?['rating'] == null) {
+        return false;
+      }
+      if (message.metadata?['rating'] > 0) {
         return true;
       }
     }
@@ -512,19 +520,25 @@ class _SupportThreadPageState extends State<SupportThreadPage>
 
   int _firstRatingIndex(List<types.Message> messages) {
     for (int i = 0; i < messages.length; i++) {
-      if (_isRatingMessage(messages[i])) return i;
-      if (_isCustomerSupportMessage(messages[i]) == false) return -1;
+      if (_isRatingMessage(messages[i])) {
+        return i;
+      }
+      if (!_isCustomerSupportMessage(messages[i])) {
+        return -1;
+      }
     }
     return -1;
   }
 
   Widget _ratingBar(int rating) {
-    if (rating == 0) return const SizedBox();
+    if (rating == 0) {
+      return const SizedBox();
+    }
     return RatingBar.builder(
       initialRating: rating.toDouble(),
       minRating: 1,
       itemSize: 24,
-      itemPadding: const EdgeInsets.symmetric(horizontal: 10.0),
+      itemPadding: const EdgeInsets.symmetric(horizontal: 10),
       itemBuilder: (context, _) => const Icon(
         Icons.star,
         color: AppColor.white,
@@ -542,14 +556,14 @@ class _SupportThreadPageState extends State<SupportThreadPage>
   }) {
     final theme = Theme.of(context);
     var color = _user.id != message.author.id
-        ? AppColor.auSuperTeal
+        ? AppColor.feralFileHighlight
         : AppColor.primaryBlack;
 
     if (message.type == types.MessageType.image) {
       color = Colors.transparent;
     }
     bool isError = false;
-    String uuid = "";
+    String uuid = '';
     if (message is types.Message) {
       if (message.status == types.Status.error) {
         isError = true;
@@ -588,20 +602,20 @@ class _SupportThreadPageState extends State<SupportThreadPage>
                     GestureDetector(
                       onTap: () async {
                         await _customerSupportService.removeErrorMessage(uuid);
-                        _loadDrafts();
-                        _customerSupportService.processMessages();
+                        unawaited(_loadDrafts());
+                        unawaited(_customerSupportService.processMessages());
                         Future.delayed(const Duration(seconds: 5), () {
                           _loadDrafts();
                         });
                       },
                       child: Text(
-                        "retry".tr(),
+                        'retry'.tr(),
                         style: theme.textTheme.ppMori400Black12
                             .copyWith(decoration: TextDecoration.underline),
                       ),
                     ),
                     Text(
-                      "・",
+                      '・',
                       style: theme.textTheme.ppMori400Black12,
                     ),
                     GestureDetector(
@@ -610,19 +624,21 @@ class _SupportThreadPageState extends State<SupportThreadPage>
                             isDelete: true);
                         await _loadDrafts();
                         if (_draftMessages.isEmpty && _messages.isEmpty) {
-                          if (!mounted) return;
+                          if (!mounted) {
+                            return;
+                          }
                           Navigator.of(context).pop();
                         }
                       },
                       child: Text(
-                        "delete".tr(),
+                        'delete'.tr(),
                         style: theme.textTheme.ppMori400Black12
                             .copyWith(decoration: TextDecoration.underline),
                       ),
                     ),
                     const SizedBox(width: 6),
                     Text(
-                      "failed_to_send".tr(),
+                      'failed_to_send'.tr(),
                       style: theme.textTheme.ppMori400Black12
                           .copyWith(color: orangeRust),
                     ),
@@ -646,15 +662,15 @@ class _SupportThreadPageState extends State<SupportThreadPage>
   Widget _customMessageBuilder(types.CustomMessage message,
       {required int messageWidth}) {
     final theme = Theme.of(context);
-    switch (message.metadata?["status"]) {
-      case "resolved":
+    switch (message.metadata?['status']) {
+      case 'resolved':
         return Container(
           padding: const EdgeInsets.symmetric(vertical: 14),
-          color: AppColor.auSuperTeal,
+          color: AppColor.feralFileHighlight,
           child:
               Column(crossAxisAlignment: CrossAxisAlignment.start, children: [
             Text(
-              "issue_resolved_".tr(),
+              'issue_resolved_'.tr(),
               textAlign: TextAlign.start,
               style: ResponsiveLayout.isMobile
                   ? theme.textTheme.ppMori700Black14
@@ -662,7 +678,7 @@ class _SupportThreadPageState extends State<SupportThreadPage>
             ),
             const SizedBox(height: 10),
             Text(
-              "our_team_thank".tr(),
+              'our_team_thank'.tr(),
               textAlign: TextAlign.start,
               style: ResponsiveLayout.isMobile
                   ? theme.textTheme.ppMori400Black14
@@ -671,15 +687,15 @@ class _SupportThreadPageState extends State<SupportThreadPage>
             const SizedBox(height: 20),
             TextButton(
               onPressed: () {
-                if (_status == "close") {
+                if (_status == 'close') {
                   setState(() {
-                    _status = "clickToReopen";
+                    _status = 'clickToReopen';
                   });
                 }
               },
               style: theme.textButtonNoPadding,
               child: Text(
-                "still_problem".tr(),
+                'still_problem'.tr(),
                 //"Still experiencing the same problem?",
                 style: ResponsiveLayout.isMobile
                     ? theme.textTheme.linkStyle14
@@ -690,21 +706,21 @@ class _SupportThreadPageState extends State<SupportThreadPage>
             ),
           ]),
         );
-      case "rating":
+      case 'rating':
         return Container(
           padding: const EdgeInsets.symmetric(vertical: 14),
           color: AppColor.primaryBlack,
-          child: _ratingBar(message.metadata?["rating"]),
+          child: _ratingBar(message.metadata?['rating']),
         );
-      case "careToShare":
-      case "rateIssue":
+      case 'careToShare':
+      case 'rateIssue':
         return Container(
           padding: const EdgeInsets.symmetric(vertical: 14),
-          color: AppColor.auSuperTeal,
+          color: AppColor.feralFileHighlight,
           child:
               Column(crossAxisAlignment: CrossAxisAlignment.start, children: [
             Text(
-              message.metadata?["content"],
+              message.metadata?['content'],
               textAlign: TextAlign.start,
               style: ResponsiveLayout.isMobile
                   ? theme.textTheme.ppMori700Black14
@@ -712,10 +728,10 @@ class _SupportThreadPageState extends State<SupportThreadPage>
             ),
           ]),
         );
-      case "announcement":
+      case 'announcement':
         return Container(
           padding: const EdgeInsets.symmetric(vertical: 14),
-          color: AppColor.auSuperTeal,
+          color: AppColor.feralFileHighlight,
           child:
               Column(crossAxisAlignment: CrossAxisAlignment.start, children: [
             if (widget.payload.announcement!.title.isNotEmpty) ...[
@@ -742,8 +758,10 @@ class _SupportThreadPageState extends State<SupportThreadPage>
     }
   }
 
-  void _loadIssueDetails() async {
-    if (_issueID == null) return;
+  Future<void> _loadIssueDetails() async {
+    if (_issueID == null) {
+      return;
+    }
     final issueDetails = await _customerSupportService.getDetails(_issueID!);
     if (widget.payload.announcement != null && issueDetails.issue.unread > 0) {
       _callMixpanelReadAnnouncementEvent(widget.payload.announcement!);
@@ -756,14 +774,14 @@ class _SupportThreadPageState extends State<SupportThreadPage>
 
     if (mounted) {
       setState(() {
-        String lastMessage = "";
+        String lastMessage = '';
         if (issueDetails.messages.isNotEmpty) {
           lastMessage = issueDetails.messages[0].message;
         }
 
         _status = issueDetails.issue.status;
         _isRated = issueDetails.issue.rating > 0 &&
-            issueDetails.issue.status == "closed" &&
+            issueDetails.issue.status == 'closed' &&
             (lastMessage.contains(RATING_MESSAGE_START) ||
                 lastMessage.contains(STAR_RATING));
         _reportIssueType = issueDetails.issue.reportIssueType;
@@ -773,13 +791,17 @@ class _SupportThreadPageState extends State<SupportThreadPage>
   }
 
   bool _isRating(types.Message message) {
-    final rating = message.metadata?["rating"];
-    if (rating != null && rating != "" && rating > 0 && rating < 6) return true;
+    final rating = message.metadata?['rating'];
+    if (rating != null && rating != '' && rating > 0 && rating < 6) {
+      return true;
+    }
     return false;
   }
 
   Future _loadDrafts() async {
-    if (_issueID == null) return;
+    if (_issueID == null) {
+      return;
+    }
     final drafts = await _customerSupportService.getDrafts(_issueID!);
     final draftMessages =
         (await Future.wait(drafts.map((e) => _convertChatMessage(e, null))))
@@ -792,10 +814,14 @@ class _SupportThreadPageState extends State<SupportThreadPage>
     }
   }
 
-  void _loadCustomerSupportUpdates() async {
+  Future<void> _loadCustomerSupportUpdates() async {
     final update = _customerSupportService.customerSupportUpdate.value;
-    if (update == null) return;
-    if (update.draft.issueID != _issueID) return;
+    if (update == null) {
+      return;
+    }
+    if (update.draft.issueID != _issueID) {
+      return;
+    }
 
     _issueID = update.response.issueID;
     memoryValues.viewingSupportThreadIssueID = _issueID;
@@ -815,20 +841,20 @@ class _SupportThreadPageState extends State<SupportThreadPage>
     List<String> mutedMessages = [];
     if (_issueID == null) {
       messageType = CSMessageType.CreateIssue.rawValue;
-      _issueID = "TEMP-${const Uuid().v4()}";
+      _issueID = 'TEMP-${const Uuid().v4()}';
 
       final payload = widget.payload;
       if (payload.announcement != null) {
         final metricClient = injector.get<MetricClientService>();
         final announcement = payload.announcement!;
-        metricClient.addEvent(
+        unawaited(metricClient.addEvent(
           MixpanelEvent.replyAnnouncement,
           data: {
-            "id": announcement.announcementContextId,
-            "type": announcement.type,
-            "title": announcement.title,
+            'id': announcement.announcementContextId,
+            'type': announcement.type,
+            'title': announcement.title,
           },
-        );
+        ));
         data.announcementId = announcement.announcementContextId;
       }
 
@@ -836,11 +862,11 @@ class _SupportThreadPageState extends State<SupportThreadPage>
         final sentryID = payload.sentryID;
         if (sentryID.isNotEmpty) {
           mutedMessages.add(
-              "[SENTRY REPORT $sentryID](https://sentry.io/organizations/bitmark-inc/issues/?query=$sentryID)");
+              '[SENTRY REPORT $sentryID](https://sentry.io/organizations/bitmark-inc/issues/?query=$sentryID)');
         }
 
         if (payload.metadata.isNotEmpty) {
-          mutedMessages.add("METADATA EXCEPTION: ${payload.metadata}");
+          mutedMessages.add('METADATA EXCEPTION: ${payload.metadata}');
         }
       }
     }
@@ -849,9 +875,9 @@ class _SupportThreadPageState extends State<SupportThreadPage>
     }
 
     if (messageType == CSMessageType.PostMessage.rawValue &&
-        _isRated == true &&
-        _status == "closed") {
-      data.text = "$RATING_MESSAGE_START${data.text}";
+        _isRated &&
+        _status == 'closed') {
+      data.text = '$RATING_MESSAGE_START${data.text}';
     }
 
     final draft = DraftCustomerSupport(
@@ -861,31 +887,33 @@ class _SupportThreadPageState extends State<SupportThreadPage>
       data: json.encode(data),
       createdAt: DateTime.now(),
       reportIssueType: _reportIssueType,
-      mutedMessages: mutedMessages.join("[SEPARATOR]"),
+      mutedMessages: mutedMessages.join('[SEPARATOR]'),
     );
 
     _draftMessages.insertAll(0, await _convertChatMessage(draft, null));
 
     if (_issueID != null && _status == 'clickToReopen') {
       setState(() {
-        _status = "reopening";
+        _status = 'reopening';
       });
       await _customerSupportService.reopen(_issueID!);
-      _status = "open";
+      _status = 'open';
       _isRated = false;
     }
 
     await _customerSupportService.draftMessage(draft);
     if (isRating) {
-      final rating = getRating(data.text ?? "");
+      final rating = getRating(data.text ?? '');
       if (rating > 0) {
         await _customerSupportService.rateIssue(_issueID!, rating);
       }
     }
     setState(() {
-      _sendIcon = "assets/images/sendMessage.svg";
+      _sendIcon = 'assets/images/sendMessage.svg';
       _forceAccountsViewRedraw = Object();
-      if (isRating) _isRated = true;
+      if (isRating) {
+        _isRated = true;
+      }
     });
 
     Future.delayed(const Duration(seconds: 5), () {
@@ -893,11 +921,11 @@ class _SupportThreadPageState extends State<SupportThreadPage>
     });
   }
 
-  void _handleSendPressed(types.PartialText message) async {
+  Future<void> _handleSendPressed(types.PartialText message) async {
     if (_isFileAttached) {
-      _addAppLogs(message);
+      await _addAppLogs(message);
     } else {
-      _submit(
+      await _submit(
         CSMessageType.PostMessage.rawValue,
         DraftCustomerSupportData(
             text: message.text,
@@ -907,7 +935,9 @@ class _SupportThreadPageState extends State<SupportThreadPage>
   }
 
   Future _addAppLogs(types.PartialText message) async {
-    if (_debugLog == null) return;
+    if (_debugLog == null) {
+      return;
+    }
     final filename = _debugLog!.first;
     final combinedBytes = _debugLog!.second;
 
@@ -931,9 +961,9 @@ class _SupportThreadPageState extends State<SupportThreadPage>
     if (_isFileAttached) {
       return;
     }
-    UIHelper.showDialog(
+    unawaited(UIHelper.showDialog(
       context,
-      "attach_file".tr(),
+      'attach_file'.tr(),
       Column(
         crossAxisAlignment: CrossAxisAlignment.start,
         children: [
@@ -948,30 +978,30 @@ class _SupportThreadPageState extends State<SupportThreadPage>
             height: 10,
           ),
           PrimaryButton(
-            onTap: () {
-              _addDebugLog();
+            onTap: () async {
+              await _addDebugLog();
             },
             text: 'debug_log'.tr(),
           ),
           const SizedBox(height: 10),
           OutlineButton(
             onTap: () => Navigator.of(context).pop(),
-            text: "cancel_dialog".tr(),
+            text: 'cancel_dialog'.tr(),
           ),
           const SizedBox(height: 15),
         ],
       ),
       isDismissible: true,
-    );
+    ));
   }
 
-  void _handleImageSelection() async {
+  Future<void> _handleImageSelection() async {
     log_util.log.info('[_handleImageSelection] begin');
     final result = await ImagePicker().pickMultiImage();
 
     final attachments = await Future.wait(result.map((element) async {
       final bytes = await element.readAsBytes();
-      final fileName = "${bytes.length}_${element.name}";
+      final fileName = '${bytes.length}_${element.name}';
       final localPath =
           await _customerSupportService.storeFile(fileName, bytes);
       return LocalAttachment(path: localPath, fileName: fileName);
@@ -987,7 +1017,7 @@ class _SupportThreadPageState extends State<SupportThreadPage>
   }
 
   Future<List<types.Message>> _convertChatMessage(
-      dynamic message, String? tempID) async {
+      message, String? tempID) async {
     String id;
     types.User author;
     types.Status status;
@@ -996,14 +1026,14 @@ class _SupportThreadPageState extends State<SupportThreadPage>
     int rating = 0;
     Map<String, dynamic> metadata = {};
     if (message is app.Message) {
-      id = tempID ?? "${message.id}";
-      author = message.from.contains("did:key") ? _user : _bitmark;
+      id = tempID ?? '${message.id}';
+      author = message.from.contains('did:key') ? _user : _bitmark;
       status = types.Status.delivered;
       createdAt = message.timestamp;
       text = message.filteredMessage;
       rating = getRating(text);
       if (rating > 0) {
-        metadata = {"rating": rating};
+        metadata = {'rating': rating};
       }
       //
     } else if (message is DraftCustomerSupport) {
@@ -1018,7 +1048,7 @@ class _SupportThreadPageState extends State<SupportThreadPage>
       metadata = json.decode(message.data);
       rating = message.draftData.rating;
       if (rating > 0) {
-        metadata["rating"] = rating;
+        metadata['rating'] = rating;
       }
       //
     } else {
@@ -1047,7 +1077,7 @@ class _SupportThreadPageState extends State<SupportThreadPage>
     if (message is app.Message) {
       for (var attachment in message.attachments) {
         titles.add(attachment.title);
-        uris.add("$storedDirectory/${attachment.title}");
+        uris.add('$storedDirectory/${attachment.title}');
         contentTypes.add(attachment.contentType);
       }
       //
@@ -1062,7 +1092,7 @@ class _SupportThreadPageState extends State<SupportThreadPage>
     }
 
     for (var i = 0; i < titles.length; i += 1) {
-      if (contentTypes[i].contains("image")) {
+      if (contentTypes[i].contains('image')) {
         result.add(types.ImageMessage(
           id: '$id${titles[i]}',
           author: author,
@@ -1096,7 +1126,7 @@ class _SupportThreadPageState extends State<SupportThreadPage>
 
   int getRating(String text) {
     if (text.startsWith(STAR_RATING)) {
-      final rating = int.tryParse(text.replacePrefix(STAR_RATING, ""));
+      final rating = int.tryParse(text.replacePrefix(STAR_RATING, ''));
       if (rating != null && rating > 0 && rating <= 5) {
         return rating;
       }
@@ -1120,7 +1150,7 @@ class _SupportThreadPageState extends State<SupportThreadPage>
       inputTextStyle: theme.textTheme.ppMori400White14,
       inputTextColor: theme.colorScheme.secondary,
       attachmentButtonIcon: SvgPicture.asset(
-        "assets/images/joinFile.svg",
+        'assets/images/joinFile.svg',
         colorFilter: ColorFilter.mode(
             _isFileAttached
                 ? AppColor.disabledColor
@@ -1149,7 +1179,7 @@ class _SupportThreadPageState extends State<SupportThreadPage>
       receivedMessageDocumentIconColor: Colors.transparent,
       sentMessageDocumentIconColor: Colors.transparent,
       documentIcon: SvgPicture.asset(
-        "assets/images/bug_icon.svg",
+        'assets/images/bug_icon.svg',
         width: 20,
       ),
       sentMessageCaptionTextStyle: ResponsiveLayout.isMobile
@@ -1172,7 +1202,8 @@ class _SupportThreadPageState extends State<SupportThreadPage>
 }
 
 class MyRatingBar extends StatefulWidget {
-  const MyRatingBar({Key? key, required this.submit}) : super(key: key);
+  const MyRatingBar({required this.submit, super.key});
+
   final Future<dynamic> Function(
           String messageType, DraftCustomerSupportData data, {bool isRating})
       submit;
@@ -1182,56 +1213,58 @@ class MyRatingBar extends StatefulWidget {
 }
 
 class _MyRatingBarState extends State<MyRatingBar> {
-  String customerRating = "";
+  String customerRating = '';
   int ratingInt = 0;
-  Widget sendButtonRating = SvgPicture.asset("assets/images/sendMessage.svg");
+  Widget sendButtonRating = SvgPicture.asset('assets/images/sendMessage.svg');
 
   @override
-  Widget build(BuildContext context) {
-    return Container(
-      padding: const EdgeInsets.fromLTRB(0, 10, 0, 30),
-      color: AppColor.primaryBlack,
-      child: Row(
-        mainAxisAlignment: MainAxisAlignment.end,
-        children: [
-          RatingBar.builder(
-            minRating: 1,
-            itemSize: 24,
-            itemPadding: const EdgeInsets.symmetric(horizontal: 10.0),
-            itemBuilder: (context, _) => const Icon(
-              Icons.star,
-              color: AppColor.white,
+  Widget build(BuildContext context) => Container(
+        padding: const EdgeInsets.fromLTRB(0, 10, 0, 30),
+        color: AppColor.primaryBlack,
+        child: Row(
+          mainAxisAlignment: MainAxisAlignment.end,
+          children: [
+            RatingBar.builder(
+              minRating: 1,
+              itemSize: 24,
+              itemPadding: const EdgeInsets.symmetric(horizontal: 10),
+              itemBuilder: (context, _) => const Icon(
+                Icons.star,
+                color: AppColor.white,
+              ),
+              unratedColor: AppColor.chatSecondaryColor,
+              onRatingUpdate: _updateRating,
             ),
-            unratedColor: AppColor.chatSecondaryColor,
-            onRatingUpdate: _updateRating,
-          ),
-          const SizedBox(width: 40),
-          IconButton(onPressed: _sendButtonOnPress, icon: sendButtonRating),
-          const SizedBox(width: 10)
-        ],
-      ),
-    );
-  }
+            const SizedBox(width: 40),
+            IconButton(onPressed: _sendButtonOnPress, icon: sendButtonRating),
+            const SizedBox(width: 10)
+          ],
+        ),
+      );
 
-  _updateRating(double rating) {
+  void _updateRating(double rating) {
     ratingInt = rating.toInt();
     customerRating = _convertRatingToText(ratingInt);
     setState(() {
       sendButtonRating =
-          SvgPicture.asset("assets/images/sendMessageFilled.svg");
+          SvgPicture.asset('assets/images/sendMessageFilled.svg');
     });
   }
 
-  _sendButtonOnPress() async {
-    if (ratingInt < 1) return;
-    widget.submit(CSMessageType.PostMessage.rawValue,
+  Future<void> _sendButtonOnPress() async {
+    if (ratingInt < 1) {
+      return;
+    }
+    await widget.submit(CSMessageType.PostMessage.rawValue,
         DraftCustomerSupportData(text: customerRating, rating: ratingInt),
         isRating: true);
   }
 
   String _convertRatingToText(int rating) {
-    if (rating > 0) return "$STAR_RATING${rating.toString()}";
+    if (rating > 0) {
+      return '$STAR_RATING$rating';
+    }
 
-    return "";
+    return '';
   }
 }
diff --git a/lib/screen/detail/artwork_detail_page.dart b/lib/screen/detail/artwork_detail_page.dart
index d3eaab5d5..03fa281b9 100644
--- a/lib/screen/detail/artwork_detail_page.dart
+++ b/lib/screen/detail/artwork_detail_page.dart
@@ -127,7 +127,7 @@ class _ArtworkDetailPageState extends State<ArtworkDetailPage>
 
   List<String> getTags(AssetToken asset) {
     final defaultTags = [
-      'autonomy',
+      'feralfile',
       'digitalartwallet',
       'NFT',
     ];
@@ -135,7 +135,7 @@ class _ArtworkDetailPageState extends State<ArtworkDetailPage>
     if (asset.isMoMAMemento) {
       tags = [
         'refikunsupervised',
-        'autonomyapp',
+        'feralfileapp',
       ];
     }
     return tags;
@@ -183,7 +183,7 @@ class _ArtworkDetailPageState extends State<ArtworkDetailPage>
       context
           .read<ArtworkDetailBloc>()
           .add(ArtworkDetailGetAirdropDeeplink(assetToken: asset));
-      UIHelper.showAirdropCannotShare(context);
+      unawaited(UIHelper.showAirdropCannotShare(context));
       return;
     }
     try {
@@ -194,7 +194,7 @@ class _ArtworkDetailPageState extends State<ArtworkDetailPage>
     } catch (e) {
       if (e is DioException) {
         if (mounted) {
-          UIHelper.showSharePostcardFailed(context, e);
+          unawaited(UIHelper.showSharePostcardFailed(context, e));
         }
       }
     }
@@ -465,11 +465,12 @@ class _ArtworkDetailPageState extends State<ArtworkDetailPage>
             }
             NftCollectionBloc.eventController.add(ReloadEvent());
             Navigator.of(context).pop();
-            UIHelper.showHideArtworkResultDialog(context, !isHidden, onOK: () {
+            unawaited(UIHelper.showHideArtworkResultDialog(context, !isHidden,
+                onOK: () {
               Navigator.of(context).popUntil((route) =>
                   route.settings.name == AppRouter.homePage ||
                   route.settings.name == AppRouter.homePageNoTransition);
-            });
+            }));
           },
         ),
         if (ownerWallet != null) ...[
diff --git a/lib/screen/detail/preview/artwork_preview_page.dart b/lib/screen/detail/preview/artwork_preview_page.dart
index 7aba3c1aa..37b893d83 100644
--- a/lib/screen/detail/preview/artwork_preview_page.dart
+++ b/lib/screen/detail/preview/artwork_preview_page.dart
@@ -47,7 +47,7 @@ import 'package:wakelock_plus/wakelock_plus.dart';
 class ArtworkPreviewPage extends StatefulWidget {
   final ArtworkDetailPayload payload;
 
-  const ArtworkPreviewPage({Key? key, required this.payload}) : super(key: key);
+  const ArtworkPreviewPage({required this.payload, super.key});
 
   @override
   State<ArtworkPreviewPage> createState() => _ArtworkPreviewPageState();
@@ -95,18 +95,20 @@ class _ArtworkPreviewPageState extends State<ArtworkPreviewPage>
     super.initState();
   }
 
-  setTimer({int? time}) {
+  void setTimer({int? time}) {
     _timer?.cancel();
     if (playControl != null) {
       final defaultDuration =
           playControl!.timer == 0 ? time ?? 10 : playControl!.timer;
       _timer = Timer.periodic(Duration(seconds: defaultDuration), (timer) {
-        if (!(_timer?.isActive ?? false)) return;
+        if (!(_timer?.isActive ?? false)) {
+          return;
+        }
         if (controller.page?.toInt() == tokens.length - 1) {
           controller.jumpTo(0);
         } else {
-          controller.nextPage(
-              duration: const Duration(microseconds: 1), curve: Curves.linear);
+          unawaited(controller.nextPage(
+              duration: const Duration(microseconds: 1), curve: Curves.linear));
         }
       });
     }
@@ -115,35 +117,35 @@ class _ArtworkPreviewPageState extends State<ArtworkPreviewPage>
   @override
   void dispose() {
     _focusNode.dispose();
-    disableLandscapeMode();
-    WakelockPlus.disable();
+    unawaited(disableLandscapeMode());
+    unawaited(WakelockPlus.disable());
     _timer?.cancel();
     routeObserver.unsubscribe(this);
     WidgetsBinding.instance.removeObserver(this);
     _detector?.stopListening();
     if (Platform.isAndroid) {
-      SystemChrome.setEnabledSystemUIMode(
+      unawaited(SystemChrome.setEnabledSystemUIMode(
         SystemUiMode.manual,
         overlays: [SystemUiOverlay.top, SystemUiOverlay.bottom],
-      );
+      ));
     }
     controller.dispose();
-    Sentry.getSpan()?.finish(status: const SpanStatus.ok());
+    unawaited(Sentry.getSpan()?.finish(status: const SpanStatus.ok()));
     super.dispose();
   }
 
   @override
   void didChangeDependencies() {
     routeObserver.subscribe(this, ModalRoute.of(context)!);
-    enableLandscapeMode();
-    WakelockPlus.enable();
+    unawaited(enableLandscapeMode());
+    unawaited(WakelockPlus.enable());
     super.didChangeDependencies();
   }
 
   @override
   void didPopNext() {
-    enableLandscapeMode();
-    WakelockPlus.enable();
+    unawaited(enableLandscapeMode());
+    unawaited(WakelockPlus.enable());
     setTimer();
     _renderingWidget?.didPopNext();
     super.didPopNext();
@@ -155,10 +157,10 @@ class _ArtworkPreviewPageState extends State<ArtworkPreviewPage>
     _detector = ShakeDetector.autoStart(
       onPhoneShake: () {
         _bloc.add(ChangeFullScreen());
-        SystemChrome.setEnabledSystemUIMode(
+        unawaited(SystemChrome.setEnabledSystemUIMode(
           SystemUiMode.manual,
           overlays: SystemUiOverlay.values,
-        );
+        ));
       },
     );
 
@@ -168,13 +170,15 @@ class _ArtworkPreviewPageState extends State<ArtworkPreviewPage>
   }
 
   Future _moveToInfo(AssetToken? assetToken) async {
-    if (assetToken == null) return;
-    metricClient.addEvent(
+    if (assetToken == null) {
+      return;
+    }
+    unawaited(metricClient.addEvent(
       MixpanelEvent.clickArtworkInfo,
       data: {
-        "id": assetToken.id,
+        'id': assetToken.id,
       },
-    );
+    ));
     keyboardManagerKey.currentState?.hideKeyboard();
 
     final currentIndex = tokens.indexWhere((element) =>
@@ -184,37 +188,38 @@ class _ArtworkPreviewPageState extends State<ArtworkPreviewPage>
       return;
     }
 
-    disableLandscapeMode();
+    unawaited(disableLandscapeMode());
 
-    WakelockPlus.disable();
+    unawaited(WakelockPlus.disable());
     _timer?.cancel();
 
-    Navigator.of(context).pushNamed(
+    unawaited(Navigator.of(context).pushNamed(
       AppRouter.artworkDetailsPage,
       arguments: widget.payload.copyWith(
         currentIndex: currentIndex,
         ids: tokens,
       ),
-    );
+    ));
   }
 
   void onClickFullScreen(AssetToken? assetToken) {
     final theme = Theme.of(context);
-    metricClient.addEvent(
+    unawaited(metricClient.addEvent(
       MixpanelEvent.seeArtworkFullScreen,
       data: {
-        "id": assetToken?.id,
+        'id': assetToken?.id,
       },
-    );
+    ));
     _bloc.add(ChangeFullScreen(isFullscreen: true));
-    SystemChrome.setEnabledSystemUIMode(SystemUiMode.immersiveSticky);
+    unawaited(
+        SystemChrome.setEnabledSystemUIMode(SystemUiMode.immersiveSticky));
 
     ScaffoldMessenger.of(context).showSnackBar(
       SnackBar(
         content: Container(
           padding: const EdgeInsets.symmetric(vertical: 16, horizontal: 10),
           decoration: BoxDecoration(
-            color: theme.auSuperTeal.withOpacity(0.9),
+            color: AppColor.feralFileHighlight.withOpacity(0.9),
             borderRadius: BorderRadius.circular(64),
           ),
           child: Text(
@@ -236,7 +241,7 @@ class _ArtworkPreviewPageState extends State<ArtworkPreviewPage>
       BlocProvider.value(
         value: _canvasDeviceBloc,
         child: CanvasDeviceView(
-          sceneId: assetToken?.id ?? "",
+          sceneId: assetToken?.id ?? '',
           onClose: () {
             Navigator.of(context).pop();
           },
@@ -244,7 +249,7 @@ class _ArtworkPreviewPageState extends State<ArtworkPreviewPage>
       ),
       isDismissible: true,
     );
-    _fetchDevice(assetToken?.id ?? "");
+    unawaited(_fetchDevice(assetToken?.id ?? ''));
   }
 
   @override
@@ -258,15 +263,15 @@ class _ArtworkPreviewPageState extends State<ArtworkPreviewPage>
           assetToken = state.assetToken;
           isFullScreen = state.isFullScreen;
         }
-        final hasKeyboard = assetToken?.medium == "software" ||
-            assetToken?.medium == "other" ||
+        final hasKeyboard = assetToken?.medium == 'software' ||
+            assetToken?.medium == 'other' ||
             assetToken?.medium == null;
         final hideArtist = assetToken?.isPostcard ?? false;
         final identityState = context.watch<IdentityBloc>().state;
         final artistName =
             assetToken?.artistName?.toIdentityOrMask(identityState.identityMap);
-        _fetchDevice(assetToken?.id ?? "");
-        var subTitle = "";
+        unawaited(_fetchDevice(assetToken?.id ?? ''));
+        var subTitle = '';
         if (artistName != null && artistName.isNotEmpty) {
           subTitle = artistName;
         }
@@ -279,7 +284,7 @@ class _ArtworkPreviewPageState extends State<ArtworkPreviewPage>
                   leadingWidth: 0,
                   centerTitle: false,
                   title: GestureDetector(
-                      onTap: () => _moveToInfo(assetToken),
+                      onTap: () async => _moveToInfo(assetToken),
                       child: ArtworkDetailsHeader(
                         title: assetToken?.title ?? '',
                         subTitle: subTitle,
@@ -322,35 +327,34 @@ class _ArtworkPreviewPageState extends State<ArtworkPreviewPage>
                     },
                     controller: controller,
                     itemCount: tokens.length,
-                    itemBuilder: (context, index) {
-                      return BlocBuilder<CanvasDeviceBloc, CanvasDeviceState>(
-                        bloc: _canvasDeviceBloc,
-                        builder: (context, state) {
-                          final isCasting = state.isCasting;
-                          if (isCasting) {
-                            return const Center(
-                              child: CurrentlyCastingArtwork(),
-                            );
-                          }
-                          if (tokens[index].id.isPostcardId) {
-                            return PostcardPreviewWidget(
-                              identity: tokens[index],
-                              useIndexer: widget.payload.useIndexer,
-                            );
-                          }
-                          return ArtworkPreviewWidget(
+                    itemBuilder: (context, index) =>
+                        BlocBuilder<CanvasDeviceBloc, CanvasDeviceState>(
+                      bloc: _canvasDeviceBloc,
+                      builder: (context, state) {
+                        final isCasting = state.isCasting;
+                        if (isCasting) {
+                          return const Center(
+                            child: CurrentlyCastingArtwork(),
+                          );
+                        }
+                        if (tokens[index].id.isPostcardId) {
+                          return PostcardPreviewWidget(
                             identity: tokens[index],
-                            onLoaded: (
-                                {InAppWebViewController? webViewController,
-                                int? time}) {
-                              setTimer(time: time);
-                            },
-                            focusNode: _focusNode,
                             useIndexer: widget.payload.useIndexer,
                           );
-                        },
-                      );
-                    },
+                        }
+                        return ArtworkPreviewWidget(
+                          identity: tokens[index],
+                          onLoaded: (
+                              {InAppWebViewController? webViewController,
+                              int? time}) {
+                            setTimer(time: time);
+                          },
+                          focusNode: _focusNode,
+                          useIndexer: widget.payload.useIndexer,
+                        );
+                      },
+                    ),
                   ),
                 ),
                 Visibility(
@@ -370,16 +374,15 @@ class _ArtworkPreviewPageState extends State<ArtworkPreviewPage>
                             ),
                             child: Row(
                               mainAxisAlignment: MainAxisAlignment.end,
-                              crossAxisAlignment: CrossAxisAlignment.end,
                               children: [
                                 const SizedBox(
                                   width: 20,
                                 ),
                                 Visibility(
-                                  visible: (assetToken?.medium == 'software' ||
+                                  visible: assetToken?.medium == 'software' ||
                                       assetToken?.medium == 'other' ||
                                       (assetToken?.medium?.isEmpty ?? true) ||
-                                      isCasting),
+                                      isCasting,
                                   child: KeyboardManagerWidget(
                                     key: keyboardManagerKey,
                                     focusNode: _focusNode,
@@ -399,7 +402,7 @@ class _ArtworkPreviewPageState extends State<ArtworkPreviewPage>
                                   width: 20,
                                 ),
                                 CastButton(
-                                  onCastTap: () => _onCastTap(assetToken),
+                                  onCastTap: () async => _onCastTap(assetToken),
                                   isCasting: isCasting,
                                 ),
                                 const SizedBox(
@@ -410,7 +413,7 @@ class _ArtworkPreviewPageState extends State<ArtworkPreviewPage>
                                       ? null
                                       : () => onClickFullScreen(assetToken),
                                   child: Semantics(
-                                    label: "fullscreen_icon",
+                                    label: 'fullscreen_icon',
                                     child: SvgPicture.asset(
                                       'assets/images/fullscreen_icon.svg',
                                       colorFilter: ColorFilter.mode(
@@ -454,8 +457,7 @@ class KeyboardManagerWidget extends StatefulWidget {
   final FocusNode? focusNode;
   final Function()? onTap;
 
-  const KeyboardManagerWidget({Key? key, this.focusNode, this.onTap})
-      : super(key: key);
+  const KeyboardManagerWidget({super.key, this.focusNode, this.onTap});
 
   @override
   State<KeyboardManagerWidget> createState() => KeyboardManagerWidgetState();
@@ -480,14 +482,14 @@ class KeyboardManagerWidgetState extends State<KeyboardManagerWidget> {
     super.initState();
   }
 
-  void showKeyboard() async {
+  void showKeyboard() {
     setState(() {
       widget.focusNode?.requestFocus();
       _isShowKeyboard = true;
     });
   }
 
-  void hideKeyboard() async {
+  void hideKeyboard() {
     setState(() {
       widget.focusNode?.unfocus();
       _isShowKeyboard = false;
@@ -500,13 +502,11 @@ class KeyboardManagerWidgetState extends State<KeyboardManagerWidget> {
   }
 
   @override
-  Widget build(BuildContext context) {
-    return GestureDetector(
-      onTap: () {
-        _isShowKeyboard ? hideKeyboard : showKeyboard;
-        widget.onTap?.call();
-      },
-      child: SvgPicture.asset('assets/images/keyboard_icon.svg'),
-    );
-  }
+  Widget build(BuildContext context) => GestureDetector(
+        onTap: () {
+          _isShowKeyboard ? hideKeyboard : showKeyboard;
+          widget.onTap?.call();
+        },
+        child: SvgPicture.asset('assets/images/keyboard_icon.svg'),
+      );
 }
diff --git a/lib/screen/detail/preview/canvas_device_bloc.dart b/lib/screen/detail/preview/canvas_device_bloc.dart
index 06db0af5a..b013970eb 100644
--- a/lib/screen/detail/preview/canvas_device_bloc.dart
+++ b/lib/screen/detail/preview/canvas_device_bloc.dart
@@ -56,9 +56,9 @@ class CanvasDeviceState {
 
   CanvasDeviceState({
     required this.devices,
-    this.sceneId = "",
-    this.isConnectError = false,
     required this.isLoaded,
+    this.sceneId = '',
+    this.isConnectError = false,
   });
 
   CanvasDeviceState copyWith({
@@ -66,14 +66,13 @@ class CanvasDeviceState {
     String? sceneId,
     bool? isConnectError,
     bool? isLoaded,
-  }) {
-    return CanvasDeviceState(
-      devices: devices ?? this.devices,
-      sceneId: sceneId ?? this.sceneId,
-      isConnectError: isConnectError ?? false,
-      isLoaded: isLoaded ?? this.isLoaded,
-    );
-  }
+  }) =>
+      CanvasDeviceState(
+        devices: devices ?? this.devices,
+        sceneId: sceneId ?? this.sceneId,
+        isConnectError: isConnectError ?? false,
+        isLoaded: isLoaded ?? this.isLoaded,
+      );
 
   CanvasDeviceState replaceDeviceState(
       {required CanvasDevice device, required DeviceState deviceState}) {
@@ -86,24 +85,20 @@ class CanvasDeviceState {
     return copyWith(devices: newDeviceState);
   }
 
-  List<CanvasDevice> get playingDevice {
-    return devices
-        .map((e) {
-          if (e.status == DeviceStatus.playing) {
-            return e.device;
-          }
-        })
-        .whereNotNull()
-        .toList();
-  }
-
-  bool get isCasting {
-    return devices.firstWhereOrNull((deviceState) {
-          return deviceState.status == DeviceStatus.playing &&
-              deviceState.device.playingSceneId == sceneId;
-        }) !=
-        null;
-  }
+  List<CanvasDevice> get playingDevice => devices
+      .map((e) {
+        if (e.status == DeviceStatus.playing) {
+          return e.device;
+        }
+      })
+      .whereNotNull()
+      .toList();
+
+  bool get isCasting =>
+      devices.firstWhereOrNull((deviceState) =>
+          deviceState.status == DeviceStatus.playing &&
+          deviceState.device.playingSceneId == sceneId) !=
+      null;
 }
 
 class DeviceState {
@@ -120,12 +115,11 @@ class DeviceState {
   DeviceState copyWith({
     CanvasDevice? device,
     DeviceStatus? status,
-  }) {
-    return DeviceState(
-      device: device ?? this.device,
-      status: status ?? this.status,
-    );
-  }
+  }) =>
+      DeviceState(
+        device: device ?? this.device,
+        status: status ?? this.status,
+      );
 }
 
 enum DeviceStatus {
@@ -177,12 +171,12 @@ class CanvasDeviceBloc extends AuBloc<CanvasDeviceEvent, CanvasDeviceState> {
                 DeviceState(device: device, status: DeviceStatus.loading)));
         final connected = await _canvasClientService.connectToDevice(device);
         if (!connected) {
-          throw Exception("Failed to connect to device");
+          throw Exception('Failed to connect to device');
         }
         final ok =
             await _canvasClientService.castSingleArtwork(device, event.tokenId);
         if (!ok) {
-          throw Exception("Failed to cast to device");
+          throw Exception('Failed to cast to device');
         }
         emit(state.replaceDeviceState(
             device: device,
@@ -205,12 +199,12 @@ class CanvasDeviceBloc extends AuBloc<CanvasDeviceEvent, CanvasDeviceState> {
                 DeviceState(device: device, status: DeviceStatus.loading)));
         final connected = await _canvasClientService.connectToDevice(device);
         if (!connected) {
-          throw Exception("Failed to connect to device");
+          throw Exception('Failed to connect to device');
         }
         final ok =
             await _canvasClientService.castCollection(device, event.playlist);
         if (!ok) {
-          throw Exception("Failed to cast to device");
+          throw Exception('Failed to cast to device');
         }
         emit(state.replaceDeviceState(
             device: device,
diff --git a/lib/screen/detail/preview_primer.dart b/lib/screen/detail/preview_primer.dart
index f45d28975..f18b842d2 100644
--- a/lib/screen/detail/preview_primer.dart
+++ b/lib/screen/detail/preview_primer.dart
@@ -96,7 +96,7 @@ class _PreviewPrimerPageState extends State<PreviewPrimerPage>
         content: Container(
           padding: const EdgeInsets.symmetric(vertical: 16, horizontal: 10),
           decoration: BoxDecoration(
-            color: theme.auSuperTeal.withOpacity(0.9),
+            color: AppColor.feralFileHighlight.withOpacity(0.9),
             borderRadius: BorderRadius.circular(64),
           ),
           child: Text(
diff --git a/lib/screen/exhibition_details/exhibition_detail_bloc.dart b/lib/screen/exhibition_details/exhibition_detail_bloc.dart
new file mode 100644
index 000000000..9e88c6aaa
--- /dev/null
+++ b/lib/screen/exhibition_details/exhibition_detail_bloc.dart
@@ -0,0 +1,29 @@
+// create exhibition_detail bloc
+
+import 'package:autonomy_flutter/au_bloc.dart';
+import 'package:autonomy_flutter/model/ff_account.dart';
+import 'package:autonomy_flutter/model/ff_exhibition.dart';
+import 'package:autonomy_flutter/screen/exhibition_details/exhibition_detail_state.dart';
+import 'package:autonomy_flutter/service/feralfile_service.dart';
+import 'package:autonomy_flutter/util/exhibition_ext.dart';
+
+class ExhibitionDetailBloc
+    extends AuBloc<ExhibitionDetailEvent, ExhibitionDetailState> {
+  final FeralFileService _feralFileService;
+
+  ExhibitionDetailBloc(this._feralFileService)
+      : super(ExhibitionDetailState()) {
+    on<GetExhibitionDetailEvent>((event, emit) async {
+      final result = await Future.wait([
+        _feralFileService.getExhibition(event.exhibitionId),
+        _feralFileService.getExhibitionArtworks(event.exhibitionId)
+      ]);
+      final exhibitionDetail = ExhibitionDetail(
+          exhibition: result[0] as Exhibition,
+          artworks: result[1] as List<Artwork>);
+      exhibitionDetail.artworks!.removeWhere(
+          (element) => exhibitionDetail.getArtworkTokenId(element) == null);
+      emit(state.copyWith(exhibitionDetail: exhibitionDetail));
+    });
+  }
+}
diff --git a/lib/screen/exhibition_details/exhibition_detail_page.dart b/lib/screen/exhibition_details/exhibition_detail_page.dart
new file mode 100644
index 000000000..cc1f0e336
--- /dev/null
+++ b/lib/screen/exhibition_details/exhibition_detail_page.dart
@@ -0,0 +1,282 @@
+import 'package:autonomy_flutter/model/ff_exhibition.dart';
+import 'package:autonomy_flutter/model/play_control_model.dart';
+import 'package:autonomy_flutter/model/play_list_model.dart';
+import 'package:autonomy_flutter/screen/detail/preview/canvas_device_bloc.dart';
+import 'package:autonomy_flutter/screen/exhibition_details/exhibition_detail_bloc.dart';
+import 'package:autonomy_flutter/screen/exhibition_details/exhibition_detail_state.dart';
+import 'package:autonomy_flutter/screen/exhibition_note/exhibition_note_page.dart';
+import 'package:autonomy_flutter/util/exhibition_ext.dart';
+import 'package:autonomy_flutter/util/ui_helper.dart';
+import 'package:autonomy_flutter/view/back_appbar.dart';
+import 'package:autonomy_flutter/view/canvas_device_view.dart';
+import 'package:autonomy_flutter/view/cast_button.dart';
+import 'package:autonomy_flutter/view/event_view.dart';
+import 'package:autonomy_flutter/view/exhibition_detail_last_page.dart';
+import 'package:autonomy_flutter/view/exhibition_detail_preview.dart';
+import 'package:autonomy_flutter/view/ff_artwork_preview.dart';
+import 'package:autonomy_flutter/view/note_view.dart';
+import 'package:autonomy_theme/autonomy_theme.dart';
+import 'package:easy_localization/easy_localization.dart';
+import 'package:flutter/material.dart';
+import 'package:flutter_bloc/flutter_bloc.dart';
+import 'package:flutter_svg/svg.dart';
+
+class ExhibitionDetailPage extends StatefulWidget {
+  const ExhibitionDetailPage({required this.payload, super.key});
+
+  final ExhibitionDetailPayload payload;
+
+  @override
+  State<ExhibitionDetailPage> createState() => _ExhibitionDetailPageState();
+}
+
+class _ExhibitionDetailPageState extends State<ExhibitionDetailPage> {
+  late final ExhibitionDetailBloc _exBloc;
+  late final CanvasDeviceBloc _canvasDeviceBloc;
+
+  late final PageController _controller;
+  int _currentIndex = 0;
+
+  @override
+  void initState() {
+    super.initState();
+    _exBloc = context.read<ExhibitionDetailBloc>();
+    _canvasDeviceBloc = context.read<CanvasDeviceBloc>();
+    _exBloc.add(GetExhibitionDetailEvent(
+        widget.payload.exhibitions[widget.payload.index].id));
+
+    _controller = PageController();
+  }
+
+  @override
+  Widget build(BuildContext context) =>
+      BlocConsumer<ExhibitionDetailBloc, ExhibitionDetailState>(
+        builder: (context, state) => Scaffold(
+          appBar: _getAppBar(context, state.exhibitionDetail),
+          backgroundColor: AppColor.primaryBlack,
+          body: _body(context, state),
+        ),
+        listener: (context, state) {},
+      );
+
+  Widget _body(BuildContext context, ExhibitionDetailState state) {
+    final exhibitionDetail = state.exhibitionDetail;
+    if (exhibitionDetail == null) {
+      return const Center(
+        child: CircularProgressIndicator(),
+      );
+    }
+
+    final viewingArtworks = exhibitionDetail.representArtworks
+      ..sort((a, b) => a.seriesID.compareTo(b.seriesID));
+
+    final tokenIds = viewingArtworks
+        .map((e) => exhibitionDetail.getArtworkTokenId(e)!)
+        .toList();
+    final itemCount = tokenIds.length + 3;
+    return Stack(
+      children: [
+        PageView.builder(
+          controller: _controller,
+          onPageChanged: (index) {
+            setState(() {
+              _currentIndex = index;
+            });
+          },
+          scrollDirection: Axis.vertical,
+          itemCount: itemCount,
+          itemBuilder: (context, index) {
+            if (index == itemCount - 1) {
+              return ExhibitionDetailLastPage(
+                startOver: () => setState(() {
+                  _currentIndex = 0;
+                  _controller.jumpToPage(0);
+                }),
+                nextPayload: widget.payload.next(),
+              );
+            }
+
+            switch (index) {
+              case 0:
+                return _getPreviewPage(exhibitionDetail.exhibition);
+              case 1:
+                return _notePage(exhibitionDetail.exhibition);
+              default:
+                final seriesIndex = index - 2;
+                final series = exhibitionDetail.exhibition.series!.firstWhere(
+                    (element) =>
+                        element.id == viewingArtworks[seriesIndex].seriesID);
+                return FeralFileArtworkPreview(
+                  payload: FeralFileArtworkPreviewPayload(
+                    tokenId: tokenIds[seriesIndex],
+                    artwork: viewingArtworks[seriesIndex],
+                    series: series,
+                  ),
+                );
+            }
+          },
+        ),
+        if (_currentIndex == 0 || _currentIndex == 1)
+          Align(
+            alignment: Alignment.bottomCenter,
+            child: _nextButton(),
+          ),
+      ],
+    );
+  }
+
+  Widget _getPreviewPage(Exhibition exhibition) => Column(
+        mainAxisAlignment: MainAxisAlignment.spaceAround,
+        children: [
+          ExhibitionPreview(
+            exhibition: exhibition,
+          ),
+        ],
+      );
+
+  Widget _nextButton() => Padding(
+        padding: const EdgeInsets.only(bottom: 20),
+        child: RotatedBox(
+          quarterTurns: 3,
+          child: IconButton(
+            onPressed: () async => _controller.nextPage(
+                duration: const Duration(milliseconds: 300),
+                curve: Curves.easeIn),
+            icon: SvgPicture.asset(
+              'assets/images/ff_back_dark.svg',
+            ),
+          ),
+        ),
+      );
+
+  Widget _notePage(Exhibition exhibition) {
+    const horizontalPadding = 14.0;
+    const peekWidth = 50.0;
+    final width =
+        MediaQuery.sizeOf(context).width - horizontalPadding * 2 - peekWidth;
+    return Padding(
+      padding: const EdgeInsets.symmetric(horizontal: 14),
+      child: SingleChildScrollView(
+        scrollDirection: Axis.horizontal,
+        child: Row(
+          children: [
+            Padding(
+              padding: const EdgeInsets.only(right: 14),
+              child: ExhibitionNoteView(
+                exhibition: exhibition,
+                width: width,
+                onReadMore: () async {
+                  await Navigator.push(
+                    context,
+                    MaterialPageRoute(
+                      builder: (context) => ExhibitionNotePage(
+                        exhibition: exhibition,
+                      ),
+                    ),
+                  );
+                },
+              ),
+            ),
+            ...exhibition.resources?.map((e) => ExhibitionEventView(
+                      exhibitionEvent: e,
+                      width: width,
+                    )) ??
+                []
+          ],
+        ),
+      ),
+    );
+  }
+
+  AppBar _getAppBar(
+          BuildContext buildContext, ExhibitionDetail? exhibitionDetail) =>
+      getFFAppBar(
+        buildContext,
+        onBack: () => Navigator.pop(buildContext),
+        action: exhibitionDetail == null
+            ? null
+            : Padding(
+                padding: const EdgeInsets.only(right: 14, bottom: 10, top: 10),
+                child: FFCastButton(
+                  text: _currentIndex == 0 ? 'stream_to_device'.tr() : null,
+                  onCastTap: () async {
+                    await _onCastTap(buildContext, exhibitionDetail);
+                  },
+                ),
+              ),
+      );
+
+  Future<void> _onCastTap(
+      BuildContext context, ExhibitionDetail exhibitionDetail) async {
+    if (exhibitionDetail.artworks == null ||
+        exhibitionDetail.artworks!.isEmpty) {
+      return;
+    }
+    exhibitionDetail.artworks!.sort((a, b) {
+      if (a.index != b.index) {
+        a.index.compareTo(b.index);
+      }
+      return a.seriesID.compareTo(b.seriesID);
+    });
+    final tokenIds = exhibitionDetail.artworks
+        ?.map((e) => exhibitionDetail.getArtworkTokenId(e)!)
+        .toList();
+    final sceneId = exhibitionDetail.exhibition.id;
+    final playlistModel = PlayListModel(
+      name: exhibitionDetail.exhibition.title,
+      id: sceneId,
+      thumbnailURL: exhibitionDetail.exhibition.coverUrl,
+      tokenIDs: tokenIds,
+      playControlModel: PlayControlModel(timer: 30),
+    );
+    await UIHelper.showFlexibleDialog(
+      context,
+      BlocProvider.value(
+        value: _canvasDeviceBloc,
+        child: CanvasDeviceView(
+          sceneId: sceneId,
+          isCollection: true,
+          playlist: playlistModel,
+          onClose: () {
+            Navigator.of(context).pop();
+          },
+        ),
+      ),
+      isDismissible: true,
+    );
+    await _fetchDevice(sceneId);
+  }
+
+  Future<void> _fetchDevice(String exhibitionId) async {
+    _canvasDeviceBloc
+        .add(CanvasDeviceGetDevicesEvent(exhibitionId, syncAll: false));
+  }
+}
+
+class ExhibitionDetailPayload {
+  final List<Exhibition> exhibitions;
+  final int index;
+
+  const ExhibitionDetailPayload({
+    required this.exhibitions,
+    required this.index,
+  });
+
+  // copyWith function
+  ExhibitionDetailPayload copyWith({
+    List<Exhibition>? exhibitions,
+    int? index,
+  }) =>
+      ExhibitionDetailPayload(
+        exhibitions: exhibitions ?? this.exhibitions,
+        index: index ?? this.index,
+      );
+
+  // next function: increase index by 1, if index is out of range, return null
+  ExhibitionDetailPayload? next() {
+    if (index + 1 >= exhibitions.length) {
+      return null;
+    }
+    return copyWith(index: index + 1);
+  }
+}
diff --git a/lib/screen/exhibition_details/exhibition_detail_state.dart b/lib/screen/exhibition_details/exhibition_detail_state.dart
new file mode 100644
index 000000000..851dd902c
--- /dev/null
+++ b/lib/screen/exhibition_details/exhibition_detail_state.dart
@@ -0,0 +1,20 @@
+import 'package:autonomy_flutter/model/ff_exhibition.dart';
+
+class ExhibitionDetailEvent {}
+
+class GetExhibitionDetailEvent extends ExhibitionDetailEvent {
+  GetExhibitionDetailEvent(this.exhibitionId);
+
+  final String exhibitionId;
+}
+
+class ExhibitionDetailState {
+  ExhibitionDetailState({this.exhibitionDetail});
+
+  final ExhibitionDetail? exhibitionDetail;
+
+  ExhibitionDetailState copyWith({ExhibitionDetail? exhibitionDetail}) =>
+      ExhibitionDetailState(
+        exhibitionDetail: exhibitionDetail ?? this.exhibitionDetail,
+      );
+}
diff --git a/lib/screen/exhibition_note/exhibition_note_page.dart b/lib/screen/exhibition_note/exhibition_note_page.dart
new file mode 100644
index 000000000..0978354e4
--- /dev/null
+++ b/lib/screen/exhibition_note/exhibition_note_page.dart
@@ -0,0 +1,29 @@
+import 'package:autonomy_flutter/model/ff_exhibition.dart';
+import 'package:autonomy_flutter/view/back_appbar.dart';
+import 'package:autonomy_flutter/view/note_view.dart';
+import 'package:autonomy_theme/autonomy_theme.dart';
+import 'package:flutter/material.dart';
+
+class ExhibitionNotePage extends StatelessWidget {
+  const ExhibitionNotePage({required this.exhibition, super.key});
+
+  final Exhibition exhibition;
+
+  @override
+  Widget build(BuildContext context) => Scaffold(
+        appBar: getFFAppBar(
+          context,
+          onBack: () => Navigator.pop(context),
+        ),
+        backgroundColor: AppColor.primaryBlack,
+        body: Padding(
+          padding: const EdgeInsets.fromLTRB(14, 0, 14, 20),
+          child: SingleChildScrollView(
+            child: ExhibitionNoteView(
+              exhibition: exhibition,
+              isFull: true,
+            ),
+          ),
+        ),
+      );
+}
diff --git a/lib/screen/exhibitions/exhibitions_bloc.dart b/lib/screen/exhibitions/exhibitions_bloc.dart
new file mode 100644
index 000000000..90ce9b0cb
--- /dev/null
+++ b/lib/screen/exhibitions/exhibitions_bloc.dart
@@ -0,0 +1,17 @@
+import 'package:autonomy_flutter/au_bloc.dart';
+import 'package:autonomy_flutter/screen/exhibitions/exhibitions_state.dart';
+import 'package:autonomy_flutter/service/feralfile_service.dart';
+
+class ExhibitionBloc extends AuBloc<ExhibitionsEvent, ExhibitionsState> {
+  final FeralFileService _feralFileService;
+
+  ExhibitionBloc(this._feralFileService) : super(ExhibitionsState()) {
+    on<GetAllExhibitionsEvent>((event, emit) async {
+      final featuredExhibition = await _feralFileService.getAllExhibitions(
+        withArtworks: true,
+        limit: 1,
+      );
+      emit(state.copyWith(exhibitions: featuredExhibition));
+    });
+  }
+}
diff --git a/lib/screen/exhibitions/exhibitions_page.dart b/lib/screen/exhibitions/exhibitions_page.dart
new file mode 100644
index 000000000..feb97c8fc
--- /dev/null
+++ b/lib/screen/exhibitions/exhibitions_page.dart
@@ -0,0 +1,193 @@
+import 'dart:async';
+
+import 'package:autonomy_flutter/common/injector.dart';
+import 'package:autonomy_flutter/model/ff_exhibition.dart';
+import 'package:autonomy_flutter/screen/app_router.dart';
+import 'package:autonomy_flutter/screen/exhibition_details/exhibition_detail_page.dart';
+import 'package:autonomy_flutter/screen/exhibitions/exhibitions_bloc.dart';
+import 'package:autonomy_flutter/screen/exhibitions/exhibitions_state.dart';
+import 'package:autonomy_flutter/service/navigation_service.dart';
+import 'package:autonomy_flutter/util/exhibition_ext.dart';
+import 'package:autonomy_flutter/view/back_appbar.dart';
+import 'package:autonomy_flutter/view/header.dart';
+import 'package:autonomy_theme/autonomy_theme.dart';
+import 'package:cached_network_image/cached_network_image.dart';
+import 'package:collection/collection.dart';
+import 'package:easy_localization/easy_localization.dart';
+import 'package:flutter/gestures.dart';
+import 'package:flutter/material.dart';
+import 'package:flutter_bloc/flutter_bloc.dart';
+
+class ExhibitionsPage extends StatefulWidget {
+  const ExhibitionsPage({super.key});
+
+  @override
+  State<ExhibitionsPage> createState() => ExhibitionsPageState();
+}
+
+class ExhibitionsPageState extends State<ExhibitionsPage> {
+  late ExhibitionBloc _exhibitionBloc;
+  late ScrollController _controller;
+  final _navigationService = injector<NavigationService>();
+
+  // initState
+  @override
+  void initState() {
+    super.initState();
+    _controller = ScrollController();
+    _exhibitionBloc = context.read<ExhibitionBloc>();
+    _exhibitionBloc.add(GetAllExhibitionsEvent());
+  }
+
+  void scrollToTop() {
+    unawaited(_controller.animateTo(0,
+        duration: const Duration(milliseconds: 500),
+        curve: Curves.fastOutSlowIn));
+  }
+
+  @override
+  Widget build(BuildContext context) => Scaffold(
+        appBar: getDarkEmptyAppBar(Colors.transparent),
+        extendBody: true,
+        extendBodyBehindAppBar: true,
+        backgroundColor: AppColor.primaryBlack,
+        body: CustomScrollView(
+          controller: _controller,
+          slivers: [
+            SliverToBoxAdapter(
+              child: SizedBox(
+                height: MediaQuery.of(context).padding.top,
+              ),
+            ),
+            SliverToBoxAdapter(
+              child: HeaderView(
+                title: 'exhibitions'.tr(),
+              ),
+            ),
+            SliverToBoxAdapter(child: _listExhibitions(context))
+          ],
+        ),
+      );
+
+  Widget _exhibitionItem(
+      BuildContext context, ExhibitionDetail exhibitionDetail, int index) {
+    final theme = Theme.of(context);
+    final screenWidth = MediaQuery.sizeOf(context).width;
+    const double padding = 14;
+    final estimatedHeight = (screenWidth - padding * 2) / 16 * 9;
+    final exhibition = exhibitionDetail.exhibition;
+    return Container(
+      padding: const EdgeInsets.symmetric(horizontal: padding),
+      child: Column(
+        crossAxisAlignment: CrossAxisAlignment.start,
+        children: [
+          Text('current_exhibition'.tr(),
+              style: theme.textTheme.ppMori400White14),
+          if (exhibition.isFreeToStream)
+            Text('free_to_stream'.tr(), style: theme.textTheme.ppMori400Grey14),
+          const SizedBox(height: 18),
+          Column(
+            children: [
+              GestureDetector(
+                child: ClipRRect(
+                  borderRadius: BorderRadius.circular(10),
+                  child: CachedNetworkImage(
+                    imageUrl: exhibition.coverUrl,
+                    placeholder: (context, url) => SizedBox(
+                      height: estimatedHeight,
+                      child: const Center(
+                        child: CircularProgressIndicator(),
+                      ),
+                    ),
+                    fit: BoxFit.fitWidth,
+                  ),
+                ),
+                onTap: () async {
+                  await Navigator.of(context)
+                      .pushNamed(AppRouter.exhibitionDetailPage,
+                          arguments: ExhibitionDetailPayload(
+                            exhibitions: _exhibitionBloc.state.exhibitions!
+                                .map((e) => e.exhibition)
+                                .toList(),
+                            index: index,
+                          ));
+                },
+              ),
+              const SizedBox(height: 20),
+              Row(
+                crossAxisAlignment: CrossAxisAlignment.start,
+                children: [
+                  Expanded(
+                    child: Text(exhibition.title,
+                        style: theme.textTheme.ppMori400White16),
+                  ),
+                  const SizedBox(width: 20),
+                  Expanded(
+                    child: Column(
+                      crossAxisAlignment: CrossAxisAlignment.start,
+                      children: [
+                        if (exhibition.curator != null)
+                          RichText(
+                              text: TextSpan(
+                                  style: theme.textTheme.ppMori400Grey14,
+                                  children: [
+                                TextSpan(text: 'curated_by'.tr()),
+                                TextSpan(
+                                    recognizer: TapGestureRecognizer()
+                                      ..onTap = () async {
+                                        await _navigationService
+                                            .openFeralFileCuratorPage(
+                                                exhibition.curator!.alias);
+                                      },
+                                    text: exhibition.curator!.alias,
+                                    style: const TextStyle(
+                                      decoration: TextDecoration.underline,
+                                    )),
+                              ])),
+                        Text(
+                            exhibition.isGroupExhibition
+                                ? 'group_exhibition'.tr()
+                                : 'solo_exhibition'.tr(),
+                            style: theme.textTheme.ppMori400Grey14),
+                        Text(
+                            '_works'.tr(args: [
+                              exhibitionDetail.artworks?.length.toString() ??
+                                  '-'
+                            ]),
+                            style: theme.textTheme.ppMori400Grey14),
+                      ],
+                    ),
+                  )
+                ],
+              )
+            ],
+          ),
+        ],
+      ),
+    );
+  }
+
+  Widget _listExhibitions(BuildContext context) =>
+      BlocConsumer<ExhibitionBloc, ExhibitionsState>(
+        builder: (context, state) {
+          final exhibitions = state.exhibitions;
+          if (exhibitions == null) {
+            return const Center(
+              child: CircularProgressIndicator(),
+            );
+          }
+          return Column(
+            children: [
+              ...exhibitions
+                  .map((e) => [
+                        _exhibitionItem(context, e, exhibitions.indexOf(e)),
+                        const SizedBox(height: 40)
+                      ])
+                  .flattened,
+              const SizedBox(height: 100),
+            ],
+          );
+        },
+        listener: (context, state) {},
+      );
+}
diff --git a/lib/screen/exhibitions/exhibitions_state.dart b/lib/screen/exhibitions/exhibitions_state.dart
new file mode 100644
index 000000000..a53f2f614
--- /dev/null
+++ b/lib/screen/exhibitions/exhibitions_state.dart
@@ -0,0 +1,22 @@
+import 'package:autonomy_flutter/model/ff_exhibition.dart';
+
+class ExhibitionsEvent {}
+
+class GetAllExhibitionsEvent extends ExhibitionsEvent {}
+
+class GetOpeningExhibitionsEvent extends ExhibitionsEvent {}
+
+class ExhibitionsState {
+  ExhibitionsState({
+    this.exhibitions,
+  });
+
+  final List<ExhibitionDetail>? exhibitions;
+
+  ExhibitionsState copyWith({
+    List<ExhibitionDetail>? exhibitions,
+  }) =>
+      ExhibitionsState(
+        exhibitions: exhibitions ?? this.exhibitions,
+      );
+}
diff --git a/lib/screen/feralfile_artwork_preview/feralfile_artwork_preview_page.dart b/lib/screen/feralfile_artwork_preview/feralfile_artwork_preview_page.dart
new file mode 100644
index 000000000..df3622b5e
--- /dev/null
+++ b/lib/screen/feralfile_artwork_preview/feralfile_artwork_preview_page.dart
@@ -0,0 +1,46 @@
+import 'package:autonomy_flutter/model/ff_account.dart';
+import 'package:autonomy_flutter/screen/detail/artwork_detail_page.dart';
+import 'package:autonomy_flutter/screen/detail/preview_detail/preview_detail_widget.dart';
+import 'package:autonomy_flutter/view/back_appbar.dart';
+import 'package:autonomy_theme/autonomy_theme.dart';
+import 'package:flutter/material.dart';
+
+class FeralFileArtworkPreviewPage extends StatefulWidget {
+  const FeralFileArtworkPreviewPage({required this.payload, super.key});
+
+  final FeralFileArtworkPreviewPagePayload payload;
+
+  @override
+  State<FeralFileArtworkPreviewPage> createState() =>
+      _FeralFileArtworkPreviewPageState();
+}
+
+class _FeralFileArtworkPreviewPageState
+    extends State<FeralFileArtworkPreviewPage> {
+  @override
+  Widget build(BuildContext context) => Scaffold(
+        appBar: getFFAppBar(
+          context,
+          onBack: () => Navigator.pop(context),
+        ),
+        backgroundColor: AppColor.primaryBlack,
+        body: Column(
+          children: [
+            Expanded(
+              child: ArtworkPreviewWidget(
+                identity: ArtworkIdentity(widget.payload.tokenId, ''),
+                useIndexer: true,
+              ),
+            ),
+          ],
+        ),
+      );
+}
+
+class FeralFileArtworkPreviewPagePayload {
+  final Artwork artwork;
+  final String tokenId;
+
+  const FeralFileArtworkPreviewPagePayload(
+      {required this.artwork, required this.tokenId});
+}
diff --git a/lib/screen/feralfile_series/feralfile_series_bloc.dart b/lib/screen/feralfile_series/feralfile_series_bloc.dart
new file mode 100644
index 000000000..2f1131b1e
--- /dev/null
+++ b/lib/screen/feralfile_series/feralfile_series_bloc.dart
@@ -0,0 +1,40 @@
+import 'package:autonomy_flutter/au_bloc.dart';
+import 'package:autonomy_flutter/model/ff_account.dart';
+import 'package:autonomy_flutter/model/ff_exhibition.dart';
+import 'package:autonomy_flutter/model/ff_series.dart';
+import 'package:autonomy_flutter/screen/feralfile_series/feralfile_series_state.dart';
+import 'package:autonomy_flutter/service/feralfile_service.dart';
+import 'package:autonomy_flutter/util/exhibition_ext.dart';
+
+class FeralFileSeriesBloc
+    extends AuBloc<FeralFileSeriesEvent, FeralFileSeriesState> {
+  final FeralFileService _feralFileService;
+
+  FeralFileSeriesBloc(this._feralFileService) : super(FeralFileSeriesState()) {
+    on<FeralFileSeriesGetSeriesEvent>((event, emit) async {
+      final result = await Future.wait([
+        _feralFileService.getSeries(event.seriesId),
+        _feralFileService.getSeriesArtworks(event.seriesId),
+      ]);
+      final series = result[0] as FFSeries;
+      final artworks = result[1] as List<Artwork>;
+      final exhibitionDetail = series.exhibition == null
+          ? null
+          : ExhibitionDetail(
+              exhibition: series.exhibition!,
+              artworks: artworks,
+            );
+      final tokenIds = exhibitionDetail == null
+          ? null
+          : artworks
+              .map((e) => exhibitionDetail.getArtworkTokenId(e) ?? '')
+              .toList();
+      emit(state.copyWith(
+        exhibitionDetail: exhibitionDetail,
+        series: series,
+        artworks: artworks,
+        tokenIds: tokenIds,
+      ));
+    });
+  }
+}
diff --git a/lib/screen/feralfile_series/feralfile_series_page.dart b/lib/screen/feralfile_series/feralfile_series_page.dart
new file mode 100644
index 000000000..719c92b1a
--- /dev/null
+++ b/lib/screen/feralfile_series/feralfile_series_page.dart
@@ -0,0 +1,104 @@
+import 'package:autonomy_flutter/model/ff_account.dart';
+import 'package:autonomy_flutter/model/ff_exhibition.dart';
+import 'package:autonomy_flutter/model/ff_series.dart';
+import 'package:autonomy_flutter/screen/app_router.dart';
+import 'package:autonomy_flutter/screen/feralfile_artwork_preview/feralfile_artwork_preview_page.dart';
+import 'package:autonomy_flutter/screen/feralfile_series/feralfile_series_bloc.dart';
+import 'package:autonomy_flutter/screen/feralfile_series/feralfile_series_state.dart';
+import 'package:autonomy_flutter/util/exhibition_ext.dart';
+import 'package:autonomy_flutter/view/back_appbar.dart';
+import 'package:autonomy_flutter/view/ff_artwork_thumbnail_view.dart';
+import 'package:autonomy_flutter/view/series_title_view.dart';
+import 'package:autonomy_theme/autonomy_theme.dart';
+import 'package:flutter/material.dart';
+import 'package:flutter_bloc/flutter_bloc.dart';
+
+class FeralFileSeriesPage extends StatefulWidget {
+  const FeralFileSeriesPage({required this.payload, super.key});
+
+  final FeralFileSeriesPagePayload payload;
+
+  @override
+  State<FeralFileSeriesPage> createState() => _FeralFileSeriesPageState();
+}
+
+class _FeralFileSeriesPageState extends State<FeralFileSeriesPage> {
+  late final FeralFileSeriesBloc _feralFileSeriesBloc;
+
+  @override
+  void initState() {
+    super.initState();
+    _feralFileSeriesBloc = context.read<FeralFileSeriesBloc>();
+    _feralFileSeriesBloc
+        .add(FeralFileSeriesGetSeriesEvent(widget.payload.seriesId));
+  }
+
+  @override
+  Widget build(BuildContext context) =>
+      BlocConsumer<FeralFileSeriesBloc, FeralFileSeriesState>(
+          builder: (context, state) => Scaffold(
+              appBar: _getAppBar(context, state.series),
+              backgroundColor: AppColor.primaryBlack,
+              body: _body(context, state)),
+          listener: (context, state) {});
+
+  AppBar _getAppBar(BuildContext buildContext, FFSeries? series) => getFFAppBar(
+        buildContext,
+        onBack: () => Navigator.pop(buildContext),
+        title: series == null
+            ? const SizedBox()
+            : SeriesTitleView(
+                series: series,
+                artist: series.artist,
+                crossAxisAlignment: CrossAxisAlignment.center),
+      );
+
+  Widget _body(BuildContext context, FeralFileSeriesState state) {
+    final series = state.series;
+    if (series == null) {
+      return const Center(
+        child: CircularProgressIndicator(),
+      );
+    }
+    return _artworkGridView(context, state.exhibitionDetail, state.artworks);
+  }
+
+  Widget _artworkGridView(BuildContext context,
+          ExhibitionDetail? exhibitionDetail, List<Artwork> artworks) =>
+      Padding(
+        padding: const EdgeInsets.only(left: 14, right: 14, bottom: 20),
+        child: GridView.builder(
+            gridDelegate: const SliverGridDelegateWithFixedCrossAxisCount(
+              crossAxisCount: 3,
+              crossAxisSpacing: 10,
+              mainAxisSpacing: 10,
+            ),
+            itemBuilder: (context, index) {
+              final artwork = artworks[index];
+              return FFArtworkThumbnailView(
+                artwork: artwork,
+                onTap: () async {
+                  final tokenId = exhibitionDetail?.getArtworkTokenId(artwork);
+                  if (tokenId != null) {
+                    await Navigator.of(context).pushNamed(
+                      AppRouter.ffArtworkPreviewPage,
+                      arguments: FeralFileArtworkPreviewPagePayload(
+                        tokenId: tokenId,
+                        artwork: artwork,
+                      ),
+                    );
+                  }
+                },
+              );
+            },
+            itemCount: artworks.length),
+      );
+}
+
+class FeralFileSeriesPagePayload {
+  final String seriesId;
+
+  const FeralFileSeriesPagePayload({
+    required this.seriesId,
+  });
+}
diff --git a/lib/screen/feralfile_series/feralfile_series_state.dart b/lib/screen/feralfile_series/feralfile_series_state.dart
new file mode 100644
index 000000000..19752ce14
--- /dev/null
+++ b/lib/screen/feralfile_series/feralfile_series_state.dart
@@ -0,0 +1,38 @@
+import 'package:autonomy_flutter/model/ff_account.dart';
+import 'package:autonomy_flutter/model/ff_exhibition.dart';
+import 'package:autonomy_flutter/model/ff_series.dart';
+
+class FeralFileSeriesEvent {}
+
+class FeralFileSeriesGetSeriesEvent extends FeralFileSeriesEvent {
+  final String seriesId;
+
+  FeralFileSeriesGetSeriesEvent(this.seriesId);
+}
+
+class FeralFileSeriesState {
+  final ExhibitionDetail? exhibitionDetail;
+  final FFSeries? series;
+  final List<Artwork> artworks;
+  final List<String> tokenIds;
+
+  FeralFileSeriesState({
+    this.exhibitionDetail,
+    this.series,
+    this.artworks = const [],
+    this.tokenIds = const [],
+  });
+
+  FeralFileSeriesState copyWith({
+    ExhibitionDetail? exhibitionDetail,
+    FFSeries? series,
+    List<Artwork>? artworks,
+    List<String>? tokenIds,
+  }) =>
+      FeralFileSeriesState(
+        exhibitionDetail: exhibitionDetail ?? this.exhibitionDetail,
+        series: series ?? this.series,
+        artworks: artworks ?? this.artworks,
+        tokenIds: tokenIds ?? this.tokenIds,
+      );
+}
diff --git a/lib/screen/global_receive/receive_page.dart b/lib/screen/global_receive/receive_page.dart
index e9c39b893..2f5719105 100644
--- a/lib/screen/global_receive/receive_page.dart
+++ b/lib/screen/global_receive/receive_page.dart
@@ -16,7 +16,12 @@ import 'package:flutter/material.dart';
 import 'package:flutter_bloc/flutter_bloc.dart';
 
 class GlobalReceivePage extends StatefulWidget {
-  const GlobalReceivePage({Key? key}) : super(key: key);
+  final Function()? onClose;
+
+  const GlobalReceivePage({
+    super.key,
+    this.onClose,
+  });
 
   @override
   State<GlobalReceivePage> createState() => _GlobalReceivePageState();
@@ -36,8 +41,8 @@ class _GlobalReceivePageState extends State<GlobalReceivePage> {
     return Scaffold(
       appBar: getCloseAppBar(
         context,
-        title: "select_wallet_tt".tr(),
-        onClose: () => Navigator.of(context).pop(),
+        title: 'select_wallet_tt'.tr(),
+        onClose: widget.onClose,
       ),
       body: BlocBuilder<AccountsBloc, AccountsState>(builder: (context, state) {
         final categorizedAccounts = state.accounts;
@@ -56,7 +61,7 @@ class _GlobalReceivePageState extends State<GlobalReceivePage> {
               Padding(
                 padding: ResponsiveLayout.pageEdgeInsets,
                 child: Text(
-                  "select_address".tr(),
+                  'select_address'.tr(),
                   style: theme.textTheme.ppMori400Black14,
                 ),
               ),
@@ -64,12 +69,13 @@ class _GlobalReceivePageState extends State<GlobalReceivePage> {
               ListView.builder(
                   shrinkWrap: true,
                   physics: const NeverScrollableScrollPhysics(),
-                  itemBuilder: ((context, index) => Container(
+                  itemBuilder: (context, index) => Container(
                         padding: const EdgeInsets.only(top: 16),
                         child: accountWithConnectionItem(
                             context, categorizedAccounts[index]),
-                      )),
+                      ),
                   itemCount: categorizedAccounts.length),
+              const SizedBox(height: 100),
             ],
           ),
         );
diff --git a/lib/screen/home/home_page.dart b/lib/screen/home/collection_home_page.dart
similarity index 64%
rename from lib/screen/home/home_page.dart
rename to lib/screen/home/collection_home_page.dart
index 27a3f763f..8715c5d71 100644
--- a/lib/screen/home/home_page.dart
+++ b/lib/screen/home/collection_home_page.dart
@@ -6,8 +6,6 @@
 //
 
 import 'dart:async';
-import 'dart:convert';
-import 'dart:io';
 
 import 'package:after_layout/after_layout.dart';
 import 'package:autonomy_flutter/common/injector.dart';
@@ -19,12 +17,9 @@ import 'package:autonomy_flutter/screen/detail/artwork_detail_page.dart';
 import 'package:autonomy_flutter/screen/home/home_bloc.dart';
 import 'package:autonomy_flutter/screen/home/home_state.dart';
 import 'package:autonomy_flutter/screen/interactive_postcard/postcard_detail_page.dart';
-import 'package:autonomy_flutter/screen/playlists/list_playlists/list_playlists.dart';
-import 'package:autonomy_flutter/screen/scan_qr/scan_qr_page.dart';
 import 'package:autonomy_flutter/service/account_service.dart';
 import 'package:autonomy_flutter/service/autonomy_service.dart';
 import 'package:autonomy_flutter/service/client_token_service.dart';
-import 'package:autonomy_flutter/service/cloud_service.dart';
 import 'package:autonomy_flutter/service/configuration_service.dart';
 import 'package:autonomy_flutter/service/customer_support_service.dart';
 import 'package:autonomy_flutter/service/iap_service.dart';
@@ -39,39 +34,31 @@ import 'package:autonomy_flutter/util/style.dart';
 import 'package:autonomy_flutter/util/token_ext.dart';
 import 'package:autonomy_flutter/view/artwork_common_widget.dart';
 import 'package:autonomy_flutter/view/back_appbar.dart';
-import 'package:autonomy_flutter/view/carousel.dart';
 import 'package:autonomy_flutter/view/header.dart';
 import 'package:autonomy_flutter/view/responsive.dart';
-import 'package:autonomy_flutter/view/tip_card.dart';
 import 'package:autonomy_theme/autonomy_theme.dart';
 import 'package:connectivity_plus/connectivity_plus.dart';
-import 'package:crypto/crypto.dart';
 import 'package:dio/dio.dart';
 import 'package:easy_localization/easy_localization.dart';
-import 'package:flutter/gestures.dart';
 import 'package:flutter/material.dart';
 import 'package:flutter_bloc/flutter_bloc.dart';
 import 'package:flutter_fgbg/flutter_fgbg.dart';
-import 'package:multi_value_listenable_builder/multi_value_listenable_builder.dart';
 import 'package:nft_collection/models/models.dart';
 import 'package:nft_collection/nft_collection.dart';
-import 'package:open_settings/open_settings.dart';
-import 'package:permission_handler/permission_handler.dart';
 import 'package:sentry_flutter/sentry_flutter.dart';
-import 'package:url_launcher/url_launcher.dart';
 
-class HomePage extends StatefulWidget {
-  const HomePage({super.key});
+class CollectionHomePage extends StatefulWidget {
+  const CollectionHomePage({super.key});
 
   @override
-  State<HomePage> createState() => HomePageState();
+  State<CollectionHomePage> createState() => CollectionHomePageState();
 }
 
-class HomePageState extends State<HomePage>
+class CollectionHomePageState extends State<CollectionHomePage>
     with
         RouteAware,
         WidgetsBindingObserver,
-        AfterLayoutMixin<HomePage>,
+        AfterLayoutMixin<CollectionHomePage>,
         AutomaticKeepAliveClientMixin {
   StreamSubscription<FGBGType>? _fgbgSubscription;
   late ScrollController _controller;
@@ -228,7 +215,6 @@ class HomePageState extends State<HomePage>
   @override
   Widget build(BuildContext context) {
     super.build(context);
-    final theme = Theme.of(context);
     final contentWidget =
         BlocConsumer<NftCollectionBloc, NftCollectionBlocState>(
       bloc: nftBloc,
@@ -251,41 +237,49 @@ class HomePageState extends State<HomePage>
     return PrimaryScrollController(
       controller: _controller,
       child: Scaffold(
-        appBar: getLightEmptyAppBar(),
-        backgroundColor: theme.colorScheme.background,
+        appBar: getDarkEmptyAppBar(Colors.transparent),
+        extendBody: true,
+        extendBodyBehindAppBar: true,
+        backgroundColor: AppColor.primaryBlack,
         body: contentWidget,
       ),
     );
   }
 
-  Widget _loadingView(BuildContext context) {
+  Widget _header(BuildContext context) {
     final paddingTop = MediaQuery.of(context).viewPadding.top;
-
-    return Center(
-        child: Column(
-      children: [
-        HeaderView(
-          paddingTop: paddingTop,
-        ),
-        loadingIndicator(),
-      ],
-    ));
+    return Padding(
+      padding: EdgeInsets.only(top: paddingTop),
+      child: HeaderView(title: 'collection'.tr()),
+    );
   }
 
+  Widget _loadingView(BuildContext context) => Center(
+          child: Column(
+        children: [
+          SizedBox(
+            height: MediaQuery.of(context).padding.top,
+          ),
+          _header(context),
+          loadingIndicator(valueColor: AppColor.white),
+        ],
+      ));
+
   Widget _emptyGallery(BuildContext context) {
     final theme = Theme.of(context);
-    final paddingTop = MediaQuery.of(context).viewPadding.top;
     return ListView(
       padding: ResponsiveLayout.getPadding.copyWith(left: 0, right: 0),
       children: [
-        HeaderView(paddingTop: paddingTop),
-        _carouselTipcard(context),
+        SizedBox(
+          height: MediaQuery.of(context).padding.top,
+        ),
+        _header(context),
         Padding(
           padding: const EdgeInsets.only(left: 15),
           child: Text(
             'collection_empty_now'.tr(),
             //"Your collection is empty for now.",
-            style: theme.textTheme.ppMori400Black14,
+            style: theme.textTheme.ppMori400White14,
           ),
         ),
       ],
@@ -303,13 +297,6 @@ class HomePageState extends State<HomePage>
     const double cellSpacing = 3;
     int cellPerRow =
         ResponsiveLayout.isMobile ? cellPerRowPhone : cellPerRowTablet;
-    final playlistIDsString = injector<ConfigurationService>()
-        .getPlayList()
-        .map((e) => e.id)
-        .toList()
-        .join();
-    final playlistKeyBytes = utf8.encode(playlistIDsString);
-    final playlistKey = sha256.convert(playlistKeyBytes).toString();
     if (_cachedImageSize == 0) {
       final estimatedCellWidth =
           MediaQuery.of(context).size.width / cellPerRow -
@@ -317,21 +304,14 @@ class HomePageState extends State<HomePage>
       _cachedImageSize = (estimatedCellWidth * 3).ceil();
     }
     List<Widget> sources;
-    final paddingTop = MediaQuery.of(context).viewPadding.top;
     sources = [
       SliverToBoxAdapter(
-        child: HeaderView(paddingTop: paddingTop),
+        child: SizedBox(
+          height: MediaQuery.of(context).padding.top,
+        ),
       ),
       SliverToBoxAdapter(
-        child: _carouselTipcard(context),
-      ),
-      SliverToBoxAdapter(
-        child: Padding(
-          padding: const EdgeInsets.only(bottom: 15),
-          child: ListPlaylistsScreen(
-            key: Key(playlistKey),
-          ),
-        ),
+        child: _header(context),
       ),
       SliverGrid(
         gridDelegate: SliverGridDelegateWithFixedCrossAxisCount(
@@ -390,7 +370,7 @@ class HomePageState extends State<HomePage>
           childCount: tokens.length,
         ),
       ),
-      const SliverToBoxAdapter(child: SizedBox(height: 30)),
+      const SliverToBoxAdapter(child: SizedBox(height: 100)),
     ];
 
     return CustomScrollView(
@@ -400,106 +380,6 @@ class HomePageState extends State<HomePage>
     );
   }
 
-  Widget _carouselTipcard(BuildContext context) => MultiValueListenableBuilder(
-        valueListenables: [
-          _configurationService.showTvAppTip,
-          _configurationService.showCreatePlaylistTip,
-          _configurationService.showLinkOrImportTip,
-          _configurationService.showBackupSettingTip,
-        ],
-        builder: (BuildContext context, List<dynamic> values, Widget? child) =>
-            CarouselWithIndicator(
-          items: _listTipcards(context, values),
-        ),
-      );
-
-  List<Tipcard> _listTipcards(BuildContext context, List<dynamic> values) {
-    final theme = Theme.of(context);
-    final isShowTvAppTip = values[0] as bool;
-    final isShowCreatePlaylistTip = values[1] as bool;
-    final isShowLinkOrImportTip = values[2] as bool;
-    final isShowBackupSettingTip = values[3] as bool;
-    return [
-      if (isShowLinkOrImportTip)
-        Tipcard(
-            titleText: 'do_you_have_NFTs_in_other_wallets'.tr(),
-            onPressed: () {},
-            buttonText: 'add_wallet'.tr(),
-            content: Text('you_can_link_or_import'.tr(),
-                style: theme.textTheme.ppMori400Black14),
-            listener: _configurationService.showLinkOrImportTip),
-      if (isShowCreatePlaylistTip)
-        Tipcard(
-            titleText: 'create_your_first_playlist'.tr(),
-            onPressed: () {
-              unawaited(Navigator.of(context)
-                  .pushNamed(AppRouter.createPlayListPage));
-            },
-            buttonText: 'create_new_playlist'.tr(),
-            content: Text('as_a_pro_sub_playlist'.tr(),
-                style: theme.textTheme.ppMori400Black14),
-            listener: _configurationService.showCreatePlaylistTip),
-      if (isShowTvAppTip)
-        Tipcard(
-            titleText: 'enjoy_your_collection'.tr(),
-            onPressed: () {
-              unawaited(Navigator.of(context).pushNamed(
-                AppRouter.scanQRPage,
-                arguments: ScannerItem.GLOBAL,
-              ));
-            },
-            buttonText: 'sync_up_with_autonomy_tv'.tr(),
-            content: RichText(
-              text: TextSpan(
-                text: 'as_a_pro_sub_TV_app'.tr(),
-                style: theme.textTheme.ppMori400Black14,
-                children: [
-                  TextSpan(
-                    text: 'google_TV_app'.tr(),
-                    style: theme.textTheme.ppMori400Black14.copyWith(
-                        color: theme.colorScheme.primary,
-                        decoration: TextDecoration.underline),
-                    recognizer: TapGestureRecognizer()
-                      ..onTap = () {
-                        final metricClient = injector<MetricClientService>();
-                        unawaited(metricClient
-                            .addEvent(MixpanelEvent.tapLinkInTipCard, data: {
-                          'link': TV_APP_STORE_URL,
-                          'title': 'enjoy_your_collection'.tr()
-                        }));
-                        unawaited(launchUrl(Uri.parse(TV_APP_STORE_URL),
-                            mode: LaunchMode.externalApplication));
-                      },
-                  ),
-                  TextSpan(
-                    text: 'currently_available_on'.tr(),
-                  )
-                ],
-              ),
-            ),
-            listener: _configurationService.showTvAppTip),
-      if (isShowBackupSettingTip)
-        Tipcard(
-            titleText: 'backup_failed'.tr(),
-            onPressed: Platform.isAndroid
-                ? () {
-                    unawaited(OpenSettings.openAddAccountSetting());
-                  }
-                : () async {
-                    unawaited(openAppSettings());
-                  },
-            buttonText: Platform.isAndroid
-                ? 'open_device_setting'.tr()
-                : 'open_icloud_setting'.tr(),
-            content: Text(
-                Platform.isAndroid
-                    ? 'backup_tip_card_content_android'.tr()
-                    : 'backup_tip_card_content_ios'.tr(),
-                style: theme.textTheme.ppMori400Black14),
-            listener: _configurationService.showBackupSettingTip),
-    ];
-  }
-
   Future<void> _checkForKeySync(BuildContext context) async {
     final cloudDatabase = injector<CloudDatabase>();
     final defaultAccounts = await cloudDatabase.personaDao.getDefaultPersonas();
@@ -533,53 +413,11 @@ class HomePageState extends State<HomePage>
     }
   }
 
-  Future _checkTipCardShowTime() async {
-    final metricClient = injector<MetricClientService>();
-    log.info('_checkTipCardShowTime');
-    final configurationService = injector<ConfigurationService>();
-
-    final doneOnboardingTime = configurationService.getDoneOnboardingTime();
-
-    final now = DateTime.now();
-
-    final remindTime = configurationService.getShowBackupSettingTip();
-    final shouldRemindNow = remindTime == null || now.isAfter(remindTime);
-    if (shouldRemindNow) {
-      unawaited(configurationService
-          .setShowBackupSettingTip(now.add(const Duration(days: 7))));
-      bool showTip = false;
-      if (Platform.isAndroid) {
-        final isAndroidEndToEndEncryptionAvailable =
-            await injector<AccountService>()
-                .isAndroidEndToEndEncryptionAvailable();
-        showTip = isAndroidEndToEndEncryptionAvailable != true;
-      } else {
-        final iCloudAvailable = injector<CloudService>().isAvailableNotifier;
-        showTip = !iCloudAvailable.value;
-      }
-      if (showTip && !configurationService.showBackupSettingTip.value) {
-        configurationService.showBackupSettingTip.value = true;
-        unawaited(metricClient.addEvent(MixpanelEvent.showTipcard,
-            data: {'title': 'backup_failed'.tr()}));
-      }
-    }
-    if (doneOnboardingTime != null) {
-      if (now.isAfter(doneOnboardingTime.add(const Duration(hours: 24))) &&
-          !configurationService.getAlreadyShowLinkOrImportTip()) {
-        configurationService.showLinkOrImportTip.value = true;
-        unawaited(configurationService.setAlreadyShowLinkOrImportTip(true));
-        unawaited(metricClient.addEvent(MixpanelEvent.showTipcard,
-            data: {'title': 'do_you_have_NFTs_in_other_wallets'.tr()}));
-      }
-    }
-  }
-
   Future<void> _handleForeground() async {
     final locale = Localizations.localeOf(context);
     unawaited(LocaleService.refresh(locale));
     memoryValues.inForegroundAt = DateTime.now();
     await injector<ConfigurationService>().reload();
-    await _checkTipCardShowTime();
     try {
       await injector<SettingsDataService>().restoreSettingsData();
     } catch (exception) {
diff --git a/lib/screen/home/home_navigation_page.dart b/lib/screen/home/home_navigation_page.dart
index 34b6771e6..143ea4b2f 100644
--- a/lib/screen/home/home_navigation_page.dart
+++ b/lib/screen/home/home_navigation_page.dart
@@ -12,14 +12,16 @@ import 'package:autonomy_flutter/common/injector.dart';
 import 'package:autonomy_flutter/database/entity/announcement_local.dart';
 import 'package:autonomy_flutter/main.dart';
 import 'package:autonomy_flutter/screen/app_router.dart';
-import 'package:autonomy_flutter/screen/bloc/accounts/accounts_bloc.dart';
 import 'package:autonomy_flutter/screen/customer_support/support_thread_page.dart';
 import 'package:autonomy_flutter/screen/detail/artwork_detail_page.dart';
-import 'package:autonomy_flutter/screen/home/home_page.dart';
+import 'package:autonomy_flutter/screen/exhibitions/exhibitions_bloc.dart';
+import 'package:autonomy_flutter/screen/exhibitions/exhibitions_page.dart';
+import 'package:autonomy_flutter/screen/exhibitions/exhibitions_state.dart';
+import 'package:autonomy_flutter/screen/home/collection_home_page.dart';
+import 'package:autonomy_flutter/screen/home/organize_home_page.dart';
 import 'package:autonomy_flutter/screen/interactive_postcard/postcard_detail_bloc.dart';
 import 'package:autonomy_flutter/screen/interactive_postcard/postcard_detail_page.dart';
 import 'package:autonomy_flutter/screen/scan_qr/scan_qr_page.dart';
-import 'package:autonomy_flutter/screen/wallet/wallet_page.dart';
 import 'package:autonomy_flutter/service/account_service.dart';
 import 'package:autonomy_flutter/service/airdrop_service.dart';
 import 'package:autonomy_flutter/service/audit_service.dart';
@@ -43,6 +45,7 @@ import 'package:autonomy_flutter/util/inapp_notifications.dart';
 import 'package:autonomy_flutter/util/log.dart';
 import 'package:autonomy_flutter/util/style.dart';
 import 'package:autonomy_flutter/util/ui_helper.dart';
+import 'package:autonomy_flutter/view/homepage_navigation_bar.dart';
 import 'package:autonomy_flutter/view/user_agent_utils.dart';
 import 'package:autonomy_theme/autonomy_theme.dart';
 import 'package:dio/dio.dart';
@@ -50,7 +53,9 @@ import 'package:easy_localization/easy_localization.dart';
 import 'package:flutter/material.dart';
 import 'package:flutter_bloc/flutter_bloc.dart';
 import 'package:flutter_fgbg/flutter_fgbg.dart';
+import 'package:flutter_keyboard_visibility/flutter_keyboard_visibility.dart';
 import 'package:flutter_markdown/flutter_markdown.dart';
+import 'package:flutter_svg/flutter_svg.dart';
 import 'package:nft_collection/database/dao/asset_token_dao.dart';
 import 'package:nft_collection/database/nft_collection_database.dart';
 import 'package:nft_collection/nft_collection.dart';
@@ -74,8 +79,10 @@ class _HomeNavigationPageState extends State<HomeNavigationPage>
   int _selectedIndex = 0;
   late PageController _pageController;
   late List<Widget> _pages;
-  late List<BottomNavigationBarItem> _bottomItems;
-  final GlobalKey<HomePageState> _homePageKey = GlobalKey();
+  final GlobalKey<OrganizeHomePageState> _organizeHomePageKey = GlobalKey();
+  final GlobalKey<CollectionHomePageState> _collectionHomePageKey = GlobalKey();
+  final GlobalKey<ExhibitionsPageState> _exhibitionsPageKey = GlobalKey();
+  final GlobalKey<ScanQRPageState> _scanQRPageKey = GlobalKey();
   final _configurationService = injector<ConfigurationService>();
   late Timer? _timer;
   final _clientTokenService = injector<ClientTokenService>();
@@ -83,6 +90,7 @@ class _HomeNavigationPageState extends State<HomeNavigationPage>
   final _notificationService = injector<NotificationService>();
   final _playListService = injector<PlaylistService>();
   final _remoteConfig = injector<RemoteConfigService>();
+  late HomeNavigatorTab _initialTab;
 
   StreamSubscription<FGBGType>? _fgbgSubscription;
 
@@ -92,39 +100,71 @@ class _HomeNavigationPageState extends State<HomeNavigationPage>
     routeObserver.subscribe(this, ModalRoute.of(context)!);
   }
 
-  void _onItemTapped(int index) {
+  Future<void> _onItemTapped(int index) async {
     if (index < _pages.length) {
       if (_selectedIndex == index) {
-        if (index == 0) {
-          _homePageKey.currentState?.scrollToTop();
+        if (index == HomeNavigatorTab.collection.index) {
+          _collectionHomePageKey.currentState?.scrollToTop();
+        }
+        if (index == HomeNavigatorTab.organization.index) {
+          _organizeHomePageKey.currentState?.scrollToTop();
+        }
+        if (index == HomeNavigatorTab.exhibition.index) {
+          _exhibitionsPageKey.currentState?.scrollToTop();
+        }
+      } else {
+        if (index == HomeNavigatorTab.scanQr.index) {
+          await _scanQRPageKey.currentState?.resumeCamera();
+        } else {
+          await _scanQRPageKey.currentState?.pauseCamera();
         }
       }
       setState(() {
         _selectedIndex = index;
       });
       _pageController.jumpToPage(_selectedIndex);
-      if (index == 0) {
+      if (index == HomeNavigatorTab.collection.index ||
+          index == HomeNavigatorTab.organization.index) {
         unawaited(_clientTokenService.refreshTokens());
         unawaited(_playListService.refreshPlayLists());
       }
-    } else if (index == _pages.length) {
-      unawaited(Navigator.of(context).pushNamed(
-        AppRouter.scanQRPage,
-        arguments: ScannerItem.GLOBAL,
-      ));
     } else {
-      unawaited(UIHelper.showDrawerAction(
+      final currentIndex = _selectedIndex;
+      setState(() {
+        _selectedIndex = index;
+      });
+      await UIHelper.showCenterMenu(
         context,
         options: [
           OptionItem(
-              title: 'Settings',
-              icon: const Icon(
-                AuIcon.settings,
-              ),
-              onTap: () {
-                Navigator.pop(context);
-                Navigator.of(context).pushNamed(AppRouter.settingsPage);
-              }),
+            title: 'moma_postcard'.tr(),
+            icon: SvgPicture.asset(
+              'assets/images/icon_3d.svg',
+              colorFilter: const ColorFilter.mode(
+                  AppColor.white, BlendMode.srcIn), // white
+            ),
+            onTap: () {
+              Navigator.of(context).popAndPushNamed(AppRouter.momaPostcardPage);
+            },
+          ),
+          OptionItem(
+            title: 'addresses'.tr(),
+            icon: const Icon(
+              AuIcon.wallet,
+            ),
+            onTap: () {
+              Navigator.of(context).popAndPushNamed(AppRouter.walletPage);
+            },
+          ),
+          OptionItem(
+            title: 'Settings',
+            icon: const Icon(
+              AuIcon.settings,
+            ),
+            onTap: () {
+              Navigator.of(context).popAndPushNamed(AppRouter.settingsPage);
+            },
+          ),
           OptionItem(
               title: 'Help',
               icon: ValueListenableBuilder<List<int>?>(
@@ -142,11 +182,19 @@ class _HomeNavigationPageState extends State<HomeNavigationPage>
                 ),
               ),
               onTap: () {
-                Navigator.pop(context);
-                Navigator.of(context).pushNamed(AppRouter.supportCustomerPage);
+                Navigator.of(context)
+                    .popAndPushNamed(AppRouter.supportCustomerPage);
               }),
         ],
-      ));
+      );
+      if (mounted) {
+        setState(() {
+          _selectedIndex = currentIndex;
+        });
+        if (_selectedIndex == HomeNavigatorTab.scanQr.index) {
+          await _scanQRPageKey.currentState?.resumeCamera();
+        }
+      }
     }
   }
 
@@ -154,7 +202,8 @@ class _HomeNavigationPageState extends State<HomeNavigationPage>
   void initState() {
     unawaited(injector<CustomerSupportService>().getIssuesAndAnnouncement());
     super.initState();
-    _selectedIndex = HomeNavigatorTab.COLLECTION.index;
+    _initialTab = HomeNavigatorTab.exhibition;
+    _selectedIndex = _initialTab.index;
     _pageController = PageController(initialPage: _selectedIndex);
 
     unawaited(_clientTokenService.refreshTokens());
@@ -164,55 +213,19 @@ class _HomeNavigationPageState extends State<HomeNavigationPage>
     });
 
     _pages = <Widget>[
-      HomePage(key: _homePageKey),
-      MultiBlocProvider(
-        providers: [
-          BlocProvider.value(value: AccountsBloc(injector(), injector())),
-        ],
-        child: const WalletPage(),
-      ),
-    ];
-    _bottomItems = [
-      const BottomNavigationBarItem(
-        icon: Icon(
-          AuIcon.playlists,
-          size: 25,
-        ),
-        label: '',
-      ),
-      const BottomNavigationBarItem(
-        icon: Icon(
-          AuIcon.wallet,
-          size: 25,
-        ),
-        label: '',
-      ),
-      const BottomNavigationBarItem(
-        icon: Icon(
-          AuIcon.scan,
-          size: 25,
-        ),
-        label: '',
-      ),
-      BottomNavigationBarItem(
-        icon: ValueListenableBuilder<List<int>?>(
-          valueListenable:
-              injector<CustomerSupportService>().numberOfIssuesInfo,
-          builder: (BuildContext context, List<int>? numberOfIssuesInfo,
-                  Widget? child) =>
-              iconWithRedDot(
-            icon: const Icon(
-              AuIcon.drawer,
-              size: 25,
-            ),
-            padding: const EdgeInsets.only(right: 2, top: 2),
-            withReddot: numberOfIssuesInfo != null && numberOfIssuesInfo[1] > 0,
-          ),
-        ),
-        label: '',
-      ),
+      CollectionHomePage(key: _collectionHomePageKey),
+      OrganizeHomePage(key: _organizeHomePageKey),
+      MultiBlocProvider(providers: [
+        BlocProvider.value(
+            value: ExhibitionBloc(injector())..add(GetAllExhibitionsEvent())),
+      ], child: const ExhibitionsPage()),
+      ScanQRPage(
+        key: _scanQRPageKey,
+        onHandleFinished: () async {
+          await _onItemTapped(_initialTab.index);
+        },
+      )
     ];
-
     if (!_configurationService.isReadRemoveSupport()) {
       unawaited(_showRemoveCustomerSupport());
     }
@@ -249,6 +262,9 @@ class _HomeNavigationPageState extends State<HomeNavigationPage>
   Future<void> didPopNext() async {
     super.didPopNext();
     unawaited(injector<CustomerSupportService>().getIssuesAndAnnouncement());
+    if (_selectedIndex == HomeNavigatorTab.scanQr.index) {
+      await _scanQRPageKey.currentState?.resumeCamera();
+    }
   }
 
   Future<void> _showRemoveCustomerSupport() async {
@@ -300,25 +316,121 @@ class _HomeNavigationPageState extends State<HomeNavigationPage>
   }
 
   @override
-  Widget build(BuildContext context) {
-    final theme = Theme.of(context);
-    return Scaffold(
-      bottomNavigationBar: BottomNavigationBar(
-        showSelectedLabels: false,
-        showUnselectedLabels: false,
-        currentIndex: _selectedIndex,
-        unselectedItemColor: theme.disabledColor,
-        selectedItemColor: theme.primaryColor,
-        backgroundColor: theme.colorScheme.background.withOpacity(0.95),
-        type: BottomNavigationBarType.fixed,
-        onTap: _onItemTapped,
-        items: _bottomItems,
+  Widget build(BuildContext context) => Scaffold(
+        backgroundColor: AppColor.primaryBlack,
+        body: SafeArea(
+          top: false,
+          child: Stack(
+            children: [
+              PageView(
+                controller: _pageController,
+                physics: const NeverScrollableScrollPhysics(),
+                children: _pages,
+              ),
+              KeyboardVisibilityBuilder(
+                builder: (context, isKeyboardVisible) => isKeyboardVisible
+                    ? const SizedBox()
+                    : Positioned.fill(
+                        bottom: 40,
+                        child: Align(
+                          alignment: Alignment.bottomCenter,
+                          child: _buildBottomNavigationBar(context),
+                        ),
+                      ),
+              ),
+            ],
+          ),
+        ),
+      );
+
+  Widget _buildBottomNavigationBar(BuildContext context) {
+    const selectedColor = AppColor.white;
+    const unselectedColor = AppColor.disabledColor;
+    const selectedColorFilter =
+        ColorFilter.mode(selectedColor, BlendMode.srcIn);
+    const unselectedColorFilter =
+        ColorFilter.mode(unselectedColor, BlendMode.srcIn);
+    const iconSize = 25.0;
+    final bottomItems = [
+      FFNavigationBarItem(
+        icon: SvgPicture.asset(
+          'assets/images/icon_collection.svg',
+          height: iconSize,
+          colorFilter: selectedColorFilter,
+        ),
+        unselectedIcon: SvgPicture.asset(
+          'assets/images/icon_collection.svg',
+          height: iconSize,
+          colorFilter: unselectedColorFilter,
+        ),
+        label: '',
+      ),
+      FFNavigationBarItem(
+        icon: SvgPicture.asset(
+          'assets/images/set_icon.svg',
+          height: iconSize,
+          colorFilter: selectedColorFilter,
+        ),
+        unselectedIcon: SvgPicture.asset(
+          'assets/images/set_icon.svg',
+          height: iconSize,
+          colorFilter: unselectedColorFilter,
+        ),
+        label: '',
       ),
-      body: PageView(
-        controller: _pageController,
-        physics: const NeverScrollableScrollPhysics(),
-        children: _pages,
+      FFNavigationBarItem(
+        icon: SvgPicture.asset(
+          'assets/images/controller_icon.svg',
+          height: iconSize,
+          colorFilter: selectedColorFilter,
+        ),
+        unselectedIcon: SvgPicture.asset(
+          'assets/images/controller_icon.svg',
+          height: iconSize,
+          colorFilter: unselectedColorFilter,
+        ),
+        label: '',
       ),
+      FFNavigationBarItem(
+        icon: SvgPicture.asset(
+          'assets/images/icon_scan.svg',
+          height: iconSize,
+          colorFilter: selectedColorFilter,
+        ),
+        unselectedIcon: SvgPicture.asset(
+          'assets/images/icon_scan.svg',
+          height: iconSize,
+          colorFilter: unselectedColorFilter,
+        ),
+        label: '',
+      ),
+      FFNavigationBarItem(
+        icon: ValueListenableBuilder<List<int>?>(
+          valueListenable:
+              injector<CustomerSupportService>().numberOfIssuesInfo,
+          builder: (BuildContext context, List<int>? numberOfIssuesInfo,
+                  Widget? child) =>
+              iconWithRedDot(
+            icon: SvgPicture.asset(
+              'assets/images/icon_drawer.svg',
+              height: iconSize,
+              colorFilter: unselectedColorFilter,
+            ),
+            padding: const EdgeInsets.only(right: 2, top: 2),
+            withReddot: numberOfIssuesInfo != null && numberOfIssuesInfo[1] > 0,
+          ),
+        ),
+        selectedColor: unselectedColor,
+        label: '',
+      ),
+    ];
+    return FFNavigationBar(
+      items: bottomItems,
+      selectedItemColor: selectedColor,
+      unselectedItemColor: unselectedColor,
+      backgroundColor: AppColor.auGreyBackground,
+      onSelectTab: _onItemTapped,
+      currentIndex: _selectedIndex,
     );
   }
 
@@ -362,7 +474,7 @@ class _HomeNavigationPageState extends State<HomeNavigationPage>
             addOnTextSpan: [
               TextSpan(
                   text: 'tap_to_view'.tr(),
-                  style: Theme.of(context).textTheme.ppMori400Green14),
+                  style: Theme.of(context).textTheme.ppMori400FFYellow14),
             ], openHandler: () async {
           final announcementID = '${data["id"]}';
           unawaited(_openAnnouncement(announcementID));
@@ -406,7 +518,7 @@ class _HomeNavigationPageState extends State<HomeNavigationPage>
         Navigator.of(context).popUntil((route) =>
             route.settings.name == AppRouter.homePage ||
             route.settings.name == AppRouter.homePageNoTransition);
-        _pageController.jumpToPage(HomeNavigatorTab.COLLECTION.index);
+        _pageController.jumpToPage(HomeNavigatorTab.collection.index);
         break;
 
       case 'customer_support_new_message':
@@ -438,7 +550,7 @@ class _HomeNavigationPageState extends State<HomeNavigationPage>
         Navigator.of(context).popUntil((route) =>
             route.settings.name == AppRouter.homePage ||
             route.settings.name == AppRouter.homePageNoTransition);
-        _pageController.jumpToPage(HomeNavigatorTab.COLLECTION.index);
+        _pageController.jumpToPage(HomeNavigatorTab.collection.index);
         break;
       case 'new_message':
         if (!_remoteConfig.getBool(ConfigGroup.viewDetail, ConfigKey.chat)) {
@@ -563,7 +675,7 @@ class _HomeNavigationPageState extends State<HomeNavigationPage>
         addOnTextSpan: [
           TextSpan(
               text: 'tap_to_view'.tr(),
-              style: Theme.of(context).textTheme.ppMori400Green14),
+              style: Theme.of(context).textTheme.ppMori400FFYellow14),
         ], openHandler: () async {
       final announcementID = announcement.announcementContextId;
       unawaited(_openAnnouncement(announcementID));
diff --git a/lib/screen/home/organize_home_page.dart b/lib/screen/home/organize_home_page.dart
new file mode 100644
index 000000000..e38c793b9
--- /dev/null
+++ b/lib/screen/home/organize_home_page.dart
@@ -0,0 +1,204 @@
+//
+//  SPDX-License-Identifier: BSD-2-Clause-Patent
+//  Copyright © 2022 Bitmark. All rights reserved.
+//  Use of this source code is governed by the BSD-2-Clause Plus Patent License
+//  that can be found in the LICENSE file.
+//
+
+import 'dart:async';
+
+import 'package:after_layout/after_layout.dart';
+import 'package:autonomy_flutter/common/injector.dart';
+import 'package:autonomy_flutter/main.dart';
+import 'package:autonomy_flutter/model/blockchain.dart';
+import 'package:autonomy_flutter/screen/app_router.dart';
+import 'package:autonomy_flutter/screen/collection_pro/collection_pro_screen.dart';
+import 'package:autonomy_flutter/screen/home/home_bloc.dart';
+import 'package:autonomy_flutter/screen/home/home_state.dart';
+import 'package:autonomy_flutter/screen/interactive_postcard/postcard_detail_page.dart';
+import 'package:autonomy_flutter/service/account_service.dart';
+import 'package:autonomy_flutter/service/autonomy_service.dart';
+import 'package:autonomy_flutter/service/client_token_service.dart';
+import 'package:autonomy_flutter/service/configuration_service.dart';
+import 'package:autonomy_flutter/service/iap_service.dart';
+import 'package:autonomy_flutter/service/metric_client_service.dart';
+import 'package:autonomy_flutter/util/asset_token_ext.dart';
+import 'package:autonomy_flutter/util/constants.dart';
+import 'package:autonomy_flutter/util/log.dart';
+import 'package:autonomy_flutter/util/token_ext.dart';
+import 'package:autonomy_flutter/view/back_appbar.dart';
+import 'package:autonomy_theme/autonomy_theme.dart';
+import 'package:flutter/material.dart';
+import 'package:flutter_bloc/flutter_bloc.dart';
+import 'package:flutter_fgbg/flutter_fgbg.dart';
+import 'package:nft_collection/models/models.dart';
+import 'package:nft_collection/nft_collection.dart';
+
+class OrganizeHomePage extends StatefulWidget {
+  const OrganizeHomePage({super.key});
+
+  @override
+  State<OrganizeHomePage> createState() => OrganizeHomePageState();
+}
+
+class OrganizeHomePageState extends State<OrganizeHomePage>
+    with
+        RouteAware,
+        WidgetsBindingObserver,
+        AfterLayoutMixin<OrganizeHomePage>,
+        AutomaticKeepAliveClientMixin {
+  StreamSubscription<FGBGType>? _fgbgSubscription;
+  late ScrollController _controller;
+  late MetricClientService _metricClient;
+
+  final collectionProKey = GlobalKey<CollectionProState>();
+
+  final _clientTokenService = injector<ClientTokenService>();
+  final _configurationService = injector<ConfigurationService>();
+
+  final nftBloc = injector<ClientTokenService>().nftBloc;
+
+  @override
+  void initState() {
+    super.initState();
+    _metricClient = injector.get<MetricClientService>();
+    WidgetsBinding.instance.addObserver(this);
+    _controller = ScrollController();
+    NftCollectionBloc.eventController.stream.listen((event) async {
+      switch (event.runtimeType) {
+        case ReloadEvent:
+        case GetTokensByOwnerEvent:
+        case UpdateTokensEvent:
+        case GetTokensBeforeByOwnerEvent:
+          nftBloc.add(event);
+          break;
+        default:
+      }
+    });
+    unawaited(
+        _clientTokenService.refreshTokens(syncAddresses: true).then((value) {
+      nftBloc.add(GetTokensByOwnerEvent(pageKey: PageKey.init()));
+    }));
+
+    context.read<HomeBloc>().add(CheckReviewAppEvent());
+
+    unawaited(injector<IAPService>().setup());
+    memoryValues.inGalleryView = true;
+  }
+
+  @override
+  void didChangeDependencies() {
+    super.didChangeDependencies();
+    routeObserver.subscribe(this, ModalRoute.of(context)!);
+  }
+
+  @override
+  void afterFirstLayout(BuildContext context) {
+    unawaited(injector<AutonomyService>().postLinkedAddresses());
+  }
+
+  @override
+  void dispose() {
+    WidgetsBinding.instance.removeObserver(this);
+    routeObserver.unsubscribe(this);
+    unawaited(_fgbgSubscription?.cancel());
+    _controller.dispose();
+    super.dispose();
+  }
+
+  Future<void> _onTokensUpdate(List<CompactedAssetToken> tokens) async {
+    //check minted postcard and navigator to artwork detail
+    final config = injector.get<ConfigurationService>();
+    final listTokenMints = config.getListPostcardMint();
+    if (tokens.any((element) =>
+        listTokenMints.contains(element.id) && element.pending != true)) {
+      final tokenMints = tokens
+          .where(
+            (element) =>
+                listTokenMints.contains(element.id) && element.pending != true,
+          )
+          .map((e) => e.identity)
+          .toList();
+      if (config.isAutoShowPostcard()) {
+        log.info('Auto show minted postcard');
+        final payload = PostcardDetailPagePayload(tokenMints, 0);
+        unawaited(Navigator.of(context).pushNamed(
+          AppRouter.claimedPostcardDetailsPage,
+          arguments: payload,
+        ));
+      }
+
+      unawaited(config.setListPostcardMint(
+        tokenMints.map((e) => e.id).toList(),
+        isRemoved: true,
+      ));
+    }
+
+    // Check if there is any Tezos token in the list
+    List<String> allAccountNumbers = await injector<AccountService>()
+        .getAllAddresses(logHiddenAddress: true);
+    final hashedAddresses = allAccountNumbers.fold(
+        0, (int previousValue, element) => previousValue + element.hashCode);
+
+    if (_configurationService.sentTezosArtworkMetricValue() !=
+            hashedAddresses &&
+        tokens.any((asset) =>
+            asset.blockchain == Blockchain.TEZOS.name.toLowerCase())) {
+      unawaited(_metricClient.addEvent('collection_has_tezos'));
+      unawaited(
+          _configurationService.setSentTezosArtworkMetric(hashedAddresses));
+    }
+  }
+
+  List<CompactedAssetToken> _updateTokens(List<CompactedAssetToken> tokens) {
+    tokens = tokens.filterAssetToken();
+    final nextKey = nftBloc.state.nextKey;
+    if (nextKey != null &&
+        !nextKey.isLoaded &&
+        tokens.length < COLLECTION_INITIAL_MIN_SIZE) {
+      nftBloc.add(GetTokensByOwnerEvent(pageKey: nextKey));
+    }
+    return tokens;
+  }
+
+  @override
+  Widget build(BuildContext context) {
+    super.build(context);
+    final contentWidget =
+        BlocConsumer<NftCollectionBloc, NftCollectionBlocState>(
+      bloc: nftBloc,
+      builder: (context, state) => CollectionPro(
+        key: collectionProKey,
+        tokens: _updateTokens(state.tokens.items),
+        scrollController: _controller,
+      ),
+      listener: (context, state) async {
+        log.info('[NftCollectionBloc] State update $state');
+        collectionProKey.currentState?.loadCollection();
+        if (state.state == NftLoadingState.done) {
+          unawaited(_onTokensUpdate(state.tokens.items));
+        }
+      },
+    );
+
+    return PrimaryScrollController(
+      controller: _controller,
+      child: Scaffold(
+        appBar: getDarkEmptyAppBar(Colors.transparent),
+        extendBody: true,
+        extendBodyBehindAppBar: true,
+        backgroundColor: AppColor.primaryBlack,
+        body: contentWidget,
+      ),
+    );
+  }
+
+  void scrollToTop() {
+    unawaited(_controller.animateTo(0,
+        duration: const Duration(milliseconds: 500),
+        curve: Curves.fastOutSlowIn));
+  }
+
+  @override
+  bool get wantKeepAlive => true;
+}
diff --git a/lib/screen/interactive_postcard/postcard_view_widget.dart b/lib/screen/interactive_postcard/postcard_view_widget.dart
index 62710f03e..f6eca10b6 100644
--- a/lib/screen/interactive_postcard/postcard_view_widget.dart
+++ b/lib/screen/interactive_postcard/postcard_view_widget.dart
@@ -148,7 +148,6 @@ class _PostcardViewWidgetState extends State<PostcardViewWidget> {
             child: Center(
               child: GifView.asset(
                 "assets/images/loading_white_tran.gif",
-                width: 52,
                 height: 52,
                 frameRate: 12,
               ),
diff --git a/lib/screen/migration/key_sync_page.dart b/lib/screen/migration/key_sync_page.dart
index fe9a5b4b5..099297784 100644
--- a/lib/screen/migration/key_sync_page.dart
+++ b/lib/screen/migration/key_sync_page.dart
@@ -39,7 +39,7 @@ class KeySyncPage extends StatelessWidget {
         return Scaffold(
           appBar: getBackAppBar(
             context,
-            title: "conflict_detected".tr(),
+            title: 'conflict_detected'.tr(),
             onBack: () {
               if (state.isProcessing != true) {
                 Navigator.of(context).pop();
@@ -57,34 +57,33 @@ class KeySyncPage extends StatelessWidget {
                       children: [
                         addTitleSpace(),
                         Text(
-                          "conflict_keychains".tr(),
+                          'conflict_keychains'.tr(),
                           //"We have detected a conflict of keychains.",
                           style: theme.textTheme.ppMori700Black14,
                         ),
                         const SizedBox(height: 12),
                         Text(
-                          "this_might_occur".tr(),
-                          //"This might occur if you have signed in to a different cloud on this device. You are required to define a default keychain for identification before continuing with other actions inside the app:",
+                          'this_might_occur'.tr(),
                           style: theme.textTheme.ppMori400Black14,
                         ),
                         const SizedBox(height: 20),
                         Text(
-                          "select_your_default_keychain".tr(),
+                          'select_your_default_keychain'.tr(),
                           style: theme.textTheme.ppMori400Black14,
                         ),
                         const SizedBox(height: 12),
                         Container(
-                            padding: const EdgeInsets.all(20.0),
+                            padding: const EdgeInsets.all(20),
                             decoration: BoxDecoration(
                                 border: Border.all(
                                     color: theme.colorScheme.primary),
-                                borderRadius: const BorderRadius.all(
-                                    Radius.circular(5.0))),
+                                borderRadius:
+                                    const BorderRadius.all(Radius.circular(5))),
                             child: GestureDetector(
                               onTap: () {
                                 UIHelper.showDialog(
                                     context,
-                                    "select_wallet_type".tr(),
+                                    'select_wallet_type'.tr(),
                                     SelectKeychainView(
                                       onSelect: (bool isLocal) {
                                         bloc.add(ToggleKeySyncEvent());
@@ -123,12 +122,12 @@ class KeySyncPage extends StatelessWidget {
                                 ),
                               ),
                             )),
-                        const SizedBox(height: 40.0),
+                        const SizedBox(height: 40),
                         Container(
                           padding: const EdgeInsets.all(15),
                           decoration: BoxDecoration(
                             borderRadius: BorderRadius.circular(5),
-                            color: AppColor.auSuperTeal,
+                            color: AppColor.feralFileHighlight,
                           ),
                           child: Column(
                             crossAxisAlignment: CrossAxisAlignment.start,
@@ -141,8 +140,7 @@ class KeySyncPage extends StatelessWidget {
                               ),
                               const SizedBox(height: 12),
                               Text(
-                                "data_contain".tr(),
-                                //"All the data contained in the other keychain will be imported into the defined default one and converted into a full account. If you were using it as the main wallet, you will be able to continue to do so after the conversion. No keys are lost.",
+                                'data_contain'.tr(),
                                 style: ResponsiveLayout.isMobile
                                     ? theme.textTheme.ppMori400Black14
                                     : theme.textTheme.ppMori400Black16,
@@ -158,7 +156,7 @@ class KeySyncPage extends StatelessWidget {
                                       MaterialTapTargetSize.shrinkWrap,
                                 ),
                                 child: Text(
-                                  "learn_security".tr(),
+                                  'learn_security'.tr(),
                                   style: (ResponsiveLayout.isMobile
                                           ? theme.textTheme.ppMori400Black14
                                           : theme.textTheme.ppMori400Black16)
@@ -177,7 +175,7 @@ class KeySyncPage extends StatelessWidget {
                   children: [
                     Expanded(
                       child: PrimaryButton(
-                        text: "proceed".tr(),
+                        text: 'proceed'.tr(),
                         isProcessing: state.isProcessing == true,
                         onTap: state.isProcessing == true
                             ? null
@@ -203,11 +201,12 @@ class SelectKeychainView extends StatefulWidget {
   final Function(bool isLocal) onSelect;
   final Function(bool isLocal) onChange;
   final bool defaultOption;
+
   const SelectKeychainView(
-      {super.key,
-      required this.onSelect,
+      {required this.onSelect,
       required this.onChange,
-      required this.defaultOption});
+      required this.defaultOption,
+      super.key});
 
   @override
   State<SelectKeychainView> createState() => SelectKeychainViewState();
@@ -215,6 +214,7 @@ class SelectKeychainView extends StatefulWidget {
 
 class SelectKeychainViewState extends State<SelectKeychainView> {
   late bool _selectedOption;
+
   @override
   void initState() {
     _selectedOption = widget.defaultOption;
@@ -222,41 +222,39 @@ class SelectKeychainViewState extends State<SelectKeychainView> {
   }
 
   @override
-  Widget build(BuildContext context) {
-    return Column(
-      children: [
-        _option(
-          context,
-          true,
-        ),
-        addDivider(height: 40, color: AppColor.white),
-        _option(
-          context,
-          false,
-        ),
-        const SizedBox(height: 40),
-        Padding(
-          padding: ResponsiveLayout.pageHorizontalEdgeInsets,
-          child: Column(
-            children: [
-              PrimaryButton(
-                text: "select".tr(),
-                onTap: () {
-                  widget.onSelect(_selectedOption);
-                  Navigator.of(context).pop();
-                },
-              ),
-              const SizedBox(height: 10),
-              OutlineButton(
-                onTap: () => Navigator.of(context).pop(),
-                text: "cancel".tr(),
-              ),
-            ],
+  Widget build(BuildContext context) => Column(
+        children: [
+          _option(
+            context,
+            true,
           ),
-        )
-      ],
-    );
-  }
+          addDivider(height: 40, color: AppColor.white),
+          _option(
+            context,
+            false,
+          ),
+          const SizedBox(height: 40),
+          Padding(
+            padding: ResponsiveLayout.pageHorizontalEdgeInsets,
+            child: Column(
+              children: [
+                PrimaryButton(
+                  text: 'select'.tr(),
+                  onTap: () {
+                    widget.onSelect(_selectedOption);
+                    Navigator.of(context).pop();
+                  },
+                ),
+                const SizedBox(height: 10),
+                OutlineButton(
+                  onTap: () => Navigator.of(context).pop(),
+                  text: 'cancel'.tr(),
+                ),
+              ],
+            ),
+          )
+        ],
+      );
 
   Widget _option(
     BuildContext context,
@@ -272,7 +270,7 @@ class SelectKeychainViewState extends State<SelectKeychainView> {
             _selectedOption = option;
           });
         },
-        child: Container(
+        child: DecoratedBox(
           decoration: const BoxDecoration(color: Colors.transparent),
           child: Row(
             children: [
diff --git a/lib/screen/moma_postcard_page/moma_postcard_page.dart b/lib/screen/moma_postcard_page/moma_postcard_page.dart
new file mode 100644
index 000000000..ca75fb2ad
--- /dev/null
+++ b/lib/screen/moma_postcard_page/moma_postcard_page.dart
@@ -0,0 +1,202 @@
+//
+//  SPDX-License-Identifier: BSD-2-Clause-Patent
+//  Copyright © 2022 Bitmark. All rights reserved.
+//  Use of this source code is governed by the BSD-2-Clause Plus Patent License
+//  that can be found in the LICENSE file.
+//
+
+import 'dart:async';
+
+import 'package:autonomy_flutter/common/injector.dart';
+import 'package:autonomy_flutter/screen/app_router.dart';
+import 'package:autonomy_flutter/screen/detail/artwork_detail_page.dart';
+import 'package:autonomy_flutter/screen/interactive_postcard/postcard_detail_page.dart';
+import 'package:autonomy_flutter/service/client_token_service.dart';
+import 'package:autonomy_flutter/service/metric_client_service.dart';
+import 'package:autonomy_flutter/util/asset_token_ext.dart';
+import 'package:autonomy_flutter/util/constants.dart';
+import 'package:autonomy_flutter/util/style.dart';
+import 'package:autonomy_flutter/util/token_ext.dart';
+import 'package:autonomy_flutter/view/artwork_common_widget.dart';
+import 'package:autonomy_flutter/view/back_appbar.dart';
+import 'package:autonomy_flutter/view/responsive.dart';
+import 'package:autonomy_theme/autonomy_theme.dart';
+import 'package:easy_localization/easy_localization.dart';
+import 'package:flutter/material.dart';
+import 'package:flutter_bloc/flutter_bloc.dart';
+import 'package:nft_collection/models/asset_token.dart';
+import 'package:nft_collection/nft_collection.dart';
+
+class MoMAPostcardPage extends StatefulWidget {
+  const MoMAPostcardPage({super.key});
+
+  @override
+  State<MoMAPostcardPage> createState() => _MoMAPostcardPageState();
+}
+
+class _MoMAPostcardPageState extends State<MoMAPostcardPage> {
+  int _cachedImageSize = 0;
+  final nftBloc = injector<ClientTokenService>().nftBloc;
+
+  @override
+  void initState() {
+    super.initState();
+  }
+
+  List<CompactedAssetToken> _updateTokens(List<CompactedAssetToken> tokens) {
+    List<CompactedAssetToken> filteredTokens = tokens.filterAssetToken();
+    final filteredPostcards =
+        filteredTokens.where((element) => element.isPostcard).toList();
+
+    final nextKey = nftBloc.state.nextKey;
+    if (nextKey != null &&
+        !nextKey.isLoaded &&
+        filteredPostcards.length < COLLECTION_INITIAL_MIN_SIZE) {
+      nftBloc.add(GetTokensByOwnerEvent(pageKey: nextKey));
+    }
+    return filteredPostcards;
+  }
+
+  @override
+  Widget build(BuildContext context) {
+    final contentWidget =
+        BlocBuilder<NftCollectionBloc, NftCollectionBlocState>(
+      bloc: nftBloc,
+      builder: (context, state) => NftCollectionGrid(
+        state: state.state,
+        tokens: _updateTokens(state.tokens.items),
+        loadingIndicatorBuilder: _loadingView,
+        emptyGalleryViewBuilder: _emptyPostcard,
+        customGalleryViewBuilder: (context, tokens) =>
+            _assetsWidget(context, tokens),
+      ),
+    );
+    return SafeArea(
+      top: false,
+      child: Scaffold(
+        appBar: getBackAppBar(
+          context,
+          title: 'moma_postcard'.tr(),
+          onBack: () {
+            Navigator.of(context).pop();
+          },
+        ),
+        body: Column(
+          children: [
+            Expanded(
+              child: contentWidget,
+            ),
+          ],
+        ),
+      ),
+    );
+  }
+
+  Widget _loadingView(BuildContext context) => Center(
+          child: Column(
+        children: [
+          loadingIndicator(),
+        ],
+      ));
+
+  Widget _emptyPostcard(BuildContext context) => Padding(
+        padding: ResponsiveLayout.pageEdgeInsets.copyWith(top: 0, bottom: 0),
+        child: Column(
+          crossAxisAlignment: CrossAxisAlignment.start,
+          children: [
+            addTitleSpace(),
+            Text(
+              'no_moma_postcard'.tr(),
+              style: Theme.of(context).textTheme.ppMori400Black14,
+            ),
+          ],
+        ),
+      );
+
+  Widget _assetsWidget(BuildContext context, List<CompactedAssetToken> tokens) {
+    final accountIdentities = tokens
+        .where((e) => e.pending != true || e.hasMetadata)
+        .map((element) => element.identity)
+        .toList();
+
+    const int cellPerRowPhone = 3;
+    const int cellPerRowTablet = 6;
+    const double cellSpacing = 3;
+    int cellPerRow =
+        ResponsiveLayout.isMobile ? cellPerRowPhone : cellPerRowTablet;
+    if (_cachedImageSize == 0) {
+      final estimatedCellWidth =
+          MediaQuery.of(context).size.width / cellPerRow -
+              cellSpacing * (cellPerRow - 1);
+      _cachedImageSize = (estimatedCellWidth * 3).ceil();
+    }
+    List<Widget> sources;
+    sources = [
+      SliverGrid(
+        gridDelegate: SliverGridDelegateWithFixedCrossAxisCount(
+          crossAxisCount: cellPerRow,
+          crossAxisSpacing: cellSpacing,
+          mainAxisSpacing: cellSpacing,
+        ),
+        delegate: SliverChildBuilderDelegate(
+          (BuildContext context, int index) {
+            final asset = tokens[index];
+
+            if (asset.pending == true && asset.isPostcard) {
+              return MintTokenWidget(
+                thumbnail: asset.galleryThumbnailURL,
+                tokenId: asset.tokenId,
+              );
+            }
+
+            return GestureDetector(
+              child: asset.pending == true && !asset.hasMetadata
+                  ? PendingTokenWidget(
+                      thumbnail: asset.galleryThumbnailURL,
+                      tokenId: asset.tokenId,
+                    )
+                  : tokenGalleryThumbnailWidget(
+                      context,
+                      asset,
+                      _cachedImageSize,
+                      usingThumbnailID: index > 50,
+                    ),
+              onTap: () {
+                if (asset.pending == true && !asset.hasMetadata) {
+                  return;
+                }
+
+                final index = tokens
+                    .where((e) => e.pending != true || e.hasMetadata)
+                    .toList()
+                    .indexOf(asset);
+                final payload = asset.isPostcard
+                    ? PostcardDetailPagePayload(accountIdentities, index)
+                    : ArtworkDetailPayload(accountIdentities, index);
+
+                final pageName = asset.isPostcard
+                    ? AppRouter.claimedPostcardDetailsPage
+                    : AppRouter.artworkDetailsPage;
+                unawaited(Navigator.of(context)
+                    .pushNamed(pageName, ////need change to pageName
+                        arguments: payload));
+
+                unawaited(injector<MetricClientService>().addEvent(
+                    MixpanelEvent.viewArtwork,
+                    data: {'id': asset.id}));
+              },
+            );
+          },
+          childCount: tokens.length,
+        ),
+      ),
+      const SliverToBoxAdapter(child: SizedBox(height: 30)),
+    ];
+
+    return CustomScrollView(
+      physics: const AlwaysScrollableScrollPhysics(),
+      slivers: sources,
+      controller: ScrollController(),
+    );
+  }
+}
diff --git a/lib/screen/onboarding/view_address/view_existing_address.dart b/lib/screen/onboarding/view_address/view_existing_address.dart
index 0a302f9d8..b4bc1c195 100644
--- a/lib/screen/onboarding/view_address/view_existing_address.dart
+++ b/lib/screen/onboarding/view_address/view_existing_address.dart
@@ -1,3 +1,5 @@
+import 'dart:async';
+
 import 'package:autonomy_flutter/common/injector.dart';
 import 'package:autonomy_flutter/screen/app_router.dart';
 import 'package:autonomy_flutter/screen/onboarding/import_address/import_seeds.dart';
@@ -21,8 +23,7 @@ class ViewExistingAddress extends StatefulWidget {
   static const String tag = 'view_existing_address';
   final ViewExistingAddressPayload payload;
 
-  const ViewExistingAddress({Key? key, required this.payload})
-      : super(key: key);
+  const ViewExistingAddress({required this.payload, super.key});
 
   @override
   State<ViewExistingAddress> createState() => _ViewExistingAddressState();
@@ -38,7 +39,7 @@ class _ViewExistingAddressState extends State<ViewExistingAddress> {
     final theme = Theme.of(context);
     return Scaffold(
       appBar: getBackAppBar(context,
-          title: "view_existing_address".tr(),
+          title: 'view_existing_address'.tr(),
           onBack: () => Navigator.of(context).pop()),
       body: Padding(
         padding: ResponsiveLayout.pageEdgeInsetsWithSubmitButton,
@@ -50,12 +51,12 @@ class _ViewExistingAddressState extends State<ViewExistingAddress> {
                   crossAxisAlignment: CrossAxisAlignment.start,
                   children: [
                     addTitleSpace(),
-                    Text("enter_address_alias".tr(),
+                    Text('enter_a_wallet_address'.tr(),
                         style: theme.textTheme.ppMori400Black14),
                     const SizedBox(height: 10),
                     AuTextField(
-                      title: "",
-                      placeholder: "enter_address".tr(),
+                      title: '',
+                      placeholder: 'enter_address'.tr(),
                       controller: _controller,
                       isError: _isError,
                       suffix: IconButton(
@@ -72,7 +73,7 @@ class _ViewExistingAddressState extends State<ViewExistingAddress> {
                               .pushNamed(ScanQRPage.tag,
                                   arguments: ScannerItem.ETH_ADDRESS);
                           if (address != null && address is String) {
-                            address = address.replacePrefix("ethereum:", "");
+                            address = address.replacePrefix('ethereum:', '');
                             _controller.text = address;
                             setState(() {});
                           }
@@ -90,7 +91,7 @@ class _ViewExistingAddressState extends State<ViewExistingAddress> {
             ),
             PrimaryButton(
               enabled: _controller.text.trim().isNotEmpty,
-              text: "continue".tr(),
+              text: 'continue'.tr(),
               isProcessing: _isProcessing,
               onTap: () async {
                 setState(() {
@@ -105,19 +106,21 @@ class _ViewExistingAddressState extends State<ViewExistingAddress> {
                       final connection = await injector<AccountService>()
                           .linkManuallyAddress(
                               _controller.text.trim(), cryptoType);
-                      if (!mounted) return;
-                      Navigator.of(context).pushNamed(
+                      if (!mounted) {
+                        return;
+                      }
+                      unawaited(Navigator.of(context).pushNamed(
                           AppRouter.nameLinkedAccountPage,
-                          arguments: connection);
+                          arguments: connection));
                     } on LinkAddressException catch (e) {
                       setState(() {
                         _isError = true;
                       });
-                      UIHelper.showInfoDialog(context, e.message, "",
+                      unawaited(UIHelper.showInfoDialog(context, e.message, '',
                           isDismissible: true,
-                          closeButton: "close".tr(), onClose: () {
+                          closeButton: 'close'.tr(), onClose: () {
                         injector<NavigationService>().popUntilHome();
-                      });
+                      }));
                     } catch (_) {}
                     break;
                   default:
@@ -132,10 +135,10 @@ class _ViewExistingAddressState extends State<ViewExistingAddress> {
             ),
             const SizedBox(height: 20),
             TextButton(
-              onPressed: () {
-                Navigator.of(context).pushNamed(ImportSeedsPage.tag);
+              onPressed: () async {
+                await Navigator.of(context).pushNamed(ImportSeedsPage.tag);
               },
-              child: Text("or_import_address".tr(),
+              child: Text('or_import_address'.tr(),
                   style: theme.textTheme.ppMori400Black14
                       .copyWith(decoration: TextDecoration.underline)),
             )
diff --git a/lib/screen/onboarding_page.dart b/lib/screen/onboarding_page.dart
index 1c722f472..673180643 100644
--- a/lib/screen/onboarding_page.dart
+++ b/lib/screen/onboarding_page.dart
@@ -18,19 +18,21 @@ import 'package:autonomy_flutter/service/deeplink_service.dart';
 import 'package:autonomy_flutter/service/metric_client_service.dart';
 import 'package:autonomy_flutter/service/settings_data_service.dart';
 import 'package:autonomy_flutter/service/versions_service.dart';
-import 'package:autonomy_flutter/util/constants.dart';
 import 'package:autonomy_flutter/util/log.dart';
-import 'package:autonomy_flutter/util/style.dart';
 import 'package:autonomy_flutter/util/ui_helper.dart';
+import 'package:autonomy_flutter/view/back_appbar.dart';
 import 'package:autonomy_flutter/view/primary_button.dart';
 import 'package:autonomy_flutter/view/responsive.dart';
 import 'package:autonomy_theme/autonomy_theme.dart';
+import 'package:card_swiper/card_swiper.dart';
+import 'package:collection/collection.dart';
 import 'package:easy_localization/easy_localization.dart';
 import 'package:flutter/material.dart';
 import 'package:flutter_bloc/flutter_bloc.dart';
+import 'package:flutter_svg/flutter_svg.dart';
 
 class OnboardingPage extends StatefulWidget {
-  const OnboardingPage({Key? key}) : super(key: key);
+  const OnboardingPage({super.key});
 
   @override
   State<OnboardingPage> createState() => _OnboardingPageState();
@@ -43,11 +45,17 @@ class _OnboardingPageState extends State<OnboardingPage>
   bool fromIrlLink = false;
 
   final metricClient = injector.get<MetricClientService>();
+  final deepLinkService = injector.get<DeeplinkService>();
+
+  late SwiperController _swiperController;
+  late int _currentIndex;
 
   @override
   void initState() {
     super.initState();
-    handleBranchLink();
+    _swiperController = SwiperController();
+    _currentIndex = 0;
+    unawaited(handleBranchLink());
     handleDeepLink();
     handleIrlLink();
   }
@@ -55,7 +63,7 @@ class _OnboardingPageState extends State<OnboardingPage>
   @override
   void didChangeDependencies() {
     super.didChangeDependencies();
-    log.info("DefineViewRoutingEvent");
+    log.info('DefineViewRoutingEvent');
     context.read<RouterBloc>().add(DefineViewRoutingEvent());
   }
 
@@ -126,7 +134,7 @@ class _OnboardingPageState extends State<OnboardingPage>
     });
   }
 
-  void handleBranchLink() async {
+  Future<void> handleBranchLink() async {
     setState(() {
       fromBranchLink = true;
     });
@@ -155,14 +163,15 @@ class _OnboardingPageState extends State<OnboardingPage>
     memoryValues.branchDeeplinkData.addListener(() async {
       try {
         final data = memoryValues.branchDeeplinkData.value;
-        if (data == currentData) return;
+        if (data == currentData) {
+          return;
+        }
         if (data != null) {
           setState(() {
             fromBranchLink = true;
           });
 
           await injector<AccountService>().restoreIfNeeded();
-          final deepLinkService = injector.get<DeeplinkService>();
           deepLinkService.handleBranchDeeplinkData(data);
           updateDeepLinkState();
         }
@@ -179,117 +188,269 @@ class _OnboardingPageState extends State<OnboardingPage>
   Widget build(BuildContext context) {
     final theme = Theme.of(context);
 
-    final height = MediaQuery.of(context).size.height;
-    final paddingTop = (height - 640).clamp(0.0, 104).toDouble();
-
     return Scaffold(
+        appBar: getDarkEmptyAppBar(),
+        backgroundColor: AppColor.primaryBlack,
         body: BlocConsumer<RouterBloc, RouterState>(
-      listener: (context, state) async {
-        switch (state.onboardingStep) {
-          case OnboardingStep.dashboard:
-            Navigator.of(context)
-                .pushReplacementNamed(AppRouter.homePageNoTransition);
-            try {
-              await injector<SettingsDataService>().restoreSettingsData();
-            } catch (_) {
-              // just ignore this so that user can go through onboarding
+          listener: (context, state) async {
+            switch (state.onboardingStep) {
+              case OnboardingStep.dashboard:
+                unawaited(Navigator.of(context)
+                    .pushReplacementNamed(AppRouter.homePageNoTransition));
+                try {
+                  await injector<SettingsDataService>().restoreSettingsData();
+                } catch (_) {
+                  // just ignore this so that user can go through onboarding
+                }
+                // await askForNotification();
+                await injector<VersionService>().checkForUpdate();
+                // hide code show surveys issues/1459
+                // await Future.delayed(SHORT_SHOW_DIALOG_DURATION,
+                //     () => showSurveysNotification(context));
+                break;
+              default:
+                break;
             }
-            // await askForNotification();
-            await injector<VersionService>().checkForUpdate();
-            // hide code show surveys issues/1459
-            // await Future.delayed(SHORT_SHOW_DIALOG_DURATION,
-            //     () => showSurveysNotification(context));
-            break;
-          default:
-            break;
-        }
 
-        if (state.onboardingStep != OnboardingStep.dashboard) {
-          await injector<VersionService>().checkForUpdate();
-        }
-      },
-      builder: (context, state) {
-        if (state.isLoading) {
-          return loadingScreen(theme, "restoring_autonomy".tr());
-        }
+            if (state.onboardingStep != OnboardingStep.dashboard) {
+              await injector<VersionService>().checkForUpdate();
+            }
+          },
+          builder: (context, state) {
+            if (state.isLoading) {
+              return loadingScreen(theme, 'restoring_autonomy'.tr());
+            }
+            if (state.onboardingStep == OnboardingStep.startScreen) {
+              return Container(
+                  padding: const EdgeInsets.only(bottom: 40),
+                  color: AppColor.primaryBlack,
+                  child: _swiper(context));
+            }
 
-        return Padding(
-          padding: ResponsiveLayout.pageEdgeInsets.copyWith(bottom: 40),
-          child: Column(
-            crossAxisAlignment: CrossAxisAlignment.start,
-            children: [
-              const SizedBox(height: 40),
-              _logo(maxWidthLogo: 50),
-              SizedBox(height: paddingTop),
-              addBoldDivider(),
-              Text("collect".tr(), style: theme.textTheme.ppMori700Black36),
-              const SizedBox(height: 20),
-              addBoldDivider(),
-              Text("view".tr(), style: theme.textTheme.ppMori700Black36),
-              const SizedBox(height: 20),
-              addBoldDivider(),
-              Text("discover".tr(), style: theme.textTheme.ppMori700Black36),
-              const Spacer(),
-              if ((fromBranchLink ||
-                      fromDeeplink ||
-                      fromIrlLink ||
-                      (state.onboardingStep == OnboardingStep.undefined)) &&
-                  (state.onboardingStep != OnboardingStep.restore)) ...[
-                PrimaryButton(
-                  text: "h_loading...".tr(),
-                  isProcessing: true,
-                )
-              ] else if (state.onboardingStep ==
-                  OnboardingStep.startScreen) ...[
-                Text("create_wallet_description".tr(),
-                    style: theme.textTheme.ppMori400Grey14),
-                const SizedBox(height: 20),
-                PrimaryButton(
-                  text: "create_a_new_wallet".tr(),
-                  onTap: () {
-                    Navigator.of(context).pushNamed(ChooseChainPage.tag);
-                  },
-                ),
-                const SizedBox(height: 20),
-                Center(
-                  child: Text("or".tr().toUpperCase(),
-                      style: theme.textTheme.ppMori400Grey14),
-                ),
-                const SizedBox(height: 20),
-                Text("view_existing_address_des".tr(),
-                    style: theme.textTheme.ppMori400Grey14),
-                const SizedBox(height: 20),
-                PrimaryButton(
-                  text: "view_existing_address".tr(),
-                  onTap: () {
-                    Navigator.of(context).pushNamed(ViewExistingAddress.tag,
-                        arguments: ViewExistingAddressPayload(true));
-                  },
-                ),
-              ] else if (state.onboardingStep == OnboardingStep.restore) ...[
-                PrimaryButton(
-                  text: "restoring".tr(),
-                  isProcessing: true,
-                  enabled: false,
-                ),
-              ]
-            ],
-          ),
-        );
-      },
-    ));
+            final button = ((fromBranchLink ||
+                        fromDeeplink ||
+                        fromIrlLink ||
+                        (state.onboardingStep == OnboardingStep.undefined)) &&
+                    (state.onboardingStep != OnboardingStep.restore))
+                ? PrimaryButton(
+                    text: 'h_loading...'.tr(),
+                    isProcessing: true,
+                    enabled: false,
+                    disabledColor: AppColor.auGreyBackground,
+                    textColor: AppColor.white,
+                    indicatorColor: AppColor.white,
+                  )
+                : (state.onboardingStep == OnboardingStep.restore)
+                    ? PrimaryButton(
+                        text: 'restoring'.tr(),
+                        isProcessing: true,
+                        enabled: false,
+                        disabledColor: AppColor.auGreyBackground,
+                        textColor: AppColor.white,
+                        indicatorColor: AppColor.white,
+                      )
+                    : null;
+
+            return Padding(
+              padding: ResponsiveLayout.pageHorizontalEdgeInsets
+                  .copyWith(bottom: 40),
+              child: Stack(
+                children: [
+                  Padding(
+                    padding: const EdgeInsets.only(top: 15),
+                    child: Center(
+                      child: SvgPicture.asset(
+                        'assets/images/feral_file_onboarding.svg',
+                      ),
+                    ),
+                  ),
+                  Positioned.fill(
+                    child: Column(
+                      children: [
+                        const Spacer(),
+                        button ?? const SizedBox(),
+                      ],
+                    ),
+                  ),
+                ],
+              ),
+            );
+          },
+        ));
   }
 
-  Widget _logo({double? maxWidthLogo}) {
-    return FutureBuilder<bool>(
-        future: isAppCenterBuild(),
-        builder: (context, snapshot) {
-          return SizedBox(
-            width: maxWidthLogo,
-            child: Image.asset(snapshot.data == true
-                ? "assets/images/inhouse_logo.png"
-                : "assets/images/moma_logo.png"),
-          );
-        });
+  Widget _onboardingItem(BuildContext context,
+      {required String title,
+      required String desc,
+      required String image,
+      Widget? subDesc}) {
+    final theme = Theme.of(context);
+    return Column(
+      crossAxisAlignment: CrossAxisAlignment.start,
+      children: [
+        const SizedBox(height: 100),
+        Text(
+          title,
+          style: theme.textTheme.ppMori700White24
+              .copyWith(fontSize: 36, height: 1),
+        ),
+        const SizedBox(height: 40),
+        Image.asset(image),
+        const SizedBox(height: 40),
+        Text(
+          desc,
+          style: theme.textTheme.ppMori400White14
+              .copyWith(fontSize: 24, height: 1),
+        ),
+        const SizedBox(height: 10),
+        subDesc ?? const SizedBox(),
+      ],
+    );
+  }
+
+  Widget _swiper(BuildContext context) {
+    final theme = Theme.of(context);
+    final List<Map<String, String>> exploreArtworks = [
+      {'Licia He': 'Fictional Lullaby'},
+    ];
+    final List<Map<String, String>> streamArtworks = [
+      {'Refik Anadol': 'Unsupervised'},
+      {'Nancy Baker Cahill': 'Slipstream 001'},
+      {'Refik Anadol': 'Unsupervised'}
+    ];
+    final pages = [
+      Center(
+        child: SvgPicture.asset('assets/images/feral_file_onboarding.svg'),
+      ),
+      _onboardingItem(
+        context,
+        title: 'explore_exhibitions'.tr(),
+        desc: 'explore_exhibitions_desc'.tr(),
+        image: 'assets/images/feral_file_onboarding_exhibition.png',
+        subDesc: RichText(
+          text: TextSpan(
+              text: 'artwork_'.tr(),
+              style: theme.textTheme.ppMori400Grey12,
+              children: exploreArtworks
+                  .mapIndexed((index, e) => [
+                        TextSpan(
+                          text: e.keys.first,
+                        ),
+                        const TextSpan(text: ', '),
+                        TextSpan(
+                          text: e.values.first,
+                          style: const TextStyle(
+                            fontStyle: FontStyle.italic,
+                          ),
+                        ),
+                        if (index != exploreArtworks.length - 1)
+                          const TextSpan(text: '; ')
+                      ])
+                  .flattened
+                  .toList()),
+        ),
+      ),
+      _onboardingItem(context,
+          title: 'manage_your_collection'.tr(),
+          desc: 'manage_your_collection_desc'.tr(),
+          image: 'assets/images/feral_file_onboarding_organize.png'),
+      _onboardingItem(
+        context,
+        title: 'view_everywhere'.tr(),
+        desc: 'view_everywhere_desc'.tr(),
+        image: 'assets/images/feral_file_onboarding_stream.png',
+        subDesc: RichText(
+          text: TextSpan(
+              text: 'artwork_'.tr(),
+              style: theme.textTheme.ppMori400Grey12,
+              children: streamArtworks
+                  .mapIndexed((index, e) => [
+                        TextSpan(
+                          text: e.keys.first,
+                        ),
+                        const TextSpan(text: ', '),
+                        TextSpan(
+                          text: e.values.first,
+                          style: const TextStyle(
+                            fontStyle: FontStyle.italic,
+                          ),
+                        ),
+                        if (index != streamArtworks.length - 1)
+                          const TextSpan(text: '; ')
+                      ])
+                  .flattened
+                  .toList()),
+        ),
+      ),
+    ];
+    final isLastPage = _currentIndex == pages.length - 1;
+    final padding = ResponsiveLayout.pageHorizontalEdgeInsets;
+
+    return Stack(
+      children: [
+        Swiper(
+          itemCount: pages.length,
+          itemBuilder: (context, index) {
+            final page = pages[index];
+            return Padding(
+              padding: ResponsiveLayout.pageEdgeInsets,
+              child: page,
+            );
+          },
+          onIndexChanged: (index) {
+            setState(() {
+              _currentIndex = index;
+            });
+          },
+          pagination: const SwiperPagination(
+            builder: DotSwiperPaginationBuilder(
+              color: Colors.grey,
+              activeColor: AppColor.feralFileHighlight,
+            ),
+          ),
+          control: const SwiperControl(
+              color: Colors.transparent,
+              disableColor: Colors.transparent,
+              size: 0),
+          loop: false,
+          controller: _swiperController,
+        ),
+        Visibility(
+          visible: isLastPage,
+          child: Positioned(
+            bottom: 0,
+            left: 0,
+            right: 0,
+            child: Container(
+              color: AppColor.primaryBlack,
+              padding: padding,
+              child: Column(
+                children: [
+                  PrimaryButton(
+                    text: 'get_started'.tr(),
+                    onTap: () async {
+                      await Navigator.of(context)
+                          .pushNamed(ChooseChainPage.tag);
+                    },
+                  ),
+                  const SizedBox(height: 16),
+                  TextButton(
+                    onPressed: () async {
+                      await Navigator.of(context).pushNamed(
+                          ViewExistingAddress.tag,
+                          arguments: ViewExistingAddressPayload(true));
+                    },
+                    child: Text(
+                      'already_have_an_address'.tr(),
+                      style: theme.textTheme.ppMori400Grey14,
+                    ),
+                  ),
+                ],
+              ),
+            ),
+          ),
+        )
+      ],
+    );
   }
 }
diff --git a/lib/screen/participate_user_test_page.dart b/lib/screen/participate_user_test_page.dart
index 9a597b26b..08aafbb11 100644
--- a/lib/screen/participate_user_test_page.dart
+++ b/lib/screen/participate_user_test_page.dart
@@ -58,7 +58,7 @@ class ParticipateUserTestPage extends StatelessWidget {
                       padding: const EdgeInsets.all(10),
                       decoration: BoxDecoration(
                         borderRadius: BorderRadius.circular(10),
-                        color: AppColor.auSuperTeal,
+                        color: AppColor.feralFileHighlight,
                       ),
                       child: Column(
                         crossAxisAlignment: CrossAxisAlignment.start,
diff --git a/lib/screen/playlists/add_new_playlist/add_new_playlist.dart b/lib/screen/playlists/add_new_playlist/add_new_playlist.dart
index f85bae2f6..fe5b32c18 100644
--- a/lib/screen/playlists/add_new_playlist/add_new_playlist.dart
+++ b/lib/screen/playlists/add_new_playlist/add_new_playlist.dart
@@ -1,3 +1,5 @@
+import 'dart:async';
+
 import 'package:after_layout/after_layout.dart';
 import 'package:autonomy_flutter/common/injector.dart';
 import 'package:autonomy_flutter/database/cloud_database.dart';
@@ -9,26 +11,27 @@ import 'package:autonomy_flutter/service/account_service.dart';
 import 'package:autonomy_flutter/service/configuration_service.dart';
 import 'package:autonomy_flutter/service/metric_client_service.dart';
 import 'package:autonomy_flutter/util/constants.dart';
+import 'package:autonomy_flutter/util/style.dart';
+import 'package:autonomy_flutter/util/token_ext.dart';
 import 'package:autonomy_flutter/view/artwork_common_widget.dart';
-import 'package:autonomy_flutter/view/header.dart';
-import 'package:autonomy_flutter/view/primary_button.dart';
+import 'package:autonomy_flutter/view/back_appbar.dart';
 import 'package:autonomy_flutter/view/radio_check_box.dart';
 import 'package:autonomy_flutter/view/responsive.dart';
+import 'package:autonomy_flutter/view/search_bar.dart';
+import 'package:autonomy_flutter/view/text_field.dart';
 import 'package:autonomy_theme/autonomy_theme.dart';
 import 'package:easy_localization/easy_localization.dart';
 import 'package:flutter/material.dart';
+import 'package:flutter/rendering.dart';
 import 'package:flutter/services.dart';
 import 'package:flutter_bloc/flutter_bloc.dart';
-import 'package:nft_collection/models/address_index.dart';
 import 'package:nft_collection/models/asset_token.dart';
 import 'package:nft_collection/nft_collection.dart';
 
-import '../../../util/token_ext.dart';
-
 class AddNewPlaylistScreen extends StatefulWidget {
   final PlayListModel? playListModel;
 
-  const AddNewPlaylistScreen({Key? key, this.playListModel}) : super(key: key);
+  const AddNewPlaylistScreen({super.key, this.playListModel});
 
   @override
   State<AddNewPlaylistScreen> createState() => _AddNewPlaylistScreenState();
@@ -39,41 +42,73 @@ class _AddNewPlaylistScreenState extends State<AddNewPlaylistScreen>
   final bloc = injector.get<AddNewPlaylistBloc>();
   final nftBloc = injector.get<NftCollectionBloc>();
   final _playlistNameC = TextEditingController();
+  final _focusNode = FocusNode();
+  late bool _isShowSearchBar;
 
   final _formKey = GlobalKey<FormState>();
   List<AssetToken> tokensPlaylist = [];
   final _controller = ScrollController();
+  late String _searchText;
+  late String _playlistName;
 
   @override
   void initState() {
+    _searchText = '';
+    _playlistName = '';
+    _isShowSearchBar = false;
     super.initState();
 
-    _playlistNameC.text = widget.playListModel?.name ?? '';
-    _controller.addListener(_scrollListenerToLoadMore);
-    refreshTokens().then((value) {
+    _playlistNameC.text = _playlistName;
+    _controller
+      ..addListener(_scrollListenerToLoadMore)
+      ..addListener(_scrollListenerToShowSearchBar);
+    unawaited(refreshTokens().then((value) {
       nftBloc.add(GetTokensByOwnerEvent(pageKey: PageKey.init()));
-    });
+    }));
     bloc.add(InitPlaylist(playListModel: widget.playListModel));
+    WidgetsBinding.instance.addPostFrameCallback((context) {
+      _focusCollectionName();
+    });
   }
 
   @override
   void afterFirstLayout(BuildContext context) {
-    injector<ConfigurationService>().setAlreadyShowCreatePlaylistTip(true);
+    unawaited(
+        injector<ConfigurationService>().setAlreadyShowCreatePlaylistTip(true));
     injector<ConfigurationService>().showCreatePlaylistTip.value = false;
   }
 
-  _scrollListenerToLoadMore() {
+  void _focusCollectionName() {
+    FocusScope.of(context).requestFocus(_focusNode);
+  }
+
+  void _scrollListenerToLoadMore() {
     if (_controller.position.pixels + 100 >=
         _controller.position.maxScrollExtent) {
-      final nextKey = nftBloc.state.nextKey;
-      if (nextKey == null || nextKey.isLoaded) return;
-      nftBloc.add(GetTokensByOwnerEvent(pageKey: nextKey));
+      _loadMore();
     }
   }
 
-  Future<List<AddressIndex>> getAddressIndexes() async {
-    final accountService = injector<AccountService>();
-    return await accountService.getAllAddressIndexes();
+  void _scrollListenerToShowSearchBar() {
+    if (_controller.position.pixels <= 10 &&
+        _controller.position.userScrollDirection == ScrollDirection.forward) {
+      setState(() {
+        _isShowSearchBar = true;
+      });
+    }
+  }
+
+  Future<void> _scrollToTop() async {
+    await _controller.animateTo(0,
+        duration: const Duration(milliseconds: 500), curve: Curves.ease);
+  }
+
+  void _loadMore() {
+    final nextKey = nftBloc.state.nextKey;
+    if (nextKey == null || nextKey.isLoaded) {
+      return;
+    }
+    nftBloc.add(GetTokensByOwnerEvent(pageKey: nextKey));
   }
 
   Future<List<String>> getManualTokenIds() async {
@@ -108,8 +143,11 @@ class _AddNewPlaylistScreenState extends State<AddNewPlaylistScreen>
     required List<CompactedAssetToken> tokens,
     List<String>? selectedTokens,
   }) {
-    tokens = tokens.filterAssetToken();
+    tokens = tokens.filterAssetToken().filterByTitleContain(_searchText);
     bloc.state.tokens = tokens;
+    if (tokens.length <= INDEXER_TOKENS_MAXIMUM) {
+      _loadMore();
+    }
     return tokens;
   }
 
@@ -124,196 +162,130 @@ class _AddNewPlaylistScreenState extends State<AddNewPlaylistScreen>
         }
       },
       builder: (context, state) {
-        final paddingTop = MediaQuery.of(context).viewPadding.top;
+        final playlistName = _playlistNameC.text;
+        final selectedIDs = state.selectedIDs;
+        final isDone =
+            playlistName.isNotEmpty && selectedIDs?.isNotEmpty == true;
         return Scaffold(
-          backgroundColor: theme.primaryColor,
+          backgroundColor: theme.colorScheme.background,
+          appBar: getCustomDoneAppBar(
+            context,
+            title: TextFieldWidget(
+              focusNode: _focusNode,
+              hintText: 'new_collection'.tr(),
+              controller: _playlistNameC,
+              cursorColor: theme.colorScheme.primary,
+              style: theme.textTheme.ppMori400Black14,
+              hintStyle: theme.textTheme.ppMori400Grey14,
+              textAlign: TextAlign.center,
+              border: InputBorder.none,
+              onFieldSubmitted: (value) {
+                setState(() {
+                  _playlistName = value;
+                });
+              },
+              onChanged: (value) {
+                setState(() {
+                  _playlistName = value;
+                });
+              },
+            ),
+            onDone: !isDone
+                ? null
+                : () {
+                    final nftState = nftBloc.state;
+                    final selectedCount = nftState.tokens.items
+                        .where((element) =>
+                            state.selectedIDs?.contains(element.id) ?? false)
+                        .length;
+                    if (selectedCount <= 0) {
+                      return;
+                    }
+                    bloc.add(
+                      CreatePlaylist(
+                        name: _playlistNameC.text.isNotEmpty
+                            ? _playlistNameC.text
+                            : null,
+                      ),
+                    );
+                  },
+            onCancel: () {
+              Navigator.pop(context);
+              unawaited(injector<MetricClientService>()
+                  .addEvent(MixpanelEvent.undoCreatePlaylist));
+            },
+            bottom: PreferredSize(
+              preferredSize: const Size.fromHeight(0.25),
+              child:
+                  addOnlyDivider(color: AppColor.auQuickSilver, border: 0.25),
+            ),
+          ),
           body: AnnotatedRegion<SystemUiOverlayStyle>(
             value: SystemUiOverlayStyle.light,
             child: BlocBuilder<NftCollectionBloc, NftCollectionBlocState>(
                 bloc: nftBloc,
-                builder: (context, nftState) {
-                  final selectedCount = nftState.tokens.items
-                      .where((element) =>
-                          state.selectedIDs?.contains(element.id) ?? false)
-                      .length;
-                  final isSelectedAll = selectedCount == state.tokens?.length;
-                  return SafeArea(
-                    top: false,
-                    bottom: false,
-                    child: Stack(
-                      children: [
-                        Form(
-                          key: _formKey,
-                          child: Column(
-                            children: [
-                              HeaderView(paddingTop: paddingTop, isWhite: true),
-                              Padding(
-                                padding:
-                                    const EdgeInsets.symmetric(horizontal: 8),
-                                child: Column(
-                                  children: [
-                                    Column(
-                                      crossAxisAlignment:
-                                          CrossAxisAlignment.start,
-                                      children: [
-                                        Text(
-                                          tr('playlist_name'),
-                                          style:
-                                              theme.textTheme.ppMori400Grey12,
-                                        ),
-                                        TextFormField(
-                                          controller: _playlistNameC,
-                                          cursorColor:
-                                              theme.colorScheme.secondary,
-                                          style: theme.primaryTextTheme
-                                              .ppMori700White24,
-                                          decoration: InputDecoration(
-                                            hintText: tr('untitled'),
-                                            hintStyle:
-                                                theme.textTheme.ppMori700Grey24,
-                                            border: UnderlineInputBorder(
-                                              borderSide: BorderSide(
-                                                width: 2,
-                                                color:
-                                                    theme.colorScheme.secondary,
-                                              ),
-                                            ),
-                                            focusedBorder: UnderlineInputBorder(
-                                              borderSide: BorderSide(
-                                                width: 2,
-                                                color:
-                                                    theme.colorScheme.secondary,
-                                              ),
-                                            ),
-                                            enabledBorder: UnderlineInputBorder(
-                                              borderSide: BorderSide(
-                                                width: 2,
-                                                color:
-                                                    theme.colorScheme.secondary,
-                                              ),
-                                            ),
-                                          ),
-                                        ),
-                                      ],
-                                    ),
-                                    Padding(
-                                      padding: const EdgeInsets.symmetric(
-                                          vertical: 8),
-                                      child: Row(
-                                        children: [
-                                          Text(
-                                            tr(
-                                              selectedCount != 1
-                                                  ? 'artworks_selected'
-                                                  : 'artwork_selected',
-                                              args: [selectedCount.toString()],
-                                            ),
-                                            style: theme
-                                                .textTheme.ppMori400White12,
-                                          ),
-                                          const Spacer(),
-                                          GestureDetector(
-                                            onTap: () => bloc.add(
-                                                SelectItemPlaylist(
-                                                    isSelectAll:
-                                                        !isSelectedAll)),
-                                            child: Container(
-                                              padding:
-                                                  const EdgeInsets.symmetric(
-                                                horizontal: 10,
-                                                vertical: 4,
-                                              ),
-                                              decoration: BoxDecoration(
-                                                border: Border.all(
-                                                  color: theme.disableColor,
-                                                ),
-                                                borderRadius:
-                                                    BorderRadius.circular(64),
-                                              ),
-                                              child: Text(
-                                                isSelectedAll
-                                                    ? tr('unselect_all')
-                                                    : tr('select_all'),
-                                                style: theme
-                                                    .textTheme.ppMori400Grey12,
-                                              ),
-                                            ),
-                                          ),
-                                        ],
+                builder: (context, nftState) => SafeArea(
+                      top: false,
+                      bottom: false,
+                      child: Stack(
+                        children: [
+                          Form(
+                            key: _formKey,
+                            child: Column(
+                              children: [
+                                if (_isShowSearchBar)
+                                  Padding(
+                                    padding: const EdgeInsets.fromLTRB(
+                                        15, 20, 15, 18),
+                                    child: ActionBar(
+                                      searchBar: AuSearchBar(
+                                        onChanged: (value) {},
+                                        onSearch: (value) {
+                                          setState(() {
+                                            _searchText = value;
+                                          });
+                                        },
+                                        onClear: (value) {
+                                          setState(() {
+                                            _searchText = '';
+                                          });
+                                        },
                                       ),
+                                      onCancel: () async {
+                                        setState(() {
+                                          _searchText = '';
+                                          _isShowSearchBar = false;
+                                        });
+                                        await _scrollToTop();
+                                      },
                                     ),
-                                  ],
-                                ),
-                              ),
-                              Expanded(
-                                child: NftCollectionGrid(
-                                  state: nftState.state,
-                                  tokens: nftState.tokens
-                                      .unique((token) => token.id)
-                                      .items,
-                                  loadingIndicatorBuilder: loadingView,
-                                  customGalleryViewBuilder: (context, tokens) =>
-                                      _assetsWidget(
-                                    context,
-                                    setupPlayList(tokens: tokens),
-                                    onChanged: (tokenID, value) => bloc.add(
-                                      UpdateItemPlaylist(
-                                          tokenID: tokenID, value: value),
+                                  ),
+                                addOnlyDivider(),
+                                Expanded(
+                                  child: NftCollectionGrid(
+                                    state: nftState.state,
+                                    tokens: nftState.tokens
+                                        .unique((token) => token.id)
+                                        .items,
+                                    loadingIndicatorBuilder: loadingView,
+                                    customGalleryViewBuilder:
+                                        (context, tokens) => _assetsWidget(
+                                      context,
+                                      setupPlayList(tokens: tokens),
+                                      onChanged: (tokenID, value) => bloc.add(
+                                        UpdateItemPlaylist(
+                                            tokenID: tokenID, value: value),
+                                      ),
+                                      selectedTokens: state.selectedIDs,
                                     ),
-                                    selectedTokens: state.selectedIDs,
                                   ),
                                 ),
-                              )
-                            ],
-                          ),
-                        ),
-                        Positioned(
-                          bottom: 30,
-                          child: SizedBox(
-                            width: MediaQuery.of(context).size.width,
-                            child: Center(
-                              child: Row(
-                                mainAxisAlignment:
-                                    MainAxisAlignment.spaceEvenly,
-                                children: [
-                                  PrimaryButton(
-                                    onTap: () {
-                                      Navigator.pop(context);
-                                      final metricClient =
-                                          injector<MetricClientService>();
-                                      metricClient.addEvent(
-                                          MixpanelEvent.undoCreatePlaylist);
-                                    },
-                                    width: 170,
-                                    text: 'cancel'.tr(),
-                                    color: theme.auLightGrey,
-                                  ),
-                                  PrimaryButton(
-                                    onTap: () {
-                                      if (selectedCount <= 0) {
-                                        return;
-                                      }
-                                      bloc.add(
-                                        CreatePlaylist(
-                                          name: _playlistNameC.text.isNotEmpty
-                                              ? _playlistNameC.text
-                                              : null,
-                                        ),
-                                      );
-                                    },
-                                    width: 170,
-                                    text: tr('save'),
-                                    color: theme.auSuperTeal,
-                                  ),
-                                ],
-                              ),
+                              ],
                             ),
                           ),
-                        ),
-                      ],
-                    ),
-                  );
-                }),
+                        ],
+                      ),
+                    )),
           ),
         );
       },
@@ -341,7 +313,9 @@ class _AddNewPlaylistScreenState extends State<AddNewPlaylistScreen>
         mainAxisSpacing: cellSpacing,
       ),
       itemBuilder: (context, index) {
-        if (index >= tokens.length) return const SizedBox();
+        if (index >= tokens.length) {
+          return const SizedBox();
+        }
         return ThumbnailPlaylistItem(
           token: tokens[index],
           cachedImageSize: cachedImageSize,
@@ -369,15 +343,15 @@ class ThumbnailPlaylistItem extends StatefulWidget {
   final bool showTriggerOrder;
 
   const ThumbnailPlaylistItem({
-    Key? key,
     required this.token,
     required this.cachedImageSize,
+    super.key,
     this.showSelect = true,
     this.isSelected = false,
     this.onChanged,
     this.showTriggerOrder = false,
     this.usingThumbnailID = true,
-  }) : super(key: key);
+  });
 
   @override
   State<ThumbnailPlaylistItem> createState() => _ThumbnailPlaylistItemState();
@@ -400,7 +374,7 @@ class _ThumbnailPlaylistItemState extends State<ThumbnailPlaylistItem> {
     super.didUpdateWidget(oldWidget);
   }
 
-  onChanged(value) {
+  void onChanged(bool? value) {
     setState(() {
       isSelected = !isSelected;
       widget.onChanged?.call(isSelected);
diff --git a/lib/screen/playlists/add_new_playlist/add_new_playlist_bloc.dart b/lib/screen/playlists/add_new_playlist/add_new_playlist_bloc.dart
index 0db664eb9..e240203a7 100644
--- a/lib/screen/playlists/add_new_playlist/add_new_playlist_bloc.dart
+++ b/lib/screen/playlists/add_new_playlist/add_new_playlist_bloc.dart
@@ -1,7 +1,10 @@
+import 'dart:async';
+
 import 'package:autonomy_flutter/au_bloc.dart';
 import 'package:autonomy_flutter/common/injector.dart';
 import 'package:autonomy_flutter/model/play_list_model.dart';
 import 'package:autonomy_flutter/screen/playlists/add_new_playlist/add_new_playlist_state.dart';
+import 'package:autonomy_flutter/service/configuration_service.dart';
 import 'package:autonomy_flutter/service/metric_client_service.dart';
 import 'package:autonomy_flutter/service/playlist_service.dart';
 import 'package:autonomy_flutter/service/settings_data_service.dart';
@@ -13,6 +16,7 @@ import 'package:uuid/uuid.dart';
 class AddNewPlaylistBloc
     extends AuBloc<AddNewPlaylistEvent, AddNewPlaylistState> {
   final PlaylistService _playListService;
+
   AddNewPlaylistBloc(this._playListService) : super(AddNewPlaylistState()) {
     on<InitPlaylist>((event, emit) {
       emit(
@@ -55,14 +59,14 @@ class AddNewPlaylistBloc
 
       playListModel?.tokenIDs = state.selectedIDs?.toSet().toList();
 
-      if (playListModel?.id == null) {
-        playListModel?.id = const Uuid().v4();
-        await _playListService.setPlayList([playListModel!]);
-        injector.get<SettingsDataService>().backup();
-      }
+      playListModel?.id ??= const Uuid().v4();
+      await _playListService
+          .setPlayList([playListModel!], onConflict: ConflictAction.replace);
+      unawaited(injector.get<SettingsDataService>().backup());
+
       emit(state.copyWith(isAddSuccess: true));
       final metricClient = injector<MetricClientService>();
-      metricClient.addEvent(MixpanelEvent.createPlaylist);
+      unawaited(metricClient.addEvent(MixpanelEvent.createPlaylist));
     });
   }
 }
diff --git a/lib/screen/playlists/add_new_playlist/add_new_playlist_state.dart b/lib/screen/playlists/add_new_playlist/add_new_playlist_state.dart
index 892f2b1f6..8e41bd2d0 100644
--- a/lib/screen/playlists/add_new_playlist/add_new_playlist_state.dart
+++ b/lib/screen/playlists/add_new_playlist/add_new_playlist_state.dart
@@ -1,27 +1,30 @@
-import 'package:nft_collection/models/asset_token.dart';
-
 import 'package:autonomy_flutter/model/play_list_model.dart';
+import 'package:nft_collection/models/asset_token.dart';
 
 abstract class AddNewPlaylistEvent {}
 
 class InitPlaylist extends AddNewPlaylistEvent {
   final PlayListModel? playListModel;
+
   InitPlaylist({this.playListModel});
 }
 
 class UpdateItemPlaylist extends AddNewPlaylistEvent {
   final String tokenID;
   final bool value;
+
   UpdateItemPlaylist({required this.tokenID, required this.value});
 }
 
 class SelectItemPlaylist extends AddNewPlaylistEvent {
   final bool isSelectAll;
+
   SelectItemPlaylist({required this.isSelectAll});
 }
 
 class CreatePlaylist extends AddNewPlaylistEvent {
   final String? name;
+
   CreatePlaylist({required this.name});
 }
 
@@ -30,6 +33,7 @@ class AddNewPlaylistState {
   PlayListModel? playListModel;
   List<String>? selectedIDs;
   bool? isAddSuccess;
+
   AddNewPlaylistState({
     this.tokens,
     this.playListModel,
@@ -42,12 +46,10 @@ class AddNewPlaylistState {
     PlayListModel? playListModel,
     List<String>? selectedIDs,
     bool isAddSuccess = false,
-  }) {
-    return AddNewPlaylistState(
+  }) => AddNewPlaylistState(
       tokens: tokens ?? this.tokens,
       playListModel: playListModel ?? this.playListModel,
       isAddSuccess: isAddSuccess,
       selectedIDs: selectedIDs ?? this.selectedIDs,
     );
-  }
 }
diff --git a/lib/screen/playlists/add_to_playlist/add_to_playlist.dart b/lib/screen/playlists/add_to_playlist/add_to_playlist.dart
new file mode 100644
index 000000000..c226d9c84
--- /dev/null
+++ b/lib/screen/playlists/add_to_playlist/add_to_playlist.dart
@@ -0,0 +1,440 @@
+import 'dart:async';
+
+import 'package:after_layout/after_layout.dart';
+import 'package:autonomy_flutter/common/injector.dart';
+import 'package:autonomy_flutter/database/cloud_database.dart';
+import 'package:autonomy_flutter/database/entity/connection.dart';
+import 'package:autonomy_flutter/model/play_list_model.dart';
+import 'package:autonomy_flutter/screen/playlists/add_new_playlist/add_new_playlist_bloc.dart';
+import 'package:autonomy_flutter/screen/playlists/add_new_playlist/add_new_playlist_state.dart';
+import 'package:autonomy_flutter/service/account_service.dart';
+import 'package:autonomy_flutter/service/configuration_service.dart';
+import 'package:autonomy_flutter/service/metric_client_service.dart';
+import 'package:autonomy_flutter/util/constants.dart';
+import 'package:autonomy_flutter/util/style.dart';
+import 'package:autonomy_flutter/util/token_ext.dart';
+import 'package:autonomy_flutter/view/artwork_common_widget.dart';
+import 'package:autonomy_flutter/view/back_appbar.dart';
+import 'package:autonomy_flutter/view/radio_check_box.dart';
+import 'package:autonomy_flutter/view/responsive.dart';
+import 'package:autonomy_flutter/view/search_bar.dart';
+import 'package:autonomy_theme/autonomy_theme.dart';
+import 'package:easy_localization/easy_localization.dart';
+import 'package:flutter/material.dart';
+import 'package:flutter/rendering.dart';
+import 'package:flutter/services.dart';
+import 'package:flutter_bloc/flutter_bloc.dart';
+import 'package:nft_collection/models/asset_token.dart';
+import 'package:nft_collection/nft_collection.dart';
+
+class AddToCollectionScreen extends StatefulWidget {
+  final PlayListModel playList;
+
+  const AddToCollectionScreen({required this.playList, super.key});
+
+  @override
+  State<AddToCollectionScreen> createState() => _AddToCollectionScreenState();
+}
+
+class _AddToCollectionScreenState extends State<AddToCollectionScreen>
+    with AfterLayoutMixin {
+  final bloc = injector.get<AddNewPlaylistBloc>();
+  final nftBloc = injector.get<NftCollectionBloc>();
+
+  final _controller = ScrollController();
+  late String _searchText;
+  late bool _showSearchBar;
+  List<String>? _initSelectedTokenIds;
+
+  @override
+  void initState() {
+    _searchText = '';
+    _showSearchBar = false;
+    super.initState();
+
+    _controller
+      ..addListener(_scrollListenerToLoadMore)
+      ..addListener(_scrollListenerToShowSearchBar);
+    unawaited(refreshTokens().then((value) {
+      nftBloc.add(GetTokensByOwnerEvent(pageKey: PageKey.init()));
+    }));
+    bloc.add(InitPlaylist(playListModel: widget.playList));
+  }
+
+  @override
+  void afterFirstLayout(BuildContext context) {
+    unawaited(
+        injector<ConfigurationService>().setAlreadyShowCreatePlaylistTip(true));
+    injector<ConfigurationService>().showCreatePlaylistTip.value = false;
+  }
+
+  void _scrollListenerToLoadMore() {
+    if (_controller.position.pixels + 100 >=
+        _controller.position.maxScrollExtent) {
+      _loadMore();
+    }
+  }
+
+  void _scrollListenerToShowSearchBar() {
+    if (_controller.position.pixels <= 10 &&
+        _controller.position.userScrollDirection == ScrollDirection.forward) {
+      setState(() {
+        _showSearchBar = true;
+      });
+    }
+  }
+
+  Future<void> _scrollToTop() async {
+    await _controller.animateTo(
+      0,
+      duration: const Duration(milliseconds: 300),
+      curve: Curves.easeOut,
+    );
+  }
+
+  void _loadMore() {
+    final nextKey = nftBloc.state.nextKey;
+    if (nextKey == null || nextKey.isLoaded) {
+      return;
+    }
+    nftBloc.add(GetTokensByOwnerEvent(pageKey: nextKey));
+  }
+
+  Future<List<String>> getManualTokenIds() async {
+    final cloudDb = injector<CloudDatabase>();
+    final tokenIndexerIDs = (await cloudDb.connectionDao.getConnectionsByType(
+            ConnectionType.manuallyIndexerTokenID.rawValue))
+        .map((e) => e.key)
+        .toList();
+    return tokenIndexerIDs;
+  }
+
+  Future<List<String>> getAddresses() async {
+    final accountService = injector<AccountService>();
+    return await accountService.getAllAddresses();
+  }
+
+  Future refreshTokens() async {
+    final indexerIds = await getManualTokenIds();
+
+    nftBloc.add(RefreshNftCollectionByOwners(
+      debugTokens: indexerIds,
+    ));
+  }
+
+  @override
+  void dispose() {
+    super.dispose();
+  }
+
+  List<CompactedAssetToken> setupPlayList({
+    required List<CompactedAssetToken> tokens,
+    List<String>? selectedTokenIds,
+  }) {
+    tokens = tokens.filterAssetToken().filterByTitleContain(_searchText);
+    bloc.state.tokens = tokens;
+    if (tokens.length <= INDEXER_TOKENS_MAXIMUM) {
+      _loadMore();
+    }
+    return tokens;
+  }
+
+  List<CompactedAssetToken> reoderPlaylist({
+    required List<CompactedAssetToken> tokens,
+    List<String>? selectedTokenIds,
+  }) {
+    final filterSellectedTokens = tokens
+        .where((element) => selectedTokenIds?.contains(element.id) ?? false)
+        .toList();
+    final unselectedTokens = tokens
+        .where((element) => !(selectedTokenIds?.contains(element.id) ?? false))
+        .toList();
+    return filterSellectedTokens..addAll(unselectedTokens);
+  }
+
+  @override
+  Widget build(BuildContext context) {
+    final theme = Theme.of(context);
+    return BlocConsumer<AddNewPlaylistBloc, AddNewPlaylistState>(
+      bloc: bloc,
+      listener: (context, state) {
+        if (state.isAddSuccess == true) {
+          Navigator.pop(context, state.playListModel);
+        }
+        if (state.selectedIDs != null && _initSelectedTokenIds == null) {
+          setState(() {
+            _initSelectedTokenIds = state.selectedIDs!.toList();
+          });
+        }
+      },
+      builder: (context, state) {
+        final nftState = nftBloc.state;
+        final selectedCount = nftState.tokens.items
+            .where(
+                (element) => state.selectedIDs?.contains(element.id) ?? false)
+            .length;
+        return Scaffold(
+          backgroundColor: theme.colorScheme.background,
+          appBar: getDoneAppBar(
+            context,
+            title: 'adding_to'.tr(namedArgs: {
+              'title': widget.playList.getName(),
+            }),
+            onDone: (selectedCount > 0)
+                ? () {
+                    bloc.add(
+                      CreatePlaylist(
+                        name: widget.playList.name ?? '',
+                      ),
+                    );
+                  }
+                : null,
+            onCancel: () {
+              Navigator.pop(context);
+              unawaited(injector<MetricClientService>()
+                  .addEvent(MixpanelEvent.undoCreatePlaylist));
+            },
+            bottom: PreferredSize(
+              preferredSize: const Size.fromHeight(0.25),
+              child:
+                  addOnlyDivider(color: AppColor.auQuickSilver, border: 0.25),
+            ),
+          ),
+          body: AnnotatedRegion<SystemUiOverlayStyle>(
+            value: SystemUiOverlayStyle.light,
+            child: BlocBuilder<NftCollectionBloc, NftCollectionBlocState>(
+                bloc: nftBloc,
+                builder: (context, nftState) => SafeArea(
+                      top: false,
+                      bottom: false,
+                      child: Column(
+                        children: [
+                          if (_showSearchBar)
+                            Column(
+                              children: [
+                                Padding(
+                                  padding:
+                                      const EdgeInsets.fromLTRB(15, 20, 15, 18),
+                                  child: ActionBar(
+                                    searchBar: AuSearchBar(
+                                      onChanged: (text) {
+                                        setState(() {
+                                          _searchText = text;
+                                        });
+                                      },
+                                    ),
+                                    onCancel: () async {
+                                      setState(() {
+                                        _searchText = '';
+                                        _showSearchBar = false;
+                                      });
+                                      await _scrollToTop();
+                                    },
+                                  ),
+                                ),
+                                addOnlyDivider(),
+                              ],
+                            ),
+                          Expanded(
+                            child: NftCollectionGrid(
+                              state: nftState.state,
+                              tokens: nftState.tokens.items,
+                              loadingIndicatorBuilder: loadingView,
+                              customGalleryViewBuilder: (context, tokens) =>
+                                  _assetsWidget(
+                                context,
+                                reoderPlaylist(
+                                    tokens: setupPlayList(tokens: tokens),
+                                    selectedTokenIds: _initSelectedTokenIds),
+                                onChanged: (tokenID, value) => bloc.add(
+                                  UpdateItemPlaylist(
+                                      tokenID: tokenID, value: value),
+                                ),
+                                selectedTokens: state.selectedIDs,
+                              ),
+                            ),
+                          )
+                        ],
+                      ),
+                    )),
+          ),
+        );
+      },
+    );
+  }
+
+  Widget _assetsWidget(
+    BuildContext context,
+    List<CompactedAssetToken> tokens, {
+    Function(String tokenID, bool value)? onChanged,
+    List<String>? selectedTokens,
+  }) {
+    int cellPerRow =
+        ResponsiveLayout.isMobile ? cellPerRowPhone : cellPerRowTablet;
+
+    final estimatedCellWidth = MediaQuery.of(context).size.width / cellPerRow -
+        cellSpacing * (cellPerRow - 1);
+    final cachedImageSize = (estimatedCellWidth * 3).ceil();
+
+    return GridView.builder(
+      controller: _controller,
+      gridDelegate: SliverGridDelegateWithFixedCrossAxisCount(
+        crossAxisCount: cellPerRow,
+        crossAxisSpacing: cellSpacing,
+        mainAxisSpacing: cellSpacing,
+      ),
+      itemBuilder: (context, index) => ThubnailPlaylistItem(
+        token: tokens[index],
+        cachedImageSize: cachedImageSize,
+        isSelected: selectedTokens?.contains(tokens[index].id) ?? false,
+        onChanged: (value) {
+          onChanged?.call(tokens[index].id, value ?? false);
+        },
+        usingThumbnailID: index > 50,
+      ),
+      itemCount: tokens.length,
+    );
+  }
+}
+
+class ThubnailPlaylistItem extends StatefulWidget {
+  final bool showSelect;
+  final bool isSelected;
+  final CompactedAssetToken token;
+  final Function(bool?)? onChanged;
+  final int cachedImageSize;
+  final bool usingThumbnailID;
+  final bool showTriggerOrder;
+
+  const ThubnailPlaylistItem({
+    required this.token,
+    required this.cachedImageSize,
+    super.key,
+    this.showSelect = true,
+    this.isSelected = false,
+    this.onChanged,
+    this.showTriggerOrder = false,
+    this.usingThumbnailID = true,
+  });
+
+  @override
+  State<ThubnailPlaylistItem> createState() => _ThubnailPlaylistItemState();
+}
+
+class _ThubnailPlaylistItemState extends State<ThubnailPlaylistItem> {
+  bool isSelected = false;
+
+  @override
+  void initState() {
+    super.initState();
+    isSelected = widget.isSelected;
+  }
+
+  @override
+  void didUpdateWidget(covariant ThubnailPlaylistItem oldWidget) {
+    setState(() {
+      isSelected = widget.isSelected;
+    });
+    super.didUpdateWidget(oldWidget);
+  }
+
+  void onChanged(bool? value) {
+    setState(() {
+      isSelected = !isSelected;
+      widget.onChanged?.call(isSelected);
+    });
+  }
+
+  @override
+  Widget build(BuildContext context) {
+    final theme = Theme.of(context);
+    return GestureDetector(
+      onTap: () => onChanged(isSelected),
+      child: Stack(
+        children: [
+          SizedBox(
+            width: double.infinity,
+            height: double.infinity,
+            child: tokenGalleryThumbnailWidget(
+              context,
+              widget.token,
+              widget.cachedImageSize,
+              usingThumbnailID: widget.usingThumbnailID,
+              useHero: false,
+            ),
+          ),
+          Positioned(
+            top: 10,
+            right: 10,
+            child: Visibility(
+              visible: widget.showSelect,
+              child: RadioSelectAddress(
+                isChecked: isSelected,
+                borderColor: theme.colorScheme.secondary,
+                onTap: onChanged,
+              ),
+            ),
+          ),
+          Visibility(
+            visible: widget.showTriggerOrder,
+            child: Positioned(
+              bottom: 10,
+              left: 0,
+              right: 0,
+              child: Align(
+                child: Column(
+                  children: [
+                    Container(
+                      width: 20,
+                      height: 2,
+                      decoration: BoxDecoration(
+                        borderRadius: BorderRadius.circular(60),
+                        color: theme.colorScheme.secondary,
+                      ),
+                    ),
+                    const SizedBox(
+                      height: 2,
+                    ),
+                    Container(
+                      width: 20,
+                      height: 2,
+                      decoration: BoxDecoration(
+                        borderRadius: BorderRadius.circular(60),
+                        color: theme.colorScheme.secondary,
+                      ),
+                    ),
+                    const SizedBox(
+                      height: 2,
+                    ),
+                    Container(
+                      width: 20,
+                      height: 2,
+                      decoration: BoxDecoration(
+                        borderRadius: BorderRadius.circular(60),
+                        color: theme.colorScheme.secondary,
+                      ),
+                    ),
+                  ],
+                ),
+              ),
+            ),
+          ),
+        ],
+      ),
+    );
+  }
+}
+
+Widget loadingView(BuildContext context) {
+  final theme = Theme.of(context);
+  return Center(
+      child: Column(
+    children: [
+      CircularProgressIndicator(
+        backgroundColor: Colors.white60,
+        color: theme.colorScheme.secondary,
+        strokeWidth: 2,
+      ),
+    ],
+  ));
+}
diff --git a/lib/screen/playlists/edit_playlist/edit_playlist.dart b/lib/screen/playlists/edit_playlist/edit_playlist.dart
index 2247741d8..4c0eb4d1d 100644
--- a/lib/screen/playlists/edit_playlist/edit_playlist.dart
+++ b/lib/screen/playlists/edit_playlist/edit_playlist.dart
@@ -1,32 +1,40 @@
+import 'dart:async';
+
 import 'package:autonomy_flutter/common/injector.dart';
 import 'package:autonomy_flutter/model/play_list_model.dart';
-import 'package:autonomy_flutter/screen/playlists/add_new_playlist/add_new_playlist.dart';
 import 'package:autonomy_flutter/screen/app_router.dart';
+import 'package:autonomy_flutter/screen/playlists/add_new_playlist/add_new_playlist.dart';
+import 'package:autonomy_flutter/screen/playlists/edit_playlist/edit_playlist_bloc.dart';
+import 'package:autonomy_flutter/screen/playlists/edit_playlist/edit_playlist_state.dart';
+import 'package:autonomy_flutter/screen/playlists/edit_playlist/widgets/edit_playlist_gridview.dart';
+import 'package:autonomy_flutter/screen/playlists/edit_playlist/widgets/text_name_playlist.dart';
+import 'package:autonomy_flutter/screen/playlists/view_playlist/view_playlist.dart';
+import 'package:autonomy_flutter/service/navigation_service.dart';
 import 'package:autonomy_flutter/service/playlist_service.dart';
 import 'package:autonomy_flutter/service/settings_data_service.dart';
-import 'package:autonomy_flutter/util/au_icons.dart';
-
+import 'package:autonomy_flutter/util/asset_token_ext.dart';
+import 'package:autonomy_flutter/util/constants.dart';
+import 'package:autonomy_flutter/util/iterable_ext.dart';
+import 'package:autonomy_flutter/util/string_ext.dart';
+import 'package:autonomy_flutter/util/style.dart';
+import 'package:autonomy_flutter/util/token_ext.dart';
 import 'package:autonomy_flutter/util/ui_helper.dart';
+import 'package:autonomy_flutter/view/back_appbar.dart';
 import 'package:autonomy_flutter/view/primary_button.dart';
+import 'package:autonomy_flutter/view/responsive.dart';
+import 'package:autonomy_flutter/view/search_bar.dart';
+import 'package:autonomy_theme/autonomy_theme.dart';
 import 'package:easy_localization/easy_localization.dart';
 import 'package:flutter/material.dart';
+import 'package:flutter/rendering.dart';
 import 'package:flutter_bloc/flutter_bloc.dart';
 import 'package:nft_collection/models/asset_token.dart';
 import 'package:nft_collection/nft_collection.dart';
-import 'package:autonomy_theme/autonomy_theme.dart';
-import 'package:autonomy_flutter/util/asset_token_ext.dart';
-import 'package:autonomy_flutter/service/navigation_service.dart';
-import '../../../util/iterable_ext.dart';
-import 'widgets/edit_playlist_gridview.dart';
-import 'edit_playlist_bloc.dart';
-import 'edit_playlist_state.dart';
-import '../../../util/string_ext.dart';
-import '../../../util/token_ext.dart';
 
 class EditPlaylistScreen extends StatefulWidget {
   final PlayListModel? playListModel;
 
-  const EditPlaylistScreen({Key? key, this.playListModel}) : super(key: key);
+  const EditPlaylistScreen({super.key, this.playListModel});
 
   @override
   State<EditPlaylistScreen> createState() => _EditPlaylistScreenState();
@@ -36,11 +44,18 @@ class _EditPlaylistScreenState extends State<EditPlaylistScreen> {
   final bloc = injector.get<EditPlaylistBloc>();
   final nftBloc = injector.get<NftCollectionBloc>(param1: false);
   List<CompactedAssetToken> tokensPlaylist = [];
+  final _focusNode = FocusNode();
+  late bool _showSearchBar;
+  late String _searchText;
+  late ScrollController _controller;
 
   @override
   void initState() {
     super.initState();
-
+    _showSearchBar = false;
+    _searchText = '';
+    _controller = ScrollController();
+    _controller.addListener(_scrollListenerToShowSearchBar);
     nftBloc.add(RefreshNftCollectionByIDs(ids: widget.playListModel?.tokenIDs));
     bloc.add(InitPlayList(
       playListModel: widget.playListModel?.copyWith(
@@ -55,8 +70,8 @@ class _EditPlaylistScreenState extends State<EditPlaylistScreen> {
     final listPlaylist = await _playlistService.getPlayList();
     listPlaylist
         .removeWhere((element) => element.id == widget.playListModel?.id);
-    _playlistService.setPlayList(listPlaylist, override: true);
-    injector.get<SettingsDataService>().backup();
+    await _playlistService.setPlayList(listPlaylist, override: true);
+    unawaited(injector.get<SettingsDataService>().backup());
     injector<NavigationService>().popUntilHomeOrSettings();
   }
 
@@ -64,32 +79,91 @@ class _EditPlaylistScreenState extends State<EditPlaylistScreen> {
     required List<CompactedAssetToken> tokens,
     List<String>? tokenIDs,
   }) {
-    tokens = tokens.filterAssetToken();
+    tokens = tokens.filterAssetToken().filterByTitleContain(_searchText);
 
     final temp = tokenIDs
             ?.map((e) =>
                 tokens.where((element) => element.id == e).firstOrDefault())
             .toList() ??
-        [];
-
-    temp.removeWhere((element) => element == null);
+        []
+      ..removeWhere((element) => element == null);
     tokensPlaylist = List.from(temp);
 
     return tokensPlaylist;
   }
 
+  void _scrollListenerToShowSearchBar() {
+    if (_controller.position.pixels <= 10 &&
+        _controller.position.userScrollDirection == ScrollDirection.forward) {
+      setState(() {
+        _showSearchBar = true;
+      });
+    }
+  }
+
+  Future<void> _scrollToTop() async {
+    await _controller.animateTo(
+      0,
+      duration: const Duration(milliseconds: 300),
+      curve: Curves.easeOut,
+    );
+  }
+
+  void onSave(PlayListModel? playList) {
+    final thubnailUrl = tokensPlaylist
+        .where((element) => element.id == playList?.tokenIDs.firstOrDefault())
+        .firstOrDefault()
+        ?.getGalleryThumbnailUrl();
+    playList?.thumbnailURL = thubnailUrl;
+    bloc.add(SavePlaylist());
+  }
+
+  Widget _assetsWidget(
+    BuildContext context,
+    List<CompactedAssetToken> tokens, {
+    Function(String tokenID, bool value)? onChanged,
+    List<String>? selectedTokens,
+  }) {
+    int cellPerRow =
+        ResponsiveLayout.isMobile ? cellPerRowPhone : cellPerRowTablet;
+
+    final estimatedCellWidth = MediaQuery.of(context).size.width / cellPerRow -
+        cellSpacing * (cellPerRow - 1);
+    final cachedImageSize = (estimatedCellWidth * 3).ceil();
+
+    return GridView.builder(
+      controller: _controller,
+      gridDelegate: SliverGridDelegateWithFixedCrossAxisCount(
+        crossAxisCount: cellPerRow,
+        crossAxisSpacing: cellSpacing,
+        mainAxisSpacing: cellSpacing,
+      ),
+      itemBuilder: (context, index) => ThumbnailPlaylistItem(
+        token: tokens[index],
+        cachedImageSize: cachedImageSize,
+        isSelected: selectedTokens?.contains(tokens[index].id) ?? false,
+        onChanged: (value) {
+          onChanged?.call(tokens[index].id, value ?? false);
+        },
+        usingThumbnailID: index > 50,
+      ),
+      itemCount: tokens.length,
+    );
+  }
+
   @override
   Widget build(BuildContext context) {
     final theme = Theme.of(context);
     return BlocConsumer<EditPlaylistBloc, EditPlaylistState>(
       bloc: bloc,
-      listener: (context, state) {
+      listener: (context, state) async {
         if (state.isAddSuccess ?? false) {
           injector<NavigationService>().popUntilHomeOrSettings();
-          Navigator.pushNamed(
+          await Navigator.pushNamed(
             context,
             AppRouter.viewPlayListPage,
-            arguments: state.playListModel,
+            arguments:
+                ViewPlaylistScreenPayload(playListModel: state.playListModel),
           );
         }
       },
@@ -98,25 +172,25 @@ class _EditPlaylistScreenState extends State<EditPlaylistScreen> {
         final selectedItem = state.selectedItem ?? [];
 
         return Scaffold(
-          appBar: AppBar(
-            elevation: 1,
-            leading: GestureDetector(
-              onTap: () => Navigator.of(context).pop(),
-              child: const Icon(AuIcon.chevron),
+          appBar: getCustomDoneAppBar(
+            context,
+            title: TextNamePlaylist(
+              focusNode: _focusNode,
+              playList: playList,
+              onEditPlaylistName: (value) {
+                bloc.add(UpdateNamePlaylist(name: value));
+              },
             ),
-            actions: const [
-              SizedBox(
-                width: 50,
-              )
-            ],
-            backgroundColor: theme.colorScheme.background,
-            automaticallyImplyLeading: false,
-            centerTitle: true,
-            title: Text(
-              (playList?.name?.isNotEmpty ?? false)
-                  ? playList!.name!
-                  : tr('untitled'),
-              style: theme.textTheme.ppMori400Black14,
+            onDone: () {
+              onSave(playList);
+            },
+            onCancel: () {
+              Navigator.of(context).pop();
+            },
+            bottom: PreferredSize(
+              preferredSize: const Size.fromHeight(0.25),
+              child:
+                  addOnlyDivider(color: AppColor.auQuickSilver, border: 0.25),
             ),
           ),
           body: SafeArea(
@@ -125,39 +199,67 @@ class _EditPlaylistScreenState extends State<EditPlaylistScreen> {
               children: [
                 BlocConsumer<NftCollectionBloc, NftCollectionBlocState>(
                   bloc: nftBloc,
-                  builder: (context, nftState) {
-                    return NftCollectionGrid(
-                      state: nftState.state,
-                      tokens: nftState.tokens.items,
-                      loadingIndicatorBuilder: loadingView,
-                      customGalleryViewBuilder: (gridContext, tokens) {
-                        final listToken = setupPlayList(
-                          tokens: tokens,
-                          tokenIDs: playList?.tokenIDs ?? [],
-                        );
-                        return Column(
-                          children: [
+                  builder: (context, nftState) => NftCollectionGrid(
+                    state: nftState.state,
+                    tokens: nftState.tokens.items,
+                    loadingIndicatorBuilder: loadingView,
+                    customGalleryViewBuilder: (gridContext, tokens) {
+                      final listToken = setupPlayList(
+                        tokens: tokens,
+                        tokenIDs: playList?.tokenIDs ?? [],
+                      );
+                      return Column(
+                        children: [
+                          if (listToken.isEmpty)
                             Padding(
-                              padding: const EdgeInsets.only(
-                                left: 14,
-                                right: 14,
-                                top: 24,
-                              ),
-                              child: Padding(
-                                padding: const EdgeInsets.only(bottom: 15),
-                                child: listToken.isEmpty
-                                    ? tokenEmptyAction(theme, playList)
-                                    : tokenAction(
-                                        selectedItem,
-                                        theme,
-                                        context,
-                                        playList,
-                                      ),
-                              ),
+                                padding: const EdgeInsets.only(
+                                    left: 14, right: 14, top: 24, bottom: 15),
+                                child: tokenEmptyAction(theme, playList)),
+                          if (_showSearchBar)
+                            Column(
+                              children: [
+                                Padding(
+                                  padding:
+                                      const EdgeInsets.fromLTRB(15, 20, 15, 18),
+                                  child: ActionBar(
+                                    searchBar: AuSearchBar(
+                                      onChanged: (text) {
+                                        setState(() {
+                                          _searchText = text;
+                                        });
+                                      },
+                                    ),
+                                    onCancel: () async {
+                                      setState(() {
+                                        _searchText = '';
+                                        _showSearchBar = false;
+                                      });
+                                      await _scrollToTop();
+                                    },
+                                  ),
+                                ),
+                                addOnlyDivider(),
+                              ],
                             ),
+                          if (_showSearchBar)
+                            Expanded(
+                              child: _assetsWidget(
+                                context,
+                                listToken,
+                                onChanged: (tokenID, value) => bloc.add(
+                                  UpdateSelectedPlaylist(
+                                    tokenID: tokenID,
+                                    value: value,
+                                  ),
+                                ),
+                                selectedTokens: selectedItem,
+                              ),
+                            )
+                          else
                             Expanded(
                               child: EditPlaylistGridView(
-                                onAddTap: () => Navigator.pushNamed(
+                                controller: _controller,
+                                onAddTap: () async => Navigator.pushNamed(
                                   context,
                                   AppRouter.createPlayListPage,
                                   arguments: playList,
@@ -191,45 +293,92 @@ class _EditPlaylistScreenState extends State<EditPlaylistScreen> {
                                 ),
                               ),
                             ),
-                          ],
-                        );
-                      },
-                    );
-                  },
+                        ],
+                      );
+                    },
+                  ),
                   listener: (context, nftState) {},
                 ),
                 BlocBuilder<NftCollectionBloc, NftCollectionBlocState>(
-                    bloc: nftBloc,
-                    builder: (context, state) {
-                      return Positioned(
-                        bottom: 30,
-                        child: SizedBox(
-                          width: MediaQuery.of(context).size.width,
-                          child: Center(
-                            child: Row(
-                              mainAxisAlignment: MainAxisAlignment.spaceEvenly,
-                              children: [
-                                PrimaryButton(
-                                  onTap: () {
-                                    final thumbnailUrl = tokensPlaylist
-                                        .where((element) =>
-                                            element.id ==
-                                            playList?.tokenIDs.firstOrDefault())
-                                        .firstOrDefault()
-                                        ?.getGalleryThumbnailUrl();
-                                    playList?.thumbnailURL = thumbnailUrl;
-                                    bloc.add(SavePlaylist());
-                                  },
-                                  width: 170,
-                                  text: tr('done').capitalize(),
-                                  color: theme.auSuperTeal,
-                                ),
-                              ],
+                  bloc: nftBloc,
+                  builder: (context, nftState) => Positioned(
+                    bottom: 30,
+                    child: SizedBox(
+                      width: MediaQuery.of(context).size.width,
+                      child: Center(
+                        child: Row(
+                          mainAxisAlignment: MainAxisAlignment.spaceEvenly,
+                          children: [
+                            PrimaryButton(
+                              onTap: () async {
+                                selectedItem.isEmpty
+                                    ? null
+                                    : await UIHelper.showMessageActionNew(
+                                        context,
+                                        tr('remove_from_list'),
+                                        '',
+                                        descriptionWidget: RichText(
+                                          text: TextSpan(
+                                            children: [
+                                              TextSpan(
+                                                style: theme
+                                                    .textTheme.ppMori400White16,
+                                                text: 'you_are_about_to_remove'
+                                                    .tr(),
+                                              ),
+                                              TextSpan(
+                                                style: theme
+                                                    .textTheme.ppMori700White16,
+                                                text: tr(
+                                                  selectedItem.length != 1
+                                                      ? 'artworks'
+                                                      : 'artwork',
+                                                  args: [
+                                                    selectedItem.length
+                                                        .toString()
+                                                  ],
+                                                ),
+                                              ),
+                                              TextSpan(
+                                                style: theme
+                                                    .textTheme.ppMori400White16,
+                                                text: 'from_the_playlist'.tr(),
+                                              ),
+                                              TextSpan(
+                                                style: theme
+                                                    .textTheme.ppMori700White16,
+                                                text: playList?.name ??
+                                                    tr('untitled'),
+                                              ),
+                                              TextSpan(
+                                                style: theme
+                                                    .textTheme.ppMori400White16,
+                                                text: 'they_will_remain'.tr(),
+                                              ),
+                                            ],
+                                          ),
+                                        ),
+                                        actionButton: 'remove'.tr(),
+                                        onAction: () {
+                                          Navigator.pop(context);
+                                          bloc.add(
+                                            RemoveTokens(
+                                              tokenIDs: selectedItem,
+                                            ),
+                                          );
+                                        },
+                                      );
+                              },
+                              width: 170,
+                              text: tr('remove').capitalize(),
+                              color: AppColor.feralFileHighlight,
                             ),
-                          ),
+                          ],
                         ),
-                      );
-                    }),
+                      ),
+                    ),
+                  ),
+                ),
               ],
             ),
           ),
@@ -238,111 +387,37 @@ class _EditPlaylistScreenState extends State<EditPlaylistScreen> {
     );
   }
 
-  Widget tokenAction(List<String> selectedItem, ThemeData theme,
-      BuildContext context, PlayListModel? playList) {
-    return Row(
-      children: [
-        Text(
-          tr(
-              selectedItem.length != 1
-                  ? 'artworks_selected'
-                  : 'artwork_selected',
-              args: [selectedItem.length.toString()]),
-          style: theme.textTheme.ppMori400Black12,
-        ),
-        const Spacer(),
-        GestureDetector(
-          onTap: selectedItem.isEmpty
-              ? null
-              : () => UIHelper.showMessageActionNew(
-                    context,
-                    tr('remove_from_list'),
-                    '',
-                    descriptionWidget: RichText(
-                      text: TextSpan(children: [
-                        TextSpan(
-                          style: theme.textTheme.ppMori400White16,
-                          text: "you_are_about_to_remove".tr(),
-                        ),
-                        TextSpan(
-                          style: theme.textTheme.ppMori700White16,
-                          text: tr(
-                              selectedItem.length != 1 ? 'artworks' : 'artwork',
-                              args: [selectedItem.length.toString()]),
-                        ),
-                        TextSpan(
-                          style: theme.textTheme.ppMori400White16,
-                          text: "from_the_playlist".tr(),
-                        ),
-                        TextSpan(
-                          style: theme.textTheme.ppMori700White16,
-                          text: playList?.name ?? tr('untitled'),
-                        ),
-                        TextSpan(
-                          style: theme.textTheme.ppMori400White16,
-                          text: "they_will_remain".tr(),
-                        ),
-                      ]),
-                    ),
-                    actionButton: "remove".tr(),
-                    onAction: () {
-                      Navigator.pop(context);
-                      bloc.add(
-                        RemoveTokens(
-                          tokenIDs: selectedItem,
-                        ),
-                      );
-                    },
-                  ),
-          child: Container(
-            padding: const EdgeInsets.symmetric(horizontal: 10, vertical: 4),
-            decoration: BoxDecoration(
-              color: theme.colorScheme.primary,
-              borderRadius: BorderRadius.circular(64),
-            ),
-            child: Text(
-              '${tr('remove')} ${selectedItem.isEmpty ? '' : '(${selectedItem.length})'}',
-              style: theme.textTheme.ppMori400White12,
-            ),
+  Widget tokenEmptyAction(ThemeData theme, PlayListModel? playList) => Row(
+        children: [
+          Text(
+            tr('no_artwork_in_this_playlist'),
+            style: theme.textTheme.ppMori400Black12,
           ),
-        ),
-      ],
-    );
-  }
-
-  Widget tokenEmptyAction(ThemeData theme, PlayListModel? playList) {
-    return Row(
-      children: [
-        Text(
-          tr('no_artwork_in_this_playlist'),
-          style: theme.textTheme.ppMori400Black12,
-        ),
-        const Spacer(),
-        GestureDetector(
-          onTap: () {
-            Navigator.pushNamed(
-              context,
-              AppRouter.createPlayListPage,
-              arguments: playList,
-            ).then((value) {
-              if (value != null && value is PlayListModel) {
-                bloc.add(SavePlaylist());
-              }
-            });
-          },
-          child: Container(
-            padding: const EdgeInsets.symmetric(horizontal: 10, vertical: 4),
-            decoration: BoxDecoration(
-              color: theme.colorScheme.primary,
-              borderRadius: BorderRadius.circular(64),
-            ),
-            child: Text(
-              tr('add'),
-              style: theme.textTheme.ppMori400White12,
+          const Spacer(),
+          GestureDetector(
+            onTap: () async {
+              await Navigator.pushNamed(
+                context,
+                AppRouter.createPlayListPage,
+                arguments: playList,
+              ).then((value) {
+                if (value != null && value is PlayListModel) {
+                  bloc.add(SavePlaylist());
+                }
+              });
+            },
+            child: Container(
+              padding: const EdgeInsets.symmetric(horizontal: 10, vertical: 4),
+              decoration: BoxDecoration(
+                color: theme.colorScheme.primary,
+                borderRadius: BorderRadius.circular(64),
+              ),
+              child: Text(
+                tr('add'),
+                style: theme.textTheme.ppMori400White12,
+              ),
             ),
-          ),
-        )
-      ],
-    );
-  }
+          )
+        ],
+      );
 }
diff --git a/lib/screen/playlists/edit_playlist/edit_playlist_bloc.dart b/lib/screen/playlists/edit_playlist/edit_playlist_bloc.dart
index 0c4fbc392..edf17f817 100644
--- a/lib/screen/playlists/edit_playlist/edit_playlist_bloc.dart
+++ b/lib/screen/playlists/edit_playlist/edit_playlist_bloc.dart
@@ -1,3 +1,5 @@
+import 'dart:async';
+
 import 'package:autonomy_flutter/common/injector.dart';
 import 'package:autonomy_flutter/screen/playlists/edit_playlist/edit_playlist_state.dart';
 import 'package:autonomy_flutter/service/playlist_service.dart';
@@ -46,6 +48,12 @@ class EditPlaylistBloc extends Bloc<EditPlaylistEvent, EditPlaylistState> {
       emit(state.copyWith(playListModel: playlist, selectedItem: []));
     });
 
+    on<UpdateNamePlaylist>((event, emit) {
+      final playlist = state.playListModel;
+      playlist?.name = event.name;
+      emit(state.copyWith(playListModel: playlist));
+    });
+
     on<SavePlaylist>((event, emit) async {
       final playListModel = state.playListModel;
       final service = injector.get<PlaylistService>();
@@ -55,8 +63,8 @@ class EditPlaylistBloc extends Bloc<EditPlaylistEvent, EditPlaylistState> {
           playlists.indexWhere((element) => element.id == playListModel?.id);
       if (index != -1 && playListModel != null) {
         playlists[index] = playListModel;
-        service.setPlayList(playlists, override: true);
-        injector.get<SettingsDataService>().backup();
+        await service.setPlayList(playlists, override: true);
+        unawaited(injector.get<SettingsDataService>().backup());
         emit(state.copyWith(isAddSuccess: true));
       }
     });
diff --git a/lib/screen/playlists/edit_playlist/edit_playlist_state.dart b/lib/screen/playlists/edit_playlist/edit_playlist_state.dart
index 8c5752070..4d86feb85 100644
--- a/lib/screen/playlists/edit_playlist/edit_playlist_state.dart
+++ b/lib/screen/playlists/edit_playlist/edit_playlist_state.dart
@@ -5,18 +5,27 @@ abstract class EditPlaylistEvent {}
 
 class InitPlayList extends EditPlaylistEvent {
   PlayListModel? playListModel;
+
   InitPlayList({this.playListModel});
 }
 
 class UpdateSelectedPlaylist extends EditPlaylistEvent {
   final String tokenID;
   final bool value;
+
   UpdateSelectedPlaylist({required this.tokenID, required this.value});
 }
 
+class UpdateNamePlaylist extends EditPlaylistEvent {
+  final String name;
+
+  UpdateNamePlaylist({required this.name});
+}
+
 class SelectAllPlaylist extends EditPlaylistEvent {
   final bool value;
   final List<String>? tokenIDs;
+
   SelectAllPlaylist({required this.value, this.tokenIDs});
 }
 
@@ -27,11 +36,13 @@ class SavePlaylist extends EditPlaylistEvent {
 class UpdateOrderPlaylist extends EditPlaylistEvent {
   final List<String>? tokenIDs;
   final String? thumbnailURL;
+
   UpdateOrderPlaylist({required this.tokenIDs, this.thumbnailURL});
 }
 
 class RemoveTokens extends EditPlaylistEvent {
   final List<String>? tokenIDs;
+
   RemoveTokens({required this.tokenIDs});
 }
 
@@ -39,6 +50,7 @@ class EditPlaylistState {
   PlayListModel? playListModel;
   List<String>? selectedItem;
   bool? isAddSuccess;
+
   EditPlaylistState({
     this.playListModel,
     this.selectedItem,
@@ -49,11 +61,10 @@ class EditPlaylistState {
     PlayListModel? playListModel,
     List<String>? selectedItem,
     bool isAddSuccess = false,
-  }) {
-    return EditPlaylistState(
-      playListModel: playListModel ?? this.playListModel,
-      selectedItem: selectedItem ?? this.selectedItem,
-      isAddSuccess: isAddSuccess,
-    );
-  }
+  }) =>
+      EditPlaylistState(
+        playListModel: playListModel ?? this.playListModel,
+        selectedItem: selectedItem ?? this.selectedItem,
+        isAddSuccess: isAddSuccess,
+      );
 }
diff --git a/lib/screen/playlists/edit_playlist/widgets/edit_playlist_gridview.dart b/lib/screen/playlists/edit_playlist/widgets/edit_playlist_gridview.dart
index f53e3fe30..f25e6e97f 100644
--- a/lib/screen/playlists/edit_playlist/widgets/edit_playlist_gridview.dart
+++ b/lib/screen/playlists/edit_playlist/widgets/edit_playlist_gridview.dart
@@ -16,14 +16,14 @@ class EditPlaylistGridView extends StatefulWidget {
   final Function()? onAddTap;
 
   const EditPlaylistGridView({
-    Key? key,
-    this.controller,
     required this.tokens,
+    required this.onReorder,
+    super.key,
+    this.controller,
     this.onChangedSelect,
     this.selectedTokens,
-    required this.onReorder,
     this.onAddTap,
-  }) : super(key: key);
+  });
 
   @override
   State<EditPlaylistGridView> createState() => _EditPlaylistGridViewState();
@@ -32,7 +32,7 @@ class EditPlaylistGridView extends StatefulWidget {
 class _EditPlaylistGridViewState extends State<EditPlaylistGridView> {
   final int cellPerRowPhone = 3;
   final int cellPerRowTablet = 6;
-  final double cellSpacing = 3.0;
+  final double cellSpacing = 3;
   late int cellPerRow;
 
   @override
@@ -46,30 +46,17 @@ class _EditPlaylistGridViewState extends State<EditPlaylistGridView> {
     final estimatedCellWidth = MediaQuery.of(context).size.width / cellPerRow -
         cellSpacing * (cellPerRow - 1);
     final cachedImageSize = (estimatedCellWidth * 3).ceil();
-
     return ReorderableGridView.count(
       controller: widget.controller,
-      footer: [
-        Visibility(
-          visible: widget.tokens.isNotEmpty,
-          child: GestureDetector(
-            onTap: widget.onAddTap,
-            child: const AddTokenWidget(),
-          ),
-        ),
-
-        /// add 3 blank cells to make space for done button
-        const SizedBox(),
-        const SizedBox(),
-        const SizedBox(),
-      ],
       onDragStart: (dragIndex) {
         Vibrate.feedback(FeedbackType.light);
       },
       onReorder: (oldIndex, newIndex) {
         setState(() {
           final element = widget.tokens.removeAt(oldIndex);
-          if (element != null) widget.tokens.insert(newIndex, element);
+          if (element != null) {
+            widget.tokens.insert(newIndex, element);
+          }
           widget.tokens.removeWhere((element) => element == null);
         });
         widget.onReorder.call(List.from(widget.tokens));
@@ -99,8 +86,8 @@ class _EditPlaylistGridViewState extends State<EditPlaylistGridView> {
 
 class AddTokenWidget extends StatelessWidget {
   const AddTokenWidget({
-    Key? key,
-  }) : super(key: key);
+    super.key,
+  });
 
   @override
   Widget build(BuildContext context) {
@@ -113,7 +100,7 @@ class AddTokenWidget extends StatelessWidget {
         color: Colors.transparent,
         child: Center(
           child: SvgPicture.asset(
-            "assets/images/joinFile.svg",
+            'assets/images/joinFile.svg',
             colorFilter: ColorFilter.mode(theme.primaryColor, BlendMode.srcIn),
           ),
         ),
diff --git a/lib/screen/playlists/edit_playlist/widgets/text_name_playlist.dart b/lib/screen/playlists/edit_playlist/widgets/text_name_playlist.dart
index 3aee769c8..6bcf5fa18 100644
--- a/lib/screen/playlists/edit_playlist/widgets/text_name_playlist.dart
+++ b/lib/screen/playlists/edit_playlist/widgets/text_name_playlist.dart
@@ -1,18 +1,19 @@
 import 'package:autonomy_flutter/model/play_list_model.dart';
 import 'package:autonomy_flutter/view/text_field.dart';
+import 'package:autonomy_theme/autonomy_theme.dart';
 import 'package:easy_localization/easy_localization.dart';
 import 'package:flutter/material.dart';
-import 'package:autonomy_theme/autonomy_theme.dart';
 
 class TextNamePlaylist extends StatefulWidget {
   final Function(String)? onEditPlaylistName;
   final FocusNode? focusNode;
+
   const TextNamePlaylist({
-    Key? key,
     required this.playList,
+    super.key,
     this.onEditPlaylistName,
     this.focusNode,
-  }) : super(key: key);
+  });
 
   final PlayListModel? playList;
 
@@ -49,7 +50,7 @@ class _TextNamePlaylistState extends State<TextNamePlaylist> {
       hintText: tr('untitled'),
       controller: _playlistNameC,
       cursorColor: theme.colorScheme.primary,
-      style: theme.textTheme.ppMori700Black14,
+      style: theme.textTheme.ppMori400Black14,
       hintStyle: theme.textTheme.ppMori400Grey14,
       textAlign: TextAlign.center,
       border: InputBorder.none,
diff --git a/lib/screen/playlists/list_playlists/list_playlists.dart b/lib/screen/playlists/list_playlists/list_playlists.dart
index abc477534..7cb71343f 100644
--- a/lib/screen/playlists/list_playlists/list_playlists.dart
+++ b/lib/screen/playlists/list_playlists/list_playlists.dart
@@ -2,19 +2,27 @@ import 'package:autonomy_flutter/common/injector.dart';
 import 'package:autonomy_flutter/main.dart';
 import 'package:autonomy_flutter/model/play_list_model.dart';
 import 'package:autonomy_flutter/screen/app_router.dart';
+import 'package:autonomy_flutter/screen/playlists/view_playlist/view_playlist.dart';
 import 'package:autonomy_flutter/service/configuration_service.dart';
-import 'package:autonomy_flutter/service/playlist_service.dart';
-import 'package:autonomy_flutter/service/settings_data_service.dart';
-import 'package:autonomy_flutter/service/versions_service.dart';
 import 'package:autonomy_flutter/util/au_icons.dart';
+import 'package:autonomy_flutter/util/collection_ext.dart';
 import 'package:autonomy_theme/autonomy_theme.dart';
 import 'package:cached_network_image/cached_network_image.dart';
 import 'package:easy_localization/easy_localization.dart';
 import 'package:flutter/material.dart';
-import 'package:flutter_vibrate/flutter_vibrate.dart';
 
 class ListPlaylistsScreen extends StatefulWidget {
-  const ListPlaylistsScreen({Key? key}) : super(key: key);
+  final ValueNotifier<List<PlayListModel>?> playlists;
+  final Function(int oldIndex, int newIndex) onReorder;
+  final Function() onAdd;
+  final String filter;
+
+  const ListPlaylistsScreen(
+      {required this.playlists,
+      required this.onReorder,
+      required this.onAdd,
+      super.key,
+      this.filter = ''});
 
   @override
   State<ListPlaylistsScreen> createState() => _ListPlaylistsScreenState();
@@ -22,25 +30,11 @@ class ListPlaylistsScreen extends StatefulWidget {
 
 class _ListPlaylistsScreenState extends State<ListPlaylistsScreen>
     with RouteAware, WidgetsBindingObserver {
-  final ValueNotifier<List<PlayListModel>?> _playlists = ValueNotifier(null);
   final isDemo = injector.get<ConfigurationService>().isDemoArtworksMode();
 
-  Future<List<PlayListModel>?> getPlaylist() async {
-    final playlistService = injector.get<PlaylistService>();
-    if (isDemo) {
-      return injector<VersionService>().getDemoAccountFromGithub();
-    }
-    return playlistService.getPlayList();
-  }
-
-  _initPlayList() async {
-    _playlists.value = await getPlaylist();
-  }
-
   @override
   void initState() {
     super.initState();
-    _initPlayList();
     WidgetsBinding.instance.addObserver(this);
   }
 
@@ -56,105 +50,67 @@ class _ListPlaylistsScreenState extends State<ListPlaylistsScreen>
     super.dispose();
   }
 
-  _gotoCreatePlaylist() {
-    Navigator.of(context).pushNamed(AppRouter.createPlayListPage).then((value) {
-      if (value != null && value is PlayListModel) {
-        Navigator.pushNamed(
-          context,
-          AppRouter.viewPlayListPage,
-          arguments: value,
-        );
-      }
-    });
-  }
-
-  _onUpdatePlaylists() async {
-    if (isDemo || _playlists.value == null) return;
-    await injector
-        .get<PlaylistService>()
-        .setPlayList(_playlists.value!, override: true);
-    injector.get<SettingsDataService>().backup();
-  }
-
-  @override
-  void didPopNext() {
-    _initPlayList();
-    super.didPopNext();
-  }
-
   @override
-  Widget build(BuildContext context) {
-    return ValueListenableBuilder<List<PlayListModel>?>(
-      valueListenable: _playlists,
-      builder: (context, value, child) => value == null
-          ? const SizedBox.shrink()
-          : SizedBox(
-              height: 110,
-              child: ReorderableListView.builder(
+  Widget build(BuildContext context) =>
+      ValueListenableBuilder<List<PlayListModel>?>(
+        valueListenable: widget.playlists,
+        builder: (context, value, child) {
+          if (value == null) {
+            return const SizedBox.shrink();
+          }
+          List<PlayListModel> playlists = value.filter(widget.filter);
+          if (playlists.isEmpty && widget.filter.isNotEmpty) {
+            return const SizedBox();
+          }
+          const height = 165.0;
+          return SizedBox(
+            height: height,
+            width: 400,
+            child: Padding(
+              padding: const EdgeInsets.symmetric(horizontal: 15),
+              child: ListView.separated(
                 scrollDirection: Axis.horizontal,
-                padding: const EdgeInsets.symmetric(horizontal: 15),
-                onReorderStart: (index) {
-                  Vibrate.feedback(FeedbackType.light);
-                },
-                proxyDecorator: (child, index, animation) {
+                itemCount: playlists.length + 1,
+                itemBuilder: (context, index) {
+                  if (index == playlists.length) {
+                    if (widget.filter.isNotEmpty) {
+                      return const SizedBox();
+                    }
+                    return AddPlayListItem(
+                      onTap: () {
+                        widget.onAdd();
+                      },
+                    );
+                  }
+                  final item = playlists[index];
                   return PlaylistItem(
-                    key: ValueKey(value[index]),
-                    name: value[index].name,
-                    thumbnailURL: value[index].thumbnailURL,
-                    onHold: true,
+                    playlist: item,
+                    onSelected: () async => Navigator.pushNamed(
+                      context,
+                      AppRouter.viewPlayListPage,
+                      arguments: ViewPlaylistScreenPayload(playListModel: item),
+                    ),
                   );
                 },
-                itemCount: value.length,
-                onReorder: (oldIndex, newIndex) {
-                  setState(() {
-                    if (oldIndex < newIndex) {
-                      newIndex -= 1;
-                    }
-                    final item = value.removeAt(oldIndex);
-                    value.insert(newIndex, item);
-                    _onUpdatePlaylists();
-                  });
-                },
-                footer: isDemo
-                    ? null
-                    : SizedBox(
-                        height: 80,
-                        width: 80,
-                        child: AddPlayListItem(
-                          onTap: _gotoCreatePlaylist,
-                        ),
-                      ),
-                itemBuilder: (context, index) => PlaylistItem(
-                  key: ValueKey(value[index]),
-                  name: value[index].name,
-                  thumbnailURL: value[index].thumbnailURL,
-                  onSelected: () => Navigator.pushNamed(
-                    context,
-                    AppRouter.viewPlayListPage,
-                    arguments: value[index],
-                  ).then((value) {
-                    _initPlayList();
-                  }),
-                ),
+                separatorBuilder: (context, index) => const SizedBox(width: 10),
               ),
             ),
-    );
-  }
+          );
+        },
+      );
 }
 
 class PlaylistItem extends StatefulWidget {
   final Function()? onSelected;
-  final String? name;
-  final String? thumbnailURL;
+  final PlayListModel playlist;
   final bool onHold;
 
   const PlaylistItem({
-    Key? key,
+    required this.playlist,
+    super.key,
     this.onSelected,
-    this.name,
-    this.thumbnailURL,
     this.onHold = false,
-  }) : super(key: key);
+  });
 
   @override
   State<PlaylistItem> createState() => _PlaylistItemState();
@@ -164,58 +120,72 @@ class _PlaylistItemState extends State<PlaylistItem> {
   @override
   Widget build(BuildContext context) {
     final theme = Theme.of(context);
+    final numberFormatter = NumberFormat('#,###');
+    final thumbnailURL = widget.playlist.thumbnailURL;
+    final name = widget.playlist.getName();
+    const width = 140.0;
+    const height = 165.0;
     return GestureDetector(
       onTap: widget.onSelected,
       child: Padding(
-        padding: const EdgeInsets.only(right: 15),
+        padding: EdgeInsets.zero,
         child: Container(
-          width: 83,
-          color: theme.colorScheme.background,
+          width: width,
+          height: height,
+          decoration: BoxDecoration(
+            color: AppColor.white,
+            border: Border.all(
+              color: widget.onHold
+                  ? AppColor.feralFileHighlight
+                  : Colors.transparent,
+              width: widget.onHold ? 2 : 0,
+            ),
+            borderRadius: BorderRadius.circular(5),
+          ),
+          padding: const EdgeInsets.all(10),
           child: Column(
             crossAxisAlignment: CrossAxisAlignment.start,
             children: [
-              ClipRRect(
-                borderRadius: BorderRadius.circular(5),
-                child: Container(
-                  decoration: BoxDecoration(
-                    border: Border.all(
-                      color: widget.onHold
-                          ? theme.auSuperTeal
-                          : Colors.transparent,
-                      width: widget.onHold ? 2 : 0,
+              Row(
+                children: [
+                  Expanded(
+                    child: Text(
+                      name,
+                      style: theme.textTheme.ppMori400Black14,
+                      overflow: TextOverflow.ellipsis,
                     ),
                   ),
-                  height: 83,
-                  width: 83,
-                  child: widget.thumbnailURL == null ||
-                          widget.thumbnailURL!.isEmpty
+                  const SizedBox(
+                    width: 6,
+                  ),
+                  Text(
+                    numberFormatter
+                        .format(widget.playlist.tokenIDs?.length ?? 0),
+                    style: theme.textTheme.ppMori400Grey14,
+                  ),
+                ],
+              ),
+              const SizedBox(height: 5),
+              Expanded(
+                child: Center(
+                  child: thumbnailURL == null || thumbnailURL.isEmpty
                       ? Container(
                           width: double.infinity,
                           height: double.infinity,
                           color: theme.disableColor,
                         )
                       : CachedNetworkImage(
-                          imageUrl: widget.thumbnailURL!,
+                          imageUrl: thumbnailURL,
                           fit: BoxFit.cover,
-                          errorWidget: (context, url, error) {
-                            return Container(
-                              width: double.infinity,
-                              height: double.infinity,
-                              color: theme.disableColor,
-                            );
-                          },
+                          errorWidget: (context, url, error) => Container(
+                            width: double.infinity,
+                            height: double.infinity,
+                            color: theme.disableColor,
+                          ),
                           fadeInDuration: Duration.zero,
                         ),
                 ),
               ),
-              const SizedBox(height: 5),
-              Text(
-                (widget.name?.isNotEmpty ?? false) ? widget.name! : 'Untitled',
-                style: widget.onHold
-                    ? theme.textTheme.ppMori600Black12
-                    : theme.textTheme.ppMori400Black12,
-                overflow: TextOverflow.ellipsis,
-              ),
             ],
           ),
         ),
@@ -227,37 +197,47 @@ class _PlaylistItemState extends State<PlaylistItem> {
 class AddPlayListItem extends StatelessWidget {
   final Function()? onTap;
 
-  const AddPlayListItem({Key? key, this.onTap}) : super(key: key);
+  const AddPlayListItem({super.key, this.onTap});
 
   @override
   Widget build(BuildContext context) {
     final theme = Theme.of(context);
     return GestureDetector(
       onTap: onTap,
-      child: Column(
-        crossAxisAlignment: CrossAxisAlignment.start,
-        children: [
-          Container(
-            width: 83,
-            height: 83,
-            decoration: BoxDecoration(
-              borderRadius: BorderRadius.circular(5),
-              border: Border.all(
-                color: theme.auLightGrey,
-              ),
-            ),
-            child: Icon(
-              AuIcon.add,
+      child: Container(
+        width: 140,
+        height: 165,
+        padding: const EdgeInsets.all(10),
+        decoration: BoxDecoration(
+            borderRadius: BorderRadius.circular(5),
+            border: Border.all(
               color: theme.auLightGrey,
             ),
-          ),
-          const SizedBox(height: 5),
-          Text(
-            'new_playlist'.tr(),
-            style: theme.textTheme.ppMori400Black12,
-            overflow: TextOverflow.ellipsis,
-          ),
-        ],
+            color: AppColor.white),
+        child: Column(
+          children: [
+            Row(
+              children: [
+                Expanded(
+                  child: Text(
+                    'new_playlist'.tr(),
+                    style: theme.textTheme.ppMori400Black14,
+                    overflow: TextOverflow.ellipsis,
+                  ),
+                ),
+              ],
+            ),
+            const SizedBox(height: 5),
+            const Expanded(
+              child: Center(
+                child: Icon(
+                  AuIcon.add,
+                  color: AppColor.primaryBlack,
+                ),
+              ),
+            ),
+          ],
+        ),
       ),
     );
   }
diff --git a/lib/screen/playlists/view_playlist/view_playlist.dart b/lib/screen/playlists/view_playlist/view_playlist.dart
index 1be13a70b..1c16cd029 100644
--- a/lib/screen/playlists/view_playlist/view_playlist.dart
+++ b/lib/screen/playlists/view_playlist/view_playlist.dart
@@ -1,3 +1,5 @@
+import 'dart:async';
+
 import 'package:autonomy_flutter/common/injector.dart';
 import 'package:autonomy_flutter/model/play_control_model.dart';
 import 'package:autonomy_flutter/model/play_list_model.dart';
@@ -5,7 +7,6 @@ import 'package:autonomy_flutter/screen/app_router.dart';
 import 'package:autonomy_flutter/screen/detail/artwork_detail_page.dart';
 import 'package:autonomy_flutter/screen/detail/preview/canvas_device_bloc.dart';
 import 'package:autonomy_flutter/screen/interactive_postcard/postcard_detail_page.dart';
-import 'package:autonomy_flutter/screen/playlists/edit_playlist/widgets/text_name_playlist.dart';
 import 'package:autonomy_flutter/screen/playlists/view_playlist/view_playlist_bloc.dart';
 import 'package:autonomy_flutter/screen/playlists/view_playlist/view_playlist_state.dart';
 import 'package:autonomy_flutter/service/configuration_service.dart';
@@ -16,13 +17,12 @@ import 'package:autonomy_flutter/util/asset_token_ext.dart';
 import 'package:autonomy_flutter/util/au_icons.dart';
 import 'package:autonomy_flutter/util/constants.dart';
 import 'package:autonomy_flutter/util/iterable_ext.dart';
-import 'package:autonomy_flutter/util/log.dart';
-import 'package:autonomy_flutter/util/play_control.dart';
+import 'package:autonomy_flutter/util/style.dart';
 import 'package:autonomy_flutter/util/token_ext.dart';
 import 'package:autonomy_flutter/util/ui_helper.dart';
-import 'package:autonomy_flutter/view/add_button.dart';
 import 'package:autonomy_flutter/view/artwork_common_widget.dart';
-import 'package:autonomy_flutter/view/canvas_device_view.dart';
+import 'package:autonomy_flutter/view/au_radio_button.dart';
+import 'package:autonomy_flutter/view/back_appbar.dart';
 import 'package:autonomy_flutter/view/responsive.dart';
 import 'package:autonomy_theme/autonomy_theme.dart';
 import 'package:easy_localization/easy_localization.dart';
@@ -32,10 +32,23 @@ import 'package:flutter_svg/svg.dart';
 import 'package:nft_collection/models/asset_token.dart';
 import 'package:nft_collection/nft_collection.dart';
 
-class ViewPlaylistScreen extends StatefulWidget {
+enum CollectionType { manual, medium, artist }
+
+class ViewPlaylistScreenPayload {
   final PlayListModel? playListModel;
+  final CollectionType collectionType;
+  final Widget? titleIcon;
+
+  const ViewPlaylistScreenPayload(
+      {this.playListModel,
+      this.titleIcon,
+      this.collectionType = CollectionType.manual});
+}
 
-  const ViewPlaylistScreen({Key? key, this.playListModel}) : super(key: key);
+class ViewPlaylistScreen extends StatefulWidget {
+  final ViewPlaylistScreenPayload payload;
+
+  const ViewPlaylistScreen({required this.payload, super.key});
 
   @override
   State<ViewPlaylistScreen> createState() => _ViewPlaylistScreenState();
@@ -50,29 +63,54 @@ class _ViewPlaylistScreenState extends State<ViewPlaylistScreen> {
   bool isDemo = injector.get<ConfigurationService>().isDemoArtworksMode();
   final _focusNode = FocusNode();
   late CanvasDeviceBloc _canvasDeviceBloc;
+  late SortOrder _sortOrder;
+  late bool editable;
+
+  List<SortOrder> _getAvailableOrders() {
+    switch (widget.payload.collectionType) {
+      case CollectionType.artist:
+        return [
+          SortOrder.title,
+          SortOrder.newest,
+        ];
+      case CollectionType.medium:
+        return [
+          SortOrder.title,
+          SortOrder.artist,
+          SortOrder.newest,
+        ];
+      default:
+        return [
+          SortOrder.manual,
+          SortOrder.title,
+          SortOrder.artist,
+        ];
+    }
+  }
 
   @override
   void initState() {
+    _sortOrder = _getAvailableOrders().first;
+    editable = widget.payload.collectionType == CollectionType.manual &&
+        !(widget.payload.playListModel?.isDefault ?? true);
     super.initState();
 
     nftBloc.add(RefreshNftCollectionByIDs(
-      ids: isDemo ? [] : widget.playListModel?.tokenIDs,
-      debugTokenIds: isDemo ? widget.playListModel?.tokenIDs : [],
+      ids: isDemo ? [] : widget.payload.playListModel?.tokenIDs,
+      debugTokenIds: isDemo ? widget.payload.playListModel?.tokenIDs : [],
     ));
 
     _canvasDeviceBloc = context.read<CanvasDeviceBloc>();
-    _fetchDevice();
-
-    bloc.add(GetPlayList(playListModel: widget.playListModel));
-    _fetchDevice();
+    unawaited(_fetchDevice());
+    bloc.add(GetPlayList(playListModel: widget.payload.playListModel));
   }
 
   Future<void> deletePlayList() async {
     final listPlaylist = await _playlistService.getPlayList();
-    listPlaylist
-        .removeWhere((element) => element.id == widget.playListModel?.id);
-    _playlistService.setPlayList(listPlaylist, override: true);
-    injector.get<SettingsDataService>().backup();
+    listPlaylist.removeWhere(
+        (element) => element.id == widget.payload.playListModel?.id);
+    await _playlistService.setPlayList(listPlaylist, override: true);
+    unawaited(injector.get<SettingsDataService>().backup());
     injector<NavigationService>().popUntilHomeOrSettings();
   }
 
@@ -86,11 +124,14 @@ class _ViewPlaylistScreenState extends State<ViewPlaylistScreen> {
             ?.map((e) =>
                 tokens.where((element) => element.id == e).firstOrDefault())
             .toList() ??
-        [];
+        []
+      ..removeWhere((element) => element == null);
 
-    temp.removeWhere((element) => element == null);
-
-    tokensPlaylist = List.from(temp);
+    tokensPlaylist = List.from(temp)
+      ..sort((a, b) {
+        final x = _sortOrder.compare(a, b);
+        return x;
+      });
 
     accountIdentities = tokensPlaylist
         .where((e) => e.pending != true || e.hasMetadata)
@@ -105,31 +146,128 @@ class _ViewPlaylistScreenState extends State<ViewPlaylistScreen> {
     super.dispose();
   }
 
-  void _onMoreTap(BuildContext context, PlayListModel? playList) {
+  void _onSelectOrder(SortOrder order) {
+    setState(() {
+      _sortOrder = order;
+    });
+  }
+
+  Future<void> _onOrderTap(BuildContext context, List<SortOrder> orders) async {
     final theme = Theme.of(context);
-    UIHelper.showDrawerAction(
+    await showModalBottomSheet<dynamic>(
+      context: context,
+      backgroundColor: Colors.transparent,
+      enableDrag: false,
+      constraints: BoxConstraints(
+          maxWidth: ResponsiveLayout.isMobile
+              ? double.infinity
+              : Constants.maxWidthModalTablet),
+      barrierColor: Colors.black.withOpacity(0.5),
+      isScrollControlled: true,
+      builder: (context) => StatefulBuilder(
+          builder: (context, setState) => Container(
+                color: AppColor.feralFileHighlight,
+                child: Column(
+                  mainAxisSize: MainAxisSize.min,
+                  children: [
+                    Padding(
+                      padding: const EdgeInsets.fromLTRB(15, 17, 15, 20),
+                      child: Row(
+                        crossAxisAlignment: CrossAxisAlignment.start,
+                        children: [
+                          Expanded(
+                            child: Padding(
+                              padding: const EdgeInsets.only(top: 3, left: 37),
+                              child: Text(
+                                'sort_by'.tr(),
+                                style: theme.textTheme.ppMori400Black14,
+                                overflow: TextOverflow.ellipsis,
+                              ),
+                            ),
+                          ),
+                          Align(
+                            alignment: Alignment.centerRight,
+                            child: IconButton(
+                              onPressed: () => Navigator.pop(context),
+                              padding: EdgeInsets.zero,
+                              constraints: const BoxConstraints(
+                                  maxHeight: 22, maxWidth: 22),
+                              icon: const Icon(
+                                AuIcon.close,
+                                size: 22,
+                              ),
+                            ),
+                          ),
+                        ],
+                      ),
+                    ),
+                    addOnlyDivider(color: AppColor.white),
+                    const SizedBox(height: 20),
+                    ListView.separated(
+                      itemBuilder: (context, index) {
+                        final order = orders[index];
+                        return Padding(
+                          padding: const EdgeInsets.symmetric(horizontal: 15),
+                          child: GestureDetector(
+                            onTap: () {
+                              Navigator.pop(context);
+                              _onSelectOrder(order);
+                            },
+                            child: Container(
+                              color: Colors.transparent,
+                              child: Row(
+                                children: [
+                                  AuRadio<SortOrder>(
+                                    onTap: (order) {
+                                      Navigator.pop(context);
+                                      _onSelectOrder(order);
+                                    },
+                                    value: order,
+                                    groupValue: _sortOrder,
+                                  ),
+                                  const SizedBox(width: 15),
+                                  Expanded(
+                                    child: Text(
+                                      order.text,
+                                      style: theme.textTheme.ppMori400Black14,
+                                      overflow: TextOverflow.ellipsis,
+                                    ),
+                                  ),
+                                ],
+                              ),
+                            ),
+                          ),
+                        );
+                      },
+                      itemCount: orders.length,
+                      shrinkWrap: true,
+                      physics: const NeverScrollableScrollPhysics(),
+                      separatorBuilder: (BuildContext context, int index) =>
+                          const SizedBox(height: 15),
+                    ),
+                    const SizedBox(height: 65),
+                  ],
+                ),
+              )),
+    );
+  }
+
+  Future<void> _onMoreTap(BuildContext context, PlayListModel? playList) async {
+    final theme = Theme.of(context);
+    await UIHelper.showDrawerAction(
       context,
       options: [
         OptionItem(
-          title: 'Rename',
+          title: 'edit_collection'.tr(),
           icon: SvgPicture.asset(
             'assets/images/rename_icon.svg',
             width: 24,
           ),
           onTap: () {
             Navigator.pop(context);
-            bloc.add(ChangeRename(value: true));
-          },
-        ),
-        OptionItem(
-          title: 'Edit',
-          icon: SvgPicture.asset(
-            'assets/images/edit_icon.svg',
-            width: 24,
-          ),
-          onTap: () {
-            Navigator.pop(context);
-            if (isDemo) return;
+            if (isDemo) {
+              return;
+            }
             Navigator.pushNamed(
               context,
               AppRouter.editPlayListPage,
@@ -138,7 +276,7 @@ class _ViewPlaylistScreenState extends State<ViewPlaylistScreen> {
           },
         ),
         OptionItem(
-          title: 'Delete',
+          title: 'delete_collection'.tr(),
           icon: SvgPicture.asset(
             'assets/images/delete_icon.svg',
             width: 24,
@@ -149,27 +287,16 @@ class _ViewPlaylistScreenState extends State<ViewPlaylistScreen> {
               context,
               tr('delete_playlist'),
               '',
-              descriptionWidget: RichText(
-                text: TextSpan(children: [
-                  TextSpan(
-                    style: theme.textTheme.ppMori400White16,
-                    text: "you_are_about".tr(),
-                  ),
-                  TextSpan(
-                    style: theme.textTheme.ppMori700White16,
-                    text: playList?.name ?? tr('untitled'),
-                  ),
-                  TextSpan(
-                    style: theme.textTheme.ppMori400White16,
-                    text: "dont_worry".tr(),
-                  ),
-                ]),
+              descriptionWidget: Text(
+                'delete_playlist_desc'.tr(),
+                style: theme.textTheme.ppMori400White14,
               ),
-              actionButton: "delete_dialog".tr(),
+              actionButton: 'remove_collection'.tr(),
               onAction: deletePlayList,
             );
           },
         ),
+        OptionItem(),
       ],
     );
   }
@@ -194,81 +321,134 @@ class _ViewPlaylistScreenState extends State<ViewPlaylistScreen> {
       listener: (context, state) {},
       builder: (context, state) {
         final playList = state.playListModel;
-        final isRename = state.isRename;
-        if (isRename == true) {
-          _focusNode.requestFocus();
+        if (playList == null) {
+          return const SizedBox();
         }
         return Scaffold(
           appBar: AppBar(
-            elevation: 1,
+            systemOverlayStyle: systemUiOverlayLightStyle(AppColor.white),
+            elevation: 0,
+            shadowColor: Colors.transparent,
             leading: GestureDetector(
               onTap: () => Navigator.of(context).pop(),
-              child: const Icon(AuIcon.chevron),
+              child: const Row(
+                children: [
+                  SizedBox(
+                    width: 15,
+                  ),
+                  Icon(
+                    AuIcon.chevron,
+                    size: 18,
+                  ),
+                ],
+              ),
             ),
+            titleSpacing: 0,
             backgroundColor: theme.colorScheme.background,
             automaticallyImplyLeading: false,
             centerTitle: true,
-            title: isRename ?? false
-                ? TextNamePlaylist(
-                    focusNode: _focusNode,
-                    playList: playList,
-                    onEditPlaylistName: (value) {
-                      bloc.add(SavePlaylist(
-                          name: value.trim().isNotEmpty ? value.trim() : null));
-                    },
-                  )
-                : Text(
-                    (playList?.name?.isNotEmpty ?? false)
-                        ? playList!.name!
-                        : tr('untitled'),
-                    style: theme.textTheme.ppMori400Black14,
+            title: Row(
+              mainAxisAlignment: MainAxisAlignment.center,
+              children: [
+                if (widget.payload.titleIcon != null) ...[
+                  SizedBox(
+                      width: 22, height: 22, child: widget.payload.titleIcon),
+                  const SizedBox(width: 10),
+                  Text(
+                    playList.getName(),
+                    style: theme.textTheme.ppMori400Black16,
                   ),
+                ] else ...[
+                  Expanded(
+                    child: Text(
+                      playList.getName(),
+                      style: theme.textTheme.ppMori400Black16,
+                      textAlign: TextAlign.center,
+                    ),
+                  ),
+                ]
+              ],
+            ),
             actions: [
+              const SizedBox(width: 15),
               GestureDetector(
-                onTap: () => _onMoreTap(context, playList),
+                onTap: () async {
+                  await _onOrderTap(context, _getAvailableOrders());
+                },
                 child: SvgPicture.asset(
-                  'assets/images/more_circle.svg',
+                  'assets/images/sort.svg',
                   colorFilter:
                       ColorFilter.mode(theme.primaryColor, BlendMode.srcIn),
-                  width: 24,
+                  width: 22,
+                  height: 22,
                 ),
               ),
+              if (editable) ...[
+                const SizedBox(width: 15),
+                GestureDetector(
+                    onTap: () async => _onMoreTap(context, playList),
+                    child: SvgPicture.asset(
+                      'assets/images/more_circle.svg',
+                      colorFilter:
+                          ColorFilter.mode(theme.primaryColor, BlendMode.srcIn),
+                      width: 24,
+                    )),
+              ],
               const SizedBox(width: 15),
             ],
+            bottom: PreferredSize(
+              preferredSize: const Size.fromHeight(0.25),
+              child:
+                  addOnlyDivider(color: AppColor.auQuickSilver, border: 0.25),
+            ),
           ),
           body: BlocBuilder<NftCollectionBloc, NftCollectionBlocState>(
             bloc: nftBloc,
-            builder: (context, nftState) {
-              return NftCollectionGrid(
-                state: nftState.state,
-                tokens: setupPlayList(
-                  tokens: nftState.tokens.items,
-                  selectedTokens: playList?.tokenIDs,
-                ),
-                customGalleryViewBuilder: (context, tokens) => _assetsWidget(
-                  context,
-                  tokens,
-                  accountIdentities: accountIdentities,
-                  playControlModel:
-                      playList?.playControlModel ?? PlayControlModel(),
-                  onShuffleTap: () => _onShufferTap(playList),
-                  onTimerTap: () => _onTimerTap(playList),
-                ),
-              );
-            },
+            builder: (context, nftState) => NftCollectionGrid(
+              state: nftState.state,
+              tokens: setupPlayList(
+                tokens: nftState.tokens.items,
+                selectedTokens: playList.tokenIDs,
+              ),
+              customGalleryViewBuilder: (context, tokens) => _assetsWidget(
+                context,
+                tokens,
+                accountIdentities: accountIdentities,
+                playControlModel:
+                    playList.playControlModel ?? PlayControlModel(),
+                onShuffleTap: () => _onShufferTap(playList),
+                onTimerTap: () => _onTimerTap(playList),
+              ),
+            ),
           ),
         );
       },
     );
   }
 
+  Future<void> moveToAddNftToCollection(BuildContext context) async {
+    await Navigator.pushNamed(
+      context,
+      AppRouter.addToCollectionPage,
+      arguments: widget.payload.playListModel,
+    ).then((value) {
+      if (value != null && value is PlayListModel) {
+        bloc.add(SavePlaylist(name: value.name));
+        nftBloc.add(RefreshNftCollectionByIDs(
+          ids: isDemo ? [] : value.tokenIDs,
+          debugTokenIds: isDemo ? value.tokenIDs : [],
+        ));
+      }
+    });
+  }
+
   Widget _assetsWidget(
     BuildContext context,
     List<CompactedAssetToken> tokens, {
     required List<ArtworkIdentity> accountIdentities,
+    required PlayControlModel playControlModel,
     Function()? onShuffleTap,
     Function()? onTimerTap,
-    required PlayControlModel playControlModel,
   }) {
     int cellPerRow =
         ResponsiveLayout.isMobile ? cellPerRowPhone : cellPerRowTablet;
@@ -304,8 +484,10 @@ class _ViewPlaylistScreenState extends State<ViewPlaylistScreen> {
                               usingThumbnailID: index > 50,
                               useHero: false,
                             ),
-                      onTap: () {
-                        if (asset.pending == true && !asset.hasMetadata) return;
+                      onTap: () async {
+                        if (asset.pending == true && !asset.hasMetadata) {
+                          return;
+                        }
 
                         final index = tokens
                             .where((e) => e.pending != true || e.hasMetadata)
@@ -326,16 +508,13 @@ class _ViewPlaylistScreenState extends State<ViewPlaylistScreen> {
                             ? AppRouter.claimedPostcardDetailsPage
                             : AppRouter.artworkDetailsPage;
 
-                        Navigator.of(context)
+                        await Navigator.of(context)
                             .pushNamed(pageName, arguments: payload);
                       },
                     );
                   },
                   itemCount: tokens.length),
             ),
-            const SizedBox(
-              height: 50,
-            )
           ],
         ),
         Positioned(
@@ -344,54 +523,23 @@ class _ViewPlaylistScreenState extends State<ViewPlaylistScreen> {
           right: 0,
           child: Column(
             children: [
-              AddButton(
-                  onTap: () => Navigator.pushNamed(
-                        context,
-                        AppRouter.createPlayListPage,
-                        arguments: widget.playListModel,
-                      ).then((value) {
-                        if (value != null && value is PlayListModel) {
-                          bloc.add(SavePlaylist(name: value.name));
-                          nftBloc.add(RefreshNftCollectionByIDs(
-                            ids: isDemo ? [] : value.tokenIDs,
-                            debugTokenIds: isDemo ? value.tokenIDs : [],
-                          ));
-                        }
-                      })),
-              const SizedBox(height: 22),
-              BlocBuilder<CanvasDeviceBloc, CanvasDeviceState>(
-                  bloc: _canvasDeviceBloc,
-                  builder: (context, state) {
-                    return PlaylistControl(
-                      playControl: playControlModel,
-                      showPlay: accountIdentities.isNotEmpty,
-                      onShuffleTap: onShuffleTap,
-                      onTimerTap: onTimerTap,
-                      isCasting: state.isCasting,
-                      onPlayTap: () {
-                        final payload = ArtworkDetailPayload(
-                          accountIdentities,
-                          0,
-                          playControl: playControlModel,
-                        );
-                        Navigator.of(context).pushNamed(
-                          AppRouter.artworkPreviewPage,
-                          arguments: payload,
-                        );
-                      },
-                      onCastTap: () async {
-                        final playlist = widget.playListModel;
-                        if (playlist?.tokenIDs == null ||
-                            playlist!.tokenIDs!.isEmpty) {
-                          log.info("Cast collection failed: playlist empty");
-                          return;
-                        }
-                        playlist.playControlModel = playControlModel;
-                        await _openCanvasDeviceDialog(context, playlist);
-                        _fetchDevice();
+              if (editable)
+                Padding(
+                  padding: const EdgeInsets.only(bottom: 20),
+                  child: Center(
+                    child: AddButton(
+                      icon: SvgPicture.asset(
+                        'assets/images/Add.svg',
+                        width: 30,
+                        height: 30,
+                      ),
+                      onTap: () async {
+                        await moveToAddNftToCollection(context);
                       },
-                    );
-                  })
+                    ),
+                  ),
+                ),
+              const SizedBox(height: 22),
             ],
           ),
         )
@@ -401,26 +549,57 @@ class _ViewPlaylistScreenState extends State<ViewPlaylistScreen> {
 
   Future<void> _fetchDevice() async {
     _canvasDeviceBloc.add(CanvasDeviceGetDevicesEvent(
-        widget.playListModel?.id ?? "",
+        widget.payload.playListModel?.id ?? '',
         syncAll: false));
   }
+}
 
-  Future<void> _openCanvasDeviceDialog(
-      BuildContext context, PlayListModel playlist) async {
-    await UIHelper.showFlexibleDialog(
-      context,
-      BlocProvider.value(
-        value: _canvasDeviceBloc,
-        child: CanvasDeviceView(
-          sceneId: widget.playListModel?.id ?? "",
-          isCollection: true,
-          playlist: playlist,
-          onClose: () {
-            Navigator.of(context).pop();
-          },
-        ),
-      ),
-      isDismissible: true,
-    );
+enum SortOrder {
+  title,
+  artist,
+  newest,
+  manual;
+
+  String get text {
+    switch (this) {
+      case SortOrder.title:
+        return tr('sort_by_title');
+      case SortOrder.artist:
+        return tr('sort_by_artist');
+      case SortOrder.newest:
+        return tr('sort_by_newest');
+      case SortOrder.manual:
+        return tr('sort_by_manual');
+    }
   }
+
+  int compare(CompactedAssetToken a, CompactedAssetToken b) {
+    switch (this) {
+      case SortOrder.title:
+        return a.title?.compareTo(b.title ?? '') ?? 1;
+      case SortOrder.artist:
+        return a.artistID?.compareTo(b.artistID ?? '') ?? 1;
+      case SortOrder.newest:
+        return b.lastActivityTime.compareTo(a.lastActivityTime);
+      case SortOrder.manual:
+        return 1;
+    }
+  }
+}
+
+class AddButton extends StatelessWidget {
+  final Widget icon;
+  final void Function() onTap;
+
+  const AddButton({
+    required this.icon,
+    required this.onTap,
+    super.key,
+  });
+
+  @override
+  Widget build(BuildContext context) => GestureDetector(
+        onTap: onTap,
+        child: icon,
+      );
 }
diff --git a/lib/screen/playlists/view_playlist/view_playlist_bloc.dart b/lib/screen/playlists/view_playlist/view_playlist_bloc.dart
index 3737e1565..329c862f0 100644
--- a/lib/screen/playlists/view_playlist/view_playlist_bloc.dart
+++ b/lib/screen/playlists/view_playlist/view_playlist_bloc.dart
@@ -1,3 +1,5 @@
+import 'dart:async';
+
 import 'package:autonomy_flutter/au_bloc.dart';
 import 'package:autonomy_flutter/common/injector.dart';
 import 'package:autonomy_flutter/model/play_list_model.dart';
@@ -23,15 +25,17 @@ class ViewPlaylistBloc extends AuBloc<ViewPlaylistEvent, ViewPlaylistState> {
 
     on<SavePlaylist>((event, emit) async {
       final playListModel = state.playListModel;
-      playListModel?.name = event.name;
+      if (event.name != null) {
+        playListModel?.name = event.name;
+      }
 
       final playlists = await _playlistService.getPlayList();
       final index =
           playlists.indexWhere((element) => element.id == playListModel?.id);
       if (index != -1 && playListModel != null) {
         playlists[index] = playListModel;
-        _playlistService.setPlayList(playlists, override: true);
-        injector.get<SettingsDataService>().backup();
+        await _playlistService.setPlayList(playlists, override: true);
+        unawaited(injector.get<SettingsDataService>().backup());
       }
       emit(state.copyWith(isRename: false));
     });
@@ -45,8 +49,8 @@ class ViewPlaylistBloc extends AuBloc<ViewPlaylistEvent, ViewPlaylistState> {
           playlists.indexWhere((element) => element.id == playListModel?.id);
       if (index != -1 && playListModel != null) {
         playlists[index] = playListModel;
-        _playlistService.setPlayList(playlists, override: true);
-        injector.get<SettingsDataService>().backup();
+        await _playlistService.setPlayList(playlists, override: true);
+        unawaited(injector.get<SettingsDataService>().backup());
       }
       emit(state.copyWith(playListModel: playListModel));
     });
diff --git a/lib/screen/playlists/view_playlist/view_playlist_state.dart b/lib/screen/playlists/view_playlist/view_playlist_state.dart
index ef8eda383..e91802d65 100644
--- a/lib/screen/playlists/view_playlist/view_playlist_state.dart
+++ b/lib/screen/playlists/view_playlist/view_playlist_state.dart
@@ -35,10 +35,8 @@ class ViewPlaylistState {
   ViewPlaylistState copyWith({
     PlayListModel? playListModel,
     bool? isRename,
-  }) {
-    return ViewPlaylistState(
+  }) => ViewPlaylistState(
       playListModel: playListModel ?? this.playListModel,
       isRename: isRename ?? this.isRename,
     );
-  }
 }
diff --git a/lib/screen/predefined_collection/predefined_collection_bloc.dart b/lib/screen/predefined_collection/predefined_collection_bloc.dart
new file mode 100644
index 000000000..c1c2f9974
--- /dev/null
+++ b/lib/screen/predefined_collection/predefined_collection_bloc.dart
@@ -0,0 +1,72 @@
+import 'package:autonomy_flutter/common/injector.dart';
+import 'package:autonomy_flutter/screen/predefined_collection/predefined_collection_screen.dart';
+import 'package:autonomy_flutter/screen/predefined_collection/predefined_collection_state.dart';
+import 'package:autonomy_flutter/service/configuration_service.dart';
+import 'package:autonomy_flutter/util/medium_category_ext.dart';
+import 'package:flutter_bloc/flutter_bloc.dart';
+import 'package:nft_collection/database/dao/dao.dart';
+import 'package:nft_collection/models/models.dart';
+import 'package:nft_collection/nft_collection.dart';
+import 'package:nft_collection/utils/medium_category.dart';
+
+class PredefinedCollectionBloc
+    extends Bloc<PredefinedCollectionEvent, PredefinedCollectionState> {
+  final _assetTokenDao = injector.get<AssetTokenDao>();
+  final _configurationService = injector.get<ConfigurationService>();
+
+  PredefinedCollectionBloc() : super(PredefinedCollectionInitState()) {
+    on<LoadPredefinedCollectionEvent>((event, emit) async {
+      emit(
+        PredefinedCollectionLoadedState(
+          assetTokens: [],
+          nftLoadingState: NftLoadingState.loading,
+        ),
+      );
+      List<AssetToken> assetTokens = [];
+      if (event.type == PredefinedCollectionType.artist) {
+        assetTokens = await _assetTokenDao.findAllAssetTokensByArtistID(
+          artistID: event.id ?? '',
+        );
+      }
+      if (event.type == PredefinedCollectionType.medium) {
+        final isOther = event.id == MediumCategory.other;
+        final mimeTypes = isOther
+            ? MediumCategoryExt.getAllMimeType()
+            : MediumCategory.mineTypes(event.id ?? '');
+        final mediums = isOther
+            ? MediumCategoryExt.getAllMediums()
+            : MediumCategoryExt.mediums(event.id ?? '');
+        assetTokens =
+            await _assetTokenDao.findAllAssetTokensByMimeTypesOrMediums(
+          mimeTypes: mimeTypes,
+          isInMimeTypes: !isOther,
+          mediums: mediums,
+        );
+      }
+      final hiddenTokenIDs = _configurationService.getHiddenOrSentTokenIDs();
+      assetTokens.removeWhere((element) =>
+          hiddenTokenIDs.contains(element.id) || (element.balance ?? 0) <= 0);
+      final isFilterByTokenTitle =
+          event.type == PredefinedCollectionType.medium;
+      final tokens = assetTokens
+          .map((e) => CompactedAssetToken.fromAssetToken(e))
+          .toList()
+          .where(
+            (element) =>
+                !isFilterByTokenTitle ||
+                (element.title
+                        ?.toLowerCase()
+                        .contains(event.filterStr.toLowerCase()) ??
+                    false),
+          )
+          .toList();
+      emit(
+        PredefinedCollectionLoadedState(
+          assetTokens: tokens,
+          nftLoadingState: NftLoadingState.done,
+        ),
+      );
+      return;
+    });
+  }
+}
diff --git a/lib/screen/predefined_collection/predefined_collection_screen.dart b/lib/screen/predefined_collection/predefined_collection_screen.dart
new file mode 100644
index 000000000..783e19d66
--- /dev/null
+++ b/lib/screen/predefined_collection/predefined_collection_screen.dart
@@ -0,0 +1,97 @@
+import 'dart:async';
+
+import 'package:autonomy_flutter/common/injector.dart';
+import 'package:autonomy_flutter/model/play_list_model.dart';
+import 'package:autonomy_flutter/screen/app_router.dart';
+import 'package:autonomy_flutter/screen/playlists/view_playlist/view_playlist.dart';
+import 'package:autonomy_flutter/screen/predefined_collection/predefined_collection_bloc.dart';
+import 'package:autonomy_flutter/screen/predefined_collection/predefined_collection_state.dart';
+import 'package:autonomy_flutter/util/medium_category_ext.dart';
+import 'package:autonomy_theme/style/colors.dart';
+import 'package:flutter/material.dart';
+import 'package:flutter_bloc/flutter_bloc.dart';
+import 'package:flutter_svg/flutter_svg.dart';
+import 'package:nft_collection/models/predefined_collection_model.dart';
+import 'package:nft_collection/nft_collection.dart';
+
+enum PredefinedCollectionType { artist, medium }
+
+class PredefinedCollectionScreenPayload {
+  final PredefinedCollectionType type;
+  final PredefinedCollectionModel predefinedCollection;
+  final String filterStr;
+
+  const PredefinedCollectionScreenPayload(
+      {required this.type,
+      required this.predefinedCollection,
+      required this.filterStr});
+}
+
+class PredefinedCollectionScreen extends StatefulWidget {
+  final PredefinedCollectionScreenPayload payload;
+
+  const PredefinedCollectionScreen({required this.payload, super.key});
+
+  @override
+  State<PredefinedCollectionScreen> createState() =>
+      _PredefinedCollectionScreenState();
+}
+
+class _PredefinedCollectionScreenState
+    extends State<PredefinedCollectionScreen> {
+  final _bloc = injector.get<PredefinedCollectionBloc>();
+
+  @override
+  void initState() {
+    super.initState();
+    _bloc.add(LoadPredefinedCollectionEvent(
+        type: widget.payload.type,
+        id: widget.payload.predefinedCollection.id,
+        filterStr: widget.payload.filterStr));
+  }
+
+  @override
+  Widget build(BuildContext context) => Scaffold(
+        body: BlocConsumer<PredefinedCollectionBloc, PredefinedCollectionState>(
+          bloc: _bloc,
+          builder: (context, state) {
+            if (state is PredefinedCollectionInitState) {
+              return const Center(child: CircularProgressIndicator());
+            }
+            return const Center(child: CircularProgressIndicator());
+          },
+          listener: (context, state) {
+            if (state is PredefinedCollectionLoadedState &&
+                state.nftLoadingState == NftLoadingState.done) {
+              final id = widget.payload.predefinedCollection.id;
+              final name = widget.payload.predefinedCollection.name;
+              final tokenIDs = state.assetTokens?.map((e) => e.id).toList();
+              final playlist = PlayListModel(
+                id: id,
+                name: name,
+                tokenIDs: tokenIDs,
+              );
+              final predefinedCollectionType = widget.payload.type;
+              final icon =
+                  predefinedCollectionType == PredefinedCollectionType.medium
+                      ? SvgPicture.asset(MediumCategoryExt.icon(id),
+                          width: 22,
+                          height: 22,
+                          colorFilter: const ColorFilter.mode(
+                              AppColor.primaryBlack, BlendMode.srcIn))
+                      : null;
+              final collectionType =
+                  predefinedCollectionType == PredefinedCollectionType.medium
+                      ? CollectionType.medium
+                      : CollectionType.artist;
+              unawaited(Navigator.of(context).pushReplacementNamed(
+                  AppRouter.viewPlayListPage,
+                  arguments: ViewPlaylistScreenPayload(
+                      playListModel: playlist,
+                      titleIcon: icon,
+                      collectionType: collectionType)));
+            }
+          },
+        ),
+      );
+}
diff --git a/lib/screen/predefined_collection/predefined_collection_state.dart b/lib/screen/predefined_collection/predefined_collection_state.dart
new file mode 100644
index 000000000..b37090618
--- /dev/null
+++ b/lib/screen/predefined_collection/predefined_collection_state.dart
@@ -0,0 +1,41 @@
+// ignore_for_file: public_member_api_docs, sort_constructors_first
+import 'package:autonomy_flutter/screen/predefined_collection/predefined_collection_screen.dart';
+import 'package:nft_collection/models/models.dart';
+import 'package:nft_collection/widgets/nft_collection_bloc_event.dart';
+
+abstract class PredefinedCollectionState {}
+
+abstract class PredefinedCollectionEvent {}
+
+class PredefinedCollectionInitState extends PredefinedCollectionState {}
+
+class PredefinedCollectionLoadedState extends PredefinedCollectionState {
+  final List<CompactedAssetToken>? assetTokens;
+  final NftLoadingState nftLoadingState;
+
+  PredefinedCollectionLoadedState({
+    required this.nftLoadingState,
+    this.assetTokens,
+  });
+
+  PredefinedCollectionLoadedState copyWith({
+    List<CompactedAssetToken>? assetTokens,
+    NftLoadingState? nftLoadingState,
+  }) =>
+      PredefinedCollectionLoadedState(
+        assetTokens: assetTokens ?? this.assetTokens,
+        nftLoadingState: nftLoadingState ?? this.nftLoadingState,
+      );
+}
+
+class LoadPredefinedCollectionEvent extends PredefinedCollectionEvent {
+  final String? id;
+  final PredefinedCollectionType type;
+  final String filterStr;
+
+  LoadPredefinedCollectionEvent({
+    required this.type,
+    required this.filterStr,
+    this.id,
+  });
+}
diff --git a/lib/screen/release_notes_page.dart b/lib/screen/release_notes_page.dart
index c3a2cbf5a..99a37e597 100644
--- a/lib/screen/release_notes_page.dart
+++ b/lib/screen/release_notes_page.dart
@@ -22,8 +22,7 @@ import 'package:url_launcher/url_launcher_string.dart';
 class ReleaseNotesPage extends StatefulWidget {
   final String releaseNotes;
 
-  const ReleaseNotesPage({required this.releaseNotes, Key? key})
-      : super(key: key);
+  const ReleaseNotesPage({required this.releaseNotes, super.key});
 
   @override
   State<ReleaseNotesPage> createState() => _ReleaseNotesPageState();
@@ -43,7 +42,7 @@ class _ReleaseNotesPageState extends State<ReleaseNotesPage> {
     return Scaffold(
       appBar: getBackAppBar(
         context,
-        title: "release_notes".tr(),
+        title: 'release_notes'.tr(),
         onBack: () => Navigator.of(context).pop(),
       ),
       body: Container(
@@ -58,32 +57,32 @@ class _ReleaseNotesPageState extends State<ReleaseNotesPage> {
                 child: Column(
                   crossAxisAlignment: CrossAxisAlignment.start,
                   children: [
-                    const SizedBox(height: 60.0),
+                    const SizedBox(height: 60),
                     Text(
-                      "believe_transparency".tr(),
+                      'believe_transparency'.tr(),
                       style: theme.textTheme.ppMori700Black16,
                     ),
                     Row(
                       children: [
                         Text(
-                          "autonomy_is_".tr(),
+                          'autonomy_is_'.tr(),
                           style: theme.textTheme.ppMori400Black16,
                         ),
                         GestureDetector(
                           child: Text(
-                            "open_source".tr(),
+                            'open_source'.tr(),
                             style: theme.textTheme.ppMori400Black16
                                 .copyWith(decoration: TextDecoration.underline),
                           ),
-                          onTap: () => launchUrl(
+                          onTap: () async => launchUrl(
                               Uri.parse(AUTONOMY_CLIENT_GITHUB_LINK),
                               mode: LaunchMode.externalApplication),
                         ),
                       ],
                     ),
-                    const SizedBox(height: 30.0),
-                    Divider(
-                      color: theme.auSuperTeal,
+                    const SizedBox(height: 30),
+                    const Divider(
+                      color: AppColor.feralFileHighlight,
                       thickness: 1,
                     ),
                     Markdown(
@@ -100,13 +99,15 @@ class _ReleaseNotesPageState extends State<ReleaseNotesPage> {
                         TagBlockSyntax(),
                       ],
                       onTapLink: (text, href, title) async {
-                        if (href == null) return;
+                        if (href == null) {
+                          return;
+                        }
                         if (DEEP_LINKS
                             .any((prefix) => href.startsWith(prefix))) {
                           injector<DeeplinkService>()
                               .handleDeeplink(href, delay: Duration.zero);
                         } else if (await canLaunchUrlString(href)) {
-                          launchUrlString(href,
+                          await launchUrlString(href,
                               mode: LaunchMode.externalApplication);
                         }
                       },
diff --git a/lib/screen/scan_qr/scan_qr_page.dart b/lib/screen/scan_qr/scan_qr_page.dart
index 03abe637b..df4aa63e8 100644
--- a/lib/screen/scan_qr/scan_qr_page.dart
+++ b/lib/screen/scan_qr/scan_qr_page.dart
@@ -31,6 +31,7 @@ import 'package:autonomy_flutter/util/log.dart';
 import 'package:autonomy_flutter/util/style.dart';
 import 'package:autonomy_flutter/util/ui_helper.dart';
 import 'package:autonomy_flutter/view/back_appbar.dart';
+import 'package:autonomy_flutter/view/header.dart';
 import 'package:autonomy_flutter/view/primary_button.dart';
 import 'package:autonomy_theme/autonomy_theme.dart';
 import 'package:autonomy_tv_proto/models/canvas_device.dart';
@@ -43,41 +44,233 @@ import 'package:permission_handler/permission_handler.dart';
 import 'package:qr_code_scanner/qr_code_scanner.dart';
 import 'package:synchronized/synchronized.dart';
 
+// ignore_for_file: constant_identifier_names
+
 class ScanQRPage extends StatefulWidget {
   static const String tag = AppRouter.scanQRPage;
 
   final ScannerItem scannerItem;
+  final Function? onHandleFinished;
 
-  const ScanQRPage({Key? key, this.scannerItem = ScannerItem.GLOBAL})
-      : super(key: key);
+  const ScanQRPage(
+      {super.key,
+      this.scannerItem = ScannerItem.GLOBAL,
+      this.onHandleFinished});
 
   @override
-  State<ScanQRPage> createState() => _ScanQRPageState();
+  State<ScanQRPage> createState() => ScanQRPageState();
 }
 
-class _ScanQRPageState extends State<ScanQRPage>
+class ScanQRPageState extends State<ScanQRPage>
     with RouteAware, TickerProviderStateMixin {
+  late TabController _tabController;
+  late bool _shouldPop;
+  final GlobalKey<QRScanViewState> _qrScanViewKey = GlobalKey();
+
+  @override
+  void initState() {
+    super.initState();
+    _shouldPop = !(widget.scannerItem == ScannerItem.GLOBAL);
+    //There is a conflict with lib qr_code_scanner on Android.
+    if (Platform.isIOS) {
+      unawaited(SystemChrome.setEnabledSystemUIMode(SystemUiMode.leanBack));
+    }
+    _tabController = TabController(length: 2, vsync: this);
+    _tabController.addListener(() {
+      setState(() {});
+    });
+  }
+
+  Future<void> pauseCamera() async {
+    await Future.delayed(const Duration(milliseconds: 100));
+    await _qrScanViewKey.currentState?.pauseCamera();
+  }
+
+  Future<void> resumeCamera() async {
+    if (_tabController.index == 0) {
+      await _qrScanViewKey.currentState?.resumeCamera();
+    }
+  }
+
+  @override
+  void didChangeDependencies() {
+    super.didChangeDependencies();
+    routeObserver.subscribe(this, ModalRoute.of(context)!);
+  }
+
+  @override
+  Widget build(BuildContext context) => SafeArea(
+        top: false,
+        child: Scaffold(
+          extendBodyBehindAppBar: true,
+          appBar: _tabController.index == 0
+              ? getDarkEmptyAppBar(Colors.transparent)
+              : getLightEmptyAppBar(),
+          body: Stack(
+            children: <Widget>[
+              _content(context),
+              if (_tabController.index == 0) _header(context),
+            ],
+          ),
+        ),
+      );
+
+  Widget _content(BuildContext context) {
+    final size1 = MediaQuery.of(context).size.height / 2;
+    final qrSize = size1 < 240.0 ? size1 : 240.0;
+
+    double cutPaddingTop = qrSize + 500 - MediaQuery.of(context).size.height;
+    if (cutPaddingTop < 0) {
+      cutPaddingTop = 0;
+    }
+    return Column(
+      children: [
+        Expanded(
+          child: TabBarView(
+            controller: _tabController,
+            children: [
+              QRScanView(
+                key: _qrScanViewKey,
+                scannerItem: widget.scannerItem,
+                onHandleFinished: widget.onHandleFinished,
+              ),
+              MultiBlocProvider(
+                  providers: [
+                    BlocProvider(
+                        create: (_) =>
+                            accounts.AccountsBloc(injector(), injector())),
+                    BlocProvider(
+                      create: (_) => PersonaBloc(
+                        injector<CloudDatabase>(),
+                        injector(),
+                        injector<AuditService>(),
+                      ),
+                    ),
+                    BlocProvider(
+                        create: (_) => EthereumBloc(injector(), injector())),
+                    BlocProvider(
+                      create: (_) => TezosBloc(injector(), injector()),
+                    ),
+                  ],
+                  child: GlobalReceivePage(
+                    onClose: () {
+                      setState(() {
+                        _tabController.animateTo(0,
+                            duration: const Duration(milliseconds: 300));
+                        unawaited(resumeCamera());
+                      });
+                    },
+                  )),
+            ],
+          ),
+        ),
+      ],
+    );
+  }
+
+  Widget _header(BuildContext context) {
+    final theme = Theme.of(context);
+    return Column(
+      mainAxisSize: MainAxisSize.min,
+      children: [
+        Padding(
+          padding: EdgeInsets.only(top: MediaQuery.of(context).viewPadding.top),
+          child: HeaderView(
+              title: 'scan'.tr(),
+              action: widget.scannerItem == ScannerItem.GLOBAL
+                  ? GestureDetector(
+                      onTap: () {
+                        setState(() {
+                          unawaited(pauseCamera());
+                          _tabController.animateTo(1,
+                              duration: const Duration(milliseconds: 300));
+                        });
+                      },
+                      child: Text(
+                        'show_my_code'.tr(),
+                        style: theme.textTheme.ppMori400White14.copyWith(
+                          decoration: TextDecoration.underline,
+                        ),
+                      ),
+                    )
+                  : GestureDetector(
+                      onTap: () {
+                        if (_shouldPop) {
+                          Navigator.pop(context);
+                        }
+                      },
+                      child: closeIcon(color: AppColor.white),
+                    )),
+        ),
+      ],
+    );
+  }
+
+  @override
+  void didPopNext() {
+    super.didPopNext();
+    if (Platform.isIOS) {
+      unawaited(SystemChrome.setEnabledSystemUIMode(SystemUiMode.leanBack));
+    }
+  }
+
+  @override
+  void didPushNext() {
+    super.didPushNext();
+    unawaited(SystemChrome.setEnabledSystemUIMode(SystemUiMode.manual,
+        overlays: SystemUiOverlay.values));
+    unawaited(pauseCamera());
+  }
+
+  @override
+  void dispose() {
+    routeObserver.unsubscribe(this);
+    unawaited(SystemChrome.setEnabledSystemUIMode(SystemUiMode.manual,
+        overlays: SystemUiOverlay.values));
+    super.dispose();
+  }
+}
+
+enum ScannerItem {
+  WALLET_CONNECT,
+  BEACON_CONNECT,
+  ETH_ADDRESS,
+  XTZ_ADDRESS,
+  CANVAS_DEVICE,
+  GLOBAL
+}
+
+class QRScanView extends StatefulWidget {
+  final ScannerItem scannerItem;
+  final Function? onHandleFinished;
+
+  const QRScanView(
+      {required this.scannerItem, super.key, this.onHandleFinished});
+
+  @override
+  State<QRScanView> createState() => QRScanViewState();
+}
+
+class QRScanViewState extends State<QRScanView>
+    with RouteAware, AutomaticKeepAliveClientMixin<QRScanView> {
   final GlobalKey qrKey = GlobalKey(debugLabel: 'QR');
   late QRViewController controller;
-  var isScanDataError = false;
-  var _isLoading = false;
+  bool isScanDataError = false;
+  bool _isLoading = false;
   bool cameraPermission = false;
   String? currentCode;
-  late TabController _tabController;
   final metricClient = injector<MetricClientService>();
   final _navigationService = injector<NavigationService>();
   late Lock _lock;
   Timer? _timer;
 
+  late bool _shouldPop;
+
   @override
   void initState() {
     super.initState();
-    //There is a conflict with lib qr_code_scanner on Android.
-    if (Platform.isIOS) {
-      SystemChrome.setEnabledSystemUIMode(SystemUiMode.leanBack);
-    }
-    _tabController = TabController(length: 2, vsync: this);
-    checkPermission();
+    _shouldPop = !(widget.scannerItem == ScannerItem.GLOBAL);
+    unawaited(_checkPermission());
     _lock = Lock();
   }
 
@@ -87,7 +280,39 @@ class _ScanQRPageState extends State<ScanQRPage>
     routeObserver.subscribe(this, ModalRoute.of(context)!);
   }
 
-  Future checkPermission() async {
+  @override
+  void didPopNext() {
+    super.didPopNext();
+    setState(() {
+      _isLoading = false;
+    });
+  }
+
+  @override
+  void didPushNext() {
+    super.didPushNext();
+    unawaited(Future.delayed(const Duration(milliseconds: 300)).then((_) {
+      pauseCamera();
+    }));
+  }
+
+  @override
+  void dispose() {
+    routeObserver.unsubscribe(this);
+    _timer?.cancel();
+    controller.dispose();
+    super.dispose();
+  }
+
+  Future<void> resumeCamera() async {
+    await controller.resumeCamera();
+  }
+
+  Future<void> pauseCamera() async {
+    await controller.pauseCamera();
+  }
+
+  Future _checkPermission() async {
     await Permission.camera.request();
     final status = await Permission.camera.status;
 
@@ -105,7 +330,7 @@ class _ScanQRPageState extends State<ScanQRPage>
         if (Platform.isAndroid) {
           _timer?.cancel();
           _timer = Timer(const Duration(seconds: 1), () {
-            controller.resumeCamera();
+            resumeCamera();
           });
         }
       }
@@ -114,164 +339,49 @@ class _ScanQRPageState extends State<ScanQRPage>
 
   @override
   Widget build(BuildContext context) {
+    super.build(context);
     final size1 = MediaQuery.of(context).size.height / 2;
     final qrSize = size1 < 240.0 ? size1 : 240.0;
 
     var cutPaddingTop = qrSize + 500 - MediaQuery.of(context).size.height;
-    if (cutPaddingTop < 0) cutPaddingTop = 0;
+    if (cutPaddingTop < 0) {
+      cutPaddingTop = 0;
+    }
     final theme = Theme.of(context);
-    return Scaffold(
-      extendBodyBehindAppBar: true,
-      backgroundColor: cameraPermission ? null : theme.colorScheme.primary,
-      appBar: _tabController.index == 0
-          ? _qrCodeAppBar(context)
-          : AppBar(
-              systemOverlayStyle: const SystemUiOverlayStyle(
-                statusBarColor: Colors.white,
-                statusBarIconBrightness: Brightness.dark,
-                statusBarBrightness: Brightness.light,
-              ),
-              toolbarHeight: 0,
-              shadowColor: Colors.transparent,
-              elevation: 0,
-            ),
-      body: Stack(
-        children: <Widget>[
-          if (!cameraPermission)
-            _noPermissionView(context)
-          else
-            Stack(
-              children: [
-                Column(
-                  children: [
-                    Expanded(
-                      child: TabBarView(
-                        controller: _tabController,
-                        children: [
-                          Stack(
-                            children: [
-                              _qrView(context),
-                              Padding(
-                                padding: EdgeInsets.fromLTRB(
-                                  0,
-                                  MediaQuery.of(context).size.height / 2 +
-                                      qrSize / 2 -
-                                      cutPaddingTop,
-                                  0,
-                                  15,
-                                ),
-                                child: Center(
-                                  child: Column(
-                                    mainAxisAlignment:
-                                        MainAxisAlignment.spaceBetween,
-                                    children: [
-                                      _instructionView(context),
-                                    ],
-                                  ),
-                                ),
-                              ),
-                            ],
-                          ),
-                          MultiBlocProvider(providers: [
-                            BlocProvider(
-                                create: (_) => accounts.AccountsBloc(
-                                    injector(), injector())),
-                            BlocProvider(
-                              create: (_) => PersonaBloc(
-                                injector<CloudDatabase>(),
-                                injector(),
-                                injector<AuditService>(),
-                              ),
-                            ),
-                            BlocProvider(
-                                create: (_) =>
-                                    EthereumBloc(injector(), injector())),
-                            BlocProvider(
-                              create: (_) => TezosBloc(injector(), injector()),
-                            ),
-                          ], child: const GlobalReceivePage()),
-                        ],
-                      ),
-                    ),
-                  ],
-                ),
-                Align(
-                  alignment: Alignment.bottomCenter,
-                  child: Padding(
-                    padding: const EdgeInsets.fromLTRB(16.0, 10, 16.0, 40),
-                    child: Container(
-                      height: 55,
-                      padding: const EdgeInsets.all(5),
-                      decoration: BoxDecoration(
-                        borderRadius: BorderRadius.circular(50),
-                        color: theme.auLightGrey,
-                      ),
-                      child: Row(
-                        children: [
-                          Expanded(
-                            child: OutlineButton(
-                              onTap: () {
-                                _tabController.animateTo(0,
-                                    duration:
-                                        const Duration(milliseconds: 300));
-                                setState(() {});
-                              },
-                              text: 'scan_code'.tr(),
-                              color: _tabController.index == 0
-                                  ? theme.colorScheme.primary
-                                  : theme.auLightGrey,
-                              borderColor: Colors.transparent,
-                              textColor: _tabController.index == 1
-                                  ? AppColor.disabledColor
-                                  : AppColor.white,
-                            ),
-                          ),
-                          const SizedBox(width: 10),
-                          Expanded(
-                            child: OutlineButton(
-                              onTap: () {
-                                _tabController.animateTo(1,
-                                    duration:
-                                        const Duration(milliseconds: 300));
-                                setState(() {});
-                              },
-                              text: 'show_my_code'.tr(),
-                              color: _tabController.index == 1
-                                  ? theme.colorScheme.primary
-                                  : theme.auLightGrey,
-                              borderColor: Colors.transparent,
-                              textColor: _tabController.index == 0
-                                  ? AppColor.disabledColor
-                                  : AppColor.white,
-                            ),
-                          ),
-                        ],
-                      ),
-                    ),
-                  ),
-                ),
-              ],
+    return Stack(
+      children: [
+        if (!cameraPermission)
+          _noPermissionView(context)
+        else ...[
+          _qrView(context),
+          Padding(
+            padding: EdgeInsets.fromLTRB(
+              0,
+              MediaQuery.of(context).size.height / 2 +
+                  qrSize / 2 -
+                  cutPaddingTop,
+              0,
+              15,
             ),
-          if (_isLoading) ...[
-            Center(
-              child: CupertinoActivityIndicator(
-                color: theme.colorScheme.primary,
-                radius: 16,
+            child: Center(
+              child: Column(
+                mainAxisAlignment: MainAxisAlignment.spaceBetween,
+                children: [
+                  _instructionView(context),
+                ],
               ),
             ),
-          ]
+          )
         ],
-      ),
-    );
-  }
-
-  AppBar _qrCodeAppBar(BuildContext context) {
-    return getCloseAppBar(
-      context,
-      onClose: () => Navigator.of(context).pop(),
-      withBottomDivider: false,
-      icon: closeIcon(color: AppColor.white),
-      isWhite: false,
+        if (_isLoading) ...[
+          Center(
+            child: CupertinoActivityIndicator(
+              color: theme.colorScheme.primary,
+              radius: 16,
+            ),
+          ),
+        ],
+      ],
     );
   }
 
@@ -281,7 +391,9 @@ class _ScanQRPageState extends State<ScanQRPage>
     final qrSize = size1 < 240.0 ? size1 : 240.0;
 
     var cutPaddingTop = qrSize + 500 - MediaQuery.of(context).size.height;
-    if (cutPaddingTop < 0) cutPaddingTop = 0;
+    if (cutPaddingTop < 0) {
+      cutPaddingTop = 0;
+    }
     final cutOutBottomOffset = 80 + cutPaddingTop;
     return Stack(
       children: [
@@ -290,9 +402,9 @@ class _ScanQRPageState extends State<ScanQRPage>
           overlay: QrScannerOverlayShape(
             borderColor:
                 isScanDataError ? AppColor.red : theme.colorScheme.secondary,
-            overlayColor: (cameraPermission)
+            overlayColor: cameraPermission
                 ? const Color.fromRGBO(0, 0, 0, 0.6)
-                : const Color.fromRGBO(0, 0, 0, 1.0),
+                : const Color.fromRGBO(0, 0, 0, 1),
             cutOutSize: qrSize,
             borderWidth: 8,
             borderRadius: 40,
@@ -331,7 +443,9 @@ class _ScanQRPageState extends State<ScanQRPage>
     final qrSize = size1 < 240.0 ? size1 : 240.0;
 
     var cutPaddingTop = qrSize + 500 - MediaQuery.of(context).size.height;
-    if (cutPaddingTop < 0) cutPaddingTop = 0;
+    if (cutPaddingTop < 0) {
+      cutPaddingTop = 0;
+    }
     final cutOutBottomOffset = 80 + cutPaddingTop;
     return Stack(
       children: [
@@ -344,7 +458,7 @@ class _ScanQRPageState extends State<ScanQRPage>
                 cutOutBottomOffset +
                 32,
             0,
-            30,
+            120,
           ),
           child: Center(
             child: Column(
@@ -352,15 +466,15 @@ class _ScanQRPageState extends State<ScanQRPage>
               children: [
                 _instructionViewNoPermission(context),
                 Padding(
-                  padding: const EdgeInsets.all(8.0),
+                  padding: const EdgeInsets.all(8),
                   child: PrimaryButton(
-                    text: "open_setting".tr(
+                    text: 'open_setting'.tr(
                       namedArgs: {
-                        "device": Platform.isAndroid ? "Device" : "iOS",
+                        'device': Platform.isAndroid ? 'Device' : 'iOS',
                       },
                     ),
-                    onTap: () {
-                      openAppSettings();
+                    onTap: () async {
+                      await openAppSettings();
                     },
                   ),
                 )
@@ -407,7 +521,7 @@ class _ScanQRPageState extends State<ScanQRPage>
               crossAxisAlignment: CrossAxisAlignment.start,
               children: [
                 Text(
-                  "scan_qr_to".tr(),
+                  'scan_qr_to'.tr(),
                   style: theme.textTheme.ppMori700White14,
                 ),
                 Divider(
@@ -416,14 +530,14 @@ class _ScanQRPageState extends State<ScanQRPage>
                 ),
                 RichText(
                   text: TextSpan(
-                    text: "apps".tr(),
+                    text: 'apps'.tr(),
                     children: [
                       TextSpan(
                         text: ' ',
                         style: theme.textTheme.ppMori400Grey14,
                       ),
                       TextSpan(
-                        text: "such_as_openSea".tr(),
+                        text: 'such_as_openSea'.tr(),
                         style: theme.textTheme.ppMori400Grey14,
                       ),
                     ],
@@ -433,7 +547,7 @@ class _ScanQRPageState extends State<ScanQRPage>
                 const SizedBox(height: 15),
                 RichText(
                   text: TextSpan(
-                    text: "autonomy_canvas".tr(),
+                    text: 'autonomy_canvas'.tr(),
                     children: [
                       TextSpan(
                         text: ' ',
@@ -456,7 +570,7 @@ class _ScanQRPageState extends State<ScanQRPage>
       case ScannerItem.XTZ_ADDRESS:
         return Column(
           children: [
-            Text("scan_qr".tr(), style: theme.primaryTextTheme.labelLarge),
+            Text('scan_qr'.tr(), style: theme.primaryTextTheme.labelLarge),
           ],
         );
       case ScannerItem.CANVAS_DEVICE:
@@ -467,61 +581,76 @@ class _ScanQRPageState extends State<ScanQRPage>
   void _onQRViewCreated(QRViewController controller) {
     this.controller = controller;
     controller.scannedDataStream.listen((scanData) async {
-      if (_isLoading) return;
-      if (scanData.code == null) return;
-      if (scanData.code == currentCode && isScanDataError) return;
+      if (_isLoading) {
+        return;
+      }
+      if (scanData.code == null) {
+        return;
+      }
+      if (scanData.code == currentCode && isScanDataError) {
+        return;
+      }
       currentCode = scanData.code;
       String code = scanData.code!;
-
+      setState(() {
+        _isLoading = true;
+      });
+      await pauseCamera();
+      if (!mounted) {
+        return;
+      }
       if (DEEP_LINKS.any((prefix) => code.startsWith(prefix))) {
-        setState(() {
-          _isLoading = true;
-        });
-        controller.pauseCamera();
-        if (!mounted) return;
-        Navigator.pop(context);
+        if (_shouldPop) {
+          Navigator.pop(context);
+        }
 
         injector<DeeplinkService>().handleDeeplink(
           code,
           delay: const Duration(seconds: 1),
+          onFinished: () {
+            if (mounted) {
+              setState(() {
+                _isLoading = false;
+              });
+              unawaited(resumeCamera());
+            }
+            widget.onHandleFinished?.call();
+          },
         );
         return;
-      }
-
-      switch (widget.scannerItem) {
-        case ScannerItem.WALLET_CONNECT:
-          if (code.startsWith("wc:") == true) {
-            _handleAutonomyConnect(code);
-          } else {
-            _handleError(code);
-          }
-          break;
+      } else {
+        switch (widget.scannerItem) {
+          case ScannerItem.WALLET_CONNECT:
+            if (code.startsWith('wc:')) {
+              await _handleAutonomyConnect(code);
+            } else {
+              _handleError(code);
+            }
+            break;
 
-        case ScannerItem.BEACON_CONNECT:
-          if (code.startsWith("tezos://") == true) {
-            _handleBeaconConnect(code);
-          } else {
-            _handleError(code);
-          }
-          break;
+          case ScannerItem.BEACON_CONNECT:
+            if (code.startsWith('tezos://')) {
+              await _handleBeaconConnect(code);
+            } else {
+              _handleError(code);
+            }
+            break;
 
-        case ScannerItem.ETH_ADDRESS:
-        case ScannerItem.XTZ_ADDRESS:
-          setState(() {
-            _isLoading = true;
-          });
-          controller.pauseCamera();
-          Navigator.pop(context, code);
-          break;
-        case ScannerItem.GLOBAL:
-          if (code.startsWith("wc:") == true) {
-            setState(() {
-              _isLoading = true;
-            });
-            _handleAutonomyConnect(code);
-          } else if (code.startsWith("tezos:") == true) {
-            _handleBeaconConnect(code);
-            /* TODO: Remove or support for multiple wallets
+          case ScannerItem.ETH_ADDRESS:
+          case ScannerItem.XTZ_ADDRESS:
+            if (!mounted) {
+              return;
+            }
+            if (_shouldPop) {
+              Navigator.pop(context, code);
+            }
+            break;
+          case ScannerItem.GLOBAL:
+            if (code.startsWith('wc:')) {
+              await _handleAutonomyConnect(code);
+            } else if (code.startsWith('tezos:')) {
+              await _handleBeaconConnect(code);
+              /* TODO: Remove or support for multiple wallets
           } else if (code.startsWith("tz1")) {
             Navigator.of(context).popAndPushNamed(SendCryptoPage.tag,
                 arguments: SendData(CryptoType.XTZ, code));
@@ -534,21 +663,31 @@ class _ScanQRPageState extends State<ScanQRPage>
               log(err.toString());
             }
             */
-          } else if (_isCanvasQrCode(code)) {
-            _lock.synchronized(() async {
-              await _handleCanvasQrCode(code);
-            });
-          } else {
-            _handleError(code);
-          }
-          break;
-        case ScannerItem.CANVAS_DEVICE:
-          if (_isCanvasQrCode(code)) {
-            _lock.synchronized(() => _handleCanvasQrCode(code));
-          } else {
-            _handleError(code);
-          }
-          break;
+            } else if (_isCanvasQrCode(code)) {
+              unawaited(_lock.synchronized(() async {
+                await _handleCanvasQrCode(code);
+              }));
+            } else {
+              _handleError(code);
+            }
+            break;
+          case ScannerItem.CANVAS_DEVICE:
+            if (_isCanvasQrCode(code)) {
+              unawaited(_lock.synchronized(() => _handleCanvasQrCode(code)));
+            } else {
+              _handleError(code);
+            }
+            break;
+        }
+        if (mounted) {
+          setState(() {
+            _isLoading = false;
+          });
+          await resumeCamera();
+        }
+        if (!isScanDataError) {
+          widget.onHandleFinished?.call();
+        }
       }
     });
   }
@@ -563,11 +702,7 @@ class _ScanQRPageState extends State<ScanQRPage>
   }
 
   Future<bool> _handleCanvasQrCode(String code) async {
-    log.info("Canvas device scanned: $code");
-    setState(() {
-      _isLoading = true;
-    });
-    controller.pauseCamera();
+    log.info('Canvas device scanned: $code');
     try {
       final device = CanvasDevice.fromJson(jsonDecode(code));
       final canvasClient = injector<CanvasClientService>();
@@ -575,36 +710,46 @@ class _ScanQRPageState extends State<ScanQRPage>
       if (result) {
         device.isConnecting = true;
       }
-      if (!mounted) return false;
-      Navigator.pop(context, device);
+      if (!mounted) {
+        return false;
+      }
+      if (_shouldPop) {
+        Navigator.pop(context, device);
+      }
       return result;
     } catch (e) {
-      Navigator.pop(context);
-      if (e.toString().contains("DEADLINE_EXCEEDED") || true) {
-        UIHelper.showInfoDialog(_navigationService.navigatorKey.currentContext!,
-            "failed_to_connect".tr(), "canvas_ip_fail".tr(),
-            closeButton: "close".tr());
+      if (mounted) {
+        if (_shouldPop) {
+          Navigator.pop(context);
+        }
+        if (e.toString().contains('DEADLINE_EXCEEDED') || true) {
+          await UIHelper.showInfoDialog(
+              _navigationService.navigatorKey.currentContext!,
+              'failed_to_connect'.tr(),
+              'canvas_ip_fail'.tr(),
+              closeButton: 'close'.tr());
+        }
       }
     }
     return false;
   }
 
-  Future _addScanQREvent(
+  void _addScanQREvent(
       {required String link,
       required String linkType,
       required String prefix,
-      Map<dynamic, dynamic> addData = const {}}) async {
+      Map<dynamic, dynamic> addData = const {}}) {
     final uri = Uri.parse(link);
     final uriData = uri.queryParameters;
     final data = {
-      "link": link,
+      'link': link,
       'linkType': linkType,
-      "prefix": prefix,
-    };
-    data.addAll(uriData);
-    data.addAll(addData.map((key, value) => MapEntry(key, value.toString())));
+      'prefix': prefix,
+    }
+      ..addAll(uriData)
+      ..addAll(addData.map((key, value) => MapEntry(key, value.toString())));
 
-    metricClient.addEvent(MixpanelEvent.scanQR, data: data);
+    unawaited(metricClient.addEvent(MixpanelEvent.scanQR, data: data));
   }
 
   void _handleError(String data) {
@@ -619,68 +764,37 @@ class _ScanQRPageState extends State<ScanQRPage>
       }
     });
 
-    log.info("[Scanner][start] scan ${widget.scannerItem}");
-    log.info(
-        "[Scanner][incorrectScanItem] item: ${data.substring(0, data.length ~/ 2)}");
+    log
+      ..info('[Scanner][start] scan ${widget.scannerItem}')
+      ..info('[Scanner][incorrectScanItem] item: '
+          '${data.substring(0, data.length ~/ 2)}');
   }
 
   Future<void> _handleAutonomyConnect(String code) async {
-    setState(() {
-      _isLoading = true;
-    });
-    controller.pauseCamera();
-    Navigator.pop(context);
+    if (_shouldPop) {
+      Navigator.pop(context);
+    }
     await Future.delayed(const Duration(seconds: 1));
 
     _addScanQREvent(
-        link: code, linkType: LinkType.autonomyConnect, prefix: "wc:");
-    injector<Wc2Service>().connect(code);
+        link: code, linkType: LinkType.autonomyConnect, prefix: 'wc:');
+    await injector<Wc2Service>().connect(code);
   }
 
   Future<void> _handleBeaconConnect(String code) async {
-    setState(() {
-      _isLoading = true;
-    });
-    controller.pauseCamera();
-    Navigator.pop(context);
+    if (_shouldPop) {
+      Navigator.pop(context);
+    }
     await Future.delayed(const Duration(seconds: 1));
 
     _addScanQREvent(
-        link: code, linkType: LinkType.beaconConnect, prefix: "tezos://");
-    injector<TezosBeaconService>().addPeer(code);
-
-    injector<NavigationService>().showContactingDialog();
-  }
-
-  @override
-  void didPopNext() {
-    if (Platform.isIOS) {
-      SystemChrome.setEnabledSystemUIMode(SystemUiMode.leanBack);
-    }
+        link: code, linkType: LinkType.beaconConnect, prefix: 'tezos://');
+    await Future.wait([
+      injector<TezosBeaconService>().addPeer(code),
+      injector<NavigationService>().showContactingDialog()
+    ]);
   }
 
   @override
-  void didPushNext() {
-    SystemChrome.setEnabledSystemUIMode(SystemUiMode.manual,
-        overlays: SystemUiOverlay.values);
-  }
-
-  @override
-  void dispose() {
-    controller.dispose();
-    _timer?.cancel();
-    routeObserver.unsubscribe(this);
-    SystemChrome.setEnabledSystemUIMode(SystemUiMode.manual,
-        overlays: SystemUiOverlay.values);
-    super.dispose();
-  }
-}
-
-enum ScannerItem {
-  WALLET_CONNECT,
-  BEACON_CONNECT,
-  ETH_ADDRESS,
-  XTZ_ADDRESS,
-  CANVAS_DEVICE,
-  GLOBAL
+  bool get wantKeepAlive => true;
 }
diff --git a/lib/screen/settings/crypto/wallet_detail/linked_wallet_detail_page.dart b/lib/screen/settings/crypto/wallet_detail/linked_wallet_detail_page.dart
index 616e9fabe..265f3d921 100644
--- a/lib/screen/settings/crypto/wallet_detail/linked_wallet_detail_page.dart
+++ b/lib/screen/settings/crypto/wallet_detail/linked_wallet_detail_page.dart
@@ -430,7 +430,7 @@ class _LinkedWalletDetailPageState extends State<LinkedWalletDetailPage>
                       child: ElevatedButton(
                         style: ElevatedButton.styleFrom(
                           backgroundColor: isCopied
-                              ? AppColor.auSuperTeal
+                              ? AppColor.feralFileHighlight
                               : AppColor.auLightGrey,
                           shadowColor: Colors.transparent,
                           shape: RoundedRectangleBorder(
diff --git a/lib/screen/settings/crypto/wallet_detail/wallet_detail_page.dart b/lib/screen/settings/crypto/wallet_detail/wallet_detail_page.dart
index 0bca1b31d..159b6b9da 100644
--- a/lib/screen/settings/crypto/wallet_detail/wallet_detail_page.dart
+++ b/lib/screen/settings/crypto/wallet_detail/wallet_detail_page.dart
@@ -485,7 +485,7 @@ class _WalletDetailPageState extends State<WalletDetailPage> with RouteAware {
                       child: ElevatedButton(
                         style: ElevatedButton.styleFrom(
                           backgroundColor: isCopied
-                              ? AppColor.auSuperTeal
+                              ? AppColor.feralFileHighlight
                               : AppColor.auLightGrey,
                           shadowColor: Colors.transparent,
                           shape: RoundedRectangleBorder(
diff --git a/lib/screen/settings/settings_page.dart b/lib/screen/settings/settings_page.dart
index b19f5c6ff..0913dc6c6 100644
--- a/lib/screen/settings/settings_page.dart
+++ b/lib/screen/settings/settings_page.dart
@@ -5,6 +5,7 @@
 //  that can be found in the LICENSE file.
 //
 
+import 'dart:async';
 import 'dart:io';
 
 import 'package:autonomy_flutter/common/injector.dart';
@@ -25,7 +26,6 @@ import 'package:autonomy_flutter/view/back_appbar.dart';
 import 'package:autonomy_flutter/view/external_app_info_view.dart';
 import 'package:autonomy_flutter/view/responsive.dart';
 import 'package:autonomy_flutter/view/tappable_forward_row.dart';
-import 'package:autonomy_flutter/view/tip_card.dart';
 import 'package:autonomy_theme/autonomy_theme.dart';
 import 'package:easy_localization/easy_localization.dart';
 import 'package:flutter/material.dart';
@@ -35,7 +35,7 @@ import 'package:flutter_svg/flutter_svg.dart';
 import 'package:package_info_plus/package_info_plus.dart';
 
 class SettingsPage extends StatefulWidget {
-  const SettingsPage({Key? key}) : super(key: key);
+  const SettingsPage({super.key});
 
   @override
   State<SettingsPage> createState() => _SettingsPageState();
@@ -51,15 +51,18 @@ class _SettingsPageState extends State<SettingsPage>
 
   final GlobalKey<State> _preferenceKey = GlobalKey();
   bool _pendingSettingsCleared = false;
+  final _settingsDataServices = injector<SettingsDataService>();
+  final _versionService = injector<VersionService>();
+  final _configurationService = injector<ConfigurationService>();
 
   @override
   void initState() {
     super.initState();
     WidgetsBinding.instance.addObserver(this);
-    _loadPackageInfo();
-    _checkVersion();
-    injector<SettingsDataService>().backup();
-    injector<VersionService>().checkForUpdate();
+    unawaited(_loadPackageInfo());
+    unawaited(_checkVersion());
+    unawaited(_settingsDataServices.backup());
+    unawaited(_versionService.checkForUpdate());
     _controller = ScrollController();
   }
 
@@ -87,7 +90,7 @@ class _SettingsPageState extends State<SettingsPage>
     SystemChrome.setSystemUIOverlayStyle(const SystemUiOverlayStyle(
       statusBarBrightness: Brightness.light,
     ));
-    injector<SettingsDataService>().backup();
+    unawaited(injector<SettingsDataService>().backup());
   }
 
   Widget _settingItem({
@@ -118,122 +121,128 @@ class _SettingsPageState extends State<SettingsPage>
   }
 
   @override
-  Widget build(BuildContext context) {
-    final theme = Theme.of(context);
-    return Scaffold(
-      appBar: getCloseAppBar(
-        context,
-        title: "settings".tr(),
-        onClose: () {
-          Navigator.of(context).pop();
-        },
-      ),
-      body: SafeArea(
-        child: NotificationListener(
-          child: Column(
-            children: [
-              const SizedBox(height: 30),
-              Column(
-                children: [
-                  _settingItem(
-                    title: "preferences".tr(),
-                    icon: const Icon(AuIcon.preferences),
-                    onTap: () {
-                      Navigator.of(context)
-                          .pushNamed(AppRouter.preferencesPage);
-                    },
-                  ),
-                  addOnlyDivider(),
-                  _settingItem(
-                    title: "back_up".tr(),
-                    icon: SvgPicture.asset("assets/images/icon_backup.svg"),
-                    onTap: () async {
-                      if (Platform.isAndroid) {
-                        final isAndroidEndToEndEncryptionAvailable =
-                            await injector<AccountService>()
-                                .isAndroidEndToEndEncryptionAvailable();
-                        if (!mounted) return;
-                        Navigator.of(context).pushNamed(
-                            AppRouter.cloudAndroidPage,
-                            arguments: CloudAndroidPagePayload(
-                                isEncryptionAvailable:
-                                    isAndroidEndToEndEncryptionAvailable));
-                      } else {
-                        Navigator.of(context).pushNamed(AppRouter.cloudPage,
-                            arguments: CloudPagePayload(section: "nameAlias"));
-                      }
-                    },
-                    stateWidget: const CloudState(),
-                  ),
-                  addOnlyDivider(),
-                  _settingItem(
-                    title: "hidden_artwork".tr(),
-                    icon: const Icon(AuIcon.hidden_artwork),
-                    onTap: () {
-                      Navigator.of(context)
-                          .pushNamed(AppRouter.hiddenArtworksPage);
-                    },
-                  ),
-                  addOnlyDivider(),
-                  _settingItem(
-                    title: "autonomy_pro".tr(),
-                    icon: const Icon(AuIcon.subscription),
-                    onTap: () {
-                      Navigator.of(context)
-                          .pushNamed(AppRouter.subscriptionPage);
-                    },
-                  ),
-                  addOnlyDivider(),
-                  _settingItem(
-                    title: "data_management".tr(),
-                    icon: const Icon(AuIcon.data_management),
-                    onTap: () {
-                      Navigator.of(context)
-                          .pushNamed(AppRouter.dataManagementPage);
-                    },
-                  ),
-                  addOnlyDivider(),
-                  _settingItem(
-                    title: "help_us_improve".tr(),
-                    icon: const Icon(AuIcon.help_us),
-                    onTap: () {
-                      Navigator.of(context).pushNamed(AppRouter.helpUsPage);
-                    },
-                  ),
-                  addOnlyDivider(),
-                ],
-              ),
-              const Spacer(),
-              Container(
-                padding: ResponsiveLayout.pageEdgeInsetsWithSubmitButton,
-                alignment: Alignment.bottomCenter,
-                child: _versionSection(),
-              ),
-            ],
-          ),
-          onNotification: (ScrollNotification notification) {
-            var currentContext = _preferenceKey.currentContext;
-            if (currentContext == null) return false;
-            final renderObject = currentContext.findRenderObject();
-            if (renderObject == null) return false;
-            final viewport = RenderAbstractViewport.of(renderObject);
-            final bottom = viewport.getOffsetToReveal(renderObject, 1.0).offset;
-            final top = viewport.getOffsetToReveal(renderObject, 0.0).offset;
-            final offset = notification.metrics.pixels;
-            if (offset > 2 * (top + (bottom - top) / 3)) {
-              _clearPendingSettings();
-            }
-            return false;
+  Widget build(BuildContext context) => Scaffold(
+        appBar: getBackAppBar(
+          context,
+          title: 'settings'.tr(),
+          onBack: () {
+            Navigator.of(context).pop();
           },
         ),
-      ),
-    );
-  }
+        body: SafeArea(
+          child: NotificationListener(
+            child: Column(
+              children: [
+                const SizedBox(height: 30),
+                Column(
+                  children: [
+                    _settingItem(
+                      title: 'preferences'.tr(),
+                      icon: const Icon(AuIcon.preferences),
+                      onTap: () async {
+                        await Navigator.of(context)
+                            .pushNamed(AppRouter.preferencesPage);
+                      },
+                    ),
+                    addOnlyDivider(),
+                    _settingItem(
+                      title: 'back_up'.tr(),
+                      icon: SvgPicture.asset('assets/images/icon_backup.svg'),
+                      onTap: () async {
+                        if (Platform.isAndroid) {
+                          final isAndroidEndToEndEncryptionAvailable =
+                              await injector<AccountService>()
+                                  .isAndroidEndToEndEncryptionAvailable();
+                          if (!mounted) {
+                            return;
+                          }
+                          await Navigator.of(context).pushNamed(
+                              AppRouter.cloudAndroidPage,
+                              arguments: CloudAndroidPagePayload(
+                                  isEncryptionAvailable:
+                                      isAndroidEndToEndEncryptionAvailable));
+                        } else {
+                          await Navigator.of(context).pushNamed(
+                              AppRouter.cloudPage,
+                              arguments:
+                                  CloudPagePayload(section: 'nameAlias'));
+                        }
+                      },
+                      stateWidget: const CloudState(),
+                    ),
+                    addOnlyDivider(),
+                    _settingItem(
+                      title: 'hidden_artwork'.tr(),
+                      icon: const Icon(AuIcon.hidden_artwork),
+                      onTap: () async {
+                        await Navigator.of(context)
+                            .pushNamed(AppRouter.hiddenArtworksPage);
+                      },
+                    ),
+                    addOnlyDivider(),
+                    _settingItem(
+                      title: 'autonomy_pro'.tr(),
+                      icon: const Icon(AuIcon.subscription),
+                      onTap: () async {
+                        await Navigator.of(context)
+                            .pushNamed(AppRouter.subscriptionPage);
+                      },
+                    ),
+                    addOnlyDivider(),
+                    _settingItem(
+                      title: 'data_management'.tr(),
+                      icon: const Icon(AuIcon.data_management),
+                      onTap: () async {
+                        await Navigator.of(context)
+                            .pushNamed(AppRouter.dataManagementPage);
+                      },
+                    ),
+                    addOnlyDivider(),
+                    _settingItem(
+                      title: 'help_us_improve'.tr(),
+                      icon: const Icon(AuIcon.help_us),
+                      onTap: () async {
+                        await Navigator.of(context)
+                            .pushNamed(AppRouter.helpUsPage);
+                      },
+                    ),
+                    addOnlyDivider(),
+                  ],
+                ),
+                const Spacer(),
+                Container(
+                  padding: ResponsiveLayout.pageEdgeInsetsWithSubmitButton,
+                  alignment: Alignment.bottomCenter,
+                  child: _versionSection(),
+                ),
+              ],
+            ),
+            onNotification: (ScrollNotification notification) {
+              var currentContext = _preferenceKey.currentContext;
+              if (currentContext == null) {
+                return false;
+              }
+              final renderObject = currentContext.findRenderObject();
+              if (renderObject == null) {
+                return false;
+              }
+              final viewport = RenderAbstractViewport.of(renderObject);
+              final bottom = viewport.getOffsetToReveal(renderObject, 1).offset;
+              final top = viewport.getOffsetToReveal(renderObject, 0).offset;
+              final offset = notification.metrics.pixels;
+              if (offset > 2 * (top + (bottom - top) / 3)) {
+                _clearPendingSettings();
+              }
+              return false;
+            },
+          ),
+        ),
+      );
 
   void _clearPendingSettings() {
     if (!_pendingSettingsCleared) {
-      injector<ConfigurationService>().setPendingSettings(false);
-      injector<ConfigurationService>().setShouldShowSubscriptionHint(false);
+      unawaited(_configurationService.setPendingSettings(false));
+      unawaited(_configurationService.setShouldShowSubscriptionHint(false));
       _pendingSettingsCleared = true;
     }
   }
@@ -261,32 +270,32 @@ class _SettingsPageState extends State<SettingsPage>
         children: [
           GestureDetector(
             child: Text(
-              "eula".tr(),
+              'eula'.tr(),
               style: theme.textTheme.ppMori400Grey12
                   .copyWith(decoration: TextDecoration.underline),
             ),
-            onTap: () => Navigator.of(context)
+            onTap: () async => Navigator.of(context)
                 .pushNamed(AppRouter.githubDocPage, arguments: {
-              "prefix": "/bitmark-inc/autonomy.io/main/apps/docs/",
-              "document": "eula.md",
-              "title": "eula".tr(),
+              'prefix': '/bitmark-inc/autonomy.io/main/apps/docs/',
+              'document': 'eula.md',
+              'title': 'eula'.tr(),
             }),
           ),
           Text(
-            "_and".tr(),
+            '_and'.tr(),
             style: theme.textTheme.ppMori400Grey12,
           ),
           GestureDetector(
             child: Text(
-              "privacy_policy".tr(),
+              'privacy_policy'.tr(),
               style: theme.textTheme.ppMori400Grey12
                   .copyWith(decoration: TextDecoration.underline),
             ),
-            onTap: () => Navigator.of(context)
+            onTap: () async => Navigator.of(context)
                 .pushNamed(AppRouter.githubDocPage, arguments: {
-              "prefix": "/bitmark-inc/autonomy.io/main/apps/docs/",
-              "document": "privacy.md",
-              "title": "privacy_policy".tr(),
+              'prefix': '/bitmark-inc/autonomy.io/main/apps/docs/',
+              'document': 'privacy.md',
+              'title': 'privacy_policy'.tr(),
             }),
           ),
         ],
@@ -301,24 +310,24 @@ class _SettingsPageState extends State<SettingsPage>
                 border: Border.all(color: AppColor.auGrey),
               ),
               child: Text(
-                "version_".tr(
+                'version_'.tr(
                   namedArgs: {
-                    "version": _packageInfo!.version,
-                    "buildNumber": _packageInfo!.buildNumber
+                    'version': _packageInfo!.version,
+                    'buildNumber': _packageInfo!.buildNumber
                   },
                 ),
-                key: const Key("version"),
+                key: const Key('version'),
                 style: theme.textTheme.ppMori400Grey14,
               ),
             ),
             onTap: () async {
-              injector<VersionService>().showReleaseNotes();
+              await injector<VersionService>().showReleaseNotes();
             }),
       const SizedBox(height: 10),
       StatefulBuilder(builder: (BuildContext context, StateSetter setState) {
         final isLatestVersion = compareVersion(
-                _versionCheck?.packageVersion ?? "",
-                _versionCheck?.storeVersion ?? "") >=
+                _versionCheck?.packageVersion ?? '',
+                _versionCheck?.storeVersion ?? '') >=
             0;
         return GestureDetector(
           onTap: () async {
@@ -329,12 +338,15 @@ class _SettingsPageState extends State<SettingsPage>
                 if (_consecutiveTaps == 3) {
                   final newValue = await injector<ConfigurationService>()
                       .toggleDemoArtworksMode();
-                  if (!mounted) return;
+                  if (!mounted) {
+                    return;
+                  }
                   await UIHelper.showInfoDialog(
                       context,
-                      "demo_mode".tr(),
-                      "demo_mode_en".tr(
-                          args: [newValue ? "enable".tr() : "disable".tr()]),
+                      'demo_mode'.tr(),
+                      'demo_mode_en'.tr(args: [
+                        if (newValue) 'enable'.tr() else 'disable'.tr()
+                      ]),
                       autoDismissAfter: 1);
                 }
               } else {
@@ -342,18 +354,18 @@ class _SettingsPageState extends State<SettingsPage>
               }
               _lastTap = now;
             } else {
-              UIHelper.showMessageAction(
+              await UIHelper.showMessageAction(
                 context,
-                "update_available".tr(),
-                "want_to_update".tr(
+                'update_available'.tr(),
+                'want_to_update'.tr(
                   args: [
-                    _versionCheck?.storeVersion ?? "the_latest_version".tr(),
-                    _packageInfo?.version ?? ""
+                    _versionCheck?.storeVersion ?? 'the_latest_version'.tr(),
+                    _packageInfo?.version ?? ''
                   ],
                 ),
                 isDismissible: true,
-                closeButton: "close".tr(),
-                actionButton: "update".tr(),
+                closeButton: 'close'.tr(),
+                actionButton: 'update'.tr(),
                 onAction: () {
                   injector<VersionService>().openLatestVersion();
                 },
diff --git a/lib/screen/wallet/wallet_page.dart b/lib/screen/wallet/wallet_page.dart
index b410896e8..19fddaa9e 100644
--- a/lib/screen/wallet/wallet_page.dart
+++ b/lib/screen/wallet/wallet_page.dart
@@ -67,7 +67,7 @@ class _WalletPageState extends State<WalletPage>
   void _showAddWalletOption() {
     final transparentTextTheme = Theme.of(context)
         .textTheme
-        .ppMori400Green14
+        .ppMori400FFYellow14
         .copyWith(color: Colors.transparent);
     final options = [
       OptionItem(
@@ -122,9 +122,9 @@ class _WalletPageState extends State<WalletPage>
 
   @override
   Widget build(BuildContext context) => Scaffold(
-        appBar: getBackAppBar(context,
-            title: 'addresses'.tr(),
-            onBack: null,
+        appBar: getBackAppBar(context, title: 'addresses'.tr(), onBack: () {
+          Navigator.of(context).pop();
+        },
             icon: Semantics(
               label: 'address_menu',
               child: SvgPicture.asset(
diff --git a/lib/screen/wallet_connect/wc_connect_page.dart b/lib/screen/wallet_connect/wc_connect_page.dart
index cfac69639..ffffae1ed 100644
--- a/lib/screen/wallet_connect/wc_connect_page.dart
+++ b/lib/screen/wallet_connect/wc_connect_page.dart
@@ -165,7 +165,8 @@ class _WCConnectPageState extends State<WCConnectPage>
       return;
     }
 
-    UIHelper.showLoadingScreen(context, text: 'connecting_wallet'.tr());
+    unawaited(
+        UIHelper.showLoadingScreen(context, text: 'connecting_wallet'.tr()));
     late String payloadAddress;
     late CryptoType payloadType;
     switch (connectionRequest.runtimeType) {
@@ -289,7 +290,7 @@ class _WCConnectPageState extends State<WCConnectPage>
       addOnTextSpan: [
         TextSpan(
           text: connectionRequest.name,
-          style: Theme.of(context).textTheme.ppMori400Green14,
+          style: Theme.of(context).textTheme.ppMori400FFYellow14,
         )
       ],
     );
@@ -668,7 +669,7 @@ class _WCConnectPageState extends State<WCConnectPage>
       );
 
   Future _createAccount(BuildContext context) async {
-    UIHelper.showLoadingScreen(context, text: 'connecting'.tr());
+    unawaited(UIHelper.showLoadingScreen(context, text: 'connecting'.tr()));
     final persona =
         await injector<AccountService>().getOrCreateDefaultPersona();
     await persona.insertNextAddress(connectionRequest.isBeaconConnect
diff --git a/lib/service/account_service.dart b/lib/service/account_service.dart
index e3c19d3ec..b4b951e89 100644
--- a/lib/service/account_service.dart
+++ b/lib/service/account_service.dart
@@ -86,8 +86,6 @@ abstract class AccountService {
 
   Future<List<String>> getAllAddresses({bool logHiddenAddress = false});
 
-  Future<List<AddressIndex>> getAllAddressIndexes();
-
   Future<List<String>> getAddress(String blockchain,
       {bool withViewOnly = false});
 
@@ -511,27 +509,6 @@ class AccountServiceImpl extends AccountService {
     return addresses;
   }
 
-  @override
-  Future<List<AddressIndex>> getAllAddressIndexes() async {
-    if (_configurationService.isDemoArtworksMode()) {
-      final demoAccount = await getDemoAccount();
-      return [AddressIndex(address: demoAccount, createdAt: DateTime.now())];
-    }
-
-    List<AddressIndex> addresses = [];
-    final walletAddress = await _cloudDB.addressDao.getAllAddresses();
-    addresses.addAll(walletAddress.map((e) => e.addressIndex).toList());
-
-    final linkedAccounts =
-        await _cloudDB.connectionDao.getUpdatedLinkedAccounts();
-
-    for (final linkedAccount in linkedAccounts) {
-      addresses.addAll(linkedAccount.addressIndexes);
-    }
-
-    return addresses;
-  }
-
   @override
   Future<List<String>> getAddress(String blockchain,
       {bool withViewOnly = false}) async {
diff --git a/lib/service/configuration_service.dart b/lib/service/configuration_service.dart
index 135dfcb7b..130ebf59f 100644
--- a/lib/service/configuration_service.dart
+++ b/lib/service/configuration_service.dart
@@ -127,7 +127,9 @@ abstract class ConfigurationService {
 
   List<PlayListModel> getPlayList();
 
-  Future<void> setPlayList(List<PlayListModel>? value, {bool override = false});
+  Future<void> setPlayList(List<PlayListModel>? value,
+      {bool override = false,
+      ConflictAction onConflict = ConflictAction.abort});
 
   Future<void> removePlayList(String id);
 
@@ -257,6 +259,8 @@ abstract class ConfigurationService {
   Future<void> setDidSyncArtists(bool value);
 
   bool getDidSyncArtists();
+
+  List<String> getHiddenOrSentTokenIDs();
 }
 
 class ConfigurationServiceImpl implements ConfigurationService {
@@ -703,14 +707,31 @@ class ConfigurationServiceImpl implements ConfigurationService {
 
   @override
   Future<void> setPlayList(List<PlayListModel>? value,
-      {bool override = false}) async {
-    final playlists = value?.map((e) => jsonEncode(e)).toList() ?? [];
+      {bool override = false,
+      ConflictAction onConflict = ConflictAction.abort}) async {
+    var newPlaylists = value?.map((e) => jsonEncode(e)).toList() ?? [];
 
     if (override) {
-      await _preferences.setStringList(PLAYLISTS, playlists);
+      await _preferences.setStringList(PLAYLISTS, newPlaylists);
     } else {
-      var playlistsSave = _preferences.getStringList(PLAYLISTS) ?? []
-        ..addAll(playlists);
+      var playlistsSave = _preferences.getStringList(PLAYLISTS) ?? [];
+      final playlists = playlistsSave
+          .map((e) => PlayListModel.fromJson(jsonDecode(e)))
+          .toList();
+      switch (onConflict) {
+        case ConflictAction.replace:
+          playlists.removeWhere((playlist) =>
+              value?.any((element) => playlist.id == element.id) ?? false);
+          playlistsSave = playlists.map((e) => jsonEncode(e)).toList();
+          break;
+        case ConflictAction.abort:
+          value?.removeWhere((playlist) =>
+              playlists.any((element) => element.id == playlist.id));
+          newPlaylists = value?.map((e) => jsonEncode(e)).toList() ?? [];
+          break;
+      }
+
+      playlistsSave.addAll(newPlaylists);
       await _preferences.setStringList(
           PLAYLISTS, playlistsSave.toSet().toList());
     }
@@ -1137,4 +1158,20 @@ class ConfigurationServiceImpl implements ConfigurationService {
           key, currentStampingPostcard.toSet().toList());
     }
   }
+
+  @override
+  List<String> getHiddenOrSentTokenIDs() {
+    final hiddenTokens = getTempStorageHiddenTokenIDs();
+    final recentlySent = getRecentlySentToken();
+    hiddenTokens.addAll(recentlySent
+        .where((element) => element.isSentAll)
+        .map((e) => e.tokenID)
+        .toList());
+    return hiddenTokens;
+  }
+}
+
+enum ConflictAction {
+  abort,
+  replace,
 }
diff --git a/lib/service/customer_support_service.dart b/lib/service/customer_support_service.dart
index 8c42f42af..16045ceb9 100644
--- a/lib/service/customer_support_service.dart
+++ b/lib/service/customer_support_service.dart
@@ -5,6 +5,7 @@
 //  that can be found in the LICENSE file.
 //
 
+import 'dart:async';
 import 'dart:convert';
 import 'dart:io';
 
@@ -19,6 +20,7 @@ import 'package:autonomy_flutter/model/customer_support.dart';
 import 'package:autonomy_flutter/screen/app_router.dart';
 import 'package:autonomy_flutter/screen/customer_support/support_thread_page.dart';
 import 'package:autonomy_flutter/service/configuration_service.dart';
+import 'package:autonomy_flutter/service/metric_client_service.dart';
 import 'package:autonomy_flutter/service/navigation_service.dart';
 import 'package:autonomy_flutter/util/constants.dart';
 import 'package:autonomy_flutter/util/device.dart';
@@ -33,8 +35,6 @@ import 'package:package_info_plus/package_info_plus.dart';
 import 'package:path_provider/path_provider.dart';
 import 'package:sentry_flutter/sentry_flutter.dart';
 
-import 'metric_client_service.dart';
-
 class CustomerSupportUpdate {
   DraftCustomerSupport draft;
   PostedMessageResponse response;
@@ -133,7 +133,9 @@ class CustomerSupportServiceImpl extends CustomerSupportService {
         (element) => element.reportIssueType == ReportIssueType.ReportNFTIssue);
 
     for (var draft in drafts) {
-      if (draft.type != CSMessageType.CreateIssue.rawValue) continue;
+      if (draft.type != CSMessageType.CreateIssue.rawValue) {
+        continue;
+      }
 
       final draftData = draft.draftData;
 
@@ -174,9 +176,8 @@ class CustomerSupportServiceImpl extends CustomerSupportService {
   }
 
   @override
-  Future<IssueDetails> getDetails(String issueID) async {
-    return await _customerSupportApi.getDetails(issueID);
-  }
+  Future<IssueDetails> getDetails(String issueID) async =>
+      await _customerSupportApi.getDetails(issueID);
 
   @override
   Future draftMessage(DraftCustomerSupport draft) async {
@@ -225,29 +226,35 @@ class CustomerSupportServiceImpl extends CustomerSupportService {
   @override
   Future processMessages() async {
     log.info('[CS-Service][trigger] processMessages');
-    if (_isProcessingDraftMessages) return;
+    if (_isProcessingDraftMessages) {
+      return;
+    }
     final fetchLimit = errorMessages.length + 1;
     log.info('[CS-Service][start] processMessages');
     final draftMsgsRaw = await _draftCustomerSupportDao.fetchDrafts(fetchLimit);
-    if (draftMsgsRaw.isEmpty) return;
+    if (draftMsgsRaw.isEmpty) {
+      return;
+    }
     final draftMsg = draftMsgsRaw
         .firstWhereOrNull((element) => !errorMessages.contains(element.uuid));
-    if (draftMsg == null) return;
+    if (draftMsg == null) {
+      return;
+    }
     log.info('[CS-Service][start] processMessages hasDraft');
     _isProcessingDraftMessages = true;
 
     retryTime++;
 
     // Edge Case when database has not updated the new issueID for new comments
-    if (draftMsg.type != 'CreateIssue' && draftMsg.issueID.contains("TEMP")) {
+    if (draftMsg.type != 'CreateIssue' && draftMsg.issueID.contains('TEMP')) {
       final newIssueID = tempIssueIDMap[draftMsg.issueID];
       if (newIssueID != null) {
         await _draftCustomerSupportDao.updateIssueID(
             draftMsg.issueID, newIssueID);
       } else {
         if (!draftMsgsRaw.any((element) =>
-            ((element.issueID == draftMsg.issueID) &&
-                (element.uuid != draftMsg.uuid)))) {
+            (element.issueID == draftMsg.issueID) &&
+            (element.uuid != draftMsg.uuid))) {
           await _draftCustomerSupportDao.deleteDraft(draftMsg);
         } else {
           sendMessageFail(draftMsg.uuid);
@@ -297,7 +304,7 @@ class CustomerSupportServiceImpl extends CustomerSupportService {
             data.text,
             sendAttachments,
             title: data.title,
-            mutedText: draftMsg.mutedMessages.split("[SEPARATOR]"),
+            mutedText: draftMsg.mutedMessages.split('[SEPARATOR]'),
             announcementID: data.announcementId,
           );
           tempIssueIDMap[draftMsg.issueID] = result.issueID;
@@ -339,9 +346,8 @@ class CustomerSupportServiceImpl extends CustomerSupportService {
   }
 
   @override
-  Future<List<DraftCustomerSupport>> getDrafts(String issueID) async {
-    return _draftCustomerSupportDao.getDrafts(issueID);
-  }
+  Future<List<DraftCustomerSupport>> getDrafts(String issueID) async =>
+      _draftCustomerSupportDao.getDrafts(issueID);
 
   Future<PostedMessageResponse> createIssue(
     String reportIssueType,
@@ -359,27 +365,27 @@ class CustomerSupportServiceImpl extends CustomerSupportService {
     // add tags
     var tags = [reportIssueType];
     if (Platform.isIOS) {
-      tags.add("iOS");
+      tags.add('iOS');
     } else if (Platform.isAndroid) {
-      tags.add("android");
+      tags.add('android');
     }
 
     // Muted Message
-    var mutedMessage = "";
+    var mutedMessage = '';
     final deviceID = await getDeviceID();
     if (deviceID != null) {
-      mutedMessage += "**DeviceID**: $deviceID\n";
+      mutedMessage += '**DeviceID**: $deviceID\n';
     }
 
     final version = (await PackageInfo.fromPlatform()).version;
-    mutedMessage += "**Version**: $version\n";
+    mutedMessage += '**Version**: $version\n';
 
     final deviceInfo = await DeviceInfo.instance.getUserDeviceInfo();
-    mutedMessage += "**DeviceName**: ${deviceInfo.machineName}\n";
-    mutedMessage += "**OSVersion**: ${deviceInfo.oSVersion}\n";
+    mutedMessage += '**DeviceName**: ${deviceInfo.machineName}\n';
+    mutedMessage += '**OSVersion**: ${deviceInfo.oSVersion}\n';
 
-    for (var mutedMsg in (mutedText ?? [])) {
-      mutedMessage += "$mutedMsg\n";
+    for (var mutedMsg in mutedText ?? []) {
+      mutedMessage += '$mutedMsg\n';
     }
 
     final submitMessage = "[MUTED]\n$mutedMessage[/MUTED]\n\n${message ?? ''}";
@@ -389,7 +395,7 @@ class CustomerSupportServiceImpl extends CustomerSupportService {
       'title': issueTitle,
       'message': submitMessage,
       'tags': tags,
-      'announcement_context_id': announcementID ?? "",
+      'announcement_context_id': announcementID ?? '',
     };
 
     return await _customerSupportApi.createIssue(payload);
@@ -426,14 +432,12 @@ class CustomerSupportServiceImpl extends CustomerSupportService {
   }
 
   @override
-  Future reopen(String issueID) async {
-    return _customerSupportApi.reOpenIssue(issueID);
-  }
+  Future reopen(String issueID) async =>
+      _customerSupportApi.reOpenIssue(issueID);
 
   @override
-  Future rateIssue(String issueID, int rating) async {
-    return _customerSupportApi.rateIssue(issueID, rating);
-  }
+  Future rateIssue(String issueID, int rating) async =>
+      _customerSupportApi.rateIssue(issueID, rating);
 
   @override
   Future<List<ChatThread>> getIssuesAndAnnouncement() async {
@@ -450,8 +454,9 @@ class CustomerSupportServiceImpl extends CustomerSupportService {
             return false;
           }));
     }
-    result.addAll(issues);
-    result.addAll(announcements);
+    result
+      ..addAll(issues)
+      ..addAll(announcements);
     numberOfIssuesInfo.value = [
       result.length,
       result
@@ -494,14 +499,14 @@ class CustomerSupportServiceImpl extends CustomerSupportService {
       if (await _announcementDao
               .getAnnouncement(announcement.announcementContextId) ==
           null) {
-        metricClient.addEvent(
+        unawaited(metricClient.addEvent(
           MixpanelEvent.receiveAnnouncement,
           data: {
-            "id": announcement.announcementContextId,
-            "type": announcement.type,
-            "title": announcement.title,
+            'id': announcement.announcementContextId,
+            'type': announcement.type,
+            'title': announcement.title,
           },
-        );
+        ));
       }
       await _announcementDao
           .insertAnnouncement(AnnouncementLocal.fromAnnouncement(announcement));
@@ -515,22 +520,22 @@ class CustomerSupportServiceImpl extends CustomerSupportService {
 
   @override
   Future<void> createAnnouncement(AnnouncementID type) async {
-    final body = {"announcement_context_id": type.value};
+    final body = {'announcement_context_id': type.value};
     await _announcementApi.callAnnouncement(body);
     await fetchAnnouncement();
     final announcement = await _announcementDao.getAnnouncement(type.value);
     if (announcement != null) {
       await getIssuesAndAnnouncement();
       showInfoNotification(
-          const Key("Announcement"), "au_has_announcement".tr(),
+          const Key('Announcement'), 'au_has_announcement'.tr(),
           addOnTextSpan: [
             TextSpan(
-                text: "tap_to_view".tr(),
+                text: 'tap_to_view'.tr(),
                 style: Theme.of(injector<NavigationService>()
                         .navigatorKey
                         .currentContext!)
                     .textTheme
-                    .ppMori400Green14),
+                    .ppMori400FFYellow14),
           ], openHandler: () {
         injector<NavigationService>().navigateTo(
           AppRouter.supportThreadPage,
@@ -557,7 +562,6 @@ class CustomerSupportServiceImpl extends CustomerSupportService {
   }
 
   @override
-  Future<AnnouncementLocal?> findAnnouncement(String announcementID) async {
-    return await _announcementDao.getAnnouncement(announcementID);
-  }
+  Future<AnnouncementLocal?> findAnnouncement(String announcementID) async =>
+      await _announcementDao.getAnnouncement(announcementID);
 }
diff --git a/lib/service/deeplink_service.dart b/lib/service/deeplink_service.dart
index 2ded9feba..35393442f 100644
--- a/lib/service/deeplink_service.dart
+++ b/lib/service/deeplink_service.dart
@@ -46,7 +46,7 @@ import 'package:uni_links/uni_links.dart';
 abstract class DeeplinkService {
   Future setup();
 
-  void handleDeeplink(String? link, {Duration delay});
+  void handleDeeplink(String? link, {Duration delay, Function? onFinished});
 
   void handleBranchDeeplinkData(Map<dynamic, dynamic> data);
 }
@@ -121,6 +121,7 @@ class DeeplinkServiceImpl extends DeeplinkService {
   void handleDeeplink(
     String? link, {
     Duration delay = const Duration(seconds: 2),
+    Function? onFinished,
   }) {
     // return for case when FeralFile pass empty deeplink to return Autonomy
     if (link == 'autonomy://') {
@@ -147,6 +148,7 @@ class DeeplinkServiceImpl extends DeeplinkService {
       _deepLinkHandlingMap.remove(link);
       handlingDeepLink = null;
       memoryValues.irlLink.value = null;
+      onFinished?.call();
     });
   }
 
@@ -214,21 +216,28 @@ class DeeplinkServiceImpl extends DeeplinkService {
       'https://autonomy.io/apps/wc/wc?uri=',
       'autonomy://wc?uri=',
       'autonomy-wc://wc?uri=',
+      'https://app.feralfile.com/apps/wc?uri=',
+      'https://app.feralfile.com/apps/wc/wc?uri=',
+      'feralfile://wc?uri=',
+      'feralfile-wc://wc?uri=',
     ];
 
     final tzPrefixes = [
       'https://au.bitmark.com/apps/tezos?uri=',
       'https://autonomy.io/apps/tezos?uri=',
+      'https://feralfile.com/apps/tezos?uri=',
     ];
 
     final wcDeeplinkPrefixes = [
       'wc:',
       'autonomy-wc:',
+      'feralfile-wc:',
     ];
 
     final tbDeeplinkPrefixes = [
       'tezos://',
       'autonomy-tezos://',
+      'feralfile-tezos://',
     ];
 
     final postcardPayToMintPrefixes = [
diff --git a/lib/service/feralfile_service.dart b/lib/service/feralfile_service.dart
index c1dd2377b..d99326bc0 100644
--- a/lib/service/feralfile_service.dart
+++ b/lib/service/feralfile_service.dart
@@ -8,6 +8,8 @@
 import 'package:autonomy_flutter/common/injector.dart';
 import 'package:autonomy_flutter/gateway/feralfile_api.dart';
 import 'package:autonomy_flutter/model/ff_account.dart';
+import 'package:autonomy_flutter/model/ff_exhibition.dart';
+import 'package:autonomy_flutter/model/ff_series.dart';
 import 'package:autonomy_flutter/model/otp.dart';
 import 'package:autonomy_flutter/screen/claim/claim_token_page.dart';
 import 'package:autonomy_flutter/service/account_service.dart';
@@ -41,6 +43,20 @@ abstract class FeralFileService {
   Future<String?> getPartnerFullName(String exhibitionId);
 
   Future<Exhibition> getExhibition(String id);
+
+  Future<List<ExhibitionDetail>> getAllExhibitions({
+    String sortBy = 'openAt',
+    String sortOrder = 'DESC',
+    int limit = 8,
+    int offset = 0,
+    bool withArtworks = false,
+  });
+
+  Future<Exhibition> getFeaturedExhibition();
+
+  Future<List<Artwork>> getExhibitionArtworks(String exhibitionId);
+
+  Future<List<Artwork>> getSeriesArtworks(String seriesId);
 }
 
 class FeralFileServiceImpl extends FeralFileService {
@@ -63,14 +79,13 @@ class FeralFileServiceImpl extends FeralFileService {
       final airdropSeries = await _feralFileApi.getSeries(airdropSeriesId);
       return airdropSeries.result;
     } else {
-      throw Exception("Not airdrop exhibition");
+      throw Exception('Not airdrop exhibition');
     }
   }
 
   @override
-  Future<FFSeries> getSeries(String id) async {
-    return (await _feralFileApi.getSeries(id)).result;
-  }
+  Future<FFSeries> getSeries(String id) async =>
+      (await _feralFileApi.getSeries(id)).result;
 
   @override
   Future<ClaimResponse?> claimToken(
@@ -78,7 +93,7 @@ class FeralFileServiceImpl extends FeralFileService {
       String? address,
       Otp? otp,
       Future<bool> Function(FFSeries)? onConfirm}) async {
-    log.info("[FeralFileService] Claim token - series: $seriesId");
+    log.info('[FeralFileService] Claim token - series: $seriesId');
     final series = await getSeries(seriesId);
 
     if (series.airdropInfo == null ||
@@ -89,7 +104,7 @@ class FeralFileServiceImpl extends FeralFileService {
     if ((series.airdropInfo?.remainAmount ?? 0) > 0) {
       final accepted = await onConfirm?.call(series) ?? true;
       if (!accepted) {
-        log.info("[FeralFileService] User refused claim token");
+        log.info('[FeralFileService] User refused claim token');
         return null;
       }
       final wallet = await _accountService.getDefaultAccount();
@@ -99,11 +114,11 @@ class FeralFileServiceImpl extends FeralFileService {
       final signature = await wallet.getAccountDIDSignature(message);
       final receiver = address ?? await wallet.getTezosAddress();
       Map<String, dynamic> body = {
-        "claimer": accountDID,
-        "timestamp": message,
-        "signature": signature,
-        "address": receiver,
-        if (otp != null) ...{"airdropTOTPPasscode": otp.code}
+        'claimer': accountDID,
+        'timestamp': message,
+        'signature': signature,
+        'address': receiver,
+        if (otp != null) ...{'airdropTOTPPasscode': otp.code}
       };
       final response = await _feralFileApi.claimSeries(series.id, body);
       final indexer = injector<TokensService>();
@@ -158,7 +173,7 @@ class FeralFileServiceImpl extends FeralFileService {
           .toList();
       return tokens;
     } catch (e) {
-      log.info("[FeralFileService] Fetch token failed ($indexerId) $e");
+      log.info('[FeralFileService] Fetch token failed ($indexerId) $e');
       return [];
     }
   }
@@ -180,4 +195,49 @@ class FeralFileServiceImpl extends FeralFileService {
     final artwork = await _feralFileApi.getArtworks(artworkID);
     return artwork.result.series?.exhibition;
   }
+
+  @override
+  Future<List<ExhibitionDetail>> getAllExhibitions({
+    String sortBy = 'openAt',
+    String sortOrder = 'DESC',
+    int limit = 8,
+    int offset = 0,
+    bool withArtworks = false,
+  }) async {
+    final exhibitions = await _feralFileApi.getAllExhibitions(
+        sortBy: sortBy, sortOrder: sortOrder, limit: limit, offset: offset);
+    final listExhibition = exhibitions.result;
+    final listExhibitionDetail =
+        listExhibition.map((e) => ExhibitionDetail(exhibition: e)).toList();
+    if (withArtworks) {
+      try {
+        await Future.wait(listExhibitionDetail.map((e) async {
+          final artworks = await getExhibitionArtworks(e.exhibition.id);
+          e.artworks = artworks;
+        }));
+      } catch (e) {
+        log.info('[FeralFileService] Get artworks failed $e');
+      }
+    }
+    return listExhibitionDetail;
+  }
+
+  @override
+  Future<Exhibition> getFeaturedExhibition() async {
+    final featuredExhibition = await _feralFileApi.getFeaturedExhibition();
+    return featuredExhibition.result;
+  }
+
+  @override
+  Future<List<Artwork>> getExhibitionArtworks(String exhibitionId) async {
+    final artworks =
+        await _feralFileApi.getListArtworks(exhibitionId: exhibitionId);
+    return artworks.result;
+  }
+
+  @override
+  Future<List<Artwork>> getSeriesArtworks(String seriesId) async {
+    final artworks = await _feralFileApi.getListArtworks(seriesId: seriesId);
+    return artworks.result;
+  }
 }
diff --git a/lib/service/navigation_service.dart b/lib/service/navigation_service.dart
index 3143b6515..67355fe04 100644
--- a/lib/service/navigation_service.dart
+++ b/lib/service/navigation_service.dart
@@ -8,7 +8,7 @@
 import 'dart:async';
 
 import 'package:autonomy_flutter/common/injector.dart';
-import 'package:autonomy_flutter/model/ff_account.dart';
+import 'package:autonomy_flutter/model/ff_series.dart';
 import 'package:autonomy_flutter/model/otp.dart';
 import 'package:autonomy_flutter/screen/app_router.dart';
 import 'package:autonomy_flutter/screen/claim/activation/claim_activation_page.dart';
@@ -16,11 +16,13 @@ import 'package:autonomy_flutter/screen/claim/claim_token_page.dart';
 import 'package:autonomy_flutter/screen/interactive_postcard/design_stamp.dart';
 import 'package:autonomy_flutter/screen/irl_screen/webview_irl_screen.dart';
 import 'package:autonomy_flutter/screen/send_receive_postcard/receive_postcard_page.dart';
+import 'package:autonomy_flutter/screen/settings/help_us/inapp_webview.dart';
 import 'package:autonomy_flutter/service/airdrop_service.dart';
 import 'package:autonomy_flutter/service/metric_client_service.dart';
 import 'package:autonomy_flutter/util/asset_token_ext.dart';
 import 'package:autonomy_flutter/util/constants.dart';
 import 'package:autonomy_flutter/util/error_handler.dart';
+import 'package:autonomy_flutter/util/feral_file_helper.dart';
 import 'package:autonomy_flutter/util/inapp_notifications.dart';
 import 'package:autonomy_flutter/util/log.dart';
 import 'package:autonomy_flutter/util/string_ext.dart';
@@ -440,4 +442,24 @@ class NavigationService {
       });
     }
   }
+
+  Future<void> openFeralFileArtistPage(String alias) async {
+    if (alias.contains(',') || alias.isEmpty) {
+      return;
+    }
+    final url = FeralFileHelper.getArtistUrl(alias);
+    await Navigator.of(navigatorKey.currentContext!).pushNamed(
+        AppRouter.inappWebviewPage,
+        arguments: InAppWebViewPayload(url));
+  }
+
+  Future<void> openFeralFileCuratorPage(String alias) async {
+    if (alias.contains(',') || alias.isEmpty) {
+      return;
+    }
+    final url = FeralFileHelper.getCuratorUrl(alias);
+    await Navigator.of(navigatorKey.currentContext!).pushNamed(
+        AppRouter.inappWebviewPage,
+        arguments: InAppWebViewPayload(url));
+  }
 }
diff --git a/lib/service/playlist_service.dart b/lib/service/playlist_service.dart
index 133c53114..7b92cbce9 100644
--- a/lib/service/playlist_service.dart
+++ b/lib/service/playlist_service.dart
@@ -1,39 +1,38 @@
 import 'package:autonomy_flutter/model/play_list_model.dart';
+import 'package:autonomy_flutter/service/account_service.dart';
 import 'package:autonomy_flutter/service/configuration_service.dart';
 import 'package:nft_collection/database/dao/dao.dart';
 
-import 'account_service.dart';
-
 abstract class PlaylistService {
   Future<List<PlayListModel>> getPlayList();
 
   Future<void> setPlayList(List<PlayListModel> playlists,
-      {bool override = false});
+      {bool override = false,
+      ConflictAction onConflict = ConflictAction.abort});
 
   Future<void> refreshPlayLists();
+
+  Future<List<PlayListModel>> defaultPlaylists();
 }
 
 class PlayListServiceImp implements PlaylistService {
   final ConfigurationService _configurationService;
   final TokenDao _tokenDao;
   final AccountService _accountService;
+  final AssetTokenDao _assetTokenDao;
 
-  PlayListServiceImp(
-      this._configurationService, this._tokenDao, this._accountService);
+  PlayListServiceImp(this._configurationService, this._tokenDao,
+      this._accountService, this._assetTokenDao);
 
   @override
   Future<List<PlayListModel>> getPlayList() async {
     final playlists = _getRawPlayList();
+
     if (playlists.isEmpty) {
       return [];
     }
 
-    final hiddenTokens = _configurationService.getTempStorageHiddenTokenIDs();
-    final recentlySent = _configurationService.getRecentlySentToken();
-    hiddenTokens.addAll(recentlySent
-        .where((element) => element.isSentAll)
-        .map((e) => e.tokenID)
-        .toList());
+    final hiddenTokens = _configurationService.getHiddenOrSentTokenIDs();
     final hiddenAddresses = await _accountService.getHiddenAddressIndexes();
     final tokens = await _tokenDao
         .findTokenIDsByOwners(hiddenAddresses.map((e) => e.address).toList());
@@ -48,14 +47,16 @@ class PlayListServiceImp implements PlaylistService {
     return playlists;
   }
 
-  List<PlayListModel> _getRawPlayList() {
-    return _configurationService.getPlayList();
-  }
+  List<PlayListModel> _getRawPlayList() => _configurationService.getPlayList();
 
   @override
-  Future<void> setPlayList(List<PlayListModel> playlists,
-      {bool override = false}) async {
-    _configurationService.setPlayList(playlists, override: override);
+  Future<void> setPlayList(
+    List<PlayListModel> playlists, {
+    bool override = false,
+    ConflictAction onConflict = ConflictAction.abort,
+  }) async {
+    await _configurationService.setPlayList(playlists,
+        override: override, onConflict: onConflict);
     return;
   }
 
@@ -66,11 +67,33 @@ class PlayListServiceImp implements PlaylistService {
     final playlists = _getRawPlayList();
     for (int i = 0; i < playlists.length; i++) {
       playlists[i].tokenIDs?.removeWhere((tokenID) => !ids.contains(tokenID));
-      if ((playlists[i].tokenIDs?.isEmpty ?? true) == true) {
+      if (playlists[i].tokenIDs?.isEmpty ?? true) {
         playlists.removeAt(i);
         i--;
       }
     }
-    setPlayList(playlists, override: true);
+    await setPlayList(playlists, override: true);
+  }
+
+  @override
+  Future<List<PlayListModel>> defaultPlaylists() async {
+    List<PlayListModel> defaultPlaylists = [];
+    final activeAddress = await _accountService.getShowedAddresses();
+    List<String> allTokenIds =
+        await _tokenDao.findTokenIDsOwnersOwn(activeAddress);
+    final hiddenTokenIds = _configurationService.getHiddenOrSentTokenIDs();
+    allTokenIds.removeWhere((element) => hiddenTokenIds.contains(element));
+    if (allTokenIds.isNotEmpty) {
+      final token = await _assetTokenDao
+          .findAllAssetTokensByTokenIDs([allTokenIds.first]);
+
+      final allNftsPlaylist = PlayListModel(
+          id: DefaultPlaylistModel.allNfts.id,
+          name: DefaultPlaylistModel.allNfts.name,
+          tokenIDs: allTokenIds,
+          thumbnailURL: token.first.thumbnailURL);
+      defaultPlaylists.add(allNftsPlaylist);
+    }
+    return defaultPlaylists;
   }
 }
diff --git a/lib/util/asset_token_ext.dart b/lib/util/asset_token_ext.dart
index c05a997d2..a90911371 100644
--- a/lib/util/asset_token_ext.dart
+++ b/lib/util/asset_token_ext.dart
@@ -5,8 +5,9 @@ import 'dart:ui';
 import 'package:autonomy_flutter/common/environment.dart';
 import 'package:autonomy_flutter/common/injector.dart';
 import 'package:autonomy_flutter/database/cloud_database.dart';
-import 'package:autonomy_flutter/model/ff_account.dart';
+import 'package:autonomy_flutter/model/ff_series.dart';
 import 'package:autonomy_flutter/model/pair.dart';
+import 'package:autonomy_flutter/model/play_list_model.dart';
 import 'package:autonomy_flutter/model/postcard_metadata.dart';
 import 'package:autonomy_flutter/model/prompt.dart';
 import 'package:autonomy_flutter/model/shared_postcard.dart';
@@ -777,3 +778,31 @@ extension PostcardExtension on AssetToken {
     return isEnable;
   }
 }
+
+extension CompactedAssetTokenExt on List<CompactedAssetToken> {
+  List<PlayListModel> getPlaylistByFilter(
+      String Function(CompactedAssetToken) filter) {
+    final groups = groupBy<CompactedAssetToken, String>(
+      this,
+      filter,
+    );
+    List<PlayListModel> playlists = [];
+    groups.forEach((key, value) {
+      PlayListModel playListModel = PlayListModel(
+        name: key,
+        tokenIDs: value.map((e) => e.tokenId).whereNotNull().toList(),
+        thumbnailURL: value.first.thumbnailURL,
+      );
+      playlists.add(playListModel);
+    });
+    return playlists;
+  }
+
+  List<PlayListModel> getPlaylistByArtists() =>
+      getPlaylistByFilter((e) => e.artistID ?? 'Unknown');
+
+  List<PlayListModel> getPlaylistByMedium() =>
+      getPlaylistByFilter((e) => e.mimeType ?? 'Unknown');
+}
+
+typedef PlaylistModelType = PlayListModel;
diff --git a/lib/util/collection_ext.dart b/lib/util/collection_ext.dart
new file mode 100644
index 000000000..8cfb9bd32
--- /dev/null
+++ b/lib/util/collection_ext.dart
@@ -0,0 +1,13 @@
+import 'package:autonomy_flutter/model/play_list_model.dart';
+
+extension ListCollectionExt on List<PlayListModel> {
+  List<PlayListModel> filter(String? filter) {
+    if (filter == null || filter.isEmpty) {
+      return this;
+    }
+    final lowerFilter = filter.toLowerCase();
+    return where(
+            (element) => element.getName().toLowerCase().contains(lowerFilter))
+        .toList();
+  }
+}
diff --git a/lib/util/constants.dart b/lib/util/constants.dart
index 49c05f96d..95db7a249 100644
--- a/lib/util/constants.dart
+++ b/lib/util/constants.dart
@@ -42,6 +42,10 @@ const DEEP_LINKS = [
   'https://autonomy-app.app.link',
   'https://autonomy-app-alternate.app.link',
   'https://link.autonomy.io',
+  'feralfile://',
+  'https://feralfile-app.app.link',
+  'https://feralfile-app-alternate.app.link',
+  'https://app.feralfile.com',
 ];
 const FF_ARTIST_COLLECTOR =
     'https://feralfile.com/docs/artist-collector-rights';
@@ -300,17 +304,17 @@ class ReportIssueType {
   static String introMessage(String item) {
     switch (item) {
       case Feature:
-        return 'Thanks for taking the time to help us improve Autonomy. We’re always looking for great ideas. What feature would you like to request?';
+        return 'Thanks for taking the time to help us improve Feral File. We’re always looking for great ideas. What feature would you like to request?';
       case Bug:
-        return 'We’re sorry to hear you’ve experienced a problem using Autonomy. Thanks for taking the time to help us improve. Please describe the bug for us.';
+        return 'We’re sorry to hear you’ve experienced a problem using Feral File. Thanks for taking the time to help us improve. Please describe the bug for us.';
       case Feedback:
         return 'Thanks for taking the time to share your feedback with us. What’s on your mind?';
       case Exception:
-        return 'Thanks for taking the time to help improve Autonomy. We’ve received your automatic crash report and are looking into it. How else can we help?';
+        return 'Thanks for taking the time to help improve Feral File. We’ve received your automatic crash report and are looking into it. How else can we help?';
       case ReportNFTIssue:
-        return 'Thanks for taking the time to help improve Autonomy. We’ve received your NFT issue and are looking into it. How else can we help?';
+        return 'Thanks for taking the time to help improve Feral File. We’ve received your NFT issue and are looking into it. How else can we help?';
       default:
-        return 'Thanks for reaching out to the Autonomy team! What’s on your mind?';
+        return 'Thanks for reaching out to the Feral File team! What’s on your mind?';
     }
   }
 }
@@ -335,7 +339,7 @@ extension PremiumFeatureExtension on PremiumFeature {
   String get moreAutonomyDescription {
     switch (rawValue) {
       case 'AutonomyTV':
-        return 'You must upgrade to an Autonomy subscription to connect to Autonomy on TV.';
+        return 'You must upgrade to an Feral File subscription to connect to Feral File on TV.';
       default:
         return '';
     }
diff --git a/lib/util/exhibition_ext.dart b/lib/util/exhibition_ext.dart
new file mode 100644
index 000000000..ab00b992f
--- /dev/null
+++ b/lib/util/exhibition_ext.dart
@@ -0,0 +1,64 @@
+import 'package:autonomy_flutter/common/environment.dart';
+import 'package:autonomy_flutter/model/ff_account.dart';
+import 'package:autonomy_flutter/model/ff_exhibition.dart';
+import 'package:autonomy_flutter/util/string_ext.dart';
+import 'package:collection/collection.dart';
+
+extension ExhibitionExt on Exhibition {
+  String get coverUrl => '${Environment.feralFileAssetURL}/$coverURI';
+
+  bool get isGroupExhibition => type == 'group';
+
+  //TODO: implement this
+  bool get isFreeToStream => true;
+
+  //TODO: implement this
+  bool get isOnGoing => true;
+}
+
+extension ListExhibitionDetailExt on List<ExhibitionDetail> {
+  List<Exhibition> get exhibitions => map((e) => e.exhibition).toList();
+}
+
+extension ExhibitionDetailExt on ExhibitionDetail {
+  List<String> get seriesIds =>
+      artworks?.map((e) => e.seriesID).toSet().toList() ?? [];
+
+  Artwork representArtwork(String seriesId) => artworks!.firstWhere(
+      (e) => e.seriesID == seriesId && getArtworkTokenId(e) != null);
+
+  List<Artwork> get representArtworks =>
+      seriesIds.map((e) => representArtwork(e)).toList();
+
+  String? getArtworkTokenId(Artwork artwork) {
+    if (artwork.swap != null) {
+      if (artwork.swap!.token == null) {
+        return null;
+      }
+      final chain = artwork.swap!.blockchainType == 'ethereum' ? 'eth' : 'tez';
+      final contract = artwork.swap!.contractAddress;
+      final id = chain == 'eth'
+          ? artwork.swap!.token!.hexToDecimal
+          : artwork.swap!.token;
+      return '$chain-$contract-$id';
+    } else {
+      final chain = exhibition.mintBlockchain == 'ethereum' ? 'eth' : 'tez';
+      final contract = exhibition.contracts!.firstWhereOrNull(
+          (e) => e.blockchainType == exhibition.mintBlockchain);
+      final contractAddress = contract?.address;
+      if (contractAddress == null) {
+        return null;
+      }
+      final id = artwork.id;
+      return '$chain-$contractAddress-$id';
+    }
+  }
+}
+
+// Artwork Ext
+extension ArtworkExt on Artwork {
+  String get thumbnailURL => '${Environment.feralFileAssetURL}/$thumbnailURI';
+}
+
+String? getFFUrl(String? uri) =>
+    uri != null ? '${Environment.feralFileAssetURL}/$uri' : null;
diff --git a/lib/util/feral_file_helper.dart b/lib/util/feral_file_helper.dart
new file mode 100644
index 000000000..6b282eb1f
--- /dev/null
+++ b/lib/util/feral_file_helper.dart
@@ -0,0 +1,9 @@
+import 'package:autonomy_flutter/common/environment.dart';
+
+class FeralFileHelper {
+  static final String _baseUrl = Environment.feralFileAPIURL;
+
+  static String getArtistUrl(String alias) => '$_baseUrl/artists/$alias';
+
+  static String getCuratorUrl(String alias) => '$_baseUrl/curators/$alias';
+}
diff --git a/lib/util/feralfile_extension.dart b/lib/util/feralfile_extension.dart
index e249779dc..09b13795c 100644
--- a/lib/util/feralfile_extension.dart
+++ b/lib/util/feralfile_extension.dart
@@ -1,51 +1,52 @@
 import 'package:autonomy_flutter/common/environment.dart';
 import 'package:autonomy_flutter/model/ff_account.dart';
+import 'package:autonomy_flutter/model/ff_series.dart';
+import 'package:autonomy_flutter/model/ff_user.dart';
 import 'package:easy_localization/easy_localization.dart';
 
 extension FeralfileErrorExt on FeralfileError {
   String get dialogTitle {
     switch (code) {
       case 5006:
-        return "Too soon";
+        return 'Too soon';
       case 3007:
-        return "Too late";
+        return 'Too late';
       case 3009:
-        return "Out of token";
+        return 'Out of token';
       case 3010:
-        return "Just once";
+        return 'Just once';
       case 3013:
       case 3014:
-        return "One more time";
+        return 'One more time';
       default:
-        return "error".tr();
+        return 'error'.tr();
     }
   }
 
   String get dialogMessage {
     switch (code) {
       case 5006:
-        return "It is not yet possible to redeem this gift edition.";
+        return 'It is not yet possible to redeem this gift edition.';
       case 3007:
-        return "It is no longer possible to redeem this gift edition.";
+        return 'It is no longer possible to redeem this gift edition.';
       case 3009:
-        return "Sorry, the tokens have been delivered to all fastest users.";
+        return 'Sorry, the tokens have been delivered to all fastest users.';
       case 3010:
-        return "You have already accepted your gift edition.";
+        return 'You have already accepted your gift edition.';
       case 3013:
       case 3014:
-        return "The validity of the QR code has expired. Please scan the QR code again.";
+        return 'The validity of the QR code has expired. '
+            'Please scan the QR code again.';
       default:
         return message;
     }
   }
 
-  String getDialogTitle() {
-    return dialogTitle;
-  }
+  String getDialogTitle() => dialogTitle;
 
   String getDialogMessage({FFSeries? series}) {
     if (code == 3009 && (series?.maxEdition ?? 0) < 0) {
-      return "We are running out of tokens. Come back later.";
+      return 'We are running out of tokens. Come back later.';
     } else {
       return dialogMessage;
     }
@@ -54,20 +55,20 @@ extension FeralfileErrorExt on FeralfileError {
 
 extension FFContractExt on FFContract {
   String? getBlockChainUrl() {
-    final network = Environment.appTestnetConfig ? "TESTNET" : "MAINNET";
+    final network = Environment.appTestnetConfig ? 'TESTNET' : 'MAINNET';
     String? url;
-    switch ("${network}_$blockchainType") {
-      case "MAINNET_ethereum":
-        url = "https://etherscan.io/address/$address";
+    switch ('${network}_$blockchainType') {
+      case 'MAINNET_ethereum':
+        url = 'https://etherscan.io/address/$address';
         break;
 
-      case "TESTNET_ethereum":
-        url = "https://goerli.etherscan.io/address/$address}";
+      case 'TESTNET_ethereum':
+        url = 'https://goerli.etherscan.io/address/$address}';
         break;
 
-      case "MAINNET_tezos":
-      case "TESTNET_tezos":
-        url = "https://tzkt.io/$address";
+      case 'MAINNET_tezos':
+      case 'TESTNET_tezos':
+        url = 'https://tzkt.io/$address';
         break;
     }
     return url;
@@ -75,14 +76,12 @@ extension FFContractExt on FFContract {
 }
 
 extension FFArtistExt on FFArtist {
-  String getDisplayName() {
-    return (fullName?.isNotEmpty == true) ? fullName! : alias;
-  }
+  String getDisplayName() => (fullName?.isNotEmpty == true) ? fullName! : alias;
 }
 
 extension AirdropInfoExt on AirdropInfo {
   String getTokenIndexerId(String tokenId) {
-    final prefix = blockchain.toLowerCase() == "tezos" ? "tez" : "eth";
-    return "$prefix-$contractAddress-$tokenId";
+    final prefix = blockchain.toLowerCase() == 'tezos' ? 'tez' : 'eth';
+    return '$prefix-$contractAddress-$tokenId';
   }
 }
diff --git a/lib/util/inapp_notifications.dart b/lib/util/inapp_notifications.dart
index c3e915ad2..7ad3fd4a0 100644
--- a/lib/util/inapp_notifications.dart
+++ b/lib/util/inapp_notifications.dart
@@ -17,38 +17,36 @@ import 'package:overlay_support/overlay_support.dart';
 import 'package:overlay_support/src/overlay_state_finder.dart';
 
 Widget _notificationToast(BuildContext context, OSNotification notification,
-    {Function(OSNotification notification)? notificationOpenedHandler}) {
-  return _SimpleNotificationToast(
-    notification: notification.body ?? "",
-    key: Key(notification.notificationId),
-    notificationOpenedHandler: () {
-      if (notificationOpenedHandler != null) {
-        notificationOpenedHandler(notification);
-      }
-    },
-    addOnTextSpan: [
-      TextSpan(
-        text: ' ${'tap_to_view'.tr()}',
-        style: Theme.of(context).textTheme.ppMori400Green14,
-      )
-    ],
-  );
-}
+        {Function(OSNotification notification)? notificationOpenedHandler}) =>
+    _SimpleNotificationToast(
+      notification: notification.body ?? '',
+      key: Key(notification.notificationId),
+      notificationOpenedHandler: () {
+        if (notificationOpenedHandler != null) {
+          notificationOpenedHandler(notification);
+        }
+      },
+      addOnTextSpan: [
+        TextSpan(
+          text: ' ${'tap_to_view'.tr()}',
+          style: Theme.of(context).textTheme.ppMori400FFYellow14,
+        )
+      ],
+    );
 
 Widget _inAppNotificationToast(BuildContext context, String body, String key,
-    {Function()? notificationOpenedHandler}) {
-  return _SimpleNotificationToast(
-    notification: body,
-    key: Key(key),
-    notificationOpenedHandler: notificationOpenedHandler,
-    addOnTextSpan: [
-      TextSpan(
-        text: ' ${'tap_to_view'.tr()}',
-        style: Theme.of(context).textTheme.ppMori400Green14,
-      )
-    ],
-  );
-}
+        {Function()? notificationOpenedHandler}) =>
+    _SimpleNotificationToast(
+      notification: body,
+      key: Key(key),
+      notificationOpenedHandler: notificationOpenedHandler,
+      addOnTextSpan: [
+        TextSpan(
+          text: ' ${'tap_to_view'.tr()}',
+          style: Theme.of(context).textTheme.ppMori400FFYellow14,
+        )
+      ],
+    );
 
 class _SimpleNotificationToast extends StatelessWidget {
   const _SimpleNotificationToast({
@@ -196,7 +194,7 @@ void showNotifications(BuildContext context, OSNotification notification,
 void showInAppNotifications(BuildContext context, String body, String key,
     {Function()? notificationOpenedHandler}) {
   showSimpleNotification(
-    _inAppNotificationToast(context, body, "",
+    _inAppNotificationToast(context, body, '',
         notificationOpenedHandler: notificationOpenedHandler),
     background: Colors.transparent,
     duration: const Duration(seconds: 3),
@@ -277,7 +275,7 @@ void showCustomNotifications(BuildContext context, String notification, Key key,
 void hideOverlay(Key key) {
   final OverlaySupportState? overlaySupport = findOverlayState();
   if (overlaySupport == null) {
-    log.warning("Cannot find overlay key: $key");
+    log.warning('Cannot find overlay key: $key');
     return;
   }
 
diff --git a/lib/util/medium_category_ext.dart b/lib/util/medium_category_ext.dart
new file mode 100644
index 000000000..0b598a207
--- /dev/null
+++ b/lib/util/medium_category_ext.dart
@@ -0,0 +1,73 @@
+import 'package:collection/collection.dart';
+import 'package:easy_localization/easy_localization.dart';
+import 'package:nft_collection/utils/medium_category.dart';
+
+extension MediumCategoryExt on MediumCategory {
+  static String getName(String medium) {
+    switch (medium) {
+      case MediumCategory.image:
+        return 'still'.tr();
+      case MediumCategory.video:
+        return 'video'.tr();
+      case MediumCategory.model:
+        return '3d'.tr();
+      case MediumCategory.webView:
+        return 'interactive'.tr();
+      default:
+        return 'other'.tr();
+    }
+  }
+
+  static String icon(String medium) {
+    switch (medium) {
+      case MediumCategory.image:
+        return 'assets/images/medium_image.svg';
+      case MediumCategory.video:
+        return 'assets/images/medium_video.svg';
+      case MediumCategory.model:
+        return 'assets/images/medium_3d.svg';
+      case MediumCategory.webView:
+        return 'assets/images/medium_software.svg';
+      default:
+        return 'assets/images/medium_other.svg';
+    }
+  }
+
+  static List<String> getAllCategories() => [
+        MediumCategory.image,
+        MediumCategory.video,
+        MediumCategory.model,
+        MediumCategory.webView,
+      ];
+
+  static List<String> getAllMimeType() => getAllCategories()
+      .map((e) => MediumCategory.mineTypes(e))
+      .flattened
+      .toList();
+
+  static List<String> getAllMediums() =>
+      getAllCategories().map((e) => mediums(e)).flattened.toList();
+
+  static List<String> mediums(String category) {
+    switch (category) {
+      case MediumCategory.image:
+        return [
+          'image',
+          'gif',
+        ];
+      case MediumCategory.video:
+        return [
+          'video',
+        ];
+      case MediumCategory.model:
+        return [
+          'model',
+        ];
+      case MediumCategory.webView:
+        return [
+          'software',
+        ];
+    }
+    return [];
+  }
+}
diff --git a/lib/util/play_control.dart b/lib/util/play_control.dart
index 253c23a34..39f953c40 100644
--- a/lib/util/play_control.dart
+++ b/lib/util/play_control.dart
@@ -123,7 +123,7 @@ class PlaylistControl extends StatelessWidget {
               ),
               Padding(
                 padding: const EdgeInsets.all(8.0),
-                child: CastButton(
+                child: FFCastButton(
                   onCastTap: () => {onCastTap?.call()},
                   isCasting: isCasting,
                 ),
diff --git a/lib/util/predefined_collection_ext.dart b/lib/util/predefined_collection_ext.dart
new file mode 100644
index 000000000..6629dc94b
--- /dev/null
+++ b/lib/util/predefined_collection_ext.dart
@@ -0,0 +1,18 @@
+import 'package:nft_collection/models/asset_token.dart';
+import 'package:nft_collection/models/predefined_collection_model.dart';
+
+extension PredefinedCollectionModelListExt on List<PredefinedCollectionModel> {
+  List<PredefinedCollectionModel> filterByName(String name) =>
+      where((element) => element.name?.contains(name) ?? false).toList();
+}
+
+extension PredefinedCollectionModelExt on PredefinedCollectionModel {
+  CompactedAssetToken get compactedAssetToken => CompactedAssetToken(
+        id: id,
+        balance: 1,
+        owner: '',
+        lastActivityTime: DateTime.now(),
+        lastRefreshedTime: DateTime.now(),
+        galleryThumbnailURL: thumbnailURL,
+      );
+}
diff --git a/lib/util/string_ext.dart b/lib/util/string_ext.dart
index 519361904..dc32892b1 100644
--- a/lib/util/string_ext.dart
+++ b/lib/util/string_ext.dart
@@ -10,17 +10,14 @@ import 'package:autonomy_flutter/util/constants.dart';
 import 'package:nft_rendering/nft_rendering.dart';
 
 extension StringExtension on String {
-  String capitalize() {
-    return "${this[0].toUpperCase()}${substring(1).toLowerCase()}";
-  }
+  String capitalize() =>
+      '${this[0].toUpperCase()}${substring(1).toLowerCase()}';
 
-  String snakeToCapital() {
-    return replaceAll("_", " ").capitalize();
-  }
+  String snakeToCapital() => replaceAll('_', ' ').capitalize();
 
   String mask(int number) {
     if (isEmpty) {
-      return "[]";
+      return '[]';
     } else if (length <= number) {
       return this;
     }
@@ -29,29 +26,31 @@ extension StringExtension on String {
 
   String maskOnly(int number) {
     if (isEmpty) {
-      return "";
+      return '';
     } else if (length <= number) {
       return this;
     }
-    return "${substring(0, number)}...${substring(length - number, length)}";
+    return '${substring(0, number)}...${substring(length - number, length)}';
   }
 
   String maskIfNeeded() {
-    if (contains(' ')) return this;
+    if (contains(' ')) {
+      return this;
+    }
     return (length >= 36) ? mask(4) : this;
   }
 
   String? toIdentityOrMask(Map<String, String>? identityMap) {
-    if (isEmpty) return null;
+    if (isEmpty) {
+      return null;
+    }
     final identity = identityMap?[this];
     return (identity != null && identity.isNotEmpty)
         ? identity
         : maskIfNeeded();
   }
 
-  bool isValidUrl() {
-    return Uri.tryParse(this) != null;
-  }
+  bool isValidUrl() => Uri.tryParse(this) != null;
 
   String replacePrefix(String from, String to) {
     if (startsWith(from)) {
@@ -61,8 +60,8 @@ extension StringExtension on String {
   }
 
   String toUrl() {
-    if (!startsWith("https://") && !startsWith("http://")) {
-      return "https://$this";
+    if (!startsWith('https://') && !startsWith('http://')) {
+      return 'https://$this';
     }
 
     return this;
@@ -71,9 +70,9 @@ extension StringExtension on String {
   String? get blockchainForAddress {
     switch (length) {
       case 42:
-        return "ethereum";
+        return 'ethereum';
       case 36:
-        return "tezos";
+        return 'tezos';
       default:
         return null;
     }
@@ -85,68 +84,68 @@ extension StringExtension on String {
         splitted[1] == Environment.postcardContractAddress;
   }
 
-  bool get isAutonomyDocumentLink {
-    return (startsWith(AUTONOMY_DOCUMENT_PREFIX) ||
-            startsWith(AUTONOMY_RAW_DOCUMENT_PREFIX)) &&
-        endsWith(MARKDOWN_EXT);
-  }
+  bool get isAutonomyDocumentLink =>
+      (startsWith(AUTONOMY_DOCUMENT_PREFIX) ||
+          startsWith(AUTONOMY_RAW_DOCUMENT_PREFIX)) &&
+      endsWith(MARKDOWN_EXT);
 
-  String get autonomyRawDocumentLink {
-    return replaceFirst(AUTONOMY_DOCUMENT_PREFIX, AUTONOMY_RAW_DOCUMENT_PREFIX)
-        .replaceFirst("/blob/", "/");
-  }
+  String get autonomyRawDocumentLink =>
+      replaceFirst(AUTONOMY_DOCUMENT_PREFIX, AUTONOMY_RAW_DOCUMENT_PREFIX)
+          .replaceFirst('/blob/', '/');
 
   String get toMimeType {
     final mimeType = this;
     switch (mimeType) {
-      case "image/avif":
-      case "image/bmp":
-      case "image/jpeg":
-      case "image/jpg":
-      case "image/png":
-      case "image/tiff":
+      case 'image/avif':
+      case 'image/bmp':
+      case 'image/jpeg':
+      case 'image/jpg':
+      case 'image/png':
+      case 'image/tiff':
         return RenderingType.image;
 
-      case "image/svg+xml":
+      case 'image/svg+xml':
         return RenderingType.svg;
 
-      case "image/gif":
+      case 'image/gif':
         return RenderingType.gif;
 
-      case "audio/aac":
-      case "audio/midi":
-      case "audio/x-midi":
-      case "audio/mpeg":
-      case "audio/ogg":
-      case "audio/opus":
-      case "audio/wav":
-      case "audio/webm":
-      case "audio/3gpp":
-      case "audio/vnd.wave":
+      case 'audio/aac':
+      case 'audio/midi':
+      case 'audio/x-midi':
+      case 'audio/mpeg':
+      case 'audio/ogg':
+      case 'audio/opus':
+      case 'audio/wav':
+      case 'audio/webm':
+      case 'audio/3gpp':
+      case 'audio/vnd.wave':
         return RenderingType.audio;
 
-      case "video/x-msvideo":
-      case "video/3gpp":
-      case "video/mp4":
-      case "video/mpeg":
-      case "video/ogg":
-      case "video/3gpp2":
-      case "video/quicktime":
-      case "application/x-mpegURL":
-      case "video/x-flv":
-      case "video/MP2T":
-      case "video/webm":
-      case "application/octet-stream":
+      case 'video/x-msvideo':
+      case 'video/3gpp':
+      case 'video/mp4':
+      case 'video/mpeg':
+      case 'video/ogg':
+      case 'video/3gpp2':
+      case 'video/quicktime':
+      case 'application/x-mpegURL':
+      case 'video/x-flv':
+      case 'video/MP2T':
+      case 'video/webm':
+      case 'application/octet-stream':
         return RenderingType.video;
 
-      case "application/pdf":
+      case 'application/pdf':
         return RenderingType.pdf;
 
-      case "model/gltf-binary":
+      case 'model/gltf-binary':
         return RenderingType.modelViewer;
 
       default:
         return mimeType;
     }
   }
+
+  String get hexToDecimal => BigInt.parse(this, radix: 16).toString();
 }
diff --git a/lib/util/style.dart b/lib/util/style.dart
index 166970026..38bbc0a6b 100644
--- a/lib/util/style.dart
+++ b/lib/util/style.dart
@@ -40,7 +40,7 @@ MarkdownStyleSheet markDownStyle(BuildContext context, Color textColor) {
   final bodyText2 = theme.textTheme.ppMori400Black16.copyWith(color: textColor);
   return MarkdownStyleSheet(
     a: TextStyle(
-      fontFamily: AppTheme.atlasGrotesk,
+      fontFamily: AppTheme.ppMori,
       color: Colors.transparent,
       fontWeight: FontWeight.w500,
       shadows: [Shadow(color: textColor, offset: const Offset(0, -1))],
@@ -179,9 +179,9 @@ MarkdownStyleSheet markDownAnnouncementStyle(BuildContext context) {
   final theme = Theme.of(context);
   final bodyText2 = theme.textTheme.ppMori400White12;
   return MarkdownStyleSheet(
-    a: TextStyle(
+    a: const TextStyle(
       fontFamily: AppTheme.ppMori,
-      color: theme.auSuperTeal,
+      color: AppColor.feralFileHighlight,
       fontWeight: FontWeight.w400,
       fontSize: 14,
     ),
@@ -364,7 +364,7 @@ MarkdownStyleSheet markDownChangeLogStyle(BuildContext context) {
     blockquotePadding: const EdgeInsets.only(left: 20),
     blockquoteDecoration: const BoxDecoration(
       border: Border(
-        left: BorderSide(width: 2, color: AppColor.auSuperTeal),
+        left: BorderSide(width: 2, color: AppColor.feralFileHighlight),
       ),
     ),
     codeblockPadding: const EdgeInsets.all(8),
@@ -373,7 +373,7 @@ MarkdownStyleSheet markDownChangeLogStyle(BuildContext context) {
       borderRadius: BorderRadius.circular(2),
     ),
     horizontalRuleDecoration: CustomBoxDecoration(
-      color: AppColor.auSuperTeal,
+      color: AppColor.feralFileHighlight,
     ),
   );
 }
@@ -485,12 +485,12 @@ Divider addDivider({double height = 32, Color? color}) => Divider(
 Divider headDivider() => const Divider(
       height: 30,
       thickness: 3,
-      color: AppColor.auSuperTeal,
+      color: AppColor.feralFileHighlight,
     );
 
-Divider addOnlyDivider({Color? color}) => Divider(
+Divider addOnlyDivider({Color? color, double border = 1.0}) => Divider(
       height: 1,
-      thickness: 1,
+      thickness: border,
       color: color,
     );
 
@@ -606,7 +606,7 @@ class MomaPallet {
 
 Map<String, String>? auHtmlStyle(dom.Element element) {
   if (element.localName == 'a') {
-    const linkColor = AppColor.auSuperTeal;
+    const linkColor = AppColor.feralFileHighlight;
     // convert linkColor to hex string
     String hexColor =
         "#${(linkColor.value & 0xFFFFFF).toRadixString(16).padLeft(6, '0')}";
diff --git a/lib/util/token_ext.dart b/lib/util/token_ext.dart
index a0a44714a..929b02c3f 100644
--- a/lib/util/token_ext.dart
+++ b/lib/util/token_ext.dart
@@ -23,4 +23,8 @@ extension AssetTokenExtension on List<CompactedAssetToken> {
                   timestamp: expiredTime),
         )).toList();
   }
+
+  List<CompactedAssetToken> filterByTitleContain(String title) =>
+      where((element) =>
+          element.title!.toLowerCase().contains(title.toLowerCase())).toList();
 }
diff --git a/lib/util/ui_helper.dart b/lib/util/ui_helper.dart
index da1b38570..dcb9fd62d 100644
--- a/lib/util/ui_helper.dart
+++ b/lib/util/ui_helper.dart
@@ -15,6 +15,7 @@ import 'package:autonomy_flutter/common/injector.dart';
 import 'package:autonomy_flutter/database/entity/connection.dart';
 import 'package:autonomy_flutter/model/connection_request_args.dart';
 import 'package:autonomy_flutter/model/ff_account.dart';
+import 'package:autonomy_flutter/model/ff_series.dart';
 import 'package:autonomy_flutter/screen/app_router.dart';
 import 'package:autonomy_flutter/service/configuration_service.dart';
 import 'package:autonomy_flutter/service/iap_service.dart';
@@ -64,8 +65,8 @@ Future<void> doneOnboarding(BuildContext context) async {
   await injector<ConfigurationService>().setDoneOnboarding(true);
   unawaited(
       injector<MetricClientService>().mixPanelClient.initIfDefaultAccount());
-  unawaited(injector<NavigationService>()
-      .navigateUntil(AppRouter.homePage, (route) => false));
+  await injector<NavigationService>()
+      .navigateUntil(AppRouter.homePage, (route) => false);
 }
 
 void nameContinue(BuildContext context) {
@@ -683,7 +684,7 @@ class UIHelper {
           ),
         );
 
-    UIHelper.showDialog(
+    await UIHelper.showDialog(
       context,
       'Options',
       ListView.separated(
@@ -780,8 +781,8 @@ class UIHelper {
       BuildContext context, String? artworkId) async {
     final theme = Theme.of(context);
     final error = FeralfileError(5006, '');
-    metricClient.addEvent(MixpanelEvent.acceptOwnershipFail,
-        data: {'message': error.dialogMessage, 'id': artworkId});
+    unawaited(metricClient.addEvent(MixpanelEvent.acceptOwnershipFail,
+        data: {'message': error.dialogMessage, 'id': artworkId}));
     return UIHelper.showDialog(
       context,
       error.dialogTitle,
@@ -811,8 +812,8 @@ class UIHelper {
       BuildContext context, String? artworkId) async {
     final theme = Theme.of(context);
     final error = FeralfileError(3007, '');
-    metricClient.addEvent(MixpanelEvent.acceptOwnershipFail,
-        data: {'message': error.dialogMessage, 'id': artworkId});
+    unawaited(metricClient.addEvent(MixpanelEvent.acceptOwnershipFail,
+        data: {'message': error.dialogMessage, 'id': artworkId}));
     return UIHelper.showDialog(
       context,
       error.dialogTitle,
@@ -843,8 +844,8 @@ class UIHelper {
     required FFSeries series,
   }) async {
     final error = FeralfileError(3009, '');
-    metricClient.addEvent(MixpanelEvent.acceptOwnershipFail,
-        data: {'message': error.dialogMessage, 'id': series.id});
+    unawaited(metricClient.addEvent(MixpanelEvent.acceptOwnershipFail,
+        data: {'message': error.dialogMessage, 'id': series.id}));
     return showErrorDialog(
       context,
       error.getDialogTitle(),
@@ -858,8 +859,8 @@ class UIHelper {
     required String id,
   }) async {
     final error = FeralfileError(3009, '');
-    metricClient.addEvent(MixpanelEvent.acceptOwnershipFail,
-        data: {'message': error.dialogMessage, 'id': id});
+    unawaited(metricClient.addEvent(MixpanelEvent.acceptOwnershipFail,
+        data: {'message': error.dialogMessage, 'id': id}));
     return showErrorDialog(
       context,
       error.getDialogTitle(),
@@ -870,8 +871,8 @@ class UIHelper {
 
   static Future showOtpExpired(BuildContext context, String? artworkId) async {
     final error = FeralfileError(3013, '');
-    metricClient.addEvent(MixpanelEvent.acceptOwnershipFail,
-        data: {'message': error.dialogMessage, 'id': artworkId});
+    unawaited(metricClient.addEvent(MixpanelEvent.acceptOwnershipFail,
+        data: {'message': error.dialogMessage, 'id': artworkId}));
     return showErrorDialog(
       context,
       error.dialogTitle,
@@ -893,8 +894,8 @@ class UIHelper {
           ? ffError.getDialogMessage(series: series)
           : '${e.response?.data ?? e.message}';
 
-      metricClient.addEvent(MixpanelEvent.acceptOwnershipFail,
-          data: {'message': message, 'id': series.id});
+      unawaited(metricClient.addEvent(MixpanelEvent.acceptOwnershipFail,
+          data: {'message': message, 'id': series.id}));
       await showErrorDialog(
         context,
         ffError?.getDialogTitle() ?? 'error'.tr(),
@@ -919,8 +920,8 @@ class UIHelper {
           ? ffError.dialogMessage
           : '${e.response?.data ?? e.message}';
 
-      metricClient.addEvent(MixpanelEvent.acceptOwnershipFail,
-          data: {'message': message, 'id': id});
+      unawaited(metricClient.addEvent(MixpanelEvent.acceptOwnershipFail,
+          data: {'message': message, 'id': id}));
       await showErrorDialog(
         context,
         ffError?.dialogMessage ?? 'error'.tr(),
@@ -1004,11 +1005,12 @@ class UIHelper {
     }
   }
 
-  static void showHideArtworkResultDialog(BuildContext context, bool isHidden,
-      {required Function() onOK}) {
+  static Future<void> showHideArtworkResultDialog(
+      BuildContext context, bool isHidden,
+      {required Function() onOK}) async {
     final theme = Theme.of(context);
 
-    showDialog(
+    await showDialog(
         context,
         isHidden ? 'art_hidden'.tr() : 'art_unhidden'.tr(),
         Column(
@@ -1046,11 +1048,11 @@ class UIHelper {
         ));
   }
 
-  static void showIdentityDetailDialog(BuildContext context,
-      {required String name, required String address}) {
+  static Future<void> showIdentityDetailDialog(BuildContext context,
+      {required String name, required String address}) async {
     final theme = Theme.of(context);
 
-    showDialog(
+    await showDialog(
         context,
         'identity'.tr(),
         Flexible(
@@ -1099,9 +1101,10 @@ class UIHelper {
         )));
   }
 
-  static void showLoadingScreen(BuildContext context, {String text = ''}) {
+  static Future<void> showLoadingScreen(BuildContext context,
+      {String text = ''}) async {
     final theme = Theme.of(context);
-    Navigator.push(
+    await Navigator.push(
       context,
       CupertinoPageRoute(
         builder: (context) => loadingScreen(
@@ -1112,14 +1115,14 @@ class UIHelper {
     );
   }
 
-  static void showCenterSheet(BuildContext context,
+  static Future<void> showCenterSheet(BuildContext context,
       {required Widget content,
       String? actionButton,
       Function()? actionButtonOnTap,
       String? exitButton,
-      Function()? exitButtonOnTap}) {
+      Function()? exitButtonOnTap}) async {
     UIHelper.hideInfoDialog(context);
-    showCupertinoModalPopup(
+    await showCupertinoModalPopup(
         context: context,
         builder: (context) => Center(
               child: Padding(
@@ -1127,7 +1130,7 @@ class UIHelper {
                     const EdgeInsets.symmetric(horizontal: 15, vertical: 128),
                 child: DecoratedBox(
                   decoration: BoxDecoration(
-                    color: AppColor.auSuperTeal,
+                    color: AppColor.feralFileHighlight,
                     borderRadius: BorderRadius.circular(5),
                   ),
                   child: Padding(
@@ -1164,7 +1167,7 @@ class UIHelper {
                                 onPressed: actionButtonOnTap,
                                 borderColor: AppColor.primaryBlack,
                                 textColor: AppColor.primaryBlack,
-                                backgroundColor: AppColor.auSuperTeal,
+                                backgroundColor: AppColor.feralFileHighlight,
                               ),
                               const SizedBox(
                                 height: 15,
@@ -1179,7 +1182,7 @@ class UIHelper {
                               },
                           borderColor: AppColor.primaryBlack,
                           textColor: AppColor.primaryBlack,
-                          backgroundColor: AppColor.auSuperTeal,
+                          backgroundColor: AppColor.feralFileHighlight,
                         ),
                       ],
                     ),
@@ -1222,9 +1225,93 @@ class UIHelper {
             ));
   }
 
+  static Future<void> showCenterMenu(BuildContext context,
+      {required List<OptionItem> options}) async {
+    final theme = Theme.of(context);
+    await showCupertinoModalPopup(
+      context: context,
+      builder: (context) => Center(
+        child: Padding(
+          padding: const EdgeInsets.symmetric(horizontal: 20),
+          child: DecoratedBox(
+            decoration: BoxDecoration(
+              borderRadius: BorderRadius.circular(20),
+              color: AppColor.auGreyBackground,
+            ),
+            child: Column(
+              mainAxisSize: MainAxisSize.min,
+              mainAxisAlignment: MainAxisAlignment.center,
+              children: [
+                ListView.separated(
+                  shrinkWrap: true,
+                  padding: const EdgeInsets.all(0),
+                  physics: const NeverScrollableScrollPhysics(),
+                  itemBuilder: (BuildContext context, int index) {
+                    final option = options[index];
+                    final child = Padding(
+                      padding: const EdgeInsets.symmetric(
+                        vertical: 16,
+                        horizontal: 13,
+                      ),
+                      child: Row(
+                        children: [
+                          if (option.icon != null)
+                            SizedBox(
+                                width: 30,
+                                child: IconTheme(
+                                    data: const IconThemeData(
+                                      color: AppColor.white,
+                                    ),
+                                    child: option.icon!)),
+                          if (option.icon != null)
+                            const SizedBox(
+                              width: 39,
+                            ),
+                          Text(
+                            option.title ?? '',
+                            style: option.titleStyle ??
+                                theme.textTheme.ppMori400White14
+                                    .copyWith(decoration: TextDecoration.none),
+                          ),
+                        ],
+                      ),
+                    );
+                    if (option.builder != null) {
+                      return option.builder!.call(context, option);
+                    }
+                    return GestureDetector(
+                      onTap: () {
+                        option.onTap?.call();
+                      },
+                      child: Stack(
+                        children: [
+                          child,
+                          Positioned.fill(
+                              child: Container(
+                            color: Colors.transparent,
+                          )),
+                        ],
+                      ),
+                    );
+                  },
+                  itemCount: options.length,
+                  separatorBuilder: (context, index) => const Divider(
+                    height: 1,
+                    color: AppColor.primaryBlack,
+                  ),
+                )
+              ],
+            ),
+          ),
+        ),
+      ),
+    );
+  }
+
   static Future<void> showDrawerAction(BuildContext context,
       {List<OptionItem>? options}) async {
     final theme = Theme.of(context);
+
     await showModalBottomSheet<dynamic>(
         context: context,
         backgroundColor: Colors.transparent,
@@ -1236,7 +1323,7 @@ class UIHelper {
         barrierColor: Colors.black.withOpacity(0.5),
         isScrollControlled: true,
         builder: (context) => Container(
-              color: theme.auSuperTeal,
+              color: AppColor.feralFileHighlight,
               child: Column(
                 mainAxisSize: MainAxisSize.min,
                 children: [
@@ -1457,7 +1544,8 @@ class UIHelper {
                 bool result = false;
                 try {
                   result = await registerPushNotifications(askPermission: true);
-                  injector<ConfigurationService>().setPendingSettings(false);
+                  await injector<ConfigurationService>()
+                      .setPendingSettings(false);
                 } catch (error) {
                   log.warning('Error when setting notification: $error');
                 }
@@ -1532,7 +1620,7 @@ class UIHelper {
     );
   }
 
-  static Future showCustomDialog(
+  static Future<void> showCustomDialog(
       {required BuildContext context,
       required Widget child,
       bool isDismissible = false,
@@ -1570,7 +1658,7 @@ class UIHelper {
     );
   }
 
-  static Future showLocationExplain(BuildContext context) async {
+  static Future<void> showLocationExplain(BuildContext context) async {
     final theme = Theme.of(context);
     return showCustomDialog(
       context: context,
diff --git a/lib/view/artwork_common_widget.dart b/lib/view/artwork_common_widget.dart
index 39bcdd82e..238f92deb 100644
--- a/lib/view/artwork_common_widget.dart
+++ b/lib/view/artwork_common_widget.dart
@@ -5,7 +5,8 @@ import 'dart:math';
 import 'package:after_layout/after_layout.dart';
 import 'package:autonomy_flutter/common/environment.dart';
 import 'package:autonomy_flutter/common/injector.dart';
-import 'package:autonomy_flutter/model/ff_account.dart';
+import 'package:autonomy_flutter/model/ff_exhibition.dart';
+import 'package:autonomy_flutter/model/ff_series.dart';
 import 'package:autonomy_flutter/service/configuration_service.dart';
 import 'package:autonomy_flutter/service/feralfile_service.dart';
 import 'package:autonomy_flutter/service/metric_client_service.dart';
@@ -145,6 +146,7 @@ Widget tokenGalleryThumbnailWidget(
   int cachedImageSize, {
   bool usingThumbnailID = true,
   bool useHero = true,
+  Widget? galleryThumbnailPlaceholder,
 }) {
   final thumbnailUrl =
       token.getGalleryThumbnailUrl(usingThumbnailID: usingThumbnailID);
@@ -195,7 +197,9 @@ Widget tokenGalleryThumbnailWidget(
               cacheManager: cacheManager,
               placeholder: (context, index) => FutureBuilder<bool>(
                   future: cachingState,
-                  builder: (context, snapshot) => GalleryThumbnailPlaceholder(
+                  builder: (context, snapshot) =>
+                      galleryThumbnailPlaceholder ??
+                      GalleryThumbnailPlaceholder(
                         loading: !(snapshot.data ?? true),
                       )),
               errorWidget: (context, url, error) => CachedNetworkImage(
@@ -210,7 +214,9 @@ Widget tokenGalleryThumbnailWidget(
                 cacheManager: cacheManager,
                 placeholder: (context, index) => FutureBuilder<bool>(
                     future: cachingState,
-                    builder: (context, snapshot) => GalleryThumbnailPlaceholder(
+                    builder: (context, snapshot) =>
+                        galleryThumbnailPlaceholder ??
+                        GalleryThumbnailPlaceholder(
                           loading: !(snapshot.data ?? true),
                         )),
                 errorWidget: (context, url, error) =>
@@ -395,7 +401,6 @@ Widget placeholder(BuildContext context) {
           children: [
             GifView.asset(
               'assets/images/loading_white.gif',
-              width: 52,
               height: 52,
               frameRate: 12,
             ),
@@ -492,7 +497,7 @@ class PreviewUnSupportedTokenWidget extends StatelessWidget {
                   child: Text(
                     'hide_from_collection'.tr(),
                     style: theme.textTheme.ppMori400Black12
-                        .copyWith(color: AppColor.auSuperTeal),
+                        .copyWith(color: AppColor.feralFileHighlight),
                   ),
                 )
               ],
@@ -563,7 +568,7 @@ class _BrokenTokenWidgetState extends State<BrokenTokenWidget>
                   child: Text(
                     'reload'.tr(),
                     style: theme.textTheme.ppMori400Black12
-                        .copyWith(color: AppColor.auSuperTeal),
+                        .copyWith(color: AppColor.feralFileHighlight),
                   ),
                 )
               ],
@@ -661,7 +666,6 @@ class _PreviewPlaceholderState extends State<PreviewPlaceholder>
           children: [
             GifView.asset(
               'assets/images/loading_white.gif',
-              width: 52,
               height: 52,
               frameRate: 12,
             ),
@@ -1496,7 +1500,7 @@ class MetaDataItem extends StatelessWidget {
               overflow: TextOverflow.ellipsis,
               maxLines: 3,
               style: onValueTap != null
-                  ? linkStyle ?? theme.textTheme.ppMori400Green14
+                  ? linkStyle ?? theme.textTheme.ppMori400FFYellow14
                   : valueStyle ?? theme.textTheme.ppMori400White14,
             ),
           ),
@@ -1571,14 +1575,14 @@ class ProvenanceItem extends StatelessWidget {
                       const EdgeInsets.symmetric(horizontal: 10, vertical: 4),
                   decoration: BoxDecoration(
                     border: Border.all(
-                      color: theme.auSuperTeal,
+                      color: AppColor.feralFileHighlight,
                     ),
                     borderRadius: BorderRadius.circular(64),
                   ),
                   child: Text(
                     'view'.tr(),
                     overflow: TextOverflow.ellipsis,
-                    style: theme.textTheme.ppMori400Green14,
+                    style: theme.textTheme.ppMori400FFYellow14,
                   ),
                 ),
               ),
@@ -1654,8 +1658,8 @@ Widget artworkDetailsProvenanceSectionNotEmpty(
                       // subTitle: el.blockchain.toUpperCase(),
                       tapLink: el.txURL,
                       onNameTap: () => identity != null
-                          ? UIHelper.showIdentityDetailDialog(context,
-                              name: identity, address: el.owner)
+                          ? unawaited(UIHelper.showIdentityDetailDialog(context,
+                              name: identity, address: el.owner))
                           : null,
                       forceSafariVC: true,
                     ),
@@ -1958,7 +1962,7 @@ class ArtworkDetailsHeader extends StatelessWidget {
             child: Text(
               subTitle,
               style: theme.textTheme.ppMori700White14.copyWith(
-                  color: AppColor.auSuperTeal,
+                  color: AppColor.feralFileHighlight,
                   fontWeight: isReverse ? FontWeight.w400 : null),
               maxLines: 1,
               overflow: TextOverflow.ellipsis,
@@ -1971,7 +1975,7 @@ class ArtworkDetailsHeader extends StatelessWidget {
           child: Text(
             title,
             style: theme.textTheme.ppMori400White14.copyWith(
-                color: AppColor.auSuperTeal,
+                color: AppColor.feralFileHighlight,
                 fontWeight: isReverse ? FontWeight.w700 : null),
             maxLines: 1,
             overflow: TextOverflow.ellipsis,
diff --git a/lib/view/au_toggle.dart b/lib/view/au_toggle.dart
index dac72b4ea..a7ec484ef 100644
--- a/lib/view/au_toggle.dart
+++ b/lib/view/au_toggle.dart
@@ -14,24 +14,22 @@ class AuToggle extends StatelessWidget {
   final bool value;
 
   const AuToggle({
-    Key? key,
     required this.value,
+    super.key,
     this.onToggle,
-  }) : super(key: key);
+  });
 
   @override
-  Widget build(BuildContext context) {
-    return FlutterSwitch(
-      height: 25,
-      width: 48,
-      toggleSize: 19.2,
-      padding: 2,
-      value: value,
-      onToggle: onToggle ?? (bool p) {},
-      activeColor: AppColor.auSuperTeal,
-      toggleColor: AppColor.primaryBlack,
-      inactiveColor: AppColor.auLightGrey,
-      inactiveToggleColor: AppColor.greyMedium,
-    );
-  }
+  Widget build(BuildContext context) => FlutterSwitch(
+        height: 25,
+        width: 48,
+        toggleSize: 19.2,
+        padding: 3,
+        value: value,
+        onToggle: onToggle ?? (bool p) {},
+        activeColor: AppColor.feralFileHighlight,
+        toggleColor: AppColor.primaryBlack,
+        inactiveColor: AppColor.auLightGrey,
+        inactiveToggleColor: AppColor.auQuickSilver,
+      );
 }
diff --git a/lib/view/back_appbar.dart b/lib/view/back_appbar.dart
index a43b2f88f..4c25fe7e6 100644
--- a/lib/view/back_appbar.dart
+++ b/lib/view/back_appbar.dart
@@ -7,16 +7,17 @@
 
 import 'package:autonomy_flutter/util/style.dart';
 import 'package:autonomy_theme/autonomy_theme.dart';
+import 'package:easy_localization/easy_localization.dart';
 import 'package:flutter/material.dart';
 import 'package:flutter/services.dart';
 import 'package:flutter_svg/flutter_svg.dart';
 
 AppBar getBackAppBar(
   BuildContext context, {
-  String backTitle = "BACK",
-  String title = "",
-  TextStyle? titleStyle,
   required Function()? onBack,
+  String backTitle = 'BACK',
+  String title = '',
+  TextStyle? titleStyle,
   Widget? icon,
   Widget? titleIcon,
   Function()? action,
@@ -39,10 +40,10 @@ AppBar getBackAppBar(
     leadingWidth: 44,
     leading: onBack != null
         ? Semantics(
-            label: "BACK",
+            label: 'BACK',
             child: IconButton(
               onPressed: onBack,
-              constraints: const BoxConstraints(maxWidth: 36.0),
+              constraints: const BoxConstraints(maxWidth: 36),
               icon: SvgPicture.asset(
                 'assets/images/icon_back.svg',
                 colorFilter: ColorFilter.mode(primaryColor, BlendMode.srcIn),
@@ -66,21 +67,22 @@ AppBar getBackAppBar(
     ),
     actions: [
       ...actions ?? [],
-      action != null
-          ? Padding(
-              padding: const EdgeInsets.only(right: 15),
-              child: IconButton(
-                tooltip: "AppbarAction",
-                constraints: const BoxConstraints(maxWidth: 36.0),
-                onPressed: action,
-                icon: icon ??
-                    Icon(
-                      Icons.more_horiz,
-                      color: primaryColor,
-                    ),
-              ),
-            )
-          : const SizedBox(width: 36),
+      if (action != null)
+        Padding(
+          padding: const EdgeInsets.only(right: 15),
+          child: IconButton(
+            tooltip: 'AppbarAction',
+            constraints: const BoxConstraints(maxWidth: 36),
+            onPressed: action,
+            icon: icon ??
+                Icon(
+                  Icons.more_horiz,
+                  color: primaryColor,
+                ),
+          ),
+        )
+      else
+        const SizedBox(width: 36),
     ],
     backgroundColor: backgroundColor ?? Colors.transparent,
     shadowColor: Colors.transparent,
@@ -96,10 +98,10 @@ AppBar getBackAppBar(
 }
 
 AppBar getTitleEditAppBar(BuildContext context,
-    {String backTitle = "BACK",
-    required TextEditingController controller,
+    {required TextEditingController controller,
     required FocusNode focusNode,
     required Function(String value) onSubmit,
+    String backTitle = 'BACK',
     bool hasBack = true,
     Widget? icon,
     Widget? titleIcon,
@@ -118,10 +120,10 @@ AppBar getTitleEditAppBar(BuildContext context,
     leadingWidth: 44,
     leading: hasBack
         ? Semantics(
-            label: "BACK",
+            label: 'BACK',
             child: IconButton(
               onPressed: () {},
-              constraints: const BoxConstraints(maxWidth: 36.0),
+              constraints: const BoxConstraints(maxWidth: 36),
               icon: SvgPicture.asset(
                 'assets/images/icon_back.svg',
                 colorFilter: ColorFilter.mode(primaryColor, BlendMode.srcIn),
@@ -135,7 +137,7 @@ AppBar getTitleEditAppBar(BuildContext context,
       children: [
         if (titleIcon != null) ...[titleIcon, const SizedBox(width: 10)],
         ConstrainedBox(
-          constraints: const BoxConstraints(maxWidth: 100.0),
+          constraints: const BoxConstraints(maxWidth: 100),
           child: TextField(
             autocorrect: false,
             focusNode: focusNode,
@@ -152,8 +154,8 @@ AppBar getTitleEditAppBar(BuildContext context,
         Padding(
           padding: const EdgeInsets.only(right: 15),
           child: IconButton(
-            tooltip: "AppbarAction",
-            constraints: const BoxConstraints(maxWidth: 36.0),
+            tooltip: 'AppbarAction',
+            constraints: const BoxConstraints(maxWidth: 36),
             onPressed: () {},
             icon: icon ??
                 Icon(
@@ -175,9 +177,9 @@ AppBar getTitleEditAppBar(BuildContext context,
 
 AppBar getCloseAppBar(
   BuildContext context, {
-  String title = "",
-  TextStyle? titleStyle,
   required Function()? onClose,
+  String title = '',
+  TextStyle? titleStyle,
   Widget? icon,
   Widget? disableIcon,
   bool withBottomDivider = true,
@@ -206,7 +208,7 @@ AppBar getCloseAppBar(
     actions: [
       if (onClose != null)
         IconButton(
-          tooltip: "CLOSE",
+          tooltip: 'CLOSE',
           onPressed: onClose,
           icon: icon ?? closeIcon(color: primaryColor),
         )
@@ -226,31 +228,32 @@ AppBar getCloseAppBar(
   );
 }
 
-AppBar getDarkEmptyAppBar() {
-  return AppBar(
-    systemOverlayStyle: systemUiOverlayDarkStyle,
-    toolbarHeight: 0,
-    shadowColor: Colors.transparent,
-    elevation: 0,
-  );
-}
+AppBar getDarkEmptyAppBar([Color? statusBarColor]) => AppBar(
+      systemOverlayStyle: _systemUiOverlayDarkStyle(statusBarColor),
+      backgroundColor: statusBarColor,
+      toolbarHeight: 0,
+      shadowColor: Colors.transparent,
+      elevation: 0,
+    );
 
-AppBar getLightEmptyAppBar([Color? statusBarColor]) {
-  return AppBar(
-    systemOverlayStyle: systemUiOverlayLightStyle(statusBarColor),
-    backgroundColor: Colors.transparent,
-    toolbarHeight: 0,
-    shadowColor: Colors.transparent,
-    elevation: 0,
-  );
-}
+AppBar getLightEmptyAppBar([Color? statusBarColor]) => AppBar(
+      systemOverlayStyle: systemUiOverlayLightStyle(statusBarColor),
+      backgroundColor: Colors.transparent,
+      toolbarHeight: 0,
+      shadowColor: Colors.transparent,
+      elevation: 0,
+    );
 
-SystemUiOverlayStyle get systemUiOverlayDarkStyle => const SystemUiOverlayStyle(
-      statusBarColor: AppColor.primaryBlack,
+SystemUiOverlayStyle _systemUiOverlayDarkStyle(Color? statusBarColor) =>
+    SystemUiOverlayStyle(
+      statusBarColor: statusBarColor ?? AppColor.primaryBlack,
       statusBarIconBrightness: Brightness.light,
       statusBarBrightness: Brightness.dark,
     );
 
+SystemUiOverlayStyle get systemUiOverlayDarkStyle =>
+    _systemUiOverlayDarkStyle(AppColor.primaryBlack);
+
 SystemUiOverlayStyle systemUiOverlayLightStyle(Color? statusBarColor) =>
     SystemUiOverlayStyle(
       statusBarColor: statusBarColor ?? AppColor.white,
@@ -258,5 +261,158 @@ SystemUiOverlayStyle systemUiOverlayLightStyle(Color? statusBarColor) =>
       statusBarBrightness: Brightness.light,
     );
 
+AppBar getDoneAppBar(
+  BuildContext context, {
+  required String title,
+  Function()? onDone,
+  Function()? onCancel,
+  PreferredSize? bottom,
+  bool isWhite = true,
+}) {
+  final theme = Theme.of(context);
+  return AppBar(
+    systemOverlayStyle: SystemUiOverlayStyle(
+      statusBarColor: isWhite ? AppColor.white : AppColor.primaryBlack,
+      statusBarIconBrightness: isWhite ? Brightness.dark : Brightness.light,
+      statusBarBrightness: isWhite ? Brightness.light : Brightness.dark,
+    ),
+    elevation: 1,
+    shadowColor: Colors.transparent,
+    leadingWidth: 80,
+    leading: GestureDetector(
+      onTap: onCancel,
+      child: Padding(
+        padding: const EdgeInsets.only(left: 14),
+        child: Center(
+          child: Text(
+            tr('cancel'),
+            style: theme.textTheme.ppMori400Black14,
+          ),
+        ),
+      ),
+    ),
+    actions: [
+      Padding(
+        padding: const EdgeInsets.only(right: 14),
+        child: GestureDetector(
+          onTap: onDone,
+          child: Center(
+            child: Text(
+              tr('done'),
+              style: (onDone != null)
+                  ? theme.textTheme.ppMori700Black14
+                  : theme.textTheme.ppMori700Black14
+                      .copyWith(color: AppColor.disabledColor),
+            ),
+          ),
+        ),
+      ),
+    ],
+    backgroundColor: theme.colorScheme.background,
+    automaticallyImplyLeading: false,
+    centerTitle: true,
+    title: Text(
+      title,
+      style: theme.textTheme.ppMori400Black14,
+    ),
+    bottom: bottom,
+  );
+}
+
+AppBar getCustomDoneAppBar(
+  BuildContext context, {
+  required Widget title,
+  Function()? onDone,
+  Function()? onCancel,
+  PreferredSize? bottom,
+  bool isWhite = true,
+}) {
+  final theme = Theme.of(context);
+  return AppBar(
+    systemOverlayStyle: SystemUiOverlayStyle(
+      statusBarColor: isWhite ? AppColor.white : AppColor.primaryBlack,
+      statusBarIconBrightness: isWhite ? Brightness.dark : Brightness.light,
+      statusBarBrightness: isWhite ? Brightness.light : Brightness.dark,
+    ),
+    shadowColor: Colors.transparent,
+    elevation: 1,
+    leadingWidth: 80,
+    leading: GestureDetector(
+      onTap: onCancel,
+      child: Padding(
+        padding: const EdgeInsets.only(left: 14),
+        child: Center(
+          child: Text(
+            tr('cancel'),
+            style: theme.textTheme.ppMori400Black14,
+          ),
+        ),
+      ),
+    ),
+    actions: [
+      Padding(
+        padding: const EdgeInsets.only(right: 14),
+        child: GestureDetector(
+          onTap: onDone,
+          child: Center(
+            child: Text(
+              tr('done'),
+              style: (onDone != null)
+                  ? theme.textTheme.ppMori700Black14
+                  : theme.textTheme.ppMori700Black14
+                      .copyWith(color: AppColor.disabledColor),
+            ),
+          ),
+        ),
+      ),
+    ],
+    backgroundColor: theme.colorScheme.background,
+    automaticallyImplyLeading: false,
+    centerTitle: true,
+    title: title,
+    bottom: bottom,
+  );
+}
+
+AppBar getFFAppBar(
+  BuildContext context, {
+  required Function()? onBack,
+  Widget? title,
+  Widget? action,
+}) {
+  const secondaryColor = AppColor.primaryBlack;
+  return AppBar(
+      systemOverlayStyle: const SystemUiOverlayStyle(
+          statusBarColor: secondaryColor,
+          statusBarIconBrightness: Brightness.light,
+          statusBarBrightness: Brightness.dark),
+      centerTitle: true,
+      toolbarHeight: 66,
+      leadingWidth: 44,
+      leading: onBack != null
+          ? Semantics(
+              label: 'BACK',
+              child: IconButton(
+                constraints: const BoxConstraints(maxWidth: 34),
+                onPressed: onBack,
+                icon: SvgPicture.asset(
+                  'assets/images/ff_back_dark.svg',
+                ),
+              ))
+          : const SizedBox(width: 36),
+      automaticallyImplyLeading: false,
+      title: title,
+      actions: [
+        if (action != null)
+          Padding(
+              padding: const EdgeInsets.symmetric(vertical: 6), child: action)
+        else
+          const SizedBox(width: 36),
+      ],
+      backgroundColor: Colors.transparent,
+      shadowColor: Colors.transparent,
+      elevation: 0);
+}
+
 // class MomaPallet to save colors
 // Path: lib/util/style.dart
diff --git a/lib/view/canvas_device_view.dart b/lib/view/canvas_device_view.dart
index 1666b114b..675308457 100644
--- a/lib/view/canvas_device_view.dart
+++ b/lib/view/canvas_device_view.dart
@@ -1,3 +1,5 @@
+import 'dart:async';
+
 import 'package:autonomy_flutter/model/play_list_model.dart';
 import 'package:autonomy_flutter/screen/app_router.dart';
 import 'package:autonomy_flutter/screen/detail/preview/canvas_device_bloc.dart';
@@ -23,12 +25,11 @@ class CanvasDeviceView extends StatefulWidget {
   final PlayListModel? playlist;
 
   const CanvasDeviceView(
-      {Key? key,
-      required this.sceneId,
+      {required this.sceneId,
+      super.key,
       this.onClose,
       this.isCollection = false,
-      this.playlist})
-      : super(key: key);
+      this.playlist});
 
   @override
   State<CanvasDeviceView> createState() => _CanvasDeviceViewState();
@@ -41,7 +42,7 @@ class _CanvasDeviceViewState extends State<CanvasDeviceView> {
   void initState() {
     super.initState();
     _bloc = context.read<CanvasDeviceBloc>();
-    _fetchDevice();
+    unawaited(_fetchDevice());
   }
 
   Future<void> _fetchDevice() async {
@@ -55,9 +56,9 @@ class _CanvasDeviceViewState extends State<CanvasDeviceView> {
       listener: (context, state) {
         setState(() {});
         if (state.isConnectError) {
-          UIHelper.showInfoDialog(
-              context, "fail_to_connect".tr(), "canvas_fail_des".tr(),
-              closeButton: "close".tr());
+          unawaited(UIHelper.showInfoDialog(
+              context, 'fail_to_connect'.tr(), 'canvas_fail_des'.tr(),
+              closeButton: 'close'.tr()));
         }
       },
       builder: (context, state) {
@@ -71,26 +72,26 @@ class _CanvasDeviceViewState extends State<CanvasDeviceView> {
               child: Column(
                 crossAxisAlignment: CrossAxisAlignment.start,
                 children: [
-                  Text("connect_to_frame".tr(),
+                  Text('connect_to_frame'.tr(),
                       style: theme.textTheme.ppMori700White24),
                   const SizedBox(height: 40),
                   RichText(
                       text: TextSpan(children: <TextSpan>[
                     TextSpan(
                       text: widget.isCollection
-                          ? "display_your_collection_on".tr()
-                          : "display_your_artwork_on".tr(),
+                          ? 'display_your_collection_on'.tr()
+                          : 'display_your_artwork_on'.tr(),
                       style: theme.textTheme.ppMori400White14,
                     ),
                     TextSpan(
-                      text: "compatible_platforms".tr(),
-                      style: theme.textTheme.ppMori400Green14,
+                      text: 'compatible_platforms'.tr(),
+                      style: theme.textTheme.ppMori400FFYellow14,
                       recognizer: TapGestureRecognizer()
-                        ..onTap = () => Navigator.of(context)
+                        ..onTap = () async => Navigator.of(context)
                             .pushNamed(AppRouter.canvasHelpPage),
                     ),
                     TextSpan(
-                      text: "for_a_better_viewing".tr(),
+                      text: 'for_a_better_viewing'.tr(),
                       style: theme.textTheme.ppMori400White14,
                     ),
                   ])),
@@ -119,7 +120,7 @@ class _CanvasDeviceViewState extends State<CanvasDeviceView> {
                 children: [
                   _newCanvas(state),
                   OutlineButton(
-                    text: "close".tr(),
+                    text: 'close'.tr(),
                     onTap: () {
                       widget.onClose?.call();
                     },
@@ -141,8 +142,8 @@ class _CanvasDeviceViewState extends State<CanvasDeviceView> {
       return Column(
         children: [
           PrimaryButton(
-            text: "add_new_frame".tr(),
-            onTap: () => _addNewCanvas(),
+            text: 'add_new_frame'.tr(),
+            onTap: () async => _addNewCanvas(),
           ),
           const SizedBox(height: 10),
         ],
@@ -151,20 +152,20 @@ class _CanvasDeviceViewState extends State<CanvasDeviceView> {
       return Column(
         children: [
           GestureDetector(
-            onTap: () => _addNewCanvas(),
-            child: Container(
+            onTap: () async => _addNewCanvas(),
+            child: DecoratedBox(
               decoration: const BoxDecoration(color: Colors.transparent),
               child: Row(
                 children: [
                   Text(
-                    "add_new_frame".tr(),
-                    style: theme.textTheme.ppMori400Green14,
+                    'add_new_frame'.tr(),
+                    style: theme.textTheme.ppMori400FFYellow14,
                   ),
                   const Spacer(),
                   SvgPicture.asset(
-                    "assets/images/joinFile.svg",
+                    'assets/images/joinFile.svg',
                     colorFilter: const ColorFilter.mode(
-                        AppColor.auSuperTeal, BlendMode.srcIn),
+                        AppColor.feralFileHighlight, BlendMode.srcIn),
                   ),
                 ],
               ),
@@ -179,7 +180,9 @@ class _CanvasDeviceViewState extends State<CanvasDeviceView> {
   Future<void> _addNewCanvas() async {
     dynamic device = await Navigator.of(context)
         .pushNamed(ScanQRPage.tag, arguments: ScannerItem.CANVAS_DEVICE);
-    if (!mounted) return;
+    if (!mounted) {
+      return;
+    }
     if (device != null && device is CanvasDevice) {
       _bloc.add(CanvasDeviceAddEvent(DeviceState(device: device)));
     }
@@ -193,7 +196,7 @@ class _CanvasDeviceViewState extends State<CanvasDeviceView> {
         Padding(
           padding: ResponsiveLayout.pageHorizontalEdgeInsets
               .copyWith(top: 20, bottom: 20),
-          child: Container(
+          child: DecoratedBox(
             decoration: const BoxDecoration(color: Colors.transparent),
             child: Row(
               children: [
@@ -249,20 +252,20 @@ class _CanvasDeviceViewState extends State<CanvasDeviceView> {
             Container(
               decoration: BoxDecoration(
                 color: Colors.transparent,
-                border: Border.all(color: AppColor.auSuperTeal),
-                borderRadius: BorderRadius.circular(15.0),
+                border: Border.all(color: AppColor.feralFileHighlight),
+                borderRadius: BorderRadius.circular(15),
               ),
               padding: const EdgeInsets.symmetric(
                 horizontal: 10,
                 vertical: 5,
               ),
-              child:
-                  Text("playing".tr(), style: theme.textTheme.ppMori400Green12),
+              child: Text('playing'.tr(),
+                  style: theme.textTheme.ppMori400FFYellow14),
             ),
             const SizedBox(width: 20),
             GestureDetector(
               child: SvgPicture.asset(
-                "assets/images/stop_icon.svg",
+                'assets/images/stop_icon.svg',
                 width: 30,
                 height: 30,
               ),
@@ -276,13 +279,15 @@ class _CanvasDeviceViewState extends State<CanvasDeviceView> {
       case DeviceStatus.connected:
         return GestureDetector(
           child: SvgPicture.asset(
-            "assets/images/play_canvas_icon.svg",
+            'assets/images/play_canvas_icon.svg',
             colorFilter:
                 const ColorFilter.mode(AppColor.white, BlendMode.srcIn),
           ),
           onTap: () {
             if (widget.isCollection) {
-              if (widget.playlist == null) return;
+              if (widget.playlist == null) {
+                return;
+              }
               _bloc.add(CanvasDeviceCastCollectionEvent(
                   deviceState.device, widget.playlist!));
             } else {
@@ -293,13 +298,13 @@ class _CanvasDeviceViewState extends State<CanvasDeviceView> {
         );
       case DeviceStatus.error:
         return GestureDetector(
-          onTap: () {
-            Navigator.of(context).pushNamed(AppRouter.canvasHelpPage);
+          onTap: () async {
+            await Navigator.of(context).pushNamed(AppRouter.canvasHelpPage);
           },
           child: SvgPicture.asset(
-            "assets/images/help_icon.svg",
-            colorFilter:
-                const ColorFilter.mode(AppColor.auSuperTeal, BlendMode.srcIn),
+            'assets/images/help_icon.svg',
+            colorFilter: const ColorFilter.mode(
+                AppColor.feralFileHighlight, BlendMode.srcIn),
           ),
         );
     }
diff --git a/lib/view/cast_button.dart b/lib/view/cast_button.dart
index af5322788..8bc18f1d5 100644
--- a/lib/view/cast_button.dart
+++ b/lib/view/cast_button.dart
@@ -2,28 +2,72 @@ import 'package:autonomy_theme/autonomy_theme.dart';
 import 'package:flutter/material.dart';
 import 'package:flutter_svg/flutter_svg.dart';
 
-class CastButton extends StatelessWidget {
+class FFCastButton extends StatelessWidget {
   final VoidCallback? onCastTap;
   final bool isCasting;
+  final String? text;
 
-  const CastButton({Key? key, this.onCastTap, this.isCasting = false})
-      : super(key: key);
+  const FFCastButton(
+      {super.key, this.onCastTap, this.isCasting = false, this.text});
 
   @override
   Widget build(BuildContext context) {
     final theme = Theme.of(context);
-
     return GestureDetector(
       onTap: onCastTap,
       child: Semantics(
         label: 'cast_icon',
-        child: SvgPicture.asset(
-          'assets/images/cast_icon.svg',
-          colorFilter: ColorFilter.mode(
-              isCasting ? theme.auSuperTeal : theme.colorScheme.secondary,
-              BlendMode.srcIn),
+        child: DecoratedBox(
+          decoration: BoxDecoration(
+            borderRadius: BorderRadius.circular(16),
+            color: AppColor.feralFileLightBlue,
+          ),
+          child: Padding(
+            padding: const EdgeInsets.symmetric(horizontal: 16, vertical: 5),
+            child: Row(
+              children: [
+                if (text != null)
+                  Padding(
+                    padding: const EdgeInsets.only(right: 10),
+                    child: Text(
+                      text!,
+                      style: theme.textTheme.ppMori400Black14.copyWith(
+                        color: theme.colorScheme.primary,
+                      ),
+                    ),
+                  ),
+                SvgPicture.asset(
+                  'assets/images/cast_icon.svg',
+                  height: 20,
+                  colorFilter: ColorFilter.mode(
+                      theme.colorScheme.primary, BlendMode.srcIn),
+                ),
+              ],
+            ),
+          ),
         ),
       ),
     );
   }
 }
+
+class CastButton extends StatelessWidget {
+  final VoidCallback? onCastTap;
+  final bool isCasting;
+
+  const CastButton({super.key, this.onCastTap, this.isCasting = false});
+
+  @override
+  Widget build(BuildContext context) => GestureDetector(
+        onTap: onCastTap,
+        child: Semantics(
+          label: 'cast_icon',
+          child: SvgPicture.asset(
+            'assets/images/cast_icon.svg',
+            colorFilter: ColorFilter.mode(
+                isCasting ? AppColor.feralFileHighlight : AppColor.white,
+                BlendMode.srcIn),
+          ),
+        ),
+      );
+}
diff --git a/lib/view/crypto_view.dart b/lib/view/crypto_view.dart
index c9bdb1726..cd2d859a7 100644
--- a/lib/view/crypto_view.dart
+++ b/lib/view/crypto_view.dart
@@ -98,7 +98,6 @@ class _AddAddressToWalletState extends State<AddAddressToWallet> {
                         children: [
                           Image.asset(
                             "assets/images/loading_white_tran.gif",
-                            width: 52,
                             height: 52,
                           ),
                           const SizedBox(height: 20),
diff --git a/lib/view/eula_privacy.dart b/lib/view/eula_privacy.dart
deleted file mode 100644
index 2ec07190d..000000000
--- a/lib/view/eula_privacy.dart
+++ /dev/null
@@ -1,65 +0,0 @@
-//
-//  SPDX-License-Identifier: BSD-2-Clause-Patent
-//  Copyright © 2022 Bitmark. All rights reserved.
-//  Use of this source code is governed by the BSD-2-Clause Plus Patent License
-//  that can be found in the LICENSE file.
-//
-
-import 'package:autonomy_flutter/screen/app_router.dart';
-import 'package:autonomy_flutter/util/constants.dart';
-import 'package:autonomy_theme/autonomy_theme.dart';
-import 'package:easy_localization/easy_localization.dart';
-import 'package:flutter/material.dart';
-import 'package:url_launcher/url_launcher.dart';
-
-Widget privacyView(BuildContext context) {
-  final theme = Theme.of(context);
-  final customLinkStyle = theme.textTheme.linkStyle.copyWith(
-    fontSize: 12,
-    fontWeight: FontWeight.w500,
-  );
-  final Uri uri = Uri.parse(AUTONOMY_CLIENT_GITHUB_LINK);
-
-  return Column(
-    children: [
-      Column(
-        children: [
-          Text(
-            "believe_transparency".tr(),
-            style: theme.textTheme.atlasBlackBold14,
-          ),
-          Row(
-            mainAxisAlignment: MainAxisAlignment.center,
-            children: [
-              Text(
-                "autonomy_is_".tr(),
-                style: theme.textTheme.atlasBlackNormal14,
-              ),
-              GestureDetector(
-                child: Text(
-                  "open_source".tr(),
-                  style: customLinkStyle.copyWith(fontSize: 14),
-                ),
-                onTap: () =>
-                    launchUrl(uri, mode: LaunchMode.externalApplication),
-              ),
-            ],
-          ),
-        ],
-      ),
-      const SizedBox(height: 16),
-      GestureDetector(
-        child: Text(
-          "privacy_policy".tr(),
-          style: customLinkStyle.copyWith(fontSize: 14),
-        ),
-        onTap: () => Navigator.of(context)
-            .pushNamed(AppRouter.githubDocPage, arguments: {
-          "prefix": "/bitmark-inc/autonomy.io/main/apps/docs/",
-          "document": "privacy.md",
-          "title": ""
-        }),
-      ),
-    ],
-  );
-}
diff --git a/lib/view/event_view.dart b/lib/view/event_view.dart
new file mode 100644
index 000000000..91fc2ee14
--- /dev/null
+++ b/lib/view/event_view.dart
@@ -0,0 +1,93 @@
+import 'package:autonomy_flutter/model/ff_exhibition.dart';
+import 'package:autonomy_flutter/screen/app_router.dart';
+import 'package:autonomy_flutter/screen/settings/help_us/inapp_webview.dart';
+import 'package:autonomy_flutter/util/exhibition_ext.dart';
+import 'package:autonomy_theme/autonomy_theme.dart';
+import 'package:easy_localization/easy_localization.dart';
+import 'package:flutter/material.dart';
+
+class ExhibitionEventView extends StatelessWidget {
+  final ExhibitionEvent exhibitionEvent;
+  final double width;
+
+  const ExhibitionEventView({
+    required this.exhibitionEvent,
+    required this.width,
+    super.key,
+  });
+
+  @override
+  Widget build(BuildContext context) {
+    final theme = Theme.of(context);
+    final dateFormat = DateFormat('MMM d, y');
+    final timeFormat = DateFormat('h:mm a');
+    final eventMediaUrl = getFFUrl(exhibitionEvent.mediaUri?.url);
+    final eventUrl = exhibitionEvent.links?.isNotEmpty == true
+        ? exhibitionEvent.links!.values.first
+        : null;
+
+    return Padding(
+      padding: const EdgeInsets.only(right: 14),
+      child: Container(
+        width: width,
+        padding: const EdgeInsets.all(14),
+        decoration: BoxDecoration(
+          borderRadius: BorderRadius.circular(8),
+          color: AppColor.auGreyBackground,
+        ),
+        child: Column(
+          mainAxisSize: MainAxisSize.min,
+          crossAxisAlignment: CrossAxisAlignment.start,
+          children: [
+            Text(
+              'event'.tr(),
+              style: theme.textTheme.ppMori400White12,
+            ),
+            const SizedBox(height: 30),
+            if (eventMediaUrl != null) ...[
+              Image.network(
+                eventMediaUrl,
+                fit: BoxFit.fitWidth,
+              ),
+              const SizedBox(height: 20),
+            ],
+            Text(exhibitionEvent.title,
+                style: theme.textTheme.ppMori400White14),
+            const SizedBox(height: 20),
+            if (exhibitionEvent.dateTime != null) ...[
+              Text(
+                'Date: ${dateFormat.format(exhibitionEvent.dateTime!)}',
+                style: theme.textTheme.ppMori400White14,
+              ),
+              Text(
+                'Time: ${timeFormat.format(exhibitionEvent.dateTime!)}',
+                style: theme.textTheme.ppMori400White14,
+              ),
+            ],
+            if (exhibitionEvent.description != null) ...[
+              Text(
+                exhibitionEvent.description!,
+                style: theme.textTheme.ppMori400White14,
+              ),
+              const SizedBox(height: 20),
+            ],
+            if (eventUrl != null)
+              GestureDetector(
+                onTap: () async {
+                  await Navigator.of(context).pushNamed(
+                      AppRouter.inappWebviewPage,
+                      arguments: InAppWebViewPayload(eventUrl));
+                },
+                child: Text(
+                  'watch_more'.tr(),
+                  style: theme.textTheme.ppMori400White14.copyWith(
+                    decoration: TextDecoration.underline,
+                  ),
+                ),
+              ),
+          ],
+        ),
+      ),
+    );
+  }
+}
diff --git a/lib/view/exhibition_detail_last_page.dart b/lib/view/exhibition_detail_last_page.dart
new file mode 100644
index 000000000..db174ac5b
--- /dev/null
+++ b/lib/view/exhibition_detail_last_page.dart
@@ -0,0 +1,85 @@
+import 'package:autonomy_flutter/screen/app_router.dart';
+import 'package:autonomy_flutter/screen/exhibition_details/exhibition_detail_page.dart';
+import 'package:autonomy_flutter/util/exhibition_ext.dart';
+import 'package:autonomy_theme/autonomy_theme.dart';
+import 'package:easy_localization/easy_localization.dart';
+import 'package:flutter/material.dart';
+import 'package:flutter_svg/flutter_svg.dart';
+
+class ExhibitionDetailLastPage extends StatelessWidget {
+  const ExhibitionDetailLastPage(
+      {required this.startOver, super.key, this.nextPayload});
+
+  final Function() startOver;
+  final ExhibitionDetailPayload? nextPayload;
+
+  @override
+  Widget build(BuildContext context) {
+    final theme = Theme.of(context);
+    return Padding(
+      padding: const EdgeInsets.symmetric(horizontal: 14),
+      child: Column(
+        children: [
+          Expanded(
+            child: Center(
+              child: DecoratedBox(
+                decoration: BoxDecoration(
+                  color: AppColor.auGreyBackground,
+                  borderRadius: BorderRadius.circular(25),
+                ),
+                child: Padding(
+                  padding: const EdgeInsets.symmetric(horizontal: 10),
+                  child: Row(
+                    mainAxisSize: MainAxisSize.min,
+                    mainAxisAlignment: MainAxisAlignment.center,
+                    children: [
+                      TextButton(
+                        onPressed: startOver,
+                        child: Text(
+                          'start_over'.tr(),
+                          style: theme.textTheme.ppMori400White14,
+                        ),
+                      ),
+                      const SizedBox(width: 8),
+                      SvgPicture.asset(
+                        'assets/images/start_over.svg',
+                      ),
+                    ],
+                  ),
+                ),
+              ),
+            ),
+          ),
+          if (nextPayload != null)
+            Column(
+              crossAxisAlignment: CrossAxisAlignment.start,
+              children: [
+                Text(
+                  'next_exhibition'.tr(),
+                  style: theme.textTheme.ppMori400White14,
+                ),
+                const SizedBox(height: 20),
+                GestureDetector(
+                  onTap: () async {
+                    await Navigator.of(context).popAndPushNamed(
+                      AppRouter.exhibitionDetailPage,
+                      arguments: nextPayload,
+                    );
+                  },
+                  child: SizedBox(
+                    width: double.infinity,
+                    child: Image.network(
+                      nextPayload!.exhibitions[nextPayload!.index].coverUrl,
+                      height: 140,
+                      alignment: Alignment.topCenter,
+                      fit: BoxFit.fitWidth,
+                    ),
+                  ),
+                )
+              ],
+            ),
+        ],
+      ),
+    );
+  }
+}
diff --git a/lib/view/exhibition_detail_preview.dart b/lib/view/exhibition_detail_preview.dart
new file mode 100644
index 000000000..6b4c6fe19
--- /dev/null
+++ b/lib/view/exhibition_detail_preview.dart
@@ -0,0 +1,86 @@
+import 'package:autonomy_flutter/common/injector.dart';
+import 'package:autonomy_flutter/model/ff_exhibition.dart';
+import 'package:autonomy_flutter/service/navigation_service.dart';
+import 'package:autonomy_flutter/util/exhibition_ext.dart';
+import 'package:autonomy_flutter/view/header.dart';
+import 'package:autonomy_theme/autonomy_theme.dart';
+import 'package:cached_network_image/cached_network_image.dart';
+import 'package:collection/collection.dart';
+import 'package:easy_localization/easy_localization.dart';
+import 'package:flutter/gestures.dart';
+import 'package:flutter/material.dart';
+
+class ExhibitionPreview extends StatelessWidget {
+  ExhibitionPreview({required this.exhibition, super.key});
+
+  final _navigationService = injector<NavigationService>();
+
+  final Exhibition exhibition;
+
+  @override
+  Widget build(BuildContext context) {
+    final theme = Theme.of(context);
+    final subTextStyle = theme.textTheme.ppMori400Grey12
+        .copyWith(color: AppColor.feralFileMediumGrey);
+    final artistTextStyle = theme.textTheme.ppMori400White16
+        .copyWith(decoration: TextDecoration.underline);
+
+    return Container(
+      padding: const EdgeInsets.only(left: 14, right: 14, bottom: 20),
+      child: Column(
+        crossAxisAlignment: CrossAxisAlignment.start,
+        children: [
+          ClipRRect(
+            borderRadius: BorderRadius.circular(10),
+            child: CachedNetworkImage(
+              imageUrl: exhibition.coverUrl,
+              fit: BoxFit.fitWidth,
+            ),
+          ),
+          HeaderView(
+            title: exhibition.title,
+            padding: const EdgeInsets.symmetric(vertical: 20),
+          ),
+          if (exhibition.curator != null) ...[
+            Text('curator'.tr(), style: subTextStyle),
+            const SizedBox(height: 3),
+            GestureDetector(
+              child: Text(exhibition.curator!.alias, style: artistTextStyle),
+              onTap: () async {
+                await _navigationService
+                    .openFeralFileCuratorPage(exhibition.curator!.alias);
+              },
+            ),
+          ],
+          const SizedBox(height: 10),
+          Text('group_exhibition'.tr(), style: subTextStyle),
+          const SizedBox(height: 3),
+          RichText(
+            text: TextSpan(
+              children: exhibition.artists!
+                  .map((e) {
+                    final isLast = exhibition.artists!.last == e;
+                    return [
+                      TextSpan(
+                          style: artistTextStyle,
+                          recognizer: TapGestureRecognizer()
+                            ..onTap = () async {
+                              await _navigationService
+                                  .openFeralFileArtistPage(e.alias);
+                            },
+                          text: e.alias),
+                      if (!isLast)
+                        const TextSpan(
+                          text: ', ',
+                        )
+                    ];
+                  })
+                  .flattened
+                  .toList(),
+            ),
+          ),
+        ],
+      ),
+    );
+  }
+}
diff --git a/lib/view/ff_artwork_preview.dart b/lib/view/ff_artwork_preview.dart
new file mode 100644
index 000000000..2e92509d2
--- /dev/null
+++ b/lib/view/ff_artwork_preview.dart
@@ -0,0 +1,73 @@
+import 'package:autonomy_flutter/model/ff_account.dart';
+import 'package:autonomy_flutter/model/ff_series.dart';
+import 'package:autonomy_flutter/screen/app_router.dart';
+import 'package:autonomy_flutter/screen/detail/artwork_detail_page.dart';
+import 'package:autonomy_flutter/screen/detail/preview_detail/preview_detail_widget.dart';
+import 'package:autonomy_flutter/screen/feralfile_series/feralfile_series_page.dart';
+import 'package:autonomy_flutter/view/series_title_view.dart';
+import 'package:autonomy_theme/autonomy_theme.dart';
+import 'package:flutter/material.dart';
+
+class FeralFileArtworkPreview extends StatelessWidget {
+  const FeralFileArtworkPreview({required this.payload, super.key});
+
+  final FeralFileArtworkPreviewPayload payload;
+
+  @override
+  Widget build(BuildContext context) {
+    final theme = Theme.of(context);
+    return Column(
+      children: [
+        Expanded(
+          child: ArtworkPreviewWidget(
+            identity: ArtworkIdentity(payload.tokenId, ''),
+            useIndexer: true,
+          ),
+        ),
+        const SizedBox(height: 20),
+        Padding(
+          padding: const EdgeInsets.only(left: 14, right: 14, bottom: 20),
+          child: GestureDetector(
+            onTap: () async => Navigator.of(context).pushNamed(
+              AppRouter.feralFileSeriesPage,
+              arguments: FeralFileSeriesPagePayload(
+                seriesId: payload.series.id,
+              ),
+            ),
+            child: Row(
+              crossAxisAlignment: CrossAxisAlignment.end,
+              mainAxisAlignment: MainAxisAlignment.spaceBetween,
+              children: [
+                Flexible(
+                  flex: 5,
+                  child: SeriesTitleView(
+                      series: payload.series, artist: payload.series.artist),
+                ),
+                Padding(
+                  padding: const EdgeInsets.only(bottom: 3),
+                  child: Text(
+                    '${payload.artwork.index + 1}/${payload.series.settings?.maxArtwork ?? '--'}',
+                    style:
+                        theme.textTheme.ppMori400White12.copyWith(fontSize: 10),
+                  ),
+                )
+              ],
+            ),
+          ),
+        ),
+      ],
+    );
+  }
+}
+
+class FeralFileArtworkPreviewPayload {
+  final String tokenId;
+  final FFSeries series;
+  final Artwork artwork;
+
+  const FeralFileArtworkPreviewPayload({
+    required this.tokenId,
+    required this.series,
+    required this.artwork,
+  });
+}
diff --git a/lib/view/ff_artwork_thumbnail_view.dart b/lib/view/ff_artwork_thumbnail_view.dart
new file mode 100644
index 000000000..dd17abc19
--- /dev/null
+++ b/lib/view/ff_artwork_thumbnail_view.dart
@@ -0,0 +1,23 @@
+import 'package:autonomy_flutter/model/ff_account.dart';
+import 'package:autonomy_flutter/util/exhibition_ext.dart';
+import 'package:flutter/material.dart';
+
+class FFArtworkThumbnailView extends StatelessWidget {
+  const FFArtworkThumbnailView({required this.artwork, super.key, this.onTap});
+
+  final Artwork artwork;
+  final Function? onTap;
+
+  @override
+  Widget build(BuildContext context) => GestureDetector(
+        onTap: () => onTap?.call(),
+        child: Container(
+          decoration: BoxDecoration(
+            image: DecorationImage(
+              image: NetworkImage(artwork.thumbnailURL),
+              fit: BoxFit.cover,
+            ),
+          ),
+        ),
+      );
+}
diff --git a/lib/view/galery_thumbnail_item.dart b/lib/view/galery_thumbnail_item.dart
new file mode 100644
index 000000000..4bb5ca1d2
--- /dev/null
+++ b/lib/view/galery_thumbnail_item.dart
@@ -0,0 +1,52 @@
+import 'package:autonomy_flutter/util/asset_token_ext.dart';
+import 'package:autonomy_flutter/view/artwork_common_widget.dart';
+import 'package:flutter/cupertino.dart';
+import 'package:nft_collection/models/asset_token.dart';
+
+class GaleryThumbnailItem extends StatefulWidget {
+  final CompactedAssetToken assetToken;
+  final bool usingThumbnailID;
+  final Function? onTap;
+
+  const GaleryThumbnailItem(
+      {required this.assetToken,
+      super.key,
+      this.onTap,
+      this.usingThumbnailID = false});
+
+  @override
+  State<StatefulWidget> createState() => _GaleryThumbnailItemState();
+}
+
+class _GaleryThumbnailItemState extends State<GaleryThumbnailItem> {
+  final _cachedImageSize = 200;
+
+  @override
+  Widget build(BuildContext context) {
+    final asset = widget.assetToken;
+
+    if (asset.pending == true && asset.isPostcard) {
+      return MintTokenWidget(
+        thumbnail: asset.galleryThumbnailURL,
+        tokenId: asset.tokenId,
+      );
+    }
+
+    return GestureDetector(
+      child: asset.pending == true && !asset.hasMetadata
+          ? PendingTokenWidget(
+              thumbnail: asset.galleryThumbnailURL,
+              tokenId: asset.tokenId,
+            )
+          : tokenGalleryThumbnailWidget(
+              context,
+              asset,
+              _cachedImageSize,
+              usingThumbnailID: widget.usingThumbnailID,
+            ),
+      onTap: () {
+        widget.onTap?.call();
+      },
+    );
+  }
+}
diff --git a/lib/view/header.dart b/lib/view/header.dart
index 1ab013746..de7af8d6b 100644
--- a/lib/view/header.dart
+++ b/lib/view/header.dart
@@ -5,72 +5,48 @@
 //  that can be found in the LICENSE file.
 //
 
-import 'package:autonomy_flutter/util/constants.dart';
-import 'package:autonomy_flutter/util/style.dart';
+import 'package:autonomy_theme/autonomy_theme.dart';
 import 'package:flutter/material.dart';
-import 'package:flutter_svg/flutter_svg.dart';
 
 class HeaderView extends StatelessWidget {
-  final double paddingTop;
-  final bool isWhite;
+  final String title;
+  final TextStyle? titleStyle;
   final Widget? action;
+  final EdgeInsets? padding;
 
-  const HeaderView(
-      {required this.paddingTop, super.key, this.isWhite = false, this.action});
+  const HeaderView({
+    required this.title,
+    this.titleStyle,
+    this.padding,
+    super.key,
+    this.action,
+  });
 
   @override
-  Widget build(BuildContext context) => Align(
-        alignment: Alignment.centerLeft,
-        child: Container(
-          padding: EdgeInsets.fromLTRB(0, paddingTop, 0, 40),
-          child: Column(
-            children: [
-              headDivider(),
-              const SizedBox(height: 7),
-              Row(
-                children: [
-                  Padding(
-                    padding: const EdgeInsets.only(left: 15),
-                    child: AutonomyLogo(
-                      isWhite: isWhite,
-                    ),
-                  ),
-                  const Spacer(),
-                  action ?? const SizedBox()
-                ],
-              ),
-            ],
-          ),
-        ),
-      );
-}
-
-class AutonomyLogo extends StatelessWidget {
-  final bool isWhite;
-
-  const AutonomyLogo({super.key, this.isWhite = false});
-
-  @override
-  Widget build(BuildContext context) => FutureBuilder<bool>(
-      // ignore: discarded_futures
-      future: logoState(),
-      builder: (context, snapshot) {
-        if (snapshot.data == null) {
-          return const SizedBox(height: 50);
-        }
-        return Row(
-          crossAxisAlignment: CrossAxisAlignment.start,
+  Widget build(BuildContext context) {
+    final theme = Theme.of(context);
+    final defaultStyle =
+        theme.textTheme.ppMori700White24.copyWith(fontSize: 36);
+    return Align(
+      alignment: Alignment.centerLeft,
+      child: Container(
+        padding: padding ?? const EdgeInsets.fromLTRB(12, 33, 12, 42),
+        child: Column(
           children: [
-            SvgPicture.asset(
-              isWhite
-                  ? 'assets/images/autonomy_icon_white.svg'
-                  : snapshot.data!
-                      ? 'assets/images/logo_dev.svg'
-                      : 'assets/images/penrose_moma.svg',
-              width: 50,
-              height: 50,
+            Row(
+              children: [
+                Expanded(
+                  child: Text(
+                    title,
+                    style: titleStyle ?? defaultStyle,
+                  ),
+                ),
+                action ?? const SizedBox()
+              ],
             ),
           ],
-        );
-      });
+        ),
+      ),
+    );
+  }
 }
diff --git a/lib/view/homepage_navigation_bar.dart b/lib/view/homepage_navigation_bar.dart
new file mode 100644
index 000000000..ce2073862
--- /dev/null
+++ b/lib/view/homepage_navigation_bar.dart
@@ -0,0 +1,83 @@
+import 'package:collection/collection.dart';
+import 'package:flutter/material.dart';
+
+class FFNavigationBarItem {
+  final Widget icon;
+  final Widget? unselectedIcon;
+  final String label;
+  final Color? selectedColor;
+  final Color? unselectedColor;
+
+  const FFNavigationBarItem({
+    required this.icon,
+    required this.label,
+    this.unselectedIcon,
+    this.selectedColor,
+    this.unselectedColor,
+  });
+}
+
+class FFNavigationBar extends StatefulWidget {
+  final List<FFNavigationBarItem> items;
+  final Color selectedItemColor;
+  final Color unselectedItemColor;
+  final Color backgroundColor;
+  final void Function(int selectedIndex) onSelectTab;
+  final int currentIndex;
+
+  const FFNavigationBar(
+      {required this.items,
+      required this.onSelectTab,
+      required this.selectedItemColor,
+      required this.unselectedItemColor,
+      required this.backgroundColor,
+      required this.currentIndex,
+      super.key});
+
+  @override
+  State<FFNavigationBar> createState() => _FFNavigationBarState();
+}
+
+class _FFNavigationBarState extends State<FFNavigationBar> {
+  @override
+  Widget build(BuildContext context) => Container(
+        decoration: BoxDecoration(
+          color: widget.backgroundColor,
+          borderRadius: BorderRadius.circular(50),
+        ),
+        padding: const EdgeInsets.symmetric(horizontal: 10),
+        child: IntrinsicWidth(
+          child: Row(
+              mainAxisAlignment: MainAxisAlignment.center,
+              children: widget.items
+                  .map((e) {
+                    final index = widget.items.indexOf(e);
+                    final isSelected = index == widget.currentIndex;
+                    return [
+                      GestureDetector(
+                        onTap: () {
+                          widget.onSelectTab(index);
+                        },
+                        child: Padding(
+                          padding: const EdgeInsets.symmetric(
+                              horizontal: 15, vertical: 10),
+                          child: IconTheme(
+                            data: IconThemeData(
+                              color: isSelected
+                                  ? e.selectedColor ?? widget.selectedItemColor
+                                  : e.unselectedColor ??
+                                      widget.unselectedItemColor,
+                            ),
+                            child: isSelected
+                                ? e.icon
+                                : e.unselectedIcon ?? e.icon,
+                          ),
+                        ),
+                      ),
+                    ];
+                  })
+                  .flattened
+                  .toList()),
+        ),
+      );
+}
diff --git a/lib/view/important_note_view.dart b/lib/view/important_note_view.dart
index dababa5e9..adcca4601 100644
--- a/lib/view/important_note_view.dart
+++ b/lib/view/important_note_view.dart
@@ -12,25 +12,25 @@ import 'package:flutter/material.dart';
 class ImportantNoteView extends StatelessWidget {
   final String note;
 
-  const ImportantNoteView({super.key, required this.note});
+  const ImportantNoteView({required this.note, super.key});
 
   @override
   Widget build(BuildContext context) {
     final theme = Theme.of(context);
     return Container(
-      decoration: BoxDecoration(
-        color: theme.auSuperTeal,
-        borderRadius: const BorderRadius.all(Radius.circular(5.0)),
+      decoration: const BoxDecoration(
+        color: AppColor.feralFileHighlight,
+        borderRadius: BorderRadius.all(Radius.circular(5)),
       ),
-      padding: const EdgeInsets.all(15.0),
+      padding: const EdgeInsets.all(15),
       child: Column(
         crossAxisAlignment: CrossAxisAlignment.start,
         children: [
           Text(
-            "important".tr(),
+            'important'.tr(),
             style: theme.textTheme.ppMori700Black14,
           ),
-          const SizedBox(height: 15.0),
+          const SizedBox(height: 15),
           Text(
             note,
             style: theme.textTheme.ppMori400Black14,
diff --git a/lib/view/modal_widget.dart b/lib/view/modal_widget.dart
index c4f3258bb..194d5880e 100644
--- a/lib/view/modal_widget.dart
+++ b/lib/view/modal_widget.dart
@@ -12,33 +12,30 @@ import 'package:flutter/material.dart';
 class ModalSheet extends StatelessWidget {
   final Widget child;
 
-  const ModalSheet({super.key, required this.child});
+  const ModalSheet({required this.child, super.key});
 
   @override
-  Widget build(BuildContext context) {
-    final theme = Theme.of(context);
-    return Container(
-      color: theme.auSuperTeal,
-      child: Column(
-        mainAxisSize: MainAxisSize.min,
-        children: [
-          Align(
-            alignment: Alignment.centerRight,
-            child: IconButton(
-              onPressed: () => Navigator.pop(context),
-              icon: const Icon(
-                AuIcon.close,
-                size: 18,
+  Widget build(BuildContext context) => Container(
+        color: AppColor.feralFileHighlight,
+        child: Column(
+          mainAxisSize: MainAxisSize.min,
+          children: [
+            Align(
+              alignment: Alignment.centerRight,
+              child: IconButton(
+                onPressed: () => Navigator.pop(context),
+                icon: const Icon(
+                  AuIcon.close,
+                  size: 18,
+                ),
               ),
             ),
-          ),
-          const SizedBox(height: 32),
-          Padding(
-            padding: const EdgeInsets.symmetric(horizontal: 16.0),
-            child: child,
-          ),
-        ],
-      ),
-    );
-  }
+            const SizedBox(height: 32),
+            Padding(
+              padding: const EdgeInsets.symmetric(horizontal: 16),
+              child: child,
+            ),
+          ],
+        ),
+      );
 }
diff --git a/lib/view/note_view.dart b/lib/view/note_view.dart
new file mode 100644
index 000000000..5639aff9b
--- /dev/null
+++ b/lib/view/note_view.dart
@@ -0,0 +1,69 @@
+import 'package:autonomy_flutter/model/ff_exhibition.dart';
+import 'package:autonomy_theme/autonomy_theme.dart';
+import 'package:easy_localization/easy_localization.dart';
+import 'package:flutter/material.dart';
+import 'package:flutter_widget_from_html/flutter_widget_from_html.dart';
+
+class ExhibitionNoteView extends StatelessWidget {
+  const ExhibitionNoteView(
+      {required this.exhibition,
+      this.width,
+      super.key,
+      this.onReadMore,
+      this.isFull = false});
+
+  final Exhibition exhibition;
+  final double? width;
+  final Function? onReadMore;
+  final bool isFull;
+
+  @override
+  Widget build(BuildContext context) {
+    final theme = Theme.of(context);
+    final text = isFull ? exhibition.note : exhibition.noteBrief;
+    return Container(
+      width: width,
+      padding: const EdgeInsets.all(14),
+      decoration: BoxDecoration(
+        borderRadius: BorderRadius.circular(8),
+        color: AppColor.auGreyBackground,
+      ),
+      child: Column(
+        mainAxisSize: MainAxisSize.min,
+        crossAxisAlignment: CrossAxisAlignment.start,
+        children: [
+          Text(
+            'curators_note'.tr(),
+            style: theme.textTheme.ppMori400White12,
+          ),
+          const SizedBox(height: 30),
+          Text(
+            exhibition.noteTitle,
+            style: theme.textTheme.ppMori700White14,
+          ),
+          const SizedBox(height: 20),
+          ConstrainedBox(
+            constraints:
+                BoxConstraints(maxHeight: isFull ? double.infinity : 400),
+            child: HtmlWidget(
+              text,
+              textStyle: theme.textTheme.ppMori400White14,
+            ),
+          ),
+          const SizedBox(height: 20),
+          if (onReadMore != null)
+            GestureDetector(
+              onTap: () async {
+                await onReadMore!();
+              },
+              child: Text(
+                'read_more'.tr(),
+                style: theme.textTheme.ppMori400White14
+                    .copyWith(decoration: TextDecoration.underline),
+              ),
+            ),
+        ],
+      ),
+    );
+  }
+}
diff --git a/lib/view/number_picker.dart b/lib/view/number_picker.dart
deleted file mode 100644
index 3b5dd0cfd..000000000
--- a/lib/view/number_picker.dart
+++ /dev/null
@@ -1,109 +0,0 @@
-import 'package:autonomy_theme/autonomy_theme.dart';
-import 'package:easy_localization/easy_localization.dart';
-import 'package:flutter/material.dart';
-
-class NumberPicker extends StatefulWidget {
-  final double value;
-  final Function(double) onChange;
-  final double min;
-  final double max;
-  final int divisions;
-  final TextStyle? selectedStyle;
-  final TextStyle? unselectedStyle;
-
-  const NumberPicker({
-    Key? key,
-    required this.value,
-    required this.onChange,
-    required this.min,
-    required this.max,
-    required this.divisions,
-    this.selectedStyle,
-    this.unselectedStyle,
-  }) : super(key: key);
-
-  @override
-  State<NumberPicker> createState() => _NumberPickerState();
-}
-
-class _NumberPickerState extends State<NumberPicker> {
-  late double _selectedValue;
-  @override
-  void initState() {
-    _selectedValue = widget.value;
-    super.initState();
-  }
-
-  @override
-  Widget build(BuildContext context) {
-    return _numberSlide(
-      context: context,
-      value: _selectedValue,
-      onChange: widget.onChange,
-      min: widget.min,
-      max: widget.max,
-      divisions: widget.divisions,
-      selectedStyle: widget.selectedStyle,
-      unselectedStyle: widget.unselectedStyle,
-    );
-  }
-
-  Widget _numberSlide({
-    required BuildContext context,
-    required double value,
-    required Function(double) onChange,
-    required double min,
-    required double max,
-    required int divisions,
-    TextStyle? selectedStyle,
-    TextStyle? unselectedStyle,
-  }) {
-    final theme = Theme.of(context);
-    final numberFormater = NumberFormat('00');
-    return Column(
-      children: [
-        SliderTheme(
-          data: const SliderThemeData(
-            trackHeight: 4.0,
-            thumbShape: RoundSliderThumbShape(enabledThumbRadius: 12.0),
-            overlayShape: RoundSliderOverlayShape(overlayRadius: 20.0),
-            rangeThumbShape: RoundRangeSliderThumbShape(
-              enabledThumbRadius: 12.0,
-            ),
-          ),
-          child: Slider(
-              value: value,
-              onChanged: (value) {
-                onChange(value);
-                setState(() {
-                  _selectedValue = value;
-                });
-              },
-              divisions: divisions,
-              min: 12,
-              max: 18,
-              activeColor: Colors.black.withOpacity(0.2),
-              inactiveColor: Colors.black.withOpacity(0.2),
-              thumbColor: Colors.black,
-              overlayColor: MaterialStateColor.resolveWith(
-                (states) => Colors.transparent,
-              )),
-        ),
-        Row(
-          mainAxisAlignment: MainAxisAlignment.spaceBetween,
-          //list from a to b
-          children:
-              List.generate(divisions + 1, (index) => index + min).map((e) {
-            return Text(
-              '${numberFormater.format(e)} pt',
-              style: (e == value)
-                  ? (selectedStyle ?? theme.textTheme.ppMori400SupperTeal12)
-                  : (unselectedStyle ?? theme.textTheme.ppMori400White12),
-            );
-          }).toList(),
-        ),
-        const SizedBox(height: 50),
-      ],
-    );
-  }
-}
diff --git a/lib/view/primary_button.dart b/lib/view/primary_button.dart
index 773893256..6d46e5343 100644
--- a/lib/view/primary_button.dart
+++ b/lib/view/primary_button.dart
@@ -5,33 +5,40 @@ import 'package:flutter/material.dart';
 class PrimaryButton extends StatelessWidget {
   final Function()? onTap;
   final Color? color;
+  final Color? disabledColor;
   final String? text;
+  final Color? textColor;
   final double? width;
   final bool isProcessing;
   final bool enabled;
+  final Color? indicatorColor;
 
   const PrimaryButton({
     super.key,
     this.onTap,
     this.color,
+    this.disabledColor,
     this.text,
+    this.textColor,
     this.width,
     this.enabled = true,
     this.isProcessing = false,
+    this.indicatorColor,
   });
 
   @override
   Widget build(BuildContext context) {
     final theme = Theme.of(context);
+    final disabledColor = this.disabledColor ?? theme.auLightGrey;
     return SizedBox(
       width: width,
       child: ElevatedButton(
         style: ElevatedButton.styleFrom(
           backgroundColor:
-              enabled ? color ?? theme.auSuperTeal : theme.auLightGrey,
+              enabled ? color ?? AppColor.feralFileHighlight : disabledColor,
           shadowColor: Colors.transparent,
-          disabledForegroundColor: theme.auLightGrey,
-          disabledBackgroundColor: theme.auLightGrey,
+          disabledForegroundColor: disabledColor,
+          disabledBackgroundColor: disabledColor,
           shape: RoundedRectangleBorder(
             borderRadius: BorderRadius.circular(32),
           ),
@@ -49,7 +56,7 @@ class PrimaryButton extends StatelessWidget {
                     width: 14,
                     margin: const EdgeInsets.only(right: 8),
                     child: CircularProgressIndicator(
-                      color: theme.colorScheme.primary,
+                      color: indicatorColor ?? theme.colorScheme.primary,
                       backgroundColor: theme.colorScheme.surface,
                       strokeWidth: 2,
                     ),
@@ -58,7 +65,8 @@ class PrimaryButton extends StatelessWidget {
                   const SizedBox(),
                 Text(
                   text ?? '',
-                  style: theme.textTheme.ppMori400Black14,
+                  style: theme.textTheme.ppMori400Black14
+                      .copyWith(color: textColor),
                 ),
               ],
             ),
diff --git a/lib/view/search_bar.dart b/lib/view/search_bar.dart
new file mode 100644
index 000000000..88389b878
--- /dev/null
+++ b/lib/view/search_bar.dart
@@ -0,0 +1,156 @@
+import 'dart:async';
+
+import 'package:autonomy_flutter/util/au_icons.dart';
+import 'package:autonomy_theme/autonomy_theme.dart';
+import 'package:easy_localization/easy_localization.dart';
+import 'package:flutter/material.dart';
+import 'package:flutter_svg/svg.dart';
+
+class AuSearchBar extends StatefulWidget {
+  final Function(String)? onChanged;
+  final Function(String)? onSearch;
+  final Function(String)? onClear;
+
+  const AuSearchBar({super.key, this.onChanged, this.onSearch, this.onClear});
+
+  @override
+  State<AuSearchBar> createState() => _SearchBarState();
+}
+
+class _SearchBarState extends State<AuSearchBar> {
+  final _controller = TextEditingController();
+  final _focusNode = FocusNode();
+  bool _isSearching = false;
+  Timer? _timer;
+
+  @override
+  void initState() {
+    super.initState();
+    _focusNode.requestFocus();
+  }
+
+  @override
+  void dispose() {
+    _timer?.cancel();
+    _controller.dispose();
+    _focusNode.dispose();
+    super.dispose();
+  }
+
+  @override
+  Widget build(BuildContext context) {
+    final theme = Theme.of(context);
+
+    return Container(
+      decoration: BoxDecoration(
+        color: AppColor.auLightGrey,
+        borderRadius: BorderRadius.circular(5),
+      ),
+      padding: const EdgeInsets.symmetric(horizontal: 10),
+      child: Row(
+        children: [
+          SvgPicture.asset(
+            'assets/images/search.svg',
+            width: 14,
+            height: 14,
+            colorFilter: const ColorFilter.mode(
+                AppColor.secondarySpanishGrey, BlendMode.srcIn),
+          ),
+          const SizedBox(width: 10),
+          Expanded(
+            child: Center(
+              child: TextField(
+                controller: _controller,
+                focusNode: _focusNode,
+                style: theme.textTheme.ppMori400Black14,
+                cursorColor: AppColor.primaryBlack,
+                cursorWidth: 0.5,
+                cursorHeight: 17,
+                decoration: InputDecoration(
+                  // contentPadding: const EdgeInsets.only(bottom: 10),
+                  hintText: 'search'.tr(),
+                  hintStyle: theme.textTheme.ppMori400Grey14
+                      .copyWith(color: AppColor.secondarySpanishGrey),
+                  border: InputBorder.none,
+                ),
+                onChanged: (value) {
+                  widget.onChanged?.call(value);
+                  if (value.isNotEmpty) {
+                    setState(() {
+                      _isSearching = true;
+                    });
+                  } else {
+                    setState(() {
+                      _isSearching = false;
+                    });
+                  }
+                  _timer?.cancel();
+                  _timer = Timer(const Duration(milliseconds: 300), () {
+                    widget.onSearch?.call(value);
+                  });
+                },
+                onSubmitted: (value) {
+                  widget.onSearch?.call(value);
+                },
+              ),
+            ),
+          ),
+          const SizedBox(width: 10),
+          if (_isSearching)
+            GestureDetector(
+              onTap: () {
+                _controller.clear();
+                widget.onClear?.call('');
+                widget.onChanged?.call('');
+              },
+              child: const Icon(
+                AuIcon.close,
+                size: 14,
+                color: AppColor.primaryBlack,
+              ),
+            ),
+        ],
+      ),
+    );
+  }
+}
+
+class ActionBar extends StatefulWidget {
+  final AuSearchBar searchBar;
+  final Function()? onCancel;
+
+  const ActionBar({required this.searchBar, super.key, this.onCancel});
+
+  @override
+  State<ActionBar> createState() => _ActionBarState();
+}
+
+class _ActionBarState extends State<ActionBar> {
+  @override
+  void initState() {
+    super.initState();
+  }
+
+  @override
+  Widget build(BuildContext context) {
+    final theme = Theme.of(context);
+    return Row(
+      mainAxisSize: MainAxisSize.min,
+      children: [
+        Expanded(
+          child: widget.searchBar,
+        ),
+        const SizedBox(width: 14),
+        GestureDetector(
+          onTap: () {
+            widget.onCancel?.call();
+          },
+          child: Text(
+            'Cancel',
+            style: theme.textTheme.ppMori400Grey14,
+          ),
+        )
+      ],
+    );
+  }
+}
diff --git a/lib/view/series_title_view.dart b/lib/view/series_title_view.dart
new file mode 100644
index 000000000..9cf397b41
--- /dev/null
+++ b/lib/view/series_title_view.dart
@@ -0,0 +1,35 @@
+import 'package:autonomy_flutter/model/ff_series.dart';
+import 'package:autonomy_flutter/model/ff_user.dart';
+import 'package:autonomy_theme/autonomy_theme.dart';
+import 'package:flutter/material.dart';
+
+class SeriesTitleView extends StatelessWidget {
+  const SeriesTitleView(
+      {required this.series, super.key, this.crossAxisAlignment, this.artist});
+
+  final FFSeries series;
+  final FFArtist? artist;
+  final CrossAxisAlignment? crossAxisAlignment;
+
+  @override
+  Widget build(BuildContext context) {
+    final theme = Theme.of(context);
+    return Column(
+      crossAxisAlignment: crossAxisAlignment ?? CrossAxisAlignment.start,
+      children: [
+        Text(
+          artist?.alias ?? '',
+          style: theme.textTheme.ppMori400White14,
+        ),
+        const SizedBox(height: 3),
+        Text(
+          series.title,
+          style: theme.textTheme.ppMori700White14.copyWith(
+            fontStyle: FontStyle.italic,
+          ),
+          maxLines: 2,
+        ),
+      ],
+    );
+  }
+}
diff --git a/lib/view/tip_card.dart b/lib/view/tip_card.dart
index e90f79fa1..a1f422e9f 100644
--- a/lib/view/tip_card.dart
+++ b/lib/view/tip_card.dart
@@ -1,3 +1,5 @@
+import 'dart:async';
+
 import 'package:autonomy_flutter/common/injector.dart';
 import 'package:autonomy_flutter/service/metric_client_service.dart';
 import 'package:autonomy_flutter/util/constants.dart';
@@ -15,12 +17,12 @@ class Tipcard extends StatelessWidget {
   final ValueNotifier<bool> listener;
 
   const Tipcard({
-    super.key,
     required this.titleText,
-    this.onPressed,
-    this.buttonText,
     required this.content,
     required this.listener,
+    super.key,
+    this.onPressed,
+    this.buttonText,
     this.onClosed,
   });
 
@@ -31,66 +33,64 @@ class Tipcard extends StatelessWidget {
 
     return ValueListenableBuilder<bool>(
       valueListenable: listener,
-      builder: (context, value, Widget? child) {
-        return value
-            ? Container(
-                padding:
-                    const EdgeInsets.symmetric(horizontal: 15, vertical: 15),
-                decoration: BoxDecoration(
-                  color: AppColor.auSuperTeal,
-                  borderRadius: BorderRadius.circular(10),
-                ),
-                child: Column(
-                  crossAxisAlignment: CrossAxisAlignment.start,
-                  children: <Widget>[
-                    Row(
-                      mainAxisAlignment: MainAxisAlignment.spaceBetween,
-                      children: <Widget>[
-                        Text(titleText,
-                            style: theme.textTheme.ppMori700Black14),
-                        const Spacer(),
-                        IconButton(
-                          padding: EdgeInsets.zero,
-                          constraints:
-                              const BoxConstraints(minWidth: 16, minHeight: 16),
-                          icon: const Icon(
-                            Icons.close,
-                          ),
-                          color: AppColor.primaryBlack,
-                          onPressed: () {
-                            if (onClosed != null) onClosed!();
-                            metricClient
-                                .addEvent(MixpanelEvent.closeTipcard, data: {
-                              'title': titleText,
-                            });
-                            listener.value = false;
-                          },
+      builder: (context, value, Widget? child) => value
+          ? Container(
+              padding: const EdgeInsets.symmetric(horizontal: 15, vertical: 15),
+              decoration: BoxDecoration(
+                color: AppColor.feralFileHighlight,
+                borderRadius: BorderRadius.circular(10),
+              ),
+              child: Column(
+                crossAxisAlignment: CrossAxisAlignment.start,
+                children: <Widget>[
+                  Row(
+                    mainAxisAlignment: MainAxisAlignment.spaceBetween,
+                    children: <Widget>[
+                      Text(titleText, style: theme.textTheme.ppMori700Black14),
+                      const Spacer(),
+                      IconButton(
+                        padding: EdgeInsets.zero,
+                        constraints:
+                            const BoxConstraints(minWidth: 16, minHeight: 16),
+                        icon: const Icon(
+                          Icons.close,
                         ),
-                      ],
-                    ),
+                        color: AppColor.primaryBlack,
+                        onPressed: () {
+                          if (onClosed != null) {
+                            onClosed!();
+                          }
+                          unawaited(metricClient
+                              .addEvent(MixpanelEvent.closeTipcard, data: {
+                            'title': titleText,
+                          }));
+                          listener.value = false;
+                        },
+                      ),
+                    ],
+                  ),
+                  const SizedBox(height: 15),
+                  content,
+                  if (buttonText != null || onPressed != null) ...[
                     const SizedBox(height: 15),
-                    content,
-                    if (buttonText != null || onPressed != null) ...[
-                      const SizedBox(height: 15),
-                      OutlineButton(
-                          color: AppColor.auSuperTeal,
-                          textColor: AppColor.primaryBlack,
-                          borderColor: AppColor.primaryBlack,
-                          text: buttonText ?? "close".tr(),
-                          onTap: () {
-                            () {};
-                            metricClient
-                                .addEvent(MixpanelEvent.pressTipcard, data: {
-                              'title': titleText,
-                            });
-                            listener.value = false;
-                          }),
-                    ]
-                  ],
-                ),
-              )
-            : const SizedBox();
-      },
+                    OutlineButton(
+                        color: AppColor.feralFileHighlight,
+                        textColor: AppColor.primaryBlack,
+                        borderColor: AppColor.primaryBlack,
+                        text: buttonText ?? 'close'.tr(),
+                        onTap: () {
+                          () {};
+                          unawaited(metricClient
+                              .addEvent(MixpanelEvent.pressTipcard, data: {
+                            'title': titleText,
+                          }));
+                          listener.value = false;
+                        }),
+                  ]
+                ],
+              ),
+            )
+          : const SizedBox(),
     );
   }
 }
diff --git a/pubspec.lock b/pubspec.lock
index efb9ff3ce..4b667410b 100644
--- a/pubspec.lock
+++ b/pubspec.lock
@@ -93,8 +93,8 @@ packages:
     dependency: "direct main"
     description:
       path: "."
-      ref: "144b94a396e78841a74b353d22e9e94b5e279ce1"
-      resolved-ref: "144b94a396e78841a74b353d22e9e94b5e279ce1"
+      ref: c667b128bf647ed2ece6f275b21a77839da434f2
+      resolved-ref: c667b128bf647ed2ece6f275b21a77839da434f2
       url: "https://github.com/bitmark-inc/autonomy-client-shared-theme.git"
     source: git
     version: "0.0.1+20"
@@ -780,10 +780,10 @@ packages:
     dependency: "direct main"
     description:
       name: flutter_keyboard_visibility
-      sha256: "4983655c26ab5b959252ee204c2fffa4afeb4413cd030455194ec0caa3b8e7cb"
+      sha256: "98664be7be0e3ffca00de50f7f6a287ab62c763fc8c762e0a21584584a3ff4f8"
       url: "https://pub.dev"
     source: hosted
-    version: "5.4.1"
+    version: "6.0.0"
   flutter_keyboard_visibility_linux:
     dependency: transitive
     description:
@@ -1742,8 +1742,8 @@ packages:
     dependency: "direct main"
     description:
       path: "."
-      ref: a5cb97d342b95819b6a9ca03262bde5b8a541b17
-      resolved-ref: a5cb97d342b95819b6a9ca03262bde5b8a541b17
+      ref: "8576446fd7ef71a202dbed054ee42b8d01d61b06"
+      resolved-ref: "8576446fd7ef71a202dbed054ee42b8d01d61b06"
       url: "https://github.com/autonomy-system/nft-collection"
     source: git
     version: "0.0.1"
diff --git a/pubspec.yaml b/pubspec.yaml
index 334a93f1c..03a4e8f0b 100644
--- a/pubspec.yaml
+++ b/pubspec.yaml
@@ -66,7 +66,7 @@ dependencies:
   infinite_scroll_pagination: ^3.2.0
   intl: ^0.18.0
   jiffy: ^6.2.1
-  flutter_keyboard_visibility: ^5.4.1
+  flutter_keyboard_visibility: ^6.0.0
   libauk_dart:
     git:
       url: https://github.com/autonomy-system/libauk-dart.git
@@ -114,7 +114,7 @@ dependencies:
   autonomy_theme:
     git:
       url: https://github.com/bitmark-inc/autonomy-client-shared-theme.git
-      ref: 144b94a396e78841a74b353d22e9e94b5e279ce1
+      ref: c667b128bf647ed2ece6f275b21a77839da434f2
   marqueer: ^1.2.0
   markdown: ^7.1.1
   easy_localization: ^3.0.1
@@ -123,7 +123,7 @@ dependencies:
   nft_collection:
     git:
       url: https://github.com/autonomy-system/nft-collection
-      ref: a5cb97d342b95819b6a9ca03262bde5b8a541b17
+      ref: 8576446fd7ef71a202dbed054ee42b8d01d61b06
   autonomy_tv_proto:
     git:
       url: https://github.com/autonomy-system/autonomy-tv-proto-communication
@@ -242,6 +242,10 @@ flutter:
       fonts:
         - asset: assets/fonts/AuIcon.ttf
 
+    - family: FFIcon
+      fonts:
+        - asset: assets/fonts/FFIcon.ttf
+
     - family: MoMASans
       fonts:
         - asset: assets/fonts/MoMASans/MoMA-Sans-Bold.otf
diff --git a/test/generate_mock/service/mock_configuration_service.mocks.dart b/test/generate_mock/service/mock_configuration_service.mocks.dart
index ff6ac9594..100e88a27 100644
--- a/test/generate_mock/service/mock_configuration_service.mocks.dart
+++ b/test/generate_mock/service/mock_configuration_service.mocks.dart
@@ -526,12 +526,16 @@ class MockConfigurationService extends _i1.Mock
   _i6.Future<void> setPlayList(
     List<_i10.PlayListModel>? value, {
     bool? override = false,
+    _i5.ConflictAction? onConflict = _i5.ConflictAction.abort,
   }) =>
       (super.noSuchMethod(
         Invocation.method(
           #setPlayList,
           [value],
-          {#override: override},
+          {
+            #override: override,
+            #onConflict: onConflict,
+          },
         ),
         returnValue: _i6.Future<void>.value(),
         returnValueForMissingStub: _i6.Future<void>.value(),
@@ -1004,4 +1008,12 @@ class MockConfigurationService extends _i1.Mock
         ),
         returnValue: false,
       ) as bool);
+  @override
+  List<String> getHiddenOrSentTokenIDs() => (super.noSuchMethod(
+        Invocation.method(
+          #getHiddenOrSentTokenIDs,
+          [],
+        ),
+        returnValue: <String>[],
+      ) as List<String>);
 }
diff --git a/test/generate_mock/service/mock_indexer_service.mocks.dart b/test/generate_mock/service/mock_indexer_service.mocks.dart
index 30eb3b538..9e41995ff 100644
--- a/test/generate_mock/service/mock_indexer_service.mocks.dart
+++ b/test/generate_mock/service/mock_indexer_service.mocks.dart
@@ -23,9 +23,8 @@ import 'package:nft_collection/services/indexer_service.dart' as _i3;
 // ignore_for_file: camel_case_types
 // ignore_for_file: subtype_of_sealed_class
 
-class _FakeBlockchainIdentity_0 extends _i1.SmartFake
-    implements _i2.BlockchainIdentity {
-  _FakeBlockchainIdentity_0(
+class _FakeIdentity_0 extends _i1.SmartFake implements _i2.Identity {
+  _FakeIdentity_0(
     Object parent,
     Invocation parentInvocation,
   ) : super(
@@ -53,20 +52,18 @@ class MockIndexerService extends _i1.Mock implements _i3.IndexerService {
         returnValue: _i4.Future<List<_i5.AssetToken>>.value(<_i5.AssetToken>[]),
       ) as _i4.Future<List<_i5.AssetToken>>);
   @override
-  _i4.Future<_i2.BlockchainIdentity> getIdentity(
-          _i7.QueryIdentityRequest? request) =>
+  _i4.Future<_i2.Identity> getIdentity(_i7.QueryIdentityRequest? request) =>
       (super.noSuchMethod(
         Invocation.method(
           #getIdentity,
           [request],
         ),
-        returnValue:
-            _i4.Future<_i2.BlockchainIdentity>.value(_FakeBlockchainIdentity_0(
+        returnValue: _i4.Future<_i2.Identity>.value(_FakeIdentity_0(
           this,
           Invocation.method(
             #getIdentity,
             [request],
           ),
         )),
-      ) as _i4.Future<_i2.BlockchainIdentity>);
+      ) as _i4.Future<_i2.Identity>);
 }
diff --git a/test/generate_mock/service/mock_navigation_service.mocks.dart b/test/generate_mock/service/mock_navigation_service.mocks.dart
index 0c60b6235..34947392a 100644
--- a/test/generate_mock/service/mock_navigation_service.mocks.dart
+++ b/test/generate_mock/service/mock_navigation_service.mocks.dart
@@ -5,7 +5,7 @@
 // ignore_for_file: no_leading_underscores_for_library_prefixes
 import 'dart:async' as _i4;
 
-import 'package:autonomy_flutter/model/ff_account.dart' as _i6;
+import 'package:autonomy_flutter/model/ff_series.dart' as _i6;
 import 'package:autonomy_flutter/model/otp.dart' as _i7;
 import 'package:autonomy_flutter/screen/claim/activation/claim_activation_page.dart'
     as _i8;