interstellar_ai/app/components/settings/PrivacySettings.tsx

// PrivacySettings.tsx
import React from 'react';

interface PrivacySettingsProps {
  selectedOption: string; // The currently selected option
  handleRadioChange: (option: string) => void; // Function to handle option changes
  openSourceMode: boolean; // Boolean to check if the mode is open source
}

const PrivacySettings: React.FC<PrivacySettingsProps> = ({ selectedOption, handleRadioChange, openSourceMode }) => {
  return (
    <>
      {/* AI Mode Radio Options */}
      <div className="settings-option">
        <p>Disable Options:</p>
        <div className="slider">
          {/* Offline */}
          <div
            className={`slider-option ${selectedOption === 'Offline' ? 'active' : ''}`}
            onClick={() => handleRadioChange('Offline')} // Allow selection only if not in open-source mode
          >
            Offline tools{openSourceMode ? ' (FOSS)' : ''}
          </div>

          {/* Online */}
          <div
            className={`slider-option ${selectedOption === 'Online' ? 'active' : ''}`}
            onClick={() => handleRadioChange('Online')}
          >
            Online tools{openSourceMode ? ' (FOSS)' : ''}
          </div>

          {/* None */}
          <div
            className={`slider-option ${selectedOption === 'None' ? 'active' : ''}`}
            onClick={() => handleRadioChange('None')}
          >
            None{openSourceMode ? ' (FOSS)' : ''}
          </div>
        </div>
        <br />
      </div>
    </>
  );
};

export default PrivacySettings;