diff --git a/.cursor/commands/address-github-pr-comments.md b/.cursor/commands/address-github-pr-comments.md new file mode 100644 index 000000000..d794d7dcb --- /dev/null +++ b/.cursor/commands/address-github-pr-comments.md @@ -0,0 +1,16 @@ +# Adress github pull request comments + +## Overview +Fetch the unresolved comments from github and fix them + +## Steps + +1. **Fetch the comments** + - Use gh CLI to fetch unresolved comments body + - For each comment make a brief summary of the comment + - Render the result in a table + - Ask in the prompt if it should be fixed + +2. **Fix comments** + - Fix comments one by one + - Make sure lint and tests pass \ No newline at end of file diff --git a/.cursor/commands/code-review-checklist.md b/.cursor/commands/code-review-checklist.md new file mode 100644 index 000000000..04088daff --- /dev/null +++ b/.cursor/commands/code-review-checklist.md @@ -0,0 +1,74 @@ +# Code Review Checklist + +Checklist for code reviews in the LDLS monorepo (`ui-react` and `ui-rnative`). +Check the code diff from main + +--- + +Output summary in a table that's easy to understand and read. +Show details of the errors if there are only fews, otherwise show the number of errors by category + +## General + +- [ ] Code works correctly and handles edge cases +- [ ] No obvious bugs, security issues, or hardcoded secrets +- [ ] Code is readable with descriptive names +- [ ] No code duplication + +## TypeScript + +- [ ] Top-level functions are typesafe (except JSX components) +- [ ] No `any` types +- [ ] Typecheck for affected nx libs/apps passes + +## Lint + +- [ ] Lint for affected nx libs/apps passes + +## Components + +- [ ] Components use **PascalCase** folders (`Button/`) +- [ ] Other files use **dash-case** (`use-controllable-state.ts`) +- [ ] Files organized: `Component.tsx`, `Component.test.tsx`, `Component.stories.tsx`, `Component.mdx`, `index.ts` +- [ ] Types are defined in a separate file `types.ts` of the component, with clear, consistent description and default if component props has a default +- [ ] `index.ts` expose the component, compound components and types +- [ ] Namings are explicit, makes sense and follow standards + +## Design System React + +- [ ] Uses design tokens from design-core tailwind preset for web + - Typography: `body-1`, `heading-2` (not `font-bold`, `text-sm`) + - Colors: `text-base`, `bg-accent` (not `text-gray-500`) + - Sizes: token values only (no `w-[108px]`) +- [ ] Uses `cn()` for conditional classes +- [ ] Uses `cva` for variant composition + +## Design System React-Native + +- [ ] Uses design tokens from design-core theme js object preset for react-native + - theme.colors.bg.accent + - theme.spacings.s20 + - ... +- [ ] Uses `cn()` for conditional classes +- [ ] Uses `sva` for variant composition + +## Storybook + +- [ ] Default story named `Base` (not `Default` or `Primary`) +- [ ] Showcase stories use `{Property}Showcase` pattern if necessary +- [ ] Stories have `layout: 'centered'` and `backgrounds: { default: 'light' }` + +--- + +## Platform-Specific + +| Check | React (`ui-react`) | React Native (`ui-rnative`) | +|-------|-------------------|----------------------------| +| Test ID | `data-testid` | `testID` | +| Test framework | Vitest | Jest | +| Test imports | `import { vi } from 'vitest'` | `import { jest } from '@jest/globals'` | +| Click handler | `onClick` | `onPress` | +| Mock function | `vi.fn()` | `jest.fn()` | + +--- + diff --git a/.cursor/commands/lint-and-fix.md b/.cursor/commands/lint-and-fix.md new file mode 100644 index 000000000..c4a6e588d --- /dev/null +++ b/.cursor/commands/lint-and-fix.md @@ -0,0 +1,10 @@ +# Run Lint and Fix + +## Overview +Execute the lint suite of the impacted apps or libs and systematically fix any failures. + +## Steps +- Run lint commands on the affected app or libs +- Look at errors, focus on the important ones. +- Show summary per libs/apps as prompt result and show easily fixable errors +- Ask users if he wants to fix easily fixable errors \ No newline at end of file diff --git a/.cursor/commands/test-and-fix.md b/.cursor/commands/test-and-fix.md new file mode 100644 index 000000000..3872cab13 --- /dev/null +++ b/.cursor/commands/test-and-fix.md @@ -0,0 +1,22 @@ +# Run Tests and Fix Failures + +## Overview +Execute the test suite of the impacted apps or libs and systematically fix any failures, ensuring code quality and functionality. + +## Steps + +1. **Run test suite** + - Determines the affected nx apps or libs (compare to main) and run typecheck commands on these + - Capture output and identify failures + - Check both unit and integration tests + +2. **Analyze failures** + - Categorize by type: flaky, broken, new failures + - Prioritize fixes based on impact + - Check if failures are related to recent changes + - Ask user if he wants to fix issues + +3. **Fix issues systematically** + - Start with the most critical failures + - Fix one issue at a time + - Re-run tests after each fix \ No newline at end of file diff --git a/.cursor/commands/typecheck.md b/.cursor/commands/typecheck.md new file mode 100644 index 000000000..df3d0e8f3 --- /dev/null +++ b/.cursor/commands/typecheck.md @@ -0,0 +1,11 @@ +# Run Typecheck and Fix + +## Overview +Execute the typecheck suite of the impacted apps or libs and systematically fix any failures. + +## Steps +- Turn ASK mode ON +- Determines the affected nx apps or libs (compare to main) +- Run nx build-deps in one command on affecteds +- Run nx typecheck in one command on affecteds "--nx-bail=false" +- Show summary per libs/apps as prompt result diff --git a/.cursor/rules/components.mdc b/.cursor/rules/components.mdc index f9cae255b..4504d1e48 100644 --- a/.cursor/rules/components.mdc +++ b/.cursor/rules/components.mdc @@ -4,7 +4,6 @@ globs: alwaysApply: true --- - # class-variance-authority (cva) - Use cva at the top of the file to compose classnames when there is variants composition - Use cva at the top of the file when there are lots of classnames to declare for a given element diff --git a/.cursor/rules/design-system.mdc b/.cursor/rules/design-system.mdc index 2612cdd76..f005aa34c 100644 --- a/.cursor/rules/design-system.mdc +++ b/.cursor/rules/design-system.mdc @@ -67,12 +67,12 @@ Before using width/height utilities: - Use `border` for default width - Use `border-2` for active/emphasized states -- Drop shadow utilities from `createDropShadowPlugin`: - - `drop-shadow-sm`: 1px 4px rgba(0, 0, 0, 0.16) - - `drop-shadow-md`: 2px 8px rgba(0, 0, 0, 0.16) - - `drop-shadow-lg`: 4px 16px rgba(0, 0, 0, 0.16) - - `drop-shadow-xl`: 6px 24px rgba(0, 0, 0, 0.16) - - `drop-shadow-2xl`: 8px 32px rgba(0, 0, 0, 0.16) +- Shadow utilities from `createShadowPlugin`: + - `shadow-sm`: 1px 4px rgba(0, 0, 0, 0.16) + - `shadow-md`: 2px 8px rgba(0, 0, 0, 0.16) + - `shadow-lg`: 4px 16px rgba(0, 0, 0, 0.16) + - `shadow-xl`: 6px 24px rgba(0, 0, 0, 0.16) + - `shadow-2xl`: 8px 32px rgba(0, 0, 0, 0.16) # Gradients diff --git a/apps/app-sandbox-rnative/src/app/App.tsx b/apps/app-sandbox-rnative/src/app/App.tsx index 85a65e290..9a5c85668 100644 --- a/apps/app-sandbox-rnative/src/app/App.tsx +++ b/apps/app-sandbox-rnative/src/app/App.tsx @@ -1,4 +1,3 @@ -import { ledgerLiveThemes } from '@ledgerhq/lumen-design-core'; import { GlobalSelectBottomSheet, GlobalTooltipBottomSheet, @@ -49,7 +48,7 @@ export const App = () => {