Updated names for uniformity

This commit is contained in:
Sean Edmunds
2025-04-28 14:21:45 -05:00
parent f44f6e004b
commit 19b793fbf9
26 changed files with 247 additions and 404 deletions

View File

@@ -46,6 +46,7 @@ function ThemeCard({
<DeleteItemModal
modalOpened={modalOpened}
handleClose={closeModal}
handleDelete={() => handleDelete(cardTheme, 'api/themes')}
title={'Delete Theme'}
body={
<Stack gap={0} w={'100%'} h={'150px'} align='center'>
@@ -62,27 +63,6 @@ function ThemeCard({
}}
>{`"${cardTheme.name}"`}</Text>
<Text c='red'>This action cannot be undone!</Text>
<Group pos={'absolute'} bottom={8}>
<Button
color={'red'}
styles={{ label: { color: 'black' } }}
onClick={() => {
handleDelete(cardTheme, 'api/themes');
closeModal();
}}
>
Delete
</Button>
<Button
color={'grey'}
styles={{ label: { color: 'black' } }}
onClick={() => {
closeModal();
}}
>
Cancel
</Button>
</Group>
</Stack>
}
/>

View File

@@ -188,7 +188,7 @@ export default function ThemeModalContent({ selectedTheme }: { selectedTheme: Th
}}
component='a'
>
{'Link 1'}
{'Bookmark 1'}
</Text>
<Text
style={{
@@ -199,7 +199,7 @@ export default function ThemeModalContent({ selectedTheme }: { selectedTheme: Th
}}
component='a'
>
{'Link 2'}
{'Bookmark 2'}
</Text>
</Stack>
<Stack
@@ -235,7 +235,7 @@ export default function ThemeModalContent({ selectedTheme }: { selectedTheme: Th
}}
component='a'
>
{'Link 1'}
{'Bookmark 1'}
</Text>
<Text
style={{
@@ -246,7 +246,7 @@ export default function ThemeModalContent({ selectedTheme }: { selectedTheme: Th
}}
component='a'
>
{'Link 2'}
{'Bookmark 2'}
</Text>
</Stack>
</Stack>

View File

@@ -24,6 +24,7 @@ function ThemePlaylistCard({
handleOpen: (cardPlaylist: ThemePlaylist) => void;
allThemes: Theme[];
}) {
const themePlaylistEndpoint = 'api/themePlaylists';
const [hover, setHover] = useState(false);
const { setThemeName, setCurrentThemePlaylist, theme, handleDelete } = useCommonHooks();
const syncableLists = ['All', 'Backgrounds', 'No Backgrounds'];
@@ -45,6 +46,7 @@ function ThemePlaylistCard({
<DeleteItemModal
modalOpened={modalOpened}
handleClose={closeModal}
handleDelete={() => handleDelete(cardPlaylist, 'api/themePlaylists')}
title='Delete Theme Playlist'
body={
<Stack gap={0} w={'100%'} h={'150px'} align='center'>
@@ -61,27 +63,6 @@ function ThemePlaylistCard({
}}
>{`"${cardPlaylist.name}"`}</Text>
<Text c='red'>This action cannot be undone!</Text>
<Group pos={'absolute'} bottom={8}>
<Button
color={'red'}
styles={{ label: { color: 'black' } }}
onClick={() => {
handleDelete(cardPlaylist, 'api/themePlaylists');
closeModal();
}}
>
Delete
</Button>
<Button
color={'grey'}
styles={{ label: { color: 'black' } }}
onClick={() => {
closeModal();
}}
>
Cancel
</Button>
</Group>
</Stack>
}
/>
@@ -124,7 +105,7 @@ function ThemePlaylistCard({
if (cardPlaylist.name === 'All') {
mutateAsync({
method: 'PATCH',
endpoint: 'api/themePlaylists',
endpoint: themePlaylistEndpoint,
body: {
id: cardPlaylist.id,
name: 'All',
@@ -135,7 +116,7 @@ function ThemePlaylistCard({
if (cardPlaylist.name === 'Backgrounds') {
mutateAsync({
method: 'PATCH',
endpoint: 'api/themePlaylists',
endpoint: themePlaylistEndpoint,
body: {
id: cardPlaylist.id,
name: 'Backgrounds',
@@ -152,7 +133,7 @@ function ThemePlaylistCard({
if (cardPlaylist.name === 'No Backgrounds') {
mutateAsync({
method: 'PATCH',
endpoint: 'api/themePlaylists',
endpoint: themePlaylistEndpoint,
body: {
id: cardPlaylist.id,
name: 'No Backgrounds',

View File

@@ -11,11 +11,11 @@ import ThemePlaylistModal from './ThemePlaylistModal';
function ThemePlaylists() {
const themesEndpoint = 'api/themes';
const { data: allThemes } = useQueryAPI({
const { data: allThemeData } = useQueryAPI({
endpoint: themesEndpoint,
});
const themePlaylistsEndpoint = 'api/themePlaylists';
const { data: themePlaylists } = useQueryAPI({
const { data: themePlaylistData } = useQueryAPI({
endpoint: themePlaylistsEndpoint,
});
const defaultPlaylist = {
@@ -60,7 +60,7 @@ function ThemePlaylists() {
defaultPlaylist={defaultPlaylist}
setSelectedPlaylist={setSelectedPlaylist}
handleSavePlaylist={handleSavePlaylist}
allThemes={allThemes}
allThemes={allThemeData}
createPlaylist={mutateAsync}
/>
<Stack h={'100%'} w={'100%'}>
@@ -84,7 +84,7 @@ function ThemePlaylists() {
</Text>
</Group>
<Group justify='center' align='center' pos={'relative'}>
{themePlaylists
{themePlaylistData
?.filter((playlist: ThemePlaylist) => playlist.default === 1)
?.filter((a: ThemePlaylist) =>
a.name.toLowerCase().includes(debouncedSearch.toLowerCase()),
@@ -113,7 +113,7 @@ function ThemePlaylists() {
<ThemePlaylistCard
cardPlaylist={cardPlaylist}
handleOpen={handleOpen}
allThemes={allThemes}
allThemes={allThemeData}
/>
</Box>
</Group>
@@ -131,7 +131,7 @@ function ThemePlaylists() {
pos={'relative'}
mb={isMobile ? '6rem' : undefined}
>
{themePlaylists
{themePlaylistData
?.filter((playlist: ThemePlaylist) => playlist.default === 0)
?.filter((a: ThemePlaylist) =>
a.name.toLowerCase().includes(debouncedSearch.toLowerCase()),
@@ -161,7 +161,7 @@ function ThemePlaylists() {
<ThemePlaylistCard
cardPlaylist={cardPlaylist}
handleOpen={handleOpen}
allThemes={allThemes}
allThemes={allThemeData}
/>
</Box>
</Group>

View File

@@ -13,7 +13,7 @@ import ThemeModal from './ThemeModal';
function ThemesSettings() {
const themesEndpoint = 'api/themes';
const backgroundsEndpoint = 'api/backgrounds';
const { data: allThemes } = useQueryAPI({
const { data: allThemeData } = useQueryAPI({
endpoint: 'api/themes',
});
const { data: backgroundData, isFetched: isBackgroundFetched } = useQueryAPI({
@@ -161,7 +161,7 @@ function ThemesSettings() {
}}
pos={'absolute'}
/>
{allThemes
{allThemeData
?.filter((a: Theme) =>
a.name.toLowerCase().includes(debouncedSearch.toLowerCase()),
)
@@ -191,7 +191,7 @@ function ThemesSettings() {
}}
>
<ThemeCard
allThemes={allThemes}
allThemes={allThemeData}
cardTheme={cardTheme}
handleOpen={handleOpen}
themePlaylists={themePlaylists}