feat: format token usage with "compact" notation #498
on-pr.yml
on: pull_request
Security Checks
/
Trivy
15s
Security Checks
/
NPM Audit
6s
Static Checks
/
ESLint Check
17s
Static Checks
/
TS Types Check
17s
Static Checks
/
Build App Check
25s
Unit Tests
/
Vitest
51s
Annotations
3 errors and 10 warnings
src/features/alerts/components/__tests__/alerts-summary-workspace-token-usage.test.tsx > shows correct count when there is token usage:
src/features/alerts/components/__tests__/alerts-summary-workspace-token-usage.test.tsx#L19
Error: expect(element).toHaveTextContent()
Expected element to have text content:
1183
Received:
1.2K
Ignored nodes: comments, script, style
<html>
<head />
<body>
<div>
<section
aria-atomic="false"
aria-label="Notifications alt+T"
aria-live="polite"
aria-relevant="additions text"
tabindex="-1"
/>
<div
class="group/sidebar-wrapper flex min-h-svh w-full has-[[data-variant=inset]]:bg-gray-25"
style="--sidebar-width: 16rem; --sidebar-width-icon: 3rem;"
>
<section
class="relative flex flex-col overflow-hidden rounded border border-gray-400 bg-base"
>
<div
class="shrink grow px-6 py-4"
>
<h3
class="font-title text-3xl font-semibold mb-2 subhead-bold text-secondary"
>
Workspace token usage
</h3>
<div
class="flex items-center gap-8"
>
<div
class="text-5xl flex items-center gap-1"
data-testid="usage-input-tokens"
>
<svg
class="size-11"
fill="none"
height="24"
viewBox="0 0 24 24"
width="24"
xmlns="http://www.w3.org/2000/svg"
>
<path
d="M21 15v1.2c0 1.6802 0 2.5202-.327 3.162a3 3 0 0 1-1.311 1.311C18.7202 21 17.8802 21 16.2 21H7.8c-1.6802 0-2.5202 0-3.162-.327a3 3 0 0 1-1.311-1.311C3 18.7202 3 17.8802 3 16.2V15m14-7-5-5m0 0L7 8m5-5v12"
stroke="currentColor"
stroke-linecap="round"
stroke-linejoin="round"
stroke-width="2"
/>
</svg>
1.2K
</div>
<div
class="text-5xl flex items-center gap-1"
data-testid="usage-output-tokens"
>
<svg
class="size-11"
fill="none"
height="24"
viewBox="0 0 24 24"
width="24"
xmlns="http://www.w3.org/2000/svg"
>
<path
d="M21 15v1.2c0 1.6802 0 2.5202-.327 3.162a3 3 0 0 1-1.311 1.311C18.7202 21 17.8802 21 16.2 21H7.8c-1.6802 0-2.5202 0-3.162-.327a3 3 0 0 1-1.311-1.311C3 18.7202 3 17.8802 3 16.2V15m14-5-5 5m0 0-5-5m5 5V3"
stroke="currentColor"
stroke-linecap="round"
stroke-linejoin="round"
stroke-width="2"
/>
</svg>
433
</div>
</div>
</div>
</section>
</div>
</div>
</body>
</html>...
❯ src/features/alerts/components/__tests__/alerts-summary-workspace-token-usage.test.tsx:19:47
❯ runWithExpensiveErrorDiagnosticsDisabled node_modules/@testing-library/dom/dist/config.js:47:12
❯ checkCallback node_modules/@testing-library/dom/dist/wait-for.js:124:77
❯ Timeout.checkRealTimersCallback node_modules/@testing-library/dom/dist/wait-for.js:118:16
|
src/features/alerts/components/__tests__/table-alerts.test.tsx > renders token usage cell correctly:
src/features/alerts/components/__tests__/table-alerts.test.tsx#L55
TestingLibraryElementError: Unable to find an accessible element with the role "gridcell" and name "1183 433"
Here are the accessible roles:
region:
Name "Notifications alt+T":
<section
aria-atomic="false"
aria-label="Notifications alt+T"
aria-live="polite"
aria-relevant="additions text"
tabindex="-1"
/>
--------------------------------------------------
heading:
Name "All Alerts":
<h2
class="font-bold text-lg"
/>
--------------------------------------------------
switch:
Name "Malicious Packages":
<input
id="malicious-packages"
role="switch"
type="checkbox"
/>
--------------------------------------------------
group:
Name "":
<div
class="h-10 rounded-sm text-base text-primary outline outline-0 outline-offset-2 outline-brand-500 placeholder:text-placeholder disabled:text-disabled forced-colors:outline-[Highlight] group flex w-full items-center overflow-hidden text-start border border-gray-400 bg-gray-25 invalid:!border-red-400 invalid:text-invalid invalid:!outline-red-500 focus-visible:border-brand-500 focus-visible:outline-2 pressed:border-gray-600 disabled:border-gray-200 forced-colors:border-[Highlight] invalid:forced-colors:!border-[Mark] invalid:forced-colors:bg-[MarkBackground] focus-visible:forced-colors:border-[ButtonBorder] pressed:forced-colors:border-[Highlight] disabled:forced-colors:border-[GrayText] focus-within:[&:has([data-focus-visible])]:outline-2 hover:[&:not(:is([data-disabled],[data-focus-visible]))]:border-gray-500 hover:[&:not(:is([data-disabled],[data-focus-visible]))]:forced-colors:border-[Highlight] hover:[&:not([data-disabled])]:bg-gray-50"
data-rac=""
role="group"
/>
--------------------------------------------------
searchbox:
Name "Search alerts":
<input
aria-label="Search alerts"
class="h-10 rounded-sm text-base text-primary outline outline-0 outline-offset-2 outline-brand-500 placeholder:text-placeholder disabled:text-disabled forced-colors:outline-[Highlight] py-2 pr-2 w-full text-start pl-10 bg-transparent"
data-rac=""
id="react-aria-:r1:"
placeholder="Search..."
title=""
type="search"
value=""
/>
--------------------------------------------------
button:
Name "Clear search":
<button
aria-label="Clear search"
class="outline outline-0 outline-offset-2 outline-brand-700 forced-colors:outline-[Highlight] inline-flex shrink-0 cursor-pointer items-center justify-center gap-1 rounded-sm border py-2 text-center text-base font-medium aspect-square px-2 [&_svg]:mx-auto border-transparent bg-transparent hover:bg-gray-100 pressed:bg-gray-200 disabled:bg-transparent disabled:text-disabled focus-within:&:has([data-focus-visible]):outline-2 invalid:!outline-red-700 focus-visible:outline-2 size-7 text-secondary last-of-type:mr-1 [&:not(:last-of-type)]:mr-px [&_svg]:size-4 [&_svg]:shrink-0 group-empty:invisible"
data-rac=""
id="react-aria-:r7:"
slot="clear"
tabindex="-1"
type="button"
/>
Name "1.2K 433":
<button
class="outline outline-0 outline-offset-2 outline-brand-700 forced-colors:outline-[Highlight] no-underline hover:underline pressed:text-brand-950 focus-within:&:has([data-focus-visible]):outline-2 invalid:!outline-red-700 focus-visible:outline-2 text-secondary hover:text-primary"
data-rac=""
id="react-aria-:rh:"
type="button"
/>
Name "Previous":
<button
class="outline outline-0 outline-offset-2 outline-brand-700 forced-colors:outline-[Highlight] inline-flex h-10 shrink-0 cursor-pointer items-center justify-center gap-1 rounded-sm border px-4 py-2 text-center text-base font-medium [&_svg]:size-4 [&_svg]:shrink-0 border-brand-800 bg-brand-800 text-white shadow-sm hover:border-brand-700 hover:bg-brand-700 pressed:border-brand-900 pressed:bg-brand-900 disabled:border-gray-200 disabled:bg-base disabled:text-disabled focus-within:&:has([data-focus-visible]):outline-2 invalid:!outline-red-700 focus-visible:outline-2"
data-disabled="true"
data-rac=""
disabled=""
id="react-aria-:rb
|
Unit Tests / Vitest
Process completed with exit code 1.
|
Unit Tests / Vitest
Your workflow is using a version of actions/cache that is scheduled for deprecation, actions/cache@0c45773b623bea8c8e75f6c82b208c3cf94ea4f9. Please update your workflow to use either v3 or v4 of actions/cache to avoid interruptions. Learn more: https://github.blog/changelog/2024-12-05-notice-of-upcoming-releases-and-breaking-changes-for-github-actions/#actions-cache-v1-v2-and-actions-toolkit-cache-package-closing-down
|
Static Checks / TS Types Check
Your workflow is using a version of actions/cache that is scheduled for deprecation, actions/cache@0c45773b623bea8c8e75f6c82b208c3cf94ea4f9. Please update your workflow to use either v3 or v4 of actions/cache to avoid interruptions. Learn more: https://github.blog/changelog/2024-12-05-notice-of-upcoming-releases-and-breaking-changes-for-github-actions/#actions-cache-v1-v2-and-actions-toolkit-cache-package-closing-down
|
Static Checks / ESLint Check
Your workflow is using a version of actions/cache that is scheduled for deprecation, actions/cache@0c45773b623bea8c8e75f6c82b208c3cf94ea4f9. Please update your workflow to use either v3 or v4 of actions/cache to avoid interruptions. Learn more: https://github.blog/changelog/2024-12-05-notice-of-upcoming-releases-and-breaking-changes-for-github-actions/#actions-cache-v1-v2-and-actions-toolkit-cache-package-closing-down
|
Static Checks / Build App Check
Your workflow is using a version of actions/cache that is scheduled for deprecation, actions/cache@0c45773b623bea8c8e75f6c82b208c3cf94ea4f9. Please update your workflow to use either v3 or v4 of actions/cache to avoid interruptions. Learn more: https://github.blog/changelog/2024-12-05-notice-of-upcoming-releases-and-breaking-changes-for-github-actions/#actions-cache-v1-v2-and-actions-toolkit-cache-package-closing-down
|
Static Checks / ESLint Check:
src/components/ui/chat/chat-bubble.tsx#L199
Fast refresh only works when a file only exports components. Use a new file to share constants or functions between components
|
Static Checks / ESLint Check:
src/components/ui/chat/chat-bubble.tsx#L200
Fast refresh only works when a file only exports components. Use a new file to share constants or functions between components
|
Static Checks / ESLint Check:
src/components/ui/sidebar.tsx#L551
Fast refresh only works when a file only exports components. Use a new file to share constants or functions between components
|
Static Checks / ESLint Check:
src/context/confirm-context.tsx#L37
Fast refresh only works when a file only exports components. Move your React context(s) to a separate file
|
Static Checks / ESLint Check:
src/lib/test-utils.tsx#L67
This rule can't verify that `export *` only exports components
|
Static Checks / ESLint Check:
src/lib/test-utils.tsx#L69
Fast refresh only works when a file only exports components. Use a new file to share constants or functions between components
|