pr feedback

fix: tests
2024-02-02 17:59:15 +01:00 · 2024-02-02 15:24:30 +01:00 · 2024-02-02 14:46:55 +01:00 · 2024-02-02 13:58:02 +01:00 · 2024-02-02 13:49:10 +01:00 · 2024-02-02 12:35:08 +01:00
43 changed files with 1664 additions and 377 deletions
@@ -65,7 +65,6 @@ doc/DownloadResponseDto.md
 doc/EntityType.md
 doc/ExifResponseDto.md
 doc/FaceApi.md
-doc/FaceDto.md
 doc/FileChecksumDto.md
 doc/FileChecksumResponseDto.md
 doc/FileReportDto.md
@@ -103,6 +102,7 @@ doc/PathType.md
 doc/PeopleResponseDto.md
 doc/PeopleUpdateDto.md
 doc/PeopleUpdateItem.md
+doc/PeopleWithFacesResponseDto.md
 doc/PersonApi.md
 doc/PersonResponseDto.md
 doc/PersonStatisticsResponseDto.md
@@ -111,6 +111,7 @@ doc/PersonWithFacesResponseDto.md
 doc/QueueStatusDto.md
 doc/ReactionLevel.md
 doc/ReactionType.md
+doc/ReassignFaceDto.md
 doc/RecognitionConfig.md
 doc/ScanLibraryDto.md
 doc/SearchAlbumResponseDto.md
@@ -265,7 +266,6 @@ lib/model/download_info_dto.dart
 lib/model/download_response_dto.dart
 lib/model/entity_type.dart
 lib/model/exif_response_dto.dart
-lib/model/face_dto.dart
 lib/model/file_checksum_dto.dart
 lib/model/file_checksum_response_dto.dart
 lib/model/file_report_dto.dart
@@ -299,6 +299,7 @@ lib/model/path_type.dart
 lib/model/people_response_dto.dart
 lib/model/people_update_dto.dart
 lib/model/people_update_item.dart
+lib/model/people_with_faces_response_dto.dart
 lib/model/person_response_dto.dart
 lib/model/person_statistics_response_dto.dart
 lib/model/person_update_dto.dart
@@ -306,6 +307,7 @@ lib/model/person_with_faces_response_dto.dart
 lib/model/queue_status_dto.dart
 lib/model/reaction_level.dart
 lib/model/reaction_type.dart
+lib/model/reassign_face_dto.dart
 lib/model/recognition_config.dart
 lib/model/scan_library_dto.dart
 lib/model/search_album_response_dto.dart
@@ -432,7 +434,6 @@ test/download_response_dto_test.dart
 test/entity_type_test.dart
 test/exif_response_dto_test.dart
 test/face_api_test.dart
-test/face_dto_test.dart
 test/file_checksum_dto_test.dart
 test/file_checksum_response_dto_test.dart
 test/file_report_dto_test.dart
@@ -470,6 +471,7 @@ test/path_type_test.dart
 test/people_response_dto_test.dart
 test/people_update_dto_test.dart
 test/people_update_item_test.dart
+test/people_with_faces_response_dto_test.dart
 test/person_api_test.dart
 test/person_response_dto_test.dart
 test/person_statistics_response_dto_test.dart
@@ -478,6 +480,7 @@ test/person_with_faces_response_dto_test.dart
 test/queue_status_dto_test.dart
 test/reaction_level_test.dart
 test/reaction_type_test.dart
+test/reassign_face_dto_test.dart
 test/recognition_config_test.dart
 test/scan_library_dto_test.dart
 test/search_album_response_dto_test.dart
