diff --git a/site/src/pages/CreateWorkspacePage/CreateWorkspacePageView.tsx b/site/src/pages/CreateWorkspacePage/CreateWorkspacePageView.tsx index 94957030ebc65..ba5a7e38eba6c 100644 --- a/site/src/pages/CreateWorkspacePage/CreateWorkspacePageView.tsx +++ b/site/src/pages/CreateWorkspacePage/CreateWorkspacePageView.tsx @@ -75,6 +75,17 @@ export const CreateWorkspacePageView: FC< // to disappear. setGitAuthErrors({}) }, [props.templateGitAuth]) + + const workspaceErrors = + props.createWorkspaceErrors[CreateWorkspaceErrors.CREATE_WORKSPACE_ERROR] + + // Scroll to top of page if errors are present + useEffect(() => { + if (props.hasTemplateErrors || Boolean(workspaceErrors)) { + window.scrollTo(0, 0) + } + }, [props.hasTemplateErrors, workspaceErrors]) + const { t } = useTranslation("createWorkspacePage") const styles = useStyles() @@ -149,73 +160,71 @@ export const CreateWorkspacePageView: FC< return } - if (props.hasTemplateErrors) { - return ( - - {Boolean( - props.createWorkspaceErrors[ - CreateWorkspaceErrors.GET_TEMPLATES_ERROR - ], - ) && ( - + + {Boolean(props.hasTemplateErrors) && ( + + {Boolean( props.createWorkspaceErrors[ CreateWorkspaceErrors.GET_TEMPLATES_ERROR - ] - } - /> - )} - {Boolean( - props.createWorkspaceErrors[ - CreateWorkspaceErrors.GET_TEMPLATE_SCHEMA_ERROR - ], - ) && ( - + )} + {Boolean( props.createWorkspaceErrors[ CreateWorkspaceErrors.GET_TEMPLATE_SCHEMA_ERROR - ] - } - /> + ], + ) && ( + + )} + {Boolean( + props.createWorkspaceErrors[ + CreateWorkspaceErrors.GET_TEMPLATE_GITAUTH_ERROR + ], + ) && ( + + )} + )} + {Boolean( props.createWorkspaceErrors[ - CreateWorkspaceErrors.GET_TEMPLATE_GITAUTH_ERROR + CreateWorkspaceErrors.CREATE_WORKSPACE_ERROR ], ) && ( )} - - ) - } - - if ( - props.createWorkspaceErrors[CreateWorkspaceErrors.CREATE_WORKSPACE_ERROR] - ) { - return ( - - ) - } - return ( - - {/* General info */}