404 page

index.js

@@ -90,6 +90,7 @@ const typeDefs = gql`
     topBrellaPlayers (amount: Int): [Player!]!
     topPlayers (weapon: String!): topPlayer!
     weaponPlacementStats(weapon: String!): [Int!]!
+    playerInfo(uid: String!): [Placement]
   }
 
   type Mutation {
@@ -291,6 +292,17 @@ const resolvers = {
       }, {sz: 0, tc: 0, rm: 0, cb: 0})
 
       return {placements: placements.slice(0, 101), modeCount: [m.sz+m.tc+m.rm+m.cb, m.sz, m.tc, m.rm, m.cb]}
+    },
+    playerInfo: (root, args) => {  //tee tästä uus tyyppi joka palauttaa kaikki placementit sekä Player objektin
+      console.log('args', args)
+      return Placement
+        .find({ unique_id: args.uid })
+        .sort({ "month": "asc", "year": "asc"})
+        .catch(e => {
+          throw new UserInputError(e.message, {
+            invalidArgs: args,
+          })
+        })
     }
   }
 }

models/player.js

@@ -2,7 +2,7 @@ const mongoose = require('mongoose')
 
 const playerSchema = new mongoose.Schema({
   name: {type: String, required: true },
-  unique_id: { type: Number, unique: true, required: true },
+  unique_id: { type: String, unique: true, required: true },
   alias: String,
   twitter: String,
   weapons: [String],

react-ui/src/App.js

@@ -2,7 +2,8 @@ import React, { useState } from 'react'
 import { Container } from 'semantic-ui-react'
 import Footer from './components/Footer'
 import MainMenu from './components/MainMenu'
-import { BrowserRouter as Router, Route } from 'react-router-dom'
+import NotFound from './components/NotFound'
+import { BrowserRouter as Router, Route, Redirect, Switch } from 'react-router-dom'
 
 import WeaponLeaderboardSelector from './components/WeaponLeaderboardSelector'
 import XSearch from './components/XSearch'
@@ -13,13 +14,18 @@ const App = () => {
     <div>
     <Router>
       <Container>
-        <MainMenu menuSelection={menuSelection} setMenuSelection={setMenuSelection} />
-        <div>
-          <Route path="/xleaderboard" render={() => <WeaponLeaderboardSelector setMenuSelection={setMenuSelection} />} />
-          <Route path="/xsearch" render={() => <XSearch setMenuSelection={setMenuSelection} />} />
-        </div>
-        <Footer />
-      </Container>
+          <MainMenu menuSelection={menuSelection} setMenuSelection={setMenuSelection} />
+          <div>
+            <Switch>
+              <Route exact path="/" render={() => <div>This is home.</div>} />
+              <Route path="/xleaderboard" render={() => <WeaponLeaderboardSelector setMenuSelection={setMenuSelection} />} />
+              <Route path="/xsearch" render={() => <XSearch setMenuSelection={setMenuSelection} />} />
+              <Route path="/404" render={() => <NotFound />} />
+              <Route path="*" render={() => <NotFound />} />
+            </Switch>
+          </div>
+          <Footer />
+        </Container>
     </Router>
     </div>
   )

react-ui/src/components/InfoPlayer.js

@@ -0,0 +1,7 @@
+import React from 'react'
+
+const InfoPlayer = ({ uid }) => {
+  
+}
+
+export default InfoPlayer

react-ui/src/components/InfoWeapon.js

@@ -3,6 +3,7 @@ import { useQuery } from 'react-apollo-hooks'
 import { topPlayersOfWeapon } from '../graphql/queries/topPlayersOfWeapon'
 import weaponDictReversed from '../utils/internal_english.json'
 import { Loader, Header, Table, Checkbox } from 'semantic-ui-react'
+import { withRouter } from 'react-router-dom'
 
 import szIcon from './modeIcons/sz.png'
 import tcIcon from './modeIcons/tc.png'
@@ -12,7 +13,7 @@ import { months, modes } from '../utils/lists'
 
 const modeIcons = ["", szIcon, tcIcon, rmIcon, cbIcon]
 
-const InfoWeapon = ({ wpn }) => { //todo - handle error (404?) //new weapons not shown?
+const InfoWeapon = withRouter(({ history, wpn }) => { //todo - handle error (404?) //new weapons not shown?
   const { data, error, loading } = useQuery(topPlayersOfWeapon, {variables: {weapon: weaponDictReversed[wpn] }})
   const [uniqueId, setUniqueId] = useState('')
   const [allPlayers, setAllPlayers] = useState(true)
@@ -39,6 +40,10 @@ const InfoWeapon = ({ wpn }) => { //todo - handle error (404?) //new weapons not
     }
   }, [data, loading, wpn])
 
+  if (!(wpn in weaponDictReversed)) {
+    history.push('/404')
+  }
+
   if (loading) {
     return <div style={{"paddingTop": "25px", "paddingBottom": "20000px"}} ><Loader active inline='centered' /></div>
   }
@@ -121,6 +126,6 @@ const InfoWeapon = ({ wpn }) => { //todo - handle error (404?) //new weapons not
       </div>
     </div>
   )
-}
+})
 
 export default InfoWeapon

react-ui/src/components/NotFound.js

@@ -0,0 +1,59 @@
+import React from 'react'
+import { Header } from 'semantic-ui-react'
+
+import bridge from './s1Maps/bridge.png'
+import depot from './s1Maps/depot.png'
+import heights from './s1Maps/heights.png'
+import mahi from './s1Maps/mahi.png'
+import museum from './s1Maps/museum.png'
+import rig from './s1Maps/rig.png'
+import underpass from './s1Maps/underpass.png'
+
+const NotFound = () => {
+  const maps = [
+    {
+      name: 'Hammerhead Bridge',
+      img: bridge
+    },
+    {
+      name: 'Bluefin Depot',
+      img: depot
+    },
+    {
+      name: 'Flounder Heights',
+      img: heights
+    },
+    {
+      name: 'Mahi-Mahi Resort',
+      img: mahi
+    },
+    {
+      name: 'Museum d\'Alfonsino',
+      img: museum
+    },
+    {
+      name: 'Saltspray Rig',
+      img: rig
+    },
+    {
+      name: 'Urchin Underpass',
+      img: underpass
+    }
+  ]
+  const mapObject = maps[Math.floor(Math.random()*maps.length)]
+  return (
+    <>
+      <div style={{display: 'flex',  justifyContent:'center', alignItems:'center'}}>
+        <img style={{"height": "400px", "width": "auto", "paddingBottom": "5px"}} src={mapObject.img} alt={mapObject.name} />
+      </div>
+      <div style={{display: 'flex',  justifyContent:'center', alignItems:'center'}}>
+        <Header size='small'>404 - Page not found</Header>
+      </div>
+      <div style={{display: 'flex',  justifyContent:'center', alignItems:'center'}}>
+        <i>...not unlike {mapObject.name} can't be found in Splatoon 2</i>
+      </div>
+    </>
+  )
+}
+
+export default NotFound