import React from 'react';

//styles
import s from './ProfileInfoModal.module.scss';
import Button from '@/components/Button/Button';

interface ProfileInfoModalProps {
  enumValue: string;
  editableValue: string;
  setEditableValue: (value: string) => void;
  onSave: () => void;
}

// ProfileInfoModal.tsx
const ProfileInfoModal: React.FC<ProfileInfoModalProps> = ({
  enumValue,
  editableValue,
  setEditableValue,
  onSave,
}) => {
  const handleInputChange = (e: React.ChangeEvent<HTMLInputElement>) => {
    setEditableValue(e.target.value);
  };

  return (
    <div className={s.modalContent}>
      <h3>{enumValue}</h3>
      <input type="text" value={editableValue} onChange={handleInputChange} />
      <Button variant="secondary" onClick={onSave}>
        Save
      </Button>
      {/* ... other modal content */}
    </div>
  );
};

export default ProfileInfoModal;