fix

src/components/micro_learning/MicroLearningContainer.jsx

@@ -1,4 +1,5 @@
 import React, { useState } from 'react';
+import { useNavigate } from 'react-router-dom';
 import ConceptExplainer from './ConceptExplainer';
 import ScenarioQuiz from './ScenarioQuiz';
 import FlashcardSet from './FlashcardSet';
@@ -8,6 +9,7 @@ import { useMicroLearningCompletions } from '../../hooks/useMicroLearningComplet
 export default function MicroLearningContainer({ microLearning, sessionWeek, onCompletedSuccessfully }) {
   const { recordCompletion } = useMicroLearningCompletions();
   const [completed, setCompleted] = useState(false);
+  const navigate = useNavigate();
 
   const handleComplete = async () => {
     if (completed) return; // Prevent double recording
@@ -52,9 +54,17 @@ export default function MicroLearningContainer({ microLearning, sessionWeek, onC
       {renderComponent()}
       
       {completed && (
-        <div className="mt-4 p-4 bg-green-50 text-green-800 border border-green-200 rounded-md text-center">
-          <p className="font-semibold">Micro Learning Completed!</p>
-          <p className="text-sm mt-1">Your progress has been recorded.</p>
+        <div className="mt-4 p-4 bg-green-50 text-green-800 border border-green-200 rounded-md text-center flex flex-col items-center">
+          <div>
+            <p className="font-semibold">Micro Learning Completed!</p>
+            <p className="text-sm mt-1 mb-4">Your progress has been recorded.</p>
+          </div>
+          <button
+            onClick={() => navigate('/test')}
+            className="px-4 py-2 bg-teal text-white rounded-md font-medium hover:bg-teal-dark transition-colors"
+          >
+            Start Test for this Week
+          </button>
         </div>
       )}
     </div>