Merge branch 'dev' into update-actions

* Add renovate.json

* Add renovate config

Co-authored-by: renovate[bot] <29139614+renovate[bot]@users.noreply.github.com>
Co-authored-by: Krishan <33421343+kfiven@users.noreply.github.com>

.github/renovate.json

@@ -0,0 +1,15 @@
+{
+  "$schema": "https://docs.renovatebot.com/renovate-schema.json",
+  "extends": [
+    "config:base"
+  ],
+  "labels": [ "Dependencies" ],
+  "packageRules": [
+    {
+    "matchUpdateTypes": [ "lockFileMaintenance" ]
+    }
+  ],
+  "lockFileMaintenance": { "enabled": true },
+  "dependencyDashboard": true,
+  "dependencyDashboardApproval": true
+}

.github/workflows/build-pull-request.yml

@@ -6,6 +6,7 @@ on:
 
 jobs:
   build-pull-request:
+    name: 'Build pull request'
     runs-on: ubuntu-latest
     env:
       PR_NUMBER: ${{github.event.number}}
@@ -16,23 +17,22 @@ jobs:
         uses: actions/setup-node@v3.4.1
         with:
           node-version: 17.9.0
+          cache: 'npm'
+      - name: Install dependencies
+        run: npm ci
       - name: Build app
-        run: npm ci && npm run build
+        run: npm run build
       - name: Upload artifact
         uses: actions/upload-artifact@v3.1.0
         with:
-          name: previewbuild
+          name: preview
           path: dist
           retention-days: 1
-      - name: Get PR info
-        uses: actions/github-script@v6.2.0
-        with:
-          script: |
-            var fs = require('fs');
-            fs.writeFileSync('${{github.workspace}}/pr.json', JSON.stringify(context.payload.pull_request));
-      - name: Upload PR Info
+      - name: Save pr number
+        run: echo ${PR_NUMBER} > ./pr.txt
+      - name: Upload pr number
         uses: actions/upload-artifact@v3.1.0
         with:
-          name: pr.json
-          path: pr.json
-          retention-days: 1
+          name: pr
+          path: ./pr.txt
+          retention-days: 1

.github/workflows/deploy-pull-request.yml

@@ -1,68 +1,40 @@
-name: Upload Preview Build to Netlify
+name: Deploy PR to Netlify
 on:
   workflow_run:
       workflows: ["Build pull request"]
-      types:
-        - completed
+      types: [completed]
 jobs:
-  get-build-and-deploy:
+  deploy-pull-request:
+    name: 'Deploy pull request'
+    runs-on: ubuntu-latest
     permissions:
       contents: read
       pull-requests: write
-    runs-on: ubuntu-latest
-    if: >
-      ${{ github.event.workflow_run.conclusion == 'success' }}
+    if: ${{ github.event.workflow_run.conclusion == 'success' }}
     steps:
-      # There's a 'download artifact' action but it hasn't been updated for the
-      # workflow_run action (https://github.com/actions/download-artifact/issues/60)
-      # so instead we get this mess:
+      - name: Download pr number
+        uses: dawidd6/action-download-artifact@7847792dd435a50521b8e3bd3576dae7459d1fa8
+        with:
+          workflow: ${{ github.event.workflow.id }}
+          run_id: ${{ github.event.workflow_run.id }}
+          name: pr
+      - name: Output pr number
+        id: pr
+        run: echo "::set-output name=id::$(<pr.txt)"
       - name: Download artifact
-        uses: actions/github-script@v6.2.0
+        uses: dawidd6/action-download-artifact@7847792dd435a50521b8e3bd3576dae7459d1fa8
         with:
