From d1070ff2eb8cb8064cecf59715dfda32a6cd9027 Mon Sep 17 00:00:00 2001 From: futa-ikeda Date: Mon, 17 Nov 2025 15:24:38 -0500 Subject: [PATCH] fix(addons): Show addon icon in User Connected Addons page --- src/app/shared/mappers/addon.mapper.ts | 2 ++ .../services/addons/addons.service.spec.ts | 6 ++++-- .../shared/services/addons/addons.service.ts | 2 +- .../shared/stores/addons/addons.state.spec.ts | 17 ++++++++++------- .../addons/addons.authorized-storage.data.ts | 2 ++ 5 files changed, 19 insertions(+), 10 deletions(-) diff --git a/src/app/shared/mappers/addon.mapper.ts b/src/app/shared/mappers/addon.mapper.ts index c3a70ed48..bb6ab0331 100644 --- a/src/app/shared/mappers/addon.mapper.ts +++ b/src/app/shared/mappers/addon.mapper.ts @@ -56,6 +56,7 @@ export class AddonMapper { const displayName = (matchingService?.['display_name'] as string) || ''; const credentialsFormat = (matchingService?.['credentials_format'] as string) || ''; const supportedFeatures = (matchingService?.['supported_features'] as string[]) || []; + const iconUrl = (matchingService?.['icon_url'] as string) || ''; return { type: response.type, @@ -73,6 +74,7 @@ export class AddonMapper { externalServiceName, supportedFeatures, credentialsFormat, + iconUrl, providerName: displayName, }; } diff --git a/src/app/shared/services/addons/addons.service.spec.ts b/src/app/shared/services/addons/addons.service.spec.ts index 45355d7ba..5c4b05dcc 100644 --- a/src/app/shared/services/addons/addons.service.spec.ts +++ b/src/app/shared/services/addons/addons.service.spec.ts @@ -90,7 +90,7 @@ describe('Service: Addons', () => { }); const request = httpMock.expectOne( - 'http://addons.localhost:8000/user-references/reference-id/authorized_storage_accounts/?include=external-storage-service&fields%5Bexternal-storage-services%5D=external_service_name,credentials_format' + 'http://addons.localhost:8000/user-references/reference-id/authorized_storage_accounts/?include=external-storage-service&fields%5Bexternal-storage-services%5D=external_service_name,credentials_format,icon_url' ); expect(request.request.method).toBe('GET'); request.flush(getAddonsAuthorizedStorageData()); @@ -103,7 +103,8 @@ describe('Service: Addons', () => { authorizedCapabilities: ['ACCESS', 'UPDATE'], authorizedOperationNames: ['list_root_items', 'get_item_info', 'list_child_items'], credentialsAvailable: true, - credentialsFormat: '', + credentialsFormat: 'OAUTH2', + iconUrl: 'https://osf.io/assets/images/logo.svg', defaultRootFolder: '', displayName: 'Google Drive', externalServiceName: 'googledrive', @@ -151,6 +152,7 @@ describe('Service: Addons', () => { authorizedOperationNames: ['list_root_items', 'get_item_info', 'list_child_items'], credentialsAvailable: true, credentialsFormat: '', + iconUrl: '', defaultRootFolder: '', displayName: 'Google Drive', externalServiceName: '', diff --git a/src/app/shared/services/addons/addons.service.ts b/src/app/shared/services/addons/addons.service.ts index d2e5c6ef7..dadc7d3c2 100644 --- a/src/app/shared/services/addons/addons.service.ts +++ b/src/app/shared/services/addons/addons.service.ts @@ -79,7 +79,7 @@ export class AddonsService { getAuthorizedAddons(addonType: string, referenceId: string): Observable { const params = { - [`fields[external-${addonType}-services]`]: 'external_service_name,credentials_format', + [`fields[external-${addonType}-services]`]: 'external_service_name,credentials_format,icon_url', }; return this.jsonApiService .get< diff --git a/src/app/shared/stores/addons/addons.state.spec.ts b/src/app/shared/stores/addons/addons.state.spec.ts index ebfbf99a8..f45b974d1 100644 --- a/src/app/shared/stores/addons/addons.state.spec.ts +++ b/src/app/shared/stores/addons/addons.state.spec.ts @@ -210,7 +210,7 @@ describe('State: Addons', () => { expect(loading()).toBeTruthy(); const request = httpMock.expectOne( - 'http://addons.localhost:8000/user-references/reference-id/authorized_storage_accounts/?include=external-storage-service&fields%5Bexternal-storage-services%5D=external_service_name,credentials_format' + 'http://addons.localhost:8000/user-references/reference-id/authorized_storage_accounts/?include=external-storage-service&fields%5Bexternal-storage-services%5D=external_service_name,credentials_format,icon_url' ); expect(request.request.method).toBe('GET'); request.flush(getAddonsAuthorizedStorageData()); @@ -223,7 +223,7 @@ describe('State: Addons', () => { authorizedCapabilities: ['ACCESS', 'UPDATE'], authorizedOperationNames: ['list_root_items', 'get_item_info', 'list_child_items'], credentialsAvailable: true, - credentialsFormat: '', + credentialsFormat: 'OAUTH2', defaultRootFolder: '', displayName: 'Google Drive', externalServiceName: 'googledrive', @@ -233,6 +233,7 @@ describe('State: Addons', () => { providerName: '', supportedFeatures: [], type: 'authorized-storage-accounts', + iconUrl: 'https://osf.io/assets/images/logo.svg', }) ); @@ -259,7 +260,7 @@ describe('State: Addons', () => { expect(loading()).toBeTruthy(); const request = httpMock.expectOne( - 'http://addons.localhost:8000/user-references/reference-id/authorized_storage_accounts/?include=external-storage-service&fields%5Bexternal-storage-services%5D=external_service_name,credentials_format' + 'http://addons.localhost:8000/user-references/reference-id/authorized_storage_accounts/?include=external-storage-service&fields%5Bexternal-storage-services%5D=external_service_name,credentials_format,icon_url' ); expect(request.request.method).toBe('GET'); @@ -268,7 +269,7 @@ describe('State: Addons', () => { expect(result).toEqual({ data: [], error: - 'Http failure response for http://addons.localhost:8000/user-references/reference-id/authorized_storage_accounts/?include=external-storage-service&fields%5Bexternal-storage-services%5D=external_service_name,credentials_format: 500 Server Error', + 'Http failure response for http://addons.localhost:8000/user-references/reference-id/authorized_storage_accounts/?include=external-storage-service&fields%5Bexternal-storage-services%5D=external_service_name,credentials_format,icon_url: 500 Server Error', isLoading: false, isSubmitting: false, }); @@ -303,7 +304,6 @@ describe('State: Addons', () => { authorizedCapabilities: ['ACCESS', 'UPDATE'], authorizedOperationNames: ['list_root_items', 'get_item_info', 'list_child_items'], credentialsAvailable: true, - credentialsFormat: '', defaultRootFolder: '', displayName: 'Google Drive', externalServiceName: '', @@ -313,6 +313,8 @@ describe('State: Addons', () => { providerName: '', supportedFeatures: [], type: 'authorized-storage-accounts', + credentialsFormat: '', // No credentialsFormat in a PATCH response + iconUrl: '', // No iconUrl in a PATCH response }) ); @@ -339,7 +341,7 @@ describe('State: Addons', () => { expect(loading()).toBeTruthy(); let request = httpMock.expectOne( - 'http://addons.localhost:8000/user-references/reference-id/authorized_storage_accounts/?include=external-storage-service&fields%5Bexternal-storage-services%5D=external_service_name,credentials_format' + 'http://addons.localhost:8000/user-references/reference-id/authorized_storage_accounts/?include=external-storage-service&fields%5Bexternal-storage-services%5D=external_service_name,credentials_format,icon_url' ); expect(request.request.method).toBe('GET'); request.flush(getAddonsAuthorizedStorageData()); @@ -358,7 +360,6 @@ describe('State: Addons', () => { authorizedCapabilities: ['ACCESS', 'UPDATE'], authorizedOperationNames: ['list_root_items', 'get_item_info', 'list_child_items'], credentialsAvailable: true, - credentialsFormat: '', defaultRootFolder: '', displayName: 'Google Drive', externalServiceName: '', @@ -368,6 +369,8 @@ describe('State: Addons', () => { providerName: '', supportedFeatures: [], type: 'authorized-storage-accounts', + credentialsFormat: '', // No credentialsFormat in a PATCH response + iconUrl: '', // No iconUrl in a PATCH response }) ); diff --git a/src/testing/data/addons/addons.authorized-storage.data.ts b/src/testing/data/addons/addons.authorized-storage.data.ts index 4365c4574..2a7ea5d94 100644 --- a/src/testing/data/addons/addons.authorized-storage.data.ts +++ b/src/testing/data/addons/addons.authorized-storage.data.ts @@ -110,6 +110,8 @@ const AuthorizedStorage = { id: '8aeb85e9-3a73-426f-a89b-5624b4b9d418', attributes: { external_service_name: 'googledrive', + credentials_format: 'OAUTH2', + icon_url: 'https://osf.io/assets/images/logo.svg', }, links: { self: 'https://addons.staging4.osf.io/v1/external-storage-services/8aeb85e9-3a73-426f-a89b-5624b4b9d418',