Merge pull request #269 from euanwm/233-swr-two

shit rebase but i'm not going to lose sleep over it

frontend/api/fetchLifterData/fetchLifterData.ts

@@ -1,13 +1,25 @@
-import { LifterResult } from './fetchLifterDataTypes';
+import { LeaderboardResult } from './fetchLifterDataTypes'
 
 export default async function fetchLifterData(
-  start = 0,
-  stop = 10,
-  sortby = 'total',
-  federation = 'allfeds',
-  weightclass = 'MALL',
-  year = 69,
-): Promise<LifterResult[]> {
+  args: {
+    start: number
+    stop: number
+    sortby: string
+    federation: string
+    weightclass: string
+    year: number
+  } | null,
+): Promise<LeaderboardResult> {
+
+  const {
+    start = 0,
+    stop = 50,
+    sortby = 'total',
+    federation = 'allfeds',
+    weightclass = 'MALL',
+    year = 69,
+  } = args || {}
+
   const bodyContent = JSON.stringify({
     start,
     stop,
@@ -17,21 +29,15 @@ export default async function fetchLifterData(
     year,
   })
 
-  try {
-    const response = await fetch(`${process.env.API}/leaderboard`, {
-        method: 'POST',
-        headers: {
-          Accept: '*/*',
-          'Content-Type': 'application/json',
-        },
-        body: bodyContent,
-      });
-
-      const jsonResponse = await response.json();
-      return jsonResponse;
-  } catch (error) {
-    console.error('error in fetchLifterData', error);
+  const response = await fetch(`${process.env.API}/leaderboard`, {
+    method: 'POST',
+    headers: {
+      Accept: '*/*',
+      'Content-Type': 'application/json',
+    },
+    body: bodyContent,
+  })
 
-    return [];
-  }
+  const jsonResponse = await response.json()
+  return jsonResponse
 }

frontend/api/fetchLifterData/fetchLifterDataTypes.d.ts

@@ -17,3 +17,8 @@ export type LifterResult = {
     country: string;
     instagram: string;
   };
+
+export type LeaderboardResult = {
+    size: number;
+    data: LifterResult[];
+}

frontend/api/fetchLifterGraphData/fetchLifterGraphData.ts

@@ -1,23 +1,23 @@
-import { LifterChartData } from './fetchLifterGraphDataTypes';
+import { LifterChartData } from './fetchLifterGraphDataTypes'
 
-export default async function fetchLifterGraphData(lifterName = ''): Promise<LifterChartData> {
-  const bodyContent = JSON.stringify({"NameStr": lifterName });
+export default async function fetchLifterGraphData(
+  lifterName: string,
+): Promise<LifterChartData> {
+  if (!lifterName) {
+    return
+  }
 
-  try {
-    const response = await fetch(`${process.env.API}/lifter`, {
-      method: 'POST',
-      headers: {
-        Accept: '*/*',
-        'Content-Type': 'application/json',
-      },
-      body: bodyContent,
-    });
-    const jsonResponse = response.json();
+  const bodyContent = JSON.stringify({ NameStr: lifterName })
 
-    return jsonResponse;
-  } catch(error) {
-    console.error('error in fetchLifterGraphData', error);
+  const response = await fetch(`${process.env.API}/lifter`, {
+    method: 'POST',
+    headers: {
+      Accept: '*/*',
+      'Content-Type': 'application/json',
+    },
+    body: bodyContent,
+  })
+  const jsonResponse = response.json()
 
-    return undefined;
-  }
-};
+  return jsonResponse
+}

frontend/api/fetchLifterHistory/fetchLifterHistory.ts

@@ -1,35 +1,20 @@
 import { LifterHistory } from './fetchLifterHistoryTypes'
 
-const blankLifterHistory: LifterHistory = {
-  name: '',
-  graph: {
-    labels: [],
-    datasets: [],
-  },
-  lifts: [],
-}
-
 export default async function fetchLifterHistory(
-  name: string | string[] | undefined,
-): Promise<LifterHistory> {
+  name: string,
+): Promise<LifterHistory | null> {
   if (!name) {
-    return blankLifterHistory
+    return null
   }
 
-  try {
-    const response = await fetch(`${process.env.API}/history`, {
-      method: 'POST',
-      headers: {
-        'Content-Type': 'application/json',
-      },
-      body: JSON.stringify({ NameStr: name }),
-    })
+  const response = await fetch(`${process.env.API}/history`, {
+    method: 'POST',
+    headers: {
+      'Content-Type': 'application/json',
+    },
+    body: JSON.stringify({ NameStr: name }),
+  })
 
-    const jsonResponse = response.json()
-    return jsonResponse
-  } catch (error) {
-    console.error('error in fetchLifterHistory', error)
-
-    return blankLifterHistory
-  }
+  const jsonResponse = response.json()
+  return jsonResponse
 }

frontend/api/fetchLifterNames/fetchLifterNames.ts

@@ -1,18 +1,14 @@
-import { LifterSearchList } from "./fetchLifterNamesTypes"
+import { LifterSearchList } from './fetchLifterNamesTypes'
 
-export default async function fetchLifterNames(nameQuery: string): Promise<LifterSearchList> {
-  if (nameQuery.length < 3) {
-    return {names: []}
+export default async function fetchLifterNames(
+  name: string,
+): Promise<LifterSearchList> {
+  if (name?.length < 3) {
+    return { names: [] }
   }
 
-  try {
-    const response = await fetch(`${process.env.API}/search?name=${nameQuery}`);
-    const jsonResponse = response.json();
+  const response = await fetch(`${process.env.API}/search?name=${name}`)
+  const jsonResponse = response.json()
 
-    return jsonResponse;
-  } catch (error) {
-    console.error('error in searching names', error)
-
-    return {names: []}
-  }
-}
+  return jsonResponse
+}

frontend/api/submitLeagueForm/submitLeagueForm.ts

@@ -0,0 +1,22 @@
+import { RegistrationForm, FormResponse } from './submitLeagueFormTypes'
+
+export default async function submitLeagueForm(
+  data: RegistrationForm,
+): Promise<FormResponse> {
+  try {
+    const response = await fetch('https://v2.openweightlifting.org/register', {
+      method: 'POST',
+      headers: {
+        'Content-Type': 'application/json',
+      },
+      body: JSON.stringify(data),
+    })
+    return response.json()
+  } catch (error) {
+    console.error('Error:', error)
+    return {
+      success: false,
+      message: 'There was an error submitting your form. Please try again.',
+    }
+  }
+}

frontend/api/submitLeagueForm/submitLeagueFormTypes.d.ts

@@ -0,0 +1,12 @@
+export type RegistrationForm = {
+  username: string
+  clubname: string
+  location: string
+  email: string
+  comments: string
+}
+
+export type FormResponse = {
+  success: boolean
+  message: string
+}

frontend/components/datatable.tsx → frontend/components/molecules/dataTable.tsx

@@ -11,15 +11,15 @@ import { FaInstagram } from 'react-icons/fa'
 import { VscGraphLine } from 'react-icons/vsc'
 import { CgProfile } from 'react-icons/cg'
 
-import { AllDetails } from './alldetails'
+import { AllDetails } from './allDetails'
 
-import { LifterResult } from '@/api/fetchLifterData/fetchLifterDataTypes'
+import { LifterResult, LeaderboardResult } from '@/api/fetchLifterData/fetchLifterDataTypes'
 
 export const DataTable = ({
   lifters,
   openLifterGraphHandler,
 }: {
-  lifters: LifterResult[]
+  lifters: LeaderboardResult
   openLifterGraphHandler: (lifterName: string) => void
 }) => {
   const generateLifterRow = (lifter: LifterResult, lifterNo: number) => {
@@ -82,7 +82,7 @@ export const DataTable = ({
         <TableColumn>Details</TableColumn>
       </TableHeader>
       <TableBody>
-        {lifters.map((lifter, i) => generateLifterRow(lifter, i + 1))}
+        {lifters.data.map((lifter, i) => generateLifterRow(lifter, i + 1))}
       </TableBody>
     </Table>
   )

frontend/components/filters.tsx → frontend/components/molecules/filters.tsx

@@ -53,15 +53,15 @@ const yearsList = [
   { value: 2022, label: '2022' },
   { value: 2023, label: '2023' }
 ]
-export const Filters = ({ sortBy, federation, handleGenderChange, weightClass, year }: {sortBy: string, federation: string, handleGenderChange: any, weightClass: string, year: number}) => (
+export const Filters = ({ sortBy, federation, handleFilterChange, weightClass, year }: {sortBy: string, federation: string, handleFilterChange: any, weightClass: string, year: number}) => (
   <div className="flex flex-col md:flex-row space-y-1 md:space-y-0 md:space-x-4 mt-4 mx-4">
     <Select
       items={sortByList}
       label="Total/Sinclair"
       placeholder={sortByList[0].label}
       fullWidth={false}
       onChange={
-        (e) => handleGenderChange({ type: 'sortBy', value: e.target.value })
+        (e) => handleFilterChange({ type: 'sortBy', value: e.target.value })
       }
       >
       {(sortBy) => <SelectItem key={sortBy.value} value={sortBy.value}>{sortBy.label}</SelectItem>}
@@ -72,7 +72,7 @@ export const Filters = ({ sortBy, federation, handleGenderChange, weightClass, y
       placeholder={federationList[0].label}
       fullWidth={false}
       onChange={
-        (e) => handleGenderChange({ type: 'federation', value: e.target.value })
+        (e) => handleFilterChange({ type: 'federation', value: e.target.value })
       }
       >
       {(federation) => <SelectItem key={federation.value} value={federation.value}>{federation.label}</SelectItem>}
@@ -83,7 +83,7 @@ export const Filters = ({ sortBy, federation, handleGenderChange, weightClass, y
       placeholder={weightClassList[0].label}
       fullWidth={false}
       onChange={
-        (e) => handleGenderChange({ type: 'weightclass', value: e.target.value })
+        (e) => handleFilterChange({ type: 'weightclass', value: e.target.value })
       }
       >
       {(weightClass) => <SelectItem key={weightClass.value} value={weightClass.value}>{weightClass.label}</SelectItem>}
@@ -94,7 +94,7 @@ export const Filters = ({ sortBy, federation, handleGenderChange, weightClass, y
       placeholder={yearsList[0].label}
       fullWidth={false}
       onChange={
-        (e) => handleGenderChange({ type: 'year', value: parseInt(e.target.value) })
+        (e) => handleFilterChange({ type: 'year', value: parseInt(e.target.value) })
       }
       >
       {(year) => <SelectItem key={year.value} value={year.value}>{year.label}</SelectItem>}

frontend/layouts/head.tsx → frontend/components/molecules/head.tsx

@@ -13,7 +13,7 @@ import { SlCalculator } from 'react-icons/sl'
 import { MdOutlinePersonSearch } from 'react-icons/md'
 import { FiHome } from 'react-icons/fi'
 
-import Logo from '../public/OWL-logo.png'
+import Logo from '../../public/OWL-logo.png'
 import { useState } from 'react'
 
 const HeaderBar = () => {

frontend/components/molecules/lifterGraphModal.tsx

@@ -0,0 +1,37 @@
+import useSWR from 'swr'
+import { Modal, ModalContent, ModalHeader, Spinner } from '@nextui-org/react'
+import fetchLifterGraphData from '@/api/fetchLifterGraphData/fetchLifterGraphData'
+import { LifterGraph } from './lifterGraph'
+
+function LifterGraphModal({
+  lifterName,
+  onClose,
+}: {
+  lifterName: string
+  onClose: () => void
+}) {
+  const { data, isLoading } = useSWR(lifterName, fetchLifterGraphData)
+
+  return (
+    <Modal
+      closeButton
+      isOpen={true}
+      size={'4xl'}
+      onClose={onClose}
+      placement={'center'}
+    >
+      <ModalContent>
+        <ModalHeader>{lifterName}</ModalHeader>
+        {isLoading ? (
+          <div className="w-full h-full z-10 flex justify-center items-center">
+            <Spinner size="lg" label="Loading..." />
+          </div>
+        ) : (
+          <LifterGraph lifterHistory={data} setRatio={1} />
+        )}
+      </ModalContent>
+    </Modal>
+  )
+}
+
+export default LifterGraphModal