diff --git a/packages/builder/src/pages/builder/app/[application]/design/components/[screenId]/index.svelte b/packages/builder/src/pages/builder/app/[application]/design/components/[screenId]/index.svelte
index 02ce985c9f..f8c4cc0868 100644
--- a/packages/builder/src/pages/builder/app/[application]/design/components/[screenId]/index.svelte
+++ b/packages/builder/src/pages/builder/app/[application]/design/components/[screenId]/index.svelte
@@ -1,11 +1,14 @@
 <script>
-  import { selectedScreen } from "builderStore"
+  import { selectedScreen, selectedComponent } from "builderStore"
   import { onMount } from "svelte"
   import { redirect } from "@roxi/routify"
 
   onMount(() => {
-    if ($selectedScreen) {
-      // Select the screen slot if a screen exists
+    if ($selectedComponent) {
+      // Navigate to the selected component if one exists
+      $redirect(`./${$selectedComponent._id}`)
+    } else if ($selectedScreen) {
+      // Otherwise the screen slot if a screen exists
       $redirect(`./${$selectedScreen.props._id}`)
     } else {
       // Otherwise go up so we can select a new valid screen
diff --git a/packages/builder/src/pages/builder/app/[application]/design/components/[screenId]/new/_components/NewComponentTargetPanel.svelte b/packages/builder/src/pages/builder/app/[application]/design/components/[screenId]/new/_components/NewComponentTargetPanel.svelte
index 46b00c90eb..b8e5867736 100644
--- a/packages/builder/src/pages/builder/app/[application]/design/components/[screenId]/new/_components/NewComponentTargetPanel.svelte
+++ b/packages/builder/src/pages/builder/app/[application]/design/components/[screenId]/new/_components/NewComponentTargetPanel.svelte
@@ -1,10 +1,17 @@
 <script>
   import SettingsPanel from "components/design/settings/SettingsPanel.svelte"
   import { Body, Layout } from "@budibase/bbui"
+  import { selectedComponent, selectedScreen, store } from "builderStore"
+
+  $: componentDefinition = store.actions.components.getDefinition(
+    $selectedComponent?._component
+  )
+  $: isScreen = $selectedComponent?._id === $selectedScreen?.props._id
+  $: title = isScreen ? "Screen" : $selectedComponent?._instanceName
 </script>
 
-<SettingsPanel title="Screen" icon="WebPage">
+<SettingsPanel {title} icon={componentDefinition?.icon}>
   <Layout paddingX="L" paddingY="XL">
-    <Body>The component you add will be placed inside Screen</Body>
+    <Body>The component you add will be placed inside {title}</Body>
   </Layout>
 </SettingsPanel>
diff --git a/packages/builder/src/pages/builder/app/[application]/design/components/[screenId]/new/index.svelte b/packages/builder/src/pages/builder/app/[application]/design/components/[screenId]/new/index.svelte
index 4f8a42c6d4..8f2042671b 100644
--- a/packages/builder/src/pages/builder/app/[application]/design/components/[screenId]/new/index.svelte
+++ b/packages/builder/src/pages/builder/app/[application]/design/components/[screenId]/new/index.svelte
@@ -1,6 +1,25 @@
 <script>
   import NewComponentPanel from "./_components/NewComponentPanel.svelte"
   import NewComponentTargetPanel from "./_components/NewComponentTargetPanel.svelte"
+  import { onMount } from "svelte"
+  import { store, selectedComponent, selectedScreen } from "builderStore"
+  import { redirect } from "@roxi/routify"
+
+  // Select the screen slot as the target to add to, if no component
+  // is selected
+  onMount(() => {
+    if (!$selectedComponent) {
+      if ($selectedScreen) {
+        store.update(state => {
+          state.selectedComponentId = $selectedScreen.props._id
+          return state
+        })
+      } else {
+        // Otherwise go back out of the add screen
+        $redirect("../")
+      }
+    }
+  })
 </script>
 
 <NewComponentPanel />
