Fix updating photo

src/components/peerProfile.ts

@@ -228,6 +228,15 @@ export default class PeerProfile {
       }
     });
 
+    listenerSetter.add(rootScope)('avatar_update', (peerId) => {
+      if(this.peerId === peerId) {
+        // const photo = appPeersManager.getPeerPhoto(peerId);
+        // if(!photo && this.avatars) {
+          this.setAvatar();
+        // }
+      }
+    });
+
     this.setPeerStatusInterval = window.setInterval(this.setPeerStatus, 60e3);
   }
 
@@ -293,6 +302,7 @@ export default class PeerProfile {
 
     if(this.avatars) {
       this.avatars.container.remove();
+      this.avatars.cleanup();
       this.avatars = undefined;
     }
 

src/components/peerProfileAvatars.ts

@@ -9,6 +9,7 @@ import { IS_TOUCH_SUPPORTED } from "../environment/touchSupport";
 import { cancelEvent } from "../helpers/dom/cancelEvent";
 import { attachClickEvent } from "../helpers/dom/clickEvent";
 import filterChatPhotosMessages from "../helpers/filterChatPhotosMessages";
+import ListenerSetter from "../helpers/listenerSetter";
 import ListLoader from "../helpers/listLoader";
 import { fastRaf } from "../helpers/schedulers";
 import { Message, ChatFull, MessageAction, Photo } from "../layer";
@@ -17,6 +18,7 @@ import appMessagesManager, { AppMessagesManager } from "../lib/appManagers/appMe
 import appPeersManager from "../lib/appManagers/appPeersManager";
 import appPhotosManager from "../lib/appManagers/appPhotosManager";
 import appProfileManager from "../lib/appManagers/appProfileManager";
+import rootScope from "../lib/rootScope";
 import { openAvatarViewer } from "./avatar";
 import Scrollable from "./scrollable";
 import SwipeHandler from "./swipeHandler";
@@ -38,7 +40,9 @@ export default class PeerProfileAvatars {
   private listLoader: ListLoader<Photo.photo['id'] | Message.messageService, Photo.photo['id'] | Message.messageService>;
   private peerId: PeerId;
   private intersectionObserver: IntersectionObserver;
-  private loadCallbacks: Map<Element, () => void> = new Map();
+  private loadCallbacks: Map<Element, () => void>;
+  private listenerSetter: ListenerSetter;
+  private swipeHandler: SwipeHandler;
 
   constructor(public scrollable: Scrollable) {
     this.container = document.createElement('div');
@@ -72,6 +76,9 @@ export default class PeerProfileAvatars {
 
     this.container.append(this.avatars, this.gradient, this.info, this.tabs, this.arrowPrevious, this.arrowNext);
 
+    this.loadCallbacks = new Map();
+    this.listenerSetter = new ListenerSetter();
+
     const checkScrollTop = () => {
       if(this.scrollable.scrollTop !== 0) {
         this.scrollable.scrollIntoViewNew({
@@ -148,7 +155,7 @@ export default class PeerProfileAvatars {
           });
         // });
       }
-    });
+    }, {listenerSetter: this.listenerSetter});
 
     const cancelNextClick = () => {
       cancel = true;
@@ -158,7 +165,7 @@ export default class PeerProfileAvatars {
     };
 
     let width = 0, x = 0, lastDiffX = 0, lastIndex = 0, minX = 0;
-    const swipeHandler = new SwipeHandler({
+    const swipeHandler = this.swipeHandler = new SwipeHandler({
       element: this.avatars, 
       onSwipe: (xDiff, yDiff) => {
         lastDiffX = xDiff;
@@ -219,6 +226,20 @@ export default class PeerProfileAvatars {
         this.loadNearestToTarget(entry.target);
       });
     });
+
+    /* this.listenerSetter.add(rootScope)('avatar_update', (peerId) => {
+      if(this.peerId === peerId) {
+        const photo = appPeersManager.getPeerPhoto(peerId);
+        if(photo) {
+          const id = photo.photo_id;
+          const previous = this.listLoader.previous;
+          for(let i = 0; i < previous.length; ++i) {
+            if(previous[i] === id)
+          }
+          this.listLoader.previous.forEach((_id, idx, arr) => {});
+        }
+      }
+    }); */
   }
 
   public setPeer(peerId: PeerId) {
@@ -380,4 +401,9 @@ export default class PeerProfileAvatars {
       }
     });
   }
+
+  public cleanup() {
+    this.listenerSetter.removeAll();
+    this.swipeHandler.removeListeners();
+  }
 }

src/components/sidebarLeft/tabs/settings.ts

@@ -79,19 +79,28 @@ export default class AppSettingsTab extends SliderSuperTab {
     this.profile.setPeer(rootScope.myId);
     this.profile.fillProfileElements();
 
-    const user = appUsersManager.getSelf();
+    const changeAvatarBtn = Button('btn-circle btn-corner z-depth-1 profile-change-avatar', {icon: 'cameraadd'});
-    if(user.photo?._ === 'userProfilePhoto') {
+    changeAvatarBtn.addEventListener('click', () => {
-      const changeAvatarBtn = Button('btn-circle btn-corner z-depth-1 profile-change-avatar', {icon: 'cameraadd'});
+      const canvas = document.createElement('canvas');
-      changeAvatarBtn.addEventListener('click', () => {
+      new PopupAvatar().open(canvas, (upload) => {
-        const canvas = document.createElement('canvas');
+        upload().then(inputFile => {
-        new PopupAvatar().open(canvas, (upload) => {
+          return appProfileManager.uploadProfilePhoto(inputFile);
-          upload().then(inputFile => {
-            return appProfileManager.uploadProfilePhoto(inputFile);
-          });
         });
       });
-      this.profile.element.lastElementChild.firstElementChild.append(changeAvatarBtn);
+    });
-    }
+    this.profile.element.lastElementChild.firstElementChild.append(changeAvatarBtn);
+    
+    const updateChangeAvatarBtn = () => {
+      const user = appUsersManager.getSelf();
+      changeAvatarBtn.classList.toggle('hide', user.photo?._ !== 'userProfilePhoto');
+    };
+    
+    updateChangeAvatarBtn();
+    this.listenerSetter.add(rootScope)('avatar_update', (peerId) => {
+      if(rootScope.myId === peerId) {
+        updateChangeAvatarBtn();
+      }
+    });
 
     /* const div = document.createElement('div');
     //div.style.cssText = 'border-radius: 8px; overflow: hidden; width: 396px; height: 264px; flex: 0 0 auto; position: relative; margin: 10rem 0 10rem auto;';

src/helpers/listLoader.ts

@@ -51,6 +51,17 @@ export default class ListLoader<T extends {}, P extends {}> {
     return this.count !== undefined ? this.previous.length : -1;
   }
 
+  /* public filter(callback: (item: T, idx: number, arr: T[]) => boolean) {
+    const filter = (item: T, idx: number, arr: T[]) => {
+      if(!callback(item, idx, arr)) {
+        arr.splice(idx, 1);
+      }
+    };
+
+    forEachReverse(this.previous, filter);
+    forEachReverse(this.next, filter);
+  } */
+
   public reset(loadedAll = false) {
     this.current = undefined;
     this.previous = [];

src/lib/appManagers/appProfileManager.ts

@@ -12,7 +12,7 @@
 import { MOUNT_CLASS_TO } from "../../config/debug";
 import { tsNow } from "../../helpers/date";
 import { numberThousandSplitter } from "../../helpers/number";
-import { ChannelParticipantsFilter, ChannelsChannelParticipants, ChannelParticipant, Chat, ChatFull, ChatParticipants, ChatPhoto, ExportedChatInvite, InputChannel, InputFile, SendMessageAction, Update, UserFull } from "../../layer";
+import { ChannelParticipantsFilter, ChannelsChannelParticipants, ChannelParticipant, Chat, ChatFull, ChatParticipants, ChatPhoto, ExportedChatInvite, InputChannel, InputFile, SendMessageAction, Update, UserFull, Photo, PhotoSize } from "../../layer";
 import { LangPackKey, i18n } from "../langPack";
 //import apiManager from '../mtproto/apiManager';
 import apiManager from '../mtproto/mtprotoworker';
@@ -527,6 +527,23 @@ export class AppProfileManager {
     return apiManager.invokeApi('photos.uploadProfilePhoto', {
       file: inputFile
     }).then((updateResult) => {
+      // ! sometimes can have no user in users
+      const photo = updateResult.photo as Photo.photo;
+      if(!updateResult.users.length) {
+        const strippedThumb = photo.sizes.find(size => size._ === 'photoStrippedSize') as PhotoSize.photoStrippedSize;
+        updateResult.users.push({
+          ...appUsersManager.getSelf(), 
+          photo: {
+            _: 'userProfilePhoto',
+            dc_id: photo.dc_id,
+            photo_id: photo.id,
+            stripped_thumb: strippedThumb?.bytes,
+            pFlags: {
+
+            }
+          }
+        });
+      }
       appUsersManager.saveApiUsers(updateResult.users);
 
       const myId = rootScope.myId;

src/lib/appManagers/appUsersManager.ts

@@ -81,7 +81,7 @@ export class AppUsersManager {
         const userId = update.user_id;
         const user = this.users[userId];
         if(user) {
-          if((user.photo as UserProfilePhoto.userProfilePhoto)?.photo_id === (update.photo as UserProfilePhoto.userProfilePhoto).photo_id) {
+          if((user.photo as UserProfilePhoto.userProfilePhoto)?.photo_id === (update.photo as UserProfilePhoto.userProfilePhoto)?.photo_id) {
             return;
           }