Merge branch 'develop' into alex/626-add-google-analytics

Author: alexappleget

app/api/gift-exchanges/[id]/route.ts

@@ -19,11 +19,7 @@ export async function GET(
       .single();
 
     if (error) {
-      console.error('supabase error', error);
-      return NextResponse.json(
-        { error: 'Gift exchange not found' },
-        { status: 404 },
-      );
+      throw error;
     }
 
     return NextResponse.json(data);

app/dashboard/page.tsx

@@ -5,12 +5,15 @@ import GroupCard, { GroupCardSkeleton } from '@/components/GroupCard/GroupCard';
 import Link from 'next/link';
 import { useEffect, useState } from 'react';
 import { GiftExchangeWithMemberCount } from '../types/giftExchange';
+import { useToast } from '@/hooks/use-toast';
+import { ToastVariants } from '@/components/Toast/Toast.enum';
 
 export default function Dashboard() {
   const [giftExchanges, setGiftExchanges] = useState<
     GiftExchangeWithMemberCount[]
   >([]);
   const [isLoading, setIsLoading] = useState(true);
+  const { toast } = useToast();
 
   useEffect(() => {
     async function fetchGiftExchanges() {
@@ -28,6 +31,39 @@ export default function Dashboard() {
 
         const data = await response.json();
         setGiftExchanges(data);
+
+        const today = new Date();
+        for (const exchange of data) {
+          const drawingDate = new Date(exchange.drawing_date);
+          const timeDifference = drawingDate.getTime() - today.getTime();
+          const dayDifference = Math.ceil(
+            timeDifference / (1000 * 60 * 60 * 24),
+          );
+
+          if (dayDifference > 0 && dayDifference <= 3) {
+            toast({
+              variant: ToastVariants.Warning,
+              title: `Upcoming Draw - ${exchange.name}`,
+              description: `The draw is in ${dayDifference} day${dayDifference < 2 ? '' : 's'}!`,
+              group: exchange.gift_exchange_id,
+            });
+          } else if (dayDifference === 0) {
+            toast({
+              variant: ToastVariants.Success,
+              title: `Draw Today - ${exchange.name}`,
+              description: `Go to your group to initiate the gift exchange draw.`,
+              group: exchange.gift_exchange_id,
+            });
+          } else if (dayDifference < 0) {
+            toast({
+              variant: ToastVariants.Error,
+              title: `Draw date has passed - ${exchange.name}`,
+              description:
+                'Your Secret Santas are still secret! Please draw now or reschedule drawing date.',
+              group: exchange.gift_exchange_id,
+            });
+          }
+        }
       } catch (error) {
         console.error('Failed to fetch gift exchanges:', error);
       } finally {

app/gift-exchanges/[id]/page.test.tsx

@@ -0,0 +1,87 @@
+import { render, screen } from '@testing-library/react';
+import GiftExchangePage from './page';
+import { useAuthContext } from '@/context/AuthContextProvider';
+
+const mockGiftExchangeData = {
+  id: '123',
+  name: 'Test Exchange',
+  budget: '50',
+  status: 'pending',
+};
+
+const mockMembers = [
+  {
+    id: '1',
+    user_id: 'test-member',
+    member: { avatar: 'https://example.com/mock-avatar.png' },
+  },
+];
+
+const mockGiftSuggestions = {
+  match: null,
+  suggestions: [],
+};
+
+jest.mock('@/app/api/openaiConfig/config', () => ({
+  openai: {
+    chat: {
+      completions: {
+        create: jest.fn(),
+      },
+    },
+  },
+}));
+
+jest.mock('next/navigation', () => ({
+  useParams: () => ({ id: '123' }),
+}));
+
+jest.mock('@/context/AuthContextProvider');
+
+describe('GiftExchangePage Warning Modal', () => {
+  beforeEach(() => {
+    jest.resetAllMocks();
+
+    global.fetch = jest
+      .fn()
+      .mockResolvedValueOnce({
+        json: async () => mockGiftExchangeData,
+      })
+      .mockResolvedValueOnce({
+        json: async () => mockMembers,
+      })
+      .mockResolvedValueOnce({
+        json: async () => mockGiftSuggestions,
+      });
+  });
+
+  it('displays the WarningModal with the join button for a logged-in user who is not a member of a pending group', async () => {
+    (useAuthContext as jest.Mock).mockReturnValue({
+      session: {
+        user: {
+          id: 'not-a-member',
+        },
+      },
+    });
+
+    render(<GiftExchangePage />);
+
+    const warningModal = await screen.findByTestId('warning-modal');
+    const joinButton = screen.getByTestId('join-button');
+
+    expect(warningModal).toBeInTheDocument();
+    expect(joinButton).toBeInTheDocument();
+  });
+
+  it('displays the WarningModal with a Google sign-in button for users who are not signed in and not members of a pending group', async () => {
+    (useAuthContext as jest.Mock).mockReturnValue({ session: null });
+
+    render(<GiftExchangePage />);
+
+    const warningModal = await screen.findByTestId('warning-modal');
+    const googleButton = screen.getByTestId('google-button');
+
+    expect(warningModal).toBeInTheDocument();
+    expect(googleButton).toBeInTheDocument();
+  });
+});

app/gift-exchanges/[id]/page.tsx

@@ -79,6 +79,8 @@ export default function GiftExchangePage() {
             (member: GiftExchangeMember) => member.user_id === session?.user.id,
           ),
         );
+      } else {
+        setIsUserAMember(false);
       }
     } catch (error) {
       console.error('Error fetching data:', error);

app/layout.tsx

@@ -10,6 +10,7 @@ import { SnowOverlayProvider } from '@/providers/SnowOverlayProvider';
 import SnowOverlayWrapper from '@/components/SnowOverlayWrapper/SnowOverlayWrapper';
 import AuthContextProvider from '@/context/AuthContextProvider';
 import Script from 'next/script';
+import Toaster from '@/components/Toaster/Toaster';
 
 const geistSans = localFont({
   src: './fonts/GeistVF.woff',
@@ -63,6 +64,7 @@ const RootLayout = ({
             {children}
           </SnowOverlayProvider>
         </AuthContextProvider>
+        <Toaster />
       </body>
     </html>
   );

components/ToastAction/ToastAction.test.tsx

@@ -1,19 +1,23 @@
-import { ToastAction } from "./ToastAction";
+import { ToastAction } from './ToastAction';
 import { render, screen, fireEvent } from '@testing-library/react';
 
 describe('ToastAction', () => {
-    it('renders the children content within ToastAction', () => {
-        render(<ToastAction altText="undo">Undo</ToastAction>)
+  it('renders the children content within ToastAction', () => {
+    render(<ToastAction altText="undo">Undo</ToastAction>);
 
-        const toastAction = screen.getByTestId('toastAction');
-        expect(toastAction).toHaveTextContent('Undo');
-    });
+    const toastAction = screen.getByTestId('toastAction');
+    expect(toastAction).toHaveTextContent('Undo');
+  });
 
-    it('calls onClick when clicked', () => {
-        const handleClick = jest.fn();
-        render(<ToastAction altText="undo" onClick={handleClick}>Undo</ToastAction>)
+  it('calls onClick when clicked', () => {
+    const handleClick = jest.fn();
+    render(
+      <ToastAction altText="undo" onClick={handleClick}>
+        Undo
+      </ToastAction>,
+    );
 
-        fireEvent.click(screen.getByText('Undo'));
-        expect(handleClick).toHaveBeenCalled()
-    })
-})
+    fireEvent.click(screen.getByText('Undo'));
+    expect(handleClick).toHaveBeenCalled();
+  });
+});

components/ToastAction/ToastAction.tsx

@@ -2,8 +2,8 @@
 // Licensed under the MIT License.
 
 import React from 'react';
-import * as ToastPrimitives from "@radix-ui/react-toast"
-import { cn } from "@/lib/utils"
+import * as ToastPrimitives from '@radix-ui/react-toast';
+import { cn } from '@/lib/utils';
 
 const ToastAction = React.forwardRef<
   React.ElementRef<typeof ToastPrimitives.Action>,
@@ -13,14 +13,14 @@ const ToastAction = React.forwardRef<
     data-testid="toastAction"
     ref={ref}
     className={cn(
-      "inline-flex h-8 shrink-0 items-center justify-center rounded-md border bg-transparent px-3 text-sm font-medium transition-colors hover:bg-secondary focus:outline-none focus:ring-1 focus:ring-ring disabled:pointer-events-none disabled:opacity-50 group-[.destructive]:border-muted/40 group-[.destructive]:hover:border-destructive/30 group-[.destructive]:hover:bg-destructive group-[.destructive]:hover:text-destructive-foreground group-[.destructive]:focus:ring-destructive",
-      className
+      'inline-flex h-8 shrink-0 items-center justify-center rounded-md border bg-transparent px-3 text-sm font-medium transition-colors hover:bg-secondary focus:outline-none focus:ring-1 focus:ring-ring disabled:pointer-events-none disabled:opacity-50 group-[.destructive]:border-muted/40 group-[.destructive]:hover:border-destructive/30 group-[.destructive]:hover:bg-destructive group-[.destructive]:hover:text-destructive-foreground group-[.destructive]:focus:ring-destructive',
+      className,
     )}
     {...props}
   />
-))
-ToastAction.displayName = ToastPrimitives.Action.displayName
+));
+ToastAction.displayName = ToastPrimitives.Action.displayName;
 
-type ToastActionElement = React.ReactElement<typeof ToastAction>
+type ToastActionElement = React.ReactElement<typeof ToastAction>;
 
-export { ToastAction, type ToastActionElement }
+export { ToastAction, type ToastActionElement };

components/ToastDescription/ToastDescription.test.tsx

@@ -4,20 +4,31 @@ import { ToastDescription } from './ToastDescription';
 
 describe('ToastDescription', () => {
   it('renders the description text', () => {
-    const { getByText } = render(<ToastDescription>Test Description</ToastDescription>);
+    const { getByText } = render(
+      <ToastDescription>Test Description</ToastDescription>,
+    );
     expect(getByText('Test Description')).toBeInTheDocument();
   });
 
   it('applies custom classNames', () => {
-    render(<ToastDescription className="custom-class">Test Description</ToastDescription>)
+    render(
+      <ToastDescription className="custom-class">
+        Test Description
+      </ToastDescription>,
+    );
 
     const toastDescription = screen.getByTestId('toastDescription');
-    expect(toastDescription).toHaveClass('custom-class')
-  })
+    expect(toastDescription).toHaveClass('custom-class');
+  });
 
   it('passes custom data attributes', () => {
-    render(<ToastDescription data-custom-attribute="testValue"></ToastDescription>);
+    render(
+      <ToastDescription data-custom-attribute="testValue"></ToastDescription>,
+    );
     const toastDescription = screen.getByTestId('toastDescription');
-    expect(toastDescription).toHaveAttribute('data-custom-attribute', 'testValue')
-  })
-});
+    expect(toastDescription).toHaveAttribute(
+      'data-custom-attribute',
+      'testValue',
+    );
+  });
+});

