docs: test table generic with my solution biatch

doc-app/app/router.ts

@@ -9,12 +9,13 @@ const Router = AddonDocsRouter.extend({
 });
 
 Router.map(function (this: RouterDSL) {
+  this.route('table');
   docsRoute(this, function (this: RouterDSL) {
     this.route('ember-ui', function (this: RouterDSL) {
       this.route('prefabs', function () {
-        this.route('confirm-modal')
-        this.route('table-generic')
-      })
+        this.route('confirm-modal');
+        this.route('table-generic');
+      });
       this.route('installation');
       this.route('lazy-image');
       this.route('actions-menu');
@@ -26,7 +27,7 @@ Router.map(function (this: RouterDSL) {
     this.route('ember-input', function () {
       this.route('installation');
       this.route('prefabs', function () {
-        this.route('button')
+        this.route('button');
         this.route('toggle');
       });
       this.route('input');

doc-app/app/routes/table.ts

@@ -0,0 +1,3 @@
+import Route from '@ember/routing/route';
+
+export default class TableRoute extends Route {}

doc-app/app/templates/docs/ember-ui/prefabs/table-generic.md

@@ -1,4 +1,4 @@
-# Table Generic
+<!-- # Table Generic
 
 the generic table is a component which is created from an object.
 It is also possible to pass components to the desired column.
@@ -34,4 +34,4 @@ Advanced usage:
   </demo.example>
   <demo.snippet @name="tpk-table-generic-prefab.hbs"/>
   <demo.snippet @name="tpk-table-generic-prefab.js"/>
-</DocsDemo>
+</DocsDemo> -->

doc-app/app/templates/table.gts

@@ -0,0 +1,82 @@
+import Component from '@glimmer/component';
+import RouteTemplate from 'ember-route-template';
+import type { RouteTemplateSignature } from 'doc-app/utils/route-template';
+import type TableRoute from 'doc-app/routes/table';
+import type UserModel from 'doc-app/models/user';
+import type { TpkSelectSignature } from '@triptyk/ember-input/components/tpk-select';
+import TpkSelectComponent from '@triptyk/ember-input/components/tpk-select';
+import TpkTableGenericPrefab, { type TableParams } from '@triptyk/ember-ui/components/prefabs/tpk-table-generic-prefab';
+import { hash } from '@ember/helper';
+
+export interface TableRouteComponentSignature {}
+
+class TableRouteComponent extends Component<RouteTemplateSignature<TableRoute>> {
+  emailOptions = ['info@triptyk.eu','loempia@triptyk.eu'];
+
+  tableParamsWithFunctions: TableParams = {
+    entity: 'user',
+    pageSizes: [10,30,50,75],
+    defaultSortColumn: 'firstName',
+    columns:[
+      {
+        field: 'firstName',
+        headerName: 'Prénom',
+        sortable: true,
+      },
+      {
+        field: 'email',
+        headerName: 'Email',
+        sortable:false,
+        component : 'selectEmail',
+      },
+    ],
+    actionMenu: [],
+  };
+
+  onUpdate = (selection: unknown, row: UserModel) => {
+    row.set('email', selection as string);
+    console.log(selection);
+    console.log(row);
+  }
+
+  <template>
+    <div class="flex justify-center items-center h-screen px-32">
+      <TpkTableGenericPrefab
+        @tableParams={{this.tableParamsWithFunctions}}
+        @columnsComponent={{hash
+          selectEmail=(component
+            SelectTableRegister
+              label="Email"
+              options=this.emailOptions
+              onUpdate=this.onUpdate
+          )
+        }}
+      />
+    </div>
+  </template>
+}
+
+export default RouteTemplate(TableRouteComponent);
+
+class SelectTableRegister extends Component<TpkSelectSignature & {
+    Args: {
+      cellValue: string,
+      onUpdate: (selection: unknown, row: UserModel) => void,
+      row: UserModel
+    }
+}> {
+
+  onChange = (selection: unknown) => {
+    this.args.onUpdate(selection, this.args.row);
+  }
+
+  <template>
+    <div data-test-table-generic-select>
+    <TpkSelectComponent  @options={{@options}} @onChange={{this.onChange}} @selected={{@cellValue}} @label="" as |S| >
+      <S.Option as |O|>
+        {{O.option}}
+      </S.Option>
+    </TpkSelectComponent>
+    </div>
+  </template>;
+}

doc-app/app/utils/route-template.ts

@@ -0,0 +1,20 @@
+import Route from '@ember/routing/route';
+import type Controller from '@ember/controller';
+
+export type ModelFrom<R extends Route> = Awaited<ReturnType<R['model']>>;
+
+export type RouteTemplateSignature<
+  R extends Route,
+  C extends Controller | undefined = undefined,
+> = C extends Controller
+  ? {
+      Args: {
+        model: ModelFrom<R>;
+        controller: C;
+      };
+    }
+  : {
+      Args: {
+        model: ModelFrom<R>;
+      };
+    };

doc-app/package.json

@@ -111,6 +111,7 @@
     "ember-power-select": "^8.4.0",
     "ember-qunit": "catalog:",
     "ember-resolver": "catalog:",
+    "ember-route-template": "^1.0.3",
     "ember-source": "~5.12.0",
     "ember-template-imports": "~4.2.0",
     "ember-template-lint": "^6.0.0",