[enhancement]: support toggling feature carousel

This commit is contained in:
Kendall Garner 2024-05-15 21:48:20 -07:00
parent 168153b211
commit bb2f8461ed
No known key found for this signature in database
GPG key ID: 18D2767419676C87
4 changed files with 29 additions and 2 deletions

View file

@ -496,6 +496,8 @@
"globalMediaHotkeys_description": "enable or disable the usage of your system media hotkeys to control playback", "globalMediaHotkeys_description": "enable or disable the usage of your system media hotkeys to control playback",
"homeConfiguration": "home page configuration", "homeConfiguration": "home page configuration",
"homeConfiguration_description": "configure what items are shown, and in what order, on the home page", "homeConfiguration_description": "configure what items are shown, and in what order, on the home page",
"homeFeature": "home featured carousel",
"homeFeature_description": "controls whether to show the large featured carousel on the home page",
"hotkey_browserBack": "browser back", "hotkey_browserBack": "browser back",
"hotkey_browserForward": "browser forward", "hotkey_browserForward": "browser forward",
"hotkey_favoriteCurrentSong": "favorite $t(common.currentSong)", "hotkey_favoriteCurrentSong": "favorite $t(common.currentSong)",

View file

@ -33,11 +33,12 @@ const HomeRoute = () => {
const server = useCurrentServer(); const server = useCurrentServer();
const itemsPerPage = 15; const itemsPerPage = 15;
const { windowBarStyle } = useWindowSettings(); const { windowBarStyle } = useWindowSettings();
const { homeItems } = useGeneralSettings(); const { homeFeature, homeItems } = useGeneralSettings();
const feature = useAlbumList({ const feature = useAlbumList({
options: { options: {
cacheTime: 1000 * 60, cacheTime: 1000 * 60,
enabled: homeFeature,
staleTime: 1000 * 60, staleTime: 1000 * 60,
}, },
query: { query: {
@ -249,7 +250,7 @@ const HomeRoute = () => {
px="2rem" px="2rem"
spacing="lg" spacing="lg"
> >
<FeatureCarousel data={featureItemsWithImage} /> {homeFeature && <FeatureCarousel data={featureItemsWithImage} />}
{sortedCarousel.map((carousel) => ( {sortedCarousel.map((carousel) => (
<MemoizedSwiperGridCarousel <MemoizedSwiperGridCarousel
key={`carousel-${carousel.uniqueId}`} key={`carousel-${carousel.uniqueId}`}

View file

@ -377,6 +377,28 @@ export const ControlSettings = () => {
isHidden: false, isHidden: false,
title: t('setting.genreBehavior', { postProcess: 'sentenceCase' }), title: t('setting.genreBehavior', { postProcess: 'sentenceCase' }),
}, },
{
control: (
<Switch
aria-label={t('setting.homeFeature', { postProcess: 'sentenceCase' })}
defaultChecked={settings.homeFeature}
onChange={(e) =>
setSettings({
general: {
...settings,
homeFeature: e.currentTarget.checked,
},
})
}
/>
),
description: t('setting.homeFeature', {
context: 'description',
postProcess: 'sentenceCase',
}),
isHidden: false,
title: t('setting.homeFeature', { postProcess: 'sentenceCase' }),
},
]; ];
return <SettingsSection options={controlOptions} />; return <SettingsSection options={controlOptions} />;

View file

@ -198,6 +198,7 @@ export interface SettingsState {
externalLinks: boolean; externalLinks: boolean;
followSystemTheme: boolean; followSystemTheme: boolean;
genreTarget: GenreTarget; genreTarget: GenreTarget;
homeFeature: boolean;
homeItems: SortableItem<HomeItem>[]; homeItems: SortableItem<HomeItem>[];
language: string; language: string;
passwordStore?: string; passwordStore?: string;
@ -319,6 +320,7 @@ const initialState: SettingsState = {
externalLinks: true, externalLinks: true,
followSystemTheme: false, followSystemTheme: false,
genreTarget: GenreTarget.TRACK, genreTarget: GenreTarget.TRACK,
homeFeature: true,
homeItems, homeItems,
language: 'en', language: 'en',
passwordStore: undefined, passwordStore: undefined,