release: v0.50.5 (#296)

* fix: Clear tanstack query cache after logging out (#294) * fix(ui): Add checkbox to accept terms and conditions (#295) * fix(ui): Add checkbox for students to accept terms and conditions * test: Mark terms and conditions checkbox on tests
upb-code-labs · Feb 23, 2024 · 06c70a1 · 06c70a1
1 parent 1985d8b
commit 06c70a1
Show file tree

Hide file tree

Showing 11 changed files with 137 additions and 19 deletions.
diff --git a/CHANGELOG.md b/CHANGELOG.md
@@ -1,45 +1,45 @@
-## [0.50.3](https://github.com/upb-code-labs/react-client/compare/v0.50.2...v0.50.3) (2024-02-15)
+## [0.50.5](https://github.com/upb-code-labs/react-client/compare/v0.50.4...v0.50.5) (2024-02-23)
 
 
 ### Bug Fixes
 
-* Close mobile navbar when clicking blur layer ([#289](https://github.com/upb-code-labs/react-client/issues/289)) ([bf34b03](https://github.com/upb-code-labs/react-client/commit/bf34b03d480d1e80c0160113a0718c5ad5da7154))
+* **ui:** Add checkbox to accept terms and conditions ([#295](https://github.com/upb-code-labs/react-client/issues/295)) ([f4908ff](https://github.com/upb-code-labs/react-client/commit/f4908ff9b867a084b943f8d526c3400cad391d3a))
 
 
 
-## [0.50.2](https://github.com/upb-code-labs/react-client/compare/v0.50.1...v0.50.2) (2024-02-08)
+## [0.50.4](https://github.com/upb-code-labs/react-client/compare/v0.50.3...v0.50.4) (2024-02-23)
 
 
 ### Bug Fixes
 
-* Show confirmation dialog when deleting laboratory blocks ([#285](https://github.com/upb-code-labs/react-client/issues/285)) ([82bd210](https://github.com/upb-code-labs/react-client/commit/82bd210f5eeaec4c96a6bb476f1d0f95e8504e76))
+* Clear tanstack query cache after logging out ([#294](https://github.com/upb-code-labs/react-client/issues/294)) ([dbdd158](https://github.com/upb-code-labs/react-client/commit/dbdd15876ab08a5282b411db42dd4db5464b71cf))
 
 
 
-## [0.50.1](https://github.com/upb-code-labs/react-client/compare/v0.50.0...v0.50.1) (2024-02-06)
+## [0.50.3](https://github.com/upb-code-labs/react-client/compare/v0.50.2...v0.50.3) (2024-02-15)
 
 
 ### Bug Fixes
 
-* **perf:** Improve code splitting ([#282](https://github.com/upb-code-labs/react-client/issues/282)) ([48f2d4d](https://github.com/upb-code-labs/react-client/commit/48f2d4d4cd93b3cc46d00835d72773b4581926ad))
+* Close mobile navbar when clicking blur layer ([#289](https://github.com/upb-code-labs/react-client/issues/289)) ([bf34b03](https://github.com/upb-code-labs/react-client/commit/bf34b03d480d1e80c0160113a0718c5ad5da7154))
 
 
 
-# [0.50.0](https://github.com/upb-code-labs/react-client/compare/v0.49.1...v0.50.0) (2024-02-02)
+## [0.50.2](https://github.com/upb-code-labs/react-client/compare/v0.50.1...v0.50.2) (2024-02-08)
 
 
-### Features
+### Bug Fixes
 
-* Add update button to the students' progress bar chart ([be78362](https://github.com/upb-code-labs/react-client/commit/be7836290c19cffc562bf324614d8022711d5571))
+* Show confirmation dialog when deleting laboratory blocks ([#285](https://github.com/upb-code-labs/react-client/issues/285)) ([82bd210](https://github.com/upb-code-labs/react-client/commit/82bd210f5eeaec4c96a6bb476f1d0f95e8504e76))
 
 
 
-## [0.49.1](https://github.com/upb-code-labs/react-client/compare/v0.49.0...v0.49.1) (2024-02-02)
+## [0.50.1](https://github.com/upb-code-labs/react-client/compare/v0.50.0...v0.50.1) (2024-02-06)
 
 
 ### Bug Fixes
 
-* **ui:** Change grading view to a one column layout ([#279](https://github.com/upb-code-labs/react-client/issues/279)) ([32bd57d](https://github.com/upb-code-labs/react-client/commit/32bd57db260a16b738b78341b2710f3306554fa4))
+* **perf:** Improve code splitting ([#282](https://github.com/upb-code-labs/react-client/issues/282)) ([48f2d4d](https://github.com/upb-code-labs/react-client/commit/48f2d4d4cd93b3cc46d00835d72773b4581926ad))
 
 
 
diff --git a/e2e/courses/EnrollStudent.spec.ts b/e2e/courses/EnrollStudent.spec.ts
@@ -57,6 +57,7 @@ test.describe.serial("Enroll student workflow", () => {
     await page.getByLabel("Institutional ID").fill(studentInstitutionalID);
     await page.getByLabel("Email").fill(studentEmail);
     await page.getByLabel("Password").fill(studentPassword);
+    await page.getByLabel("Accept terms and conditions").check();
     await page.getByRole("button", { name: "Submit" }).click();
   });
 

diff --git a/e2e/courses/JoinCourse.spec.ts b/e2e/courses/JoinCourse.spec.ts
@@ -142,7 +142,7 @@ test.describe.serial("Join courses workflow", () => {
     await page.getByLabel("Institutional ID").fill(studentInstitutionalID);
     await page.getByLabel("Email").fill(studentEmail);
     await page.getByLabel("Password").fill(studentPassword);
-
+    await page.getByLabel("Accept terms and conditions").check();
     await page.getByRole("button", { name: "Submit" }).click();
     await page.waitForURL(/\/login$/);
   });

diff --git a/e2e/grades/grades-workflow.spec.ts b/e2e/grades/grades-workflow.spec.ts
@@ -49,6 +49,7 @@ test.describe.serial("Grades workflow", () => {
     await page.getByLabel("Institutional ID").fill(getRandomUniversityID());
     await page.getByLabel("Email").fill(studentEmail);
     await page.getByLabel("Password").fill(getDefaultPassword());
+    await page.getByLabel("Accept terms and conditions").check();
     await page.getByRole("button", { name: "Submit" }).click();
   });
 

diff --git a/e2e/register/RegisterStudents.spec.ts b/e2e/register/RegisterStudents.spec.ts
@@ -25,6 +25,11 @@ test("The fields are validated", async ({ page }) => {
       "Must contain at least one letter, one number and one special character"
     )
   ).toBeVisible();
+  await expect(
+    page.getByText(
+      "You can't register without accepting the terms and conditions"
+    )
+  ).toBeVisible();
 });
 
 test.describe.serial("Student registration", () => {
@@ -38,6 +43,7 @@ test.describe.serial("Student registration", () => {
     await page.getByLabel("Email").fill(newStudentEmail);
     await page.getByLabel("Institutional ID").fill(newStudentID);
     await page.getByLabel("Password").fill(getDefaultPassword());
+    await page.getByLabel("Accept terms and conditions").check();
     await page.getByRole("button", { name: "Submit" }).click();
 
     await expect(
@@ -53,6 +59,7 @@ test.describe.serial("Student registration", () => {
     await page.getByLabel("Email").fill(newStudentEmail);
     await page.getByLabel("Institutional ID").fill(getRandomUniversityID());
     await page.getByLabel("Password").fill(getDefaultPassword());
+    await page.getByLabel("Accept terms and conditions").check();
     await page.getByRole("button", { name: "Submit" }).click();
 
     await expect(
@@ -69,6 +76,7 @@ test.describe.serial("Student registration", () => {
     await page.getByLabel("Email").fill(getRandomEmail());
     await page.getByLabel("Institutional ID").fill(newStudentID);
     await page.getByLabel("Password").fill(getDefaultPassword());
+    await page.getByLabel("Accept terms and conditions").check();
     await page.getByRole("button", { name: "Submit" }).click();
 
     await expect(

diff --git a/package.json b/package.json
@@ -1,7 +1,7 @@
 {
   "name": "react-client",
   "private": true,
-  "version": "0.50.3",
+  "version": "0.50.5",
   "type": "module",
   "scripts": {
     "dev": "vite",
@@ -18,6 +18,7 @@
   "dependencies": {
     "@hookform/resolvers": "3.3.4",
     "@radix-ui/react-alert-dialog": "1.0.5",
+    "@radix-ui/react-checkbox": "^1.0.4",
     "@radix-ui/react-dialog": "1.0.5",
     "@radix-ui/react-dropdown-menu": "2.0.6",
     "@radix-ui/react-label": "2.0.2",

diff --git a/pnpm-lock.yaml b/pnpm-lock.yaml
diff --git a/src/components/ui/checkbox.tsx b/src/components/ui/checkbox.tsx
@@ -0,0 +1,27 @@
+import { cn } from "@/lib/utils";
+import * as CheckboxPrimitive from "@radix-ui/react-checkbox";
+import { Check } from "lucide-react";
+import * as React from "react";
+
+const Checkbox = React.forwardRef<
+  React.ElementRef<typeof CheckboxPrimitive.Root>,
+  React.ComponentPropsWithoutRef<typeof CheckboxPrimitive.Root>
+>(({ className, ...props }, ref) => (
+  <CheckboxPrimitive.Root
+    ref={ref}
+    className={cn(
+      "peer h-4 w-4 shrink-0 rounded-sm border border-primary ring-offset-background focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-offset-2 disabled:cursor-not-allowed disabled:opacity-50 data-[state=checked]:bg-primary data-[state=checked]:text-primary-foreground",
+      className
+    )}
+    {...props}
+  >
+    <CheckboxPrimitive.Indicator
+      className={cn("flex items-center justify-center text-current")}
+    >
+      <Check className="h-4 w-4" />
+    </CheckboxPrimitive.Indicator>
+  </CheckboxPrimitive.Root>
+));
+Checkbox.displayName = CheckboxPrimitive.Root.displayName;
+
+export { Checkbox };
diff --git a/src/hooks/useSession.tsx b/src/hooks/useSession.tsx
@@ -1,4 +1,5 @@
 import { whoamiService } from "@/services/session/whoami.service";
+import { useQueryClient } from "@tanstack/react-query";
 import { useEffect, useState } from "react";
 
 export type SessionRole = "admin" | "student" | "teacher";
@@ -39,8 +40,13 @@ export const useSession = () => {
     setUser(user);
   };
 
+  const queryClient = useQueryClient();
   const logout = () => {
+    // Remove user from state
     setUser(null);
+
+    // Clear the cache to prevent showing other user's data
+    queryClient.clear();
   };
 
   return {

diff --git a/src/main.tsx b/src/main.tsx
@@ -100,8 +100,8 @@ const queryClient = new QueryClient({
 });
 
 ReactDOM.createRoot(document.getElementById("root")!).render(
-  <AuthContextProvider>
-    <QueryClientProvider client={queryClient}>
+  <QueryClientProvider client={queryClient}>
+    <AuthContextProvider>
       <BrowserRouter>
         <Toaster expand closeButton richColors />
         <Navbar />
@@ -300,6 +300,6 @@ ReactDOM.createRoot(document.getElementById("root")!).render(
         <Footer />
       </BrowserRouter>
       <ReactQueryDevtools initialIsOpen={false} buttonPosition="bottom-right" />
-    </QueryClientProvider>
-  </AuthContextProvider>
+    </AuthContextProvider>
+  </QueryClientProvider>
 );
diff --git a/src/screens/session/register-student/Form.tsx b/src/screens/session/register-student/Form.tsx
@@ -1,4 +1,5 @@
 import { Button } from "@/components/ui/button";
+import { Checkbox } from "@/components/ui/checkbox";
 import {
   Form,
   FormControl,
@@ -30,7 +31,10 @@ const RegisterStudentSchema = z.object({
     .regex(
       /^(?=.*[A-Za-z])(?=.*\d)(?=.*[!@#$%^&*()_+\-=[\]{};':"\\|,.<>/?])[A-Za-z\d[!@#$%^&*()_+\-=[\]{};':"\\|,.<>/?]{8,}$/,
       "Must contain at least one letter, one number and one special character"
-    )
+    ),
+  accept_terms: z.boolean().refine((value) => !!value, {
+    message: "You can't register without accepting the terms and conditions"
+  })
 });
 
 export const RegisterStudentForm = () => {
@@ -43,7 +47,8 @@ export const RegisterStudentForm = () => {
       full_name: "",
       email: "",
       institutional_id: "",
-      password: ""
+      password: "",
+      accept_terms: false
     }
   });
 
@@ -144,6 +149,44 @@ export const RegisterStudentForm = () => {
             </FormItem>
           )}
         ></FormField>
+        <FormField
+          control={form.control}
+          name="accept_terms"
+          render={({ field }) => (
+            <FormItem>
+              <div className="items-top flex space-x-2">
+                <FormControl>
+                  <Checkbox
+                    id="terms1"
+                    checked={field.value}
+                    onCheckedChange={() => field.onChange(!field.value)}
+                  />
+                </FormControl>
+                <div className="grid space-y-1.5">
+                  <FormLabel htmlFor="terms1">
+                    Accept terms and conditions
+                  </FormLabel>
+                  <p className="text-sm text-muted-foreground">
+                    By checking this box, you agree to{" "}
+                    <a
+                      href="/POLITICA_TRATAMIENTO_INFORMACION_PROTECCION_DATOS_PERSONALES.pdf"
+                      target="_blank"
+                      rel="noreferrer,noopener"
+                      className="text-red-upb underline"
+                    >
+                      our terms and conditions.
+                    </a>
+                  </p>
+                </div>
+              </div>
+              {form.formState.errors.accept_terms && (
+                <FormMessage>
+                  {form.formState.errors.accept_terms.message}
+                </FormMessage>
+              )}
+            </FormItem>
+          )}
+        ></FormField>
         <Button
           type="submit"
           className="w-full"