components/ToastDescription/ToastDescription.tsx

@@ -2,20 +2,20 @@
 // Licensed under the MIT License.
 
 import React from 'react';
-import * as ToastPrimitives from "@radix-ui/react-toast"
-import { cn } from "@/lib/utils"
+import * as ToastPrimitives from '@radix-ui/react-toast';
+import { cn } from '@/lib/utils';
 
 const ToastDescription = React.forwardRef<
   React.ElementRef<typeof ToastPrimitives.Description>,
   React.ComponentPropsWithoutRef<typeof ToastPrimitives.Description>
 >(({ className, ...props }, ref) => (
   <ToastPrimitives.Description
     ref={ref}
-    className={cn("text-sm opacity-90", className)}
+    className={cn('text-sm opacity-90', className)}
     data-testid="toastDescription"
     {...props}
   />
-))
-ToastDescription.displayName = ToastPrimitives.Description.displayName
+));
+ToastDescription.displayName = ToastPrimitives.Description.displayName;
 
-export { ToastDescription }
+export { ToastDescription };

components/ToastProvider/ToastProvider.tsx

@@ -1,10 +1,10 @@
 // Copyright (c) Gridiron Survivor.
 // Licensed under the MIT License.
 
-"use client"
+'use client';
 
-import * as ToastPrimitives from "@radix-ui/react-toast"
+import * as ToastPrimitives from '@radix-ui/react-toast';
 
-const ToastProvider = ToastPrimitives.Provider
+const ToastProvider = ToastPrimitives.Provider;
 
-export { ToastProvider }
+export { ToastProvider };