diff --git a/CHANGELOG.md b/CHANGELOG.md index 42d29e54a..07734de65 100644 --- a/CHANGELOG.md +++ b/CHANGELOG.md @@ -1,5 +1,29 @@ # Changelog +## 1.6.0-RC5 + +### Change + +- Certificate Request Board - changed to dynamic error message as per API response +- Updated asterisk color to red in app release and service release forms +- Credential management board enhanced by filters + +### Features + +- Notifications added + - credential approval + - credential reject and + - subscription url msgs +- Technical user create overlay enhanced by role description as well as direct help link + +### Bugfix + +- Permission validation 'Credential Mgmt' page updated to 'decision_ssicredential' +- App description change - fixed page break issue in case of api response without language tag for each FE supported language +- Notification message link - 'UseCases' welcome message fixed +- handle empty customer link section in managed connectors +- Overlay fix of activation response + ## 1.6.0-RC4 ### Change diff --git a/DEPENDENCIES b/DEPENDENCIES index 12a883a7c..efdaf9c95 100644 --- a/DEPENDENCIES +++ b/DEPENDENCIES @@ -1124,7 +1124,7 @@ npm/npmjs/@babel/template/7.22.5, MIT, approved, #9017 npm/npmjs/@babel/traverse/7.22.5, MIT, approved, #8954 npm/npmjs/@babel/types/7.22.5, MIT, approved, #8967 npm/npmjs/@bcoe/v8-coverage/0.2.3, ISC AND MIT, approved, clearlydefined -npm/npmjs/@catena-x/portal-shared-components/2.0.11, Apache-2.0 AND (BSD-3-Clause AND MIT), approved, #9187 +npm/npmjs/@catena-x/portal-shared-components/2.0.14, Apache-2.0 AND (BSD-3-Clause AND MIT), approved, #9187 npm/npmjs/@csstools/normalize.css/12.0.0, CC0-1.0, approved, clearlydefined npm/npmjs/@csstools/postcss-cascade-layers/1.1.1, CC0-1.0, approved, clearlydefined npm/npmjs/@csstools/postcss-color-function/1.1.1, CC0-1.0 AND (MIT AND W3C-20150513) AND W3C-20150513 AND MIT, approved, #3022 diff --git a/package.json b/package.json index 0117a518c..4536a9923 100644 --- a/package.json +++ b/package.json @@ -1,6 +1,6 @@ { "name": "@catena-x/portal-frontend", - "version": "v1.6.0-RC4", + "version": "v1.6.0-RC5", "description": "Catena-X Portal Frontend", "author": "Catena-X Contributors", "license": "Apache-2.0", @@ -26,7 +26,7 @@ ] }, "dependencies": { - "@catena-x/portal-shared-components": "^2.0.13", + "@catena-x/portal-shared-components": "^2.0.14", "@emotion/react": "^11.11.1", "@emotion/styled": "^11.11.0", "@hookform/error-message": "^2.0.1", diff --git a/src/assets/locales/de/main.json b/src/assets/locales/de/main.json index 499c53b43..203a030d7 100644 --- a/src/assets/locales/de/main.json +++ b/src/assets/locales/de/main.json @@ -242,10 +242,13 @@ "none": "Nicht kategorisiert", "businesspartnermanagement": "Geschäftspartner Datenmanagement", "circulareconomy": "Kreislaufwirtschaft", - "quality&demandmanagement": "Bedarfs- & Qualitätsmanagement", + "qualitymanagement": "Bedarfs- & Qualitätsmanagement", "demandandcapacitymanagement": "Bedarfs- & Kapazitätsmanagement", "traceability": "Rückverfolgbarkeit", - "manufacturingasaservice": "Produzieren als Dienst" + "manufacturingasaservice": "Produzieren als Dienst", + "sustainability&co2-footprint": "Sustainability & CO2 Footprint", + "real-timecontrol": "Real Time Control", + "modularproduction ": "Modular Production" }, "noMatch": "Keine Treffer", "for": "für" @@ -539,9 +542,10 @@ "tooltipMsg": "Laden Sie das Zertifikat hoch, das die öffentlichen Schlüsselinformationen Ihres Connectors enthält." }, "subscription": { - "label": "Customer Link", + "label": "Customer Link*", "placeholder": "Select the related subscription", - "tooltipMsg": "Select the related subscription" + "tooltipMsg": "Select the related subscription", + "error": "Customer link is mandatory" } }, "create": { @@ -782,11 +786,13 @@ "technicalUserSubheadlineSuccess": "Der technische Benutzer wurde mit den folgenden Daten angelegt:", "technicalUserSubheadlineError": "Something went wrong. The technical user did not got created due to a system error. Please try it later again or contact your administrator.", "chooseUserRole": "Benutzer-Rolle für den Portalzugriff auswählen", + "help": "Help", "helperText": "Bitte geben Sie alle erforderlichen Informationen ein, bevor Sie fortfahren.", "roleDesc": "Role Description Details", "technicalUser": { "addOverlay": { - "service": "Dienst", + "service": "Technical User Role", + "serviceSubHeading": "Select one service roles:", "username": "Username", "description": "Beschreibung", "spocHeadline": "Single Point of Contact (SPoC)", @@ -1003,14 +1009,14 @@ "technicalIntegration": { "headerTitle": "Technical Integration", "headerDescription": "Lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem Ipsum has been the industry's standard .Lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem Ipsum has been the industry's standard .", - "step1Header": "1. User Role Upload *", + "step1Header": "1. User Role Upload", "step1HeaderDescription": "[copy] Lorem ipsum sapientem ne neque dolor erat,eros solet invidunt duo Quisque aliquid leo. Pretium patrioque sociis eu nihil Cum enim ad, ipsum alii vidisse justo id. Option porttitor diam voluptua. Cu Eam augue dolor dolores quis,", "clientID": "Client ID", "URL": "URL", "pleaseEnterValidURL": "Please enter a valid URL", "URLPlaceholder": "http://www.loremipsum.de", "clientCreated": "Client created", - "step2Header": "2. Technical User Setup *", + "step2Header": "2. Technical User Setup", "step2HeaderDescription": "[copy] Lorem ipsum sapientem ne neque dolor erat,eros solet invidunt duo Quisque aliquid leo. Pretium patrioque sociis eu nihil Cum enim ad, ipsum alii vidisse justo id. Option porttitor diam voluptua. Cu Eam augue dolor dolores quis,", "uploadRolesDescription": "Upload all app roles by using the available upload template (csv) file added attached", "rolesPreview": "Preview of Roles uploaded", @@ -1491,7 +1497,7 @@ }, "adminCertificate": { "headline": "Credential Request Overview", - "search": "Suchen via Zertifikatstyp", + "search": "Suchen via Name der Firma", "tabs": { "all": "Alle", "open": "Offen", @@ -1536,7 +1542,7 @@ "uploadDocumentTitle": "Please upload your certificate proof:", "note": "Please upload only pdf files with maximum 1 MB.", "descriptionLabel": "Description for verification", - "error": "Something went wrong!", + "error": "Something went wrong. ", "success": "Certificate uploaded successfully." }, "successCertificate": { diff --git a/src/assets/locales/de/notification.json b/src/assets/locales/de/notification.json index 16e6df352..71563f1b2 100644 --- a/src/assets/locales/de/notification.json +++ b/src/assets/locales/de/notification.json @@ -87,13 +87,25 @@ "title": "Assigned User Roles Updated - {{app}}", "content": "Hallo {{username}}, \n\nIhre App-Benutzerrollen wurden von Ihrem Unternehmensadministrator aktualisiert. Mit dem Wechsel der Rolle ändern sich Ihre Zugriffsrechte. Weitere Einzelheiten zu den Rollenänderungen finden sie anbei. \n\nHinzugefügte Rollen: {{addedRoles}} \n\nEntfernte Rollen: {{removedRoles}}" }, + "CREDENTIAL_APPROVAL": { + "title": "Verified Credential {{credentialType}} angelegt", + "content": "Verified Credential {{credentialType}} wurde ihrem Company Wallet hinzugefügt." + }, + "CREDENTIAL_REJECTED": { + "title": "Verified Credential {{credentialType}} abgelehnt", + "content": "Verified Credential {{credentialType}} wurde abgelehnt. Sie können jederzeit die Anfrage wiederholen." + }, + "SUBSCRIPTION_URL_UPDATE": { + "title": "App URL {{app}} updated", + "content": "Der App Provider hat die hinterlegte App Instance URL für ihre abonnierte App {{app}} geändert.\n\nNeue URL: {{newUrl}}" + }, "link": { "appmarketplace": "Zum App Marketplace", "technicalsetup": "Zur Connector Registrierung", "home": "Zur Startseite", "app": "Zur App", "user": "Zum Benutzer", - "usecases": "Zu den Use Cases", + "usecase": "Zu den Use Case", "serviceprovider": "Go to service provider", "appmanagementboard": "App Management Board öffnen", "servicemanagementboard": "Service Management Board öffnen", diff --git a/src/assets/locales/de/servicerelease.json b/src/assets/locales/de/servicerelease.json index ec1eeaebe..771983c70 100644 --- a/src/assets/locales/de/servicerelease.json +++ b/src/assets/locales/de/servicerelease.json @@ -26,18 +26,18 @@ "step1": { "headerTitle": "Service Card Erstellen", "headerDescription": "Die folgenden Eingabefelder und Uploads werden verwendet, um Ihre Service-'Service Card' zu erstellen, die auf dem Marktplatz platziert wird. Die Servicekarte ist der erste Berührungspunkt mit dem Kunden.", - "serviceName": "Service Name*", - "serviceType": "Service Type*", + "serviceName": "Service Name", + "serviceType": "Service Type", "serviceTypePlaceholder": "Wählen Sie den Servicetyp aus", - "shortDescriptionEN": "Kurzbeschreibung (en)*", - "shortDescriptionDE": "Kurzbeschreibung (de)*", + "shortDescriptionEN": "Kurzbeschreibung (en)", + "shortDescriptionDE": "Kurzbeschreibung (de)", "serviceLeadImageUpload": "Service Card Bild" }, "step2": { "headerTitle": "Service Details", "headerDescription": "Lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem Ipsum has been the industry's standard .Lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem Ipsum has been the industry's standard .", - "longDescriptionEN": "Service Beschreibung (en)*", - "longDescriptionDE": "Service Beschreibung (de)*", + "longDescriptionEN": "Service Beschreibung (en)", + "longDescriptionDE": "Service Beschreibung (de)", "doc": "Supporting Material", "note": "Info:", "providerDetails": "Provider Details", @@ -209,13 +209,16 @@ "longDescriptionTitleEN": "Description - English", "longDescriptionTitleDE": "Description - German", "backToBoard": "Back to Admin Board", + "noDocumentsAvailable": "No documents available", "documents": { "heading": "Documents", "message": "In the following section additional documents/information are shared by the app provider. Click on the document name to download them. " }, "provider": { "heading": "Provider Information", - "message": "If you have any question, want to get in contact or visit the provider website, you can find all necessary information below." + "message": "If you have any question, want to get in contact or visit the provider website, you can find all necessary information below.", + "homepage": "Homepage", + "email": "E-Mail" }, "technicalUserSetup": { "heading": "Technical User Setup", diff --git a/src/assets/locales/en/main.json b/src/assets/locales/en/main.json index 1b0c8745f..1d1a383d2 100644 --- a/src/assets/locales/en/main.json +++ b/src/assets/locales/en/main.json @@ -241,10 +241,13 @@ "none": "Not categorized", "businesspartnermanagement": "Business Partner Data Management", "circulareconomy": "Circular Economy", - "quality&demandmanagement": "Demand & Quality Management", + "qualitymanagement": "Demand & Quality Management", "demandandcapacitymanagement": "Demand & Capacity Management", "traceability": "Traceability", - "manufacturingasaservice": "Manufacturing as a Service" + "manufacturingasaservice": "Manufacturing as a Service", + "sustainability&co2-footprint": "Sustainability & CO2 Footprint", + "real-timecontrol": "Real Time Control", + "modularproduction ": "Modular Production" }, "noMatch": "No Matches", "for": "for" @@ -538,9 +541,10 @@ "tooltipMsg": "Upload the certificate that contains your connector's public key information." }, "subscription": { - "label": "Customer Link", + "label": "Customer Link*", "placeholder": "Select the related subscription", - "tooltipMsg": "Select the related subscription" + "tooltipMsg": "Select the related subscription", + "error": "Customer link is mandatory" } }, "create": { @@ -780,11 +784,13 @@ "technicalUserSubheadlineSuccess": "Congratulations, the technical user got successfully created. Below you can find all the relevant details needed to apply the technical user for your service connection. Please ensure that you keep this secrets confidential.", "technicalUserSubheadlineError": "Something went wrong. The technical user did not got created due to a system error. Please try it later again or contact your administrator.", "chooseUserRole": "Select CX Portal User Role", + "help": "Help", "helperText": "Please enter all required information before proceeding.", "roleDesc": "Role Description Details", "technicalUser": { "addOverlay": { - "service": "Service", + "service": "Technical User Role", + "serviceSubHeading": "Select one service roles:", "username": "Username", "description": "Description", "spocHeadline": "Single Point of Contact (SPoC)", @@ -928,7 +934,7 @@ "salesManager": "Sales Manager", "salesManagerPlaceholder": "Please select a Sales Manager", "salesManagerDescription": "Please select the app sales manager via the dropdown below. The sales manager can only get set if a user of your company has the respective portal role. The sales manager will get informed as soon as a app subscribtion request is triggered by the customer.", - "pricingInformation": "Pricing Information (e.g. free / charged ( to be defined)", + "pricingInformation": "Pricing Information (e.g. free / charged (to be defined))", "appLeadImageUpload": "App Lead Image Upload" }, "appPage": { @@ -965,14 +971,14 @@ "technicalIntegration": { "headerTitle": "Technical Integration", "headerDescription": "Lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem Ipsum has been the industry's standard .Lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem Ipsum has been the industry's standard .", - "step1Header": "1. User Role Upload *", + "step1Header": "1. User Role Upload", "step1HeaderDescription": "[copy] Lorem ipsum sapientem ne neque dolor erat,eros solet invidunt duo Quisque aliquid leo. Pretium patrioque sociis eu nihil Cum enim ad, ipsum alii vidisse justo id. Option porttitor diam voluptua. Cu Eam augue dolor dolores quis,", "clientID": "Client ID", "URL": "URL", "pleaseEnterValidURL": "Please enter a valid URL", "URLPlaceholder": "http://www.loremipsum.de", "clientCreated": "Client created", - "step2Header": "2. Technical User Setup *", + "step2Header": "2. Technical User Setup", "step2HeaderDescription": "[copy] Lorem ipsum sapientem ne neque dolor erat,eros solet invidunt duo Quisque aliquid leo. Pretium patrioque sociis eu nihil Cum enim ad, ipsum alii vidisse justo id. Option porttitor diam voluptua. Cu Eam augue dolor dolores quis,", "uploadRolesDescription": "Upload all app roles by using the available upload template (csv) file added attached", "rolesPreview": "Preview of Roles uploaded", @@ -1475,7 +1481,7 @@ "uploadDocumentTitle": "Please upload your certificate proof:", "note": "Please upload only pdf files with maximum 1 MB.", "descriptionLabel": "Description for verification", - "error": "Something went wrong!", + "error": "Something went wrong. ", "success": "Certificate uploaded successfully." }, "successCertificate": { @@ -1497,7 +1503,7 @@ }, "adminCertificate": { "headline": "Credential Request Overview", - "search": "...search for certificate type", + "search": "...search for Company Name", "tabs": { "all": "All", "open": "Open", diff --git a/src/assets/locales/en/notification.json b/src/assets/locales/en/notification.json index 6313e9791..6698fc55c 100644 --- a/src/assets/locales/en/notification.json +++ b/src/assets/locales/en/notification.json @@ -83,13 +83,25 @@ "title": "Assigned User Roles Updated - {{app}}", "content": "Hallo {{username}}, \n\nyour app user roles got updated by your company administrator. With the change of the role assignment your access rights have changed. You can find all details regarding the role change below. \n\nNew Roles: {{addedRoles}} \n\nRemoved Roles: {{removedRoles}}" }, + "CREDENTIAL_APPROVAL": { + "title": "Verified Credential {{credentialType}} assigned", + "content": "Verified Credential {{credentialType}} got assigned to your company wallet." + }, + "CREDENTIAL_REJECTED": { + "title": "Verified Credential {{credentialType}} declined", + "content": "Verified Credential {{credentialType}} got declined. You can start a new request immediately." + }, + "SUBSCRIPTION_URL_UPDATE": { + "title": "App URL {{app}} updated", + "content": "The app provider has changed the stored App Instance URL for your subscribed app {{app}}.\n\nNew URL: {{newUrl}}" + }, "link": { "appmarketplace": "Go to app marketplace", "technicalsetup": "Go to connector configuration", "home": "Go to home page", "app": "Go to app", "user": "Go to user", - "usecases": "Go to use cases", + "usecase": "Go to Use Case", "serviceprovider": "Go to service provider", "appmanagementboard": "Get there", "servicemanagementboard": "Get there", diff --git a/src/assets/locales/en/servicerelease.json b/src/assets/locales/en/servicerelease.json index 6d0562dac..2e8ca2897 100644 --- a/src/assets/locales/en/servicerelease.json +++ b/src/assets/locales/en/servicerelease.json @@ -26,18 +26,18 @@ "step1": { "headerTitle": "Create Service", "headerDescription": "The following input fields and uploads are used to create your service 'Service Card' which will be placed inside the marketplace. The service card is the first touchpoint with the customer.", - "serviceName": "Service Name*", - "serviceType": "Service Type*", + "serviceName": "Service Name", + "serviceType": "Service Type", "serviceTypePlaceholder": "Select a Service Type Id", - "shortDescriptionEN": "Short Description (en)*", - "shortDescriptionDE": "Short Description (de)*", + "shortDescriptionEN": "Short Description (en)", + "shortDescriptionDE": "Short Description (de)", "serviceLeadImageUpload": "Service Card Image" }, "step2": { "headerTitle": "Service Details", "headerDescription": "Lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem Ipsum has been the industry's standard .Lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem Ipsum has been the industry's standard .", - "longDescriptionEN": "Long Description (en)*", - "longDescriptionDE": "Long Description (de)*", + "longDescriptionEN": "Long Description (en)", + "longDescriptionDE": "Long Description (de)", "doc": "Supporting Material", "note": "Note:", "providerDetails": "Provider Details", @@ -209,13 +209,16 @@ "longDescriptionTitleEN": "Description - English", "longDescriptionTitleDE": "Description - German", "backToBoard": "Back to Admin Board", + "noDocumentsAvailable": "No documents available", "documents": { "heading": "Documents", "message": "In the following section additional documents/information are shared by the app provider. Click on the document name to download them. " }, "provider": { "heading": "Provider Information", - "message": "If you have any question, want to get in contact or visit the provider website, you can find all necessary information below." + "message": "If you have any question, want to get in contact or visit the provider website, you can find all necessary information below.", + "homepage": "Homepage", + "email": "E-Mail" }, "technicalUserSetup": { "heading": "Technical User Setup", diff --git a/src/components/overlays/AddTechnicalUser/TechnicalUserAddForm.scss b/src/components/overlays/AddTechnicalUser/TechnicalUserAddForm.scss index b0452830c..0df6c7242 100644 --- a/src/components/overlays/AddTechnicalUser/TechnicalUserAddForm.scss +++ b/src/components/overlays/AddTechnicalUser/TechnicalUserAddForm.scss @@ -17,7 +17,27 @@ * * SPDX-License-Identifier: Apache-2.0 ********************************************************************************/ - .form-input { padding: 0; } + +.helpText { + display: flex; + color: #0d55af !important; + margin-top: 30px !important; + text-decoration: none; + margin-bottom: 20px !important; + + svg { + font-size: 20px; + } +} + +.technicalUserForm { + display: grid; + + .roleDescription { + line-height: 0; + margin: 5px 27px 20px; + } +} diff --git a/src/components/overlays/AddTechnicalUser/TechnicalUserAddForm.tsx b/src/components/overlays/AddTechnicalUser/TechnicalUserAddForm.tsx index 09fd495bf..1b885a881 100644 --- a/src/components/overlays/AddTechnicalUser/TechnicalUserAddForm.tsx +++ b/src/components/overlays/AddTechnicalUser/TechnicalUserAddForm.tsx @@ -18,16 +18,16 @@ * SPDX-License-Identifier: Apache-2.0 ********************************************************************************/ +import { useState } from 'react' import Box from '@mui/material/Box' import { useTranslation } from 'react-i18next' import InputLabel from '@mui/material/InputLabel' import { Controller } from 'react-hook-form' -import Select from '@mui/material/Select' -import MenuItem from '@mui/material/MenuItem' import FormHelperText from '@mui/material/FormHelperText' import TextField from '@mui/material/TextField' import InputAdornment from '@mui/material/InputAdornment' import ErrorOutlineOutlinedIcon from '@mui/icons-material/ErrorOutlineOutlined' +import { Radio, Typography } from '@catena-x/portal-shared-components' import { ServiceAccountRole, useFetchServiceAccountRolesQuery, @@ -48,36 +48,44 @@ const TechnicalUserAddFormSelect = ({ }: any) => { const { t } = useTranslation() const roles = useFetchServiceAccountRolesQuery().data + const [selectedValue, setSelectedValue] = useState() return ( ( - <> - - {t('content.addUser.technicalUser.addOverlay.service')} - - + {t('content.addUser.technicalUser.addOverlay.service')} + + + {t('content.addUser.technicalUser.addOverlay.serviceSubHeading')} + + {roles?.map((role: ServiceAccountRole) => ( + <> + { + setSelectedValue(event.target.value) + trigger(name) + onChange(event) + }} + size="small" + sx={{ + display: 'flex', + }} + /> + + {role.roleDescription ?? '-'} + + + ))} {!!errors[name] && ( )} - + )} name={name} control={control} @@ -109,7 +117,10 @@ const TechnicalUserAddFormTextfield = ({ ( <> - + {label} { const { t } = useTranslation() @@ -53,7 +54,6 @@ export const AddTechnicalUser = () => { const [addServiceAccount] = useAddServiceAccountMutation() const [loading, setLoading] = useState(false) - const { data } = useFetchOwnUserDetailsQuery() const handleConfirm = async (formValues: DefaultFormFieldValuesType) => { setLoading(true) @@ -77,24 +77,6 @@ export const AddTechnicalUser = () => { //openAddTechnicalUserResponseOverlay() } - const userDetailsData = { - cardCategory: t('content.addUser.technicalUser.addOverlay.spocHeadline'), - cardContentItems: { - organizsationName: { - label: t('content.addUser.technicalUser.addOverlay.org'), - value: data ? data.company : '', - }, - username: { - label: t('content.addUser.technicalUser.addOverlay.name'), - value: data ? `${data.firstName} ${data.lastName}` : '', - }, - eMailAddress: { - label: t('content.addUser.technicalUser.addOverlay.email'), - value: data ? data.email : '', - }, - }, - } - const defaultFormFieldValues = { TechnicalUserName: '', TechnicalUserService: 'none', @@ -186,15 +168,18 @@ export const AddTechnicalUser = () => { onCloseWithIcon={handleDispatch} /> + + + + {t('content.addUser.help')} + + - - - + + ) + ) + } + const renderDocuments = () => { - return type === DocumentTypeText.CONFORMITY_DOCUMENT - ? documents[DocumentTypeText.CONFORMITY_APPROVAL_BUSINESS_APPS].map( - (document: DocumentData) => ( -
  • - + return documents.hasOwnProperty(DocumentTypeId.ADDITIONAL_DETAILS) || + documents.hasOwnProperty( + DocumentTypeId.APP_TECHNICAL_INFORMATION || + documents.hasOwnProperty(DocumentTypeId.APP_CONTRACT) + ) ? ( + Object.keys(documents).map( + (document) => + (document === DocumentTypeId.APP_CONTRACT || + document === DocumentTypeId.ADDITIONAL_DETAILS || + document === DocumentTypeId.APP_TECHNICAL_INFORMATION) && ( +
  • +
    • ) - ) - : Object.keys(documents).map( - (document) => - document !== DocumentTypeText.CONFORMITY_APPROVAL_BUSINESS_APPS && ( -
  • - - -
    • - ) - ) + ) + ) : ( + + {t('global.errors.noDocumentsAvailable')} + + ) } return ( -
    - + <> + {t(`content.adminboardDetail.${type}.heading`)} - + {t(`content.adminboardDetail.${type}.message`)} -
      - {checkDocumentExist ? ( - renderDocuments() - ) : ( - - {t('global.errors.noDocumentsAvailable')} - - )} -
    -
    + {type === DocumentTypeText.CONFORMITY_DOCUMENT + ? renderConformityDocument() + : renderDocuments()} + ) } diff --git a/src/components/pages/AdminBoardDetail/components/BoardHeader/BoardHeader.scss b/src/components/pages/AdminBoardDetail/components/BoardHeader/BoardHeader.scss index 87fd3b66f..1541e2c1d 100644 --- a/src/components/pages/AdminBoardDetail/components/BoardHeader/BoardHeader.scss +++ b/src/components/pages/AdminBoardDetail/components/BoardHeader/BoardHeader.scss @@ -19,7 +19,7 @@ ********************************************************************************/ .adminboard-header { - margin: 30px -15px 94px -15px; + margin: 30px -15px 0px -15px; display: -ms-flexbox; display: flex; -ms-flex-wrap: wrap; @@ -47,33 +47,6 @@ line-height: 24px; color: #888888; } - .heading { - margin: 0 0 10px 0; - color: #111111; - } - ul { - display: flex; - align-items: center; - margin: 0 0 10px 0; - padding: 0; - } - .usecase, - .language, - .price { - display: flex; - align-items: center; - flex: 1; - flex-wrap: wrap; - margin: 0 0 10px 0; - font-weight: 400; - font-size: 16px; - line-height: 24px; - color: #888888; - .head { - margin-right: 5px; - font-size: 16px; - } - } .subscribed-success-btn { pointer-events: none; } diff --git a/src/components/pages/AdminBoardDetail/components/BoardHeader/index.tsx b/src/components/pages/AdminBoardDetail/components/BoardHeader/index.tsx index 1e3eff191..ea2e5349b 100644 --- a/src/components/pages/AdminBoardDetail/components/BoardHeader/index.tsx +++ b/src/components/pages/AdminBoardDetail/components/BoardHeader/index.tsx @@ -25,7 +25,13 @@ import { AppDetails } from 'features/apps/details/types' import { useFetchDocumentByIdMutation } from 'features/apps/apiSlice' import CommonService from 'services/CommonService' import './BoardHeader.scss' +import { Grid } from '@mui/material' +enum CardDetails { + LANGUAGE = 'language', + USECASE = 'useCase', + PRICE = 'price', +} export interface AppDetailHeaderProps { item: AppDetails } @@ -56,38 +62,36 @@ export default function BoardHeader({ item }: AppDetailHeaderProps) { } } + const getAppData = (field: string) => { + if (field === CardDetails.LANGUAGE) return item?.languages.join(', ') + else if (field === CardDetails.USECASE) return item?.useCases.join(', ') + else if (field === CardDetails.PRICE) return item?.price + } + return (
    {item.title}
    - + {item.provider} - + {item.title} -
    - - {t('content.adminboardDetail.language')}:{' '} - - {item.languages?.map((lang, index) => ( - {(index ? ', ' : '') + lang} - ))} -
    -
    - - {t('content.adminboardDetail.usecase')}:{' '} - - {item.useCases?.map((useCase) => useCase).join(', ')} -
    -
    - - {t('content.adminboardDetail.price')}:{' '} - - {item.price} -
    + + {[CardDetails.LANGUAGE, CardDetails.USECASE, CardDetails.PRICE].map( + (field) => ( +
    + + {t(`content.apprelease.validateAndPublish.${field}`)} + {getAppData(field)} + +
    + ) + )} +
    ) diff --git a/src/components/pages/AdminBoardDetail/components/BoardImageGallery/BoardImageGallery.scss b/src/components/pages/AdminBoardDetail/components/BoardImageGallery/BoardImageGallery.scss deleted file mode 100644 index 43dcfadbb..000000000 --- a/src/components/pages/AdminBoardDetail/components/BoardImageGallery/BoardImageGallery.scss +++ /dev/null @@ -1,32 +0,0 @@ -/******************************************************************************** - * Copyright (c) 2021,2022 BMW Group AG - * Copyright (c) 2021,2022 Contributors to the Eclipse Foundation - * - * See the NOTICE file(s) distributed with this work for additional - * information regarding copyright ownership. - * - * This program and the accompanying materials are made available under the - * terms of the Apache License, Version 2.0 which is available at - * https://www.apache.org/licenses/LICENSE-2.0. - * - * Unless required by applicable law or agreed to in writing, software - * distributed under the License is distributed on an "AS IS" BASIS, WITHOUT - * WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. See the - * License for the specific language governing permissions and limitations - * under the License. - * - * SPDX-License-Identifier: Apache-2.0 - ********************************************************************************/ - -.adminboard-gallery { - margin-bottom: 93px; - .img-col { - height: 100%; - img { - height: 60%; - width: 100%; - object-fit: cover; - border-radius: 10px; - } - } -} diff --git a/src/components/pages/AdminBoardDetail/components/BoardImageGallery/index.tsx b/src/components/pages/AdminBoardDetail/components/BoardImageGallery/index.tsx deleted file mode 100644 index 9719b2175..000000000 --- a/src/components/pages/AdminBoardDetail/components/BoardImageGallery/index.tsx +++ /dev/null @@ -1,44 +0,0 @@ -/******************************************************************************** - * Copyright (c) 2021,2022 BMW Group AG - * Copyright (c) 2021,2022 Contributors to the Eclipse Foundation - * - * See the NOTICE file(s) distributed with this work for additional - * information regarding copyright ownership. - * - * This program and the accompanying materials are made available under the - * terms of the Apache License, Version 2.0 which is available at - * https://www.apache.org/licenses/LICENSE-2.0. - * - * Unless required by applicable law or agreed to in writing, software - * distributed under the License is distributed on an "AS IS" BASIS, WITHOUT - * WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. See the - * License for the specific language governing permissions and limitations - * under the License. - * - * SPDX-License-Identifier: Apache-2.0 - ********************************************************************************/ - -import './BoardImageGallery.scss' -import { Carousel, ImageType } from '@catena-x/portal-shared-components' - -export default function BoardImageGallery({ images }: { images: ImageType[] }) { - return ( -
    - - {images?.map((image) => ( -
    - {image.text} -
    - ))} -     -
    - ) -} diff --git a/src/components/pages/AdminBoardDetail/components/BoardPrivacy/BoardPrivacy.scss b/src/components/pages/AdminBoardDetail/components/BoardPrivacy/BoardPrivacy.scss index f86c28a44..3755db273 100644 --- a/src/components/pages/AdminBoardDetail/components/BoardPrivacy/BoardPrivacy.scss +++ b/src/components/pages/AdminBoardDetail/components/BoardPrivacy/BoardPrivacy.scss @@ -19,14 +19,16 @@ ********************************************************************************/ .board-privacy { - margin-bottom: 93px; .privacy-content { - margin-bottom: 30px; + margin-bottom: 32px; + } + .app-policies { + padding: 0 20px; } .policies-list { display: flex; flex-wrap: wrap; - max-width: 800px; + max-width: none; margin: 0 auto; .policy-name { width: 50%; @@ -39,13 +41,4 @@ margin-right: 5px; } } - .table-text { - max-width: 850px; - font-weight: 600; - text-align: center; - background-color: #ecf0f4; - padding: 2px; - border-radius: 5px; - margin: 0 auto; - } } diff --git a/src/components/pages/AdminBoardDetail/components/BoardPrivacy/index.tsx b/src/components/pages/AdminBoardDetail/components/BoardPrivacy/index.tsx index f21630562..90c0a43b3 100644 --- a/src/components/pages/AdminBoardDetail/components/BoardPrivacy/index.tsx +++ b/src/components/pages/AdminBoardDetail/components/BoardPrivacy/index.tsx @@ -51,11 +51,11 @@ export default function BoardPrivacy({ item }: { item: AppDetails }) { return (
    - {t('heading')} + {t('heading')} {t('message')}
    {item.privacyPolicies && item.privacyPolicies.length ? ( -
    +
    {item.privacyPolicies.map((policy: PrivacyPolicyType) => ( ) : ( - + {t('notSupportedMessage')} )} diff --git a/src/components/pages/AdminBoardDetail/components/BoardProvider/BoardProvider.scss b/src/components/pages/AdminBoardDetail/components/BoardProvider/BoardProvider.scss index 84d721879..8f2460ffa 100644 --- a/src/components/pages/AdminBoardDetail/components/BoardProvider/BoardProvider.scss +++ b/src/components/pages/AdminBoardDetail/components/BoardProvider/BoardProvider.scss @@ -20,7 +20,7 @@ .adminboard-provider { margin-bottom: 56px; - padding-bottom: 92px; + padding-bottom: 80px; border-bottom: 1px solid #dcdcdc; .provider-content { margin-bottom: 30px; diff --git a/src/components/pages/AdminBoardDetail/components/BoardProvider/index.tsx b/src/components/pages/AdminBoardDetail/components/BoardProvider/index.tsx index 10cff0e6d..24e7308a4 100644 --- a/src/components/pages/AdminBoardDetail/components/BoardProvider/index.tsx +++ b/src/components/pages/AdminBoardDetail/components/BoardProvider/index.tsx @@ -26,6 +26,7 @@ import { } from '@catena-x/portal-shared-components' import { AppDetails } from 'features/apps/apiSlice' import './BoardProvider.scss' +import { Box } from '@mui/material' export default function BoardProvider({ item }: { item: AppDetails }) { const { t } = useTranslation('', { @@ -44,10 +45,10 @@ export default function BoardProvider({ item }: { item: AppDetails }) { return (
    -
    - {t('heading')} + + {t('heading')} {t('message')} -
    +
    ) diff --git a/src/components/pages/AdminBoardDetail/components/BoardRoles/index.tsx b/src/components/pages/AdminBoardDetail/components/BoardRoles/index.tsx index 5edcbb05a..b2ef0840d 100644 --- a/src/components/pages/AdminBoardDetail/components/BoardRoles/index.tsx +++ b/src/components/pages/AdminBoardDetail/components/BoardRoles/index.tsx @@ -25,27 +25,36 @@ import { uniqueId } from 'lodash' import { AppDetails } from 'features/apps/apiSlice' export default function BoardRoles({ item }: { item: AppDetails }) { - const { t } = useTranslation('', { - keyPrefix: 'content.adminboardDetail.roles', - }) - + const { t } = useTranslation() return ( -
    - {t('heading')} - {t('message')} - - <> - {item.roles && - item.roles.map((role: string) => ( - - {role} - - {t('roleDescription')} - - - ))} - - -
    + <> + + {t('content.adminboardDetail.roles.heading')} + + + {t('content.adminboardDetail.roles.message')} + + {item.roles && item.roles.length > 0 ? ( + + {item.roles?.map((role) => ( + + {role} + + {t('content.adminboardDetail.roles.roleDescription')} + + + ))} + + ) : ( + + {t('global.errors.noRolesAvailable')} + + )} + ) } diff --git a/src/components/pages/AdminBoardDetail/components/BoardTechnicalUserSetup/index.tsx b/src/components/pages/AdminBoardDetail/components/BoardTechnicalUserSetup/index.tsx index 710de0988..9c2223f09 100644 --- a/src/components/pages/AdminBoardDetail/components/BoardTechnicalUserSetup/index.tsx +++ b/src/components/pages/AdminBoardDetail/components/BoardTechnicalUserSetup/index.tsx @@ -30,34 +30,34 @@ export default function BoardTechnicalUserSetup({ }) { const { t } = useTranslation() - const getTechUserData = (data: string[] | null) => { + const getTechnicalUserData = (data: string[] | null) => { return data && data?.length > 0 ? ( data?.map((role: string) => ( - - * {role} - + + + * {role} + + )) ) : ( - - {t('global.errors.noTechnicalUserProfilesAvailable')} - + + + {t('global.errors.noTechnicalUserProfilesAvailable')} + + ) } return ( -
    - + <> + {t('content.adminboardDetail.technicalUserSetup.heading')} - + {t('content.adminboardDetail.technicalUserSetup.message')} - - - {item.technicalUserProfile && - getTechUserData(Object.values(item?.technicalUserProfile)[0])} - - -
    + {item.technicalUserProfile && + getTechnicalUserData(Object.values(item?.technicalUserProfile)[0])} + ) } diff --git a/src/components/pages/AdminCredential/AdminCredentialElements.tsx b/src/components/pages/AdminCredential/AdminCredentialElements.tsx index 27361b993..533dd2d0c 100644 --- a/src/components/pages/AdminCredential/AdminCredentialElements.tsx +++ b/src/components/pages/AdminCredential/AdminCredentialElements.tsx @@ -17,7 +17,7 @@ * * SPDX-License-Identifier: Apache-2.0 ********************************************************************************/ -import { useState } from 'react' +import { useEffect, useState } from 'react' import { useTranslation } from 'react-i18next' import { Button } from '@mui/material' import ArticleOutlinedIcon from '@mui/icons-material/ArticleOutlined' @@ -28,19 +28,15 @@ import { CredentialResponse, useApproveCredentialMutation, useDeclineCredentialMutation, - useFetchCredentialsQuery, + useFetchCredentialsSearchQuery, } from 'features/certification/certificationApiSlice' import { download } from 'utils/downloadUtils' import { useFetchNewDocumentByIdMutation } from 'features/appManagement/apiSlice' import { error, success } from 'services/NotifyService' import { uniqueId } from 'lodash' import { SubscriptionStatus } from 'features/apps/apiSlice' - -export interface DummyData { - date: string - companyInfo: string - certificate: string -} +import { setSearchInput } from 'features/appManagement/actions' +import { useDispatch } from 'react-redux' enum FilterType { ALL = 'all', @@ -56,10 +52,14 @@ enum StatusType { export default function AdminCredentialElements() { const { t } = useTranslation() + const dispatch = useDispatch() - const [group, setGroup] = useState(FilterType.ALL) - const [expr, setExpr] = useState('') const [refresh, setRefresh] = useState(0) + const [group, setGroup] = useState(FilterType.ALL) + const [searchExpr, setSearchExpr] = useState('') + const [filterStatus, setFilterStatus] = useState() + const [filterValueAPI, setFilterValueAPI] = useState('') + const [fetchHookArgs, setFetchHookArgs] = useState({}) const [getDocumentById] = useFetchNewDocumentByIdMutation() const [approveCredential] = useApproveCredentialMutation() @@ -67,7 +67,30 @@ export default function AdminCredentialElements() { const setView = (e: React.MouseEvent) => { const viewValue = e.currentTarget.value + if (viewValue === FilterType.OPEN) + setFilterValueAPI(SubscriptionStatus.PENDING) + if (viewValue === FilterType.CONFIRMED) + setFilterValueAPI(SubscriptionStatus.ACTIVE) + if (viewValue === FilterType.DECLINED) + setFilterValueAPI(SubscriptionStatus.INACTIVE) + setFilterStatus(viewValue) setGroup(viewValue) + setRefresh(Date.now()) + } + + useEffect(() => { + if (onValidate(searchExpr)) { + setFetchHookArgs({ + filterType: filterValueAPI, + expr: searchExpr, + }) + } + }, [filterStatus, searchExpr]) + + const onValidate = (expr: string) => { + const validateExpr = /^[ A-Za-z0-9]{1,1000}$/.test(expr) + if (validateExpr) dispatch(setSearchInput({ open: true, text: expr })) + return validateExpr } const handleDownloadClick = async ( @@ -207,22 +230,23 @@ export default function AdminCredentialElements() { return (
    + searchExpr={searchExpr} alignCell="start" toolbarVariant={'searchAndFilter'} hasBorder={false} columnHeadersBackgroundColor={'transparent'} - searchExpr={expr} searchPlaceholder={t('content.adminCertificate.search')} + //searchInputData={searchInputData} onSearch={(expr: string) => { - if (expr !== '') return + if (!onValidate(expr)) return setRefresh(Date.now()) - setExpr(expr) + setSearchExpr(expr) }} searchDebounce={1000} title="" loadLabel={t('global.actions.more')} - fetchHook={useFetchCredentialsQuery} - fetchHookArgs={{ expr }} + fetchHook={useFetchCredentialsSearchQuery} + fetchHookArgs={fetchHookArgs} fetchHookRefresh={refresh} getRowId={(row: { [key: string]: string }) => uniqueId(row.companyId)} columns={columns} diff --git a/src/components/pages/AppDetail/AppDetail.scss b/src/components/pages/AppDetail/AppDetail.scss index c2e53b9c1..8301b3f6d 100644 --- a/src/components/pages/AppDetail/AppDetail.scss +++ b/src/components/pages/AppDetail/AppDetail.scss @@ -33,18 +33,6 @@ html { } } -.appdetail-main-bg { - background: #f9f9f9; - padding-bottom: 30px; - - .appdetail-back { - width: 100%; - padding: 30px 15px; - margin: 0 auto; - max-width: 1100px; - } -} - .appdetail-main { width: 100%; margin: 0 auto; @@ -63,12 +51,16 @@ html { padding-right: 30px; } } +} - .product-description { - padding-top: 85px; +.divider-height { + height: 60px; +} - p { - margin-bottom: 12px; - } +.app-marketplace-main { + min-width: 1440px; + .app-back { + height: 140px; + padding: 48px 256px 48px 160px; } } diff --git a/src/components/pages/AppDetail/AppDetailContentDetails.tsx b/src/components/pages/AppDetail/AppDetailContentDetails.tsx index f3426ecfa..0c83fad02 100644 --- a/src/components/pages/AppDetail/AppDetailContentDetails.tsx +++ b/src/components/pages/AppDetail/AppDetailContentDetails.tsx @@ -22,11 +22,11 @@ import { useEffect, useState } from 'react' import { Typography, Navigation, + ImageGallery, Button, } from '@catena-x/portal-shared-components' import { useTranslation } from 'react-i18next' import AppDetailHeader from './components/AppDetailHeader' -import AppDetailImageGallery from './components/AppDetailImageGallery' import AppDetailPrivacy from './components/AppDetailPrivacy' import AppDetailDocuments from './components/AppDetailDocuments' import AppDetailProvider from './components/AppDetailProvider' @@ -35,6 +35,7 @@ import { AppDetails } from 'features/apps/apiSlice' import './AppDetail.scss' import CommonService from 'services/CommonService' import AppDetailTechUserSetup from './components/AppDetailTechUserSetup' +import { Box } from '@mui/material' import { useNavigate } from 'react-router-dom' export default function AppDetailContentDetails({ @@ -88,9 +89,9 @@ export default function AppDetailContentDetails({ return ( item && ( <> -
    -
    - {showBack && ( +
    + {showBack && ( + - )} -
    + + )} + +
    @@ -111,18 +114,30 @@ export default function AppDetailContentDetails({ />
    +
    -
    - +
    + {item.longDescription}
    - {images && } +
    + {images && ( + + )} +
    +
    +
    +
    +
    +
    ) diff --git a/src/components/pages/AppDetail/components/AppDetailDocuments/index.tsx b/src/components/pages/AppDetail/components/AppDetailDocuments/index.tsx index aa604393e..90c352687 100644 --- a/src/components/pages/AppDetail/components/AppDetailDocuments/index.tsx +++ b/src/components/pages/AppDetail/components/AppDetailDocuments/index.tsx @@ -52,49 +52,44 @@ export default function AppDetailDocuments({ item }: { item: AppDetails }) { } } + const renderNoDocs = () => { + return ( + + {t('global.errors.noDocumentsAvailable')} + + ) + } return ( -
    -
    - - {t('content.appdetail.howtouse.heading')} - - - {t('content.appdetail.howtouse.message')} - -
    -
      - {item.documents && Object.keys(item.documents)?.length ? ( - Object.keys(item.documents).map( - (document) => - document !== - DocumentTypeText.CONFORMITY_APPROVAL_BUSINESS_APPS && ( -
    • - - -
      • - ) + ) + } + > + {item.documents[document as keyof Documents][0].documentName} + + + ) : ( + renderNoDocs() + ) ) - ) : ( - - {t('global.errors.noDocumentsAvailable')} - - )} -
    + : renderNoDocs()}
    ) } diff --git a/src/components/pages/AppDetail/components/AppDetailHeader/AppDetailHeader.scss b/src/components/pages/AppDetail/components/AppDetailHeader/AppDetailHeader.scss index e53417959..93d5d3f9c 100644 --- a/src/components/pages/AppDetail/components/AppDetailHeader/AppDetailHeader.scss +++ b/src/components/pages/AppDetail/components/AppDetailHeader/AppDetailHeader.scss @@ -41,18 +41,7 @@ .content { padding: 0 40px; flex: 1; - .provider { - margin: 0 0 10px 0; - padding: 0; - font-weight: 600; - font-size: 16px; - line-height: 24px; - color: #888888; - } - .heading { - margin: 0 0 10px 0; - color: #111111; - } + .rating { display: flex; align-items: center; @@ -61,39 +50,12 @@ font-size: 14px; } } - .price { - padding: 0; - margin: 0 0 10px 0; - font-weight: 500; - font-size: 18px; - line-height: 28px; - color: #888888; - } ul { display: flex; align-items: center; margin: 0 0 10px 0; padding: 0; } - .usecase, - .language { - display: flex; - align-items: center; - flex: 1; - flex-wrap: wrap; - margin: 0 0 10px 0; - font-weight: 400; - font-size: 16px; - line-height: 24px; - color: #888888; - .head { - margin-right: 5px; - font-size: 16px; - } - } - .mb-30 { - margin-bottom: 30px; - } .subscribed-success-btn { pointer-events: none; } diff --git a/src/components/pages/AppDetail/components/AppDetailHeader/index.tsx b/src/components/pages/AppDetail/components/AppDetailHeader/index.tsx index 1c91226a7..90dcfcbbc 100644 --- a/src/components/pages/AppDetail/components/AppDetailHeader/index.tsx +++ b/src/components/pages/AppDetail/components/AppDetailHeader/index.tsx @@ -180,10 +180,10 @@ export default function AppDetailHeader({ item }: AppDetailHeaderProps) { {item.title}
    - + {item.provider} - + {item.title}
    @@ -192,25 +192,21 @@ export default function AppDetailHeader({ item }: AppDetailHeaderProps) { {item.rating} */}
    - + {item.price} -
    - - {t('content.appdetail.usecase')}:{' '} - + + {t('content.appdetail.usecase')}: {item.useCases.map((useCase: UseCaseType) => ( {useCase.label} ))} -
    -
    - - {t('content.appdetail.language')}:{' '} - + + + {t('content.appdetail.language')}: {item.languages?.map((lang, index) => ( - {(index ? ', ' : '') + lang} + {(index ? ', ' : '') + lang} ))} -
    +     {getSubscribeBtn()}
    diff --git a/src/components/pages/AppDetail/components/AppDetailImageGallery/AppDetailImageGallery.scss b/src/components/pages/AppDetail/components/AppDetailImageGallery/AppDetailImageGallery.scss deleted file mode 100644 index d5cab438e..000000000 --- a/src/components/pages/AppDetail/components/AppDetailImageGallery/AppDetailImageGallery.scss +++ /dev/null @@ -1,38 +0,0 @@ -/******************************************************************************** - * Copyright (c) 2021, 2023 BMW Group AG - * Copyright (c) 2021, 2023 Contributors to the Eclipse Foundation - * - * See the NOTICE file(s) distributed with this work for additional - * information regarding copyright ownership. - * - * This program and the accompanying materials are made available under the - * terms of the Apache License, Version 2.0 which is available at - * https://www.apache.org/licenses/LICENSE-2.0. - * - * Unless required by applicable law or agreed to in writing, software - * distributed under the License is distributed on an "AS IS" BASIS, WITHOUT - * WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. See the - * License for the specific language governing permissions and limitations - * under the License. - * - * SPDX-License-Identifier: Apache-2.0 - ********************************************************************************/ - -.appdetail-gallery { - padding-top: 90px; - .img-col { - -ms-flex: 0 0 33.333333%; - flex: 0 0 33.333333%; - max-width: 33.333333%; - padding: 0 15px; - img { - width: 100%; - border-radius: 20px; - } - p { - color: #888888; - margin: 5px 0; - font-size: 14px; - } - } -} diff --git a/src/components/pages/AppDetail/components/AppDetailImageGallery/index.tsx b/src/components/pages/AppDetail/components/AppDetailImageGallery/index.tsx deleted file mode 100644 index 40490705a..000000000 --- a/src/components/pages/AppDetail/components/AppDetailImageGallery/index.tsx +++ /dev/null @@ -1,30 +0,0 @@ -/******************************************************************************** - * Copyright (c) 2021, 2023 BMW Group AG - * Copyright (c) 2021, 2023 Contributors to the Eclipse Foundation - * - * See the NOTICE file(s) distributed with this work for additional - * information regarding copyright ownership. - * - * This program and the accompanying materials are made available under the - * terms of the Apache License, Version 2.0 which is available at - * https://www.apache.org/licenses/LICENSE-2.0. - * - * Unless required by applicable law or agreed to in writing, software - * distributed under the License is distributed on an "AS IS" BASIS, WITHOUT - * WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. See the - * License for the specific language governing permissions and limitations - * under the License. - * - * SPDX-License-Identifier: Apache-2.0 - ********************************************************************************/ - -import './AppDetailImageGallery.scss' -import { ImageGallery, ImageType } from '@catena-x/portal-shared-components' - -export default function AppDetailImage({ images }: { images: ImageType[] }) { - return ( - - ) -} diff --git a/src/components/pages/AppDetail/components/AppDetailPrivacy/AppDetailPrivacy.scss b/src/components/pages/AppDetail/components/AppDetailPrivacy/AppDetailPrivacy.scss index e478c1e65..c194e176d 100644 --- a/src/components/pages/AppDetail/components/AppDetailPrivacy/AppDetailPrivacy.scss +++ b/src/components/pages/AppDetail/components/AppDetailPrivacy/AppDetailPrivacy.scss @@ -19,14 +19,16 @@ ********************************************************************************/ .appdetail-privacy { - padding-top: 85px; .privacy-content { - margin-bottom: 30px; + margin-bottom: 32px; + } + .app-policies { + padding: 0 20px; } .policies-list { display: flex; flex-wrap: wrap; - max-width: 800px; + max-width: none; margin: 0 auto; .policy-name { width: 50%; @@ -39,13 +41,4 @@ margin-right: 5px; } } - .table-text { - max-width: 850px; - font-weight: 600; - text-align: center; - background-color: #ecf0f4; - padding: 2px; - border-radius: 5px; - margin: 0 auto; - } } diff --git a/src/components/pages/AppDetail/components/AppDetailPrivacy/index.tsx b/src/components/pages/AppDetail/components/AppDetailPrivacy/index.tsx index b2978a63b..5b36b67a2 100644 --- a/src/components/pages/AppDetail/components/AppDetailPrivacy/index.tsx +++ b/src/components/pages/AppDetail/components/AppDetailPrivacy/index.tsx @@ -51,11 +51,11 @@ export default function AppDetailPrivacy({ item }: { item: AppDetails }) { return (
    - {t('heading')} + {t('heading')} {t('message')}
    {item.privacyPolicies && item.privacyPolicies.length ? ( -
    +
    {item.privacyPolicies.map((policy: PrivacyPolicyType) => ( ) : ( - + {t('notSupportedMessage')} )} diff --git a/src/components/pages/AppDetail/components/AppDetailProvider/AppDetailProvider.scss b/src/components/pages/AppDetail/components/AppDetailProvider/AppDetailProvider.scss deleted file mode 100644 index 18daf99f5..000000000 --- a/src/components/pages/AppDetail/components/AppDetailProvider/AppDetailProvider.scss +++ /dev/null @@ -1,29 +0,0 @@ -/******************************************************************************** - * Copyright (c) 2021, 2023 BMW Group AG - * Copyright (c) 2021, 2023 Contributors to the Eclipse Foundation - * - * See the NOTICE file(s) distributed with this work for additional - * information regarding copyright ownership. - * - * This program and the accompanying materials are made available under the - * terms of the Apache License, Version 2.0 which is available at - * https://www.apache.org/licenses/LICENSE-2.0. - * - * Unless required by applicable law or agreed to in writing, software - * distributed under the License is distributed on an "AS IS" BASIS, WITHOUT - * WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. See the - * License for the specific language governing permissions and limitations - * under the License. - * - * SPDX-License-Identifier: Apache-2.0 - ********************************************************************************/ - -.appdetail-provider { - padding-top: 85px; - margin-bottom: 56px; - padding-bottom: 92px; - border-bottom: 1px solid #dcdcdc; - .provider-content { - margin-bottom: 30px; - } -} diff --git a/src/components/pages/AppDetail/components/AppDetailProvider/index.tsx b/src/components/pages/AppDetail/components/AppDetailProvider/index.tsx index b46735adc..274431db8 100644 --- a/src/components/pages/AppDetail/components/AppDetailProvider/index.tsx +++ b/src/components/pages/AppDetail/components/AppDetailProvider/index.tsx @@ -25,7 +25,6 @@ import { TableType, } from '@catena-x/portal-shared-components' import { AppDetails } from 'features/apps/apiSlice' -import './AppDetailProvider.scss' export default function AppDetailProvider({ item }: { item: AppDetails }) { const { t } = useTranslation('', { @@ -43,11 +42,11 @@ export default function AppDetailProvider({ item }: { item: AppDetails }) { } return ( -
    -
    - {t('heading')} - {t('message')} -
    +
    + {t('heading')} + + {t('message')} +
    ) diff --git a/src/components/pages/AppDetail/components/AppDetailTags/index.tsx b/src/components/pages/AppDetail/components/AppDetailTags/index.tsx index c24fb958f..00fea4080 100644 --- a/src/components/pages/AppDetail/components/AppDetailTags/index.tsx +++ b/src/components/pages/AppDetail/components/AppDetailTags/index.tsx @@ -26,7 +26,7 @@ export default function AppDetailTags({ item }: { item: AppDetails }) { const tags = item.tags return (
    - Tags: + Tags: {tags.map((tag, i) => ( ))} diff --git a/src/components/pages/AppDetail/components/AppDetailTechUserSetup/index.tsx b/src/components/pages/AppDetail/components/AppDetailTechUserSetup/index.tsx index b45f64539..7b071517b 100644 --- a/src/components/pages/AppDetail/components/AppDetailTechUserSetup/index.tsx +++ b/src/components/pages/AppDetail/components/AppDetailTechUserSetup/index.tsx @@ -26,32 +26,37 @@ import { Grid } from '@mui/material' export default function AppDetailTechUserSetup({ item }: { item: AppDetails }) { const { t } = useTranslation('') - const getTechUserData = (data: string[] | null) => { + const getAppDetailTechUserData = (data: string[] | null) => { return data && data?.length > 0 ? ( data?.map((role: string) => ( - - - * {role} + + + * {role} )) ) : ( - - {t('global.errors.noTechnicalUserProfilesAvailable')} - + + + {t('global.errors.noTechnicalUserProfilesAvailable')} + + ) } return ( -
    - + <> + {t('content.appdetail.technicalUserSetup.heading')} - + {t('content.appdetail.technicalUserSetup.message')} {item.technicalUserProfile && - getTechUserData(Object.values(item?.technicalUserProfile)[0])} -
    + getAppDetailTechUserData(Object.values(item?.technicalUserProfile)[0])} + ) } diff --git a/src/components/pages/AppMarketplace/components/AppListGroup/index.tsx b/src/components/pages/AppMarketplace/components/AppListGroup/index.tsx index 8fe8817bc..8d499bed3 100644 --- a/src/components/pages/AppMarketplace/components/AppListGroup/index.tsx +++ b/src/components/pages/AppMarketplace/components/AppListGroup/index.tsx @@ -18,9 +18,10 @@ * SPDX-License-Identifier: Apache-2.0 ********************************************************************************/ -import { Cards, CategoryDivider } from '@catena-x/portal-shared-components' -import { useTranslation } from 'react-i18next' import { useState } from 'react' +import { useTranslation } from 'react-i18next' +import { Cards, CategoryDivider } from '@catena-x/portal-shared-components' +import { fetchImageWithToken } from 'services/ImageService' export const AppListGroup = ({ category, @@ -60,6 +61,8 @@ export const AppListGroup = ({ items={itemsToShow} variant={'compact'} expandOnHover={true} + imageLoader={fetchImageWithToken} + boxClickable={true} /> ) diff --git a/src/components/pages/AppMarketplace/components/AppListGroupView/index.tsx b/src/components/pages/AppMarketplace/components/AppListGroupView/index.tsx index 9b07706f2..8753470e2 100644 --- a/src/components/pages/AppMarketplace/components/AppListGroupView/index.tsx +++ b/src/components/pages/AppMarketplace/components/AppListGroupView/index.tsx @@ -52,6 +52,7 @@ export const AppListGroupView = ({ variant={'compact'} expandOnHover={true} imageLoader={fetchImageWithToken} + boxClickable={true} /> ) diff --git a/src/components/pages/AppOverview/AppOverview.scss b/src/components/pages/AppOverview/AppOverview.scss index d25ee2a1e..609f95fb8 100644 --- a/src/components/pages/AppOverview/AppOverview.scss +++ b/src/components/pages/AppOverview/AppOverview.scss @@ -135,7 +135,7 @@ } .doc-list { - padding: 0 14px; + padding: 0 18px; .document-button-link { font-size: 16px; } diff --git a/src/components/pages/AppOverview/ChangeDescription.tsx b/src/components/pages/AppOverview/ChangeDescription.tsx index f7f284180..1e968c070 100644 --- a/src/components/pages/AppOverview/ChangeDescription.tsx +++ b/src/components/pages/AppOverview/ChangeDescription.tsx @@ -55,10 +55,10 @@ export default function ChangeDescription() { const defaultValues = useMemo(() => { return { - longDescriptionEN: description?.[0].longDescription ?? '', - longDescriptionDE: description?.[1].longDescription ?? '', - shortDescriptionEN: description?.[0].shortDescription ?? '', - shortDescriptionDE: description?.[1].shortDescription ?? '', + longDescriptionEN: description?.[0]?.longDescription ?? '', + longDescriptionDE: description?.[1]?.longDescription ?? '', + shortDescriptionEN: description?.[0]?.shortDescription ?? '', + shortDescriptionDE: description?.[1]?.shortDescription ?? '', } }, [description]) @@ -247,7 +247,7 @@ export default function ChangeDescription() {
    {['shortDescriptionEN', 'shortDescriptionDE'].map( - (item: string, i) => ( + (item: string) => (
    {activationResponse ? (
    - - } - onCloseWithIcon={() => dispatch(closeOverlay())} - /> - - - - - - - + + + } + onCloseWithIcon={() => dispatch(closeOverlay())} + /> + + + + + + + +
    ) : ( { return ( { - onChange(e) + onChange(e ? e.subscriptionId : '') }} keyTitle={keyTitle} /> @@ -343,7 +345,10 @@ const ConnectorInsertForm = ({ trigger, errors, type: 'select', - name: 'ConnectorSubscription', + name: 'ConnectorSubscriptionId', + rules: { + required: true, + }, label: t( 'content.edcconnector.modal.insertform.subscription.label' ), @@ -353,6 +358,9 @@ const ConnectorInsertForm = ({ tooltipMsg: t( 'content.edcconnector.modal.insertform.subscription.tooltipMsg' ), + helperText: t( + 'content.edcconnector.modal.insertform.subscription.error' + ), items: subscriptions, defaultSelectValue: {}, keyTitle: 'name', diff --git a/src/components/pages/EdcConnector/AddConnectorOverlay/index.tsx b/src/components/pages/EdcConnector/AddConnectorOverlay/index.tsx index 045dead41..b2c28242b 100644 --- a/src/components/pages/EdcConnector/AddConnectorOverlay/index.tsx +++ b/src/components/pages/EdcConnector/AddConnectorOverlay/index.tsx @@ -18,7 +18,7 @@ * SPDX-License-Identifier: Apache-2.0 ********************************************************************************/ -import React, { useEffect, useState } from 'react' +import { useEffect, useState } from 'react' import { useTranslation } from 'react-i18next' import { Dialog, @@ -33,7 +33,6 @@ import ConnectorInsertForm from './components/ConnectorInsertForm' import { useForm } from 'react-hook-form' import { ConnectorType, - EdcSubscriptionsType, useFetchOfferSubscriptionsQuery, } from 'features/connector/connectorApiSlice' import Box from '@mui/material/Box' @@ -52,7 +51,7 @@ interface AddCollectorOverlayProps { export type FormFieldsType = { ConnectorName: string ConnectorURL: string - ConnectorSubscription: EdcSubscriptionsType + ConnectorSubscriptionId: string ConnectorLocation: string // ConnectorDoc: any TO-DO: Enable when DAPS enabled } @@ -61,6 +60,7 @@ const formFields = { ConnectorName: '', ConnectorURL: '', ConnectorLocation: '', + ConnectorSubscriptionId: '', // ConnectorDoc: '', TO-DO: Enable when DAPS enabled } @@ -99,6 +99,7 @@ const AddConnectorOverlay = ({ 'ConnectorName', 'ConnectorURL', 'ConnectorLocation', + 'ConnectorSubscriptionId', // 'ConnectorDoc', TO-DO: Enable when DAPS enabled ]) if (validateFields) { diff --git a/src/components/pages/EdcConnector/index.tsx b/src/components/pages/EdcConnector/index.tsx index 79bdb1ebb..35cf628e5 100644 --- a/src/components/pages/EdcConnector/index.tsx +++ b/src/components/pages/EdcConnector/index.tsx @@ -158,7 +158,7 @@ const EdcConnector = () => { .catch(() => showOverlay(false)) } else if (selectedService.type === ConnectType.MANAGED_CONNECTOR) { // body.append('providerBpn', data.ConnectorBPN) - body.append('subscriptionId', data.ConnectorSubscription.subscriptionId) + body.append('subscriptionId', data.ConnectorSubscriptionId) body.append('technicalUserId', '') await createManagedConnector(body) .unwrap() diff --git a/src/components/pages/NotificationCenter/NotificationItem.tsx b/src/components/pages/NotificationCenter/NotificationItem.tsx index 41f8dfdee..57acdf73b 100644 --- a/src/components/pages/NotificationCenter/NotificationItem.tsx +++ b/src/components/pages/NotificationCenter/NotificationItem.tsx @@ -81,13 +81,15 @@ const NotificationContent = ({ const userId = item.contentParsed?.userId const appId = item.contentParsed?.appId const you = UserService.getName() - const appName = item.contentParsed?.AppName + const appName = item.contentParsed?.AppName ?? item.contentParsed?.appName const companyName = item.contentParsed?.RequestorCompanyName const offerName = item.contentParsed?.OfferName const userName = item.contentParsed?.username const coreOfferName = item.contentParsed?.coreOfferName const removedRoles = item.contentParsed?.removedRoles const addedRoles = item.contentParsed?.addedRoles + const credentialType = item.contentParsed?.type + const newUrl = item.contentParsed?.newUrl return ( <> @@ -104,6 +106,8 @@ const NotificationContent = ({ coreOfferName: coreOfferName, removedRoles: removedRoles ? removedRoles : '-', addedRoles: addedRoles ? addedRoles : '-', + credentialType: credentialType, + newUrl: newUrl, }} > { case NotificationType.WELCOME_CONNECTOR_REGISTRATION: return case NotificationType.WELCOME_USE_CASES: - return + return case NotificationType.WELCOME_SERVICE_PROVIDER: return ( { return case NotificationType.ROLE_UPDATE_CORE_OFFER: return + case NotificationType.CREDENTIAL_APPROVAL: + return + case NotificationType.CREDENTIAL_REJECTED: + return + case NotificationType.SUBSCRIPTION_URL_UPDATE: + return default: return 
    {JSON.stringify(item, null, 2)}
    } @@ -317,6 +327,7 @@ export default function NotificationItem({ {t(`${item.typeId}.title`, { app: item.contentParsed?.AppName ?? item.contentParsed?.appName, offer: item.contentParsed?.OfferName, + credentialType: item.contentParsed?.type, })} {open && ( diff --git a/src/components/pages/ServiceAdminBoardDetail/index.tsx b/src/components/pages/ServiceAdminBoardDetail/index.tsx index fcc798d63..065db2734 100644 --- a/src/components/pages/ServiceAdminBoardDetail/index.tsx +++ b/src/components/pages/ServiceAdminBoardDetail/index.tsx @@ -38,9 +38,14 @@ import { import { useTranslation } from 'react-i18next' import { PAGES } from 'types/Constants' import ArrowForwardIcon from '@mui/icons-material/ArrowForward' -import { InputLabel, Grid } from '@mui/material' +import { Grid, Box, Divider } from '@mui/material' import { download } from 'utils/downloadUtils' +enum TableData { + SUCCESS = 'SUCCESS', + ERROR = 'ERROR', +} + export default function ServiceAdminBoardDetail() { const { t } = useTranslation('servicerelease') const navigate = useNavigate() @@ -88,156 +93,150 @@ export default function ServiceAdminBoardDetail() { const getTechUserData = (data: string[] | null) => { return data && data?.length > 0 ? ( data?.map((role: string) => ( - - * {role} - + + + * {role} + + )) ) : ( - - {t( - 'adminboardDetail.technicalUserSetup.noTechnicalUserProfilesAvailable' - )} - + + + {t( + 'adminboardDetail.technicalUserSetup.noTechnicalUserProfilesAvailable' + )} + + ) } return ( -
    - +
    + + + {serviceData && ( - <> -
    + +
    {serviceData.title}
    -
    - + + {serviceData.provider} - + {serviceData.title} -
    {getTypes()}
    -
    + + {getTypes()} + +
    -
    - {['longDescriptionTitleEN', 'longDescriptionTitleDE'].map( - (desc) => ( -
    - - {t(`adminboardDetail.${desc}`)} - - - { - serviceData?.descriptions?.filter( - (lang: { languageCode: string }) => - lang.languageCode === - (desc === 'longDescriptionTitleEN' ? 'en' : 'de') - )[0]?.longDescription - } +
    + {['longDescriptionTitleEN', 'longDescriptionTitleDE'].map((desc) => ( +
    + + {t(`adminboardDetail.${desc}`)} + + + { + serviceData?.descriptions?.filter( + (lang: { languageCode: string }) => + lang.languageCode === + (desc === 'longDescriptionTitleEN' ? 'en' : 'de') + )[0]?.longDescription + } + +
    +
    + ))} + + {t('adminboardDetail.documents.heading')} + + + {t('adminboardDetail.documents.message')} + + {serviceData?.documents && + Object.keys(serviceData.documents).length > 0 ? ( + Object.keys(serviceData.documents).map((item) => ( +
  • + +
    • - ) - )} -
    -
    - - {t('adminboardDetail.documents.heading')} - - - {t('adminboardDetail.documents.message')} + + + )) + ) : ( + + {t('adminboardDetail.noDocumentsAvailable')} - {serviceData?.documents && - Object.keys(serviceData.documents).map((item) => ( - - onDownload(serviceData.documents[item][0])} - > - - {serviceData.documents[item][0]?.documentName} - - - ))} -
    + )} -
    - - {t('adminboardDetail.technicalUserSetup.heading')} - - - {t('adminboardDetail.technicalUserSetup.message')} - - - - {serviceData.technicalUserProfile && - getTechUserData( - Object.values(serviceData?.technicalUserProfile)[0] - )} - - -
    +
    + + {t('adminboardDetail.technicalUserSetup.heading')} + + + {t('adminboardDetail.technicalUserSetup.message')} + -
    -
    - - {t('adminboardDetail.provider.heading')} - - - {t('adminboardDetail.provider.message')} - -
    + {serviceData.technicalUserProfile && + getTechUserData( + Object.values(serviceData?.technicalUserProfile)[0] + )} - + + {t('adminboardDetail.provider.heading')} + + + {t('adminboardDetail.provider.message')} + + -
    - + [serviceData?.contactEmail], + ], + }} + horizontal={true} + /> +
    + + + )}
    ) diff --git a/src/components/pages/ServiceMarketplaceDetail/Marketplace.scss b/src/components/pages/ServiceMarketplaceDetail/Marketplace.scss index e64e78979..86219d65c 100644 --- a/src/components/pages/ServiceMarketplaceDetail/Marketplace.scss +++ b/src/components/pages/ServiceMarketplaceDetail/Marketplace.scss @@ -18,17 +18,15 @@ * SPDX-License-Identifier: Apache-2.0 ********************************************************************************/ .marketplace-main { - width: 100%; - padding: 30px 0; - padding-right: 15px; - padding-left: 15px; - margin-right: auto; - margin-left: auto; - max-width: 1140px; - .product-description { - margin: 42px 0; - p { - margin-bottom: 12px; + min-width: 1440px; + .service-back { + height: 140px; + padding: 48px 256px 48px 160px; + } + .service-marketplace-content { + padding: 0px 256px 0px 256px; + .divider-height { + height: 39px; } } } diff --git a/src/components/pages/ServiceMarketplaceDetail/MarketplaceContentDetails.tsx b/src/components/pages/ServiceMarketplaceDetail/MarketplaceContentDetails.tsx index 91535e5f0..d5a9619d5 100644 --- a/src/components/pages/ServiceMarketplaceDetail/MarketplaceContentDetails.tsx +++ b/src/components/pages/ServiceMarketplaceDetail/MarketplaceContentDetails.tsx @@ -38,15 +38,21 @@ export default function MarketplaceContentDetails({ item.offerSubscriptionDetailData && ( <> +
    {item.offerSubscriptionDetailData.length > 0 && ( - + <> + +
    + )} -
    - {item.description} -
    + {item.description} +
    +
    +
    +
    ) ) diff --git a/src/components/pages/ServiceMarketplaceDetail/components/MarketplaceDocuments/index.tsx b/src/components/pages/ServiceMarketplaceDetail/components/MarketplaceDocuments/index.tsx index 80a0d1cab..3409ce61c 100644 --- a/src/components/pages/ServiceMarketplaceDetail/components/MarketplaceDocuments/index.tsx +++ b/src/components/pages/ServiceMarketplaceDetail/components/MarketplaceDocuments/index.tsx @@ -28,6 +28,7 @@ import { ServiceRequest, } from 'features/serviceMarketplace/serviceApiSlice' import { useFetchDocumentMutation } from 'features/serviceManagement/apiSlice' +import { DocumentTypeId } from 'features/appManagement/apiSlice' export default function MarketplaceDocuments({ item, @@ -56,20 +57,18 @@ export default function MarketplaceDocuments({ } return ( -
    -
    - - {t('content.serviceMarketplace.document.heading')} - - - {t('content.serviceMarketplace.document.message')} - -
    -
      - {item.documents && item.documents['ADDITIONAL_DETAILS'] ? ( - item.documents['ADDITIONAL_DETAILS'].map((document: DocumentData) => ( -
    • - + <> + + {t('content.serviceMarketplace.document.heading')} + + + {t('content.serviceMarketplace.document.message')} + + {item?.documents[DocumentTypeId.ADDITIONAL_DETAILS] ? ( + item.documents[DocumentTypeId.ADDITIONAL_DETAILS].map( + (document: DocumentData) => ( +
    • +
      • - )) - ) : ( - - {t('global.errors.noDocumentsAvailable')} - - )} -
    -
    + ) + ) + ) : ( + + {t('global.errors.noDocumentsAvailable')} + + )} + ) } diff --git a/src/components/pages/ServiceMarketplaceDetail/components/MarketplaceHeader/MarketplaceHeader.scss b/src/components/pages/ServiceMarketplaceDetail/components/MarketplaceHeader/MarketplaceHeader.scss index 305f6f994..9a067239c 100644 --- a/src/components/pages/ServiceMarketplaceDetail/components/MarketplaceHeader/MarketplaceHeader.scss +++ b/src/components/pages/ServiceMarketplaceDetail/components/MarketplaceHeader/MarketplaceHeader.scss @@ -17,40 +17,17 @@ * * SPDX-License-Identifier: Apache-2.0 ********************************************************************************/ -.marketplace-header { - margin: 30px -15px 60px -15px; - display: -ms-flexbox; +.service-marketplace-header { + width: 928px; + height: 288px; display: flex; - -ms-flex-wrap: wrap; flex-wrap: wrap; - .lead-image img { - border-radius: 10px; + .lead-image > img { + border-radius: 16px; + width: '288px'; + height: '288px'; } - .content { - padding: 0 30px; - flex: 1; - .provider { - margin: 0 0 10px 0; - padding: 0; - font-weight: 600; - font-size: 16px; - line-height: 24px; - color: #888888; - } - .heading { - margin: 0 0 10px 0; - color: #111111; - } - .price { - padding: 0; - margin: 0 0 10px 0; - font-weight: 500; - font-size: 18px; - line-height: 28px; - color: #888888; - } - .subscribe-btn { - margin-top: 40px; - } + .marketplace-app-content { + padding: 0px 0px 0px 56px; } } diff --git a/src/components/pages/ServiceMarketplaceDetail/components/MarketplaceHeader/index.tsx b/src/components/pages/ServiceMarketplaceDetail/components/MarketplaceHeader/index.tsx index b9b9111ca..1eee430a9 100644 --- a/src/components/pages/ServiceMarketplaceDetail/components/MarketplaceHeader/index.tsx +++ b/src/components/pages/ServiceMarketplaceDetail/components/MarketplaceHeader/index.tsx @@ -29,6 +29,7 @@ import UserService from 'services/UserService' import './MarketplaceHeader.scss' import { setSuccessType } from 'features/serviceMarketplace/slice' import { getAssetBase } from 'services/EnvironmentService' +import { Box } from '@mui/material' export default function MarketplaceHeader({ item, @@ -85,28 +86,28 @@ export default function MarketplaceHeader({ } return ( -
    +
    {item.title}
    -
    - + + {item.provider} - + {item.title} - + {getAllServices(item.serviceTypes)} - + {item.price} {getSubscribeBtn()} -
    +
    ) } diff --git a/src/components/pages/ServiceMarketplaceDetail/components/MarketplaceProvider/index.tsx b/src/components/pages/ServiceMarketplaceDetail/components/MarketplaceProvider/index.tsx index e6258c8a5..7c76d592d 100644 --- a/src/components/pages/ServiceMarketplaceDetail/components/MarketplaceProvider/index.tsx +++ b/src/components/pages/ServiceMarketplaceDetail/components/MarketplaceProvider/index.tsx @@ -42,12 +42,12 @@ export default function MarketplaceProvider({ } return ( -
    -
    - {t('heading')} - {t('message')} -
    + <> + {t('heading')} + + {t('message')} + -
    + ) } diff --git a/src/components/pages/ServiceMarketplaceDetail/components/MarketplaceSubscription/MarketplaceSubscription.scss b/src/components/pages/ServiceMarketplaceDetail/components/MarketplaceSubscription/MarketplaceSubscription.scss index f080b58f5..26fba0e02 100644 --- a/src/components/pages/ServiceMarketplaceDetail/components/MarketplaceSubscription/MarketplaceSubscription.scss +++ b/src/components/pages/ServiceMarketplaceDetail/components/MarketplaceSubscription/MarketplaceSubscription.scss @@ -18,20 +18,14 @@ * SPDX-License-Identifier: Apache-2.0 ********************************************************************************/ .marketplace-subscriptions { - .subscription-main-heading { - font-weight: 700; - color: #0d55af; - } - .subscriptions-content { display: flex; - margin: 10px -5px 0 -5px; flex-wrap: wrap; .subscription-list { width: 33.3333%; padding: 0 5px; - margin-bottom: 10px; + margin: 10px 0; .subscription-name { border: 1px solid #0f71cb; @@ -47,7 +41,6 @@ .subscription-status { margin: 2px 15px; height: 18px; - // width: 27%; } } } diff --git a/src/components/pages/ServiceMarketplaceDetail/components/MarketplaceSubscription/index.tsx b/src/components/pages/ServiceMarketplaceDetail/components/MarketplaceSubscription/index.tsx index d06db07e0..300476149 100644 --- a/src/components/pages/ServiceMarketplaceDetail/components/MarketplaceSubscription/index.tsx +++ b/src/components/pages/ServiceMarketplaceDetail/components/MarketplaceSubscription/index.tsx @@ -32,11 +32,13 @@ export default function MarketplaceSubscription({ return (
    - - {t('content.serviceMarketplace.subscriptionHeading').replace( - '{serviceName}', - item.title - )} + + + {t('content.serviceMarketplace.subscriptionHeading').replace( + '{serviceName}', + item.title + )} +
    {item.offerSubscriptionDetailData.map((data) => ( diff --git a/src/components/pages/ServiceMarketplaceDetail/components/MarketplaceTechnicalUserSetup/index.tsx b/src/components/pages/ServiceMarketplaceDetail/components/MarketplaceTechnicalUserSetup/index.tsx index 4f04b75df..02718dc99 100644 --- a/src/components/pages/ServiceMarketplaceDetail/components/MarketplaceTechnicalUserSetup/index.tsx +++ b/src/components/pages/ServiceMarketplaceDetail/components/MarketplaceTechnicalUserSetup/index.tsx @@ -34,28 +34,33 @@ export default function MarketplaceTechnicalUserSetup({ return data && data?.length > 0 ? ( data?.map((item: string) => ( - - * {item} + + * {item} )) ) : ( - - {t('global.errors.noTechnicalUserProfilesAvailable')} - + + + {t('global.errors.noTechnicalUserProfilesAvailable')} + + ) } return ( -
    - + <> + {t('content.appdetail.technicalUserSetup.heading')} - + {t('content.appdetail.technicalUserSetup.message')} {item.technicalUserProfile && getTechUserInfo(Object.values(item?.technicalUserProfile)[0])} -
    + ) } diff --git a/src/components/pages/ServiceMarketplaceDetail/index.tsx b/src/components/pages/ServiceMarketplaceDetail/index.tsx index f81893fd7..cecfb7ba7 100644 --- a/src/components/pages/ServiceMarketplaceDetail/index.tsx +++ b/src/components/pages/ServiceMarketplaceDetail/index.tsx @@ -29,6 +29,7 @@ import { currentSuccessType, setSuccessType, } from 'features/serviceMarketplace/slice' +import { Box } from '@mui/material' export default function ServiceMarketplaceDetail() { const navigate = useNavigate() @@ -45,17 +46,23 @@ export default function ServiceMarketplaceDetail() { return (
    - - {data && } + + + + {data && ( + + + + )}
    ) } diff --git a/src/components/shared/basic/ReleaseProcess/AppMarketCard/index.tsx b/src/components/shared/basic/ReleaseProcess/AppMarketCard/index.tsx index 36a638f2a..ac9532cc6 100644 --- a/src/components/shared/basic/ReleaseProcess/AppMarketCard/index.tsx +++ b/src/components/shared/basic/ReleaseProcess/AppMarketCard/index.tsx @@ -508,7 +508,12 @@ export default function AppMarketCard() { }} name="title" pattern={Patterns.appMarketCard.appTitle} - label={t('content.apprelease.appMarketCard.appTitle') + ' *'} + label={ + <> + {t('content.apprelease.appMarketCard.appTitle')} + * + + } rules={{ required: `${t( 'content.apprelease.appMarketCard.appTitle' @@ -538,7 +543,12 @@ export default function AppMarketCard() { maxLength={30} minLength={3} pattern={Patterns.appMarketCard.appProvider} - label={t('content.apprelease.appMarketCard.appProvider') + ' *'} + label={ + <> + {t('content.apprelease.appMarketCard.appProvider')} + * + + } rules={{ required: `${t( 'content.apprelease.appMarketCard.appProvider' @@ -572,7 +582,8 @@ export default function AppMarketCard() { }} label={ <> - {t(`content.apprelease.appMarketCard.${item}`) + ' *'} + {t(`content.apprelease.appMarketCard.${item}`)} + * @@ -623,9 +634,12 @@ export default function AppMarketCard() { trigger, errors, name: 'useCaseCategory', - label: - t('content.apprelease.appMarketCard.useCaseCategory') + - ' *', + label: ( + <> + {t('content.apprelease.appMarketCard.useCaseCategory')} + * + + ), placeholder: t( 'content.apprelease.appMarketCard.useCaseCategoryPlaceholder' ), @@ -663,8 +677,12 @@ export default function AppMarketCard() { trigger, errors, name: 'appLanguage', - label: - t('content.apprelease.appMarketCard.appLanguage') + ' *', + label: ( + <> + {t('content.apprelease.appMarketCard.appLanguage')} + * + + ), placeholder: t( 'content.apprelease.appMarketCard.appLanguagePlaceholder' ), @@ -735,7 +753,10 @@ export default function AppMarketCard() { maxLength={15} minLength={1} label={ - t('content.apprelease.appMarketCard.pricingInformation') + ' *' + <> + {t('content.apprelease.appMarketCard.pricingInformation')} + * + } rules={{ required: `${t( @@ -764,7 +785,10 @@ export default function AppMarketCard() { errors, }} label={ - t('content.apprelease.appMarketCard.appLeadImageUpload') + ' *' + <> + {t('content.apprelease.appMarketCard.appLeadImageUpload')} + * + } noteDescription={t( 'content.apprelease.appReleaseForm.OnlyOneFileAllowed' diff --git a/src/components/shared/basic/ReleaseProcess/AppPage/index.tsx b/src/components/shared/basic/ReleaseProcess/AppPage/index.tsx index 6eacfb045..457a33649 100644 --- a/src/components/shared/basic/ReleaseProcess/AppPage/index.tsx +++ b/src/components/shared/basic/ReleaseProcess/AppPage/index.tsx @@ -481,7 +481,8 @@ export default function AppPage() { }} label={ <> - {t(`content.apprelease.appPage.${item}`) + ' *'} + {t(`content.apprelease.appPage.${item}`)} + * @@ -521,7 +522,8 @@ export default function AppPage() {
    - {t('content.apprelease.appPage.images') + ' *'} + {t('content.apprelease.appPage.images')} + * - {t('content.apprelease.appPage.privacyInformation') + ' *'} + {t('content.apprelease.appPage.privacyInformation')} + * {t('content.apprelease.appPage.privacyInformationDescription')} diff --git a/src/components/shared/basic/ReleaseProcess/ContractAndConsent/index.tsx b/src/components/shared/basic/ReleaseProcess/ContractAndConsent/index.tsx index 97b9a0b09..f9c06d81a 100644 --- a/src/components/shared/basic/ReleaseProcess/ContractAndConsent/index.tsx +++ b/src/components/shared/basic/ReleaseProcess/ContractAndConsent/index.tsx @@ -67,8 +67,10 @@ export default function ContractAndConsent() { 'content.apprelease.appReleaseForm.isMandatory' )} imageFieldLabel={ - t('content.apprelease.contractAndConsent.uploadImageConformity') + - ' *' + <> + {t('content.apprelease.contractAndConsent.uploadImageConformity')} + * + } pageSnackbarDescription={t( 'content.apprelease.appReleaseForm.dataSavedSuccessMessage' diff --git a/src/components/shared/basic/ReleaseProcess/OfferCard/index.tsx b/src/components/shared/basic/ReleaseProcess/OfferCard/index.tsx index 548181cb5..910804b9e 100644 --- a/src/components/shared/basic/ReleaseProcess/OfferCard/index.tsx +++ b/src/components/shared/basic/ReleaseProcess/OfferCard/index.tsx @@ -363,7 +363,12 @@ export default function OfferCard() { }} name="title" pattern={Patterns.offerCard.serviceName} - label={t('step1.serviceName')} + label={ + <> + {t('step1.serviceName')} + * + + } rules={{ required: `${t('step1.serviceName')} ${t( 'serviceReleaseForm.isMandatory' @@ -389,7 +394,12 @@ export default function OfferCard() { trigger, errors, name: 'serviceTypeIds', - label: t('step1.serviceType'), + label: ( + <> + {t('step1.serviceType')} + * + + ), placeholder: t('step1.serviceTypePlaceholder'), type: 'multiSelectList', rules: { @@ -430,6 +440,7 @@ export default function OfferCard() { label={ <> {t(`step1.${desc}`)} + * diff --git a/src/components/shared/basic/ReleaseProcess/OfferPage/index.tsx b/src/components/shared/basic/ReleaseProcess/OfferPage/index.tsx index 38bd30d1f..6fa9d41df 100644 --- a/src/components/shared/basic/ReleaseProcess/OfferPage/index.tsx +++ b/src/components/shared/basic/ReleaseProcess/OfferPage/index.tsx @@ -283,6 +283,7 @@ export default function OfferPage({ label={ <> {t(`step2.${longDesc}`)} + * diff --git a/src/components/shared/basic/ReleaseProcess/TechnicalIntegration/index.tsx b/src/components/shared/basic/ReleaseProcess/TechnicalIntegration/index.tsx index 9bc8703f8..03b700c36 100644 --- a/src/components/shared/basic/ReleaseProcess/TechnicalIntegration/index.tsx +++ b/src/components/shared/basic/ReleaseProcess/TechnicalIntegration/index.tsx @@ -324,7 +324,10 @@ export default function TechnicalIntegration() {
    - {t('content.apprelease.technicalIntegration.step1Header')} + <> + {t('content.apprelease.technicalIntegration.step1Header')} + * + {t('content.apprelease.technicalIntegration.step1HeaderDescription')} @@ -552,7 +555,10 @@ export default function TechnicalIntegration() { )} - {t('content.apprelease.technicalIntegration.step2Header')} + <> + {t('content.apprelease.technicalIntegration.step2Header')} + * + {t('content.apprelease.technicalIntegration.step2HeaderDescription')} diff --git a/src/components/shared/basic/ReleaseProcess/components/CommonContractAndConsent.tsx b/src/components/shared/basic/ReleaseProcess/components/CommonContractAndConsent.tsx index 8e7c79ce1..0fc208bb9 100644 --- a/src/components/shared/basic/ReleaseProcess/components/CommonContractAndConsent.tsx +++ b/src/components/shared/basic/ReleaseProcess/components/CommonContractAndConsent.tsx @@ -20,7 +20,7 @@ import { useForm } from 'react-hook-form' import { useTranslation } from 'react-i18next' -import { useCallback, useEffect, useMemo, useState } from 'react' +import { ReactElement, useCallback, useEffect, useMemo, useState } from 'react' import { useDispatch } from 'react-redux' import { decrement, increment } from 'features/appManagement/slice' import { @@ -68,7 +68,7 @@ type CommonConsentType = { stepperTitle: string stepperDescription: string checkBoxMandatoryText: string - imageFieldLabel?: string + imageFieldLabel?: ReactElement pageSnackbarDescription: string pageNotificationObject: { title: string @@ -132,7 +132,7 @@ export default function CommonContractAndConsent({ useDeleteAppReleaseDocumentMutation() useEffect(() => { - deleteResponse.isSuccess && setDeleteSuccess(true) + if (deleteResponse.isSuccess) setDeleteSuccess(true) if (deleteResponse.isError) { resetField('uploadImageConformity', { defaultValue: @@ -414,7 +414,7 @@ export default function CommonContractAndConsent({ {agreementData?.map((item) => (
    - + - + {item.documentId ? ( { return data && data?.length > 0 ? ( data?.map((role: string) => ( - - + + * {role} @@ -274,7 +274,7 @@ export default function CommonValidateAndPublish({ ) : ( @@ -423,7 +423,7 @@ export default function CommonValidateAndPublish({ style={{ marginBottom: '0px', paddingTop: '0px' }} >
    - + {t('content.appdetail.privacy.heading')} @@ -456,9 +456,7 @@ export default function CommonValidateAndPublish({ {conformityDocument && ( <> - - {conformityDocument} - + {conformityDocument} {defaultValues && ( {defaultValues.conformityDocumentsDescription} @@ -487,9 +485,7 @@ export default function CommonValidateAndPublish({ )} - - {documentsTitle} - + {documentsTitle} {defaultValues && ( {defaultValues.documentsDescription} @@ -534,7 +530,7 @@ export default function CommonValidateAndPublish({ {rolesData && ( <> - + {t('content.adminboardDetail.roles.heading')} @@ -561,7 +557,7 @@ export default function CommonValidateAndPublish({ Object.values(statusData?.technicalUserProfile) && ( <> - + {t('content.adminboardDetail.technicalUserSetup.heading')} diff --git a/src/components/styles/document.scss b/src/components/styles/document.scss index b9862e8d5..927a83ce4 100644 --- a/src/components/styles/document.scss +++ b/src/components/styles/document.scss @@ -18,21 +18,27 @@ * SPDX-License-Identifier: Apache-2.0 ********************************************************************************/ -.appdetail-documents { - padding-top: 85px; -} - .document-main { margin-bottom: 50px; } - -.adminboard-documents { - margin-bottom: 60px; +.document-button-link { + background-color: transparent; + border: none; + text-decoration: underline; + cursor: pointer; + line-height: 20px; + padding: 0; + color: #0f71cb !important; } +.service-documents { + padding: 10px 18px; + color: #0f71cb !important; + display: flex; +} .document-list { display: flex; - margin: 10px auto; + margin: 0px auto 10px; .document-icon { color: #9c9c9c; } @@ -41,7 +47,7 @@ border: none; text-decoration: underline; cursor: pointer; - font-size: 18px; + font-size: 16px; color: #1977cc; margin-left: 10px; } diff --git a/src/features/admin/serviceApiSlice.ts b/src/features/admin/serviceApiSlice.ts index 0b07e8e25..86fcc7421 100644 --- a/src/features/admin/serviceApiSlice.ts +++ b/src/features/admin/serviceApiSlice.ts @@ -29,7 +29,7 @@ export enum ServiceAccountType { export interface ServiceAccountRole { roleId: string - clientId: string + roleDescription: string roleName: string } diff --git a/src/features/certification/certificationApiSlice.tsx b/src/features/certification/certificationApiSlice.tsx index 158d8db96..520dc8136 100644 --- a/src/features/certification/certificationApiSlice.tsx +++ b/src/features/certification/certificationApiSlice.tsx @@ -20,6 +20,7 @@ import { PaginFetchArgs } from '@catena-x/portal-shared-components' import { createApi, fetchBaseQuery } from '@reduxjs/toolkit/query/react' +import { PAGE_SIZE } from 'types/Constants' import { apiBaseQuery } from 'utils/rtkUtil' export enum StatusEnum { @@ -101,11 +102,17 @@ export const apiSlice = createApi({ }, invalidatesTags: ['certificate'], }), - fetchCredentials: builder.query({ - query: (fetchArgs) => ({ - url: `api/administration/companydata/credentials?page=${fetchArgs.page}`, - }), - }), + fetchCredentialsSearch: builder.query( + { + query: (fetchArgs) => ({ + url: `api/administration/companydata/credentials?page=${ + fetchArgs.page + }&size=${PAGE_SIZE}&companyName=${ + fetchArgs.args.expr ?? '' + }&companySsiDetailStatusId=${fetchArgs.args.filterType ?? ''}`, + }), + } + ), approveCredential: builder.mutation({ query: (credentialId) => ({ url: `api/administration/companydata/credentials/${credentialId}/approval`, @@ -124,7 +131,7 @@ export const apiSlice = createApi({ export const { useFetchCertificatesQuery, useAddCertificateMutation, - useFetchCredentialsQuery, + useFetchCredentialsSearchQuery, useApproveCredentialMutation, useDeclineCredentialMutation, } = apiSlice diff --git a/src/features/notification/types.ts b/src/features/notification/types.ts index 2eb5155e5..398e86aaa 100644 --- a/src/features/notification/types.ts +++ b/src/features/notification/types.ts @@ -96,6 +96,9 @@ export enum NotificationType { SERVICE_RELEASE_REQUEST = 'SERVICE_RELEASE_REQUEST', ROLE_UPDATE_APP_OFFER = 'ROLE_UPDATE_APP_OFFER', ROLE_UPDATE_CORE_OFFER = 'ROLE_UPDATE_CORE_OFFER', + CREDENTIAL_REJECTED = 'CREDENTIAL_REJECTED', + CREDENTIAL_APPROVAL = 'CREDENTIAL_APPROVAL', + SUBSCRIPTION_URL_UPDATE = 'SUBSCRIPTION_URL_UPDATE', } export interface NotificationContent { @@ -110,6 +113,8 @@ export interface NotificationContent { appName?: string removedRoles?: string addedRoles?: string + type?: string | number + newUrl?: string } export interface CXNotificationContent { diff --git a/src/features/store.ts b/src/features/store.ts index 34a82b604..1f1444ce6 100644 --- a/src/features/store.ts +++ b/src/features/store.ts @@ -120,7 +120,7 @@ export const reducers = { export const store = configureStore({ reducer: combineReducers(reducers), middleware: (getDefaultMiddleware) => - getDefaultMiddleware() + getDefaultMiddleware({ serializableCheck: false }) .concat(idpSlice.middleware) .concat(userSlice.middleware) .concat(serviceSlice.middleware) diff --git a/src/types/Config.tsx b/src/types/Config.tsx index 8f3b2dd3f..87fdaa9b2 100644 --- a/src/types/Config.tsx +++ b/src/types/Config.tsx @@ -486,7 +486,7 @@ export const ALL_PAGES: IPage[] = [ { name: PAGES.DATA_SPACE, element: }, { name: PAGES.ADMIN_CREDENTIAL, - role: ROLES.ADMIN_CREDENTIAL_DECISION, + role: ROLES.DECISION_SSICREDENTIAL, element: , }, ] diff --git a/src/types/Constants.ts b/src/types/Constants.ts index 43bb5ad4c..684e4ab75 100644 --- a/src/types/Constants.ts +++ b/src/types/Constants.ts @@ -207,7 +207,7 @@ export enum ROLES { UPDATE_COMPANY_ROLE = 'update_company_role', SUBMITTED_APPLICATION = 'view_submitted_applications', REQUEST_SSICREDENTIAL = 'request_ssicredential', - ADMIN_CREDENTIAL_DECISION = 'admin_credential_decision', + DECISION_SSICREDENTIAL = 'decision_ssicredential', } export enum HINTS { diff --git a/yarn.lock b/yarn.lock index 8745bd971..954c4d4fd 100644 --- a/yarn.lock +++ b/yarn.lock @@ -1175,10 +1175,10 @@ resolved "https://registry.yarnpkg.com/@bcoe/v8-coverage/-/v8-coverage-0.2.3.tgz#75a2e8b51cb758a7553d6804a5932d7aace75c39" integrity sha512-0hYQ8SB4Db5zvZB4axdMHGwEaQjkZzFjQiN9LVYvIFB2nSUHW9tYpxWriPrWDASIxiaXax83REcLxuSdnGPZtw== -"@catena-x/portal-shared-components@^2.0.11": - version "2.0.11" - resolved "https://registry.yarnpkg.com/@catena-x/portal-shared-components/-/portal-shared-components-2.0.11.tgz#be7d24d78dc3844d53a77d03b6b25e8bb2e2a395" - integrity sha512-vFZEVlqfJS5H8VSTfWhXXlCFCbbxI66x1Fz/qw48Tp2H5h+5H83e0XcvyEePG2ldk3DvRJyl6eaZyJQ1Ncg/7w== +"@catena-x/portal-shared-components@^2.0.14": + version "2.0.14" + resolved "https://registry.yarnpkg.com/@catena-x/portal-shared-components/-/portal-shared-components-2.0.14.tgz#4892f23afedd03984e77a0e79312ceb1aed8fd8c" + integrity sha512-hjN1qx/N6I0P5UKzW5fTzgXGzjxJjfGJcBoltxq1FoB2jcN8ud4HlKPvVjYKNeRpEsA0WfQf9swFt6k3n4ldRg== dependencies: "@mui/base" "^5.0.0-beta.3" "@mui/system" "^5.13.2"