RubyGems - kaze - Versions diffs - 0.4.0 → 0.6.0 - Mend

kaze 0.4.0 → 0.6.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.

Files changed (141) hide show

data/stubs/inertia-vue-ts/app/javascript/Pages/Profile/Edit.vue CHANGED Viewed

@@ -1,42 +1,46 @@
 <script setup lang="ts">
-import AuthenticatedLayout from '@/Layouts/AuthenticatedLayout.vue';
-import DeleteUserForm from './Partials/DeleteUserForm.vue';
-import UpdatePasswordForm from './Partials/UpdatePasswordForm.vue';
-import UpdateProfileInformationForm from './Partials/UpdateProfileInformationForm.vue';
-import { Head } from '@inertiajs/vue3';
+import AuthenticatedLayout from '@/Layouts/AuthenticatedLayout.vue'
+import DeleteUserForm from './Partials/DeleteUserForm.vue'
+import UpdatePasswordForm from './Partials/UpdatePasswordForm.vue'
+import UpdateProfileInformationForm from './Partials/UpdateProfileInformationForm.vue'
+import { Head } from '@inertiajs/vue3'
 defineProps<{
-    mustVerifyEmail?: boolean;
-    status?: string;
-}>();
+  mustVerifyEmail?: boolean
+  status?: string
+}>()
 </script>
 <template>
-    <Head title="Profile" />
+  <Head title="Profile" />
-    <AuthenticatedLayout>
-        <template #header>
-            <h2 class="font-semibold text-xl text-gray-800 dark:text-gray-200 leading-tight">Profile</h2>
-        </template>
+  <AuthenticatedLayout>
+    <template #header>
+      <h2
+        class="font-semibold text-xl text-gray-800 dark:text-gray-200 leading-tight"
+      >
+        Profile
+      </h2>
+    </template>
-        <div class="py-12">
-            <div class="max-w-7xl mx-auto sm:px-6 lg:px-8 space-y-6">
-                <div class="p-4 sm:p-8 bg-white dark:bg-gray-800 shadow sm:rounded-lg">
-                    <UpdateProfileInformationForm
-                        :must-verify-email="mustVerifyEmail"
-                        :status="status"
-                        class="max-w-xl"
-                    />
-                </div>
+    <div class="py-12">
+      <div class="max-w-7xl mx-auto sm:px-6 lg:px-8 space-y-6">
+        <div class="p-4 sm:p-8 bg-white dark:bg-gray-800 shadow sm:rounded-lg">
+          <UpdateProfileInformationForm
+            :must-verify-email="mustVerifyEmail"
+            :status="status"
+            class="max-w-xl"
+          />
+        </div>
-                <div class="p-4 sm:p-8 bg-white dark:bg-gray-800 shadow sm:rounded-lg">
-                    <UpdatePasswordForm class="max-w-xl" />
-                </div>
+        <div class="p-4 sm:p-8 bg-white dark:bg-gray-800 shadow sm:rounded-lg">
+          <UpdatePasswordForm class="max-w-xl" />
+        </div>
-                <div class="p-4 sm:p-8 bg-white dark:bg-gray-800 shadow sm:rounded-lg">
-                    <DeleteUserForm class="max-w-xl" />
-                </div>
-            </div>
+        <div class="p-4 sm:p-8 bg-white dark:bg-gray-800 shadow sm:rounded-lg">
+          <DeleteUserForm class="max-w-xl" />
         </div>
-    </AuthenticatedLayout>
+      </div>
+    </div>
+  </AuthenticatedLayout>
 </template>

data/stubs/inertia-vue-ts/app/javascript/Pages/Profile/Partials/DeleteUserForm.vue CHANGED Viewed

@@ -1,98 +1,102 @@
 <script setup lang="ts">
