Merge pull request #117 from ajbura/master

v1.3.1: Bug fixes

package-lock.json

@@ -1,6 +1,6 @@
 {
   "name": "cinny",
-  "version": "1.3.0",
+  "version": "1.3.1",
   "lockfileVersion": 1,
   "requires": true,
   "dependencies": {

package.json

@@ -1,6 +1,6 @@
 {
   "name": "cinny",
-  "version": "1.3.0",
+  "version": "1.3.1",
   "description": "Yet another matrix client",
   "main": "index.js",
   "engines": {

src/app/atoms/badge/NotificationBadge.scss

@@ -13,7 +13,6 @@
 
   &--alert {
     background-color: var(--bg-positive);
-    & .text { color: white }
   }
 
   &:empty {

src/app/molecules/room-selector/RoomSelector.scss

@@ -70,7 +70,7 @@
     @extend .room-selector-flexItem;
     margin: 0 var(--sp-extra-tight);
 
-    color: var(--tc-surface-normal);
+    color: var(--tc-surface-normal-low);
     overflow: hidden;
     white-space: nowrap;
     text-overflow: ellipsis;

src/app/organisms/room/RoomViewFloating.jsx

@@ -54,7 +54,7 @@ function RoomViewFloating({
   return (
     <>
       <div className={`room-view__typing${isSomeoneTyping(typingMembers) ? ' room-view__typing--open' : ''}`}>
-        <div className="bouncingLoader"><div /></div>
+        <div className="bouncing-loader"><div /></div>
         <Text variant="b2">{getTypingMessage(typingMembers)}</Text>
       </div>
       <div className={`room-view__STB${reachedBottom ? '' : ' room-view__STB--open'}`}>

src/app/organisms/room/RoomViewFloating.scss

@@ -9,10 +9,6 @@
       color: var(--tc-surface-high);
     }
 
-    &--open {
-      transform: translateY(-99%);
-    }
-
     & .text {
       flex: 1;
       min-width: 0;
@@ -22,37 +18,48 @@
       text-overflow: ellipsis;
       margin: 0 var(--sp-tight);
     }
+
+    &--open {
+      transform: translateY(-99%);
+      & .bouncing-loader {
+        & > *,
+        &::after,
+        &::before {
+          animation: bouncing-loader 0.6s infinite alternate;
+        }
+      }
+    }
   }
 
-  .bouncingLoader {
+  .bouncing-loader {
     transform: translateY(2px);
     margin: 0 calc(var(--sp-ultra-tight) / 2);
   }
-  .bouncingLoader > div,
-  .bouncingLoader:before,
-  .bouncingLoader:after {
+  .bouncing-loader > div,
+  .bouncing-loader::before,
+  .bouncing-loader::after {
     display: inline-block;
     width: 8px;
     height: 8px;
     background: var(--tc-surface-high);
     border-radius: 50%;
-    animation: bouncing-loader 0.6s infinite alternate;
   }
   
-  .bouncingLoader:before,
-  .bouncingLoader:after {
+  
+  .bouncing-loader::before,
+  .bouncing-loader::after {
     content: "";
   }
   
-  .bouncingLoader > div {
+  .bouncing-loader > div {
     margin: 0 4px;
   }
   
-  .bouncingLoader > div {
+  .bouncing-loader > div {
     animation-delay: 0.2s;
   }
   
-  .bouncingLoader:after {
+  .bouncing-loader::after {
     animation-delay: 0.4s;
   }
   

src/app/organisms/settings/Settings.jsx

@@ -104,7 +104,7 @@ function AboutSection() {
         <div>
           <Text variant="h2">
             Cinny
-            <span className="text text-b3" style={{ margin: '0 var(--sp-extra-tight)' }}>v1.3.0</span>
+            <span className="text text-b3" style={{ margin: '0 var(--sp-extra-tight)' }}>v1.3.1</span>
           </Text>
           <Text>Yet another matrix client</Text>
 

src/client/state/RoomList.js

@@ -76,10 +76,23 @@ class RoomList extends EventEmitter {
     if (parents.size === 0) this.roomIdToParents.delete(roomId);
   }
 
+  getParentSpaces(roomId) {
+    let parentIds = this.roomIdToParents.get(roomId);
+    if (parentIds) {
+      [...parentIds].forEach((parentId) => {
+        parentIds = new Set([...parentIds, ...this.getParentSpaces(parentId)]);
+      });
+    }
+    return parentIds || new Set();
+  }
+
   addToSpaces(roomId) {
     this.spaces.add(roomId);
+    const allParentSpaces = this.getParentSpaces(roomId);
+
     const spaceChildren = this.getSpaceChildren(roomId);
     spaceChildren?.forEach((childRoomId) => {
+      if (allParentSpaces.has(childRoomId)) return;
       this.addToRoomIdToParents(childRoomId, roomId);
     });
   }
@@ -268,6 +281,8 @@ class RoomList extends EventEmitter {
       if (mEvent.getType() === 'm.space.child') {
         const { event } = mEvent;
         if (isMEventSpaceChild(mEvent)) {
+          const allParentSpaces = this.getParentSpaces(event.room_id);
+          if (allParentSpaces.has(event.state_key)) return;
           this.addToRoomIdToParents(event.state_key, event.room_id);
         } else this.removeFromRoomIdToParents(event.state_key, event.room_id);
         this.emit(cons.events.roomList.ROOMLIST_UPDATED);

src/index.scss

@@ -37,6 +37,7 @@
   /* text color | --tc-[background type]-[priority]: value */
   --tc-surface-high: #000000;
   --tc-surface-normal: rgba(0, 0, 0, 68%);
+  --tc-surface-normal-low: rgba(0, 0, 0, 60%);
   --tc-surface-low: rgba(0, 0, 0, 38%);
   
   --tc-primary-high: #ffffff;
@@ -56,7 +57,7 @@
   --tc-danger-low: rgba(240, 71, 71, 60%);
 
   --tc-code: #e62498;
-
+  --tc-link: hsl(213deg 76% 56%);
   --tc-tooltip: white;
   --tc-badge: white;
 
@@ -167,32 +168,34 @@
 .dark-theme,
 .butter-theme {
   /* background color | --bg-[background type]: value */
-  --bg-surface: hsl(208, 8%, 20%);
-  --bg-surface-transparent: hsla(208, 8%, 20%, 0);
-  --bg-surface-low: hsl(208, 8%, 16%);
-  --bg-surface-low-transparent: hsla(208, 8%, 16%, 0);
+  --bg-surface: hsl(208, 8%, 16%);
+  --bg-surface-transparent: hsla(208, 8%, 16%, 0);
+  --bg-surface-low: hsl(208, 8%, 12%);
+  --bg-surface-low-transparent: hsla(208, 8%, 12%, 0);
   --bg-surface-hover: rgba(255, 255, 255, 3%);
   --bg-surface-active: rgba(255, 255, 255, 5%);
   --bg-surface-border: rgba(0, 0, 0, 20%);
 
-  --bg-primary: rgb(59, 119, 191);
-  --bg-primary-hover: rgba(59, 119, 191, 80%);
-  --bg-primary-active: rgba(59, 119, 191, 70%);
-  --bg-primary-border: rgba(59, 119, 191, 38%);
+  --bg-primary: rgb(42, 98, 166);
+  --bg-primary-hover: rgba(42, 98, 166, 80%);
+  --bg-primary-active: rgba(42, 98, 166, 70%);
+  --bg-primary-border: rgba(42, 98, 166, 38%);
 
   --bg-tooltip: #000;
   --bg-badge: hsl(0, 0%, 75%);
 
   /* text color | --tc-[background type]-[priority]: value */
-  --tc-surface-high: rgba(255, 255, 255, 94%);
-  --tc-surface-normal: rgba(255, 255, 255, 74%);
-  --tc-surface-low: rgba(255, 255, 255, 38%);
+  --tc-surface-high: rgba(255, 255, 255, 98%);
+  --tc-surface-normal: rgba(255, 255, 255, 84%);
+  --tc-surface-normal-low: rgba(255, 255, 255, 60%);
+  --tc-surface-low: rgba(255, 255, 255, 48%);
   
   --tc-primary-high: #ffffff;
   --tc-primary-normal: rgba(255, 255, 255, 0.68);
   --tc-primary-low: rgba(255, 255, 255, 0.4);
 
   --tc-code: #e565b1;
+  --tc-link: hsl(213deg 94% 73%);
   --tc-badge: black;
 
   /* system icons | --ic-[background type]-[priority]: value */
@@ -226,6 +229,7 @@
   /* text color | --tc-[background type]-[priority]: value */
   --tc-surface-high: rgb(255, 251, 222, 94%);
   --tc-surface-normal: rgba(255, 251, 222, 74%);
+  --tc-surface-normal-low: rgba(255, 251, 222, 60%); 
   --tc-surface-low: rgba(255, 251, 222, 38%);
 
 
@@ -257,7 +261,7 @@ body {
   -webkit-tap-highlight-color: transparent;
 }
 a {
-  color: var(--bg-primary);
+  color: var(--tc-link);
   text-decoration: none;
 }
 b {