Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Jump to bottom

Ts components chunk 1 #25

Merged
merged 6 commits into from
May 18, 2021
Merged

Ts components chunk 1 #25

merged 6 commits into from
May 18, 2021

Conversation

mattrunyon
Copy link
Collaborator

AutoResizeTextArea
BasicModal
Checkbox
Collapse

Also adds a linter override for ts/tsx to allow static class members in TS. Otherwise, you get the error "X class does not have property propTypes" when you specify X.propTypes = ... on a class component

@mattrunyon mattrunyon requested a review from spasovski May 11, 2021 21:36
@mattrunyon mattrunyon self-assigned this May 11, 2021
spasovski
spasovski reviewed May 17, 2021
View reviewed changes
packages/components/src/Checkbox.tsx

// Forward ref causes a false positive for display-name in eslint:
// https://github.com/yannickcr/eslint-plugin-react/issues/2269
Checkbox.displayName = 'Checkbox';
Copy link
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Didn't know this. Quite odd.

spasovski
spasovski reviewed May 17, 2021
View reviewed changes
packages/components/src/Collapse.tsx
const elem = elemParam;
elem.style.height = 0;
elem.style.height = '0';
Copy link
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Ah TS, technically correct...the best kind of correct.

spasovski
spasovski reviewed May 17, 2021
View reviewed changes
packages/components/src/Collapse.tsx
const elem = elemParam;
elem.style.height = `${Collapse.getHeight(elem)}px`;
}

