Showcase: Batch 1 converting pages to TypeScript #2999
Conversation
|
The latest updates on your projects. Learn more about Vercel for Git ↗︎
|
| return document.querySelector('#test-target-node-element'); | ||
| } | ||
|
|
||
| get targetMultipleNodeElements() { |
There was a problem hiding this comment.
Note: I removed this getter from the typescript version because:
- It was never used in the showcase template
- Hds::Copy::Button doesn't support copying multiple nodes like this
shleewhite
changed the title
|
|
||
| <Hds::AppSideNav::Portal @targetName="sidenav-portal-demo-1" @ariaLabel="Primary on portal demo 1" as |Nav|> | ||
| <Nav.extraBefore><Shw::Placeholder @height="72px" @text="extraBefore" @background="#f3d9c5" /></Nav.extraBefore> | ||
| <Nav.ExtraBefore><Shw::Placeholder @height="72px" @text="extraBefore" @background="#f3d9c5" /></Nav.ExtraBefore> |
There was a problem hiding this comment.
Note: this causes a small change in Percy because now the blocks are rendered (they weren't before)
| <Shw::Text::H4>Target types</Shw::Text::H4> | ||
|
|
||
| <Shw::Grid @columns={{3}} @gap="2rem" as |SF|> | ||
| <Shw::Flex @gap="2rem" as |SF|> |
There was a problem hiding this comment.
Note: columns isnt an argument on Flex (its only on Grid), opted to change it back to Flex and remove the columns argument to avoid changes in Percy.
| import Controller from '@ember/controller'; | ||
| import { action } from '@ember/object'; | ||
| import { tracked } from '@glimmer/tracking'; | ||
| import { inject as service } from '@ember/service'; |
There was a problem hiding this comment.
| import { inject as service } from '@ember/service'; | |
| import { service } from '@ember/service'; |
There was a problem hiding this comment.
For context, Alexey is referring to the following deprecation https://deprecations.emberjs.com/id/importing-inject-from-ember-service/. However, we're still supporting 3.28 at the moment, so we'd need to operate such changes closer to the major release – and can be done across the library with a simple replace.
| import Route from '@ember/routing/route'; | ||
| import type { ModelFrom } from 'showcase/utils/ModelFromRoute'; | ||
|
|
||
| interface User { |
There was a problem hiding this comment.
[Suggestion] Since these mock api files are used across multiple component maybe we should define a types file for them somewhere.
There was a problem hiding this comment.
Yeah, I think that might be a good follow up ticket.. @aklkv suggested actually making a reusable fixture that imports the typed user data. So I think if we do that, we could have the type in that file.
Co-authored-by: Cristiano Rastelli <[email protected]>
6 participants
📌 Summary
If merged, this PR would convert the following pages in the showcase to TypeScript:
🛠️ Detailed description
The best way to understand the changes in this PR is to walk through each commit in the "Files changed" tab, I have added comments there explaining why I made the changes.
🔗 External links
Jira ticket: HDS-5076
👀 Component checklist
💬 Please consider using conventional comments when reviewing this PR.
📋 PCI review checklist
Examples of changes to controls include access controls, encryption, logging, etc.
Examples include changes to operating systems, ports, protocols, services, cryptography-related components, PII processing code, etc.