diff --git a/src/components/BasicModal/BasicModal.stories.tsx b/src/components/BasicModal/BasicModal.stories.tsx
index 66eb267..f50d9e4 100644
--- a/src/components/BasicModal/BasicModal.stories.tsx
+++ b/src/components/BasicModal/BasicModal.stories.tsx
@@ -7,6 +7,13 @@ import BasicModal from "@components/BasicModal/BasicModal";
 import { Button } from "@components/Button/Button";
 import Input from "@components/Input/Input";
 
+import {
+  ButtonBox,
+  IconBox,
+  StyledDialogTitle,
+  NewProjectDialogContent,
+} from "@modules/NewProjectDialog/NewProjectDialog.style";
+
 export default {
   title: "BasicModal",
   component: BasicModal,
@@ -25,55 +32,71 @@ export const CreateProjectWithError = Template.bind({});
 export const LongModal = Template.bind({});
 
 CreateProject.args = {
-  buttons: [
-    <Button variant='text' key='btn-1'>
-      Cancel
-    </Button>,
-    <Button variant='contained' key='btn-2'>
-      Create
-    </Button>,
-  ],
-  children: <Input value='My first project' />,
-  paddings: [10, 6, 7, 6],
-  isOpen: true,
-  headerIcon: <EditIcon />,
-  title: "Name your project",
-  alignTitle: "center",
+  children: (
+    <NewProjectDialogContent>
+      <IconBox>
+        <EditIcon />
+      </IconBox>
+      <StyledDialogTitle>{"Name your project"}</StyledDialogTitle>
+      <Input variant='filled' value='My first project' />
+      <ButtonBox>
+        <Button variant='text' key='btn-1'>
+          Cancel
+        </Button>
+        <Button variant='contained' key='btn-2'>
+          Create
+        </Button>
+      </ButtonBox>
+    </NewProjectDialogContent>
+  ),
+  open: true,
+};
+
+CreateProject.parameters = {
+  controls: {
+    include: ["onClose", "open", "children"],
+    sort: "alpha",
+  },
 };
 
 CreateProjectWithError.args = {
-  buttons: [
-    <Button variant='text' key='btn-1'>
-      Cancel
-    </Button>,
-    <Button disabled variant='contained' key='btn-2'>
-      Create
-    </Button>,
-  ],
   children: (
-    <Input
-      value='       My first project'
-      error={true}
-      helperText={
-        "Project title has to be at least one character long and cannot begin/end with a whitespace"
-      }
-    />
+    <NewProjectDialogContent>
+      <IconBox>
+        <EditIcon />
+      </IconBox>
+      <StyledDialogTitle>{"Name your project"}</StyledDialogTitle>
+      <Input
+        variant='filled'
+        value='       My first project'
+        error={true}
+        helperText={
+          "Project title has to be at least one character long and cannot begin/end with a whitespace"
+        }
+      />
+      <ButtonBox>
+        <Button variant='text' key='btn-1'>
+          Cancel
+        </Button>
+        <Button variant='contained' key='btn-2'>
+          Create
+        </Button>
+      </ButtonBox>
+    </NewProjectDialogContent>
   ),
-  paddings: [10, 6, 7, 6],
-  isOpen: true,
-  headerIcon: <EditIcon />,
-  title: "Name your project",
-  alignTitle: "center",
+  open: true,
+};
+
+CreateProjectWithError.parameters = {
+  controls: {
+    include: ["onClose", "open", "children"],
+    sort: "alpha",
+  },
 };
 
 LongModal.args = {
-  buttons: [
-    <Button variant='contained' key='btn-1'>
-      Submit
-    </Button>,
-  ],
   children: (
-    <>
+    <NewProjectDialogContent>
       <Input value='First input' />
       <Input value='Second input' />
       <Input value='Third input' />
@@ -81,10 +104,22 @@ LongModal.args = {
       <Input value='Fifth input' />
       <Input value='Seventh input' />
       <Input value='Eighth input' />
-    </>
+      <ButtonBox>
+        <Button variant='text' key='btn-1'>
+          Cancel
+        </Button>
+        <Button variant='contained' key='btn-2'>
+          Create
+        </Button>
+      </ButtonBox>
+    </NewProjectDialogContent>
   ),
-  paddings: [10, 6, 7, 6],
-  isOpen: true,
-  title: "Form",
-  alignTitle: "start",
+  open: true,
+};
+
+LongModal.parameters = {
+  controls: {
+    include: ["onClose", "open", "children"],
+    sort: "alpha",
+  },
 };
diff --git a/src/components/BasicModal/BasicModal.style.tsx b/src/components/BasicModal/BasicModal.style.tsx
index 245442a..485afa6 100644
--- a/src/components/BasicModal/BasicModal.style.tsx
+++ b/src/components/BasicModal/BasicModal.style.tsx
@@ -1,97 +1,24 @@
 import { styled } from "@mui/material/styles";
-
-import Box from "@mui/material/Box";
 import Dialog from "@mui/material/Dialog";
-import { DialogTitle } from "@mui/material";
-
-type DialogProps = {
-  paddings: Array<number>;
-};
-
-type DialogTitleProps = {
-  alignTitle: "center" | "end" | "start";
-  titleMargin: string;
-};
 
-type ButtonBoxProps = {
-  buttonsTopMargin: string;
-};
+const BasicModal = styled(Dialog)({
+  overflowY: "auto",
 
-export const IconBox = styled(Box)(({ theme }) => ({
-  position: "absolute",
-  top: "-60px",
-  left: "50%",
-  transform: "translateX(-50%)",
-  boxSizing: "border-box",
-  minWidth: "112px",
-  minHeight: "112px",
-  display: "grid",
-  placeItems: "center",
-  borderRadius: "50%",
-  background: theme.palette.grey["100"],
-
-  "& .MuiSvgIcon-root": {
-    width: "64px",
-    height: "64px",
-    color: theme.palette.grey["500"],
+  "& .MuiDialog-container": {
+    height: "auto",
+    minHeight: "100vh",
   },
-}));
-
-export const StyledDialog = styled(Dialog)<DialogProps>(
-  ({ paddings, theme }) => ({
-    overflowY: "auto",
 
-    "& .MuiDialog-container": {
-      height: "auto",
-      minHeight: "100vh",
-    },
-
-    "& .MuiPaper-root": {
-      boxSizing: "border-box",
-      marginBottom: "68px",
-      marginTop: "68px",
-      minWidth: "544px",
-      minHeight: "304px",
-      display: "flex",
-      alignItems: "center",
-      flexDirection: "column",
-      paddingTop: theme.spacing(paddings[0]),
-      paddingRight: theme.spacing(paddings[1]),
-      paddingBottom: theme.spacing(paddings[2]),
-      paddingLeft: theme.spacing(paddings[3]),
-      borderRadius: "8px",
-      overflow: "visible",
-      boxShadow: "0px 8px 16px rgba(98, 98, 98, 0.24)",
-    },
-
-    "& .MuiDialogContent-root": {
-      padding: 0,
-      minWidth: "100%",
-      width: 0,
-    },
-  })
-);
-
-export const ButtonBox = styled(({ buttonsTopMargin, ...props }) => (
-  <Box {...props} />
-))<ButtonBoxProps>(({ buttonsTopMargin }) => ({
-  alignSelf: "flex-end",
-  marginTop: buttonsTopMargin,
-  boxShadow: "none",
-  border: "none",
+  "& .MuiPaper-root": {
+    minWidth: "544px",
+    overflow: "visible",
+    boxShadow: "0px 8px 16px rgba(98, 98, 98, 0.24)",
+  },
 
-  "& .MuiButtonBase-root:first-of-type": {
-    marginRight: "5px",
+  "& .MuiDialogContent-root": {
+    minWidth: "100%",
+    width: 0,
   },
-}));
+});
 
-export const StyledDialogTitle = styled(
-  ({ alignTitle, titleMargin, ...props }) => <DialogTitle {...props} />
-)<DialogTitleProps>(({ theme, alignTitle, titleMargin }) => ({
-  width: "100%",
-  textAlign: alignTitle,
-  lineHeight: "32px",
-  fontSize: "24px",
-  padding: 0,
-  marginBottom: titleMargin,
-}));
+export default BasicModal;
diff --git a/src/components/BasicModal/BasicModal.tsx b/src/components/BasicModal/BasicModal.tsx
index 9d72817..95d92fe 100644
--- a/src/components/BasicModal/BasicModal.tsx
+++ b/src/components/BasicModal/BasicModal.tsx
@@ -1,54 +1 @@
-import {
-  StyledDialog,
-  IconBox,
-  ButtonBox,
-  StyledDialogTitle,
-} from "./BasicModal.style";
-import DialogContent from "@mui/material/DialogContent";
-
-export interface BasicModalProps {
-  headerIcon?: JSX.Element;
-  children?: JSX.Element | JSX.Element[];
-  buttons: JSX.Element[];
-  handleClose?: () => void;
-  isOpen: boolean;
-  /**paddings are calculated by taking mui theme spacing
-   * property and multiplying it by values in Array, calculated paddings are set clockwise, just like in normal css*/
-  paddings: Array<number>;
-  title?: string;
-  alignTitle: "center" | "end" | "start";
-  /** Bottom title margin*/
-  titleMargin?: number;
-  buttonsTopMargin?: number;
-}
-
-export default function BasicModal({
-  children,
-  headerIcon,
-  isOpen,
-  handleClose,
-  paddings,
-  title,
-  alignTitle,
-  titleMargin = 16,
-  buttons,
-  buttonsTopMargin = 32,
-}: BasicModalProps) {
-  return (
-    <StyledDialog
-      paddings={paddings}
-      open={isOpen}
-      onClose={handleClose}
-      PaperProps={{
-        elevation: 2,
-      }}
-    >
-      {headerIcon && <IconBox>{headerIcon}</IconBox>}
-      <StyledDialogTitle alignTitle={alignTitle} titleMargin={titleMargin}>
-        {title}
-      </StyledDialogTitle>
-      <DialogContent>{children}</DialogContent>
-      <ButtonBox buttonsTopMargin={buttonsTopMargin}>{buttons}</ButtonBox>
-    </StyledDialog>
-  );
-}
+export { default } from "./BasicModal.style";
diff --git a/src/modules/ConfirmationDialog/ConfirmationDialog.style.tsx b/src/modules/ConfirmationDialog/ConfirmationDialog.style.tsx
new file mode 100644
index 0000000..8aa74e4
--- /dev/null
+++ b/src/modules/ConfirmationDialog/ConfirmationDialog.style.tsx
@@ -0,0 +1,20 @@
+import { styled } from "@mui/material/styles";
+
+import Box from "@mui/material/Box";
+import { DialogContent } from "@mui/material";
+
+export const ConfirmationDialogContent = styled(DialogContent)({
+  boxSizing: "border-box",
+  display: "flex",
+  alignItems: "stretch",
+  flexDirection: "column",
+  padding: "120px 48px 56px 48px",
+});
+
+export const ButtonBox = styled(Box)({
+  alignSelf: "flex-end",
+  marginTop: "32px",
+  "& .MuiButtonBase-root:first-of-type": {
+    marginRight: "5px",
+  },
+});
diff --git a/src/modules/ConfirmationDialog/ConfirmationDialog.tsx b/src/modules/ConfirmationDialog/ConfirmationDialog.tsx
index 04f0bef..77a47fb 100644
--- a/src/modules/ConfirmationDialog/ConfirmationDialog.tsx
+++ b/src/modules/ConfirmationDialog/ConfirmationDialog.tsx
@@ -1,9 +1,14 @@
 import { MouseEventHandler, SyntheticEvent, useState } from "react";
-import BasicModal, { BasicModalProps } from "@components/BasicModal/BasicModal";
+import BasicModal from "@components/BasicModal/BasicModal";
 import { Button } from "@components/Button/Button";
 import { useTranslation } from "react-i18next";
 import { Typography } from "@mui/material";
 
+import {
+  ConfirmationDialogContent,
+  ButtonBox,
+} from "./ConfirmationDialog.style";
+
 export interface ConfirmationDialogProps {
   children: string | JSX.Element | JSX.Element[];
   confirmHandler: () => void;
@@ -23,24 +28,19 @@ export const ConfirmationDialog = ({
     confirmHandler();
   };
 
-  const buttons = [
-    <Button onClick={handleClose} variant='text' key='btn-1'>
-      {t("noBtn")}
-    </Button>,
-    <Button onClick={handleConfirmation} variant='contained' key='btn-2'>
-      {t("yesBtn")}
-    </Button>,
-  ];
-
   return (
-    <BasicModal
-      buttons={buttons}
-      isOpen={isOpen}
-      paddings={[15, 6, 7, 6]}
-      alignTitle='center'
-      handleClose={handleClose}
-    >
-      <Typography textAlign='center'>{children}</Typography>
+    <BasicModal open={isOpen} onClose={handleClose}>
+      <ConfirmationDialogContent>
+        <Typography textAlign='center'>{children}</Typography>
+        <ButtonBox>
+          <Button onClick={handleClose} variant='text'>
+            {t("noBtn")}
+          </Button>
+          <Button onClick={handleConfirmation} variant='contained'>
+            {t("yesBtn")}
+          </Button>
+        </ButtonBox>
+      </ConfirmationDialogContent>
     </BasicModal>
   );
 };
diff --git a/src/modules/CreateIssueDialog/CreateIssueDialog.style.tsx b/src/modules/CreateIssueDialog/CreateIssueDialog.style.tsx
index 6201d36..15bf30f 100644
--- a/src/modules/CreateIssueDialog/CreateIssueDialog.style.tsx
+++ b/src/modules/CreateIssueDialog/CreateIssueDialog.style.tsx
@@ -1,8 +1,28 @@
 import { styled } from "@mui/material/styles";
 import { FormGroup } from "@mui/material";
+import { DialogContent } from "@mui/material";
+import { DialogTitle } from "@mui/material";
+import Box from "@mui/material/Box";
+
 import Input from "@components/Input/Input";
 
-export const StyledFormGroup = styled(FormGroup)(() => ({
+export const CreateIssueDialogContent = styled(DialogContent)({
+  boxSizing: "border-box",
+  display: "flex",
+  alignItems: "stretch",
+  flexDirection: "column",
+  padding: "40px 40px 24px 40px",
+});
+
+export const StyledDialogTitle = styled(DialogTitle)({
+  textAlign: "start",
+  lineHeight: "24px",
+  fontSize: "24px",
+  padding: 0,
+  marginBottom: "32px",
+});
+
+export const StyledFormGroup = styled(FormGroup)({
   "& .MuiFormControl-root:not(.MuiFormControl-root:last-of-type)": {
     marginBottom: "16px",
   },
@@ -12,8 +32,16 @@ export const StyledFormGroup = styled(FormGroup)(() => ({
   "&& .MuiFormControl-root:nth-of-type(5)": {
     margin: "0px",
   },
-}));
+});
 
-export const LongInput = styled(Input)(() => ({
+export const LongInput = styled(Input)({
   width: "100% !important",
-}));
+});
+
+export const ButtonBox = styled(Box)({
+  alignSelf: "flex-end",
+  marginTop: "32px",
+  "& .MuiButtonBase-root:first-of-type": {
+    marginRight: "5px",
+  },
+});
diff --git a/src/modules/CreateIssueDialog/CreateIssueDialog.tsx b/src/modules/CreateIssueDialog/CreateIssueDialog.tsx
index a804135..ce1db7e 100644
--- a/src/modules/CreateIssueDialog/CreateIssueDialog.tsx
+++ b/src/modules/CreateIssueDialog/CreateIssueDialog.tsx
@@ -5,7 +5,13 @@ import { Button } from "@components/Button/Button";
 import Input from "@components/Input/Input";
 import { Select } from "@components/Select/Select";
 
-import { StyledFormGroup, LongInput } from "./CreateIssueDialog.style";
+import {
+  StyledFormGroup,
+  LongInput,
+  CreateIssueDialogContent,
+  ButtonBox,
+  StyledDialogTitle,
+} from "./CreateIssueDialog.style";
 
 import useForm from "../../hooks/useForm";
 import { validateInfo } from "../../validation/validateCreateIssue";
@@ -50,89 +56,84 @@ export default function CreateIssueDialog({
   }
 
   return (
-    <BasicModal
-      paddings={[5, 5, 3, 5]}
-      isOpen={isOpen}
-      title={t("createIssue")}
-      alignTitle='start'
-      handleClose={handleClose}
-      buttonsTopMargin={56}
-      buttons={[
-        <Button onClick={handleClose} variant='text' key='btn-1'>
-          {t("cancelBtn")}
-        </Button>,
-        <Button
-          disabled={Object.keys(errors).length > 0}
-          onClick={handleSubmit}
-          key='btn-2'
-        >
-          {t("continueBtn")}
-        </Button>,
-      ]}
-    >
-      <StyledFormGroup>
-        <Input
-          onChangeHandler={handleChange}
-          value={values.reporter}
-          name='reporter'
-          labelHelperText={t("labelReporter")}
-          helperText={errors.reporter}
-          variant='filled'
-          disabled
-        />
-        <Select
-          secondary
-          handleSelect={handleChange}
-          value={values.project}
-          options={createIssueOptions.project}
-          inputProps={{ name: "project" }}
-          labelText={t("labelProject")}
-          helperText={errors.project}
-        />
-        <LongInput
-          onChangeHandler={handleChange}
-          value={values.summary}
-          name='summary'
-          labelHelperText={t("labelSummary")}
-          helperText={errors.summary}
-          variant='filled'
-        />
-        <LongInput
-          onChangeHandler={handleChange}
-          value={values.description}
-          multiline
-          name='description'
-          labelHelperText={t("labelDescription")}
-          helperText={errors.description}
-          variant='filled'
-        />
-        <Select
-          secondary
-          handleSelect={handleChange}
-          value={values.linkedIssues}
-          options={createIssueOptions.linkedIssues}
-          inputProps={{ name: "linkedIssues" }}
-          labelText={t("labelLinkedIssues")}
-          helperText={errors.linkedIssues}
-        />
-        <Select
-          secondary
-          handleSelect={handleChange}
-          value={values.issue}
-          options={createIssueOptions.issue}
-          inputProps={{ name: "issue" }}
-          helperText={errors.issue}
-        />
-        <Select
-          secondary
-          handleSelect={handleChange}
-          value={values.assignee}
-          options={createIssueOptions.assignee}
-          inputProps={{ name: "assignee" }}
-          labelText={t("labelAssignee")}
-          helperText={errors.assignee}
-        />
-      </StyledFormGroup>
+    <BasicModal open={isOpen} onClose={handleClose}>
+      <CreateIssueDialogContent>
+        <StyledDialogTitle>{t("createIssue")}</StyledDialogTitle>
+        <StyledFormGroup>
+          <Input
+            onChangeHandler={handleChange}
+            value={values.reporter}
+            name='reporter'
+            labelHelperText={t("labelReporter")}
+            helperText={errors.reporter}
+            variant='filled'
+            disabled
+          />
+          <Select
+            secondary
+            handleSelect={handleChange}
+            value={values.project}
+            options={createIssueOptions.project}
+            inputProps={{ name: "project" }}
+            labelText={t("labelProject")}
+            helperText={errors.project}
+          />
+          <LongInput
+            onChangeHandler={handleChange}
+            value={values.summary}
+            name='summary'
+            labelHelperText={t("labelSummary")}
+            helperText={errors.summary}
+            variant='filled'
+          />
+          <LongInput
+            onChangeHandler={handleChange}
+            value={values.description}
+            multiline
+            name='description'
+            labelHelperText={t("labelDescription")}
+            helperText={errors.description}
+            variant='filled'
+          />
+          <Select
+            secondary
+            handleSelect={handleChange}
+            value={values.linkedIssues}
+            options={createIssueOptions.linkedIssues}
+            inputProps={{ name: "linkedIssues" }}
+            labelText={t("labelLinkedIssues")}
+            helperText={errors.linkedIssues}
+          />
+          <Select
+            secondary
+            handleSelect={handleChange}
+            value={values.issue}
+            options={createIssueOptions.issue}
+            inputProps={{ name: "issue" }}
+            helperText={errors.issue}
+          />
+          <Select
+            secondary
+            handleSelect={handleChange}
+            value={values.assignee}
+            options={createIssueOptions.assignee}
+            inputProps={{ name: "assignee" }}
+            labelText={t("labelAssignee")}
+            helperText={errors.assignee}
+          />
+        </StyledFormGroup>
+        <ButtonBox>
+          <Button onClick={handleClose} variant='text'>
+            {t("cancelBtn")}
+          </Button>
+          <Button
+            disabled={Object.keys(errors).length > 0}
+            onClick={handleSubmit}
+          >
+            {t("continueBtn")}
+          </Button>
+        </ButtonBox>
+      </CreateIssueDialogContent>
     </BasicModal>
   );
 }
diff --git a/src/modules/NewProjectDialog/NewProjectDialog.style.tsx b/src/modules/NewProjectDialog/NewProjectDialog.style.tsx
new file mode 100644
index 0000000..7f9dff7
--- /dev/null
+++ b/src/modules/NewProjectDialog/NewProjectDialog.style.tsx
@@ -0,0 +1,47 @@
+import { styled } from "@mui/material/styles";
+
+import Box from "@mui/material/Box";
+import { DialogTitle, DialogContent } from "@mui/material";
+
+export const NewProjectDialogContent = styled(DialogContent)({
+  boxSizing: "border-box",
+  display: "flex",
+  alignItems: "stretch",
+  flexDirection: "column",
+  padding: "80px 48px 56px 48px",
+});
+
+export const IconBox = styled(Box)(({ theme }) => ({
+  position: "absolute",
+  top: "-60px",
+  left: "50%",
+  transform: "translateX(-50%)",
+  minWidth: "112px",
+  minHeight: "112px",
+  display: "grid",
+  placeItems: "center",
+  borderRadius: "50%",
+  background: theme.palette.grey[100],
+
+  "& .MuiSvgIcon-root": {
+    width: "64px",
+    height: "64px",
+    color: theme.palette.grey[500],
+  },
+}));
+
+export const StyledDialogTitle = styled(DialogTitle)({
+  textAlign: "center",
+  lineHeight: "32px",
+  fontSize: "24px",
+  padding: 0,
+  marginBottom: "16px",
+});
+
+export const ButtonBox = styled(Box)(() => ({
+  alignSelf: "flex-end",
+  marginTop: "32px",
+  "& .MuiButtonBase-root:first-of-type": {
+    marginRight: "5px",
+  },
+}));
diff --git a/src/modules/NewProjectDialog/NewProjectDialog.tsx b/src/modules/NewProjectDialog/NewProjectDialog.tsx
index 5a4cf65..d713c6b 100644
--- a/src/modules/NewProjectDialog/NewProjectDialog.tsx
+++ b/src/modules/NewProjectDialog/NewProjectDialog.tsx
@@ -2,11 +2,18 @@ import { useState, useEffect, useRef, Dispatch, SetStateAction } from "react";
 import { useNavigate } from "react-router-dom";
 import { useTranslation } from "react-i18next";
 import EditIcon from "@mui/icons-material/Edit";
+import { LoadingButton } from "@mui/lab";
 
 import BasicModal from "@components/BasicModal/BasicModal";
 import { Button } from "@components/Button/Button";
 import Input from "@components/Input/Input";
-import { LoadingButton } from "@mui/lab";
+
+import {
+  ButtonBox,
+  IconBox,
+  StyledDialogTitle,
+  NewProjectDialogContent,
+} from "./NewProjectDialog.style";
 
 import { createNewProjectPattern } from "../../validation/patterns.const";
 import { toProjects } from "src/views/routes";
@@ -75,40 +82,31 @@ export default function NewProjectDialog({
     }
   };
   return (
-    <BasicModal
-      paddings={[10, 6, 7, 6]}
-      isOpen={isOpen}
-      headerIcon={<EditIcon />}
-      title={dialogTitle}
-      alignTitle='center'
-      handleClose={handleClose}
-      buttons={[
-        <Button onClick={handleClose} variant='text' key='btn-1'>
-          {t("cancelBtn")}
-        </Button>,
-        isLoading ? (
-          <LoadingButton
-            sx={{ minWidth: "98.77px" }}
-            key='btn-2'
-            loading={true}
-          />
-        ) : (
-          <Button
-            disabled={!!error || !inputValue}
-            onClick={handleCreate}
-            key='btn-2'
-          >
-            {t("createBtn")}
+    <BasicModal open={isOpen} onClose={handleClose}>
+      <NewProjectDialogContent>
+        <IconBox>
+          <EditIcon />
+        </IconBox>
+        <StyledDialogTitle>{dialogTitle}</StyledDialogTitle>
+        <Input
+          value={inputValue}
+          onChangeHandler={handleInputChange}
+          error={Boolean(error)}
+          helperText={error}
+        />
+        <ButtonBox>
+          <Button onClick={handleClose} variant='text'>
+            {t("cancelBtn")}
           </Button>
-        ),
-      ]}
-    >
-      <Input
-        value={inputValue}
-        onChangeHandler={handleInputChange}
-        error={Boolean(error)}
-        helperText={error}
-      />
+          {isLoading ? (
+            <LoadingButton sx={{ minWidth: "98.77px" }} loading={true} />
+          ) : (
+            <Button disabled={!!error || !inputValue} onClick={handleCreate}>
+              {t("createBtn")}
+            </Button>
+          )}
+        </ButtonBox>
+      </NewProjectDialogContent>
     </BasicModal>
   );
 }