diff --git a/app/Http/Livewire/Profile/Settings/General.php b/app/Http/Livewire/Profile/Settings/General.php
new file mode 100644
index 000000000000..ad875c910ec8
--- /dev/null
+++ b/app/Http/Livewire/Profile/Settings/General.php
@@ -0,0 +1,77 @@
+<?php
+
+/**
+ * Invoice Ninja (https://invoiceninja.com).
+ *
+ * @link https://github.com/invoiceninja/invoiceninja source repository
+ *
+ * @copyright Copyright (c) 2020. Invoice Ninja LLC (https://invoiceninja.com)
+ *
+ * @license https://opensource.org/licenses/AAL
+ */
+
+namespace App\Http\Livewire\Profile\Settings;
+
+use Livewire\Component;
+
+class General extends Component
+{
+    public $profile;
+
+    public $first_name;
+    public $last_name;
+    public $email;
+    public $phone;
+    public $password;
+    public $password_confirmation;
+
+    public $saved;
+
+    protected $rules = [
+        'first_name' => ['required'],
+        'last_name' => ['required'],
+        'email' => ['required', 'email'],
+    ];
+
+    public function mount()
+    {
+        $profile = auth()->user('contact');
+
+        $this->fill([
+            'profile' => $profile,
+            'first_name' => $profile->first_name,
+            'last_name' => $profile->last_name,
+            'email' => $profile->email,
+            'phone' => $profile->phone,
+            'saved' => ctrans('texts.save'),
+        ]);
+    }
+
+    public function render()
+    {
+        return render('profile.settings.general');
+    }
+
+    public function submit()
+    {
+        if ($this->profile->email != $this->email) {
+            $this->rules['email'][] = 'unique:client_contacts,email';
+        }
+
+        if (!empty($this->password)) {
+            $this->rules['password'] = ['sometimes', 'nullable', 'required', 'min:6', 'confirmed'];
+        }
+
+        $data = $this->validate($this->rules);
+
+         if (!empty($this->password)) {
+             $this->profile->password = encrypt($this->password);
+         }
+
+        $this->profile
+            ->fill($data)
+            ->save();
+
+        $this->saved = ctrans('texts.saved_at', ['time' => now()->toTimeString()]);
+    }
+}
diff --git a/resources/lang/en/texts.php b/resources/lang/en/texts.php
index ea2eec4f6e60..4d5e8e7e77eb 100644
--- a/resources/lang/en/texts.php
+++ b/resources/lang/en/texts.php
@@ -3279,4 +3279,6 @@ return [
     'over_payments_disabled' => 'Company doesn\'t support over payments.',
   
     'paused' => 'Paused',
+
+    'saved_at' => 'Saved at :time',
 ];
diff --git a/resources/views/portal/ninja2020/profile/index.blade.php b/resources/views/portal/ninja2020/profile/index.blade.php
index 3a7ce9549df8..0914c3a5d36a 100644
--- a/resources/views/portal/ninja2020/profile/index.blade.php
+++ b/resources/views/portal/ninja2020/profile/index.blade.php
@@ -7,100 +7,8 @@
 @endsection
 
 @section('body')
-
     <!-- Basic information: first & last name, e-mail address etc. -->
-    <div class="mt-2 sm:mt-6">
-        <div class="md:grid md:grid-cols-3 md:gap-6">
-            <div class="md:col-span-1">
-                <div class="sm:px-0">
-                    <h3 class="text-lg font-medium leading-6 text-gray-900">{{ ctrans('texts.profile') }}</h3>
-                    <p class="mt-1 text-sm leading-5 text-gray-500">
-                        @lang('texts.client_information_text')
-                    </p>
-                </div>
-            </div>
-            <div class="mt-5 md:mt-0 md:col-span-2">
-                <form action="{{ route('client.profile.update', auth()->user()->hashed_id) }}" method="POST"
-                      id="update_contact">
-                    @csrf
-                    @method('PUT')
-                    <div class="shadow overflow-hidden rounded">
-                        <div class="px-4 py-5 bg-white sm:p-6">
-                            <div class="grid grid-cols-6 gap-6">
-                                <div class="col-span-6 sm:col-span-3">
-                                    <label for="first_name" class="input-label">@lang('texts.first_name')</label>
-                                    <input id="first_name" class="input w-full" name="first_name"
-                                           value="{{ auth()->user()->first_name }}"/>
-                                    @error('first_name')
-                                    <div class="validation validation-fail">
-                                        {{ $message }}
-                                    </div>
-                                    @enderror
-                                </div>
-
-                                <div class="col-span-6 sm:col-span-3">
-                                    <label for="last_name" class="input-label">@lang('texts.last_name')</label>
-                                    <input id="last_name" class="input w-full" name="last_name"
-                                           value="{{ auth()->user()->last_name }}"/>
-                                    @error('last_name')
-                                    <div class="validation validation-fail">
-                                        {{ $message }}
-                                    </div>
-                                    @enderror
-                                </div>
-
-                                <div class="col-span-6 sm:col-span-4">
-                                    <label for="email_address" class="input-label">@lang('texts.email_address')</label>
-                                    <input id="email_address" class="input w-full" type="email" name="email"
-                                           value="{{ auth()->user()->email }}"/>
-                                    @error('email')
-                                    <div class="validation validation-fail">
-                                        {{ $message }}
-                                    </div>
-                                    @enderror
-                                </div>
-
-                                <div class="col-span-6 sm:col-span-4">
-                                    <label for="phone" class="input-label">@lang('texts.phone')</label>
-                                    <input id="phone" class="input w-full" name="phone" value="{{ auth()->user()->phone }}"/>
-                                    @error('phone')
-                                    <div class="validation validation-fail">
-                                        {{ $message }}
-                                    </div>
-                                    @enderror
-                                </div>
-
-                                <div class="col-span-6 sm:col-span-6 lg:col-span-3">
-                                    <label for="password" class="input-label">@lang('texts.password')</label>
-                                    <input id="password" class="input w-full" name="password" type="password"/>
-                                    @error('password')
-                                    <div class="validation validation-fail">
-                                        {{ $message }}
-                                    </div>
-                                    @enderror
-                                </div>
-
-                                <div class="col-span-6 sm:col-span-3 lg:col-span-3">
-                                    <label for="state" class="input-label">@lang('texts.confirm_password')</label>
-                                    <input id="state" class="input w-full" name="password_confirmation" type="password"/>
-                                    @error('password_confirmation')
-                                    <div class="validation validation-fail">
-                                        {{ $message }}
-                                    </div>
-                                    @enderror
-                                </div>
-                            </div>
-                        </div>
-                        <div class="px-4 py-3 bg-gray-50 text-right sm:px-6">
-                            <button class="button button-primary">
-                                @lang('texts.save')
-                            </button>
-                        </div>
-                    </div>
-                </form>
-            </div>
-        </div>
-    </div>
+    @livewire('profile.settings.general')
 
     <!-- Name, website & logo -->
     <div class="mt-10 sm:mt-6">
