fix: [code-821]: redirect to space after creation (#408)

web/src/components/NewSpaceModalButton/NewSpaceModalButton.tsx

@@ -54,6 +54,7 @@ export interface NewSpaceModalButtonProps extends Omit<ButtonProps, 'onClick'> {
   submitButtonTitle?: string
   cancelButtonTitle?: string
   onRefetch: () => void
+  handleNavigation?: (value: string) => void
 }
 export interface OpenapiCreateSpaceRequestExtended extends OpenapiCreateSpaceRequest {
   parent_id?: number
@@ -65,6 +66,7 @@ export const NewSpaceModalButton: React.FC<NewSpaceModalButtonProps> = ({
   submitButtonTitle,
   cancelButtonTitle,
   onRefetch,
+  handleNavigation,
   ...props
 }) => {
   const ModalComponent: React.FC = () => {
@@ -90,6 +92,7 @@ export const NewSpaceModalButton: React.FC<NewSpaceModalButtonProps> = ({
         createSpace(payload)
           .then(() => {
             hideModal()
+            handleNavigation?.(formData.name)
             onRefetch()
           })
           .catch(_error => {

web/src/components/SpaceSelector/SpaceSelector.tsx

@@ -43,7 +43,6 @@ export const SpaceSelector: React.FC<SpaceSelectorProps> = ({ onSelect }) => {
   const [opened, setOpened] = React.useState(false)
   const [searchTerm, setSearchTerm] = useState('')
   // const [page, setPage] = usePageIndex(1)
-
   const { data, error } = useGetSpace({ space_ref: encodeURIComponent(space), lazy: !space })
 
   const {
@@ -64,6 +63,14 @@ export const SpaceSelector: React.FC<SpaceSelectorProps> = ({ onSelect }) => {
     [onSelect]
   )
 
+  useEffect(() => {
+    //space is used in the api call to get data, so it'll always be the same
+    if (space && data) {
+      selectSpace(data, false)
+      refetch()
+    }
+  }, [data])
+
   useEffect(() => {
     if (space && !selectedSpace && data) {
       selectSpace(data, false)

web/src/pages/Home/Home.tsx

@@ -2,6 +2,7 @@ import React from 'react'
 import { ButtonVariation, Container, Layout, PageBody, Text } from '@harnessio/uicore'
 import { FontVariation } from '@harnessio/design-system'
 import { useGet } from 'restful-react'
+import { useHistory } from 'react-router-dom'
 // import type { TypesSpace } from 'services/code'
 import { useStrings } from 'framework/strings'
 // import { usePageIndex } from 'hooks/usePageIndex'
@@ -13,6 +14,8 @@ import css from './Home.module.scss'
 
 export default function Home() {
   const { getString } = useStrings()
+  const history = useHistory()
+  const { routes } = useAppContext()
   // const [searchTerm, setSearchTerm] = useState('')
   // const [page, setPage] = usePageIndex(1)
   const { currentUser } = useAppContext()
@@ -32,6 +35,9 @@ export default function Home() {
       width={173}
       height={48}
       onRefetch={refetch}
+      handleNavigation={spaceName => {
+        history.push(routes.toCODERepositories({ space: spaceName }))
+      }}
     />
   )
   return (