chore: Update larevel boot package
This commit is contained in:
parent
0e7ea220b1
commit
bc02bf948f
|
|
@ -0,0 +1,369 @@
|
||||||
|
---
|
||||||
|
name: inertia-react-development
|
||||||
|
description: >-
|
||||||
|
Develops Inertia.js v2 React client-side applications. Activates when creating
|
||||||
|
React pages, forms, or navigation; using <Link>, <Form>, useForm, or router;
|
||||||
|
working with deferred props, prefetching, or polling; or when user mentions
|
||||||
|
React with Inertia, React pages, React forms, or React navigation.
|
||||||
|
---
|
||||||
|
|
||||||
|
# Inertia React Development
|
||||||
|
|
||||||
|
## When to Apply
|
||||||
|
|
||||||
|
Activate this skill when:
|
||||||
|
|
||||||
|
- Creating or modifying React page components for Inertia
|
||||||
|
- Working with forms in React (using `<Form>` or `useForm`)
|
||||||
|
- Implementing client-side navigation with `<Link>` or `router`
|
||||||
|
- Using v2 features: deferred props, prefetching, or polling
|
||||||
|
- Building React-specific features with the Inertia protocol
|
||||||
|
|
||||||
|
## Documentation
|
||||||
|
|
||||||
|
Use `search-docs` for detailed Inertia v2 React patterns and documentation.
|
||||||
|
|
||||||
|
## Basic Usage
|
||||||
|
|
||||||
|
### Page Components Location
|
||||||
|
|
||||||
|
React page components should be placed in the `resources/js/Pages` directory.
|
||||||
|
|
||||||
|
### Page Component Structure
|
||||||
|
|
||||||
|
<code-snippet name="Basic React Page Component" lang="react">
|
||||||
|
|
||||||
|
export default function UsersIndex({ users }) {
|
||||||
|
return (
|
||||||
|
<div>
|
||||||
|
<h1>Users</h1>
|
||||||
|
<ul>
|
||||||
|
{users.map(user => <li key={user.id}>{user.name}</li>)}
|
||||||
|
</ul>
|
||||||
|
</div>
|
||||||
|
)
|
||||||
|
}
|
||||||
|
|
||||||
|
</code-snippet>
|
||||||
|
|
||||||
|
## Client-Side Navigation
|
||||||
|
|
||||||
|
### Basic Link Component
|
||||||
|
|
||||||
|
Use `<Link>` for client-side navigation instead of traditional `<a>` tags:
|
||||||
|
|
||||||
|
<code-snippet name="Inertia React Navigation" lang="react">
|
||||||
|
|
||||||
|
import { Link, router } from '@inertiajs/react'
|
||||||
|
|
||||||
|
<Link href="/">Home</Link>
|
||||||
|
<Link href="/users">Users</Link>
|
||||||
|
<Link href={`/users/${user.id}`}>View User</Link>
|
||||||
|
|
||||||
|
</code-snippet>
|
||||||
|
|
||||||
|
### Link with Method
|
||||||
|
|
||||||
|
<code-snippet name="Link with POST Method" lang="react">
|
||||||
|
|
||||||
|
import { Link } from '@inertiajs/react'
|
||||||
|
|
||||||
|
<Link href="/logout" method="post" as="button">
|
||||||
|
Logout
|
||||||
|
</Link>
|
||||||
|
|
||||||
|
</code-snippet>
|
||||||
|
|
||||||
|
### Prefetching
|
||||||
|
|
||||||
|
Prefetch pages to improve perceived performance:
|
||||||
|
|
||||||
|
<code-snippet name="Prefetch on Hover" lang="react">
|
||||||
|
|
||||||
|
import { Link } from '@inertiajs/react'
|
||||||
|
|
||||||
|
<Link href="/users" prefetch>
|
||||||
|
Users
|
||||||
|
</Link>
|
||||||
|
|
||||||
|
</code-snippet>
|
||||||
|
|
||||||
|
### Programmatic Navigation
|
||||||
|
|
||||||
|
<code-snippet name="Router Visit" lang="react">
|
||||||
|
|
||||||
|
import { router } from '@inertiajs/react'
|
||||||
|
|
||||||
|
function handleClick() {
|
||||||
|
router.visit('/users')
|
||||||
|
}
|
||||||
|
|
||||||
|
// Or with options
|
||||||
|
router.visit('/users', {
|
||||||
|
method: 'post',
|
||||||
|
data: { name: 'John' },
|
||||||
|
onSuccess: () => console.log('Success!'),
|
||||||
|
})
|
||||||
|
|
||||||
|
</code-snippet>
|
||||||
|
|
||||||
|
## Form Handling
|
||||||
|
|
||||||
|
### Form Component (Recommended)
|
||||||
|
|
||||||
|
The recommended way to build forms is with the `<Form>` component:
|
||||||
|
|
||||||
|
<code-snippet name="Form Component Example" lang="react">
|
||||||
|
|
||||||
|
import { Form } from '@inertiajs/react'
|
||||||
|
|
||||||
|
export default function CreateUser() {
|
||||||
|
return (
|
||||||
|
<Form action="/users" method="post">
|
||||||
|
{({ errors, processing, wasSuccessful }) => (
|
||||||
|
<>
|
||||||
|
<input type="text" name="name" />
|
||||||
|
{errors.name && <div>{errors.name}</div>}
|
||||||
|
|
||||||
|
<input type="email" name="email" />
|
||||||
|
{errors.email && <div>{errors.email}</div>}
|
||||||
|
|
||||||
|
<button type="submit" disabled={processing}>
|
||||||
|
{processing ? 'Creating...' : 'Create User'}
|
||||||
|
</button>
|
||||||
|
|
||||||
|
{wasSuccessful && <div>User created!</div>}
|
||||||
|
</>
|
||||||
|
)}
|
||||||
|
</Form>
|
||||||
|
)
|
||||||
|
}
|
||||||
|
|
||||||
|
</code-snippet>
|
||||||
|
|
||||||
|
### Form Component With All Props
|
||||||
|
|
||||||
|
<code-snippet name="Form Component Full Example" lang="react">
|
||||||
|
|
||||||
|
import { Form } from '@inertiajs/react'
|
||||||
|
|
||||||
|
<Form action="/users" method="post">
|
||||||
|
{({
|
||||||
|
errors,
|
||||||
|
hasErrors,
|
||||||
|
processing,
|
||||||
|
progress,
|
||||||
|
wasSuccessful,
|
||||||
|
recentlySuccessful,
|
||||||
|
clearErrors,
|
||||||
|
resetAndClearErrors,
|
||||||
|
defaults,
|
||||||
|
isDirty,
|
||||||
|
reset,
|
||||||
|
submit
|
||||||
|
}) => (
|
||||||
|
<>
|
||||||
|
<input type="text" name="name" defaultValue={defaults.name} />
|
||||||
|
{errors.name && <div>{errors.name}</div>}
|
||||||
|
|
||||||
|
<button type="submit" disabled={processing}>
|
||||||
|
{processing ? 'Saving...' : 'Save'}
|
||||||
|
</button>
|
||||||
|
|
||||||
|
{progress && (
|
||||||
|
<progress value={progress.percentage} max="100">
|
||||||
|
{progress.percentage}%
|
||||||
|
</progress>
|
||||||
|
)}
|
||||||
|
|
||||||
|
{wasSuccessful && <div>Saved!</div>}
|
||||||
|
</>
|
||||||
|
)}
|
||||||
|
</Form>
|
||||||
|
|
||||||
|
</code-snippet>
|
||||||
|
|
||||||
|
### Form Component Reset Props
|
||||||
|
|
||||||
|
The `<Form>` component supports automatic resetting:
|
||||||
|
|
||||||
|
- `resetOnError` - Reset form data when the request fails
|
||||||
|
- `resetOnSuccess` - Reset form data when the request succeeds
|
||||||
|
- `setDefaultsOnSuccess` - Update default values on success
|
||||||
|
|
||||||
|
Use the `search-docs` tool with a query of `form component resetting` for detailed guidance.
|
||||||
|
|
||||||
|
<code-snippet name="Form with Reset Props" lang="react">
|
||||||
|
|
||||||
|
import { Form } from '@inertiajs/react'
|
||||||
|
|
||||||
|
<Form
|
||||||
|
action="/users"
|
||||||
|
method="post"
|
||||||
|
resetOnSuccess
|
||||||
|
setDefaultsOnSuccess
|
||||||
|
>
|
||||||
|
{({ errors, processing, wasSuccessful }) => (
|
||||||
|
<>
|
||||||
|
<input type="text" name="name" />
|
||||||
|
{errors.name && <div>{errors.name}</div>}
|
||||||
|
|
||||||
|
<button type="submit" disabled={processing}>
|
||||||
|
Submit
|
||||||
|
</button>
|
||||||
|
</>
|
||||||
|
)}
|
||||||
|
</Form>
|
||||||
|
|
||||||
|
</code-snippet>
|
||||||
|
|
||||||
|
Forms can also be built using the `useForm` helper for more programmatic control. Use the `search-docs` tool with a query of `useForm helper` for guidance.
|
||||||
|
|
||||||
|
### `useForm` Hook
|
||||||
|
|
||||||
|
For more programmatic control or to follow existing conventions, use the `useForm` hook:
|
||||||
|
|
||||||
|
<code-snippet name="useForm Hook Example" lang="react">
|
||||||
|
|
||||||
|
import { useForm } from '@inertiajs/react'
|
||||||
|
|
||||||
|
export default function CreateUser() {
|
||||||
|
const { data, setData, post, processing, errors, reset } = useForm({
|
||||||
|
name: '',
|
||||||
|
email: '',
|
||||||
|
password: '',
|
||||||
|
})
|
||||||
|
|
||||||
|
function submit(e) {
|
||||||
|
e.preventDefault()
|
||||||
|
post('/users', {
|
||||||
|
onSuccess: () => reset('password'),
|
||||||
|
})
|
||||||
|
}
|
||||||
|
|
||||||
|
return (
|
||||||
|
<form onSubmit={submit}>
|
||||||
|
<input
|
||||||
|
type="text"
|
||||||
|
value={data.name}
|
||||||
|
onChange={e => setData('name', e.target.value)}
|
||||||
|
/>
|
||||||
|
{errors.name && <div>{errors.name}</div>}
|
||||||
|
|
||||||
|
<input
|
||||||
|
type="email"
|
||||||
|
value={data.email}
|
||||||
|
onChange={e => setData('email', e.target.value)}
|
||||||
|
/>
|
||||||
|
{errors.email && <div>{errors.email}</div>}
|
||||||
|
|
||||||
|
<input
|
||||||
|
type="password"
|
||||||
|
value={data.password}
|
||||||
|
onChange={e => setData('password', e.target.value)}
|
||||||
|
/>
|
||||||
|
{errors.password && <div>{errors.password}</div>}
|
||||||
|
|
||||||
|
<button type="submit" disabled={processing}>
|
||||||
|
Create User
|
||||||
|
</button>
|
||||||
|
</form>
|
||||||
|
)
|
||||||
|
}
|
||||||
|
|
||||||
|
</code-snippet>
|
||||||
|
|
||||||
|
## Inertia v2 Features
|
||||||
|
|
||||||
|
### Deferred Props
|
||||||
|
|
||||||
|
Use deferred props to load data after initial page render:
|
||||||
|
|
||||||
|
<code-snippet name="Deferred Props with Empty State" lang="react">
|
||||||
|
|
||||||
|
export default function UsersIndex({ users }) {
|
||||||
|
// users will be undefined initially, then populated
|
||||||
|
return (
|
||||||
|
<div>
|
||||||
|
<h1>Users</h1>
|
||||||
|
{!users ? (
|
||||||
|
<div className="animate-pulse">
|
||||||
|
<div className="h-4 bg-gray-200 rounded w-3/4 mb-2"></div>
|
||||||
|
<div className="h-4 bg-gray-200 rounded w-1/2"></div>
|
||||||
|
</div>
|
||||||
|
) : (
|
||||||
|
<ul>
|
||||||
|
{users.map(user => (
|
||||||
|
<li key={user.id}>{user.name}</li>
|
||||||
|
))}
|
||||||
|
</ul>
|
||||||
|
)}
|
||||||
|
</div>
|
||||||
|
)
|
||||||
|
}
|
||||||
|
|
||||||
|
</code-snippet>
|
||||||
|
|
||||||
|
### Polling
|
||||||
|
|
||||||
|
Automatically refresh data at intervals:
|
||||||
|
|
||||||
|
<code-snippet name="Polling Example" lang="react">
|
||||||
|
|
||||||
|
import { router } from '@inertiajs/react'
|
||||||
|
import { useEffect } from 'react'
|
||||||
|
|
||||||
|
export default function Dashboard({ stats }) {
|
||||||
|
useEffect(() => {
|
||||||
|
const interval = setInterval(() => {
|
||||||
|
router.reload({ only: ['stats'] })
|
||||||
|
}, 5000) // Poll every 5 seconds
|
||||||
|
|
||||||
|
return () => clearInterval(interval)
|
||||||
|
}, [])
|
||||||
|
|
||||||
|
return (
|
||||||
|
<div>
|
||||||
|
<h1>Dashboard</h1>
|
||||||
|
<div>Active Users: {stats.activeUsers}</div>
|
||||||
|
</div>
|
||||||
|
)
|
||||||
|
}
|
||||||
|
|
||||||
|
</code-snippet>
|
||||||
|
|
||||||
|
### WhenVisible (Infinite Scroll)
|
||||||
|
|
||||||
|
Load more data when user scrolls to a specific element:
|
||||||
|
|
||||||
|
<code-snippet name="Infinite Scroll with WhenVisible" lang="react">
|
||||||
|
|
||||||
|
import { WhenVisible } from '@inertiajs/react'
|
||||||
|
|
||||||
|
export default function UsersList({ users }) {
|
||||||
|
return (
|
||||||
|
<div>
|
||||||
|
{users.data.map(user => (
|
||||||
|
<div key={user.id}>{user.name}</div>
|
||||||
|
))}
|
||||||
|
|
||||||
|
{users.next_page_url && (
|
||||||
|
<WhenVisible
|
||||||
|
data="users"
|
||||||
|
params={{ page: users.current_page + 1 }}
|
||||||
|
fallback={<div>Loading more...</div>}
|
||||||
|
/>
|
||||||
|
)}
|
||||||
|
</div>
|
||||||
|
)
|
||||||
|
}
|
||||||
|
|
||||||
|
</code-snippet>
|
||||||
|
|
||||||
|
## Common Pitfalls
|
||||||
|
|
||||||
|
- Using traditional `<a>` links instead of Inertia's `<Link>` component (breaks SPA behavior)
|
||||||
|
- Forgetting to add loading states (skeleton screens) when using deferred props
|
||||||
|
- Not handling the `undefined` state of deferred props before data loads
|
||||||
|
- Using `<form>` without preventing default submission (use `<Form>` component or `e.preventDefault()`)
|
||||||
|
- Forgetting to check if `<Form>` component is available in your Inertia version
|
||||||
|
|
@ -0,0 +1,74 @@
|
||||||
|
---
|
||||||
|
name: pennant-development
|
||||||
|
description: >-
|
||||||
|
Manages feature flags with Laravel Pennant. Activates when creating, checking, or toggling
|
||||||
|
feature flags; showing or hiding features conditionally; implementing A/B testing; working with
|
||||||
|
@feature directive; or when the user mentions feature flags, feature toggles, Pennant, conditional
|
||||||
|
features, rollouts, or gradually enabling features.
|
||||||
|
---
|
||||||
|
|
||||||
|
# Pennant Features
|
||||||
|
|
||||||
|
## When to Apply
|
||||||
|
|
||||||
|
Activate this skill when:
|
||||||
|
|
||||||
|
- Creating or checking feature flags
|
||||||
|
- Managing feature rollouts
|
||||||
|
- Implementing A/B testing
|
||||||
|
|
||||||
|
## Documentation
|
||||||
|
|
||||||
|
Use `search-docs` for detailed Pennant patterns and documentation.
|
||||||
|
|
||||||
|
## Basic Usage
|
||||||
|
|
||||||
|
### Defining Features
|
||||||
|
|
||||||
|
<code-snippet name="Defining Features" lang="php">
|
||||||
|
use Laravel\Pennant\Feature;
|
||||||
|
|
||||||
|
Feature::define('new-dashboard', function (User $user) {
|
||||||
|
return $user->isAdmin();
|
||||||
|
});
|
||||||
|
</code-snippet>
|
||||||
|
|
||||||
|
### Checking Features
|
||||||
|
|
||||||
|
<code-snippet name="Checking Features" lang="php">
|
||||||
|
if (Feature::active('new-dashboard')) {
|
||||||
|
// Feature is active
|
||||||
|
}
|
||||||
|
|
||||||
|
// With scope
|
||||||
|
if (Feature::for($user)->active('new-dashboard')) {
|
||||||
|
// Feature is active for this user
|
||||||
|
}
|
||||||
|
</code-snippet>
|
||||||
|
|
||||||
|
### Blade Directive
|
||||||
|
|
||||||
|
<code-snippet name="Blade Directive" lang="blade">
|
||||||
|
@feature('new-dashboard')
|
||||||
|
<x-new-dashboard />
|
||||||
|
@else
|
||||||
|
<x-old-dashboard />
|
||||||
|
@endfeature
|
||||||
|
</code-snippet>
|
||||||
|
|
||||||
|
### Activating / Deactivating
|
||||||
|
|
||||||
|
<code-snippet name="Activating Features" lang="php">
|
||||||
|
Feature::activate('new-dashboard');
|
||||||
|
Feature::for($user)->activate('new-dashboard');
|
||||||
|
</code-snippet>
|
||||||
|
|
||||||
|
## Verification
|
||||||
|
|
||||||
|
1. Check feature flag is defined
|
||||||
|
2. Test with different scopes/users
|
||||||
|
|
||||||
|
## Common Pitfalls
|
||||||
|
|
||||||
|
- Forgetting to scope features for specific users/entities
|
||||||
|
- Not following existing naming conventions
|
||||||
|
|
@ -0,0 +1,174 @@
|
||||||
|
---
|
||||||
|
name: pest-testing
|
||||||
|
description: >-
|
||||||
|
Tests applications using the Pest 4 PHP framework. Activates when writing tests, creating unit or feature
|
||||||
|
tests, adding assertions, testing Livewire components, browser testing, debugging test failures,
|
||||||
|
working with datasets or mocking; or when the user mentions test, spec, TDD, expects, assertion,
|
||||||
|
coverage, or needs to verify functionality works.
|
||||||
|
---
|
||||||
|
|
||||||
|
# Pest Testing 4
|
||||||
|
|
||||||
|
## When to Apply
|
||||||
|
|
||||||
|
Activate this skill when:
|
||||||
|
|
||||||
|
- Creating new tests (unit, feature, or browser)
|
||||||
|
- Modifying existing tests
|
||||||
|
- Debugging test failures
|
||||||
|
- Working with browser testing or smoke testing
|
||||||
|
- Writing architecture tests or visual regression tests
|
||||||
|
|
||||||
|
## Documentation
|
||||||
|
|
||||||
|
Use `search-docs` for detailed Pest 4 patterns and documentation.
|
||||||
|
|
||||||
|
## Basic Usage
|
||||||
|
|
||||||
|
### Creating Tests
|
||||||
|
|
||||||
|
All tests must be written using Pest. Use `php artisan make:test --pest {name}`.
|
||||||
|
|
||||||
|
### Test Organization
|
||||||
|
|
||||||
|
- Unit/Feature tests: `tests/Feature` and `tests/Unit` directories.
|
||||||
|
- Browser tests: `tests/Browser/` directory.
|
||||||
|
- Do NOT remove tests without approval - these are core application code.
|
||||||
|
|
||||||
|
### Basic Test Structure
|
||||||
|
|
||||||
|
<code-snippet name="Basic Pest Test Example" lang="php">
|
||||||
|
|
||||||
|
it('is true', function () {
|
||||||
|
expect(true)->toBeTrue();
|
||||||
|
});
|
||||||
|
|
||||||
|
</code-snippet>
|
||||||
|
|
||||||
|
### Running Tests
|
||||||
|
|
||||||
|
- Run minimal tests with filter before finalizing: `php artisan test --compact --filter=testName`.
|
||||||
|
- Run all tests: `php artisan test --compact`.
|
||||||
|
- Run file: `php artisan test --compact tests/Feature/ExampleTest.php`.
|
||||||
|
|
||||||
|
## Assertions
|
||||||
|
|
||||||
|
Use specific assertions (`assertSuccessful()`, `assertNotFound()`) instead of `assertStatus()`:
|
||||||
|
|
||||||
|
<code-snippet name="Pest Response Assertion" lang="php">
|
||||||
|
|
||||||
|
it('returns all', function () {
|
||||||
|
$this->postJson('/api/docs', [])->assertSuccessful();
|
||||||
|
});
|
||||||
|
|
||||||
|
</code-snippet>
|
||||||
|
|
||||||
|
| Use | Instead of |
|
||||||
|
|-----|------------|
|
||||||
|
| `assertSuccessful()` | `assertStatus(200)` |
|
||||||
|
| `assertNotFound()` | `assertStatus(404)` |
|
||||||
|
| `assertForbidden()` | `assertStatus(403)` |
|
||||||
|
|
||||||
|
## Mocking
|
||||||
|
|
||||||
|
Import mock function before use: `use function Pest\Laravel\mock;`
|
||||||
|
|
||||||
|
## Datasets
|
||||||
|
|
||||||
|
Use datasets for repetitive tests (validation rules, etc.):
|
||||||
|
|
||||||
|
<code-snippet name="Pest Dataset Example" lang="php">
|
||||||
|
|
||||||
|
it('has emails', function (string $email) {
|
||||||
|
expect($email)->not->toBeEmpty();
|
||||||
|
})->with([
|
||||||
|
'james' => 'james@laravel.com',
|
||||||
|
'taylor' => 'taylor@laravel.com',
|
||||||
|
]);
|
||||||
|
|
||||||
|
</code-snippet>
|
||||||
|
|
||||||
|
## Pest 4 Features
|
||||||
|
|
||||||
|
| Feature | Purpose |
|
||||||
|
|---------|---------|
|
||||||
|
| Browser Testing | Full integration tests in real browsers |
|
||||||
|
| Smoke Testing | Validate multiple pages quickly |
|
||||||
|
| Visual Regression | Compare screenshots for visual changes |
|
||||||
|
| Test Sharding | Parallel CI runs |
|
||||||
|
| Architecture Testing | Enforce code conventions |
|
||||||
|
|
||||||
|
### Browser Test Example
|
||||||
|
|
||||||
|
Browser tests run in real browsers for full integration testing:
|
||||||
|
|
||||||
|
- Browser tests live in `tests/Browser/`.
|
||||||
|
- Use Laravel features like `Event::fake()`, `assertAuthenticated()`, and model factories.
|
||||||
|
- Use `RefreshDatabase` for clean state per test.
|
||||||
|
- Interact with page: click, type, scroll, select, submit, drag-and-drop, touch gestures.
|
||||||
|
- Test on multiple browsers (Chrome, Firefox, Safari) if requested.
|
||||||
|
- Test on different devices/viewports (iPhone 14 Pro, tablets) if requested.
|
||||||
|
- Switch color schemes (light/dark mode) when appropriate.
|
||||||
|
- Take screenshots or pause tests for debugging.
|
||||||
|
|
||||||
|
<code-snippet name="Pest Browser Test Example" lang="php">
|
||||||
|
|
||||||
|
it('may reset the password', function () {
|
||||||
|
Notification::fake();
|
||||||
|
|
||||||
|
$this->actingAs(User::factory()->create());
|
||||||
|
|
||||||
|
$page = visit('/sign-in');
|
||||||
|
|
||||||
|
$page->assertSee('Sign In')
|
||||||
|
->assertNoJavascriptErrors()
|
||||||
|
->click('Forgot Password?')
|
||||||
|
->fill('email', 'nuno@laravel.com')
|
||||||
|
->click('Send Reset Link')
|
||||||
|
->assertSee('We have emailed your password reset link!');
|
||||||
|
|
||||||
|
Notification::assertSent(ResetPassword::class);
|
||||||
|
});
|
||||||
|
|
||||||
|
</code-snippet>
|
||||||
|
|
||||||
|
### Smoke Testing
|
||||||
|
|
||||||
|
Quickly validate multiple pages have no JavaScript errors:
|
||||||
|
|
||||||
|
<code-snippet name="Pest Smoke Testing Example" lang="php">
|
||||||
|
|
||||||
|
$pages = visit(['/', '/about', '/contact']);
|
||||||
|
|
||||||
|
$pages->assertNoJavascriptErrors()->assertNoConsoleLogs();
|
||||||
|
|
||||||
|
</code-snippet>
|
||||||
|
|
||||||
|
### Visual Regression Testing
|
||||||
|
|
||||||
|
Capture and compare screenshots to detect visual changes.
|
||||||
|
|
||||||
|
### Test Sharding
|
||||||
|
|
||||||
|
Split tests across parallel processes for faster CI runs.
|
||||||
|
|
||||||
|
### Architecture Testing
|
||||||
|
|
||||||
|
Pest 4 includes architecture testing (from Pest 3):
|
||||||
|
|
||||||
|
<code-snippet name="Architecture Test Example" lang="php">
|
||||||
|
|
||||||
|
arch('controllers')
|
||||||
|
->expect('App\Http\Controllers')
|
||||||
|
->toExtendNothing()
|
||||||
|
->toHaveSuffix('Controller');
|
||||||
|
|
||||||
|
</code-snippet>
|
||||||
|
|
||||||
|
## Common Pitfalls
|
||||||
|
|
||||||
|
- Not importing `use function Pest\Laravel\mock;` before using mock
|
||||||
|
- Using `assertStatus(200)` instead of `assertSuccessful()`
|
||||||
|
- Forgetting datasets for repetitive validation tests
|
||||||
|
- Deleting tests without approval
|
||||||
|
- Forgetting `assertNoJavascriptErrors()` in browser tests
|
||||||
|
|
@ -0,0 +1,124 @@
|
||||||
|
---
|
||||||
|
name: tailwindcss-development
|
||||||
|
description: >-
|
||||||
|
Styles applications using Tailwind CSS v4 utilities. Activates when adding styles, restyling components,
|
||||||
|
working with gradients, spacing, layout, flex, grid, responsive design, dark mode, colors,
|
||||||
|
typography, or borders; or when the user mentions CSS, styling, classes, Tailwind, restyle,
|
||||||
|
hero section, cards, buttons, or any visual/UI changes.
|
||||||
|
---
|
||||||
|
|
||||||
|
# Tailwind CSS Development
|
||||||
|
|
||||||
|
## When to Apply
|
||||||
|
|
||||||
|
Activate this skill when:
|
||||||
|
|
||||||
|
- Adding styles to components or pages
|
||||||
|
- Working with responsive design
|
||||||
|
- Implementing dark mode
|
||||||
|
- Extracting repeated patterns into components
|
||||||
|
- Debugging spacing or layout issues
|
||||||
|
|
||||||
|
## Documentation
|
||||||
|
|
||||||
|
Use `search-docs` for detailed Tailwind CSS v4 patterns and documentation.
|
||||||
|
|
||||||
|
## Basic Usage
|
||||||
|
|
||||||
|
- Use Tailwind CSS classes to style HTML. Check and follow existing Tailwind conventions in the project before introducing new patterns.
|
||||||
|
- Offer to extract repeated patterns into components that match the project's conventions (e.g., Blade, JSX, Vue).
|
||||||
|
- Consider class placement, order, priority, and defaults. Remove redundant classes, add classes to parent or child elements carefully to reduce repetition, and group elements logically.
|
||||||
|
|
||||||
|
## Tailwind CSS v4 Specifics
|
||||||
|
|
||||||
|
- Always use Tailwind CSS v4 and avoid deprecated utilities.
|
||||||
|
- `corePlugins` is not supported in Tailwind v4.
|
||||||
|
|
||||||
|
### CSS-First Configuration
|
||||||
|
|
||||||
|
In Tailwind v4, configuration is CSS-first using the `@theme` directive — no separate `tailwind.config.js` file is needed:
|
||||||
|
|
||||||
|
<code-snippet name="CSS-First Config" lang="css">
|
||||||
|
@theme {
|
||||||
|
--color-brand: oklch(0.72 0.11 178);
|
||||||
|
}
|
||||||
|
</code-snippet>
|
||||||
|
|
||||||
|
### Import Syntax
|
||||||
|
|
||||||
|
In Tailwind v4, import Tailwind with a regular CSS `@import` statement instead of the `@tailwind` directives used in v3:
|
||||||
|
|
||||||
|
<code-snippet name="v4 Import Syntax" lang="diff">
|
||||||
|
- @tailwind base;
|
||||||
|
- @tailwind components;
|
||||||
|
- @tailwind utilities;
|
||||||
|
+ @import "tailwindcss";
|
||||||
|
</code-snippet>
|
||||||
|
|
||||||
|
### Replaced Utilities
|
||||||
|
|
||||||
|
Tailwind v4 removed deprecated utilities. Use the replacements shown below. Opacity values remain numeric.
|
||||||
|
|
||||||
|
| Deprecated | Replacement |
|
||||||
|
|------------|-------------|
|
||||||
|
| bg-opacity-* | bg-black/* |
|
||||||
|
| text-opacity-* | text-black/* |
|
||||||
|
| border-opacity-* | border-black/* |
|
||||||
|
| divide-opacity-* | divide-black/* |
|
||||||
|
| ring-opacity-* | ring-black/* |
|
||||||
|
| placeholder-opacity-* | placeholder-black/* |
|
||||||
|
| flex-shrink-* | shrink-* |
|
||||||
|
| flex-grow-* | grow-* |
|
||||||
|
| overflow-ellipsis | text-ellipsis |
|
||||||
|
| decoration-slice | box-decoration-slice |
|
||||||
|
| decoration-clone | box-decoration-clone |
|
||||||
|
|
||||||
|
## Spacing
|
||||||
|
|
||||||
|
Use `gap` utilities instead of margins for spacing between siblings:
|
||||||
|
|
||||||
|
<code-snippet name="Gap Utilities" lang="html">
|
||||||
|
<div class="flex gap-8">
|
||||||
|
<div>Item 1</div>
|
||||||
|
<div>Item 2</div>
|
||||||
|
</div>
|
||||||
|
</code-snippet>
|
||||||
|
|
||||||
|
## Dark Mode
|
||||||
|
|
||||||
|
If existing pages and components support dark mode, new pages and components must support it the same way, typically using the `dark:` variant:
|
||||||
|
|
||||||
|
<code-snippet name="Dark Mode" lang="html">
|
||||||
|
<div class="bg-white dark:bg-gray-900 text-gray-900 dark:text-white">
|
||||||
|
Content adapts to color scheme
|
||||||
|
</div>
|
||||||
|
</code-snippet>
|
||||||
|
|
||||||
|
## Common Patterns
|
||||||
|
|
||||||
|
### Flexbox Layout
|
||||||
|
|
||||||
|
<code-snippet name="Flexbox Layout" lang="html">
|
||||||
|
<div class="flex items-center justify-between gap-4">
|
||||||
|
<div>Left content</div>
|
||||||
|
<div>Right content</div>
|
||||||
|
</div>
|
||||||
|
</code-snippet>
|
||||||
|
|
||||||
|
### Grid Layout
|
||||||
|
|
||||||
|
<code-snippet name="Grid Layout" lang="html">
|
||||||
|
<div class="grid grid-cols-1 md:grid-cols-2 lg:grid-cols-3 gap-6">
|
||||||
|
<div>Card 1</div>
|
||||||
|
<div>Card 2</div>
|
||||||
|
<div>Card 3</div>
|
||||||
|
</div>
|
||||||
|
</code-snippet>
|
||||||
|
|
||||||
|
## Common Pitfalls
|
||||||
|
|
||||||
|
- Using deprecated v3 utilities (bg-opacity-*, flex-shrink-*, etc.)
|
||||||
|
- Using `@tailwind` directives instead of `@import "tailwindcss"`
|
||||||
|
- Trying to use `tailwind.config.js` instead of CSS `@theme` directive
|
||||||
|
- Using margins for spacing between siblings instead of gap utilities
|
||||||
|
- Forgetting to add dark mode variants when the project uses dark mode
|
||||||
|
|
@ -0,0 +1,89 @@
|
||||||
|
---
|
||||||
|
name: wayfinder-development
|
||||||
|
description: >-
|
||||||
|
Activates whenever referencing backend routes in frontend components. Use when
|
||||||
|
importing from @/actions or @/routes, calling Laravel routes from TypeScript,
|
||||||
|
or working with Wayfinder route functions.
|
||||||
|
---
|
||||||
|
|
||||||
|
# Wayfinder Development
|
||||||
|
|
||||||
|
## When to Apply
|
||||||
|
|
||||||
|
Activate whenever referencing backend routes in frontend components:
|
||||||
|
- Importing from `@/actions/` or `@/routes/`
|
||||||
|
- Calling Laravel routes from TypeScript/JavaScript
|
||||||
|
- Creating links or navigation to backend endpoints
|
||||||
|
|
||||||
|
## Documentation
|
||||||
|
|
||||||
|
Use `search-docs` for detailed Wayfinder patterns and documentation.
|
||||||
|
|
||||||
|
## Quick Reference
|
||||||
|
|
||||||
|
### Generate Routes
|
||||||
|
|
||||||
|
Run after route changes if Vite plugin isn't installed:
|
||||||
|
|
||||||
|
php artisan wayfinder:generate --no-interaction
|
||||||
|
|
||||||
|
For form helpers, use `--with-form` flag:
|
||||||
|
|
||||||
|
php artisan wayfinder:generate --with-form --no-interaction
|
||||||
|
|
||||||
|
### Import Patterns
|
||||||
|
|
||||||
|
<code-snippet name="Controller Action Imports" lang="typescript">
|
||||||
|
|
||||||
|
// Named imports for tree-shaking (preferred)...
|
||||||
|
import { show, store, update } from '@/actions/App/Http/Controllers/PostController'
|
||||||
|
|
||||||
|
// Named route imports...
|
||||||
|
import { show as postShow } from '@/routes/post'
|
||||||
|
|
||||||
|
</code-snippet>
|
||||||
|
|
||||||
|
### Common Methods
|
||||||
|
|
||||||
|
<code-snippet name="Wayfinder Methods" lang="typescript">
|
||||||
|
|
||||||
|
// Get route object...
|
||||||
|
show(1) // { url: "/posts/1", method: "get" }
|
||||||
|
|
||||||
|
// Get URL string...
|
||||||
|
show.url(1) // "/posts/1"
|
||||||
|
|
||||||
|
// Specific HTTP methods...
|
||||||
|
show.get(1)
|
||||||
|
store.post()
|
||||||
|
update.patch(1)
|
||||||
|
destroy.delete(1)
|
||||||
|
|
||||||
|
// Form attributes for HTML forms...
|
||||||
|
store.form() // { action: "/posts", method: "post" }
|
||||||
|
|
||||||
|
// Query parameters...
|
||||||
|
show(1, { query: { page: 1 } }) // "/posts/1?page=1"
|
||||||
|
|
||||||
|
</code-snippet>
|
||||||
|
|
||||||
|
## Wayfinder + Inertia
|
||||||
|
|
||||||
|
Use Wayfinder with the `<Form>` component:
|
||||||
|
<code-snippet name="Wayfinder Form (React)" lang="typescript">
|
||||||
|
|
||||||
|
<Form {...store.form()}><input name="title" /></Form>
|
||||||
|
|
||||||
|
</code-snippet>
|
||||||
|
|
||||||
|
## Verification
|
||||||
|
|
||||||
|
1. Run `php artisan wayfinder:generate` to regenerate routes if Vite plugin isn't installed
|
||||||
|
2. Check TypeScript imports resolve correctly
|
||||||
|
3. Verify route URLs match expected paths
|
||||||
|
|
||||||
|
## Common Pitfalls
|
||||||
|
|
||||||
|
- Using default imports instead of named imports (breaks tree-shaking)
|
||||||
|
- Forgetting to regenerate after route changes
|
||||||
|
- Not using type-safe parameter objects for route model binding
|
||||||
|
|
@ -8,4 +8,4 @@
|
||||||
]
|
]
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
@ -6,9 +6,10 @@ alwaysApply: true
|
||||||
|
|
||||||
# Laravel Boost Guidelines
|
# Laravel Boost Guidelines
|
||||||
|
|
||||||
The Laravel Boost guidelines are specifically curated by Laravel maintainers for this application. These guidelines should be followed closely to enhance the user's satisfaction building Laravel applications.
|
The Laravel Boost guidelines are specifically curated by Laravel maintainers for this application. These guidelines should be followed closely to ensure the best experience when building Laravel applications.
|
||||||
|
|
||||||
## Foundational Context
|
## Foundational Context
|
||||||
|
|
||||||
This application is a Laravel application and its main Laravel ecosystems package & versions are below. You are an expert with them all. Ensure you abide by these specific packages & versions.
|
This application is a Laravel application and its main Laravel ecosystems package & versions are below. You are an expert with them all. Ensure you abide by these specific packages & versions.
|
||||||
|
|
||||||
- php - 8.4.1
|
- php - 8.4.1
|
||||||
|
|
@ -16,6 +17,7 @@ This application is a Laravel application and its main Laravel ecosystems packag
|
||||||
- laravel/cashier (CASHIER) - v16
|
- laravel/cashier (CASHIER) - v16
|
||||||
- laravel/fortify (FORTIFY) - v1
|
- laravel/fortify (FORTIFY) - v1
|
||||||
- laravel/framework (LARAVEL) - v12
|
- laravel/framework (LARAVEL) - v12
|
||||||
|
- laravel/pennant (PENNANT) - v1
|
||||||
- laravel/prompts (PROMPTS) - v0
|
- laravel/prompts (PROMPTS) - v0
|
||||||
- laravel/wayfinder (WAYFINDER) - v0
|
- laravel/wayfinder (WAYFINDER) - v0
|
||||||
- laravel/mcp (MCP) - v0
|
- laravel/mcp (MCP) - v0
|
||||||
|
|
@ -30,77 +32,96 @@ This application is a Laravel application and its main Laravel ecosystems packag
|
||||||
- eslint (ESLINT) - v9
|
- eslint (ESLINT) - v9
|
||||||
- prettier (PRETTIER) - v3
|
- prettier (PRETTIER) - v3
|
||||||
|
|
||||||
|
## Skills Activation
|
||||||
|
|
||||||
|
This project has domain-specific skills available. You MUST activate the relevant skill whenever you work in that domain—don't wait until you're stuck.
|
||||||
|
|
||||||
|
- `pennant-development` — Manages feature flags with Laravel Pennant. Activates when creating, checking, or toggling feature flags; showing or hiding features conditionally; implementing A/B testing; working with @feature directive; or when the user mentions feature flags, feature toggles, Pennant, conditional features, rollouts, or gradually enabling features.
|
||||||
|
- `wayfinder-development` — Activates whenever referencing backend routes in frontend components. Use when importing from @/actions or @/routes, calling Laravel routes from TypeScript, or working with Wayfinder route functions.
|
||||||
|
- `pest-testing` — Tests applications using the Pest 4 PHP framework. Activates when writing tests, creating unit or feature tests, adding assertions, testing Livewire components, browser testing, debugging test failures, working with datasets or mocking; or when the user mentions test, spec, TDD, expects, assertion, coverage, or needs to verify functionality works.
|
||||||
|
- `inertia-react-development` — Develops Inertia.js v2 React client-side applications. Activates when creating React pages, forms, or navigation; using <Link>, <Form>, useForm, or router; working with deferred props, prefetching, or polling; or when user mentions React with Inertia, React pages, React forms, or React navigation.
|
||||||
|
- `tailwindcss-development` — Styles applications using Tailwind CSS v4 utilities. Activates when adding styles, restyling components, working with gradients, spacing, layout, flex, grid, responsive design, dark mode, colors, typography, or borders; or when the user mentions CSS, styling, classes, Tailwind, restyle, hero section, cards, buttons, or any visual/UI changes.
|
||||||
|
|
||||||
## Conventions
|
## Conventions
|
||||||
- You must follow all existing code conventions used in this application. When creating or editing a file, check sibling files for the correct structure, approach, naming.
|
|
||||||
|
- You must follow all existing code conventions used in this application. When creating or editing a file, check sibling files for the correct structure, approach, and naming.
|
||||||
- Use descriptive names for variables and methods. For example, `isRegisteredForDiscounts`, not `discount()`.
|
- Use descriptive names for variables and methods. For example, `isRegisteredForDiscounts`, not `discount()`.
|
||||||
- Check for existing components to reuse before writing a new one.
|
- Check for existing components to reuse before writing a new one.
|
||||||
|
|
||||||
## Verification Scripts
|
## Verification Scripts
|
||||||
- Do not create verification scripts or tinker when tests cover that functionality and prove it works. Unit and feature tests are more important.
|
|
||||||
|
- Do not create verification scripts or tinker when tests cover that functionality and prove they work. Unit and feature tests are more important.
|
||||||
|
|
||||||
## Application Structure & Architecture
|
## Application Structure & Architecture
|
||||||
- Stick to existing directory structure - don't create new base folders without approval.
|
|
||||||
|
- Stick to existing directory structure; don't create new base folders without approval.
|
||||||
- Do not change the application's dependencies without approval.
|
- Do not change the application's dependencies without approval.
|
||||||
|
|
||||||
## Frontend Bundling
|
## Frontend Bundling
|
||||||
|
|
||||||
- If the user doesn't see a frontend change reflected in the UI, it could mean they need to run `npm run build`, `npm run dev`, or `composer run dev`. Ask them.
|
- If the user doesn't see a frontend change reflected in the UI, it could mean they need to run `npm run build`, `npm run dev`, or `composer run dev`. Ask them.
|
||||||
|
|
||||||
## Replies
|
|
||||||
- Be concise in your explanations - focus on what's important rather than explaining obvious details.
|
|
||||||
|
|
||||||
## Documentation Files
|
## Documentation Files
|
||||||
|
|
||||||
- You must only create documentation files if explicitly requested by the user.
|
- You must only create documentation files if explicitly requested by the user.
|
||||||
|
|
||||||
|
## Replies
|
||||||
|
|
||||||
|
- Be concise in your explanations - focus on what's important rather than explaining obvious details.
|
||||||
|
|
||||||
=== boost rules ===
|
=== boost rules ===
|
||||||
|
|
||||||
## Laravel Boost
|
# Laravel Boost
|
||||||
|
|
||||||
- Laravel Boost is an MCP server that comes with powerful tools designed specifically for this application. Use them.
|
- Laravel Boost is an MCP server that comes with powerful tools designed specifically for this application. Use them.
|
||||||
|
|
||||||
## Artisan
|
## Artisan
|
||||||
- Use the `list-artisan-commands` tool when you need to call an Artisan command to double check the available parameters.
|
|
||||||
|
- Use the `list-artisan-commands` tool when you need to call an Artisan command to double-check the available parameters.
|
||||||
|
|
||||||
## URLs
|
## URLs
|
||||||
- Whenever you share a project URL with the user you should use the `get-absolute-url` tool to ensure you're using the correct scheme, domain / IP, and port.
|
|
||||||
|
- Whenever you share a project URL with the user, you should use the `get-absolute-url` tool to ensure you're using the correct scheme, domain/IP, and port.
|
||||||
|
|
||||||
## Tinker / Debugging
|
## Tinker / Debugging
|
||||||
|
|
||||||
- You should use the `tinker` tool when you need to execute PHP to debug code or query Eloquent models directly.
|
- You should use the `tinker` tool when you need to execute PHP to debug code or query Eloquent models directly.
|
||||||
- Use the `database-query` tool when you only need to read from the database.
|
- Use the `database-query` tool when you only need to read from the database.
|
||||||
|
|
||||||
## Reading Browser Logs With the `browser-logs` Tool
|
## Reading Browser Logs With the `browser-logs` Tool
|
||||||
|
|
||||||
- You can read browser logs, errors, and exceptions using the `browser-logs` tool from Boost.
|
- You can read browser logs, errors, and exceptions using the `browser-logs` tool from Boost.
|
||||||
- Only recent browser logs will be useful - ignore old logs.
|
- Only recent browser logs will be useful - ignore old logs.
|
||||||
|
|
||||||
## Searching Documentation (Critically Important)
|
## Searching Documentation (Critically Important)
|
||||||
- Boost comes with a powerful `search-docs` tool you should use before any other approaches. This tool automatically passes a list of installed packages and their versions to the remote Boost API, so it returns only version-specific documentation specific for the user's circumstance. You should pass an array of packages to filter on if you know you need docs for particular packages.
|
|
||||||
- The 'search-docs' tool is perfect for all Laravel related packages, including Laravel, Inertia, Livewire, Filament, Tailwind, Pest, Nova, Nightwatch, etc.
|
- Boost comes with a powerful `search-docs` tool you should use before trying other approaches when working with Laravel or Laravel ecosystem packages. This tool automatically passes a list of installed packages and their versions to the remote Boost API, so it returns only version-specific documentation for the user's circumstance. You should pass an array of packages to filter on if you know you need docs for particular packages.
|
||||||
- You must use this tool to search for Laravel-ecosystem documentation before falling back to other approaches.
|
|
||||||
- Search the documentation before making code changes to ensure we are taking the correct approach.
|
- Search the documentation before making code changes to ensure we are taking the correct approach.
|
||||||
- Use multiple, broad, simple, topic based queries to start. For example: `['rate limiting', 'routing rate limiting', 'routing']`.
|
- Use multiple, broad, simple, topic-based queries at once. For example: `['rate limiting', 'routing rate limiting', 'routing']`. The most relevant results will be returned first.
|
||||||
- Do not add package names to queries - package information is already shared. For example, use `test resource table`, not `filament 4 test resource table`.
|
- Do not add package names to queries; package information is already shared. For example, use `test resource table`, not `filament 4 test resource table`.
|
||||||
|
|
||||||
### Available Search Syntax
|
### Available Search Syntax
|
||||||
- You can and should pass multiple queries at once. The most relevant results will be returned first.
|
|
||||||
|
|
||||||
1. Simple Word Searches with auto-stemming - query=authentication - finds 'authenticate' and 'auth'
|
|
||||||
2. Multiple Words (AND Logic) - query=rate limit - finds knowledge containing both "rate" AND "limit"
|
|
||||||
3. Quoted Phrases (Exact Position) - query="infinite scroll" - Words must be adjacent and in that order
|
|
||||||
4. Mixed Queries - query=middleware "rate limit" - "middleware" AND exact phrase "rate limit"
|
|
||||||
5. Multiple Queries - queries=["authentication", "middleware"] - ANY of these terms
|
|
||||||
|
|
||||||
|
1. Simple Word Searches with auto-stemming - query=authentication - finds 'authenticate' and 'auth'.
|
||||||
|
2. Multiple Words (AND Logic) - query=rate limit - finds knowledge containing both "rate" AND "limit".
|
||||||
|
3. Quoted Phrases (Exact Position) - query="infinite scroll" - words must be adjacent and in that order.
|
||||||
|
4. Mixed Queries - query=middleware "rate limit" - "middleware" AND exact phrase "rate limit".
|
||||||
|
5. Multiple Queries - queries=["authentication", "middleware"] - ANY of these terms.
|
||||||
|
|
||||||
=== php rules ===
|
=== php rules ===
|
||||||
|
|
||||||
## PHP
|
# PHP
|
||||||
|
|
||||||
- Always use curly braces for control structures, even if it has one line.
|
- Always use curly braces for control structures, even for single-line bodies.
|
||||||
|
|
||||||
|
## Constructors
|
||||||
|
|
||||||
### Constructors
|
|
||||||
- Use PHP 8 constructor property promotion in `__construct()`.
|
- Use PHP 8 constructor property promotion in `__construct()`.
|
||||||
- <code-snippet>public function __construct(public GitHub $github) { }</code-snippet>
|
- <code-snippet>public function __construct(public GitHub $github) { }</code-snippet>
|
||||||
- Do not allow empty `__construct()` methods with zero parameters.
|
- Do not allow empty `__construct()` methods with zero parameters unless the constructor is private.
|
||||||
|
|
||||||
|
## Type Declarations
|
||||||
|
|
||||||
### Type Declarations
|
|
||||||
- Always use explicit return type declarations for methods and functions.
|
- Always use explicit return type declarations for methods and functions.
|
||||||
- Use appropriate PHP type hints for method parameters.
|
- Use appropriate PHP type hints for method parameters.
|
||||||
|
|
||||||
|
|
@ -111,411 +132,172 @@ protected function isAccessible(User $user, ?string $path = null): bool
|
||||||
}
|
}
|
||||||
</code-snippet>
|
</code-snippet>
|
||||||
|
|
||||||
## Comments
|
|
||||||
- Prefer PHPDoc blocks over comments. Never use comments within the code itself unless there is something _very_ complex going on.
|
|
||||||
|
|
||||||
## PHPDoc Blocks
|
|
||||||
- Add useful array shape type definitions for arrays when appropriate.
|
|
||||||
|
|
||||||
## Enums
|
## Enums
|
||||||
|
|
||||||
- Typically, keys in an Enum should be TitleCase. For example: `FavoritePerson`, `BestLake`, `Monthly`.
|
- Typically, keys in an Enum should be TitleCase. For example: `FavoritePerson`, `BestLake`, `Monthly`.
|
||||||
|
|
||||||
|
## Comments
|
||||||
|
|
||||||
|
- Prefer PHPDoc blocks over inline comments. Never use comments within the code itself unless the logic is exceptionally complex.
|
||||||
|
|
||||||
|
## PHPDoc Blocks
|
||||||
|
|
||||||
|
- Add useful array shape type definitions when appropriate.
|
||||||
|
|
||||||
|
=== tests rules ===
|
||||||
|
|
||||||
|
# Test Enforcement
|
||||||
|
|
||||||
|
- Every change must be programmatically tested. Write a new test or update an existing test, then run the affected tests to make sure they pass.
|
||||||
|
- Run the minimum number of tests needed to ensure code quality and speed. Use `php artisan test --compact` with a specific filename or filter.
|
||||||
|
|
||||||
=== inertia-laravel/core rules ===
|
=== inertia-laravel/core rules ===
|
||||||
|
|
||||||
## Inertia Core
|
# Inertia
|
||||||
|
|
||||||
- Inertia.js components should be placed in the `resources/js/Pages` directory unless specified differently in the JS bundler (vite.config.js).
|
|
||||||
- Use `Inertia::render()` for server-side routing instead of traditional Blade views.
|
|
||||||
- Use `search-docs` for accurate guidance on all things Inertia.
|
|
||||||
|
|
||||||
<code-snippet lang="php" name="Inertia::render Example">
|
|
||||||
// routes/web.php example
|
|
||||||
Route::get('/users', function () {
|
|
||||||
return Inertia::render('Users/Index', [
|
|
||||||
'users' => User::all()
|
|
||||||
]);
|
|
||||||
});
|
|
||||||
</code-snippet>
|
|
||||||
|
|
||||||
|
- Inertia creates fully client-side rendered SPAs without modern SPA complexity, leveraging existing server-side patterns.
|
||||||
|
- Components live in `resources/js/Pages` (unless specified in `vite.config.js`). Use `Inertia::render()` for server-side routing instead of Blade views.
|
||||||
|
- ALWAYS use `search-docs` tool for version-specific Inertia documentation and updated code examples.
|
||||||
|
- IMPORTANT: Activate `inertia-react-development` when working with Inertia client-side patterns.
|
||||||
|
|
||||||
=== inertia-laravel/v2 rules ===
|
=== inertia-laravel/v2 rules ===
|
||||||
|
|
||||||
## Inertia v2
|
# Inertia v2
|
||||||
|
|
||||||
- Make use of all Inertia features from v1 & v2. Check the documentation before making any changes to ensure we are taking the correct approach.
|
|
||||||
|
|
||||||
### Inertia v2 New Features
|
|
||||||
- Polling
|
|
||||||
- Prefetching
|
|
||||||
- Deferred props
|
|
||||||
- Infinite scrolling using merging props and `WhenVisible`
|
|
||||||
- Lazy loading data on scroll
|
|
||||||
|
|
||||||
### Deferred Props & Empty States
|
|
||||||
- When using deferred props on the frontend, you should add a nice empty state with pulsing / animated skeleton.
|
|
||||||
|
|
||||||
### Inertia Form General Guidance
|
|
||||||
- The recommended way to build forms when using Inertia is with the `<Form>` component - a useful example is below. Use `search-docs` with a query of `form component` for guidance.
|
|
||||||
- Forms can also be built using the `useForm` helper for more programmatic control, or to follow existing conventions. Use `search-docs` with a query of `useForm helper` for guidance.
|
|
||||||
- `resetOnError`, `resetOnSuccess`, and `setDefaultsOnSuccess` are available on the `<Form>` component. Use `search-docs` with a query of 'form component resetting' for guidance.
|
|
||||||
|
|
||||||
|
- Use all Inertia features from v1 and v2. Check the documentation before making changes to ensure the correct approach.
|
||||||
|
- New features: deferred props, infinite scrolling (merging props + `WhenVisible`), lazy loading on scroll, polling, prefetching.
|
||||||
|
- When using deferred props, add an empty state with a pulsing or animated skeleton.
|
||||||
|
|
||||||
=== laravel/core rules ===
|
=== laravel/core rules ===
|
||||||
|
|
||||||
## Do Things the Laravel Way
|
# Do Things the Laravel Way
|
||||||
|
|
||||||
- Use `php artisan make:` commands to create new files (i.e. migrations, controllers, models, etc.). You can list available Artisan commands using the `list-artisan-commands` tool.
|
- Use `php artisan make:` commands to create new files (i.e. migrations, controllers, models, etc.). You can list available Artisan commands using the `list-artisan-commands` tool.
|
||||||
- If you're creating a generic PHP class, use `artisan make:class`.
|
- If you're creating a generic PHP class, use `php artisan make:class`.
|
||||||
- Pass `--no-interaction` to all Artisan commands to ensure they work without user input. You should also pass the correct `--options` to ensure correct behavior.
|
- Pass `--no-interaction` to all Artisan commands to ensure they work without user input. You should also pass the correct `--options` to ensure correct behavior.
|
||||||
|
|
||||||
### Database
|
## Database
|
||||||
|
|
||||||
- Always use proper Eloquent relationship methods with return type hints. Prefer relationship methods over raw queries or manual joins.
|
- Always use proper Eloquent relationship methods with return type hints. Prefer relationship methods over raw queries or manual joins.
|
||||||
- Use Eloquent models and relationships before suggesting raw database queries
|
- Use Eloquent models and relationships before suggesting raw database queries.
|
||||||
- Avoid `DB::`; prefer `Model::query()`. Generate code that leverages Laravel's ORM capabilities rather than bypassing them.
|
- Avoid `DB::`; prefer `Model::query()`. Generate code that leverages Laravel's ORM capabilities rather than bypassing them.
|
||||||
- Generate code that prevents N+1 query problems by using eager loading.
|
- Generate code that prevents N+1 query problems by using eager loading.
|
||||||
- Use Laravel's query builder for very complex database operations.
|
- Use Laravel's query builder for very complex database operations.
|
||||||
|
|
||||||
### Model Creation
|
### Model Creation
|
||||||
|
|
||||||
- When creating new models, create useful factories and seeders for them too. Ask the user if they need any other things, using `list-artisan-commands` to check the available options to `php artisan make:model`.
|
- When creating new models, create useful factories and seeders for them too. Ask the user if they need any other things, using `list-artisan-commands` to check the available options to `php artisan make:model`.
|
||||||
|
|
||||||
### APIs & Eloquent Resources
|
### APIs & Eloquent Resources
|
||||||
|
|
||||||
- For APIs, default to using Eloquent API Resources and API versioning unless existing API routes do not, then you should follow existing application convention.
|
- For APIs, default to using Eloquent API Resources and API versioning unless existing API routes do not, then you should follow existing application convention.
|
||||||
|
|
||||||
### Controllers & Validation
|
## Controllers & Validation
|
||||||
|
|
||||||
- Always create Form Request classes for validation rather than inline validation in controllers. Include both validation rules and custom error messages.
|
- Always create Form Request classes for validation rather than inline validation in controllers. Include both validation rules and custom error messages.
|
||||||
- Check sibling Form Requests to see if the application uses array or string based validation rules.
|
- Check sibling Form Requests to see if the application uses array or string based validation rules.
|
||||||
|
|
||||||
### Queues
|
## Authentication & Authorization
|
||||||
- Use queued jobs for time-consuming operations with the `ShouldQueue` interface.
|
|
||||||
|
|
||||||
### Authentication & Authorization
|
|
||||||
- Use Laravel's built-in authentication and authorization features (gates, policies, Sanctum, etc.).
|
- Use Laravel's built-in authentication and authorization features (gates, policies, Sanctum, etc.).
|
||||||
|
|
||||||
### URL Generation
|
## URL Generation
|
||||||
|
|
||||||
- When generating links to other pages, prefer named routes and the `route()` function.
|
- When generating links to other pages, prefer named routes and the `route()` function.
|
||||||
|
|
||||||
### Configuration
|
## Queues
|
||||||
|
|
||||||
|
- Use queued jobs for time-consuming operations with the `ShouldQueue` interface.
|
||||||
|
|
||||||
|
## Configuration
|
||||||
|
|
||||||
- Use environment variables only in configuration files - never use the `env()` function directly outside of config files. Always use `config('app.name')`, not `env('APP_NAME')`.
|
- Use environment variables only in configuration files - never use the `env()` function directly outside of config files. Always use `config('app.name')`, not `env('APP_NAME')`.
|
||||||
|
|
||||||
### Testing
|
## Testing
|
||||||
|
|
||||||
- When creating models for tests, use the factories for the models. Check if the factory has custom states that can be used before manually setting up the model.
|
- When creating models for tests, use the factories for the models. Check if the factory has custom states that can be used before manually setting up the model.
|
||||||
- Faker: Use methods such as `$this->faker->word()` or `fake()->randomDigit()`. Follow existing conventions whether to use `$this->faker` or `fake()`.
|
- Faker: Use methods such as `$this->faker->word()` or `fake()->randomDigit()`. Follow existing conventions whether to use `$this->faker` or `fake()`.
|
||||||
- When creating tests, make use of `php artisan make:test [options] <name>` to create a feature test, and pass `--unit` to create a unit test. Most tests should be feature tests.
|
- When creating tests, make use of `php artisan make:test [options] {name}` to create a feature test, and pass `--unit` to create a unit test. Most tests should be feature tests.
|
||||||
|
|
||||||
|
## Vite Error
|
||||||
|
|
||||||
### Vite Error
|
|
||||||
- If you receive an "Illuminate\Foundation\ViteException: Unable to locate file in Vite manifest" error, you can run `npm run build` or ask the user to run `npm run dev` or `composer run dev`.
|
- If you receive an "Illuminate\Foundation\ViteException: Unable to locate file in Vite manifest" error, you can run `npm run build` or ask the user to run `npm run dev` or `composer run dev`.
|
||||||
|
|
||||||
|
|
||||||
=== laravel/v12 rules ===
|
=== laravel/v12 rules ===
|
||||||
|
|
||||||
## Laravel 12
|
# Laravel 12
|
||||||
|
|
||||||
- Use the `search-docs` tool to get version specific documentation.
|
- CRITICAL: ALWAYS use `search-docs` tool for version-specific Laravel documentation and updated code examples.
|
||||||
- Since Laravel 11, Laravel has a new streamlined file structure which this project uses.
|
- Since Laravel 11, Laravel has a new streamlined file structure which this project uses.
|
||||||
|
|
||||||
### Laravel 12 Structure
|
## Laravel 12 Structure
|
||||||
- No middleware files in `app/Http/Middleware/`.
|
|
||||||
|
- In Laravel 12, middleware are no longer registered in `app/Http/Kernel.php`.
|
||||||
|
- Middleware are configured declaratively in `bootstrap/app.php` using `Application::configure()->withMiddleware()`.
|
||||||
- `bootstrap/app.php` is the file to register middleware, exceptions, and routing files.
|
- `bootstrap/app.php` is the file to register middleware, exceptions, and routing files.
|
||||||
- `bootstrap/providers.php` contains application specific service providers.
|
- `bootstrap/providers.php` contains application specific service providers.
|
||||||
- **No app\Console\Kernel.php** - use `bootstrap/app.php` or `routes/console.php` for console configuration.
|
- The `app\Console\Kernel.php` file no longer exists; use `bootstrap/app.php` or `routes/console.php` for console configuration.
|
||||||
- **Commands auto-register** - files in `app/Console/Commands/` are automatically available and do not require manual registration.
|
- Console commands in `app/Console/Commands/` are automatically available and do not require manual registration.
|
||||||
|
|
||||||
|
## Database
|
||||||
|
|
||||||
### Database
|
|
||||||
- When modifying a column, the migration must include all of the attributes that were previously defined on the column. Otherwise, they will be dropped and lost.
|
- When modifying a column, the migration must include all of the attributes that were previously defined on the column. Otherwise, they will be dropped and lost.
|
||||||
- Laravel 11 allows limiting eagerly loaded records natively, without external packages: `$query->latest()->limit(10);`.
|
- Laravel 12 allows limiting eagerly loaded records natively, without external packages: `$query->latest()->limit(10);`.
|
||||||
|
|
||||||
### Models
|
### Models
|
||||||
|
|
||||||
- Casts can and likely should be set in a `casts()` method on a model rather than the `$casts` property. Follow existing conventions from other models.
|
- Casts can and likely should be set in a `casts()` method on a model rather than the `$casts` property. Follow existing conventions from other models.
|
||||||
|
|
||||||
|
=== pennant/core rules ===
|
||||||
|
|
||||||
|
# Laravel Pennant
|
||||||
|
|
||||||
|
- This application uses Laravel Pennant for feature flag management, providing a flexible system for controlling feature availability across different organizations and user types.
|
||||||
|
- IMPORTANT: Always use `search-docs` tool for version-specific Pennant documentation and updated code examples.
|
||||||
|
- IMPORTANT: Activate `pennant-development` every time you're working with a Pennant or feature-flag-related task.
|
||||||
|
|
||||||
=== wayfinder/core rules ===
|
=== wayfinder/core rules ===
|
||||||
|
|
||||||
## Laravel Wayfinder
|
# Laravel Wayfinder
|
||||||
|
|
||||||
Wayfinder generates TypeScript functions and types for Laravel controllers and routes which you can import into your client side code. It provides type safety and automatic synchronization between backend routes and frontend code.
|
Wayfinder generates TypeScript functions for Laravel routes. Import from `@/actions/` (controllers) or `@/routes/` (named routes).
|
||||||
|
|
||||||
### Development Guidelines
|
|
||||||
- Always use `search-docs` to check wayfinder correct usage before implementing any features.
|
|
||||||
- Always Prefer named imports for tree-shaking (e.g., `import { show } from '@/actions/...'`)
|
|
||||||
- Avoid default controller imports (prevents tree-shaking)
|
|
||||||
- Run `wayfinder:generate` after route changes if Vite plugin isn't installed
|
|
||||||
|
|
||||||
### Feature Overview
|
|
||||||
- Form Support: Use `.form()` with `--with-form` flag for HTML form attributes — `<form {...store.form()}>` → `action="/posts" method="post"`
|
|
||||||
- HTTP Methods: Call `.get()`, `.post()`, `.patch()`, `.put()`, `.delete()` for specific methods — `show.head(1)` → `{ url: "/posts/1", method: "head" }`
|
|
||||||
- Invokable Controllers: Import and invoke directly as functions. For example, `import StorePost from '@/actions/.../StorePostController'; StorePost()`
|
|
||||||
- Named Routes: Import from `@/routes/` for non-controller routes. For example, `import { show } from '@/routes/post'; show(1)` for route name `post.show`
|
|
||||||
- Parameter Binding: Detects route keys (e.g., `{post:slug}`) and accepts matching object properties — `show("my-post")` or `show({ slug: "my-post" })`
|
|
||||||
- Query Merging: Use `mergeQuery` to merge with `window.location.search`, set values to `null` to remove — `show(1, { mergeQuery: { page: 2, sort: null } })`
|
|
||||||
- Query Parameters: Pass `{ query: {...} }` in options to append params — `show(1, { query: { page: 1 } })` → `"/posts/1?page=1"`
|
|
||||||
- Route Objects: Functions return `{ url, method }` shaped objects — `show(1)` → `{ url: "/posts/1", method: "get" }`
|
|
||||||
- URL Extraction: Use `.url()` to get URL string — `show.url(1)` → `"/posts/1"`
|
|
||||||
|
|
||||||
### Example Usage
|
|
||||||
|
|
||||||
<code-snippet name="Wayfinder Basic Usage" lang="typescript">
|
|
||||||
// Import controller methods (tree-shakable)
|
|
||||||
import { show, store, update } from '@/actions/App/Http/Controllers/PostController'
|
|
||||||
|
|
||||||
// Get route object with URL and method...
|
|
||||||
show(1) // { url: "/posts/1", method: "get" }
|
|
||||||
|
|
||||||
// Get just the URL...
|
|
||||||
show.url(1) // "/posts/1"
|
|
||||||
|
|
||||||
// Use specific HTTP methods...
|
|
||||||
show.get(1) // { url: "/posts/1", method: "get" }
|
|
||||||
show.head(1) // { url: "/posts/1", method: "head" }
|
|
||||||
|
|
||||||
// Import named routes...
|
|
||||||
import { show as postShow } from '@/routes/post' // For route name 'post.show'
|
|
||||||
postShow(1) // { url: "/posts/1", method: "get" }
|
|
||||||
</code-snippet>
|
|
||||||
|
|
||||||
|
|
||||||
### Wayfinder + Inertia
|
|
||||||
If your application uses the `<Form>` component from Inertia, you can use Wayfinder to generate form action and method automatically.
|
|
||||||
<code-snippet name="Wayfinder Form Component (React)" lang="typescript">
|
|
||||||
|
|
||||||
<Form {...store.form()}><input name="title" /></Form>
|
|
||||||
|
|
||||||
</code-snippet>
|
|
||||||
|
|
||||||
|
- IMPORTANT: Activate `wayfinder-development` skill whenever referencing backend routes in frontend components.
|
||||||
|
- Invokable Controllers: `import StorePost from '@/actions/.../StorePostController'; StorePost()`.
|
||||||
|
- Parameter Binding: Detects route keys (`{post:slug}`) — `show({ slug: "my-post" })`.
|
||||||
|
- Query Merging: `show(1, { mergeQuery: { page: 2, sort: null } })` merges with current URL, `null` removes params.
|
||||||
|
- Inertia: Use `.form()` with `<Form>` component or `form.submit(store())` with useForm.
|
||||||
|
|
||||||
=== pint/core rules ===
|
=== pint/core rules ===
|
||||||
|
|
||||||
## Laravel Pint Code Formatter
|
# Laravel Pint Code Formatter
|
||||||
|
|
||||||
- You must run `vendor/bin/pint --dirty` before finalizing changes to ensure your code matches the project's expected style.
|
- You must run `vendor/bin/pint --dirty` before finalizing changes to ensure your code matches the project's expected style.
|
||||||
- Do not run `vendor/bin/pint --test`, simply run `vendor/bin/pint` to fix any formatting issues.
|
- Do not run `vendor/bin/pint --test`, simply run `vendor/bin/pint` to fix any formatting issues.
|
||||||
|
|
||||||
|
|
||||||
=== pest/core rules ===
|
=== pest/core rules ===
|
||||||
|
|
||||||
## Pest
|
## Pest
|
||||||
|
|
||||||
### Testing
|
- This project uses Pest for testing. Create tests: `php artisan make:test --pest {name}`.
|
||||||
- If you need to verify a feature is working, write or update a Unit / Feature test.
|
- Run tests: `php artisan test --compact` or filter: `php artisan test --compact --filter=testName`.
|
||||||
|
- Do NOT delete tests without approval.
|
||||||
### Pest Tests
|
- CRITICAL: ALWAYS use `search-docs` tool for version-specific Pest documentation and updated code examples.
|
||||||
- All tests must be written using Pest. Use `php artisan make:test --pest <name>`.
|
- IMPORTANT: Activate `pest-testing` every time you're working with a Pest or testing-related task.
|
||||||
- You must not remove any tests or test files from the tests directory without approval. These are not temporary or helper files - these are core to the application.
|
|
||||||
- Tests should test all of the happy paths, failure paths, and weird paths.
|
|
||||||
- Tests live in the `tests/Feature` and `tests/Unit` directories.
|
|
||||||
- Pest tests look and behave like this:
|
|
||||||
<code-snippet name="Basic Pest Test Example" lang="php">
|
|
||||||
it('is true', function () {
|
|
||||||
expect(true)->toBeTrue();
|
|
||||||
});
|
|
||||||
</code-snippet>
|
|
||||||
|
|
||||||
### Running Tests
|
|
||||||
- Run the minimal number of tests using an appropriate filter before finalizing code edits.
|
|
||||||
- To run all tests: `php artisan test`.
|
|
||||||
- To run all tests in a file: `php artisan test tests/Feature/ExampleTest.php`.
|
|
||||||
- To filter on a particular test name: `php artisan test --filter=testName` (recommended after making a change to a related file).
|
|
||||||
- When the tests relating to your changes are passing, ask the user if they would like to run the entire test suite to ensure everything is still passing.
|
|
||||||
|
|
||||||
### Pest Assertions
|
|
||||||
- When asserting status codes on a response, use the specific method like `assertForbidden` and `assertNotFound` instead of using `assertStatus(403)` or similar, e.g.:
|
|
||||||
<code-snippet name="Pest Example Asserting postJson Response" lang="php">
|
|
||||||
it('returns all', function () {
|
|
||||||
$response = $this->postJson('/api/docs', []);
|
|
||||||
|
|
||||||
$response->assertSuccessful();
|
|
||||||
});
|
|
||||||
</code-snippet>
|
|
||||||
|
|
||||||
### Mocking
|
|
||||||
- Mocking can be very helpful when appropriate.
|
|
||||||
- When mocking, you can use the `Pest\Laravel\mock` Pest function, but always import it via `use function Pest\Laravel\mock;` before using it. Alternatively, you can use `$this->mock()` if existing tests do.
|
|
||||||
- You can also create partial mocks using the same import or self method.
|
|
||||||
|
|
||||||
### Datasets
|
|
||||||
- Use datasets in Pest to simplify tests which have a lot of duplicated data. This is often the case when testing validation rules, so consider going with this solution when writing tests for validation rules.
|
|
||||||
|
|
||||||
<code-snippet name="Pest Dataset Example" lang="php">
|
|
||||||
it('has emails', function (string $email) {
|
|
||||||
expect($email)->not->toBeEmpty();
|
|
||||||
})->with([
|
|
||||||
'james' => 'james@laravel.com',
|
|
||||||
'taylor' => 'taylor@laravel.com',
|
|
||||||
]);
|
|
||||||
</code-snippet>
|
|
||||||
|
|
||||||
|
|
||||||
=== pest/v4 rules ===
|
|
||||||
|
|
||||||
## Pest 4
|
|
||||||
|
|
||||||
- Pest v4 is a huge upgrade to Pest and offers: browser testing, smoke testing, visual regression testing, test sharding, and faster type coverage.
|
|
||||||
- Browser testing is incredibly powerful and useful for this project.
|
|
||||||
- Browser tests should live in `tests/Browser/`.
|
|
||||||
- Use the `search-docs` tool for detailed guidance on utilizing these features.
|
|
||||||
|
|
||||||
### Browser Testing
|
|
||||||
- You can use Laravel features like `Event::fake()`, `assertAuthenticated()`, and model factories within Pest v4 browser tests, as well as `RefreshDatabase` (when needed) to ensure a clean state for each test.
|
|
||||||
- Interact with the page (click, type, scroll, select, submit, drag-and-drop, touch gestures, etc.) when appropriate to complete the test.
|
|
||||||
- If requested, test on multiple browsers (Chrome, Firefox, Safari).
|
|
||||||
- If requested, test on different devices and viewports (like iPhone 14 Pro, tablets, or custom breakpoints).
|
|
||||||
- Switch color schemes (light/dark mode) when appropriate.
|
|
||||||
- Take screenshots or pause tests for debugging when appropriate.
|
|
||||||
|
|
||||||
### Example Tests
|
|
||||||
|
|
||||||
<code-snippet name="Pest Browser Test Example" lang="php">
|
|
||||||
it('may reset the password', function () {
|
|
||||||
Notification::fake();
|
|
||||||
|
|
||||||
$this->actingAs(User::factory()->create());
|
|
||||||
|
|
||||||
$page = visit('/sign-in'); // Visit on a real browser...
|
|
||||||
|
|
||||||
$page->assertSee('Sign In')
|
|
||||||
->assertNoJavascriptErrors() // or ->assertNoConsoleLogs()
|
|
||||||
->click('Forgot Password?')
|
|
||||||
->fill('email', 'nuno@laravel.com')
|
|
||||||
->click('Send Reset Link')
|
|
||||||
->assertSee('We have emailed your password reset link!')
|
|
||||||
|
|
||||||
Notification::assertSent(ResetPassword::class);
|
|
||||||
});
|
|
||||||
</code-snippet>
|
|
||||||
|
|
||||||
<code-snippet name="Pest Smoke Testing Example" lang="php">
|
|
||||||
$pages = visit(['/', '/about', '/contact']);
|
|
||||||
|
|
||||||
$pages->assertNoJavascriptErrors()->assertNoConsoleLogs();
|
|
||||||
</code-snippet>
|
|
||||||
|
|
||||||
|
|
||||||
=== inertia-react/core rules ===
|
=== inertia-react/core rules ===
|
||||||
|
|
||||||
## Inertia + React
|
# Inertia + React
|
||||||
|
|
||||||
- Use `router.visit()` or `<Link>` for navigation instead of traditional links.
|
|
||||||
|
|
||||||
<code-snippet name="Inertia Client Navigation" lang="react">
|
|
||||||
|
|
||||||
import { Link } from '@inertiajs/react'
|
|
||||||
<Link href="/">Home</Link>
|
|
||||||
|
|
||||||
</code-snippet>
|
|
||||||
|
|
||||||
|
|
||||||
=== inertia-react/v2/forms rules ===
|
|
||||||
|
|
||||||
## Inertia + React Forms
|
|
||||||
|
|
||||||
<code-snippet name="`<Form>` Component Example" lang="react">
|
|
||||||
|
|
||||||
import { Form } from '@inertiajs/react'
|
|
||||||
|
|
||||||
export default () => (
|
|
||||||
<Form action="/users" method="post">
|
|
||||||
{({
|
|
||||||
errors,
|
|
||||||
hasErrors,
|
|
||||||
processing,
|
|
||||||
wasSuccessful,
|
|
||||||
recentlySuccessful,
|
|
||||||
clearErrors,
|
|
||||||
resetAndClearErrors,
|
|
||||||
defaults
|
|
||||||
}) => (
|
|
||||||
<>
|
|
||||||
<input type="text" name="name" />
|
|
||||||
|
|
||||||
{errors.name && <div>{errors.name}</div>}
|
|
||||||
|
|
||||||
<button type="submit" disabled={processing}>
|
|
||||||
{processing ? 'Creating...' : 'Create User'}
|
|
||||||
</button>
|
|
||||||
|
|
||||||
{wasSuccessful && <div>User created successfully!</div>}
|
|
||||||
</>
|
|
||||||
)}
|
|
||||||
</Form>
|
|
||||||
)
|
|
||||||
|
|
||||||
</code-snippet>
|
|
||||||
|
|
||||||
|
- IMPORTANT: Activate `inertia-react-development` when working with Inertia React client-side patterns.
|
||||||
|
|
||||||
=== tailwindcss/core rules ===
|
=== tailwindcss/core rules ===
|
||||||
|
|
||||||
## Tailwind Core
|
# Tailwind CSS
|
||||||
|
|
||||||
- Use Tailwind CSS classes to style HTML, check and use existing tailwind conventions within the project before writing your own.
|
|
||||||
- Offer to extract repeated patterns into components that match the project's conventions (i.e. Blade, JSX, Vue, etc..)
|
|
||||||
- Think through class placement, order, priority, and defaults - remove redundant classes, add classes to parent or child carefully to limit repetition, group elements logically
|
|
||||||
- You can use the `search-docs` tool to get exact examples from the official documentation when needed.
|
|
||||||
|
|
||||||
### Spacing
|
|
||||||
- When listing items, use gap utilities for spacing, don't use margins.
|
|
||||||
|
|
||||||
<code-snippet name="Valid Flex Gap Spacing Example" lang="html">
|
|
||||||
<div class="flex gap-8">
|
|
||||||
<div>Superior</div>
|
|
||||||
<div>Michigan</div>
|
|
||||||
<div>Erie</div>
|
|
||||||
</div>
|
|
||||||
</code-snippet>
|
|
||||||
|
|
||||||
|
|
||||||
### Dark Mode
|
|
||||||
- If existing pages and components support dark mode, new pages and components must support dark mode in a similar way, typically using `dark:`.
|
|
||||||
|
|
||||||
|
|
||||||
=== tailwindcss/v4 rules ===
|
|
||||||
|
|
||||||
## Tailwind 4
|
|
||||||
|
|
||||||
- Always use Tailwind CSS v4 - do not use the deprecated utilities.
|
|
||||||
- `corePlugins` is not supported in Tailwind v4.
|
|
||||||
- In Tailwind v4, configuration is CSS-first using the `@theme` directive — no separate `tailwind.config.js` file is needed.
|
|
||||||
<code-snippet name="Extending Theme in CSS" lang="css">
|
|
||||||
@theme {
|
|
||||||
--color-brand: oklch(0.72 0.11 178);
|
|
||||||
}
|
|
||||||
</code-snippet>
|
|
||||||
|
|
||||||
- In Tailwind v4, you import Tailwind using a regular CSS `@import` statement, not using the `@tailwind` directives used in v3:
|
|
||||||
|
|
||||||
<code-snippet name="Tailwind v4 Import Tailwind Diff" lang="diff">
|
|
||||||
- @tailwind base;
|
|
||||||
- @tailwind components;
|
|
||||||
- @tailwind utilities;
|
|
||||||
+ @import "tailwindcss";
|
|
||||||
</code-snippet>
|
|
||||||
|
|
||||||
|
|
||||||
### Replaced Utilities
|
|
||||||
- Tailwind v4 removed deprecated utilities. Do not use the deprecated option - use the replacement.
|
|
||||||
- Opacity values are still numeric.
|
|
||||||
|
|
||||||
| Deprecated | Replacement |
|
|
||||||
|------------+--------------|
|
|
||||||
| bg-opacity-* | bg-black/* |
|
|
||||||
| text-opacity-* | text-black/* |
|
|
||||||
| border-opacity-* | border-black/* |
|
|
||||||
| divide-opacity-* | divide-black/* |
|
|
||||||
| ring-opacity-* | ring-black/* |
|
|
||||||
| placeholder-opacity-* | placeholder-black/* |
|
|
||||||
| flex-shrink-* | shrink-* |
|
|
||||||
| flex-grow-* | grow-* |
|
|
||||||
| overflow-ellipsis | text-ellipsis |
|
|
||||||
| decoration-slice | box-decoration-slice |
|
|
||||||
| decoration-clone | box-decoration-clone |
|
|
||||||
|
|
||||||
|
|
||||||
=== tests rules ===
|
|
||||||
|
|
||||||
## Test Enforcement
|
|
||||||
|
|
||||||
- Every change must be programmatically tested. Write a new test or update an existing test, then run the affected tests to make sure they pass.
|
|
||||||
- Run the minimum number of tests needed to ensure code quality and speed. Use `php artisan test` with a specific filename or filter.
|
|
||||||
|
|
||||||
|
- Always use existing Tailwind conventions; check project patterns before adding new ones.
|
||||||
|
- IMPORTANT: Always use `search-docs` tool for version-specific Tailwind CSS documentation and updated code examples. Never rely on training data.
|
||||||
|
- IMPORTANT: Activate `tailwindcss-development` every time you're working with a Tailwind CSS or styling-related task.
|
||||||
|
|
||||||
=== laravel/fortify rules ===
|
=== laravel/fortify rules ===
|
||||||
|
|
||||||
|
|
@ -526,17 +308,20 @@ Fortify is a headless authentication backend that provides authentication routes
|
||||||
**Before implementing any authentication features, use the `search-docs` tool to get the latest docs for that specific feature.**
|
**Before implementing any authentication features, use the `search-docs` tool to get the latest docs for that specific feature.**
|
||||||
|
|
||||||
### Configuration & Setup
|
### Configuration & Setup
|
||||||
|
|
||||||
- Check `config/fortify.php` to see what's enabled. Use `search-docs` for detailed information on specific features.
|
- Check `config/fortify.php` to see what's enabled. Use `search-docs` for detailed information on specific features.
|
||||||
- Enable features by adding them to the `'features' => []` array: `Features::registration()`, `Features::resetPasswords()`, etc.
|
- Enable features by adding them to the `'features' => []` array: `Features::registration()`, `Features::resetPasswords()`, etc.
|
||||||
- To see the all Fortify registered routes, use the `list-routes` tool with the `only_vendor: true` and `action: "Fortify"` parameters.
|
- To see the all Fortify registered routes, use the `list-routes` tool with the `only_vendor: true` and `action: "Fortify"` parameters.
|
||||||
- Fortify includes view routes by default (login, register). Set `'views' => false` in the configuration file to disable them if you're handling views yourself.
|
- Fortify includes view routes by default (login, register). Set `'views' => false` in the configuration file to disable them if you're handling views yourself.
|
||||||
|
|
||||||
### Customization
|
### Customization
|
||||||
|
|
||||||
- Views can be customized in `FortifyServiceProvider`'s `boot()` method using `Fortify::loginView()`, `Fortify::registerView()`, etc.
|
- Views can be customized in `FortifyServiceProvider`'s `boot()` method using `Fortify::loginView()`, `Fortify::registerView()`, etc.
|
||||||
- Customize authentication logic with `Fortify::authenticateUsing()` for custom user retrieval / validation.
|
- Customize authentication logic with `Fortify::authenticateUsing()` for custom user retrieval / validation.
|
||||||
- Actions in `app/Actions/Fortify/` handle business logic (user creation, password reset, etc.). They're fully customizable, so you can modify them to change feature behavior.
|
- Actions in `app/Actions/Fortify/` handle business logic (user creation, password reset, etc.). They're fully customizable, so you can modify them to change feature behavior.
|
||||||
|
|
||||||
## Available Features
|
## Available Features
|
||||||
|
|
||||||
- `Features::registration()` for user registration.
|
- `Features::registration()` for user registration.
|
||||||
- `Features::emailVerification()` to verify new user emails.
|
- `Features::emailVerification()` to verify new user emails.
|
||||||
- `Features::twoFactorAuthentication()` for 2FA with QR codes and recovery codes.
|
- `Features::twoFactorAuthentication()` for 2FA with QR codes and recovery codes.
|
||||||
|
|
|
||||||
|
|
@ -0,0 +1,369 @@
|
||||||
|
---
|
||||||
|
name: inertia-react-development
|
||||||
|
description: >-
|
||||||
|
Develops Inertia.js v2 React client-side applications. Activates when creating
|
||||||
|
React pages, forms, or navigation; using <Link>, <Form>, useForm, or router;
|
||||||
|
working with deferred props, prefetching, or polling; or when user mentions
|
||||||
|
React with Inertia, React pages, React forms, or React navigation.
|
||||||
|
---
|
||||||
|
|
||||||
|
# Inertia React Development
|
||||||
|
|
||||||
|
## When to Apply
|
||||||
|
|
||||||
|
Activate this skill when:
|
||||||
|
|
||||||
|
- Creating or modifying React page components for Inertia
|
||||||
|
- Working with forms in React (using `<Form>` or `useForm`)
|
||||||
|
- Implementing client-side navigation with `<Link>` or `router`
|
||||||
|
- Using v2 features: deferred props, prefetching, or polling
|
||||||
|
- Building React-specific features with the Inertia protocol
|
||||||
|
|
||||||
|
## Documentation
|
||||||
|
|
||||||
|
Use `search-docs` for detailed Inertia v2 React patterns and documentation.
|
||||||
|
|
||||||
|
## Basic Usage
|
||||||
|
|
||||||
|
### Page Components Location
|
||||||
|
|
||||||
|
React page components should be placed in the `resources/js/Pages` directory.
|
||||||
|
|
||||||
|
### Page Component Structure
|
||||||
|
|
||||||
|
<code-snippet name="Basic React Page Component" lang="react">
|
||||||
|
|
||||||
|
export default function UsersIndex({ users }) {
|
||||||
|
return (
|
||||||
|
<div>
|
||||||
|
<h1>Users</h1>
|
||||||
|
<ul>
|
||||||
|
{users.map(user => <li key={user.id}>{user.name}</li>)}
|
||||||
|
</ul>
|
||||||
|
</div>
|
||||||
|
)
|
||||||
|
}
|
||||||
|
|
||||||
|
</code-snippet>
|
||||||
|
|
||||||
|
## Client-Side Navigation
|
||||||
|
|
||||||
|
### Basic Link Component
|
||||||
|
|
||||||
|
Use `<Link>` for client-side navigation instead of traditional `<a>` tags:
|
||||||
|
|
||||||
|
<code-snippet name="Inertia React Navigation" lang="react">
|
||||||
|
|
||||||
|
import { Link, router } from '@inertiajs/react'
|
||||||
|
|
||||||
|
<Link href="/">Home</Link>
|
||||||
|
<Link href="/users">Users</Link>
|
||||||
|
<Link href={`/users/${user.id}`}>View User</Link>
|
||||||
|
|
||||||
|
</code-snippet>
|
||||||
|
|
||||||
|
### Link with Method
|
||||||
|
|
||||||
|
<code-snippet name="Link with POST Method" lang="react">
|
||||||
|
|
||||||
|
import { Link } from '@inertiajs/react'
|
||||||
|
|
||||||
|
<Link href="/logout" method="post" as="button">
|
||||||
|
Logout
|
||||||
|
</Link>
|
||||||
|
|
||||||
|
</code-snippet>
|
||||||
|
|
||||||
|
### Prefetching
|
||||||
|
|
||||||
|
Prefetch pages to improve perceived performance:
|
||||||
|
|
||||||
|
<code-snippet name="Prefetch on Hover" lang="react">
|
||||||
|
|
||||||
|
import { Link } from '@inertiajs/react'
|
||||||
|
|
||||||
|
<Link href="/users" prefetch>
|
||||||
|
Users
|
||||||
|
</Link>
|
||||||
|
|
||||||
|
</code-snippet>
|
||||||
|
|
||||||
|
### Programmatic Navigation
|
||||||
|
|
||||||
|
<code-snippet name="Router Visit" lang="react">
|
||||||
|
|
||||||
|
import { router } from '@inertiajs/react'
|
||||||
|
|
||||||
|
function handleClick() {
|
||||||
|
router.visit('/users')
|
||||||
|
}
|
||||||
|
|
||||||
|
// Or with options
|
||||||
|
router.visit('/users', {
|
||||||
|
method: 'post',
|
||||||
|
data: { name: 'John' },
|
||||||
|
onSuccess: () => console.log('Success!'),
|
||||||
|
})
|
||||||
|
|
||||||
|
</code-snippet>
|
||||||
|
|
||||||
|
## Form Handling
|
||||||
|
|
||||||
|
### Form Component (Recommended)
|
||||||
|
|
||||||
|
The recommended way to build forms is with the `<Form>` component:
|
||||||
|
|
||||||
|
<code-snippet name="Form Component Example" lang="react">
|
||||||
|
|
||||||
|
import { Form } from '@inertiajs/react'
|
||||||
|
|
||||||
|
export default function CreateUser() {
|
||||||
|
return (
|
||||||
|
<Form action="/users" method="post">
|
||||||
|
{({ errors, processing, wasSuccessful }) => (
|
||||||
|
<>
|
||||||
|
<input type="text" name="name" />
|
||||||
|
{errors.name && <div>{errors.name}</div>}
|
||||||
|
|
||||||
|
<input type="email" name="email" />
|
||||||
|
{errors.email && <div>{errors.email}</div>}
|
||||||
|
|
||||||
|
<button type="submit" disabled={processing}>
|
||||||
|
{processing ? 'Creating...' : 'Create User'}
|
||||||
|
</button>
|
||||||
|
|
||||||
|
{wasSuccessful && <div>User created!</div>}
|
||||||
|
</>
|
||||||
|
)}
|
||||||
|
</Form>
|
||||||
|
)
|
||||||
|
}
|
||||||
|
|
||||||
|
</code-snippet>
|
||||||
|
|
||||||
|
### Form Component With All Props
|
||||||
|
|
||||||
|
<code-snippet name="Form Component Full Example" lang="react">
|
||||||
|
|
||||||
|
import { Form } from '@inertiajs/react'
|
||||||
|
|
||||||
|
<Form action="/users" method="post">
|
||||||
|
{({
|
||||||
|
errors,
|
||||||
|
hasErrors,
|
||||||
|
processing,
|
||||||
|
progress,
|
||||||
|
wasSuccessful,
|
||||||
|
recentlySuccessful,
|
||||||
|
clearErrors,
|
||||||
|
resetAndClearErrors,
|
||||||
|
defaults,
|
||||||
|
isDirty,
|
||||||
|
reset,
|
||||||
|
submit
|
||||||
|
}) => (
|
||||||
|
<>
|
||||||
|
<input type="text" name="name" defaultValue={defaults.name} />
|
||||||
|
{errors.name && <div>{errors.name}</div>}
|
||||||
|
|
||||||
|
<button type="submit" disabled={processing}>
|
||||||
|
{processing ? 'Saving...' : 'Save'}
|
||||||
|
</button>
|
||||||
|
|
||||||
|
{progress && (
|
||||||
|
<progress value={progress.percentage} max="100">
|
||||||
|
{progress.percentage}%
|
||||||
|
</progress>
|
||||||
|
)}
|
||||||
|
|
||||||
|
{wasSuccessful && <div>Saved!</div>}
|
||||||
|
</>
|
||||||
|
)}
|
||||||
|
</Form>
|
||||||
|
|
||||||
|
</code-snippet>
|
||||||
|
|
||||||
|
### Form Component Reset Props
|
||||||
|
|
||||||
|
The `<Form>` component supports automatic resetting:
|
||||||
|
|
||||||
|
- `resetOnError` - Reset form data when the request fails
|
||||||
|
- `resetOnSuccess` - Reset form data when the request succeeds
|
||||||
|
- `setDefaultsOnSuccess` - Update default values on success
|
||||||
|
|
||||||
|
Use the `search-docs` tool with a query of `form component resetting` for detailed guidance.
|
||||||
|
|
||||||
|
<code-snippet name="Form with Reset Props" lang="react">
|
||||||
|
|
||||||
|
import { Form } from '@inertiajs/react'
|
||||||
|
|
||||||
|
<Form
|
||||||
|
action="/users"
|
||||||
|
method="post"
|
||||||
|
resetOnSuccess
|
||||||
|
setDefaultsOnSuccess
|
||||||
|
>
|
||||||
|
{({ errors, processing, wasSuccessful }) => (
|
||||||
|
<>
|
||||||
|
<input type="text" name="name" />
|
||||||
|
{errors.name && <div>{errors.name}</div>}
|
||||||
|
|
||||||
|
<button type="submit" disabled={processing}>
|
||||||
|
Submit
|
||||||
|
</button>
|
||||||
|
</>
|
||||||
|
)}
|
||||||
|
</Form>
|
||||||
|
|
||||||
|
</code-snippet>
|
||||||
|
|
||||||
|
Forms can also be built using the `useForm` helper for more programmatic control. Use the `search-docs` tool with a query of `useForm helper` for guidance.
|
||||||
|
|
||||||
|
### `useForm` Hook
|
||||||
|
|
||||||
|
For more programmatic control or to follow existing conventions, use the `useForm` hook:
|
||||||
|
|
||||||
|
<code-snippet name="useForm Hook Example" lang="react">
|
||||||
|
|
||||||
|
import { useForm } from '@inertiajs/react'
|
||||||
|
|
||||||
|
export default function CreateUser() {
|
||||||
|
const { data, setData, post, processing, errors, reset } = useForm({
|
||||||
|
name: '',
|
||||||
|
email: '',
|
||||||
|
password: '',
|
||||||
|
})
|
||||||
|
|
||||||
|
function submit(e) {
|
||||||
|
e.preventDefault()
|
||||||
|
post('/users', {
|
||||||
|
onSuccess: () => reset('password'),
|
||||||
|
})
|
||||||
|
}
|
||||||
|
|
||||||
|
return (
|
||||||
|
<form onSubmit={submit}>
|
||||||
|
<input
|
||||||
|
type="text"
|
||||||
|
value={data.name}
|
||||||
|
onChange={e => setData('name', e.target.value)}
|
||||||
|
/>
|
||||||
|
{errors.name && <div>{errors.name}</div>}
|
||||||
|
|
||||||
|
<input
|
||||||
|
type="email"
|
||||||
|
value={data.email}
|
||||||
|
onChange={e => setData('email', e.target.value)}
|
||||||
|
/>
|
||||||
|
{errors.email && <div>{errors.email}</div>}
|
||||||
|
|
||||||
|
<input
|
||||||
|
type="password"
|
||||||
|
value={data.password}
|
||||||
|
onChange={e => setData('password', e.target.value)}
|
||||||
|
/>
|
||||||
|
{errors.password && <div>{errors.password}</div>}
|
||||||
|
|
||||||
|
<button type="submit" disabled={processing}>
|
||||||
|
Create User
|
||||||
|
</button>
|
||||||
|
</form>
|
||||||
|
)
|
||||||
|
}
|
||||||
|
|
||||||
|
</code-snippet>
|
||||||
|
|
||||||
|
## Inertia v2 Features
|
||||||
|
|
||||||
|
### Deferred Props
|
||||||
|
|
||||||
|
Use deferred props to load data after initial page render:
|
||||||
|
|
||||||
|
<code-snippet name="Deferred Props with Empty State" lang="react">
|
||||||
|
|
||||||
|
export default function UsersIndex({ users }) {
|
||||||
|
// users will be undefined initially, then populated
|
||||||
|
return (
|
||||||
|
<div>
|
||||||
|
<h1>Users</h1>
|
||||||
|
{!users ? (
|
||||||
|
<div className="animate-pulse">
|
||||||
|
<div className="h-4 bg-gray-200 rounded w-3/4 mb-2"></div>
|
||||||
|
<div className="h-4 bg-gray-200 rounded w-1/2"></div>
|
||||||
|
</div>
|
||||||
|
) : (
|
||||||
|
<ul>
|
||||||
|
{users.map(user => (
|
||||||
|
<li key={user.id}>{user.name}</li>
|
||||||
|
))}
|
||||||
|
</ul>
|
||||||
|
)}
|
||||||
|
</div>
|
||||||
|
)
|
||||||
|
}
|
||||||
|
|
||||||
|
</code-snippet>
|
||||||
|
|
||||||
|
### Polling
|
||||||
|
|
||||||
|
Automatically refresh data at intervals:
|
||||||
|
|
||||||
|
<code-snippet name="Polling Example" lang="react">
|
||||||
|
|
||||||
|
import { router } from '@inertiajs/react'
|
||||||
|
import { useEffect } from 'react'
|
||||||
|
|
||||||
|
export default function Dashboard({ stats }) {
|
||||||
|
useEffect(() => {
|
||||||
|
const interval = setInterval(() => {
|
||||||
|
router.reload({ only: ['stats'] })
|
||||||
|
}, 5000) // Poll every 5 seconds
|
||||||
|
|
||||||
|
return () => clearInterval(interval)
|
||||||
|
}, [])
|
||||||
|
|
||||||
|
return (
|
||||||
|
<div>
|
||||||
|
<h1>Dashboard</h1>
|
||||||
|
<div>Active Users: {stats.activeUsers}</div>
|
||||||
|
</div>
|
||||||
|
)
|
||||||
|
}
|
||||||
|
|
||||||
|
</code-snippet>
|
||||||
|
|
||||||
|
### WhenVisible (Infinite Scroll)
|
||||||
|
|
||||||
|
Load more data when user scrolls to a specific element:
|
||||||
|
|
||||||
|
<code-snippet name="Infinite Scroll with WhenVisible" lang="react">
|
||||||
|
|
||||||
|
import { WhenVisible } from '@inertiajs/react'
|
||||||
|
|
||||||
|
export default function UsersList({ users }) {
|
||||||
|
return (
|
||||||
|
<div>
|
||||||
|
{users.data.map(user => (
|
||||||
|
<div key={user.id}>{user.name}</div>
|
||||||
|
))}
|
||||||
|
|
||||||
|
{users.next_page_url && (
|
||||||
|
<WhenVisible
|
||||||
|
data="users"
|
||||||
|
params={{ page: users.current_page + 1 }}
|
||||||
|
fallback={<div>Loading more...</div>}
|
||||||
|
/>
|
||||||
|
)}
|
||||||
|
</div>
|
||||||
|
)
|
||||||
|
}
|
||||||
|
|
||||||
|
</code-snippet>
|
||||||
|
|
||||||
|
## Common Pitfalls
|
||||||
|
|
||||||
|
- Using traditional `<a>` links instead of Inertia's `<Link>` component (breaks SPA behavior)
|
||||||
|
- Forgetting to add loading states (skeleton screens) when using deferred props
|
||||||
|
- Not handling the `undefined` state of deferred props before data loads
|
||||||
|
- Using `<form>` without preventing default submission (use `<Form>` component or `e.preventDefault()`)
|
||||||
|
- Forgetting to check if `<Form>` component is available in your Inertia version
|
||||||
|
|
@ -0,0 +1,74 @@
|
||||||
|
---
|
||||||
|
name: pennant-development
|
||||||
|
description: >-
|
||||||
|
Manages feature flags with Laravel Pennant. Activates when creating, checking, or toggling
|
||||||
|
feature flags; showing or hiding features conditionally; implementing A/B testing; working with
|
||||||
|
@feature directive; or when the user mentions feature flags, feature toggles, Pennant, conditional
|
||||||
|
features, rollouts, or gradually enabling features.
|
||||||
|
---
|
||||||
|
|
||||||
|
# Pennant Features
|
||||||
|
|
||||||
|
## When to Apply
|
||||||
|
|
||||||
|
Activate this skill when:
|
||||||
|
|
||||||
|
- Creating or checking feature flags
|
||||||
|
- Managing feature rollouts
|
||||||
|
- Implementing A/B testing
|
||||||
|
|
||||||
|
## Documentation
|
||||||
|
|
||||||
|
Use `search-docs` for detailed Pennant patterns and documentation.
|
||||||
|
|
||||||
|
## Basic Usage
|
||||||
|
|
||||||
|
### Defining Features
|
||||||
|
|
||||||
|
<code-snippet name="Defining Features" lang="php">
|
||||||
|
use Laravel\Pennant\Feature;
|
||||||
|
|
||||||
|
Feature::define('new-dashboard', function (User $user) {
|
||||||
|
return $user->isAdmin();
|
||||||
|
});
|
||||||
|
</code-snippet>
|
||||||
|
|
||||||
|
### Checking Features
|
||||||
|
|
||||||
|
<code-snippet name="Checking Features" lang="php">
|
||||||
|
if (Feature::active('new-dashboard')) {
|
||||||
|
// Feature is active
|
||||||
|
}
|
||||||
|
|
||||||
|
// With scope
|
||||||
|
if (Feature::for($user)->active('new-dashboard')) {
|
||||||
|
// Feature is active for this user
|
||||||
|
}
|
||||||
|
</code-snippet>
|
||||||
|
|
||||||
|
### Blade Directive
|
||||||
|
|
||||||
|
<code-snippet name="Blade Directive" lang="blade">
|
||||||
|
@feature('new-dashboard')
|
||||||
|
<x-new-dashboard />
|
||||||
|
@else
|
||||||
|
<x-old-dashboard />
|
||||||
|
@endfeature
|
||||||
|
</code-snippet>
|
||||||
|
|
||||||
|
### Activating / Deactivating
|
||||||
|
|
||||||
|
<code-snippet name="Activating Features" lang="php">
|
||||||
|
Feature::activate('new-dashboard');
|
||||||
|
Feature::for($user)->activate('new-dashboard');
|
||||||
|
</code-snippet>
|
||||||
|
|
||||||
|
## Verification
|
||||||
|
|
||||||
|
1. Check feature flag is defined
|
||||||
|
2. Test with different scopes/users
|
||||||
|
|
||||||
|
## Common Pitfalls
|
||||||
|
|
||||||
|
- Forgetting to scope features for specific users/entities
|
||||||
|
- Not following existing naming conventions
|
||||||
|
|
@ -0,0 +1,174 @@
|
||||||
|
---
|
||||||
|
name: pest-testing
|
||||||
|
description: >-
|
||||||
|
Tests applications using the Pest 4 PHP framework. Activates when writing tests, creating unit or feature
|
||||||
|
tests, adding assertions, testing Livewire components, browser testing, debugging test failures,
|
||||||
|
working with datasets or mocking; or when the user mentions test, spec, TDD, expects, assertion,
|
||||||
|
coverage, or needs to verify functionality works.
|
||||||
|
---
|
||||||
|
|
||||||
|
# Pest Testing 4
|
||||||
|
|
||||||
|
## When to Apply
|
||||||
|
|
||||||
|
Activate this skill when:
|
||||||
|
|
||||||
|
- Creating new tests (unit, feature, or browser)
|
||||||
|
- Modifying existing tests
|
||||||
|
- Debugging test failures
|
||||||
|
- Working with browser testing or smoke testing
|
||||||
|
- Writing architecture tests or visual regression tests
|
||||||
|
|
||||||
|
## Documentation
|
||||||
|
|
||||||
|
Use `search-docs` for detailed Pest 4 patterns and documentation.
|
||||||
|
|
||||||
|
## Basic Usage
|
||||||
|
|
||||||
|
### Creating Tests
|
||||||
|
|
||||||
|
All tests must be written using Pest. Use `php artisan make:test --pest {name}`.
|
||||||
|
|
||||||
|
### Test Organization
|
||||||
|
|
||||||
|
- Unit/Feature tests: `tests/Feature` and `tests/Unit` directories.
|
||||||
|
- Browser tests: `tests/Browser/` directory.
|
||||||
|
- Do NOT remove tests without approval - these are core application code.
|
||||||
|
|
||||||
|
### Basic Test Structure
|
||||||
|
|
||||||
|
<code-snippet name="Basic Pest Test Example" lang="php">
|
||||||
|
|
||||||
|
it('is true', function () {
|
||||||
|
expect(true)->toBeTrue();
|
||||||
|
});
|
||||||
|
|
||||||
|
</code-snippet>
|
||||||
|
|
||||||
|
### Running Tests
|
||||||
|
|
||||||
|
- Run minimal tests with filter before finalizing: `php artisan test --compact --filter=testName`.
|
||||||
|
- Run all tests: `php artisan test --compact`.
|
||||||
|
- Run file: `php artisan test --compact tests/Feature/ExampleTest.php`.
|
||||||
|
|
||||||
|
## Assertions
|
||||||
|
|
||||||
|
Use specific assertions (`assertSuccessful()`, `assertNotFound()`) instead of `assertStatus()`:
|
||||||
|
|
||||||
|
<code-snippet name="Pest Response Assertion" lang="php">
|
||||||
|
|
||||||
|
it('returns all', function () {
|
||||||
|
$this->postJson('/api/docs', [])->assertSuccessful();
|
||||||
|
});
|
||||||
|
|
||||||
|
</code-snippet>
|
||||||
|
|
||||||
|
| Use | Instead of |
|
||||||
|
|-----|------------|
|
||||||
|
| `assertSuccessful()` | `assertStatus(200)` |
|
||||||
|
| `assertNotFound()` | `assertStatus(404)` |
|
||||||
|
| `assertForbidden()` | `assertStatus(403)` |
|
||||||
|
|
||||||
|
## Mocking
|
||||||
|
|
||||||
|
Import mock function before use: `use function Pest\Laravel\mock;`
|
||||||
|
|
||||||
|
## Datasets
|
||||||
|
|
||||||
|
Use datasets for repetitive tests (validation rules, etc.):
|
||||||
|
|
||||||
|
<code-snippet name="Pest Dataset Example" lang="php">
|
||||||
|
|
||||||
|
it('has emails', function (string $email) {
|
||||||
|
expect($email)->not->toBeEmpty();
|
||||||
|
})->with([
|
||||||
|
'james' => 'james@laravel.com',
|
||||||
|
'taylor' => 'taylor@laravel.com',
|
||||||
|
]);
|
||||||
|
|
||||||
|
</code-snippet>
|
||||||
|
|
||||||
|
## Pest 4 Features
|
||||||
|
|
||||||
|
| Feature | Purpose |
|
||||||
|
|---------|---------|
|
||||||
|
| Browser Testing | Full integration tests in real browsers |
|
||||||
|
| Smoke Testing | Validate multiple pages quickly |
|
||||||
|
| Visual Regression | Compare screenshots for visual changes |
|
||||||
|
| Test Sharding | Parallel CI runs |
|
||||||
|
| Architecture Testing | Enforce code conventions |
|
||||||
|
|
||||||
|
### Browser Test Example
|
||||||
|
|
||||||
|
Browser tests run in real browsers for full integration testing:
|
||||||
|
|
||||||
|
- Browser tests live in `tests/Browser/`.
|
||||||
|
- Use Laravel features like `Event::fake()`, `assertAuthenticated()`, and model factories.
|
||||||
|
- Use `RefreshDatabase` for clean state per test.
|
||||||
|
- Interact with page: click, type, scroll, select, submit, drag-and-drop, touch gestures.
|
||||||
|
- Test on multiple browsers (Chrome, Firefox, Safari) if requested.
|
||||||
|
- Test on different devices/viewports (iPhone 14 Pro, tablets) if requested.
|
||||||
|
- Switch color schemes (light/dark mode) when appropriate.
|
||||||
|
- Take screenshots or pause tests for debugging.
|
||||||
|
|
||||||
|
<code-snippet name="Pest Browser Test Example" lang="php">
|
||||||
|
|
||||||
|
it('may reset the password', function () {
|
||||||
|
Notification::fake();
|
||||||
|
|
||||||
|
$this->actingAs(User::factory()->create());
|
||||||
|
|
||||||
|
$page = visit('/sign-in');
|
||||||
|
|
||||||
|
$page->assertSee('Sign In')
|
||||||
|
->assertNoJavascriptErrors()
|
||||||
|
->click('Forgot Password?')
|
||||||
|
->fill('email', 'nuno@laravel.com')
|
||||||
|
->click('Send Reset Link')
|
||||||
|
->assertSee('We have emailed your password reset link!');
|
||||||
|
|
||||||
|
Notification::assertSent(ResetPassword::class);
|
||||||
|
});
|
||||||
|
|
||||||
|
</code-snippet>
|
||||||
|
|
||||||
|
### Smoke Testing
|
||||||
|
|
||||||
|
Quickly validate multiple pages have no JavaScript errors:
|
||||||
|
|
||||||
|
<code-snippet name="Pest Smoke Testing Example" lang="php">
|
||||||
|
|
||||||
|
$pages = visit(['/', '/about', '/contact']);
|
||||||
|
|
||||||
|
$pages->assertNoJavascriptErrors()->assertNoConsoleLogs();
|
||||||
|
|
||||||
|
</code-snippet>
|
||||||
|
|
||||||
|
### Visual Regression Testing
|
||||||
|
|
||||||
|
Capture and compare screenshots to detect visual changes.
|
||||||
|
|
||||||
|
### Test Sharding
|
||||||
|
|
||||||
|
Split tests across parallel processes for faster CI runs.
|
||||||
|
|
||||||
|
### Architecture Testing
|
||||||
|
|
||||||
|
Pest 4 includes architecture testing (from Pest 3):
|
||||||
|
|
||||||
|
<code-snippet name="Architecture Test Example" lang="php">
|
||||||
|
|
||||||
|
arch('controllers')
|
||||||
|
->expect('App\Http\Controllers')
|
||||||
|
->toExtendNothing()
|
||||||
|
->toHaveSuffix('Controller');
|
||||||
|
|
||||||
|
</code-snippet>
|
||||||
|
|
||||||
|
## Common Pitfalls
|
||||||
|
|
||||||
|
- Not importing `use function Pest\Laravel\mock;` before using mock
|
||||||
|
- Using `assertStatus(200)` instead of `assertSuccessful()`
|
||||||
|
- Forgetting datasets for repetitive validation tests
|
||||||
|
- Deleting tests without approval
|
||||||
|
- Forgetting `assertNoJavascriptErrors()` in browser tests
|
||||||
|
|
@ -0,0 +1,124 @@
|
||||||
|
---
|
||||||
|
name: tailwindcss-development
|
||||||
|
description: >-
|
||||||
|
Styles applications using Tailwind CSS v4 utilities. Activates when adding styles, restyling components,
|
||||||
|
working with gradients, spacing, layout, flex, grid, responsive design, dark mode, colors,
|
||||||
|
typography, or borders; or when the user mentions CSS, styling, classes, Tailwind, restyle,
|
||||||
|
hero section, cards, buttons, or any visual/UI changes.
|
||||||
|
---
|
||||||
|
|
||||||
|
# Tailwind CSS Development
|
||||||
|
|
||||||
|
## When to Apply
|
||||||
|
|
||||||
|
Activate this skill when:
|
||||||
|
|
||||||
|
- Adding styles to components or pages
|
||||||
|
- Working with responsive design
|
||||||
|
- Implementing dark mode
|
||||||
|
- Extracting repeated patterns into components
|
||||||
|
- Debugging spacing or layout issues
|
||||||
|
|
||||||
|
## Documentation
|
||||||
|
|
||||||
|
Use `search-docs` for detailed Tailwind CSS v4 patterns and documentation.
|
||||||
|
|
||||||
|
## Basic Usage
|
||||||
|
|
||||||
|
- Use Tailwind CSS classes to style HTML. Check and follow existing Tailwind conventions in the project before introducing new patterns.
|
||||||
|
- Offer to extract repeated patterns into components that match the project's conventions (e.g., Blade, JSX, Vue).
|
||||||
|
- Consider class placement, order, priority, and defaults. Remove redundant classes, add classes to parent or child elements carefully to reduce repetition, and group elements logically.
|
||||||
|
|
||||||
|
## Tailwind CSS v4 Specifics
|
||||||
|
|
||||||
|
- Always use Tailwind CSS v4 and avoid deprecated utilities.
|
||||||
|
- `corePlugins` is not supported in Tailwind v4.
|
||||||
|
|
||||||
|
### CSS-First Configuration
|
||||||
|
|
||||||
|
In Tailwind v4, configuration is CSS-first using the `@theme` directive — no separate `tailwind.config.js` file is needed:
|
||||||
|
|
||||||
|
<code-snippet name="CSS-First Config" lang="css">
|
||||||
|
@theme {
|
||||||
|
--color-brand: oklch(0.72 0.11 178);
|
||||||
|
}
|
||||||
|
</code-snippet>
|
||||||
|
|
||||||
|
### Import Syntax
|
||||||
|
|
||||||
|
In Tailwind v4, import Tailwind with a regular CSS `@import` statement instead of the `@tailwind` directives used in v3:
|
||||||
|
|
||||||
|
<code-snippet name="v4 Import Syntax" lang="diff">
|
||||||
|
- @tailwind base;
|
||||||
|
- @tailwind components;
|
||||||
|
- @tailwind utilities;
|
||||||
|
+ @import "tailwindcss";
|
||||||
|
</code-snippet>
|
||||||
|
|
||||||
|
### Replaced Utilities
|
||||||
|
|
||||||
|
Tailwind v4 removed deprecated utilities. Use the replacements shown below. Opacity values remain numeric.
|
||||||
|
|
||||||
|
| Deprecated | Replacement |
|
||||||
|
|------------|-------------|
|
||||||
|
| bg-opacity-* | bg-black/* |
|
||||||
|
| text-opacity-* | text-black/* |
|
||||||
|
| border-opacity-* | border-black/* |
|
||||||
|
| divide-opacity-* | divide-black/* |
|
||||||
|
| ring-opacity-* | ring-black/* |
|
||||||
|
| placeholder-opacity-* | placeholder-black/* |
|
||||||
|
| flex-shrink-* | shrink-* |
|
||||||
|
| flex-grow-* | grow-* |
|
||||||
|
| overflow-ellipsis | text-ellipsis |
|
||||||
|
| decoration-slice | box-decoration-slice |
|
||||||
|
| decoration-clone | box-decoration-clone |
|
||||||
|
|
||||||
|
## Spacing
|
||||||
|
|
||||||
|
Use `gap` utilities instead of margins for spacing between siblings:
|
||||||
|
|
||||||
|
<code-snippet name="Gap Utilities" lang="html">
|
||||||
|
<div class="flex gap-8">
|
||||||
|
<div>Item 1</div>
|
||||||
|
<div>Item 2</div>
|
||||||
|
</div>
|
||||||
|
</code-snippet>
|
||||||
|
|
||||||
|
## Dark Mode
|
||||||
|
|
||||||
|
If existing pages and components support dark mode, new pages and components must support it the same way, typically using the `dark:` variant:
|
||||||
|
|
||||||
|
<code-snippet name="Dark Mode" lang="html">
|
||||||
|
<div class="bg-white dark:bg-gray-900 text-gray-900 dark:text-white">
|
||||||
|
Content adapts to color scheme
|
||||||
|
</div>
|
||||||
|
</code-snippet>
|
||||||
|
|
||||||
|
## Common Patterns
|
||||||
|
|
||||||
|
### Flexbox Layout
|
||||||
|
|
||||||
|
<code-snippet name="Flexbox Layout" lang="html">
|
||||||
|
<div class="flex items-center justify-between gap-4">
|
||||||
|
<div>Left content</div>
|
||||||
|
<div>Right content</div>
|
||||||
|
</div>
|
||||||
|
</code-snippet>
|
||||||
|
|
||||||
|
### Grid Layout
|
||||||
|
|
||||||
|
<code-snippet name="Grid Layout" lang="html">
|
||||||
|
<div class="grid grid-cols-1 md:grid-cols-2 lg:grid-cols-3 gap-6">
|
||||||
|
<div>Card 1</div>
|
||||||
|
<div>Card 2</div>
|
||||||
|
<div>Card 3</div>
|
||||||
|
</div>
|
||||||
|
</code-snippet>
|
||||||
|
|
||||||
|
## Common Pitfalls
|
||||||
|
|
||||||
|
- Using deprecated v3 utilities (bg-opacity-*, flex-shrink-*, etc.)
|
||||||
|
- Using `@tailwind` directives instead of `@import "tailwindcss"`
|
||||||
|
- Trying to use `tailwind.config.js` instead of CSS `@theme` directive
|
||||||
|
- Using margins for spacing between siblings instead of gap utilities
|
||||||
|
- Forgetting to add dark mode variants when the project uses dark mode
|
||||||
|
|
@ -0,0 +1,89 @@
|
||||||
|
---
|
||||||
|
name: wayfinder-development
|
||||||
|
description: >-
|
||||||
|
Activates whenever referencing backend routes in frontend components. Use when
|
||||||
|
importing from @/actions or @/routes, calling Laravel routes from TypeScript,
|
||||||
|
or working with Wayfinder route functions.
|
||||||
|
---
|
||||||
|
|
||||||
|
# Wayfinder Development
|
||||||
|
|
||||||
|
## When to Apply
|
||||||
|
|
||||||
|
Activate whenever referencing backend routes in frontend components:
|
||||||
|
- Importing from `@/actions/` or `@/routes/`
|
||||||
|
- Calling Laravel routes from TypeScript/JavaScript
|
||||||
|
- Creating links or navigation to backend endpoints
|
||||||
|
|
||||||
|
## Documentation
|
||||||
|
|
||||||
|
Use `search-docs` for detailed Wayfinder patterns and documentation.
|
||||||
|
|
||||||
|
## Quick Reference
|
||||||
|
|
||||||
|
### Generate Routes
|
||||||
|
|
||||||
|
Run after route changes if Vite plugin isn't installed:
|
||||||
|
|
||||||
|
php artisan wayfinder:generate --no-interaction
|
||||||
|
|
||||||
|
For form helpers, use `--with-form` flag:
|
||||||
|
|
||||||
|
php artisan wayfinder:generate --with-form --no-interaction
|
||||||
|
|
||||||
|
### Import Patterns
|
||||||
|
|
||||||
|
<code-snippet name="Controller Action Imports" lang="typescript">
|
||||||
|
|
||||||
|
// Named imports for tree-shaking (preferred)...
|
||||||
|
import { show, store, update } from '@/actions/App/Http/Controllers/PostController'
|
||||||
|
|
||||||
|
// Named route imports...
|
||||||
|
import { show as postShow } from '@/routes/post'
|
||||||
|
|
||||||
|
</code-snippet>
|
||||||
|
|
||||||
|
### Common Methods
|
||||||
|
|
||||||
|
<code-snippet name="Wayfinder Methods" lang="typescript">
|
||||||
|
|
||||||
|
// Get route object...
|
||||||
|
show(1) // { url: "/posts/1", method: "get" }
|
||||||
|
|
||||||
|
// Get URL string...
|
||||||
|
show.url(1) // "/posts/1"
|
||||||
|
|
||||||
|
// Specific HTTP methods...
|
||||||
|
show.get(1)
|
||||||
|
store.post()
|
||||||
|
update.patch(1)
|
||||||
|
destroy.delete(1)
|
||||||
|
|
||||||
|
// Form attributes for HTML forms...
|
||||||
|
store.form() // { action: "/posts", method: "post" }
|
||||||
|
|
||||||
|
// Query parameters...
|
||||||
|
show(1, { query: { page: 1 } }) // "/posts/1?page=1"
|
||||||
|
|
||||||
|
</code-snippet>
|
||||||
|
|
||||||
|
## Wayfinder + Inertia
|
||||||
|
|
||||||
|
Use Wayfinder with the `<Form>` component:
|
||||||
|
<code-snippet name="Wayfinder Form (React)" lang="typescript">
|
||||||
|
|
||||||
|
<Form {...store.form()}><input name="title" /></Form>
|
||||||
|
|
||||||
|
</code-snippet>
|
||||||
|
|
||||||
|
## Verification
|
||||||
|
|
||||||
|
1. Run `php artisan wayfinder:generate` to regenerate routes if Vite plugin isn't installed
|
||||||
|
2. Check TypeScript imports resolve correctly
|
||||||
|
3. Verify route URLs match expected paths
|
||||||
|
|
||||||
|
## Common Pitfalls
|
||||||
|
|
||||||
|
- Using default imports instead of named imports (breaks tree-shaking)
|
||||||
|
- Forgetting to regenerate after route changes
|
||||||
|
- Not using type-safe parameter objects for route model binding
|
||||||
|
|
@ -0,0 +1,369 @@
|
||||||
|
---
|
||||||
|
name: inertia-react-development
|
||||||
|
description: >-
|
||||||
|
Develops Inertia.js v2 React client-side applications. Activates when creating
|
||||||
|
React pages, forms, or navigation; using <Link>, <Form>, useForm, or router;
|
||||||
|
working with deferred props, prefetching, or polling; or when user mentions
|
||||||
|
React with Inertia, React pages, React forms, or React navigation.
|
||||||
|
---
|
||||||
|
|
||||||
|
# Inertia React Development
|
||||||
|
|
||||||
|
## When to Apply
|
||||||
|
|
||||||
|
Activate this skill when:
|
||||||
|
|
||||||
|
- Creating or modifying React page components for Inertia
|
||||||
|
- Working with forms in React (using `<Form>` or `useForm`)
|
||||||
|
- Implementing client-side navigation with `<Link>` or `router`
|
||||||
|
- Using v2 features: deferred props, prefetching, or polling
|
||||||
|
- Building React-specific features with the Inertia protocol
|
||||||
|
|
||||||
|
## Documentation
|
||||||
|
|
||||||
|
Use `search-docs` for detailed Inertia v2 React patterns and documentation.
|
||||||
|
|
||||||
|
## Basic Usage
|
||||||
|
|
||||||
|
### Page Components Location
|
||||||
|
|
||||||
|
React page components should be placed in the `resources/js/Pages` directory.
|
||||||
|
|
||||||
|
### Page Component Structure
|
||||||
|
|
||||||
|
<code-snippet name="Basic React Page Component" lang="react">
|
||||||
|
|
||||||
|
export default function UsersIndex({ users }) {
|
||||||
|
return (
|
||||||
|
<div>
|
||||||
|
<h1>Users</h1>
|
||||||
|
<ul>
|
||||||
|
{users.map(user => <li key={user.id}>{user.name}</li>)}
|
||||||
|
</ul>
|
||||||
|
</div>
|
||||||
|
)
|
||||||
|
}
|
||||||
|
|
||||||
|
</code-snippet>
|
||||||
|
|
||||||
|
## Client-Side Navigation
|
||||||
|
|
||||||
|
### Basic Link Component
|
||||||
|
|
||||||
|
Use `<Link>` for client-side navigation instead of traditional `<a>` tags:
|
||||||
|
|
||||||
|
<code-snippet name="Inertia React Navigation" lang="react">
|
||||||
|
|
||||||
|
import { Link, router } from '@inertiajs/react'
|
||||||
|
|
||||||
|
<Link href="/">Home</Link>
|
||||||
|
<Link href="/users">Users</Link>
|
||||||
|
<Link href={`/users/${user.id}`}>View User</Link>
|
||||||
|
|
||||||
|
</code-snippet>
|
||||||
|
|
||||||
|
### Link with Method
|
||||||
|
|
||||||
|
<code-snippet name="Link with POST Method" lang="react">
|
||||||
|
|
||||||
|
import { Link } from '@inertiajs/react'
|
||||||
|
|
||||||
|
<Link href="/logout" method="post" as="button">
|
||||||
|
Logout
|
||||||
|
</Link>
|
||||||
|
|
||||||
|
</code-snippet>
|
||||||
|
|
||||||
|
### Prefetching
|
||||||
|
|
||||||
|
Prefetch pages to improve perceived performance:
|
||||||
|
|
||||||
|
<code-snippet name="Prefetch on Hover" lang="react">
|
||||||
|
|
||||||
|
import { Link } from '@inertiajs/react'
|
||||||
|
|
||||||
|
<Link href="/users" prefetch>
|
||||||
|
Users
|
||||||
|
</Link>
|
||||||
|
|
||||||
|
</code-snippet>
|
||||||
|
|
||||||
|
### Programmatic Navigation
|
||||||
|
|
||||||
|
<code-snippet name="Router Visit" lang="react">
|
||||||
|
|
||||||
|
import { router } from '@inertiajs/react'
|
||||||
|
|
||||||
|
function handleClick() {
|
||||||
|
router.visit('/users')
|
||||||
|
}
|
||||||
|
|
||||||
|
// Or with options
|
||||||
|
router.visit('/users', {
|
||||||
|
method: 'post',
|
||||||
|
data: { name: 'John' },
|
||||||
|
onSuccess: () => console.log('Success!'),
|
||||||
|
})
|
||||||
|
|
||||||
|
</code-snippet>
|
||||||
|
|
||||||
|
## Form Handling
|
||||||
|
|
||||||
|
### Form Component (Recommended)
|
||||||
|
|
||||||
|
The recommended way to build forms is with the `<Form>` component:
|
||||||
|
|
||||||
|
<code-snippet name="Form Component Example" lang="react">
|
||||||
|
|
||||||
|
import { Form } from '@inertiajs/react'
|
||||||
|
|
||||||
|
export default function CreateUser() {
|
||||||
|
return (
|
||||||
|
<Form action="/users" method="post">
|
||||||
|
{({ errors, processing, wasSuccessful }) => (
|
||||||
|
<>
|
||||||
|
<input type="text" name="name" />
|
||||||
|
{errors.name && <div>{errors.name}</div>}
|
||||||
|
|
||||||
|
<input type="email" name="email" />
|
||||||
|
{errors.email && <div>{errors.email}</div>}
|
||||||
|
|
||||||
|
<button type="submit" disabled={processing}>
|
||||||
|
{processing ? 'Creating...' : 'Create User'}
|
||||||
|
</button>
|
||||||
|
|
||||||
|
{wasSuccessful && <div>User created!</div>}
|
||||||
|
</>
|
||||||
|
)}
|
||||||
|
</Form>
|
||||||
|
)
|
||||||
|
}
|
||||||
|
|
||||||
|
</code-snippet>
|
||||||
|
|
||||||
|
### Form Component With All Props
|
||||||
|
|
||||||
|
<code-snippet name="Form Component Full Example" lang="react">
|
||||||
|
|
||||||
|
import { Form } from '@inertiajs/react'
|
||||||
|
|
||||||
|
<Form action="/users" method="post">
|
||||||
|
{({
|
||||||
|
errors,
|
||||||
|
hasErrors,
|
||||||
|
processing,
|
||||||
|
progress,
|
||||||
|
wasSuccessful,
|
||||||
|
recentlySuccessful,
|
||||||
|
clearErrors,
|
||||||
|
resetAndClearErrors,
|
||||||
|
defaults,
|
||||||
|
isDirty,
|
||||||
|
reset,
|
||||||
|
submit
|
||||||
|
}) => (
|
||||||
|
<>
|
||||||
|
<input type="text" name="name" defaultValue={defaults.name} />
|
||||||
|
{errors.name && <div>{errors.name}</div>}
|
||||||
|
|
||||||
|
<button type="submit" disabled={processing}>
|
||||||
|
{processing ? 'Saving...' : 'Save'}
|
||||||
|
</button>
|
||||||
|
|
||||||
|
{progress && (
|
||||||
|
<progress value={progress.percentage} max="100">
|
||||||
|
{progress.percentage}%
|
||||||
|
</progress>
|
||||||
|
)}
|
||||||
|
|
||||||
|
{wasSuccessful && <div>Saved!</div>}
|
||||||
|
</>
|
||||||
|
)}
|
||||||
|
</Form>
|
||||||
|
|
||||||
|
</code-snippet>
|
||||||
|
|
||||||
|
### Form Component Reset Props
|
||||||
|
|
||||||
|
The `<Form>` component supports automatic resetting:
|
||||||
|
|
||||||
|
- `resetOnError` - Reset form data when the request fails
|
||||||
|
- `resetOnSuccess` - Reset form data when the request succeeds
|
||||||
|
- `setDefaultsOnSuccess` - Update default values on success
|
||||||
|
|
||||||
|
Use the `search-docs` tool with a query of `form component resetting` for detailed guidance.
|
||||||
|
|
||||||
|
<code-snippet name="Form with Reset Props" lang="react">
|
||||||
|
|
||||||
|
import { Form } from '@inertiajs/react'
|
||||||
|
|
||||||
|
<Form
|
||||||
|
action="/users"
|
||||||
|
method="post"
|
||||||
|
resetOnSuccess
|
||||||
|
setDefaultsOnSuccess
|
||||||
|
>
|
||||||
|
{({ errors, processing, wasSuccessful }) => (
|
||||||
|
<>
|
||||||
|
<input type="text" name="name" />
|
||||||
|
{errors.name && <div>{errors.name}</div>}
|
||||||
|
|
||||||
|
<button type="submit" disabled={processing}>
|
||||||
|
Submit
|
||||||
|
</button>
|
||||||
|
</>
|
||||||
|
)}
|
||||||
|
</Form>
|
||||||
|
|
||||||
|
</code-snippet>
|
||||||
|
|
||||||
|
Forms can also be built using the `useForm` helper for more programmatic control. Use the `search-docs` tool with a query of `useForm helper` for guidance.
|
||||||
|
|
||||||
|
### `useForm` Hook
|
||||||
|
|
||||||
|
For more programmatic control or to follow existing conventions, use the `useForm` hook:
|
||||||
|
|
||||||
|
<code-snippet name="useForm Hook Example" lang="react">
|
||||||
|
|
||||||
|
import { useForm } from '@inertiajs/react'
|
||||||
|
|
||||||
|
export default function CreateUser() {
|
||||||
|
const { data, setData, post, processing, errors, reset } = useForm({
|
||||||
|
name: '',
|
||||||
|
email: '',
|
||||||
|
password: '',
|
||||||
|
})
|
||||||
|
|
||||||
|
function submit(e) {
|
||||||
|
e.preventDefault()
|
||||||
|
post('/users', {
|
||||||
|
onSuccess: () => reset('password'),
|
||||||
|
})
|
||||||
|
}
|
||||||
|
|
||||||
|
return (
|
||||||
|
<form onSubmit={submit}>
|
||||||
|
<input
|
||||||
|
type="text"
|
||||||
|
value={data.name}
|
||||||
|
onChange={e => setData('name', e.target.value)}
|
||||||
|
/>
|
||||||
|
{errors.name && <div>{errors.name}</div>}
|
||||||
|
|
||||||
|
<input
|
||||||
|
type="email"
|
||||||
|
value={data.email}
|
||||||
|
onChange={e => setData('email', e.target.value)}
|
||||||
|
/>
|
||||||
|
{errors.email && <div>{errors.email}</div>}
|
||||||
|
|
||||||
|
<input
|
||||||
|
type="password"
|
||||||
|
value={data.password}
|
||||||
|
onChange={e => setData('password', e.target.value)}
|
||||||
|
/>
|
||||||
|
{errors.password && <div>{errors.password}</div>}
|
||||||
|
|
||||||
|
<button type="submit" disabled={processing}>
|
||||||
|
Create User
|
||||||
|
</button>
|
||||||
|
</form>
|
||||||
|
)
|
||||||
|
}
|
||||||
|
|
||||||
|
</code-snippet>
|
||||||
|
|
||||||
|
## Inertia v2 Features
|
||||||
|
|
||||||
|
### Deferred Props
|
||||||
|
|
||||||
|
Use deferred props to load data after initial page render:
|
||||||
|
|
||||||
|
<code-snippet name="Deferred Props with Empty State" lang="react">
|
||||||
|
|
||||||
|
export default function UsersIndex({ users }) {
|
||||||
|
// users will be undefined initially, then populated
|
||||||
|
return (
|
||||||
|
<div>
|
||||||
|
<h1>Users</h1>
|
||||||
|
{!users ? (
|
||||||
|
<div className="animate-pulse">
|
||||||
|
<div className="h-4 bg-gray-200 rounded w-3/4 mb-2"></div>
|
||||||
|
<div className="h-4 bg-gray-200 rounded w-1/2"></div>
|
||||||
|
</div>
|
||||||
|
) : (
|
||||||
|
<ul>
|
||||||
|
{users.map(user => (
|
||||||
|
<li key={user.id}>{user.name}</li>
|
||||||
|
))}
|
||||||
|
</ul>
|
||||||
|
)}
|
||||||
|
</div>
|
||||||
|
)
|
||||||
|
}
|
||||||
|
|
||||||
|
</code-snippet>
|
||||||
|
|
||||||
|
### Polling
|
||||||
|
|
||||||
|
Automatically refresh data at intervals:
|
||||||
|
|
||||||
|
<code-snippet name="Polling Example" lang="react">
|
||||||
|
|
||||||
|
import { router } from '@inertiajs/react'
|
||||||
|
import { useEffect } from 'react'
|
||||||
|
|
||||||
|
export default function Dashboard({ stats }) {
|
||||||
|
useEffect(() => {
|
||||||
|
const interval = setInterval(() => {
|
||||||
|
router.reload({ only: ['stats'] })
|
||||||
|
}, 5000) // Poll every 5 seconds
|
||||||
|
|
||||||
|
return () => clearInterval(interval)
|
||||||
|
}, [])
|
||||||
|
|
||||||
|
return (
|
||||||
|
<div>
|
||||||
|
<h1>Dashboard</h1>
|
||||||
|
<div>Active Users: {stats.activeUsers}</div>
|
||||||
|
</div>
|
||||||
|
)
|
||||||
|
}
|
||||||
|
|
||||||
|
</code-snippet>
|
||||||
|
|
||||||
|
### WhenVisible (Infinite Scroll)
|
||||||
|
|
||||||
|
Load more data when user scrolls to a specific element:
|
||||||
|
|
||||||
|
<code-snippet name="Infinite Scroll with WhenVisible" lang="react">
|
||||||
|
|
||||||
|
import { WhenVisible } from '@inertiajs/react'
|
||||||
|
|
||||||
|
export default function UsersList({ users }) {
|
||||||
|
return (
|
||||||
|
<div>
|
||||||
|
{users.data.map(user => (
|
||||||
|
<div key={user.id}>{user.name}</div>
|
||||||
|
))}
|
||||||
|
|
||||||
|
{users.next_page_url && (
|
||||||
|
<WhenVisible
|
||||||
|
data="users"
|
||||||
|
params={{ page: users.current_page + 1 }}
|
||||||
|
fallback={<div>Loading more...</div>}
|
||||||
|
/>
|
||||||
|
)}
|
||||||
|
</div>
|
||||||
|
)
|
||||||
|
}
|
||||||
|
|
||||||
|
</code-snippet>
|
||||||
|
|
||||||
|
## Common Pitfalls
|
||||||
|
|
||||||
|
- Using traditional `<a>` links instead of Inertia's `<Link>` component (breaks SPA behavior)
|
||||||
|
- Forgetting to add loading states (skeleton screens) when using deferred props
|
||||||
|
- Not handling the `undefined` state of deferred props before data loads
|
||||||
|
- Using `<form>` without preventing default submission (use `<Form>` component or `e.preventDefault()`)
|
||||||
|
- Forgetting to check if `<Form>` component is available in your Inertia version
|
||||||
|
|
@ -0,0 +1,74 @@
|
||||||
|
---
|
||||||
|
name: pennant-development
|
||||||
|
description: >-
|
||||||
|
Manages feature flags with Laravel Pennant. Activates when creating, checking, or toggling
|
||||||
|
feature flags; showing or hiding features conditionally; implementing A/B testing; working with
|
||||||
|
@feature directive; or when the user mentions feature flags, feature toggles, Pennant, conditional
|
||||||
|
features, rollouts, or gradually enabling features.
|
||||||
|
---
|
||||||
|
|
||||||
|
# Pennant Features
|
||||||
|
|
||||||
|
## When to Apply
|
||||||
|
|
||||||
|
Activate this skill when:
|
||||||
|
|
||||||
|
- Creating or checking feature flags
|
||||||
|
- Managing feature rollouts
|
||||||
|
- Implementing A/B testing
|
||||||
|
|
||||||
|
## Documentation
|
||||||
|
|
||||||
|
Use `search-docs` for detailed Pennant patterns and documentation.
|
||||||
|
|
||||||
|
## Basic Usage
|
||||||
|
|
||||||
|
### Defining Features
|
||||||
|
|
||||||
|
<code-snippet name="Defining Features" lang="php">
|
||||||
|
use Laravel\Pennant\Feature;
|
||||||
|
|
||||||
|
Feature::define('new-dashboard', function (User $user) {
|
||||||
|
return $user->isAdmin();
|
||||||
|
});
|
||||||
|
</code-snippet>
|
||||||
|
|
||||||
|
### Checking Features
|
||||||
|
|
||||||
|
<code-snippet name="Checking Features" lang="php">
|
||||||
|
if (Feature::active('new-dashboard')) {
|
||||||
|
// Feature is active
|
||||||
|
}
|
||||||
|
|
||||||
|
// With scope
|
||||||
|
if (Feature::for($user)->active('new-dashboard')) {
|
||||||
|
// Feature is active for this user
|
||||||
|
}
|
||||||
|
</code-snippet>
|
||||||
|
|
||||||
|
### Blade Directive
|
||||||
|
|
||||||
|
<code-snippet name="Blade Directive" lang="blade">
|
||||||
|
@feature('new-dashboard')
|
||||||
|
<x-new-dashboard />
|
||||||
|
@else
|
||||||
|
<x-old-dashboard />
|
||||||
|
@endfeature
|
||||||
|
</code-snippet>
|
||||||
|
|
||||||
|
### Activating / Deactivating
|
||||||
|
|
||||||
|
<code-snippet name="Activating Features" lang="php">
|
||||||
|
Feature::activate('new-dashboard');
|
||||||
|
Feature::for($user)->activate('new-dashboard');
|
||||||
|
</code-snippet>
|
||||||
|
|
||||||
|
## Verification
|
||||||
|
|
||||||
|
1. Check feature flag is defined
|
||||||
|
2. Test with different scopes/users
|
||||||
|
|
||||||
|
## Common Pitfalls
|
||||||
|
|
||||||
|
- Forgetting to scope features for specific users/entities
|
||||||
|
- Not following existing naming conventions
|
||||||
|
|
@ -0,0 +1,174 @@
|
||||||
|
---
|
||||||
|
name: pest-testing
|
||||||
|
description: >-
|
||||||
|
Tests applications using the Pest 4 PHP framework. Activates when writing tests, creating unit or feature
|
||||||
|
tests, adding assertions, testing Livewire components, browser testing, debugging test failures,
|
||||||
|
working with datasets or mocking; or when the user mentions test, spec, TDD, expects, assertion,
|
||||||
|
coverage, or needs to verify functionality works.
|
||||||
|
---
|
||||||
|
|
||||||
|
# Pest Testing 4
|
||||||
|
|
||||||
|
## When to Apply
|
||||||
|
|
||||||
|
Activate this skill when:
|
||||||
|
|
||||||
|
- Creating new tests (unit, feature, or browser)
|
||||||
|
- Modifying existing tests
|
||||||
|
- Debugging test failures
|
||||||
|
- Working with browser testing or smoke testing
|
||||||
|
- Writing architecture tests or visual regression tests
|
||||||
|
|
||||||
|
## Documentation
|
||||||
|
|
||||||
|
Use `search-docs` for detailed Pest 4 patterns and documentation.
|
||||||
|
|
||||||
|
## Basic Usage
|
||||||
|
|
||||||
|
### Creating Tests
|
||||||
|
|
||||||
|
All tests must be written using Pest. Use `php artisan make:test --pest {name}`.
|
||||||
|
|
||||||
|
### Test Organization
|
||||||
|
|
||||||
|
- Unit/Feature tests: `tests/Feature` and `tests/Unit` directories.
|
||||||
|
- Browser tests: `tests/Browser/` directory.
|
||||||
|
- Do NOT remove tests without approval - these are core application code.
|
||||||
|
|
||||||
|
### Basic Test Structure
|
||||||
|
|
||||||
|
<code-snippet name="Basic Pest Test Example" lang="php">
|
||||||
|
|
||||||
|
it('is true', function () {
|
||||||
|
expect(true)->toBeTrue();
|
||||||
|
});
|
||||||
|
|
||||||
|
</code-snippet>
|
||||||
|
|
||||||
|
### Running Tests
|
||||||
|
|
||||||
|
- Run minimal tests with filter before finalizing: `php artisan test --compact --filter=testName`.
|
||||||
|
- Run all tests: `php artisan test --compact`.
|
||||||
|
- Run file: `php artisan test --compact tests/Feature/ExampleTest.php`.
|
||||||
|
|
||||||
|
## Assertions
|
||||||
|
|
||||||
|
Use specific assertions (`assertSuccessful()`, `assertNotFound()`) instead of `assertStatus()`:
|
||||||
|
|
||||||
|
<code-snippet name="Pest Response Assertion" lang="php">
|
||||||
|
|
||||||
|
it('returns all', function () {
|
||||||
|
$this->postJson('/api/docs', [])->assertSuccessful();
|
||||||
|
});
|
||||||
|
|
||||||
|
</code-snippet>
|
||||||
|
|
||||||
|
| Use | Instead of |
|
||||||
|
|-----|------------|
|
||||||
|
| `assertSuccessful()` | `assertStatus(200)` |
|
||||||
|
| `assertNotFound()` | `assertStatus(404)` |
|
||||||
|
| `assertForbidden()` | `assertStatus(403)` |
|
||||||
|
|
||||||
|
## Mocking
|
||||||
|
|
||||||
|
Import mock function before use: `use function Pest\Laravel\mock;`
|
||||||
|
|
||||||
|
## Datasets
|
||||||
|
|
||||||
|
Use datasets for repetitive tests (validation rules, etc.):
|
||||||
|
|
||||||
|
<code-snippet name="Pest Dataset Example" lang="php">
|
||||||
|
|
||||||
|
it('has emails', function (string $email) {
|
||||||
|
expect($email)->not->toBeEmpty();
|
||||||
|
})->with([
|
||||||
|
'james' => 'james@laravel.com',
|
||||||
|
'taylor' => 'taylor@laravel.com',
|
||||||
|
]);
|
||||||
|
|
||||||
|
</code-snippet>
|
||||||
|
|
||||||
|
## Pest 4 Features
|
||||||
|
|
||||||
|
| Feature | Purpose |
|
||||||
|
|---------|---------|
|
||||||
|
| Browser Testing | Full integration tests in real browsers |
|
||||||
|
| Smoke Testing | Validate multiple pages quickly |
|
||||||
|
| Visual Regression | Compare screenshots for visual changes |
|
||||||
|
| Test Sharding | Parallel CI runs |
|
||||||
|
| Architecture Testing | Enforce code conventions |
|
||||||
|
|
||||||
|
### Browser Test Example
|
||||||
|
|
||||||
|
Browser tests run in real browsers for full integration testing:
|
||||||
|
|
||||||
|
- Browser tests live in `tests/Browser/`.
|
||||||
|
- Use Laravel features like `Event::fake()`, `assertAuthenticated()`, and model factories.
|
||||||
|
- Use `RefreshDatabase` for clean state per test.
|
||||||
|
- Interact with page: click, type, scroll, select, submit, drag-and-drop, touch gestures.
|
||||||
|
- Test on multiple browsers (Chrome, Firefox, Safari) if requested.
|
||||||
|
- Test on different devices/viewports (iPhone 14 Pro, tablets) if requested.
|
||||||
|
- Switch color schemes (light/dark mode) when appropriate.
|
||||||
|
- Take screenshots or pause tests for debugging.
|
||||||
|
|
||||||
|
<code-snippet name="Pest Browser Test Example" lang="php">
|
||||||
|
|
||||||
|
it('may reset the password', function () {
|
||||||
|
Notification::fake();
|
||||||
|
|
||||||
|
$this->actingAs(User::factory()->create());
|
||||||
|
|
||||||
|
$page = visit('/sign-in');
|
||||||
|
|
||||||
|
$page->assertSee('Sign In')
|
||||||
|
->assertNoJavascriptErrors()
|
||||||
|
->click('Forgot Password?')
|
||||||
|
->fill('email', 'nuno@laravel.com')
|
||||||
|
->click('Send Reset Link')
|
||||||
|
->assertSee('We have emailed your password reset link!');
|
||||||
|
|
||||||
|
Notification::assertSent(ResetPassword::class);
|
||||||
|
});
|
||||||
|
|
||||||
|
</code-snippet>
|
||||||
|
|
||||||
|
### Smoke Testing
|
||||||
|
|
||||||
|
Quickly validate multiple pages have no JavaScript errors:
|
||||||
|
|
||||||
|
<code-snippet name="Pest Smoke Testing Example" lang="php">
|
||||||
|
|
||||||
|
$pages = visit(['/', '/about', '/contact']);
|
||||||
|
|
||||||
|
$pages->assertNoJavascriptErrors()->assertNoConsoleLogs();
|
||||||
|
|
||||||
|
</code-snippet>
|
||||||
|
|
||||||
|
### Visual Regression Testing
|
||||||
|
|
||||||
|
Capture and compare screenshots to detect visual changes.
|
||||||
|
|
||||||
|
### Test Sharding
|
||||||
|
|
||||||
|
Split tests across parallel processes for faster CI runs.
|
||||||
|
|
||||||
|
### Architecture Testing
|
||||||
|
|
||||||
|
Pest 4 includes architecture testing (from Pest 3):
|
||||||
|
|
||||||
|
<code-snippet name="Architecture Test Example" lang="php">
|
||||||
|
|
||||||
|
arch('controllers')
|
||||||
|
->expect('App\Http\Controllers')
|
||||||
|
->toExtendNothing()
|
||||||
|
->toHaveSuffix('Controller');
|
||||||
|
|
||||||
|
</code-snippet>
|
||||||
|
|
||||||
|
## Common Pitfalls
|
||||||
|
|
||||||
|
- Not importing `use function Pest\Laravel\mock;` before using mock
|
||||||
|
- Using `assertStatus(200)` instead of `assertSuccessful()`
|
||||||
|
- Forgetting datasets for repetitive validation tests
|
||||||
|
- Deleting tests without approval
|
||||||
|
- Forgetting `assertNoJavascriptErrors()` in browser tests
|
||||||
|
|
@ -0,0 +1,124 @@
|
||||||
|
---
|
||||||
|
name: tailwindcss-development
|
||||||
|
description: >-
|
||||||
|
Styles applications using Tailwind CSS v4 utilities. Activates when adding styles, restyling components,
|
||||||
|
working with gradients, spacing, layout, flex, grid, responsive design, dark mode, colors,
|
||||||
|
typography, or borders; or when the user mentions CSS, styling, classes, Tailwind, restyle,
|
||||||
|
hero section, cards, buttons, or any visual/UI changes.
|
||||||
|
---
|
||||||
|
|
||||||
|
# Tailwind CSS Development
|
||||||
|
|
||||||
|
## When to Apply
|
||||||
|
|
||||||
|
Activate this skill when:
|
||||||
|
|
||||||
|
- Adding styles to components or pages
|
||||||
|
- Working with responsive design
|
||||||
|
- Implementing dark mode
|
||||||
|
- Extracting repeated patterns into components
|
||||||
|
- Debugging spacing or layout issues
|
||||||
|
|
||||||
|
## Documentation
|
||||||
|
|
||||||
|
Use `search-docs` for detailed Tailwind CSS v4 patterns and documentation.
|
||||||
|
|
||||||
|
## Basic Usage
|
||||||
|
|
||||||
|
- Use Tailwind CSS classes to style HTML. Check and follow existing Tailwind conventions in the project before introducing new patterns.
|
||||||
|
- Offer to extract repeated patterns into components that match the project's conventions (e.g., Blade, JSX, Vue).
|
||||||
|
- Consider class placement, order, priority, and defaults. Remove redundant classes, add classes to parent or child elements carefully to reduce repetition, and group elements logically.
|
||||||
|
|
||||||
|
## Tailwind CSS v4 Specifics
|
||||||
|
|
||||||
|
- Always use Tailwind CSS v4 and avoid deprecated utilities.
|
||||||
|
- `corePlugins` is not supported in Tailwind v4.
|
||||||
|
|
||||||
|
### CSS-First Configuration
|
||||||
|
|
||||||
|
In Tailwind v4, configuration is CSS-first using the `@theme` directive — no separate `tailwind.config.js` file is needed:
|
||||||
|
|
||||||
|
<code-snippet name="CSS-First Config" lang="css">
|
||||||
|
@theme {
|
||||||
|
--color-brand: oklch(0.72 0.11 178);
|
||||||
|
}
|
||||||
|
</code-snippet>
|
||||||
|
|
||||||
|
### Import Syntax
|
||||||
|
|
||||||
|
In Tailwind v4, import Tailwind with a regular CSS `@import` statement instead of the `@tailwind` directives used in v3:
|
||||||
|
|
||||||
|
<code-snippet name="v4 Import Syntax" lang="diff">
|
||||||
|
- @tailwind base;
|
||||||
|
- @tailwind components;
|
||||||
|
- @tailwind utilities;
|
||||||
|
+ @import "tailwindcss";
|
||||||
|
</code-snippet>
|
||||||
|
|
||||||
|
### Replaced Utilities
|
||||||
|
|
||||||
|
Tailwind v4 removed deprecated utilities. Use the replacements shown below. Opacity values remain numeric.
|
||||||
|
|
||||||
|
| Deprecated | Replacement |
|
||||||
|
|------------|-------------|
|
||||||
|
| bg-opacity-* | bg-black/* |
|
||||||
|
| text-opacity-* | text-black/* |
|
||||||
|
| border-opacity-* | border-black/* |
|
||||||
|
| divide-opacity-* | divide-black/* |
|
||||||
|
| ring-opacity-* | ring-black/* |
|
||||||
|
| placeholder-opacity-* | placeholder-black/* |
|
||||||
|
| flex-shrink-* | shrink-* |
|
||||||
|
| flex-grow-* | grow-* |
|
||||||
|
| overflow-ellipsis | text-ellipsis |
|
||||||
|
| decoration-slice | box-decoration-slice |
|
||||||
|
| decoration-clone | box-decoration-clone |
|
||||||
|
|
||||||
|
## Spacing
|
||||||
|
|
||||||
|
Use `gap` utilities instead of margins for spacing between siblings:
|
||||||
|
|
||||||
|
<code-snippet name="Gap Utilities" lang="html">
|
||||||
|
<div class="flex gap-8">
|
||||||
|
<div>Item 1</div>
|
||||||
|
<div>Item 2</div>
|
||||||
|
</div>
|
||||||
|
</code-snippet>
|
||||||
|
|
||||||
|
## Dark Mode
|
||||||
|
|
||||||
|
If existing pages and components support dark mode, new pages and components must support it the same way, typically using the `dark:` variant:
|
||||||
|
|
||||||
|
<code-snippet name="Dark Mode" lang="html">
|
||||||
|
<div class="bg-white dark:bg-gray-900 text-gray-900 dark:text-white">
|
||||||
|
Content adapts to color scheme
|
||||||
|
</div>
|
||||||
|
</code-snippet>
|
||||||
|
|
||||||
|
## Common Patterns
|
||||||
|
|
||||||
|
### Flexbox Layout
|
||||||
|
|
||||||
|
<code-snippet name="Flexbox Layout" lang="html">
|
||||||
|
<div class="flex items-center justify-between gap-4">
|
||||||
|
<div>Left content</div>
|
||||||
|
<div>Right content</div>
|
||||||
|
</div>
|
||||||
|
</code-snippet>
|
||||||
|
|
||||||
|
### Grid Layout
|
||||||
|
|
||||||
|
<code-snippet name="Grid Layout" lang="html">
|
||||||
|
<div class="grid grid-cols-1 md:grid-cols-2 lg:grid-cols-3 gap-6">
|
||||||
|
<div>Card 1</div>
|
||||||
|
<div>Card 2</div>
|
||||||
|
<div>Card 3</div>
|
||||||
|
</div>
|
||||||
|
</code-snippet>
|
||||||
|
|
||||||
|
## Common Pitfalls
|
||||||
|
|
||||||
|
- Using deprecated v3 utilities (bg-opacity-*, flex-shrink-*, etc.)
|
||||||
|
- Using `@tailwind` directives instead of `@import "tailwindcss"`
|
||||||
|
- Trying to use `tailwind.config.js` instead of CSS `@theme` directive
|
||||||
|
- Using margins for spacing between siblings instead of gap utilities
|
||||||
|
- Forgetting to add dark mode variants when the project uses dark mode
|
||||||
|
|
@ -0,0 +1,89 @@
|
||||||
|
---
|
||||||
|
name: wayfinder-development
|
||||||
|
description: >-
|
||||||
|
Activates whenever referencing backend routes in frontend components. Use when
|
||||||
|
importing from @/actions or @/routes, calling Laravel routes from TypeScript,
|
||||||
|
or working with Wayfinder route functions.
|
||||||
|
---
|
||||||
|
|
||||||
|
# Wayfinder Development
|
||||||
|
|
||||||
|
## When to Apply
|
||||||
|
|
||||||
|
Activate whenever referencing backend routes in frontend components:
|
||||||
|
- Importing from `@/actions/` or `@/routes/`
|
||||||
|
- Calling Laravel routes from TypeScript/JavaScript
|
||||||
|
- Creating links or navigation to backend endpoints
|
||||||
|
|
||||||
|
## Documentation
|
||||||
|
|
||||||
|
Use `search-docs` for detailed Wayfinder patterns and documentation.
|
||||||
|
|
||||||
|
## Quick Reference
|
||||||
|
|
||||||
|
### Generate Routes
|
||||||
|
|
||||||
|
Run after route changes if Vite plugin isn't installed:
|
||||||
|
|
||||||
|
php artisan wayfinder:generate --no-interaction
|
||||||
|
|
||||||
|
For form helpers, use `--with-form` flag:
|
||||||
|
|
||||||
|
php artisan wayfinder:generate --with-form --no-interaction
|
||||||
|
|
||||||
|
### Import Patterns
|
||||||
|
|
||||||
|
<code-snippet name="Controller Action Imports" lang="typescript">
|
||||||
|
|
||||||
|
// Named imports for tree-shaking (preferred)...
|
||||||
|
import { show, store, update } from '@/actions/App/Http/Controllers/PostController'
|
||||||
|
|
||||||
|
// Named route imports...
|
||||||
|
import { show as postShow } from '@/routes/post'
|
||||||
|
|
||||||
|
</code-snippet>
|
||||||
|
|
||||||
|
### Common Methods
|
||||||
|
|
||||||
|
<code-snippet name="Wayfinder Methods" lang="typescript">
|
||||||
|
|
||||||
|
// Get route object...
|
||||||
|
show(1) // { url: "/posts/1", method: "get" }
|
||||||
|
|
||||||
|
// Get URL string...
|
||||||
|
show.url(1) // "/posts/1"
|
||||||
|
|
||||||
|
// Specific HTTP methods...
|
||||||
|
show.get(1)
|
||||||
|
store.post()
|
||||||
|
update.patch(1)
|
||||||
|
destroy.delete(1)
|
||||||
|
|
||||||
|
// Form attributes for HTML forms...
|
||||||
|
store.form() // { action: "/posts", method: "post" }
|
||||||
|
|
||||||
|
// Query parameters...
|
||||||
|
show(1, { query: { page: 1 } }) // "/posts/1?page=1"
|
||||||
|
|
||||||
|
</code-snippet>
|
||||||
|
|
||||||
|
## Wayfinder + Inertia
|
||||||
|
|
||||||
|
Use Wayfinder with the `<Form>` component:
|
||||||
|
<code-snippet name="Wayfinder Form (React)" lang="typescript">
|
||||||
|
|
||||||
|
<Form {...store.form()}><input name="title" /></Form>
|
||||||
|
|
||||||
|
</code-snippet>
|
||||||
|
|
||||||
|
## Verification
|
||||||
|
|
||||||
|
1. Run `php artisan wayfinder:generate` to regenerate routes if Vite plugin isn't installed
|
||||||
|
2. Check TypeScript imports resolve correctly
|
||||||
|
3. Verify route URLs match expected paths
|
||||||
|
|
||||||
|
## Common Pitfalls
|
||||||
|
|
||||||
|
- Using default imports instead of named imports (breaks tree-shaking)
|
||||||
|
- Forgetting to regenerate after route changes
|
||||||
|
- Not using type-safe parameter objects for route model binding
|
||||||
|
|
@ -0,0 +1,329 @@
|
||||||
|
<laravel-boost-guidelines>
|
||||||
|
=== foundation rules ===
|
||||||
|
|
||||||
|
# Laravel Boost Guidelines
|
||||||
|
|
||||||
|
The Laravel Boost guidelines are specifically curated by Laravel maintainers for this application. These guidelines should be followed closely to ensure the best experience when building Laravel applications.
|
||||||
|
|
||||||
|
## Foundational Context
|
||||||
|
|
||||||
|
This application is a Laravel application and its main Laravel ecosystems package & versions are below. You are an expert with them all. Ensure you abide by these specific packages & versions.
|
||||||
|
|
||||||
|
- php - 8.4.1
|
||||||
|
- inertiajs/inertia-laravel (INERTIA) - v2
|
||||||
|
- laravel/cashier (CASHIER) - v16
|
||||||
|
- laravel/fortify (FORTIFY) - v1
|
||||||
|
- laravel/framework (LARAVEL) - v12
|
||||||
|
- laravel/pennant (PENNANT) - v1
|
||||||
|
- laravel/prompts (PROMPTS) - v0
|
||||||
|
- laravel/wayfinder (WAYFINDER) - v0
|
||||||
|
- laravel/mcp (MCP) - v0
|
||||||
|
- laravel/pint (PINT) - v1
|
||||||
|
- laravel/sail (SAIL) - v1
|
||||||
|
- pestphp/pest (PEST) - v4
|
||||||
|
- phpunit/phpunit (PHPUNIT) - v12
|
||||||
|
- @inertiajs/react (INERTIA) - v2
|
||||||
|
- react (REACT) - v19
|
||||||
|
- tailwindcss (TAILWINDCSS) - v4
|
||||||
|
- @laravel/vite-plugin-wayfinder (WAYFINDER) - v0
|
||||||
|
- eslint (ESLINT) - v9
|
||||||
|
- prettier (PRETTIER) - v3
|
||||||
|
|
||||||
|
## Skills Activation
|
||||||
|
|
||||||
|
This project has domain-specific skills available. You MUST activate the relevant skill whenever you work in that domain—don't wait until you're stuck.
|
||||||
|
|
||||||
|
- `pennant-development` — Manages feature flags with Laravel Pennant. Activates when creating, checking, or toggling feature flags; showing or hiding features conditionally; implementing A/B testing; working with @feature directive; or when the user mentions feature flags, feature toggles, Pennant, conditional features, rollouts, or gradually enabling features.
|
||||||
|
- `wayfinder-development` — Activates whenever referencing backend routes in frontend components. Use when importing from @/actions or @/routes, calling Laravel routes from TypeScript, or working with Wayfinder route functions.
|
||||||
|
- `pest-testing` — Tests applications using the Pest 4 PHP framework. Activates when writing tests, creating unit or feature tests, adding assertions, testing Livewire components, browser testing, debugging test failures, working with datasets or mocking; or when the user mentions test, spec, TDD, expects, assertion, coverage, or needs to verify functionality works.
|
||||||
|
- `inertia-react-development` — Develops Inertia.js v2 React client-side applications. Activates when creating React pages, forms, or navigation; using <Link>, <Form>, useForm, or router; working with deferred props, prefetching, or polling; or when user mentions React with Inertia, React pages, React forms, or React navigation.
|
||||||
|
- `tailwindcss-development` — Styles applications using Tailwind CSS v4 utilities. Activates when adding styles, restyling components, working with gradients, spacing, layout, flex, grid, responsive design, dark mode, colors, typography, or borders; or when the user mentions CSS, styling, classes, Tailwind, restyle, hero section, cards, buttons, or any visual/UI changes.
|
||||||
|
|
||||||
|
## Conventions
|
||||||
|
|
||||||
|
- You must follow all existing code conventions used in this application. When creating or editing a file, check sibling files for the correct structure, approach, and naming.
|
||||||
|
- Use descriptive names for variables and methods. For example, `isRegisteredForDiscounts`, not `discount()`.
|
||||||
|
- Check for existing components to reuse before writing a new one.
|
||||||
|
|
||||||
|
## Verification Scripts
|
||||||
|
|
||||||
|
- Do not create verification scripts or tinker when tests cover that functionality and prove they work. Unit and feature tests are more important.
|
||||||
|
|
||||||
|
## Application Structure & Architecture
|
||||||
|
|
||||||
|
- Stick to existing directory structure; don't create new base folders without approval.
|
||||||
|
- Do not change the application's dependencies without approval.
|
||||||
|
|
||||||
|
## Frontend Bundling
|
||||||
|
|
||||||
|
- If the user doesn't see a frontend change reflected in the UI, it could mean they need to run `npm run build`, `npm run dev`, or `composer run dev`. Ask them.
|
||||||
|
|
||||||
|
## Documentation Files
|
||||||
|
|
||||||
|
- You must only create documentation files if explicitly requested by the user.
|
||||||
|
|
||||||
|
## Replies
|
||||||
|
|
||||||
|
- Be concise in your explanations - focus on what's important rather than explaining obvious details.
|
||||||
|
|
||||||
|
=== boost rules ===
|
||||||
|
|
||||||
|
# Laravel Boost
|
||||||
|
|
||||||
|
- Laravel Boost is an MCP server that comes with powerful tools designed specifically for this application. Use them.
|
||||||
|
|
||||||
|
## Artisan
|
||||||
|
|
||||||
|
- Use the `list-artisan-commands` tool when you need to call an Artisan command to double-check the available parameters.
|
||||||
|
|
||||||
|
## URLs
|
||||||
|
|
||||||
|
- Whenever you share a project URL with the user, you should use the `get-absolute-url` tool to ensure you're using the correct scheme, domain/IP, and port.
|
||||||
|
|
||||||
|
## Tinker / Debugging
|
||||||
|
|
||||||
|
- You should use the `tinker` tool when you need to execute PHP to debug code or query Eloquent models directly.
|
||||||
|
- Use the `database-query` tool when you only need to read from the database.
|
||||||
|
|
||||||
|
## Reading Browser Logs With the `browser-logs` Tool
|
||||||
|
|
||||||
|
- You can read browser logs, errors, and exceptions using the `browser-logs` tool from Boost.
|
||||||
|
- Only recent browser logs will be useful - ignore old logs.
|
||||||
|
|
||||||
|
## Searching Documentation (Critically Important)
|
||||||
|
|
||||||
|
- Boost comes with a powerful `search-docs` tool you should use before trying other approaches when working with Laravel or Laravel ecosystem packages. This tool automatically passes a list of installed packages and their versions to the remote Boost API, so it returns only version-specific documentation for the user's circumstance. You should pass an array of packages to filter on if you know you need docs for particular packages.
|
||||||
|
- Search the documentation before making code changes to ensure we are taking the correct approach.
|
||||||
|
- Use multiple, broad, simple, topic-based queries at once. For example: `['rate limiting', 'routing rate limiting', 'routing']`. The most relevant results will be returned first.
|
||||||
|
- Do not add package names to queries; package information is already shared. For example, use `test resource table`, not `filament 4 test resource table`.
|
||||||
|
|
||||||
|
### Available Search Syntax
|
||||||
|
|
||||||
|
1. Simple Word Searches with auto-stemming - query=authentication - finds 'authenticate' and 'auth'.
|
||||||
|
2. Multiple Words (AND Logic) - query=rate limit - finds knowledge containing both "rate" AND "limit".
|
||||||
|
3. Quoted Phrases (Exact Position) - query="infinite scroll" - words must be adjacent and in that order.
|
||||||
|
4. Mixed Queries - query=middleware "rate limit" - "middleware" AND exact phrase "rate limit".
|
||||||
|
5. Multiple Queries - queries=["authentication", "middleware"] - ANY of these terms.
|
||||||
|
|
||||||
|
=== php rules ===
|
||||||
|
|
||||||
|
# PHP
|
||||||
|
|
||||||
|
- Always use curly braces for control structures, even for single-line bodies.
|
||||||
|
|
||||||
|
## Constructors
|
||||||
|
|
||||||
|
- Use PHP 8 constructor property promotion in `__construct()`.
|
||||||
|
- <code-snippet>public function __construct(public GitHub $github) { }</code-snippet>
|
||||||
|
- Do not allow empty `__construct()` methods with zero parameters unless the constructor is private.
|
||||||
|
|
||||||
|
## Type Declarations
|
||||||
|
|
||||||
|
- Always use explicit return type declarations for methods and functions.
|
||||||
|
- Use appropriate PHP type hints for method parameters.
|
||||||
|
|
||||||
|
<code-snippet name="Explicit Return Types and Method Params" lang="php">
|
||||||
|
protected function isAccessible(User $user, ?string $path = null): bool
|
||||||
|
{
|
||||||
|
...
|
||||||
|
}
|
||||||
|
</code-snippet>
|
||||||
|
|
||||||
|
## Enums
|
||||||
|
|
||||||
|
- Typically, keys in an Enum should be TitleCase. For example: `FavoritePerson`, `BestLake`, `Monthly`.
|
||||||
|
|
||||||
|
## Comments
|
||||||
|
|
||||||
|
- Prefer PHPDoc blocks over inline comments. Never use comments within the code itself unless the logic is exceptionally complex.
|
||||||
|
|
||||||
|
## PHPDoc Blocks
|
||||||
|
|
||||||
|
- Add useful array shape type definitions when appropriate.
|
||||||
|
|
||||||
|
=== tests rules ===
|
||||||
|
|
||||||
|
# Test Enforcement
|
||||||
|
|
||||||
|
- Every change must be programmatically tested. Write a new test or update an existing test, then run the affected tests to make sure they pass.
|
||||||
|
- Run the minimum number of tests needed to ensure code quality and speed. Use `php artisan test --compact` with a specific filename or filter.
|
||||||
|
|
||||||
|
=== inertia-laravel/core rules ===
|
||||||
|
|
||||||
|
# Inertia
|
||||||
|
|
||||||
|
- Inertia creates fully client-side rendered SPAs without modern SPA complexity, leveraging existing server-side patterns.
|
||||||
|
- Components live in `resources/js/Pages` (unless specified in `vite.config.js`). Use `Inertia::render()` for server-side routing instead of Blade views.
|
||||||
|
- ALWAYS use `search-docs` tool for version-specific Inertia documentation and updated code examples.
|
||||||
|
- IMPORTANT: Activate `inertia-react-development` when working with Inertia client-side patterns.
|
||||||
|
|
||||||
|
=== inertia-laravel/v2 rules ===
|
||||||
|
|
||||||
|
# Inertia v2
|
||||||
|
|
||||||
|
- Use all Inertia features from v1 and v2. Check the documentation before making changes to ensure the correct approach.
|
||||||
|
- New features: deferred props, infinite scrolling (merging props + `WhenVisible`), lazy loading on scroll, polling, prefetching.
|
||||||
|
- When using deferred props, add an empty state with a pulsing or animated skeleton.
|
||||||
|
|
||||||
|
=== laravel/core rules ===
|
||||||
|
|
||||||
|
# Do Things the Laravel Way
|
||||||
|
|
||||||
|
- Use `php artisan make:` commands to create new files (i.e. migrations, controllers, models, etc.). You can list available Artisan commands using the `list-artisan-commands` tool.
|
||||||
|
- If you're creating a generic PHP class, use `php artisan make:class`.
|
||||||
|
- Pass `--no-interaction` to all Artisan commands to ensure they work without user input. You should also pass the correct `--options` to ensure correct behavior.
|
||||||
|
|
||||||
|
## Database
|
||||||
|
|
||||||
|
- Always use proper Eloquent relationship methods with return type hints. Prefer relationship methods over raw queries or manual joins.
|
||||||
|
- Use Eloquent models and relationships before suggesting raw database queries.
|
||||||
|
- Avoid `DB::`; prefer `Model::query()`. Generate code that leverages Laravel's ORM capabilities rather than bypassing them.
|
||||||
|
- Generate code that prevents N+1 query problems by using eager loading.
|
||||||
|
- Use Laravel's query builder for very complex database operations.
|
||||||
|
|
||||||
|
### Model Creation
|
||||||
|
|
||||||
|
- When creating new models, create useful factories and seeders for them too. Ask the user if they need any other things, using `list-artisan-commands` to check the available options to `php artisan make:model`.
|
||||||
|
|
||||||
|
### APIs & Eloquent Resources
|
||||||
|
|
||||||
|
- For APIs, default to using Eloquent API Resources and API versioning unless existing API routes do not, then you should follow existing application convention.
|
||||||
|
|
||||||
|
## Controllers & Validation
|
||||||
|
|
||||||
|
- Always create Form Request classes for validation rather than inline validation in controllers. Include both validation rules and custom error messages.
|
||||||
|
- Check sibling Form Requests to see if the application uses array or string based validation rules.
|
||||||
|
|
||||||
|
## Authentication & Authorization
|
||||||
|
|
||||||
|
- Use Laravel's built-in authentication and authorization features (gates, policies, Sanctum, etc.).
|
||||||
|
|
||||||
|
## URL Generation
|
||||||
|
|
||||||
|
- When generating links to other pages, prefer named routes and the `route()` function.
|
||||||
|
|
||||||
|
## Queues
|
||||||
|
|
||||||
|
- Use queued jobs for time-consuming operations with the `ShouldQueue` interface.
|
||||||
|
|
||||||
|
## Configuration
|
||||||
|
|
||||||
|
- Use environment variables only in configuration files - never use the `env()` function directly outside of config files. Always use `config('app.name')`, not `env('APP_NAME')`.
|
||||||
|
|
||||||
|
## Testing
|
||||||
|
|
||||||
|
- When creating models for tests, use the factories for the models. Check if the factory has custom states that can be used before manually setting up the model.
|
||||||
|
- Faker: Use methods such as `$this->faker->word()` or `fake()->randomDigit()`. Follow existing conventions whether to use `$this->faker` or `fake()`.
|
||||||
|
- When creating tests, make use of `php artisan make:test [options] {name}` to create a feature test, and pass `--unit` to create a unit test. Most tests should be feature tests.
|
||||||
|
|
||||||
|
## Vite Error
|
||||||
|
|
||||||
|
- If you receive an "Illuminate\Foundation\ViteException: Unable to locate file in Vite manifest" error, you can run `npm run build` or ask the user to run `npm run dev` or `composer run dev`.
|
||||||
|
|
||||||
|
=== laravel/v12 rules ===
|
||||||
|
|
||||||
|
# Laravel 12
|
||||||
|
|
||||||
|
- CRITICAL: ALWAYS use `search-docs` tool for version-specific Laravel documentation and updated code examples.
|
||||||
|
- Since Laravel 11, Laravel has a new streamlined file structure which this project uses.
|
||||||
|
|
||||||
|
## Laravel 12 Structure
|
||||||
|
|
||||||
|
- In Laravel 12, middleware are no longer registered in `app/Http/Kernel.php`.
|
||||||
|
- Middleware are configured declaratively in `bootstrap/app.php` using `Application::configure()->withMiddleware()`.
|
||||||
|
- `bootstrap/app.php` is the file to register middleware, exceptions, and routing files.
|
||||||
|
- `bootstrap/providers.php` contains application specific service providers.
|
||||||
|
- The `app\Console\Kernel.php` file no longer exists; use `bootstrap/app.php` or `routes/console.php` for console configuration.
|
||||||
|
- Console commands in `app/Console/Commands/` are automatically available and do not require manual registration.
|
||||||
|
|
||||||
|
## Database
|
||||||
|
|
||||||
|
- When modifying a column, the migration must include all of the attributes that were previously defined on the column. Otherwise, they will be dropped and lost.
|
||||||
|
- Laravel 12 allows limiting eagerly loaded records natively, without external packages: `$query->latest()->limit(10);`.
|
||||||
|
|
||||||
|
### Models
|
||||||
|
|
||||||
|
- Casts can and likely should be set in a `casts()` method on a model rather than the `$casts` property. Follow existing conventions from other models.
|
||||||
|
|
||||||
|
=== pennant/core rules ===
|
||||||
|
|
||||||
|
# Laravel Pennant
|
||||||
|
|
||||||
|
- This application uses Laravel Pennant for feature flag management, providing a flexible system for controlling feature availability across different organizations and user types.
|
||||||
|
- IMPORTANT: Always use `search-docs` tool for version-specific Pennant documentation and updated code examples.
|
||||||
|
- IMPORTANT: Activate `pennant-development` every time you're working with a Pennant or feature-flag-related task.
|
||||||
|
|
||||||
|
=== wayfinder/core rules ===
|
||||||
|
|
||||||
|
# Laravel Wayfinder
|
||||||
|
|
||||||
|
Wayfinder generates TypeScript functions for Laravel routes. Import from `@/actions/` (controllers) or `@/routes/` (named routes).
|
||||||
|
|
||||||
|
- IMPORTANT: Activate `wayfinder-development` skill whenever referencing backend routes in frontend components.
|
||||||
|
- Invokable Controllers: `import StorePost from '@/actions/.../StorePostController'; StorePost()`.
|
||||||
|
- Parameter Binding: Detects route keys (`{post:slug}`) — `show({ slug: "my-post" })`.
|
||||||
|
- Query Merging: `show(1, { mergeQuery: { page: 2, sort: null } })` merges with current URL, `null` removes params.
|
||||||
|
- Inertia: Use `.form()` with `<Form>` component or `form.submit(store())` with useForm.
|
||||||
|
|
||||||
|
=== pint/core rules ===
|
||||||
|
|
||||||
|
# Laravel Pint Code Formatter
|
||||||
|
|
||||||
|
- You must run `vendor/bin/pint --dirty` before finalizing changes to ensure your code matches the project's expected style.
|
||||||
|
- Do not run `vendor/bin/pint --test`, simply run `vendor/bin/pint` to fix any formatting issues.
|
||||||
|
|
||||||
|
=== pest/core rules ===
|
||||||
|
|
||||||
|
## Pest
|
||||||
|
|
||||||
|
- This project uses Pest for testing. Create tests: `php artisan make:test --pest {name}`.
|
||||||
|
- Run tests: `php artisan test --compact` or filter: `php artisan test --compact --filter=testName`.
|
||||||
|
- Do NOT delete tests without approval.
|
||||||
|
- CRITICAL: ALWAYS use `search-docs` tool for version-specific Pest documentation and updated code examples.
|
||||||
|
- IMPORTANT: Activate `pest-testing` every time you're working with a Pest or testing-related task.
|
||||||
|
|
||||||
|
=== inertia-react/core rules ===
|
||||||
|
|
||||||
|
# Inertia + React
|
||||||
|
|
||||||
|
- IMPORTANT: Activate `inertia-react-development` when working with Inertia React client-side patterns.
|
||||||
|
|
||||||
|
=== tailwindcss/core rules ===
|
||||||
|
|
||||||
|
# Tailwind CSS
|
||||||
|
|
||||||
|
- Always use existing Tailwind conventions; check project patterns before adding new ones.
|
||||||
|
- IMPORTANT: Always use `search-docs` tool for version-specific Tailwind CSS documentation and updated code examples. Never rely on training data.
|
||||||
|
- IMPORTANT: Activate `tailwindcss-development` every time you're working with a Tailwind CSS or styling-related task.
|
||||||
|
|
||||||
|
=== laravel/fortify rules ===
|
||||||
|
|
||||||
|
## Laravel Fortify
|
||||||
|
|
||||||
|
Fortify is a headless authentication backend that provides authentication routes and controllers for Laravel applications.
|
||||||
|
|
||||||
|
**Before implementing any authentication features, use the `search-docs` tool to get the latest docs for that specific feature.**
|
||||||
|
|
||||||
|
### Configuration & Setup
|
||||||
|
|
||||||
|
- Check `config/fortify.php` to see what's enabled. Use `search-docs` for detailed information on specific features.
|
||||||
|
- Enable features by adding them to the `'features' => []` array: `Features::registration()`, `Features::resetPasswords()`, etc.
|
||||||
|
- To see the all Fortify registered routes, use the `list-routes` tool with the `only_vendor: true` and `action: "Fortify"` parameters.
|
||||||
|
- Fortify includes view routes by default (login, register). Set `'views' => false` in the configuration file to disable them if you're handling views yourself.
|
||||||
|
|
||||||
|
### Customization
|
||||||
|
|
||||||
|
- Views can be customized in `FortifyServiceProvider`'s `boot()` method using `Fortify::loginView()`, `Fortify::registerView()`, etc.
|
||||||
|
- Customize authentication logic with `Fortify::authenticateUsing()` for custom user retrieval / validation.
|
||||||
|
- Actions in `app/Actions/Fortify/` handle business logic (user creation, password reset, etc.). They're fully customizable, so you can modify them to change feature behavior.
|
||||||
|
|
||||||
|
## Available Features
|
||||||
|
|
||||||
|
- `Features::registration()` for user registration.
|
||||||
|
- `Features::emailVerification()` to verify new user emails.
|
||||||
|
- `Features::twoFactorAuthentication()` for 2FA with QR codes and recovery codes.
|
||||||
|
- Add options: `['confirmPassword' => true, 'confirm' => true]` to require password confirmation and OTP confirmation before enabling 2FA.
|
||||||
|
- `Features::updateProfileInformation()` to let users update their profile.
|
||||||
|
- `Features::updatePasswords()` to let users change their passwords.
|
||||||
|
- `Features::resetPasswords()` for password reset via email.
|
||||||
|
</laravel-boost-guidelines>
|
||||||
487
CLAUDE.md
487
CLAUDE.md
|
|
@ -91,9 +91,10 @@ show.url(1) // "/posts/1"
|
||||||
|
|
||||||
# Laravel Boost Guidelines
|
# Laravel Boost Guidelines
|
||||||
|
|
||||||
The Laravel Boost guidelines are specifically curated by Laravel maintainers for this application. These guidelines should be followed closely to enhance the user's satisfaction building Laravel applications.
|
The Laravel Boost guidelines are specifically curated by Laravel maintainers for this application. These guidelines should be followed closely to ensure the best experience when building Laravel applications.
|
||||||
|
|
||||||
## Foundational Context
|
## Foundational Context
|
||||||
|
|
||||||
This application is a Laravel application and its main Laravel ecosystems package & versions are below. You are an expert with them all. Ensure you abide by these specific packages & versions.
|
This application is a Laravel application and its main Laravel ecosystems package & versions are below. You are an expert with them all. Ensure you abide by these specific packages & versions.
|
||||||
|
|
||||||
- php - 8.4.1
|
- php - 8.4.1
|
||||||
|
|
@ -101,6 +102,7 @@ This application is a Laravel application and its main Laravel ecosystems packag
|
||||||
- laravel/cashier (CASHIER) - v16
|
- laravel/cashier (CASHIER) - v16
|
||||||
- laravel/fortify (FORTIFY) - v1
|
- laravel/fortify (FORTIFY) - v1
|
||||||
- laravel/framework (LARAVEL) - v12
|
- laravel/framework (LARAVEL) - v12
|
||||||
|
- laravel/pennant (PENNANT) - v1
|
||||||
- laravel/prompts (PROMPTS) - v0
|
- laravel/prompts (PROMPTS) - v0
|
||||||
- laravel/wayfinder (WAYFINDER) - v0
|
- laravel/wayfinder (WAYFINDER) - v0
|
||||||
- laravel/mcp (MCP) - v0
|
- laravel/mcp (MCP) - v0
|
||||||
|
|
@ -115,77 +117,96 @@ This application is a Laravel application and its main Laravel ecosystems packag
|
||||||
- eslint (ESLINT) - v9
|
- eslint (ESLINT) - v9
|
||||||
- prettier (PRETTIER) - v3
|
- prettier (PRETTIER) - v3
|
||||||
|
|
||||||
|
## Skills Activation
|
||||||
|
|
||||||
|
This project has domain-specific skills available. You MUST activate the relevant skill whenever you work in that domain—don't wait until you're stuck.
|
||||||
|
|
||||||
|
- `pennant-development` — Manages feature flags with Laravel Pennant. Activates when creating, checking, or toggling feature flags; showing or hiding features conditionally; implementing A/B testing; working with @feature directive; or when the user mentions feature flags, feature toggles, Pennant, conditional features, rollouts, or gradually enabling features.
|
||||||
|
- `wayfinder-development` — Activates whenever referencing backend routes in frontend components. Use when importing from @/actions or @/routes, calling Laravel routes from TypeScript, or working with Wayfinder route functions.
|
||||||
|
- `pest-testing` — Tests applications using the Pest 4 PHP framework. Activates when writing tests, creating unit or feature tests, adding assertions, testing Livewire components, browser testing, debugging test failures, working with datasets or mocking; or when the user mentions test, spec, TDD, expects, assertion, coverage, or needs to verify functionality works.
|
||||||
|
- `inertia-react-development` — Develops Inertia.js v2 React client-side applications. Activates when creating React pages, forms, or navigation; using <Link>, <Form>, useForm, or router; working with deferred props, prefetching, or polling; or when user mentions React with Inertia, React pages, React forms, or React navigation.
|
||||||
|
- `tailwindcss-development` — Styles applications using Tailwind CSS v4 utilities. Activates when adding styles, restyling components, working with gradients, spacing, layout, flex, grid, responsive design, dark mode, colors, typography, or borders; or when the user mentions CSS, styling, classes, Tailwind, restyle, hero section, cards, buttons, or any visual/UI changes.
|
||||||
|
|
||||||
## Conventions
|
## Conventions
|
||||||
- You must follow all existing code conventions used in this application. When creating or editing a file, check sibling files for the correct structure, approach, naming.
|
|
||||||
|
- You must follow all existing code conventions used in this application. When creating or editing a file, check sibling files for the correct structure, approach, and naming.
|
||||||
- Use descriptive names for variables and methods. For example, `isRegisteredForDiscounts`, not `discount()`.
|
- Use descriptive names for variables and methods. For example, `isRegisteredForDiscounts`, not `discount()`.
|
||||||
- Check for existing components to reuse before writing a new one.
|
- Check for existing components to reuse before writing a new one.
|
||||||
|
|
||||||
## Verification Scripts
|
## Verification Scripts
|
||||||
- Do not create verification scripts or tinker when tests cover that functionality and prove it works. Unit and feature tests are more important.
|
|
||||||
|
- Do not create verification scripts or tinker when tests cover that functionality and prove they work. Unit and feature tests are more important.
|
||||||
|
|
||||||
## Application Structure & Architecture
|
## Application Structure & Architecture
|
||||||
- Stick to existing directory structure - don't create new base folders without approval.
|
|
||||||
|
- Stick to existing directory structure; don't create new base folders without approval.
|
||||||
- Do not change the application's dependencies without approval.
|
- Do not change the application's dependencies without approval.
|
||||||
|
|
||||||
## Frontend Bundling
|
## Frontend Bundling
|
||||||
|
|
||||||
- If the user doesn't see a frontend change reflected in the UI, it could mean they need to run `npm run build`, `npm run dev`, or `composer run dev`. Ask them.
|
- If the user doesn't see a frontend change reflected in the UI, it could mean they need to run `npm run build`, `npm run dev`, or `composer run dev`. Ask them.
|
||||||
|
|
||||||
## Replies
|
|
||||||
- Be concise in your explanations - focus on what's important rather than explaining obvious details.
|
|
||||||
|
|
||||||
## Documentation Files
|
## Documentation Files
|
||||||
|
|
||||||
- You must only create documentation files if explicitly requested by the user.
|
- You must only create documentation files if explicitly requested by the user.
|
||||||
|
|
||||||
|
## Replies
|
||||||
|
|
||||||
|
- Be concise in your explanations - focus on what's important rather than explaining obvious details.
|
||||||
|
|
||||||
=== boost rules ===
|
=== boost rules ===
|
||||||
|
|
||||||
## Laravel Boost
|
# Laravel Boost
|
||||||
|
|
||||||
- Laravel Boost is an MCP server that comes with powerful tools designed specifically for this application. Use them.
|
- Laravel Boost is an MCP server that comes with powerful tools designed specifically for this application. Use them.
|
||||||
|
|
||||||
## Artisan
|
## Artisan
|
||||||
- Use the `list-artisan-commands` tool when you need to call an Artisan command to double check the available parameters.
|
|
||||||
|
- Use the `list-artisan-commands` tool when you need to call an Artisan command to double-check the available parameters.
|
||||||
|
|
||||||
## URLs
|
## URLs
|
||||||
- Whenever you share a project URL with the user you should use the `get-absolute-url` tool to ensure you're using the correct scheme, domain / IP, and port.
|
|
||||||
|
- Whenever you share a project URL with the user, you should use the `get-absolute-url` tool to ensure you're using the correct scheme, domain/IP, and port.
|
||||||
|
|
||||||
## Tinker / Debugging
|
## Tinker / Debugging
|
||||||
|
|
||||||
- You should use the `tinker` tool when you need to execute PHP to debug code or query Eloquent models directly.
|
- You should use the `tinker` tool when you need to execute PHP to debug code or query Eloquent models directly.
|
||||||
- Use the `database-query` tool when you only need to read from the database.
|
- Use the `database-query` tool when you only need to read from the database.
|
||||||
|
|
||||||
## Reading Browser Logs With the `browser-logs` Tool
|
## Reading Browser Logs With the `browser-logs` Tool
|
||||||
|
|
||||||
- You can read browser logs, errors, and exceptions using the `browser-logs` tool from Boost.
|
- You can read browser logs, errors, and exceptions using the `browser-logs` tool from Boost.
|
||||||
- Only recent browser logs will be useful - ignore old logs.
|
- Only recent browser logs will be useful - ignore old logs.
|
||||||
|
|
||||||
## Searching Documentation (Critically Important)
|
## Searching Documentation (Critically Important)
|
||||||
- Boost comes with a powerful `search-docs` tool you should use before any other approaches. This tool automatically passes a list of installed packages and their versions to the remote Boost API, so it returns only version-specific documentation specific for the user's circumstance. You should pass an array of packages to filter on if you know you need docs for particular packages.
|
|
||||||
- The 'search-docs' tool is perfect for all Laravel related packages, including Laravel, Inertia, Livewire, Filament, Tailwind, Pest, Nova, Nightwatch, etc.
|
- Boost comes with a powerful `search-docs` tool you should use before trying other approaches when working with Laravel or Laravel ecosystem packages. This tool automatically passes a list of installed packages and their versions to the remote Boost API, so it returns only version-specific documentation for the user's circumstance. You should pass an array of packages to filter on if you know you need docs for particular packages.
|
||||||
- You must use this tool to search for Laravel-ecosystem documentation before falling back to other approaches.
|
|
||||||
- Search the documentation before making code changes to ensure we are taking the correct approach.
|
- Search the documentation before making code changes to ensure we are taking the correct approach.
|
||||||
- Use multiple, broad, simple, topic based queries to start. For example: `['rate limiting', 'routing rate limiting', 'routing']`.
|
- Use multiple, broad, simple, topic-based queries at once. For example: `['rate limiting', 'routing rate limiting', 'routing']`. The most relevant results will be returned first.
|
||||||
- Do not add package names to queries - package information is already shared. For example, use `test resource table`, not `filament 4 test resource table`.
|
- Do not add package names to queries; package information is already shared. For example, use `test resource table`, not `filament 4 test resource table`.
|
||||||
|
|
||||||
### Available Search Syntax
|
### Available Search Syntax
|
||||||
- You can and should pass multiple queries at once. The most relevant results will be returned first.
|
|
||||||
|
|
||||||
1. Simple Word Searches with auto-stemming - query=authentication - finds 'authenticate' and 'auth'
|
|
||||||
2. Multiple Words (AND Logic) - query=rate limit - finds knowledge containing both "rate" AND "limit"
|
|
||||||
3. Quoted Phrases (Exact Position) - query="infinite scroll" - Words must be adjacent and in that order
|
|
||||||
4. Mixed Queries - query=middleware "rate limit" - "middleware" AND exact phrase "rate limit"
|
|
||||||
5. Multiple Queries - queries=["authentication", "middleware"] - ANY of these terms
|
|
||||||
|
|
||||||
|
1. Simple Word Searches with auto-stemming - query=authentication - finds 'authenticate' and 'auth'.
|
||||||
|
2. Multiple Words (AND Logic) - query=rate limit - finds knowledge containing both "rate" AND "limit".
|
||||||
|
3. Quoted Phrases (Exact Position) - query="infinite scroll" - words must be adjacent and in that order.
|
||||||
|
4. Mixed Queries - query=middleware "rate limit" - "middleware" AND exact phrase "rate limit".
|
||||||
|
5. Multiple Queries - queries=["authentication", "middleware"] - ANY of these terms.
|
||||||
|
|
||||||
=== php rules ===
|
=== php rules ===
|
||||||
|
|
||||||
## PHP
|
# PHP
|
||||||
|
|
||||||
- Always use curly braces for control structures, even if it has one line.
|
- Always use curly braces for control structures, even for single-line bodies.
|
||||||
|
|
||||||
|
## Constructors
|
||||||
|
|
||||||
### Constructors
|
|
||||||
- Use PHP 8 constructor property promotion in `__construct()`.
|
- Use PHP 8 constructor property promotion in `__construct()`.
|
||||||
- <code-snippet>public function __construct(public GitHub $github) { }</code-snippet>
|
- <code-snippet>public function __construct(public GitHub $github) { }</code-snippet>
|
||||||
- Do not allow empty `__construct()` methods with zero parameters.
|
- Do not allow empty `__construct()` methods with zero parameters unless the constructor is private.
|
||||||
|
|
||||||
|
## Type Declarations
|
||||||
|
|
||||||
### Type Declarations
|
|
||||||
- Always use explicit return type declarations for methods and functions.
|
- Always use explicit return type declarations for methods and functions.
|
||||||
- Use appropriate PHP type hints for method parameters.
|
- Use appropriate PHP type hints for method parameters.
|
||||||
|
|
||||||
|
|
@ -196,411 +217,172 @@ protected function isAccessible(User $user, ?string $path = null): bool
|
||||||
}
|
}
|
||||||
</code-snippet>
|
</code-snippet>
|
||||||
|
|
||||||
## Comments
|
|
||||||
- Prefer PHPDoc blocks over comments. Never use comments within the code itself unless there is something _very_ complex going on.
|
|
||||||
|
|
||||||
## PHPDoc Blocks
|
|
||||||
- Add useful array shape type definitions for arrays when appropriate.
|
|
||||||
|
|
||||||
## Enums
|
## Enums
|
||||||
|
|
||||||
- Typically, keys in an Enum should be TitleCase. For example: `FavoritePerson`, `BestLake`, `Monthly`.
|
- Typically, keys in an Enum should be TitleCase. For example: `FavoritePerson`, `BestLake`, `Monthly`.
|
||||||
|
|
||||||
|
## Comments
|
||||||
|
|
||||||
|
- Prefer PHPDoc blocks over inline comments. Never use comments within the code itself unless the logic is exceptionally complex.
|
||||||
|
|
||||||
|
## PHPDoc Blocks
|
||||||
|
|
||||||
|
- Add useful array shape type definitions when appropriate.
|
||||||
|
|
||||||
|
=== tests rules ===
|
||||||
|
|
||||||
|
# Test Enforcement
|
||||||
|
|
||||||
|
- Every change must be programmatically tested. Write a new test or update an existing test, then run the affected tests to make sure they pass.
|
||||||
|
- Run the minimum number of tests needed to ensure code quality and speed. Use `php artisan test --compact` with a specific filename or filter.
|
||||||
|
|
||||||
=== inertia-laravel/core rules ===
|
=== inertia-laravel/core rules ===
|
||||||
|
|
||||||
## Inertia Core
|
# Inertia
|
||||||
|
|
||||||
- Inertia.js components should be placed in the `resources/js/Pages` directory unless specified differently in the JS bundler (vite.config.js).
|
|
||||||
- Use `Inertia::render()` for server-side routing instead of traditional Blade views.
|
|
||||||
- Use `search-docs` for accurate guidance on all things Inertia.
|
|
||||||
|
|
||||||
<code-snippet lang="php" name="Inertia::render Example">
|
|
||||||
// routes/web.php example
|
|
||||||
Route::get('/users', function () {
|
|
||||||
return Inertia::render('Users/Index', [
|
|
||||||
'users' => User::all()
|
|
||||||
]);
|
|
||||||
});
|
|
||||||
</code-snippet>
|
|
||||||
|
|
||||||
|
- Inertia creates fully client-side rendered SPAs without modern SPA complexity, leveraging existing server-side patterns.
|
||||||
|
- Components live in `resources/js/Pages` (unless specified in `vite.config.js`). Use `Inertia::render()` for server-side routing instead of Blade views.
|
||||||
|
- ALWAYS use `search-docs` tool for version-specific Inertia documentation and updated code examples.
|
||||||
|
- IMPORTANT: Activate `inertia-react-development` when working with Inertia client-side patterns.
|
||||||
|
|
||||||
=== inertia-laravel/v2 rules ===
|
=== inertia-laravel/v2 rules ===
|
||||||
|
|
||||||
## Inertia v2
|
# Inertia v2
|
||||||
|
|
||||||
- Make use of all Inertia features from v1 & v2. Check the documentation before making any changes to ensure we are taking the correct approach.
|
|
||||||
|
|
||||||
### Inertia v2 New Features
|
|
||||||
- Polling
|
|
||||||
- Prefetching
|
|
||||||
- Deferred props
|
|
||||||
- Infinite scrolling using merging props and `WhenVisible`
|
|
||||||
- Lazy loading data on scroll
|
|
||||||
|
|
||||||
### Deferred Props & Empty States
|
|
||||||
- When using deferred props on the frontend, you should add a nice empty state with pulsing / animated skeleton.
|
|
||||||
|
|
||||||
### Inertia Form General Guidance
|
|
||||||
- The recommended way to build forms when using Inertia is with the `<Form>` component - a useful example is below. Use `search-docs` with a query of `form component` for guidance.
|
|
||||||
- Forms can also be built using the `useForm` helper for more programmatic control, or to follow existing conventions. Use `search-docs` with a query of `useForm helper` for guidance.
|
|
||||||
- `resetOnError`, `resetOnSuccess`, and `setDefaultsOnSuccess` are available on the `<Form>` component. Use `search-docs` with a query of 'form component resetting' for guidance.
|
|
||||||
|
|
||||||
|
- Use all Inertia features from v1 and v2. Check the documentation before making changes to ensure the correct approach.
|
||||||
|
- New features: deferred props, infinite scrolling (merging props + `WhenVisible`), lazy loading on scroll, polling, prefetching.
|
||||||
|
- When using deferred props, add an empty state with a pulsing or animated skeleton.
|
||||||
|
|
||||||
=== laravel/core rules ===
|
=== laravel/core rules ===
|
||||||
|
|
||||||
## Do Things the Laravel Way
|
# Do Things the Laravel Way
|
||||||
|
|
||||||
- Use `php artisan make:` commands to create new files (i.e. migrations, controllers, models, etc.). You can list available Artisan commands using the `list-artisan-commands` tool.
|
- Use `php artisan make:` commands to create new files (i.e. migrations, controllers, models, etc.). You can list available Artisan commands using the `list-artisan-commands` tool.
|
||||||
- If you're creating a generic PHP class, use `artisan make:class`.
|
- If you're creating a generic PHP class, use `php artisan make:class`.
|
||||||
- Pass `--no-interaction` to all Artisan commands to ensure they work without user input. You should also pass the correct `--options` to ensure correct behavior.
|
- Pass `--no-interaction` to all Artisan commands to ensure they work without user input. You should also pass the correct `--options` to ensure correct behavior.
|
||||||
|
|
||||||
### Database
|
## Database
|
||||||
|
|
||||||
- Always use proper Eloquent relationship methods with return type hints. Prefer relationship methods over raw queries or manual joins.
|
- Always use proper Eloquent relationship methods with return type hints. Prefer relationship methods over raw queries or manual joins.
|
||||||
- Use Eloquent models and relationships before suggesting raw database queries
|
- Use Eloquent models and relationships before suggesting raw database queries.
|
||||||
- Avoid `DB::`; prefer `Model::query()`. Generate code that leverages Laravel's ORM capabilities rather than bypassing them.
|
- Avoid `DB::`; prefer `Model::query()`. Generate code that leverages Laravel's ORM capabilities rather than bypassing them.
|
||||||
- Generate code that prevents N+1 query problems by using eager loading.
|
- Generate code that prevents N+1 query problems by using eager loading.
|
||||||
- Use Laravel's query builder for very complex database operations.
|
- Use Laravel's query builder for very complex database operations.
|
||||||
|
|
||||||
### Model Creation
|
### Model Creation
|
||||||
|
|
||||||
- When creating new models, create useful factories and seeders for them too. Ask the user if they need any other things, using `list-artisan-commands` to check the available options to `php artisan make:model`.
|
- When creating new models, create useful factories and seeders for them too. Ask the user if they need any other things, using `list-artisan-commands` to check the available options to `php artisan make:model`.
|
||||||
|
|
||||||
### APIs & Eloquent Resources
|
### APIs & Eloquent Resources
|
||||||
|
|
||||||
- For APIs, default to using Eloquent API Resources and API versioning unless existing API routes do not, then you should follow existing application convention.
|
- For APIs, default to using Eloquent API Resources and API versioning unless existing API routes do not, then you should follow existing application convention.
|
||||||
|
|
||||||
### Controllers & Validation
|
## Controllers & Validation
|
||||||
|
|
||||||
- Always create Form Request classes for validation rather than inline validation in controllers. Include both validation rules and custom error messages.
|
- Always create Form Request classes for validation rather than inline validation in controllers. Include both validation rules and custom error messages.
|
||||||
- Check sibling Form Requests to see if the application uses array or string based validation rules.
|
- Check sibling Form Requests to see if the application uses array or string based validation rules.
|
||||||
|
|
||||||
### Queues
|
## Authentication & Authorization
|
||||||
- Use queued jobs for time-consuming operations with the `ShouldQueue` interface.
|
|
||||||
|
|
||||||
### Authentication & Authorization
|
|
||||||
- Use Laravel's built-in authentication and authorization features (gates, policies, Sanctum, etc.).
|
- Use Laravel's built-in authentication and authorization features (gates, policies, Sanctum, etc.).
|
||||||
|
|
||||||
### URL Generation
|
## URL Generation
|
||||||
|
|
||||||
- When generating links to other pages, prefer named routes and the `route()` function.
|
- When generating links to other pages, prefer named routes and the `route()` function.
|
||||||
|
|
||||||
### Configuration
|
## Queues
|
||||||
|
|
||||||
|
- Use queued jobs for time-consuming operations with the `ShouldQueue` interface.
|
||||||
|
|
||||||
|
## Configuration
|
||||||
|
|
||||||
- Use environment variables only in configuration files - never use the `env()` function directly outside of config files. Always use `config('app.name')`, not `env('APP_NAME')`.
|
- Use environment variables only in configuration files - never use the `env()` function directly outside of config files. Always use `config('app.name')`, not `env('APP_NAME')`.
|
||||||
|
|
||||||
### Testing
|
## Testing
|
||||||
|
|
||||||
- When creating models for tests, use the factories for the models. Check if the factory has custom states that can be used before manually setting up the model.
|
- When creating models for tests, use the factories for the models. Check if the factory has custom states that can be used before manually setting up the model.
|
||||||
- Faker: Use methods such as `$this->faker->word()` or `fake()->randomDigit()`. Follow existing conventions whether to use `$this->faker` or `fake()`.
|
- Faker: Use methods such as `$this->faker->word()` or `fake()->randomDigit()`. Follow existing conventions whether to use `$this->faker` or `fake()`.
|
||||||
- When creating tests, make use of `php artisan make:test [options] <name>` to create a feature test, and pass `--unit` to create a unit test. Most tests should be feature tests.
|
- When creating tests, make use of `php artisan make:test [options] {name}` to create a feature test, and pass `--unit` to create a unit test. Most tests should be feature tests.
|
||||||
|
|
||||||
|
## Vite Error
|
||||||
|
|
||||||
### Vite Error
|
|
||||||
- If you receive an "Illuminate\Foundation\ViteException: Unable to locate file in Vite manifest" error, you can run `npm run build` or ask the user to run `npm run dev` or `composer run dev`.
|
- If you receive an "Illuminate\Foundation\ViteException: Unable to locate file in Vite manifest" error, you can run `npm run build` or ask the user to run `npm run dev` or `composer run dev`.
|
||||||
|
|
||||||
|
|
||||||
=== laravel/v12 rules ===
|
=== laravel/v12 rules ===
|
||||||
|
|
||||||
## Laravel 12
|
# Laravel 12
|
||||||
|
|
||||||
- Use the `search-docs` tool to get version specific documentation.
|
- CRITICAL: ALWAYS use `search-docs` tool for version-specific Laravel documentation and updated code examples.
|
||||||
- Since Laravel 11, Laravel has a new streamlined file structure which this project uses.
|
- Since Laravel 11, Laravel has a new streamlined file structure which this project uses.
|
||||||
|
|
||||||
### Laravel 12 Structure
|
## Laravel 12 Structure
|
||||||
- No middleware files in `app/Http/Middleware/`.
|
|
||||||
|
- In Laravel 12, middleware are no longer registered in `app/Http/Kernel.php`.
|
||||||
|
- Middleware are configured declaratively in `bootstrap/app.php` using `Application::configure()->withMiddleware()`.
|
||||||
- `bootstrap/app.php` is the file to register middleware, exceptions, and routing files.
|
- `bootstrap/app.php` is the file to register middleware, exceptions, and routing files.
|
||||||
- `bootstrap/providers.php` contains application specific service providers.
|
- `bootstrap/providers.php` contains application specific service providers.
|
||||||
- **No app\Console\Kernel.php** - use `bootstrap/app.php` or `routes/console.php` for console configuration.
|
- The `app\Console\Kernel.php` file no longer exists; use `bootstrap/app.php` or `routes/console.php` for console configuration.
|
||||||
- **Commands auto-register** - files in `app/Console/Commands/` are automatically available and do not require manual registration.
|
- Console commands in `app/Console/Commands/` are automatically available and do not require manual registration.
|
||||||
|
|
||||||
|
## Database
|
||||||
|
|
||||||
### Database
|
|
||||||
- When modifying a column, the migration must include all of the attributes that were previously defined on the column. Otherwise, they will be dropped and lost.
|
- When modifying a column, the migration must include all of the attributes that were previously defined on the column. Otherwise, they will be dropped and lost.
|
||||||
- Laravel 11 allows limiting eagerly loaded records natively, without external packages: `$query->latest()->limit(10);`.
|
- Laravel 12 allows limiting eagerly loaded records natively, without external packages: `$query->latest()->limit(10);`.
|
||||||
|
|
||||||
### Models
|
### Models
|
||||||
|
|
||||||
- Casts can and likely should be set in a `casts()` method on a model rather than the `$casts` property. Follow existing conventions from other models.
|
- Casts can and likely should be set in a `casts()` method on a model rather than the `$casts` property. Follow existing conventions from other models.
|
||||||
|
|
||||||
|
=== pennant/core rules ===
|
||||||
|
|
||||||
|
# Laravel Pennant
|
||||||
|
|
||||||
|
- This application uses Laravel Pennant for feature flag management, providing a flexible system for controlling feature availability across different organizations and user types.
|
||||||
|
- IMPORTANT: Always use `search-docs` tool for version-specific Pennant documentation and updated code examples.
|
||||||
|
- IMPORTANT: Activate `pennant-development` every time you're working with a Pennant or feature-flag-related task.
|
||||||
|
|
||||||
=== wayfinder/core rules ===
|
=== wayfinder/core rules ===
|
||||||
|
|
||||||
## Laravel Wayfinder
|
# Laravel Wayfinder
|
||||||
|
|
||||||
Wayfinder generates TypeScript functions and types for Laravel controllers and routes which you can import into your client side code. It provides type safety and automatic synchronization between backend routes and frontend code.
|
Wayfinder generates TypeScript functions for Laravel routes. Import from `@/actions/` (controllers) or `@/routes/` (named routes).
|
||||||
|
|
||||||
### Development Guidelines
|
|
||||||
- Always use `search-docs` to check wayfinder correct usage before implementing any features.
|
|
||||||
- Always Prefer named imports for tree-shaking (e.g., `import { show } from '@/actions/...'`)
|
|
||||||
- Avoid default controller imports (prevents tree-shaking)
|
|
||||||
- Run `wayfinder:generate` after route changes if Vite plugin isn't installed
|
|
||||||
|
|
||||||
### Feature Overview
|
|
||||||
- Form Support: Use `.form()` with `--with-form` flag for HTML form attributes — `<form {...store.form()}>` → `action="/posts" method="post"`
|
|
||||||
- HTTP Methods: Call `.get()`, `.post()`, `.patch()`, `.put()`, `.delete()` for specific methods — `show.head(1)` → `{ url: "/posts/1", method: "head" }`
|
|
||||||
- Invokable Controllers: Import and invoke directly as functions. For example, `import StorePost from '@/actions/.../StorePostController'; StorePost()`
|
|
||||||
- Named Routes: Import from `@/routes/` for non-controller routes. For example, `import { show } from '@/routes/post'; show(1)` for route name `post.show`
|
|
||||||
- Parameter Binding: Detects route keys (e.g., `{post:slug}`) and accepts matching object properties — `show("my-post")` or `show({ slug: "my-post" })`
|
|
||||||
- Query Merging: Use `mergeQuery` to merge with `window.location.search`, set values to `null` to remove — `show(1, { mergeQuery: { page: 2, sort: null } })`
|
|
||||||
- Query Parameters: Pass `{ query: {...} }` in options to append params — `show(1, { query: { page: 1 } })` → `"/posts/1?page=1"`
|
|
||||||
- Route Objects: Functions return `{ url, method }` shaped objects — `show(1)` → `{ url: "/posts/1", method: "get" }`
|
|
||||||
- URL Extraction: Use `.url()` to get URL string — `show.url(1)` → `"/posts/1"`
|
|
||||||
|
|
||||||
### Example Usage
|
|
||||||
|
|
||||||
<code-snippet name="Wayfinder Basic Usage" lang="typescript">
|
|
||||||
// Import controller methods (tree-shakable)
|
|
||||||
import { show, store, update } from '@/actions/App/Http/Controllers/PostController'
|
|
||||||
|
|
||||||
// Get route object with URL and method...
|
|
||||||
show(1) // { url: "/posts/1", method: "get" }
|
|
||||||
|
|
||||||
// Get just the URL...
|
|
||||||
show.url(1) // "/posts/1"
|
|
||||||
|
|
||||||
// Use specific HTTP methods...
|
|
||||||
show.get(1) // { url: "/posts/1", method: "get" }
|
|
||||||
show.head(1) // { url: "/posts/1", method: "head" }
|
|
||||||
|
|
||||||
// Import named routes...
|
|
||||||
import { show as postShow } from '@/routes/post' // For route name 'post.show'
|
|
||||||
postShow(1) // { url: "/posts/1", method: "get" }
|
|
||||||
</code-snippet>
|
|
||||||
|
|
||||||
|
|
||||||
### Wayfinder + Inertia
|
|
||||||
If your application uses the `<Form>` component from Inertia, you can use Wayfinder to generate form action and method automatically.
|
|
||||||
<code-snippet name="Wayfinder Form Component (React)" lang="typescript">
|
|
||||||
|
|
||||||
<Form {...store.form()}><input name="title" /></Form>
|
|
||||||
|
|
||||||
</code-snippet>
|
|
||||||
|
|
||||||
|
- IMPORTANT: Activate `wayfinder-development` skill whenever referencing backend routes in frontend components.
|
||||||
|
- Invokable Controllers: `import StorePost from '@/actions/.../StorePostController'; StorePost()`.
|
||||||
|
- Parameter Binding: Detects route keys (`{post:slug}`) — `show({ slug: "my-post" })`.
|
||||||
|
- Query Merging: `show(1, { mergeQuery: { page: 2, sort: null } })` merges with current URL, `null` removes params.
|
||||||
|
- Inertia: Use `.form()` with `<Form>` component or `form.submit(store())` with useForm.
|
||||||
|
|
||||||
=== pint/core rules ===
|
=== pint/core rules ===
|
||||||
|
|
||||||
## Laravel Pint Code Formatter
|
# Laravel Pint Code Formatter
|
||||||
|
|
||||||
- You must run `vendor/bin/pint --dirty` before finalizing changes to ensure your code matches the project's expected style.
|
- You must run `vendor/bin/pint --dirty` before finalizing changes to ensure your code matches the project's expected style.
|
||||||
- Do not run `vendor/bin/pint --test`, simply run `vendor/bin/pint` to fix any formatting issues.
|
- Do not run `vendor/bin/pint --test`, simply run `vendor/bin/pint` to fix any formatting issues.
|
||||||
|
|
||||||
|
|
||||||
=== pest/core rules ===
|
=== pest/core rules ===
|
||||||
|
|
||||||
## Pest
|
## Pest
|
||||||
|
|
||||||
### Testing
|
- This project uses Pest for testing. Create tests: `php artisan make:test --pest {name}`.
|
||||||
- If you need to verify a feature is working, write or update a Unit / Feature test.
|
- Run tests: `php artisan test --compact` or filter: `php artisan test --compact --filter=testName`.
|
||||||
|
- Do NOT delete tests without approval.
|
||||||
### Pest Tests
|
- CRITICAL: ALWAYS use `search-docs` tool for version-specific Pest documentation and updated code examples.
|
||||||
- All tests must be written using Pest. Use `php artisan make:test --pest <name>`.
|
- IMPORTANT: Activate `pest-testing` every time you're working with a Pest or testing-related task.
|
||||||
- You must not remove any tests or test files from the tests directory without approval. These are not temporary or helper files - these are core to the application.
|
|
||||||
- Tests should test all of the happy paths, failure paths, and weird paths.
|
|
||||||
- Tests live in the `tests/Feature` and `tests/Unit` directories.
|
|
||||||
- Pest tests look and behave like this:
|
|
||||||
<code-snippet name="Basic Pest Test Example" lang="php">
|
|
||||||
it('is true', function () {
|
|
||||||
expect(true)->toBeTrue();
|
|
||||||
});
|
|
||||||
</code-snippet>
|
|
||||||
|
|
||||||
### Running Tests
|
|
||||||
- Run the minimal number of tests using an appropriate filter before finalizing code edits.
|
|
||||||
- To run all tests: `php artisan test`.
|
|
||||||
- To run all tests in a file: `php artisan test tests/Feature/ExampleTest.php`.
|
|
||||||
- To filter on a particular test name: `php artisan test --filter=testName` (recommended after making a change to a related file).
|
|
||||||
- When the tests relating to your changes are passing, ask the user if they would like to run the entire test suite to ensure everything is still passing.
|
|
||||||
|
|
||||||
### Pest Assertions
|
|
||||||
- When asserting status codes on a response, use the specific method like `assertForbidden` and `assertNotFound` instead of using `assertStatus(403)` or similar, e.g.:
|
|
||||||
<code-snippet name="Pest Example Asserting postJson Response" lang="php">
|
|
||||||
it('returns all', function () {
|
|
||||||
$response = $this->postJson('/api/docs', []);
|
|
||||||
|
|
||||||
$response->assertSuccessful();
|
|
||||||
});
|
|
||||||
</code-snippet>
|
|
||||||
|
|
||||||
### Mocking
|
|
||||||
- Mocking can be very helpful when appropriate.
|
|
||||||
- When mocking, you can use the `Pest\Laravel\mock` Pest function, but always import it via `use function Pest\Laravel\mock;` before using it. Alternatively, you can use `$this->mock()` if existing tests do.
|
|
||||||
- You can also create partial mocks using the same import or self method.
|
|
||||||
|
|
||||||
### Datasets
|
|
||||||
- Use datasets in Pest to simplify tests which have a lot of duplicated data. This is often the case when testing validation rules, so consider going with this solution when writing tests for validation rules.
|
|
||||||
|
|
||||||
<code-snippet name="Pest Dataset Example" lang="php">
|
|
||||||
it('has emails', function (string $email) {
|
|
||||||
expect($email)->not->toBeEmpty();
|
|
||||||
})->with([
|
|
||||||
'james' => 'james@laravel.com',
|
|
||||||
'taylor' => 'taylor@laravel.com',
|
|
||||||
]);
|
|
||||||
</code-snippet>
|
|
||||||
|
|
||||||
|
|
||||||
=== pest/v4 rules ===
|
|
||||||
|
|
||||||
## Pest 4
|
|
||||||
|
|
||||||
- Pest v4 is a huge upgrade to Pest and offers: browser testing, smoke testing, visual regression testing, test sharding, and faster type coverage.
|
|
||||||
- Browser testing is incredibly powerful and useful for this project.
|
|
||||||
- Browser tests should live in `tests/Browser/`.
|
|
||||||
- Use the `search-docs` tool for detailed guidance on utilizing these features.
|
|
||||||
|
|
||||||
### Browser Testing
|
|
||||||
- You can use Laravel features like `Event::fake()`, `assertAuthenticated()`, and model factories within Pest v4 browser tests, as well as `RefreshDatabase` (when needed) to ensure a clean state for each test.
|
|
||||||
- Interact with the page (click, type, scroll, select, submit, drag-and-drop, touch gestures, etc.) when appropriate to complete the test.
|
|
||||||
- If requested, test on multiple browsers (Chrome, Firefox, Safari).
|
|
||||||
- If requested, test on different devices and viewports (like iPhone 14 Pro, tablets, or custom breakpoints).
|
|
||||||
- Switch color schemes (light/dark mode) when appropriate.
|
|
||||||
- Take screenshots or pause tests for debugging when appropriate.
|
|
||||||
|
|
||||||
### Example Tests
|
|
||||||
|
|
||||||
<code-snippet name="Pest Browser Test Example" lang="php">
|
|
||||||
it('may reset the password', function () {
|
|
||||||
Notification::fake();
|
|
||||||
|
|
||||||
$this->actingAs(User::factory()->create());
|
|
||||||
|
|
||||||
$page = visit('/sign-in'); // Visit on a real browser...
|
|
||||||
|
|
||||||
$page->assertSee('Sign In')
|
|
||||||
->assertNoJavascriptErrors() // or ->assertNoConsoleLogs()
|
|
||||||
->click('Forgot Password?')
|
|
||||||
->fill('email', 'nuno@laravel.com')
|
|
||||||
->click('Send Reset Link')
|
|
||||||
->assertSee('We have emailed your password reset link!')
|
|
||||||
|
|
||||||
Notification::assertSent(ResetPassword::class);
|
|
||||||
});
|
|
||||||
</code-snippet>
|
|
||||||
|
|
||||||
<code-snippet name="Pest Smoke Testing Example" lang="php">
|
|
||||||
$pages = visit(['/', '/about', '/contact']);
|
|
||||||
|
|
||||||
$pages->assertNoJavascriptErrors()->assertNoConsoleLogs();
|
|
||||||
</code-snippet>
|
|
||||||
|
|
||||||
|
|
||||||
=== inertia-react/core rules ===
|
=== inertia-react/core rules ===
|
||||||
|
|
||||||
## Inertia + React
|
# Inertia + React
|
||||||
|
|
||||||
- Use `router.visit()` or `<Link>` for navigation instead of traditional links.
|
|
||||||
|
|
||||||
<code-snippet name="Inertia Client Navigation" lang="react">
|
|
||||||
|
|
||||||
import { Link } from '@inertiajs/react'
|
|
||||||
<Link href="/">Home</Link>
|
|
||||||
|
|
||||||
</code-snippet>
|
|
||||||
|
|
||||||
|
|
||||||
=== inertia-react/v2/forms rules ===
|
|
||||||
|
|
||||||
## Inertia + React Forms
|
|
||||||
|
|
||||||
<code-snippet name="`<Form>` Component Example" lang="react">
|
|
||||||
|
|
||||||
import { Form } from '@inertiajs/react'
|
|
||||||
|
|
||||||
export default () => (
|
|
||||||
<Form action="/users" method="post">
|
|
||||||
{({
|
|
||||||
errors,
|
|
||||||
hasErrors,
|
|
||||||
processing,
|
|
||||||
wasSuccessful,
|
|
||||||
recentlySuccessful,
|
|
||||||
clearErrors,
|
|
||||||
resetAndClearErrors,
|
|
||||||
defaults
|
|
||||||
}) => (
|
|
||||||
<>
|
|
||||||
<input type="text" name="name" />
|
|
||||||
|
|
||||||
{errors.name && <div>{errors.name}</div>}
|
|
||||||
|
|
||||||
<button type="submit" disabled={processing}>
|
|
||||||
{processing ? 'Creating...' : 'Create User'}
|
|
||||||
</button>
|
|
||||||
|
|
||||||
{wasSuccessful && <div>User created successfully!</div>}
|
|
||||||
</>
|
|
||||||
)}
|
|
||||||
</Form>
|
|
||||||
)
|
|
||||||
|
|
||||||
</code-snippet>
|
|
||||||
|
|
||||||
|
- IMPORTANT: Activate `inertia-react-development` when working with Inertia React client-side patterns.
|
||||||
|
|
||||||
=== tailwindcss/core rules ===
|
=== tailwindcss/core rules ===
|
||||||
|
|
||||||
## Tailwind Core
|
# Tailwind CSS
|
||||||
|
|
||||||
- Use Tailwind CSS classes to style HTML, check and use existing tailwind conventions within the project before writing your own.
|
|
||||||
- Offer to extract repeated patterns into components that match the project's conventions (i.e. Blade, JSX, Vue, etc..)
|
|
||||||
- Think through class placement, order, priority, and defaults - remove redundant classes, add classes to parent or child carefully to limit repetition, group elements logically
|
|
||||||
- You can use the `search-docs` tool to get exact examples from the official documentation when needed.
|
|
||||||
|
|
||||||
### Spacing
|
|
||||||
- When listing items, use gap utilities for spacing, don't use margins.
|
|
||||||
|
|
||||||
<code-snippet name="Valid Flex Gap Spacing Example" lang="html">
|
|
||||||
<div class="flex gap-8">
|
|
||||||
<div>Superior</div>
|
|
||||||
<div>Michigan</div>
|
|
||||||
<div>Erie</div>
|
|
||||||
</div>
|
|
||||||
</code-snippet>
|
|
||||||
|
|
||||||
|
|
||||||
### Dark Mode
|
|
||||||
- If existing pages and components support dark mode, new pages and components must support dark mode in a similar way, typically using `dark:`.
|
|
||||||
|
|
||||||
|
|
||||||
=== tailwindcss/v4 rules ===
|
|
||||||
|
|
||||||
## Tailwind 4
|
|
||||||
|
|
||||||
- Always use Tailwind CSS v4 - do not use the deprecated utilities.
|
|
||||||
- `corePlugins` is not supported in Tailwind v4.
|
|
||||||
- In Tailwind v4, configuration is CSS-first using the `@theme` directive — no separate `tailwind.config.js` file is needed.
|
|
||||||
<code-snippet name="Extending Theme in CSS" lang="css">
|
|
||||||
@theme {
|
|
||||||
--color-brand: oklch(0.72 0.11 178);
|
|
||||||
}
|
|
||||||
</code-snippet>
|
|
||||||
|
|
||||||
- In Tailwind v4, you import Tailwind using a regular CSS `@import` statement, not using the `@tailwind` directives used in v3:
|
|
||||||
|
|
||||||
<code-snippet name="Tailwind v4 Import Tailwind Diff" lang="diff">
|
|
||||||
- @tailwind base;
|
|
||||||
- @tailwind components;
|
|
||||||
- @tailwind utilities;
|
|
||||||
+ @import "tailwindcss";
|
|
||||||
</code-snippet>
|
|
||||||
|
|
||||||
|
|
||||||
### Replaced Utilities
|
|
||||||
- Tailwind v4 removed deprecated utilities. Do not use the deprecated option - use the replacement.
|
|
||||||
- Opacity values are still numeric.
|
|
||||||
|
|
||||||
| Deprecated | Replacement |
|
|
||||||
|------------+--------------|
|
|
||||||
| bg-opacity-* | bg-black/* |
|
|
||||||
| text-opacity-* | text-black/* |
|
|
||||||
| border-opacity-* | border-black/* |
|
|
||||||
| divide-opacity-* | divide-black/* |
|
|
||||||
| ring-opacity-* | ring-black/* |
|
|
||||||
| placeholder-opacity-* | placeholder-black/* |
|
|
||||||
| flex-shrink-* | shrink-* |
|
|
||||||
| flex-grow-* | grow-* |
|
|
||||||
| overflow-ellipsis | text-ellipsis |
|
|
||||||
| decoration-slice | box-decoration-slice |
|
|
||||||
| decoration-clone | box-decoration-clone |
|
|
||||||
|
|
||||||
|
|
||||||
=== tests rules ===
|
|
||||||
|
|
||||||
## Test Enforcement
|
|
||||||
|
|
||||||
- Every change must be programmatically tested. Write a new test or update an existing test, then run the affected tests to make sure they pass.
|
|
||||||
- Run the minimum number of tests needed to ensure code quality and speed. Use `php artisan test` with a specific filename or filter.
|
|
||||||
|
|
||||||
|
- Always use existing Tailwind conventions; check project patterns before adding new ones.
|
||||||
|
- IMPORTANT: Always use `search-docs` tool for version-specific Tailwind CSS documentation and updated code examples. Never rely on training data.
|
||||||
|
- IMPORTANT: Activate `tailwindcss-development` every time you're working with a Tailwind CSS or styling-related task.
|
||||||
|
|
||||||
=== laravel/fortify rules ===
|
=== laravel/fortify rules ===
|
||||||
|
|
||||||
|
|
@ -611,17 +393,20 @@ Fortify is a headless authentication backend that provides authentication routes
|
||||||
**Before implementing any authentication features, use the `search-docs` tool to get the latest docs for that specific feature.**
|
**Before implementing any authentication features, use the `search-docs` tool to get the latest docs for that specific feature.**
|
||||||
|
|
||||||
### Configuration & Setup
|
### Configuration & Setup
|
||||||
|
|
||||||
- Check `config/fortify.php` to see what's enabled. Use `search-docs` for detailed information on specific features.
|
- Check `config/fortify.php` to see what's enabled. Use `search-docs` for detailed information on specific features.
|
||||||
- Enable features by adding them to the `'features' => []` array: `Features::registration()`, `Features::resetPasswords()`, etc.
|
- Enable features by adding them to the `'features' => []` array: `Features::registration()`, `Features::resetPasswords()`, etc.
|
||||||
- To see the all Fortify registered routes, use the `list-routes` tool with the `only_vendor: true` and `action: "Fortify"` parameters.
|
- To see the all Fortify registered routes, use the `list-routes` tool with the `only_vendor: true` and `action: "Fortify"` parameters.
|
||||||
- Fortify includes view routes by default (login, register). Set `'views' => false` in the configuration file to disable them if you're handling views yourself.
|
- Fortify includes view routes by default (login, register). Set `'views' => false` in the configuration file to disable them if you're handling views yourself.
|
||||||
|
|
||||||
### Customization
|
### Customization
|
||||||
|
|
||||||
- Views can be customized in `FortifyServiceProvider`'s `boot()` method using `Fortify::loginView()`, `Fortify::registerView()`, etc.
|
- Views can be customized in `FortifyServiceProvider`'s `boot()` method using `Fortify::loginView()`, `Fortify::registerView()`, etc.
|
||||||
- Customize authentication logic with `Fortify::authenticateUsing()` for custom user retrieval / validation.
|
- Customize authentication logic with `Fortify::authenticateUsing()` for custom user retrieval / validation.
|
||||||
- Actions in `app/Actions/Fortify/` handle business logic (user creation, password reset, etc.). They're fully customizable, so you can modify them to change feature behavior.
|
- Actions in `app/Actions/Fortify/` handle business logic (user creation, password reset, etc.). They're fully customizable, so you can modify them to change feature behavior.
|
||||||
|
|
||||||
## Available Features
|
## Available Features
|
||||||
|
|
||||||
- `Features::registration()` for user registration.
|
- `Features::registration()` for user registration.
|
||||||
- `Features::emailVerification()` to verify new user emails.
|
- `Features::emailVerification()` to verify new user emails.
|
||||||
- `Features::twoFactorAuthentication()` for 2FA with QR codes and recovery codes.
|
- `Features::twoFactorAuthentication()` for 2FA with QR codes and recovery codes.
|
||||||
|
|
|
||||||
20
boost.json
20
boost.json
|
|
@ -1,13 +1,21 @@
|
||||||
{
|
{
|
||||||
"agents": [
|
"agents": [
|
||||||
"claude_code",
|
"claude_code",
|
||||||
"cursor"
|
"cursor",
|
||||||
|
"opencode"
|
||||||
],
|
],
|
||||||
"editors": [
|
"guidelines": true,
|
||||||
"claude_code",
|
"herd_mcp": false,
|
||||||
"cursor"
|
"mcp": true,
|
||||||
],
|
"packages": [
|
||||||
"guidelines": [
|
|
||||||
"laravel/fortify"
|
"laravel/fortify"
|
||||||
|
],
|
||||||
|
"sail": false,
|
||||||
|
"skills": [
|
||||||
|
"pennant-development",
|
||||||
|
"wayfinder-development",
|
||||||
|
"pest-testing",
|
||||||
|
"inertia-react-development",
|
||||||
|
"tailwindcss-development"
|
||||||
]
|
]
|
||||||
}
|
}
|
||||||
|
|
|
||||||
|
|
@ -22,7 +22,7 @@
|
||||||
},
|
},
|
||||||
"require-dev": {
|
"require-dev": {
|
||||||
"fakerphp/faker": "^1.23",
|
"fakerphp/faker": "^1.23",
|
||||||
"laravel/boost": "1.8.7",
|
"laravel/boost": "^2",
|
||||||
"laravel/pail": "^1.2.2",
|
"laravel/pail": "^1.2.2",
|
||||||
"laravel/pint": "^1.24",
|
"laravel/pint": "^1.24",
|
||||||
"laravel/sail": "^1.41",
|
"laravel/sail": "^1.41",
|
||||||
|
|
|
||||||
|
|
@ -4,7 +4,7 @@
|
||||||
"Read more about it at https://getcomposer.org/doc/01-basic-usage.md#installing-dependencies",
|
"Read more about it at https://getcomposer.org/doc/01-basic-usage.md#installing-dependencies",
|
||||||
"This file is @generated automatically"
|
"This file is @generated automatically"
|
||||||
],
|
],
|
||||||
"content-hash": "d9944c8b1651f576ba20b38f6e20959a",
|
"content-hash": "d01684feb019023ee08971e154374c89",
|
||||||
"packages": [
|
"packages": [
|
||||||
{
|
{
|
||||||
"name": "bacon/bacon-qr-code",
|
"name": "bacon/bacon-qr-code",
|
||||||
|
|
@ -9111,33 +9111,33 @@
|
||||||
},
|
},
|
||||||
{
|
{
|
||||||
"name": "laravel/boost",
|
"name": "laravel/boost",
|
||||||
"version": "v1.8.7",
|
"version": "v2.0.1",
|
||||||
"source": {
|
"source": {
|
||||||
"type": "git",
|
"type": "git",
|
||||||
"url": "https://github.com/laravel/boost.git",
|
"url": "https://github.com/laravel/boost.git",
|
||||||
"reference": "7a5709a8134ed59d3e7f34fccbd74689830e296c"
|
"reference": "59874334803197654c1e8de96547804465bbdd0c"
|
||||||
},
|
},
|
||||||
"dist": {
|
"dist": {
|
||||||
"type": "zip",
|
"type": "zip",
|
||||||
"url": "https://api.github.com/repos/laravel/boost/zipball/7a5709a8134ed59d3e7f34fccbd74689830e296c",
|
"url": "https://api.github.com/repos/laravel/boost/zipball/59874334803197654c1e8de96547804465bbdd0c",
|
||||||
"reference": "7a5709a8134ed59d3e7f34fccbd74689830e296c",
|
"reference": "59874334803197654c1e8de96547804465bbdd0c",
|
||||||
"shasum": ""
|
"shasum": ""
|
||||||
},
|
},
|
||||||
"require": {
|
"require": {
|
||||||
"guzzlehttp/guzzle": "^7.9",
|
"guzzlehttp/guzzle": "^7.9",
|
||||||
"illuminate/console": "^10.49.0|^11.45.3|^12.41.1",
|
"illuminate/console": "^11.45.3|^12.41.1",
|
||||||
"illuminate/contracts": "^10.49.0|^11.45.3|^12.41.1",
|
"illuminate/contracts": "^11.45.3|^12.41.1",
|
||||||
"illuminate/routing": "^10.49.0|^11.45.3|^12.41.1",
|
"illuminate/routing": "^11.45.3|^12.41.1",
|
||||||
"illuminate/support": "^10.49.0|^11.45.3|^12.41.1",
|
"illuminate/support": "^11.45.3|^12.41.1",
|
||||||
"laravel/mcp": "^0.5.1",
|
"laravel/mcp": "^0.5.1",
|
||||||
"laravel/prompts": "0.1.25|^0.3.6",
|
"laravel/prompts": "^0.3.10",
|
||||||
"laravel/roster": "^0.2.9",
|
"laravel/roster": "^0.2.9",
|
||||||
"php": "^8.1"
|
"php": "^8.2"
|
||||||
},
|
},
|
||||||
"require-dev": {
|
"require-dev": {
|
||||||
"laravel/pint": "^1.20.0",
|
"laravel/pint": "^1.27.0",
|
||||||
"mockery/mockery": "^1.6.12",
|
"mockery/mockery": "^1.6.12",
|
||||||
"orchestra/testbench": "^8.36.0|^9.15.0|^10.6",
|
"orchestra/testbench": "^9.15.0|^10.6",
|
||||||
"pestphp/pest": "^2.36.0|^3.8.4|^4.1.5",
|
"pestphp/pest": "^2.36.0|^3.8.4|^4.1.5",
|
||||||
"phpstan/phpstan": "^2.1.27",
|
"phpstan/phpstan": "^2.1.27",
|
||||||
"rector/rector": "^2.1"
|
"rector/rector": "^2.1"
|
||||||
|
|
@ -9173,7 +9173,7 @@
|
||||||
"issues": "https://github.com/laravel/boost/issues",
|
"issues": "https://github.com/laravel/boost/issues",
|
||||||
"source": "https://github.com/laravel/boost"
|
"source": "https://github.com/laravel/boost"
|
||||||
},
|
},
|
||||||
"time": "2025-12-19T15:04:12+00:00"
|
"time": "2026-01-26T16:36:25+00:00"
|
||||||
},
|
},
|
||||||
{
|
{
|
||||||
"name": "laravel/mcp",
|
"name": "laravel/mcp",
|
||||||
|
|
|
||||||
|
|
@ -0,0 +1,14 @@
|
||||||
|
{
|
||||||
|
"$schema": "https://opencode.ai/config.json",
|
||||||
|
"mcp": {
|
||||||
|
"laravel-boost": {
|
||||||
|
"type": "local",
|
||||||
|
"enabled": true,
|
||||||
|
"command": [
|
||||||
|
"php",
|
||||||
|
"artisan",
|
||||||
|
"boost:mcp"
|
||||||
|
]
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
Loading…
Reference in New Issue