prod mix

# Conflicts:
#	public/js/app.js

public/vendor/horizon/mix-manifest.json

@@ -1,5 +1,5 @@
 {
-    "/app.js": "/app.js?id=a3e1d4d3c5a76fa94b66",
+    "/app.js": "/app.js?id=f736699d474c1354ffac",
     "/app-dark.css": "/app-dark.css?id=ade35296e4fa0c99a758",
     "/app.css": "/app.css?id=c14814cc1a7a4f298934",
     "/img/favicon.png": "/img/favicon.png?id=1542bfe8a0010dcbee71"

resources/js/Pages/Admin/Services/Site/Edit.vue

@@ -158,8 +158,11 @@
             submit() {
                 this.sending = true
 
-                this.$inertia.patch(this.route('admin.services.sites.update', this.site.id), this.form)
-                    .then(() => this.sending = false)
+                this.$inertia.patch(this.route('admin.services.sites.update', this.site.id), this.form, {
+                    onFinish: () => {
+                        this.sending = false;
+                    }
+                })
             },
 
             confirmDelete() {
@@ -173,21 +176,25 @@
             delete() {
                 this.sending = true
 
-                this.$inertia.delete(this.route('admin.services.sites.delete', this.site.id))
-                    .then(() => this.sending = false)
+                this.$inertia.delete(this.route('admin.services.sites.delete', this.site.id), {
+                    onFinish: () => {
+                        this.sending = false;
+                    }
+                })
             },
 
             attach() {
                 this.sending = true
 
-                this.$inertia.post(this.route('admin.services.sites.attach', this.site.id), this.formAttach)
-                    .then(() => {
+                this.$inertia.post(this.route('admin.services.sites.attach', this.site.id), this.formAttach, {
+                    onFinish: () => {
                         this.sending = false
 
                         if (!Object.keys(this.$page.props.errors).length) {
                             this.formAttach.email = null;
                         }
-                    })
+                    }
+                });
             },
 
             confirmDetach(userId) {
@@ -201,8 +208,11 @@
             detach(userId) {
                 this.sending = true
 
-                this.$inertia.delete(this.route('admin.services.sites.detach', [this.site.id, userId]))
-                    .then(() => this.sending = false)
+                this.$inertia.delete(this.route('admin.services.sites.detach', [this.site.id, userId]), {
+                    onFinish: () => {
+                        this.sending = false;
+                    }
+                })
             }
         }
     }

resources/js/Pages/Admin/Terms.vue

@@ -145,7 +145,7 @@ export default {
         },
 
         getTemplate(type) {
-            axios.get(this.route('admin.settings.terms.template'))
+            window.axios.get(this.route('admin.settings.terms.template'))
                 .then(response => {
                     this.$refs.terms_of_service.simplemde.value(response.data.content);
                     this.form.terms = response.data.content;

resources/js/Pages/Admin/Users/Edit.vue

@@ -169,8 +169,11 @@ export default {
         delete() {
             this.sending = true
 
-            this.$inertia.delete(this.route('admin.users.destroy', this.user.id))
-                .then(() => this.sending = false)
+            this.$inertia.delete(this.route('admin.users.destroy', this.user.id), {
+                onFinish: () => {
+                    this.sending = false;
+                }
+            })
         }
     }
 }

resources/js/Pages/Auth/Email.vue

@@ -64,19 +64,21 @@
 
                 this.$inertia.post(this.route('password.email'), {
                     email: this.form.email,
-                }).then(() => {
-                    this.sending = false
+                }, {
+                    onFinish: () => {
+                        this.sending = false
 
-                    if (!Object.keys(this.$page.props.errors).length) {
-                        this.form.email = null;
+                        if (!Object.keys(this.$page.props.errors).length) {
+                            this.form.email = null;
 
-                        useNotification({
-                            variant: 'success',
-                            title: this.__('Reset password'),
-                            message: this.$page.props.flash.success,
-                        })
+                            useNotification({
+                                variant: 'success',
+                                title: this.__('Reset password'),
+                                message: this.$page.props.flash.success,
+                            })
+                        }
                     }
-                })
+                });
             },
         },
     }

resources/js/Pages/Sites/Apps.vue

