Merge pull request eclipse-sw360#160 from siemens/projects/add-projec…

…t/linkedReleasesAndProjects

Added dropdown for project relationship in link project

messages/en.json

@@ -734,6 +734,8 @@
         "Import Export": "Import & Export",
         "Admin": "Admin",
         "Error when processing": "Error when processing",
-        "Created moderation request": "Created moderation request"
+        "Created moderation request": "Created moderation request",
+        "Related": "Related",
+        "Is a subproject": "Is a subproject"
     }
 }

messages/ja.json

@@ -734,6 +734,9 @@
         "ENTER_VALUE_KEY": "値を入力キー",
         "Import Export": "輸入",
         "Schedule": "スケジュール",
-        "VALUE": "価値"
+        "VALUE": "価値",
+        "Complexitty": "複雑",
+        "Related": "NOT TRANSLATED",
+        "Is a subproject": "NOT TRANSLATED"
     }
 }

messages/pt-BR.json

@@ -734,6 +734,8 @@
         "ENTER_VALUE_KEY": "Insira a chave do valor",
         "Import Export": "Importar / Exportar",
         "Schedule": "Agendar",
-        "VALUE": "Valor"
+        "VALUE": "Valor",
+        "Related": "NOT TRANSLATED",
+        "Is a subproject": "NOT TRANSLATED"
     }
 }

messages/vi.json

@@ -733,6 +733,8 @@
         "ENTER_VALUE_KEY": "Nhập khóa giá trị",
         "Import Export": "Nhập khẩu",
         "Schedule": "Lịch trình",
-        "VALUE": "giá trị"
+        "VALUE": "giá trị",
+        "Related": "NOT TRANSLATED",
+        "Is a subproject": "NOT TRANSLATED"
     }
 }

messages/zh.json

@@ -733,6 +733,8 @@
         "ENTER_VALUE_KEY": "输入值键",
         "Import Export": "进口",
         "Schedule": "日程",
-        "VALUE": "价值"
+        "VALUE": "价值",
+        "Related": "NOT TRANSLATED",
+        "Is a subproject": "NOT TRANSLATED"
     }
 }

src/app/[locale]/projects/add/page.tsx

@@ -9,18 +9,17 @@
 
 'use client'
 
-import { signOut, useSession } from 'next-auth/react'
-import { useTranslations } from 'next-intl'
-import { useRouter } from 'next/navigation'
-import { useState } from 'react'
-import { Button, Col, ListGroup, Row, Tab, ToastContainer } from 'react-bootstrap'
-
 import Administration from '@/components/ProjectAddSummary/Administration'
 import LinkedReleasesAndProjects from '@/components/ProjectAddSummary/LinkedReleasesAndProjects'
 import Summary from '@/components/ProjectAddSummary/Summary'
 import { HttpStatus, InputKeyValue, Project, ToastData, Vendor } from '@/object-types'
 import { ApiUtils } from '@/utils'
+import { signOut, useSession } from 'next-auth/react'
+import { useTranslations } from 'next-intl'
 import { ToastMessage } from 'next-sw360'