-import DangerButton from '@/Components/DangerButton.vue';
-import InputError from '@/Components/InputError.vue';
-import InputLabel from '@/Components/InputLabel.vue';
-import Modal from '@/Components/Modal.vue';
-import SecondaryButton from '@/Components/SecondaryButton.vue';
-import TextInput from '@/Components/TextInput.vue';
-import { useForm } from '@inertiajs/vue3';
-import { nextTick, ref } from 'vue';
-import { profile_destroy_path } from '@/routes';
-const confirmingUserDeletion = ref(false);
-const passwordInput = ref<HTMLInputElement | null>(null);
+import DangerButton from '@/Components/DangerButton.vue'
+import InputError from '@/Components/InputError.vue'
+import InputLabel from '@/Components/InputLabel.vue'
+import Modal from '@/Components/Modal.vue'
+import SecondaryButton from '@/Components/SecondaryButton.vue'
+import TextInput from '@/Components/TextInput.vue'
+import { useForm } from '@inertiajs/vue3'
+import { nextTick, ref } from 'vue'
+import { profile_destroy_path } from '@/routes'
+const confirmingUserDeletion = ref(false)
+const passwordInput = ref<HTMLInputElement | null>(null)
 const form = useForm({
-    password: '',
-});
+  password: '',
+})
 const confirmUserDeletion = () => {
-    confirmingUserDeletion.value = true;
+  confirmingUserDeletion.value = true
-    nextTick(() => passwordInput.value?.focus());
-};
+  nextTick(() => passwordInput.value?.focus())
+}
 const deleteUser = () => {
-    form.delete(profile_destroy_path(), {
-        preserveScroll: true,
-        onSuccess: () => closeModal(),
-        onError: () => passwordInput.value?.focus(),
-        onFinish: () => {
-            form.reset();
-        },
-    });
-};
+  form.delete(profile_destroy_path(), {
+    preserveScroll: true,
+    onSuccess: () => closeModal(),
+    onError: () => passwordInput.value?.focus(),
+    onFinish: () => {
+      form.reset()
+    },
+  })
+}
 const closeModal = () => {
-    confirmingUserDeletion.value = false;
+  confirmingUserDeletion.value = false
-    form.reset();
-};
+  form.reset()
+}
 </script>
 <template>
-    <section class="space-y-6">
-        <header>
-            <h2 class="text-lg font-medium text-gray-900 dark:text-gray-100">Delete Account</h2>
-            <p class="mt-1 text-sm text-gray-600 dark:text-gray-400">
-                Once your account is deleted, all of its resources and data will be permanently deleted. Before deleting
-                your account, please download any data or information that you wish to retain.
-            </p>
-        </header>
-        <DangerButton @click="confirmUserDeletion">Delete Account</DangerButton>
-        <Modal :show="confirmingUserDeletion" @close="closeModal">
-            <div class="p-6">
-                <h2 class="text-lg font-medium text-gray-900 dark:text-gray-100">
-                    Are you sure you want to delete your account?
-                </h2>
-                <p class="mt-1 text-sm text-gray-600 dark:text-gray-400">
-                    Once your account is deleted, all of its resources and data will be permanently deleted. Please
-                    enter your password to confirm you would like to permanently delete your account.
-                </p>
-                <div class="mt-6">
-                    <InputLabel for="password" value="Password" class="sr-only" />
-                    <TextInput
-                        id="password"
-                        ref="passwordInput"
-                        v-model="form.password"
-                        type="password"
-                        class="mt-1 block w-3/4"
-                        placeholder="Password"
-                        @keyup.enter="deleteUser"
-                    />
-                    <InputError :message="form.errors.password" class="mt-2" />
-                </div>
-                <div class="mt-6 flex justify-end">
-                    <SecondaryButton @click="closeModal"> Cancel </SecondaryButton>
-                    <DangerButton
-                        class="ms-3"
-                        :class="{ 'opacity-25': form.processing }"
-                        :disabled="form.processing"
-                        @click="deleteUser"
-                    >
-                        Delete Account
-                    </DangerButton>
-                </div>
-            </div>
-        </Modal>
-    </section>
+  <section class="space-y-6">
+    <header>
+      <h2 class="text-lg font-medium text-gray-900 dark:text-gray-100">
+        Delete Account
+      </h2>
+      <p class="mt-1 text-sm text-gray-600 dark:text-gray-400">
+        Once your account is deleted, all of its resources and data will be
+        permanently deleted. Before deleting your account, please download any
+        data or information that you wish to retain.
+      </p>
+    </header>
+    <DangerButton @click="confirmUserDeletion">Delete Account</DangerButton>
+    <Modal :show="confirmingUserDeletion" @close="closeModal">
+      <div class="p-6">
+        <h2 class="text-lg font-medium text-gray-900 dark:text-gray-100">
+          Are you sure you want to delete your account?
+        </h2>
+        <p class="mt-1 text-sm text-gray-600 dark:text-gray-400">
+          Once your account is deleted, all of its resources and data will be
+          permanently deleted. Please enter your password to confirm you would
+          like to permanently delete your account.
+        </p>
+        <div class="mt-6">
+          <InputLabel for="password" value="Password" class="sr-only" />
+          <TextInput
+            id="password"
+            ref="passwordInput"
+            v-model="form.password"
+            type="password"
+            class="mt-1 block w-3/4"
+            placeholder="Password"
+            @keyup.enter="deleteUser"
+          />
+          <InputError :message="form.errors.password" class="mt-2" />
+        </div>
+        <div class="mt-6 flex justify-end">
+          <SecondaryButton @click="closeModal"> Cancel </SecondaryButton>
+          <DangerButton
+            class="ms-3"
+            :class="{ 'opacity-25': form.processing }"
+            :disabled="form.processing"
+            @click="deleteUser"
+          >
+            Delete Account
+          </DangerButton>
+        </div>
+      </div>
+    </Modal>
+  </section>
 </template>

