Enable Embroider/Webpack code spliting for Wizard

* Move Wizard back into main app, remove Wizard addon
* Remove Wizard-related resolver or build hacks
* Add a `app/static` folder in the app, add it to `staticAppPaths`
* Install and enable `@embroider/router`
* Add "wizard" to `splitAtRoutes`

In a fully optimized Embroider app, route-based code splitting more
or less Just Work™ – install `@embroider/router`, subclass from it,
configure which routes you want to split and that's about it.

However, our app is not "fully optimized", by which I mean we are
not able to turn on all the `static*` flags.

In Embroider, "static" means "statically analyzable". Specifically
it means that all inter-dependencies between modules (files) are
explicitly expressed as `import`s, as opposed to `{{i18n ...}}`
magically means "look for the default export in app/helpers/i18n.js"
or something even more dynamic with the resolver.

Without turning on those flags, Embroider behaves conservatively,
slurps up all `app` files eagerly into the primary bundle/chunks.
So, while you _could_ turn on route-based code splitting, there
won't be much to split.

The commits leading up to this involves a bunch of refactors and
cleanups that 1) works perfectly fine in the classic build, 2) are
good and useful in their own right, but also 3) re-arranged thigns
such that most dependencies are now explicit.

With those in place, I was able to move all the wizard code into
the "app/static" folder. Embrodier does not eagerly pull things from
this folder into any bundle, unless something explicitly "asks" for
them via `imports`. Conversely, thigns from this folder are not
registered with the resolver and are not added to the `loader.js`
registry.

In conjunction with route-based code splitting, we now have the
ability to split out islands of on-demand functionalities from the
main app bundle.

When you split a route in Embroider, it automatically creates a
bundle/entrypoint with the relevant routes/templates/controllers
matching that route prefix. Anything they import will be added to
the bundle as well, assuming they are not alreay in the main app
bundle, which is where the "app/static" folder comes into play.

The "app/static" folder name is not special. It is configured in
ember-cli-build.js. Alternatively, we could have left everything
in their normal locations, and add more fine-grained paths to the
`staticAppPaths` array. I just thought it would be easy to manage
and scale, and less error-prone to do it this way.

Note that putting things in `app/static` does not guarentee that
it would not be part of the main app bundle. For example, if we
were to add an `import ... from "app/static/wizard/...";` in a
main bundle file (say, `app.js`), then that chunk of the module
graph would be pulled in. (Consider using `await import(...)`?)

Overtime, we can build better tooling (e.g. lint rules and babel
macros to make things less repetitive) as we expand the use of
this pattern, but this is a start.

app/assets/javascripts/bootstrap-json/index.js

