Cursor rule

1---
2description: 
3globs: 
4alwaysApply: true
5---
6You are an expert in TypeScript, Node.js, React, Vite, Yarn ,TanStack Query, TanStack Router, Tanstack table, Tanstack form ,Shadcn elements  and Tailwind.
7 
8We use vite and yarn as base and then tanstack based components for everything else. for ui/ux we use shadcn elements and components.
9 
10Response Constraints
11- Do not remove any existing code unless necessary.
12- Do not remove my comments or commented-out code unless necessary.
13- Do not change the formatting of my imports.
14- Do not change the formatting of my code unless important for new functionality.
15- Just do the needful. when trying to do more stop and ask/suggest. Do not start editing. Make sure to follow the rule.
16 
17 
18 
19Code Structure and Guidelines
20- components used in pages are in 'components' folder.
21- base shadcn ui elements/components are in 'components/ui' subfolder.
22- pages are in 'pages'
23- api, utils and env are in lib folder.
24- tanstack routes are in 'routes'
25Note: always check related existing code before making any change.
26 
27Code Style and Structure
28- Write concise, technical TypeScript code with accurate examples.
29- Use functional and declarative programming patterns; avoid classes.
30- Prefer iteration and modularization over code duplication.
31- Use descriptive variable names with auxiliary verbs (e.g., isLoading, hasError).
32- Structure files: exported component, subcomponents, helpers, static content, types.
33- Use axios for implementing http clients always.
34- Use shadcn components for design.
35 
36Naming Conventions
37- Use lowercase with dashes for directories (e.g., components/auth-wizard).
38- Favor named exports for components.
39 
40TypeScript Usage
41- Use TypeScript for all code; prefer interfaces over types.
42- Avoid enums; use maps instead.
43- Use functional components with TypeScript interfaces.
44 
45Syntax and Formatting
46- Use the "function" keyword for pure functions.
47- Use curly braces for all conditionals. Favor simplicity over cleverness.
48- Use declarative JSX.
49 
50UI and Styling
51- Use Tailwind for components and styling.
52- Use shadcn for elements and components
53- Use right tanstack components to tie to shadcn elements and components.
54 
55Performance Optimization
56- Look for ways to make things faster:
57  - Use immutable data structures
58  - Use efficient data fetching strategies
59  - Optimize network requests
60  - Use efficient data structures
61  - Use efficient algorithms
62  - Use efficient rendering strategies
63  - Use efficient state management
64 
65Testing and Implementing Code Changes
66- Use tools
671. Use browser tool to take console logs.
682. Use playright tool to navigate the website/application to click on things and navigate to figure out functionality or any issues. 
693. Always Use documentation tool for getting examples and right documentation based on dependency version mentioned in [package.json](mdc:package.json).
704. Use browsing web search tool to browse the web for more information as and when required.
71  
72Build Tool:
73- Yarn
74 
75