From acae7d1ff0f6285fb150483f6da456a2b670644b Mon Sep 17 00:00:00 2001
From: Louis DUFOUR <Louis.DUFOUR@etu.uca.fr>
Date: Mon, 11 Sep 2023 23:54:02 +0200
Subject: [PATCH] Add (Front-End): Ajout de la 2e page & un peu de structure

---
 src/BookApp/AppShell.xaml                     |   5 +-
 src/BookApp/BookApp.csproj                    |  13 ++-
 src/BookApp/Composants/RatingView.xaml        |  27 +++++
 src/BookApp/Composants/RatingView.xaml.cs     |  22 ++++
 .../ContentView/ContentCollection.xaml        |  37 -------
 .../ContentView/ContentCollection.xaml.cs     |  24 ----
 src/BookApp/Data/Stub.cs                      |  66 +++++++++++
 src/BookApp/MainPage.xaml                     |   2 +-
 src/BookApp/MainPage.xaml.cs                  |   3 -
 src/BookApp/MauiProgram.cs                    |   2 +
 src/BookApp/Model/Book.cs                     |  18 +++
 src/BookApp/Model/Star.cs                     |  26 +++++
 src/BookApp/Pages/DetailBook.xaml             |  14 +++
 src/BookApp/Pages/DetailBook.xaml.cs          |  67 +++++++++++
 src/BookApp/Pages/Tous.xaml                   | 104 +++++++++++++++---
 src/BookApp/Pages/Tous.xaml.cs                |  11 +-
 src/BookApp/Resources/Images/chevron_left.svg |   1 +
 src/BookApp/Resources/Images/empty_star.svg   |   1 +
 src/BookApp/Resources/Images/filled_star.svg  |   1 +
 .../UseCase/RatingToStarImageConverter.cs     |  26 +++++
 src/BookApp/ViewModel/TousViewModel.cs        |  18 +++
 src/TestFrontEnd/TestFrontEnd.csproj          |  13 ++-
 symbols/icons8-sorting-arrows-64.png          | Bin 0 -> 454 bytes
 23 files changed, 406 insertions(+), 95 deletions(-)
 create mode 100644 src/BookApp/Composants/RatingView.xaml
 create mode 100644 src/BookApp/Composants/RatingView.xaml.cs
 delete mode 100644 src/BookApp/ContentView/ContentCollection.xaml
 delete mode 100644 src/BookApp/ContentView/ContentCollection.xaml.cs
 create mode 100644 src/BookApp/Data/Stub.cs
 create mode 100644 src/BookApp/Model/Book.cs
 create mode 100644 src/BookApp/Model/Star.cs
 create mode 100644 src/BookApp/Pages/DetailBook.xaml
 create mode 100644 src/BookApp/Pages/DetailBook.xaml.cs
 create mode 100644 src/BookApp/Resources/Images/chevron_left.svg
 create mode 100644 src/BookApp/Resources/Images/empty_star.svg
 create mode 100644 src/BookApp/Resources/Images/filled_star.svg
 create mode 100644 src/BookApp/UseCase/RatingToStarImageConverter.cs
 create mode 100644 src/BookApp/ViewModel/TousViewModel.cs
 create mode 100644 symbols/icons8-sorting-arrows-64.png

diff --git a/src/BookApp/AppShell.xaml b/src/BookApp/AppShell.xaml
index 9b032c7..fb3d58b 100644
--- a/src/BookApp/AppShell.xaml
+++ b/src/BookApp/AppShell.xaml
@@ -5,7 +5,10 @@
     xmlns:x="http://schemas.microsoft.com/winfx/2009/xaml"
     xmlns:local="clr-namespace:BookApp"
     Shell.FlyoutBehavior="Disabled">
+
     
+
+
     <TabBar>
         <Tab Title="My Library"
             Icon="books_vertical_fill.svg">
@@ -19,7 +22,7 @@
         </Tab>
         <Tab Title="My Readings"
             Icon="bookmark_fill.svg">
-            <ShellContent ContentTemplate="{DataTemplate local:MainPage}" />
+            <ShellContent ContentTemplate="{DataTemplate local:Pages.DetailBook}" />
         </Tab>
         <Tab Title="Search"
             Icon="magnifyingglass.svg">
