import { useRouteMatch } from 'react-router'

import toUpper from 'lodash/toUpper'

import { ProfileTypes, SportTypes } from 'config'

type RouteParams = {
  pageId: string,
  profileName: string,
  sportName: string,
}

export const usePageParams = () => {
  const {
    params: {
      pageId,
      profileName,
      sportName,
    },
  } = useRouteMatch<RouteParams>('/:sportName/:profileName/:pageId') || { params: {} }

  return {
    profileId: Number(pageId),
    profileType: ProfileTypes[toUpper(profileName) as keyof typeof ProfileTypes],
    sportType: SportTypes[toUpper(sportName) as keyof typeof SportTypes],
  }
}