add linter, prettier and typescript support for jetstream (#1)

* add linter, prettier and typescript support for jetstream

* add github actions for lint, build and typecheck

* add composer install to build action

* fix composer lock

* add ext-intl and fixed php version

* fix intl php extension install

* add tip php extension to github npm build action

* fix php version to 8.3.1

* change github php base action

* fix primary button default type

* updated typescript types from Team to Organization

---------

Co-authored-by: Gregor Vostrak <gregorvostrak@Gregors-MacBook-Pro.local>
This commit is contained in:
Gregor Vostrak
2024-01-21 22:35:43 +01:00
committed by GitHub
parent 0a8d958ccc
commit 27140d4ffc
73 changed files with 4727 additions and 886 deletions

View File

@@ -1,5 +1,5 @@
<script setup>
import { Head, Link, useForm } from '@inertiajs/vue3';
<script setup lang="ts">
import { Head, Link, useForm, usePage } from '@inertiajs/vue3';
import AuthenticationCard from '@/Components/AuthenticationCard.vue';
import AuthenticationCardLogo from '@/Components/AuthenticationCardLogo.vue';
import Checkbox from '@/Components/Checkbox.vue';
@@ -7,6 +7,7 @@ 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 route from 'ziggy-js';
const form = useForm({
name: '',
@@ -21,6 +22,12 @@ const submit = () => {
onFinish: () => form.reset('password', 'password_confirmation'),
});
};
const page = usePage<{
jetstream: {
hasTermsAndPrivacyPolicyFeature: boolean;
};
}>();
</script>
<template>
@@ -41,8 +48,7 @@ const submit = () => {
class="mt-1 block w-full"
required
autofocus
autocomplete="name"
/>
autocomplete="name" />
<InputError class="mt-2" :message="form.errors.name" />
</div>
@@ -54,8 +60,7 @@ const submit = () => {
type="email"
class="mt-1 block w-full"
required
autocomplete="username"
/>
autocomplete="username" />
<InputError class="mt-2" :message="form.errors.email" />
</div>
@@ -67,31 +72,52 @@ const submit = () => {
type="password"
class="mt-1 block w-full"
required
autocomplete="new-password"
/>
autocomplete="new-password" />
<InputError class="mt-2" :message="form.errors.password" />
</div>
<div class="mt-4">
<InputLabel for="password_confirmation" value="Confirm Password" />
<InputLabel
for="password_confirmation"
value="Confirm Password" />
<TextInput
id="password_confirmation"
v-model="form.password_confirmation"
type="password"
class="mt-1 block w-full"
required
autocomplete="new-password"
/>
<InputError class="mt-2" :message="form.errors.password_confirmation" />
autocomplete="new-password" />
<InputError
class="mt-2"
:message="form.errors.password_confirmation" />
</div>
<div v-if="$page.props.jetstream.hasTermsAndPrivacyPolicyFeature" class="mt-4">
<div
v-if="page.props.jetstream.hasTermsAndPrivacyPolicyFeature"
class="mt-4">
<InputLabel for="terms">
<div class="flex items-center">
<Checkbox id="terms" v-model:checked="form.terms" name="terms" required />
<Checkbox
id="terms"
v-model:checked="form.terms"
name="terms"
required />
<div class="ms-2">
I agree to the <a target="_blank" :href="route('terms.show')" class="underline text-sm text-gray-600 dark:text-gray-400 hover:text-gray-900 dark:hover:text-gray-100 rounded-md focus:outline-none focus:ring-2 focus:ring-offset-2 focus:ring-indigo-500 dark:focus:ring-offset-gray-800">Terms of Service</a> and <a target="_blank" :href="route('policy.show')" class="underline text-sm text-gray-600 dark:text-gray-400 hover:text-gray-900 dark:hover:text-gray-100 rounded-md focus:outline-none focus:ring-2 focus:ring-offset-2 focus:ring-indigo-500 dark:focus:ring-offset-gray-800">Privacy Policy</a>
I agree to the
<a
target="_blank"
:href="route('terms.show')"
class="underline text-sm text-gray-600 dark:text-gray-400 hover:text-gray-900 dark:hover:text-gray-100 rounded-md focus:outline-none focus:ring-2 focus:ring-offset-2 focus:ring-indigo-500 dark:focus:ring-offset-gray-800"
>Terms of Service</a
>
and
<a
target="_blank"
:href="route('policy.show')"
class="underline text-sm text-gray-600 dark:text-gray-400 hover:text-gray-900 dark:hover:text-gray-100 rounded-md focus:outline-none focus:ring-2 focus:ring-offset-2 focus:ring-indigo-500 dark:focus:ring-offset-gray-800"
>Privacy Policy</a
>
</div>
</div>
<InputError class="mt-2" :message="form.errors.terms" />
@@ -99,11 +125,16 @@ const submit = () => {
</div>
<div class="flex items-center justify-end mt-4">
<Link :href="route('login')" class="underline text-sm text-gray-600 dark:text-gray-400 hover:text-gray-900 dark:hover:text-gray-100 rounded-md focus:outline-none focus:ring-2 focus:ring-offset-2 focus:ring-indigo-500 dark:focus:ring-offset-gray-800">
<Link
:href="route('login')"
class="underline text-sm text-gray-600 dark:text-gray-400 hover:text-gray-900 dark:hover:text-gray-100 rounded-md focus:outline-none focus:ring-2 focus:ring-offset-2 focus:ring-indigo-500 dark:focus:ring-offset-gray-800">
Already registered?
</Link>
<PrimaryButton class="ms-4" :class="{ 'opacity-25': form.processing }" :disabled="form.processing">
<PrimaryButton
class="ms-4"
:class="{ 'opacity-25': form.processing }"
:disabled="form.processing">
Register
</PrimaryButton>
</div>