mirror of https://github.com/immich-app/immich.git
feat(web): user profile (#1148)
* fix: allow updateUser for admin account * feat: update user first/last name * feat(web): change passwordpull/1152/head
Jason Rasmussen
GitHub
parent
723a7c563f
commit
14db7a09e3
@ -0,0 +1,16 @@
|
|||||||
|
# openapi.model.ChangePasswordDto
|
||||||
|
|
||||||
|
## Load the model package
|
||||||
|
```dart
|
||||||
|
import 'package:openapi/api.dart';
|
||||||
|
```
|
||||||
|
|
||||||
|
## Properties
|
||||||
|
Name | Type | Description | Notes
|
||||||
|
------------ | ------------- | ------------- | -------------
|
||||||
|
**password** | **String** | |
|
||||||
|
**newPassword** | **String** | |
|
||||||
|
|
||||||
|
[[Back to Model list]](../README.md#documentation-for-models) [[Back to API list]](../README.md#documentation-for-api-endpoints) [[Back to README]](../README.md)
|
||||||
|
|
||||||
|
|
||||||
@ -0,0 +1,119 @@
|
|||||||
|
//
|
||||||
|
// AUTO-GENERATED FILE, DO NOT MODIFY!
|
||||||
|
//
|
||||||
|
// @dart=2.12
|
||||||
|
|
||||||
|
// ignore_for_file: unused_element, unused_import
|
||||||
|
// ignore_for_file: always_put_required_named_parameters_first
|
||||||
|
// ignore_for_file: constant_identifier_names
|
||||||
|
// ignore_for_file: lines_longer_than_80_chars
|
||||||
|
|
||||||
|
part of openapi.api;
|
||||||
|
|
||||||
|
class ChangePasswordDto {
|
||||||
|
/// Returns a new [ChangePasswordDto] instance.
|
||||||
|
ChangePasswordDto({
|
||||||
|
required this.password,
|
||||||
|
required this.newPassword,
|
||||||
|
});
|
||||||
|
|
||||||
|
String password;
|
||||||
|
|
||||||
|
String newPassword;
|
||||||
|
|
||||||
|
@override
|
||||||
|
bool operator ==(Object other) => identical(this, other) || other is ChangePasswordDto &&
|
||||||
|
other.password == password &&
|
||||||
|
other.newPassword == newPassword;
|
||||||
|
|
||||||
|
@override
|
||||||
|
int get hashCode =>
|
||||||
|
// ignore: unnecessary_parenthesis
|
||||||
|
(password.hashCode) +
|
||||||
|
(newPassword.hashCode);
|
||||||
|
|
||||||
|
@override
|
||||||
|
String toString() => 'ChangePasswordDto[password=$password, newPassword=$newPassword]';
|
||||||
|
|
||||||
|
Map<String, dynamic> toJson() {
|
||||||
|
final _json = <String, dynamic>{};
|
||||||
|
_json[r'password'] = password;
|
||||||
|
_json[r'newPassword'] = newPassword;
|
||||||
|
return _json;
|
||||||
|
}
|
||||||
|
|
||||||
|
/// Returns a new [ChangePasswordDto] instance and imports its values from
|
||||||
|
/// [value] if it's a [Map], null otherwise.
|
||||||
|
// ignore: prefer_constructors_over_static_methods
|
||||||
|
static ChangePasswordDto? fromJson(dynamic value) {
|
||||||
|
if (value is Map) {
|
||||||
|
final json = value.cast<String, dynamic>();
|
||||||
|
|
||||||
|
// Ensure that the map contains the required keys.
|
||||||
|
// Note 1: the values aren't checked for validity beyond being non-null.
|
||||||
|
// Note 2: this code is stripped in release mode!
|
||||||
|
assert(() {
|
||||||
|
requiredKeys.forEach((key) {
|
||||||
|
assert(json.containsKey(key), 'Required key "ChangePasswordDto[$key]" is missing from JSON.');
|
||||||
|
assert(json[key] != null, 'Required key "ChangePasswordDto[$key]" has a null value in JSON.');
|
||||||
|
});
|
||||||
|
return true;
|
||||||
|
}());
|
||||||
|
|
||||||
|
return ChangePasswordDto(
|
||||||
|
password: mapValueOfType<String>(json, r'password')!,
|
||||||
|
newPassword: mapValueOfType<String>(json, r'newPassword')!,
|
||||||
|
);
|
||||||
|
}
|
||||||
|
return null;
|
||||||
|
}
|
||||||
|
|
||||||
|
static List<ChangePasswordDto>? listFromJson(dynamic json, {bool growable = false,}) {
|
||||||
|
final result = <ChangePasswordDto>[];
|
||||||
|
if (json is List && json.isNotEmpty) {
|
||||||
|
for (final row in json) {
|
||||||
|
final value = ChangePasswordDto.fromJson(row);
|
||||||
|
if (value != null) {
|
||||||
|
result.add(value);
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
return result.toList(growable: growable);
|
||||||
|
}
|
||||||
|
|
||||||
|
static Map<String, ChangePasswordDto> mapFromJson(dynamic json) {
|
||||||
|
final map = <String, ChangePasswordDto>{};
|
||||||
|
if (json is Map && json.isNotEmpty) {
|
||||||
|
json = json.cast<String, dynamic>(); // ignore: parameter_assignments
|
||||||
|
for (final entry in json.entries) {
|
||||||
|
final value = ChangePasswordDto.fromJson(entry.value);
|
||||||
|
if (value != null) {
|
||||||
|
map[entry.key] = value;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
return map;
|
||||||
|
}
|
||||||
|
|
||||||
|
// maps a json object with a list of ChangePasswordDto-objects as value to a dart map
|
||||||
|
static Map<String, List<ChangePasswordDto>> mapListFromJson(dynamic json, {bool growable = false,}) {
|
||||||
|
final map = <String, List<ChangePasswordDto>>{};
|
||||||
|
if (json is Map && json.isNotEmpty) {
|
||||||
|
json = json.cast<String, dynamic>(); // ignore: parameter_assignments
|
||||||
|
for (final entry in json.entries) {
|
||||||
|
final value = ChangePasswordDto.listFromJson(entry.value, growable: growable,);
|
||||||
|
if (value != null) {
|
||||||
|
map[entry.key] = value;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
return map;
|
||||||
|
}
|
||||||
|
|
||||||
|
/// The list of required keys that must be present in a JSON.
|
||||||
|
static const requiredKeys = <String>{
|
||||||
|
'password',
|
||||||
|
'newPassword',
|
||||||
|
};
|
||||||
|
}
|
||||||
|
|
||||||
@ -0,0 +1,32 @@
|
|||||||
|
//
|
||||||
|
// AUTO-GENERATED FILE, DO NOT MODIFY!
|
||||||
|
//
|
||||||
|
// @dart=2.12
|
||||||
|
|
||||||
|
// ignore_for_file: unused_element, unused_import
|
||||||
|
// ignore_for_file: always_put_required_named_parameters_first
|
||||||
|
// ignore_for_file: constant_identifier_names
|
||||||
|
// ignore_for_file: lines_longer_than_80_chars
|
||||||
|
|
||||||
|
import 'package:openapi/api.dart';
|
||||||
|
import 'package:test/test.dart';
|
||||||
|
|
||||||
|
// tests for ChangePasswordDto
|
||||||
|
void main() {
|
||||||
|
// final instance = ChangePasswordDto();
|
||||||
|
|
||||||
|
group('test ChangePasswordDto', () {
|
||||||
|
// String password
|
||||||
|
test('to test the property `password`', () async {
|
||||||
|
// TODO
|
||||||
|
});
|
||||||
|
|
||||||
|
// String newPassword
|
||||||
|
test('to test the property `newPassword`', () async {
|
||||||
|
// TODO
|
||||||
|
});
|
||||||
|
|
||||||
|
|
||||||
|
});
|
||||||
|
|
||||||
|
}
|
||||||
@ -0,0 +1,15 @@
|
|||||||
|
import { ApiProperty } from '@nestjs/swagger';
|
||||||
|
import { IsNotEmpty, IsString, MinLength } from 'class-validator';
|
||||||
|
|
||||||
|
export class ChangePasswordDto {
|
||||||
|
@IsString()
|
||||||
|
@IsNotEmpty()
|
||||||
|
@ApiProperty({ example: 'password' })
|
||||||
|
password!: string;
|
||||||
|
|
||||||
|
@IsString()
|
||||||
|
@IsNotEmpty()
|
||||||
|
@MinLength(8)
|
||||||
|
@ApiProperty({ example: 'password' })
|
||||||
|
newPassword!: string;
|
||||||
|
}
|
||||||
@ -1,27 +1,154 @@
|
|||||||
<script lang="ts">
|
<script lang="ts">
|
||||||
import { UserResponseDto } from '@api';
|
import {
|
||||||
|
notificationController,
|
||||||
|
NotificationType
|
||||||
|
} from '$lib/components/shared-components/notification/notification';
|
||||||
|
import { api, UserResponseDto } from '@api';
|
||||||
|
import { AxiosError } from 'axios';
|
||||||
|
import { fade } from 'svelte/transition';
|
||||||
import SettingAccordion from '../admin-page/settings/setting-accordion.svelte';
|
import SettingAccordion from '../admin-page/settings/setting-accordion.svelte';
|
||||||
import SettingInputField, {
|
import SettingInputField, {
|
||||||
SettingInputFieldType
|
SettingInputFieldType
|
||||||
} from '../admin-page/settings/setting-input-field.svelte';
|
} from '../admin-page/settings/setting-input-field.svelte';
|
||||||
|
|
||||||
export let user: UserResponseDto;
|
export let user: UserResponseDto;
|
||||||
|
|
||||||
|
const handleSaveProfile = async () => {
|
||||||
|
try {
|
||||||
|
const { data } = await api.userApi.updateUser({
|
||||||
|
id: user.id,
|
||||||
|
firstName: user.firstName,
|
||||||
|
lastName: user.lastName
|
||||||
|
});
|
||||||
|
|
||||||
|
Object.assign(user, data);
|
||||||
|
|
||||||
|
notificationController.show({
|
||||||
|
message: 'Saved profile',
|
||||||
|
type: NotificationType.Info
|
||||||
|
});
|
||||||
|
} catch (error) {
|
||||||
|
console.error('Error [user-profile] [updateProfile]', error);
|
||||||
|
notificationController.show({
|
||||||
|
message: 'Unable to save profile',
|
||||||
|
type: NotificationType.Error
|
||||||
|
});
|
||||||
|
}
|
||||||
|
};
|
||||||
|
|
||||||
|
let password = '';
|
||||||
|
let newPassword = '';
|
||||||
|
let confirmPassword = '';
|
||||||
|
|
||||||
|
const handleChangePassword = async () => {
|
||||||
|
try {
|
||||||
|
await api.authenticationApi.changePassword({
|
||||||
|
password,
|
||||||
|
newPassword
|
||||||
|
});
|
||||||
|
|
||||||
|
notificationController.show({
|
||||||
|
message: 'Updated password',
|
||||||
|
type: NotificationType.Info
|
||||||
|
});
|
||||||
|
|
||||||
|
password = '';
|
||||||
|
newPassword = '';
|
||||||
|
confirmPassword = '';
|
||||||
|
} catch (error: AxiosError | any) {
|
||||||
|
console.error('Error [user-profile] [changePassword]', error);
|
||||||
|
notificationController.show({
|
||||||
|
message: error?.response?.data?.message || 'Unable to change password',
|
||||||
|
type: NotificationType.Error
|
||||||
|
});
|
||||||
|
}
|
||||||
|
};
|
||||||
</script>
|
</script>
|
||||||
|
|
||||||
<SettingAccordion title="User profile" subtitle="Manage the user information">
|
<SettingAccordion title="User Profile" subtitle="View and manage your profile">
|
||||||
|
<section class="my-4">
|
||||||
|
<div in:fade={{ duration: 500 }}>
|
||||||
|
<form autocomplete="off" on:submit|preventDefault>
|
||||||
|
<div class="flex flex-col gap-4 ml-4 mt-4">
|
||||||
|
<SettingInputField
|
||||||
|
inputType={SettingInputFieldType.TEXT}
|
||||||
|
label="User ID"
|
||||||
|
bind:value={user.id}
|
||||||
|
disabled={true}
|
||||||
|
/>
|
||||||
|
|
||||||
|
<SettingInputField
|
||||||
|
inputType={SettingInputFieldType.TEXT}
|
||||||
|
label="Email"
|
||||||
|
bind:value={user.email}
|
||||||
|
disabled={true}
|
||||||
|
/>
|
||||||
|
|
||||||
|
<SettingInputField
|
||||||
|
inputType={SettingInputFieldType.TEXT}
|
||||||
|
label="First name"
|
||||||
|
bind:value={user.firstName}
|
||||||
|
required={true}
|
||||||
|
/>
|
||||||
|
|
||||||
|
<SettingInputField
|
||||||
|
inputType={SettingInputFieldType.TEXT}
|
||||||
|
label="Last name"
|
||||||
|
bind:value={user.lastName}
|
||||||
|
required={true}
|
||||||
|
/>
|
||||||
|
|
||||||
|
<div class="flex justify-end">
|
||||||
|
<button
|
||||||
|
type="submit"
|
||||||
|
on:click={() => handleSaveProfile()}
|
||||||
|
class="text-sm bg-immich-primary dark:bg-immich-dark-primary hover:bg-immich-primary/75 dark:hover:bg-immich-dark-primary/80 px-4 py-2 text-white dark:text-immich-dark-gray rounded-full shadow-md font-medium disabled:opacity-50 disabled:cursor-not-allowed"
|
||||||
|
>Save
|
||||||
|
</button>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</form>
|
||||||
|
</div>
|
||||||
|
</section>
|
||||||
|
</SettingAccordion>
|
||||||
|
|
||||||
|
<SettingAccordion title="Password" subtitle="Change your password">
|
||||||
<section class="my-4">
|
<section class="my-4">
|
||||||
<SettingInputField
|
<div in:fade={{ duration: 500 }}>
|
||||||
inputType={SettingInputFieldType.TEXT}
|
<form autocomplete="off" on:submit|preventDefault>
|
||||||
label="First name"
|
<div class="flex flex-col gap-4 ml-4 mt-4">
|
||||||
bind:value={user.firstName}
|
<SettingInputField
|
||||||
required={true}
|
inputType={SettingInputFieldType.PASSWORD}
|
||||||
/>
|
label="Password"
|
||||||
|
bind:value={password}
|
||||||
<SettingInputField
|
required={true}
|
||||||
inputType={SettingInputFieldType.TEXT}
|
/>
|
||||||
label="Last name"
|
|
||||||
bind:value={user.lastName}
|
<SettingInputField
|
||||||
required={true}
|
inputType={SettingInputFieldType.PASSWORD}
|
||||||
/>
|
label="New password"
|
||||||
|
bind:value={newPassword}
|
||||||
|
required={true}
|
||||||
|
/>
|
||||||
|
|
||||||
|
<SettingInputField
|
||||||
|
inputType={SettingInputFieldType.PASSWORD}
|
||||||
|
label="Confirm password"
|
||||||
|
bind:value={confirmPassword}
|
||||||
|
required={true}
|
||||||
|
/>
|
||||||
|
|
||||||
|
<div class="flex justify-end">
|
||||||
|
<button
|
||||||
|
type="submit"
|
||||||
|
disabled={!(password && newPassword && newPassword === confirmPassword)}
|
||||||
|
on:click={() => handleChangePassword()}
|
||||||
|
class="text-sm bg-immich-primary dark:bg-immich-dark-primary hover:bg-immich-primary/75 dark:hover:bg-immich-dark-primary/80 px-4 py-2 text-white dark:text-immich-dark-gray rounded-full shadow-md font-medium disabled:opacity-50 disabled:cursor-not-allowed"
|
||||||
|
>Save
|
||||||
|
</button>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</form>
|
||||||
|
</div>
|
||||||
</section>
|
</section>
|
||||||
</SettingAccordion>
|
</SettingAccordion>
|
||||||
|
|||||||
Loading…
Reference in New Issue