Merge pull request #58 from Luis-KM-Lo/hooksImport

Hooks import

Author: Luis-KM-Lo

src/components/ReactHooksTestComponent/Context/Context.jsx

@@ -61,15 +61,6 @@ const HookUpdates = ({ hookUpdates, index }) => {
             <h3>Hooks</h3>
           </div>
           <div id={styles.hooksFlexBox}>
-            {/* <div id={styles.hooks}>
-              <label htmlFor='hookFile'>Import Hook From</label>
-              <SearchInput
-                options={Object.keys(filePathMap)}
-                dispatch={dispatchToHooksTestCase}
-                action={updateHooksFilePath}
-                filePathMap={filePathMap}
-              />
-            </div> */}
             <div id={styles.serverInput}>
               <label htmlFor='test-statement'>Test description</label>
               <div
@@ -84,7 +75,6 @@ const HookUpdates = ({ hookUpdates, index }) => {
                     ref={testDescription}
                     type='text'
                     id={styles.testStatement}
-                    // value={hookUpdates.testName}
                     onChange={(e) => handleChangeHookUpdatesFields(e, 'testName')}
                   />
                 </div>
@@ -111,35 +101,22 @@ const HookUpdates = ({ hookUpdates, index }) => {
               />
             </div>
           </div>
-          {/* <div id={styles.cb}>
-              <label htmlFor='callbackFunc'>Callback Function</label>
-              <input
-                type='text'
-                id='callbackFunc'
-                onChange={(e) => handleChangeHookUpdatesFields(e, 'callbackFunc')}
-                placeholder='e.g. incrementCount'
-              />
-            </div> */}
           {hookUpdates.callbackFunc.map((callbackFunc, i) => {
             return (
               <div id={styles.cbFlexBox}>
-                <HooksCallback callbackFunc={callbackFunc} index={index} id={i} />{' '}
+                <HooksCallback callbackFunc={callbackFunc} index={index} id={i} />
               </div>
             );
-          })}{' '}
+          })}
           <div className={styles.buttonsContainer}>
-            <button
-              // id={id}
-              onClick={addCallbackHandleClick}
-              className={styles.assertionButton}
-            >
+            <button onClick={addCallbackHandleClick} className={styles.assertionButton}>
               <i className='fas fa-plus'></i>
               Callback
             </button>
           </div>
           {hookUpdates.assertions.map((assertion, i) => {
             return <HooksAssertion assertion={assertion} index={index} id={i} />;
-          })}{' '}
+          })}
           <div className={styles.buttonsContainer} id={styles.stateFlexBox}>
             <button
               // id={id}

src/components/ReactHooksTestComponent/HookRender/HookRender.jsx

@@ -11,9 +11,7 @@ import HooksTestStatements from './HooksTestStatements';
 import { HooksStatements } from '../../utils/hooksTypes';
 
 const HooksTestCase = () => {
-  const [{ hooksTestStatement, hooksStatements }, dispatchToHooksTestCase] = useContext(
-    HooksTestCaseContext
-  );
+  const [{ hooksStatements }, dispatchToHooksTestCase] = useContext(HooksTestCaseContext);
 
   const testDescription = useRef<HTMLInputElement>(null);
 
@@ -55,16 +53,15 @@ const HooksTestCase = () => {
       </div>
       <div id={styles.testMockSection}>
         <section id={styles.testCaseHeader}>
-          <label htmlFor='test-statement'>
-            Describe Block
-            <br />
-            <input
-              ref={testDescription}
-              type='text'
-              id={styles.testStatement}
-              onChange={handleUpdateHooksTestStatement}
-            />
-          </label>
+          Describe Block
+          <br />
+          <br />
+          <input
+            ref={testDescription}
+            type='text'
+            id={styles.testStatement}
+            onChange={handleUpdateHooksTestStatement}
+          />
         </section>
       </div>
       <DragDropContext onDragEnd={onDragEnd}>

src/components/ReactHooksTestComponent/HookRender/HookRender.module.scss

@@ -37,9 +37,7 @@ const HooksTestStatements = () => {
       {hImports}
       {hooksStatements.map((statement: HooksStatements, i: number) => {
         switch (statement.type) {
-          case 'context':
-            return <Context key={statement.id} context={statement} index={i} />;
-          case 'hook-updates':
+          case 'hooks':
             return <HookUpdates key={statement.id} hookUpdates={statement} index={i} />;
           default:
             return <></>;

src/components/ReactHooksTestComponent/HookUpdates/HookUpdates.jsx

@@ -22,7 +22,7 @@ export default function importOptionsSwitch(statements: statements[]) {
       case 'async':
         isAsyncOn = true;
         break;
-      case 'hook-updates':
+      case 'hooks':
         isHooksOn = true;
         break;
       default:

src/components/TestCase/HooksTestCase.tsx

@@ -7,11 +7,7 @@ import {
   toggleRightPanel,
 } from '../../context/actions/globalActions';
 import styles from './TestMenu.module.scss';
-import {
-  addContexts,
-  addHookUpdates,
-  createNewHooksTest,
-} from '../../context/actions/hooksTestCaseActions';
+import { addHookUpdates, createNewHooksTest } from '../../context/actions/hooksTestCaseActions';
 import Modal from '../Modals/Modal';
 import useGenerateTest from '../../context/useGenerateTest';
 import { HooksTestCaseContext } from '../../context/reducers/hooksTestCaseReducer';
@@ -28,10 +24,6 @@ const HooksTestMenu = () => {
   const [{ projectFilePath, file, exportBool }, dispatchToGlobal] = useContext<any>(GlobalContext);
   const generateTest = useGenerateTest('hooks', projectFilePath);
 
-  const handleAddContexts = () => {
-    dispatchToHooksTestCase(addContexts());
-  };
-
   const handleAddHookUpdates = () => {
     dispatchToHooksTestCase(addHookUpdates());
   };
@@ -82,9 +74,6 @@ const HooksTestMenu = () => {
           <button className='hookUpdatesButton' type='button' onClick={handleAddHookUpdates}>
             Hooks
           </button>
-          <button className='contextButton' type='button' onClick={handleAddContexts}>
-            Context
-          </button>
         </div>
       </div>
     </div>