diff --git a/src/BookApp/BookApp.csproj b/src/BookApp/BookApp.csproj
index 4b3f268..1454c6a 100644
--- a/src/BookApp/BookApp.csproj
+++ b/src/BookApp/BookApp.csproj
@@ -68,16 +68,23 @@
 
 	<ItemGroup>
 		<PackageReference Include="Microsoft.Extensions.Logging.Debug" Version="7.0.0" />
+		<PackageReference Include="SimpleRatingControl.MAUI" Version="0.0.3" />
 	</ItemGroup>
 
 	<ItemGroup>
-	  <Compile Update="ContentView\ContentCollection.xaml.cs">
-	    <DependentUpon>ContentCollection.xaml</DependentUpon>
+	  <Compile Update="Composants\RatingView.xaml.cs">
+	    <DependentUpon>RatingView.xaml</DependentUpon>
+	  </Compile>
+	  <Compile Update="Pages\DetailBook.xaml.cs">
+	    <DependentUpon>DetailBook.xaml</DependentUpon>
 	  </Compile>
 	</ItemGroup>
 
 	<ItemGroup>
-	  <MauiXaml Update="ContentView\ContentCollection.xaml">
+	  <MauiXaml Update="Composants\RatingView.xaml">
+	    <Generator>MSBuild:Compile</Generator>
+	  </MauiXaml>
+	  <MauiXaml Update="Pages\DetailBook.xaml">
 	    <Generator>MSBuild:Compile</Generator>
 	  </MauiXaml>
 	</ItemGroup>
