fix : update user profile edit in user side

resources/views/account/layouts/sidebar.blade.php

@@ -7,7 +7,24 @@
                 <img src="{{ asset('assets/img/account/user.jpg') }}" alt="">
             @endif
             <button type="button" class="profile-img-btn"><i class="far fa-camera"></i></button>
-            <input type="file" class="profile-img-file">
+                <form
+                    action="{{ route('account.profile.image.update') }}"
+                    method="POST"
+                    enctype="multipart/form-data"
+                    id="profile-image-form"
+                >
+                    @csrf
+
+                    <input
+                        type="file"
+                        name="image"
+                        class="profile-img-file"
+                        id="profile-img-file"
+                        accept="image/jpeg,image/png,image/webp"
+                        hidden
+                    >
+                </form>
+
         </div>
         <h4>{{ getUserFullName() }}</h4>
 
@@ -21,3 +38,29 @@
         <li><a class="{{ activeAccountSidebar('auth.logout') }}" href="{{route('auth.logout')}}"><i class="far fa-sign-out"></i> خروج</a></li>
     </ul>
 </div>
+
+<script>
+    document.addEventListener('DOMContentLoaded', function () {
+
+        const button = document.querySelector('.profile-img-btn');
+        const fileInput = document.querySelector('#profile-img-file');
+        const form = document.querySelector('#profile-image-form');
+
+        if (button && fileInput && form) {
+
+            button.addEventListener('click', function () {
+                fileInput.click();
+            });
+
+            fileInput.addEventListener('change', function () {
+
+                if (this.files.length > 0) {
+                    form.submit();
+                }
+
+            });
+
+        }
+
+    });
+</script>