Comments (13)
I've added support for "Responsable" props: 2b966ac
This will cause the additional resource information (ie. pagination data) to be included with your responses.
I've tested this with both single resource responses and collection resource responses, and it works great. 👍
from inertia-laravel.
Hey folks! I think this is probably best left out of this adapter. There seems to be different ways to solve this (admittedly) annoying problem. The whole issue is that the current links()
functionality in Laravel returns HTML directly, and not JSON.
I hope to eventually make a PR to Laravel that adds jsonLinks()
, or something like that, to the pagination class.
And, I think either way you're going to need to a pagination component on the front-end. However, that's pretty easy to put together. You can see the Ping CRM one here.
from inertia-laravel.
Folks, I'm not sure if this is helpful because I haven't read through the whole discussion, but I also ran into some issues with Laravel's pagination...with is very much designed for Blade/servers-side rendering. I ended up creating my own (somewhat complex) pagination class. See here:
You might want to try that to see if it helps in your situation.
from inertia-laravel.
Here's both Resource classes, @adriandmitroca.
<?php
namespace App\Http\Resources;
use Illuminate\Http\Resources\Json\JsonResource;
class FooResource extends JsonResource
{
/**
* Transform the resource into an array.
*
* @param \Illuminate\Http\Request $request
* @return array
*/
public function toArray($request)
{
return [
'id' => $this->id,
'name' => $this->name,
];
}
}
<?php
namespace App\Http\Resources;
use Illuminate\Http\Resources\Json\ResourceCollection;
class FooCollection extends ResourceCollection
{
/**
* Transform the resource collection into an array.
*
* @param \Illuminate\Http\Request $request
* @return array
*/
public function toArray($request)
{
return [
'data' => FooResource::collection($this->collection),
'links' => $this->links()
];
}
}
Make sure you're extending ResourceCollection
instead of JsonResource
in the collection one.
from inertia-laravel.
Yeah, that's basically exactly what I have. Is it working for you?
from inertia-laravel.
I see the issue - Laravel returns huge object of Illuminate\Support\HtmlString
with entire HTML markup for default render method in this situation rather than actual array with pagination data.
:/
from inertia-laravel.
@reinink Ah shoot, that's probably what @adriandmitroca is missing. I forgot I borrowed that from PingCRM a while back.
I still wind up having to do the FooCollection
resource workaround when passing an API resource, but that block of code is probably why $this->links()
at least works for me and not @adriandmitroca. Sorry.
from inertia-laravel.
This is definitely not my day - I've already tried to borrow Jonathan's workaround and I'm triggering it within register() method in AppServiceProvider but nothing changes - still HTML.
Losing my mind :(
from inertia-laravel.
@reinink So, I've done a bit of digging, and I'm able to get the FooResource::collection
's links/metadata to output. In Inertia\Response
:
public function toResponse($request)
{
$props = [];
foreach($this->props as $key => $prop) {
if($prop instanceof \Illuminate\Http\Resources\Json\ResourceCollection) {
$response = $prop->toResponse($request);
$props[$key] = $response->getData();
} else {
$props[$key] = $prop;
}
}
$page = [
'component' => $this->component,
'props' => $props,
'url' => $request->getRequestUri(),
'version' => $this->version,
];
It's not super pretty, but it does get us all the data the ResourceCollection
would normally have when converted to a response.
The results:
Controller call:
return Inertia::render('Foo', [
'foo' => FooResource::collection(Foo::paginate()),
]);
Response:
{
"component": "Foo",
"props": {
"foo": {
"data": [
{
"id": 1,
"name": "Adaptive zerodefect firmware"
},
{
"id": 2,
"name": "Reduced 5thgeneration forecast"
},
{
"id": 3,
"name": "Reverse-engineered 4thgeneration architecture"
},
...
],
"links": {
"first": "https:\/\/foo.test\/foo?page=1",
"last": "https:\/\/foo.test\/foo?page=4",
"prev": null,
"next": "https:\/\/foo.test\/foo?page=2"
},
"meta": {
"current_page": 1,
"from": 1,
"last_page": 4,
"path": "https:\/\/foo.test\/foo",
"per_page": 15,
"to": 15,
"total": 50
}
},
},
"url": "\/foo",
"version": null
}
(This leaves generating the list of page links to the JS side. Something like this component would probably do the trick.)
from inertia-laravel.
@ceejayoz This looks excellent to me. @reinink do you think this could be a part of the core?
from inertia-laravel.
I've gave it further thought and unfortunately it is impossible to pass current query parameters to a pagination created on the fly by API Resources.
I guess the best way way to do it is basically what Jonathan did in PingCRM app and overwriting pagination class to own needs.
from inertia-laravel.
We are using a helper function for it:
/**
* Gather the meta data for the response.
*
* @param LengthAwarePaginator $paginated
* @return array
*/
function pagination($paginated)
{
return [
'current' => $paginated->currentPage(),
'last' => $paginated->lastPage(),
'base' => $paginated->url(1),
'next' => $paginated->nextPageUrl(),
'prev' => $paginated->previousPageUrl()
];
}
example of usage:
return Inertia::render('Foo', [
'foo' => FooResource::collection(Foo::paginate()),
'pagination' => pagination($foos),
]);
from inertia-laravel.
We are using a custom pagination vue components and this is how we have implemented
public function index()
{
return Inertia::render('Users/Index', [
'users' => new UserCollection(User::paginate(10))
]);
}
class UserCollection extends ResourceCollection
{
/**
* The resource that this resource collects.
*
* @var string
*/
public $collects = UserResource::class;
/**
* Transform the resource collection into an array.
*
* @param \Illuminate\Http\Request $request
*
* @return array
*/
public function toArray($request) {
return [
'data' => $this->collection,
'pagination' => [
'size' => $this->perPage(),
'total' => $this->total(),
'current' => $this->currentPage(),
// customise your pagination here
// https://laravel.com/docs/5.8/pagination#paginator-instance-methods
],
];
}
}
class UserResource extends JsonResource
{
/**
* Transform the resource into an array.
*
* @param \Illuminate\Http\Request $request
*
* @return array
*/
public function toArray($request) {
return [
'id' => $this->id,
'name' => $this->name,
'email' => $this->email,
'profile' => new ProfileResource($this->whenLoaded('profile'))
];
}
}
And then we accept the user props
from inertia-laravel.
Related Issues (20)
- image upload help HOT 2
- Laravel 11 support HOT 2
- There is no automatic follow protocol, http is used under https, how to solve it HOT 4
- Laravel 11 update and Nova issue HOT 2
- Vue Watch not working upon redirect route HOT 2
- Problem with SSR HOT 1
- Force app.blade.php to reload HOT 2
- Should Inertia middleware call session()->setPreviousUrl? HOT 6
- - HOT 1
- redirection to /dashboard after login does not work HOT 1
- Prevent a webpage from navigating away HOT 1
- Release notes for 1.0 could make it more clear that "Fix URL generation (#592)" is a breaking change HOT 5
- Ziggy2.0 and Laravel11 and Breeze for Inertia + React, TypeScript and SSR starter kit throws error on initial setting HOT 2
- assertInertia() fails when testing Inertia visits HOT 1
- Inertia components/hooks wrapped with redux Provider stopped working HOT 2
- client-side validation libraries HOT 1
- SSR high CPU usage HOT 1
- Serve Connection Reset HOT 1
- Default Layout HOT 1
- adding to HandleInertiaRequests->share array no longer works in version 1.2.0 HOT 5
Recommend Projects
-
React
A declarative, efficient, and flexible JavaScript library for building user interfaces.
-
Vue.js
🖖 Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.
-
Typescript
TypeScript is a superset of JavaScript that compiles to clean JavaScript output.
-
TensorFlow
An Open Source Machine Learning Framework for Everyone
-
Django
The Web framework for perfectionists with deadlines.
-
Laravel
A PHP framework for web artisans
-
D3
Bring data to life with SVG, Canvas and HTML. 📊📈🎉
-
Recommend Topics
-
javascript
JavaScript (JS) is a lightweight interpreted programming language with first-class functions.
-
web
Some thing interesting about web. New door for the world.
-
server
A server is a program made to process requests and deliver data to clients.
-
Machine learning
Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.
-
Visualization
Some thing interesting about visualization, use data art
-
Game
Some thing interesting about game, make everyone happy.
Recommend Org
-
Facebook
We are working to build community through open source technology. NB: members must have two-factor auth.
-
Microsoft
Open source projects and samples from Microsoft.
-
Google
Google ❤️ Open Source for everyone.
-
Alibaba
Alibaba Open Source for everyone
-
D3
Data-Driven Documents codes.
-
Tencent
China tencent open source team.
from inertia-laravel.