diff --git a/src/BookApp/Composants/RatingView.xaml b/src/BookApp/Composants/RatingView.xaml
new file mode 100644
index 0000000..29395d3
--- /dev/null
+++ b/src/BookApp/Composants/RatingView.xaml
@@ -0,0 +1,27 @@
+<?xml version="1.0" encoding="utf-8" ?>
+<ContentView xmlns="http://schemas.microsoft.com/dotnet/2021/maui"
+             xmlns:x="http://schemas.microsoft.com/winfx/2009/xaml"
+             xmlns:usecase="clr-namespace:BookApp.UseCase"
+             x:Class="BookApp.Composants.RatingView">
+    
+    <ContentView.Resources>
+        <usecase:RatingToStarImageConverter x:Key="RatingToStarConverter"/>
+    </ContentView.Resources>
+
+    <StackLayout Orientation="Horizontal" HorizontalOptions="CenterAndExpand">
+        <StackLayout x:Name="StarsLayout" BindableLayout.ItemsSource="{Binding Rating}">
+            <BindableLayout.ItemTemplate>
+                <DataTemplate>
+                    <Image WidthRequest="30" HeightRequest="30">
+                        <Image.Source>
+                            <MultiBinding Converter="{StaticResource RatingToStarConverter}">
+                                <Binding Path="CurrentRating"/>
+                                <Binding Path="."/>
+                            </MultiBinding>
+                        </Image.Source>
+                    </Image>
+                </DataTemplate>
+            </BindableLayout.ItemTemplate>
+        </StackLayout>
+    </StackLayout>
+</ContentView>
diff --git a/src/BookApp/Composants/RatingView.xaml.cs b/src/BookApp/Composants/RatingView.xaml.cs
new file mode 100644
index 0000000..1beddf5
--- /dev/null
+++ b/src/BookApp/Composants/RatingView.xaml.cs
@@ -0,0 +1,22 @@
+using BookApp.Model;
+
+namespace BookApp.Composants;
+
+public partial class RatingView : ContentView
+{
+    public static readonly BindableProperty RatingProperty =
+        BindableProperty.Create(nameof(Rating), typeof(Star), typeof(RatingView), default(Star), BindingMode.TwoWay);
+
+    public Star Rating
+    {
+        get { return (Star)GetValue(RatingProperty); }
+        set { SetValue(RatingProperty, value); }
+    }
+
+
+    public RatingView()
+    {
+        InitializeComponent();
+        this.BindingContext = this;
+    }
+}
diff --git a/src/BookApp/ContentView/ContentCollection.xaml b/src/BookApp/ContentView/ContentCollection.xaml
deleted file mode 100644
index 17569dd..0000000
--- a/src/BookApp/ContentView/ContentCollection.xaml
+++ /dev/null
@@ -1,37 +0,0 @@
-<?xml version="1.0" encoding="UTF-8"?>
-<ContentView xmlns="http://schemas.microsoft.com/dotnet/2021/maui"
-             xmlns:x="http://schemas.microsoft.com/winfx/2009/xaml"
-             x:Class="BookApp.ContentCollection">
-    <CollectionView ItemsSource="{Binding ItemsSource, Source={x:Reference this}}"  Margin="25,0,0,0">
-        <CollectionView.ItemTemplate>
-            <DataTemplate>
-                <Grid RowDefinitions="Auto" >
-                    <Grid.ColumnDefinitions>
-                        <ColumnDefinition Width="25" />
-                        <ColumnDefinition Width="*" />
-                        <ColumnDefinition Width="*" />
-                    </Grid.ColumnDefinitions>
-                    <Image Grid.Column="0" Source="{Binding Icone}"
-                      HeightRequest="25"
-                      WidthRequest="25" />
-                    <Label Grid.Column="1" Text="{Binding Name}"
-                      FontAttributes="Bold" Padding="5" VerticalOptions="Center"/>
-                    <Grid Grid.Column="2" >
-                        <Grid.ColumnDefinitions>
-                            <ColumnDefinition Width="*" />
-                            <ColumnDefinition Width="*" />
-                        </Grid.ColumnDefinitions>
-                        <Label Grid.Column="2" Text="{Binding Name}"
-FontAttributes="Bold" Padding="5" VerticalOptions="Center"
-        
-        />
-                        <Button Grid.Column="2" ImageSource="chevron_right.svg"
-                                                   HeightRequest="35"
-                                   WidthRequest="35" BackgroundColor="White" HorizontalOptions="End"/>
-                    </Grid>
-                    <!-- Si veiw cela vaudra peut-être le coup de faire une content view (équiavalent de user control) -->
-                </Grid>
-            </DataTemplate>
-        </CollectionView.ItemTemplate>
-    </CollectionView>
-</ContentView>
diff --git a/src/BookApp/ContentView/ContentCollection.xaml.cs b/src/BookApp/ContentView/ContentCollection.xaml.cs
deleted file mode 100644
index e38ae45..0000000
--- a/src/BookApp/ContentView/ContentCollection.xaml.cs
+++ /dev/null
@@ -1,24 +0,0 @@
-using System.Collections.ObjectModel;
-using System.Globalization;
-using static BookApp.MainPage;
-
-namespace BookApp
-{
-    public partial class ContentCollection : ContentView
-    {
-        public static readonly BindableProperty ItemsSourceProperty =
-             BindableProperty.Create(nameof(ItemsSource), typeof(ObservableCollection<ObjetTemp>), typeof(ContentCollection));
-
-        public ObservableCollection<ObjetTemp> ItemsSource
-        {
-            get { return (ObservableCollection<ObjetTemp>)GetValue(ItemsSourceProperty); }
-            set { SetValue(ItemsSourceProperty, value); }
-        }
-
-        public ContentCollection()
-        {
-            InitializeComponent();
-            BindingContext = this;
-        }
-    }
-}
diff --git a/src/BookApp/Data/Stub.cs b/src/BookApp/Data/Stub.cs
new file mode 100644
index 0000000..6a19b91
--- /dev/null
+++ b/src/BookApp/Data/Stub.cs
@@ -0,0 +1,66 @@
+using BookApp.Model;
+using System.Collections.ObjectModel;
+
+namespace BookApp.Data
+{
+    public class Stub
+    {
+        public Book CreateBook(string name, string image, string auteur, bool read, int rating)
+        {
+            Book book = new Book
+            {
+                Name = name,
+                ImageBook = image,
+                Auteur = auteur,
+                Note = new Star(rating),
+                Read = read
+            };
+
+            return book;
+        }
+
+        public ObservableCollection<Book> GetStubData()
+        {
+            ObservableCollection<Book> books = new ObservableCollection<Book>
+            {
+                CreateBook(
+                    "La horde du contrevent",
+                    "./Reources/Images/dotnet_bot.svg",
+                    "Alain Damasio",
+                    false,
+                    4
+                ),
+                CreateBook(
+                    "La zone du dehors",
+                    "./Reources/Images/dotnet_bot.svg",
+                    "Alain Damasio",
+                    true,
+                    5
+                ),
+                CreateBook(
+                    "L'équateur d'Einstein",
+                    "./Reources/Images/dotnet_bot.svg",
+                    "Cixin Liu",
+                    true,
+                    3
+                ),
+                CreateBook(
+                    "La forêt Sombe",
+                    "./Reources/Images/dotnet_bot.svg",
+                    "Cixin Liu",
+                    true,
+                    4
+                ),
+                CreateBook(
+                    "Le problème à trois corps",
+                    "./Reources/Images/dotnet_bot.svg",
+                    "Cixin Liu",
+                    true,
+                    5
+                )
+            };
+
+            return books;
+        }
+    }
+}
diff --git a/src/BookApp/MainPage.xaml b/src/BookApp/MainPage.xaml
index 31fdebb..53d6fa2 100644
--- a/src/BookApp/MainPage.xaml
+++ b/src/BookApp/MainPage.xaml
@@ -2,7 +2,7 @@
 <ContentPage
 	xmlns="http://schemas.microsoft.com/dotnet/2021/maui"
 	xmlns:x="http://schemas.microsoft.com/winfx/2009/xaml"
