diff --git a/src/components/App/index.tsx b/src/components/App/index.tsx index c3cfa498..2613896b 100644 --- a/src/components/App/index.tsx +++ b/src/components/App/index.tsx @@ -4,10 +4,10 @@ import './index.css' import Header from '~components/Header' -import New from '~routes/New' -import Party from '~routes/Party' -import Parties from '~routes/Parties' -import Profile from '~routes/Profile' +import NewRoute from '~routes/NewRoute' +import PartyRoute from '~routes/PartyRoute' +import PartiesRoute from '~routes/PartiesRoute' +import ProfileRoute from '~routes/ProfileRoute' const App = () => { @@ -17,10 +17,10 @@ const App = () => { return (
- - - - + + + +
) } diff --git a/src/components/HeaderMenu/index.tsx b/src/components/HeaderMenu/index.tsx index 4af532f8..58880b1a 100644 --- a/src/components/HeaderMenu/index.tsx +++ b/src/components/HeaderMenu/index.tsx @@ -7,7 +7,7 @@ import SignupModal from '~components/SignupModal' import { useModal as useSignupModal } from '~utils/useModal' import { useModal as useLoginModal } from '~utils/useModal' import { Link, Route } from 'react-router-dom' -import Profile from '~routes/Profile' +import Profile from '~routes/ProfileRoute' interface Props { diff --git a/src/components/Party/index.tsx b/src/components/Party/index.tsx index d8b4db41..4e39343a 100644 --- a/src/components/Party/index.tsx +++ b/src/components/Party/index.tsx @@ -21,9 +21,14 @@ export enum GridType { import './index.css' interface Props { + mainWeapon?: Weapon + mainSummon?: Summon + friendSummon?: Summon + weapons?: GridArray + summons?: GridArray editable: boolean exists: boolean - pushHistory: (path: string) => void + pushHistory?: (path: string) => void } const Party = (props: Props) => { @@ -43,6 +48,14 @@ const Party = (props: Props) => { const [mainSummon, setMainSummon] = useState() const [friendSummon, setFriendSummon] = useState() + useEffect(() => { + setMainWeapon(props.mainWeapon) + setMainSummon(props.mainSummon) + setFriendSummon(props.friendSummon) + setWeapons(props.weapons || {}) + setSummons(props.summons || {}) + }, [props.mainWeapon, props.mainSummon, props.friendSummon, props.weapons, props.summons]) + const weaponGrid = ( { ) - const [currentGrid, setCurrentGrid] = useState(weaponGrid) const [currentTab, setCurrentTab] = useState(GridType.Weapon) - const [partyId, setPartyId] = useState('') function segmentClicked(event: React.ChangeEvent) { switch(event.target.value) { case 'characters': setCurrentTab(GridType.Character) - setCurrentGrid(characterGrid) break case 'weapons': setCurrentTab(GridType.Weapon) - setCurrentGrid(weaponGrid) break case 'summons': setCurrentTab(GridType.Summon) - setCurrentGrid(summonGrid) break default: break @@ -115,10 +123,10 @@ const Party = (props: Props) => { }) .then(partyId => { setPartyId(partyId) - save(partyId, type, item, position) + saveItem(partyId, type, item, position) }) } else { - save(partyId, type, item, position) + saveItem(partyId, type, item, position) } } @@ -132,7 +140,7 @@ const Party = (props: Props) => { return await api.endpoints.parties.create(body, headers) } - function save(partyId: string, type: GridType, item: Character | Weapon | Summon, position: number) { + function saveItem(partyId: string, type: GridType, item: Character | Weapon | Summon, position: number) { switch(type) { case GridType.Class: saveClass() @@ -157,6 +165,7 @@ const Party = (props: Props) => { } } + // Weapons function storeWeapon(weapon: Weapon, position: number) { if (position == -1) { setMainWeapon(weapon) @@ -179,6 +188,7 @@ const Party = (props: Props) => { }, headers) } + // Summons function storeSummon(summon: Summon, position: number) { if (position == -1) { setMainSummon(summon) @@ -204,10 +214,12 @@ const Party = (props: Props) => { }, headers) } + // Character function saveCharacter(character: Character, position: number, party: string) { // TODO: Implement this } + // Class function saveClass() { // TODO: Implement this } @@ -219,7 +231,18 @@ const Party = (props: Props) => { onClick={segmentClicked} /> - {currentGrid} + { + (() => { + switch(currentTab) { + case GridType.Character: + return characterGrid + case GridType.Weapon: + return weaponGrid + case GridType.Summon: + return summonGrid + } + })() + } ) } diff --git a/src/components/PartySegmentedControl/index.tsx b/src/components/PartySegmentedControl/index.tsx index 880776fd..d01eda90 100644 --- a/src/components/PartySegmentedControl/index.tsx +++ b/src/components/PartySegmentedControl/index.tsx @@ -16,6 +16,7 @@ interface Props { } const PartySegmentedControl = (props: Props) => { + return (
@@ -29,21 +30,21 @@ const PartySegmentedControl = (props: Props) => { Characters Weapons Summons diff --git a/src/routes/New/index.tsx b/src/routes/NewRoute/index.tsx similarity index 89% rename from src/routes/New/index.tsx rename to src/routes/NewRoute/index.tsx index d619999c..1c0fa800 100644 --- a/src/routes/New/index.tsx +++ b/src/routes/NewRoute/index.tsx @@ -6,7 +6,7 @@ import Party from '~components/Party' interface Props {} interface NewProps extends RouteComponentProps {} -const New: React.FC = () => { +const NewRoute: React.FC = () => { function callback(path: string) { // This is scuffed, how do we do this natively? window.history.replaceState(null, `Grid Tool`, `${path}`) @@ -23,4 +23,4 @@ const New: React.FC = () => { ) } -export default New \ No newline at end of file +export default NewRoute \ No newline at end of file diff --git a/src/routes/Parties/index.tsx b/src/routes/PartiesRoute/index.tsx similarity index 91% rename from src/routes/Parties/index.tsx rename to src/routes/PartiesRoute/index.tsx index eadd06ec..f30974b8 100644 --- a/src/routes/Parties/index.tsx +++ b/src/routes/PartiesRoute/index.tsx @@ -4,7 +4,7 @@ interface State { parties: {id: string, hash: string}[] } -class Parties extends React.Component { +class PartiesRoute extends React.Component { state: State constructor(props) { @@ -36,4 +36,4 @@ class Parties extends React.Component { } } -export default Parties \ No newline at end of file +export default PartiesRoute \ No newline at end of file diff --git a/src/routes/Party/index.tsx b/src/routes/PartyRoute/index.tsx similarity index 58% rename from src/routes/Party/index.tsx rename to src/routes/PartyRoute/index.tsx index 48e4470a..5a019bc1 100644 --- a/src/routes/Party/index.tsx +++ b/src/routes/PartyRoute/index.tsx @@ -3,10 +3,7 @@ import { withCookies, useCookies } from 'react-cookie' import { RouteComponentProps, withRouter } from 'react-router-dom' import api from '~utils/api' -import PartySegmentedControl from '~components/PartySegmentedControl' -import WeaponGrid from '~components/WeaponGrid' -import SummonGrid from '~components/SummonGrid' -import CharacterGrid from '~components/CharacterGrid' +import Party from '~components/Party' import Button from '~components/Button' interface Props { @@ -15,7 +12,7 @@ interface Props { interface PartyProps extends RouteComponentProps {} -const Party: React.FC = ({ match }) => { +const PartyRoute: React.FC = ({ match }) => { const [found, setFound] = useState(false) const [loading, setLoading] = useState(true) const [editable, setEditable] = useState(false) @@ -28,9 +25,7 @@ const Party: React.FC = ({ match }) => { const [friendSummon, setFriendSummon] = useState() const [partyId, setPartyId] = useState('') - const [cookies, setCookie] = useCookies(['userId']) - const [selectedTab, setSelectedTab] = useState('weapons') - const [tab, setTab] = useState() + const [cookies, setCookie] = useCookies(['user']) const shortcode = match.params.hash || '' useEffect(() => { @@ -84,68 +79,18 @@ const Party: React.FC = ({ match }) => { }) } - function segmentClicked(event: React.ChangeEvent) { - setSelectedTab(event.target.value) - - switch(event.target.value) { - case 'weapons': - setTab(( - - )) - break - case 'summons': - setTab(( - - )) - break - case 'characters': - setTab(( - - )) - break - default: - break - } - } - function render() { return (
- - - {tab || ( - - )}
) } @@ -171,6 +116,6 @@ const Party: React.FC = ({ match }) => { export default withCookies( withRouter( - Party + PartyRoute ) ) \ No newline at end of file diff --git a/src/routes/Profile/index.tsx b/src/routes/ProfileRoute/index.tsx similarity index 97% rename from src/routes/Profile/index.tsx rename to src/routes/ProfileRoute/index.tsx index d4643155..ec90c590 100644 --- a/src/routes/Profile/index.tsx +++ b/src/routes/ProfileRoute/index.tsx @@ -25,7 +25,7 @@ interface Party { interface ProfileProps extends RouteComponentProps {} -const Profile: React.FC = ({ history, match }) => { +const ProfileRoute: React.FC = ({ history, match }) => { const [cookies, setCookie] = useCookies(['user']) const [found, setFound] = useState(false) @@ -128,6 +128,6 @@ const Profile: React.FC = ({ history, match }) => { export default withCookies( withRouter( - Profile + ProfileRoute ) ) \ No newline at end of file