From 15ef151fb800bcad99fd8f5deca0e35b5ad94dd2 Mon Sep 17 00:00:00 2001
From: lina elman <lina.elman7@gmail.com>
Date: Sun, 25 May 2025 22:24:11 +0300
Subject: [PATCH 1/3] Added integration of jobs to quizzes

---
 .../src/components/LinkedInIntegration.tsx    | 31 ++++++++++++++-----
 nextstep-frontend/src/pages/Quiz.tsx          | 18 +++++++++--
 2 files changed, 39 insertions(+), 10 deletions(-)

diff --git a/nextstep-frontend/src/components/LinkedInIntegration.tsx b/nextstep-frontend/src/components/LinkedInIntegration.tsx
index a5e0929..56f30d2 100644
--- a/nextstep-frontend/src/components/LinkedInIntegration.tsx
+++ b/nextstep-frontend/src/components/LinkedInIntegration.tsx
@@ -1,6 +1,7 @@
 import React, { useState } from 'react';
 import { Box, Typography, Button, Grid, CircularProgress, IconButton, TextField, MenuItem, Select, FormControl, InputLabel, Dialog, DialogTitle, DialogContent, DialogActions, Chip, Stack } from '@mui/material';
 import { ExpandLess, LinkedIn, Settings } from '@mui/icons-material';
