Fixes viktorstrate/photoview#6

- Fixed issue that prevented favorites toggle to switch on on the Photos page
- The favorites toggle is moved on left

ui/src/Pages/AlbumPage/AlbumPage.js

@@ -52,21 +52,21 @@ function AlbumPage({ match }) {
   )
 
   const toggleFavorites = refetch => {
-    const onlyFavorites = !onlyFavorites
+    const newState = !onlyFavorites
     if (
-      (refetchNeededAll && !onlyFavorites) ||
-      (refetchNeededFavorites && onlyFavorites)
+      (refetchNeededAll && !newState) ||
+      (refetchNeededFavorites && newState)
     ) {
-      refetch({ id: albumId, onlyFavorites: onlyFavorites }).then(() => {
+      refetch({ id: albumId, onlyFavorites: newState }).then(() => {
         if (onlyFavorites) {
           refetchNeededFavorites = false
         } else {
           refetchNeededAll = false
         }
-        setOnlyFavorites(onlyFavorites)
+        setOnlyFavorites(newState)
       })
     } else {
-      setOnlyFavorites(onlyFavorites)
+      setOnlyFavorites(newState)
     }
     history.replaceState(
       {},

ui/src/Pages/PhotosPage/PhotosPage.js

@@ -44,8 +44,7 @@ const photoQuery = gql`
 `
 
 const FavoritesCheckbox = styled(Checkbox)`
-  float: right;
-  margin: 0.5rem 0 0 1rem;
+  margin: 0.5rem 0 0 0;
 `
 
 class PhotosPage extends Component {

ui/src/components/AlbumTitle.js

@@ -34,9 +34,7 @@ const StyledIcon = styled(Icon)`
 `
 
 const FavoritesCheckbox = styled(Checkbox)`
-  float: right;
-  padding-left: 10px;
-  margin-top: 0.5rem;
+  margin-bottom: 16px;
 `
 
 const SettingsIcon = props => {
@@ -103,16 +101,18 @@ const AlbumTitle = ({
   }
 
   return (
-    <Header>
-      <Breadcrumb>{breadcrumbSections}</Breadcrumb>
-      {title}
-      {authToken() && (
-        <SettingsIcon
-          onClick={() => {
-            updateSidebar(<AlbumSidebar albumId={album.id} />)
-          }}
-        />
-      )}
+    <>
+      <Header>
+        <Breadcrumb>{breadcrumbSections}</Breadcrumb>
+        {title}
+        {authToken() && (
+          <SettingsIcon
+            onClick={() => {
+              updateSidebar(<AlbumSidebar albumId={album.id} />)
+            }}
+          />
+        )}
+      </Header>
       {authToken() && showFavoritesToggle && (
         <FavoritesCheckbox
           toggle
@@ -122,7 +122,7 @@ const AlbumTitle = ({
           onChange={setOnlyFavorites}
         />
       )}
-    </Header>
+    </>
   )
 }