Updating paths

src/App.tsx

@@ -6,6 +6,7 @@ import {
 	mergeMantineTheme,
 } from '@mantine/core';
 import { Notifications } from '@mantine/notifications';
+import { Loading, MainLayout } from 'components';
 import { useCommonHooks, useQueryAPI } from 'hooks';
 import { useEffect, useState } from 'react';
 import {
@@ -15,7 +16,6 @@ import {
 	Route,
 	RouterProvider,
 } from 'react-router-dom';
-import { Loading, MainLayout } from './components';
 import '@mantine/core/styles.css';
 import '@mantine/dates/styles.css';
 import '@mantine/notifications/styles.css';

src/components/MainLayout.tsx

@@ -12,7 +12,7 @@ export function MainLayout() {
 				'--image-background':
 					theme.backgroundImage.toLocaleLowerCase() === 'none'
 						? undefined
-						: `linear-gradient(${theme.backgroundColor}33, ${theme.backgroundColor}33), url(../../api/backgroundImages/${theme.backgroundImage})`,
+						: `linear-gradient(${theme.backgroundColor}33, ${theme.backgroundColor}33), url(../../trigger/api/backgroundImages/${theme.backgroundImage})`,
 			}}
 		>
 			<Outlet />

src/pages/settings/components/Theming/Backgrounds/BackgroundModal.tsx