@@ -137,7 +137,8 @@ Class | Method | HTTP request | Description
 *DownloadApi* | [**downloadFile**](doc//DownloadApi.md#downloadfile) | **POST** /download/asset/{id} | 
 *DownloadApi* | [**getDownloadInfo**](doc//DownloadApi.md#getdownloadinfo) | **POST** /download/info | 
 *FaceApi* | [**getFaces**](doc//FaceApi.md#getfaces) | **GET** /face | 
-*FaceApi* | [**reassignFacesById**](doc//FaceApi.md#reassignfacesbyid) | **PUT** /face/{id} | 
+*FaceApi* | [**reassignFace**](doc//FaceApi.md#reassignface) | **PUT** /face/{id} | 
+*FaceApi* | [**unassignFace**](doc//FaceApi.md#unassignface) | **DELETE** /face/{id} | 
 *JobApi* | [**getAllJobsStatus**](doc//JobApi.md#getalljobsstatus) | **GET** /jobs | 
 *JobApi* | [**sendJobCommand**](doc//JobApi.md#sendjobcommand) | **PUT** /jobs/{id} | 
 *LibraryApi* | [**createLibrary**](doc//LibraryApi.md#createlibrary) | **POST** /library | 
@@ -166,6 +167,7 @@ Class | Method | HTTP request | Description
 *PersonApi* | [**getPersonThumbnail**](doc//PersonApi.md#getpersonthumbnail) | **GET** /person/{id}/thumbnail | 
 *PersonApi* | [**mergePerson**](doc//PersonApi.md#mergeperson) | **POST** /person/{id}/merge | 
 *PersonApi* | [**reassignFaces**](doc//PersonApi.md#reassignfaces) | **PUT** /person/{id}/reassign | 
+*PersonApi* | [**unassignFaces**](doc//PersonApi.md#unassignfaces) | **DELETE** /person | 
 *PersonApi* | [**updatePeople**](doc//PersonApi.md#updatepeople) | **PUT** /person | 
 *PersonApi* | [**updatePerson**](doc//PersonApi.md#updateperson) | **PUT** /person/{id} | 
 *SearchApi* | [**getExploreData**](doc//SearchApi.md#getexploredata) | **GET** /search/explore | 
@@ -272,7 +274,6 @@ Class | Method | HTTP request | Description
 - [DownloadResponseDto](doc//DownloadResponseDto.md)
 - [EntityType](doc//EntityType.md)
 - [ExifResponseDto](doc//ExifResponseDto.md)
- - [FaceDto](doc//FaceDto.md)
 - [FileChecksumDto](doc//FileChecksumDto.md)
 - [FileChecksumResponseDto](doc//FileChecksumResponseDto.md)
 - [FileReportDto](doc//FileReportDto.md)
@@ -306,6 +307,7 @@ Class | Method | HTTP request | Description
 - [PeopleResponseDto](doc//PeopleResponseDto.md)
 - [PeopleUpdateDto](doc//PeopleUpdateDto.md)
 - [PeopleUpdateItem](doc//PeopleUpdateItem.md)
+ - [PeopleWithFacesResponseDto](doc//PeopleWithFacesResponseDto.md)
 - [PersonResponseDto](doc//PersonResponseDto.md)
 - [PersonStatisticsResponseDto](doc//PersonStatisticsResponseDto.md)
 - [PersonUpdateDto](doc//PersonUpdateDto.md)
@@ -313,6 +315,7 @@ Class | Method | HTTP request | Description
 - [QueueStatusDto](doc//QueueStatusDto.md)
 - [ReactionLevel](doc//ReactionLevel.md)
 - [ReactionType](doc//ReactionType.md)
+ - [ReassignFaceDto](doc//ReassignFaceDto.md)
 - [RecognitionConfig](doc//RecognitionConfig.md)
 - [ScanLibraryDto](doc//ScanLibraryDto.md)
 - [SearchAlbumResponseDto](doc//SearchAlbumResponseDto.md)
@@ -30,7 +30,7 @@ Name | Type | Description | Notes
 **originalPath** | **String** |  | 
 **owner** | [**UserResponseDto**](UserResponseDto.md) |  | [optional] 
 **ownerId** | **String** |  | 
-**people** | [**List<PersonWithFacesResponseDto>**](PersonWithFacesResponseDto.md) |  | [optional] [default to const []]
+**people** | [**PeopleWithFacesResponseDto**](PeopleWithFacesResponseDto.md) |  | [optional] 
 **resized** | **bool** |  | 
 **smartInfo** | [**SmartInfoResponseDto**](SmartInfoResponseDto.md) |  | [optional] 
 **stack** | [**List<AssetResponseDto>**](AssetResponseDto.md) |  | [optional] [default to const []]
@@ -10,11 +10,12 @@ All URIs are relative to */api*
 Method | HTTP request | Description
 ------------- | ------------- | -------------
 [**getFaces**](FaceApi.md#getfaces) | **GET** /face | 
-[**reassignFacesById**](FaceApi.md#reassignfacesbyid) | **PUT** /face/{id} | 
+[**reassignFace**](FaceApi.md#reassignface) | **PUT** /face/{id} | 
+[**unassignFace**](FaceApi.md#unassignface) | **DELETE** /face/{id} | 


 # **getFaces**
-> List<AssetFaceResponseDto> getFaces(id)
+> List<AssetFaceResponseDto> getFaces(faceId)



@@ -37,10 +38,10 @@ import 'package:openapi/api.dart';
 //defaultApiClient.getAuthentication<HttpBearerAuth>('bearer').setAccessToken(yourTokenGeneratorFunction);

 final api_instance = FaceApi();
-final id = 38400000-8cf0-11bd-b23e-10b96e4ef00d; // String | 
+final faceId = 38400000-8cf0-11bd-b23e-10b96e4ef00d; // String | 

 try {
-    final result = api_instance.getFaces(id);
+    final result = api_instance.getFaces(faceId);
    print(result);
 } catch (e) {
    print('Exception when calling FaceApi->getFaces: $e\n');
@@ -51,7 +52,7 @@ try {

 Name | Type | Description  | Notes
 ------------- | ------------- | ------------- | -------------
- **id** | **String**|  | 
+ **faceId** | **String**|  | 

 ### Return type

@@ -68,8 +69,8 @@ Name | Type | Description  | Notes

 [[Back to top]](#) [[Back to API list]](../README.md#documentation-for-api-endpoints) [[Back to Model list]](../README.md#documentation-for-models) [[Back to README]](../README.md)

-# **reassignFacesById**
-> PersonResponseDto reassignFacesById(id, faceDto)
+# **reassignFace**
+> PersonResponseDto reassignFace(id, reassignFaceDto)



@@ -93,13 +94,13 @@ import 'package:openapi/api.dart';

 final api_instance = FaceApi();
 final id = 38400000-8cf0-11bd-b23e-10b96e4ef00d; // String | 
-final faceDto = FaceDto(); // FaceDto | 
+final reassignFaceDto = ReassignFaceDto(); // ReassignFaceDto | 

 try {
-    final result = api_instance.reassignFacesById(id, faceDto);
+    final result = api_instance.reassignFace(id, reassignFaceDto);
    print(result);
 } catch (e) {
-    print('Exception when calling FaceApi->reassignFacesById: $e\n');
+    print('Exception when calling FaceApi->reassignFace: $e\n');
 }
 ```

@@ -108,7 +109,7 @@ try {
 Name | Type | Description  | Notes
 ------------- | ------------- | ------------- | -------------
 **id** | **String**|  | 
- **faceDto** | [**FaceDto**](FaceDto.md)|  | 
+ **reassignFaceDto** | [**ReassignFaceDto**](ReassignFaceDto.md)|  | 

 ### Return type

@@ -125,3 +126,58 @@ Name | Type | Description  | Notes

 [[Back to top]](#) [[Back to API list]](../README.md#documentation-for-api-endpoints) [[Back to Model list]](../README.md#documentation-for-models) [[Back to README]](../README.md)

+# **unassignFace**
+> AssetFaceResponseDto unassignFace(id)
+
+
+
+### Example
+```dart
+import 'package:openapi/api.dart';
+// TODO Configure API key authorization: cookie
+//defaultApiClient.getAuthentication<ApiKeyAuth>('cookie').apiKey = 'YOUR_API_KEY';
+// uncomment below to setup prefix (e.g. Bearer) for API key, if needed
+//defaultApiClient.getAuthentication<ApiKeyAuth>('cookie').apiKeyPrefix = 'Bearer';
+// TODO Configure API key authorization: api_key
+//defaultApiClient.getAuthentication<ApiKeyAuth>('api_key').apiKey = 'YOUR_API_KEY';
+// uncomment below to setup prefix (e.g. Bearer) for API key, if needed
+//defaultApiClient.getAuthentication<ApiKeyAuth>('api_key').apiKeyPrefix = 'Bearer';
+// TODO Configure HTTP Bearer authorization: bearer
+// Case 1. Use String Token
+//defaultApiClient.getAuthentication<HttpBearerAuth>('bearer').setAccessToken('YOUR_ACCESS_TOKEN');
+// Case 2. Use Function which generate token.
+// String yourTokenGeneratorFunction() { ... }
+//defaultApiClient.getAuthentication<HttpBearerAuth>('bearer').setAccessToken(yourTokenGeneratorFunction);
+
+final api_instance = FaceApi();
+final id = 38400000-8cf0-11bd-b23e-10b96e4ef00d; // String | 
+
+try {
+    final result = api_instance.unassignFace(id);
+    print(result);
+} catch (e) {
+    print('Exception when calling FaceApi->unassignFace: $e\n');
+}
+```
+
+### Parameters
+
+Name | Type | Description  | Notes
+------------- | ------------- | ------------- | -------------
+ **id** | **String**|  | 
+
+### Return type
+
+[**AssetFaceResponseDto**](AssetFaceResponseDto.md)
+
+### Authorization
+
+[cookie](../README.md#cookie), [api_key](../README.md#api_key), [bearer](../README.md#bearer)
+
+### HTTP request headers
+
+ - **Content-Type**: Not defined
+ - **Accept**: application/json
+
+[[Back to top]](#) [[Back to API list]](../README.md#documentation-for-api-endpoints) [[Back to Model list]](../README.md#documentation-for-models) [[Back to README]](../README.md)
+
@@ -0,0 +1,16 @@
+# openapi.model.PeopleWithFacesResponseDto
+
+## Load the model package
+```dart
+import 'package:openapi/api.dart';
+```
+
+## Properties
+Name | Type | Description | Notes
+------------ | ------------- | ------------- | -------------
+**numberOfFaces** | **int** |  | 
+**people** | [**List<PersonWithFacesResponseDto>**](PersonWithFacesResponseDto.md) |  | [default to const []]
+
+[[Back to Model list]](../README.md#documentation-for-models) [[Back to API list]](../README.md#documentation-for-api-endpoints) [[Back to README]](../README.md)
+
+
@@ -17,6 +17,7 @@ Method | HTTP request | Description
 [**getPersonThumbnail**](PersonApi.md#getpersonthumbnail) | **GET** /person/{id}/thumbnail | 
 [**mergePerson**](PersonApi.md#mergeperson) | **POST** /person/{id}/merge | 
 [**reassignFaces**](PersonApi.md#reassignfaces) | **PUT** /person/{id}/reassign | 
+[**unassignFaces**](PersonApi.md#unassignfaces) | **DELETE** /person | 
 [**updatePeople**](PersonApi.md#updatepeople) | **PUT** /person | 
 [**updatePerson**](PersonApi.md#updateperson) | **PUT** /person/{id} | 

@@ -461,6 +462,61 @@ Name | Type | Description  | Notes

 [[Back to top]](#) [[Back to API list]](../README.md#documentation-for-api-endpoints) [[Back to Model list]](../README.md#documentation-for-models) [[Back to README]](../README.md)

+# **unassignFaces**
+> List<BulkIdResponseDto> unassignFaces(assetFaceUpdateDto)
+
+
+
+### Example
+```dart
+import 'package:openapi/api.dart';
+// TODO Configure API key authorization: cookie
+//defaultApiClient.getAuthentication<ApiKeyAuth>('cookie').apiKey = 'YOUR_API_KEY';
+// uncomment below to setup prefix (e.g. Bearer) for API key, if needed
+//defaultApiClient.getAuthentication<ApiKeyAuth>('cookie').apiKeyPrefix = 'Bearer';
+// TODO Configure API key authorization: api_key
+//defaultApiClient.getAuthentication<ApiKeyAuth>('api_key').apiKey = 'YOUR_API_KEY';
+// uncomment below to setup prefix (e.g. Bearer) for API key, if needed
+//defaultApiClient.getAuthentication<ApiKeyAuth>('api_key').apiKeyPrefix = 'Bearer';
+// TODO Configure HTTP Bearer authorization: bearer
+// Case 1. Use String Token
+//defaultApiClient.getAuthentication<HttpBearerAuth>('bearer').setAccessToken('YOUR_ACCESS_TOKEN');
+// Case 2. Use Function which generate token.
+// String yourTokenGeneratorFunction() { ... }
+//defaultApiClient.getAuthentication<HttpBearerAuth>('bearer').setAccessToken(yourTokenGeneratorFunction);
+
+final api_instance = PersonApi();
+final assetFaceUpdateDto = AssetFaceUpdateDto(); // AssetFaceUpdateDto | 
+
+try {
+    final result = api_instance.unassignFaces(assetFaceUpdateDto);
+    print(result);
+} catch (e) {
+    print('Exception when calling PersonApi->unassignFaces: $e\n');
+}
+```
+
+### Parameters
+
+Name | Type | Description  | Notes
+------------- | ------------- | ------------- | -------------
+ **assetFaceUpdateDto** | [**AssetFaceUpdateDto**](AssetFaceUpdateDto.md)|  | 
+
+### Return type
+
+[**List<BulkIdResponseDto>**](BulkIdResponseDto.md)
+
+### Authorization
+
+[cookie](../README.md#cookie), [api_key](../README.md#api_key), [bearer](../README.md#bearer)
+
+### HTTP request headers
+
+ - **Content-Type**: application/json
+ - **Accept**: application/json
+
+[[Back to top]](#) [[Back to API list]](../README.md#documentation-for-api-endpoints) [[Back to Model list]](../README.md#documentation-for-models) [[Back to README]](../README.md)
+
 # **updatePeople**
 > List<BulkIdResponseDto> updatePeople(peopleUpdateDto)

@@ -1,4 +1,4 @@
-# openapi.model.FaceDto
+# openapi.model.ReassignFaceDto

 ## Load the model package
 ```dart
@@ -8,7 +8,7 @@ import 'package:openapi/api.dart';
 ## Properties
 Name | Type | Description | Notes
 ------------ | ------------- | ------------- | -------------
-**id** | **String** |  | 
+**personId** | **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)

@@ -104,7 +104,6 @@ part 'model/download_info_dto.dart';
 part 'model/download_response_dto.dart';
 part 'model/entity_type.dart';
 part 'model/exif_response_dto.dart';
-part 'model/face_dto.dart';
 part 'model/file_checksum_dto.dart';
 part 'model/file_checksum_response_dto.dart';
 part 'model/file_report_dto.dart';
@@ -138,6 +137,7 @@ part 'model/path_type.dart';
 part 'model/people_response_dto.dart';
 part 'model/people_update_dto.dart';
 part 'model/people_update_item.dart';
+part 'model/people_with_faces_response_dto.dart';
 part 'model/person_response_dto.dart';
 part 'model/person_statistics_response_dto.dart';
 part 'model/person_update_dto.dart';
@@ -145,6 +145,7 @@ part 'model/person_with_faces_response_dto.dart';
 part 'model/queue_status_dto.dart';
 part 'model/reaction_level.dart';
 part 'model/reaction_type.dart';
+part 'model/reassign_face_dto.dart';
 part 'model/recognition_config.dart';
 part 'model/scan_library_dto.dart';
 part 'model/search_album_response_dto.dart';
@@ -19,8 +19,8 @@ class FaceApi {
  /// Performs an HTTP 'GET /face' operation and returns the [Response].
  /// Parameters:
  ///
-  /// * [String] id (required):
-  Future<Response> getFacesWithHttpInfo(String id,) async {
+  /// * [String] faceId (required):
+  Future<Response> getFacesWithHttpInfo(String faceId,) async {
    // ignore: prefer_const_declarations
    final path = r'/face';

@@ -31,7 +31,7 @@ class FaceApi {
    final headerParams = <String, String>{};
    final formParams = <String, String>{};

-      queryParams.addAll(_queryParams('', 'id', id));
+      queryParams.addAll(_queryParams('', 'faceId', faceId));

    const contentTypes = <String>[];

@@ -49,9 +49,9 @@ class FaceApi {

  /// Parameters:
  ///
-  /// * [String] id (required):
-  Future<List<AssetFaceResponseDto>?> getFaces(String id,) async {
-    final response = await getFacesWithHttpInfo(id,);
+  /// * [String] faceId (required):
+  Future<List<AssetFaceResponseDto>?> getFaces(String faceId,) async {
+    final response = await getFacesWithHttpInfo(faceId,);
    if (response.statusCode >= HttpStatus.badRequest) {
      throw ApiException(response.statusCode, await _decodeBodyBytes(response));
    }
@@ -73,14 +73,14 @@ class FaceApi {
  ///
  /// * [String] id (required):
  ///
-  /// * [FaceDto] faceDto (required):
-  Future<Response> reassignFacesByIdWithHttpInfo(String id, FaceDto faceDto,) async {
+  /// * [ReassignFaceDto] reassignFaceDto (required):
+  Future<Response> reassignFaceWithHttpInfo(String id, ReassignFaceDto reassignFaceDto,) async {
    // ignore: prefer_const_declarations
    final path = r'/face/{id}'
      .replaceAll('{id}', id);

    // ignore: prefer_final_locals
-    Object? postBody = faceDto;
+    Object? postBody = reassignFaceDto;

    final queryParams = <QueryParam>[];
    final headerParams = <String, String>{};
@@ -104,9 +104,9 @@ class FaceApi {
  ///
  /// * [String] id (required):
  ///
-  /// * [FaceDto] faceDto (required):
-  Future<PersonResponseDto?> reassignFacesById(String id, FaceDto faceDto,) async {
-    final response = await reassignFacesByIdWithHttpInfo(id, faceDto,);
+  /// * [ReassignFaceDto] reassignFaceDto (required):
+  Future<PersonResponseDto?> reassignFace(String id, ReassignFaceDto reassignFaceDto,) async {
+    final response = await reassignFaceWithHttpInfo(id, reassignFaceDto,);
    if (response.statusCode >= HttpStatus.badRequest) {
      throw ApiException(response.statusCode, await _decodeBodyBytes(response));
    }
@@ -119,4 +119,52 @@ class FaceApi {
    }
    return null;
  }
+
+  /// Performs an HTTP 'DELETE /face/{id}' operation and returns the [Response].
+  /// Parameters:
+  ///
+  /// * [String] id (required):
+  Future<Response> unassignFaceWithHttpInfo(String id,) async {
+    // ignore: prefer_const_declarations
+    final path = r'/face/{id}'
+      .replaceAll('{id}', id);
+
+    // ignore: prefer_final_locals
+    Object? postBody;
+
+    final queryParams = <QueryParam>[];
+    final headerParams = <String, String>{};
+    final formParams = <String, String>{};
+
+    const contentTypes = <String>[];
+
+
+    return apiClient.invokeAPI(
+      path,
+      'DELETE',
+      queryParams,
+      postBody,
+      headerParams,
+      formParams,
+      contentTypes.isEmpty ? null : contentTypes.first,
+    );
+  }
+
+  /// Parameters:
+  ///
+  /// * [String] id (required):
+  Future<AssetFaceResponseDto?> unassignFace(String id,) async {
+    final response = await unassignFaceWithHttpInfo(id,);
+    if (response.statusCode >= HttpStatus.badRequest) {
+      throw ApiException(response.statusCode, await _decodeBodyBytes(response));
+    }
+    // When a remote server returns no body with a status of 204, we shall not decode it.
+    // At the time of writing this, `dart:convert` will throw an "Unexpected end of input"
+    // FormatException when trying to decode an empty string.
+    if (response.body.isNotEmpty && response.statusCode != HttpStatus.noContent) {
+      return await apiClient.deserializeAsync(await _decodeBodyBytes(response), 'AssetFaceResponseDto',) as AssetFaceResponseDto;
+    
+    }
+    return null;
+  }
 }
@@ -413,6 +413,56 @@ class PersonApi {
    return null;
  }

+  /// Performs an HTTP 'DELETE /person' operation and returns the [Response].
+  /// Parameters:
+  ///
+  /// * [AssetFaceUpdateDto] assetFaceUpdateDto (required):
+  Future<Response> unassignFacesWithHttpInfo(AssetFaceUpdateDto assetFaceUpdateDto,) async {
+    // ignore: prefer_const_declarations
+    final path = r'/person';
+
+    // ignore: prefer_final_locals
+    Object? postBody = assetFaceUpdateDto;
+
+    final queryParams = <QueryParam>[];
+    final headerParams = <String, String>{};
+    final formParams = <String, String>{};
+
+    const contentTypes = <String>['application/json'];
+
+
+    return apiClient.invokeAPI(
+      path,
+      'DELETE',
+      queryParams,
+      postBody,
+      headerParams,
+      formParams,
+      contentTypes.isEmpty ? null : contentTypes.first,
+    );
+  }
+
+  /// Parameters:
+  ///
+  /// * [AssetFaceUpdateDto] assetFaceUpdateDto (required):
+  Future<List<BulkIdResponseDto>?> unassignFaces(AssetFaceUpdateDto assetFaceUpdateDto,) async {
+    final response = await unassignFacesWithHttpInfo(assetFaceUpdateDto,);
+    if (response.statusCode >= HttpStatus.badRequest) {
+      throw ApiException(response.statusCode, await _decodeBodyBytes(response));
+    }
+    // When a remote server returns no body with a status of 204, we shall not decode it.
+    // At the time of writing this, `dart:convert` will throw an "Unexpected end of input"
+    // FormatException when trying to decode an empty string.
+    if (response.body.isNotEmpty && response.statusCode != HttpStatus.noContent) {
+      final responseBody = await _decodeBodyBytes(response);
+      return (await apiClient.deserializeAsync(responseBody, 'List<BulkIdResponseDto>') as List)
+        .cast<BulkIdResponseDto>()
+        .toList(growable: false);
+
+    }
+    return null;
+  }
+
  /// Performs an HTTP 'PUT /person' operation and returns the [Response].
  /// Parameters:
  ///
@@ -290,8 +290,6 @@ class ApiClient {
          return EntityTypeTypeTransformer().decode(value);
        case 'ExifResponseDto':
          return ExifResponseDto.fromJson(value);
-        case 'FaceDto':
-          return FaceDto.fromJson(value);
        case 'FileChecksumDto':
          return FileChecksumDto.fromJson(value);
        case 'FileChecksumResponseDto':
@@ -358,6 +356,8 @@ class ApiClient {
          return PeopleUpdateDto.fromJson(value);
        case 'PeopleUpdateItem':
          return PeopleUpdateItem.fromJson(value);
+        case 'PeopleWithFacesResponseDto':
+          return PeopleWithFacesResponseDto.fromJson(value);
        case 'PersonResponseDto':
          return PersonResponseDto.fromJson(value);
        case 'PersonStatisticsResponseDto':
@@ -372,6 +372,8 @@ class ApiClient {
          return ReactionLevelTypeTransformer().decode(value);
        case 'ReactionType':
          return ReactionTypeTypeTransformer().decode(value);
+        case 'ReassignFaceDto':
+          return ReassignFaceDto.fromJson(value);
        case 'RecognitionConfig':
          return RecognitionConfig.fromJson(value);
        case 'ScanLibraryDto':
@@ -35,7 +35,7 @@ class AssetResponseDto {
    required this.originalPath,
    this.owner,
    required this.ownerId,
-    this.people = const [],
+    this.people,
    required this.resized,
    this.smartInfo,
    this.stack = const [],
@@ -104,7 +104,13 @@ class AssetResponseDto {

  String ownerId;

-  List<PersonWithFacesResponseDto> people;
+  ///
+  /// Please note: This property should have been non-nullable! Since the specification file
+  /// does not include a default value (using the "default:" property), however, the generated
+  /// source code must fall back to having a nullable type.
+  /// Consider adding a "default:" property in the specification file to hide this note.
+  ///
+  PeopleWithFacesResponseDto? people;

  bool resized;

@@ -154,7 +160,7 @@ class AssetResponseDto {
    other.originalPath == originalPath &&
    other.owner == owner &&
    other.ownerId == ownerId &&
-    _deepEquality.equals(other.people, people) &&
+    other.people == people &&
    other.resized == resized &&
    other.smartInfo == smartInfo &&
    _deepEquality.equals(other.stack, stack) &&
@@ -190,7 +196,7 @@ class AssetResponseDto {
    (originalPath.hashCode) +
    (owner == null ? 0 : owner!.hashCode) +
    (ownerId.hashCode) +
-    (people.hashCode) +
+    (people == null ? 0 : people!.hashCode) +
    (resized.hashCode) +
    (smartInfo == null ? 0 : smartInfo!.hashCode) +
    (stack.hashCode) +
@@ -240,7 +246,11 @@ class AssetResponseDto {
    //  json[r'owner'] = null;
    }
      json[r'ownerId'] = this.ownerId;
+    if (this.people != null) {
      json[r'people'] = this.people;
+    } else {
+    //  json[r'people'] = null;
+    }
      json[r'resized'] = this.resized;
    if (this.smartInfo != null) {
      json[r'smartInfo'] = this.smartInfo;
@@ -299,7 +309,7 @@ class AssetResponseDto {
        originalPath: mapValueOfType<String>(json, r'originalPath')!,
        owner: UserResponseDto.fromJson(json[r'owner']),
        ownerId: mapValueOfType<String>(json, r'ownerId')!,
-        people: PersonWithFacesResponseDto.listFromJson(json[r'people']),
+        people: PeopleWithFacesResponseDto.fromJson(json[r'people']),
        resized: mapValueOfType<bool>(json, r'resized')!,
        smartInfo: SmartInfoResponseDto.fromJson(json[r'smartInfo']),
        stack: AssetResponseDto.listFromJson(json[r'stack']),
@@ -0,0 +1,106 @@
+//
+// 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 PeopleWithFacesResponseDto {
+  /// Returns a new [PeopleWithFacesResponseDto] instance.
+  PeopleWithFacesResponseDto({
+    required this.numberOfFaces,
+    this.people = const [],
+  });
+
+  int numberOfFaces;
+
+  List<PersonWithFacesResponseDto> people;
+
+  @override
+  bool operator ==(Object other) => identical(this, other) || other is PeopleWithFacesResponseDto &&
+    other.numberOfFaces == numberOfFaces &&
+    _deepEquality.equals(other.people, people);
+
+  @override
+  int get hashCode =>
+    // ignore: unnecessary_parenthesis
+    (numberOfFaces.hashCode) +
+    (people.hashCode);
+
+  @override
+  String toString() => 'PeopleWithFacesResponseDto[numberOfFaces=$numberOfFaces, people=$people]';
+
+  Map<String, dynamic> toJson() {
+    final json = <String, dynamic>{};
+      json[r'numberOfFaces'] = this.numberOfFaces;
+      json[r'people'] = this.people;
+    return json;
+  }
+
+  /// Returns a new [PeopleWithFacesResponseDto] instance and imports its values from
+  /// [value] if it's a [Map], null otherwise.
+  // ignore: prefer_constructors_over_static_methods
+  static PeopleWithFacesResponseDto? fromJson(dynamic value) {
+    if (value is Map) {
+      final json = value.cast<String, dynamic>();
+
+      return PeopleWithFacesResponseDto(
+        numberOfFaces: mapValueOfType<int>(json, r'numberOfFaces')!,
+        people: PersonWithFacesResponseDto.listFromJson(json[r'people']),
+      );
+    }
+    return null;
+  }
+
+  static List<PeopleWithFacesResponseDto> listFromJson(dynamic json, {bool growable = false,}) {
+    final result = <PeopleWithFacesResponseDto>[];
+    if (json is List && json.isNotEmpty) {
+      for (final row in json) {
+        final value = PeopleWithFacesResponseDto.fromJson(row);
+        if (value != null) {
+          result.add(value);
+        }
+      }
+    }
+    return result.toList(growable: growable);
+  }
+
+  static Map<String, PeopleWithFacesResponseDto> mapFromJson(dynamic json) {
+    final map = <String, PeopleWithFacesResponseDto>{};
+    if (json is Map && json.isNotEmpty) {
+      json = json.cast<String, dynamic>(); // ignore: parameter_assignments
+      for (final entry in json.entries) {
+        final value = PeopleWithFacesResponseDto.fromJson(entry.value);
+        if (value != null) {
+          map[entry.key] = value;
+        }
+      }
+    }
+    return map;
+  }
+
+  // maps a json object with a list of PeopleWithFacesResponseDto-objects as value to a dart map
+  static Map<String, List<PeopleWithFacesResponseDto>> mapListFromJson(dynamic json, {bool growable = false,}) {
+    final map = <String, List<PeopleWithFacesResponseDto>>{};
+    if (json is Map && json.isNotEmpty) {
+      // ignore: parameter_assignments
+      json = json.cast<String, dynamic>();
+      for (final entry in json.entries) {
+        map[entry.key] = PeopleWithFacesResponseDto.listFromJson(entry.value, growable: growable,);
+      }
+    }
+    return map;
+  }
+
+  /// The list of required keys that must be present in a JSON.
+  static const requiredKeys = <String>{
+    'numberOfFaces',
+    'people',
+  };
+}
+
@@ -10,51 +10,51 @@

 part of openapi.api;

-class FaceDto {
-  /// Returns a new [FaceDto] instance.
-  FaceDto({
-    required this.id,
+class ReassignFaceDto {
+  /// Returns a new [ReassignFaceDto] instance.
+  ReassignFaceDto({
+    required this.personId,
  });

-  String id;
+  String personId;

  @override
-  bool operator ==(Object other) => identical(this, other) || other is FaceDto &&
-    other.id == id;
+  bool operator ==(Object other) => identical(this, other) || other is ReassignFaceDto &&
+    other.personId == personId;

  @override
  int get hashCode =>
    // ignore: unnecessary_parenthesis
-    (id.hashCode);
+    (personId.hashCode);

  @override
-  String toString() => 'FaceDto[id=$id]';
+  String toString() => 'ReassignFaceDto[personId=$personId]';

  Map<String, dynamic> toJson() {
    final json = <String, dynamic>{};
-      json[r'id'] = this.id;
+      json[r'personId'] = this.personId;
    return json;
  }

-  /// Returns a new [FaceDto] instance and imports its values from
+  /// Returns a new [ReassignFaceDto] instance and imports its values from
  /// [value] if it's a [Map], null otherwise.
  // ignore: prefer_constructors_over_static_methods
-  static FaceDto? fromJson(dynamic value) {
+  static ReassignFaceDto? fromJson(dynamic value) {
    if (value is Map) {
      final json = value.cast<String, dynamic>();

-      return FaceDto(
-        id: mapValueOfType<String>(json, r'id')!,
+      return ReassignFaceDto(
+        personId: mapValueOfType<String>(json, r'personId')!,
      );
    }
    return null;
  }

-  static List<FaceDto> listFromJson(dynamic json, {bool growable = false,}) {
-    final result = <FaceDto>[];
+  static List<ReassignFaceDto> listFromJson(dynamic json, {bool growable = false,}) {
+    final result = <ReassignFaceDto>[];
    if (json is List && json.isNotEmpty) {
      for (final row in json) {
-        final value = FaceDto.fromJson(row);
+        final value = ReassignFaceDto.fromJson(row);
        if (value != null) {
          result.add(value);
        }
@@ -63,12 +63,12 @@ class FaceDto {
    return result.toList(growable: growable);
  }

-  static Map<String, FaceDto> mapFromJson(dynamic json) {
-    final map = <String, FaceDto>{};
+  static Map<String, ReassignFaceDto> mapFromJson(dynamic json) {
+    final map = <String, ReassignFaceDto>{};
    if (json is Map && json.isNotEmpty) {
      json = json.cast<String, dynamic>(); // ignore: parameter_assignments
      for (final entry in json.entries) {
-        final value = FaceDto.fromJson(entry.value);
+        final value = ReassignFaceDto.fromJson(entry.value);
        if (value != null) {
          map[entry.key] = value;
        }
@@ -77,14 +77,14 @@ class FaceDto {
    return map;
  }

-  // maps a json object with a list of FaceDto-objects as value to a dart map
-  static Map<String, List<FaceDto>> mapListFromJson(dynamic json, {bool growable = false,}) {
-    final map = <String, List<FaceDto>>{};
+  // maps a json object with a list of ReassignFaceDto-objects as value to a dart map
+  static Map<String, List<ReassignFaceDto>> mapListFromJson(dynamic json, {bool growable = false,}) {
+    final map = <String, List<ReassignFaceDto>>{};
    if (json is Map && json.isNotEmpty) {
      // ignore: parameter_assignments
      json = json.cast<String, dynamic>();
      for (final entry in json.entries) {
-        map[entry.key] = FaceDto.listFromJson(entry.value, growable: growable,);
+        map[entry.key] = ReassignFaceDto.listFromJson(entry.value, growable: growable,);
      }
    }
    return map;
@@ -92,7 +92,7 @@ class FaceDto {

  /// The list of required keys that must be present in a JSON.
  static const requiredKeys = <String>{
-    'id',
+    'personId',
  };
 }

@@ -127,7 +127,7 @@ void main() {
      // TODO
    });

-    // List<PersonWithFacesResponseDto> people (default value: const [])
+    // PeopleWithFacesResponseDto people
    test('to test the property `people`', () async {
      // TODO
    });
@@ -17,13 +17,18 @@ void main() {
  // final instance = FaceApi();

  group('tests for FaceApi', () {
-    //Future<List<AssetFaceResponseDto>> getFaces(String id) async
+    //Future<List<AssetFaceResponseDto>> getFaces(String faceId) async
    test('test getFaces', () async {
      // TODO
    });

-    //Future<PersonResponseDto> reassignFacesById(String id, FaceDto faceDto) async
-    test('test reassignFacesById', () async {
+    //Future<PersonResponseDto> reassignFace(String id, ReassignFaceDto reassignFaceDto) async
+    test('test reassignFace', () async {
+      // TODO
+    });
+
+    //Future<AssetFaceResponseDto> unassignFace(String id) async
+    test('test unassignFace', () async {
      // TODO
    });

@@ -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 PeopleWithFacesResponseDto
+void main() {
+  // final instance = PeopleWithFacesResponseDto();
+
+  group('test PeopleWithFacesResponseDto', () {
+    // int numberOfFaces
+    test('to test the property `numberOfFaces`', () async {
+      // TODO
+    });
+
+    // List<PersonWithFacesResponseDto> people (default value: const [])
+    test('to test the property `people`', () async {
+      // TODO
+    });
+
+
+  });
+
+}
@@ -57,6 +57,11 @@ void main() {
      // TODO
    });

+    //Future<List<BulkIdResponseDto>> unassignFaces(AssetFaceUpdateDto assetFaceUpdateDto) async
+    test('test unassignFaces', () async {
+      // TODO
+    });
+
    //Future<List<BulkIdResponseDto>> updatePeople(PeopleUpdateDto peopleUpdateDto) async
    test('test updatePeople', () async {
      // TODO
@@ -11,13 +11,13 @@
 import 'package:openapi/api.dart';
 import 'package:test/test.dart';

-// tests for FaceDto
+// tests for ReassignFaceDto
 void main() {
-  // final instance = FaceDto();
+  // final instance = ReassignFaceDto();

-  group('test FaceDto', () {
-    // String id
-    test('to test the property `id`', () async {
+  group('test ReassignFaceDto', () {
+    // String personId
+    test('to test the property `personId`', () async {
      // TODO
    });

@@ -3376,7 +3376,7 @@
        "operationId": "getFaces",
        "parameters": [
          {
-            "name": "id",
+            "name": "faceId",
            "required": true,
            "in": "query",
            "schema": {
@@ -3417,8 +3417,48 @@
      }
    },
    "/face/{id}": {
+      "delete": {
+        "operationId": "unassignFace",
+        "parameters": [
+          {
+            "name": "id",
+            "required": true,
+            "in": "path",
+            "schema": {
+              "format": "uuid",
+              "type": "string"
+            }
+          }
+        ],
+        "responses": {
+          "200": {
+            "content": {
+              "application/json": {
+                "schema": {
+                  "$ref": "#/components/schemas/AssetFaceResponseDto"
+                }
+              }
+            },
+            "description": ""
+          }
+        },
+        "security": [
+          {
+            "bearer": []
+          },
+          {
+            "cookie": []
+          },
+          {
+            "api_key": []
+          }
+        ],
+        "tags": [
+          "Face"
+        ]
+      },
      "put": {
-        "operationId": "reassignFacesById",
+        "operationId": "reassignFace",
        "parameters": [
          {
            "name": "id",
@@ -3434,7 +3474,7 @@
          "content": {
            "application/json": {
              "schema": {
-                "$ref": "#/components/schemas/FaceDto"
+                "$ref": "#/components/schemas/ReassignFaceDto"
              }
            }
          },
@@ -4230,6 +4270,49 @@
      }
    },
    "/person": {
+      "delete": {
+        "operationId": "unassignFaces",
+        "parameters": [],
+        "requestBody": {
+          "content": {
+            "application/json": {
+              "schema": {
+                "$ref": "#/components/schemas/AssetFaceUpdateDto"
+              }
+            }
+          },
+          "required": true
+        },
+        "responses": {
+          "200": {
+            "content": {
+              "application/json": {
+                "schema": {
+                  "items": {
+                    "$ref": "#/components/schemas/BulkIdResponseDto"
+                  },
+                  "type": "array"
+                }
+              }
+            },
+            "description": ""
+          }
+        },
+        "security": [
+          {
+            "bearer": []
+          },
+          {
+            "cookie": []
+          },
+          {
+            "api_key": []
+          }
+        ],
+        "tags": [
+          "Person"
+        ]
+      },
      "get": {
        "operationId": "getAllPeople",
        "parameters": [
@@ -7206,10 +7289,7 @@
            "type": "string"
          },
          "people": {
-            "items": {
-              "$ref": "#/components/schemas/PersonWithFacesResponseDto"
-            },
-            "type": "array"
+            "$ref": "#/components/schemas/PeopleWithFacesResponseDto"
          },
          "resized": {
            "type": "boolean"
@@ -7926,18 +8006,6 @@
        },
        "type": "object"
      },
-      "FaceDto": {
-        "properties": {
-          "id": {
-            "format": "uuid",
-            "type": "string"
-          }
-        },
-        "required": [
-          "id"
-        ],
-        "type": "object"
-      },
      "FileChecksumDto": {
        "properties": {
          "filenames": {
@@ -8588,6 +8656,24 @@
        ],
        "type": "object"
      },
+      "PeopleWithFacesResponseDto": {
+        "properties": {
+          "numberOfFaces": {
+            "type": "integer"
+          },
+          "people": {
+            "items": {
+              "$ref": "#/components/schemas/PersonWithFacesResponseDto"
+            },
+            "type": "array"
+          }
+        },
+        "required": [
+          "numberOfFaces",
+          "people"
+        ],
+        "type": "object"
+      },
      "PersonResponseDto": {
        "properties": {
          "birthDate": {
@@ -8716,6 +8802,18 @@
        ],
        "type": "string"
      },
+      "ReassignFaceDto": {
+        "properties": {
+          "personId": {
+            "format": "uuid",
+            "type": "string"
+          }
+        },
+        "required": [
+          "personId"
+        ],
+        "type": "object"
+      },
      "RecognitionConfig": {
        "properties": {
          "enabled": {
@@ -978,10 +978,10 @@ export interface AssetResponseDto {
    'ownerId': string;
    /**
     * 
-     * @type {Array<PersonWithFacesResponseDto>}
+     * @type {PeopleWithFacesResponseDto}
     * @memberof AssetResponseDto
     */
-    'people'?: Array<PersonWithFacesResponseDto>;
+    'people'?: PeopleWithFacesResponseDto;
    /**
     * 
     * @type {boolean}
@@ -1787,19 +1787,6 @@ export interface ExifResponseDto {
     */
    'timeZone'?: string | null;
 }
-/**
- * 
- * @export
- * @interface FaceDto
- */
-export interface FaceDto {
-    /**
-     * 
-     * @type {string}
-     * @memberof FaceDto
-     */
-    'id': string;
-}
 /**
 * 
 * @export
@@ -2634,6 +2621,25 @@ export interface PeopleUpdateItem {
     */
    'name'?: string;
 }
+/**
+ * 
+ * @export
+ * @interface PeopleWithFacesResponseDto
+ */
+export interface PeopleWithFacesResponseDto {
+    /**
+     * 
+     * @type {number}
+     * @memberof PeopleWithFacesResponseDto
+     */
+    'numberOfFaces': number;
+    /**
+     * 
+     * @type {Array<PersonWithFacesResponseDto>}
+     * @memberof PeopleWithFacesResponseDto
+     */
+    'people': Array<PersonWithFacesResponseDto>;
+}
 /**
 * 
 * @export
@@ -2805,6 +2811,19 @@ export const ReactionType = {
 export type ReactionType = typeof ReactionType[keyof typeof ReactionType];


+/**
+ * 
+ * @export
+ * @interface ReassignFaceDto
+ */
+export interface ReassignFaceDto {
+    /**
+     * 
+     * @type {string}
+     * @memberof ReassignFaceDto
+     */
+    'personId': string;
+}
 /**
 * 
 * @export
@@ -12166,13 +12185,13 @@ export const FaceApiAxiosParamCreator = function (configuration?: Configuration)
    return {
        /**
         * 
-         * @param {string} id 
+         * @param {string} faceId 
         * @param {*} [options] Override http request option.
         * @throws {RequiredError}
         */
-        getFaces: async (id: string, options: RawAxiosRequestConfig = {}): Promise<RequestArgs> => {
-            // verify required parameter 'id' is not null or undefined
-            assertParamExists('getFaces', 'id', id)
+        getFaces: async (faceId: string, options: RawAxiosRequestConfig = {}): Promise<RequestArgs> => {
+            // verify required parameter 'faceId' is not null or undefined
+            assertParamExists('getFaces', 'faceId', faceId)
            const localVarPath = `/face`;
            // use dummy base URL string because the URL constructor only accepts absolute URLs.
            const localVarUrlObj = new URL(localVarPath, DUMMY_BASE_URL);
@@ -12194,8 +12213,8 @@ export const FaceApiAxiosParamCreator = function (configuration?: Configuration)
            // http bearer authentication required
            await setBearerAuthToObject(localVarHeaderParameter, configuration)

-            if (id !== undefined) {
-                localVarQueryParameter['id'] = id;
+            if (faceId !== undefined) {
+                localVarQueryParameter['faceId'] = faceId;
            }


@@ -12212,15 +12231,15 @@ export const FaceApiAxiosParamCreator = function (configuration?: Configuration)
        /**
         * 
         * @param {string} id 
-         * @param {FaceDto} faceDto 
+         * @param {ReassignFaceDto} reassignFaceDto 
         * @param {*} [options] Override http request option.
         * @throws {RequiredError}
         */
-        reassignFacesById: async (id: string, faceDto: FaceDto, options: RawAxiosRequestConfig = {}): Promise<RequestArgs> => {
+        reassignFace: async (id: string, reassignFaceDto: ReassignFaceDto, options: RawAxiosRequestConfig = {}): Promise<RequestArgs> => {
            // verify required parameter 'id' is not null or undefined
-            assertParamExists('reassignFacesById', 'id', id)
-            // verify required parameter 'faceDto' is not null or undefined
-            assertParamExists('reassignFacesById', 'faceDto', faceDto)
+            assertParamExists('reassignFace', 'id', id)
+            // verify required parameter 'reassignFaceDto' is not null or undefined
+            assertParamExists('reassignFace', 'reassignFaceDto', reassignFaceDto)
            const localVarPath = `/face/{id}`
                .replace(`{${"id"}}`, encodeURIComponent(String(id)));
            // use dummy base URL string because the URL constructor only accepts absolute URLs.
@@ -12250,7 +12269,49 @@ export const FaceApiAxiosParamCreator = function (configuration?: Configuration)
            setSearchParams(localVarUrlObj, localVarQueryParameter);
            let headersFromBaseOptions = baseOptions && baseOptions.headers ? baseOptions.headers : {};
            localVarRequestOptions.headers = {...localVarHeaderParameter, ...headersFromBaseOptions, ...options.headers};
-            localVarRequestOptions.data = serializeDataIfNeeded(faceDto, localVarRequestOptions, configuration)
+            localVarRequestOptions.data = serializeDataIfNeeded(reassignFaceDto, localVarRequestOptions, configuration)
+
+            return {
+                url: toPathString(localVarUrlObj),
+                options: localVarRequestOptions,
+            };
+        },
+        /**
+         * 
+         * @param {string} id 
+         * @param {*} [options] Override http request option.
+         * @throws {RequiredError}
+         */
+        unassignFace: async (id: string, options: RawAxiosRequestConfig = {}): Promise<RequestArgs> => {
+            // verify required parameter 'id' is not null or undefined
+            assertParamExists('unassignFace', 'id', id)
+            const localVarPath = `/face/{id}`
+                .replace(`{${"id"}}`, encodeURIComponent(String(id)));
+            // use dummy base URL string because the URL constructor only accepts absolute URLs.
+            const localVarUrlObj = new URL(localVarPath, DUMMY_BASE_URL);
+            let baseOptions;
+            if (configuration) {
+                baseOptions = configuration.baseOptions;
+            }
+
+            const localVarRequestOptions = { method: 'DELETE', ...baseOptions, ...options};
+            const localVarHeaderParameter = {} as any;
+            const localVarQueryParameter = {} as any;
+
+            // authentication cookie required
+
+            // authentication api_key required
+            await setApiKeyToObject(localVarHeaderParameter, "x-api-key", configuration)
+
+            // authentication bearer required
+            // http bearer authentication required
+            await setBearerAuthToObject(localVarHeaderParameter, configuration)
+
+
+    
+            setSearchParams(localVarUrlObj, localVarQueryParameter);
+            let headersFromBaseOptions = baseOptions && baseOptions.headers ? baseOptions.headers : {};
+            localVarRequestOptions.headers = {...localVarHeaderParameter, ...headersFromBaseOptions, ...options.headers};

            return {
                url: toPathString(localVarUrlObj),
@@ -12269,12 +12330,12 @@ export const FaceApiFp = function(configuration?: Configuration) {
    return {
        /**
         * 
-         * @param {string} id 
+         * @param {string} faceId 
         * @param {*} [options] Override http request option.
         * @throws {RequiredError}
         */
-        async getFaces(id: string, options?: RawAxiosRequestConfig): Promise<(axios?: AxiosInstance, basePath?: string) => AxiosPromise<Array<AssetFaceResponseDto>>> {
-            const localVarAxiosArgs = await localVarAxiosParamCreator.getFaces(id, options);
+        async getFaces(faceId: string, options?: RawAxiosRequestConfig): Promise<(axios?: AxiosInstance, basePath?: string) => AxiosPromise<Array<AssetFaceResponseDto>>> {
+            const localVarAxiosArgs = await localVarAxiosParamCreator.getFaces(faceId, options);
            const index = configuration?.serverIndex ?? 0;
            const operationBasePath = operationServerMap['FaceApi.getFaces']?.[index]?.url;
            return (axios, basePath) => createRequestFunction(localVarAxiosArgs, globalAxios, BASE_PATH, configuration)(axios, operationBasePath || basePath);
@@ -12282,14 +12343,26 @@ export const FaceApiFp = function(configuration?: Configuration) {
        /**
         * 
         * @param {string} id 
-         * @param {FaceDto} faceDto 
+         * @param {ReassignFaceDto} reassignFaceDto 
         * @param {*} [options] Override http request option.
         * @throws {RequiredError}
         */
-        async reassignFacesById(id: string, faceDto: FaceDto, options?: RawAxiosRequestConfig): Promise<(axios?: AxiosInstance, basePath?: string) => AxiosPromise<PersonResponseDto>> {
-            const localVarAxiosArgs = await localVarAxiosParamCreator.reassignFacesById(id, faceDto, options);
+        async reassignFace(id: string, reassignFaceDto: ReassignFaceDto, options?: RawAxiosRequestConfig): Promise<(axios?: AxiosInstance, basePath?: string) => AxiosPromise<PersonResponseDto>> {
+            const localVarAxiosArgs = await localVarAxiosParamCreator.reassignFace(id, reassignFaceDto, options);
            const index = configuration?.serverIndex ?? 0;
-            const operationBasePath = operationServerMap['FaceApi.reassignFacesById']?.[index]?.url;
+            const operationBasePath = operationServerMap['FaceApi.reassignFace']?.[index]?.url;
+            return (axios, basePath) => createRequestFunction(localVarAxiosArgs, globalAxios, BASE_PATH, configuration)(axios, operationBasePath || basePath);
+        },
+        /**
+         * 
+         * @param {string} id 
+         * @param {*} [options] Override http request option.
+         * @throws {RequiredError}
+         */
+        async unassignFace(id: string, options?: RawAxiosRequestConfig): Promise<(axios?: AxiosInstance, basePath?: string) => AxiosPromise<AssetFaceResponseDto>> {
+            const localVarAxiosArgs = await localVarAxiosParamCreator.unassignFace(id, options);
+            const index = configuration?.serverIndex ?? 0;
+            const operationBasePath = operationServerMap['FaceApi.unassignFace']?.[index]?.url;
            return (axios, basePath) => createRequestFunction(localVarAxiosArgs, globalAxios, BASE_PATH, configuration)(axios, operationBasePath || basePath);
        },
    }
@@ -12309,16 +12382,25 @@ export const FaceApiFactory = function (configuration?: Configuration, basePath?
         * @throws {RequiredError}
         */
        getFaces(requestParameters: FaceApiGetFacesRequest, options?: RawAxiosRequestConfig): AxiosPromise<Array<AssetFaceResponseDto>> {
-            return localVarFp.getFaces(requestParameters.id, options).then((request) => request(axios, basePath));
+            return localVarFp.getFaces(requestParameters.faceId, options).then((request) => request(axios, basePath));
        },
        /**
         * 
-         * @param {FaceApiReassignFacesByIdRequest} requestParameters Request parameters.
+         * @param {FaceApiReassignFaceRequest} requestParameters Request parameters.
         * @param {*} [options] Override http request option.
         * @throws {RequiredError}
         */
-        reassignFacesById(requestParameters: FaceApiReassignFacesByIdRequest, options?: RawAxiosRequestConfig): AxiosPromise<PersonResponseDto> {
-            return localVarFp.reassignFacesById(requestParameters.id, requestParameters.faceDto, options).then((request) => request(axios, basePath));
+        reassignFace(requestParameters: FaceApiReassignFaceRequest, options?: RawAxiosRequestConfig): AxiosPromise<PersonResponseDto> {
+            return localVarFp.reassignFace(requestParameters.id, requestParameters.reassignFaceDto, options).then((request) => request(axios, basePath));
+        },
+        /**
+         * 
+         * @param {FaceApiUnassignFaceRequest} requestParameters Request parameters.
+         * @param {*} [options] Override http request option.
+         * @throws {RequiredError}
+         */
+        unassignFace(requestParameters: FaceApiUnassignFaceRequest, options?: RawAxiosRequestConfig): AxiosPromise<AssetFaceResponseDto> {
+            return localVarFp.unassignFace(requestParameters.id, options).then((request) => request(axios, basePath));
        },
    };
 };
@@ -12334,28 +12416,42 @@ export interface FaceApiGetFacesRequest {
     * @type {string}
     * @memberof FaceApiGetFaces
     */
-    readonly id: string
+    readonly faceId: string
 }

 /**
- * Request parameters for reassignFacesById operation in FaceApi.
+ * Request parameters for reassignFace operation in FaceApi.
 * @export
- * @interface FaceApiReassignFacesByIdRequest
+ * @interface FaceApiReassignFaceRequest
 */
-export interface FaceApiReassignFacesByIdRequest {
+export interface FaceApiReassignFaceRequest {
    /**
     * 
     * @type {string}
-     * @memberof FaceApiReassignFacesById
+     * @memberof FaceApiReassignFace
     */
    readonly id: string

    /**
     * 
-     * @type {FaceDto}
-     * @memberof FaceApiReassignFacesById
+     * @type {ReassignFaceDto}
+     * @memberof FaceApiReassignFace
     */
-    readonly faceDto: FaceDto
+    readonly reassignFaceDto: ReassignFaceDto
+}
+
+/**
+ * Request parameters for unassignFace operation in FaceApi.
+ * @export
+ * @interface FaceApiUnassignFaceRequest
+ */
+export interface FaceApiUnassignFaceRequest {
+    /**
+     * 
+     * @type {string}
+     * @memberof FaceApiUnassignFace
+     */
+    readonly id: string
 }

 /**
@@ -12373,18 +12469,29 @@ export class FaceApi extends BaseAPI {
     * @memberof FaceApi
     */
    public getFaces(requestParameters: FaceApiGetFacesRequest, options?: RawAxiosRequestConfig) {
-        return FaceApiFp(this.configuration).getFaces(requestParameters.id, options).then((request) => request(this.axios, this.basePath));
+        return FaceApiFp(this.configuration).getFaces(requestParameters.faceId, options).then((request) => request(this.axios, this.basePath));
    }

    /**
     * 
-     * @param {FaceApiReassignFacesByIdRequest} requestParameters Request parameters.
+     * @param {FaceApiReassignFaceRequest} requestParameters Request parameters.
     * @param {*} [options] Override http request option.
     * @throws {RequiredError}
     * @memberof FaceApi
     */
-    public reassignFacesById(requestParameters: FaceApiReassignFacesByIdRequest, options?: RawAxiosRequestConfig) {
-        return FaceApiFp(this.configuration).reassignFacesById(requestParameters.id, requestParameters.faceDto, options).then((request) => request(this.axios, this.basePath));
+    public reassignFace(requestParameters: FaceApiReassignFaceRequest, options?: RawAxiosRequestConfig) {
+        return FaceApiFp(this.configuration).reassignFace(requestParameters.id, requestParameters.reassignFaceDto, options).then((request) => request(this.axios, this.basePath));
+    }
+
+    /**
+     * 
+     * @param {FaceApiUnassignFaceRequest} requestParameters Request parameters.
+     * @param {*} [options] Override http request option.
+     * @throws {RequiredError}
+     * @memberof FaceApi
+     */
+    public unassignFace(requestParameters: FaceApiUnassignFaceRequest, options?: RawAxiosRequestConfig) {
+        return FaceApiFp(this.configuration).unassignFace(requestParameters.id, options).then((request) => request(this.axios, this.basePath));
    }
 }

@@ -14606,6 +14713,50 @@ export const PersonApiAxiosParamCreator = function (configuration?: Configuratio


    
+            localVarHeaderParameter['Content-Type'] = 'application/json';
+
+            setSearchParams(localVarUrlObj, localVarQueryParameter);
+            let headersFromBaseOptions = baseOptions && baseOptions.headers ? baseOptions.headers : {};
+            localVarRequestOptions.headers = {...localVarHeaderParameter, ...headersFromBaseOptions, ...options.headers};
+            localVarRequestOptions.data = serializeDataIfNeeded(assetFaceUpdateDto, localVarRequestOptions, configuration)
+
+            return {
+                url: toPathString(localVarUrlObj),
+                options: localVarRequestOptions,
+            };
+        },
+        /**
+         * 
+         * @param {AssetFaceUpdateDto} assetFaceUpdateDto 
+         * @param {*} [options] Override http request option.
+         * @throws {RequiredError}
+         */
+        unassignFaces: async (assetFaceUpdateDto: AssetFaceUpdateDto, options: RawAxiosRequestConfig = {}): Promise<RequestArgs> => {
+            // verify required parameter 'assetFaceUpdateDto' is not null or undefined
+            assertParamExists('unassignFaces', 'assetFaceUpdateDto', assetFaceUpdateDto)
+            const localVarPath = `/person`;
+            // use dummy base URL string because the URL constructor only accepts absolute URLs.
+            const localVarUrlObj = new URL(localVarPath, DUMMY_BASE_URL);
+            let baseOptions;
+            if (configuration) {
+                baseOptions = configuration.baseOptions;
+            }
+
+            const localVarRequestOptions = { method: 'DELETE', ...baseOptions, ...options};
+            const localVarHeaderParameter = {} as any;
+            const localVarQueryParameter = {} as any;
+
+            // authentication cookie required
+
+            // authentication api_key required
+            await setApiKeyToObject(localVarHeaderParameter, "x-api-key", configuration)
+
+            // authentication bearer required
+            // http bearer authentication required
+            await setBearerAuthToObject(localVarHeaderParameter, configuration)
+
+
+    
            localVarHeaderParameter['Content-Type'] = 'application/json';

            setSearchParams(localVarUrlObj, localVarQueryParameter);
@@ -14817,6 +14968,18 @@ export const PersonApiFp = function(configuration?: Configuration) {
            const operationBasePath = operationServerMap['PersonApi.reassignFaces']?.[index]?.url;
            return (axios, basePath) => createRequestFunction(localVarAxiosArgs, globalAxios, BASE_PATH, configuration)(axios, operationBasePath || basePath);
        },
+        /**
+         * 
+         * @param {AssetFaceUpdateDto} assetFaceUpdateDto 
+         * @param {*} [options] Override http request option.
+         * @throws {RequiredError}
+         */
+        async unassignFaces(assetFaceUpdateDto: AssetFaceUpdateDto, options?: RawAxiosRequestConfig): Promise<(axios?: AxiosInstance, basePath?: string) => AxiosPromise<Array<BulkIdResponseDto>>> {
+            const localVarAxiosArgs = await localVarAxiosParamCreator.unassignFaces(assetFaceUpdateDto, options);
+            const index = configuration?.serverIndex ?? 0;
+            const operationBasePath = operationServerMap['PersonApi.unassignFaces']?.[index]?.url;
+            return (axios, basePath) => createRequestFunction(localVarAxiosArgs, globalAxios, BASE_PATH, configuration)(axios, operationBasePath || basePath);
+        },
        /**
         * 
         * @param {PeopleUpdateDto} peopleUpdateDto 
@@ -14923,6 +15086,15 @@ export const PersonApiFactory = function (configuration?: Configuration, basePat
        reassignFaces(requestParameters: PersonApiReassignFacesRequest, options?: RawAxiosRequestConfig): AxiosPromise<Array<PersonResponseDto>> {
            return localVarFp.reassignFaces(requestParameters.id, requestParameters.assetFaceUpdateDto, options).then((request) => request(axios, basePath));
        },
+        /**
+         * 
+         * @param {PersonApiUnassignFacesRequest} requestParameters Request parameters.
+         * @param {*} [options] Override http request option.
+         * @throws {RequiredError}
+         */
+        unassignFaces(requestParameters: PersonApiUnassignFacesRequest, options?: RawAxiosRequestConfig): AxiosPromise<Array<BulkIdResponseDto>> {
+            return localVarFp.unassignFaces(requestParameters.assetFaceUpdateDto, options).then((request) => request(axios, basePath));
+        },
        /**
         * 
         * @param {PersonApiUpdatePeopleRequest} requestParameters Request parameters.
@@ -15056,6 +15228,20 @@ export interface PersonApiReassignFacesRequest {
    readonly assetFaceUpdateDto: AssetFaceUpdateDto
 }

+/**
+ * Request parameters for unassignFaces operation in PersonApi.
+ * @export
+ * @interface PersonApiUnassignFacesRequest
+ */
+export interface PersonApiUnassignFacesRequest {
+    /**
+     * 
+     * @type {AssetFaceUpdateDto}
+     * @memberof PersonApiUnassignFaces
+     */
+    readonly assetFaceUpdateDto: AssetFaceUpdateDto
+}
+
 /**
 * Request parameters for updatePeople operation in PersonApi.
 * @export
@@ -15185,6 +15371,17 @@ export class PersonApi extends BaseAPI {
        return PersonApiFp(this.configuration).reassignFaces(requestParameters.id, requestParameters.assetFaceUpdateDto, options).then((request) => request(this.axios, this.basePath));
    }

+    /**
+     * 
+     * @param {PersonApiUnassignFacesRequest} requestParameters Request parameters.
+     * @param {*} [options] Override http request option.
+     * @throws {RequiredError}
+     * @memberof PersonApi
+     */
+    public unassignFaces(requestParameters: PersonApiUnassignFacesRequest, options?: RawAxiosRequestConfig) {
+        return PersonApiFp(this.configuration).unassignFaces(requestParameters.assetFaceUpdateDto, options).then((request) => request(this.axios, this.basePath));
+    }
+
    /**
     * 
     * @param {PersonApiUpdatePeopleRequest} requestParameters Request parameters.
@@ -598,7 +598,7 @@ describe(`${AssetController.name} (e2e)`, () => {

      const data = await request(server).get(`/asset/assetById/${asset1.id}?key=${sharedLink.key}`);
      expect(data.status).toBe(200);
-      expect(data.body).toMatchObject({ people: [] });
+      expect(data.body).toMatchObject({ people: undefined });
    });
  });

@@ -907,15 +907,18 @@ describe(`${AssetController.name} (e2e)`, () => {
      expect(body).toMatchObject({
        id: asset1.id,
        isFavorite: true,
-        people: [
-          {
-            birthDate: null,
-            id: expect.any(String),
-            isHidden: false,
-            name: 'Test Person',
-            thumbnailPath: '',
-          },
-        ],
+        people: {
+          numberOfFaces: 1,
+          people: [
+            {
+              birthDate: null,
+              id: expect.any(String),
+              isHidden: false,
+              name: 'Test Person',
+              thumbnailPath: '',
+            },
+          ],
+        },
      });
    });
  });
@@ -324,7 +324,7 @@ export class AssetService {
    }

    if (data.ownerId !== auth.user.id || auth.sharedLink) {
-      data.people = [];
+      delete data.people;
    }

    return data;
@@ -1,6 +1,11 @@
 import { AssetEntity, AssetFaceEntity, AssetType } from '@app/infra/entities';
 import { ApiProperty } from '@nestjs/swagger';
-import { PersonWithFacesResponseDto, mapFacesWithoutPerson, mapPerson } from '../../person/person.dto';
+import {
+  PeopleWithFacesResponseDto,
+  PersonWithFacesResponseDto,
+  mapFacesWithoutPerson,
+  mapPerson,
+} from '../../person/person.dto';
 import { TagResponseDto, mapTag } from '../../tag';
 import { UserResponseDto, mapUser } from '../../user/response-dto/user-response.dto';
 import { ExifResponseDto, mapExif } from './exif-response.dto';
@@ -38,7 +43,7 @@ export class AssetResponseDto extends SanitizedAssetResponseDto {
  exifInfo?: ExifResponseDto;
  smartInfo?: SmartInfoResponseDto;
  tags?: TagResponseDto[];
-  people?: PersonWithFacesResponseDto[];
+  people?: PeopleWithFacesResponseDto;
  /**base64 encoded sha1 hash */
  checksum!: string;
  stackParentId?: string | null;
@@ -52,7 +57,7 @@ export type AssetMapOptions = {
  withStack?: boolean;
 };

-const peopleWithFaces = (faces: AssetFaceEntity[]): PersonWithFacesResponseDto[] => {
+const peopleWithFaces = (faces: AssetFaceEntity[]): PeopleWithFacesResponseDto => {
  const result: PersonWithFacesResponseDto[] = [];
  if (faces) {
    for (const face of faces) {
@@ -67,7 +72,7 @@ const peopleWithFaces = (faces: AssetFaceEntity[]): PersonWithFacesResponseDto[]
    }
  }

-  return result;
+  return { people: result, numberOfFaces: faces.length };
 };

 export function mapAsset(entity: AssetEntity, options: AssetMapOptions = {}): AssetResponseDto {
@@ -113,7 +118,7 @@ export function mapAsset(entity: AssetEntity, options: AssetMapOptions = {}): As
    smartInfo: entity.smartInfo ? mapSmartInfo(entity.smartInfo) : undefined,
    livePhotoVideoId: entity.livePhotoVideoId,
    tags: entity.tags?.map(mapTag),
-    people: peopleWithFaces(entity.faces),
+    people: entity.faces ? peopleWithFaces(entity.faces) : undefined,
    checksum: entity.checksum.toString('base64'),
    stackParentId: withStack ? entity.stack?.primaryAssetId : undefined,
    stack: withStack
@@ -78,6 +78,12 @@ export class PersonWithFacesResponseDto extends PersonResponseDto {
  faces!: AssetFaceWithoutPersonResponseDto[];
 }

+export class PeopleWithFacesResponseDto {
+  people!: PersonWithFacesResponseDto[];
+  @ApiProperty({ type: 'integer' })
+  numberOfFaces!: number;
+}
+
 export class AssetFaceWithoutPersonResponseDto {
  @ValidateUUID()
  id!: string;
@@ -99,6 +105,16 @@ export class AssetFaceResponseDto extends AssetFaceWithoutPersonResponseDto {
  person!: PersonResponseDto | null;
 }

+export class FaceDto {
+  @ValidateUUID()
+  faceId!: string;
+}
+
+export class ReassignFaceDto {
+  @ValidateUUID()
+  personId!: string;
+}
+
 export class AssetFaceUpdateDto {
  @IsArray()
  @ValidateNested({ each: true })
@@ -106,11 +122,6 @@ export class AssetFaceUpdateDto {
  data!: AssetFaceUpdateItem[];
 }

-export class FaceDto {
-  @ValidateUUID()
-  id!: string;
-}
-
 export class AssetFaceUpdateItem {
  @ValidateUUID()
  personId!: string;
@@ -441,14 +441,14 @@ describe(PersonService.name, () => {
    it('should get the bounding boxes for an asset', async () => {
      accessMock.asset.checkOwnerAccess.mockResolvedValue(new Set([faceStub.face1.assetId]));
      personMock.getFaces.mockResolvedValue([faceStub.primaryFace1]);
-      await expect(sut.getFacesById(authStub.admin, { id: faceStub.face1.assetId })).resolves.toStrictEqual([
+      await expect(sut.getFacesById(authStub.admin, { faceId: faceStub.face1.assetId })).resolves.toStrictEqual([
        mapFaces(faceStub.primaryFace1, authStub.admin),
      ]);
    });
    it('should reject if the user has not access to the asset', async () => {
      accessMock.asset.checkOwnerAccess.mockResolvedValue(new Set());
      personMock.getFaces.mockResolvedValue([faceStub.primaryFace1]);
-      await expect(sut.getFacesById(authStub.admin, { id: faceStub.primaryFace1.assetId })).rejects.toBeInstanceOf(
+      await expect(sut.getFacesById(authStub.admin, { faceId: faceStub.primaryFace1.assetId })).rejects.toBeInstanceOf(
        BadRequestException,
      );
    });
@@ -467,7 +467,7 @@ describe(PersonService.name, () => {
    });
  });

-  describe('reassignFacesById', () => {
+  describe('reassignFace', () => {
    it('should create a new person', async () => {
      accessMock.person.checkOwnerAccess.mockResolvedValue(new Set([personStub.noName.id]));
      accessMock.person.checkFaceOwnerAccess.mockResolvedValue(new Set([faceStub.face1.id]));
@@ -476,8 +476,8 @@ describe(PersonService.name, () => {
      personMock.getById.mockResolvedValue(personStub.noName);
      personMock.getRandomFace.mockResolvedValue(null);
      await expect(
-        sut.reassignFacesById(authStub.admin, personStub.noName.id, {
-          id: faceStub.face1.id,
+        sut.reassignFace(authStub.admin, faceStub.face1.id, {
+          personId: personStub.noName.id,
        }),
      ).resolves.toEqual({
        birthDate: personStub.noName.birthDate,
@@ -498,8 +498,8 @@ describe(PersonService.name, () => {
      personMock.getById.mockResolvedValue(personStub.noName);
      personMock.getRandomFace.mockResolvedValue(null);
      await expect(
-        sut.reassignFacesById(authStub.admin, personStub.noName.id, {
-          id: faceStub.face1.id,
+        sut.reassignFace(authStub.admin, faceStub.face1.id, {
+          personId: personStub.noName.id,
        }),
      ).rejects.toBeInstanceOf(BadRequestException);

@@ -518,6 +518,36 @@ describe(PersonService.name, () => {
    });
  });

+  describe('unassignFace', () => {
+    it('should unassign a face', async () => {
+      personMock.getFaceById.mockResolvedValueOnce(faceStub.face1);
+      accessMock.person.checkOwnerAccess.mockResolvedValue(new Set([personStub.noName.id]));
+      accessMock.person.checkFaceOwnerAccess.mockResolvedValue(new Set([faceStub.face1.id]));
+      personMock.reassignFace.mockResolvedValue(1);
+      personMock.getRandomFace.mockResolvedValue(null);
+      personMock.getFaceById.mockResolvedValueOnce(faceStub.unassignedFace);
+
+      await expect(sut.unassignFace(authStub.admin, faceStub.face1.id)).resolves.toStrictEqual(
+        mapFaces(faceStub.unassignedFace, authStub.admin),
+      );
+    });
+  });
+
+  describe('unassignFaces', () => {
+    it('should unassign a face', async () => {
+      personMock.getFacesByIds.mockResolvedValueOnce([faceStub.face1]);
+      accessMock.person.checkOwnerAccess.mockResolvedValue(new Set([personStub.noName.id]));
+      accessMock.person.checkFaceOwnerAccess.mockResolvedValue(new Set([faceStub.face1.id]));
+      personMock.reassignFace.mockResolvedValue(1);
+      personMock.getRandomFace.mockResolvedValue(null);
+      personMock.getFaceById.mockResolvedValueOnce(faceStub.unassignedFace);
+
+      await expect(
+        sut.unassignFaces(authStub.admin, { data: [{ assetId: faceStub.face1.id, personId: 'person-1' }] }),
+      ).resolves.toStrictEqual([{ id: 'assetFaceId1', success: true }]);
+    });
+  });
+
  describe('handlePersonCleanup', () => {
    it('should delete people without faces', async () => {
      personMock.getAllWithoutFaces.mockResolvedValue([personStub.noName]);
@@ -40,6 +40,7 @@ import {
  PersonSearchDto,
  PersonStatisticsResponseDto,
  PersonUpdateDto,
+  ReassignFaceDto,
  mapFaces,
  mapPerson,
 } from './person.dto';
@@ -98,6 +99,28 @@ export class PersonService {
    return this.repository.create({ ownerId: auth.user.id });
  }

+  async reassignFace(auth: AuthDto, faceId: string, dto: ReassignFaceDto): Promise<PersonResponseDto> {
+    await this.access.requirePermission(auth, Permission.PERSON_WRITE, dto.personId);
+
+    await this.access.requirePermission(auth, Permission.PERSON_CREATE, faceId);
+    const face = await this.repository.getFaceById(faceId);
+    const person = await this.findOrFail(dto.personId);
+    const refreshIds = [];
+
+    await this.repository.reassignFace(face.id, dto.personId);
+    if (person.faceAssetId === null) {
+      refreshIds.push(person.id);
+    }
+    if (face.person && face.person.faceAssetId === face.id) {
+      refreshIds.push(face.person.id);
+    }
+    if (refreshIds.length > 0) {
+      await this.createNewFeaturePhoto(refreshIds);
+    }
+
+    return this.findOrFail(dto.personId).then(mapPerson);
+  }
+
  async reassignFaces(auth: AuthDto, personId: string, dto: AssetFaceUpdateDto): Promise<PersonResponseDto[]> {
    await this.access.requirePermission(auth, Permission.PERSON_WRITE, personId);
    const person = await this.findOrFail(personId);
@@ -105,9 +128,12 @@ export class PersonService {
    const changeFeaturePhoto: string[] = [];
    for (const data of dto.data) {
      const faces = await this.repository.getFacesByIds([{ personId: data.personId, assetId: data.assetId }]);
-
+      await this.access.requirePermission(
+        auth,
+        Permission.PERSON_CREATE,
+        faces.map((face) => face.id),
+      );
      for (const face of faces) {
-        await this.access.requirePermission(auth, Permission.PERSON_CREATE, face.id);
        if (person.faceAssetId === null) {
          changeFeaturePhoto.push(person.id);
        }
@@ -127,27 +153,52 @@ export class PersonService {
    return result;
  }

-  async reassignFacesById(auth: AuthDto, personId: string, dto: FaceDto): Promise<PersonResponseDto> {
-    await this.access.requirePermission(auth, Permission.PERSON_WRITE, personId);
-
-    await this.access.requirePermission(auth, Permission.PERSON_CREATE, dto.id);
-    const face = await this.repository.getFaceById(dto.id);
-    const person = await this.findOrFail(personId);
-
-    await this.repository.reassignFace(face.id, personId);
-    if (person.faceAssetId === null) {
-      await this.createNewFeaturePhoto([person.id]);
+  async unassignFace(auth: AuthDto, id: string): Promise<AssetFaceResponseDto> {
+    let face = await this.repository.getFaceById(id);
+    await this.access.requirePermission(auth, Permission.PERSON_CREATE, face.id);
+    if (face.personId) {
+      await this.access.requirePermission(auth, Permission.PERSON_WRITE, face.personId);
    }
+
+    await this.repository.reassignFace(face.id, null);
    if (face.person && face.person.faceAssetId === face.id) {
      await this.createNewFeaturePhoto([face.person.id]);
    }
+    face = await this.repository.getFaceById(id);
+    return mapFaces(face, auth);
+  }

-    return await this.findOrFail(personId).then(mapPerson);
+  async unassignFaces(auth: AuthDto, dto: AssetFaceUpdateDto): Promise<BulkIdResponseDto[]> {
+    const changeFeaturePhoto: string[] = [];
+    const results: BulkIdResponseDto[] = [];
+
+    for (const data of dto.data) {
+      const faces = await this.repository.getFacesByIds([{ personId: data.personId, assetId: data.assetId }]);
+
+      for (const face of faces) {
+        await this.access.requirePermission(auth, Permission.PERSON_CREATE, face.id);
+        if (face.personId) {
+          await this.access.requirePermission(auth, Permission.PERSON_WRITE, face.personId);
+        }
+
+        await this.repository.reassignFace(face.id, null);
+        if (face.person && face.person.faceAssetId === face.id) {
+          changeFeaturePhoto.push(face.person.id);
+        }
+        results.push({ id: face.id, success: true });
+      }
+    }
+    if (changeFeaturePhoto.length > 0) {
+      // Remove duplicates
+      await this.createNewFeaturePhoto([...changeFeaturePhoto]);
+    }
+
+    return results;
  }

  async getFacesById(auth: AuthDto, dto: FaceDto): Promise<AssetFaceResponseDto[]> {
-    await this.access.requirePermission(auth, Permission.ASSET_READ, dto.id);
-    const faces = await this.repository.getFaces(dto.id);
+    await this.access.requirePermission(auth, Permission.ASSET_READ, dto.faceId);
+    const faces = await this.repository.getFaces(dto.faceId);
    return faces.map((asset) => mapFaces(asset, auth));
  }

@@ -19,9 +19,9 @@ export interface AssetFaceId {
 }

 export interface UpdateFacesData {
-  oldPersonId?: string;
+  oldPersonId?: string | null;
  faceIds?: string[];
-  newPersonId: string;
+  newPersonId: string | null;
 }

 export interface PersonStatistics {
@@ -53,7 +53,7 @@ export interface IPersonRepository {
  getFacesByIds(ids: AssetFaceId[]): Promise<AssetFaceEntity[]>;
  getRandomFace(personId: string): Promise<AssetFaceEntity | null>;
  getStatistics(personId: string): Promise<PersonStatistics>;
-  reassignFace(assetFaceId: string, newPersonId: string): Promise<number>;
+  reassignFace(assetFaceId: string, newPersonId: string | null): Promise<number>;
  getNumberOfPeople(userId: string): Promise<number>;
  reassignFaces(data: UpdateFacesData): Promise<number>;
  update(entity: Partial<PersonEntity>): Promise<PersonEntity>;
@@ -1,5 +1,5 @@
-import { AssetFaceResponseDto, AuthDto, FaceDto, PersonResponseDto, PersonService } from '@app/domain';
-import { Body, Controller, Get, Param, Put, Query } from '@nestjs/common';
+import { AssetFaceResponseDto, AuthDto, FaceDto, PersonResponseDto, PersonService, ReassignFaceDto } from '@app/domain';
+import { Body, Controller, Delete, Get, Param, Put, Query } from '@nestjs/common';
 import { ApiTags } from '@nestjs/swagger';
 import { Auth, Authenticated } from '../app.guard';
 import { UseValidation } from '../app.utils';
@@ -18,11 +18,16 @@ export class FaceController {
  }

  @Put(':id')
-  reassignFacesById(
+  reassignFace(
    @Auth() auth: AuthDto,
    @Param() { id }: UUIDParamDto,
-    @Body() dto: FaceDto,
+    @Body() dto: ReassignFaceDto,
  ): Promise<PersonResponseDto> {
-    return this.service.reassignFacesById(auth, id, dto);
+    return this.service.reassignFace(auth, id, dto);
+  }
+
+  @Delete(':id')
+  unassignFace(@Auth() auth: AuthDto, @Param() { id }: UUIDParamDto): Promise<AssetFaceResponseDto> {
+    return this.service.unassignFace(auth, id);
  }
 }
@@ -12,7 +12,7 @@ import {
  PersonStatisticsResponseDto,
  PersonUpdateDto,
 } from '@app/domain';
-import { Body, Controller, Get, Next, Param, Post, Put, Query, Res } from '@nestjs/common';
+import { Body, Controller, Delete, Get, Next, Param, Post, Put, Query, Res } from '@nestjs/common';
 import { ApiTags } from '@nestjs/swagger';
 import { NextFunction, Response } from 'express';
 import { Auth, Authenticated, FileResponse } from '../app.guard';
@@ -45,6 +45,11 @@ export class PersonController {
    return this.service.reassignFaces(auth, id, dto);
  }

+  @Delete()
+  unassignFaces(@Auth() auth: AuthDto, @Body() dto: AssetFaceUpdateDto): Promise<BulkIdResponseDto[]> {
+    return this.service.unassignFaces(auth, dto);
+  }
+
  @Put()
  updatePeople(@Auth() auth: AuthDto, @Body() dto: PeopleUpdateDto): Promise<BulkIdResponseDto[]> {
    return this.service.updatePeople(auth, dto);
@@ -133,7 +133,7 @@ export class PersonRepository implements IPersonRepository {
  }

  @GenerateSql({ params: [DummyValue.UUID, DummyValue.UUID] })
-  async reassignFace(assetFaceId: string, newPersonId: string): Promise<number> {
+  async reassignFace(assetFaceId: string, newPersonId: string | null): Promise<number> {
    const result = await this.assetFaceRepository
      .createQueryBuilder()
      .update()
@@ -19,7 +19,21 @@ export const faceStub = {
    imageHeight: 1024,
    imageWidth: 1024,
  }),
-  primaryFace1: Object.freeze<NonNullableProperty<AssetFaceEntity>>({
+  unassignedFace: Object.freeze<AssetFaceEntity>({
+    id: 'assetFaceId',
+    assetId: assetStub.image.id,
+    asset: assetStub.image,
+    personId: null,
+    person: null,
+    embedding: [1, 2, 3, 4],
+    boundingBoxX1: 0,
+    boundingBoxY1: 0,
+    boundingBoxX2: 1,
+    boundingBoxY2: 1,
+    imageHeight: 1024,
+    imageWidth: 1024,
+  }),
+  primaryFace1: Object.freeze<AssetFaceEntity>({
    id: 'assetFaceId2',
    assetId: assetStub.image.id,
    asset: assetStub.image,
@@ -67,7 +67,7 @@ const assetResponse: AssetResponseDto = {
  exifInfo: assetInfo,
  livePhotoVideoId: null,
  tags: [],
-  people: [],
+  people: undefined,
  checksum: 'ZmlsZSBoYXNo',
  isTrashed: false,
  libraryId: 'library-id',
@@ -253,6 +253,11 @@

    const key = event.key;
    const shiftKey = event.shiftKey;
+    const ctrlKey = event.ctrlKey;
+
+    if (ctrlKey) {
+      return;
+    }

    switch (key) {
      case 'a':
@@ -2,7 +2,13 @@
  import { locale } from '$lib/stores/preferences.store';
  import { featureFlags } from '$lib/stores/server-config.store';
  import { getAssetFilename } from '$lib/utils/asset-utils';
-  import { type AlbumResponseDto, type AssetResponseDto, ThumbnailFormat, api } from '@api';
+  import {
+    type AlbumResponseDto,
+    type AssetResponseDto,
+    ThumbnailFormat,
+    api,
+    type PersonWithFacesResponseDto,
+  } from '@api';
  import { DateTime } from 'luxon';
  import { createEventDispatcher, onDestroy } from 'svelte';
  import { slide } from 'svelte/transition';
@@ -63,7 +69,7 @@
    // Get latest description from server
    if (newAsset.id && !api.isSharedLink) {
      const { data } = await api.assetApi.getAssetInfo({ id: asset.id });
-      people = data?.people || [];
+      people = data?.people?.people || [];

      description = data.exifInfo?.description || '';
    }
@@ -81,7 +87,8 @@
    }
  })();

-  $: people = asset.people || [];
+  $: people = asset.people?.people || ([] as PersonWithFacesResponseDto[]);
+  $: numberOfFaces = asset.people?.numberOfFaces || 0;
  $: showingHiddenPeople = false;

  const unsubscribe = websocketStore.onAssetUpdate.subscribe((assetUpdate) => {
@@ -128,7 +135,7 @@

  const handleRefreshPeople = async () => {
    await api.assetApi.getAssetInfo({ id: asset.id }).then((res) => {
-      people = res.data?.people || [];
+      people = res.data?.people?.people || ([] as PersonWithFacesResponseDto[]);
      textArea.value = res.data?.exifInfo?.description || '';
    });
    showEditFaces = false;
@@ -238,7 +245,7 @@
    <p class="px-4 break-words whitespace-pre-line w-full text-black dark:text-white text-base">{description}</p>
  {/if}

-  {#if !api.isSharedLink && people.length > 0}
+  {#if !api.isSharedLink && numberOfFaces > 0}
    <section class="px-4 py-4 text-sm">
      <div class="flex h-10 w-full items-center justify-between">
        <h2>PEOPLE</h2>
@@ -692,8 +699,7 @@

 {#if showEditFaces}
  <PersonSidePanel
-    assetId={asset.id}
-    assetType={asset.type}
+    {asset}
    on:close={() => {
      showEditFaces = false;
    }}
@@ -20,6 +20,7 @@
  export let border = false;
  export let preload = true;
  export let eyeColor: 'black' | 'white' = 'white';
+  export let persistentBorder = false;

  let complete = false;
  let img: HTMLImageElement;
@@ -43,7 +44,7 @@
  {title}
  class="object-cover transition duration-300 {border
    ? 'border-[3px] border-immich-dark-primary/80 hover:border-immich-primary'
-    : ''}"
+    : ''} {persistentBorder ? 'border-[3px] border-immich-dark-primary/80 border-immich-primary' : ''}"
  class:rounded-xl={curve}
  class:shadow-lg={shadow}
  class:rounded-full={circle}
@@ -11,7 +11,7 @@
    | 'transparent-gray'
    | 'dark-gray'
    | 'overlay-primary';
-  export type Size = 'tiny' | 'icon' | 'link' | 'sm' | 'base' | 'lg';
+  export type Size = 'tiny' | 'xs' | 'icon' | 'link' | 'sm' | 'base' | 'lg';
  export type Rounded = 'lg' | '3xl' | 'full' | false;
  export type Shadow = 'md' | false;
 </script>
@@ -49,6 +49,7 @@

  const sizeClasses: Record<Size, string> = {
    tiny: 'p-0 ml-2 mr-0 align-top',
+    xs: 'p-2',
    icon: 'p-2.5',
    link: 'p-2 font-medium',
    sm: 'px-4 py-2 text-sm font-medium',
@@ -1,5 +1,5 @@
 <script lang="ts">
-  import { api, AssetTypeEnum, type AssetFaceResponseDto, type PersonResponseDto, ThumbnailFormat } from '@api';
+  import { api, type AssetFaceResponseDto, type AssetResponseDto, type PersonResponseDto } from '@api';
  import { createEventDispatcher } from 'svelte';
  import { linear } from 'svelte/easing';
  import { fly } from 'svelte/transition';
@@ -7,16 +7,13 @@
  import { mdiArrowLeftThin, mdiClose, mdiMagnify, mdiPlus } from '@mdi/js';
  import LoadingSpinner from '../shared-components/loading-spinner.svelte';
  import ImageThumbnail from '../assets/thumbnail/image-thumbnail.svelte';
-  import { getPersonNameWithHiddenValue, searchNameLocal } from '$lib/utils/person';
+  import { getPersonNameWithHiddenValue, searchNameLocal, zoomImageToBase64 } from '$lib/utils/person';
  import { handleError } from '$lib/utils/handle-error';
-  import { photoViewer } from '$lib/stores/assets.store';
  import { maximumLengthSearchPeople, timeBeforeShowLoadingSpinner } from '$lib/constants';

-  export let peopleWithFaces: AssetFaceResponseDto[];
+  export let personWithFace: AssetFaceResponseDto;
  export let allPeople: PersonResponseDto[];
-  export let editedPersonIndex: number;
-  export let assetType: AssetTypeEnum;
-  export let assetId: string;
+  export let asset: AssetResponseDto;

  // loading spinners
  let isShowLoadingNewPerson = false;
@@ -26,9 +23,18 @@
  let searchedPeople: PersonResponseDto[] = [];
  let searchedPeopleCopy: PersonResponseDto[] = [];
  let searchWord: string;
-  let searchFaces = false;
+  let isSearchingPerson = false;
  let searchName = '';

+  $: {
+    searchedPeople = searchedPeopleCopy.filter(
+      (person) => personWithFace.person && personWithFace.person.id !== person.id,
+    );
+    if (searchName) {
+      searchedPeople = searchNameLocal(searchName, searchedPeople, 10);
+    }
+  }
+
  const dispatch = createEventDispatcher<{
    close: void;
    createPerson: string | null;
@@ -37,73 +43,15 @@
  const handleBackButton = () => {
    dispatch('close');
  };
-  const zoomImageToBase64 = async (face: AssetFaceResponseDto): Promise<string | null> => {
-    let image: HTMLImageElement | null = null;
-    if (assetType === AssetTypeEnum.Image) {
-      image = $photoViewer;
-    } else if (assetType === AssetTypeEnum.Video) {
-      const data = await api.getAssetThumbnailUrl(assetId, ThumbnailFormat.Webp);
-      const img: HTMLImageElement = new Image();
-      img.src = data;
-
-      await new Promise<void>((resolve) => {
-        img.addEventListener('load', () => resolve());
-        img.addEventListener('error', () => resolve());
-      });
-
-      image = img;
-    }
-    if (image === null) {
-      return null;
-    }
-    const {
-      boundingBoxX1: x1,
-      boundingBoxX2: x2,
-      boundingBoxY1: y1,
-      boundingBoxY2: y2,
-      imageWidth,
-      imageHeight,
-    } = face;
-
-    const coordinates = {
-      x1: (image.naturalWidth / imageWidth) * x1,
-      x2: (image.naturalWidth / imageWidth) * x2,
-      y1: (image.naturalHeight / imageHeight) * y1,
-      y2: (image.naturalHeight / imageHeight) * y2,
-    };
-
-    const faceWidth = coordinates.x2 - coordinates.x1;
-    const faceHeight = coordinates.y2 - coordinates.y1;
-
-    const faceImage = new Image();
-    faceImage.src = image.src;
-
-    await new Promise((resolve) => {
-      faceImage.addEventListener('load', resolve);
-      faceImage.addEventListener('error', () => resolve(null));
-    });
-
-    const canvas = document.createElement('canvas');
-    canvas.width = faceWidth;
-    canvas.height = faceHeight;
-
-    const context = canvas.getContext('2d');
-    if (context) {
-      context.drawImage(faceImage, coordinates.x1, coordinates.y1, faceWidth, faceHeight, 0, 0, faceWidth, faceHeight);
-
-      return canvas.toDataURL();
-    } else {
-      return null;
-    }
-  };

  const handleCreatePerson = async () => {
+    if (asset === null) {
+      return;
+    }
+
    const timeout = setTimeout(() => (isShowLoadingNewPerson = true), timeBeforeShowLoadingSpinner);
-    const personToUpdate = peopleWithFaces.find((person) => person.id === peopleWithFaces[editedPersonIndex].id);

-    const newFeaturePhoto = personToUpdate ? await zoomImageToBase64(personToUpdate) : null;
-
-    dispatch('createPerson', newFeaturePhoto);
+    const newFeaturePhoto = await zoomImageToBase64(personWithFace, asset.type, asset.id);

    clearTimeout(timeout);
    isShowLoadingNewPerson = false;
@@ -129,10 +77,6 @@
    isShowLoadingSearch = false;
  };

-  $: {
-    searchedPeople = searchNameLocal(searchName, searchedPeopleCopy, 20);
-  }
-
  const initInput = (element: HTMLInputElement) => {
    element.focus();
  };
@@ -140,10 +84,10 @@

 <section
  transition:fly={{ x: 360, duration: 100, easing: linear }}
-  class="absolute top-0 z-[2001] h-full w-[360px] overflow-x-hidden p-2 bg-immich-bg dark:bg-immich-dark-bg dark:text-immich-dark-fg"
+  class="absolute top-0 z-[2002] h-full w-[360px] overflow-x-hidden p-2 bg-immich-bg dark:bg-immich-dark-bg dark:text-immich-dark-fg"
 >
  <div class="flex place-items-center justify-between gap-2">
-    {#if !searchFaces}
+    {#if !isSearchingPerson}
      <div class="flex items-center gap-2">
        <button
          class="flex place-content-center rounded-full p-3 transition-colors hover:bg-gray-200 dark:text-immich-dark-fg dark:hover:bg-gray-900"
@@ -160,7 +104,7 @@
          class="flex place-content-center place-items-center rounded-full p-3 transition-colors hover:bg-gray-200 dark:text-immich-dark-fg dark:hover:bg-gray-900"
          title="Search existing person"
          on:click={() => {
-            searchFaces = true;
+            isSearchingPerson = true;
          }}
        >
          <div>
@@ -209,7 +153,7 @@
      </div>
      <button
        class="flex place-content-center place-items-center rounded-full p-3 transition-colors hover:bg-gray-200 dark:text-immich-dark-fg dark:hover:bg-gray-900"
-        on:click={() => (searchFaces = false)}
+        on:click={() => (isSearchingPerson = false)}
      >
        <div>
          <Icon path={mdiClose} size="24" />
@@ -218,11 +162,13 @@
    {/if}
  </div>
  <div class="px-4 py-4 text-sm">
-    <h2 class="mb-8 mt-4 uppercase">All people</h2>
+    {#if allPeople.length > 0}
+      <h2 class="mb-8 mt-4 uppercase">All people</h2>
+    {/if}
    <div class="immich-scrollbar mt-4 flex flex-wrap gap-2 overflow-y-auto">
      {#if searchName == ''}
        {#each allPeople as person (person.id)}
-          {#if person.id !== peopleWithFaces[editedPersonIndex].person?.id}
+          {#if person.id !== personWithFace.person?.id}
            <div class="w-fit">
              <button class="w-[90px]" on:click={() => dispatch('reassign', person)}>
                <div class="relative">
@@ -248,26 +194,24 @@
        {/each}
      {:else}
        {#each searchedPeople as person (person.id)}
-          {#if person.id !== peopleWithFaces[editedPersonIndex].person?.id}
-            <div class="w-fit">
-              <button class="w-[90px]" on:click={() => dispatch('reassign', person)}>
-                <div class="relative">
-                  <ImageThumbnail
-                    curve
-                    shadow
-                    url={api.getPeopleThumbnailUrl(person.id)}
-                    altText={getPersonNameWithHiddenValue(person.name, person.isHidden)}
-                    title={getPersonNameWithHiddenValue(person.name, person.isHidden)}
-                    widthStyle="90px"
-                    heightStyle="90px"
-                    thumbhash={null}
-                    hidden={person.isHidden}
-                  />
-                </div>
-                <p class="mt-1 truncate font-medium" title={person.name}>{person.name}</p>
-              </button>
-            </div>
-          {/if}
+          <div class="w-fit">
+            <button class="w-[90px]" on:click={() => dispatch('reassign', person)}>
+              <div class="relative">
+                <ImageThumbnail
+                  curve
+                  shadow
+                  url={api.getPeopleThumbnailUrl(person.id)}
+                  altText={getPersonNameWithHiddenValue(person.name, person.isHidden)}
+                  title={getPersonNameWithHiddenValue(person.name, person.isHidden)}
+                  widthStyle="90px"
+                  heightStyle="90px"
+                  thumbhash={null}
+                  hidden={person.isHidden}
+                />
+              </div>
+              <p class="mt-1 truncate font-medium" title={person.name}>{person.name}</p>
+            </button>
+          </div>
        {/each}
      {/if}
    </div>
@@ -1,39 +1,48 @@
 <script lang="ts">
  import { fly } from 'svelte/transition';
  import { linear } from 'svelte/easing';
-  import { api, type PersonResponseDto, type AssetFaceResponseDto, AssetTypeEnum } from '@api';
+  import { api, type PersonResponseDto, type AssetFaceResponseDto, type AssetResponseDto } from '@api';
  import ImageThumbnail from '../assets/thumbnail/image-thumbnail.svelte';
  import { handleError } from '$lib/utils/handle-error';
  import { createEventDispatcher, onMount } from 'svelte';
  import LoadingSpinner from '$lib/components/shared-components/loading-spinner.svelte';
  import { NotificationType, notificationController } from '../shared-components/notification/notification';
-  import { mdiArrowLeftThin, mdiRestart } from '@mdi/js';
+  import { mdiAccountOff, mdiArrowLeftThin, mdiFaceMan, mdiRestart, mdiSelect } from '@mdi/js';
  import Icon from '../elements/icon.svelte';
  import { boundingBoxesArray } from '$lib/stores/people.store';
  import { websocketStore } from '$lib/stores/websocket';
  import AssignFaceSidePanel from './assign-face-side-panel.svelte';
-  import { getPersonNameWithHiddenValue } from '$lib/utils/person';
+  import { getPersonNameWithHiddenValue, zoomImageToBase64 } from '$lib/utils/person';
+  import UnassignedFacesSidePannel from './unassigned-faces-side-pannel.svelte';
+  import type { FaceWithGeneretedThumbnail } from '$lib/utils/people-utils';
+  import Button from '../elements/buttons/button.svelte';
  import { timeBeforeShowLoadingSpinner } from '$lib/constants';

-  export let assetId: string;
-  export let assetType: AssetTypeEnum;
+  export let asset: AssetResponseDto;

  // keep track of the changes
-  let numberOfPersonToCreate: string[] = [];
-  let numberOfAssetFaceGenerated: string[] = [];
+  let idsOfPersonToCreate: string[] = [];
+  let idsOfAssetFaceGenerated: string[] = [];

  // faces
  let peopleWithFaces: AssetFaceResponseDto[] = [];
  let selectedPersonToReassign: (PersonResponseDto | null)[];
  let selectedPersonToCreate: (string | null)[];
+  let selectedPersonToAdd: FaceWithGeneretedThumbnail[] = [];
+  let selectedPersonToUnassign: FaceWithGeneretedThumbnail[] = [];
+  let selectedPersonToRemove: boolean[] = [];
+  let unassignedFaces: FaceWithGeneretedThumbnail[] = [];
  let editedPersonIndex: number;
+  let shouldRefresh: boolean = false;

  // loading spinners
  let isShowLoadingDone = false;
  let isShowLoadingPeople = false;

-  // search people
+  // other modals
  let showSeletecFaces = false;
+  let showUnassignedFaces = false;
+  let isSelectingFaces = false;
  let allPeople: PersonResponseDto[] = [];

  // timers
@@ -48,15 +57,17 @@

  // Reset value
  $onPersonThumbnail = '';
-
+  $: numberOfFacesToUnassign = selectedPersonToRemove ? selectedPersonToRemove.filter(Boolean).length : 0;
  $: {
    if ($onPersonThumbnail) {
-      numberOfAssetFaceGenerated.push($onPersonThumbnail);
+      idsOfAssetFaceGenerated.push($onPersonThumbnail);
      if (
-        isEqual(numberOfAssetFaceGenerated, numberOfPersonToCreate) &&
+        isEqual(idsOfAssetFaceGenerated, idsOfPersonToCreate) &&
        loaderLoadingDoneTimeout &&
        automaticRefreshTimeout &&
-        selectedPersonToCreate.filter((person) => person !== null).length === numberOfPersonToCreate.length
+        selectedPersonToCreate.filter((person) => person !== null).length +
+          selectedPersonToAdd.filter((face) => face.person === null).length ===
+          idsOfPersonToCreate.length
      ) {
        clearTimeout(loaderLoadingDoneTimeout);
        clearTimeout(automaticRefreshTimeout);
@@ -66,14 +77,30 @@
  }

  onMount(async () => {
+    if (asset === null) {
+      return;
+    }
    const timeout = setTimeout(() => (isShowLoadingPeople = true), timeBeforeShowLoadingSpinner);
    try {
      const { data } = await api.personApi.getAllPeople({ withHidden: true });
      allPeople = data.people;
-      const result = await api.faceApi.getFaces({ id: assetId });
+      const result = await api.faceApi.getFaces({ faceId: asset.id });
      peopleWithFaces = result.data;
+
      selectedPersonToCreate = Array.from({ length: peopleWithFaces.length });
      selectedPersonToReassign = Array.from({ length: peopleWithFaces.length });
+      selectedPersonToRemove = Array.from({ length: peopleWithFaces.length });
+      const peopleWithGeneratedImage = await Promise.all(
+        peopleWithFaces.map(async (personWithFace) => {
+          if (personWithFace.person || asset === null) {
+            return null;
+          } else {
+            const image = await zoomImageToBase64(personWithFace, asset.type, asset.id);
+            return image ? { ...personWithFace, customThumbnail: image } : null;
+          }
+        }),
+      );
+      unassignedFaces = peopleWithGeneratedImage.filter((item): item is FaceWithGeneretedThumbnail => item !== null);
    } catch (error) {
      handleError(error, "Can't get faces");
    } finally {
@@ -87,6 +114,15 @@
  };

  const handleBackButton = () => {
+    if (isSelectingFaces) {
+      isSelectingFaces = false;
+      selectedPersonToRemove = Array.from({ length: peopleWithFaces.length });
+      return;
+    }
+    if (shouldRefresh) {
+      dispatch('refresh');
+      return;
+    }
    dispatch('close');
  };

@@ -99,30 +135,121 @@
    }
  };

+  const handleOpenAvailableFaces = () => {
+    showUnassignedFaces = true;
+  };
+
+  const closeAssigningFaceModal = () => {
+    $boundingBoxesArray = [];
+    showSeletecFaces = false;
+  };
+
+  const handleMouseLeaveFaceThumbnail = () => {
+    if (!showSeletecFaces) {
+      $boundingBoxesArray = [];
+    }
+  };
+
+  const handleSelectFaces = () => {
+    isSelectingFaces = !isSelectingFaces;
+  };
+
+  const handleSelectFace = (index: number) => {
+    if (!isSelectingFaces) {
+      return;
+    }
+    selectedPersonToRemove[index] = !selectedPersonToRemove[index];
+  };
+
+  const handleRemoveAddedFace = (indexToRemove: number) => {
+    $boundingBoxesArray = [];
+    selectedPersonToAdd = selectedPersonToAdd.filter((_, index) => index !== indexToRemove);
+  };
+
+  const handleAddRemovedFace = (indexToRemove: number) => {
+    $boundingBoxesArray = [];
+    unassignedFaces = unassignedFaces
+      .map((obj) => (obj && obj.id === selectedPersonToUnassign[indexToRemove].id ? null : obj))
+      .filter((item): item is FaceWithGeneretedThumbnail => item !== null) as FaceWithGeneretedThumbnail[];
+
+    selectedPersonToUnassign = selectedPersonToUnassign.filter((_, index) => index !== indexToRemove);
+  };
+
+  const handleUnassignFaces = async () => {
+    if (asset === null) {
+      return;
+    }
+    if (numberOfFacesToUnassign > 0) {
+      for (const [i, peopleWithFace] of peopleWithFaces.entries()) {
+        if (selectedPersonToRemove[i]) {
+          const image = await zoomImageToBase64(peopleWithFace, asset.type, asset.id);
+          if (image) {
+            selectedPersonToUnassign.push({ ...peopleWithFace, customThumbnail: image });
+            // Trigger reactivity
+            selectedPersonToUnassign = selectedPersonToUnassign;
+            if (selectedPersonToReassign[i]) {
+              selectedPersonToReassign[i] = null;
+            }
+            if (selectedPersonToCreate[i]) {
+              selectedPersonToCreate[i] = null;
+            }
+          }
+        }
+      }
+      const uniqueIds = new Set(selectedPersonToUnassign.map((objA) => objA.id));
+      selectedPersonToAdd = selectedPersonToAdd.filter((objB) => !uniqueIds.has(objB.id));
+    }
+    selectedPersonToRemove = Array.from({ length: peopleWithFaces.length });
+    isSelectingFaces = false;
+  };
+
  const handleEditFaces = async () => {
    loaderLoadingDoneTimeout = setTimeout(() => (isShowLoadingDone = true), timeBeforeShowLoadingSpinner);
    const numberOfChanges =
-      selectedPersonToCreate.filter((person) => person !== null).length +
-      selectedPersonToReassign.filter((person) => person !== null).length;
+      selectedPersonToCreate.filter((person) => person !== null && person !== undefined).length +
+      selectedPersonToReassign.filter((person) => person !== null && person !== undefined).length +
+      selectedPersonToAdd.filter((person) => person !== null && person !== undefined).length +
+      selectedPersonToUnassign.filter((person) => person !== null && person !== undefined).length;
    if (numberOfChanges > 0) {
      try {
        for (const [index, peopleWithFace] of peopleWithFaces.entries()) {
          const personId = selectedPersonToReassign[index]?.id;

          if (personId) {
-            await api.faceApi.reassignFacesById({
-              id: personId,
-              faceDto: { id: peopleWithFace.id },
+            await api.faceApi.reassignFace({
+              id: peopleWithFace.id,
+              reassignFaceDto: { personId },
            });
          } else if (selectedPersonToCreate[index]) {
            const { data } = await api.personApi.createPerson();
-            numberOfPersonToCreate.push(data.id);
-            await api.faceApi.reassignFacesById({
-              id: data.id,
-              faceDto: { id: peopleWithFace.id },
+            idsOfPersonToCreate.push(data.id);
+            await api.faceApi.reassignFace({
+              id: peopleWithFace.id,
+              reassignFaceDto: { personId: data.id },
            });
          }
        }
+        for (const face of selectedPersonToAdd) {
+          if (face.person) {
+            await api.faceApi.reassignFace({
+              id: face.id,
+              reassignFaceDto: { personId: face.person.id },
+            });
+          } else {
+            const { data } = await api.personApi.createPerson();
+            idsOfPersonToCreate.push(data.id);
+            await api.faceApi.reassignFace({
+              id: face.id,
+              reassignFaceDto: { personId: data.id },
+            });
+          }
+        }
+
+        for (const face of selectedPersonToUnassign) {
+          await api.faceApi.unassignFace({
+            id: face.id,
+          });
+        }

        notificationController.show({
          message: `Edited ${numberOfChanges} ${numberOfChanges > 1 ? 'people' : 'person'}`,
@@ -134,7 +261,7 @@
    }

    isShowLoadingDone = false;
-    if (numberOfPersonToCreate.length === 0) {
+    if (idsOfPersonToCreate.length === 0) {
      clearTimeout(loaderLoadingDoneTimeout);
      dispatch('refresh');
    } else {
@@ -143,6 +270,7 @@
  };

  const handleCreatePerson = (newFeaturePhoto: string | null) => {
+    $boundingBoxesArray = [];
    const personToUpdate = peopleWithFaces.find((person) => person.id === peopleWithFaces[editedPersonIndex].id);
    if (newFeaturePhoto && personToUpdate) {
      selectedPersonToCreate[peopleWithFaces.indexOf(personToUpdate)] = newFeaturePhoto;
@@ -151,14 +279,22 @@
  };

  const handleReassignFace = (person: PersonResponseDto | null) => {
+    $boundingBoxesArray = [];
    if (person) {
      selectedPersonToReassign[editedPersonIndex] = person;
-      showSeletecFaces = false;
    }
+    showSeletecFaces = false;
+  };
+
+  const handleCreateOrReassignFaceFromUnassignedFace = (face: FaceWithGeneretedThumbnail) => {
+    selectedPersonToAdd.push(face);
+    selectedPersonToAdd = selectedPersonToAdd;
+    showUnassignedFaces = false;
  };

  const handlePersonPicker = async (index: number) => {
    editedPersonIndex = index;
+    $boundingBoxesArray = [peopleWithFaces[index]];
    showSeletecFaces = true;
  };
 </script>
@@ -177,29 +313,82 @@
          <Icon path={mdiArrowLeftThin} size="24" />
        </div>
      </button>
-      <p class="flex text-lg text-immich-fg dark:text-immich-dark-fg">Edit faces</p>
+      <p class="flex text-lg text-immich-fg dark:text-immich-dark-fg">
+        {isSelectingFaces ? 'Select Faces' : 'Edit faces'}
+      </p>
    </div>
    {#if !isShowLoadingDone}
-      <button
-        class="justify-self-end rounded-lg p-2 hover:bg-immich-dark-primary hover:dark:bg-immich-dark-primary/50"
-        on:click={() => handleEditFaces()}
-      >
-        Done
-      </button>
+      <div class="flex items-center gap-2">
+        {#if !isSelectingFaces && unassignedFaces.length > 0}
+          <button
+            class="justify-self-end rounded-lg p-2 hover:bg-immich-dark-primary hover:dark:bg-immich-dark-primary/50"
+            on:click={handleOpenAvailableFaces}
+            title="Faces available"
+          >
+            <div>
+              <Icon path={mdiFaceMan} />
+            </div>
+          </button>
+        {/if}
+        {#if !peopleWithFaces.every((item) => item.person === null)}
+          <button
+            class="justify-self-end rounded-lg p-2 hover:bg-immich-dark-primary hover:dark:bg-immich-dark-primary/50"
+            on:click={handleSelectFaces}
+            title="Select faces to unassign"
+          >
+            <div>
+              <Icon path={mdiSelect} />
+            </div>
+          </button>
+        {/if}
+        {#if !isSelectingFaces}
+          <button
+            class="justify-self-end rounded-lg p-2 hover:bg-immich-dark-primary hover:dark:bg-immich-dark-primary/50"
+            on:click={handleEditFaces}
+          >
+            Done
+          </button>
+        {/if}
+      </div>
    {:else}
      <LoadingSpinner />
    {/if}
  </div>

  <div class="px-4 py-4 text-sm">
-    <div class="mt-4 flex flex-wrap gap-2">
+    <div class="flex items-center justify-between gap-2 h-10">
+      {#if peopleWithFaces.every((item) => item.person === null)}
+        <div class="flex items-center justify-center w-full">
+          <div class="grid place-items-center">
+            <Icon path={mdiAccountOff} size="3.5em" />
+            <p class="mt-5 font-medium">No faces currently visible</p>
+          </div>
+        </div>
+      {:else}
+        <div>Faces visible</div>
+      {/if}
+
+      {#if isSelectingFaces && selectedPersonToRemove && selectedPersonToRemove.some(Boolean)}
+        <Button
+          size="xs"
+          color="red"
+          title="Unassign faces"
+          shadow={false}
+          rounded="full"
+          on:click={handleUnassignFaces}
+        >
+          Unassign Faces
+        </Button>
+      {/if}
+    </div>
+    <div class="mt-2 flex flex-wrap gap-2">
      {#if isShowLoadingPeople}
        <div class="flex w-full justify-center">
          <LoadingSpinner />
        </div>
      {:else}
        {#each peopleWithFaces as face, index}
-          {#if face.person}
+          {#if face.person && !unassignedFaces.some((unassignedFace) => unassignedFace.id === face.id) && !selectedPersonToUnassign.some((unassignedFace) => unassignedFace.id === face.id)}
            <div class="relative z-[20001] h-[115px] w-[95px]">
              <div
                role="button"
@@ -207,7 +396,9 @@
                class="absolute left-0 top-0 h-[90px] w-[90px] cursor-default"
                on:focus={() => ($boundingBoxesArray = [peopleWithFaces[index]])}
                on:mouseover={() => ($boundingBoxesArray = [peopleWithFaces[index]])}
-                on:mouseleave={() => ($boundingBoxesArray = [])}
+                on:mouseleave={handleMouseLeaveFaceThumbnail}
+                on:click={() => handleSelectFace(index)}
+                on:keydown={() => handleSelectFace(index)}
              >
                <div class="relative">
                  <ImageThumbnail
@@ -227,12 +418,14 @@
                        : getPersonNameWithHiddenValue(face.person?.name, face.person?.isHidden)}
                    widthStyle="90px"
                    heightStyle="90px"
-                    thumbhash={null}
-                    hidden={selectedPersonToReassign[index]
-                      ? selectedPersonToReassign[index]?.isHidden
-                      : selectedPersonToCreate[index]
-                        ? false
-                        : face.person?.isHidden}
+                    hidden={isSelectingFaces
+                      ? false
+                      : selectedPersonToReassign[index]
+                        ? selectedPersonToReassign[index]?.isHidden
+                        : selectedPersonToCreate[index]
+                          ? false
+                          : face.person?.isHidden}
+                    persistentBorder={isSelectingFaces ? selectedPersonToRemove[index] : false}
                  />
                </div>
                {#if !selectedPersonToCreate[index]}
@@ -244,42 +437,149 @@
                    {/if}
                  </p>
                {/if}
-
-                <div class="absolute -right-[5px] -top-[5px] h-[20px] w-[20px] rounded-full bg-blue-700">
-                  {#if selectedPersonToCreate[index] || selectedPersonToReassign[index]}
-                    <button on:click={() => handleReset(index)} class="flex h-full w-full">
-                      <div class="absolute left-1/2 top-1/2 translate-x-[-50%] translate-y-[-50%] transform">
-                        <div>
-                          <Icon path={mdiRestart} size={18} />
+                {#if !isSelectingFaces}
+                  <div class="absolute -right-[5px] -top-[5px] h-[20px] w-[20px] rounded-full bg-blue-700">
+                    {#if selectedPersonToCreate[index] || selectedPersonToReassign[index]}
+                      <button on:click={() => handleReset(index)} class="flex h-full w-full">
+                        <div class="absolute left-1/2 top-1/2 translate-x-[-50%] translate-y-[-50%] transform">
+                          <div>
+                            <Icon path={mdiRestart} size={18} />
+                          </div>
                        </div>
-                      </div>
-                    </button>
-                  {:else}
-                    <button on:click={() => handlePersonPicker(index)} class="flex h-full w-full">
-                      <div
-                        class="absolute left-1/2 top-1/2 h-[2px] w-[14px] translate-x-[-50%] translate-y-[-50%] transform bg-white"
-                      />
-                    </button>
-                  {/if}
-                </div>
+                      </button>
+                    {:else}
+                      <button on:click={() => handlePersonPicker(index)} class="flex h-full w-full">
+                        <div
+                          class="absolute left-1/2 top-1/2 h-[2px] w-[14px] translate-x-[-50%] translate-y-[-50%] transform bg-white"
+                        />
+                      </button>
+                    {/if}
+                  </div>
+                {/if}
              </div>
            </div>
          {/if}
        {/each}
      {/if}
    </div>
+    {#if selectedPersonToAdd.length > 0}
+      <div class="mt-8">
+        <p>Faces to add</p>
+        <div class="mt-4 flex flex-wrap gap-2">
+          {#each selectedPersonToAdd as face, index}
+            {#if face}
+              <div class="relative z-[20001] h-[115px] w-[95px]">
+                <div
+                  role="button"
+                  tabindex={index}
+                  class="absolute left-0 top-0 h-[90px] w-[90px] cursor-default"
+                  on:focus={() => ($boundingBoxesArray = [peopleWithFaces[index]])}
+                  on:mouseover={() => ($boundingBoxesArray = [peopleWithFaces[index]])}
+                  on:mouseleave={() => ($boundingBoxesArray = [])}
+                >
+                  <div class="relative">
+                    <ImageThumbnail
+                      curve
+                      shadow
+                      url={face.person && face.person.id
+                        ? api.getPeopleThumbnailUrl(face.person.id)
+                        : face.customThumbnail}
+                      altText={'New person'}
+                      title={'New person'}
+                      widthStyle="90px"
+                      heightStyle="90px"
+                      thumbhash={null}
+                    />
+                  </div>
+                  {#if face.person?.name}
+                    <p class="relative mt-1 truncate font-medium" title={face.person?.name}>
+                      {face.person?.name}
+                    </p>{/if}
+                  {#if !isSelectingFaces}
+                    <div class="absolute -right-[5px] -top-[5px] h-[20px] w-[20px] rounded-full bg-red-700">
+                      <button on:click={() => handleRemoveAddedFace(index)} class="flex h-full w-full">
+                        <div
+                          class="absolute left-1/2 top-1/2 h-[2px] w-[14px] translate-x-[-50%] translate-y-[-50%] transform bg-white"
+                        />
+                      </button>
+                    </div>
+                  {/if}
+                </div>
+              </div>
+            {/if}
+          {/each}
+        </div>
+      </div>
+    {/if}
+    {#if selectedPersonToUnassign.length > 0}
+      <div class="mt-2">
+        <p>Faces to unassign</p>
+        <div class="mt-4 flex flex-wrap gap-2">
+          {#each selectedPersonToUnassign as face, index}
+            {#if face && face.person}
+              <div class="relative z-[20001] h-[115px] w-[95px]">
+                <div
+                  role="button"
+                  tabindex={index}
+                  class="absolute left-0 top-0 h-[90px] w-[90px] cursor-default"
+                  on:focus={() => ($boundingBoxesArray = [peopleWithFaces[index]])}
+                  on:mouseover={() => ($boundingBoxesArray = [peopleWithFaces[index]])}
+                  on:mouseleave={() => ($boundingBoxesArray = [])}
+                >
+                  <div class="relative">
+                    <ImageThumbnail
+                      curve
+                      shadow
+                      url={face.customThumbnail}
+                      altText={'New person'}
+                      title={'New person'}
+                      widthStyle="90px"
+                      heightStyle="90px"
+                      thumbhash={null}
+                    />
+                  </div>
+                  {#if face.person?.name}
+                    <p class="relative mt-1 truncate font-medium" title={face.person?.name}>
+                      {face.person?.name}
+                    </p>{/if}
+                  {#if !isSelectingFaces}
+                    <div class="absolute -right-[5px] -top-[5px] h-[20px] w-[20px] rounded-full bg-red-700">
+                      <button on:click={() => handleAddRemovedFace(index)} class="flex h-full w-full">
+                        <div
+                          class="absolute left-1/2 top-1/2 h-[2px] w-[14px] translate-x-[-50%] translate-y-[-50%] transform bg-white"
+                        />
+                      </button>
+                    </div>
+                  {/if}
+                </div>
+              </div>
+            {/if}
+          {/each}
+        </div>
+      </div>
+    {/if}
  </div>
 </section>

 {#if showSeletecFaces}
  <AssignFaceSidePanel
-    {peopleWithFaces}
+    {asset}
+    personWithFace={peopleWithFaces[editedPersonIndex]}
    {allPeople}
-    {editedPersonIndex}
-    {assetType}
-    {assetId}
-    on:close={() => (showSeletecFaces = false)}
+    on:close={closeAssigningFaceModal}
    on:createPerson={(event) => handleCreatePerson(event.detail)}
    on:reassign={(event) => handleReassignFace(event.detail)}
  />
 {/if}
+
+{#if showUnassignedFaces}
+  <UnassignedFacesSidePannel
+    {asset}
+    {allPeople}
+    {unassignedFaces}
+    {selectedPersonToAdd}
+    on:close={() => (showUnassignedFaces = false)}
+    on:createPerson={(event) => handleCreateOrReassignFaceFromUnassignedFace(event.detail)}
+    on:reassign={(event) => handleCreateOrReassignFaceFromUnassignedFace(event.detail)}
+  />
+{/if}
@@ -0,0 +1,121 @@
+<script lang="ts">
+  import { fly } from 'svelte/transition';
+  import { linear } from 'svelte/easing';
+  import ImageThumbnail from '../assets/thumbnail/image-thumbnail.svelte';
+  import { mdiAccountOff, mdiArrowLeftThin } from '@mdi/js';
+  import Icon from '../elements/icon.svelte';
+  import { createEventDispatcher } from 'svelte';
+  import AssignFaceSidePanel from './assign-face-side-panel.svelte';
+  import type { AssetResponseDto, PersonResponseDto } from '@api';
+  import type { FaceWithGeneretedThumbnail } from '$lib/utils/people-utils';
+  import { boundingBoxesArray } from '$lib/stores/people.store';
+
+  export let unassignedFaces: FaceWithGeneretedThumbnail[];
+  export let allPeople: PersonResponseDto[];
+  export let selectedPersonToAdd: FaceWithGeneretedThumbnail[];
+  export let asset: AssetResponseDto;
+
+  let showSeletecFaces = false;
+  let personSelected: FaceWithGeneretedThumbnail;
+  const dispatch = createEventDispatcher();
+  const handleBackButton = () => {
+    dispatch('close');
+  };
+
+  const handleSelectedFace = (index: number) => {
+    const face = unassignedFaces[index];
+    if (face) {
+      personSelected = face;
+      showSeletecFaces = true;
+    }
+  };
+
+  const handleCreatePerson = (newFeaturePhoto: string | null) => {
+    showSeletecFaces = false;
+    if (newFeaturePhoto) {
+      personSelected.customThumbnail = newFeaturePhoto;
+      dispatch('createPerson', personSelected);
+    } else {
+      dispatch('close');
+    }
+  };
+
+  const handleReassignFace = (person: PersonResponseDto | null) => {
+    if (person) {
+      showSeletecFaces = false;
+      personSelected.person = person;
+      dispatch('reassign', personSelected);
+    } else {
+      dispatch('close');
+    }
+  };
+</script>
+
+<section
+  transition:fly={{ x: 360, duration: 100, easing: linear }}
+  class="absolute top-0 z-[2001] h-full w-[360px] overflow-x-hidden p-2 bg-immich-bg dark:bg-immich-dark-bg dark:text-immich-dark-fg"
+>
+  <div class="flex place-items-center justify-between gap-2">
+    <div class="flex items-center gap-2">
+      <button
+        class="flex place-content-center rounded-full p-3 transition-colors hover:bg-gray-200 dark:text-immich-dark-fg dark:hover:bg-gray-900"
+        on:click={handleBackButton}
+      >
+        <div>
+          <Icon path={mdiArrowLeftThin} size="24" />
+        </div>
+      </button>
+      <p class="flex text-lg text-immich-fg dark:text-immich-dark-fg">Faces available</p>
+    </div>
+  </div>
+  {#if unassignedFaces.some(Boolean)}
+    <div class="px-4 py-4 text-sm">
+      <div class="mt-4 flex flex-wrap gap-2">
+        {#each unassignedFaces as face, index}
+          {#if !selectedPersonToAdd.some((faceToAdd) => face && faceToAdd.id === face.id)}
+            <div class="relative z-[20001] h-[115px] w-[95px]">
+              <button
+                tabindex={index}
+                class="absolute left-0 top-0 h-[90px] w-[90px] cursor-default"
+                on:focus={() => (face ? ($boundingBoxesArray = [face]) : '')}
+                on:mouseover={() => (face ? ($boundingBoxesArray = [face]) : '')}
+                on:mouseleave={() => ($boundingBoxesArray = [])}
+                on:click={() => handleSelectedFace(index)}
+                on:keydown={() => handleSelectedFace(index)}
+              >
+                <ImageThumbnail
+                  curve
+                  shadow
+                  url={face.customThumbnail}
+                  title="Available face"
+                  altText="Available face"
+                  widthStyle="90px"
+                  heightStyle="90px"
+                  thumbhash={null}
+                />
+              </button>
+            </div>
+          {/if}
+        {/each}
+      </div>
+    </div>
+  {:else}
+    <div class="flex items-center justify-center">
+      <div class="grid place-items-center">
+        <Icon path={mdiAccountOff} size="3.5em" />
+        <p class="mt-5 font-medium">No faces available</p>
+      </div>
+    </div>
+  {/if}
+</section>
+
+{#if showSeletecFaces}
+  <AssignFaceSidePanel
+    {asset}
+    personWithFace={personSelected}
+    {allPeople}
+    on:close={() => (showSeletecFaces = false)}
+    on:createPerson={(event) => handleCreatePerson(event.detail)}
+    on:reassign={(event) => handleReassignFace(event.detail)}
+  />
+{/if}
@@ -6,7 +6,7 @@
  import { api, type AssetFaceUpdateItem, type PersonResponseDto } from '@api';
  import ControlAppBar from '../shared-components/control-app-bar.svelte';
  import Button from '../elements/buttons/button.svelte';
-  import { mdiPlus, mdiMerge } from '@mdi/js';
+  import { mdiPlus, mdiMerge, mdiTagRemove } from '@mdi/js';
  import LoadingSpinner from '../shared-components/loading-spinner.svelte';
  import { handleError } from '$lib/utils/handle-error';
  import { notificationController, NotificationType } from '../shared-components/notification/notification';
@@ -22,6 +22,7 @@
  let disableButtons = false;
  let showLoadingSpinnerCreate = false;
  let showLoadingSpinnerReassign = false;
+  let showLoadingSpinnerUnassign = false;
  let hasSelection = false;
  let screenHeight: number;

@@ -113,6 +114,29 @@
    showLoadingSpinnerReassign = false;
    dispatch('confirm');
  };
+
+  const handleUnassign = async () => {
+    const timeout = setTimeout(() => (showLoadingSpinnerUnassign = true), 100);
+
+    try {
+      disableButtons = true;
+      await api.personApi.unassignFaces({
+        assetFaceUpdateDto: { data: selectedPeople },
+      });
+
+      notificationController.show({
+        message: `Un-assigned ${assetIds.length} asset${assetIds.length > 1 ? 's' : ''}`,
+        type: NotificationType.Info,
+      });
+    } catch (error) {
+      handleError(error, 'Unable to unassign assets');
+    } finally {
+      clearTimeout(timeout);
+    }
+
+    showLoadingSpinnerCreate = false;
+    dispatch('confirm');
+  };
 </script>

 <svelte:window bind:innerHeight={screenHeight} />
@@ -128,13 +152,24 @@
    </svelte:fragment>
    <svelte:fragment slot="trailing">
      <div class="flex gap-4">
+        <Button
+          title={'Unassign selected assets to a new person'}
+          size={'sm'}
+          disabled={disableButtons || hasSelection}
+          on:click={handleUnassign}
+        >
+          {#if !showLoadingSpinnerUnassign}
+            <Icon path={mdiTagRemove} size={18} />
+          {:else}
+            <LoadingSpinner />
+          {/if}
+          <span class="ml-2"> Unassign</span></Button
+        >
        <Button
          title={'Assign selected assets to a new person'}
          size={'sm'}
          disabled={disableButtons || hasSelection}
-          on:click={() => {
-            handleCreate();
-          }}
+          on:click={handleCreate}
        >
          {#if !showLoadingSpinnerCreate}
            <Icon path={mdiPlus} size={18} />
@@ -147,9 +182,7 @@
          size={'sm'}
          title={'Assign selected assets to an existing person'}
          disabled={disableButtons || !hasSelection}
-          on:click={() => {
-            handleReassign();
-          }}
+          on:click={handleReassign}
        >
          {#if !showLoadingSpinnerReassign}
            <div>
@@ -1,4 +1,5 @@
 import type { Faces } from '$lib/stores/people.store';
+import type { AssetFaceResponseDto } from '@api';
 import type { ZoomImageWheelState } from '@zoom-image/core';

 const getContainedSize = (img: HTMLImageElement): { width: number; height: number } => {
@@ -19,6 +20,10 @@ export interface boundingBox {
  height: number;
 }

+export interface FaceWithGeneretedThumbnail extends AssetFaceResponseDto {
+  customThumbnail: string;
+}
+
 export const getBoundingBox = (
  faces: Faces[],
  zoom: ZoomImageWheelState,
@@ -1,4 +1,6 @@
-import type { PersonResponseDto } from '@api';
+import { photoViewer } from '$lib/stores/assets.store';
+import { AssetTypeEnum, type AssetFaceResponseDto, type PersonResponseDto, ThumbnailFormat, api } from '@api';
+import { get } from 'svelte/store';

 export const searchNameLocal = (
  name: string,
@@ -28,3 +30,60 @@ export const searchNameLocal = (
 export const getPersonNameWithHiddenValue = (name: string, isHidden: boolean) => {
  return `${name ? name + (isHidden ? ' ' : '') : ''}${isHidden ? '(hidden)' : ''}`;
 };
+
+export const zoomImageToBase64 = async (
+  face: AssetFaceResponseDto,
+  assetType: AssetTypeEnum,
+  assetId: string,
+): Promise<string | null> => {
+  let image: HTMLImageElement | null = null;
+  if (assetType === AssetTypeEnum.Image) {
+    image = get(photoViewer);
+  } else if (assetType === AssetTypeEnum.Video) {
+    const data = await api.getAssetThumbnailUrl(assetId, ThumbnailFormat.Webp);
+    const img: HTMLImageElement = new Image();
+    img.src = data;
+
+    await new Promise<void>((resolve) => {
+      img.addEventListener('load', () => resolve());
+      img.addEventListener('error', () => resolve());
+    });
+
+    image = img;
+  }
+  if (image === null) {
+    return null;
+  }
+  const { boundingBoxX1: x1, boundingBoxX2: x2, boundingBoxY1: y1, boundingBoxY2: y2, imageWidth, imageHeight } = face;
+
+  const coordinates = {
+    x1: (image.naturalWidth / imageWidth) * x1,
+    x2: (image.naturalWidth / imageWidth) * x2,
+    y1: (image.naturalHeight / imageHeight) * y1,
+    y2: (image.naturalHeight / imageHeight) * y2,
+  };
+
+  const faceWidth = coordinates.x2 - coordinates.x1;
+  const faceHeight = coordinates.y2 - coordinates.y1;
+
+  const faceImage = new Image();
+  faceImage.src = image.src;
+
+  await new Promise((resolve) => {
+    faceImage.addEventListener('load', resolve);
+    faceImage.addEventListener('error', () => resolve(null));
+  });
+
+  const canvas = document.createElement('canvas');
+  canvas.width = faceWidth;
+  canvas.height = faceHeight;
+
+  const context = canvas.getContext('2d');
+  if (context) {
+    context.drawImage(faceImage, coordinates.x1, coordinates.y1, faceWidth, faceHeight, 0, 0, faceWidth, faceHeight);
+
+    return canvas.toDataURL();
+  } else {
+    return null;
+  }
+};
Author	SHA1	Message	Date
martabal	3e93b46c8b	pr feedback	2024-02-02 17:59:15 +01:00
martabal	5aa05e4630	fix: tests	2024-02-02 15:24:30 +01:00
martabal	a350ea57db	fix: tests	2024-02-02 14:46:55 +01:00
martabal	8fe347073a	fix: tests	2024-02-02 13:58:02 +01:00
martabal	c22a931b97	fix: web	2024-02-02 13:49:10 +01:00
martabal	418777f204	merge main	2024-02-02 12:35:08 +01:00
martabal	f9b93b9e02	merge main	2024-02-02 12:34:18 +01:00
martabal	f72d993ecc	chore: regenerate api	2024-02-02 12:32:30 +01:00
martabal	105af18274	chore: merge main	2024-02-01 20:36:17 +01:00
martabal	9a5e2969d0	feat: still show bounding box when reassigning a face	2023-12-29 16:01:44 +01:00
martabal	2b7c662450	fix: server tests	2023-12-27 13:21:45 +01:00
martabal	d96fcec287	chore: fix merge	2023-12-27 13:15:19 +01:00
martabal	90439f6f89	chore: merge main	2023-12-27 13:13:43 +01:00
martabal	3cb8cb45e7	chore: merge main	2023-12-16 13:27:51 +01:00
martabal	80299772fe	merge main	2023-12-16 13:26:45 +01:00
martabal	40492404bc	fix: lint	2023-12-14 21:24:21 +01:00
martabal	aeffec5c63	chore: merge main	2023-12-14 21:16:46 +01:00
martabal	fdacae95f9	fix: control key search	2023-12-10 15:05:12 +01:00
martabal	d53a2661f6	fix merge	2023-12-10 14:59:12 +01:00
martabal	e5428a3b38	merge main	2023-12-10 14:58:51 +01:00
martabal	59322d395f	remove console.log	2023-12-10 03:22:28 +01:00
martabal	7f0f23ba33	Merge branch 'main' into feat/un-assign-person-faces	2023-12-10 02:52:08 +01:00
martabal	565cac16d7	simplify	2023-12-10 02:51:48 +01:00
martabal	5f98f12731	feat: global edit	2023-12-09 00:22:20 +01:00
martabal	e8b308141b	fix: tests	2023-12-08 19:09:37 +01:00
martabal	20707448e0	use svelte store	2023-12-08 18:18:18 +01:00
martabal	8a69a69ca6	chore: merge main	2023-12-08 17:58:00 +01:00
martabal	1484517421	merge main	2023-12-08 17:56:52 +01:00
martabal	920026fbc6	fix: use face thumbnail and not person face thumbnail when un-assigning face	2023-12-06 22:43:06 +01:00
martabal	8aede9e575	fix: reset re-assigning selected un-assigned face	2023-12-06 18:43:01 +01:00
martabal	5a08b7e25e	fix: reset un-assigned person	2023-12-06 16:08:40 +01:00
martabal	bbe86a4632	move the selected unassigned faces to the person side panel	2023-12-06 11:09:08 +01:00
martabal	b64dabd6f0	fix: un-assign when clicking on done	2023-12-06 01:25:49 +01:00
martabal	7e32f8b292	merge main	2023-12-06 00:11:15 +01:00
martabal	56ff252b2e	fix: e2e test	2023-12-06 00:04:49 +01:00
martabal	e23168810b	feat(web,server): unassign faces	2023-12-05 23:47:19 +01:00