smedmunds/TriggerFrontend
1
0
Fork 0
Code Issues Pull Requests Actions Projects Releases Wiki Activity

New Theme modal

Browse Source
This commit is contained in:
Sean Edmunds
2025-07-24 13:35:05 -05:00
parent e0adad34ba
commit b8c10ef75b
5 changed files with 763 additions and 501 deletions
Download Patch File Download Diff File Expand all files Collapse all files

16
package-lock.json generated
View File

@@ -32,7 +32,7 @@
"@vitest/coverage-v8": "^3.2.4",
"@vitest/ui": "^3.2.4",
"typescript": "^5.8.3",
"vite": "^7.0.5",
"vite": "^7.0.6",
"vite-plugin-dts": "~4.5.4",
"vite-tsconfig-paths": "^5.1.4",
"vitest": "^3.2.4"
@@ -3468,9 +3468,9 @@
"dev": true
},
"node_modules/picomatch": {
"version": "4.0.2",
"resolved": "https://registry.npmjs.org/picomatch/-/picomatch-4.0.2.tgz",
"integrity": "sha512-M7BAV6Rlcy5u+m6oPhAPFgJTzAioX/6B0DxyvDlo9l8+T3nLKbrczg2WLUyzd45L8RqfUMyGPzekbMvX2Ldkwg==",
"version": "4.0.3",
"resolved": "https://registry.npmjs.org/picomatch/-/picomatch-4.0.3.tgz",
"integrity": "sha512-5gTmgEY/sqK6gFXLIsQNH19lWb4ebPDLA4SdLP7dsWkIXHWlG66oPuVvXSGFPppYZz8ZDZq0dYYrbHfBCVUb1Q==",
"dev": true,
"license": "MIT",
"engines": {
@@ -4506,15 +4506,15 @@
}
},
"node_modules/vite": {
"version": "7.0.5",
"resolved": "https://registry.npmjs.org/vite/-/vite-7.0.5.tgz",
"integrity": "sha512-1mncVwJxy2C9ThLwz0+2GKZyEXuC3MyWtAAlNftlZZXZDP3AJt5FmwcMit/IGGaNZ8ZOB2BNO/HFUB+CpN0NQw==",
"version": "7.0.6",
"resolved": "https://registry.npmjs.org/vite/-/vite-7.0.6.tgz",
"integrity": "sha512-MHFiOENNBd+Bd9uvc8GEsIzdkn1JxMmEeYX35tI3fv0sJBUTfW5tQsoaOwuY4KhBI09A3dUJ/DXf2yxPVPUceg==",
"dev": true,
"license": "MIT",
"dependencies": {
"esbuild": "^0.25.0",
"fdir": "^6.4.6",
"picomatch": "^4.0.2",
"picomatch": "^4.0.3",
"postcss": "^8.5.6",
"rollup": "^4.40.0",
"tinyglobby": "^0.2.14"

2
package.json
View File

@@ -34,7 +34,7 @@
"@vitest/coverage-v8": "^3.2.4",
"@vitest/ui": "^3.2.4",
"typescript": "^5.8.3",
"vite": "^7.0.5",
"vite": "^7.0.6",
"vite-plugin-dts": "~4.5.4",
"vite-tsconfig-paths": "^5.1.4",
"vitest": "^3.2.4"

6
src/pages/settings/components/Theming/ThemePlaylists/ThemePlaylistModal.tsx
View File

@@ -1,4 +1,4 @@
import { Button, Group, Modal, SimpleGrid, Text, TextInput } from '@mantine/core';
import { Button, Group, Modal, Text, TextInput } from '@mantine/core';
import { useCommonHooks } from 'hooks';
import { useEffect, useState } from 'react';
import { modalClasses, textInputClasses } from 'styles';
@@ -87,7 +87,7 @@ export function ThemePlaylistModal({
/>
) : (
<>
<SimpleGrid cols={3}>
<Group w={'100%'} justify='center'>
{selectedPlaylist?.name !== 'Time of Day' &&
allThemes?.map((miniTheme: Theme) => {
const newThemeList = themeList;
@@ -102,7 +102,7 @@ export function ThemePlaylistModal({
/>
);
})}
</SimpleGrid>
</Group>
<Group mt={'1rem'}>
<Button color={'green'} onClick={handleSavePlaylist}>
Save

1224
src/pages/settings/components/Theming/Themes/ThemeModal.tsx
View File

File diff suppressed because it is too large Load Diff

16
src/pages/settings/components/Theming/Themes/Themes.tsx
View File

@@ -44,7 +44,7 @@ export function Themes() {
primaryColor: '#222222',
accentColor: '#5c5c5c',
borderColor: '#5c5c5c',
randomEnabled: 0,
randomEnabled: 1,
textShadowsEnabled: 0,
appShadowsEnabled: 0,
});
@@ -52,6 +52,7 @@ export function Themes() {
const [searchValue, setSearchValue] = useState('');
const [debouncedSearch] = useDebouncedValue(searchValue, 500);
const [isLoading, setIsLoading] = useState(false);
const [isNew, setIsNew] = useState(false);
const navigate = useNavigate();
const {
currentTheme,
@@ -70,6 +71,7 @@ export function Themes() {
const handleClose = () => {
closeThemeModal();
closePicker();
setIsNew(false);
setSelectedTheme({
id: undefined,
name: 'default',
@@ -79,12 +81,17 @@ export function Themes() {
primaryColor: '#222222',
accentColor: '#5c5c5c',
borderColor: '#5c5c5c',
randomEnabled: 0,
randomEnabled: 1,
textShadowsEnabled: 0,
appShadowsEnabled: 0,
});
};
const handleNewTheme = () => {
setIsNew(true);
openThemeModal();
};
const handleSaveTheme = () => {
mutateAsync({
method: selectedTheme?.id === undefined ? 'POST' : 'PATCH',
@@ -147,6 +154,9 @@ export function Themes() {
pickerOpen={pickerOpen}
closePicker={closePicker}
handleSaveTheme={handleSaveTheme}
isNew={isNew}
setIsNew={setIsNew}
allThemes={allThemes}
/>
<BackgroundModal
backgroundModalOpened={backgroundModalOpened}
@@ -156,7 +166,7 @@ export function Themes() {
/>
<SettingsHeader
setDragging={undefined}
openModal={openThemeModal}
openModal={handleNewTheme}
title={'Themes'}
tooltip={{
title: 'Themes can be created here and applied to the homepage.',