Merge pull request #121 from MuhammadKurdi-CS/issue/#114/refactor-ski…

…ll-description refactored the skill description
instructlab · Sep 2, 2024 · 2e3b585 · 2e3b585
2 parents d4ab33b + 26c3aac
commit 2e3b585
Show file tree

Hide file tree

Showing 3 changed files with 20 additions and 12 deletions.
diff --git a/src/components/Contribute/Skill/SkillDescription/SkillDescription.tsx b/src/components/Contribute/Skill/SkillDescription/SkillDescription.tsx
@@ -0,0 +1,18 @@
+import React from 'react';
+import SkillDescriptionContent from './SkillDescriptionContent';
+import { FormFieldGroupExpandable, FormFieldGroupHeader } from '@patternfly/react-core/dist/dynamic/components/Form';
+
+const SkillDescription: React.FC = () => {
+  return (
+    <FormFieldGroupExpandable
+      toggleAriaLabel="Details"
+      header={
+        <FormFieldGroupHeader titleText={{ text: 'Skills Description', id: 'skills-description' }} titleDescription="What are InstructLab Skills?" />
+      }
+    >
+      <SkillDescriptionContent />
+    </FormFieldGroupExpandable>
+  );
+};
+
+export default SkillDescription;
diff --git a/...nts/Contribute/Skill/SkillDescription.tsx → ...llDescription/SkillDescriptionContent.tsx b/...nts/Contribute/Skill/SkillDescription.tsx → ...llDescription/SkillDescriptionContent.tsx
diff --git a/src/components/Contribute/Skill/index.tsx b/src/components/Contribute/Skill/index.tsx
@@ -16,7 +16,7 @@ import { getGitHubUsername } from '../../../utils/github';
 import { useSession } from 'next-auth/react';
 import YamlCodeModal from '../../YamlCodeModal';
 import { AttributionData, SchemaVersion, SkillYamlData } from '@/types';
-import SkillDescription from './SkillDescription';
+import SkillDescription from './SkillDescription/SkillDescription';
 import { dumpYaml } from '@/utils/yamlConfig';
 import PathService from '@/components/PathService/PathService';
 
@@ -367,17 +367,7 @@ export const SkillForm: React.FunctionComponent = () => {
         </Button>
       </div>
 
-      <FormFieldGroupExpandable
-        toggleAriaLabel="Details"
-        header={
-          <FormFieldGroupHeader
-            titleText={{ text: 'Skills Description', id: 'skills-description' }}
-            titleDescription="What are InstructLab Skills?"
-          />
-        }
-      >
-        <SkillDescription />
-      </FormFieldGroupExpandable>
+      <SkillDescription />
 
       <FormFieldGroupExpandable
         isExpanded