Date format in inertia vuejs 3 #1612

Jijiri89 · 2023-07-15T07:44:02Z

Jijiri89
Jul 15, 2023

Please, when I return date column from my laravel model into vue3 components, the date format it returns is not what I want but I tried different ways to change it but I couldn't. The format shows is in this format, year - month - day - time plus time zone.

I want to change it to show this to my own prefer format.

Also, is it anyway to speed up the loading time of the inertia vuejs 3 pages? It is like my pages take too long to load.

perisicnikola37 · 2023-07-16T10:05:04Z

perisicnikola37
Jul 16, 2023

Hello,

If you want to change the format of the created_at timestamp, you can add the following code inside your User.php model or whatever you want:

public function getFormattedCreatedAtAttribute(): string
{
    return $this->created_at->format('d M Y');
}

This code defines a method called getFormattedCreatedAtAttribute, which retrieves the created_at timestamp and formats it using the 'd M Y' format.
This naming getFormattedCreatedAtAttribute follows a specific naming convention in Laravel's Eloquent ORM. The method name is a combination of three parts:

get - Indicates that this method retrieves a value.
Formatted - Describes that the retrieved value is formatted.
CreatedAtAttribute - Identifies the attribute being retrieved, in this case, the created_at timestamp.

For example, if the original timestamp is 2023-07-16 14:30:00, the formatted result would be 16 Jul 2023.

Hope I helped :)

0 replies

Jijiri89 · 2023-07-16T10:37:38Z

Jijiri89
Jul 16, 2023
Author

Thanks so much for your response. I am most grateful, I am going to test it out and see if it works, I will let you know. Also, will it work for any date format in the model or this is for any created_at alone? Let say I have another column that says date_birth in the model.php.

…

On Sun, Jul 16, 2023, 10:05 AM Nikola Perišić ***@***.***> wrote: Hello, If you want to change the format of the created_at timestamp, you can add the following code inside your User.php model or whatever you want: public function getFormattedCreatedAtAttribute(): string { return $this->created_at->format('d M Y'); } This code defines a method called getFormattedCreatedAtAttribute, which retrieves the created_at timestamp and formats it using the 'd M Y' format. This naming getFormattedCreatedAtAttribute follows a specific naming convention in Laravel's Eloquent ORM. The method name is a combination of three parts: 1. get - Indicates that this method retrieves a value. 2. Formatted - Describes that the retrieved value is formatted. 3. CreatedAtAttribute - Identifies the attribute being retrieved, in this case, the created_at timestamp. For example, if the original timestamp is 2023-07-16 14:30:00, the formatted result would be 16 Jul 2023. Hope I helped :) — Reply to this email directly, view it on GitHub <#1612 (comment)>, or unsubscribe <https://github.com/notifications/unsubscribe-auth/AZJNDXK45MAQOCOMA44PSRDXQO4FXANCNFSM6AAAAAA2LEJYN4> . You are receiving this because you authored the thread.Message ID: ***@***.***>

0 replies

Jijiri89 · 2023-07-16T13:47:54Z

Jijiri89
Jul 16, 2023
Author

Please I did but still it is not showing up. In my vuejs template, it is showing this format below in the screenshot. On Sun, Jul 16, 2023, 10:36 AM JIJIRI JOHNSON ***@***.***> wrote:

…

Thanks so much for your response. I am most grateful, I am going to test it out and see if it works, I will let you know. Also, will it work for any date format in the model or this is for any created_at alone? Let say I have another column that says date_birth in the model.php. On Sun, Jul 16, 2023, 10:05 AM Nikola Perišić ***@***.***> wrote: > Hello, > > If you want to change the format of the created_at timestamp, you can add > the following code inside your User.php model or whatever you want: > > public function getFormattedCreatedAtAttribute(): string > { > return $this->created_at->format('d M Y'); > } > > This code defines a method called getFormattedCreatedAtAttribute, which > retrieves the created_at timestamp and formats it using the 'd M Y' format. > This naming getFormattedCreatedAtAttribute follows a specific naming > convention in Laravel's Eloquent ORM. The method name is a combination of > three parts: > > 1. get - Indicates that this method retrieves a value. > 2. Formatted - Describes that the retrieved value is formatted. > 3. CreatedAtAttribute - Identifies the attribute being retrieved, in > this case, the created_at timestamp. > > For example, if the original timestamp is 2023-07-16 14:30:00, the > formatted result would be 16 Jul 2023. > > Hope I helped :) > > — > Reply to this email directly, view it on GitHub > <#1612 (comment)>, > or unsubscribe > <https://github.com/notifications/unsubscribe-auth/AZJNDXK45MAQOCOMA44PSRDXQO4FXANCNFSM6AAAAAA2LEJYN4> > . > You are receiving this because you authored the thread.Message ID: > ***@***.***> >

