Merge branch 'develop' into chore/2312

TryQuiet · Apr 25, 2024 · 181f223 · 181f223
2 parents 20ed79c + 14b6106
commit 181f223
Show file tree

Hide file tree

Showing 100 changed files with 330 additions and 345 deletions.
diff --git a/.github/workflows/backend-tests.yml b/.github/workflows/backend-tests.yml
@@ -11,7 +11,7 @@ jobs:
 
     strategy:
       matrix:
-        os: [ubuntu-20.04, macos-latest, windows-2019]
+        os: [ubuntu-20.04, macos-12, windows-2019]
 
     steps:
       - name: "Print OS"

diff --git a/.github/workflows/desktop-build.yml b/.github/workflows/desktop-build.yml
@@ -96,7 +96,7 @@ jobs:
 
   build-macos:
     # needs: run-e2e-tests-mac
-    runs-on: macos-latest
+    runs-on: macos-12
     if: |
       startsWith(github.ref, 'refs/tags/@quiet/desktop')
 

diff --git a/.github/workflows/desktop-rtl-tests.yml b/.github/workflows/desktop-rtl-tests.yml
@@ -13,7 +13,7 @@ jobs:
 
     strategy:
       matrix:
-        os: [ubuntu-20.04, macos-latest]
+        os: [ubuntu-20.04, macos-12]
 
     steps:
       - name: "Print OS"

diff --git a/.github/workflows/desktop-tests.yml b/.github/workflows/desktop-tests.yml
@@ -12,7 +12,7 @@ jobs:
 
     strategy:
       matrix:
-        os: [ubuntu-20.04, macos-latest]
+        os: [ubuntu-20.04, macos-12]
 
     steps:
       - name: "Print OS"

diff --git a/.github/workflows/e2e-android-self.yml b/.github/workflows/e2e-android-self.yml
@@ -10,7 +10,7 @@ on:
 
 jobs:
   detox-android-self-hosted:
-    timeout-minutes: 10
+    timeout-minutes: 25
     runs-on: [self-hosted, macOS, ARM64, android]
 
     steps:
@@ -32,6 +32,14 @@ jobs:
           ndk.path=/Users/quiet/Library/Android/sdk/ndk/25.1.8937393
           EOF
 
+      - name: Install pm2
+        run: npm install pm2@latest -g
+
+      - name: Start metro
+        run: |
+          cd packages/mobile
+          pm2 --name METRO start npm -- start
+
       - name: Build Detox
         run: |
           export JAVA_HOME=/Library/Java/JavaVirtualMachines/jdk-17.jdk/Contents/Home
@@ -41,4 +49,8 @@ jobs:
       - name: Run basic tests
         run: |
           cd packages/mobile
-          detox test starter -c android.emu.debug.ci
+          detox test starter -c android.emu.debug.ci
+
+      - name: Stop metro
+        if: always() 
+        run: pm2 stop METRO
diff --git a/.github/workflows/e2e-android.yml b/.github/workflows/e2e-android.yml
@@ -5,7 +5,7 @@ on: workflow_dispatch
 jobs:
   detox-android:
     timeout-minutes: 25
-    runs-on: [macos-latest-xlarge]
+    runs-on: [macos-14-xlarge]
 
     steps:
       - uses: actions/checkout@v4

diff --git a/.github/workflows/e2e-mac.yml b/.github/workflows/e2e-mac.yml
@@ -3,7 +3,7 @@ name: E2E Mac
 on: [workflow_call]
 jobs:
   mac:
-    runs-on: macos-latest
+    runs-on: macos-12
     timeout-minutes: 180
     env:
       ELECTRON_CUSTOM_VERSION: 23.0.0

diff --git a/.github/workflows/identity-tests.yml b/.github/workflows/identity-tests.yml
@@ -12,7 +12,7 @@ jobs:
 
     strategy:
       matrix:
-        os: [ubuntu-20.04, macos-latest, windows-2019]
+        os: [ubuntu-20.04, macos-12, windows-2019]
 
     steps:
       - name: "Print OS"

diff --git a/.github/workflows/mobile-deploy-ios.yml b/.github/workflows/mobile-deploy-ios.yml
@@ -14,7 +14,7 @@ jobs:
 
     strategy:
       matrix:
