Adjust "What's new" window

new-ui/src/pages/welcome/WelcomePage.tsx

@@ -22,7 +22,7 @@ export const WelcomePage = () => {
       ></div>
       <FullPage hideScrollContainer id="welcome-page">
         <header data-tauri-drag-region>
-          <h1 data-tauri-drag-region>{`What's new`}</h1>
+          <h1 data-tauri-drag-region>{`What's new in Defguard`}</h1>
           <IconButton
             icon={IconKind.Close}
             variant={IconButtonVariant.Big}

new-ui/src/pages/welcome/components/SlideVideo.tsx

@@ -1,12 +1,25 @@
+import { useQuery } from '@tanstack/react-query';
+
 type Props = {
   src: string;
   poster?: string;
 };
 
 export const SlideVideo = ({ src, poster }: Props) => {
+  // Bundled assets are served without range request support, which makes video
+  // playback stutter. Play it from an in-memory blob instead.
+  // https://github.com/orgs/tauri-apps/discussions/7870
+  const { data: blobSrc } = useQuery({
+    queryKey: ['slide-video', src] as const,
+    queryFn: async () => {
+      const response = await fetch(src);
+      return URL.createObjectURL(await response.blob());
+    },
+  });
+
   return (
     <video
-      src={src}
+      src={blobSrc}
       poster={poster}
       width={'100%'}
       height={'auto'}

new-ui/src/pages/welcome/components/WelcomeCarousel/WelcomeCarousel.tsx

@@ -1,12 +1,12 @@
 import './style.scss';
-import { openUrl } from '@tauri-apps/plugin-opener';
 import { AnimatePresence, motion } from 'motion/react';
 import { Fragment, useState } from 'react';
 import { Button } from '../../../../shared/components/Button/Button';
 import { ButtonVariant } from '../../../../shared/components/Button/types';
 import { Divider } from '../../../../shared/components/Divider/Divider';
 import { SizedBox } from '../../../../shared/components/SizedBox/SizedBox';
 import { motionTransitionStandard } from '../../../../shared/consts';
+import { api } from '../../../../shared/rust-api/api';
 import { ThemeSpacing } from '../../../../shared/types';
 import { isPresent } from '../../../../shared/utils/isPresent';
 import { SlideImage } from '../SlideImage';
@@ -82,15 +82,17 @@ export const WelcomeCarousel = ({ slides }: WelcomeCarouselProps) => {
             {renderSlide(activeSlide)}
             <div className="content">
               <p className="title">{activeSlide.title}</p>
-              <SizedBox height={ThemeSpacing.Sm} />
+              <SizedBox height={ThemeSpacing.Xs} />
               <p className="description">{activeSlide.description}</p>
-              {isPresent(activeSlide.blogLink) && isPresent(activeSlide.blogLinkText) && (
+              {isPresent(activeSlide.actionText) && (
                 <Fragment>
-                  <SizedBox height={ThemeSpacing.Xl} />
+                  <SizedBox height={ThemeSpacing.Xl2} />
                   <Button
-                    text={activeSlide.blogLinkText}
+                    text={activeSlide.actionText}
                     variant={ButtonVariant.Primary}
-                    onClick={() => openUrl(activeSlide.blogLink as string)}
+                    onClick={() => {
+                      void api.closeWelcomeWindow();
+                    }}
                   />
                 </Fragment>
               )}

new-ui/src/pages/welcome/components/WelcomeCarousel/style.scss

@@ -21,7 +21,7 @@
     img,
     video {
       width: 100%;
-      height: 340px;
+      height: 349px;
       object-fit: cover;
       object-position: top;
       border-radius: var(--radius-md);

new-ui/src/pages/welcome/components/types.ts

@@ -5,5 +5,5 @@ export interface CarouselSlide {
   posterSrc?: string;
   description: string;
   blogLink?: string;
-  blogLinkText?: string;
+  actionText?: string;
 }

new-ui/src/pages/welcome/config.ts

@@ -9,7 +9,6 @@ export const welcomeSlides: CarouselSlide[] = [
     posterSrc: whatsNewPoster,
     title: `New Defguard Desktop App`,
     description: `A new compact interface gives you one-click connections and quick switching between locations, while the redesigned main window puts settings and logs within instant reach - all in a cleaner, more intuitive design.`,
-    blogLink: 'https://defguard.net/blog/',
-    blogLinkText: 'Check how it works',
+    actionText: 'Get started',
   },
 ];

new-ui/src/pages/welcome/style.scss

@@ -11,7 +11,7 @@
     align-items: center;
     justify-content: flex-start;
     user-select: none;
-    padding-bottom: var(--spacing-md);
+    padding-bottom: var(--spacing-sm);
 
     h1 {
       font: var(--t-h5);

src-tauri/src/gui.rs

@@ -42,7 +42,7 @@ use crate::{connection::apple::PLUGIN_BUNDLE_ID, system_extension::activate_syst
 use defguard_client_core::connection::sync_locations_and_tunnels;
 use defguard_client_core::{
     connection::active_connections::close_all_connections,
-    version::{check_app_version, mark_welcome_shown, should_show_welcome, VersionCheckResult},
+    version::{check_app_version, should_show_welcome, VersionCheckResult},
 };
 use log::{Level, LevelFilter};
 use tauri::{async_runtime, AppHandle, Builder, Manager, RunEvent, WindowEvent};
@@ -433,9 +433,7 @@ pub fn run_app() {
                 let _ = WindowManager::open_full_view(app_handle);
             } else if open_welcome_view {
                 info!("Opening welcome view.");
-                if WindowManager::open_welcome_view(app_handle).is_ok() {
-                    mark_welcome_shown(&config_dir, &current_version);
-                }
+                let _ = WindowManager::open_welcome_view(app_handle);
             } else {
                 show_tray_or_full_view(app_handle);
             }

src-tauri/src/window_manager/mod.rs

@@ -10,6 +10,7 @@ use crate::{
     },
     events::EventKey,
 };
+use defguard_client_core::version::mark_welcome_shown;
 
 /// Returns `true` if there are any non-service locations in the database.
 pub async fn has_non_service_locations() -> bool {
@@ -29,7 +30,7 @@ pub const COMPACT_WINDOW_ID: &str = "compact-view";
 pub const FULL_VIEW_WINDOW_ID: &str = "full-view";
 pub const WELCOME_WINDOW_ID: &str = "welcome";
 pub const WELCOME_WINDOW_WIDTH: f64 = 640.0;
-pub const WELCOME_WINDOW_HEIGHT: f64 = 580.0;
+pub const WELCOME_WINDOW_HEIGHT: f64 = 585.0;
 pub const COMPACT_WINDOW_WIDTH: f64 = 380.0;
 pub const COMPACT_WINDOW_HEIGHT: f64 = 680.0;
 pub const FULL_VIEW_WINDOW_WIDTH: f64 = 800.0;
@@ -124,7 +125,7 @@ impl WindowManager {
             .maximizable(false)
             .decorations(false)
             .skip_taskbar(false)
-            .always_on_top(false)
+            .always_on_top(true)
             .visible(false);
         #[cfg(target_os = "macos")]
         let window = window.hidden_title(true);
@@ -293,6 +294,12 @@ pub fn close_welcome_window(app: AppHandle) {
         warn!("close_welcome_window task: welcome window not found");
     }
 
+    let config_dir = app
+        .path()
+        .app_data_dir()
+        .expect("Failed to access app data");
+    mark_welcome_shown(&config_dir, &app.package_info().version);
+
     show_tray_or_full_view(&app);
 }