1 reply

perisicnikola37 Jul 16, 2023

Don't see any image

Jijiri89 · 2023-07-16T16:06:38Z

Jijiri89
Jul 16, 2023
Author

Sorry about that!

…

On Sun, Jul 16, 2023, 3:35 PM Nikola Perišić ***@***.***> wrote: Don't see any image — Reply to this email directly, view it on GitHub <#1612 (reply in thread)>, or unsubscribe <https://github.com/notifications/unsubscribe-auth/AZJNDXJBDKQHP6RFA4UTBD3XQQC45ANCNFSM6AAAAAA2LEJYN4> . You are receiving this because you authored the thread.Message ID: ***@***.***>

0 replies

Jijiri89 · 2023-07-16T16:07:03Z

Jijiri89
Jul 16, 2023
Author

On Sun, Jul 16, 2023, 4:05 PM JIJIRI JOHNSON ***@***.***> wrote:

…

Sorry about that! On Sun, Jul 16, 2023, 3:35 PM Nikola Perišić ***@***.***> wrote: > Don't see any image > > — > Reply to this email directly, view it on GitHub > <#1612 (reply in thread)>, > or unsubscribe > <https://github.com/notifications/unsubscribe-auth/AZJNDXJBDKQHP6RFA4UTBD3XQQC45ANCNFSM6AAAAAA2LEJYN4> > . > You are receiving this because you authored the thread.Message ID: > ***@***.***> >

0 replies

jefhar · 2023-07-17T16:05:32Z

jefhar
Jul 17, 2023

This really doesn't have anything to do with Inertia, but I would argue that a better way of sending a date from Laravel to JavaScript is to:

Make sure your model is casting the field to a Carbon date (created_at should already be a Carbon object).
Pass the date field as a millisecond time integer $model->created_at->getTimestampMs()
In JavaScript, create a Date object from the millisecond time integer: const createdAt = new Date(props.created_at) and use whatever format or formatting library you need in the presentation layer.

Also, is it anyway to speed up the loading time of the inertia vuejs 3 pages? It is like my pages take too long to load.

Use the benchmarking helper to find out where your page slows down. There are too many variables, including Xdebug, development mode, and slow database queries to answer that question in an unrelated repository thread.

0 replies

ankushmak2 · 2023-07-25T18:38:01Z

ankushmak2
Jul 25, 2023

have you used carbon date?

0 replies

Twyar · 2023-07-27T07:58:34Z

Twyar
Jul 27, 2023

I would personally skip formatting in the back-end and just return the datetime value as it is.

Then use date-fns or moment.js something similar to make a component for me which formats the time in the frontend.

This is what I use for example:

<script setup>
import { format } from 'date-fns';
import { enUS, nl } from 'date-fns/locale';

const locales = { nl, enUS };
defineProps({
  value: {
    type: String,
    required: true,
  },
  defaultFormat: {
    type: String,
    required: false,
    default: 'PPPP',
  },
});
</script>

<template>
  <span>
    {{ format(new Date(value), defaultFormat, {
      locale: locales[$page.props.lang.current.locale]
    }) }}
  </span>
</template>

Optional

You can set locale to whatever you like.

But personally I use Laravel Localization on my website to have it in multiple languages.

I then have the following in my ShareInertiaData.php Middleware.

<?php

namespace App\Http\Middleware;

use App\Http\Resources\User\UserResource;
use Closure;
use Illuminate\Http\JsonResponse;
use Illuminate\Http\RedirectResponse;
use Illuminate\Http\Request;
use Illuminate\Http\Response;
use Inertia\Inertia;
use Mcamara\LaravelLocalization\Facades\LaravelLocalization;

