Securing and factoring code

src/app/api/buy/[item]/route.js

@@ -7,12 +7,15 @@ import { base } from 'airtable'
 export async function GET(request, { params }) {
   const session = await getSession()
   const person = await getSelfPerson(session.slackId)
+
   if (!person) {
     return NextResponse.json(
       { error: "i don't even know who you are" },
       { status: 418 },
     )
   }
+
+  const { region } = request.query
   const b = await base(process.env.BASE_ID)
   const items = await b('shop_items')
 
@@ -22,11 +25,26 @@ export async function GET(request, { params }) {
       maxRecords: 1,
     })
     .firstPage()
+
   if (recs.length < 1) {
-    return NextResponse.json({ error: 'what do you want?!' }, { status: 418 })
+    return NextResponse.json({ error: 'Item not found' }, { status: 418 })
   }
+
   const item = recs[0]
 
+  const { tickets } =
+    await getPersonTicketBalanceAndTutorialStatutWowThisMethodNameSureIsLongPhew(
+      session.slackId,
+    )
+
+  const price = region === 'us' ? item.fields.priceUs : item.fields.priceGlobal
+  if (tickets < price) {
+    return NextResponse.json(
+      { error: 'Not enough doubloons to buy this item' },
+      { status: 400 },
+    )
+  }
+
   const people = await b('people')
   const otp = Math.random().toString(16).slice(2)
 
@@ -46,12 +64,14 @@ export async function GET(request, { params }) {
       `https://forms.hackclub.com/eligibility?slack_id=${session.slackId}&program=High Seas&continue=${encodeURIComponent(item.fields.fillout_base_url.replace('shop-order', 'hs-order') + otp)}`,
     )
   }
+
   await people.update(person.id, {
     shop_otp: otp,
     shop_otp_expires_at: new Date(
       new Date().getTime() + 5 * 60 * 1000,
     ).toISOString(),
   })
+
   return redirect(
     `${item.fields.fillout_base_url.replace('shop-order', 'hs-order')}${otp}`,
   )

src/app/harbor/shop/shop-item-component.js

@@ -1,5 +1,4 @@
 import { motion } from 'framer-motion'
-
 import {
   Card,
   CardContent,
@@ -10,28 +9,40 @@ import {
 import { Button } from '@/components/ui/button'
 import { useMemo } from 'react'
 import { cantAffordWords, purchaseWords, sample } from '../../../../lib/flavor'
-import useLocalStorageState from '../../../../lib/useLocalStorageState.js'
-import { useState } from 'react'
 import Icon from '@hackclub/icons'
+
 const ActionArea = ({ item, filterIndex, affordable }) => {
   const buyWord = useMemo(() => sample(purchaseWords), [item.id])
   const getYourRacksUp = useMemo(() => sample(cantAffordWords), [item.id])
 
-  if (filterIndex == 0) {
+  if (filterIndex === 0) {
     return <Button disabled={true}>pick a region to buy!</Button>
   }
+
   if (item.comingSoon) {
     return <Button disabled={true}>🕑 coming soon...</Button>
   }
+
   if (item.outOfStock) {
     return <Button disabled={true}>out of stock...</Button>
   }
+
   if (!affordable) {
     return <Button disabled={true}>💸 {getYourRacksUp}</Button>
   }
+
   return (
-    <form action={`/api/buy/${item.id}`} className="w-full">
-      <Button className="w-full bg-black hover:bg-gray-800 text-white font-semibold py-2 px-4 rounded transition-colors duration-200 text-3xl enchanted">
+    <form action={`/api/buy/${item.id}`} method="GET" className="w-full">
+      <input
+        type="hidden"
+        name="region"
+        value={filterIndex === 1 ? 'us' : 'global'}
+      />{' '}
+      {/* hidden input for obtaining region */}
+      <Button
+        type="submit"
+        className="w-full bg-black hover:bg-gray-800 text-white font-semibold py-2 px-4 rounded transition-colors duration-200 text-3xl enchanted"
+      >
         {buyWord}
       </Button>
     </form>
@@ -79,7 +90,7 @@ export const ShopItemComponent = ({
                 height={20}
                 className="mr-1"
               />
-              {filterIndex == 1 ? item.priceUs : item.priceGlobal}
+              {filterIndex === 1 ? item.priceUs : item.priceGlobal}
             </span>
 
             {item.minimumHoursEstimated && item.maximumHoursEstimated ? (
@@ -102,25 +113,23 @@ export const ShopItemComponent = ({
           </CardContent>
         )}
 
-        <CardFooter className="pt-4 flex gap-1 ">
+        <CardFooter className="pt-4 flex gap-1">
           <ActionArea
             item={item}
             filterIndex={filterIndex}
             affordable={
-              (filterIndex == 1 ? item.priceUs : item.priceGlobal) <=
+              (filterIndex === 1 ? item.priceUs : item.priceGlobal) <=
               parseInt(personTicketBalance)
             }
           />
           <Button
             onClick={() => {
               setFavouriteItems((prevFav) => {
                 if (prevFav.includes(item.id)) {
-                  console.log('remove', prevFav)
                   return prevFav.filter(
                     (favItem) => String(favItem) !== item.id,
                   )
                 } else {
-                  console.log('add', prevFav)
                   return [...prevFav, item.id]
                 }
               })