+import { useRouter } from 'next/navigation'
+import { useState } from 'react'
+import { Button, Col, ListGroup, Row, Tab, ToastContainer } from 'react-bootstrap'
 
 function AddProjects() {
     const router = useRouter()

src/components/ProjectAddSummary/component/LinkedReleasesAndProjects/LinkedProjects.tsx

@@ -9,12 +9,11 @@
 
 'use client'
 
-import { useTranslations } from 'next-intl'
-import { useState } from 'react'
-
+import { Table, _ } from '@/components/sw360'
 import LinkProjectsModal from '@/components/sw360/LinkedProjectsModal/LinkProjectsModal'
 import { Project } from '@/object-types'
-import { Table } from 'next-sw360'
+import { useTranslations } from 'next-intl'
+import { useEffect, useState } from 'react'
 
 interface Props {
     projectPayload: Project
@@ -25,36 +24,85 @@ export default function LinkedProjects({ projectPayload, setProjectPayload }: Pr
     const t = useTranslations('default')
     const [showLinkedProjectsModal, setShowLinkedProjectsModal] = useState(false)
     const [linkedProjectData, setLinkedProjectData] = useState<Map<string, any>>(new Map())
+    const [tableData, setTableData] = useState<Array<any>>([])
+
+    const updateProjectData = (
+        projectId: string,
+        updatedProjectRelationship: string,
+        linkedProjectData: Map<string, any>
+    ) => {
+        try {
+            if (linkedProjectData.has(projectId)) {
+                linkedProjectData.forEach((value, key) => {
+                    if (key === projectId) {
+                        value.projectRelationship = updatedProjectRelationship
+                        setLinkedProjectData(linkedProjectData)
+                        projectPayload.linkedProjects[projectId].projectRelationship = updatedProjectRelationship
+                        const data: any = extractDataFromMap(linkedProjectData)
+                        setTableData(data)
+                    }
+                })
+            }
+        } catch (e) {
+            console.error(e)
+        }
+    }
 
     const columns = [
         {
-            id: 'tableData.name',
+            id: 'linkedProjectData.name',
             name: t('Name'),
             sort: true,
         },
         {
-            id: 'tableData.version',
+            id: 'linkedProjectData.version',
             name: t('Version'),
             sort: true,
         },
         {
-            id: 'tableData.projectRelationship',
+            id: 'linkedProjectData.projectRelationship',
             name: t('Project Relationship'),
             sort: true,
+            formatter: ({ projectRelationship, key }: { projectRelationship: string; key: string }) =>
+                _(
+                    <div className='form-dropdown'>
+                        <select
+                            className='form-select'
+                            id={projectRelationship}
+                            aria-describedby='projectRelationship'
+                            name={projectRelationship}
+                            value={projectRelationship}
+                            onChange={(event) => {
+                                const updatedProjectRelationship = event.target.value
+                                updateProjectData(key, updatedProjectRelationship, linkedProjectData)
+                            }}
+                            required
+                        >
+                            <option value='UNKNOWN'>{t('Unknown')}</option>
+                            <option value='REFERRED'>{t('Related')}</option>
+                            <option value='CONTAINED'>{t('Is a subproject')}</option>
+                            <option value='DUPLICATE'>{t('Duplicate')}</option>
+                        </select>
+                    </div>
+                ),
         },
         {
-            id: 'tableData.enableSvm',
+            id: 'linkedProjectData.enableSvm',
             name: t('Enable SVM'),
             sort: true,
         },
     ]
 
-    const extractDataFromMap = (map: Map<string, any>) => {
+    useEffect(() => {
+        const data = extractDataFromMap(linkedProjectData)
+        setTableData(data)
+    }, [linkedProjectData])
+
+    const extractDataFromMap = (linkedProjectData: Map<string, any>) => {
         const extractedData: any = []
-        map.forEach((value, key) => {
-            const interimData: any = []
-            interimData.push(value.name, value.version, value.projectRelationship, value.enableSvm, key)
-            extractedData.push(interimData)
+        linkedProjectData.forEach((value, key) => {
+            const updatedProjectRelationship = value.projectRelationship
+            extractedData.push([value.name, value.version, { updatedProjectRelationship, key }, value.enableSvm])
         })
         return extractedData
     }
@@ -76,7 +124,7 @@ export default function LinkedProjects({ projectPayload, setProjectPayload }: Pr
                     </h6>
                 </div>
                 <div style={{ paddingLeft: '0px' }}>
-                    <Table columns={columns} data={extractDataFromMap(linkedProjectData)} sort={false} />
+                    <Table columns={columns} data={tableData} sort={false} />
                 </div>
                 <div className='row' style={{ paddingLeft: '0px' }}>
                     <div className='col-lg-4'>
@@ -85,7 +133,7 @@ export default function LinkedProjects({ projectPayload, setProjectPayload }: Pr
                             className='btn btn-secondary'
                             onClick={() => setShowLinkedProjectsModal(true)}
                         >
-                            Link Projects
+                            Add Projects
                         </button>
                     </div>
                 </div>

src/components/sw360/LinkedProjectsModal/LinkProjectsModal.tsx

@@ -9,17 +9,16 @@
 
 'use client'
 
+import { HttpStatus, Project } from '@/object-types'
+import { ApiUtils, CommonUtils } from '@/utils'
 import { signOut, useSession } from 'next-auth/react'
 import { useTranslations } from 'next-intl'
+import { Table, _ } from 'next-sw360'
 import { notFound } from 'next/navigation'
 import { useRef, useState } from 'react'
 import { Alert, Button, Col, Form, Modal, OverlayTrigger, Row, Tooltip } from 'react-bootstrap'
 import { FaInfoCircle } from 'react-icons/fa'
 
-import { HttpStatus, Project } from '@/object-types'
-import { ApiUtils, CommonUtils } from '@/utils'
-import { Table, _ } from 'next-sw360'
-
 interface AlertData {
     variant: string
     message: JSX.Element