design changes

fixes
Yyyyix · Nov 27, 2022 · 8e4b968 · 8e4b968
1 parent 4609f6c
commit 8e4b968
Show file tree

Hide file tree

Showing 60 changed files with 5,749 additions and 817 deletions.
diff --git a/public/assets/img/pattern_newbroken.svg b/public/assets/img/pattern_newbroken.svg
diff --git a/src/components/appSearch.ts b/src/components/appSearch.ts
@@ -204,7 +204,7 @@ export default class AppSearch {
           appDialogsManager.addDialogAndSetLastMessage({
             peerId,
             container: this.scrollable/* searchGroup.list */,
-            avatarSize: 54,
+            avatarSize: 'bigger',
             meAsSaved: false,
             message,
             query,

diff --git a/src/components/appSearchSuper..ts b/src/components/appSearchSuper..ts
@@ -73,6 +73,7 @@ import SwipeHandler from './swipeHandler';
 import wrapDocument from './wrappers/document';
 import wrapPhoto from './wrappers/photo';
 import wrapVideo from './wrappers/video';
+import noop from '../helpers/noop';
 
 // const testScroll = false;
 
@@ -610,7 +611,7 @@ export default class AppSearchSuper {
     const {dom} = appDialogsManager.addDialogNew({
       peerId: message.peerId,
       container: searchGroup.list,
-      avatarSize: 54,
+      avatarSize: 'bigger',
       loadPromises
     });
 
@@ -625,7 +626,7 @@ export default class AppSearchSuper {
     });
 
     loadPromises.push(setLastMessagePromise);
-    return Promise.all(loadPromises);
+    return Promise.all(loadPromises).then(noop);
   }
 
   private async processPhotoVideoFilter({message, promises, middleware}: ProcessSearchSuperResult) {
@@ -705,10 +706,8 @@ export default class AppSearchSuper {
       let url: string, display_url: string, sliced: string;
 
       if(!entity) {
-        // this.log.error('NO ENTITY:', message);
         const match = matchUrl(message.message);
         if(!match) {
-          // this.log.error('NO ENTITY AND NO MATCH:', message);
           return;
         }
 
@@ -748,7 +747,7 @@ export default class AppSearchSuper {
     }
 
     const previewDiv = document.createElement('div');
-    previewDiv.classList.add('preview', 'row-media', 'row-media-big');
+    previewDiv.classList.add('preview');
 
     // this.log('wrapping webpage', webpage);
 
@@ -808,19 +807,7 @@ export default class AppSearchSuper {
       noRipple: true
     });
 
-    /* const mediaDiv = document.createElement('div');
-    mediaDiv.classList.add('row-media'); */
-
-    row.container.append(previewDiv);
-
-    /* ripple(div);
-    div.append(previewDiv);
-    div.insertAdjacentHTML('beforeend', `
-    <div class="title">${title}${titleAdditionHTML}</div>
-    <div class="subtitle">${subtitle}</div>
-    <div class="url">${url}</div>
-    ${sender}
-    `); */
+    row.applyMediaElement(previewDiv, 'big');
 
     if(row.container.innerText.trim().length) {
       return {message, element: row.container};
@@ -923,6 +910,10 @@ export default class AppSearchSuper {
       const method = append ? 'append' : 'prepend';
       elemsToAppend.forEach((details) => {
         const {element, message} = details;
+        if(!message) {
+          debugger;
+        }
+
         const monthContainer = this.getMonthContainerByTimestamp(this.groupByMonth ? message.date : 0, inputFilter);
         element.classList.add('search-super-item');
         element.dataset.mid = '' + message.mid;
@@ -982,12 +973,12 @@ export default class AppSearchSuper {
           const {dom} = appDialogsManager.addDialogNew({
             peerId: peerId,
             container: group.list,
-            avatarSize: 48,
+            avatarSize: 'abitbigger',
             autonomous: group.autonomous
           });
 
           return {dom, peerId};
-        }).forEach(async({dom, peerId}) => {
+        }).filter(Boolean).forEach(async({dom, peerId}) => {
           const peer = await this.managers.appPeersManager.getPeer(peerId);
           if(showMembersCount && (peer.participants_count || peer.participants)) {
             const regExp = new RegExp(`(${escapeRegExp(query)}|${escapeRegExp(cleanSearchText(query))})`, 'gi');
@@ -1006,7 +997,7 @@ export default class AppSearchSuper {
               username = '@' + username;
             }
 
-            dom.lastMessageSpan.innerHTML = '<i>' + username + '</i>';
+            dom.lastMessageSpan.textContent = username;
           }
         });
 
@@ -1024,7 +1015,7 @@ export default class AppSearchSuper {
       };
 
       return Promise.all([
-        this.managers.appUsersManager.getContactsPeerIds(query, true)
+        this.managers.appUsersManager.getContactsPeerIds(query, true, undefined, 10)
         .then(onLoad)
         .then((contacts) => {
           if(contacts) {
@@ -1084,7 +1075,7 @@ export default class AppSearchSuper {
               peerId: peerId,
               container: this.searchGroups.recent.list,
               meAsSaved: true,
-              avatarSize: 48,
+              avatarSize: 'abitbigger',
               autonomous: true
             });
 
@@ -1113,14 +1104,16 @@ export default class AppSearchSuper {
           // console.log('got top categories:', categories);
           if(peers.length) {
             peers.forEach((peer) => {
-              appDialogsManager.addDialogNew({
+              const {dom} = appDialogsManager.addDialogNew({
                 peerId: peer.id,
                 container: this.searchGroups.people.list,
                 onlyFirstName: true,
-                avatarSize: 54,
+                avatarSize: 'bigger',
                 autonomous: false,
                 noIcons: this.searchGroups.people.noIcons
               });
+
+              dom.subtitleEl.remove();
             });
           }
 

diff --git a/src/components/appSelectPeers.ts b/src/components/appSelectPeers.ts
@@ -6,7 +6,7 @@
 
 import type {ChatRights} from '../lib/appManagers/appChatsManager';
 import type {Dialog} from '../lib/appManagers/appMessagesManager';
-import appDialogsManager from '../lib/appManagers/appDialogsManager';
+import appDialogsManager, {DialogElementSize as DialogElementSize} from '../lib/appManagers/appDialogsManager';
 import rootScope from '../lib/rootScope';
 import Scrollable from './scrollable';
 import {FocusDirection} from '../helpers/fastSmoothScroll';
@@ -77,7 +77,7 @@ export default class AppSelectPeers {
   private chatRightsAction: ChatRights;
   private multiSelect = true;
   private rippleEnabled = true;
-  private avatarSize = 48;
+  private avatarSize: DialogElementSize = 'abitbigger';
   private exceptSelf = false;
   private filterPeerTypeBy: IsPeerType[];
 
@@ -94,6 +94,8 @@ export default class AppSelectPeers {
 
   private managers: AppManagers;
 
+  private design: 'round' | 'square' = 'round';
+
   constructor(options: {
     appendTo: AppSelectPeers['appendTo'],
     onChange?: AppSelectPeers['onChange'],
@@ -110,11 +112,12 @@ export default class AppSelectPeers {
     exceptSelf?: AppSelectPeers['exceptSelf'],
     filterPeerTypeBy?: AppSelectPeers['filterPeerTypeBy'],
     sectionNameLangPackKey?: AppSelectPeers['sectionNameLangPackKey'],
-    managers: AppSelectPeers['managers']
+    managers: AppSelectPeers['managers'],
+    design?: AppSelectPeers['design']
   }) {
     safeAssign(this, options);
 
-    this.container.classList.add('selector');
+    this.container.classList.add('selector', 'selector-' + this.design);
 
     const f = (this.renderResultsFunc || this.renderResults).bind(this);
     this.renderResultsFunc = async(peerIds) => {
@@ -313,7 +316,7 @@ export default class AppSelectPeers {
     }
 
     // в десктопе - сначала без группы, потом архивные, потом контакты без сообщений
-    const pageCount = windowSize.height / 72 * 1.25 | 0;
+    const pageCount = windowSize.height / 56 * 1.25 | 0;
 
     const tempId = this.getTempId('dialogs');
     const promise = this.managers.appMessagesManager.getConversations(this.query, this.offsetIndex, pageCount, this.folderId, true);
@@ -420,7 +423,7 @@ export default class AppSelectPeers {
     }
 
     // if(this.cachedContacts.length) {
-    const pageCount = windowSize.height / 72 * 1.25 | 0;
+    const pageCount = windowSize.height / 56 * 1.25 | 0;
     const arr = this.cachedContacts.splice(0, pageCount);
     this.renderResultsFunc(arr);
     // }

diff --git a/src/components/chat/bubbleGroups.ts b/src/components/chat/bubbleGroups.ts
@@ -289,7 +289,11 @@ export default class BubbleGroups {
   removeAndUnmountBubble(bubble: HTMLElement) {
     const item = this.getItemByBubble(bubble);
     if(!item) {
-      return;
+      if(bubble.parentElement) {
+        bubble.remove(); // * can be a placeholder
+      }
+
+      return false;
     }
 
     const items = this.itemsArr;
@@ -320,6 +324,8 @@ export default class BubbleGroups {
     }
 
     this.mountUnmountGroups(Array.from(modifiedGroups));
+
+    return true;
   }
 
   mountUnmountGroups(groups: BubbleGroup[]) {