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:
2025-11-12 10:24:45 -03:00
parent 9bb13b486e
commit 1c56d71d43
2 changed files with 29 additions and 20 deletions

View File

@@ -1,6 +1,5 @@
---
description: Ajuda para escrever e editar aquivos svelte
alwaysApply: false
alwaysApply: true
---
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:

View File

@@ -1,6 +1,7 @@
---
description: Guidelines for TypeScript usage, including type safety rules and Convex query typing
globs: **/*.ts,**/*.tsx,**/*.svelte
globs: **/*.ts,**/*.svelte
alwaysApply: false
---
# TypeScript Guidelines
@@ -8,6 +9,7 @@ globs: **/*.ts,**/*.tsx,**/*.svelte
## Type Safety Rules
### Avoid `any` Type
- **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`)
- Instead of `any`, use:
@@ -20,44 +22,48 @@ globs: **/*.ts,**/*.tsx,**/*.svelte
### Examples
**❌ Bad:**
```typescript
function processData(data: any) {
return data.value;
return data.value;
}
```
**✅ Good:**
```typescript
function processData(data: { value: string }) {
return data.value;
return data.value;
}
// Or with generics
function processData<T extends { value: unknown }>(data: T) {
return data.value;
return data.value;
}
// Or with unknown and type guards
function processData(data: unknown) {
if (typeof data === 'object' && data !== null && 'value' in data) {
return (data as { value: string }).value;
}
throw new Error('Invalid data');
if (typeof data === 'object' && data !== null && 'value' in data) {
return (data as { value: string }).value;
}
throw new Error('Invalid data');
}
```
**✅ Exception (tests only):**
```typescript
// test.ts or *.spec.ts
it('should handle any input', () => {
const input: any = getMockData();
expect(process(input)).toBeDefined();
const input: any = getMockData();
expect(process(input)).toBeDefined();
});
```
## Convex Query Typing
### Frontend Query Usage
- **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
- The TypeScript types are automatically inferred from the query's return validator
@@ -66,17 +72,19 @@ it('should handle any input', () => {
### Examples
**❌ Bad:**
```typescript
// Don't manually type the result
type UserListResult = Array<{
_id: Id<"users">;
name: string;
_id: Id<'users'>;
name: string;
}>;
const users: UserListResult = useQuery(api.users.list);
```
**✅ Good:**
```typescript
// Let TypeScript infer the type from the query
const users = useQuery(api.users.list);
@@ -84,24 +92,26 @@ const users = useQuery(api.users.list);
// You can still use it with type inference
if (users !== undefined) {
users.forEach(user => {
// TypeScript knows user._id is Id<"users"> and user.name is string
console.log(user.name);
});
users.forEach((user) => {
// TypeScript knows user._id is Id<"users"> and user.name is string
console.log(user.name);
});
}
```
**✅ Good (with explicit type if needed for clarity):**
```typescript
// Only if you need to export or explicitly annotate for documentation
import type { FunctionReturnType } from "convex/server";
import type { api } from "./convex/_generated/api";
import type { FunctionReturnType } from 'convex/server';
import type { api } from './convex/_generated/api';
type UserListResult = FunctionReturnType<typeof api.users.list>;
const users = useQuery(api.users.list);
```
### Best Practices
- 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
- Only create manual types if you're doing complex transformations that need intermediate types