Merge pull request emberjs#20570 from emberjs/named-outlets-removal

[CLEANUP] Remove all traces of named outlets code

packages/@ember/-internals/glimmer/index.ts

@@ -474,7 +474,7 @@ export { DOMChanges, NodeDOMTreeConstruction, DOMTreeConstruction } from './lib/
 // a lot of these are testing how a problem was solved
 // rather than the problem was solved
 export { default as OutletView, BootEnvironment } from './lib/views/outlet';
-export { OutletState } from './lib/utils/outlet';
+export { OutletState, RenderState } from './lib/utils/outlet';
 export {
   componentCapabilities,
   modifierCapabilities,

packages/@ember/-internals/glimmer/lib/component-managers/outlet.ts

@@ -32,12 +32,13 @@ import type { OutletState } from '../utils/outlet';
 import type OutletView from '../views/outlet';
 
 function instrumentationPayload(def: OutletDefinitionState) {
-  return { object: `${def.name}:${def.outlet}` };
+  // "main" used to be the outlet name, keeping it around for compatibility
+  return { object: `${def.name}:main` };
 }
 
 interface OutletInstanceState {
   self: Reference;
-  outlet?: { name: string };
+  outletBucket?: {};
   engineBucket?: { mountPoint: string };
   engine?: EngineInstance;
   finalize: () => void;
@@ -46,7 +47,6 @@ interface OutletInstanceState {
 export interface OutletDefinitionState {
   ref: Reference<OutletState | undefined>;
   name: string;
-  outlet: string;
   template: Template;
   controller: unknown;
   model: unknown;
@@ -91,7 +91,8 @@ class OutletComponentManager
     };
 
     if (env.debugRenderTree !== undefined) {
-      state.outlet = { name: definition.outlet };
+      state.outletBucket = {};
+
       let parentState = valueForRef(parentStateRef);
       let parentOwner = parentState && parentState.render && parentState.render.owner;
       let currentOwner = valueForRef(currentStateRef)!.render!.owner;
@@ -126,16 +127,17 @@ class OutletComponentManager
   ): CustomRenderNode[] {
     let nodes: CustomRenderNode[] = [];
 
-    if (state.outlet) {
-      nodes.push({
-        bucket: state.outlet,
-        type: 'outlet',
-        name: state.outlet.name,
-        args: EMPTY_ARGS,
-        instance: undefined,
-        template: undefined,
-      });
-    }
+    assert('[BUG] outletBucket must be set', state.outletBucket);
+
+    nodes.push({
+      bucket: state.outletBucket,
+      type: 'outlet',
+      // "main" used to be the outlet name, keeping it around for compatibility
+      name: 'main',
+      args: EMPTY_ARGS,
+      instance: undefined,
+      template: undefined,
+    });
 
     if (state.engineBucket) {
       nodes.push({

packages/@ember/-internals/glimmer/lib/syntax/outlet.ts

@@ -16,7 +16,6 @@ import { dict } from '@glimmer/util';
 import type { OutletDefinitionState } from '../component-managers/outlet';
 import { OutletComponentDefinition } from '../component-managers/outlet';
 import { internalHelper } from '../helpers/internal-helper';
-import { isTemplateFactory } from '../template';
 import type { OutletState } from '../utils/outlet';
 
 /**
@@ -53,9 +52,7 @@ export const outletHelper = internalHelper(
 
     let outletRef = createComputeRef(() => {
       let state = valueForRef(scope.get('outletState') as Reference<OutletState | undefined>);
-      let outlets = state !== undefined ? state.outlets : undefined;
-
-      return outlets !== undefined ? outlets['main'] : undefined;
+      return state?.outlets?.main;
     });
 
     let lastState: OutletDefinitionState | null = null;
@@ -120,16 +117,9 @@ function stateFor(ref: Reference, outlet: OutletState | undefined): OutletDefini
   let template = render.template;
   if (template === undefined) return null;
 
-  // this guard can be removed once @ember/test-helpers@1.6.0 has "aged out"
-  // and is no longer considered supported
-  if (isTemplateFactory(template)) {
-    template = template(render.owner);
-  }
-
   return {
     ref,
     name: render.name,
-    outlet: render.outlet,
     template,
     controller: render.controller,
     model: render.model,

packages/@ember/-internals/glimmer/lib/utils/outlet.ts

@@ -1,23 +1,41 @@
 import type { InternalOwner } from '@ember/-internals/owner';
-import type { Template, TemplateFactory } from '@glimmer/interfaces';
+import type { Template } from '@glimmer/interfaces';
+
+// Note: a lot of these does not make sense anymore. This design was from back
+// when we supported "named outlets", where a route can do:
+//
+// this.renderTemplate("some-template", {
+//   into: 'some-parent-route',
+//   outlet: 'some-name' /* {{outlet "some-name"}} */ | undefined /* {{outlet}} */,
+//   controller: 'some-controller' | SomeController,
+//   model: { ... },
+// });
+//
+// And interface reflects that. Now that this is not supported anymore, each
+// route implicitly renders into its immediate parent's `{{outlet}}` (no name).
+// Keeping around most of these to their appropriately hardcoded values for the
+// time being to minimize churn for external consumers, as we are about to rip
+// all of it out anyway.
 
 export interface RenderState {
   /**
-   * Not sure why this is here, we use the owner of the template for lookups.
-   *
-   * Maybe this is for the render helper?
+   * This is usually inherited from the parent (all the way up to the app
+   * instance). However, engines uses this to swap out the owner when crossing
+   * a mount point.
    */
   owner: InternalOwner;
 
   /**
-   * The name of the parent outlet state.
+   * @deprecated This used to specify "which parent route to render into",
+   * which is not a thing anymore.
    */
-  into: string | undefined;
+  into: undefined;
 
-  /*
-   * The outlet name in the parent outlet state's outlets.
+  /**
+   * @deprecated This used to specify "which named outlet in the parent
+   * template to render into", which is not a thing anymore.
    */
-  outlet: string;
+  outlet: 'main';
 
   /**
    * The name of the route/template
@@ -37,27 +55,42 @@ export interface RenderState {
   /**
    * template (the layout of the outlet component)
    */
-  template: Template | TemplateFactory | undefined;
-}
-
-export interface Outlets {
-  [name: string]: OutletState | undefined;
+  template: Template | undefined;
 }
 
 export interface OutletState {
   /**
-   * Nested outlet connections.
+   * Represents what was rendered into this outlet.
    */
-  outlets: Outlets;
+  render: RenderState | undefined;
 
   /**
-   * Represents what was rendered into this outlet.
+   * Represents what, if any, should be rendered into the next {{outlet}} found
+   * at this level.
+   *
+   * This used to be a dictionary of children outlets, including the {{outlet}}
+   * "main" outlet any {{outlet "named"}} named outlets. Since named outlets
+   * are not a thing anymore, this can now just be a single`child`.
    */
-  render: RenderState | undefined;
+  outlets: {
+    main: OutletState | undefined;
+  };
 
   /**
-   * Has to do with render helper and orphan outlets.
-   * Whether outlet state was rendered.
+   * @deprecated
+   *
+   * This tracks whether this outlet state actually made it onto the page
+   * somewhere. This was more of a problem when you can declare named outlets
+   * left and right, and anything can render into anywhere else. We want to
+   * warn users when you tried to render into somewhere that does not exist,
+   * but we don't know what named outlets exists until after we have rendered
+   * everything, so this was used to track these orphan renders.
+   *
+   * This can still happen, if, according to the router, a route is active and
+   * so its template should be rendered, but the parent template is missing the
+   * `{{outlet}}` keyword, or that it was hidden by an `{{#if}}` or something.
+   * I guess that is considered valid, because nothing checks for this anymore.
+   * seems valid for the parent to decide not to render a child template?
    */
-  wasUsed?: boolean;
+  wasUsed?: undefined;
 }

packages/@ember/-internals/glimmer/lib/views/outlet.ts

@@ -23,7 +23,6 @@ export interface BootEnvironment {
 }
 
 const TOP_LEVEL_NAME = '-top-level';
-const TOP_LEVEL_OUTLET = 'main';
 
 export default class OutletView {
   static extend(injections: any): typeof OutletView {
@@ -69,7 +68,7 @@ export default class OutletView {
       render: {
         owner: owner,
         into: undefined,
-        outlet: TOP_LEVEL_OUTLET,
+        outlet: 'main',
         name: TOP_LEVEL_NAME,
         controller: undefined,
         model: undefined,
@@ -91,7 +90,6 @@ export default class OutletView {
     this.state = {
       ref,
       name: TOP_LEVEL_NAME,
-      outlet: TOP_LEVEL_OUTLET,
       template,
       controller: undefined,
       model: undefined,