diff --git a/staff/marti-herms/project/V-HUB/api/index.js b/staff/marti-herms/project/V-HUB/api/index.js index 696d614a7..b0ae8b135 100644 --- a/staff/marti-herms/project/V-HUB/api/index.js +++ b/staff/marti-herms/project/V-HUB/api/index.js @@ -24,7 +24,7 @@ mongoose.connect(process.env.MONGODB_URI) api.post('/games', jwtVerifier, jsonBodyParser, handle.registerGame) - api.post('/games/search', jwtVerifier, handle.searchGame) + api.get('/games/search', jwtVerifier, handle.searchGame) api.use(errorHandler) diff --git a/staff/marti-herms/project/V-HUB/app/src/home/Game.jsx b/staff/marti-herms/project/V-HUB/app/src/home/Game.jsx new file mode 100644 index 000000000..9c6db2861 --- /dev/null +++ b/staff/marti-herms/project/V-HUB/app/src/home/Game.jsx @@ -0,0 +1,27 @@ +import Container from '../library/Container' +import Image from '../library/Image' +import Paragraph from '../library/Paragraph' + +export default function Game({ game }) { + const handleGameClick = () => { + window.location.href = game.link + } + + return
+ + + + + +
+} \ No newline at end of file diff --git a/staff/marti-herms/project/V-HUB/app/src/home/GameRegister.jsx b/staff/marti-herms/project/V-HUB/app/src/home/GameRegister.jsx index f3748ebfd..6ae6b2d9e 100644 --- a/staff/marti-herms/project/V-HUB/app/src/home/GameRegister.jsx +++ b/staff/marti-herms/project/V-HUB/app/src/home/GameRegister.jsx @@ -1,4 +1,3 @@ -import Logo from '../library/Logo' import Container from '../library/Container' import Form from '../library/Form' import Input from '../library/Input' @@ -37,8 +36,7 @@ export default function GameRegister({ onGameRegister }) { return <> - -
+ diff --git a/staff/marti-herms/project/V-HUB/app/src/home/GameSearch.jsx b/staff/marti-herms/project/V-HUB/app/src/home/GameSearch.jsx index 95626a70d..4e25ff7af 100644 --- a/staff/marti-herms/project/V-HUB/app/src/home/GameSearch.jsx +++ b/staff/marti-herms/project/V-HUB/app/src/home/GameSearch.jsx @@ -5,7 +5,7 @@ import Form from '../library/Form' import Input from '../library/Input' import Button from '../library/Button' -export default function GameSearch() { +export default function GameSearch({ onChange }) { const navigate = useNavigate() const location = useLocation() const [searchParams, setSearchParams] = useSearchParams() @@ -38,9 +38,11 @@ export default function GameSearch() { const { value: query } = event.target setQuery(query) + + onChange() } - return + return
diff --git a/staff/marti-herms/project/V-HUB/app/src/home/GameSearchResults.jsx b/staff/marti-herms/project/V-HUB/app/src/home/GameSearchResults.jsx new file mode 100644 index 000000000..4c7ed0dfa --- /dev/null +++ b/staff/marti-herms/project/V-HUB/app/src/home/GameSearchResults.jsx @@ -0,0 +1,48 @@ +import { useState, useEffect } from 'react' +import { useSearchParams } from 'react-router-dom' + +import logic from '../../logic' +import Game from './Game' + +export default function GameSearchResults({ refreshStamp }) { + const [searchParams] = useSearchParams() + + const q = searchParams.get('q') || '' + + const [games, setGames] = useState([]) + + useEffect(() => { + loadGames() + }, [refreshStamp, q]) + + const loadGames = () => { + try { + logic.searchGame(q) + .then(games => setGames(games)) + .catch(error => { + console.error(error) + + alert(error.message) + }) + } catch { + console.error(error) + + alert(error.message) + } + } + + const maxView = 5 + + let count = 0 + + return
+ {games.map(game => { + count++ + + if (count <= maxView) + return + + return + })} +
+} diff --git a/staff/marti-herms/project/V-HUB/app/src/home/index.jsx b/staff/marti-herms/project/V-HUB/app/src/home/index.jsx index bd483720e..7f97a7701 100644 --- a/staff/marti-herms/project/V-HUB/app/src/home/index.jsx +++ b/staff/marti-herms/project/V-HUB/app/src/home/index.jsx @@ -6,9 +6,11 @@ import Library from './Library' import Footer from './Footer' import GameRegister from './GameRegister' import GameSearch from './GameSearch' +import GameSearchResults from './GameSearchResults' export default function Home({ onLogout }) { const [path, setPath] = useState('/') + const [refreshStamp, setRefreshStamp] = useState(null) const navigate = useNavigate() @@ -17,6 +19,7 @@ export default function Home({ onLogout }) { }, [path]) const handleHomeClick = () => { + setRefreshStamp(Date.now()) setPath('/') } @@ -25,9 +28,14 @@ export default function Home({ onLogout }) { } const handleSearchGameClick = () => { + setRefreshStamp(Date.now()) setPath('/games/search') } + const handleInputChange = () => { + setRefreshStamp(Date.now()) + } + const handleRegisterGame = (gameId) => { setPath(`/games/${gameId}`) } @@ -39,7 +47,7 @@ export default function Home({ onLogout }) { Hello World

} /> } /> - } /> + } />
diff --git a/staff/marti-herms/project/V-HUB/app/src/library/Image.jsx b/staff/marti-herms/project/V-HUB/app/src/library/Image.jsx new file mode 100644 index 000000000..6ec40b953 --- /dev/null +++ b/staff/marti-herms/project/V-HUB/app/src/library/Image.jsx @@ -0,0 +1,3 @@ +export default function Image(props) { + return +} \ No newline at end of file diff --git a/staff/marti-herms/project/V-HUB/core/logic/index.js b/staff/marti-herms/project/V-HUB/core/logic/index.js index 82cc6c6c7..695d78c9d 100644 --- a/staff/marti-herms/project/V-HUB/core/logic/index.js +++ b/staff/marti-herms/project/V-HUB/core/logic/index.js @@ -2,12 +2,14 @@ import authenticateUser from './authenticateUser.js' import registerUser from './registerUser.js' import getUserUsername from './getUserUsername.js' import registerGame from './registerGame.js' +import searchGame from './searchGame.js' const logic = { authenticateUser, registerUser, getUserUsername, - registerGame + registerGame, + searchGame } export default logic \ No newline at end of file