feature: eservice creation step 3 (PIN-9114)

src/components/shared/DelegationTooltip.tsx

@@ -0,0 +1,36 @@
+import { type DelegationWithCompactTenants } from '@/api/api.generatedTypes'
+import { AuthHooks } from '@/api/auth'
+import { AltRoute } from '@mui/icons-material'
+import { Tooltip } from '@mui/material'
+import React from 'react'
+import { useTranslation } from 'react-i18next'
+
+type DelegationTooltipProps = {
+  delegation: DelegationWithCompactTenants
+}
+
+export const DelegationTooltip: React.FC<DelegationTooltipProps> = ({ delegation }) => {
+  const { t } = useTranslation('shared-components', { keyPrefix: 'delegationTooltip' })
+  const { jwt } = AuthHooks.useJwt()
+
+  const isDelegator = Boolean(delegation.delegator.id === jwt?.organizationId)
+  const delegator = delegation.delegator.name
+  const delegate = delegation.delegate.name
+
+  const label = isDelegator
+    ? t('label.delegator', { delegate })
+    : t('label.delegate', { delegator })
+
+  return (
+    <Tooltip title={label}>
+      <AltRoute
+        color="primary"
+        sx={{
+          rotate: '90deg',
+          height: 18,
+          width: 18,
+        }}
+      />
+    </Tooltip>
+  )
+}

src/components/shared/UploadDocumentsInterface.tsx

@@ -5,7 +5,7 @@ import { Box, Button, Stack } from '@mui/material'
 import UploadFileIcon from '@mui/icons-material/UploadFile'
 import { useTranslation } from 'react-i18next'
 
-type UploadDocumentsInterfaceFormValues = {
+export type UploadDocumentsInterfaceFormValues = {
   interfaceDoc: File | null
 }
 

src/pages/ProviderEServiceCreatePage/ProviderEServiceCreate.page.tsx

@@ -22,9 +22,9 @@ import { EServiceQueries } from '@/api/eservice'
 import { Stepper } from '@/components/shared/Stepper'
 import { EServiceCreateContextProvider } from './components/EServiceCreateContext'
 import {
-  EServiceCreateStepAttributes,
-  EServiceCreateStepAttributesSkeleton,
-} from './components/EServiceCreateStepAttributes'
+  EServiceCreateStepTechSpec,
+  EServiceCreateStepTechSpecSkeleton,
+} from './components/EServiceCreateStepTechSpec'
 import {
   EServiceCreateStepPurpose,
   EServiceCreateStepPurposeSkeleton,
@@ -77,7 +77,7 @@ const ProviderEServiceCreatePage: React.FC = () => {
       ? [
           { label: t('create.stepper.step1Label'), component: EServiceCreateStepGeneral },
           { label: t('create.stepper.step2Label'), component: EServiceCreateStepVersion },
-          { label: t('create.stepper.step3Label'), component: EServiceCreateStepAttributes },
+          { label: t('create.stepper.step3Label'), component: EServiceCreateStepTechSpec },
           { label: t('create.stepper.step4Label'), component: CreateStepDocuments },
         ]
       : [
@@ -87,7 +87,7 @@ const ProviderEServiceCreatePage: React.FC = () => {
             component: CreateStepPurpose,
           },
           { label: t('create.stepper.step2Label'), component: EServiceCreateStepVersion },
-          { label: t('create.stepper.step3Label'), component: EServiceCreateStepAttributes },
+          { label: t('create.stepper.step3Label'), component: EServiceCreateStepTechSpec },
           { label: t('create.stepper.step4Label'), component: CreateStepDocuments },
         ]
 
@@ -118,14 +118,14 @@ const ProviderEServiceCreatePage: React.FC = () => {
       ? [
           <EServiceCreateStepGeneralSkeleton key={1} />,
           <EServiceCreateStepVersionSkeleton key={2} />,
-          <EServiceCreateStepAttributesSkeleton key={3} />,
+          <EServiceCreateStepTechSpecSkeleton key={3} />,
           <CreateStepDocumentsSkeleton key={4} />,
         ]
       : [
           <EServiceCreateStepGeneralSkeleton key={1} />,
           <CreateStepPurposeSkeleton key={2} />,
           <EServiceCreateStepVersionSkeleton key={3} />,
-          <EServiceCreateStepAttributesSkeleton key={4} />,
+          <EServiceCreateStepTechSpecSkeleton key={4} />,
           <CreateStepDocumentsSkeleton key={5} />,
         ]
 

src/pages/ProviderEServiceCreatePage/components/EServiceCreateStepDocuments/EServiceCreateStepDocumentsInterface.tsx

@@ -6,11 +6,10 @@ import { EServiceDownloads, EServiceMutations } from '@/api/eservice'
 import { getDownloadDocumentName } from '@/utils/eservice.utils'
 import type { EServiceDoc } from '@/api/api.generatedTypes'
 import { AuthHooks } from '@/api/auth'
-import { UploadDocumentsInterface } from '@/components/shared/UploadDocumentsInterface'
-
-type EServiceCreateStepDocumentsInterfaceFormValues = {
-  interfaceDoc: File | null
-}
+import {
+  UploadDocumentsInterface,
+  type UploadDocumentsInterfaceFormValues,
+} from '@/components/shared/UploadDocumentsInterface'
 
 export function EServiceCreateStepDocumentsInterface() {
   const { t } = useTranslation('eservice')
@@ -21,7 +20,7 @@ export function EServiceCreateStepDocumentsInterface() {
   const { jwt } = AuthHooks.useJwt()
   const actualInterface: EServiceDoc | null = descriptor?.interface ?? null
 
-  const onSubmit = ({ interfaceDoc }: EServiceCreateStepDocumentsInterfaceFormValues) => {
+  const onSubmit = ({ interfaceDoc }: UploadDocumentsInterfaceFormValues) => {
     if (!interfaceDoc || !descriptor) return
 
     const prettyName = t('create.step4.interface.prettyName')