From 2980d38b23ca418b7a0908ab16520e4bc87a6299 Mon Sep 17 00:00:00 2001
From: Wang Haoyang <haoyangw@gmail.com>
Date: Fri, 1 Nov 2024 05:49:47 +0800
Subject: [PATCH] Fix more eslint errors

---
 frontend/app/(authenticated)/ask/ask-page.tsx |  4 +-
 .../(authenticated)/essay-feedback/page.tsx   |  2 +-
 .../app/(authenticated)/user/billing/page.tsx | 41 +------------------
 .../navigation/unverified-alert.tsx           |  5 ++-
 4 files changed, 7 insertions(+), 45 deletions(-)

diff --git a/frontend/app/(authenticated)/ask/ask-page.tsx b/frontend/app/(authenticated)/ask/ask-page.tsx
index cf6e2ef0..50b7af58 100644
--- a/frontend/app/(authenticated)/ask/ask-page.tsx
+++ b/frontend/app/(authenticated)/ask/ask-page.tsx
@@ -21,8 +21,8 @@ import {
 } from "@/components/ui/card";
 import JippyIcon from "@/public/jippy-icon/jippy-icon-sm";
 import { useUserStore } from "@/store/user/user-store-provider";
-import { getNextMonday, toQueryDateFriendly } from "@/utils/date";
 import { UNVERIFIED_TIER_ID } from "@/types/billing";
+import { getNextMonday, toQueryDateFriendly } from "@/utils/date";
 
 const MAX_GP_QUESTION_LEN: number = 200; // max character count
 