class ShareInertiaData
{
    /**
     * Share InertiaData
     *
     * @param Request $request
     * @param Closure $next
     *
     * @return \Illuminate\Http\RedirectResponse|Response|JsonResponse
     */
    public function handle(Request $request, Closure $next): RedirectResponse|Response|JsonResponse
    {
        $lang = [
            'current' => [
                'name' => LaravelLocalization::getCurrentLocaleNative(),
                'locale' => LaravelLocalization::getCurrentLocale(),
            ],
        ];
        foreach (LaravelLocalization::getSupportedLocales() as $localeCode => $properties) {
            $lang['routes'][$localeCode] = [
                'route' => LaravelLocalization::getLocalizedURL($localeCode, null, [], false),
                'properties' => $properties,
            ];
        }

        Inertia::share(array_filter([
            'user' => $request->user() ? new UserResource($request->user()) : null,
            'lang' => $lang,
        ]));

        return $next($request);
    }
}

This will return the following props to the front-end.

{
   "props":{
      "lang":{
         "current":{
            "name":"English",
            "locale":"en"
         },
         "routes":{
            "en":{
               "route":"https:\/\/domain.com\/en",
               "properties":{
                  "name":"English",
                  "script":"Latn",
                  "native":"English",
                  "regional":"en_GB"
               }
            },
            "nl":{
               "route":"https:\/\/domain.com\/nl",
               "properties":{
                  "name":"Dutch",
                  "script":"Latn",
                  "native":"Nederlands",
                  "regional":"nl_NL"
               }
            }
         }
      }
   }
}

Those page props I use to build a language switcher, but mainly use it to retrieve the current language which I use to translate the date for people.

Additionally I use the npm package laravel-vue-i18n, this will convert all of the files in your lang/ folder to .json files. This allows you to keep all of your translations in your backend, and then simply do something like this for example.

{{ $t('validation.password') }}

This is probably all unnecessary in your use case, but I always add it in projects at the start to future proof it in case the website might need translations in the future. It's a very nice way to format your date in my opinion.

0 replies

Jijiri89 · 2023-07-27T08:01:20Z

Jijiri89
Jul 27, 2023
Author

This is great, thank you so much! I am most grateful

…

On Thu, Jul 27, 2023, 7:58 AM Twyar ***@***.***> wrote: I would personally skip formatting in the back-end and just return the datetime value as it is. Then use date-fns or moment.js something similar to make a component for me which formats the time in the frontend. This is what I use for example: <script setup> import { format } from 'date-fns'; import { enUS, nl } from 'date-fns/locale'; const locales = { nl, enUS }; defineProps({ value: { type: String, required: true, }, defaultFormat: { type: String, required: false, default: 'PPPP', },});</script> <template> <span> {{ format(new Date(value), defaultFormat, { locale: locales[$page.props.lang.current.locale], timeZone: '' }) }} </span> </template> Optional You can set locale to whatever you like. But personally I use Laravel Localization <https://github.com/mcamara/laravel-localization> on my website to have it in multiple languages. I then have the following in my ShareInertiaData.php Middleware. <?php namespace App\Http\Middleware; use App\Http\Resources\User\UserResource;use Closure;use Illuminate\Http\JsonResponse;use Illuminate\Http\RedirectResponse;use Illuminate\Http\Request;use Illuminate\Http\Response;use Inertia\Inertia;use Mcamara\LaravelLocalization\Facades\LaravelLocalization; class ShareInertiaData { /** * Share InertiaData * * @param Request $request * @param Closure $next * * @return \Illuminate\Http\RedirectResponse|Response|JsonResponse */ public function handle(Request $request, Closure $next): RedirectResponse|Response|JsonResponse { $lang = [ 'current' => [ 'name' => LaravelLocalization::getCurrentLocaleNative(), 'locale' => LaravelLocalization::getCurrentLocale(), ], ]; foreach (LaravelLocalization::getSupportedLocales() as $localeCode => $properties) { $lang['routes'][$localeCode] = [ 'route' => LaravelLocalization::getLocalizedURL($localeCode, null, [], false), 'properties' => $properties, ]; } Inertia::share(array_filter([ 'user' => $request->user() ? new UserResource($request->user()) : null, 'lang' => $lang, ])); return $next($request); } } This will return the following props to the front-end. { "props":{ "lang":{ "current":{ "name":"English", "locale":"en" }, "routes":{ "en":{ "route":"https:\/\/domain.com\/en", "properties":{ "name":"English", "script":"Latn", "native":"English", "regional":"en_GB" } }, "nl":{ "route":"https:\/\/domain.com\/nl", "properties":{ "name":"Dutch", "script":"Latn", "native":"Nederlands", "regional":"nl_NL" } } } } } } Those page props I use to build a language switcher, but mainly use it to retrieve the current language which I use to translate the date for people. Additionally I use the npm package laravel-vue-i18n <https://github.com/xiCO2k/laravel-vue-i18n>, this will convert all of the files in your lang/ folder to .json files. This allows you to keep all of your translations in your backend, and then simply do something like this for example. {{ $t('validation.password') }} This is probably all unnecessary in your use case, but I always add it in projects at the start to future proof it in case the website might need translations in the future. It's a very nice way to format your date in my opinion. — Reply to this email directly, view it on GitHub <#1612 (comment)>, or unsubscribe <https://github.com/notifications/unsubscribe-auth/AZJNDXNEWD3J4KTAZX27HPLXSINTNANCNFSM6AAAAAA2LEJYN4> . You are receiving this because you authored the thread.Message ID: ***@***.***>