data/stubs/inertia-vue-ts/app/javascript/Pages/Profile/Partials/UpdatePasswordForm.vue CHANGED Viewed

@@ -1,108 +1,115 @@
 <script setup lang="ts">
-import InputError from '@/Components/InputError.vue';
-import InputLabel from '@/Components/InputLabel.vue';
-import PrimaryButton from '@/Components/PrimaryButton.vue';
-import TextInput from '@/Components/TextInput.vue';
-import { useForm } from '@inertiajs/vue3';
-import { ref } from 'vue';
-import { password_update_path } from '@/routes';
+import InputError from '@/Components/InputError.vue'
+import InputLabel from '@/Components/InputLabel.vue'
+import PrimaryButton from '@/Components/PrimaryButton.vue'
+import TextInput from '@/Components/TextInput.vue'
+import { useForm } from '@inertiajs/vue3'
+import { ref } from 'vue'
+import { password_update_path } from '@/routes'
-const passwordInput = ref<HTMLInputElement | null>(null);
-const currentPasswordInput = ref<HTMLInputElement | null>(null);
+const passwordInput = ref<HTMLInputElement | null>(null)
+const currentPasswordInput = ref<HTMLInputElement | null>(null)
 const form = useForm({
-    current_password: '',
-    password: '',
-    password_confirmation: '',
-});
+  current_password: '',
+  password: '',
+  password_confirmation: '',
+})
 const updatePassword = () => {
-    form.put(password_update_path(), {
-        preserveScroll: true,
-        onSuccess: () => {
-            form.reset();
-        },
-        onError: () => {
-            if (form.errors.password) {
-                form.reset('password', 'password_confirmation');
-                passwordInput.value?.focus();
-            }
-            if (form.errors.current_password) {
-                form.reset('current_password');
-                currentPasswordInput.value?.focus();
-            }
-        },
-    });
-};
+  form.put(password_update_path(), {
+    preserveScroll: true,
+    onSuccess: () => {
+      form.reset()
+    },
+    onError: () => {
+      if (form.errors.password) {
+        form.reset('password', 'password_confirmation')
+        passwordInput.value?.focus()
+      }
+      if (form.errors.current_password) {
+        form.reset('current_password')
+        currentPasswordInput.value?.focus()
+      }
+    },
+  })
+}
 </script>
 <template>
