sageTheDm/interstellar_ai
1
0
Fork 0
forked from React-Group/interstellar_ai
Code Pull requests Activity

DropDownTheme comments

Browse source
This commit is contained in:
sageTheDM 2024-10-11 09:30:03 +02:00
parent 2c867fcc3c
commit c672bf1e35
1 changed files with 13 additions and 12 deletions
Download patch file Download diff file Expand all files Collapse all files

25
app/components/settings/DropDownTheme.tsx
View file

@ -2,9 +2,10 @@
import React from 'react';
const ThemeDropdown: React.FC<{
selectedTheme: string;
setSelectedTheme: (theme: string) => void;
selectedTheme: string; // Currently selected theme
setSelectedTheme: (theme: string) => void; // Function to update the selected theme
}> = ({ selectedTheme, setSelectedTheme }) => {
// Define available theme options
const themeOptions = [
{ value: 'IOMARKET', label: 'IOMARKET' },
{ value: 'WHITE', label: 'WHITE' },
@ -14,22 +15,22 @@ const ThemeDropdown: React.FC<{
];
return (
<div className="settings-option">
<p>Select Theme</p>
<div className="settings-option"> {/* Container for the dropdown */}
<p>Select Theme</p> {/* Label for the dropdown */}
<select
value={selectedTheme}
onChange={(e) => {
const theme = e.target.value;
value={selectedTheme} // Current selected theme
onChange={(e) => { // Handler for dropdown changes
const theme = e.target.value; // Get the selected value
if (theme !== 'default' && typeof localStorage !== 'undefined') {
setSelectedTheme(theme);
localStorage.setItem('selectedTheme', theme);
setSelectedTheme(theme); // Update the selected theme state
localStorage.setItem('selectedTheme', theme); // Save the theme to localStorage
}
}}
>
<option value="default">Select your style...</option>
{themeOptions.map((option) => (
<option value="default">Select your style...</option> {/* Default option */}
{themeOptions.map((option) => ( // Map through theme options to create <option> elements
<option key={option.value} value={option.value}>
{option.label}
{option.label} {/* Display the label for the option */}
</option>
))}
</select>