[IMP] component: support dynamic t-component

src/component/directive.ts

@@ -1,4 +1,5 @@
 import { QWeb } from "../qweb/index";
+import { INTERP_REGEXP } from "../qweb/context";
 import { MODS_CODE } from "../qweb/extensions";
 
 //------------------------------------------------------------------------------
@@ -398,10 +399,16 @@ QWeb.addDirective({
 
     ctx.addIf(`!w${componentID}`);
     // new component
-    ctx.addLine(`let componentKey${componentID} = ${ctx.interpolate(value)};`);
+    let dynamicFallback = "";
+    if (!value.match(INTERP_REGEXP)) {
+      dynamicFallback = `|| ${ctx.formatExpression(value)}`;
+    }
+    const interpValue = ctx.interpolate(value);
+    ctx.addLine(`let componentKey${componentID} = ${interpValue};`);
     ctx.addLine(
-      `let W${componentID} = context.constructor.components[componentKey${componentID}] || QWeb.components[componentKey${componentID}];`
+      `let W${componentID} = context.constructor.components[componentKey${componentID}] || QWeb.components[componentKey${componentID}]${dynamicFallback};`
     );
+
     // maybe only do this in dev mode...
     ctx.addLine(
       `if (!W${componentID}) {throw new Error('Cannot find the definition of component "' + componentKey${componentID} + '"')}`

src/qweb/context.ts

@@ -1,5 +1,6 @@
 import { compileExpr, QWebVar } from "./expression_parser";
 
+export const INTERP_REGEXP = /\{\{.*?\}\}/g;
 //------------------------------------------------------------------------------
 // Compilation Context
 //------------------------------------------------------------------------------
@@ -163,7 +164,7 @@ export class Context {
    *   '{{x ? 'a': 'b'}}' -> (x ? 'a' : 'b')
    */
   interpolate(s: string): string {
-    let matches = s.match(/\{\{.*?\}\}/g);
+    let matches = s.match(INTERP_REGEXP);
     if (matches && matches[0].length === s.length) {
       return `(${this.formatExpression(s.slice(2, -2))})`;
     }

src/router/RouteComponent.ts

@@ -3,25 +3,16 @@ import { xml } from "../tags";
 
 export class RouteComponent extends Component<any, {}, {}> {
   static template = xml`
-    <t t-foreach="routes" t-as="route">
-        <t t-if="env.router.currentRouteName === route.name">
-            <t t-component="{{route.component}}" t-props="env.router.currentParams"/>
-        </t>
+    <t>
+        <t
+            t-if="routeComponent"
+            t-component="routeComponent"
+            t-key="env.router.currentRouteName"
+            t-props="env.router.currentParams" />
     </t>
   `;
 
-  routes: any[] = [];
-  constructor(parent, props) {
-    super(parent, props);
-    const router = this.env.router;
-    for (let name of router.routeIds) {
-      const route = router.routes[name];
-      if (route.component) {
-        this.routes.push({
-          name: route.name,
-          component: "__component__" + route.name
-        });
-      }
-    }
+  get routeComponent(): any {
+      return this.env.router.currentRoute && this.env.router.currentRoute.component;
   }
 }