-    <section>
-        <header>
-            <h2 class="text-lg font-medium text-gray-900 dark:text-gray-100">Update Password</h2>
-            <p class="mt-1 text-sm text-gray-600 dark:text-gray-400">
-                Ensure your account is using a long, random password to stay secure.
-            </p>
-        </header>
-        <form @submit.prevent="updatePassword" class="mt-6 space-y-6">
-            <div>
-                <InputLabel for="current_password" value="Current Password" />
-                <TextInput
-                    id="current_password"
-                    ref="currentPasswordInput"
-                    v-model="form.current_password"
-                    type="password"
-                    class="mt-1 block w-full"
-                    autocomplete="current-password"
-                />
-                <InputError :message="form.errors.current_password" class="mt-2" />
-            </div>
-            <div>
-                <InputLabel for="password" value="New Password" />
-                <TextInput
-                    id="password"
-                    ref="passwordInput"
-                    v-model="form.password"
-                    type="password"
-                    class="mt-1 block w-full"
-                    autocomplete="new-password"
-                />
-                <InputError :message="form.errors.password" class="mt-2" />
-            </div>
-            <div>
-                <InputLabel for="password_confirmation" value="Confirm Password" />
-                <TextInput
-                    id="password_confirmation"
-                    v-model="form.password_confirmation"
-                    type="password"
-                    class="mt-1 block w-full"
-                    autocomplete="new-password"
-                />
-                <InputError :message="form.errors.password_confirmation" class="mt-2" />
-            </div>
-            <div class="flex items-center gap-4">
-                <PrimaryButton :disabled="form.processing">Save</PrimaryButton>
-                <Transition
-                    enter-active-class="transition ease-in-out"
-                    enter-from-class="opacity-0"
-                    leave-active-class="transition ease-in-out"
-                    leave-to-class="opacity-0"
-                >
-                    <p v-if="form.recentlySuccessful" class="text-sm text-gray-600 dark:text-gray-400">Saved.</p>
-                </Transition>
-            </div>
-        </form>
-    </section>
+  <section>
+    <header>
+      <h2 class="text-lg font-medium text-gray-900 dark:text-gray-100">
+        Update Password
+      </h2>
+      <p class="mt-1 text-sm text-gray-600 dark:text-gray-400">
+        Ensure your account is using a long, random password to stay secure.
+      </p>
+    </header>
+    <form @submit.prevent="updatePassword" class="mt-6 space-y-6">
+      <div>
+        <InputLabel for="current_password" value="Current Password" />
+        <TextInput
+          id="current_password"
+          ref="currentPasswordInput"
+          v-model="form.current_password"
+          type="password"
+          class="mt-1 block w-full"
+          autocomplete="current-password"
+        />
+        <InputError :message="form.errors.current_password" class="mt-2" />
+      </div>
+      <div>
+        <InputLabel for="password" value="New Password" />
+        <TextInput
+          id="password"
+          ref="passwordInput"
+          v-model="form.password"
+          type="password"
+          class="mt-1 block w-full"
+          autocomplete="new-password"
+        />
+        <InputError :message="form.errors.password" class="mt-2" />
+      </div>
+      <div>
+        <InputLabel for="password_confirmation" value="Confirm Password" />
+        <TextInput
+          id="password_confirmation"
+          v-model="form.password_confirmation"
+          type="password"
+          class="mt-1 block w-full"
+          autocomplete="new-password"
+        />
+        <InputError :message="form.errors.password_confirmation" class="mt-2" />
+      </div>
+      <div class="flex items-center gap-4">
+        <PrimaryButton :disabled="form.processing">Save</PrimaryButton>
+        <Transition
+          enter-active-class="transition ease-in-out"
+          enter-from-class="opacity-0"
+          leave-active-class="transition ease-in-out"
+          leave-to-class="opacity-0"
+        >
+          <p
+            v-if="form.recentlySuccessful"
+            class="text-sm text-gray-600 dark:text-gray-400"
+          >
+            Saved.
+          </p>
+        </Transition>
+      </div>
+    </form>
+  </section>
 </template>

data/stubs/inertia-vue-ts/app/javascript/Pages/Profile/Partials/UpdateProfileInformationForm.vue CHANGED Viewed

@@ -1,78 +1,88 @@
 <script setup lang="ts">
