Merge pull request #1946 from sophieturner0/Confirm-Button-Should-Not…

…-Allow-Enable-with-Empty-Spaces Fixed: `Add Edge` Modal Confirm Button Should Not Allow Enable with `Empty Spaces` [BluePrintModal]
stakwork · Sep 13, 2024 · 8b095e6 · 8b095e6
2 parents 2f19bd8 + e685377
commit 8b095e6
Show file tree

Hide file tree

Showing 2 changed files with 10 additions and 5 deletions.
diff --git a/src/components/ModalsContainer/BlueprintModal/Body/AddEdgeNode/Body/index.tsx b/src/components/ModalsContainer/BlueprintModal/Body/AddEdgeNode/Body/index.tsx
@@ -1,12 +1,12 @@
 import { Button } from '@mui/material'
-import { useState, useEffect } from 'react'
+import { useEffect, useState } from 'react'
 import { FormProvider, useForm } from 'react-hook-form'
 import { ClipLoader } from 'react-spinners'
-import { colors } from '~/utils/colors'
-import { TitleEditor } from '../Title'
 import styled from 'styled-components'
-import { deleteEdgeType, postBluePrintType, updateEdgeType, getNodeSchemaTypes } from '~/network/fetchSourcesData'
 import { Flex } from '~/components/common/Flex'
+import { deleteEdgeType, getNodeSchemaTypes, postBluePrintType, updateEdgeType } from '~/network/fetchSourcesData'
+import { colors } from '~/utils/colors'
+import { TitleEditor } from '../Title'
 
 export type FormData = {
   type: string
@@ -90,7 +90,7 @@ export const Body = ({ onCancel, edgeLinkData, setGraphLoading }: Props) => {
 
   const submitDisabled = edgeLinkData?.refId
     ? loading || !isEdgeLinkChange
-    : loading || !selectedToNode || !selectedFromNode || !selectedType
+    : loading || !selectedToNode.trim() || !selectedFromNode.trim() || !selectedType.trim()
 
   const handleDelete = async () => {
     setOnDeleteLoading(true)

diff --git a/src/components/ModalsContainer/BlueprintModal/Body/AddEdgeNode/Title/index.tsx b/src/components/ModalsContainer/BlueprintModal/Body/AddEdgeNode/Title/index.tsx
@@ -1,5 +1,6 @@
 import { FC } from 'react'
 import styled from 'styled-components'
+import { noSpacePattern } from '~/components/AddItemModal/SourceTypeStep/constants'
 import { Flex } from '~/components/common/Flex'
 import { Text } from '~/components/common/Text'
 import { TextInput } from '~/components/common/TextInput'
@@ -54,6 +55,10 @@ export const TitleEditor: FC<Props> = ({
             placeholder="Enter Edge Name"
             rules={{
               ...requiredRule,
+              pattern: {
+                message: 'No leading whitespace allowed',
+                value: noSpacePattern,
+              },
             }}
             value={selectedType}
           />