chore: apply prettier formatting

marcalexiei · marcalexiei · commit 402058d27d9c · 2024-12-14T08:00:59.000+01:00
diff --git a/.github/stale.yml b/.github/stale.yml
@@ -7,7 +7,7 @@ exemptLabels:
   - pinned
   - security
 # Label to use when marking an issue as stale
-staleLabel: 
+staleLabel:
 # Comment to post when marking an issue as stale. Set to `false` to disable
 markComment: >
   This issue has been automatically marked as stale because it has not had
diff --git a/.github/workflows/lock-issue.yml b/.github/workflows/lock-issue.yml
@@ -1,9 +1,9 @@
-name: 'Lock Issues'
+name: "Lock Issues"
 
 on:
   workflow_dispatch:
   schedule:
-    - cron: '0 0,6,12,18 * * *'
+    - cron: "0 0,6,12,18 * * *"
 
 permissions:
   issues: write
diff --git a/.prettierignore b/.prettierignore
@@ -0,0 +1 @@
+pnpm-lock.yaml
diff --git a/.prettierrc b/.prettierrc
@@ -1,4 +1,5 @@
 {
+  "$schema": "https://json.schemastore.org/prettierrc",
   "endOfLine": "lf",
   "semi": false,
   "singleQuote": false,
diff --git a/CONTRIBUTING.md b/CONTRIBUTING.md
@@ -56,7 +56,7 @@ React Hook Form uses prettier.
 If possible, enable the prettier plugin in your editor to get real-time feedback. The formatting can be run manually with the following command:
 
 ```shellscript
-pnpm run format
+pnpm run format:fix
 ```
 
 ## License
diff --git a/package.json b/package.json
@@ -46,7 +46,7 @@
     "eslint-plugin-react-hooks": "^4.6.0",
     "husky": "^8.0.3",
     "lint-staged": "^13.2.2",
-    "prettier": "^2.8.8",
+    "prettier": "^3.4.2",
     "typescript": "^5.1.3"
   },
   "keywords": [
@@ -58,7 +58,8 @@
     "analyze": "cross-env ANALYZE=true next build",
     "build": "next build",
     "dev": "next dev",
-    "format": "prettier --write",
+    "format": "prettier . --check",
+    "format:fix": "prettier . --write",
     "lint": "next lint --fix",
     "now-build": "pnpm run build",
     "start": "next start",
@@ -67,7 +68,7 @@
   },
   "lint-staged": {
     "*.{ts,tsx,mdx,css,json}": [
-      "pnpm run format"
+      "pnpm run format:fix"
     ]
   }
 }
diff --git a/pnpm-lock.yaml b/pnpm-lock.yaml
diff --git a/src/components/Watcher.tsx b/src/components/Watcher.tsx
@@ -70,20 +70,20 @@ const Watcher = ({ isPlayWatch }: { isPlayWatch: boolean }) => {
           i === 13
             ? "W"
             : i === 14
-            ? "Wa"
-            : i === 15
-            ? "Wat"
-            : i === 16
-            ? "Watc"
-            : i === 17
-            ? "Watch"
-            : i === 18
-            ? "Watchi"
-            : i === 19
-            ? "Watchin"
-            : i === 20
-            ? "Watching"
-            : "Watching."
+              ? "Wa"
+              : i === 15
+                ? "Wat"
+                : i === 16
+                  ? "Watc"
+                  : i === 17
+                    ? "Watch"
+                    : i === 18
+                      ? "Watchi"
+                      : i === 19
+                        ? "Watchin"
+                        : i === 20
+                          ? "Watching"
+                          : "Watching."
         )
       }
 
