From 6320bbb46cb30c81d20360a6f49e05a912198264 Mon Sep 17 00:00:00 2001 From: Ryan Mathis Date: Thu, 10 Nov 2022 15:25:17 -0700 Subject: [PATCH] Fixed issue with sizing of sections when creating metadata --- .../templates/ObjectFieldTemplate.js | 2 +- .../attribute/CustomAttributeDefinition.js | 8 +- .../definition/BaseProviderDefinition.js | 20 +++- .../DynamicHttpMetadataProviderDefinition.js | 36 +++++- .../ExternalMetadataProviderDefinition.js | 12 +- ...ileBackedHttpMetadataProviderDefinition.js | 30 ++++- .../FileSystemMetadataProviderDefinition.js | 18 ++- .../LocalDynamicMetadataProviderDefinition.js | 18 ++- .../source/definition/OidcSourceDefinition.js | 18 ++- .../source/definition/SourceDefinition.js | 109 ++++++++++++++---- 10 files changed, 218 insertions(+), 53 deletions(-) diff --git a/ui/src/app/form/component/templates/ObjectFieldTemplate.js b/ui/src/app/form/component/templates/ObjectFieldTemplate.js index 0fe0089e4..2297f40d6 100644 --- a/ui/src/app/form/component/templates/ObjectFieldTemplate.js +++ b/ui/src/app/form/component/templates/ObjectFieldTemplate.js @@ -47,7 +47,7 @@ const ObjectFieldTemplate = ({ {uiSchema.layout.groups.map((group, rIdx) => ( {properties.some(p => group.fields.indexOf(p.name) > -1) && - + {group.title && } {properties.filter(p => group.fields.indexOf(p.name) > -1).map((element, eIdx) => ( {element.content} diff --git a/ui/src/app/metadata/domain/attribute/CustomAttributeDefinition.js b/ui/src/app/metadata/domain/attribute/CustomAttributeDefinition.js index 308c3e14a..d4fb6bb87 100644 --- a/ui/src/app/metadata/domain/attribute/CustomAttributeDefinition.js +++ b/ui/src/app/metadata/domain/attribute/CustomAttributeDefinition.js @@ -11,7 +11,9 @@ export const CustomAttributeDefinition = { layout: { groups: [ { - size: 6, + sizes: { + lg: 6 + }, classNames: '', fields: [ 'name', @@ -23,7 +25,9 @@ export const CustomAttributeDefinition = { ] }, { - size: 6, + sizes: { + lg: 6 + }, classNames: 'bg-light border rounded p-4', fields: [ 'defaultValue', diff --git a/ui/src/app/metadata/domain/provider/definition/BaseProviderDefinition.js b/ui/src/app/metadata/domain/provider/definition/BaseProviderDefinition.js index b94258159..095ed7ea4 100644 --- a/ui/src/app/metadata/domain/provider/definition/BaseProviderDefinition.js +++ b/ui/src/app/metadata/domain/provider/definition/BaseProviderDefinition.js @@ -130,7 +130,9 @@ export const HttpMetadataResolverAttributesSchema = { { title: 'label.http-security-attributes', classNames: 'bg-light border rounded px-4 pt-4 pb-3 mb-4', - size: 12, + sizes: { + xs: 12 + }, fields: [ 'disregardTLSCertificate' ] @@ -138,7 +140,9 @@ export const HttpMetadataResolverAttributesSchema = { { title: 'label.http-connection-attributes', classNames: 'bg-light border rounded px-4 pt-4 pb-3 mb-4', - size: 12, + sizes: { + xs: 12 + }, fields: [ 'connectionRequestTimeout', 'connectionTimeout', @@ -148,7 +152,9 @@ export const HttpMetadataResolverAttributesSchema = { { title: 'label.http-proxy-attributes', classNames: 'bg-light border rounded px-4 pt-4 pb-3 mb-4', - size: 12, + sizes: { + xs: 12 + }, fields: [ 'proxyHost', 'proxyPort', @@ -159,7 +165,9 @@ export const HttpMetadataResolverAttributesSchema = { { title: 'label.http-caching-attributes', classNames: 'bg-light border rounded px-4 pt-4 pb-3 mb-4', - size: 12, + sizes: { + xs: 12 + }, fields: [ 'httpCaching', 'httpCacheDirectory', @@ -169,7 +177,9 @@ export const HttpMetadataResolverAttributesSchema = { }, { classNames: 'd-none', - size: 12, + sizes: { + xs: 12 + }, fields: [ 'tlsTrustEngineRef', 'httpClientSecurityParametersRef', diff --git a/ui/src/app/metadata/domain/provider/definition/DynamicHttpMetadataProviderDefinition.js b/ui/src/app/metadata/domain/provider/definition/DynamicHttpMetadataProviderDefinition.js index 6c2952bdf..d6a8d6b34 100644 --- a/ui/src/app/metadata/domain/provider/definition/DynamicHttpMetadataProviderDefinition.js +++ b/ui/src/app/metadata/domain/provider/definition/DynamicHttpMetadataProviderDefinition.js @@ -117,7 +117,11 @@ export const DynamicHttpMetadataProviderWizard = { layout: { groups: [ { - size: 8, + sizes: { + xs: 12, + lg: 8, + xxl: 6 + }, classNames: 'bg-light border rounded px-4 pt-4 pb-3 mb-4', fields: [ 'name', @@ -125,13 +129,21 @@ export const DynamicHttpMetadataProviderWizard = { ] }, { - size: 8, + sizes: { + xs: 12, + lg: 8, + xxl: 6 + }, fields: [ 'enabled' ] }, { - size: 8, + sizes: { + xs: 12, + lg: 8, + xxl: 6 + }, fields: [ 'xmlId', 'requireValidMetadata', @@ -140,19 +152,31 @@ export const DynamicHttpMetadataProviderWizard = { ] }, { - size: 8, + sizes: { + xs: 12, + lg: 8, + xxl: 6 + }, fields: [ 'dynamicMetadataResolverAttributes' ], }, { - size: 8, + sizes: { + xs: 12, + lg: 8, + xxl: 6 + }, fields: [ 'metadataFilters' ], }, { - size: 8, + sizes: { + xs: 12, + lg: 8, + xxl: 6 + }, fields: [ 'httpMetadataResolverAttributes' ] diff --git a/ui/src/app/metadata/domain/provider/definition/ExternalMetadataProviderDefinition.js b/ui/src/app/metadata/domain/provider/definition/ExternalMetadataProviderDefinition.js index a72d3601d..ee432dcc4 100644 --- a/ui/src/app/metadata/domain/provider/definition/ExternalMetadataProviderDefinition.js +++ b/ui/src/app/metadata/domain/provider/definition/ExternalMetadataProviderDefinition.js @@ -35,7 +35,11 @@ export const ExternalMetadataProviderWizard = { layout: { groups: [ { - size: 8, + sizes: { + xs: 12, + lg: 8, + xxl: 6 + }, classNames: 'bg-light border rounded px-4 pt-4 pb-3 mb-4', fields: [ 'name', @@ -43,7 +47,11 @@ export const ExternalMetadataProviderWizard = { ] }, { - size: 8, + sizes: { + xs: 12, + lg: 8, + xxl: 6 + }, fields: [ 'xmlId', 'description', diff --git a/ui/src/app/metadata/domain/provider/definition/FileBackedHttpMetadataProviderDefinition.js b/ui/src/app/metadata/domain/provider/definition/FileBackedHttpMetadataProviderDefinition.js index e1d94ccaf..adfa2c4ad 100644 --- a/ui/src/app/metadata/domain/provider/definition/FileBackedHttpMetadataProviderDefinition.js +++ b/ui/src/app/metadata/domain/provider/definition/FileBackedHttpMetadataProviderDefinition.js @@ -75,7 +75,11 @@ export const FileBackedHttpMetadataProviderWizard = { layout: { groups: [ { - size: 8, + sizes: { + xs: 12, + lg: 8, + xxl: 6 + }, classNames: 'bg-light border rounded px-4 pt-4 pb-3 mb-4', fields: [ 'name', @@ -83,7 +87,11 @@ export const FileBackedHttpMetadataProviderWizard = { ] }, { - size: 8, + sizes: { + xs: 12, + lg: 8, + xxl: 6 + }, fields: [ 'xmlId', 'metadataURL', @@ -97,19 +105,31 @@ export const FileBackedHttpMetadataProviderWizard = { ] }, { - size: 8, + sizes: { + xs: 12, + lg: 8, + xxl: 6 + }, fields: [ 'reloadableMetadataResolverAttributes' ], }, { - size: 8, + sizes: { + xs: 12, + lg: 8, + xxl: 6 + }, fields: [ 'metadataFilters' ], }, { - size: 8, + sizes: { + xs: 12, + lg: 8, + xxl: 6 + }, fields: [ 'httpMetadataResolverAttributes' ] diff --git a/ui/src/app/metadata/domain/provider/definition/FileSystemMetadataProviderDefinition.js b/ui/src/app/metadata/domain/provider/definition/FileSystemMetadataProviderDefinition.js index 1cb158d80..98135208d 100644 --- a/ui/src/app/metadata/domain/provider/definition/FileSystemMetadataProviderDefinition.js +++ b/ui/src/app/metadata/domain/provider/definition/FileSystemMetadataProviderDefinition.js @@ -42,7 +42,11 @@ export const FileSystemMetadataProviderWizard = { layout: { groups: [ { - size: 8, + sizes: { + xs: 12, + lg: 8, + xxl: 6 + }, classNames: 'bg-light border rounded px-4 pt-4 pb-3 mb-4', fields: [ 'name', @@ -50,7 +54,11 @@ export const FileSystemMetadataProviderWizard = { ] }, { - size: 8, + sizes: { + xs: 12, + lg: 8, + xxl: 6 + }, fields: [ 'xmlId', 'metadataFile', @@ -58,7 +66,11 @@ export const FileSystemMetadataProviderWizard = { ] }, { - size: 8, + sizes: { + xs: 12, + lg: 8, + xxl: 6 + }, fields: [ 'reloadableMetadataResolverAttributes' ] diff --git a/ui/src/app/metadata/domain/provider/definition/LocalDynamicMetadataProviderDefinition.js b/ui/src/app/metadata/domain/provider/definition/LocalDynamicMetadataProviderDefinition.js index 948df7788..49a56e11f 100644 --- a/ui/src/app/metadata/domain/provider/definition/LocalDynamicMetadataProviderDefinition.js +++ b/ui/src/app/metadata/domain/provider/definition/LocalDynamicMetadataProviderDefinition.js @@ -41,7 +41,11 @@ export const LocalDynamicMetadataProviderWizard = { layout: { groups: [ { - size: 8, + sizes: { + xs: 12, + lg: 8, + xxl: 6 + }, classNames: 'bg-light border rounded px-4 pt-4 pb-3 mb-4', fields: [ 'name', @@ -49,14 +53,22 @@ export const LocalDynamicMetadataProviderWizard = { ] }, { - size: 8, + sizes: { + xs: 12, + lg: 8, + xxl: 6 + }, fields: [ 'xmlId', 'sourceDirectory' ] }, { - size: 8, + sizes: { + xs: 12, + lg: 8, + xxl: 6 + }, fields: [ 'dynamicMetadataResolverAttributes' ], diff --git a/ui/src/app/metadata/domain/source/definition/OidcSourceDefinition.js b/ui/src/app/metadata/domain/source/definition/OidcSourceDefinition.js index 11192fe18..fd32d1f5d 100644 --- a/ui/src/app/metadata/domain/source/definition/OidcSourceDefinition.js +++ b/ui/src/app/metadata/domain/source/definition/OidcSourceDefinition.js @@ -20,14 +20,19 @@ export const OidcSourceEditor = defaultsDeep({ groups: [ { classNames: 'bg-light border rounded px-4 pt-4 mb-4', - size: 6, + sizes: { + xs: 12, + lg: 6 + }, fields: [ 'protocolSupportEnum', 'nameIdFormats' ], }, { - size: 12, + sizes: { + xs: 12 + }, fields: [ 'extensions' ], @@ -93,14 +98,19 @@ export const OidcSourceWizard = defaultsDeep({ groups: [ { classNames: 'bg-light border rounded px-4 pt-4 mb-4', - size: 6, + sizes: { + xs: 12, + lg: 6 + }, fields: [ 'protocolSupportEnum', 'nameIdFormats' ], }, { - size: 12, + sizes: { + xs: 12 + }, fields: [ 'extensions' ], diff --git a/ui/src/app/metadata/domain/source/definition/SourceDefinition.js b/ui/src/app/metadata/domain/source/definition/SourceDefinition.js index 542dd83a4..beee948cc 100644 --- a/ui/src/app/metadata/domain/source/definition/SourceDefinition.js +++ b/ui/src/app/metadata/domain/source/definition/SourceDefinition.js @@ -92,7 +92,11 @@ export const SourceBase = { layout: { groups: [ { - size: 6, + sizes: { + xs: 12, + lg: 6, + xl: 6 + }, fields: [ 'protocol', 'serviceProviderName', @@ -101,49 +105,69 @@ export const SourceBase = { ] }, { - size: 6, + sizes: { + lg: 6 + }, fields: [ 'contacts' ], }, { - size: 12, + sizes: { + xs: 12 + }, fields: [ 'mdui' ], }, { - size: 12, + sizes: { + xs: 12 + }, fields: [ 'serviceProviderSsoDescriptor' ], }, { - size: 6, + sizes: { + xs: 12, + lg: 6 + }, fields: [ 'logoutEndpoints' ], }, { - size: 12, + sizes: { + xs: 12 + }, fields: [ 'securityInfo' ], }, { - size: 6, + sizes: { + xs: 12, + lg: 6 + }, fields: [ 'assertionConsumerServices' ], }, { - size: 6, + sizes: { + xs: 12, + lg: 8 + }, fields: [ 'relyingPartyOverrides' ], }, { - size: 6, + sizes: { + xs: 12, + lg: 6 + }, fields: [ 'attributeRelease' ], @@ -212,7 +236,10 @@ export const SourceBase = { layout: { groups: [ { - size: 6, + sizes: { + xs: 12, + lg: 6 + }, fields: [ 'authenticationRequestsSigned', 'wantAssertionsSigned', @@ -257,7 +284,10 @@ export const SourceBase = { layout: { groups: [ { - size: 6, + sizes: { + xs: 12, + lg: 6 + }, fields: [ "displayName", "informationUrl", @@ -265,7 +295,10 @@ export const SourceBase = { ], }, { - size: 6, + sizes: { + xs: 12, + lg: 6 + }, fields: [ "privacyStatementUrl", "logoUrl", @@ -374,62 +407,94 @@ export const SourceWizard = { layout: { groups: [ { - size: 6, + sizes: { + xs: 12, + lg: 6 + }, classNames: 'bg-light border rounded px-4 pt-4 pb-3', fields: [ 'organization', ], }, { - size: 6, + sizes: { + xs: 12, + lg: 6 + }, fields: [ 'contacts' ], }, { - size: 12, + sizes: { + xs: 12 + }, fields: [ 'mdui' ], }, { - size: 6, + sizes: { + xs: 12, + lg: 12, + xl: 8, + xxl: 6, + }, fields: [ 'serviceProviderSsoDescriptor' ], }, { - size: 6, + sizes: { + xs: 12, + lg: 6 + }, fields: [ 'logoutEndpoints' ], }, { - size: 12, + sizes: { + xs: 12 + }, fields: [ 'securityInfo' ], }, { - size: 6, + sizes: { + xs: 12, + lg: 6 + }, fields: [ 'assertionConsumerServices' ], }, { - size: 6, + sizes: { + xs: 12, + lg: 12, + xl: 8, + xxl: 6, + }, fields: [ 'relyingPartyOverrides' ], }, { - size: 6, + sizes: { + xs: 12, + lg: 6 + }, fields: [ 'attributeRelease' ], }, { - size: 6, + sizes: { + xs: 12, + lg: 6 + }, fields: [] } ]