refactor: update Svelte and TypeScript rules for improved application behavior
- Set Svelte rules to always apply for consistent usage. - Adjust TypeScript rules to exclude .tsx files and ensure clarity in type safety guidelines. - Cleaned up formatting and examples for better readability and understanding.
This commit is contained in:
@@ -1,6 +1,5 @@
|
|||||||
---
|
---
|
||||||
description: Ajuda para escrever e editar aquivos svelte
|
alwaysApply: true
|
||||||
alwaysApply: false
|
|
||||||
---
|
---
|
||||||
|
|
||||||
You are able to use the Svelte MCP server, where you have access to comprehensive Svelte 5 and SvelteKit documentation. Here's how to use the available tools effectively:
|
You are able to use the Svelte MCP server, where you have access to comprehensive Svelte 5 and SvelteKit documentation. Here's how to use the available tools effectively:
|
||||||
|
|||||||
@@ -1,6 +1,7 @@
|
|||||||
---
|
---
|
||||||
description: Guidelines for TypeScript usage, including type safety rules and Convex query typing
|
description: Guidelines for TypeScript usage, including type safety rules and Convex query typing
|
||||||
globs: **/*.ts,**/*.tsx,**/*.svelte
|
globs: **/*.ts,**/*.svelte
|
||||||
|
alwaysApply: false
|
||||||
---
|
---
|
||||||
|
|
||||||
# TypeScript Guidelines
|
# TypeScript Guidelines
|
||||||
@@ -8,6 +9,7 @@ globs: **/*.ts,**/*.tsx,**/*.svelte
|
|||||||
## Type Safety Rules
|
## Type Safety Rules
|
||||||
|
|
||||||
### Avoid `any` Type
|
### Avoid `any` Type
|
||||||
|
|
||||||
- **NEVER** use the `any` type in production code
|
- **NEVER** use the `any` type in production code
|
||||||
- The only exception is in test files (files matching `*.test.ts`, `*.test.tsx`, `*.spec.ts`, `*.spec.tsx`)
|
- The only exception is in test files (files matching `*.test.ts`, `*.test.tsx`, `*.spec.ts`, `*.spec.tsx`)
|
||||||
- Instead of `any`, use:
|
- Instead of `any`, use:
|
||||||
@@ -20,6 +22,7 @@ globs: **/*.ts,**/*.tsx,**/*.svelte
|
|||||||
### Examples
|
### Examples
|
||||||
|
|
||||||
**❌ Bad:**
|
**❌ Bad:**
|
||||||
|
|
||||||
```typescript
|
```typescript
|
||||||
function processData(data: any) {
|
function processData(data: any) {
|
||||||
return data.value;
|
return data.value;
|
||||||
@@ -27,6 +30,7 @@ function processData(data: any) {
|
|||||||
```
|
```
|
||||||
|
|
||||||
**✅ Good:**
|
**✅ Good:**
|
||||||
|
|
||||||
```typescript
|
```typescript
|
||||||
function processData(data: { value: string }) {
|
function processData(data: { value: string }) {
|
||||||
return data.value;
|
return data.value;
|
||||||
@@ -47,6 +51,7 @@ function processData(data: unknown) {
|
|||||||
```
|
```
|
||||||
|
|
||||||
**✅ Exception (tests only):**
|
**✅ Exception (tests only):**
|
||||||
|
|
||||||
```typescript
|
```typescript
|
||||||
// test.ts or *.spec.ts
|
// test.ts or *.spec.ts
|
||||||
it('should handle any input', () => {
|
it('should handle any input', () => {
|
||||||
@@ -58,6 +63,7 @@ it('should handle any input', () => {
|
|||||||
## Convex Query Typing
|
## Convex Query Typing
|
||||||
|
|
||||||
### Frontend Query Usage
|
### Frontend Query Usage
|
||||||
|
|
||||||
- **DO NOT** create manual type definitions for Convex query results in the frontend
|
- **DO NOT** create manual type definitions for Convex query results in the frontend
|
||||||
- Convex queries already return properly typed results based on their `returns` validator
|
- Convex queries already return properly typed results based on their `returns` validator
|
||||||
- The TypeScript types are automatically inferred from the query's return validator
|
- The TypeScript types are automatically inferred from the query's return validator
|
||||||
@@ -66,10 +72,11 @@ it('should handle any input', () => {
|
|||||||
### Examples
|
### Examples
|
||||||
|
|
||||||
**❌ Bad:**
|
**❌ Bad:**
|
||||||
|
|
||||||
```typescript
|
```typescript
|
||||||
// Don't manually type the result
|
// Don't manually type the result
|
||||||
type UserListResult = Array<{
|
type UserListResult = Array<{
|
||||||
_id: Id<"users">;
|
_id: Id<'users'>;
|
||||||
name: string;
|
name: string;
|
||||||
}>;
|
}>;
|
||||||
|
|
||||||
@@ -77,6 +84,7 @@ const users: UserListResult = useQuery(api.users.list);
|
|||||||
```
|
```
|
||||||
|
|
||||||
**✅ Good:**
|
**✅ Good:**
|
||||||
|
|
||||||
```typescript
|
```typescript
|
||||||
// Let TypeScript infer the type from the query
|
// Let TypeScript infer the type from the query
|
||||||
const users = useQuery(api.users.list);
|
const users = useQuery(api.users.list);
|
||||||
@@ -84,7 +92,7 @@ const users = useQuery(api.users.list);
|
|||||||
|
|
||||||
// You can still use it with type inference
|
// You can still use it with type inference
|
||||||
if (users !== undefined) {
|
if (users !== undefined) {
|
||||||
users.forEach(user => {
|
users.forEach((user) => {
|
||||||
// TypeScript knows user._id is Id<"users"> and user.name is string
|
// TypeScript knows user._id is Id<"users"> and user.name is string
|
||||||
console.log(user.name);
|
console.log(user.name);
|
||||||
});
|
});
|
||||||
@@ -92,16 +100,18 @@ if (users !== undefined) {
|
|||||||
```
|
```
|
||||||
|
|
||||||
**✅ Good (with explicit type if needed for clarity):**
|
**✅ Good (with explicit type if needed for clarity):**
|
||||||
|
|
||||||
```typescript
|
```typescript
|
||||||
// Only if you need to export or explicitly annotate for documentation
|
// Only if you need to export or explicitly annotate for documentation
|
||||||
import type { FunctionReturnType } from "convex/server";
|
import type { FunctionReturnType } from 'convex/server';
|
||||||
import type { api } from "./convex/_generated/api";
|
import type { api } from './convex/_generated/api';
|
||||||
|
|
||||||
type UserListResult = FunctionReturnType<typeof api.users.list>;
|
type UserListResult = FunctionReturnType<typeof api.users.list>;
|
||||||
const users = useQuery(api.users.list);
|
const users = useQuery(api.users.list);
|
||||||
```
|
```
|
||||||
|
|
||||||
### Best Practices
|
### Best Practices
|
||||||
|
|
||||||
- Trust Convex's type inference - it's based on your schema and validators
|
- Trust Convex's type inference - it's based on your schema and validators
|
||||||
- If you need type annotations, use `FunctionReturnType` from Convex's type utilities
|
- If you need type annotations, use `FunctionReturnType` from Convex's type utilities
|
||||||
- Only create manual types if you're doing complex transformations that need intermediate types
|
- Only create manual types if you're doing complex transformations that need intermediate types
|
||||||
|
|||||||
Reference in New Issue
Block a user