Merge pull request #160 from vishnoianil/knowledge-improvements

Improves following in the knowledge submission form

Author: nerdalert

src/components/Contribute/Knowledge/AttributionInformation/AttributionInformation.tsx

@@ -136,7 +136,7 @@ const AttributionInformation: React.FC<Props> = ({
           titleText={{
             text: (
               <p>
-                Attribution Info <span style={{ color: 'red' }}>*</span>
+                Attribution Information <span style={{ color: 'red' }}>*</span>
               </p>
             ),
             id: 'attribution-info-id'

src/components/Contribute/Knowledge/AuthorInformation/AuthorInformation.tsx

@@ -58,7 +58,7 @@ const AuthorInformation: React.FC<Props> = ({ reset, knowledgeFormData, setDisab
           titleText={{
             text: (
               <p>
-                Author Info <span style={{ color: 'red' }}>*</span>
+                Author Information <span style={{ color: 'red' }}>*</span>
               </p>
             ),
             id: 'author-info-id'

src/components/Contribute/Knowledge/DocumentInformation/DocumentInformation.tsx

@@ -212,7 +212,7 @@ const DocumentInformation: React.FC<Props> = ({
           titleText={{
             text: (
               <p>
-                Document Info <span style={{ color: 'red' }}>*</span>
+                Document Information <span style={{ color: 'red' }}>*</span>
               </p>
             ),
             id: 'doc-info-id'

src/components/Contribute/Knowledge/FilePathInformation/FilePathInformation.tsx

@@ -18,7 +18,7 @@ const FilePathInformation: React.FC<Props> = ({ reset, path, setFilePath }) => {
           titleText={{
             text: (
               <p>
-                File Path Info <span style={{ color: 'red' }}>*</span>
+                Taxonomy Directory Path <span style={{ color: 'red' }}>*</span>
               </p>
             ),
             id: 'file-path-info-id'

src/components/Contribute/Knowledge/KnowledgeInformation/KnowledgeInformation.tsx

@@ -94,7 +94,7 @@ const KnowledgeInformation: React.FC<Props> = ({
           titleText={{
             text: (
               <p>
-                Knowledge Info <span style={{ color: 'red' }}>*</span>
+                Knowledge Information <span style={{ color: 'red' }}>*</span>
               </p>
             ),
             id: 'knowledge-info-id'

src/components/Contribute/Knowledge/KnowledgeQuestionAnswerPairs/KnowledgeQuestionAnswerPairs.tsx

@@ -1,8 +1,7 @@
 import React from 'react';
 import { FormFieldGroupExpandable, FormFieldGroupHeader, FormGroup, FormHelperText } from '@patternfly/react-core/dist/dynamic/components/Form';
 import { TextArea } from '@patternfly/react-core/dist/dynamic/components/TextArea';
-import { Button } from '@patternfly/react-core/dist/dynamic/components/Button';
-import { TrashIcon, PlusCircleIcon, ExclamationCircleIcon } from '@patternfly/react-icons/dist/dynamic/icons/';
+import { ExclamationCircleIcon } from '@patternfly/react-icons/dist/dynamic/icons/';
 import { QuestionAndAnswerPair, SeedExample } from '..';
 import { ValidatedOptions } from '@patternfly/react-core/dist/esm/helpers/constants';
 import { HelperText } from '@patternfly/react-core/dist/dynamic/components/HelperText';
@@ -17,8 +16,6 @@ interface Props {
   handleQuestionBlur: (seedExampleIndex: number, questionAndAnswerIndex: number) => void;
   handleAnswerInputChange: (seedExampleIndex: number, questionAndAnswerIndex: number, answerValue: string) => void;
   handleAnswerBlur: (seedExampleIndex: number, questionAndAnswerIndex: number) => void;
-  deleteQuestionAnswerPair: (seedExampleIndex: number, questionAnswerIndex: number) => void;
-  addQuestionAnswerPair: (seedExampleIndex: number) => void;
 }
 
 const KnowledgeQuestionAnswerPairs: React.FC<Props> = ({
@@ -29,9 +26,7 @@ const KnowledgeQuestionAnswerPairs: React.FC<Props> = ({
   handleQuestionInputChange,
   handleQuestionBlur,
   handleAnswerInputChange,
-  handleAnswerBlur,
-  deleteQuestionAnswerPair,
-  addQuestionAnswerPair
+  handleAnswerBlur
 }) => {
   return (
     <FormGroup key={seedExampleIndex}>
@@ -72,13 +67,6 @@ const KnowledgeQuestionAnswerPairs: React.FC<Props> = ({
                 ),
                 id: 'nested-field-group1-titleText-id'
               }}
-              actions={
-                !seedExample.questionAndAnswers[questionAnswerIndex].immutable && (
-                  <Button variant="plain" aria-label="Remove" onClick={() => deleteQuestionAnswerPair(seedExampleIndex, questionAnswerIndex)}>
-                    <TrashIcon />
-                  </Button>
-                )
-              }
             />
           }
         >
@@ -128,11 +116,6 @@ const KnowledgeQuestionAnswerPairs: React.FC<Props> = ({
           </React.Fragment>
         </FormFieldGroupExpandable>
       ))}
-      <div style={{ marginTop: '10px', marginBottom: '20px', textAlign: 'right' }}>
-        <Button variant="link" onClick={() => addQuestionAnswerPair(seedExampleIndex)}>
-          <PlusCircleIcon /> Add Q&A Pair
-        </Button>
-      </div>
     </FormGroup>
   );
 };

src/components/Contribute/Knowledge/KnowledgeSeedExample/KnowledgeSeedExample.tsx

@@ -1,7 +1,5 @@
 import React from 'react';
 import { FormFieldGroupExpandable, FormFieldGroupHeader } from '@patternfly/react-core/dist/dynamic/components/Form';
-import { Button } from '@patternfly/react-core/dist/dynamic/components/Button';
-import { TrashIcon, PlusCircleIcon } from '@patternfly/react-icons/dist/dynamic/icons/';
 import KnowledgeQuestionAnswerPairs from '../KnowledgeQuestionAnswerPairs/KnowledgeQuestionAnswerPairs';
 import { SeedExample } from '..';
 
@@ -13,10 +11,6 @@ interface Props {
   handleQuestionBlur: (seedExampleIndex: number, questionAndAnswerIndex: number) => void;
   handleAnswerInputChange: (seedExampleIndex: number, questionAndAnswerIndex: number, answerValue: string) => void;
   handleAnswerBlur: (seedExampleIndex: number, questionAndAnswerIndex: number) => void;
-  deleteQuestionAnswerPair: (seedExampleIndex: number, questionAnswerIndex: number) => void;
-  addQuestionAnswerPair: (seedExampleIndex: number) => void;
-  addSeedExample: () => void;
-  deleteSeedExample: (seedExampleIndex: number) => void;
 }
 
 const KnowledgeSeedExample: React.FC<Props> = ({
@@ -26,11 +20,7 @@ const KnowledgeSeedExample: React.FC<Props> = ({
   handleQuestionInputChange,
   handleQuestionBlur,
   handleAnswerInputChange,
-  handleAnswerBlur,
-  deleteQuestionAnswerPair,
-  addQuestionAnswerPair,
-  addSeedExample,
-  deleteSeedExample
+  handleAnswerBlur
 }) => {
   return (
     <FormFieldGroupExpandable
@@ -66,13 +56,6 @@ const KnowledgeSeedExample: React.FC<Props> = ({
                 id: 'nested-field-group1-titleText-id'
               }}
               titleDescription="Please enter context and at least 3 Q&A pairs for the seed example."
-              actions={
-                !seedExample.immutable && (
-                  <Button variant="plain" aria-label="Remove" onClick={() => deleteSeedExample(seedExampleIndex)}>
-                    <TrashIcon />
-                  </Button>
-                )
-              }
             />
           }
         >
@@ -85,14 +68,9 @@ const KnowledgeSeedExample: React.FC<Props> = ({
             handleQuestionBlur={handleQuestionBlur}
             handleAnswerInputChange={handleAnswerInputChange}
             handleAnswerBlur={handleAnswerBlur}
-            deleteQuestionAnswerPair={deleteQuestionAnswerPair}
-            addQuestionAnswerPair={addQuestionAnswerPair}
           />
         </FormFieldGroupExpandable>
       ))}
-      <Button variant="link" onClick={addSeedExample}>
-        <PlusCircleIcon /> Add Seed Example
-      </Button>
     </FormFieldGroupExpandable>
   );
 };

src/components/Contribute/Knowledge/index.tsx

@@ -331,54 +331,6 @@ export const KnowledgeForm: React.FunctionComponent<KnowledgeFormProps> = ({ kno
     );
   };
 
-  const addQuestionAnswerPair = (seedExampleIndex: number): void => {
-    const newQuestionAnswerPair: QuestionAndAnswerPair = {
-      immutable: false,
-      question: '',
-      isQuestionValid: ValidatedOptions.default,
-      answer: '',
-      isAnswerValid: ValidatedOptions.default
-    };
-    setSeedExamples(
-      seedExamples.map((seedExample: SeedExample, index: number) =>
-        index === seedExampleIndex
-          ? {
-              ...seedExample,
-              questionAndAnswers: [...seedExample.questionAndAnswers, newQuestionAnswerPair]
-            }
-          : seedExample
-      )
-    );
-    setDisableAction(true);
-  };
-
-  const deleteQuestionAnswerPair = (seedExampleIndex: number, questionAnswerIndex: number): void => {
-    setSeedExamples(
-      seedExamples.map((seedExample: SeedExample, index: number) =>
-        index === seedExampleIndex
-          ? {
-              ...seedExample,
-              questionAndAnswers: seedExample.questionAndAnswers.filter((_, i) => i !== questionAnswerIndex)
-            }
-          : seedExample
-      )
-    );
-    setDisableAction(!checkKnowledgeFormCompletion(knowledgeFormData));
-  };
-
-  const addSeedExample = (): void => {
-    const seedExample = emptySeedExample;
-    seedExample.immutable = false;
-    seedExample.isExpanded = true;
-    setSeedExamples([...seedExamples, seedExample]);
-    setDisableAction(true);
-  };
-
-  const deleteSeedExample = (seedExampleIndex: number): void => {
-    setSeedExamples(seedExamples.filter((_, index: number) => index !== seedExampleIndex));
-    setDisableAction(!checkKnowledgeFormCompletion(knowledgeFormData));
-  };
-
   const onCloseActionGroupAlert = () => {
     setActionGroupAlertContent(undefined);
   };
@@ -485,10 +437,6 @@ export const KnowledgeForm: React.FunctionComponent<KnowledgeFormProps> = ({ kno
             handleQuestionBlur={handleQuestionBlur}
             handleAnswerInputChange={handleAnswerInputChange}
             handleAnswerBlur={handleAnswerBlur}
-            deleteQuestionAnswerPair={deleteQuestionAnswerPair}
-            addQuestionAnswerPair={addQuestionAnswerPair}
-            addSeedExample={addSeedExample}
-            deleteSeedExample={deleteSeedExample}
           />
 
           <DocumentInformation

src/utils/yamlConfig.ts

@@ -58,22 +58,20 @@ function filterEmptyContext(data: unknown): unknown {
 function trimTrailingSpaces(yamlString: string): string {
   const hasTrailingNewline = yamlString.endsWith('\n');
   const lines = yamlString.split('\n');
-  const trimmedLines = lines
-    .map((line, index) => {
-      if (index === lines.length - 1 && line === '' && hasTrailingNewline) {
-        return undefined;
-      }
-      // Preserve empty lines
-      if (line.trim() === '') return '';
-      // Trim trailing spaces, preserving indentation
-      const match = line.match(/^(\s*)(.*)$/);
-      if (match) {
-        const [, indent, content] = match;
-        return indent + content.trimEnd();
-      }
+  const trimmedLines = lines.map((line, index) => {
+    if (index === lines.length - 1 && line === '' && hasTrailingNewline) {
       return line;
-    })
-    .filter((line) => line !== undefined);
+    }
+    // Preserve empty lines
+    if (line.trim() === '') return '';
+    // Trim trailing spaces, preserving indentation
+    const match = line.match(/^(\s*)(.*)$/);
+    if (match) {
+      const [, indent, content] = match;
+      return indent + content.trimEnd();
+    }
+    return line;
+  });
 
   return trimmedLines.join('\n');
 }