Feature/add samples and external product templates

client/package.json

@@ -39,7 +39,7 @@
     "@public-ui/components": "1.1.16",
     "@public-ui/core": "1.1.16",
     "@public-ui/themes": "1.1.16",
-    "antd": "^5.3.0",
+    "antd": "^5.13.2",
     "axios": "^0.25.0",
     "caniuse-lite": "^1.0.30001452",
     "dayjs": "1.10.4",

client/public/locales/de/translation.json

@@ -33,6 +33,7 @@
     "sourceReference": "Quellenverweis"
   },
   "text": {
+    "insertTopicDescription": "Themenbeschreibungen einfügen",
     "generateNavigation": "Erstelle Navigation"
   }
 }

client/src/components/Breadcrumbs.tsx

@@ -39,7 +39,7 @@ export function Breadcrumbs() {
 
       setCurrentSelectedKeys(navigationPathKeys);
       setOpenKeys(navigationPathKeys);
-      console.log('navigationPathKeys', navigationPathKeys);
+      // console.log('navigationPathKeys', navigationPathKeys);
 
       let extraBreadcrumbItems = [];
 

client/src/components/header/SiteHeader.tsx

@@ -38,7 +38,7 @@ export const SiteHeader = (props: any) => {
       label: (
         <LinkWithQuery
           to="/documentation"
-          class={!tailoringParameter.projectTypeId ? 'disable-link' : ''}
+          className={!tailoringParameter.projectTypeId ? 'disable-link' : ''}
           disabled={!tailoringParameter.projectTypeId}
         >
           Dokumentation
@@ -52,7 +52,7 @@ export const SiteHeader = (props: any) => {
       label: (
         <LinkWithQuery
           to="/productTemplates"
-          class={!tailoringParameter.projectTypeId ? 'disable-link' : ''}
+          className={!tailoringParameter.projectTypeId ? 'disable-link' : ''}
           disabled={!tailoringParameter.projectTypeId}
         >
           Produktvorlagen
@@ -66,7 +66,7 @@ export const SiteHeader = (props: any) => {
       label: (
         <LinkWithQuery
           to="/info"
-          class={!tailoringParameter.modelVariantId ? 'disable-link' : ''}
+          className={!tailoringParameter.modelVariantId ? 'disable-link' : ''}
           disabled={!tailoringParameter.modelVariantId}
         >
           Info

client/src/components/projekthandbuch/documentation/content/Content.tsx

@@ -85,7 +85,6 @@ export function Content() {
   useEffect(() => {
     async function mount() {
       if (productDisciplineId) {
-        console.log('test');
         const content = await getProductDisciplineContent();
         setSelectedPageEntry(content);
       }
@@ -1835,7 +1834,6 @@ export function Content() {
   }
 
   async function getTemplatesContent(): Promise<PageEntry> {
-    console.log('templateDisciplineId', templateDisciplineId);
     const disciplineId = templateDisciplineId?.replace('td_', '');
     // get all products with externalTemplate info for templateDisciplineId
 
@@ -1860,7 +1858,6 @@ export function Content() {
 
     for (const product of productEntries) {
       const externalTemplateEntries = product.getElementsByTagName('ExterneKopiervorlageRef');
-      console.log('externalTemplateEntries', externalTemplateEntries);
 
       for (const externalTemplateEntry of externalTemplateEntries) {
         // <ExterneKopiervorlageRef id="5f83148a786ca0b" name="Arbeitsauftragsliste"/>

client/src/components/projekthandbuch/documentation/content/PageEntryContent.tsx

@@ -1,4 +1,4 @@
-import { Table, TableProps } from 'antd';
+import { Table } from 'antd';
 import parse from 'html-react-parser';
 import React from 'react';
 // import { TableEntry } from '@dipa-projekt/projektassistent-openapi';
@@ -10,10 +10,10 @@ import { useDocumentation } from '../../../../context/DocumentationContext';
 export function PageEntryContent() {
   const { selectedPageEntry } = useDocumentation();
 
-  const onChange: TableProps<any>['onChange'] = (pagination, filters, sorter, extra) => {
-    console.log('params', pagination, filters, sorter, extra);
-  };
-  console.log('PageEntryContent subPageEntries', selectedPageEntry);
+  // const onChange: TableProps<any>['onChange'] = (pagination, filters, sorter, extra) => {
+  //   console.log('params', pagination, filters, sorter, extra);
+  // };
+  // console.log('PageEntryContent subPageEntries', selectedPageEntry);
 
   return (
     <div>

client/src/components/projekthandbuch/documentation/content/SubEntries.tsx

@@ -135,8 +135,6 @@ export function SubEntries(props: { data: PageEntry }) {
     async function mount() {
       const subPageEntriesData: PageEntry[] = [];
       if (props.data?.subPageEntries && props.data.subPageEntries.length > 0) {
-        console.log('SubEntries subPageEntries', props.data.subPageEntries);
-
         for (const menuEntryChildren of props.data?.subPageEntries as PageEntry[]) {
           subPageEntriesData.push(await getTopicContent(menuEntryChildren?.id));
         }

client/src/components/projekthandbuch/documentation/content/TableEntriesList.tsx

@@ -8,8 +8,6 @@ import { DataEntry } from '../Documentation';
 export function TableEntriesList(props: { inputData: DataEntry[] }) {
   const entries: JSX.Element[] = [];
 
-  console.log('TableEntriesList', props.inputData);
-
   props.inputData.map((entryItem: DataEntry) => {
     if (Array.isArray(entryItem)) {
       for (const entrySubItem of entryItem) {

client/src/components/projekthandbuch/documentation/navigation/Navigation.tsx

@@ -49,6 +49,7 @@ export enum NavTypeEnum {
   PROJECT_CHARACTERISTIC = 'projectCharacteristic',
   TEMPLATE_DISCIPLINE = 'templateDiscipline',
   PRODUCT_DISCIPLINE = 'productDiscipline',
+  SAMPLE_TEXT = 'sampleText',
 }
 
 export enum IndexTypeEnum {
@@ -101,6 +102,15 @@ export interface Section {
   children: Section[];
 }
 
+// TODO: OpenApi
+export interface SectionDetail {
+  generatedContent: string;
+  replacedContent?: NavMenuItem[];
+  mergedChildren?: NavMenuItem[];
+  addedChildren?: NavMenuItem[];
+  indexItem?: { key: string; label: string; onClick: () => any };
+}
+
 export type NavMenuItem = {
   key: string;
   label: string;
@@ -163,7 +173,7 @@ export function Navigation() {
 
   function handleSelectedItem(key: string) {
     setSelectedItemKey(key);
-    console.log('location', location);
+    // console.log('location', location);
     navigate(`/documentation/${key}${getSearchStringFromHash()}`);
   }
 
@@ -177,9 +187,9 @@ export function Navigation() {
           let foundInGeneratedChildren = false;
 
           if (currentGeneratedChildren.length > 0) {
-            const gefunden = getMenuItemByAttributeValue(currentGeneratedChildren, 'key', child.key);
-            if (gefunden) {
-              item.children![i] = gefunden;
+            const foundMenuItem = getMenuItemByAttributeValue(currentGeneratedChildren, 'key', child.key);
+            if (foundMenuItem) {
+              item.children[i] = foundMenuItem;
               foundInGeneratedChildren = true;
             }
           }
@@ -198,14 +208,14 @@ export function Navigation() {
               currentGeneratedChildren = test.mergedChildren;
 
               // TODO: für das erste muss das auch gemacht werden... vllt sollte man es daher rausziehen
-              const gefunden = getMenuItemByAttributeValue(currentGeneratedChildren, 'key', child.key);
-              if (gefunden) {
-                item.children![i] = gefunden;
+              const foundMenuItem = getMenuItemByAttributeValue(currentGeneratedChildren, 'key', child.key);
+              if (foundMenuItem) {
+                item.children[i] = foundMenuItem;
               }
             } else if (test.addedChildren) {
               child.children = test.addedChildren;
             } else if (test.indexItem) {
-              item.children![i] = test.indexItem;
+              item.children[i] = test.indexItem;
             }
           }
           i++;
@@ -224,7 +234,7 @@ export function Navigation() {
     return items;
   }
 
-  async function fetchSectionDetailsData(childItem: NavMenuItem): Promise<any> {
+  async function fetchSectionDetailsData(childItem: NavMenuItem): Promise<SectionDetail> {
     const sectionId = childItem.key;
 
     if (!tailoringParameter.modelVariantId) {
@@ -241,26 +251,26 @@ export function Navigation() {
     const jsonDataFromXml = await getJsonDataFromXml(sectionDetailUrl);
 
     const generatedContent = jsonDataFromXml.attributes.GenerierterInhalt;
-    const wirdErsetzt = jsonDataFromXml.attributes.WirdErsetzt;
+    const isReplaced = jsonDataFromXml.attributes.WirdErsetzt;
 
     let replacedContent;
     let mergedChildren; // for merging children
-    let addedChildren: NavMenuItem[]; // for adding children
+    let addedChildren; // for adding children
 
     // TODO: anders lösen
     let indexItem;
 
     // const xmlDataWithParent = addParentRecursive([jsonDataFromXml]);
-    if (wirdErsetzt === 'Ja') {
-      if (generatedContent === 'Elemente:Produkte_mit_Themen_nach_Disziplinen') {
+    if (isReplaced === 'Ja') {
+      if (generatedContent === 'Elemente:Produkte_mit_Themen_nach_Disziplinen' && childItem.parent) {
         replacedContent = await getReferenceProducts(childItem.parent);
       } else {
         console.log('muss noch ersetzt werden', jsonDataFromXml);
       }
     }
 
     if (generatedContent) {
-      if (generatedContent === 'Spezialkapitel:Disziplingruppe') {
+      if (generatedContent === 'Spezialkapitel:Disziplingruppe' && childItem.parent) {
         // TODO
         const disciplineIds = await getDisciplineIds();
         addedChildren = getDisciplineGroup(childItem.parent, jsonDataFromXml).filter((navMenuItem) =>
@@ -374,7 +384,6 @@ export function Navigation() {
     return {
       // text: textPart,
       generatedContent: generatedContent,
-      wirdErsetzt: wirdErsetzt,
       // generierterInhaltErsetzend: generierterInhaltErsetzend,
       replacedContent: replacedContent,
       mergedChildren: mergedChildren,
@@ -519,16 +528,20 @@ export function Navigation() {
         // in Kapitel the role entries are named "Projektrollen", "Organisationsrollen" and "Projektteamrollen"
         // in Rollenkategorie they are named im singular "Projektrolle", "Organisationsrolle" and "Projektteamrolle"
         const roleCategoryName = roleCategoryValue.attributes.name;
-        const roleCategoryNavItem = target.children.find(
+        const roleCategoryNavItem = target.children?.find(
           (child: any) => child.label.includes(roleCategoryName) // TODO: hier macht es Probleme, dass einige Einträge schon keine attributes.titel mehr haben... besser wir ändern nicht das ursprüngliche Object
         );
 
-        const roleCategoryEntry: NavMenuItem = {
-          key: roleCategoryNavItem.key, // roleCategory has no id
-          parent: target,
-          label: roleCategoryNavItem.label,
-          onTitleClick: (item: any) => handleSelectedItem(item.key),
-        };
+        let roleCategoryEntry: NavMenuItem;
+
+        if (roleCategoryNavItem) {
+          roleCategoryEntry = {
+            key: roleCategoryNavItem.key, // roleCategory has no id
+            parent: target,
+            label: roleCategoryNavItem.label,
+            onTitleClick: (item: any) => handleSelectedItem(item.key),
+          };
+        }
 
         // TODO: über Variablen lösen?!
         let navTypeRole: NavTypeEnum;
@@ -565,6 +578,15 @@ export function Navigation() {
   }
 
   async function getDecisionPoints(target: NavMenuItem): Promise<NavMenuItem[]> {
+    // TODO: getUrl as function
+    if (
+      !weitApiUrl ||
+      !tailoringParameter.modelVariantId ||
+      !tailoringParameter.projectTypeId ||
+      !tailoringParameter.projectTypeVariantId
+    ) {
+      return [];
+    }
     const decisionPointsUrl =
       weitApiUrl +
       '/Tailoring/V-Modellmetamodell/mm_2021/V-Modellvariante/' +
@@ -574,7 +596,7 @@ export function Navigation() {
       '/Projekttypvariante/' +
       tailoringParameter.projectTypeVariantId +
       '/Entscheidungspunkt?' +
-      getProjectFeaturesQueryString();
+      String(getProjectFeaturesQueryString());
 
     const jsonDataFromXml = await getJsonDataFromXml(decisionPointsUrl);
 

client/src/components/projekthandbuch/produktvorlagen/SubmitArea.tsx

@@ -7,9 +7,18 @@ import { ProductOfProject } from '@dipa-projekt/projektassistent-openapi/dist/mo
 import API from '../../../api';
 import { AjaxResponse } from 'rxjs/ajax';
 import { TemplateFormModal } from './TemplateFormModal';
+import { useTranslation } from 'react-i18next';
+import { BookTwoTone } from '@ant-design/icons';
 
 export function SubmitArea() {
-  const { checkedKeys, productsMap, insertTopicDescription, setInsertTopicDescription } = useTemplate();
+  const { t } = useTranslation();
+
+  const {
+    checkedKeys,
+    productsMap,
+    insertTopicDescription,
+    setInsertTopicDescription,
+  } = useTemplate();
 
   const [modalVisible, setModalVisible] = useState(false);
 
@@ -41,28 +50,46 @@ export function SubmitArea() {
     } as MultiProducts;
   }
 
-  function getChaptersData(topics: { title: string; text: string }[]) {
+  function getChaptersWithSamplesData(
+    topics: { title: string; text: string; samples: { id: string; title: string; text: string }[] }[]
+  ): {
+    text?: string;
+    title: string;
+    samplesText?: string;
+  }[] {
     if (insertTopicDescription) {
-      return topics;
-    } else {
-      return topics.map((obj) => ({ ...obj, text: undefined }));
+      return topics.map(({ samples, ...keepAttrs }) => ({
+        ...keepAttrs,
+        text: keepAttrs.text,
+        samplesText: samples
+          .filter((sample) => checkedKeys.checked.includes(sample.id))
+          .map((sample) => sample.text)
+          .join('\n'),
+      }));
     }
+    return topics.map(({ samples, ...keepAttrs }) => ({
+      ...keepAttrs,
+      text: samples.map((sample) => sample.text).join('\n'),
+    }));
   }
 
   function doSubmit(): void {
     setModalVisible(true);
 
     const productOfProjectMap = new Map<string, ProductOfProject>();
 
-    for (const checkedKey of checkedKeys) {
+    for (const checkedKey of checkedKeys.checked) {
       const product = productsMap.get(checkedKey);
       if (product) {
         productOfProjectMap.set(product.product.id, {
           productName: product.product.title,
           disciplineName: product.discipline.title,
           responsible: '',
           participants: [],
-          chapters: getChaptersData(product.topics),
+          chapters: getChaptersWithSamplesData(product.topics),
+          externalCopyTemplates: product.externalCopyTemplates.filter((externalCopyTemplate) =>
+            checkedKeys.checked.includes(externalCopyTemplate.id)
+          ),
         });
       }
     }
@@ -80,8 +107,6 @@ export function SubmitArea() {
   }
 
   const handleClose = (values: { projectName: string; responsible: string; participants: string[] }) => {
-    console.log('Received values of form: ', values);
-
     setModalVisible(false);
 
     if (values) {
@@ -136,15 +161,10 @@ export function SubmitArea() {
   return (
     <>
       <div className="sticky-wrapper" style={{ padding: '24px' }}>
-        {/*TODO: reinsert if there are Mustertexte available*/}
-        {/*<Form.Item style={{ marginTop: '30px' }}>*/}
-        {/*  <Checkbox>*/}
-        {/*    <Tag color="red">Mustertexte</Tag> einfügen*/}
-        {/*  </Checkbox>*/}
-        {/*</Form.Item>*/}
-        <Form.Item>
+        <Form.Item style={{ marginBottom: '0' }}>
           <Checkbox checked={insertTopicDescription} onChange={onChangeInsertTopicDescription}>
-            Themenbeschreibungen einfügen
+            <BookTwoTone twoToneColor="#389e0d" style={{ marginRight: '5px' }} />
+            {t('text.insertTopicDescription')}
           </Checkbox>
         </Form.Item>
         <Form.Item {...buttonItemLayout}>
@@ -153,7 +173,7 @@ export function SubmitArea() {
             htmlType="submit"
             onClick={() => doSubmit()}
             style={{ marginRight: '8px', marginTop: '20px' }}
-            disabled={checkedKeys.length === 0}
+            disabled={checkedKeys?.checked?.length === 0}
           >
             Vorlagen erzeugen
           </Button>