From 9269e2bde97975392d94bb5ad71dcb7bcd4a01fb Mon Sep 17 00:00:00 2001
From: Cody Epstein <codyepstein@gmail.com>
Date: Tue, 22 Oct 2024 11:57:46 -0700
Subject: [PATCH 1/4] Cody/increase weekly pick button responsiveness (#611)

Closes #601

- Changed flex-direction of label on smallest screens to `flex-col` to
stack team image and name vertically

![Recording 2024-10-16 at 10 37
05](https://github.com/user-attachments/assets/2ced0e00-c0dc-4d7e-9316-7baeca587d29)
---
 components/WeeklyPickButton/WeeklyPickButton.tsx | 7 ++++++-
 1 file changed, 6 insertions(+), 1 deletion(-)

diff --git a/components/WeeklyPickButton/WeeklyPickButton.tsx b/components/WeeklyPickButton/WeeklyPickButton.tsx
index f0dc9380..382c43f8 100644
--- a/components/WeeklyPickButton/WeeklyPickButton.tsx
+++ b/components/WeeklyPickButton/WeeklyPickButton.tsx
@@ -48,7 +48,12 @@ const WeeklyPickButton: React.FC<WeeklyPickButtonProps> = ({
           data-testid="team-radio"
         />
 
-        <Label htmlFor={team} data-testid="team-label" disabled={isDisabled}>
+        <Label
+          htmlFor={team}
+          data-testid="team-label"
+          disabled={isDisabled}
+          className="flex-col sm:flex-row"
+        >
           <Image
             src={src}
             alt={team}

From 6204626e3ae0be49fe5d374f4aa56d658d550c40 Mon Sep 17 00:00:00 2001
From: Corina Murg <115652409+CorinaMurg@users.noreply.github.com>
Date: Wed, 23 Oct 2024 13:26:29 -0400
Subject: [PATCH 2/4] fix (#273): a11y audit signup page (#303)

Fixes: #273

### Changes:
- add `title` element (completed by Chris). This involved setting up a
server-side page, now responsible for rendering the `Register` component
and setting its metadata (title and description). This approach is what
Next.js expects. It wants to integrate the metadata into the server
response when the page is initially loaded.
- add `FormLabel` to input fields
- create test for `Label` component

### Remaining (until design updates):
- change input border color to meet contrast ratio

---------

Co-authored-by: Cor-Ina <115652409+Cor-Ina@users.noreply.github.com>
Co-authored-by: Chris Nowicki <102450568+chris-nowicki@users.noreply.github.com>
Co-authored-by: Ryan Furrer <ryandotfurrer@gmail.com>
Co-authored-by: Shashi Lo <362527+shashilo@users.noreply.github.com>
---
 app/(main)/register/Register.tsx  | 261 ++++++++++++++++++++++++++++++
 app/(main)/register/page.test.tsx |  10 +-
 app/(main)/register/page.tsx      | 249 ++--------------------------
 components/Label/Label.test.tsx   |  40 +++++
 4 files changed, 317 insertions(+), 243 deletions(-)
 create mode 100644 app/(main)/register/Register.tsx
 create mode 100644 components/Label/Label.test.tsx

diff --git a/app/(main)/register/Register.tsx b/app/(main)/register/Register.tsx
new file mode 100644
index 00000000..6c8d02b9
--- /dev/null
+++ b/app/(main)/register/Register.tsx
@@ -0,0 +1,261 @@
+// Copyright (c) Gridiron Survivor.
+// Licensed under the MIT License.
+
+'use client';
+import { AlertVariants } from '@/components/AlertNotification/Alerts.enum';
+import { Button } from '@/components/Button/Button';
+import { Control, useForm, useWatch, SubmitHandler } from 'react-hook-form';
+import {
+  Form,
+  FormControl,
+  FormField,
+  FormItem,
+  FormLabel,
+  FormMessage,
+} from '../../../components/Form/Form';
+import { Input } from '@/components/Input/Input';
+import { registerAccount } from '@/api/apiFunctions';
+import { toast } from 'react-hot-toast';
+import { useAuthContext } from '@/context/AuthContextProvider';
+import { useRouter } from 'next/navigation';
+import { z } from 'zod';
+import { zodResolver } from '@hookform/resolvers/zod';
+import Alert from '@/components/AlertNotification/AlertNotification';
+import LinkCustom from '@/components/LinkCustom/LinkCustom';
+import Logo from '@/components/Logo/Logo';
+import logo from '/public/assets/logo-colored-outline.svg';
+import React, { JSX, useEffect, useState } from 'react';
+import LoadingSpinner from '@/components/LoadingSpinner/LoadingSpinner';
+
+const RegisterUserSchema = z
+  .object({
+    email: z
+      .string()
+      .min(1, { message: 'Please enter an email address' })
+      .email({ message: 'Please enter a valid email address' }),
+    password: z
+      .string()
+      .min(1, { message: 'Please enter a password' })
+      .min(8, { message: 'Password must be at least 8 characters' }),
+    confirmPassword: z
+      .string()
+      .min(1, { message: 'Please confirm your password' })
+      .min(8, { message: 'Password must be at least 8 characters' }),
+  })
+  .refine((data) => data.password === data.confirmPassword, {
+    message: "Passwords don't match",
+    path: ['confirmPassword'],
+  });
+
+type RegisterUserSchemaType = z.infer<typeof RegisterUserSchema>;
+
+/**
+ * Renders the registration page.
+ * @returns {JSX.Element} The rendered registration page.
+ */
+const Register = (): JSX.Element => {
+  const router = useRouter();
+  const { login, isSignedIn } = useAuthContext();
+  const [isLoading, setIsLoading] = useState(false);
+
+  useEffect(() => {
+    if (isSignedIn) {
+      router.push('/league/all');
+    }
+    // eslint-disable-next-line react-hooks/exhaustive-deps
+  }, [isSignedIn]);
+
+  const form = useForm<RegisterUserSchemaType>({
+    resolver: zodResolver(RegisterUserSchema),
+  });
+
+  /**
+   * The current value of the 'email' field in the form.
+   * @type {string}
+   */
+  const email: string = useWatch({
+    control: form.control,
+    name: 'email',
+    defaultValue: '',
+  });
+
+  /**
+   * The current value of the 'password' field in the form.
+   * @type {string}
+   */
+  const password: string = useWatch({
+    control: form.control,
+    name: 'password',
+    defaultValue: '',
+  });
+
+  /**
+   * The current value of the 'confirmPassword' field in the form.
+   * @type {string}
+   */
+  const confirmPassword: string = useWatch({
+    control: form.control,
+    name: 'confirmPassword',
+    defaultValue: '',
+  });
+
+  /**
+   * A function that handles form submission.
+   * @param {RegisterUserSchemaType} data - The data submitted in the form.
+   * @returns {Promise<void>} Promise that resolves after form submission is processed.
+   */
+  const onSubmit: SubmitHandler<RegisterUserSchemaType> = async (
+    data: RegisterUserSchemaType,
+  ): Promise<void> => {
+    try {
+      setIsLoading(true);
+      await registerAccount(data);
+      await login(data);
+      toast.custom(
+        <Alert
+          variant={AlertVariants.Success}
+          message="You have successfully registered your account."
+        />,
+      );
+    } catch (error) {
+      console.error('Registration Failed', error);
+      toast.custom(
+        <Alert variant={AlertVariants.Error} message="Something went wrong!" />,
+      );
+    } finally {
+      setIsLoading(false);
+    }
+  };
+
+  const isDisabled = !email || !password || password !== confirmPassword;
+
+  return (
+    <section className="grid xl:grid-cols-2 xl:grid-rows-none">
+      <div
+        data-testid="dark-mode-section"
+        className="row-span-1 grid w-full place-items-center from-[#4E160E] to-zinc-950 bg-gradient-to-b xl:h-screen xl:bg-gradient-to-b"
+      >
+        <Logo className="mx-auto w-52 xl:w-64 xl:place-self-end" src={logo} />
+        <div className="mx-auto grid gap-4 place-self-end px-8 pb-8 text-foreground">
+          <p className="hidden leading-7 xl:block">
+            Thank you... fantasy football draft, for letting me know that even
+            in my fantasies, I am bad at sports.
+          </p>
+          <p className="hidden leading-7 xl:block">Jimmy Fallon</p>
+        </div>
+      </div>
+      <div className="row-span-1 mx-auto grid max-w-sm justify-center space-y-4 px-4 xl:flex xl:flex-col">
+        <div>
+          <h1 className="text-5xl font-extrabold tracking-tight text-foreground">
+            Register A New Account
+          </h1>
+          <p className="pb-4 font-normal leading-7 text-muted-foreground">
+            If you have an existing account{' '}
+            <LinkCustom href="/login">Login!</LinkCustom>
+          </p>
+        </div>
+
+        <Form {...form}>
+          <form
+            id="input-container"
+            className="grid gap-3"
+            data-testid="register-form"
+            onSubmit={form.handleSubmit(onSubmit)}
+          >
+            <FormField
+              control={form.control as Control<object>}
+              name="email"
+              render={({ field }) => (
+                <FormItem>
+                  <FormLabel className="border-none px-0 py-0 pb-2 pl-1">
+                    Email
+                  </FormLabel>
+                  <FormControl>
+                    <Input
+                      data-testid="email"
+                      type="email"
+                      placeholder="Your email"
+                      {...field}
+                    />
+                  </FormControl>
+                  {form.formState.errors?.email && (
+                    <FormMessage>
+                      {form.formState.errors?.email.message}
+                    </FormMessage>
+                  )}
+                </FormItem>
+              )}
+            />
+            <FormField
+              control={form.control as Control<object>}
+              name="password"
+              render={({ field }) => (
+                <FormItem>
+                  <FormLabel className="border-none px-0 py-0 pb-2 pl-1">
+                    Password
+                  </FormLabel>
+                  <FormControl>
+                    <Input
+                      data-testid="password"
+                      type="password"
+                      placeholder="Your password"
+                      {...field}
+                    />
+                  </FormControl>
+                  {form.formState.errors?.password && (
+                    <FormMessage>
+                      {form.formState.errors?.password.message}
+                    </FormMessage>
+                  )}
+                </FormItem>
+              )}
+            />
+            <FormField
+              control={form.control as Control<object>}
+              name="confirmPassword"
+              render={({ field }) => (
+                <FormItem>
+                  <FormLabel className="border-none px-0 py-0 pb-2 pl-1">
+                    Confirm Password
+                  </FormLabel>
+                  <FormControl>
+                    <Input
+                      data-testid="confirm-password"
+                      type="password"
+                      placeholder="Confirm your password"
+                      {...field}
+                    />
+                  </FormControl>
+                  {form.formState.errors?.confirmPassword && (
+                    <FormMessage>
+                      {form.formState.errors?.confirmPassword.message}
+                    </FormMessage>
+                  )}
+                </FormItem>
+              )}
+            />
+
+            <Button
+              data-testid="continue-button"
+              label={
+                isLoading ? (
+                  <LoadingSpinner data-testid="loading-spinner" />
+                ) : (
+                  'Continue'
+                )
+              }
+              type="submit"
+              disabled={isDisabled}
+            />
+            <p className="pb-4 font-normal leading-7 text-muted-foreground">
+              <LinkCustom href="/login">Login</LinkCustom>
+              {' '} to get started playing.
+            </p>
+          </form>
+        </Form>
+      </div>
+    </section>
+  );
+};
+
+export default Register;
\ No newline at end of file
diff --git a/app/(main)/register/page.test.tsx b/app/(main)/register/page.test.tsx
index e03874c0..36d7d66a 100644
--- a/app/(main)/register/page.test.tsx
+++ b/app/(main)/register/page.test.tsx
@@ -5,7 +5,7 @@ import { render, screen, fireEvent, waitFor } from '@testing-library/react';
 import { toast } from 'react-hot-toast';
 import Alert from '@/components/AlertNotification/AlertNotification';
 import React, { useState as useStateMock } from 'react';
-import Register from './page';
+import RegisterPage from './page';
 
 const mockLogin = jest.fn();
 const mockPush = jest.fn();
@@ -57,7 +57,7 @@ describe('Register', () => {
       .spyOn(React, 'useState')
       .mockImplementation(() => [false, setIsLoading]);
 
-    render(<Register />);
+    render(<RegisterPage />);
 
     confirmPasswordInput = screen.getByTestId('confirm-password');
     continueButton = screen.getByTestId('continue-button');
@@ -98,7 +98,7 @@ describe('Register', () => {
   it('redirects to /league/all when the button is clicked', async () => {
     mockUseAuthContext.isSignedIn = true;
 
-    render(<Register />);
+    render(<RegisterPage />);
 
     await waitFor(() => {
       expect(mockPush).toHaveBeenCalledWith('/league/all');
@@ -177,7 +177,7 @@ describe('Register loading spinner', () => {
       setIsLoading,
     ]);
 
-    render(<Register />);
+    render(<RegisterPage />);
 
     await waitFor(() => {
       expect(screen.queryByTestId('loading-spinner')).toBeInTheDocument();
@@ -189,7 +189,7 @@ describe('Register loading spinner', () => {
       setIsLoading,
     ]);
 
-    render(<Register />);
+    render(<RegisterPage />);
 
     await waitFor(() => {
       expect(screen.queryByTestId('loading-spinner')).not.toBeInTheDocument();
diff --git a/app/(main)/register/page.tsx b/app/(main)/register/page.tsx
index 4d1b8e8d..32323ed3 100644
--- a/app/(main)/register/page.tsx
+++ b/app/(main)/register/page.tsx
@@ -1,248 +1,21 @@
 // Copyright (c) Gridiron Survivor.
 // Licensed under the MIT License.
 
-'use client';
-import { AlertVariants } from '@/components/AlertNotification/Alerts.enum';
-import { Button } from '@/components/Button/Button';
-import { Control, useForm, useWatch, SubmitHandler } from 'react-hook-form';
-import {
-  Form,
-  FormControl,
-  FormField,
-  FormItem,
-  FormMessage,
-} from '../../../components/Form/Form';
-import { Input } from '@/components/Input/Input';
-import { registerAccount } from '@/api/apiFunctions';
-import { toast } from 'react-hot-toast';
-import { useAuthContext } from '@/context/AuthContextProvider';
-import { useRouter } from 'next/navigation';
-import { z } from 'zod';
-import { zodResolver } from '@hookform/resolvers/zod';
-import Alert from '@/components/AlertNotification/AlertNotification';
-import LinkCustom from '@/components/LinkCustom/LinkCustom';
-import Logo from '@/components/Logo/Logo';
-import logo from '/public/assets/logo-colored-outline.svg';
-import React, { JSX, useEffect, useState } from 'react';
-import LoadingSpinner from '@/components/LoadingSpinner/LoadingSpinner';
+import { JSX } from 'react';
+import { Metadata } from 'next';
+import Register from './Register';
 
-const RegisterUserSchema = z
-  .object({
-    email: z
-      .string()
-      .min(1, { message: 'Please enter an email address' })
-      .email({ message: 'Please enter a valid email address' }),
-    password: z
-      .string()
-      .min(1, { message: 'Please enter a password' })
-      .min(8, { message: 'Password must be at least 8 characters' }),
-    confirmPassword: z
-      .string()
-      .min(1, { message: 'Please confirm your password' })
-      .min(8, { message: 'Password must be at least 8 characters' }),
-  })
-  .refine((data) => data.password === data.confirmPassword, {
-    message: "Passwords don't match",
-    path: ['confirmPassword'],
-  });
-
-type RegisterUserSchemaType = z.infer<typeof RegisterUserSchema>;
+export const metadata: Metadata = {
+  title: 'Registration | Gridiron Survivor',
+  description: 'Fantasy Football Survivor Pool',
+};
 
 /**
  * Renders the registration page.
  * @returns {JSX.Element} The rendered registration page.
  */
-const Register = (): JSX.Element => {
-  const router = useRouter();
-  const { login, isSignedIn } = useAuthContext();
-  const [isLoading, setIsLoading] = useState(false);
-
-  useEffect(() => {
-    if (isSignedIn) {
-      router.push('/league/all');
-    }
-    // eslint-disable-next-line react-hooks/exhaustive-deps
-  }, [isSignedIn]);
-
-  const form = useForm<RegisterUserSchemaType>({
-    resolver: zodResolver(RegisterUserSchema),
-  });
-
-  /**
-   * The current value of the 'email' field in the form.
-   * @type {string}
-   */
-  const email: string = useWatch({
-    control: form.control,
-    name: 'email',
-    defaultValue: '',
-  });
-
-  /**
-   * The current value of the 'password' field in the form.
-   * @type {string}
-   */
-  const password: string = useWatch({
-    control: form.control,
-    name: 'password',
-    defaultValue: '',
-  });
-
-  /**
-   * The current value of the 'confirmPassword' field in the form.
-   * @type {string}
-   */
-  const confirmPassword: string = useWatch({
-    control: form.control,
-    name: 'confirmPassword',
-    defaultValue: '',
-  });
-
-  /**
-   * A function that handles form submission.
-   * @param {RegisterUserSchemaType} data - The data submitted in the form.
-   * @returns {Promise<void>} Promise that resolves after form submission is processed.
-   */
-  const onSubmit: SubmitHandler<RegisterUserSchemaType> = async (
-    data: RegisterUserSchemaType,
-  ): Promise<void> => {
-    try {
-      setIsLoading(true);
-      await registerAccount(data);
-      await login(data);
-      toast.custom(
-        <Alert
-          variant={AlertVariants.Success}
-          message="You have successfully registered your account."
-        />,
-      );
-    } catch (error) {
-      console.error('Registration Failed', error);
-      toast.custom(
-        <Alert variant={AlertVariants.Error} message="Something went wrong!" />,
-      );
-    } finally {
-      setIsLoading(false);
-    }
-  };
-
-  const isDisabled = !email || !password || password !== confirmPassword;
-
-  return (
-    <section className="grid xl:grid-cols-2 xl:grid-rows-none">
-      <div
-        data-testid="dark-mode-section"
-        className="row-span-1 grid w-full place-items-center from-[#4E160E] to-zinc-950 bg-gradient-to-b xl:h-screen xl:bg-gradient-to-b"
-      >
-        <Logo className="mx-auto w-52 xl:w-64 xl:place-self-end" src={logo} />
-        <div className="mx-auto grid gap-4 place-self-end px-8 pb-8 text-foreground">
-          <p className="hidden leading-7 xl:block">
-            Thank you... fantasy football draft, for letting me know that even
-            in my fantasies, I am bad at sports.
-          </p>
-          <p className="hidden leading-7 xl:block">Jimmy Fallon</p>
-        </div>
-      </div>
-      <div className="row-span-1 mx-auto grid max-w-sm justify-center space-y-4 px-4 xl:flex xl:flex-col">
-        <div>
-          <h1 className="text-5xl font-extrabold tracking-tight text-foreground">
-            Register A New Account
-          </h1>
-          <p className="pb-4 font-normal leading-7 text-muted-foreground">
-            If you have an existing account{' '}
-            <LinkCustom href="/login">Login!</LinkCustom>
-          </p>
-        </div>
-
-        <Form {...form}>
-          <form
-            id="input-container"
-            className="grid gap-3"
-            data-testid="register-form"
-            onSubmit={form.handleSubmit(onSubmit)}
-          >
-            <FormField
-              control={form.control as Control<object>}
-              name="email"
-              render={({ field }) => (
-                <FormItem>
-                  <FormControl>
-                    <Input
-                      data-testid="email"
-                      type="email"
-                      placeholder="Email"
-                      {...field}
-                    />
-                  </FormControl>
-                  {form.formState.errors?.email && (
-                    <FormMessage>
-                      {form.formState.errors?.email.message}
-                    </FormMessage>
-                  )}
-                </FormItem>
-              )}
-            />
-            <FormField
-              control={form.control as Control<object>}
-              name="password"
-              render={({ field }) => (
-                <FormItem>
-                  <FormControl>
-                    <Input
-                      data-testid="password"
-                      type="password"
-                      placeholder="Password"
-                      {...field}
-                    />
-                  </FormControl>
-                  {form.formState.errors?.password && (
-                    <FormMessage>
-                      {form.formState.errors?.password.message}
-                    </FormMessage>
-                  )}
-                </FormItem>
-              )}
-            />
-            <FormField
-              control={form.control as Control<object>}
-              name="confirmPassword"
-              render={({ field }) => (
-                <FormItem>
-                  <FormControl>
-                    <Input
-                      data-testid="confirm-password"
-                      type="password"
-                      placeholder="Confirm Password"
-                      {...field}
-                    />
-                  </FormControl>
-                  {form.formState.errors?.confirmPassword && (
-                    <FormMessage>
-                      {form.formState.errors?.confirmPassword.message}
-                    </FormMessage>
-                  )}
-                </FormItem>
-              )}
-            />
-
-            <Button
-              data-testid="continue-button"
-              label={
-                isLoading ? (
-                  <LoadingSpinner data-testid="loading-spinner" />
-                ) : (
-                  'Continue'
-                )
-              }
-              type="submit"
-              disabled={isDisabled}
-            />
-            <LinkCustom href="/login">Login to get started playing</LinkCustom>
-          </form>
-        </Form>
-      </div>
-    </section>
-  );
+const RegisterPage = (): JSX.Element => {
+  return <Register />;
 };
-
-export default Register;
+  
+export default RegisterPage;
\ No newline at end of file
diff --git a/components/Label/Label.test.tsx b/components/Label/Label.test.tsx
new file mode 100644
index 00000000..c9c77800
--- /dev/null
+++ b/components/Label/Label.test.tsx
@@ -0,0 +1,40 @@
+import React from 'react';
+import { render, screen } from '@testing-library/react';
+import { Label } from './Label'; 
+
+describe('Label', () => {
+  const disabledVariants = [true, false]; 
+
+  disabledVariants.forEach((disabled) => {
+    it(`renders correctly when disabled is ${disabled}`, () => {
+      render(
+        <Label data-testid="test-label" disabled={disabled}>
+          Test Label
+        </Label>
+      );
+
+      const label = screen.getByTestId('test-label');
+      expect(label).toBeInTheDocument();
+
+      const expectedClass = disabled ? 'opacity-50 cursor-not-allowed' : 'peer-aria-checked:border-accent peer-hover:border-white';
+      expect(label).toHaveClass(expectedClass);
+    });
+  });
+
+  it('applies additional custom classes correctly', () => {
+    const extraClasses = 'custom-class-label extra-custom-class';
+    render(
+      <Label
+        data-testid="custom-class-label"
+        className={extraClasses}
+      >
+        Custom Test Label
+      </Label>
+    );
+
+    const labelCustom = screen.getByTestId('custom-class-label');
+    expect(labelCustom).toBeInTheDocument();
+    expect(labelCustom).toHaveClass(extraClasses);
+  });
+});
+

From a267371079408d8e4c55521d8a2f85a0f9078390 Mon Sep 17 00:00:00 2001
From: Chris Nowicki <102450568+chris-nowicki@users.noreply.github.com>
Date: Wed, 23 Oct 2024 16:03:32 -0400
Subject: [PATCH 3/4] chris/feat(#381): Implement User Role Access (#458)

fixes #381

Added access for SUPER ADMINS only. This has to be a field added in the
database manually under the user > labels data field. This should only
apply to GIS Developers.

## VIDEO


https://github.com/user-attachments/assets/d65b83ce-4ef4-41d5-a2f9-30f55547ebfb

---------

Co-authored-by: Shashi Lo <362527+shashilo@users.noreply.github.com>
---
 api/apiFunctions.interface.ts                 | 10 +++++
 api/apiFunctions.ts                           |  5 ++-
 app/(main)/league/all/page.test.tsx           |  7 ++++
 app/(main)/league/all/page.tsx                | 11 ++++--
 .../UpdateEmailForm/UpdateEmailForm.tsx       |  2 +-
 context/AuthContextProvider.tsx               | 38 ++++++++++++-------
 store/dataStore.test.ts                       |  7 ++++
 store/dataStore.ts                            |  5 ++-
 utils/utils.test.ts                           | 28 ++++++++++++++
 utils/utils.ts                                | 19 ++++++++++
 10 files changed, 112 insertions(+), 20 deletions(-)

diff --git a/api/apiFunctions.interface.ts b/api/apiFunctions.interface.ts
index ed8352ba..e5d1f6fb 100644
--- a/api/apiFunctions.interface.ts
+++ b/api/apiFunctions.interface.ts
@@ -9,6 +9,16 @@ export interface IAccountData {
 }
 export interface IUser {
   documentId: string;
+  // for the appwrite auth collection
+  id: string;
+  email: string;
+  leagues: string[];
+  labels: string[];
+}
+
+export interface ICollectionUser {
+  documentId: string;
+  // for the custom user collection
   id: string;
   email: string;
   leagues: string[];
diff --git a/api/apiFunctions.ts b/api/apiFunctions.ts
index 93041dd3..2f3b072d 100644
--- a/api/apiFunctions.ts
+++ b/api/apiFunctions.ts
@@ -8,6 +8,7 @@ import {
   ILeague,
   IGameWeek,
   IUser,
+  ICollectionUser,
   IWeeklyPicks,
   INFLTeam,
   IRecoveryToken,
@@ -149,7 +150,9 @@ export async function updateUserEmail({
  * @param userId - The user ID
  * @returns {Models.DocumentList<Models.Document> | Error} - The user object or an error
  */
-export async function getCurrentUser(userId: IUser['id']): Promise<IUser> {
+export async function getCurrentUser(
+  userId: IUser['id'],
+): Promise<ICollectionUser> {
   try {
     const user = await databases.listDocuments(
       appwriteConfig.databaseId,
diff --git a/app/(main)/league/all/page.test.tsx b/app/(main)/league/all/page.test.tsx
index b1a783c8..8625ee47 100644
--- a/app/(main)/league/all/page.test.tsx
+++ b/app/(main)/league/all/page.test.tsx
@@ -32,6 +32,7 @@ jest.mock('@/store/dataStore', () => ({
       id: '1234',
       email: 'test@test.com',
       leagues: ['league1'],
+      labels: [],
     },
     allLeagues: [
       {
@@ -82,6 +83,7 @@ describe('Leagues Component', () => {
         leagues: [],
       },
       allLeagues: [],
+      labels: [],
     });
 
     render(<Leagues />);
@@ -105,6 +107,7 @@ describe('Leagues Component', () => {
         leagues: [],
       },
       allLeagues: [],
+      labels: [],
     });
 
     render(<Leagues />);
@@ -121,6 +124,7 @@ describe('Leagues Component', () => {
         email: 'test@test.com',
         id: '123',
         leagues: [],
+        labels: [],
       },
       allLeagues: [
         {
@@ -150,6 +154,7 @@ describe('Leagues Component', () => {
       email: 'test@test.com',
       id: '123',
       leagues: [],
+      labels: [],
     };
 
     const league = {
@@ -202,6 +207,7 @@ describe('Leagues Component', () => {
         user.id,
         user.email,
         [...user.leagues, league.leagueId],
+        user.labels,
       );
       expect(toast.custom).toHaveBeenCalledWith(
         <Alert
@@ -220,6 +226,7 @@ describe('Leagues Component', () => {
       email: 'test@test.com',
       id: '123',
       leagues: [],
+      labels: [],
     };
 
     const league = {
diff --git a/app/(main)/league/all/page.tsx b/app/(main)/league/all/page.tsx
index 56c04323..8e8a77de 100644
--- a/app/(main)/league/all/page.tsx
+++ b/app/(main)/league/all/page.tsx
@@ -100,10 +100,13 @@ const Leagues = (): JSX.Element => {
       });
 
       setLeagues([...leagues, league]);
-      updateUser(user.documentId, user.id, user.email, [
-        ...user.leagues,
-        league.leagueId,
-      ]);
+      updateUser(
+        user.documentId,
+        user.id,
+        user.email,
+        [...user.leagues, league.leagueId],
+        user.labels,
+      );
       toast.custom(
         <Alert
           variant={AlertVariants.Success}
diff --git a/components/UpdateEmailForm/UpdateEmailForm.tsx b/components/UpdateEmailForm/UpdateEmailForm.tsx
index 9348519c..c1316d89 100644
--- a/components/UpdateEmailForm/UpdateEmailForm.tsx
+++ b/components/UpdateEmailForm/UpdateEmailForm.tsx
@@ -82,7 +82,7 @@ const UpdateEmailForm = (): JSX.Element => {
         />,
       );
 
-      updateUser(user.documentId, user.id, email, user.leagues);
+      updateUser(user.documentId, user.id, email, user.leagues, user.labels);
       form.reset({ email: email || '', password: '' });
     } catch (error) {
       console.error('Email Update Failed', error);
diff --git a/context/AuthContextProvider.tsx b/context/AuthContextProvider.tsx
index d607d6b0..eb1adb9b 100644
--- a/context/AuthContextProvider.tsx
+++ b/context/AuthContextProvider.tsx
@@ -8,10 +8,11 @@ import { account } from '@/api/config';
 import { useRouter } from 'next/navigation';
 import { useDataStore } from '@/store/dataStore';
 import type { DataStore } from '@/store/dataStore';
-import { IUser } from '@/api/apiFunctions.interface';
+import { ICollectionUser, IUser } from '@/api/apiFunctions.interface';
 import { getCurrentUser } from '@/api/apiFunctions';
 import { loginAccount, logoutHandler } from './AuthHelper';
 import { usePathname } from 'next/navigation';
+import { isAuthRequiredPath } from '@/utils/utils';
 
 type UserCredentials = {
   email: string;
@@ -50,8 +51,12 @@ export const AuthContextProvider = ({
       getUser();
       return;
     }
+
     setIsSignedIn(true);
-  }, [user]);
+    if (pathname.startsWith('/admin')) {
+      !user.labels.includes('admin') && router.push('/');
+    }
+  }, [user, pathname]);
 
   /**
    * Authenticate and set session state
@@ -81,11 +86,7 @@ export const AuthContextProvider = ({
    */
   const getUser = async (): Promise<IUser | undefined> => {
     if (!isSessionInLocalStorage()) {
-      if (
-        pathname !== '/register' &&
-        pathname !== '/account/recovery' &&
-        pathname !== '/recover-password'
-      ) {
+      if (isAuthRequiredPath(pathname)) {
         router.push('/login');
       }
       return;
@@ -93,14 +94,25 @@ export const AuthContextProvider = ({
 
     try {
       const user = await account.get();
-      const userData: IUser = await getCurrentUser(user.$id);
+      const userData: ICollectionUser = await getCurrentUser(user.$id);
+
+      const currentUser: IUser = {
+        documentId: userData.documentId,
+        id: userData.id,
+        email: userData.email,
+        leagues: userData.leagues,
+        labels: user.labels,
+      };
+
       updateUser(
-        userData.documentId,
-        userData.id,
-        userData.email,
-        userData.leagues,
+        currentUser.documentId,
+        currentUser.id,
+        currentUser.email,
+        currentUser.leagues,
+        user.labels,
       );
-      return userData;
+
+      return currentUser;
     } catch (error) {
       resetUser();
       setIsSignedIn(false);
diff --git a/store/dataStore.test.ts b/store/dataStore.test.ts
index ab4f9acf..d3012f1f 100644
--- a/store/dataStore.test.ts
+++ b/store/dataStore.test.ts
@@ -7,6 +7,7 @@ const userData = {
   id: '123',
   email: 'test@email.com',
   leagues: ['123456'],
+  labels: ['admin'],
 };
 
 const NFLTeams = [
@@ -61,11 +62,14 @@ describe('Data Store', () => {
           userData.userId,
           userData.userEmail,
           userData.leagues,
+          userData.labels,
         );
       });
 
       expect(result.current.user.id).toBe(userData.userId);
       expect(result.current.user.email).toBe(userData.userEmail);
+      expect(result.current.user.labels).toStrictEqual(userData.labels);
+      expect(result.current.user.leagues).toStrictEqual(userData.leagues);
     });
     it('Checks the reset user state matches default', () => {
       const { result } = renderHook(() => useDataStore());
@@ -76,12 +80,15 @@ describe('Data Store', () => {
           userData.userId,
           userData.userEmail,
           userData.leagues,
+          userData.labels,
         );
         result.current.resetUser();
       });
 
       expect(result.current.user.id).toBe('');
       expect(result.current.user.email).toBe('');
+      expect(result.current.user.labels).toStrictEqual([]);
+      expect(result.current.user.leagues).toStrictEqual([]);
     });
   });
 
diff --git a/store/dataStore.ts b/store/dataStore.ts
index 1acc84e5..e0cef710 100644
--- a/store/dataStore.ts
+++ b/store/dataStore.ts
@@ -34,6 +34,7 @@ interface IDataStoreAction {
     id: IUser['id'],
     email: IUser['email'],
     leagues: IUser['leagues'],
+    labels: IUser['labels'],
   ) => void;
   updateWeeklyPicks: ({
     leagueId,
@@ -63,6 +64,7 @@ const initialState: IDataStoreState = {
     id: '',
     email: '',
     leagues: [],
+    labels: [],
   },
   weeklyPicks: {
     leagueId: '',
@@ -111,13 +113,14 @@ export const useDataStore = create<DataStore>((set) => ({
    * @param selectedLeagues - The user selected league
    * @returns {void}
    */
-  updateUser: (documentId, id, email, leagues): void =>
+  updateUser: (documentId, id, email, leagues, labels): void =>
     set(
       produce((state: IDataStoreState) => {
         state.user.documentId = documentId;
         state.user.id = id;
         state.user.email = email;
         state.user.leagues = [...leagues];
+        state.user.labels = [...labels];
       }),
     ),
   /**
diff --git a/utils/utils.test.ts b/utils/utils.test.ts
index 408a3b89..1c471924 100644
--- a/utils/utils.test.ts
+++ b/utils/utils.test.ts
@@ -5,6 +5,7 @@ import {
   getUserPick,
   parseUserPick,
   getUserLeagues,
+  isAuthRequiredPath,
 } from './utils';
 import { getCurrentLeague, getAllWeeklyPicks } from '@/api/apiFunctions';
 
@@ -179,6 +180,33 @@ describe('utils', () => {
       });
     });
   });
+  describe('isAuthRequiredPath', () => {
+    it('should return false for non-auth paths', () => {
+      expect(isAuthRequiredPath('/register')).toBe(false);
+      expect(isAuthRequiredPath('/account/recovery')).toBe(false);
+      expect(isAuthRequiredPath('/recover-password')).toBe(false);
+    });
+
+    it('should return true for auth-required paths', () => {
+      expect(isAuthRequiredPath('/')).toBe(true);
+      expect(isAuthRequiredPath('/dashboard')).toBe(true);
+      expect(isAuthRequiredPath('/profile')).toBe(true);
+      expect(isAuthRequiredPath('/settings')).toBe(true);
+    });
+
+    it('should handle edge cases', () => {
+      expect(isAuthRequiredPath('')).toBe(true);
+      expect(isAuthRequiredPath('/register/')).toBe(true); // Trailing slash
+      expect(isAuthRequiredPath('/REGISTER')).toBe(true); // Case sensitivity
+      expect(isAuthRequiredPath('/register/subpage')).toBe(true);
+    });
+
+    it('should handle unusual inputs', () => {
+      expect(isAuthRequiredPath('   /register   ')).toBe(true); // Spaces
+      expect(isAuthRequiredPath('/account/recovery?param=value')).toBe(true); // Query parameters
+    });
+  });
+
   xdescribe('getUserLeagues', () => {
     it('should return the list of leagues the user is a part of', async () => {
       (getCurrentLeague as jest.Mock).mockResolvedValue(mockLeague);
diff --git a/utils/utils.ts b/utils/utils.ts
index 51aee08e..ca28a1da 100644
--- a/utils/utils.ts
+++ b/utils/utils.ts
@@ -147,6 +147,15 @@ export const getUserEntries = async (userId: IUser['id'], leagueId: ILeague['lea
   return await getCurrentUserEntries(userId, leagueId);
 }
 
+/**
+ * Check if the route is an /admin route
+ * @param path - The path to check
+ * @returns {boolean} - Whether the route is an /admin route
+ */
+export const isAdminRoute = (path: string): boolean => {
+  return path.startsWith('/admin');
+};
+
 /**
  * Returns if the team has already been picked by the user
  * @param teamName - The team name
@@ -167,3 +176,13 @@ export const hasTeamBeenPicked = (teamName: string, selectedTeams: string[]): bo
 export const getNFLTeamLogo = (NFLTeams: INFLTeam[], teamName: string): string => {
   return NFLTeams.find((teams) => teams.teamName === teamName)?.teamLogo as string;
 }
+
+/**
+ * Checks if the current path requires authentication
+ * @param pathname - The current path
+ * @returns {boolean} - Whether the current path requires authentication
+ */
+export const isAuthRequiredPath = (pathname: string): boolean => {
+  const nonAuthPaths = ['/register', '/account/recovery', '/recover-password'];
+  return !nonAuthPaths.includes(pathname);
+};

From 0ac4e38ad54a26d4181a99da01dffc9bd1a80ce7 Mon Sep 17 00:00:00 2001
From: Danielle Lindblom <114356705+Danielle254@users.noreply.github.com>
Date: Fri, 25 Oct 2024 10:23:43 -0600
Subject: [PATCH 4/4] Danielle/535 add current entry number in header of entry
 page (#615)

Before: no entry number in header of entry page

![535
before](https://github.com/user-attachments/assets/ad0a82b4-3a6c-48b5-baaf-221387f90f31)


After: entry number added to header of entry page

![option
2](https://github.com/user-attachments/assets/dcf0a828-c7b5-4d2d-9759-fb4e70d69d4d)


- Updated existing h1 to `<Heading/>` component
- Retrieved entry name (Entry 1, 2, etc)
- Rendered entry name as `<Heading/>` component

Color is up for debate as is spacing.
---
 .../entry/[entryId]/week/Week.test.tsx        |  2 ++
 .../[leagueId]/entry/[entryId]/week/Week.tsx  | 21 ++++++++++++++-----
 2 files changed, 18 insertions(+), 5 deletions(-)

diff --git a/app/(main)/league/[leagueId]/entry/[entryId]/week/Week.test.tsx b/app/(main)/league/[leagueId]/entry/[entryId]/week/Week.test.tsx
index 78b69c1d..516631f6 100644
--- a/app/(main)/league/[leagueId]/entry/[entryId]/week/Week.test.tsx
+++ b/app/(main)/league/[leagueId]/entry/[entryId]/week/Week.test.tsx
@@ -186,6 +186,8 @@ describe('League Week Picks', () => {
     // Wait for the main content to be displayed
     await waitFor(() => {
       expect(screen.getByTestId('weekly-picks')).toBeInTheDocument();
+      expect(screen.getByTestId('week__week-number')).toHaveTextContent('Week 1');
+      expect(screen.getByTestId('week__entry-name')).toHaveTextContent('Entry 1');
     });
 
     expect(screen.queryByTestId('global-spinner')).not.toBeInTheDocument();
diff --git a/app/(main)/league/[leagueId]/entry/[entryId]/week/Week.tsx b/app/(main)/league/[leagueId]/entry/[entryId]/week/Week.tsx
index cfbbf965..6edab010 100644
--- a/app/(main)/league/[leagueId]/entry/[entryId]/week/Week.tsx
+++ b/app/(main)/league/[leagueId]/entry/[entryId]/week/Week.tsx
@@ -34,6 +34,7 @@ import Image from 'next/image';
 import { useRouter } from 'next/navigation';
 import LinkCustom from '@/components/LinkCustom/LinkCustom';
 import { ChevronLeft } from 'lucide-react';
+import Heading from '@/components/Heading/Heading';
 
 /**
  * Renders the weekly picks page.
@@ -43,6 +44,7 @@ import { ChevronLeft } from 'lucide-react';
 // eslint-disable-next-line no-unused-vars
 const Week = ({ entry, league, NFLTeams, week }: IWeekProps): JSX.Element => {
   const [pickHistory, setPickHistory] = useState<string[]>([]);
+  const [entryName, setEntryName] = useState<string>('');
   const [error, setError] = useState<string | null>(null);
   const [schedule, setSchedule] = useState<ISchedule[]>([]);
   const [selectedLeague, setSelectedLeague] = useState<ILeague | undefined>();
@@ -156,7 +158,8 @@ const Week = ({ entry, league, NFLTeams, week }: IWeekProps): JSX.Element => {
       if (!currentEntry) {
         throw new Error('Entry not found');
       }
-
+      
+      setEntryName(currentEntry.name);
       let entryHistory = currentEntry?.selectedTeams || [];
 
       if (currentEntry?.selectedTeams.length > 0) {
@@ -271,10 +274,18 @@ const Week = ({ entry, league, NFLTeams, week }: IWeekProps): JSX.Element => {
             className="flex flex-col items-center w-full pt-8"
             data-testid="weekly-picks"
           >
-            <h1 className="pb-8 text-center text-[2rem] font-bold text-foreground">
-              Week {week} pick
-            </h1>
-
+            <Heading 
+              as='h1'
+              className='pb-8'
+              data-testid='week__week-number'
+            >{`Week ${week} pick`}
+            </Heading>
+            <Heading
+              as='h2'
+              className='pb-8 text-muted-foreground'
+              data-testid='week__entry-name'
+            >{entryName}
+            </Heading>
             {pickHistory.length > 0 && (
               <section
                 className="flex flex-wrap w-[90%] gap-4 overflow-x-scroll justify-center pb-10 items-center"