@@ -25,76 +25,3 @@ npm run test:e2e # E2E tests (Playwright)
2525npm run biome:fix # Format and lint
2626npm run codegen # Regenerate GraphQL types
2727```
28-
29- ## Code Style
30-
31- ### Components
32-
33- ``` typescript
34- // ✅ Good - Typed props, functional component
35- interface NodeCardProps {
36- node: Node ;
37- onSelect: (id : string ) => void ;
38- }
39-
40- export function NodeCard({ node , onSelect }: NodeCardProps ) {
41- return (
42- < div className = " p-4 rounded-lg" onClick = {() => onSelect(node.id)}>
43- {node .display_label }
44- < / div >
45- );
46- }
47-
48- // ❌ Bad - Untyped, inline styles
49- export function NodeCard(props ) {
50- return <div style ={{ padding: 16 }}>{props.node.display_label }< / div > ;
51- }
52- ```
53-
54- ### GraphQL
55-
56- ``` typescript
57- // ✅ Good - Use generated types
58- import type { GetNodesQuery } from " @/shared/api/graphql/generated" ;
59-
60- const { data } = useQuery <GetNodesQuery >(GET_NODES );
61- ```
62-
63- ### Naming Conventions
64-
65- - ** Components:** ` PascalCase.tsx `
66- - ** Hooks:** ` useSomething.ts `
67- - ** Utilities:** ` camelCase.ts `
68- - ** Constants:** ` UPPER_SNAKE_CASE `
69-
70- ### Import Order (Biome enforced)
71-
72- ``` typescript
73- import { useState } from " react" ; // React
74- import { useQuery } from " @apollo/client" ; // External packages
75- import { useConfig } from " @/config" ; // Internal aliases
76- import { NodeCard } from " @/shared/..." ; // Shared
77- import { useNodeData } from " @/entities/..." ; // Entities
78- import " ./styles.css" ; // Local
79- ```
80-
81- ## Boundaries
82-
83- ### Always Do
84-
85- - Run ` npm run biome:fix ` before committing
86- - Use TypeScript types for all props and state
87- - Use Tailwind classes (no inline styles)
88- - Use generated GraphQL types
89-
90- ### Ask First
91-
92- - New dependencies
93- - New page routes
94- - GraphQL query changes affecting multiple components
95-
96- ### Never Do
97-
98- - Edit files in ` src/shared/api/graphql/generated/ `
99- - Use ` console.log ` (use ` console.error ` , ` warn ` , ` info ` )
100- - Use ` any ` type without justification
0 commit comments