0 replies

Twyar · 2023-07-27T09:07:26Z

Twyar
Jul 27, 2023

Also, is it anyway to speed up the loading time of the inertia vuejs 3 pages? It is like my pages take too long to load.

As for this, I use Laravel Debugbar which is an amazing package for development.

You'll get an additional console on development which shows all the Queries, Models, Gates, Sessions, Request, etc loaded on your current page.

The Queries tab shows you all the database statements and how long they took to execute, based on this you could try to improve the queries.

0 replies

Jijiri89 · 2023-07-27T10:42:13Z

Jijiri89
Jul 27, 2023
Author

Thanks for the tip! Please, with inertia vuejs 3, with the deployment to the cpanel, after running npm run build, is there any thing to do again or that would be all for me to upload to cpanel.

…

On Thu, Jul 27, 2023, 9:07 AM Twyar ***@***.***> wrote: Also, is it anyway to speed up the loading time of the inertia vuejs 3 pages? It is like my pages take too long to load. As for this, I use Laravel Debugbar <https://github.com/barryvdh/laravel-debugbar> which is an amazing package for development. You'll get an additional console on development which shows all the Queries, Models, Gates, Sessions, Request, etc loaded on your current page. The Queries tab shows you all the database statements and how long they took to execute, based on this you could try to improve the queries. — Reply to this email directly, view it on GitHub <#1612 (comment)>, or unsubscribe <https://github.com/notifications/unsubscribe-auth/AZJNDXJTVTVZRXTP2CJO5YLXSIVVTANCNFSM6AAAAAA2LEJYN4> . You are receiving this because you authored the thread.Message ID: ***@***.***>

1 reply

Twyar Jul 27, 2023

It depends on your setup.

If you only have a cPanel where you can upload files then yes you have to manually do npm run build on your local computer and then upload everything and that should be enough.

However, what you should to do is create a new file that's called .env.production, you can simply to cp .env .env.production. I'm prette sure that when you do npm run build which does vite build it will automatically grab the production environments. This way you can set the variables in the .env.production to the correct ones such as your APP_URL, DB_*, MAIL_*, etc.

If you have a VPS or something similar I would recommend looking into CI/CD and Pipelines. This can automatically pull and build your code on the server once you merge your latest changes with a master branch on your repo. Personally I always use Gitlab for this, but I assume Github Actions is somewhat the same.

This allows you to have a fully automated workflow.

Jijiri89 · 2023-07-27T16:43:19Z

Jijiri89
Jul 27, 2023
Author

Awesome, thanks for the info! It is possible to use github.com to upload my laravel inertia vuejs 3 to my shared hosting cpanel app?

…

On Thu, Jul 27, 2023, 11:30 AM Twyar ***@***.***> wrote: It depends on your setup. If you only have a cPanel where you can upload files then yes you have to manually do npm run build on your local computer and then upload everything and that should be enough. However, what you should to do is create a new file that's called .env.production, you can simply to cp .env .env.production. I'm prette sure that when you do npm run build which does vite build it will automatically grab the production environments. This way you can set the variables in the .env.production to the correct ones such as your APP_URL, DB_*, MAIL_*, etc. If you have a VPS or something similar I would recommend looking into CI/CD and Pipelines. This can automatically pull and build your code on the server once you merge your latest changes with a master branch on your repo. Personally I always use Gitlab for this, but I assume Github Actions is somewhat the same. This allows you to have a fully automated workflow. — Reply to this email directly, view it on GitHub <#1612 (reply in thread)>, or unsubscribe <https://github.com/notifications/unsubscribe-auth/AZJNDXNKWKPMPS3LWBCOKFDXSJGOVANCNFSM6AAAAAA2LEJYN4> . You are receiving this because you authored the thread.Message ID: ***@***.***>

