feat(osp): created new ui screens (#547)

CHANGELOG.md

@@ -33,6 +33,11 @@
 - IDP Config
   - Implementation of displaying metadata details
 
+### Feature
+
+- Onboarding Service Provider
+  - created new UI
+
 ## 1.8.0-RC6
 
 ### Change

src/assets/locales/de/registration.json

@@ -0,0 +1,47 @@
+{
+  "osp": {
+    "heading": "Registrierungszusammenfassung",
+    "companyHeading": "Firmendetails",
+    "companyMessage": "Unten finden Sie die Registrierungsdaten Ihres Unternehmens, die Ihnen von Ihrem Onboarding-Anbieter mitgeteilt wurden. Bitte überprüfen Sie die Details und fahren Sie mit der Auswahl der Unternehmensrolle unten fort, bevor Sie Ihre Registrierung absenden.",
+    "companyName": "Name der Firma",
+    "bmw": "BMW AG",
+    "street": "Hausnummer",
+    "zip": "Postleitzahl",
+    "city": "Stadt",
+    "region": "Region",
+    "country": "Land",
+    "companyRole": {
+      "title": "Rollenauswahl",
+      "subTitle": "Hinweis: Bitte wählen Sie mindestens eine Rolle aus und akzeptieren Sie die zugehörigen Geschäftsbedingungen.",
+      "TermsAndCondSpan1": "Ja, ich stimme den",
+      "TermsAndCondSpan2": "Geschäftsbedingungen",
+      "TermsAndCondSpan3": "der ausgewählten Rolle zu.",
+      "TermsAndCond2Span1": "Ja, ich stimme den",
+      "TermsAndCond2Span2": "Sicherheitsvorschriften",
+      "TermsAndCond2Span3": "der ausgewählten Rolle zu.",
+      "ACTIVE_PARTICIPANT": "Aktiver Teilnehmer",
+      "APP_PROVIDER": "App-Anbieter",
+      "SERVICE_PROVIDER": "Service-Anbieter",
+      "ONBOARDING_SERVICE_PROVIDER": "Onboarding-Anbieter",
+      "NoRolesError1": "Es ist ein Fehler aufgetreten. Keine Rollen gefunden.",
+      "NoRolesError2": " oder wenden Sie sich an den Systemadministrator.",
+      "NoRolesError": "Es ist ein Fehler aufgetreten. Keine Rollen gefunden. Bitte {{ retry }} oder wenden Sie sich an den Systemadministrator.",
+      "Please": "Bitte",
+      "Retry": "versuchen Sie es erneut"
+    },
+    "success": {
+      "heading": "Herzlichen Glückwunsch, Ihre Registrierung war erfolgreich!",
+      "description": "Wir werden Ihre Registrierung nun validieren.<br/> Der Vorgang kann ein paar Stunden dauern. In der Zwischenzeit haben Sie bereits die Möglichkeit sich umzusehen und einige <br/> Einführungsseiten zu besuchen. Beachten Sie jedoch bitte, dass der <br/> volle Zugang zum Dataspace erst verfügbar ist, sobald <br/> die Registrierung erfolgreich abgeschlossen wurde. <br /> Wenn Sie Fragen zum Registrierungsstatus haben, finden Sie den aktuellen Status<br/>unten.",
+      "stepTitle": "Status:",
+      "homepage": "Startseite"
+    },
+    "error": {
+      "heading": "Fehler 500: Serverfehler",
+      "description": "Auf unserer Seite ist etwas schief gelaufen. Es liegen technische Schwierigkeiten vor.<br/>Bitte versuchen Sie es in ein paar Augenblicken noch einmal. Wenn das Problem weiterhin besteht, wenden Sie sich bitte an unser Support-Team.<br/><br/>Alle Details und mögliche erneute Auslöser finden Sie unten:",
+      "retry": "Bestätigung erneut versuchen",
+      "back": "zurück zur vorherigen Seite"
+    },
+    "submitError": "Bitte stimmen Sie allen Geschäftsbedingungen der ausgewählten Unternehmensrolle(n) zu, bevor Sie mit dem nächsten Schritt fortfahren.",
+    "helpText": "Wenn Sie Fragen zu Ihrer Registrierung haben, wenden Sie sich bitte an unseren Helpdesk:<br /> [email protected] <br /> oder an den Plattformadministrator: <br />“[email protected]"
+  }
+}

src/assets/locales/en/registration.json

@@ -0,0 +1,47 @@
+{
+  "osp": {
+    "heading": "Registration Summary",
+    "companyHeading": "Company Details",
+    "companyMessage": "Below you can find your company registration details shared by your onboarding provider. Please review the details and proceed to the Company Role selection below before submitting your registration.",
+    "companyName": "Company Name",
+    "bmw": "BMW AG",
+    "street": "Street & Number",
+    "zip": "ZIP",
+    "city": "City",
+    "region": "Region",
+    "country": "Country",
+    "companyRole": {
+      "title": "Role Selection",
+      "subTitle": "Note: Please select at least one role and accept the associated terms and conditions.",
+      "TermsAndCondSpan1": "Yes, I agree to the",
+      "TermsAndCondSpan2": "terms and conditions",
+      "TermsAndCondSpan3": "of the selected role.",
+      "TermsAndCond2Span1": "Yes, I agree to the",
+      "TermsAndCond2Span2": "security regulations",
+      "TermsAndCond2Span3": "of the selected role.",
+      "ACTIVE_PARTICIPANT": "Active Participant",
+      "APP_PROVIDER": "App Provider",
+      "SERVICE_PROVIDER": "Service Provider",
+      "ONBOARDING_SERVICE_PROVIDER": "Onboarding Service Provider",
+      "NoRolesError1": "An error occured. No roles found.",
+      "NoRolesError2": " or contact the system administrator.",
+      "NoRolesError": "An error occured. No roles found. Please {{ retry }} or contact the system administrator.",
+      "Please": "Please",
+      "Retry": "retry"
+    },
+    "success": {
+      "heading": "Congratulations, your registration  has been successfull!",
+      "description": "We will now validate your registration.<br/> The process might take a couple of hours, in the meantime you might wanna check <br/> out some introduction pages already, but note that the complete dataspace <br/> functions will only be available as soon as the registration is successfully finished. <br/> If you are corrious about the registration state, you can find the current status<br/>below.",
+      "stepTitle": "Status:",
+      "homepage": "Get to home"
+    },
+    "error": {
+      "heading": "Error 500 : Server Error",
+      "description": "Something went wrong on our side. We’re experiencing technical difficulities.<br/>Please try the call once again in a couple of moments. If the problem persists, feel<br/>free to reach out to our support team for assistance.<br/><br/>All details and possible retriggers are shared below:",
+      "retry": "Retry confirmation",
+      "back": "Back to previous page"
+    },
+    "submitError": "Please agree to all Terms & Conditions of the selected company role(s) before proceeding to the next step.",
+    "helpText": "If you have any questions regarding your registration please contact our helpdesk:<br /> [email protected] <br /> or contact the platform administrator: <br />“[email protected]"
+  }
+}

src/components/Main.tsx

@@ -28,7 +28,7 @@ import { useTranslation } from 'react-i18next'
 import AccessService from '../services/AccessService'
 import MainOverlay from './MainOverlay'
 import { show } from 'features/control/overlay'
-import { OVERLAYS, PAGES } from 'types/Constants'
+import { type OVERLAYS, PAGES } from 'types/Constants'
 import MainNotify from './MainNotify'
 import MainSearchOverlay from './shared/frame/SearchOverlay'
 import { MenuInfo } from './pages/Home/components/MenuInfo'
@@ -41,6 +41,7 @@ import './styles/main.scss'
 import RegistrationStatus from './pages/RegistrationStatus'
 import Logout from './pages/Logout'
 import Redirect from './actions/Redirect'
+import { OSPConsent } from './pages/OSPConsent'
 
 export default function Main() {
   document.title = useTranslation().t('title')
@@ -50,6 +51,14 @@ export default function Main() {
   const { data, isLoading } = useFetchApplicationsQuery()
   const companyData = data?.[0]
 
+  const renderSection = () => {
+    return companyData?.applicationType === ApplicationType.INTERNAL ? (
+      <RegistrationStatus />
+    ) : (
+      <OSPConsent />
+    )
+  }
+
   useEffect(() => {
     const overlay = searchParams.get('overlay')?.split(':')
     overlay && dispatch(show(overlay[0] as OVERLAYS, overlay[1]))
@@ -70,21 +79,15 @@ export default function Main() {
     ].includes(companyData.applicationStatus) &&
     !location.search.includes('overlay=consent_osp')
   ) {
-    if (companyData.applicationType === ApplicationType.INTERNAL) {
-      return (
-        <>
-          <Header main={[]} user={AccessService.userMenuReg()} />
-          <MainSearchOverlay />
-          {window.location.pathname === '/logout' ? (
-            <Logout />
-          ) : (
-            <RegistrationStatus />
-          )}
-          <Footer pages={AccessService.footerMenu()} />
-          <MenuInfo main={[]} />
-        </>
-      )
-    } else dispatch(show(OVERLAYS.CONSENT_OSP))
+    return (
+      <>
+        <Header main={[]} user={AccessService.userMenuReg()} />
+        <MainSearchOverlay />
+        {location.pathname === '/logout' ? <Logout /> : renderSection()}
+        <Footer pages={AccessService.footerMenu()} />
+        <MenuInfo main={[]} />
+      </>
+    )
   }
 
   return (