appuniversum / ember-appuniversum

Ember addon wrapping the appuniversum components.
https://appuniversum.github.io/ember-appuniversum
MIT License
14 stars 11 forks source link

[Quest] Provide TS and Glint types #425

Open Windvis opened 1 year ago

Windvis commented 1 year ago

Official support for this in Ember is starting to get better and better so it would be nice if we can support it as a first-class citizen as well.

Some options:

I think converting to .gts/.ts makes the most sense.

We might need to use this tool to strip some reference comments when publishing, since those cause issues in consuming apps.

Files we need to convert:

Components - [x] `` - [x] `` - [x] `` - [x] `` - [x] `` - [x] `` - [x] `` - [x] `` - [x] `` - [x] `` - [x] `` - [x] `` - [x] `` - [ ] `` ? This one might be tricky since it extends an addon - [x] `` - [x] `` - [x] `` ~~(requires [ember-focus-trap types](https://github.com/josemarluedke/ember-focus-trap/issues/86))~~ We have local types for that now - [x] `` - [x] `` - [x] `` - [x] `` - [x] `` - [x] `` - [x] `` - [x] `` - [x] `` - [x] `` - [x] `` - [x] `` - [x] `` - [x] `` - [x] `` - [x] `` - [x] `` - [x] `` - [x] `` ~~(requires [ember-focus-trap types](https://github.com/josemarluedke/ember-focus-trap/issues/86))~~ We have local types for that now - [x] `` - [x] `` - [x] `` - [x] `` - [x] `` - [x] `` - [x] `` - [x] `` - [x] `` - [ ] `` - [x] `` - [x] ``
Helpers (Done) - [x] `{{link-to-models}}` (private, but we still need types internally)
Modifiers (Done) - [x] `{{au-date-input}}` - [x] `{{au-inputmask}}` - [x] `{{floating-ui}}` (private, but we still need types internally)
Services - [ ] `Toaster` (Partial implementation in #490 but it's not working fully yet)

Conversion guide

Reading the Glint documentation is a good place to get familiar with everything.

Components

  1. Choose a component that has no (untyped) dependencies
  2. Change the extension to .gts
  3. Add glint types
  4. Convert the test file to .gts
  5. Add an entry to the template-registry.ts file, this allows glint to type check the loose-mode version
  6. Add a test to the loose-mode-test.ts file. This verifies that the component is registered in the template registry.
  7. run npm run lint:types to validate the types

Helpers & Modifiers

  1. Choose a file that has no (untyped) dependencies
  2. Change the extension to .ts
  3. Add glint types
  4. Convert the test file to .gts
  5. Add an entry to the template-registry.ts file (if the helper isn't private), this allows glint to type check the loose-mode version
  6. Add a test to the loose-mode-test.ts file (if the helper isn't private). This verifies that the helper/modifier is registered in the template registry.
  7. run npm run lint:types to validate the types

Services

  1. Choose a file that has no (untyped) dependencies
  2. Change the extension to .ts
  3. Add types
  4. Convert the test file to .ts
  5. run npm run lint:types to validate the types
Windvis commented 2 months ago

I think we should probably just inline the ember-data-table components here, and convert them to .gts. The way we're extending the base addon components is a bad practise anyways, and this will give us more control. It would also allow us to drop the dependency.

We should take a look at all the exposed data table components and deprecate the ones that we don't want to be used as a standalone thing. We can then remove the app-reexports in the next major.