diff --git a/src/components/layout.css b/src/components/layout.css
@@ -523,11 +523,17 @@ a.skip-main:active {
   width: 1px;
   height: 1px;
   border: 1px solid transparent;
-  box-shadow: -2px 0 0 -1px currentColor, 2px 0 0 -1px currentColor,
-    0 -2px 0 -1px currentColor, 0 2px 0 -1px currentColor,
-    -6px 0 0 -1px currentColor, 6px 0 0 -1px currentColor,
-    -4px -2px 0 -1px currentColor, -4px 2px 0 -1px currentColor,
-    4px -2px 0 -1px currentColor, 4px 2px 0 -1px currentColor;
+  box-shadow:
+    -2px 0 0 -1px currentColor,
+    2px 0 0 -1px currentColor,
+    0 -2px 0 -1px currentColor,
+    0 2px 0 -1px currentColor,
+    -6px 0 0 -1px currentColor,
+    6px 0 0 -1px currentColor,
+    -4px -2px 0 -1px currentColor,
+    -4px 2px 0 -1px currentColor,
+    4px -2px 0 -1px currentColor,
+    4px 2px 0 -1px currentColor;
 }
 
 .keyboard.icon:after {
diff --git a/src/components/sponsorsList.tsx b/src/components/sponsorsList.tsx
@@ -11,7 +11,7 @@ export function SponsorsList() {
           target="_blank"
           rel="noopener noreferrer"
         >
-          <img src="/images/casinoreviews.png" alt="Casino Reviews"/>
+          <img src="/images/casinoreviews.png" alt="Casino Reviews" />
         </a>
         <a
           href="https://www.beekai.com/"
@@ -28,16 +28,9 @@ export function SponsorsList() {
           target="_blank"
           rel="noopener noreferrer"
         >
-          <img
-            src="/images/route4me.png"
-            alt="route4me"
-          />
+          <img src="/images/route4me.png" alt="route4me" />
         </a>
-        <a
-          href="https://twicsy.com/"
-          target="_blank"
-          rel="noopener noreferrer"
-        >
+        <a href="https://twicsy.com/" target="_blank" rel="noopener noreferrer">
           <img
             className={styles.twicsy}
             src="/images/twicsy.png"
diff --git a/src/content/docs/formprovider.mdx b/src/content/docs/formprovider.mdx
@@ -35,20 +35,20 @@ export default function App() {
   const methods = useForm()
 
   const onSubmit = (data) => console.log(data)
-  const { register, reset } = methods;
+  const { register, reset } = methods
 
   useEffect(() => {
     reset({
-      name: 'data'
+      name: "data",
     })
-  }, [reset]); // ❌ never put `methods` as the deps
+  }, [reset]) // ❌ never put `methods` as the deps
 
   return (
     <FormProvider {...methods}>
       // pass all methods into the context
       <form onSubmit={methods.handleSubmit(onSubmit)}>
         <NestedInput />
-        <input {...register('name')} />
+        <input {...register("name")} />
         <input type="submit" />
       </form>
     </FormProvider>
diff --git a/src/content/docs/usecontroller/controller.mdx b/src/content/docs/usecontroller/controller.mdx
@@ -35,7 +35,7 @@ The following table contains information about properties which `Controller` pro
 | `field`                                | `onChange`           | <TypeText>`(value: any) => void`</TypeText> | A function which sends the input's value to the library.<br/><br/> _It should be assigned to the `onChange` prop of the input and value should **not be `undefined`**._ <br/>This prop update [formState](/docs/useform/formstate) and you should avoid manually invoke [setValue](/docs/useform/setvalue) or other API related to field update.                                                                                                                                                                                                               |
 | `field`                                | `onBlur`             | <TypeText>`() => void`</TypeText>           | A function which sends the input's onBlur event to the library. It should be assigned to the input's `onBlur` prop.                                                                                                                                                                                                                                                                                                                                                                                                                                            |
 | `field`                                | `value`              | <TypeText>unknown</TypeText>                | The current value of the controlled component.                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                 |
-| `field`                                | `disabled`              | <TypeText>boolean</TypeText>                | The disabled state of the input.                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                 |
+| `field`                                | `disabled`           | <TypeText>boolean</TypeText>                | The disabled state of the input.                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                               |
 | `field`                                | `name`               | <TypeText>string</TypeText>                 | Input's name being registered.                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                 |
 | `field`                                | `ref`                | <TypeText>React.ref</TypeText>              | A ref used to connect hook form to the input. Assign `ref` to component's input ref to allow hook form to focus the error input.                                                                                                                                                                                                                                                                                                                                                                                                                               |
 | `fieldState`                           | `invalid`            | <TypeText>boolean</TypeText>                | Invalid state for current input.                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                               |
diff --git a/src/content/docs/useform.mdx b/src/content/docs/useform.mdx
@@ -154,8 +154,11 @@ useForm({
 - There are other options for including form data:
 
   ```javascript
+  // adding a hidden input
   <input {...register("hidden", { value: "data" })} type="hidden" />
+  ```
 
+  ```javascript
   // include data onSubmit
   const onSubmit = (data) => {
     const output = {
@@ -731,7 +734,7 @@ const methods = useForm()
 
 useEffect(() => {
   methods.reset({ ... })
-}, [methods.reset]}
+}, [methods.reset])
 ```
 
 <Admonition type="tip" >
diff --git a/src/content/docs/useform/form.mdx b/src/content/docs/useform/form.mdx
@@ -33,16 +33,16 @@ By default, we will send a POST request with your form submission data as [FormD
 
 All props are optional
 
-| Name             | Type                                               | Description                                                                                                             | Example                                                                                                            |
-| ---------------- | -------------------------------------------------- | ----------------------------------------------------------------------------------------------------------------------- | ------------------------------------------------------------------------------------------------------------------ |
-| `control`        | <TypeText>`Control`</TypeText>                     | [`control`](/docs/useform/control) object provided by invoking `useForm`. Optional when using `FormProvider`.           | <CodeArea withOutCopy rawData="<Form control={control} />"/>                                                       |
-| `children`       | <TypeText>`React.ReactNode`</TypeText>             |                                                                                                                         |
-| `render`         | <TypeText>`Function`</TypeText>                    | Render prop function suitable for headless component.                                                                   | <CodeArea withOutCopy rawData="<Form render={({ submit }) => <View/>} />" />                                       |
-| `onSubmit`       | <TypeText>`Function`</TypeText>                    | Function invoked after successful validation.                                                                           | <CodeArea withOutCopy rawData="<Form onSubmit={({ data }) => mutation(data)} />"/>                                 |
-| `onSuccess`      | <TypeText>`Function`</TypeText>                    | Function called after successful request to the server.                                                                 | <CodeArea withOutCopy rawData="<Form onSuccess={({ response }) => {}} />" />                                       |
+| Name             | Type                                               | Description                                                                                                                                                      | Example                                                                                                            |
+| ---------------- | -------------------------------------------------- | ---------------------------------------------------------------------------------------------------------------------------------------------------------------- | ------------------------------------------------------------------------------------------------------------------ |
+| `control`        | <TypeText>`Control`</TypeText>                     | [`control`](/docs/useform/control) object provided by invoking `useForm`. Optional when using `FormProvider`.                                                    | <CodeArea withOutCopy rawData="<Form control={control} />"/>                                                       |
+| `children`       | <TypeText>`React.ReactNode`</TypeText>             |                                                                                                                                                                  |
+| `render`         | <TypeText>`Function`</TypeText>                    | Render prop function suitable for headless component.                                                                                                            | <CodeArea withOutCopy rawData="<Form render={({ submit }) => <View/>} />" />                                       |
+| `onSubmit`       | <TypeText>`Function`</TypeText>                    | Function invoked after successful validation.                                                                                                                    | <CodeArea withOutCopy rawData="<Form onSubmit={({ data }) => mutation(data)} />"/>                                 |
+| `onSuccess`      | <TypeText>`Function`</TypeText>                    | Function called after successful request to the server.                                                                                                          | <CodeArea withOutCopy rawData="<Form onSuccess={({ response }) => {}} />" />                                       |
 | `onError`        | <TypeText>`Function`</TypeText>                    | Function called after failed request to the server.<br/><br/>`setError` function will be called to update errors state. `root.server` will be used as error key. | <CodeArea withOutCopy rawData="<Form onError={({ response }) => {}} />" />                                         |
-| `headers`        | <TypeText>`Record<string, string>`</TypeText>      | Request headers object.                                                                                                 | <CodeArea withOutCopy rawData="<Form headers={{ accessToken:  'xxx', 'Content-Type':  'application/json'  }} />"/> |
-| `validateStatus` | <TypeText>`(status: number) => boolean`</TypeText> | Function to validate status code.                                                                                       | <CodeArea withOutCopy rawData="<Form validateStatus={status => status === 200} />" />                              |
+| `headers`        | <TypeText>`Record<string, string>`</TypeText>      | Request headers object.                                                                                                                                          | <CodeArea withOutCopy rawData="<Form headers={{ accessToken:  'xxx', 'Content-Type':  'application/json'  }} />"/> |
+| `validateStatus` | <TypeText>`(status: number) => boolean`</TypeText> | Function to validate status code.                                                                                                                                | <CodeArea withOutCopy rawData="<Form validateStatus={status => status === 200} />" />                              |
 
 <Admonition type="important" title="Rules">
 
@@ -67,7 +67,7 @@ All props are optional
 
   <Form onSubmit={onSubmit} control={control} action="/api/test" method="post">
     <input {...register("test", { required: true })} />
-  </Form  />
+  </Form>
 
   // Renders
 
@@ -114,7 +114,8 @@ function App() {
         {" "}
         <input {...register("name")} />
         {isSubmitSuccessful && <p>Form submit successful.</p>}
-        {errors?.root?.server && <p>Form submit failed.</p>} <button>submit</button>
+        {errors?.root?.server && <p>Form submit failed.</p>}
+        <button>submit</button>
       </Form>
       // Manual form submission
       <Form
diff --git a/src/content/docs/useform/handlesubmit.mdx b/src/content/docs/useform/handlesubmit.mdx
@@ -39,9 +39,9 @@ This function will receive the form data if form validation is successful.
     } catch (e) {
       // handle your error
     }
-  };
+  }
 
-  <form onSubmit={handleSubmit(onSubmit)} />
+  return <form onSubmit={handleSubmit(onSubmit)} />
   ```
 
 </Admonition>
diff --git a/src/content/docs/useform/reset.mdx b/src/content/docs/useform/reset.mdx
@@ -42,13 +42,13 @@ Reset the entire form state, fields reference, and subscriptions. There are opti
   ```
 - It's fine to run `reset` without argument as long as you have provided a `defaultValues` at useForm.
 
-    ```javascript
-    reset(); // update form back to default values
+  ```javascript
+  reset() // update form back to default values
 
-    reset({ test: 'test' }); // update your defaultValues && form values
+  reset({ test: "test" }) // update your defaultValues && form values
 
-    reset(undefined, { keepDirtyValues: true }); // reset other form state but keep defaultValues and form values
-    ```
+  reset(undefined, { keepDirtyValues: true }) // reset other form state but keep defaultValues and form values
+  ```
 
 </Admonition>
 
diff --git a/src/content/docs/useform/seterror.mdx b/src/content/docs/useform/seterror.mdx
@@ -22,8 +22,8 @@ The function allows you to manually set one or more errors.
 
 - This method will not persist the associated input error if the input passes `register`'s associated rules.
   ```javascript
-  register('registerInput', { minLength: 4 });
-  setError('registerInput', { type: 'custom', message: 'custom message' });
+  register("registerInput", { minLength: 4 })
+  setError("registerInput", { type: "custom", message: "custom message" })
   // validation will pass as long as minLength requirement pass
   ```
 - An error that is not associated with an input field will be persisted until cleared with `clearErrors`. This behaviour is only applicable for built-in validation at field level.
diff --git a/src/content/docs/useformcontext.mdx b/src/content/docs/useformcontext.mdx
@@ -36,20 +36,20 @@ import { useForm, FormProvider, useFormContext } from "react-hook-form"
 export default function App() {
   const methods = useForm()
   const onSubmit = (data) => console.log(data)
-  const { register, reset } = methods;
+  const { register, reset } = methods
 
   useEffect(() => {
     reset({
-      name: 'data'
+      name: "data",
     })
-  }, [reset]); // ❌ never put `methods` as the deps
+  }, [reset]) // ❌ never put `methods` as the deps
 
   return (
     <FormProvider {...methods}>
       // pass all methods into the context
       <form onSubmit={methods.handleSubmit(onSubmit)}>
         <NestedInput />
-        <input {...register('name')} />
+        <input {...register("name")} />
         <input type="submit" />
       </form>
     </FormProvider>
diff --git a/src/content/ts.mdx b/src/content/ts.mdx
diff --git a/src/data/api.tsx b/src/data/api.tsx
diff --git a/src/pages/_document.tsx b/src/pages/_document.tsx

Original file line number	Diff line number	Diff line change
`@@ -1,4 +1,5 @@`
`1`	`1`	`{`
	`2`	`+ "$schema": "https://json.schemastore.org/prettierrc",`
`2`	`3`	`"endOfLine": "lf",`
`3`	`4`	`"semi": false,`
`4`	`5`	`"singleQuote": false,`