Fix circular dependency

src/components/Widgets/SignupQuestionsWidget/OptionsWidget.tsx

@@ -1,8 +1,8 @@
 import React from "react";
+import Checkbox from "@components/Widgets/Checkbox/Checkbox";
 import {
   Question, InputProps, optionTypes, SignupQuestionError,
-} from "./index";
-import Checkbox from "@components/Widgets/Checkbox/Checkbox";
+} from "./common";
 
 interface OptionsWidgetProps {
   inputProps: InputProps;
@@ -17,7 +17,7 @@ class OptionsWidget extends React.Component<OptionsWidgetProps> {
     // eslint-disable-next-line no-param-reassign
     questions[index].options = lst;
     onChange(questions);
-  }
+  };
 
   handleTextOptionsChange = (questions: Question[], index: number) => (event) => {
     const { onChange } = this.props;
@@ -25,7 +25,7 @@ class OptionsWidget extends React.Component<OptionsWidgetProps> {
     // eslint-disable-next-line no-param-reassign
     questions[index].options = val;
     onChange(questions);
-  }
+  };
 
   handleIntegerOptionsChange = (questions: Question[], index: number) => (event) => {
     const { onChange } = this.props;
@@ -41,7 +41,7 @@ class OptionsWidget extends React.Component<OptionsWidgetProps> {
     }
 
     onChange(questions);
-  }
+  };
 
   handleRequiredChange = (questions: Question[], index: number) => (event) => {
     const { onChange } = this.props;
@@ -50,7 +50,7 @@ class OptionsWidget extends React.Component<OptionsWidgetProps> {
     // eslint-disable-next-line no-param-reassign
     questions[index].required = val;
     onChange(questions);
-  }
+  };
 
   requiredField() {
     const { inputProps } = this.props;

src/components/Widgets/SignupQuestionsWidget/QuestionList.tsx

@@ -1,11 +1,11 @@
 import React from "react";
 import styled from "styled-components";
 import { Draggable } from "react-beautiful-dnd";
-import { Question, InputProps } from "./index";
+import { colors } from "@theme/colors";
+import { Question, InputProps } from "./common";
 import OptionsWidget from "./OptionsWidget";
 import TypeWidget from "./TypeWidget";
 import QuestionElement from "./Question";
-import { colors } from "@theme/colors";
 
 const WidgetRow = styled.div`
   margin-bottom: 1rem;
@@ -25,7 +25,7 @@ interface QuestionListProps {
 class QuestionList extends React.Component<QuestionListProps> {
   renderTextWidget = ({ questions, value, index }: InputProps) => (
     <input type="text" value={value} onChange={this.handleNameInputChange(questions, index)} />
-  )
+  );
 
   handleNameInputChange = (questions: Question[], index: number) => (event) => {
     const { onChange } = this.props;
@@ -33,17 +33,17 @@ class QuestionList extends React.Component<QuestionListProps> {
     // eslint-disable-next-line no-param-reassign
     questions[index].name = val;
     onChange(questions);
-  }
+  };
 
   handleElementRemove = (questions: Question[], index: number) => () => {
     const { onChange } = this.props;
     const newQuestions = [...questions];
     newQuestions.splice(index, 1);
     onChange(newQuestions);
-  }
+  };
 
   renderQuestions() {
-    const { questions, onChange, placeholder } = this.props;
+    const { questions, onChange } = this.props;
     return questions.map((q, index) => {
       const nameWidgetProps = {
         value: q.name, type: "text", questions, index,

src/components/Widgets/SignupQuestionsWidget/SignupQuestionsWidget.tsx

@@ -2,10 +2,10 @@ import React from "react";
 import styled from "styled-components";
 import shortid from "shortid";
 import { DragDropContext, Droppable } from "react-beautiful-dnd";
-import { Question } from ".";
 import colors from "@theme/colors";
-import QuestionList from "./QuestionList";
 import AddIcon from "@components/AddIcon";
+import QuestionList from "./QuestionList";
+import { Question } from "./common";
 
 const Widget = styled.div`
   & > button {
@@ -21,6 +21,7 @@ const Widget = styled.div`
       margin-right: 8px !important;
       margin-top: -2px !important;
     }
+
   }
 `;
 

src/components/Widgets/SignupQuestionsWidget/TypeWidget.tsx

@@ -1,5 +1,5 @@
 import React from "react";
-import { Question, InputProps, optionTypes } from "./index";
+import { Question, InputProps, optionTypes } from "./common";
 
 interface TypeWidgetProps {
   inputProps: InputProps;
@@ -13,7 +13,7 @@ class TypeWidget extends React.Component<TypeWidgetProps> {
     // eslint-disable-next-line no-param-reassign
     questions[index].type = val;
     onChange(questions);
-  }
+  };
 
   render() {
     const { inputProps } = this.props;

src/components/Widgets/SignupQuestionsWidget/common.ts

@@ -1,5 +1,3 @@
-import SignupQuestionsWidget from "./SignupQuestionsWidget";
-
 export interface Question {
   id: string;
   name: string;
@@ -35,5 +33,3 @@ export const optionTypes = [
 ];
 
 export class SignupQuestionError extends Error { }
-
-export default SignupQuestionsWidget;

src/models/SignupForm.ts

@@ -1,6 +1,6 @@
 import axios from "axios";
 import { getAuthHeader } from "@utils/auth";
-import { Question } from "@components/Widgets/SignupQuestionsWidget";
+import { Question } from "@components/Widgets/SignupQuestionsWidget/common";
 import { Signup } from "./Signup";
 
 const URL = `${process.env.NEXT_PUBLIC_API_URL}/signupForm/`;

src/pages/admin/signups/[id].tsx

@@ -7,7 +7,7 @@ import {
   SignupForm, createForm, getForm, updateForm,
 } from "@models/SignupForm";
 import DatetimeWidget from "@components/Widgets/DatetimeWidget";
-import SignupQuestionsWidget from "@components/Widgets/SignupQuestionsWidget";
+import SignupQuestionsWidget from "@components/Widgets/SignupQuestionsWidget/SignupQuestionsWidget";
 import MarkdownEditorWidget from "@components/Widgets/MarkdownEditorWidget";
 import { buildValidationSchema } from "@views/SignUpPage/FormUtils";
 

src/views/SignUpPage/FormUtils.tsx

@@ -1,4 +1,4 @@
-import { Question } from "@components/Widgets/SignupQuestionsWidget";
+import { Question } from "@components/Widgets/SignupQuestionsWidget/common";
 import { SignupForm } from "@models/SignupForm";
 import { EMAIL_REGEX } from "@utils/regexes";
 import escapeRegExp from "lodash/escapeRegExp";