+import { useNavigate } from 'react-router-dom';
 
 interface Job {
   position: string;
@@ -68,6 +69,12 @@ const LinkedInIntegration: React.FC<LinkedInIntegrationProps> = ({
     setJobDetails(null);
   };
 
+  const handleGenerateQuiz = (job: Job) => {
+    const subject = `${job.position} at ${job.company}`;
+    const quizUrl = `/quiz?subject=${encodeURIComponent(subject)}`;
+    window.open(quizUrl, '_blank');
+  };
+
   return (
     <Box sx={{ bgcolor: 'background.paper', p: 3, borderRadius: 2, boxShadow: 1, mt: 4 }}>
       <Box sx={{ display: 'flex', justifyContent: 'space-between', alignItems: 'center', mb: 2 }}>
@@ -281,14 +288,22 @@ const LinkedInIntegration: React.FC<LinkedInIntegrationProps> = ({
                 Close
               </Button>
               {selectedJob?.jobUrl && (
-                <Button
-                  href={selectedJob.jobUrl}
-                  target="_blank"
-                  rel="noopener noreferrer"
-                  color="primary"
-                >
-                  Open in LinkedIn
-                </Button>
+                <div>
+                  <Button
+                    onClick={() => handleGenerateQuiz(selectedJob)}
+                    color="primary"
+                  >
+                    Generate a quiz
+                  </Button>
+                  <Button
+                    href={selectedJob.jobUrl}
+                    target="_blank"
+                    rel="noopener noreferrer"
+                    color="primary"
+                  >
+                    Open in LinkedIn
+                  </Button>
+                </div>
               )}
             </DialogActions>
           </Dialog>
diff --git a/nextstep-frontend/src/pages/Quiz.tsx b/nextstep-frontend/src/pages/Quiz.tsx
index be0029b..c68af5e 100644
--- a/nextstep-frontend/src/pages/Quiz.tsx
+++ b/nextstep-frontend/src/pages/Quiz.tsx
@@ -1,4 +1,5 @@
 import React, { useState } from 'react';
+import { useSearchParams } from 'react-router-dom';
 import {
   Container,
   Box,
@@ -102,7 +103,8 @@ interface QuizState {
 }
 
 const Quiz: React.FC = () => {
-  const [subject, setSubject] = useState<string>('');
+  const [searchParams] = useSearchParams();
+  const [subject, setSubject] = useState<string>(searchParams.get('subject') || '');
   const [quiz, setQuiz] = useState<QuizState | null>(null);
   const [loading, setLoading] = useState<boolean>(false);
   const [showAnswer, setShowAnswer] = useState<{ [key: number]: boolean }>({});
@@ -218,6 +220,11 @@ const Quiz: React.FC = () => {
     }
   };
 
+  const handleEditSubject = (newSubject: string) => {
+    setSubject(newSubject);
+    setQuiz(null); // Reset the quiz to allow generating a new one with the updated subject
+  };
+
   return (
     <Container maxWidth="md" sx={{ py: 4 }}>
       <Typography variant="h4" component="h1" gutterBottom align="center">
@@ -254,7 +261,14 @@ const Quiz: React.FC = () => {
       {quiz && (
         <Box sx={{ p: 3, bgcolor: 'background.paper', borderRadius: 2, boxShadow: 1 }}>
           <Typography variant="h5" gutterBottom align="center" sx={{ mb: 3 }}>
-            Quiz on: {quiz.subject}
+            Quiz on: 
+            <TextField
+              value={subject}
+              onChange={(e) => handleEditSubject(e.target.value)}
+              variant="outlined"
+              size="small"
+              sx={{ ml: 2, width: '50%' }}
+            />
           </Typography>
 
           {/* --- Enhanced Display of Quiz Metadata --- */}

From 4ab2d59981a61d633ab18f3b27d9ebb3cde24437 Mon Sep 17 00:00:00 2001
From: lina elman <lina.elman7@gmail.com>
Date: Sun, 25 May 2025 22:25:55 +0300
Subject: [PATCH 2/3] removed unnecessary

---
 nextstep-frontend/src/components/LinkedInIntegration.tsx | 1 -
 1 file changed, 1 deletion(-)

diff --git a/nextstep-frontend/src/components/LinkedInIntegration.tsx b/nextstep-frontend/src/components/LinkedInIntegration.tsx
index 56f30d2..c13e7d5 100644
--- a/nextstep-frontend/src/components/LinkedInIntegration.tsx
+++ b/nextstep-frontend/src/components/LinkedInIntegration.tsx
@@ -1,7 +1,6 @@
 import React, { useState } from 'react';
 import { Box, Typography, Button, Grid, CircularProgress, IconButton, TextField, MenuItem, Select, FormControl, InputLabel, Dialog, DialogTitle, DialogContent, DialogActions, Chip, Stack } from '@mui/material';
 import { ExpandLess, LinkedIn, Settings } from '@mui/icons-material';
-import { useNavigate } from 'react-router-dom';
 
 interface Job {
   position: string;

From 41d2330d286cda105ce92fc22b3af470445ff5dc Mon Sep 17 00:00:00 2001
From: lina elman <lina.elman7@gmail.com>
Date: Sun, 25 May 2025 22:38:47 +0300
Subject: [PATCH 3/3] added icon

---
 nextstep-frontend/src/pages/Quiz.tsx | 19 +++++++++++++++++--
 1 file changed, 17 insertions(+), 2 deletions(-)

diff --git a/nextstep-frontend/src/pages/Quiz.tsx b/nextstep-frontend/src/pages/Quiz.tsx
index c68af5e..6847b32 100644
--- a/nextstep-frontend/src/pages/Quiz.tsx
+++ b/nextstep-frontend/src/pages/Quiz.tsx
@@ -27,6 +27,7 @@ import {
   BusinessOutlined as BusinessOutlinedIcon,
   LocalOfferOutlined as LocalOfferOutlinedIcon,
 } from '@mui/icons-material';
+import SchoolIcon from '@mui/icons-material/School'; // Import graduation hat icon
 import api from '../serverApi';
 import { config } from '../config';
 
@@ -227,8 +228,22 @@ const Quiz: React.FC = () => {
 
   return (
     <Container maxWidth="md" sx={{ py: 4 }}>
-      <Typography variant="h4" component="h1" gutterBottom align="center">
-        Quiz Generator & Grader
+      <Typography variant="h4" component="h1" gutterBottom align="center" sx={{ position: 'relative' }}>
+        Quiz Generator &{' '}
+        <Box sx={{ display: 'inline-block', position: 'relative' }}>
+          <SchoolIcon
+            sx={{
+              position: 'absolute',
+              top: '-10px',
+              left: '110%',
+              size: 'large',
+              transform: 'translateX(-50%) rotate(30deg)',
+              fontSize: 30,
+              color: 'primary.main',
+            }}
+          />
+          Grader
+        </Box>
       </Typography>
 
       {/* Subject Input */}