fix: fix linting errors

caffeine-addictt · Aug 10, 2024 · 8cc2912 · 8cc2912
1 parent 59b82c9
commit 8cc2912
Showing 1 changed file with 54 additions and 30 deletions.
diff --git a/client/src/pages/user/dashboard.tsx b/client/src/pages/user/dashboard.tsx
@@ -9,7 +9,12 @@ import { Input } from '@components/ui/input';
 import { Button } from '@components/ui/button';
 import { useForm, Controller } from 'react-hook-form';
 import { zodResolver } from '@hookform/resolvers/zod';
-import { useQuery, useQueryClient, UseQueryResult, UseQueryOptions } from '@tanstack/react-query';
+import {
+  useQuery,
+  useQueryClient,
+  UseQueryResult,
+  UseQueryOptions,
+} from '@tanstack/react-query';
 import { isAxiosError } from 'axios';
 import { cn } from '@utils/tailwind';
 
@@ -40,30 +45,31 @@ const Dashboard: PageComponent = ({ className, ...props }) => {
   const queryClient = useQueryClient();
 
   // Fetch dashboard data from the server
-  const { data, isError, isLoading }: UseQueryResult<DashboardResponse> = useQuery<DashboardResponse>({
-    queryKey: ['dashboard'],
-    queryFn: async (): Promise<DashboardResponse> => {
-      try {
-        // Directly return data as DashboardResponse
-        const response = await httpClient.get<DashboardResponse>({
-          uri: '/dashboard',
-          withCredentials: 'access', // Pass withCredentials as 'access'
-        });
-        return response; // Directly return response
-      } catch (err) {
-        console.error('Fetch error:', err);
-        throw err;
-      }
-    },
-    onError: (err: unknown) => {
-      if (isAxiosError(err) && err.response) {
-        setError('Error fetching dashboard data! Please try again later.');
-      } else {
-        setError('An unexpected error occurred. Please try again later.');
-      }
-      console.error('Query error:', err);
-    },
-  } as UseQueryOptions<DashboardResponse, Error>); // Ensure the options type matches
+  const { data, isError, isLoading }: UseQueryResult<DashboardResponse> =
+    useQuery<DashboardResponse>({
+      queryKey: ['dashboard'],
+      queryFn: async (): Promise<DashboardResponse> => {
+        try {
+          // Directly return data as DashboardResponse
+          const response = await httpClient.get<DashboardResponse>({
+            uri: '/dashboard',
+            withCredentials: 'access', // Pass withCredentials as 'access'
+          });
+          return response; // Directly return response
+        } catch (err) {
+          console.error('Fetch error:', err);
+          throw err;
+        }
+      },
+      onError: (err: unknown) => {
+        if (isAxiosError(err) && err.response) {
+          setError('Error fetching dashboard data! Please try again later.');
+        } else {
+          setError('An unexpected error occurred. Please try again later.');
+        }
+        console.error('Query error:', err);
+      },
+    } as UseQueryOptions<DashboardResponse, Error>); // Ensure the options type matches
 
   // Initialize form with empty values
   const DashboardForm = useForm<Dashboard>({
@@ -74,7 +80,12 @@ const Dashboard: PageComponent = ({ className, ...props }) => {
     },
   });
 
-  const { control, handleSubmit, setValue, formState: { isSubmitting, errors } } = DashboardForm;
+  const {
+    control,
+    handleSubmit,
+    setValue,
+    formState: { isSubmitting, errors },
+  } = DashboardForm;
 
   // Update form values when data is fetched
   useEffect(() => {
@@ -115,7 +126,13 @@ const Dashboard: PageComponent = ({ className, ...props }) => {
   if (isError) return <p>{error}</p>;
 
   return (
-    <div className={cn('flex flex-col items-center justify-center min-h-screen p-8', className)} {...props}>
+    <div
+      className={cn(
+        'flex flex-col items-center justify-center min-h-screen p-8',
+        className,
+      )}
+      {...props}
+    >
       <div className="w-full max-w-6xl space-y-8">
         <div className="flex flex-col gap-8 lg:flex-row">
           {/* Form Container */}
@@ -135,7 +152,9 @@ const Dashboard: PageComponent = ({ className, ...props }) => {
                     />
                   )}
                 />
-                {errors.title && <p className="text-red-500">{errors.title.message}</p>}
+                {errors.title && (
+                  <p className="text-red-500">{errors.title.message}</p>
+                )}
               </div>
 
               <div>
@@ -152,7 +171,9 @@ const Dashboard: PageComponent = ({ className, ...props }) => {
                     />
                   )}
                 />
-                {errors.description && <p className="text-red-500">{errors.description.message}</p>}
+                {errors.description && (
+                  <p className="text-red-500">{errors.description.message}</p>
+                )}
               </div>
 
               {isEditing && (
@@ -172,7 +193,10 @@ const Dashboard: PageComponent = ({ className, ...props }) => {
             </form>
             {!isEditing && (
               <div className="mt-4 flex justify-end">
-                <Button onClick={handleEditClick} className="text-xl text-blue-500">
+                <Button
+                  onClick={handleEditClick}
+                  className="text-xl text-blue-500"
+                >
                   Edit
                 </Button>
               </div>