Improve the profile preview with "swipe up to view" and local cache optimization (#1096)

* Update the ProfilePreview to use a swipe-up to navigate

* Use the profile cache to optimize load performance

* Hack to align the header in the profile preview against the screen view

* Fix profiles cache logic to ensure cache is used

* Fix dark mode on profile preview

1 files changed, 24 insertions, 2 deletions

diff --git a/src/state/models/content/profile.ts b/src/state/models/content/profile.ts
index c4cbe6d44..2ea4ada6e 100644
--- a/src/state/models/content/profile.ts
+++ b/src/state/models/content/profile.ts
@@ -103,7 +103,12 @@ export class ProfileModel {
   // =
 
   async setup() {
-    await this._load()
+    const precache = await this.rootStore.profiles.cache.get(this.params.actor)
+    if (precache) {
+      await this._loadWithCache(precache)
+    } else {
+      await this._load()
+    }
   }
 
   async refresh() {
@@ -252,7 +257,7 @@ export class ProfileModel {
     this._xLoading(isRefreshing)
     try {
       const res = await this.rootStore.agent.getProfile(this.params)
-      this.rootStore.profiles.overwrite(this.params.actor, res) // cache invalidation
+      this.rootStore.profiles.overwrite(this.params.actor, res)
       if (res.data.handle) {
         this.rootStore.handleResolutions.cache.set(
           res.data.handle,
@@ -267,6 +272,23 @@ export class ProfileModel {
     }
   }
 
+  async _loadWithCache(precache: GetProfile.Response) {
+    // use cached value
+    this._replaceAll(precache)
+    await this._createRichText()
+    this._xIdle()
+
+    // fetch latest
+    try {
+      const res = await this.rootStore.agent.getProfile(this.params)
+      this.rootStore.profiles.overwrite(this.params.actor, res) // cache invalidation
+      this._replaceAll(res)
+      await this._createRichText()
+    } catch (e: any) {
+      this._xIdle(e)
+    }
+  }
+
   _replaceAll(res: GetProfile.Response) {
     this.did = res.data.did
     this.handle = res.data.handle