plus suggestion add tier

components/plus/PlusHomePage.tsx

@@ -11,7 +11,7 @@ const PlusHomePage: React.FC<PlusHomePageProps> = () => {
       <SuggestionVouchModal
         canSuggest={true}
         canVouch={false}
-        userPlusTier={1}
+        userPlusMembershipTier={1}
       />
       <Box>No suggestions yet for this month</Box>
     </>

components/plus/SuggestionVouchModal.tsx

@@ -28,7 +28,7 @@ import UserSelector from "components/common/UserSelector";
 interface Props {
   canVouch: boolean;
   canSuggest: boolean;
-  userPlusTier: number;
+  userPlusMembershipTier?: number;
 }
 
 type FormData = z.infer<typeof suggestionSchema>;
@@ -36,7 +36,7 @@ type FormData = z.infer<typeof suggestionSchema>;
 const SuggestionVouchModal: React.FC<Props> = ({
   canVouch,
   canSuggest,
-  userPlusTier,
+  userPlusMembershipTier,
 }) => {
   const [isOpen, setIsOpen] = useState(false);
   const sending = false; //usemutation hook
@@ -55,6 +55,8 @@ const SuggestionVouchModal: React.FC<Props> = ({
     return t`Add new suggestion`;
   };
 
+  if (!userPlusMembershipTier) return null;
+
   return (
     <>
       <Button size="sm" mb={4} onClick={() => setIsOpen(true)}>
@@ -87,8 +89,12 @@ const SuggestionVouchModal: React.FC<Props> = ({
                         value={value}
                         onChange={(e) => onChange(Number(e.target.value))}
                       >
-                        {userPlusTier === 1 && <option value="1">+1</option>}
-                        {userPlusTier <= 2 && <option value="2">+2</option>}
+                        {userPlusMembershipTier === 1 && (
+                          <option value="1">+1</option>
+                        )}
+                        {userPlusMembershipTier <= 2 && (
+                          <option value="2">+2</option>
+                        )}
                         {false && <option value="3">+3</option>}
                       </Select>
                     )}
@@ -108,6 +114,19 @@ const SuggestionVouchModal: React.FC<Props> = ({
                       />
                     )}
                   />
+                  <FormControl>
+                    <FormLabel mt={4}>
+                      <Trans>Region</Trans>
+                    </FormLabel>
+                    <Select name="region" ref={register}>
+                      <option value="NA">NA</option>
+                      <option value="EU">EU</option>
+                    </Select>
+                    <FormHelperText>
+                      If the player isn't from either region then choose the one
+                      they play most commonly with.
+                    </FormHelperText>
+                  </FormControl>
                   <FormControl isInvalid={!!errors.description}>
                     <FormLabel htmlFor="description" mt={4}>
                       <Trans>Description</Trans>

lib/validators/suggestion.ts

@@ -6,4 +6,5 @@ export const suggestionSchema = z.object({
   description: z.string().max(SUGGESTION_DESCRIPTION_LIMIT),
   suggestedUserId: z.number().int(),
   tier: z.number().int().min(1).max(3),
+  region: z.enum(["NA", "EU"]),
 });