DiscordChatExporter/DiscordChatExporter.Gui/Views/MainWindow.xaml

<Window
    x:Class="DiscordChatExporter.Gui.Views.MainWindow"
    xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
    xmlns:i="http://schemas.microsoft.com/expression/2010/interactivity"
    xmlns:materialDesign="http://materialdesigninxaml.net/winfx/xaml/themes"
    Title="DiscordChatExporter"
    Width="600"
    Height="550"
    Background="{DynamicResource MaterialDesignPaper}"
    DataContext="{Binding MainViewModel, Source={StaticResource Container}}"
    FocusManager.FocusedElement="{Binding ElementName=TokenValueTextBox}"
    FontFamily="{DynamicResource MaterialDesignFont}"
    Icon="/DiscordChatExporter;component/favicon.ico"
    SnapsToDevicePixels="True"
    TextElement.FontSize="13"
    TextElement.FontWeight="Regular"
    TextElement.Foreground="{DynamicResource SecondaryTextBrush}"
    TextOptions.TextFormattingMode="Ideal"
    TextOptions.TextRenderingMode="Auto"
    UseLayoutRounding="True"
    WindowStartupLocation="CenterScreen">
    <i:Interaction.Triggers>
        <i:EventTrigger EventName="Loaded">
            <i:InvokeCommandAction Command="{Binding ViewLoadedCommand}" />
        </i:EventTrigger>
        <i:EventTrigger EventName="Closed">
            <i:InvokeCommandAction Command="{Binding ViewClosedCommand}" />
        </i:EventTrigger>
    </i:Interaction.Triggers>
    <materialDesign:DialogHost SnackbarMessageQueue="{Binding ElementName=Snackbar}">
        <DockPanel>
            <!--  Toolbar  -->
            <Border
                Background="{DynamicResource PrimaryHueMidBrush}"
                DockPanel.Dock="Top"
                IsEnabled="{Binding IsBusy, Converter={StaticResource InvertBoolConverter}}"
                TextElement.Foreground="{DynamicResource SecondaryInverseTextBrush}">
                <StackPanel>
                    <Grid>
                        <Grid.ColumnDefinitions>
                            <ColumnDefinition Width="*" />
                            <ColumnDefinition Width="Auto" />
                        </Grid.ColumnDefinitions>
                        <materialDesign:Card
                            Grid.Row="0"
                            Grid.Column="0"
                            Margin="6,6,0,6">
                            <Grid>
                                <Grid.ColumnDefinitions>
                                    <ColumnDefinition Width="Auto" />
                                    <ColumnDefinition Width="*" />
                                    <ColumnDefinition Width="Auto" />
                                </Grid.ColumnDefinitions>

                                <!--  Token type  -->
                                <ToggleButton
                                    Grid.Column="0"
                                    Margin="6"
                                    IsChecked="{Binding IsBotToken}"
                                    Style="{StaticResource MaterialDesignFlatActionToggleButton}"
                                    ToolTip="Switch between user token and bot token">
                                    <ToggleButton.Content>
                                        <materialDesign:PackIcon
                                            Width="24"
                                            Height="24"
                                            Kind="Account" />
                                    </ToggleButton.Content>
                                    <materialDesign:ToggleButtonAssist.OnContent>
                                        <materialDesign:PackIcon
                                            Width="24"
                                            Height="24"
                                            Kind="Robot" />
                                    </materialDesign:ToggleButtonAssist.OnContent>
                                </ToggleButton>

                                <!--  Token value  -->
                                <TextBox
                                    x:Name="TokenValueTextBox"
                                    Grid.Column="1"
                                    Margin="2,6,6,7"
                                    materialDesign:HintAssist.Hint="Token"
                                    materialDesign:TextFieldAssist.DecorationVisibility="Hidden"
                                    materialDesign:TextFieldAssist.TextBoxViewMargin="0,0,2,0"
                                    BorderThickness="0"
                                    FontSize="16"
                                    Text="{Binding TokenValue, UpdateSourceTrigger=PropertyChanged}" />

                                <!--  Pull data button  -->
                                <Button
                                    Grid.Column="2"
                                    Margin="0,6,6,6"
                                    Padding="4"
                                    Command="{Binding PullDataCommand}"
                                    IsDefault="True"
                                    Style="{DynamicResource MaterialDesignFlatButton}">
                                    <materialDesign:PackIcon
                                        Width="24"
                                        Height="24"
                                        Kind="ArrowRight" />
                                </Button>
                            </Grid>
                        </materialDesign:Card>

                        <!--  Menu  -->
                        <materialDesign:PopupBox
                            Grid.Row="0"
                            Grid.Column="1"
                            Foreground="{DynamicResource PrimaryHueMidForegroundBrush}"
                            PlacementMode="LeftAndAlignTopEdges">
                            <StackPanel>
                                <Button Command="{Binding ShowSettingsCommand}" Content="Settings" />
                                <Button Command="{Binding ShowAboutCommand}" Content="About" />
                            </StackPanel>
                        </materialDesign:PopupBox>
                    </Grid>

                    <!--  Progress bar  -->
                    <ProgressBar
                        Background="Transparent"
                        IsIndeterminate="{Binding IsProgressIndeterminate}"
                        Visibility="{Binding IsBusy, Converter={StaticResource BoolToVisibilityConverter}}"
                        Value="{Binding Progress, Mode=OneWay}" />
                </StackPanel>
            </Border>

            <!--  Content  -->
            <Grid>
                <DockPanel
                    Background="{DynamicResource MaterialDesignCardBackground}"
                    IsEnabled="{Binding IsBusy, Converter={StaticResource InvertBoolConverter}}"
                    Visibility="{Binding IsDataAvailable, Converter={StaticResource BoolToVisibilityConverter}}">

                    <!--  Guilds  -->
                    <Border
                        BorderBrush="{DynamicResource DividerBrush}"
                        BorderThickness="0,0,1,0"
                        DockPanel.Dock="Left">
                        <ListBox
                            ItemsSource="{Binding AvailableGuilds}"
                            ScrollViewer.VerticalScrollBarVisibility="Hidden"
                            SelectedItem="{Binding SelectedGuild}"
                            VirtualizingStackPanel.IsVirtualizing="False">
                            <ListBox.ItemTemplate>
                                <DataTemplate>
                                    <materialDesign:TransitioningContent>
                                        <materialDesign:TransitioningContent.OpeningEffect>
                                            <materialDesign:TransitionEffect Kind="SlideInFromLeft" Duration="0:0:0.3" />
                                        </materialDesign:TransitioningContent.OpeningEffect>
                                        <Grid
                                            Margin="-8"
                                            Background="Transparent"
                                            Cursor="Hand"
                                            ToolTip="{Binding Name}">
                                            <!--  Guild icon placeholder  -->
                                            <Ellipse
                                                Width="48"
                                                Height="48"
                                                Margin="12,4,12,4"
                                                Fill="{DynamicResource DividerBrush}" />

                                            <!--  Guild icon  -->
                                            <Ellipse
                                                Width="48"
                                                Height="48"
                                                Margin="12,4,12,4">
                                                <Ellipse.Fill>
                                                    <ImageBrush ImageSource="{Binding IconUrl}" />
                                                </Ellipse.Fill>
                                            </Ellipse>
                                        </Grid>
                                    </materialDesign:TransitioningContent>
                                </DataTemplate>
                            </ListBox.ItemTemplate>
                        </ListBox>
                    </Border>

                    <!--  Channels  -->
                    <Border>
                        <ListBox
                            HorizontalContentAlignment="Stretch"
                            ItemsSource="{Binding AvailableChannels}"
                            VirtualizingStackPanel.IsVirtualizing="False">
                            <ListBox.ItemTemplate>
                                <DataTemplate>
                                    <materialDesign:TransitioningContent>
                                        <materialDesign:TransitioningContent.OpeningEffect>
                                            <materialDesign:TransitionEffect Kind="SlideInFromLeft" Duration="0:0:0.3" />
                                        </materialDesign:TransitioningContent.OpeningEffect>
                                        <StackPanel
                                            Margin="-8"
                                            Background="Transparent"
                                            Cursor="Hand"
                                            Orientation="Horizontal">
                                            <StackPanel.InputBindings>
                                                <MouseBinding
                                                    Command="{Binding DataContext.ShowExportSetupCommand, RelativeSource={RelativeSource FindAncestor, AncestorType={x:Type ItemsControl}}}"
                                                    CommandParameter="{Binding}"
                                                    MouseAction="LeftClick" />
                                            </StackPanel.InputBindings>
                                            <materialDesign:PackIcon
                                                Margin="16,7,0,6"
                                                VerticalAlignment="Center"
                                                Kind="Pound" />
                                            <TextBlock
                                                Margin="3,8,8,8"
                                                VerticalAlignment="Center"
                                                FontSize="14"
                                                Text="{Binding Name}" />
                                        </StackPanel>
                                    </materialDesign:TransitioningContent>
                                </DataTemplate>
                            </ListBox.ItemTemplate>
                        </ListBox>
                    </Border>
                </DockPanel>

                <!--  Usage instructions  -->
                <Grid Margin="32,32,8,8" Visibility="{Binding IsDataAvailable, Converter={StaticResource InvertBoolToVisibilityConverter}}">
                    <!--  User token  -->
                    <StackPanel Visibility="{Binding IsBotToken, Converter={StaticResource InvertBoolToVisibilityConverter}}">
                        <TextBlock FontSize="18" Text="DiscordChatExporter needs your user token to work." />
                        <TextBlock
                            Margin="0,8,0,0"
                            FontSize="16"
                            Text="To obtain it, follow these steps:" />
                        <TextBlock Margin="8,0,0,0" FontSize="14">
                            <Run Text="1. Open the Discord app" />
                            <LineBreak />
                            <Run Text="2. Log in if you haven't" />
                            <LineBreak />
                            <Run Text="3. Press" />
                            <Run Foreground="{DynamicResource PrimaryTextBrush}" Text="Ctrl+Shift+I" />
                            <Run Text="to show developer tools" />
                            <LineBreak />
                            <Run Text="4. Press" />
                            <Run Foreground="{DynamicResource PrimaryTextBrush}" Text="Ctrl+R" />
                            <Run Text="to trigger reload" />
                            <LineBreak />
                            <Run Text="5. Navigate to the" />
                            <Run Foreground="{DynamicResource PrimaryTextBrush}" Text="Application" />
                            <Run Text="tab" />
                            <LineBreak />
                            <Run Text="6. Select" />
                            <Run Foreground="{DynamicResource PrimaryTextBrush}" Text="Local Storage" />
                            <Run Text="&gt;" />
                            <Run Foreground="{DynamicResource PrimaryTextBrush}" Text="https://discordapp.com" />
                            <Run Text="on the left" />
                            <LineBreak />
                            <Run Text="7. Find" />
                            <Run Foreground="{DynamicResource PrimaryTextBrush}" Text="token" />
                            <Run Text="under key and copy the value" />
                        </TextBlock>
                    </StackPanel>

                    <!--  Bot token  -->
                    <StackPanel Visibility="{Binding IsBotToken, Converter={StaticResource BoolToVisibilityConverter}}">
                        <TextBlock FontSize="18" Text="DiscordChatExporter needs your bot token to work." />
                        <TextBlock
                            Margin="0,8,0,0"
                            FontSize="16"
                            Text="To obtain it, follow these steps:" />
                        <TextBlock Margin="8,0,0,0" FontSize="14">
                            <Run Text="1. Go to Discord developer portal" />
                            <LineBreak />
                            <Run Text="2. Log in if you haven't" />
                            <LineBreak />
                            <Run Text="3. Open your application's settings" />
                            <LineBreak />
                            <Run Text="4. Navigate to the" />
                            <Run Foreground="{DynamicResource PrimaryTextBrush}" Text="Bot" />
                            <Run Text="section on the left" />
                            <LineBreak />
                            <Run Text="5. Under" />
                            <Run Foreground="{DynamicResource PrimaryTextBrush}" Text="Token" />
                            <Run Text="click" />
                            <Run Foreground="{DynamicResource PrimaryTextBrush}" Text="Copy" />
                        </TextBlock>
                    </StackPanel>
                </Grid>
                <materialDesign:Snackbar x:Name="Snackbar" />
            </Grid>
        </DockPanel>
    </materialDesign:DialogHost>
</Window>