feat: update data and dependencies

Bro3Simon · Dec 14, 2023 · 9bf50c1 · 9bf50c1
1 parent 04ef6e0
commit 9bf50c1
Show file tree

Hide file tree

Showing 20 changed files with 1,112 additions and 1,027 deletions.
diff --git a/app/components/ClientWork/index.ts b/app/components/ClientWork/index.ts
diff --git a/...components/ClientWork/ClientWork.test.tsx → ...onents/ExternalWork/ExternalWork.test.tsx b/...components/ClientWork/ClientWork.test.tsx → ...onents/ExternalWork/ExternalWork.test.tsx
@@ -1,38 +1,38 @@
 import { render, screen } from "@testing-library/react";
 import { userEvent } from "@testing-library/user-event";
 
-import { ClientWork } from "app/components/ClientWork/ClientWork";
-import { CLIENT_WORK } from "app/data/clientWork";
+import { ExternalWork } from "app/components/ExternalWork/ExternalWork";
+import { EXTERNAL_WORK } from "app/data/externalWork";
 
-describe("test ClientWork", () => {
+describe("test ExternalWork", () => {
   test("renders all the tabs with the correct label", () => {
-    render(<ClientWork />);
+    render(<ExternalWork />);
 
-    CLIENT_WORK.forEach(({ name }) => {
+    EXTERNAL_WORK.forEach(({ name }) => {
       expect(screen.getByRole("tab", { name })).toBeInTheDocument();
     });
   });
 
   test("only renders a single tab panel", () => {
-    render(<ClientWork />);
+    render(<ExternalWork />);
 
     expect(screen.getAllByRole("tabpanel")).toHaveLength(1);
   });
 
   test("renders the first tab panel initially", () => {
-    render(<ClientWork />);
+    render(<ExternalWork />);
 
     expect(
-      screen.getByRole("tabpanel", { name: CLIENT_WORK[0].name }),
+      screen.getByRole("tabpanel", { name: EXTERNAL_WORK[0].name }),
     ).toBeInTheDocument();
   });
 
   test("renders the correct tab panel after the its tab is clicked", () => {
     const user = userEvent.setup();
 
-    render(<ClientWork />);
+    render(<ExternalWork />);
 
-    CLIENT_WORK.forEach(async ({ name }) => {
+    EXTERNAL_WORK.forEach(async ({ name }) => {
       await user.click(
         screen.getByRole("tab", {
           name,
@@ -46,9 +46,9 @@ describe("test ClientWork", () => {
   test("renders the correct image for each tab panel", () => {
     const user = userEvent.setup();
 
-    render(<ClientWork />);
+    render(<ExternalWork />);
 
-    CLIENT_WORK.forEach(async ({ image, name }) => {
+    EXTERNAL_WORK.forEach(async ({ image, name }) => {
       await user.click(
         screen.getByRole("tab", {
           name,
@@ -62,9 +62,9 @@ describe("test ClientWork", () => {
   test("renders the correct description for each tab panel", () => {
     const user = userEvent.setup();
 
-    render(<ClientWork />);
+    render(<ExternalWork />);
 
-    CLIENT_WORK.forEach(async ({ description, name }) => {
+    EXTERNAL_WORK.forEach(async ({ description, name }) => {
       await user.click(
         screen.getByRole("tab", {
           name,
@@ -78,9 +78,9 @@ describe("test ClientWork", () => {
   test("renders the correct link for each tab panel", () => {
     const user = userEvent.setup();
 
-    render(<ClientWork />);
+    render(<ExternalWork />);
 
-    CLIENT_WORK.forEach(async ({ href, name }) => {
+    EXTERNAL_WORK.forEach(async ({ href, name }) => {
       await user.click(
         screen.getByRole("tab", {
           name,

diff --git a/app/components/ClientWork/ClientWork.tsx → app/components/ExternalWork/ExternalWork.tsx b/app/components/ClientWork/ClientWork.tsx → app/components/ExternalWork/ExternalWork.tsx
@@ -9,22 +9,22 @@ import {
   Tabs,
 } from "@mui/material";
 
-import { CLIENT_WORK } from "app/data/clientWork";
+import { EXTERNAL_WORK } from "app/data/externalWork";
 import { useTabs } from "app/hooks/useTabs";
 import { computeTabAndPanelProps } from "app/utilities";
 
-export function ClientWork() {
+export function ExternalWork() {
   const { handleChangeTab, tab } = useTabs();
 
   return (
     <>
       <Tabs onChange={handleChangeTab} value={tab} variant="scrollable">
-        {CLIENT_WORK.map(({ name }) => (
+        {EXTERNAL_WORK.map(({ name }) => (
           <Tab key={name} {...computeTabAndPanelProps(name, "tab")} />
         ))}
       </Tabs>
 
-      {CLIENT_WORK.map(({ description, href, image, name }, index) =>
+      {EXTERNAL_WORK.map(({ description, href, image, name }, index) =>
         tab === index ? (
           <Box key={name} {...computeTabAndPanelProps(name, "panel")}>
             <CardMedia image={image.src} sx={{ height: 400 }} title={name} />
@@ -36,15 +36,17 @@ export function ClientWork() {
             </CardContent>
 
             <CardActions sx={{ justifyContent: "center", pt: 3 }}>
-              <Button
-                color="warning"
-                href={href}
-                LinkComponent={Link}
-                target="_blank"
-                variant="contained"
-              >
-                View
-              </Button>
+              {href ? (
+                <Button
+                  color="warning"
+                  href={href}
+                  LinkComponent={Link}
+                  target="_blank"
+                  variant="contained"
+                >
+                  View
+                </Button>
+              ) : null}
             </CardActions>
           </Box>
         ) : null,

diff --git a/app/components/ExternalWork/index.ts b/app/components/ExternalWork/index.ts
@@ -0,0 +1 @@
+export { ExternalWork } from "./ExternalWork";
diff --git a/app/components/FormTextField/FormTextField.tsx b/app/components/FormTextField/FormTextField.tsx
@@ -60,7 +60,14 @@ export function FormTextField<T extends FieldValues>({
   ...rest
 }: FormTextFieldProps<T>) {
   const {
-    field: { onChange: reactHookFormOnChange, ref, value, ...field },
+    field: {
+      // eslint-disable-next-line @typescript-eslint/no-unused-vars
+      disabled: isReactHookFormFieldDisabled,
+      onChange: reactHookFormOnChange,
+      ref,
+      value,
+      ...field
+    },
     fieldState: { error },
     formState: { isSubmitting },
   } = useController({