[IMP] store: connected component reuse base component name

Connected component should have a unique name. To achieve this the
connected component currently have an id based generated name (like
`ConnectedComponent1`).

To make it clearer and ease debugging this commit reuse the extended
component's name to include it in the generated name in the form of
`Connected<ComponentName>`.

src/store.ts

@@ -170,8 +170,6 @@ interface StoreOptions {
   deep?: boolean;
 }
 
-let nextID = 1;
-
 export function connect<E extends EnvWithStore, P, S>(
   Comp: Constructor<Component<E, P, S>>,
   mapStoreToProps,
@@ -292,7 +290,7 @@ export function connect<E extends EnvWithStore, P, S>(
   // this is necessary for Owl to be able to properly deduce templates.
   // Otherwise, all connected components would have the same name, and then
   // each component after the first will necessarily have the same template.
-  let name = `ConnectedComponent${nextID++}`;
+  let name = `Connected${Comp.name}`;
   Object.defineProperty(Result, "name", { value: name });
   return Result;
 }

tests/store.test.ts

@@ -1157,4 +1157,21 @@ describe("connecting a component to store", () => {
     expect(fixture.innerHTML).toBe("<div>b</div>");
     expect(steps).toEqual(["willpatch", "patched"]);
   });
+
+  test("connected component has its own name", () => {
+    function mapStoreToProps() { }
+
+    class Named extends Component<any, any, any> { };
+    const namedConnected = connect(Named, mapStoreToProps);
+    expect(namedConnected.name).toMatch('ConnectedNamed');
+
+    class ParentNamed extends Component<any, any, any>{};
+    class ChildNamed extends ParentNamed{};
+    const childConnected = connect(ChildNamed, mapStoreToProps)
+    expect(childConnected.name).toMatch('ConnectedChildNamed')
+
+    const Anonymous = class extends Component<any, any, any>{ };
+    const anonymousConnected = connect(Anonymous, mapStoreToProps);
+    expect(anonymousConnected.name).toMatch(/^Connectedclass_\d+/);
+  });
 });