Update typescript requirement from ^4.7.3 to ^4.8.4

Updates the requirements on [typescript](https://github.com/Microsoft/TypeScript) to permit the latest version.
- [Release notes](https://github.com/Microsoft/TypeScript/releases)
- [Commits](https://github.com/Microsoft/TypeScript/compare/v4.7.3...v4.8.4)

---
updated-dependencies:
- dependency-name: typescript
  dependency-type: direct:development
...

Signed-off-by: dependabot[bot] <support@github.com>

.github/dependabot.yml

@@ -1,6 +1,10 @@
 version: 2
 updates:
-- package-ecosystem: npm
+  - package-ecosystem: "github-actions"
+    directory: "/"
+    schedule:
+      interval: "daily"
+  - package-ecosystem: npm
     directory: "/"
     schedule:
       interval: daily

.github/workflows/dev.yml

@@ -19,11 +19,14 @@ jobs:
             - name: Checkout code
               uses: actions/checkout@v2
 
+            - name: Install pnpm
+              run: npm i -g pnpm
+
             - name: Install Node dependencies
-              run: npm install
+              run: pnpm install
 
             - name: Install Electron-Builder
-              run: npm install -g electron-builder
+              run: pnpm install -g electron-builder
 
             - name: Replace the version number
               run: cat src/utils.ts | sed -e 's/[[:digit:]]\.[[:digit:]]\.[[:digit:]]/DEV/g' | tee src/utils.ts > /dev/null
@@ -53,11 +56,14 @@ jobs:
             - name: Checkout code
               uses: actions/checkout@v2
 
+            - name: Install pnpm
+              run: npm i -g pnpm
+
             - name: Install Node dependencies
-              run: npm install
+              run: pnpm install
 
             - name: Install Electron-Builder
-              run: npm install -g electron-builder
+              run: pnpm install -g electron-builder
 
             - name: Replace the version number
               run: cat src/utils.ts | sed -e 's/[[:digit:]]\.[[:digit:]]\.[[:digit:]]/DEV/g' | tee src/utils.ts > /dev/null
@@ -84,11 +90,14 @@ jobs:
             - name: Checkout code
               uses: actions/checkout@v2
 
+            - name: Install pnpm
+              run: npm i -g pnpm
+
             - name: Install Node dependencies
-              run: npm install
+              run: pnpm install
 
             - name: Install Electron-Builder
-              run: npm install -g electron-builder
+              run: pnpm install -g electron-builder
 
             - name: Replace the version number
               run: (Get-Content src/utils.ts) -replace "\d\.\d\.\d", "DEV" | Out-File src/utils.ts

.github/workflows/stable.yml

@@ -19,11 +19,14 @@ jobs:
             - name: Checkout code
               uses: actions/checkout@v2
 
+            - name: Install pnpm
+              run: npm i -g pnpm
+
             - name: Install Node dependencies
-              run: npm install
+              run: pnpm install
 
             - name: Install Electron-Builder
-              run: npm install -g electron-builder
+              run: pnpm install -g electron-builder
 
             - name: Build
               run: npm run build && electron-builder --linux && electron-builder --arm64 --linux && electron-builder --armv7l --linux
@@ -51,11 +54,14 @@ jobs:
             - name: Checkout code
               uses: actions/checkout@v2
 
+            - name: Install pnpm
+              run: npm i -g pnpm
+
             - name: Install Node dependencies
-              run: npm install
+              run: pnpm install
 
             - name: Install Electron-Builder
-              run: npm install -g electron-builder
+              run: pnpm install -g electron-builder
 
             - name: Build
               run: npm run build && electron-builder --macos
@@ -83,11 +89,14 @@ jobs:
             - name: Checkout code
               uses: actions/checkout@v2
 
+            - name: Install pnpm
+              run: npm i -g pnpm
+
             - name: Install Node dependencies
-              run: npm install
+              run: pnpm install
 
             - name: Install Electron-Builder
-              run: npm install -g electron-builder
+              run: pnpm install -g electron-builder
 
             - name: Build
               run: npm run build && electron-builder --windows

.github/workflows/winget.yml

@@ -7,7 +7,7 @@ jobs:
   publish:
     runs-on: windows-latest # Action can only be run on windows
     steps:
-      - uses: vedantmgoyal2009/winget-releaser@latest
+      - uses: vedantmgoyal2009/winget-releaser@v1
         with:
           identifier: ArmCord.ArmCord
           token: ${{ secrets.WINGET_TOKEN }}

README.md

@@ -64,9 +64,9 @@ ArmCord is also available in [Pi-Apps](https://github.com/Botspot/pi-apps).
 
 
 ### Compiling:
- Alternatively you can run ArmCord from source (NodeJS and npm required):    
+ Alternatively you can run ArmCord from source (NodeJS and pnpm required):    
  1. Clone ArmCord repo: `git clone https://github.com/ArmCord/ArmCord.git`    
- 2. Run `npm install` to install dependencies   
+ 2. Run `pnpm install` to install dependencies   
  3. Build with `npm run build`   
  4. Compile/Package with `npm run package`    
 

assets/lang/fr-FR.json

@@ -32,7 +32,7 @@
     "settings-channel-desc4": "public test build. Receives features earlier than stable but is a bit older than Canary.",
     "settings-altPaste": "Alternative Paste",
     "settings-storageFolder": "Open storage folder",
-    "settings-theme-desc2": "this is how ArmCord looks when you first launch it. It includes recreation of Discord's\n                custom titlebar and ArmCord specific styles injected into Discord.",
+    "settings-theme-desc2": "voilà à quoi ressemble ArmCord quand vous le lancez pour la première fois. Cela inclu une reconstitution de la barre de titre de Discord, ainsi que le style spécifique de ArmCord administré sur Discord",
     "settings-theme-desc3": "uses native titlebar of OS you're currently running (e.g Windows 7/10). Functions more\n                similar to actual Discord app on Linux.",
     "settings-csp-desc": "ArmCord CSP is our system that manages loading custom content loading into the Discord app. Stuff like\n                client mods and themes depend on it. Disable if you want to get rid of mods and custom styles.",
     "settings-tray-desc": "When disabled, ArmCord will close like any other window when closed, otherwise it'll sit back and relax\n                in your system tray for later.",

assets/lang/ko-KR.json

@@ -1,57 +1,57 @@
 {
-    "loading_screen_start": "Starting ArmCord…",
+    "loading_screen_start": "ArmCod 시작 중…",
-    "loading_screen_offline": "You appear to be offline. Please connect to the Internet and try again.",
+    "loading_screen_offline": "오프라인 상태인 것 같습니다. 인터넷에 연결하고 다시 시도하세요.",
-    "setup_question1_answer1": "Express Setup",
+    "setup_question1_answer1": "빠른 설정",
-    "settings-channel-desc4": "public test build. Receives features earlier than stable but is a bit older than Canary.",
+    "settings-channel-desc4": "공개 테스트 빌드입니다. 안정적인 기능보다 먼저 기능을 수신하지만 Canary보다 약간 오래되었습니다.",
-    "settings-mod-desc3": "light, secure, and easy to use, with out of the box experience. Features a built-in\n                store for plugins.",
+    "settings-mod-desc3": "가볍고 안전하며 사용이 간편하며 즉시 사용할 수 있습니다. 플러그인을 위한 내장\n                저장소가 있습니다.",
-    "settings-mod-desc4": "heavily work in progress, doesn't have a working UI.",
+    "settings-mod-desc4": "많은 작업이 진행 중이며 작동하는 UI가 없습니다.",
-    "settings-prfmMode": "Performance mode is an experimental function that may either increase responsiveness and performance of\n                ArmCord or... decrease it. Please try every option and see which fits you the best.",
+    "settings-prfmMode": "성능 모드는 ArmCord의 응답성과 성능을 높이거나 낮출 수 있는\n                실험적인 기능입니다. 모든 옵션을 시도하고 가장 적합한 옵션을 찾으세요.",
-    "setup_question1": "Select what kind of setup you want to perform:",
+    "setup_question1": "수행할 설정 유형 선택:",
-    "setup_question1_answer2": "Full Setup",
+    "setup_question1_answer2": "전체 설정",
-    "setup_offline": "You appear to be offline. Please connect to the internet and restart ArmCord.",
+    "setup_offline": "오프라인 상태인 것 같습니다. 인터넷에 연결하고 ArmCord를 다시 시작하세요.",
-    "loading_screen_update": "A new version of ArmCord is available. Please update to the latest version.",
+    "loading_screen_update": "ArmCord의 새 버전을 사용할 수 있습니다. 최신 버전으로 업데이트하세요.",
-    "setup_question2": "Choose your Discord channel/instance:",
+    "setup_question2": "디스코드 채널/인스턴스를 선택:",
-    "setup_question3": "Should ArmCord handle client mods installation?",
+    "setup_question3": "ArmCord가 클라이언트 모드 설치를 처리해야 하나요?",
-    "yes": "Yes",
+    "yes": "예",
-    "no": "No",
+    "no": "아니오",
-    "next": "Next",
+    "next": "다음",
-    "setup_question4": "Select a client mod you want to install:",
+    "setup_question4": "설치하려는 클라이언트 모드 선택:",
-    "setup_question4_clientmodnotice": "Why not all of them? Having many client mods at the same time can cause issues. If you really want to do it though, check our Discord.",
+    "setup_question4_clientmodnotice": "왜 그것들 모두가 아닌 것인가요? 동시에 많은 클라이언트 모드를 사용하면 문제가 발생할 수 있습니다. 그래도 정말로 하고 싶다면 디스코드를 확인하세요.",
-    "settings-theme": "ArmCord theme",
+    "settings-theme": "ArmCord 테마",
-    "settings-theme-desc1": "ArmCord \"themes\" manage apps behaviour and looks.",
+    "settings-theme-desc1": "ArmCord \"테마\"는 앱 동작과 모양을 관리합니다.",
-    "settings-theme-desc2": "this is how ArmCord looks when you first launch it. It includes recreation of Discord's\n                custom titlebar and ArmCord specific styles injected into Discord.",
+    "settings-theme-desc2": "ArmCord를 처음 실행할 때의 모습입니다. 여기에는 디스코드의 레크리에이션 포함\n                디스코드에 삽입된 사용자 정의 제목 표시줄 및 ArmCord 특정 스타일입니다.",
-    "settings-theme-desc3": "uses native titlebar of OS you're currently running (e.g Windows 7/10). Functions more\n                similar to actual Discord app on Linux.",
+    "settings-theme-desc3": "현재 실행 중인 OS의 기본 제목 표시줄을 사용합니다 (예: 윈도우즈 7/10). 더 많은 기능\n                리눅스의 실제 디스코드 앱과 유사합니다.",
-    "settings-theme-default": "Default",
+    "settings-theme-default": "기본값",
-    "settings-theme-native": "Native",
+    "settings-theme-native": "실제",
-    "settings-csp-desc": "ArmCord CSP is our system that manages loading custom content loading into the Discord app. Stuff like\n                client mods and themes depend on it. Disable if you want to get rid of mods and custom styles.",
+    "settings-csp-desc": "ArmCord CSP는 디스코드 앱에 불러오는 맞춤형 콘텐츠 로드를 관리하는 시스템입니다. 이런\n                클라이언트 모드 및 테마는 이에 따라 다릅니다. 모드 및 사용자 정의 스타일을 제거하려면 비활성화하세요.",
-    "settings-tray": "Minimize to tray",
+    "settings-tray": "트레이로 최소화",
-    "settings-tray-desc": "When disabled, ArmCord will close like any other window when closed, otherwise it'll sit back and relax\n                in your system tray for later.",
+    "settings-tray-desc": "비활성화되면, ArmCord는 닫힐 때 다른 창처럼 닫히고, 그렇지 않으면 편안하게 앉아 휴식을 취하고\n                나중을 위해 시스템 트레이에 저장합니다.",
-    "settings-patches": "Automatic Patches",
+    "settings-patches": "자동 패치",
-    "settings-patches-desk": "Fetches automatic patches that are distributed if release turns out to have bugs after release. Usually\n                you don't have to keep this enabled, unless notified in support Discord.",
+    "settings-patches-desk": "개정 후에 버그가 있는 것으로 판명되면 배포되는 자동 패치를 가져옵니다. 대개\n                지원 디스코드에서 알림을 받지 않는 한 이 기능을 계속 활성화할 필요는 없습니다.",
-    "settings-mobileMode": "Mobile mode",
+    "settings-mobileMode": "모바일 모드",
-    "settings-channel-desc3": "this is alpha test release of Discord. By using it you gain access to the newest\n                    features and fixes.",
+    "settings-channel-desc3": "이것은 디스코드의 알파 테스트 릴리스입니다. 그것을 사용하면 최신 정보\n                    기능 및 수정 사항에 접속할 수 있습니다.",
-    "settings-channel-desc5": "unofficial instance of Discord that takes you back to 2016! Only client mod\n                    available to run alongside with it is Cordwood. It's run by community, so you take all the risk by\n                    using it.",
+    "settings-channel-desc5": "2016년으로 돌아가는 Discord의 비공식 인스턴스입니다! 클라이언트 모드만\n                    함께 실행할 수 있는 것은 Cordwood입니다. 커뮤니티에서 운영하므로 이를 사용함으로써\n                    모든 위험을 감수해야 합니다.",
-    "settings-invitewebsocket": "Invite Websocket",
+    "settings-invitewebsocket": "웹소켓 초대",
-    "settings-mobileMode-desc": "If you're on a device with touch-screen this feature is for you! It activates Discord's hidden mobile\n                mode meant for phones and tablets. Only major feature missing is voice chat support. This is ideal for\n                users on PinePhone and similar.",
+    "settings-mobileMode-desc": "터치 스크린이 있는 장치를 사용하는 경우 이 기능이 적합합니다! 디스코드의 숨겨진 모바일을 활성화하며\n                휴대전화와 태블릿을 위한 모드입니다. 이것은\n                PinePhone 및 이와 유사한 사용자에게 이상적입니다.",
-    "settings-channel": "Discord channel",
+    "settings-channel": "디스코드 채널",
-    "settings-channel-desc1": "You can use this setting to change current instance of Discord:",
+    "settings-channel-desc1": "이 설정을 사용하여 디스코드의 현재 인스턴스를 변경할 수 있음:",
-    "settings-channel-desc2": "you're probably most familiar with this one. It's the one you see in default Discord\n                    client!",
+    "settings-channel-desc2": "당신은 아마도 이것을 가장 잘 알고 있을 것입니다. 기본 디스코드 클라이언트에서\n                    볼 수 있는 것입니다!",
-    "settings-invitewebsocket-desc": "When enabled ArmCord will support Discord.gg links which means that if you open an invite link in your\n                browser, ArmCord will automatically accept the invite. Can be unresponsive at times.",
+    "settings-invitewebsocket-desc": "활성화되면 ArmCord는 Discord.gg 링크를 지원하므로 초대 링크를\n                브라우저에서 열면, ArmCod는 자동으로 초대를 수락합니다. 때때로 응답하지 않을 수 있습니다.",
-    "settings-altPaste": "Alternative Paste",
+    "settings-altPaste": "대체 붙여넣기",
-    "settings-altPaste-desc": "If you're on Gnome on Linux or just simply can't paste images copied from other messages, then this is\n                for you. This enables alternative module for pasting images. Only enable this when you're experiencing\n                issues.",
+    "settings-altPaste-desc": "리눅스의 그놈을 사용 중이거나 단순히 다른 메시지에서 복사한 이미지를 붙여넣을 수 없다면 이것은\n                당신을 위한 것입니다. 문제가 발생한 경우에만 이 기능을\n                활성화하세요.",
-    "settings-mod": "Client mod",
+    "settings-mod": "클라이언트 모드",
-    "settings-mod-desc1": "Client mods are programs that allow you customize your Discord experience. They can change appearance of\n                the client, modify behaviours or add new features!",
+    "settings-mod-desc1": "클라이언트 모드는 디스코드 경험을 사용자 지정할 수 있는 프로그램입니다. 클라이언트의 모양을 변경하거나 동작을 수정하거나\n                새로운 기능을 추가할 수 있습니다!",
-    "settings-mod-desc2": "focuses on making the Discord plugin development experience easier. Minimal and\n                lightweight.",
+    "settings-mod-desc2": "디스코드 플러그인 개발 경험을 더 쉽게 만드는 데 중점을 둡니다. 최소화 및\n                경량화.",
-    "settings-prfmMode-performance": "Performance",
+    "settings-prfmMode-performance": "성능",
-    "settings-prfmMode-battery": "Battery",
+    "settings-prfmMode-battery": "배터리",
-    "settings-trayIcon": "Tray icon",
+    "settings-trayIcon": "트레이 아이콘",
-    "settings-trayIcon-desc": "Set the icon which will appear in tray menu.",
+    "settings-trayIcon-desc": "트레이 메뉴에 나타날 아이콘을 설정합니다.",
-    "settings-advanced": "️Advanced user zone",
+    "settings-advanced": "고급 사용자 영역",
-    "settings-pluginsFolder": "Open plugins folder",
+    "settings-pluginsFolder": "플러그인 폴더 열기",
-    "settings-themesFolder": "Open themes folder",
+    "settings-themesFolder": "테마 폴더 열기",
-    "settings-storageFolder": "Open storage folder",
+    "settings-storageFolder": "저장소 폴더 열기",
-    "settings-none": "None",
+    "settings-none": "없음",
-    "settings-save": "Save Settings",
+    "settings-save": "설정 저장",
-    "settings-restart": "Restart App",
+    "settings-restart": "앱 다시 시작",
-    "settings-updater": "Check for updates"
+    "settings-updater": "업데이트 확인"
 }

assets/lang/ru-RU.json

@@ -18,10 +18,10 @@
     "settings-theme-native": "Нативная",
     "settings-tray": "Свернуть в область уведомлений",
     "settings-patches": "Автоматические патчи",
-    "settings-channel": "Канал Discord:",
+    "settings-channel": "Канал Discord",
     "settings-invitewebsocket": "Пригласить Websocket",
-    "settings-mod": "Клиентский мод:",
+    "settings-mod": "Клиентский мод",
-    "settings-prfmMode": "Режим производительности:",
+    "settings-prfmMode": "Режим производительности - это экспериментальная функция, которая может либо увеличить отзывчивость и производительность\n                ArmCord, либо... снизить их. Пожалуйста, попробуйте все варианты и посмотрите, какой подходит вам больше всего.",
     "settings-prfmMode-performance": "Производительность",
     "settings-prfmMode-battery": "Батарея",
     "settings-none": "Ничего",
@@ -32,26 +32,26 @@
     "settings-tray-desc": "Если отключено, ArmCord будет закрываться как любое другое окно, в противном случае он будет сидеть и отдыхать\n                в системном трее для последующего использования.",
     "settings-patches-desk": "Подбирает автоматические исправления, которые распространяются, если после выпуска релиза обнаруживаются ошибки. Обычно\n                вам не нужно держать эту функцию включенной, если только вас не уведомят об этом в Discord.",
     "settings-channel-desc1": "Вы можете использовать эту настройку для изменения текущего экземпляра Discord:",
-    "settings-pluginsFolder": "Open plugins folder",
+    "settings-pluginsFolder": "Открыть папку плагинов",
-    "settings-themesFolder": "Open themes folder",
+    "settings-themesFolder": "Открыть папку тем",
-    "settings-storageFolder": "Open storage folder",
+    "settings-storageFolder": "Откройте папку хранения",
     "settings-channel-desc2": "вы, вероятно, наиболее знакомы с этой. Именно его вы видите в стандартном клиенте Discord\n                    клиент!",
     "settings-channel-desc3": "это альфа-тестовый выпуск Discord. Используя его, вы получаете доступ к новейшим\n                    функциям и исправлениям.",
-    "settings-theme-desc1": "\"Темы\" ArmCord управляет поведение приложений и внешним видом.",
+    "settings-theme-desc1": "\"Темы\" ArmCord управляют поведением и внешним видом приложений.",
     "settings-theme-desc2": "Вот так выглядит ArmCord при первом запуске. Он включает в себя воссоздание\n                кастомизируемого заголовка Discord и стилей ArmCord, внедрённых в Discord.",
     "settings-theme-desc3": "использует встроенный заголовок окна текущей ОС, которая у вас запущена (например, Windows 7/10). Функционирует как\n                в актуальном приложении Discord на Linux.",
     "settings-mobileMode-desc": "Если вы пользуетесь устройством с сенсорным экраном, эта функция для вас! Она активирует скрытый мобильный\n                режим, предназначенный для телефонов и планшетов. Единственная недостающая функция - поддержка голосового чата. Это идеально подходит для\n                пользователей PinePhone и подобных устройств.",
     "settings-channel-desc4": "публичная тестовая сборка. Получает функции раньше, чем стабильная, но немного старше Canary.",
-    "settings-channel-desc5": "unofficial instance of Discord that takes you back to 2016! None of the client mods\n                    bundled with ArmCord work with it. It's run by community, so you take all the risk by using it.",
+    "settings-channel-desc5": "Неофициальная версия Discord, которая вернет вас в 2016 год! Единственный клиентский мод\n                    доступный для запуска вместе с ним - это Cordwood. Он управляется сообществом, поэтому вы берете на себя весь риск, используя\n                    используя его.",
-    "settings-invitewebsocket-desc": "When enabled ArmCord will support Discord.gg links which means that if you open an invite link in your\n                browser, ArmCord will automatically accept the invite. Can be unresponsive at times.",
+    "settings-invitewebsocket-desc": "Когда эта функция включена, ArmCord будет поддерживать ссылки Discord.gg, что означает, что если вы откроете ссылку приглашения в вашем\n                браузере, ArmCord автоматически примет приглашение. Иногда может не реагировать на приглашения.",
-    "settings-altPaste": "Alternative Paste",
+    "settings-altPaste": "Альтернативная вставка",
-    "settings-altPaste-desc": "If you're on Gnome on Linux or just simply can't paste images copied from other messages, then this is\n                for you. This enables alternative module for pasting images. Only enable this when you're experiencing\n                issues.",
+    "settings-altPaste-desc": "Если вы работаете под Gnome в Linux или просто не можете вставить изображения, скопированные из других сообщений, то это для вас\n                для вас. Это включает альтернативный модуль для вставки изображений. Включайте его только в том случае, если у вас возникли\n                проблемы.",
-    "settings-mod-desc1": "Client mods are programs that allow you customize your Discord experience. They can change appearance of\n                the client, modify behaviours or add new features!",
+    "settings-mod-desc1": "Клиентские моды - это программы, которые позволяют вам настроить работу с Discord. Они могут изменять внешний вид\n                клиента, изменять поведение или добавлять новые возможности!",
-    "settings-mod-desc2": "focuses on making the Discord plugin development experience easier. Minimal and\n                lightweight.",
+    "settings-mod-desc2": "фокусируется на упрощении разработки плагинов для Discord. Минимальный и\n                легкий.",
-    "settings-mod-desc3": "light, secure, and easy to use, with out of the box experience. Features a built-in\n                store for plugins.",
+    "settings-mod-desc3": "Легкий, надежный и простой в использовании, с опытом работы \"из коробки\". Имеет встроенный\n                магазин для плагинов.",
-    "settings-mod-desc4": "heavily work in progress, doesn't have a working UI.",
+    "settings-mod-desc4": "сильно запущен, не имеет рабочего пользовательского интерфейса.",
-    "settings-trayIcon": "Tray icon",
+    "settings-trayIcon": "Иконка панели задач",
-    "settings-trayIcon-desc": "Set the icon which will appear in tray menu.",
+    "settings-trayIcon-desc": "Установите значок, который будет отображаться в меню трея.",
-    "settings-advanced": "️Advanced user zone",
+    "settings-advanced": "️ Расширенная пользовательская зона",
-    "settings-restart": "Restart App"
+    "settings-restart": "Перезапустить приложение"
 }

package.json

@@ -35,9 +35,10 @@
     "electron-builder": "^23.0.3",
     "husky": "^8.0.1",
     "prettier": "^2.7.0",
-    "typescript": "^4.7.3"
+    "typescript": "^4.8.4"
   },
   "dependencies": {
+    "@pyke/vibe": "^0.3.0",
     "electron-context-menu": "github:ArmCord/electron-context-menu",
     "os-locale": "^6.0.2",
     "v8-compile-cache": "^2.3.0",

src/main.ts

@@ -5,7 +5,7 @@ import {getConfig, checkIfConfigExists, injectElectronFlags} from "./utils";
 import "./extensions/mods";
 import "./extensions/plugin";
 import "./tray";
-import {createCustomWindow, createNativeWindow} from "./window";
+import {createCustomWindow, createNativeWindow, createTransparentWindow} from "./window";
 import path from "path";
 export var iconPath: string;
 export var settings: any;
@@ -40,6 +40,9 @@ app.whenReady().then(async () => {
             case "native":
                 createNativeWindow();
                 break;
+            case "transparent":
+                createTransparentWindow();
+                break;
             case "basic":
                 createNativeWindow();
                 break;

src/tray.ts

@@ -20,8 +20,7 @@ app.whenReady().then(async () => {
         }
     };
 
-    if (process.platform == "darwin" && trayPath.getSize().height > 22) 
+    if (process.platform == "darwin" && trayPath.getSize().height > 22) trayPath = trayPath.resize({height: 22});
-        trayPath = trayPath.resize({height: 22});
 
     if ((await getConfig("windowStyle")) == "basic") {
         var clientName = (await getConfig("clientName")) ?? "ArmCord";
@@ -32,12 +31,12 @@ app.whenReady().then(async () => {
                     {
                         label: `Finish the setup first!`,
                         enabled: false
-                    }, {
+                    },
+                    {
                         label: `Quit ${clientName}`,
                         click: async function () {
                             fs.unlink(await getConfigLocation(), (err) => {
-                                if (err) 
+                                if (err) throw err;
-                                    throw err;
 
                                 console.log('Closed during setup. "settings.json" was deleted');
                                 app.quit();
@@ -52,7 +51,8 @@ app.whenReady().then(async () => {
                         click: function () {
                             mainWindow.show();
                         }
-                    }, {
+                    },
+                    {
                         label: `Quit ${clientName}`,
                         click: function () {
                             let [width, height] = mainWindow.getSize();
@@ -74,12 +74,12 @@ app.whenReady().then(async () => {
                 {
                     label: `Finish the setup first!`,
                     enabled: false
-                }, {
+                },
+                {
                     label: `Quit ${clientName}`,
                     click: async function () {
                         fs.unlink(await getConfigLocation(), (err) => {
-                            if (err) 
+                            if (err) throw err;
-                                throw err;
 
                             console.log('Closed during setup. "settings.json" was deleted');
                             app.quit();
@@ -109,15 +109,18 @@ app.whenReady().then(async () => {
                     click: function () {
                         createSettingsWindow();
                     }
-                }, {
+                },
+                {
                     label: "Support Discord Server",
                     click: function () {
                         mainWindow.show();
                         mainWindow.loadURL("https://discord.gg/TnhxcqynZ2");
                     }
-                }, {
+                },
+                {
                     type: "separator"
-                }, {
+                },
+                {
                     label: `Quit ${clientName}`,
                     click: function () {
                         app.quit();
@@ -126,7 +129,8 @@ app.whenReady().then(async () => {
             ]);
             tray.setContextMenu(contextMenu);
         }
-    } tray.setToolTip(clientName);
+    }
+    tray.setToolTip(clientName);
     tray.on("click", function () {
         mainWindow.show();
     });

src/utils.ts

@@ -1,8 +1,10 @@
 import * as fs from "fs";
 import {app, dialog} from "electron";
 import path from "path";
+import vibe from "@pyke/vibe";
 export var firstRun: boolean;
 export var contentPath: string;
+export var transparency: boolean;
 //utility functions that are used all over the codebase or just too obscure to be put in the file used in
 export function addStyle(styleString: string) {
     const style = document.createElement("style");
@@ -118,6 +120,11 @@ export async function injectElectronFlags() {
         default:
             console.log("No performance modes set");
     }
+    if ((await getConfig("windowStyle")) == "transparent") {
+        console.log("Transparent mode enabled");
+        vibe.setup(app);
+        transparency = true;
+    }
 }
 export async function setLang(language: string) {
     const langConfigFile = path.join(app.getPath("userData"), "/storage/") + "lang.json";

src/window.ts

@@ -4,7 +4,16 @@
 // I'm sorry for this mess but I'm not sure how to fix it.
 import {BrowserWindow, shell, app, dialog, nativeImage} from "electron";
 import path from "path";
-import {checkIfConfigIsBroken, firstRun, getConfig, contentPath, setConfig, setLang, setWindowState} from "./utils";
+import {
+    checkIfConfigIsBroken,
+    firstRun,
+    getConfig,
+    contentPath,
+    setConfig,
+    setLang,
+    setWindowState,
+    transparency
+} from "./utils";
 import {registerIpc} from "./ipc";
 import {setMenu} from "./menu";
 import * as fs from "fs";
@@ -12,6 +21,7 @@ import startServer from "./socket";
 import contextMenu from "electron-context-menu";
 import os from "os";
 import {tray} from "./tray";
+import vibe from "@pyke/vibe";
 import {iconPath} from "./main";
 export let mainWindow: BrowserWindow;
 export let inviteWindow: BrowserWindow;
@@ -41,6 +51,11 @@ contextMenu({
     ]
 });
 async function doAfterDefiningTheWindow() {
+    if (transparency) {
+        vibe.applyEffect(mainWindow, "acrylic");
+        vibe.setDarkMode(mainWindow);
+        mainWindow.show();
+    }
     var ignoreProtocolWarning = await getConfig("ignoreProtocolWarning");
     await checkIfConfigIsBroken();
     registerIpc();
@@ -54,18 +69,18 @@ async function doAfterDefiningTheWindow() {
         }
         mainWindow.webContents.userAgent = `Mozilla/5.0 (X11; ${osType} ${os.arch()}) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/98.0.4758.102 Safari/537.36`; //fake useragent for screenshare to work
     }
-    const gotTheLock = app.requestSingleInstanceLock()
+    const gotTheLock = app.requestSingleInstanceLock();
 
     if (!gotTheLock) {
-    app.quit()
+        app.quit();
     } else {
-    app.on('second-instance', (event, commandLine, workingDirectory) => {
+        app.on("second-instance", (event, commandLine, workingDirectory) => {
             // i love stack overflow
             if (mainWindow) {
-        mainWindow.restore()
+                mainWindow.restore();
-        mainWindow.focus()
+                mainWindow.focus();
             }
-    })
+        });
     }
     mainWindow.webContents.setWindowOpenHandler(({url}) => {
         if (url.startsWith("https:" || url.startsWith("http:") || url.startsWith("mailto:"))) {
@@ -252,7 +267,25 @@ export function createNativeWindow() {
     });
     doAfterDefiningTheWindow();
 }
-
+export function createTransparentWindow() {
+    mainWindow = new BrowserWindow({
+        width: 300,
+        height: 350,
+        title: "ArmCord",
+        darkTheme: true,
+        icon: iconPath,
+        frame: true,
+        backgroundColor: "#00000000",
+        show: false,
+        autoHideMenuBar: true,
+        webPreferences: {
+            sandbox: false,
+            preload: path.join(__dirname, "preload/preload.js"),
+            spellcheck: true
+        }
+    });
+    doAfterDefiningTheWindow();
+}
 export function createInviteWindow() {
     inviteWindow = new BrowserWindow({
         width: 800,