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

Setting radioSelection

Browse source
This commit is contained in:
sageTheDM 2024-10-03 16:11:53 +02:00
parent ca45d48015
commit 6435d5f4e4
2 changed files with 26 additions and 39 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

60
app/components/settings/PrivacySettings.tsx
View file

@ -11,50 +11,38 @@ const PrivacySettings: React.FC<PrivacySettingsProps> = ({ selectedOption, handl
// Set default option based on openSourceMode if no option is selected // Set default option based on openSourceMode if no option is selected
useEffect(() => { useEffect(() => {
if (!selectedOption) { if (!selectedOption) {
handleRadioChange(openSourceMode ? 'Offline' : 'None'); handleRadioChange(openSourceMode ? 'Offline (FOSS)' : 'None');
} }
}, [selectedOption, handleRadioChange, openSourceMode]); }, [selectedOption, handleRadioChange, openSourceMode]);
// Handle option click, allowing all options even in open-source mode // Define your options
const handleOptionClick = (option: string) => { const options = [
handleRadioChange(option); // No restrictions on options { value: 'Online', label: 'Online' },
}; { value: 'Offline', label: 'Offline' },
{ value: 'None', label: 'None' },
{ value: 'Offline (FOSS)', label: 'Offline (FOSS)' },
{ value: 'Online (FOSS)', label: 'Online (FOSS)' },
{ value: 'None (FOSS)', label: 'None (FOSS)' },
];
return ( return (
<>
{/* AI Mode Radio Options */}
<div className="settings-option"> <div className="settings-option">
<p>{openSourceMode ? 'Disable Options (FOSS Mode):' : 'Disable Options:'}</p> <p>Select Privacy Mode:</p>
<div className="slider"> {options.map((option) => (
{/* Offline */} <div key={option.value}>
<div <label>
className={`slider-option ${selectedOption === 'Offline' ? 'active' : ''}`} <input
onClick={() => handleOptionClick('Offline')} type="radio"
style={{ pointerEvents: (openSourceMode && selectedOption !== 'Offline') ? 'none' : 'auto', opacity: (openSourceMode && selectedOption !== 'Offline') ? 0.5 : 1 }} value={option.value}
> checked={selectedOption === option.value}
Offline tools{openSourceMode ? ' (FOSS)' : ''} onChange={() => handleRadioChange(option.value)}
disabled={openSourceMode && !option.label.includes('(FOSS)') && selectedOption !== option.value} // Disable non-FOSS options if FOSS is selected
/>
{option.label}
</label>
</div> </div>
))}
{/* Online (Available even in FOSS mode) */}
<div
className={`slider-option ${selectedOption === 'Online' ? 'active' : ''}`}
onClick={() => handleOptionClick('Online')}
>
Online tools{openSourceMode ? ' (FOSS)' : ''}
</div> </div>
{/* None */}
<div
className={`slider-option ${selectedOption === 'None' ? 'active' : ''}`}
onClick={() => handleOptionClick('None')}
style={{ pointerEvents: (openSourceMode && selectedOption !== 'None') ? 'none' : 'auto', opacity: (openSourceMode && selectedOption !== 'None') ? 0.5 : 1 }}
>
None{openSourceMode ? ' (FOSS)' : ''}
</div>
</div>
<br />
</div>
</>
); );
}; };

1
app/components/settings/Settings.tsx
View file

@ -458,7 +458,6 @@ const Settings: React.FC<{ closeSettings: () => void; accountName: string }> = (
return ( return (
<div className="settings-section"> <div className="settings-section">
<h2>Privacy Settings</h2> <h2>Privacy Settings</h2>
<PrivacySettings <PrivacySettings
selectedOption={selectedOption} selectedOption={selectedOption}
handleRadioChange={handleRadioChange} handleRadioChange={handleRadioChange}