Merge branch 'dev' into inline_code_escape_fix

.github/workflows/ui-test-automation.yml

@@ -20,6 +20,7 @@ jobs:
         uses: actions/checkout@v4
         with:
           repository: Satellite-im/Warp
+          ref: 32f4c53fc462d53553a31762ecd12b4af9329a4a
 
       - name: Set up cargo cache 🛠️
         uses: Swatinem/rust-cache@v2
@@ -129,6 +130,12 @@ jobs:
           name: peerID
           path: ./warp
 
+      - name: Install Wix
+        uses: actions/checkout@v4
+        with:
+          repository: fbarresi/wix
+          path: wix
+
       - name: Set up cargo cache 🛠️
         uses: Swatinem/rust-cache@v2
 
@@ -138,39 +145,24 @@ jobs:
           toolchain: 1.73.0
           components: rustfmt, clippy
 
+      - name: Install cargo wix
+        run: cargo install cargo-wix
+
       - name: Get Warp Peer ID and Build app 🚀
         run: |
           $localPeerId = Select-String -Path .\warp\peerID.txt -Pattern 'Local PeerID: ([^\s]*)' | ForEach-Object { $_.Matches.Groups[1].Value }
           echo "localPeerId=$localPeerId" >> $env:GITHUB_ENV
           $env:SHUTTLE_ADDR_POINT="/ip4/127.0.0.1/tcp/4444/p2p/" + $localPeerId
           cargo build --release
 
-      - name: Copy Extensions 🗳️
-        run: |
-          mkdir .\ui\extra\extensions
-          cp -r .\target\release\emoji_selector.d .\ui\extra\extensions\
-          cp -r .\target\release\emoji_selector.dll .\ui\extra\extensions\
-          cp -r .\target\release\emoji_selector.dll.exp .\ui\extra\extensions\
-          cp -r .\target\release\emoji_selector.dll.lib .\ui\extra\extensions\
-          cp -r .\target\release\emoji_selector.pdb .\ui\extra\extensions\
+      - name: Build Installer
+        run: cargo wix --package uplink --no-build --nocapture
 
       - name: Upload Executable ⬆️
         uses: actions/upload-artifact@v3
         with:
           name: Uplink-Windows
