diff --git a/src/App.tsx b/src/App.tsx index 4567499..6a840e0 100644 --- a/src/App.tsx +++ b/src/App.tsx @@ -1,16 +1,55 @@ -import React from 'react'; +import React, {useState} from 'react'; +// eslint-disable-next-line @typescript-eslint/no-unused-vars import logo from './logo.svg'; import baselhack from './assests/images/logohack.png'; import './App.css'; +import Language from './components/Language'; +import Difficulty from './components/Difficulty'; +import Questions from './components/Questions'; + const App: React.FunctionComponent = () => { + const [selectedLanguage, setSelectedLanguage] = useState(null); + const [selectedDifficulty, setSelectedDifficulty] = useState( + null + ); + const [apiUrl, setApiUrl] = useState(null); + + const handleLanguageSelect = (language: string) => { + setSelectedLanguage(language); + }; + + const handleDifficultySelect = (difficulty: string) => { + setSelectedDifficulty(difficulty); + + // difficulty lvl depending on users choice + if (difficulty === 'Beginner') { + setApiUrl('http://localhost:3000/expert.json'); + } else if (difficulty === 'Advanced') { + setApiUrl('http://localhost:3000/advanced.json'); + } else if (difficulty === 'Expert') { + setApiUrl('https://www.api.org/sda125'); + } + }; return (
Logo HackBasel
Certifever help
- +
+ {!selectedLanguage ? ( + + ) : !selectedDifficulty ? ( + + ) : apiUrl ? ( + + ) : ( +
+

Uploading...

+
+ )} +

Welcome to Certifever