-             x:Class="BookApp.MainPage">
+    x:Class="BookApp.MainPage">
     <Shell.TitleView>
         <HorizontalStackLayout VerticalOptions="Fill">
             <Label
diff --git a/src/BookApp/MainPage.xaml.cs b/src/BookApp/MainPage.xaml.cs
index 44a0093..14342d5 100644
--- a/src/BookApp/MainPage.xaml.cs
+++ b/src/BookApp/MainPage.xaml.cs
@@ -20,7 +20,6 @@ namespace BookApp
         public ObservableCollection<ObjetTemp> MyCollections1 { get; set; }
         public ObservableCollection<ObjetTemp> MyCollections2 { get; set; }
 
-
         public MainPage()
         {
             InitializeComponent();
@@ -32,11 +31,9 @@ namespace BookApp
                 new ObjetTemp("Item1", "./Reources/Images/eyeglasses.svg"),
                 new ObjetTemp("Item1", "./Reources/Images/heart_fill.svg"),
                 new ObjetTemp("Item1", "./Reources/Images/tag_fill.svg"),
-
             };
             MyCollections2 = new ObservableCollection<ObjetTemp>()
             {
-
                 new ObjetTemp("Item1", "./Reources/Images/person_fill.svg"),
                 new ObjetTemp("Item1", "./Reources/Images/calendar.svg"),
                 new ObjetTemp("Item1", "./Reources/Images/sparkles.svg"),
diff --git a/src/BookApp/MauiProgram.cs b/src/BookApp/MauiProgram.cs
index 28f65ad..7c7f210 100644
--- a/src/BookApp/MauiProgram.cs
+++ b/src/BookApp/MauiProgram.cs
@@ -1,4 +1,5 @@
 using Microsoft.Extensions.Logging;
+using SimpleRatingControlMaui;
 
 namespace BookApp
 {
@@ -9,6 +10,7 @@ namespace BookApp
             var builder = MauiApp.CreateBuilder();
             builder
                 .UseMauiApp<App>()
+                .UseSimpleRatingControl()
                 .ConfigureFonts(fonts =>
                 {
                     fonts.AddFont("OpenSans-Regular.ttf", "OpenSansRegular");
diff --git a/src/BookApp/Model/Book.cs b/src/BookApp/Model/Book.cs
new file mode 100644
index 0000000..a4a8c01
--- /dev/null
+++ b/src/BookApp/Model/Book.cs
@@ -0,0 +1,18 @@
+using System;
+using System.Collections.Generic;
+using System.Collections.ObjectModel;
+using System.Linq;
+using System.Text;
+using System.Threading.Tasks;
+
+namespace BookApp.Model
+{
+    public class Book
+    {
+        public string Name { get; set; }
+        public string ImageBook { get; set; }
+        public string Auteur { get; set; }
+        public Star Note { get; set; }
+        public bool Read { get; set; }
+    }
+}
diff --git a/src/BookApp/Model/Star.cs b/src/BookApp/Model/Star.cs
new file mode 100644
index 0000000..92997b6
--- /dev/null
+++ b/src/BookApp/Model/Star.cs
@@ -0,0 +1,26 @@
+using System;
+using System.Collections.Generic;
+using System.Linq;
+using System.Text;
+using System.Threading.Tasks;
+
+namespace BookApp.Model
+{
+    public class Star
+    {
+        public static int MaxStars { get; private set; } = 5; 
+        public int CurrentRating { get; private set; }
+        public Star(int rating)
+        {
+            if (rating < 0 || rating > MaxStars)
+                throw new ArgumentOutOfRangeException("Rating should be between 0 and MaxStars.");
+
+            CurrentRating = rating;
+        }
+
+        public IEnumerable<int> Rating
+        {
+            get { return Enumerable.Range(0, MaxStars); }
+        }
+    }
+}
diff --git a/src/BookApp/Pages/DetailBook.xaml b/src/BookApp/Pages/DetailBook.xaml
new file mode 100644
index 0000000..6176167
--- /dev/null
+++ b/src/BookApp/Pages/DetailBook.xaml
@@ -0,0 +1,14 @@
+<?xml version="1.0" encoding="utf-8" ?>
+<ContentPage xmlns="http://schemas.microsoft.com/dotnet/2021/maui"
+             xmlns:x="http://schemas.microsoft.com/winfx/2009/xaml"
+             x:Class="BookApp.Pages.DetailBook"
+             Title="Détails du livre">
+    <ContentPage.Content>
+        <StackLayout>
+            <StackLayout x:Name="StarLayout" Grid.Column="0" Orientation="Horizontal" HorizontalOptions="CenterAndExpand">
+                <!-- Les étoiles seront ajoutées ici via le code-behind -->
+            </StackLayout>
+            <Label x:Name="RatingLabel" Grid.Column="1" FontSize="Medium" HorizontalOptions="CenterAndExpand"/>
+        </StackLayout>
+    </ContentPage.Content>
+</ContentPage>
\ No newline at end of file
diff --git a/src/BookApp/Pages/DetailBook.xaml.cs b/src/BookApp/Pages/DetailBook.xaml.cs
new file mode 100644
index 0000000..cf28fd6
--- /dev/null
+++ b/src/BookApp/Pages/DetailBook.xaml.cs
@@ -0,0 +1,67 @@
+using System.Collections.ObjectModel;
+
+namespace BookApp.Pages;
+
+public partial class DetailBook : ContentPage
+{
+    private int maxStars = 5;
+    private int currentRating = 0;
+
+
+
+
+
+    public DetailBook()
+    {
+        InitializeComponent();
+
+        for (int i = 1; i <= maxStars; i++)
+        {
+            var star = new Image
+            {
+                Source = "empty_star.svg",  // image d'une étoile vide
+                WidthRequest = 30,
+                HeightRequest = 30
+            };
+
+            int currentStar = i;
+
+            star.GestureRecognizers.Add(new TapGestureRecognizer
+            {
+                Command = new Command(() => StarTapped(currentStar)),
+            });
+            StarLayout.Children.Add(star);
+        }
+
+        UpdateStars();
+
+        BindingContext = this;
+    }
+
+
+    private void StarTapped(int rating)
+    {
+        if (rating > maxStars)
+        {
+            System.Diagnostics.Debug.WriteLine("Erreur : rating trop élevé!");
+            return;
+        }
+
+        currentRating = rating;
+        UpdateStars();
+        RatingLabel.Text = $"Note: {currentRating}/{maxStars}";
+    }
+
+    private void UpdateStars()
+    {
+        for (int i = 0; i < maxStars; i++)
+        {
+            var star = (Image)StarLayout.Children[i];
+            if (i < currentRating)
+                star.Source = "filled_star.svg";  // image d'une étoile remplie
+            else
+                star.Source = "empty_star.svg";
+        }
+    }
+
+}
diff --git a/src/BookApp/Pages/Tous.xaml b/src/BookApp/Pages/Tous.xaml
index 8e7d1fd..9abbb0a 100644
--- a/src/BookApp/Pages/Tous.xaml
+++ b/src/BookApp/Pages/Tous.xaml
@@ -1,19 +1,93 @@
 <?xml version="1.0" encoding="utf-8" ?>
-<ContentPage xmlns="http://schemas.microsoft.com/dotnet/2021/maui"
-             xmlns:x="http://schemas.microsoft.com/winfx/2009/xaml"
-             x:Class="BookApp.Tous"
-             Title="Tous">
-      <ContentPage.ToolbarItems>
-      
-      <ToolbarItem Text="Modifier" Priority="0" Order="Primary" />
-      <ToolbarItem IconImageSource="dotnet_bot.svg" Priority="1" Order="Primary" />
-  </ContentPage.ToolbarItems>
+<ContentPage
+	xmlns="http://schemas.microsoft.com/dotnet/2021/maui"
+	xmlns:x="http://schemas.microsoft.com/winfx/2009/xaml"
+    xmlns:usecase="clr-namespace:BookApp.UseCase"
+    xmlns:composants="clr-namespace:BookApp.Composants"
+    x:Class="BookApp.Tous">
+    <Shell.BackButtonBehavior>
+        <BackButtonBehavior 
+                            IconOverride="chevron_left.svg"
+            TextOverride="Tous"/>
+    </Shell.BackButtonBehavior>
+    
+    <Shell.TitleView>
+        <Label
+            Text="Tous"
+            FontFamily="Strande2"
+            TextColor="White"
+            VerticalTextAlignment="Center"
+            VerticalOptions="CenterAndExpand"
+            HeightRequest="50"
+            FontSize="Medium" 
+            HorizontalTextAlignment="Center"/>
+    </Shell.TitleView>
+    
+    <ContentPage.ToolbarItems>
+        <ToolbarItem IconImageSource="plus_icone.svg" Priority="1" Order="Primary" />
+        <ToolbarItem IconImageSource="plus_icone.svg" Priority="1" Order="Primary" />
+    </ContentPage.ToolbarItems>
+    
+    <ContentPage.Resources>
+        <ResourceDictionary>
+            <usecase:RatingToStarImageConverter x:Key="RatingToStarConverter"/>
+        </ResourceDictionary>
+    </ContentPage.Resources>
+
+
     <ContentPage.Content>
-      
-        <StackLayout>
-            <Label Text="Welcome to Xamarin.Forms!"
-                VerticalOptions="CenterAndExpand" 
-                HorizontalOptions="CenterAndExpand" />
-        </StackLayout>
+        <CollectionView ItemsSource="{Binding BookCollection}">
+            <CollectionView.ItemTemplate>
+                <DataTemplate>
+                    <StackLayout>
+                        <Grid>
+                            <!-- Arrière-plan avec BoxView -->
+                            <BoxView Color="LightGray" />
+                            <!-- Label par-dessus le BoxView -->
+                            <Label Text="{Binding Auteur}"
+                               Padding="5"
+                               Margin="15,0,0,0"
+                               TextColor="Black" />
+                        </Grid>
+                        <Grid>
+                            <Grid.RowDefinitions>
+                                <RowDefinition Height="Auto"/>
+                            </Grid.RowDefinitions>
+                            <Grid.ColumnDefinitions>
+                                <ColumnDefinition Width="*"/>
+                                <ColumnDefinition Width="*"/>
+                            </Grid.ColumnDefinitions>
+                            <Image Grid.Column="0"
+                                Source="{Binding ImageBook}"
+                                HeightRequest="125"
+                                WidthRequest="125"
+                                Margin="0,10,0,10"/>
+                            <StackLayout Grid.Column="1">
+                                <Label Text="{Binding Name}"
+                                    
+                                    TextColor="Black"/>
+                                <Label Text="{Binding Auteur}"
+                                    
+                                    TextColor="Black"/>
+                                <Label 
+                                    Text="{Binding Read}"
+                                    FontAttributes="Bold"/>
+                                <Grid>
+                                    <Grid.RowDefinitions>
+                                        <RowDefinition Height="Auto"/>
+                                    </Grid.RowDefinitions>
+                                    <Grid.ColumnDefinitions>
+                                        <ColumnDefinition Width="*"/>
+                                        <ColumnDefinition Width="*"/>
+                                    </Grid.ColumnDefinitions>
+                                    <composants:RatingView Rating="{Binding Note.Rating}"/>
+                                </Grid>
+                            </StackLayout>
+                        </Grid>
+                        <BoxView Margin="25,0,0,10" HeightRequest="1" BackgroundColor="LightGray" VerticalOptions="End" />
+                    </StackLayout>
+                </DataTemplate>
+            </CollectionView.ItemTemplate>
+        </CollectionView>
     </ContentPage.Content>
 </ContentPage>
\ No newline at end of file
diff --git a/src/BookApp/Pages/Tous.xaml.cs b/src/BookApp/Pages/Tous.xaml.cs
index 6b37241..226f8df 100644
--- a/src/BookApp/Pages/Tous.xaml.cs
+++ b/src/BookApp/Pages/Tous.xaml.cs
@@ -1,17 +1,16 @@
-using System;
-using System.Collections.Generic;
-using System.Linq;
-using System.Text;
-using System.Threading.Tasks;
+using BookApp.Model;
+using BookApp.ViewModel;
 
 namespace BookApp
 {
-    [XamlCompilation(XamlCompilationOptions.Compile)]
     public partial class Tous : ContentPage
     {
         public Tous()
         {
             InitializeComponent();
+            BindingContext = new TousViewModel();
         }
+
+
     }
 }
diff --git a/src/BookApp/Resources/Images/chevron_left.svg b/src/BookApp/Resources/Images/chevron_left.svg
new file mode 100644
index 0000000..ef8a6ae
--- /dev/null
+++ b/src/BookApp/Resources/Images/chevron_left.svg
@@ -0,0 +1 @@
+<svg height="24" viewBox="0 0 24 24" width="24" xmlns="http://www.w3.org/2000/svg"><path d="m12.7270006 3.68663679c.3792191-.40151136.3611476-1.03441839-.0403638-1.41363742s-1.0344184-.36114752-1.4136374.04036384l-8.50031054 8.99999999c-.36397787.3853743-.36400206.9878117-.00005513 1.3732152l8.50031047 9.001448c.3791868.4015418 1.0120924.4196641 1.4136342.0404774.4015418-.3791868.4196642-1.0120924.0404774-1.4136342l-7.85190384-8.3148144z" fill="#212121"/></svg>
\ No newline at end of file
diff --git a/src/BookApp/Resources/Images/empty_star.svg b/src/BookApp/Resources/Images/empty_star.svg
new file mode 100644
index 0000000..c81d1e9
--- /dev/null
+++ b/src/BookApp/Resources/Images/empty_star.svg
@@ -0,0 +1 @@
+<svg xmlns="http://www.w3.org/2000/svg" enable-background="new 0 0 24 24" height="24px" viewBox="0 0 24 24" width="24px" fill="#000000"><g><path d="M0 0h24v24H0V0z" fill="none"/><path d="M0 0h24v24H0V0z" fill="none"/></g><g><path d="M12 17.27 18.18 21l-1.64-7.03L22 9.24l-7.19-.61L12 2 9.19 8.63 2 9.24l5.46 4.73L5.82 21 12 17.27z"/></g></svg>
\ No newline at end of file
diff --git a/src/BookApp/Resources/Images/filled_star.svg b/src/BookApp/Resources/Images/filled_star.svg
new file mode 100644
index 0000000..69b518a
--- /dev/null
+++ b/src/BookApp/Resources/Images/filled_star.svg
@@ -0,0 +1 @@
+<svg viewBox="0 0 64 64" xmlns="http://www.w3.org/2000/svg"><path d="m62 25.2h-22.9l-7.1-22.2-7.1 22.2h-22.9l18.5 13.7-7 22.1 18.5-13.7 18.5 13.7-7.1-22.2z" fill="#ffce31"/></svg>
\ No newline at end of file
diff --git a/src/BookApp/UseCase/RatingToStarImageConverter.cs b/src/BookApp/UseCase/RatingToStarImageConverter.cs
new file mode 100644
index 0000000..5f27967
--- /dev/null
+++ b/src/BookApp/UseCase/RatingToStarImageConverter.cs
@@ -0,0 +1,26 @@
+using System;
+using System.Collections.Generic;
+using System.Globalization;
+using System.Linq;
+using System.Text;
+using System.Threading.Tasks;
+
+namespace BookApp.UseCase
+{
+    public class RatingToStarImageConverter : IValueConverter
+    {
+        public object Convert(object value, Type targetType, object parameter, CultureInfo culture)
+        {
+            int currentRating = (int)value;
+            int index = System.Convert.ToInt32(parameter);
+
+            return index < currentRating ? "../Ressources/Images/filled_star.svg" : "../Ressources/Images/empty_star.svg";
+        }
+
+        public object ConvertBack(object value, Type targetType, object parameter, CultureInfo culture)
+        {
+            throw new NotImplementedException();
+        }
+    }
+
+}
diff --git a/src/BookApp/ViewModel/TousViewModel.cs b/src/BookApp/ViewModel/TousViewModel.cs
new file mode 100644
index 0000000..0291751
--- /dev/null
+++ b/src/BookApp/ViewModel/TousViewModel.cs
@@ -0,0 +1,18 @@
+using BookApp.Data;
+using BookApp.Model;
+using System.Collections.ObjectModel;
+
+namespace BookApp.ViewModel
+{
+    public class TousViewModel
+    {
+        public ObservableCollection<Book> BookCollection { get; set; } =
+            new ObservableCollection<Book>();
+
+        public TousViewModel()
+        {
+            Stub stub = new Stub();
+            BookCollection = stub.GetStubData();
+        }
+    }
+}
diff --git a/src/TestFrontEnd/TestFrontEnd.csproj b/src/TestFrontEnd/TestFrontEnd.csproj
index b8cb93d..e74a85a 100644
--- a/src/TestFrontEnd/TestFrontEnd.csproj
+++ b/src/TestFrontEnd/TestFrontEnd.csproj
@@ -1,4 +1,4 @@
-<Project Sdk="Microsoft.NET.Sdk">
+<Project Sdk="Microsoft.NET.Sdk">
 
   <PropertyGroup>
     <TargetFramework>net7.0</TargetFramework>
@@ -10,10 +10,13 @@
   </PropertyGroup>
 
   <ItemGroup>
-    <PackageReference Include="Microsoft.NET.Test.Sdk" Version="17.6.0" />
-    <PackageReference Include="MSTest.TestAdapter" Version="2.2.10" />
-    <PackageReference Include="MSTest.TestFramework" Version="2.2.10" />
-    <PackageReference Include="coverlet.collector" Version="3.2.0" />
+    <PackageReference Include="Microsoft.NET.Test.Sdk" Version="17.7.2" />
+    <PackageReference Include="MSTest.TestAdapter" Version="3.1.1" />
+    <PackageReference Include="MSTest.TestFramework" Version="3.1.1" />
+    <PackageReference Include="coverlet.collector" Version="6.0.0">
+      <PrivateAssets>all</PrivateAssets>
+      <IncludeAssets>runtime; build; native; contentfiles; analyzers; buildtransitive</IncludeAssets>
+    </PackageReference>
   </ItemGroup>
 
 </Project>
diff --git a/symbols/icons8-sorting-arrows-64.png b/symbols/icons8-sorting-arrows-64.png
new file mode 100644
index 0000000000000000000000000000000000000000..c5b5b1000a0be8d7faddb8b519c3e2c9e42901df
GIT binary patch
literal 454
zcmV;%0XhDOP)<h;3K|Lk000e1NJLTq002M$002M;1^@s6s%dfF00009a7bBm000XU
z000XU0RWnu7ytkPcu7P-RCt{2o55<sFc3uFueha!Ty*J|r9T_ewC6$#{RIVs0!G*p
z*j{T@X21w1nB5&qvvXL3AP9o63!Z^@V89NqDaN?ELI8e&nAY*$0$(Y{Cr*ox>G}iS
z3}Q`VxGg>!lHiJfP$=Gt1UCePtoWRW{J-#@2nbn$Kk2t=awp*1U?(&uAS@I=mz)I&
zO$i8<tv#1q?U}9!xK;{TN-ihiqgMiMmA6<*Zc4(XR{{p$3_Pt&?(zK4vk10MP6VJG
zfQ|st03?DqL{t|*Z7|9QAR`nz*O}Fj2qF<gB8Wr~i6C}R7eH+g`2b{ukQ2lqqMRUd
zf>BNoIl<Vu&a8$+5Q!iXLAIUG+O%nHmmM*!YI+2&I}KrMnL=qwz-^~7oGnu*O$qQY
zh}FCcl*a4w7^ShjuG`>gfrM!cSH)ZSfL7zUu8dH=6XvewZ{FGomPl|@ytNgcBf(Yi
wM|{q5)Mq)X@scJ%$JGjZOq&XVAP6Mf0RZ{4OBTPk`v3p{07*qoM6N<$f&jd?{r~^~

literal 0
HcmV?d00001