From 76b0cc2f6b3d60c73ad121014383edd0993cfa2b Mon Sep 17 00:00:00 2001
From: tiddlygit-test <linonetwo012@gmail.com>
Date: Thu, 29 Apr 2021 23:12:55 +0800
Subject: [PATCH] feat: show error message in larger space

---
 src/pages/AddWorkspace/CloneWikiDoneButton.tsx   | 10 ++--------
 src/pages/AddWorkspace/ExistedWikiDoneButton.tsx | 10 ++--------
 src/pages/AddWorkspace/FormComponents.tsx        | 11 ++++++++++-
 src/pages/AddWorkspace/NewWikiDoneButton.tsx     | 10 ++--------
 4 files changed, 16 insertions(+), 25 deletions(-)

diff --git a/src/pages/AddWorkspace/CloneWikiDoneButton.tsx b/src/pages/AddWorkspace/CloneWikiDoneButton.tsx
index 7ff947e2..c98314ea 100644
--- a/src/pages/AddWorkspace/CloneWikiDoneButton.tsx
+++ b/src/pages/AddWorkspace/CloneWikiDoneButton.tsx
@@ -1,20 +1,14 @@
 /* eslint-disable @typescript-eslint/strict-boolean-expressions */
 import React from 'react';
-import styled from 'styled-components';
 import { useTranslation } from 'react-i18next';
 
-import { Typography, Button, LinearProgress, Snackbar } from '@material-ui/core';
+import { Typography, LinearProgress, Snackbar } from '@material-ui/core';
 import Alert from '@material-ui/lab/Alert';
 
 import type { IWikiWorkspaceFormProps } from './useForm';
 import { useValidateCloneWiki, useCloneWiki } from './useCloneWiki';
 import { useWikiCreationProgress } from './useIndicator';
-import { WikiLocation } from './FormComponents';
-
-const CloseButton = styled(Button)`
-  white-space: nowrap;
-  width: 100%;
-`;
+import { WikiLocation, CloseButton } from './FormComponents';
 
 export function CloneWikiDoneButton({ form, isCreateMainWorkspace }: IWikiWorkspaceFormProps & { isCreateMainWorkspace: boolean }): JSX.Element {
   const { t } = useTranslation();
diff --git a/src/pages/AddWorkspace/ExistedWikiDoneButton.tsx b/src/pages/AddWorkspace/ExistedWikiDoneButton.tsx
index 2c5ae6f5..dbe83ed1 100644
--- a/src/pages/AddWorkspace/ExistedWikiDoneButton.tsx
+++ b/src/pages/AddWorkspace/ExistedWikiDoneButton.tsx
@@ -1,19 +1,13 @@
 import React from 'react';
-import styled from 'styled-components';
 import { useTranslation } from 'react-i18next';
 
-import { Typography, Button, LinearProgress, Snackbar } from '@material-ui/core';
+import { Typography, LinearProgress, Snackbar } from '@material-ui/core';
 import Alert from '@material-ui/lab/Alert';
 
 import type { IWikiWorkspaceFormProps } from './useForm';
 import { useValidateExistedWiki, useExistedWiki } from './useExistedWiki';
 import { useWikiCreationProgress } from './useIndicator';
-import { WikiLocation } from './FormComponents';
-
-const CloseButton = styled(Button)`
-  white-space: nowrap;
-  width: 100%;
-`;
+import { WikiLocation, CloseButton } from './FormComponents';
 
 export function ExistedWikiDoneButton({
   form,
diff --git a/src/pages/AddWorkspace/FormComponents.tsx b/src/pages/AddWorkspace/FormComponents.tsx
index 0a1c71b9..44e07612 100644
--- a/src/pages/AddWorkspace/FormComponents.tsx
+++ b/src/pages/AddWorkspace/FormComponents.tsx
@@ -1,4 +1,4 @@
-import styled from 'styled-components';
+import styled, { css } from 'styled-components';
 import { Paper, Button, TextField, Autocomplete, Typography } from '@material-ui/core';
 
 export const CreateContainer = styled(Paper)`
@@ -18,6 +18,15 @@ export const LocationPickerButton = styled(Button)`
   white-space: nowrap;
   width: fit-content;
 `;
+export const CloseButton = styled(Button)`
+  ${({ disabled }) =>
+    disabled === true
+      ? ''
+      : css`
+          white-space: nowrap;
+        `}
+  width: 100%;
+`;
 LocationPickerButton.defaultProps = {
   variant: 'contained',
   color: 'inherit',
diff --git a/src/pages/AddWorkspace/NewWikiDoneButton.tsx b/src/pages/AddWorkspace/NewWikiDoneButton.tsx
index 70b1d0b3..bedc5121 100644
--- a/src/pages/AddWorkspace/NewWikiDoneButton.tsx
+++ b/src/pages/AddWorkspace/NewWikiDoneButton.tsx
@@ -1,20 +1,14 @@
 /* eslint-disable @typescript-eslint/strict-boolean-expressions */
 import React from 'react';
-import styled from 'styled-components';
 import { useTranslation } from 'react-i18next';
 
-import { Typography, Button, LinearProgress, Snackbar } from '@material-ui/core';
+import { Typography, LinearProgress, Snackbar } from '@material-ui/core';
 import Alert from '@material-ui/lab/Alert';
 
 import type { IWikiWorkspaceFormProps } from './useForm';
 import { useValidateNewWiki, useNewWiki } from './useNewWiki';
 import { useWikiCreationProgress } from './useIndicator';
-import { WikiLocation } from './FormComponents';
-
-const CloseButton = styled(Button)`
-  white-space: nowrap;
-  width: 100%;
-`;
+import { WikiLocation, CloseButton } from './FormComponents';
 
 export function NewWikiDoneButton({
   form,