static handleExiting(elemParam) {
static handleExiting(elemParam: HTMLElement): void {
const elem = elemParam;
Copy link
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

I question the need for these consts - I realize this is a conversion so feel free to ignore.

Copy link
Collaborator Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

The const is an eslint thing I think. Pretty sure it would complain about changing param properties (but this is ok apparently)

spasovski
spasovski approved these changes May 17, 2021
View reviewed changes
Copy link
Contributor

@spasovski spasovski left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

This looks quite solid though I think your TS is a few notches above mine. I like that it already caught some stuff that was being coalesced behind the scenes.

@mattrunyon mattrunyon merged commit 8cd217e into main May 18, 2021
@mattrunyon mattrunyon deleted the ts-components-chunk-1 branch May 18, 2021 15:42
@mattrunyon mattrunyon mentioned this pull request Jun 8, 2021
Merged
mofojed pushed a commit that referenced this pull request Aug 25, 2023
@bmingles
fix: Heap usage request throttling (#1450)
5cc2936 
fixes #1439 - Heap usage code now guarantees that new requests won't be
scheduled until all previous requests are complete.

## Testing
I tested by shutting my Mac for ~2 hours and returning. Timings looks
something like this:

### Summary
<img width="310" alt="image"
src="https://github.com/deephaven/web-client-ui/assets/1900643/0ad2d426-2fed-48e8-a255-989ee5d524f3">

It seems that requests still happen occasionally while sleeping. On Wake
up, there were a few ticks resulting in "Unable to get heap usage"
console errors. Then a prompt showed up indicating credentials had
expired at which point requests start succeeding again.

### Full Console Log
```
useAsyncInterval.ts:37 [useAsyncInterval] tick #1. 10068 ms elapsed since last tick.
useAsyncInterval.ts:56 [useAsyncInterval] adjusted minIntervalMs: 9918
useAsyncInterval.ts:37 [useAsyncInterval] tick #2. 9936 ms elapsed since last tick.
useAsyncInterval.ts:56 [useAsyncInterval] adjusted minIntervalMs: 10000
useAsyncInterval.ts:37 [useAsyncInterval] tick #3. 10026 ms elapsed since last tick.
useAsyncInterval.ts:56 [useAsyncInterval] adjusted minIntervalMs: 9958
useAsyncInterval.ts:62 [useAsyncInterval] Setting interval minIntervalMs: 10000
useAsyncInterval.ts:37 [useAsyncInterval] tick #1. 941977 ms elapsed since last tick.
useAsyncInterval.ts:56 [useAsyncInterval] adjusted minIntervalMs: 0
useAsyncInterval.ts:37 [useAsyncInterval] tick #2. 13 ms elapsed since last tick.
useAsyncInterval.ts:56 [useAsyncInterval] adjusted minIntervalMs: 10000
useAsyncInterval.ts:37 [useAsyncInterval] tick #3. 2038465 ms elapsed since last tick.
HeapUsage.tsx:68 [HeapUsage] Unable to get heap usage Error: Authentication details invalid
useAsyncInterval.ts:56 [useAsyncInterval] adjusted minIntervalMs: 0
useAsyncInterval.ts:37 [useAsyncInterval] tick #4. 19 ms elapsed since last tick.
HeapUsage.tsx:68 [HeapUsage] Unable to get heap usage Error: Authentication details invalid
useAsyncInterval.ts:56 [useAsyncInterval] adjusted minIntervalMs: 10000
useAsyncInterval.ts:37 [useAsyncInterval] tick #5. 537820 ms elapsed since last tick.
HeapUsage.tsx:68 [HeapUsage] Unable to get heap usage Error: Authentication details invalid
useAsyncInterval.ts:56 [useAsyncInterval] adjusted minIntervalMs: 0
useAsyncInterval.ts:37 [useAsyncInterval] tick #6. 16 ms elapsed since last tick.
HeapUsage.tsx:68 [HeapUsage] Unable to get heap usage Error: Authentication details invalid
useAsyncInterval.ts:56 [useAsyncInterval] adjusted minIntervalMs: 10000
useAsyncInterval.ts:37 [useAsyncInterval] tick #7. 191633 ms elapsed since last tick.
HeapUsage.tsx:68 [HeapUsage] Unable to get heap usage Error: Authentication details invalid
useAsyncInterval.ts:56 [useAsyncInterval] adjusted minIntervalMs: 0
useAsyncInterval.ts:37 [useAsyncInterval] tick #8. 18 ms elapsed since last tick.
HeapUsage.tsx:68 [HeapUsage] Unable to get heap usage Error: Authentication details invalid
useAsyncInterval.ts:56 [useAsyncInterval] adjusted minIntervalMs: 10000
useAsyncInterval.ts:37 [useAsyncInterval] tick #9. 23720 ms elapsed since last tick.
HeapUsage.tsx:68 [HeapUsage] Unable to get heap usage Error: Authentication details invalid
useAsyncInterval.ts:56 [useAsyncInterval] adjusted minIntervalMs: 0
useAsyncInterval.ts:37 [useAsyncInterval] tick #10. 18 ms elapsed since last tick.
HeapUsage.tsx:68 [HeapUsage] Unable to get heap usage Error: Authentication details invalid
useAsyncInterval.ts:56 [useAsyncInterval] adjusted minIntervalMs: 10000
useAsyncInterval.ts:37 [useAsyncInterval] tick #11. 886367 ms elapsed since last tick.
HeapUsage.tsx:68 [HeapUsage] Unable to get heap usage Error: Authentication details invalid
useAsyncInterval.ts:56 [useAsyncInterval] adjusted minIntervalMs: 0
useAsyncInterval.ts:37 [useAsyncInterval] tick #12. 17 ms elapsed since last tick.
HeapUsage.tsx:68 [HeapUsage] Unable to get heap usage Error: Authentication details invalid
useAsyncInterval.ts:56 [useAsyncInterval] adjusted minIntervalMs: 10000
useAsyncInterval.ts:37 [useAsyncInterval] tick #13. 1010951 ms elapsed since last tick.
HeapUsage.tsx:68 [HeapUsage] Unable to get heap usage Error: Authentication details invalid
useAsyncInterval.ts:56 [useAsyncInterval] adjusted minIntervalMs: 0
useAsyncInterval.ts:37 [useAsyncInterval] tick #14. 6 ms elapsed since last tick.
HeapUsage.tsx:68 [HeapUsage] Unable to get heap usage Error: Authentication details invalid
useAsyncInterval.ts:56 [useAsyncInterval] adjusted minIntervalMs: 10000
useAsyncInterval.ts:37 [useAsyncInterval] tick #15. 650011 ms elapsed since last tick.
HeapUsage.tsx:68 [HeapUsage] Unable to get heap usage Error: Authentication details invalid
useAsyncInterval.ts:56 [useAsyncInterval] adjusted minIntervalMs: 0
useAsyncInterval.ts:37 [useAsyncInterval] tick #16. 13 ms elapsed since last tick.
HeapUsage.tsx:68 [HeapUsage] Unable to get heap usage Error: Authentication details invalid
useAsyncInterval.ts:56 [useAsyncInterval] adjusted minIntervalMs: 10000
useAsyncInterval.ts:37 [useAsyncInterval] tick #17. 731687 ms elapsed since last tick.
HeapUsage.tsx:68 [HeapUsage] Unable to get heap usage Error: Authentication details invalid
useAsyncInterval.ts:56 [useAsyncInterval] adjusted minIntervalMs: 0
useAsyncInterval.ts:37 [useAsyncInterval] tick #18. 19 ms elapsed since last tick.
HeapUsage.tsx:68 [HeapUsage] Unable to get heap usage Error: Authentication details invalid
useAsyncInterval.ts:56 [useAsyncInterval] adjusted minIntervalMs: 10000
useAsyncInterval.ts:37 [useAsyncInterval] tick #19. 120545 ms elapsed since last tick.
HeapUsage.tsx:68 [HeapUsage] Unable to get heap usage Error: Authentication details invalid
useAsyncInterval.ts:56 [useAsyncInterval] adjusted minIntervalMs: 0
useAsyncInterval.ts:37 [useAsyncInterval] tick #20. 16 ms elapsed since last tick.
HeapUsage.tsx:68 [HeapUsage] Unable to get heap usage Error: Authentication details invalid
useAsyncInterval.ts:56 [useAsyncInterval] adjusted minIntervalMs: 10000
useAsyncInterval.ts:37 [useAsyncInterval] tick #21. 446345 ms elapsed since last tick.
HeapUsage.tsx:68 [HeapUsage] Unable to get heap usage Error: Authentication details invalid
useAsyncInterval.ts:56 [useAsyncInterval] adjusted minIntervalMs: 0
useAsyncInterval.ts:37 [useAsyncInterval] tick #22. 13 ms elapsed since last tick.
HeapUsage.tsx:68 [HeapUsage] Unable to get heap usage Error: Authentication details invalid
useAsyncInterval.ts:56 [useAsyncInterval] adjusted minIntervalMs: 10000
useAsyncInterval.ts:37 [useAsyncInterval] tick #23. 10999 ms elapsed since last tick.
HeapUsage.tsx:68 [HeapUsage] Unable to get heap usage Error: Authentication details invalid
useAsyncInterval.ts:56 [useAsyncInterval] adjusted minIntervalMs: 8987
useAsyncInterval.ts:37 [useAsyncInterval] tick #24. 9020 ms elapsed since last tick.
HeapUsage.tsx:68 [HeapUsage] Unable to get heap usage Error: Authentication details invalid
useAsyncInterval.ts:56 [useAsyncInterval] adjusted minIntervalMs: 10000
useAsyncInterval.ts:37 [useAsyncInterval] tick #25. 10030 ms elapsed since last tick.
HeapUsage.tsx:68 [HeapUsage] Unable to get heap usage Error: Authentication details invalid
useAsyncInterval.ts:56 [useAsyncInterval] adjusted minIntervalMs: 9955
useAsyncInterval.ts:37 [useAsyncInterval] tick #26. 9979 ms elapsed since last tick.
useAsyncInterval.ts:56 [useAsyncInterval] adjusted minIntervalMs: 10000
useAsyncInterval.ts:37 [useAsyncInterval] tick #27. 10027 ms elapsed since last tick.
useAsyncInterval.ts:56 [useAsyncInterval] adjusted minIntervalMs: 9956
useAsyncInterval.ts:62 [useAsyncInterval] Setting interval minIntervalMs: 10000
useAsyncInterval.ts:37 [useAsyncInterval] tick #1. 10695 ms elapsed since last tick.
useAsyncInterval.ts:56 [useAsyncInterval] adjusted minIntervalMs: 9290
useAsyncInterval.ts:37 [useAsyncInterval] tick #2. 9311 ms elapsed since last tick.
useAsyncInterval.ts:56 [useAsyncInterval] adjusted minIntervalMs: 10000
useAsyncInterval.ts:37 [useAsyncInterval] tick #3. 10017 ms elapsed since last tick.
useAsyncInterval.ts:56 [useAsyncInterval] adjusted minIntervalMs: 9969
useAsyncInterval.ts:37 [useAsyncInterval] tick #4. 9992 ms elapsed since last tick.
useAsyncInterval.ts:56 [useAsyncInterval] adjusted minIntervalMs: 9992
useAsyncInterval.ts:37 [useAsyncInterval] tick #5. 10680 ms elapsed since last tick.
useAsyncInterval.ts:56 [useAsyncInterval] adjusted minIntervalMs: 9308
```
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Reviewers

@spasovski spasovski spasovski approved these changes

Assignees

@mattrunyon mattrunyon

Labels
typescript
Projects
None yet
Milestone
No milestone
Development

Successfully merging this pull request may close these issues.
2 participants
@mattrunyon @spasovski