diff --git a/awx/ui_next/src/screens/Template/WorkflowJobTemplate.jsx b/awx/ui_next/src/screens/Template/WorkflowJobTemplate.jsx
index 1a71bb644f..22d1dcd187 100644
--- a/awx/ui_next/src/screens/Template/WorkflowJobTemplate.jsx
+++ b/awx/ui_next/src/screens/Template/WorkflowJobTemplate.jsx
@@ -47,7 +47,7 @@ class WorkflowJobTemplate extends Component {
     const { setBreadcrumb, match } = this.props;
     const { id } = match.params;
 
-    this.setState({ contentError: null, hasContentLoading: true });
+    this.setState({ contentError: null });
     try {
       const { data } = await WorkflowJobTemplatesAPI.readDetail(id);
       if (data?.related?.webhook_key) {
@@ -113,22 +113,17 @@ class WorkflowJobTemplate extends Component {
       tab.id = n;
     });
 
-    let cardHeader = hasContentLoading ? null : (
-      <TabbedCardHeader>
-        <RoutedTabs tabsArray={tabsArray} />
-        <CardActions>
-          <CardCloseButton linkTo="/templates" />
-        </CardActions>
-      </TabbedCardHeader>
-    );
-
-    if (location.pathname.endsWith('edit')) {
-      cardHeader = null;
-    }
     if (hasContentLoading) {
-      return <ContentLoading />;
+      return (
+        <PageSection>
+          <Card>
+            <ContentLoading />
+          </Card>
+        </PageSection>
+      );
     }
-    if (!hasContentLoading && contentError) {
+
+    if (contentError) {
       return (
         <PageSection>
           <Card>
@@ -145,10 +140,19 @@ class WorkflowJobTemplate extends Component {
       );
     }
 
+    const cardHeader = (
+      <TabbedCardHeader>
+        <RoutedTabs tabsArray={tabsArray} />
+        <CardActions>
+          <CardCloseButton linkTo="/templates" />
+        </CardActions>
+      </TabbedCardHeader>
+    );
+
     return (
       <PageSection>
         <Card>
-          {cardHeader}
+          {location.pathname.endsWith('edit') ? null : cardHeader}
           <Switch>
             <Redirect
               from="/templates/workflow_job_template/:id"
@@ -201,7 +205,7 @@ class WorkflowJobTemplate extends Component {
                 />
               </Route>
             )}
-            {template.id && (
+            {template?.id && (
               <Route
                 path="/templates/:templateType/:id/schedules"
                 render={() => (
@@ -215,19 +219,17 @@ class WorkflowJobTemplate extends Component {
             <Route
               key="not-found"
               path="*"
-              render={() =>
-                !hasContentLoading && (
-                  <ContentError isNotFound>
-                    {match.params.id && (
-                      <Link
-                        to={`/templates/workflow_job_template/${match.params.id}/details`}
-                      >
-                        {i18n._(`View Template Details`)}
-                      </Link>
-                    )}
-                  </ContentError>
-                )
-              }
+              render={() => (
+                <ContentError isNotFound>
+                  {match.params.id && (
+                    <Link
+                      to={`/templates/workflow_job_template/${match.params.id}/details`}
+                    >
+                      {i18n._(`View Template Details`)}
+                    </Link>
+                  )}
+                </ContentError>
+              )}
             />
           </Switch>
         </Card>