[web] add fav icon to picture thumbnails (#3620)

## Description
web client : Add the favorite icon to a memory thumbnail in the gallery,
looking just like in the Android app
## Tests
- favorite a picture
- in the gallery, check that the favorite icon is showed n the picture
thumbnail, as an overlay

web/apps/photos/src/components/PhotoFrame.tsx

@@ -323,6 +323,7 @@ const PhotoFrame = ({
             }
             activeCollectionID={activeCollectionID}
             showPlaceholder={isScrolling}
+            isFav={favItemIds.has(item.id)}
         />
     );
 

web/apps/photos/src/components/pages/gallery/PreviewCard.tsx

@@ -23,6 +23,7 @@ import React, { useContext, useEffect, useRef, useState } from "react";
 import { TRASH_SECTION } from "utils/collection";
 import { shouldShowAvatar } from "utils/file";
 import Avatar from "./Avatar";
+import Favorite from "@mui/icons-material/FavoriteRounded";
 
 interface IProps {
     file: EnteFile;
@@ -38,6 +39,7 @@ interface IProps {
     isInsSelectRange: boolean;
     activeCollectionID: number;
     showPlaceholder: boolean;
+    isFav: boolean;
 }
 
 const Check = styled("input")<{ $active: boolean }>`
@@ -121,6 +123,14 @@ export const AvatarOverlay = styled(Overlay)`
     padding-top: 5px;
 `;
 
+export const FavOverlay = styled(Overlay)`
+    display: flex;
+    justify-content: flex-start;
+    align-items: flex-end;
+    padding-left: 5px;
+    padding-bottom: 5px;
+`;
+
 export const InSelectRangeOverLay = styled("div")<{ $active: boolean }>`
     opacity: ${(props) => (!props.$active ? 0 : 1)};
     left: 0;
@@ -351,6 +361,11 @@ export default function PreviewCard(props: IProps) {
                     <Avatar file={file} />
                 </AvatarOverlay>
             )}
+            {props.isFav && (
+                <FavOverlay>
+                    <Favorite/>
+                </FavOverlay>
+            )}
 
             <HoverOverlay
                 className="preview-card-hover-overlay"