fix Search bug and init getTags request

src/api/getTags.js

@@ -0,0 +1,11 @@
+import { API } from '../utils/globals';
+
+const getTags = (setTags) => {
+  fetch(`${API}/list-tags`)
+    .then((response) => response.json())
+    .then((data) => {
+      setTags(data);
+    });
+};
+
+export default getTags;

src/components/generic/SubmitInput.js

@@ -1,19 +1,28 @@
 import React from 'react';
-import {FlexColumn} from '../../utils/containers';
-import {Medium} from '../../utils/fonts';
+import { FlexColumn } from '../../utils/containers';
+import { Medium } from '../../utils/fonts';
 import theme from '../../utils/theme';
 
 const SubmitInput = (props) => {
-    return (
-        <FlexColumn gap='8px' width='100%' alignmentX='flex-start'>
-            <Medium as='label' htmlFor={props.label}>
-                {props.label}
-            </Medium>
-            <FlexColumn as='input' id={props.label} name={props.label} borderRadius='4px' width='100%'
-                        height='36px' border={`1px solid ${theme.colors.dark}`} shadow={theme.shadow}
-                        onChange={(e) => props.handler(e)} padding='4px'/>
-        </FlexColumn>
-    );
+  return (
+    <FlexColumn gap="8px" width="100%" alignmentX="flex-start">
+      <Medium as="label" htmlFor={props.label}>
+        {props.label}
+      </Medium>
+      <FlexColumn
+        as="input"
+        id={props.label}
+        name={props.label}
+        borderRadius="4px"
+        width="100%"
+        height="36px"
+        border={`1px solid ${theme.colors.dark}`}
+        shadow={theme.shadow}
+        onChange={(e) => props.handler(e.target.value)}
+        padding="4px"
+      />
+    </FlexColumn>
+  );
 };
 
-export default SubmitInput;
+export default SubmitInput;

src/components/specific_challenge/Submit.js

@@ -7,24 +7,18 @@ import Button from '../generic/Button';
 import theme from '../../utils/theme';
 import challengeSubmission from '../../api/challengeSubmissionPost';
 import Loading from '../generic/Loading';
+import getTags from '../../api/getTags';
 
 const Submit = (props) => {
   const [description, setDescription] = React.useState('');
   const [repoUrl, setRepoUrl] = React.useState('');
   const [repoBranch, setRepoBranch] = React.useState('');
   const [loading, setLoading] = React.useState(false);
+  const [tags, setTags] = React.useState([]);
 
-  const descriptionHandler = (e) => {
-    setDescription(e.target.value);
-  };
-
-  const repoUrlHandler = (e) => {
-    setRepoUrl(e.target.value);
-  };
-
-  const repoBranchHandler = (e) => {
-    setRepoBranch(e.target.value);
-  };
+  React.useMemo(() => {
+    getTags(setTags);
+  }, []);
 
   const challengeSubmissionSubmit = () => {
     setLoading(true);
@@ -38,6 +32,7 @@ const Submit = (props) => {
   };
 
   if (!loading) {
+    console.log(tags);
     return (
       <FlexColumn
         margin="40px 0 0 0"
@@ -54,13 +49,10 @@ const Submit = (props) => {
         <FlexColumn width="100%" gap="32px">
           <SubmitInput
             label="Submission description"
-            handler={descriptionHandler}
-          />
-          <SubmitInput label="Submission repo URL" handler={repoUrlHandler} />
-          <SubmitInput
-            label="Submission repo branch"
-            handler={repoBranchHandler}
+            handler={setDescription}
           />
+          <SubmitInput label="Submission repo URL" handler={setRepoUrl} />
+          <SubmitInput label="Submission repo branch" handler={setRepoBranch} />
         </FlexColumn>
         <Button width="122px" height="44px" handler={challengeSubmissionSubmit}>
           <Menu color={theme.colors.white}>Submit</Menu>

src/pages/Challanges/Challenges.js

@@ -39,13 +39,8 @@ const Challenges = () => {
 
   const searchQueryHandler = React.useCallback(
     (event) =>
-      challengeSearchQueryHandler(
-        event,
-        state.challengesFromAPI,
-        state.setPageNr,
-        dispatch
-      ),
-    [state.challengesFromAPI, state.setPageNr]
+      challengeSearchQueryHandler(event, state.challengesFromAPI, dispatch),
+    [state.challengesFromAPI]
   );
 
   const filtersMenuRender = React.useCallback(