Merge branch 'develop'

package.json

@@ -1,7 +1,7 @@
 {
   "name": "spotify-release-list",
   "author": "Jakub Dobes <[email protected]>",
-  "version": "2.0.1",
+  "version": "2.0.2",
   "private": true,
   "repository": "github:jakubito/spotify-release-list",
   "license": "ISC",

src/components/filters/AlbumGroupsFilter.js

@@ -24,7 +24,7 @@ function AlbumGroupsFilter() {
   }
 
   return (
-    <div className="AlbumGroupsFilter filter">
+    <div className="AlbumGroupsFilter Filters__filter">
       {AlbumGroupLabels.filter(([group]) => releasesGroupMap[group]).map(([group, label]) => (
         <Button
           title={label}

src/components/filters/DateRangeFilter.js

@@ -49,7 +49,7 @@ function DateRangeFilter() {
   }, [values])
 
   return (
-    <div className={classNames('DateRangeFilter', 'filter', { focused: focus })}>
+    <div className={classNames('DateRangeFilter Filters__filter', { focused: focus })}>
       <Media query={{ maxWidth: 425 }}>
         {(matches) => (
           <DateRangePicker

src/components/filters/DuplicatesFilter.js

@@ -12,13 +12,17 @@ function DuplicatesFilter() {
   const exclude = useSelector(getFiltersExcludeDuplicates)
 
   return (
-    <Checkbox
-      id="duplicatesFilter"
-      label="Exclude duplicates"
-      defaultChecked={exclude}
-      onChange={(event) => defer(dispatch, setFilters({ excludeDuplicates: event.target.checked }))}
-      dark
-    />
+    <div className="Filters__filter Filters__filter--inline">
+      <Checkbox
+        id="duplicatesFilter"
+        label="Exclude duplicates"
+        defaultChecked={exclude}
+        onChange={(event) =>
+          defer(dispatch, setFilters({ excludeDuplicates: event.target.checked }))
+        }
+        dark
+      />
+    </div>
   )
 }
 

src/components/filters/SearchFilter.js

@@ -42,7 +42,7 @@ function SearchFilter() {
   )
 
   return (
-    <div className="SearchFilter filter">
+    <div className="SearchFilter Filters__filter">
       <Input
         value={value}
         onChange={onChange}

src/components/filters/VariousArtistsFilter.js

@@ -12,15 +12,17 @@ function VariousArtistsFilter() {
   const exclude = useSelector(getFiltersExcludeVariousArtists)
 
   return (
-    <Checkbox
-      id="variousArtistsFilter"
-      label="Exclude Various Artists"
-      defaultChecked={exclude}
-      onChange={(event) =>
-        defer(dispatch, setFilters({ excludeVariousArtists: event.target.checked }))
-      }
-      dark
-    />
+    <div className="Filters__filter Filters__filter--inline">
+      <Checkbox
+        id="variousArtistsFilter"
+        label="Exclude Various Artists"
+        defaultChecked={exclude}
+        onChange={(event) =>
+          defer(dispatch, setFilters({ excludeVariousArtists: event.target.checked }))
+        }
+        dark
+      />
+    </div>
   )
 }
 

src/state/selectors.js

@@ -142,7 +142,6 @@ export const getLastSyncDate = createSelector(
   (lastSync, lastAutoSync) => {
     if (lastSync || lastAutoSync) {
       const newer = (lastSync || '') > (lastAutoSync || '') ? lastSync : lastAutoSync
-
       return new Date(newer)
     }
 
@@ -256,8 +255,9 @@ const getNoDuplicatesAlbumIds = createSelector(getOriginalReleases, (releases) =
     const namesMap = {}
 
     for (const album of albums) {
-      if (album.name in namesMap) continue
-      namesMap[album.name] = album.id
+      const name = album.name.toLowerCase()
+      if (name in namesMap) continue
+      namesMap[name] = album.id
     }
 
     return ids.concat(Object.values(namesMap))

src/styles/Filters.scss

@@ -1,19 +1,19 @@
 .Filters {
-  padding: 15px 15px 15px 260px;
+  padding: 15px 15px 0 260px;
   margin-bottom: 5px;
   background-color: $black-bis;
 
   @include until-widescreen {
     padding-left: 15px;
   }
 
-  .filter {
+  &__filter {
     display: flex;
     margin-bottom: 15px;
     align-items: center;
 
-    &:last-child {
-      margin-bottom: 0;
+    &--inline {
+      display: inline-block;
     }
   }
 }

src/styles/UpdateMessage.scss

@@ -12,6 +12,8 @@
     font-size: 16px;
     padding: 0 8px;
     text-decoration: underline !important;
+    white-space: normal;
+    height: auto;
 
     &:focus {
       color: $white-bis !important;