@@ -160,11 +160,11 @@ const AskPage = ({ setIsLoading, isLoading }: AskPageProps) => {
               />
             ) : hasTriesLeft ? (
               <LimitAlert
+                isRedAlert={errorMsg ? true : false}
                 warningText={
                   errorMsg ||
                   `You have ${triesLeft} ${triesLeft === 1 ? "question" : "questions"} left. It will reset on ${toQueryDateFriendly(getNextMonday())} 12:00AM.`
                 }
-                isRedAlert={errorMsg ? true : false}
               />
             ) : (
               <LimitAlert
diff --git a/frontend/app/(authenticated)/essay-feedback/page.tsx b/frontend/app/(authenticated)/essay-feedback/page.tsx
index b11d4c93..19a4f618 100644
--- a/frontend/app/(authenticated)/essay-feedback/page.tsx
+++ b/frontend/app/(authenticated)/essay-feedback/page.tsx
@@ -15,7 +15,7 @@ import { z } from "zod";
 
 import { createEssayEssaysPost, ParagraphType } from "@/client";
 import Chip from "@/components/display/chip";
-import { Alert, AlertDescription, AlertTitle } from "@/components/ui/alert";
+import { Alert, AlertDescription } from "@/components/ui/alert";
 import { AutosizeTextarea } from "@/components/ui/autosize-textarea";
 import { Button } from "@/components/ui/button";
 import { Card } from "@/components/ui/card";
diff --git a/frontend/app/(authenticated)/user/billing/page.tsx b/frontend/app/(authenticated)/user/billing/page.tsx
index 03f24958..45e4c1c9 100644
--- a/frontend/app/(authenticated)/user/billing/page.tsx
+++ b/frontend/app/(authenticated)/user/billing/page.tsx
@@ -1,35 +1,27 @@
 "use client";
 
-import { useEffect, useState } from "react";
+import { useEffect } from "react";
 import { usePathname, useRouter, useSearchParams } from "next/navigation";
 
 import { UNVERIFIED_TIER_ID } from "@/app/(authenticated)/verify-email/page";
 import { UserPublic } from "@/client";
 import PricingTable from "@/components/billing/pricing-table";
 import SubscriptionCard from "@/components/billing/subscription-card";
-import Chip from "@/components/display/chip";
-import UnverifiedAlert from "@/components/navigation/unverified-alert";
-import { Button } from "@/components/ui/button";
 import { useToast } from "@/hooks/use-toast";
 import {
   useCreateStripeCheckoutSession,
-  useCreateStripeCustomerPortalSession,
   useDowngradeSubscription,
 } from "@/queries/billing";
 import { useUserStore } from "@/store/user/user-store-provider";
 import {
   JippyTier,
   JippyTierID,
-  SubscriptionPeriod,
   tierIDToTierDescription,
   tierIDToTierFeature,
   tierIDToTierName,
   TierPrice,
 } from "@/types/billing";
 
-const FREE_TIER_ID = 1;
-const TIER_STATUS_ACTIVE = "active";
-
 const getPriceButtonText = (
   priceTierId: number,
   user: UserPublic | undefined,
@@ -52,49 +44,28 @@ const getPriceButtonText = (
   }
 };
 
-const toPascalCase = (string: string) => {
-  return string.charAt(0).toUpperCase() + string.slice(1);
-};
-
 const Page = () => {
   const user = useUserStore((store) => store.user);
   const stripeCheckoutMutation = useCreateStripeCheckoutSession();
-  const stripeCustomerPortalMutation = useCreateStripeCustomerPortalSession();
   const downgradeSubscription = useDowngradeSubscription();
 
   const billingPath = usePathname();
   const searchParams = useSearchParams();
   const isUserUnverified =
     user?.verified === false || user?.tier_id === UNVERIFIED_TIER_ID;
-  const hasSubscription =
-    user?.tier_id != JippyTierID.Free && user?.tier_id !== 4;
   let isSuccess = searchParams.get("success") === "true";
   let stripeSessionId = searchParams.get("session_id");
   let isCancelled = searchParams.get("cancelled") === "true";
   const router = useRouter();
 
-  const [userTier, setUserTier] = useState<string>("");
-  const [userTierStatus, setUserTierStatus] = useState<string>("");
-
   const { toast } = useToast();
   // Display payment status toast for 5 secs
   const PAYMENT_TOAST_DURATION = 5000;
 
-  const getDateFrom = (dateString: string | null | undefined) => {
-    if (dateString) {
-      return new Date(dateString);
-    }
-    return undefined;
-  };
-
   const onClickDowngradeSubscription = () => {
     downgradeSubscription.mutate();
   };
 
-  const onClickManageSubscription = () => {
-    stripeCustomerPortalMutation.mutate();
-  };
-
   const jippyTiers = [
     {
       tierName: JippyTier.Free,
@@ -160,16 +131,6 @@ const Page = () => {
     }
   }, [isSuccess, isCancelled, stripeSessionId]);
 
-  useEffect(() => {
-    if (user?.subscription) {
-      setUserTierStatus(user.subscription.status);
-      setUserTier(tierIDToTierName(user.tier_id || FREE_TIER_ID));
-    } else {
-      setUserTier(tierIDToTierName(FREE_TIER_ID));
-      setUserTierStatus(TIER_STATUS_ACTIVE);
-    }
-  }, [user?.subscription, user?.tier_id]);
-
   return (
     user && (
       <div className="flex flex-col w-full py-8">
diff --git a/frontend/components/navigation/unverified-alert.tsx b/frontend/components/navigation/unverified-alert.tsx
index b532089f..639d9d6d 100644
--- a/frontend/components/navigation/unverified-alert.tsx
+++ b/frontend/components/navigation/unverified-alert.tsx
@@ -1,7 +1,7 @@
 import { CircleAlert } from "lucide-react";
 
 import { resendVerificationEmailAuthEmailVerificationPost } from "@/client";
-import { Alert, AlertDescription, AlertTitle } from "@/components/ui/alert";
+import { Alert, AlertDescription } from "@/components/ui/alert";
 import { toast } from "@/hooks/use-toast";
 
 const UnverifiedAlert = () => {
@@ -32,7 +32,8 @@ const UnverifiedAlert = () => {
       </div>
       <div className="flex flex-col items-start justify-center w-full">
         <AlertDescription>
-          Verify your email with the link we sent to you. Didn't receive it?{" "}
+          Verify your email with the link we sent to you. Didn&apos;t receive
+          it?{" "}
           <span
             className="underline cursor-pointer"
             onClick={onClickResendVerification}