@@ -68,15 +68,11 @@ function head(buffer, bootstrap, headers, baseURL) {
 
   if (bootstrap.preloaded.currentUser) {
     const user = JSON.parse(bootstrap.preloaded.currentUser);
-    let { admin, staff } = user;
+    let { staff } = user;
 
     if (staff) {
       buffer.push(`<script defer src="${baseURL}assets/admin.js"></script>`);
     }
-
-    if (admin) {
-      buffer.push(`<script defer src="${baseURL}assets/wizard.js"></script>`);
-    }
   }
 
   bootstrap.plugin_js.forEach((src) =>

app/assets/javascripts/discourse-common/addon/lib/deprecated.js

@@ -38,7 +38,7 @@ export default function deprecated(msg, options = {}) {
 
   let consolePrefix = "";
   if (window.Discourse) {
-    // This module doesn't exist in pretty-text/wizard/etc.
+    // This module doesn't exist in pretty-text etc.
     consolePrefix =
       require("discourse/lib/source-identifier").consolePrefix() || "";
   }

app/assets/javascripts/discourse-common/addon/lib/discourse-template-map.js

@@ -8,7 +8,7 @@ function appendToCache(cache, key, value) {
   cache.set(key, cachedValue);
 }
 
-const NAMESPACES = ["discourse/", "wizard/", "admin/"];
+const NAMESPACES = ["discourse/", "admin/"];
 
 function isInRecognisedNamespace(moduleName) {
   for (const ns of NAMESPACES) {

app/assets/javascripts/discourse-common/addon/lib/loader-shim.js

@@ -16,7 +16,7 @@ let { define: __define__, require: __require__ } = globalThis;
 // it appears to be unused in the static analysis.
 //
 // For Discourse, the AMD/loader.js mechanism is an important glue. It is what
-// allows Discourse core/admin/wizard/plugins to all be separate .js bundlers
+// allows Discourse core/admin/plugins to all be separate .js bundlers
 // and be "glued back together" as full module graph in the browser.
 //
 // For instance, a plugin module can `import Post from "discourse/models/post";

app/assets/javascripts/discourse-common/addon/resolver.js

@@ -135,7 +135,6 @@ function lookupModuleBySuffix(suffix) {
       "discourse-common/",
       "select-kit/",
       "admin/",
-      "wizard/",
       "truth-helpers/",
     ];
     Object.keys(requirejs.entries).forEach((name) => {
@@ -215,18 +214,12 @@ export function buildResolver(baseName) {
           const dashed = dasherize(split[1].replace(/[\.\/]/g, "-"));
 
           const adminBase = `admin/${type}s/`;
-          const wizardBase = `wizard/${type}s/`;
           if (
             lookupModuleBySuffix(`${type}s/${dashed}`) ||
             requirejs.entries[adminBase + dashed] ||
             requirejs.entries[adminBase + dashed.replace(/^admin[-]/, "")] ||
             requirejs.entries[
               adminBase + dashed.replace(/^admin[-]/, "").replace(/-/g, "_")
-            ] ||
-            requirejs.entries[wizardBase + dashed] ||
-            requirejs.entries[wizardBase + dashed.replace(/^wizard[-]/, "")] ||
-            requirejs.entries[
-              wizardBase + dashed.replace(/^wizard[-]/, "").replace(/-/g, "_")
             ]
           ) {
             corrected = type + ":" + dashed;
@@ -282,7 +275,6 @@ export function buildResolver(baseName) {
         this.findMobileTemplate(parsedName) ||
         this.findTemplate(parsedName) ||
         this.findAdminTemplate(parsedName) ||
-        this.findWizardTemplate(parsedName) ||
         this.findLoadingTemplate(parsedName) ||
         this.findConnectorTemplate(parsedName) ||
         this.discourseTemplateModule("not_found")
@@ -386,28 +378,5 @@ export function buildResolver(baseName) {
 
       return resolved;
     }
-
-    findWizardTemplate(parsedName) {
-      if (parsedName.fullNameWithoutType === "wizard") {
-        return this.discourseTemplateModule("wizard/templates/wizard");
-      }
-
-      let namespaced;
-
-      if (parsedName.fullNameWithoutType.startsWith("components/")) {
-        // Look up components as-is
-        namespaced = parsedName.fullNameWithoutType;
-      } else if (/^wizard[_\.-]/.test(parsedName.fullNameWithoutType)) {
-        // This may only get hit for the loading routes and may be removable.
-        namespaced = parsedName.fullNameWithoutType.slice(7);
-      }
-
-      if (namespaced) {
-        let wizardParsedName = this.parseName(
-          `template:wizard/templates/${namespaced}`
-        );
-        return this.findTemplate(wizardParsedName);
-      }
-    }
   };
 }

app/assets/javascripts/discourse/app/mapping-router.js

@@ -1,11 +1,11 @@
-import EmberRouter from "@ember/routing/router";
+import EmbroiderRouter from "@embroider/router";
 import { rewritePath } from "discourse/lib/url";
 import { defaultHomepage } from "discourse/lib/utilities";
 import Site from "discourse/models/site";
 import { isTesting } from "discourse-common/config/environment";
 import getURL from "discourse-common/lib/get-url";
 
-const BareRouter = EmberRouter.extend({
+const BareRouter = EmbroiderRouter.extend({
   location: isTesting() ? "none" : "discourse-location",
 
   handleURL(url) {

app/assets/javascripts/discourse/app/routes/app-route-map.js

@@ -278,4 +278,8 @@ export default function () {
       this.route("show", { path: "/:token" });
     }
   );
+
+  this.route("wizard", function () {
+    this.route("step", { path: "/steps/:step_id" });
+  });
 }

app/assets/javascripts/wizard/addon/routes/wizard.js → app/assets/javascripts/discourse/app/routes/wizard.js

@@ -1,6 +1,6 @@
 import Route from "@ember/routing/route";
 import DisableSidebar from "discourse/mixins/disable-sidebar";
-import Wizard from "wizard/models/wizard";
+import Wizard from "discourse/static/wizard/models/wizard";
 
 export default class WizardRoute extends Route.extend(DisableSidebar) {
   model() {

app/assets/javascripts/wizard/addon/templates/wizard.gjs → app/assets/javascripts/discourse/app/templates/wizard.gjs

@@ -1,6 +1,6 @@
 import RouteTemplate from "ember-route-template";
 import hideApplicationFooter from "discourse/helpers/hide-application-footer";
-import DiscourseLogo from "../components/discourse-logo";
+import DiscourseLogo from "discourse/static/wizard/components/discourse-logo";
 
 export default RouteTemplate(<template>
   {{hideApplicationFooter}}

app/assets/javascripts/wizard/addon/templates/step.gjs → app/assets/javascripts/discourse/app/templates/wizard/step.gjs

@@ -2,9 +2,9 @@ import Component from "@glimmer/component";
 import { action } from "@ember/object";
 import { inject as service } from "@ember/service";
 import RouteTemplate from "ember-route-template";
+import WizardCanvas from "discourse/static/wizard/components/wizard-canvas";
+import WizardStep from "discourse/static/wizard/components/wizard-step";
 import getUrl from "discourse-common/lib/get-url";
-import WizardCanvas from "../components/wizard-canvas";
-import WizardStep from "../components/wizard-step";
 
 export default RouteTemplate(
   class extends Component {

app/assets/javascripts/discourse/ember-cli-build.js

@@ -99,8 +99,6 @@ module.exports = function (defaults) {
 
   const adminTree = app.project.findAddonByName("admin").treeForAddonBundle();
 
-  const wizardTree = app.project.findAddonByName("wizard").treeForAddonBundle();
-
   const markdownItBundleTree = app.project
     .findAddonByName("pretty-text")
     .treeForMarkdownItBundle();
@@ -127,10 +125,6 @@ module.exports = function (defaults) {
       inputFiles: ["**/*.js"],
       outputFile: `assets/admin.js`,
     }),
-    concat(wizardTree, {
-      inputFiles: ["**/*.js"],
-      outputFile: `assets/wizard.js`,
-    }),
     concat(markdownItBundleTree, {
       inputFiles: ["**/*.js"],
       outputFile: `assets/markdown-it-bundle.js`,
@@ -146,6 +140,8 @@ module.exports = function (defaults) {
   ];
 
   return compatBuild(app, Webpack, {
+    splitAtRoutes: ["wizard"],
+    staticAppPaths: ["static"],
     extraPublicTrees,
     packagerOptions: {
       webpackConfig: {
@@ -155,7 +151,6 @@ module.exports = function (defaults) {
             if (
               !request.includes("-embroider-implicit") &&
               (request.startsWith("admin/") ||
-                request.startsWith("wizard/") ||
                 (request.startsWith("pretty-text/engines/") &&
                   request !== "pretty-text/engines/discourse-markdown-it") ||
                 request.startsWith("discourse/plugins/") ||

app/assets/javascripts/discourse/package.json

@@ -40,6 +40,7 @@
     "@embroider/compat": "^3.2.3",
     "@embroider/core": "^3.3.0",
     "@embroider/macros": "^1.13.1",
+    "@embroider/router": "^2.1.4",
     "@embroider/webpack": "^3.2.0",
     "@floating-ui/dom": "^1.5.0",
     "@glimmer/component": "^1.1.2",
@@ -131,7 +132,6 @@
     "util": "^0.12.5",
     "virtual-dom": "^2.1.1",
     "webpack": "^5.89.0",
-    "wizard": "1.0.0",
     "workbox-cacheable-response": "^7.0.0",
     "workbox-core": "^7.0.0",
     "workbox-expiration": "^7.0.0",

app/assets/javascripts/discourse/tests/acceptance/sidebar-user-test.js

@@ -1,4 +1,5 @@
 import { click, visit } from "@ember/test-helpers";
+import "discourse/routes/wizard";
 import { test } from "qunit";
 import Sinon from "sinon";
 import {

app/assets/javascripts/discourse/tests/acceptance/wizard-test.js

@@ -5,6 +5,7 @@ import {
   fillIn,
   visit,
 } from "@ember/test-helpers";
+import "discourse/routes/wizard";
 import { test } from "qunit";
 import { acceptance, exists } from "discourse/tests/helpers/qunit-helpers";
 

app/assets/javascripts/discourse/tests/index.html

@@ -63,7 +63,6 @@
     <script src="{{rootURL}}assets/test-site-settings.js" data-embroider-ignore></script>
     <script src="{{rootURL}}assets/markdown-it-bundle.js" data-embroider-ignore></script>
     <script src="{{rootURL}}assets/admin.js" data-embroider-ignore></script>
-    <script src="{{rootURL}}assets/wizard.js" data-embroider-ignore></script>
 
     <template id="dynamic-test-js">
       {{content-for "test-plugin-css"}}

app/assets/javascripts/discourse/tests/unit/ember/resolver-test.js

@@ -598,96 +598,6 @@ module("Unit | Ember | resolver", function (hooks) {
     );
   });
 
-  test("resolves templates with 'wizard' prefix", function (assert) {
-    setTemplates([
-      "wizard/templates/foo",
-      "discourse/templates/wizard_bar",
-      "discourse/templates/wizard.bar",
-      "wizard/templates/bar",
-      "wizard/templates/dashboard_general",
-      "discourse/templates/wizard-baz-qux",
-      "javascripts/wizard/plugin-template",
-    ]);
-
-    // Switches prefix to wizard/templates when underscored
-    lookupTemplate(
-      assert,
-      "template:wizard_foo",
-      "wizard/templates/foo",
-      "when prefix is separated by underscore"
-    );
-
-    // Switches prefix to wizard/templates when dotted
-    lookupTemplate(
-      assert,
-      "template:wizard.foo",
-      "wizard/templates/foo",
-      "when prefix is separated by dot"
-    );
-
-    // Doesn't match unseparated prefix
-    lookupTemplate(
-      assert,
-      "template:wizardfoo",
-      undefined,
-      "but not when prefix is not separated in any way"
-    );
-
-    // Prioritized the default match when underscored
-    lookupTemplate(
-      assert,
-      "template:wizard_bar",
-      "discourse/templates/wizard_bar",
-      "but not when template with the exact underscored name exists"
-    );
-
-    // Prioritized the default match when dotted
-    lookupTemplate(
-      assert,
-      "template:wizard.bar",
-      "discourse/templates/wizard.bar",
-      "but not when template with the exact dotted name exists"
-    );
-
-    lookupTemplate(
-      assert,
-      "template:wizard-dashboard-general",
-      "wizard/templates/dashboard_general",
-      "finds namespaced and underscored version"
-    );
-
-    lookupTemplate(
-      assert,
-      "template:wizard-baz/qux",
-      "discourse/templates/wizard-baz-qux",
-      "also tries dasherized"
-    );
-  });
-
-  test("resolves component templates with 'wizard' prefix to 'wizard/templates/' namespace", function (assert) {
-    setTemplates([
-      "wizard/templates/components/foo",
-      "discourse/templates/components/bar",
-      "wizard/templates/components/bar",
-    ]);
-
-    // Looks for components in wizard/templates
-    lookupTemplate(
-      assert,
-      "template:components/foo",
-      "wizard/templates/components/foo",
-      "uses wizard template component when no standard match"
-    );
-
-    // Prioritized non-wizard component
-    lookupTemplate(
-      assert,
-      "template:components/bar",
-      "discourse/templates/components/bar",
-      "uses standard match when both exist"
-    );
-  });
-
   test("resolves plugin/theme components with and without /index", function (assert) {
     registerTemporaryModule(
       "discourse/plugins/my-fake-plugin/discourse/components/my-component",

app/assets/javascripts/discourse/tests/unit/models/wizard-field-test.js

@@ -1,6 +1,6 @@
 import { setupTest } from "ember-qunit";
 import { module, test } from "qunit";
-import { Field } from "wizard/models/wizard";
+import { Field } from "discourse/static/wizard/models/wizard";
 
 module("Unit | Model | Wizard | wizard-field", function (hooks) {
   setupTest(hooks);

app/assets/javascripts/package.json

@@ -20,8 +20,7 @@
     "pretty-text",
     "select-kit",
     "theme-transpiler",
-    "truth-helpers",
-    "wizard"
+    "truth-helpers"
   ],
   "resolutions": {
     "**/unset-value": "2.0.1"