Added validation to input, updated deps, added new password rule

lucky-media · Apr 29, 2021 · c574b15 · c574b15
1 parent 161a0cb
commit c574b15
Show file tree

Hide file tree

Showing 9 changed files with 22 additions and 8 deletions.
diff --git a/composer.json b/composer.json
@@ -22,8 +22,9 @@
     ],
     "require": {
         "php": "^7.3|^8.0",
-        "illuminate/filesystem": "^8.0",
-        "illuminate/support": "^8.0"
+        "illuminate/filesystem": "^8.40",
+        "illuminate/support": "^8.40",
+        "illuminate/validation": "^8.40"
     },
     "autoload": {
         "psr-4": {

diff --git a/stubs/inertia/app/Http/Controllers/Auth/NewPasswordController.php b/stubs/inertia/app/Http/Controllers/Auth/NewPasswordController.php
@@ -8,6 +8,7 @@
 use Illuminate\Support\Facades\Hash;
 use Illuminate\Support\Facades\Password;
 use Illuminate\Support\Str;
+use Illuminate\Validation\Rules;
 use Illuminate\Validation\ValidationException;
 use Inertia\Inertia;
 
@@ -40,7 +41,7 @@ public function store(Request $request)
         $request->validate([
             'token' => 'required',
             'email' => 'required|email',
-            'password' => 'required|string|confirmed|min:8',
+            'password' => ['required', 'confirmed', Rules\Password::min(8)],
         ]);
 
         // Here we will attempt to reset the user's password. If it is successful we

diff --git a/stubs/inertia/app/Http/Controllers/Auth/RegisteredUserController.php b/stubs/inertia/app/Http/Controllers/Auth/RegisteredUserController.php
@@ -9,6 +9,7 @@
 use Illuminate\Http\Request;
 use Illuminate\Support\Facades\Auth;
 use Illuminate\Support\Facades\Hash;
+use Illuminate\Validation\Rules;
 use Inertia\Inertia;
 
 class RegisteredUserController extends Controller
@@ -36,7 +37,7 @@ public function store(Request $request)
         $request->validate([
             'name' => 'required|string|max:255',
             'email' => 'required|string|email|max:255|unique:users',
-            'password' => 'required|string|confirmed|min:8',
+            'password' => ['required', 'confirmed', Rules\Password::min(8)],
         ]);
 
         $user = User::create([

diff --git a/stubs/inertia/resources/js/Components/Forms/TextInput.js b/stubs/inertia/resources/js/Components/Forms/TextInput.js
@@ -1,6 +1,6 @@
 import React, { useEffect, useRef } from "react";
 
-export default function TextInput({ label, type = 'text', name, value, handleChange, autoComplete, isFocused }) {
+export default function TextInput({ label, type = 'text', name, value, error, handleChange, autoComplete, isFocused }) {
 
     const input = useRef();
 
@@ -16,13 +16,15 @@ export default function TextInput({ label, type = 'text', name, value, handleCha
             <input
                 type={type}
                 name={name}
-                className="w-full p-2 border border-gray-300 outline-none focus:border-indigo-300 focus:ring focus:ring-indigo-200 focus:ring-opacity-50 rounded-md shadow-sm"
+                className={`w-full p-2 border ${error ? 'border-red-300' : 'border-gray-300'}  outline-none focus:border-indigo-300 focus:ring focus:ring-indigo-200 focus:ring-opacity-50 rounded-md shadow-sm`}
                 value={value}
                 onChange={(e) => handleChange(e)}
                 ref={input}
                 autoComplete={autoComplete}
                 required
             />
+
+            {error && <p className="text-sm text-red-500 mt-1">{error}</p>}
         </div>
     );
 }
diff --git a/stubs/inertia/resources/js/Pages/Auth/ConfirmPassword.js b/stubs/inertia/resources/js/Pages/Auth/ConfirmPassword.js
@@ -38,6 +38,7 @@ export default function ConfirmPassword() {
                     <TextInput
                         isFocused={true}
                         value={data.password}
+                        error={errors.password}
                         type="password"
                         handleChange={onHandleChange}
                         label="Password"

diff --git a/stubs/inertia/resources/js/Pages/Auth/ForgotPassword.js b/stubs/inertia/resources/js/Pages/Auth/ForgotPassword.js
@@ -37,6 +37,7 @@ export default function ForgotPassword({ status }) {
                     <form onSubmit={submit}>
                         <TextInput
                             value={data.email}
+                            error={errors.email}
                             type="text"
                             handleChange={onHandleChange}
                             isFocused={true}

diff --git a/stubs/inertia/resources/js/Pages/Auth/Login.js b/stubs/inertia/resources/js/Pages/Auth/Login.js
@@ -45,6 +45,7 @@ export default function Login({ status, canResetPassword }) {
             <form onSubmit={submit}>
                 <TextInput
                     value={data.email}
+                    error={errors.email}
                     type="text"
                     handleChange={onHandleChange}
                     isFocused={true}
@@ -55,6 +56,7 @@ export default function Login({ status, canResetPassword }) {
                 <div className="mt-4">
                     <TextInput
                         value={data.password}
+                        error={errors.password}
                         type="password"
                         handleChange={onHandleChange}
                         label="Password"

diff --git a/stubs/inertia/resources/js/Pages/Auth/Register.js b/stubs/inertia/resources/js/Pages/Auth/Register.js
@@ -4,7 +4,7 @@ import { InertiaLink } from "@inertiajs/inertia-react";
 import Button from "@/Components/Forms/Button";
 import TextInput from "@/Components/Forms/TextInput";
 import Guest from "@/Layouts/Guest";
-import ValidationErros from "@/Components/Forms/ValidationErrors";
+import ValidationErrors from "@/Components/Forms/ValidationErrors";
 
 export default function Register() {
 
@@ -37,10 +37,11 @@ export default function Register() {
 
     return (
         <Guest title="Register">
-            <ValidationErros errors={errors} />
+            <ValidationErrors errors={errors} />
             <form onSubmit={submit}>
                 <TextInput
                     value={data.name}
+                    error={errors.name}
                     type="text"
                     handleChange={onHandleChange}
                     isFocused={true}
@@ -52,6 +53,7 @@ export default function Register() {
                 <div className="mt-4">
                     <TextInput
                         value={data.email}
+                        error={errors.email}
                         type="text"
                         handleChange={onHandleChange}
                         label="Email"
@@ -62,6 +64,7 @@ export default function Register() {
                 <div className="mt-4">
                     <TextInput
                         value={data.password}
+                        error={errors.password}
                         type="password"
                         handleChange={onHandleChange}
                         label="Password"

diff --git a/stubs/inertia/resources/js/Pages/Auth/ResetPassword.js b/stubs/inertia/resources/js/Pages/Auth/ResetPassword.js
@@ -37,6 +37,7 @@ export default function ResetPassword({ token, email }) {
                 <div className="mt-4">
                     <TextInput
                         value={data.email}
+                        error={errors.email}
                         type="text"
                         handleChange={onHandleChange}
                         label="Email"
@@ -47,6 +48,7 @@ export default function ResetPassword({ token, email }) {
                 <div className="mt-4">
                     <TextInput
                         isFocused={true}
+                        error={errors.password}
                         value={data.password}
                         type="password"
                         handleChange={onHandleChange}