Skip to content

Commit 1ac543f

Browse files
taylorotwelltaylorotwell
committed
fix conflicts
2 parents 411ac78 + ad7570a commit 1ac543f

File tree

7 files changed

+508
-496
lines changed

7 files changed

+508
-496
lines changed

‎components.json‎

Lines changed: 0 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -1,7 +1,6 @@
11
{
22
"$schema": "https://shadcn-vue.com/schema.json",
33
"style": "default",
4-
"tsx": true,
54
"tailwind": {
65
"config": "tailwind.config.js",
76
"css": "resources/css/app.css",

‎package-lock.json‎

Lines changed: 438 additions & 435 deletions
Some generated files are not rendered by default. Learn more about customizing how changed files appear on GitHub.

‎package.json‎

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -23,7 +23,7 @@
2323
"vue-tsc": "^2.2.4"
2424
},
2525
"dependencies": {
26-
"@inertiajs/vue3": "^2.0.0",
26+
"@inertiajs/vue3": "^2.1.0",
2727
"@tailwindcss/vite": "^4.1.11",
2828
"@vitejs/plugin-vue": "^6.0.0",
2929
"@vueuse/core": "^12.8.2",

‎resources/js/components/DeleteUser.vue‎

Lines changed: 25 additions & 22 deletions
Original file line numberDiff line numberDiff line change
@@ -1,5 +1,5 @@
11
<script setup lang="ts">
2-
import { useForm } from '@inertiajs/vue3';
2+
import { Form } from '@inertiajs/vue3';
33
44
import HeadingSmall from '@/components/HeadingSmall.vue';
55
import { Button } from '@/components/ui/button';
@@ -13,23 +13,6 @@ import {
1313
DialogTitle,
1414
DialogTrigger,
1515
} from '@/components/ui/dialog';
16-
17-
const form = useForm({});
18-
19-
const deleteUser = (e: Event) => {
20-
e.preventDefault();
21-
22-
form.delete(route('profile.destroy'), {
23-
preserveScroll: true,
24-
onSuccess: () => closeModal(),
25-
onFinish: () => form.reset(),
26-
});
27-
};
28-
29-
const closeModal = () => {
30-
form.clearErrors();
31-
form.reset();
32-
};
3316
</script>
3417

3518
<template>
@@ -45,7 +28,17 @@ const closeModal = () => {
4528
<Button variant="destructive">Delete account</Button>
4629
</DialogTrigger>
4730
<DialogContent>
48-
<form class="space-y-6" @submit="deleteUser">
31+
<Form
32+
method="delete"
33+
:action="route('profile.destroy')"
34+
reset-on-success
35+
@error="() => passwordInput?.focus()"
36+
:options="{
37+
preserveScroll: true,
38+
}"
39+
class="space-y-6"
40+
v-slot="{ errors, processing, reset, clearErrors }"
41+
>
4942
<DialogHeader class="space-y-3">
5043
<DialogTitle>Are you sure you want to delete your account?</DialogTitle>
5144
<DialogDescription>
@@ -56,12 +49,22 @@ const closeModal = () => {
5649

5750
<DialogFooter class="gap-2">
5851
<DialogClose as-child>
59-
<Button variant="secondary" @click="closeModal"> Cancel </Button>
52+
<Button
53+
variant="secondary"
54+
@click="
55+
() => {
56+
clearErrors();
57+
reset();
58+
}
59+
"
60+
>
61+
Cancel
62+
</Button>
6063
</DialogClose>
6164

62-
<Button type="submit" variant="destructive" :disabled="form.processing"> Delete account </Button>
65+
<Button type="submit" variant="destructive" :disabled="processing"> Delete account </Button>
6366
</DialogFooter>
64-
</form>
67+
</Form>
6568
</DialogContent>
6669
</Dialog>
6770
</div>

‎resources/js/pages/Dashboard.vue‎

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -16,7 +16,7 @@ const breadcrumbs: BreadcrumbItem[] = [
1616
<Head title="Dashboard" />
1717

1818
<AppLayout :breadcrumbs="breadcrumbs">
19-
<div class="flex h-full flex-1 flex-col gap-4 rounded-xl p-4 overflow-x-auto">
19+
<div class="flex h-full flex-1 flex-col gap-4 overflow-x-auto rounded-xl p-4">
2020
<div class="grid auto-rows-min gap-4 md:grid-cols-3">
2121
<div class="relative aspect-video overflow-hidden rounded-xl border border-sidebar-border/70 dark:border-sidebar-border">
2222
<PlaceholderPattern />

‎resources/js/pages/settings/Profile.vue‎

Lines changed: 27 additions & 21 deletions
Original file line numberDiff line numberDiff line change
@@ -1,6 +1,4 @@
11
<script setup lang="ts">
2-
import { Head, useForm, usePage } from '@inertiajs/vue3';
3-
42
import DeleteUser from '@/components/DeleteUser.vue';
53
import HeadingSmall from '@/components/HeadingSmall.vue';
64
import InputError from '@/components/InputError.vue';
@@ -10,6 +8,7 @@ import { Label } from '@/components/ui/label';
108
import AppLayout from '@/layouts/AppLayout.vue';
119
import SettingsLayout from '@/layouts/settings/Layout.vue';
1210
import { type BreadcrumbItem, type User } from '@/types';
11+
import { Form, Head, usePage } from '@inertiajs/vue3';
1312
1413
interface Props {
1514
status?: string;
@@ -26,17 +25,6 @@ const breadcrumbItems: BreadcrumbItem[] = [
2625
2726
const page = usePage();
2827
const user = page.props.auth.user as User;
29-
30-
const form = useForm({
31-
name: user.name,
32-
email: user.email,
33-
});
34-
35-
const submit = () => {
36-
form.patch(route('profile.update'), {
37-
preserveScroll: true,
38-
});
39-
};
4028
</script>
4129

4230
<template>
@@ -47,32 +35,50 @@ const submit = () => {
4735
<div class="flex flex-col space-y-6">
4836
<HeadingSmall title="Profile information" description="Update your name and email address" />
4937

50-
<form @submit.prevent="submit" class="space-y-6">
38+
<Form method="patch" :action="route('profile.update')" class="space-y-6" v-slot="{ errors, processing, recentlySuccessful }">
5139
<div class="grid gap-2">
5240
<Label for="name">Name</Label>
53-
<Input id="name" class="mt-1 block w-full" v-model="form.name" required autocomplete="name" placeholder="Full name" />
54-
<InputError class="mt-2" :message="form.errors.name" />
41+
<Input
42+
id="name"
43+
class="mt-1 block w-full"
44+
name="name"
45+
:default-value="user.name"
46+
required
47+
autocomplete="name"
48+
placeholder="Full name"
49+
/>
50+
<InputError class="mt-2" :message="errors.name" />
5551
</div>
5652

5753
<div class="grid gap-2">
5854
<Label for="email">Email address</Label>
59-
<Input id="email" type="email" class="mt-1 block w-full" v-model="form.email" required autocomplete="username" disabled />
60-
<InputError class="mt-2" :message="form.errors.email" />
55+
<Input
56+
id="email"
57+
type="email"
58+
class="mt-1 block w-full"
59+
name="email"
60+
:default-value="user.email"
61+
required
62+
autocomplete="username"
63+
placeholder="Email address"
64+
disabled
65+
/>
66+
<InputError class="mt-2" :message="errors.email" />
6167
</div>
6268

6369
<div class="flex items-center gap-4">
64-
<Button :disabled="form.processing">Save</Button>
70+
<Button :disabled="processing">Save</Button>
6571

6672
<Transition
6773
enter-active-class="transition ease-in-out"
6874
enter-from-class="opacity-0"
6975
leave-active-class="transition ease-in-out"
7076
leave-to-class="opacity-0"
7177
>
72-
<p v-show="form.recentlySuccessful" class="text-sm text-neutral-600">Saved.</p>
78+
<p v-show="recentlySuccessful" class="text-sm text-neutral-600">Saved.</p>
7379
</Transition>
7480
</div>
75-
</form>
81+
</Form>
7682
</div>
7783

7884
<DeleteUser />

‎resources/js/ssr.ts‎

Lines changed: 16 additions & 15 deletions
Original file line numberDiff line numberDiff line change
@@ -1,26 +1,27 @@
11
import { createInertiaApp } from '@inertiajs/vue3';
22
import createServer from '@inertiajs/vue3/server';
3-
import { renderToString } from 'vue/server-renderer';
43
import { resolvePageComponent } from 'laravel-vite-plugin/inertia-helpers';
54
import { createSSRApp, DefineComponent, h } from 'vue';
5+
import { renderToString } from 'vue/server-renderer';
66
import { ZiggyVue } from 'ziggy-js';
77

88
const appName = import.meta.env.VITE_APP_NAME || 'Laravel';
99

10-
createServer((page) =>
11-
createInertiaApp({
12-
page,
13-
render: renderToString,
14-
title: (title) => title ? `${title} - ${appName}` : appName,
15-
resolve: resolvePage,
16-
setup: ({ App, props, plugin }) =>
17-
createSSRApp({ render: () => h(App, props) })
18-
.use(plugin)
19-
.use(ZiggyVue, {
20-
...page.props.ziggy,
21-
location: new URL(page.props.ziggy.location),
22-
}),
23-
}),
10+
createServer(
11+
(page) =>
12+
createInertiaApp({
13+
page,
14+
render: renderToString,
15+
title: (title) => (title ? `${title} - ${appName}` : appName),
16+
resolve: resolvePage,
17+
setup: ({ App, props, plugin }) =>
18+
createSSRApp({ render: () => h(App, props) })
19+
.use(plugin)
20+
.use(ZiggyVue, {
21+
...page.props.ziggy,
22+
location: new URL(page.props.ziggy.location),
23+
}),
24+
}),
2425
{ cluster: true },
2526
);
2627

0 commit comments

Comments
 (0)