@@ -357,5 +265,4 @@
             </div>
         </div>
     </div>
-
 @endsection
diff --git a/resources/views/portal/ninja2020/profile/settings/general.blade.php b/resources/views/portal/ninja2020/profile/settings/general.blade.php
new file mode 100644
index 000000000000..9d7c3b5f2a7b
--- /dev/null
+++ b/resources/views/portal/ninja2020/profile/settings/general.blade.php
@@ -0,0 +1,87 @@
+    <div class="mt-2 sm:mt-6">
+        <div class="md:grid md:grid-cols-3 md:gap-6">
+            <div class="md:col-span-1">
+                <div class="sm:px-0">
+                    <h3 class="text-lg font-medium leading-6 text-gray-900">{{ ctrans('texts.profile') }}</h3>
+                    <p class="mt-1 text-sm leading-5 text-gray-500">
+                        {{ ctrans('texts.client_information_text') }}
+                    </p>
+                </div>
+            </div>  <!-- End of left-side -->
+
+            <div class="mt-5 md:mt-0 md:col-span-2">
+                <form wire:submit.prevent="submit">
+                    @csrf
+                    @method('PUT')
+                    <div class="shadow overflow-hidden rounded">
+                        <div class="px-4 py-5 bg-white sm:p-6">
+                            <div class="grid grid-cols-6 gap-6">
+                                <div class="col-span-6 sm:col-span-3">
+                                    <label for="first_name" class="input-label">@lang('texts.first_name')</label>
+                                    <input id="first_name" class="input w-full" name="first_name" wire:model.defer="first_name" />
+                                    @error('first_name')
+                                    <div class="validation validation-fail">
+                                        {{ $message }}
+                                    </div>
+                                    @enderror
+                                </div>
+
+                                <div class="col-span-6 sm:col-span-3">
+                                    <label for="last_name" class="input-label">@lang('texts.last_name')</label>
+                                    <input id="last_name" class="input w-full" name="last_name" wire:model.defer="last_name" />
+                                    @error('last_name')
+                                    <div class="validation validation-fail">
+                                        {{ $message }}
+                                    </div>
+                                    @enderror
+                                </div>
+
+                                <div class="col-span-6 sm:col-span-4">
+                                    <label for="email_address" class="input-label">@lang('texts.email_address')</label>
+                                    <input id="email_address" class="input w-full" type="email" name="email" wire:model.defer="email" />
+                                    @error('email')
+                                    <div class="validation validation-fail">
+                                        {{ $message }}
+                                    </div>
+                                    @enderror
+                                </div>
+
+                                <div class="col-span-6 sm:col-span-4">
+                                    <label for="phone" class="input-label">@lang('texts.phone')</label>
+                                    <input id="phone" class="input w-full" name="phone" wire:model.defer="phone" />
+                                    @error('phone')
+                                    <div class="validation validation-fail">
+                                        {{ $message }}
+                                    </div>
+                                    @enderror
+                                </div>
+
+                                <div class="col-span-6 sm:col-span-6 lg:col-span-3">
+                                    <label for="password" class="input-label">@lang('texts.password')</label>
+                                    <input id="password" class="input w-full" name="password" wire:model.defer="password" type="password" />
+                                    @error('password')
+                                    <div class="validation validation-fail">
+                                        {{ $message }}
+                                    </div>
+                                    @enderror
+                                </div>
+
+                                <div class="col-span-6 sm:col-span-3 lg:col-span-3">
+                                    <label for="state" class="input-label">@lang('texts.confirm_password')</label>
+                                    <input id="state" class="input w-full" name="password_confirmation" wire:model.defer="password_confirmation" type="password" />
+                                    @error('password_confirmation')
+                                    <div class="validation validation-fail">
+                                        {{ $message }}
+                                    </div>
+                                    @enderror
+                                </div>
+                            </div>
+                        </div>
+                        <div class="px-4 py-3 bg-gray-50 text-right sm:px-6">
+                            <button class="button button-primary">{{ $saved }}</button>
+                        </div>
+                    </div>
+                </form>
+            </div> <!-- End of main form -->
+        </div>
+    </div>