0 replies

Jijiri89 · 2023-07-29T13:31:25Z

Jijiri89
Jul 29, 2023
Author

Hello sir Please I deployed my laravel inertia vuejs 3 project to cpanel but when I visit the url of the website, I get this error, Vite manifest not found at: /home/copkamen/myapp/public/build/manifest.json Build the production assets Run npm run build in your deployment script. - Asset bundling with Vite <https://laravel.com/docs/9.x/vite#running-vite> Expand vendor frames 1. 2 vendor frames On Thu, Jul 27, 2023, 4:42 PM JIJIRI JOHNSON ***@***.***> wrote:

…

Awesome, thanks for the info! It is possible to use github.com to upload my laravel inertia vuejs 3 to my shared hosting cpanel app? On Thu, Jul 27, 2023, 11:30 AM Twyar ***@***.***> wrote: > It depends on your setup. > > If you only have a cPanel where you can upload files then yes you have to > manually do npm run build on your local computer and then upload > everything and that should be enough. > > However, what you should to do is create a new file that's called > .env.production, you can simply to cp .env .env.production. I'm prette > sure that when you do npm run build which does vite build it will > automatically grab the production environments. This way you can set the > variables in the .env.production to the correct ones such as your APP_URL, > DB_*, MAIL_*, etc. > > If you have a VPS or something similar I would recommend looking into > CI/CD and Pipelines. This can automatically pull and build your code on the > server once you merge your latest changes with a master branch on your > repo. Personally I always use Gitlab for this, but I assume Github Actions > is somewhat the same. > > This allows you to have a fully automated workflow. > > — > Reply to this email directly, view it on GitHub > <#1612 (reply in thread)>, > or unsubscribe > <https://github.com/notifications/unsubscribe-auth/AZJNDXNKWKPMPS3LWBCOKFDXSJGOVANCNFSM6AAAAAA2LEJYN4> > . > You are receiving this because you authored the thread.Message ID: > ***@***.***> >

1 reply

Twyar Jul 29, 2023

Have you done npm run build locally ? If so you need to push your build files to the repo.

Standard path is /public/build. This path might be in your .gitignore file so Git won’t track the changes and allow you to push them to your repo.

Remove the /public/build Line from your .gitignore File, commit and push the changes. Then build the files and push those. Now you can put those on the cPanel.

Jijiri89 · 2023-07-29T13:59:40Z

Jijiri89
Jul 29, 2023
Author

Thanks for your response. Please, after running npm run build, I just zipped the project and uploaded it to my cpanel FileMaker. The backend is working fine but the front-end is what gives me that error. I did not use github.com to upload the project to cpanel.

…

On Sat, Jul 29, 2023, 1:55 PM Twyar ***@***.***> wrote: Have you done npm run build locally ? If so you need to push your build files to the repo. Standard path is /public/build. This path might be in your .gitignore file so Git won’t track the changes and allow you to push them to your repo. Remove the /public/build Line from your .gitignore File, commit and push the changes. Then build the files and push those. Now you can put those on the cPanel. — Reply to this email directly, view it on GitHub <#1612 (reply in thread)>, or unsubscribe <https://github.com/notifications/unsubscribe-auth/AZJNDXJ4W6OLZYG5FEI3F5TXSUI4PANCNFSM6AAAAAA2LEJYN4> . You are receiving this because you authored the thread.Message ID: ***@***.***>

1 reply

Twyar Jul 29, 2023

If you did npm run build It should’ve build tje files in /public/build. It should contain a manifest.json as well

Are you sure you’re uploading the correct files ?

Jijiri89 · 2023-07-29T14:34:36Z

Jijiri89
Jul 29, 2023
Author

Yes, I did! Please. I am uploading it again to see.

…

On Sat, Jul 29, 2023, 2:05 PM Twyar ***@***.***> wrote: If you did npm run build It should’ve build tje files in /public/build. It should contain a manifest.json as well Are you sure you’re uploading the correct files ? — Reply to this email directly, view it on GitHub <#1612 (reply in thread)>, or unsubscribe <https://github.com/notifications/unsubscribe-auth/AZJNDXM7UEISPCEXCHIMN7LXSUKBJANCNFSM6AAAAAA2LEJYN4> . You are receiving this because you authored the thread.Message ID: ***@***.***>