@@ -196,10 +196,11 @@
                 this.$inertia.post(this.route('sites.apps.store', this.site.id), {
                     type: this.type,
                     options: this.options
-                })
-                    .then(() => {
-                        this.type = null;
-                    })
+                }, {
+                    onFinish: () => {
+                        this.type = null
+                    }
+                });
             },
 
             uninstall() {

resources/js/Pages/Sites/Cronjobs.vue

@@ -283,7 +283,7 @@
             },
 
             poll() {
-                this.$inertia.replace(this.route('sites.cronjobs.index', this.site.id), {
+                this.$inertia.get(this.route('sites.cronjobs.index', this.site.id), {
                     only: ['cronjobs'],
                     preserveScroll: true,
                 })
@@ -292,18 +292,19 @@
             submit() {
                 this.sending = true
 
-                this.$inertia.post(this.route('sites.cronjobs.store', this.site.id), this.form)
-                    .then(() => {
+                this.$inertia.post(this.route('sites.cronjobs.store', this.site.id), this.form, {
+                    onFinish: () => {
                         this.sending = false
 
                         if (!Object.keys(this.$page.props.errors).length) {
                             this.form = {
-                                command: `php /home/${this.$page.props.auth.user.user_name}/domain.com/script.php`,
+                                command: `php /home/${this.$page.props.auth.user.user_name}/${this.site.domain}/script.php`,
                                 interval: 'minutely',
                                 frequency: '* * * * *',
                             }
                         }
-                    })
+                    }
+                })
             },
 
             confirmDelete(cronjob) {

resources/js/Pages/Sites/Databases.vue

@@ -23,9 +23,12 @@
                                 </template>
                                 <template #form>
                                     <form class="space-y-4" @submit.prevent="submit">
-                                        <FormInput :label="__('Name')" :errors="$page.props.errors.name" v-model="form.name"/>
-                                        <FormInput :label="__('User')" :errors="$page.props.errors.user_name" v-model="form.user_name"/>
-                                        <FormInput :label="__('Password')" :errors="$page.props.errors.password" v-model="form.password"/>
+                                        <FormInput :label="__('Name')" :errors="$page.props.errors.name"
+                                                   v-model="form.name"/>
+                                        <FormInput :label="__('User')" :errors="$page.props.errors.user_name"
+                                                   v-model="form.user_name"/>
+                                        <FormInput :label="__('Password')" :errors="$page.props.errors.password"
+                                                   v-model="form.password"/>
 
                                         <FormActions>
                                             <Button>{{ __('Save changes') }}</Button>
@@ -34,7 +37,7 @@
                                 </template>
                             </SettingsSegment>
 
-                            <EmptyImage v-if="!databases.meta.total" />
+                            <EmptyImage v-if="!databases.meta.total"/>
 
                             <SettingsSegment v-if="databases.meta.total">
                                 <template #title>{{ __('Databases') }}</template>
@@ -50,10 +53,14 @@
                                             </TableHead>
                                             <TableBody>
                                                 <TableRow v-for="database in databases.data" :key="database.id">
-                                                    <TableData><StatusBubble :variant="database.status === 'busy' ? 'gray' : 'success'"/></TableData>
+                                                    <TableData>
+                                                        <StatusBubble
+                                                            :variant="database.status === 'busy' ? 'gray' : 'success'"/>
+                                                    </TableData>
                                                     <TableData>{{ database.name }}</TableData>
                                                     <TableData>
-                                                        <Button :disabled="database.status === 'busy'" variant="danger" size="sm"
+                                                        <Button :disabled="database.status === 'busy'" variant="danger"
+                                                                size="sm"
                                                                 @click="confirmDelete(database)">
                                                             {{ __('Delete') }}
                                                         </Button>
@@ -75,188 +82,189 @@
 </template>
 
 <script>
-    import TopBar from './components/TopBar'
-    import Container from '@/components/Container'
-    import Content from '@/components/Content'
-    import Page from '@/components/Page'
-    import PageHeader from '@/components/PageHeader'
-    import PageHeaderTitle from '@/components/PageHeaderTitle'
-    import PageBody from '@/components/PageBody'
-    import Button from '@/components/Button'
-    import List from '@/components/List'
-    import ListItem from '@/components/ListItem'
-    import StatusBubble from '@/components/StatusBubble'
-    import NotificationBadge from '@/components/NotificationBadge'
-    import MainLayout from '@/Layouts/MainLayout'
-    import SettingsLayout from '@/components/layouts/SettingsLayout'
-    import SettingsSegment from '@/components/SettingsSegment'
-    import FormInput from '@/components/forms/FormInput'
-    import Form from '@/components/Form'
-    import Pagination from '@/components/Pagination'
-    import EmptyImage from '@/components/EmptyImage'
-    import FormActions from '@/components/FormActions'
-    import {useConfirmDelete} from '@/hooks/confirm-delete'
-    import Tabs from './Tabs'
-    import Table from '@/components/Table'
-    import TableHead from '@/components/TableHead'
-    import TableHeader from '@/components/TableHeader'
-    import TableRow from '@/components/TableRow'
-    import TableBody from '@/components/TableBody'
-    import TableData from '@/components/TableData'
+import TopBar from './components/TopBar'
+import Container from '@/components/Container'
+import Content from '@/components/Content'
+import Page from '@/components/Page'
+import PageHeader from '@/components/PageHeader'
+import PageHeaderTitle from '@/components/PageHeaderTitle'
+import PageBody from '@/components/PageBody'
+import Button from '@/components/Button'
+import List from '@/components/List'
+import ListItem from '@/components/ListItem'
+import StatusBubble from '@/components/StatusBubble'
+import NotificationBadge from '@/components/NotificationBadge'
+import MainLayout from '@/Layouts/MainLayout'
+import SettingsLayout from '@/components/layouts/SettingsLayout'
+import SettingsSegment from '@/components/SettingsSegment'
+import FormInput from '@/components/forms/FormInput'
+import Form from '@/components/Form'
+import Pagination from '@/components/Pagination'
+import EmptyImage from '@/components/EmptyImage'
+import FormActions from '@/components/FormActions'
+import {useConfirmDelete} from '@/hooks/confirm-delete'
+import Tabs from './Tabs'
+import Table from '@/components/Table'
+import TableHead from '@/components/TableHead'
+import TableHeader from '@/components/TableHeader'
+import TableRow from '@/components/TableRow'
+import TableBody from '@/components/TableBody'
+import TableData from '@/components/TableData'
 
-    export default {
-        metaInfo() {
-            return {
-                title: `Databases - ${this.site.domain}`,
-            }
-        },
+export default {
+    metaInfo() {
+        return {
+            title: `Databases - ${this.site.domain}`,
+        }
+    },
 
-        layout: MainLayout,
+    layout: MainLayout,
 
-        components: {
-            TopBar,
-            Container,
-            Content,
-            Page,
-            PageHeader,
-            PageHeaderTitle,
-            PageBody,
-            Button,
-            List,
-            ListItem,
-            StatusBubble,
-            NotificationBadge,
-            FormInput,
-            SettingsLayout,
-            SettingsSegment,
-            Form,
-            FormActions,
-            Pagination,
-            Tabs,
-            Table,
-            TableHead,
-            TableHeader,
-            TableRow,
-            TableBody,
-            TableData,
-            EmptyImage
-        },
+    components: {
+        TopBar,
+        Container,
+        Content,
+        Page,
+        PageHeader,
+        PageHeaderTitle,
+        PageBody,
+        Button,
+        List,
+        ListItem,
+        StatusBubble,
+        NotificationBadge,
+        FormInput,
+        SettingsLayout,
+        SettingsSegment,
+        Form,
+        FormActions,
+        Pagination,
+        Tabs,
+        Table,
+        TableHead,
+        TableHeader,
+        TableRow,
+        TableBody,
+        TableData,
+        EmptyImage
+    },
 
-        data() {
-            return {
-                sending: false,
+    data() {
+        return {
+            sending: false,
 
-                form: {
-                    name: null,
-                    user_name: null,
-                    password: null,
+            form: {
+                name: null,
+                user_name: null,
+                password: null,
+            },
+
+            breadcrumbs: [
+                {
+                    title: this.$page.props.settings.name,
+                    to: '/',
                 },
+                {
+                    title: this.__('Sites'),
+                    to: this.route('sites.index'),
+                },
+                {
+                    title: this.site.domain,
+                    to: this.route('sites.show', this.site.id),
+                },
+                {
+                    title: this.__('Databases'),
+                    to: this.route('sites.databases.index', this.site.id),
+                },
+            ],
+        }
+    },
 
-                breadcrumbs: [
-                    {
-                        title: this.$page.props.settings.name,
-                        to: '/',
-                    },
-                    {
-                        title: this.__('Sites'),
-                        to: this.route('sites.index'),
-                    },
-                    {
-                        title: this.site.domain,
-                        to: this.route('sites.show', this.site.id),
-                    },
-                    {
-                        title: this.__('Databases'),
-                        to: this.route('sites.databases.index', this.site.id),
-                    },
-                ],
+    mounted() {
+        if (this.shouldBePolling) {
+            this.startPollingInterval();
+        }
+    },
+
+    watch: {
+        shouldBePolling: function (value) {
+            if (!value) {
+                this.clearPollingInterval();
+
+                return;
             }
-        },
 
-        mounted() {
-            if(this.shouldBePolling){
+            if (!this.pollingInterval) {
                 this.startPollingInterval();
             }
-        },
-
-        watch: {
-            shouldBePolling: function (value) {
-                if (!value) {
-                    this.clearPollingInterval();
-
-                    return;
-                }
-
-                if(!this.pollingInterval){
-                    this.startPollingInterval();
-                }
-            }
-        },
-
-        computed: {
-            shouldBePolling() {
-                return !!this.databases.data.filter((database) => {
-                    return database.status === 'busy';
-                }).length;
-            }
-        },
-
-        props: {
-            site: Object,
-            databases: Object,
-        },
-
-        methods: {
-            startPollingInterval(){
-                this.pollingInterval = setInterval(function () {
-                    this.poll();
-                }.bind(this), 3000);
-            },
-
-            clearPollingInterval(){
-                clearTimeout(this.pollingInterval);
-                this.pollingInterval = null;
-            },
-
-            poll() {
-                this.$inertia.replace(this.route('sites.databases.index', this.site.id), {
-                    only: ['databases'],
-                    preserveScroll: true,
-                })
-            },
-
-            submit() {
-                this.sending = true
-
-                this.$inertia.post(this.route('sites.databases.store', this.site.id), this.form)
-                    .then(() => {
-                        this.sending = false
-
-                        if (!Object.keys(this.$page.props.errors).length) {
-                            this.form.name = null;
-                            this.form.user_name = null;
-                            this.form.password = null;
-                        }
-                    })
-            },
-
-            confirmDelete(database) {
-                useConfirmDelete({
-                    title: this.__('Are you sure?'),
-                    message: this.__('Your database will be deleted permanently, this action cannot be undone.'),
-                    onConfirm: () => this.delete(database),
-                })
-            },
-
-            delete(database) {
-                this.$inertia.delete(this.route('sites.databases.delete', [this.site.id, database.id]), {
-                    preserveScroll: true
-                })
-            }
-        },
-
-        beforeDestroy(){
-            this.clearPollingInterval();
         }
+    },
+
+    computed: {
+        shouldBePolling() {
+            return !!this.databases.data.filter((database) => {
+                return database.status === 'busy';
+            }).length;
+        }
+    },
+
+    props: {
+        site: Object,
+        databases: Object,
+    },
+
+    methods: {
+        startPollingInterval() {
+            this.pollingInterval = setInterval(function () {
+                this.poll();
+            }.bind(this), 3000);
+        },
+
+        clearPollingInterval() {
+            clearTimeout(this.pollingInterval);
+            this.pollingInterval = null;
+        },
+
+        poll() {
+            this.$inertia.get(this.route('sites.databases.index', this.site.id), {
+                only: ['databases'],
+                preserveScroll: true,
+            })
+        },
+
+        submit() {
+            this.sending = true
+
+            this.$inertia.post(this.route('sites.databases.store', this.site.id), this.form, {
+                onFinish: () => {
+                    this.sending = false
+
+                    if (!Object.keys(this.$page.props.errors).length) {
+                        this.form.name = null;
+                        this.form.user_name = null;
+                        this.form.password = null;
+                    }
+                }
+            });
+        },
+
+        confirmDelete(database) {
+            useConfirmDelete({
+                title: this.__('Are you sure?'),
+                message: this.__('Your database will be deleted permanently, this action cannot be undone.'),
+                onConfirm: () => this.delete(database),
+            })
+        },
+
+        delete(database) {
+            this.$inertia.delete(this.route('sites.databases.delete', [this.site.id, database.id]), {
+                preserveScroll: true
+            })
+        }
+    },
+
+    beforeDestroy() {
+        this.clearPollingInterval();
     }
+}
 </script>

resources/js/Pages/Sites/Dns.vue

@@ -210,7 +210,7 @@
             getRecords() {
                 this.loading = true;
 
-                axios.get(this.route('sites.dns.records', this.site.id))
+                window.axios.get(this.route('sites.dns.records', this.site.id))
                     .then(response => {
                         this.loading = false;
                         this.records = response.data

resources/js/Pages/Sites/Redirects.vue

@@ -227,7 +227,7 @@
             },
 
             poll() {
-                this.$inertia.replace(this.route('sites.redirects.index', this.site.id), {
+                this.$inertia.get(this.route('sites.redirects.index', this.site.id), {
                     only: ['redirects'],
                     preserveScroll: true,
                 })
@@ -236,8 +236,8 @@
             submit() {
                 this.sending = true
 
-                this.$inertia.post(this.route('sites.redirects.store', this.site.id), this.form)
-                    .then(() => {
+                this.$inertia.post(this.route('sites.redirects.store', this.site.id), this.form, {
+                    onFinish: () => {
                         this.sending = false
 
                         if (!Object.keys(this.$page.props.errors).length) {
@@ -245,7 +245,8 @@
                             this.form.redirect_to = null;
                             this.form.type = 'redirect';
                         }
-                    })
+                    }
+                });
             },
 
             confirmDelete(redirect) {

resources/js/Pages/Sites/Settings.vue

@@ -33,20 +33,26 @@
                             <SettingsSegment>
                                 <template #title>{{ __('PHP version') }}</template>
                                 <template #subtitle>
-                                    {{ __('Change your PHP version here. If you do not have the version available get in touch with support to get this added.') }}
+                                    {{
+                                        __('Change your PHP version here. If you do not have the version available get in touch with support to get this added.')
+                                    }}
                                 </template>
                                 <template #form>
                                     <div class="space-y-4">
                                         <FormActions>
                                             <Button class="relative"
-                                                :disabled="available_php_version == site.php_version || sending"
-                                                @click="changePhpVersion(available_php_version)"
-                                                :key="available_php_version"
-                                                v-for="available_php_version in available_php_versions">{{ available_php_version }}
+                                                    :disabled="available_php_version == site.php_version || sending"
+                                                    @click="changePhpVersion(available_php_version)"
+                                                    :key="available_php_version"
+                                                    v-for="available_php_version in available_php_versions">
+                                                {{ available_php_version }}
 
-                                                <span class="flex absolute h-3 w-3 top-0 right-0 -mt-1 -mr-1" v-if="timeout">
-                                                  <span class="animate-ping absolute inline-flex h-full w-full rounded-circle bg-surface-1 opacity-75"></span>
-                                                  <span class="relative inline-flex rounded-circle h-3 w-3 bg-success"></span>
+                                                <span class="flex absolute h-3 w-3 top-0 right-0 -mt-1 -mr-1"
+                                                      v-if="timeout">
+                                                  <span
+                                                      class="animate-ping absolute inline-flex h-full w-full rounded-circle bg-surface-1 opacity-75"></span>
+                                                  <span
+                                                      class="relative inline-flex rounded-circle h-3 w-3 bg-success"></span>
                                                 </span>
                                             </Button>
                                         </FormActions>
@@ -88,139 +94,141 @@
 </template>
 
 <script>
-    import TopBar from './components/TopBar'
-    import Container from '@/components/Container'
-    import Content from '@/components/Content'
-    import Page from '@/components/Page'
-    import PageHeader from '@/components/PageHeader'
-    import PageHeaderTitle from '@/components/PageHeaderTitle'
-    import PageBody from '@/components/PageBody'
-    import Button from '@/components/Button'
-    import List from '@/components/List'
-    import ListItem from '@/components/ListItem'
-    import StatusBubble from '@/components/StatusBubble'
-    import NotificationBadge from '@/components/NotificationBadge'
-    import MainLayout from '@/Layouts/MainLayout'
-    import SettingsLayout from '@/components/layouts/SettingsLayout'
-    import SettingsSegment from '@/components/SettingsSegment'
-    import FormInput from '@/components/forms/FormInput'
-    import Form from '@/components/Form'
-    import FormActions from '@/components/FormActions'
-    import {useConfirmDelete} from '@/hooks/confirm-delete'
-    import Tabs from './Tabs'
+import TopBar from './components/TopBar'
+import Container from '@/components/Container'
+import Content from '@/components/Content'
+import Page from '@/components/Page'
+import PageHeader from '@/components/PageHeader'
+import PageHeaderTitle from '@/components/PageHeaderTitle'
+import PageBody from '@/components/PageBody'
+import Button from '@/components/Button'
+import List from '@/components/List'
+import ListItem from '@/components/ListItem'
+import StatusBubble from '@/components/StatusBubble'
+import NotificationBadge from '@/components/NotificationBadge'
+import MainLayout from '@/Layouts/MainLayout'
+import SettingsLayout from '@/components/layouts/SettingsLayout'
+import SettingsSegment from '@/components/SettingsSegment'
+import FormInput from '@/components/forms/FormInput'
+import Form from '@/components/Form'
+import FormActions from '@/components/FormActions'
+import {useConfirmDelete} from '@/hooks/confirm-delete'
+import Tabs from './Tabs'
 
-    export default {
-        metaInfo() {
-            return {
-                title: this.site.domain,
-            }
-        },
-
-        layout: MainLayout,
-
-        components: {
-            TopBar,
-            Container,
-            Content,
-            Page,
-            PageHeader,
-            PageHeaderTitle,
-            PageBody,
-            Button,
-            List,
-            ListItem,
-            StatusBubble,
-            NotificationBadge,
-            FormInput,
-            SettingsLayout,
-            SettingsSegment,
-            Form,
-            FormActions,
-            Tabs,
-        },
-
-        data() {
-            return {
-                sending: false,
-                timeout: null,
-
-                form: {
-                    domain: this.site.domain,
-                    dns_id: null
-                },
-
-                breadcrumbs: [
-                    {
-                        title: this.$page.props.settings.name,
-                        to: '/',
-                    },
-                    {
-                        title: this.__('Sites'),
-                        to: this.route('sites.index'),
-                    },
-                    {
-                        title: this.site.domain,
-                        to: this.route('sites.show', this.site.id),
-                    },
-                    {
-                        title: this.__('Settings'),
-                        to: this.route('sites.show', this.site.id),
-                    },
-                ],
-            }
-        },
-
-        props: {
-            site: Object,
-            available_php_versions: Array
-        },
-
-        methods: {
-            submit() {
-                this.sending = true
-
-                this.$inertia.patch(this.route('sites.settings.update', this.site.id), this.form)
-                    .then(() => {
-                        this.sending = false;
-                    })
-            },
-
-            changePhpVersion(version) {
-                this.sending = true;
-
-                this.$inertia.patch(this.route('sites.settings.php-version', this.site.id), {
-                    version: version
-                })
-                    .then(() => {
-                        this.timeout = setTimeout(() => {
-                            this.clearTimeoutInterval();
-                            this.sending = false;
-
-                            this.$inertia.replace(this.route('sites.settings.show', this.site.id));
-                        }, 3000);
-                    })
-            },
-
-            confirmDelete() {
-                useConfirmDelete({
-                    title: this.__('Are you sure?'),
-                    message: this.__('Your site will be deleted completely, this action is irreversible.'),
-                    onConfirm: () => this.delete(),
-                })
-            },
-
-            delete() {
-                this.$inertia.delete(this.route('sites.delete', this.site.id))
-            },
-
-            clearTimeoutInterval() {
-                clearTimeout(this.timeout);
-                this.timeout = null;
-            },
-        },
-
-        beforeDestroy() {
-            this.clearTimeoutInterval();
+export default {
+    metaInfo() {
+        return {
+            title: this.site.domain,
         }
+    },
+
+    layout: MainLayout,
+
+    components: {
+        TopBar,
+        Container,
+        Content,
+        Page,
+        PageHeader,
+        PageHeaderTitle,
+        PageBody,
+        Button,
+        List,
+        ListItem,
+        StatusBubble,
+        NotificationBadge,
+        FormInput,
+        SettingsLayout,
+        SettingsSegment,
+        Form,
+        FormActions,
+        Tabs,
+    },
+
+    data() {
+        return {
+            sending: false,
+            timeout: null,
+
+            form: {
+                domain: this.site.domain,
+                dns_id: null
+            },
+
+            breadcrumbs: [
+                {
+                    title: this.$page.props.settings.name,
+                    to: '/',
+                },
+                {
+                    title: this.__('Sites'),
+                    to: this.route('sites.index'),
+                },
+                {
+                    title: this.site.domain,
+                    to: this.route('sites.show', this.site.id),
+                },
+                {
+                    title: this.__('Settings'),
+                    to: this.route('sites.show', this.site.id),
+                },
+            ],
+        }
+    },
+
+    props: {
+        site: Object,
+        available_php_versions: Array
+    },
+
+    methods: {
+        submit() {
+            this.sending = true
+
+            this.$inertia.patch(this.route('sites.settings.update', this.site.id), this.form, {
+                onFinish: () => {
+                    this.sending = false;
+                }
+            })
+        },
+
+        changePhpVersion(version) {
+            this.sending = true;
+
+            this.$inertia.patch(this.route('sites.settings.php-version', this.site.id), {
+                version: version
+            }, {
+                onFinish: () => {
+                    this.timeout = setTimeout(() => {
+                        this.clearTimeoutInterval();
+                        this.sending = false;
+
+                        this.$inertia.get(this.route('sites.settings.show', this.site.id));
+                    }, 3000);
+                }
+            });
+        },
+
+        confirmDelete() {
+            useConfirmDelete({
+                title: this.__('Are you sure?'),
+                message: this.__('Your site will be deleted completely, this action is irreversible.'),
+                onConfirm: () => this.delete(),
+            })
+        },
+
+        delete() {
+            this.$inertia.delete(this.route('sites.delete', this.site.id))
+        },
+
+        clearTimeoutInterval() {
+            clearTimeout(this.timeout);
+            this.timeout = null;
+        },
+    },
+
+    beforeDestroy() {
+        this.clearTimeoutInterval();
     }
+}
 </script>

resources/js/Pages/Support/Index.vue

@@ -135,15 +135,16 @@
             submit() {
                 this.loading = true;
 
-                this.$inertia.post(this.route('support.store'), this.form)
-                    .then(response => {
+                this.$inertia.post(this.route('support.store'), this.form, {
+                    onFinish: () => {
                         if (!Object.keys(this.$page.props.errors).length) {
                             this.form.title = null;
                             this.form.content = null;
                             this.loading = false;
                             this.modalIsOpen = false;
                         }
-                    })
+                    }
+                })
             }
         },
     }

resources/js/Pages/Support/Show.vue

@@ -16,7 +16,7 @@
                             <li class="p-6 rounded shadow bg-surface-3">
                                 <div class="flex space-x-4">
                                     <div>
-                                        <img :src="ticket.user.avatar" class="w-8 h-8 rounded-avatar bg-surface-2" />
+                                        <img :src="ticket.user.avatar" class="w-8 h-8 rounded-avatar bg-surface-2"/>
                                     </div>
                                     <div>
                                         <h3 class="font-semibold text-small text-body">{{ ticket.user.name }}</h3>
@@ -27,7 +27,7 @@
                             <li class="p-6 rounded shadow bg-surface-3" v-for="reply in replies.data">
                                 <div class="flex space-x-4">
                                     <div>
-                                        <img :src="reply.user.avatar" class="w-8 h-8 rounded-avatar bg-surface-2" />
+                                        <img :src="reply.user.avatar" class="w-8 h-8 rounded-avatar bg-surface-2"/>
                                     </div>
                                     <div>
                                         <h3 class="font-semibold text-small text-body">{{ reply.user.name }}</h3>
@@ -40,7 +40,8 @@
                         </ul>
 
                         <form class="space-y-4" @submit.prevent="reply" v-if="ticket.status !== 'closed'">
-                            <FormTextarea :label="__('Reply')" :errors="$page.props.errors.reply" v-model="form.content"/>
+                            <FormTextarea :label="__('Reply')" :errors="$page.props.errors.reply"
+                                          v-model="form.content"/>
 
                             <FormActions>
                                 <Button>{{ __('Save') }}</Button>
@@ -56,109 +57,111 @@
 </template>
 
 <script>
-    import TopBar from './components/TopBar'
-    import Container from '@/components/Container'
-    import Content from '@/components/Content'
-    import Page from '@/components/Page'
-    import PageHeader from '@/components/PageHeader'
-    import PageHeaderTitle from '@/components/PageHeaderTitle'
-    import PageBody from '@/components/PageBody'
-    import Button from '@/components/Button'
-    import List from '@/components/List'
-    import ListItem from '@/components/ListItem'
-    import StatusBubble from '@/components/StatusBubble'
-    import NotificationBadge from '@/components/NotificationBadge'
-    import MainLayout from '@/Layouts/MainLayout'
-    import IconBox from '@/components/icons/IconBox'
-    import IconGlobe from '@/components/icons/IconGlobe'
-    import IconStorage from '@/components/icons/IconStorage'
-    import Modal from '@/components/Modal'
-    import ModalContainer from '@/components/ModalContainer'
-    import FormInput from '@/components/forms/FormInput'
-    import FormTextarea from '@/components/forms/FormTextarea'
-    import FormActions from '@/components/FormActions'
+import TopBar from './components/TopBar'
+import Container from '@/components/Container'
+import Content from '@/components/Content'
+import Page from '@/components/Page'
+import PageHeader from '@/components/PageHeader'
+import PageHeaderTitle from '@/components/PageHeaderTitle'
+import PageBody from '@/components/PageBody'
+import Button from '@/components/Button'
+import List from '@/components/List'
+import ListItem from '@/components/ListItem'
+import StatusBubble from '@/components/StatusBubble'
+import NotificationBadge from '@/components/NotificationBadge'
+import MainLayout from '@/Layouts/MainLayout'
+import IconBox from '@/components/icons/IconBox'
+import IconGlobe from '@/components/icons/IconGlobe'
+import IconStorage from '@/components/icons/IconStorage'
+import Modal from '@/components/Modal'
+import ModalContainer from '@/components/ModalContainer'
+import FormInput from '@/components/forms/FormInput'
+import FormTextarea from '@/components/forms/FormTextarea'
+import FormActions from '@/components/FormActions'
 
-    export default {
-        metaInfo() {
-            return {
-                title: `${this.__('Support')}`,
-            }
-        },
+export default {
+    metaInfo() {
+        return {
+            title: `${this.__('Support')}`,
+        }
+    },
 
-        layout: MainLayout,
+    layout: MainLayout,
 
-        components: {
-            TopBar,
-            Container,
-            Content,
-            Page,
-            PageHeader,
-            PageHeaderTitle,
-            PageBody,
-            Button,
-            List,
-            ListItem,
-            StatusBubble,
-            NotificationBadge,
-            IconBox,
-            IconGlobe,
-            IconStorage,
-            Modal,
-            ModalContainer,
-            FormInput,
-            FormTextarea,
-            FormActions
-        },
+    components: {
+        TopBar,
+        Container,
+        Content,
+        Page,
+        PageHeader,
+        PageHeaderTitle,
+        PageBody,
+        Button,
+        List,
+        ListItem,
+        StatusBubble,
+        NotificationBadge,
+        IconBox,
+        IconGlobe,
+        IconStorage,
+        Modal,
+        ModalContainer,
+        FormInput,
+        FormTextarea,
+        FormActions
+    },
 
-        props: {
-            ticket: Object,
-            replies: Object,
-        },
+    props: {
+        ticket: Object,
+        replies: Object,
+    },
 
-        data() {
-            return {
-                form: {
-                    content: null
-                },
-
-                breadcrumbs: [
-                    {
-                        title: this.$page.props.settings.name,
-                        to: '/',
-                    },
-                    {
-                        title: this.__('Support'),
-                        to: this.route('support.index'),
-                    },
-                    {
-                        title: this.ticket.title,
-                        to: this.route('support.show', this.ticket.id),
-                    },
-                ],
-            }
-        },
-
-        methods: {
-            reply() {
-                this.loading = true;
-
-                this.$inertia.post(this.route('support.reply', this.ticket.id), this.form)
-                    .then(response => {
-                        this.loading = false;
-
-                        if (!Object.keys(this.$page.props.errors).length) {
-                            this.form.content = null;
-                        }
-                    })
+    data() {
+        return {
+            form: {
+                content: null
             },
-            close() {
-                this.loading = true;
 
-                this.$inertia.post(this.route('support.close', this.ticket.id))
-                    .then(response => {
-                        this.loading = false;
-                    })
-            }
+            breadcrumbs: [
+                {
+                    title: this.$page.props.settings.name,
+                    to: '/',
+                },
+                {
+                    title: this.__('Support'),
+                    to: this.route('support.index'),
+                },
+                {
+                    title: this.ticket.title,
+                    to: this.route('support.show', this.ticket.id),
+                },
+            ],
+        }
+    },
+
+    methods: {
+        reply() {
+            this.loading = true;
+
+            this.$inertia.post(this.route('support.reply', this.ticket.id), this.form, {
+                onFinish: () => {
+                    this.loading = false;
+
+                    if (!Object.keys(this.$page.props.errors).length) {
+                        this.form.content = null;
+                    }
+                }
+            })
         },
-    }
+        close() {
+            this.loading = true;
+
+            this.$inertia.post(this.route('support.close', this.ticket.id), {
+                onFinish: () => {
+                    this.loading = false;
+                }
+            });
+        }
+    },
+}
 </script>

resources/js/components/Pagination.vue

@@ -14,7 +14,7 @@
         props: {
             links: Object,
             preserveScroll: {
-                default: false,
+                default: true,
             },
         },