-          script: |
-            var artifacts = await github.rest.actions.listWorkflowRunArtifacts({
-              owner: context.repo.owner,
-              repo: context.repo.repo,
-              run_id: ${{github.event.workflow_run.id }},
-            });
-            var matchArtifact = artifacts.data.artifacts.filter((artifact) => {
-              return artifact.name == "previewbuild"
-            })[0];
-            var download = await github.rest.actions.downloadArtifact({
-              owner: context.repo.owner,
-              repo: context.repo.repo,
-              artifact_id: matchArtifact.id,
-              archive_format: 'zip',
-            });
-            var fs = require('fs');
-            fs.writeFileSync('${{github.workspace}}/previewbuild.zip', Buffer.from(download.data));
-            var prInfoArtifact = artifacts.data.artifacts.filter((artifact) => {
-              return artifact.name == "pr.json"
-            })[0];
-            var download = await github.rest.actions.downloadArtifact({
-              owner: context.repo.owner,
-              repo: context.repo.repo,
-              artifact_id: prInfoArtifact.id,
-              archive_format: 'zip',
-            });
-            var fs = require('fs');
-            fs.writeFileSync('${{github.workspace}}/pr.json.zip', Buffer.from(download.data));
-      - name: Extract Artifacts
-        run: unzip -d dist previewbuild.zip && rm previewbuild.zip && unzip pr.json.zip && rm pr.json.zip
-      - name: Read PR Info
-        id: readctx
-        uses: actions/github-script@v6.2.0
-        with:
-          script: |
-            var fs = require('fs');
-            var pr = JSON.parse(fs.readFileSync('${{github.workspace}}/pr.json'));
-            console.log(`::set-output name=prnumber::${pr.number}`);
+          workflow: ${{ github.event.workflow.id }}
+          run_id: ${{ github.event.workflow_run.id }}
+          name: preview
+          path: dist
       - name: Deploy to Netlify
         id: netlify
         uses: nwtgck/actions-netlify@b7c1504e00c6b8a249d1848cc1b522a4865eed99
         with:
           publish-dir: dist
-          deploy-message: "Deploy from GitHub Actions"
+          deploy-message: "Deploy PR ${{ steps.pr.outputs.id }}"
+          alias: ${{ steps.pr.outputs.id }}
           # These don't work because we're in workflow_run
           enable-pull-request-comment: false
           enable-commit-comment: false
@@ -75,7 +47,7 @@ jobs:
         env:
           GITHUB_TOKEN: ${{ secrets.GITHUB_TOKEN }}
         with:
-          pull-request-number: ${{ steps.readctx.outputs.prnumber }}
+          pull-request-number: ${{ steps.pr.outputs.id }}
           description-message: |
               Preview: ${{ steps.netlify.outputs.deploy-url }}
-              ⚠️ Exercise caution. Use test accounts. ⚠️
+              ⚠️ Exercise caution. Use test accounts. ⚠️

.github/workflows/netlify-dev.yml

@@ -7,10 +7,8 @@ on:
 
 jobs:
   deploy-to-netlify:
-    name: 'Deploy'
+    name: 'Deploy to Netlify'
     runs-on: ubuntu-latest
-    permissions:
-      contents: read
     steps:
       - name: Checkout repository
         uses: actions/checkout@v3.0.2
@@ -18,12 +16,22 @@ jobs:
         uses: actions/setup-node@v3.4.1
         with:
           node-version: 17.9.0
-      - name: Build and deploy to Netlify
-        uses: jsmrcaga/action-netlify-deploy@53de32e559b0b3833615b9788c7a090cd2fddb03
+          cache: 'npm'
+      - name: Install dependencies
+        run: npm ci
+      - name: Build app
+        run: npm run build
+      - name: Deploy to Netlify
+        uses: nwtgck/actions-netlify@b7c1504e00c6b8a249d1848cc1b522a4865eed99
         with:
-          install_command: "npm ci"
+          publish-dir: dist
+          deploy-message: "Dev deploy ${{ github.sha }}"
+          enable-commit-comment: false
+          github-token: ${{ secrets.GITHUB_TOKEN }}
+          production-deploy: true
+          github-deployment-environment: nightly
+          github-deployment-description: 'Nightly deployment on each commit to dev branch'
+        env:
           NETLIFY_AUTH_TOKEN: ${{ secrets.NETLIFY_AUTH_TOKEN }}
           NETLIFY_SITE_ID: ${{ secrets.NETLIFY_SITE2_ID }}
-          BUILD_DIRECTORY: "dist"
-          NETLIFY_DEPLOY_MESSAGE: "Dev deploy v${{ github.ref }}"
-          NETLIFY_DEPLOY_TO_PROD: true
+        timeout-minutes: 1