0 replies

Jijiri89 · 2023-07-29T15:19:24Z

Jijiri89
Jul 29, 2023
Author

Still, I tied but it is not working. Here is the url : https://copkamenglish.org/ On Sat, Jul 29, 2023, 2:33 PM JIJIRI JOHNSON ***@***.***> wrote:

…

Yes, I did! Please. I am uploading it again to see. On Sat, Jul 29, 2023, 2:05 PM Twyar ***@***.***> wrote: > If you did npm run build It should’ve build tje files in /public/build. > It should contain a manifest.json as well > > Are you sure you’re uploading the correct files ? > > — > Reply to this email directly, view it on GitHub > <#1612 (reply in thread)>, > or unsubscribe > <https://github.com/notifications/unsubscribe-auth/AZJNDXM7UEISPCEXCHIMN7LXSUKBJANCNFSM6AAAAAA2LEJYN4> > . > You are receiving this because you authored the thread.Message ID: > ***@***.***> >

0 replies

Jijiri89 · 2023-07-29T18:09:41Z

Jijiri89
Jul 29, 2023
Author

This is how I did it. The following screenshot explains it well. On Sat, Jul 29, 2023, 3:18 PM JIJIRI JOHNSON ***@***.***> wrote:

…

Still, I tied but it is not working. Here is the url : https://copkamenglish.org/ On Sat, Jul 29, 2023, 2:33 PM JIJIRI JOHNSON ***@***.***> wrote: > Yes, I did! Please. I am uploading it again to see. > > On Sat, Jul 29, 2023, 2:05 PM Twyar ***@***.***> wrote: > >> If you did npm run build It should’ve build tje files in /public/build. >> It should contain a manifest.json as well >> >> Are you sure you’re uploading the correct files ? >> >> — >> Reply to this email directly, view it on GitHub >> <#1612 (reply in thread)>, >> or unsubscribe >> <https://github.com/notifications/unsubscribe-auth/AZJNDXM7UEISPCEXCHIMN7LXSUKBJANCNFSM6AAAAAA2LEJYN4> >> . >> You are receiving this because you authored the thread.Message ID: >> ***@***.***> >> >

0 replies

Provide feedback

Saved searches

Use saved searches to filter your results more quickly

Date format in inertia vuejs 3 #1612

{{title}}

{{editor}}'s edit

{{editor}}'s edit

Replies: 17 comments 4 replies

{{title}}

{{title}}

{{title}}

{{title}}

{{title}}

{{title}}

{{title}}

{{title}}

{{title}}

{{editor}}'s edit

{{editor}}'s edit

{{title}}

{{title}}

{{title}}

{{title}}

{{title}}

{{title}}

{{title}}

{{title}}

{{title}}

{{title}}

{{title}}

{{title}}

Select a reply

Date format in inertia vuejs 3 #1612

Replies: 17 comments · 4 replies

Jijiri89 Jul 16, 2023 Author

Jijiri89 Jul 16, 2023 Author

Jijiri89 Jul 16, 2023 Author

Jijiri89 Jul 16, 2023 Author

Optional

This is probably all unnecessary in your use case, but I always add it in projects at the start to future proof it in case the website might need translations in the future. It's a very nice way to format your date in my opinion.

Jijiri89 Jul 27, 2023 Author

Jijiri89 Jul 27, 2023 Author

Jijiri89 Jul 27, 2023 Author

Jijiri89 Jul 29, 2023 Author

Jijiri89 Jul 29, 2023 Author

Jijiri89 Jul 29, 2023 Author

Jijiri89 Jul 29, 2023 Author

Jijiri89 Jul 29, 2023 Author

Replies: 17 comments 4 replies

Jijiri89
Jul 16, 2023
Author

Jijiri89
Jul 16, 2023
Author

Jijiri89
Jul 16, 2023
Author

Jijiri89
Jul 16, 2023
Author

Jijiri89
Jul 27, 2023
Author

Jijiri89
Jul 27, 2023
Author

Jijiri89
Jul 27, 2023
Author

Jijiri89
Jul 29, 2023
Author

Jijiri89
Jul 29, 2023
Author

Jijiri89
Jul 29, 2023
Author

Jijiri89
Jul 29, 2023
Author

Jijiri89
Jul 29, 2023
Author