-import InputError from '@/Components/InputError.vue';
-import InputLabel from '@/Components/InputLabel.vue';
-import PrimaryButton from '@/Components/PrimaryButton.vue';
-import TextInput from '@/Components/TextInput.vue';
-import { Link, useForm, usePage } from '@inertiajs/vue3';
-import { profile_update_path } from '@/routes';
+import InputError from '@/Components/InputError.vue'
+import InputLabel from '@/Components/InputLabel.vue'
+import PrimaryButton from '@/Components/PrimaryButton.vue'
+import TextInput from '@/Components/TextInput.vue'
+import { useForm, usePage } from '@inertiajs/vue3'
+import { profile_update_path } from '@/routes'
 defineProps<{
-    mustVerifyEmail?: Boolean;
-    status?: String;
-}>();
+  mustVerifyEmail?: Boolean
+  status?: String
+}>()
-const user = usePage().props.auth.user;
+const user = usePage().props.auth.user
 const form = useForm({
-    name: user.name,
-    email: user.email,
-});
+  name: user.name,
+  email: user.email,
+})
 </script>
 <template>
-    <section>
-        <header>
-            <h2 class="text-lg font-medium text-gray-900 dark:text-gray-100">Profile Information</h2>
+  <section>
+    <header>
+      <h2 class="text-lg font-medium text-gray-900 dark:text-gray-100">
+        Profile Information
+      </h2>
-            <p class="mt-1 text-sm text-gray-600 dark:text-gray-400">
-                Update your account's profile information and email address.
-            </p>
-        </header>
+      <p class="mt-1 text-sm text-gray-600 dark:text-gray-400">
+        Update your account's profile information and email address.
+      </p>
+    </header>
-        <form @submit.prevent="form.patch(profile_update_path())" class="mt-6 space-y-6">
-            <div>
-                <InputLabel for="name" value="Name" />
+    <form
+      @submit.prevent="form.patch(profile_update_path())"
+      class="mt-6 space-y-6"
+    >
+      <div>
+        <InputLabel for="name" value="Name" />
-                <TextInput
-                    id="name"
-                    type="text"
-                    class="mt-1 block w-full"
-                    v-model="form.name"
-                    required
-                    autofocus
-                    autocomplete="name"
-                />
+        <TextInput
+          id="name"
+          type="text"
+          class="mt-1 block w-full"
+          v-model="form.name"
+          required
+          autofocus
+          autocomplete="name"
+        />
-                <InputError class="mt-2" :message="form.errors.name" />
-            </div>
+        <InputError class="mt-2" :message="form.errors.name" />
+      </div>
-            <div>
-                <InputLabel for="email" value="Email" />
+      <div>
+        <InputLabel for="email" value="Email" />
-                <TextInput
-                    id="email"
-                    type="email"
-                    class="mt-1 block w-full"
-                    v-model="form.email"
-                    required
-                    autocomplete="username"
-                />
+        <TextInput
+          id="email"
+          type="email"
+          class="mt-1 block w-full"
+          v-model="form.email"
+          required
+          autocomplete="username"
+        />
-                <InputError class="mt-2" :message="form.errors.email" />
-            </div>
+        <InputError class="mt-2" :message="form.errors.email" />
+      </div>
-            <div class="flex items-center gap-4">
-                <PrimaryButton :disabled="form.processing">Save</PrimaryButton>
+      <div class="flex items-center gap-4">
+        <PrimaryButton :disabled="form.processing">Save</PrimaryButton>
-                <Transition
-                    enter-active-class="transition ease-in-out"
-                    enter-from-class="opacity-0"
-                    leave-active-class="transition ease-in-out"
-                    leave-to-class="opacity-0"
-                >
-                    <p v-if="form.recentlySuccessful" class="text-sm text-gray-600 dark:text-gray-400">Saved.</p>
-                </Transition>
-            </div>
-        </form>
-    </section>
+        <Transition
+          enter-active-class="transition ease-in-out"
+          enter-from-class="opacity-0"
+          leave-active-class="transition ease-in-out"
+          leave-to-class="opacity-0"
+        >
+          <p
+            v-if="form.recentlySuccessful"
+            class="text-sm text-gray-600 dark:text-gray-400"
+          >
+            Saved.
+          </p>
+        </Transition>
+      </div>
+    </form>
+  </section>
 </template>