Fix use agile types

examples/react/class-component-ts/src/App.tsx

@@ -111,7 +111,7 @@ const FinalApp = AgileHOC(App, {
   myState3: MY_STATE_3,
   myUndefined: undefined,
   myComputed: MY_COMPUTED,
-  myCollection: MY_COLLECTION as any,
+  myCollection: MY_COLLECTION,
   myGroup: MY_COLLECTION.getGroupWithReference('myGroup'),
 });
 

examples/react/class-component-ts/yarn.lock

@@ -3,16 +3,16 @@
 
 
 "@agile-ts/api@file:.yalc/@agile-ts/api":
-  version "0.0.9"
+  version "0.0.14"
 
 "@agile-ts/core@file:.yalc/@agile-ts/core":
-  version "0.0.9"
+  version "0.0.13"
 
 "@agile-ts/multieditor@file:.yalc/@agile-ts/multieditor":
-  version "0.0.9"
+  version "0.0.13"
 
 "@agile-ts/react@file:.yalc/@agile-ts/react":
-  version "0.0.9"
+  version "0.0.14"
 
 "@babel/code-frame@7.8.3":
   version "7.8.3"

examples/react/functional-component-ts/src/App.tsx

@@ -35,7 +35,7 @@ const App = (props: any) => {
     MY_COLLECTION.getSelector('mySelector'),
     MY_STATE_3,
     undefined,
-    MY_COLLECTION as any,
+    MY_COLLECTION,
   ]);
   const [myGroup] = useAgile([MY_COLLECTION.getGroupWithReference('myGroup')]);
 

packages/core/src/collection/index.ts

@@ -1199,7 +1199,7 @@ export class Collection<DataType = DefaultItem> {
   }
 }
 
-export type DefaultItem = { [key: string]: any };
+export type DefaultItem = Record<string, any>; // same as { [key: string]: any };
 export type CollectionKey = string | number;
 export type ItemKey = string | number;
 

packages/react/src/hocs/AgileHOC.ts

@@ -255,7 +255,11 @@ export class AgileReactComponent extends React.Component {
   }
 }
 
-type SubscribableAgileInstancesType = State | Collection | Observer | undefined;
+type SubscribableAgileInstancesType =
+  | State
+  | Collection<any> //https://stackoverflow.com/questions/66987727/type-classa-id-number-name-string-is-not-assignable-to-type-classar
+  | Observer
+  | undefined;
 type DepsType =
   | Array<SubscribableAgileInstancesType>
   | { [key: string]: SubscribableAgileInstancesType }

packages/react/src/hooks/useAgile.ts

@@ -97,46 +97,34 @@ export function useAgile<
 // Array Type
 // https://www.typescriptlang.org/docs/handbook/release-notes/typescript-2-1.html
 type AgileHookArrayType<T> = {
-  [K in keyof T]: T[K] extends Group<infer U>
+  [K in keyof T]: T[K] extends Collection<infer U> | Group<infer U>
     ? U[]
-    : T[K] extends State<infer U>
+    : T[K] extends State<infer U> | Observer<infer U>
     ? U
-    : T[K] extends Observer<infer U>
-    ? U
-    : T[K] extends Collection<infer U>
-    ? U[]
     : T[K] extends undefined
     ? undefined
-    : T[K] extends Group<infer U> | undefined
+    : T[K] extends Collection<infer U> | Group<infer U> | undefined
     ? U[] | undefined
-    : T[K] extends State<infer U> | undefined
+    : T[K] extends State<infer U> | Observer<infer U> | undefined
     ? U | undefined
-    : T[K] extends Observer<infer U> | undefined
-    ? U | undefined
-    : T[K] extends Collection<infer U> | undefined
-    ? U[] | undefined
     : never;
 };
 
 // No Array Type
-type AgileHookType<T> = T extends Group<infer U>
+type AgileHookType<T> = T extends Collection<infer U> | Group<infer U>
   ? U[]
-  : T extends State<infer U>
+  : T extends State<infer U> | Observer<infer U>
   ? U
-  : T extends Observer<infer U>
-  ? U
-  : T extends Collection<infer U>
-  ? U[]
   : T extends undefined
   ? undefined
-  : T extends Group<infer U> | undefined
+  : T extends Collection<infer U> | Group<infer U> | undefined
   ? U[] | undefined
-  : T extends State<infer U> | undefined
+  : T extends State<infer U> | Observer<infer U> | undefined
   ? U | undefined
-  : T extends Observer<infer U> | undefined
-  ? U | undefined
-  : T extends Collection<infer U> | undefined
-  ? U[] | undefined
   : never;
 
-type SubscribableAgileInstancesType = State | Collection | Observer | undefined;
+type SubscribableAgileInstancesType =
+  | State
+  | Collection<any> //https://stackoverflow.com/questions/66987727/type-classa-id-number-name-string-is-not-assignable-to-type-classar
+  | Observer
+  | undefined;

packages/react/tests/old/useAgile.spec.ts

@@ -1,8 +1,10 @@
+// Be aware that in the test folder other ts rules count than in the src folder
 // THIS ARE ONLY TYPE TESTS
+// NOTE: Has to be out commented because React Hooks in not React Components are not possible!
 
-/* NOTE: Has to be out commented because React Hooks in not React Components are not possible!
-import { Agile } from '@agile-ts/core';
-import { useAgile } from '../../src';
+/*
+import { Agile, Collection } from '@agile-ts/core';
+import { useAgile } from './hooks/useAgile';
 
 const App = new Agile();
 
@@ -27,7 +29,7 @@ const [
   MY_SELECTOR,
   MY_NUMBER_STATE,
   MY_STRING_COMPUTED,
-  MY_COLLECTION,
+  MY_COLLECTION as any,
   MY_COLLECTION.getGroup('test'),
   MY_NUMBER_STATE,
 ]);
@@ -36,8 +38,12 @@ const myStringState2 = useAgile(MY_STRING_STATE);
 const [myGroup2, myStringState3, myCollection2] = useAgile([
   MY_COLLECTION.getGroup('test'),
   MY_STRING_STATE,
-  MY_COLLECTION,
+  MY_COLLECTION as any,
 ]);
 
-const myCollection3 = useAgile(MY_COLLECTION)
-*/
+const myState10 = useAgile(MY_NUMBER_STATE);
+const myCollection10 = useAgile(MY_COLLECTION);
+const myCollection11 = useAgile(
+  new Collection<{ id: number; name: string }>(App)
+);
+ */