-          if-no-files-found: error
-          path: |
-            target\release\uplink.exe
-
-      - name: Upload Windows Assets
-        uses: actions/upload-artifact@v3
-        with:
-          name: uplink-windows-assets
-          path: |
-            ui\extra\images\
-            ui\extra\prism_langs\
-            ui\extra\themes\
-            ui\extra\extensions\
+          path: target/wix/*.msi
 
       - name: Add label if any of build or test jobs failed
         if: failure()
@@ -195,6 +187,7 @@ jobs:
         uses: actions/checkout@v4
         with:
           repository: Satellite-im/Warp
+          ref: 32f4c53fc462d53553a31762ecd12b4af9329a4a
           path: "./warp"
 
       - name: Download Key file 🗳️
@@ -327,6 +320,7 @@ jobs:
         uses: actions/checkout@v4
         with:
           repository: Satellite-im/Warp
+          ref: 32f4c53fc462d53553a31762ecd12b4af9329a4a
           path: "./warp"
 
       - name: Download Key file 🗳️
@@ -458,6 +452,7 @@ jobs:
         uses: actions/checkout@v4
         with:
           repository: Satellite-im/Warp
+          ref: 32f4c53fc462d53553a31762ecd12b4af9329a4a
           path: "./warp"
 
       - name: Download Key file 🗳️
@@ -500,21 +495,23 @@ jobs:
           name: Uplink-Windows
           path: ./apps
 
-      - name: Download the Windows app assets
-        uses: actions/download-artifact@v3
-        with:
-          name: uplink-windows-assets
-          path: ./apps
-
-      - name: Move Windows assets to correct locations 💿
+      - name: Install MSI and copy assets
         working-directory: ./apps
         run: |
-          mkdir ./bin/extra
-          mkdir ./extra
-          mv ./uplink.exe ./bin/
-          mv ./images/ ./bin/extra/
-          mv ./prism_langs/ ./bin/extra/
-          mv ./themes/ ./extra/
+          Get-ChildItem -Recurse -Include "*.msi" | Rename-Item -NewName "uplink.msi"
+          mkdir C:\uplink
+          mv ./uplink.msi C:\uplink
+          Start-Process msiexec.exe -Wait -ArgumentList '/i "C:\uplink\uplink.msi" /qb'
+
+      - name: Copy assets from Uplink for Appium Execution
+        run: |
+          mkdir C:\Program` Files\extensions
+          mkdir $home/.uplink/themes
+          mkdir $home/.uplink/extensions
+          cp -r C:\Program` Files\uplink\bin\uplink.exe C:\Program` Files\uplink
+          cp -r C:\Program` Files\uplink\extensions\emoji_selector.dll C:\Program` Files\extensions
+          cp -r C:\Program` Files\uplink\extra\themes\ $home/.uplink/themes
+          cp -r C:\Program` Files\uplink\extensions\emoji_selector.dll $home/.uplink/extensions
 
       - name: Install and Run Appium Server 💻
         run: |
@@ -531,7 +528,7 @@ jobs:
         id: setup-ffmpeg
 
       - name: Delete Cache Folder if exists - Windows
-        run: If (Test-Path $home/.uplink) {Remove-Item -Recurse -Force $home/.uplink} Else { Break }
+        run: If (Test-Path $home/.uplink/.user) {Remove-Item -Recurse -Force $home/.uplink/.user} Else { Break }
         shell: powershell
 
       - name: Run cargo build shuttle on Warp 🚀

docs/release-flow.md

@@ -0,0 +1,81 @@
+# Release flow
+
+
+## Testing `dev` branch release:
+
+- Go to the [private repo](https://github.com/Satellite-im/Uplink-copy/tree/dev)
+- If you want try a release with the same content as the `dev` branch, you go to the `actions` tab and select [A1 - Sync Public Repo to Private
+](https://github.com/Satellite-im/Uplink-copy/actions/workflows/sync-repo.yml) workflow and click on `Run workflow` and then again on `Run workflow` green button
+
+
+https://github.com/Satellite-im/Uplink/assets/29093946/4fb57366-71c8-4d25-a0a0-8a6cacedf689
+
+
+If you wanna send a specific branch from public repo to private one, you go to the `actions` tab and select [A2 - Sync Public Repo to Private
+](https://github.com/Satellite-im/Uplink-copy/actions/workflows/sync-branch.yml) workflow and click on `Run workflow` and add the branch name and click again on `Run workflow` green button 
+
+
+https://github.com/Satellite-im/Uplink/assets/29093946/3662b81d-469f-4b81-a116-b9192709d187
+
+
+# How to do a release with the same content as dev
+
+
+https://github.com/Satellite-im/Uplink/assets/29093946/d8fd9eb5-34a7-47df-948f-856a0f2bfcff
+
+
+# How to do a release with the same content as a specific branch
+
+
+https://github.com/Satellite-im/Uplink/assets/29093946/97ef7baf-13a8-41ae-a2b3-cb240940989b
+
+The artifacts will appear under the release number you choose above 
+
+example
+
+<img width="1191" alt="Captura de ecrã 2024-02-03, às 00 27 34" src="https://github.com/Satellite-im/Uplink/assets/29093946/178b7768-fbba-4c68-927e-e76b9b1f9161">
+
+
+# How to do the real release
+
+- Test the release with the above steps
+- Add a commit updating Cargo.toml and Cargo.lock with the release number that you wanna do
+- Push that to dev
+- Go to tags
+- Create a new tag with that number
+- Create a release with that tag, add title in this case the same number as the release and description
+- Done
+
+https://github.com/Satellite-im/Uplink/assets/29093946/748d192e-752d-43cb-9c51-7791a19b93c7
+
+## Add assets to Windows Installer
+
+Uplink is installed on Windows through a Windows Installer (MSI) created with Wix Toolset. When you are adding an asset file (images, extensions, themes, etc.), this file will need to be added to the [wix configuration file](../ui/wix/main.wxs), in order to include the same file as part of the assets file copied during the installation process performed when execution the Windows Installer.
+
+1. First, you need to create an element with component tag including the following data:
+- Id: Any value that will be used to identify the file when creating the ComponentRef element
+- Guid: A guid value that will be a unique identifier for the file. You can autogenerate one using a guid generator, for example [GuidGen](https://www.guidgen.com/)
+
+2. Inside the Component tag element, you will have to add a file tag with the following properties:
+- Id: Any value that will be used to identify the file
+- Name: Any name that will be used to identify the file
+- DiskId: Assign the value "1"
+- KeyPath: Assign the value "yes"
+- Source: Pass the relative path to the file. In the example provided below, the file location provided is for [AU Flag](../ui/extra/images/flags/AU-flag.png)
+
+Example:
+```
+<Component Id="cmpAUflag.png" Guid="1A45E907-FC60-4195-BE6B-5BCEAB44BF74">
+    <File Id="AUflag.png" Name="AU-flag.png" DiskId="1" KeyPath="yes" Source="$(var.CargoTargetDir)\..\ui\extra\images\flags\AU-flag.png" />
+</Component>
+```
+
+3. Later, inside the feature tag element, there are child elements with tag = "ComponentRef". You will need to add one "ComponentRef" element with the following property:
+
+- Id: Same Id assigned to Component Id
+
+```
+<ComponentRef Id="cmpAUflag.png" />
+```
+
+This is a process that needs to be done in order to include assets in releases versions for Windows. For MacOS, all assets are automatically copied when running ```make dmg```, and for Linux, all assets are added when running the bash script to create Linux releases: [Linux Installer Script](../build_linux_installer.sh)

ui/src/components/settings/styles.scss

@@ -122,15 +122,15 @@
   align-content: center;
   align-items: center;
   padding: 0 var(--gap) 0 0;
-  
+
   .keybind-section-mask {
     top: 0;
     left: 0;
     bottom: 0;
     right: 0;
     position: fixed;
     z-index: 2;
-    background-color: rgba(0,0,0, 0.75);
+    background-color: rgba(0, 0, 0, 0.75);
     transition: background-color 0.3s ease;
   }
 
@@ -158,7 +158,7 @@
       stroke: none;
     }
   }
-  
+
   .keybind-section-keys {
     cursor: pointer;
     height: var(--height-input);
@@ -204,7 +204,6 @@
     }
   }
 
-
   &.highlight {
     .keybind-section-keys {
       border: 2px solid var(--info);
@@ -237,30 +236,38 @@
 }
 
 .volume-indicator-wrap {
-  width: 100%; 
-  height: var(--text-size-more); 
+  width: 100%;
+  height: var(--text-size-more);
   position: relative;
 }
 
 .volume-indicator-wrap {
-  width: 100%; 
-  height: var(--text-size-more); 
+  width: 100%;
+  height: var(--text-size-more);
   position: relative;
 }
 
 .volume-indicator {
-  position: absolute; 
-  width: 100%; 
-  height: 100%; 
-  border-radius: var(--border-radius); 
-  background: linear-gradient(90deg, 
-  #00b894 0% 75%,
-  #feca57 75% 90%, 
-  #ba0c0c 90%);
+  position: absolute;
+  width: 100%;
+  height: 100%;
+  border-radius: var(--border-radius);
+  background: linear-gradient(
+    90deg,
+    #00b894 0% 75%,
+    #feca57 75% 90%,
+    #ba0c0c 90%
+  );
 }
 
 .volume-indicator-overlay {
   right: 0;
   border-radius: 0;
   background: rgba(0, 0, 0, 0.5);
-}
+}
+
+.flags-settings img {
+  width: 30px;
+  height: 25px;
+  margin-right: 5px;
+}