.github/workflows/prod-deploy.yml

@@ -5,8 +5,8 @@ on:
     types: [published]
 
 jobs:
-  create-release-tar:
-    name: 'Create release tar'
+  deploy-and-tarball:
+    name: 'Netlify deploy and tarball'
     runs-on: ubuntu-latest
     steps:
       - name: Checkout repository
@@ -15,10 +15,25 @@ jobs:
         uses: actions/setup-node@v3.4.1
         with:
           node-version: 17.9.0
-      - name: Build
-        run: |
-          npm ci
-          npm run build
+          cache: 'npm'
+      - name: Install dependencies
+        run: npm ci
+      - name: Build app
+        run: npm run build
+      - name: Deploy to Netlify
+        uses: nwtgck/actions-netlify@b7c1504e00c6b8a249d1848cc1b522a4865eed99
+        with:
+          publish-dir: dist
+          deploy-message: "Prod deploy ${{ github.ref_name }}"
+          enable-commit-comment: false
+          github-token: ${{ secrets.GITHUB_TOKEN }}
+          production-deploy: true
+          github-deployment-environment: stable
+          github-deployment-description: 'Stable deployment on each release'
+        env:
+          NETLIFY_AUTH_TOKEN: ${{ secrets.NETLIFY_AUTH_TOKEN }}
+          NETLIFY_SITE_ID: ${{ secrets.NETLIFY_SITE_ID }}
+        timeout-minutes: 1
       - name: Get version from tag
         id: vars
         run: echo ::set-output name=tag::${GITHUB_REF#refs/*/}
@@ -41,29 +56,7 @@ jobs:
             cinny-${{ steps.vars.outputs.tag }}.tar.gz
             cinny-${{ steps.vars.outputs.tag }}.tar.gz.asc
 
-  deploy-to-netlify:
-    name: 'Deploy to Netlify'
-    runs-on: ubuntu-latest
-    permissions:
-      contents: read
-    steps:
-      - name: Checkout repository
-        uses: actions/checkout@v3.0.2
-      - name: Setup node
-        uses: actions/setup-node@v3.4.1
-        with:
-          node-version: 17.9.0
-      - name: Build and deploy to Netlify
-        uses: jsmrcaga/action-netlify-deploy@53de32e559b0b3833615b9788c7a090cd2fddb03
-        with:
-          install_command: "npm ci"
-          NETLIFY_AUTH_TOKEN: ${{ secrets.NETLIFY_AUTH_TOKEN }}
-          NETLIFY_SITE_ID: ${{ secrets.NETLIFY_SITE_ID }}
-          BUILD_DIRECTORY: "dist"
-          NETLIFY_DEPLOY_MESSAGE: "Prod deploy v${{ github.ref }}"
-          NETLIFY_DEPLOY_TO_PROD: true
-
-  push-to-dockerhub:
+  publish-image:
     name: Push Docker image to Docker Hub, ghcr
     runs-on: ubuntu-latest
     permissions:

src/app/organisms/emoji-board/EmojiBoard.scss

@@ -38,7 +38,7 @@
     @extend .cp-fx__column;
   }
   &__nav-twemoji {
-    background: inherit;
+    background-color: var(--bg-surface);
     position: sticky;
     bottom: -70%;
     z-index: 999;

src/app/organisms/navigation/DrawerBreadcrumb.jsx

@@ -21,7 +21,7 @@ import ChevronRightIC from '../../../../public/res/ic/outlined/chevron-right.svg
 function DrawerBreadcrumb({ spaceId }) {
   const [, forceUpdate] = useState({});
   const scrollRef = useRef(null);
-  const { roomList, notifications } = initMatrix;
+  const { roomList, notifications, accountData } = initMatrix;
   const mx = initMatrix.matrixClient;
   const spacePath = navigation.selectedSpacePath;
 
@@ -49,9 +49,9 @@ function DrawerBreadcrumb({ spaceId }) {
   }, [spaceId]);
 
   function getHomeNotiExcept(childId) {
-    const orphans = roomList.getOrphans();
-    const childIndex = orphans.indexOf(childId);
-    if (childId !== -1) orphans.splice(childIndex, 1);
+    const orphans = roomList.getOrphans()
+      .filter((id) => (id !== childId))
+      .filter((id) => !accountData.spaceShortcut.has(id));
 
     let noti = null;
 

src/app/organisms/profile-editor/ProfileEditor.jsx

@@ -16,11 +16,11 @@ import { confirmDialog } from '../../molecules/confirm-dialog/ConfirmDialog';
 
 import './ProfileEditor.scss';
 
-// TODO Fix bug that prevents 'Save' button from enabling up until second changed.
 function ProfileEditor({ userId }) {
   const [isEditing, setIsEditing] = useState(false);
   const mx = initMatrix.matrixClient;
   const user = mx.getUser(mx.getUserId());
+  const fallbackUsername = userId.match(/^@?(\S+):(\S+)$/)[1];
 
   const displayNameRef = useRef(null);
   const [avatarSrc, setAvatarSrc] = useState(user.avatarUrl ? mx.mxcUrlToHttp(user.avatarUrl, 80, 80, 'crop') : null);
@@ -96,7 +96,7 @@ function ProfileEditor({ userId }) {
   const renderInfo = () => (
     <div className="profile-editor__info" style={{ marginBottom: avatarSrc ? '24px' : '0' }}>
       <div>
-        <Text variant="h2" primary weight="medium">{twemojify(username)}</Text>
+        <Text variant="h2" primary weight="medium">{twemojify(username) ?? fallbackUsername}</Text>
         <IconButton
           src={PencilIC}
           size="extra-small"
@@ -111,7 +111,7 @@ function ProfileEditor({ userId }) {
   return (
     <div className="profile-editor">
       <ImageUpload
-        text={username}
+        text={username ?? fallbackUsername}
         bgColor={colorMXID(userId)}
         imageSrc={avatarSrc}
         onUpload={handleAvatarUpload}

src/app/organisms/settings/DeviceManage.jsx

@@ -180,13 +180,15 @@ function DeviceManage() {
         }
         content={(
           <>
-            <Text variant="b3">
-              Last activity
-              <span style={{ color: 'var(--tc-surface-normal)' }}>
-                {dateFormat(new Date(lastTS), ' hh:MM TT, dd/mm/yyyy')}
-              </span>
-              {lastIP ? ` at ${lastIP}` : ''}
-            </Text>
+            {lastTS && (
+              <Text variant="b3">
+                Last activity
+                <span style={{ color: 'var(--tc-surface-normal)' }}>
+                  {dateFormat(new Date(lastTS), ' hh:MM TT, dd/mm/yyyy')}
+                </span>
+                {lastIP ? ` at ${lastIP}` : ''}
+              </Text>
+            )}
             {isCurrentDevice && (
               <Text style={{ marginTop: 'var(--sp-ultra-tight)' }} variant="b3">
                 {`Session Key: ${initMatrix.matrixClient.getDeviceEd25519Key().match(/.{1,4}/g).join(' ')}`}

src/client/state/Notifications.js

@@ -114,8 +114,7 @@ class Notifications extends EventEmitter {
   }
 
   getTotalNoti(roomId) {
-    const { total, highlight } = this.getNoti(roomId);
-    if (highlight > total) return highlight;
+    const { total } = this.getNoti(roomId);
     return total;
   }
 
@@ -181,7 +180,7 @@ class Notifications extends EventEmitter {
     };
 
     const noti = this.getNoti(roomId);
-    const addT = total - noti.total;
+    const addT = (highlight > total ? highlight : total) - noti.total;
     const addH = highlight - noti.highlight;
     if (addT < 0 || addH < 0) return;
 

src/util/mimetypes.js

@@ -26,6 +26,7 @@ export const ALLOWED_BLOB_MIMETYPES = [
 ];
 
 export function getBlobSafeMimeType(mimetype) {
+  if (typeof mimetype !== 'string') return 'application/octet-stream';
   const [type] = mimetype.split(';');
   if (!ALLOWED_BLOB_MIMETYPES.includes(type)) {
     return 'application/octet-stream';