@@ -248,7 +248,7 @@ export function BackgroundModal({
 														style={{
 															aspectRatio: '16/9',
 															width: '100%',
-															backgroundImage: `url(../../api/backgroundImages/thumbs/${background})`,
+															backgroundImage: `url(../../trigger/api/backgroundImages/thumbs/${background})`,
 															backgroundSize: 'cover',
 															backgroundPosition: 'center',
 															backgroundRepeat: 'no-repeat',

src/pages/settings/components/Theming/Backgrounds/components/BackgroundLightbox.tsx

@@ -36,7 +36,7 @@ export function BackgroundLightbox({
 					<Image
 						style={{ cursor: 'zoom-out' }}
 						onClick={close}
-						src={`../../api/backgroundImages/${background}`}
+						src={`../../trigger/api/backgroundImages/${background}`}
 					/>
 				</Modal.Body>
 			</Modal.Content>

src/pages/settings/components/Theming/Backgrounds/components/DeleteBackground.tsx

@@ -41,7 +41,7 @@ export function DeleteBackground({
 				style={{
 					aspectRatio: '16/9',
 					height: '100%',
-					backgroundImage: `url(../../api/backgroundImages/thumbs/${fileName})`,
+					backgroundImage: `url(../../trigger/api/backgroundImages/thumbs/${fileName})`,
 					backgroundSize: 'cover',
 					backgroundPosition: 'center',
 					backgroundRepeat: 'no-repeat',

src/pages/settings/components/Theming/Backgrounds/components/EditBackground.tsx

@@ -49,7 +49,7 @@ export function EditBackground({
 							: undefined
 					}
 				/>
-				<Image src={`../../api/backgroundImages/thumbs/${fileName}`} />
+				<Image src={`../../trigger/api/backgroundImages/thumbs/${fileName}`} />
 			</Stack>
 			<Group>
 				<Button

src/pages/settings/components/Theming/ThemePlaylists/components/ThemeSelect.tsx

@@ -62,7 +62,7 @@ export function ThemeSelect({
 						backgroundImage:
 							theme?.backgroundImage.toLocaleLowerCase() === 'none'
 								? undefined
-								: `linear-gradient(${theme?.backgroundColor}33, ${theme?.backgroundColor}33), url(../../api/backgroundImages/thumbs/${theme?.backgroundImage})`,
+								: `linear-gradient(${theme?.backgroundColor}33, ${theme?.backgroundColor}33), url(../../trigger/api/backgroundImages/thumbs/${theme?.backgroundImage})`,
 						backgroundSize:
 							theme?.backgroundImage.toLocaleLowerCase() === 'none' ? undefined : 'cover',
 						backgroundColor:
@@ -89,7 +89,7 @@ export function ThemeSelect({
 								backgroundImage:
 									theme?.backgroundImage.toLocaleLowerCase() === 'none'
 										? undefined
-										: `linear-gradient(${theme?.backgroundColor}33, ${theme?.backgroundColor}33), url(../../api/backgroundImages/thumbs/${theme?.backgroundImage})`,
+										: `linear-gradient(${theme?.backgroundColor}33, ${theme?.backgroundColor}33), url(../../trigger/api/backgroundImages/thumbs/${theme?.backgroundImage})`,
 								backgroundSize:
 									theme?.backgroundImage.toLocaleLowerCase() === 'none'
 										? undefined

src/pages/settings/components/Theming/Themes/ThemeCard/ThemeCard.tsx

@@ -114,7 +114,7 @@ export function ThemeCard({
 					backgroundImage:
 						cardTheme?.backgroundImage.toLocaleLowerCase() === 'none'
 							? undefined
-							: `linear-gradient(${cardTheme?.backgroundColor}33, ${cardTheme?.backgroundColor}33), url(../../api/backgroundImages/thumbs/${cardTheme?.backgroundImage})`,
+							: `linear-gradient(${cardTheme?.backgroundColor}33, ${cardTheme?.backgroundColor}33), url(../../trigger/api/backgroundImages/thumbs/${cardTheme?.backgroundImage})`,
 					backgroundSize:
 						cardTheme?.backgroundImage.toLocaleLowerCase() === 'none'
 							? undefined

src/pages/settings/components/Theming/Themes/ThemeMiniCard.tsx

@@ -15,7 +15,7 @@ export function ThemeMiniCard({ miniTheme }: { miniTheme: Theme | undefined }) {
 				backgroundImage:
 					miniTheme?.backgroundImage.toLocaleLowerCase() === 'none'
 						? undefined
-						: `linear-gradient(${miniTheme?.backgroundColor}33, ${miniTheme?.backgroundColor}33), url(../../api/backgroundImages/thumbs/${miniTheme?.backgroundImage})`,
+						: `linear-gradient(${miniTheme?.backgroundColor}33, ${miniTheme?.backgroundColor}33), url(../../trigger/api/backgroundImages/thumbs/${miniTheme?.backgroundImage})`,
 				backgroundSize:
 					miniTheme?.backgroundImage.toLocaleLowerCase() === 'none' ? undefined : 'cover',
 				backgroundColor:

src/pages/settings/components/Theming/Themes/ThemeModal/components/BackgroundItem.tsx

@@ -24,8 +24,8 @@ export default function BackgroundItem({
 				background:
 					item !== 'none' && item !== 'None'
 						? index === hovered
-							? `linear-gradient(${designerTheme.backgroundColor}88, ${designerTheme.backgroundColor}88), no-repeat center url(../../api/backgroundImages/thumbs/${item})`
+							? `linear-gradient(${designerTheme.backgroundColor}88, ${designerTheme.backgroundColor}88), no-repeat center url(../../trigger/api/backgroundImages/thumbs/${item})`
-							: `no-repeat center url(../../api/backgroundImages/thumbs/${item})`
+							: `no-repeat center url(../../trigger/api/backgroundImages/thumbs/${item})`
 						: 'repeating-linear-gradient(45deg, #33333366, #33333366 10px, #88888866 10px, #88888866 20px)',
 				backgroundSize: item === 'none' ? undefined : 'cover',
 				backgroundColor: item === 'none' ? '#00000088' : undefined,

src/pages/settings/components/Theming/Themes/ThemeModal/components/ThemeChanges.tsx

@@ -171,7 +171,7 @@ export default function ThemeChanges({
 																defaultTheme[key as keyof Theme] as string
 															).toLocaleLowerCase() === 'none'
 																? 'https://placehold.co/540x360?text=None'
-																: `../../api/backgroundImages/thumbs/${defaultTheme[key as keyof Theme] as string}`
+																: `../../trigger/api/backgroundImages/thumbs/${defaultTheme[key as keyof Theme] as string}`
 														}
 													/>
 													<Text>→</Text>
@@ -182,7 +182,7 @@ export default function ThemeChanges({
 																designerTheme[key as keyof Theme] as string
 															).toLocaleLowerCase() === 'none'
 																? 'https://placehold.co/540x360?text=None'
-																: `../../api/backgroundImages/thumbs/${designerTheme[key as keyof Theme] as string}`
+																: `../../trigger/api/backgroundImages/thumbs/${designerTheme[key as keyof Theme] as string}`
 														}
 													/>
 												</>

src/pages/settings/components/Theming/Themes/ThemeModal/components/ThemeModalContent.tsx

@@ -12,7 +12,7 @@ export function ThemeModalContent({ selectedTheme }: { selectedTheme: Theme }) {
 				backgroundImage:
 					selectedTheme?.backgroundImage.toLocaleLowerCase() === 'none'
 						? undefined
-						: `linear-gradient(${selectedTheme?.backgroundColor}33, ${selectedTheme?.backgroundColor}33), url(../../api/backgroundImages/thumbs/${selectedTheme?.backgroundImage})`,
+						: `linear-gradient(${selectedTheme?.backgroundColor}33, ${selectedTheme?.backgroundColor}33), url(../../trigger/api/backgroundImages/thumbs/${selectedTheme?.backgroundImage})`,
 				backgroundSize:
 					selectedTheme?.backgroundImage.toLocaleLowerCase() === 'none'
 						? undefined

tsconfig.json

@@ -2,16 +2,18 @@
 	"compilerOptions": {
 		"target": "ES2020",
 		"useDefineForClassFields": true,
-		"module": "nodenext",
+		"module": "ESNext",
 		"skipLibCheck": true,
+		"baseUrl": "./src",
 		"rootDir": "./src",
 		"allowJs": false,
+		"esModuleInterop": false,
 		"lib": ["ESNext", "DOM"],
 		"allowSyntheticDefaultImports": true,
 		"types": ["vite/client", "vitest"],
 
 		/* Bundler mode */
-		"moduleResolution": "nodenext",
+		"moduleResolution": "node",
 		"allowImportingTsExtensions": true,
 		"resolveJsonModule": true,
 		"isolatedModules": true,

vite.config.ts

@@ -56,7 +56,7 @@ export default defineConfig(({ mode }) => {
 			port: 3000,
 			host: '0.0.0.0',
 			proxy: {
-				'/api': {
+				api: {
 					target: `${env.VITE_DOMAIN_DEV}/${env.VITE_BASE_URL}`,
 					changeOrigin: false,
 					secure: false,
@@ -68,7 +68,7 @@ export default defineConfig(({ mode }) => {
 			host: '0.0.0.0',
 			proxy: {
 				api: {
-					target: `${env.VITE_DOMAIN_DEV}`,
+					target: `${env.VITE_DOMAIN_DEV}/${env.VITE_BASE_URL}`,
 					changeOrigin: false,
 					secure: false,
 				},