merge dev to release

new-ui/src/pages/full/AddPage/components/AddCard/style.scss

@@ -1,17 +1,16 @@
 .add-card {
   --border: var(--border-action-disabled);
   --shadow: box-shadow: 0 4px 12px 0 rgb(13 47 157 / 0%);
-  --color: var(--fg-white-80);
+  --color: var(--fg-white-60);
 
   box-sizing: border-box;
   border-radius: 12px;
   border: 1px solid var(--border);
   box-shadow: var(--shadow);
-  color: var(--color);
   overflow: hidden;
   transition-duration: 160ms;
   transition-timing-function: ease-out;
-  transition-property: border-color, box-shadow, color;
+  transition-property: border-color, box-shadow;
   max-width: 342px;
   min-height: 172px;
 
@@ -48,9 +47,12 @@
   }
 
   .description {
-    color: inherit;
+    color: var(--color);
     font: var(--t-body-xs-400);
     padding-bottom: var(--spacing-xl);
+    transition-duration: 160ms;
+    transition-timing-function: ease-out;
+    transition-property: color;
   }
 
   > .track {

new-ui/src/pages/full/OverviewPage/components/ConnectModal/views/ConnectModalMfaSettings/ConnectModalMfaSettings.tsx

@@ -41,7 +41,7 @@ export const ConnectModalMfaSettings = () => {
 
   const [selectedMethod, setSelectedMethod] = useState<MfaMethodValue>(currentMethod);
 
-  const [setAsDefault, setSetAsDefault] = useState(true);
+  const [setAsDefault, setSetAsDefault] = useState(perviousView === null);
 
   const MfaFactorsList = useMemo((): MfaMethodValue[] => {
     if (location?.location_mfa_mode === LocationMfaMode.Internal) {

new-ui/src/shared/components/Icon/icons/IconReport.tsx

@@ -4,17 +4,15 @@ export const IconReport = (props: SVGProps<SVGSVGElement>) => {
   return (
     <svg
       xmlns="http://www.w3.org/2000/svg"
-      width="14"
-      height="16"
-      viewBox="0 0 14 16"
+      width="20"
+      height="20"
+      viewBox="0 0 20 20"
       fill="none"
       {...props}
     >
       <path
-        d="
-M13.2563 3.24H9.8995V1.89C9.8995 1.48 9.55779 1.14 9.14573 1.14H1.50754V0H0V16H1.50754V8.84H3.8191V10.37C3.8191 10.78 4.1608 11.12 4.57286 11.12H13.2462C13.6583 11.12 14 10.78 14 10.37V3.99C14 3.58 13.6583 3.24 13.2462 3.24H13.2563ZM12.5025 9.62H5.33668V8.09C5.33668 7.68 4.99498 7.34 4.58291 7.34H1.50754V2.64H8.39196V3.99C8.39196 4.4 8.73367 4.74 9.14573 4.74H12.5025V9.62Z
-"
-        fill="#3961DB"
+        d="M16.2563 5.24H12.8995V3.89C12.8995 3.48 12.5578 3.14 12.1457 3.14H4.50754V2H3V18H4.50754V10.84H6.8191V12.37C6.8191 12.78 7.1608 13.12 7.57286 13.12H16.2462C16.6583 13.12 17 12.78 17 12.37V5.99C17 5.58 16.6583 5.24 16.2462 5.24H16.2563ZM15.5025 11.62H8.33668V10.09C8.33668 9.68 7.99498 9.34 7.58291 9.34H4.50754V4.64H11.392V5.99C11.392 6.4 11.7337 6.74 12.1457 6.74H15.5025V11.62Z"
+        fill="white"
       />
     </svg>
   );

new-ui/src/shared/components/LocationCard/views/LocationCardMfaEmailView/LocationCardMfaEmailView.tsx

@@ -38,17 +38,22 @@ export const LocationCardMfaEmailView = () => {
   const [emailCode, setEmailCode] = useState<string | null>(null);
   const [error, setError] = useState<string | null>(null);
 
-  const handleVerify = useCallback(() => {
-    if (!isPresent(emailCode)) {
-      setError('Enter code');
-      return;
-    }
-    if (emailCode.length !== 6) {
-      setError('6 digits are required');
-      return;
-    }
-    verifyCode(emailCode);
-  }, [emailCode, verifyCode]);
+  const handleVerify = useCallback(
+    (argCode?: string | null) => {
+      const toCheck = argCode ?? emailCode;
+
+      if (!isPresent(toCheck)) {
+        setError('Enter code');
+        return;
+      }
+      if (toCheck.length !== 6) {
+        setError('6 digits are required');
+        return;
+      }
+      verifyCode(toCheck);
+    },
+    [emailCode, verifyCode],
+  );
 
   // biome-ignore lint/correctness/useExhaustiveDependencies: side effect of code input
   useEffect(() => {
@@ -83,8 +88,7 @@ export const LocationCardMfaEmailView = () => {
         onChange={setEmailCode}
         error={startError ?? error}
         onSuccessPaste={(value) => {
-          setEmailCode(value);
-          handleVerify();
+          handleVerify(value);
         }}
       />
       <Controls>
@@ -107,7 +111,7 @@ export const LocationCardMfaEmailView = () => {
           <Button
             text="Verify"
             variant={ButtonVariant.Primary}
-            onClick={handleVerify}
+            onClick={() => handleVerify(emailCode)}
             loading={isStarting || isVerifying}
           />
         </div>

new-ui/src/shared/components/LocationCard/views/LocationCardMfaTotpView/LocationCardMfaTotpView.tsx

@@ -38,17 +38,22 @@ export const LocationCardMfaTotpView = () => {
   const [totpCode, setTotpCode] = useState<string | null>(null);
   const [error, setError] = useState<string | null>(null);
 
-  const handleVerify = useCallback(() => {
-    if (!isPresent(totpCode)) {
-      setError('Enter code');
-      return;
-    }
-    if (totpCode.replaceAll(' ', '').length !== 6) {
-      setError('6 digits are required');
-      return;
-    }
-    verifyCode(totpCode);
-  }, [totpCode, verifyCode]);
+  const handleVerify = useCallback(
+    (argCode?: string | null) => {
+      const toCheck = argCode ?? totpCode;
+
+      if (!isPresent(toCheck)) {
+        setError('Enter code');
+        return;
+      }
+      if (toCheck.replaceAll(' ', '').length !== 6) {
+        setError('6 digits are required');
+        return;
+      }
+      verifyCode(toCheck);
+    },
+    [totpCode, verifyCode],
+  );
 
   // biome-ignore lint/correctness/useExhaustiveDependencies: side effect of code input
   useEffect(() => {
@@ -84,8 +89,7 @@ export const LocationCardMfaTotpView = () => {
         onChange={setTotpCode}
         error={startError ?? error}
         onSuccessPaste={(value) => {
-          setTotpCode(value);
-          handleVerify();
+          handleVerify(value);
         }}
       />
       <Controls>
@@ -108,7 +112,7 @@ export const LocationCardMfaTotpView = () => {
           <Button
             text="Verify"
             variant={ButtonVariant.Primary}
-            onClick={handleVerify}
+            onClick={() => handleVerify(totpCode)}
             loading={isVerifying}
             disabled={isStarting}
           />

new-ui/src/shared/components/OverviewLocationCard/style.scss

@@ -21,17 +21,30 @@
       display: flex;
       align-items: center;
       column-gap: var(--spacing-xs);
+
+      .bottom {
+        button {
+          height: 24px;
+          width: 24px;
+        }
+      }
     }
 
-    button {
-      min-height: 36px;
+    > .left {
+      button {
+        min-height: 36px;
+      }
     }
   }
 
+  .no-connection-info {
+    min-height: 124px;
+  }
+
   > .controls {
     display: flex;
     flex-flow: row nowrap;
     column-gap: var(--spacing-5xl);
-    min-height: 24px;
+    min-height: 40px;
   }
 }

new-ui/src/shared/components/WindowHeader/components/ConnectionWatcher/style.scss

@@ -90,8 +90,11 @@
   }
 
   .disconnect {
+    --bg: transparent;
+
+    border-radius: 8px;
     box-sizing: border-box;
-    background: transparent;
+    background: var(--bg);
     border: 0;
     padding: 0 var(--spacing-sm);
     display: flex;
@@ -102,6 +105,12 @@
     min-height: 36px;
     cursor: pointer;
 
+    @include animate(background);
+
+    &:hover {
+      --bg: var(--bg-white-5);
+    }
+
     p {
       font: var(--t-menu-text);
       color: var(--fg-white-100);

new-ui/src/shared/components/WindowHeader/style.scss

@@ -7,6 +7,10 @@
       justify-content: flex-start;
       column-gap: var(--spacing-lg);
       padding-bottom: var(--spacing-lg);
+
+      > .info {
+        row-gap: var(--spacing-xs);
+      }
     }
 
     &-desktop {
@@ -29,7 +33,7 @@
     display: flex;
     flex-flow: column;
     align-items: flex-start;
-    row-gap: var(--spacing-xs);
+    row-gap: 0;
     user-select: none;
 
     > .label {

src-tauri/src/window_manager/mod.rs

@@ -15,7 +15,7 @@ pub async fn has_non_service_locations() -> bool {
 pub const COMPACT_WINDOW_ID: &str = "compact-view";
 pub const FULL_VIEW_WINDOW_ID: &str = "full-view";
 pub const COMPACT_WINDOW_WIDTH: f64 = 380.0;
-pub const COMPACT_WINDOW_HEIGHT: f64 = 640.0;
+pub const COMPACT_WINDOW_HEIGHT: f64 = 680.0;
 pub const FULL_VIEW_WINDOW_WIDTH: f64 = 800.0;
 pub const FULL_VIEW_WINDOW_HEIGHT: f64 = 700.0;
 #[cfg(not(target_os = "linux"))]

src-tauri/tauri.conf.json

@@ -10,11 +10,11 @@
     "copyright": "Defguard",
     "externalBin": [],
     "icon": [
-      "icons/32x32.png",
-      "icons/128x128.png",
-      "icons/128x128@2x.png",
-      "icons/icon.icns",
-      "icons/icon.ico"
+      "icons/windows/32x32.png",
+      "icons/windows/128x128.png",
+      "icons/windows/128x128@2x.png",
+      "icons/windows/icon.icns",
+      "icons/windows/icon.ico"
     ],
     "windows": {
       "certificateThumbprint": "c79305cdcb7e5832dd161d18580d6a846bd0506b",
@@ -37,9 +37,7 @@
         "template": "./resources-windows/msi/main.wxs"
       }
     },
-    "resources": [
-      "resources/icons/tray/*"
-    ],
+    "resources": ["resources/icons/tray/*"],
     "shortDescription": "Defguard desktop client",
     "longDescription": "Defguard desktop client",
     "linux": {
@@ -54,9 +52,7 @@
           "../control/prerm": "../resources-linux/prerm",
           "../control/postrm": "../resources-linux/postrm"
         },
-        "depends": [
-          "desktop-file-utils"
-        ]
+        "depends": ["desktop-file-utils"]
       },
       "rpm": {
         "files": {
@@ -65,9 +61,7 @@
           "/usr/sbin/defguard-service": "target/release/defguard-service",
           "/lib/systemd/system/defguard-service.service": "../resources-linux/defguard-service.service"
         },
-        "depends": [
-          "desktop-file-utils"
-        ],
+        "depends": ["desktop-file-utils"],
         "postInstallScript": "../resources-linux/postinst",
         "preRemoveScript": "../resources-linux/prerm",
         "postRemoveScript": "../resources-linux/postrm"
@@ -80,19 +74,15 @@
   "version": "2.1.0",
   "app": {
     "security": {
-      "capabilities": [
-        "main-capability"
-      ],
+      "capabilities": ["main-capability"],
       "csp": null
     },
     "windows": []
   },
   "plugins": {
     "deep-link": {
       "desktop": {
-        "schemes": [
-          "defguard"
-        ]
+        "schemes": ["defguard"]
       }
     }
   }

src-tauri/tauri.dmg.conf.json

@@ -4,20 +4,23 @@
       "cwd": "../swift",
       "script": "./build.sh VPNSystemExtension Installer"
     },
-    "features": [
-      "macos_installer"
-    ]
+    "features": ["macos_installer"]
   },
   "bundle": {
+    "icon": [
+      "icons/macos/32x32.png",
+      "icons/macos/128x128.png",
+      "icons/macos/128x128@2x.png",
+      "icons/macos/icon.icns",
+      "icons/macos/icon.ico"
+    ],
     "macOS": {
       "entitlements": "Installer.entitlements",
       "files": {
         "embedded.provisionprofile": "/Users/admin/Library/Developer/Xcode/UserData/Provisioning Profiles/fbbc4fe8-8738-432c-a647-484dee3f95bb.provisionprofile",
         "Library/SystemExtensions/net.defguard.VPNExtension.systemextension": "../swift/extension/build/Installer/VPNSystemExtension.systemextension"
       }
     },
-    "targets": [
-      "dmg"
-    ]
+    "targets": ["dmg"]
   }
 }

src-tauri/tauri.macos.conf.json

@@ -6,6 +6,13 @@
     }
   },
   "bundle": {
+    "icon": [
+      "icons/macos/32x32.png",
+      "icons/macos/128x128.png",
+      "icons/macos/128x128@2x.png",
+      "icons/macos/icon.icns",
+      "icons/macos/icon.ico"
+    ],
     "macOS": {
       "bundleVersion": "@BUILD_NUMBER@",
       "minimumSystemVersion": "13.5"