Creating eloquent api resources for transforming model fields

This tutorial is part of this mini project on Laravel vue spa. To see all the sections of this project click here

Step 01: Creating issues resource file for IssuesController

php artisan make:resource IssueResource

Step 02: Changing toArray() method in IssueResource.php for transforming model data for api endpoint

public function toArray(Request $request): array
{
    return [
        'id' => $this->id,
        'title' => $this->title,
        'description' => substr($this->description, 0, 80) . '...',
        'created_at' => $this->created_at->toDateString()
    ];
}

Step 03: Changing index() method with collection() method again using IssueResource in IssueController.php

// at the top 
use App\Http\Resources\IssueResource;

public function index() {
    return IssueResource::collection(Issue::all());
}

Step 04: Changing composable issues.js with modifiying variable response.data to response.data.data

export default function useIssues() {
    const issues = ref([])

    const getIssues = async () => {
        axios.get('/api/issues')
            .then(response => {
                issues.value = response.data.data;
            })
    }
    return { issues, getIssues }
}