Use State triggers

Author: ferrariofilippo

src/Files.App/Strings/en-US/Resources.resw

@@ -4068,6 +4068,6 @@
     <value>Enter a path or launch alias</value>
   </data>
   <data name="InvalidIDENameError" xml:space="preserve">
-    <value>Please, enter a name for the IDE</value>
+    <value>Please enter a name for the IDE</value>
   </data>
 </root>

src/Files.App/Views/Settings/DevToolsPage.xaml

@@ -12,7 +12,6 @@
 	xmlns:uc="using:Files.App.UserControls"
 	xmlns:vm="using:Files.App.ViewModels.Settings"
 	xmlns:wctconverters="using:CommunityToolkit.WinUI.Converters"
-	SizeChanged="Page_SizeChanged"
 	mc:Ignorable="d">
 
 	<Page.Resources>
@@ -96,9 +95,8 @@
 
 							<TextBox
 								x:Name="IDENameTextBox"
-								Grid.ColumnSpan="2"
-								Width="300"
-								HorizontalAlignment="Left"
+								Grid.ColumnSpan="3"
+								HorizontalAlignment="Stretch"
 								VerticalAlignment="Center"
 								PlaceholderText="{helpers:ResourceString Name=Name}"
 								Text="{x:Bind ViewModel.IDEName, Mode=TwoWay, UpdateSourceTrigger=PropertyChanged}"
@@ -142,12 +140,12 @@
 								Grid.Row="1"
 								Grid.ColumnSpan="3"
 								Margin="0,8,0,0"
-								Orientation="Horizontal"
-								Spacing="8"
+								Orientation="Vertical"
+								Spacing="12"
 								Visibility="{x:Bind ViewModel.IsEditingIDEConfig, Converter={StaticResource BoolVisibilityConverter}, Mode=OneWay}">
 								<TextBox
 									x:Name="IDEPathTextBox"
-									Width="300"
+									HorizontalAlignment="Stretch"
 									VerticalAlignment="Center"
 									PlaceholderText="{helpers:ResourceString Name=IDEPathPlaceholder}"
 									Text="{x:Bind ViewModel.IDEPath, Mode=TwoWay, UpdateSourceTrigger=PropertyChanged}">
@@ -248,10 +246,12 @@
 		<VisualStateManager.VisualStateGroups>
 			<VisualStateGroup>
 				<VisualState x:Name="DefaultState">
+					<VisualState.StateTriggers>
+						<AdaptiveTrigger MinWindowWidth="780" />
+					</VisualState.StateTriggers>
 					<VisualState.Setters>
 						<Setter Target="IDEPathTextBox.Width" Value="300" />
 						<Setter Target="IDEPathTextBox.HorizontalAlignment" Value="Left" />
-						<Setter Target="IDEPathTextBox.(Grid.Column)" Value="0" />
 						<Setter Target="IDENameTextBox.Width" Value="300" />
 						<Setter Target="IDENameTextBox.HorizontalAlignment" Value="Left" />
 						<Setter Target="IDENameTextBox.(Grid.ColumnSpan)" Value="2" />
@@ -260,10 +260,12 @@
 					</VisualState.Setters>
 				</VisualState>
 				<VisualState x:Name="CompactState">
+					<VisualState.StateTriggers>
+						<AdaptiveTrigger MinWindowWidth="0" />
+					</VisualState.StateTriggers>
 					<VisualState.Setters>
 						<Setter Target="IDEPathTextBox.Width" Value="Auto" />
 						<Setter Target="IDEPathTextBox.HorizontalAlignment" Value="Stretch" />
-						<Setter Target="IDEPathTextBox.(Grid.Column)" Value="3" />
 						<Setter Target="IDENameTextBox.Width" Value="Auto" />
 						<Setter Target="IDENameTextBox.HorizontalAlignment" Value="Stretch" />
 						<Setter Target="IDENameTextBox.(Grid.ColumnSpan)" Value="3" />

src/Files.App/Views/Settings/DevToolsPage.xaml.cs

@@ -1,8 +1,6 @@
 // Copyright (c) Files Community
 // Licensed under the MIT License.
 
-using Files.App.ViewModels.Settings;
-using Microsoft.UI.Xaml;
 using Microsoft.UI.Xaml.Controls;
 
 namespace Files.App.Views.Settings
@@ -12,30 +10,6 @@ public sealed partial class DevToolsPage : Page
 		public DevToolsPage()
 		{
 			InitializeComponent();
-			ViewModel.PropertyChanged += ViewModel_PropertyChanged;
-		}
-
-		private void ViewModel_PropertyChanged(object? sender, PropertyChangedEventArgs e)
-		{
-			if (e.PropertyName is nameof(DevToolsViewModel.IsEditingIDEConfig))
-				SetVisualState(ActualWidth);
-		}
-
-		private void Page_SizeChanged(object sender, SizeChangedEventArgs e)
-		{
-			if (e.NewSize.Width == e.PreviousSize.Width)
-				return;
-
-			SetVisualState(e.NewSize.Width);
-		}
-
-		private void SetVisualState(double width)
-		{
-			var defaultPathWidth = 300;
-			var pickIDEWidth = PickIDEExe.ActualWidth == 0 ? 64 : PickIDEExe.ActualWidth;
-			var minWidth = defaultPathWidth + pickIDEWidth;
-			var state = minWidth > width / 1.6 ? "CompactState" : "DefaultState";
-			VisualStateManager.GoToState(this, state, false);
 		}
 	}
 }