fix(marketplace): display tech user terms info on subscribe request o…

…verlay

src/assets/locales/de/main.json

@@ -1467,7 +1467,8 @@
       "statusHeading": "Für eine bessere Transparenz wird die Abonnementstatusleiste auf der App-Detailseite verfügbar sein. Sie können den Abonnementstatus überprüfen, wenn Sie die App-Detailseite über den App-Marktplatz öffnen.",
       "desc8": "Der gesamte Vorgang wird voraussichtlich innerhalb von 5 Werktagen abgeschlossen sein.",
       "desc9": "Vielen Dank, dass Sie sich für den Service entschieden haben.",
-      "errorMessage": "Das Abonnement war nicht erfolgreich; Bitte wenden Sie sich an Ihren Administrator."
+      "errorMessage": "Das Abonnement war nicht erfolgreich; Bitte wenden Sie sich an Ihren Administrator.",
+      "techUserTerms": "Durch die Bestätigung der Bedingungen akzeptieren Sie, dass der technische Benutzer im Eigentum des Dienstanbieters für Sie erstellt wird"
     },
     "techUser": {
       "details": {

src/assets/locales/en/main.json

@@ -1467,7 +1467,8 @@
       "statusHeading": "For a better transparency, the subscription status bar will be available in the app detail page - you can check the subscription status when opening the app detail page from the app marketplace.",
       "desc8": "The entire process is expected to complete within 5 business days.",
       "desc9": "Thank you for choosing the service.",
-      "errorMessage": "The subscription was unsuccessful; please contact your administrator."
+      "errorMessage": "The subscription was unsuccessful; please contact your administrator.",
+      "techUserTerms": "By confirming the terms, you accept the technical user will be created for you under the ownership of the service provider"
     },
     "techUser": {
       "details": {

src/components/overlays/AppMarketplaceRequest/index.tsx

@@ -33,6 +33,7 @@ import { useState } from 'react'
 import {
   useAddSubscribeAppMutation,
   useFetchAgreementsQuery,
+  useFetchAppDetailsQuery,
 } from 'features/apps/apiSlice'
 import { closeOverlay } from 'features/control/overlay'
 import './style.scss'
@@ -45,6 +46,7 @@ export default function AppMarketplaceRequest({ id }: { id: string }) {
   const { t } = useTranslation()
   const dispatch = useDispatch()
   const { data: agreements } = useFetchAgreementsQuery(id ?? '')
+  const { data: item } = useFetchAppDetailsQuery(id)
   const [addSubscribeApp] = useAddSubscribeAppMutation()
 
   const [checkedAgreementsIds, setCheckedAgreementsIds] = useState<string[]>([])
@@ -142,6 +144,11 @@ export default function AppMarketplaceRequest({ id }: { id: string }) {
             <Typography variant="h5">
               {t('content.appMarketplace.termsHeading')}
             </Typography>
+            {item?.displayTechnicalUser && (
+              <Typography variant="body2" sx={{ mb: '20px' }}>
+                {t('content.appMarketplace.techUserTerms')}
+              </Typography>
+            )}
             {agreements && agreements.length > 0 ? (
               <ul className="agreements-list">
                 {agreements?.map((agreement, index) => (

src/components/overlays/ServiceRequest/index.tsx

@@ -37,6 +37,7 @@ import { closeOverlay } from 'features/control/overlay'
 import './style.scss'
 import { error } from 'services/NotifyService'
 import { AgreementStatus } from '../UpdateCompanyRole'
+import { useFetchServiceDetailsQuery } from 'features/serviceSubscription/serviceSubscriptionApiSlice'
 
 export default function ServiceRequest({ id }: { id: string }) {
   const { t } = useTranslation()
@@ -46,6 +47,7 @@ export default function ServiceRequest({ id }: { id: string }) {
     []
   )
   const { data: serviceAgreements } = useFetchAgreementsQuery(id ?? '')
+  const { data: item } = useFetchServiceDetailsQuery(id)
   const [addSubscribeService] = useAddSubscribeServiceMutation()
   const [serviceSubscriptionOverlay, setServiceSubscriptionOverlay] =
     useState<boolean>(true)
@@ -121,6 +123,11 @@ export default function ServiceRequest({ id }: { id: string }) {
             <Typography variant="h5">
               {t('content.serviceMarketplace.termsHeading')}
             </Typography>
+            {item?.displayTechnicalUser && (
+              <Typography variant="body2" sx={{ mb: '20px' }}>
+                {t('content.appMarketplace.techUserTerms')}
+              </Typography>
+            )}
             {serviceAgreements && serviceAgreements.length > 0 ? (
               <ul className="agreements-list">
                 {serviceAgreements?.map((agreement, index) => (

src/features/apps/types.ts

@@ -155,6 +155,7 @@ export type AppDetails = AppMarketplaceApp & {
     [key: string]: string[] | null
   }
   offerSubscriptionDetailData?: OfferSubscriptionDataType[]
+  displayTechnicalUser: boolean
 }
 
 export type Documents = {

src/features/serviceSubscription/serviceSubscriptionApiSlice.ts

@@ -144,6 +144,7 @@ export interface ServiceDetailsResponse {
   images: string[]
   privacyPolicies: PrivacyPolicyType[]
   documents: Documents
+  displayTechnicalUser: boolean
 }
 
 export interface SubscriptionServiceRequestType {