interstellar_ai/app/components/settings/TextSettings.tsx

28 lines
899 B
TypeScript

import React from 'react';
interface TextSettingProps {
label: string; // The label to display
value: string; // The current text value
setValue: (newText: string) => void; // The method to update the state
type: 'text' | 'email' | 'password'; // The type of input field
}
const TextSetting: React.FC<TextSettingProps> = ({ label, value, setValue, type }) => {
const handleTextChange = (e: React.ChangeEvent<HTMLInputElement>) => {
const newText = e.target.value; // Get the new value from the input
setValue(newText); // Update the state in the parent component
};
return (
<div className="settings-option">
<label>{label}</label>
<input
type={type} // Use the type prop for the input
value={value} // Set the current value
onChange={handleTextChange} // Handle input changes
/>
</div>
);
};
export default TextSetting;