Function QuestionForm

client/src/component/DiscussionForum.jsx:142–171

()

    // Function to render the Question Form
    const QuestionForm = () => {
        const [newQuestion, setNewQuestion] = useState('');

        const handleSubmit = (e) => {
            e.preventDefault();
            if (newQuestion.trim()) {
                addQuestion(newQuestion);
                setNewQuestion('');
            }
        };

        return (
            <div className={`p-6 rounded-lg shadow-lg mb-8 ${props.mode === 'dark' ? 'bg-gray-800 text-white' : 'bg-white text-gray-800'}`}>
                <textarea
                    value={newQuestion}
                    onChange={(e) => setNewQuestion(e.target.value)}
                    placeholder="Ask your question..."
                    className={`w-full p-4 border rounded-md ${props.mode === 'dark' ? 'bg-gray-900 text-white' : 'bg-gray-100 text-gray-800'
                        } focus:outline-none focus:ring-2 ${props.mode === 'dark' ? 'focus:ring-gray-400' : 'focus:ring-gray-500'} transition-all`}
                />
                <button
                    onClick={handleSubmit}
                    className={`mt-4 px-6 py-2 rounded-md ${props.mode === 'dark' ? 'bg-gray-600 text-white hover:bg-gray-500' : 'bg-gray-800 text-white hover:bg-gray-600'
                        } focus:outline-none focus:ring-2 ${props.mode === 'dark' ? 'focus:ring-gray-400' : 'focus:ring-gray-500'} transition-colors`}
                >
                    Ask Question
                </button>
            </div>
        );
    };

    return (
        <div className="container mx-auto px-6 py-8 mt-20">