-        os: [macOS-latest]
+        os: [macos-12]
 
     steps:
       - name: "Print OS"

diff --git a/.github/workflows/state-manager-tests.yml b/.github/workflows/state-manager-tests.yml
@@ -12,7 +12,7 @@ jobs:
 
     strategy:
       matrix:
-        os: [ubuntu-20.04, macos-latest]
+        os: [ubuntu-20.04, macos-12]
 
     steps:
       - name: "Print OS"

diff --git a/.github/workflows/utils-tests.yml b/.github/workflows/utils-tests.yml
@@ -12,7 +12,7 @@ jobs:
 
     strategy:
       matrix:
-        os: [ubuntu-20.04, macos-latest, windows-2019]
+        os: [ubuntu-20.04, macos-12, windows-2019]
 
     steps:
       - name: "Print OS"

diff --git a/packages/desktop/src/renderer/components/ChangeUsername/ChangeUsername.component.tsx b/packages/desktop/src/renderer/components/ChangeUsername/ChangeUsername.component.tsx
@@ -38,7 +38,7 @@ const classes = {
 }
 
 const StyledGrid = styled(Grid)(({ theme }) => ({
-  backgroundColor: theme.palette.colors.white,
+  backgroundColor: theme.palette.background.default,
   padding: '0px 32px',
 
   [`& .${classes.focus}`]: {

diff --git a/...ktop/src/renderer/components/ChangeUsername/UsernameChanged/UsernameChanged.component.tsx b/...ktop/src/renderer/components/ChangeUsername/UsernameChanged/UsernameChanged.component.tsx
@@ -16,7 +16,7 @@ const classes = {
 }
 
 const StyledGrid = styled(Grid)(({ theme }) => ({
-  backgroundColor: theme.palette.colors.white,
+  backgroundColor: theme.palette.background.default,
   padding: '0px 32px',
 
   [`& .${classes.button}`]: {

diff --git a/packages/desktop/src/renderer/components/Channel/ChannelComponent.tsx b/packages/desktop/src/renderer/components/Channel/ChannelComponent.tsx
@@ -30,7 +30,7 @@ import { HandleOpenModalType } from '../widgets/userLabel/UserLabel.types'
 const ChannelMessagesWrapperStyled = styled(Grid)(({ theme }) => ({
   position: 'relative',
   height: 0,
-  backgroundColor: theme.palette.colors.white,
+  backgroundColor: theme.palette.background.default,
 }))
 
 export interface ChannelComponentProps {

diff --git a/packages/desktop/src/renderer/components/Channel/CreateChannel/CreateChannelComponent.tsx b/packages/desktop/src/renderer/components/Channel/CreateChannel/CreateChannelComponent.tsx
@@ -30,7 +30,7 @@ const classes = {
 }
 
 const StyledModalContent = styled(Grid)(({ theme }) => ({
-  backgroundColor: theme.palette.colors.white,
+  backgroundColor: theme.palette.background.default,
   padding: '0px 32px',
 
   [`& .${classes.fullContainer}`]: {

diff --git a/packages/desktop/src/renderer/components/Channel/DeleteChannel/DeleteChannel.test.tsx b/packages/desktop/src/renderer/components/Channel/DeleteChannel/DeleteChannel.test.tsx
@@ -21,7 +21,7 @@ describe('LeaveCommunity', () => {
           aria-hidden="true"
         />
         <div
-          class="MuiModal-root css-1vjugmr-MuiModal-root"
+          class="MuiModal-root css-1evs64r-MuiModal-root"
           role="presentation"
         >
           <div
@@ -121,7 +121,7 @@ describe('LeaveCommunity', () => {
                     class="MuiGrid-root MuiGrid-item MuiGrid-grid-xs-auto DeleteChannelbuttonContainer css-1wrgmsj-MuiGrid-root"
                   >
                     <button
-                      class="MuiButtonBase-root MuiButton-root MuiButton-contained MuiButton-containedPrimary MuiButton-sizeSmall MuiButton-containedSizeSmall MuiButton-fullWidth MuiButton-root MuiButton-contained MuiButton-containedPrimary MuiButton-sizeSmall MuiButton-containedSizeSmall MuiButton-fullWidth DeleteChannelbutton css-14mi2mx-MuiButtonBase-root-MuiButton-root"
+                      class="MuiButtonBase-root MuiButton-root MuiButton-contained MuiButton-containedPrimary MuiButton-sizeSmall MuiButton-containedSizeSmall MuiButton-fullWidth MuiButton-root MuiButton-contained MuiButton-containedPrimary MuiButton-sizeSmall MuiButton-containedSizeSmall MuiButton-fullWidth DeleteChannelbutton css-jk7ztx-MuiButtonBase-root-MuiButton-root"
                       data-testid="deleteChannelButton"
                       tabindex="0"
                       type="button"
@@ -136,7 +136,7 @@ describe('LeaveCommunity', () => {
                     class="MuiGrid-root MuiGrid-container MuiGrid-item MuiGrid-grid-xs-12 DeleteChannelsecondaryButtonContainer css-s2k0j8-MuiGrid-root"
                   >
                     <button
-                      class="MuiButtonBase-root MuiButton-root MuiButton-contained MuiButton-containedPrimary MuiButton-sizeSmall MuiButton-containedSizeSmall MuiButton-fullWidth MuiButton-root MuiButton-contained MuiButton-containedPrimary MuiButton-sizeSmall MuiButton-containedSizeSmall MuiButton-fullWidth DeleteChannelsecondaryButton css-14mi2mx-MuiButtonBase-root-MuiButton-root"
+                      class="MuiButtonBase-root MuiButton-root MuiButton-contained MuiButton-containedPrimary MuiButton-sizeSmall MuiButton-containedSizeSmall MuiButton-fullWidth MuiButton-root MuiButton-contained MuiButton-containedPrimary MuiButton-sizeSmall MuiButton-containedSizeSmall MuiButton-fullWidth DeleteChannelsecondaryButton css-jk7ztx-MuiButtonBase-root-MuiButton-root"
                       tabindex="0"
                       type="button"
                     >

diff --git a/packages/desktop/src/renderer/components/Channel/File/FileComponent/FileComponent.tsx b/packages/desktop/src/renderer/components/Channel/File/FileComponent/FileComponent.tsx
@@ -31,14 +31,14 @@ const FileComponentStyled = styled('div')(({ theme }) => ({
   padding: '16px',
   backgroundColor: theme.palette.colors.white,
   borderRadius: '8px',
-  border: `1px solid ${theme.palette.colors.veryLightGray}`,
+  border: `1px solid ${theme.palette.colors.border01}`,
 
   [`& .${classes.icon}`]: {
     minWidth: '40px',
     width: '40px',
     height: '40px',
     borderRadius: '8px',
-    backgroundColor: '#F0F0F0',
+    backgroundColor: theme.palette.background.paper,
     display: 'flex',
     alignItems: 'center',
     justifyContent: 'center',

diff --git a/packages/desktop/src/renderer/components/Channel/File/UploadedImage/UploadedImage.test.tsx b/packages/desktop/src/renderer/components/Channel/File/UploadedImage/UploadedImage.test.tsx
@@ -55,7 +55,7 @@ describe('UploadedFile', () => {
             class="css-gd4qex"
           >
             <div
-              class="css-ytr8bc"
+              class="css-1i8wbh6"
               data-testid="abcd1234-imagePlaceholder"
             >
               <p
@@ -82,7 +82,7 @@ describe('UploadedFile', () => {
                       class="UploadedImagePlaceholdericon"
                     >
                       <span
-                        class="MuiCircularProgress-root MuiCircularProgress-indeterminate MuiCircularProgress-colorPrimary css-9a4009-MuiCircularProgress-root"
+                        class="MuiCircularProgress-root MuiCircularProgress-indeterminate MuiCircularProgress-colorPrimary css-acfop9-MuiCircularProgress-root"
                         role="progressbar"
                         style="width: 18px; height: 18px; position: absolute; color: rgb(178, 178, 178);"
                       >

diff --git a/...nderer/components/Channel/File/UploadedImagePlaceholder/UploadedImagePlaceholder.test.tsx b/...nderer/components/Channel/File/UploadedImagePlaceholder/UploadedImagePlaceholder.test.tsx
@@ -27,7 +27,7 @@ describe('UploadedImagePlaceholder', () => {
       <body>
         <div>
           <div
-            class="css-ytr8bc"
+            class="css-1i8wbh6"
             data-testid="hvb45FGa-imagePlaceholder"
           >
             <p
@@ -54,7 +54,7 @@ describe('UploadedImagePlaceholder', () => {
                     class="UploadedImagePlaceholdericon"
                   >
                     <span
-                      class="MuiCircularProgress-root MuiCircularProgress-indeterminate MuiCircularProgress-colorPrimary css-9a4009-MuiCircularProgress-root"
+                      class="MuiCircularProgress-root MuiCircularProgress-indeterminate MuiCircularProgress-colorPrimary css-acfop9-MuiCircularProgress-root"
                       role="progressbar"
                       style="width: 18px; height: 18px; position: absolute; color: rgb(178, 178, 178);"
                     >
@@ -107,7 +107,7 @@ describe('UploadedImagePlaceholder', () => {
       <body>
         <div>
           <div
-            class="css-ytr8bc"
+            class="css-1i8wbh6"
             data-testid="hvb45FGa-imagePlaceholder"
           >
             <p
@@ -134,7 +134,7 @@ describe('UploadedImagePlaceholder', () => {
                   >
                     <span
                       aria-valuenow="100"
-                      class="MuiCircularProgress-root MuiCircularProgress-determinate MuiCircularProgress-colorPrimary css-1rhqaqh-MuiCircularProgress-root"
+                      class="MuiCircularProgress-root MuiCircularProgress-determinate MuiCircularProgress-colorPrimary css-1036n7b-MuiCircularProgress-root"
                       role="progressbar"
                       style="width: 18px; height: 18px; transform: rotate(-90deg); position: absolute; color: rgb(231, 231, 231);"
                     >
@@ -155,7 +155,7 @@ describe('UploadedImagePlaceholder', () => {
                     </span>
                     <span
                       aria-valuenow="10"
-                      class="MuiCircularProgress-root MuiCircularProgress-determinate MuiCircularProgress-colorPrimary css-1rhqaqh-MuiCircularProgress-root"
+                      class="MuiCircularProgress-root MuiCircularProgress-determinate MuiCircularProgress-colorPrimary css-1036n7b-MuiCircularProgress-root"
                       role="progressbar"
                       style="width: 18px; height: 18px; transform: rotate(-90deg); color: rgb(178, 178, 178);"
                     >

diff --git a/...rc/renderer/components/Channel/File/UploadedImagePlaceholder/UploadedImagePlaceholder.tsx b/...rc/renderer/components/Channel/File/UploadedImagePlaceholder/UploadedImagePlaceholder.tsx
@@ -18,7 +18,7 @@ const classes = {
   icon: `${PREFIX}icon`,
 }
 
-const Root = styled('div')(() => ({
+const Root = styled('div')(({ theme }) => ({
   maxWidth: '400px',
   height: '100%',
 
@@ -29,7 +29,7 @@ const Root = styled('div')(() => ({
     alignItems: 'center',
     minWidth: '50px',
     minHeight: '50px',
-    backgroundColor: '#e0e0e0',
+    backgroundColor: theme.palette.background.paper,
   },
 
   [`& .${classes.placeholderIcon}`]: {
@@ -41,7 +41,7 @@ const Root = styled('div')(() => ({
     width: '40px',
     height: '40px',
     borderRadius: '8px',
-    backgroundColor: '#F0F0F0',
+    backgroundColor: theme.palette.background.paper,
     display: 'flex',
     alignItems: 'center',
     justifyContent: 'center',

diff --git a/packages/desktop/src/renderer/components/Channel/File/UploadingPreview.tsx b/packages/desktop/src/renderer/components/Channel/File/UploadingPreview.tsx
@@ -22,7 +22,7 @@ const classes = {
   tooltip: `${PREFIX}tooltip`,
 }
 
-const StyledFilePreviewComponent = styled('div')(() => ({
+const StyledFilePreviewComponent = styled('div')(({ theme }) => ({
   display: 'inline-block',
   float: 'left',
   cursor: 'pointer',
@@ -49,7 +49,7 @@ const StyledFilePreviewComponent = styled('div')(() => ({
     width: '64px',
     height: '64px',
     borderRadius: '15%',
-    backgroundColor: '#F0F0F0',
+    backgroundColor: theme.palette.background.paper,
     display: 'flex',
     alignItems: 'center',
     justifyContent: 'center',

diff --git a/packages/desktop/src/renderer/components/ChannelCreationModal/ChannelCreationModal.test.tsx b/packages/desktop/src/renderer/components/ChannelCreationModal/ChannelCreationModal.test.tsx
@@ -13,7 +13,7 @@ describe('Create ChannelCreationModalComponent', () => {
           aria-hidden="true"
         />
         <div
-          class="MuiModal-root css-1vjugmr-MuiModal-root"
+          class="MuiModal-root css-1evs64r-MuiModal-root"
           role="presentation"
         >
           <div

diff --git a/packages/desktop/src/renderer/components/ContextMenu/ContextMenu.component.tsx b/packages/desktop/src/renderer/components/ContextMenu/ContextMenu.component.tsx
@@ -10,6 +10,8 @@ import Icon from '../ui/Icon/Icon'
 import arrowLeft from '../../static/images/arrowLeft.svg'
 import arrowRightShort from '../../static/images/arrowRightShort.svg'
 
+import theme from '../../theme'
+
 export const ContextMenu: FC<ContextMenuProps> = ({ visible, handleClose, handleBack, title, children }) => {
   const ref = useRef<HTMLDivElement>(null)
 
@@ -50,8 +52,8 @@ export const ContextMenu: FC<ContextMenuProps> = ({ visible, handleClose, handle
           display: 'flex',
           flexDirection: 'column',
           alignItems: 'flex-start',
-          backgroundColor: '#ffffff',
-          boxShadow: '0px 0px 4px rgba(0, 0, 0, 0.25)',
+          backgroundColor: theme.palette.background.default,
+          boxShadow: theme.shadows[1],
           maxWidth: '375px',
           pointerEvents: 'auto',
         }}
@@ -65,7 +67,7 @@ export const ContextMenu: FC<ContextMenuProps> = ({ visible, handleClose, handle
             textAlign: 'center',
             height: 60,
             width: '100%',
-            borderBottom: '1px solid #F0F0F0',
+            borderBottom: `1px solid ${theme.palette.colors.border01}`,
           }}
         >
           <Grid
@@ -101,7 +103,7 @@ export const ContextMenuHint: FC<ContextMenuHintProps> = ({ hint }) => {
         width: '100%',
         padding: 16,
         borderTopWidth: 1,
-        borderColor: '#F0F0F0',
+        borderColor: theme.palette.colors.border01,
       }}
     >
       <Typography fontSize={14} fontWeight={'normal'}>
@@ -136,7 +138,7 @@ export const ContextMenuItem: FC<ContextMenuItemProps> = ({ title, action }) =>
         padding: '11px 16px',
         width: '100%',
         cursor: 'pointer',
-        borderBottom: '1px solid #F0F0F0',
+        borderBottom: `1px solid ${theme.palette.colors.border01}`,
       }}
       onClick={action}
       data-testid={`contextMenuItem${title}`}

diff --git a/...es/desktop/src/renderer/components/ContextMenu/menus/UserProfileContextMenu.container.tsx b/...es/desktop/src/renderer/components/ContextMenu/menus/UserProfileContextMenu.container.tsx
@@ -26,7 +26,7 @@ const classes = {
   editPhotoButton: `${PREFIX}editPhotoButton`,
 }
 
-const StyledContextMenuContent = styled(Grid)(() => ({
+const StyledContextMenuContent = styled(Grid)(({ theme }) => ({
   zIndex: 9002,
   flex: 1,
 
@@ -67,10 +67,10 @@ const StyledContextMenuContent = styled(Grid)(() => ({
 
   [`& .${classes.editUsernameField}`]: {
     color: '#33333380',
-    background: '#F0F0F0',
+    background: theme.palette.background.paper,
     margin: '0px 16px',
     padding: '16px',
-    border: '1px solid #B3B3B3',
+    border: `1px solid ${theme.palette.colors.border02}`,
     borderRadius: '8px',
     fontSize: '14px',
     fontWeight: '400',
@@ -81,7 +81,7 @@ const StyledContextMenuContent = styled(Grid)(() => ({
     background: 'inherit',
     padding: '6px 12px',
     borderRadius: '16px',
-    border: '1px solid #B3B3B3',
+    border: `1px solid ${theme.palette.colors.border02}`,
     fontSize: '14px',
     fontWeight: '400',
     textTransform: 'none',