Added inern app integration

2026-10-15 22:56:09 +00:00 · 2026-09-02 09:37:11 +02:00
parent 8aa6428089
commit e58a398c07
30 changed files with 1059 additions and 68 deletions
@@ -23,6 +23,7 @@ defineOptions({
 defineProps<{
    status?: string;
    canResetPassword: boolean;
+    rememberByDefault: boolean;
 }>();
 </script>

@@ -85,7 +86,12 @@ defineProps<{

            <div class="flex items-center justify-between">
                <Label for="remember" class="flex items-center space-x-3">
-                    <Checkbox id="remember" name="remember" :tabindex="3" />
+                    <Checkbox
+                        id="remember"
+                        name="remember"
+                        :default-value="rememberByDefault"
+                        :tabindex="3"
+                    />
                    <span>Remember me</span>
                </Label>
            </div>
@@ -0,0 +1,28 @@
+<script setup lang="ts">
+import { Head } from '@inertiajs/vue3';
+import { CircleAlert } from '@lucide/vue';
+
+defineProps<{
+    message: string;
+}>();
+</script>
+
+<template>
+    <Head title="Scrum Poker nicht verfügbar" />
+
+    <main
+        class="grid min-h-svh place-items-center bg-slate-900 p-8 text-slate-100"
+    >
+        <section
+            class="flex max-w-lg flex-col items-center gap-4 rounded-2xl border border-slate-700 bg-slate-800 p-8 text-center shadow-xl"
+        >
+            <CircleAlert class="size-10 text-amber-300" />
+            <h1 class="text-2xl font-bold">Raum kann nicht geöffnet werden</h1>
+            <p class="text-slate-300">{{ message }}</p>
+            <p class="text-sm text-slate-400">
+                Bitte ändere Raumcode oder Anzeigename auf der Home-Seite der
+                Fillibri Hub App und öffne Scrum Poker erneut.
+            </p>
+        </section>
+    </main>
+</template>
@@ -0,0 +1,14 @@
+<script setup lang="ts">
+import RoomExperience from '@/components/rooms/RoomExperience.vue';
+import type { RoomPageProps } from '@/types/room';
+
+const props = defineProps<RoomPageProps>();
+</script>
+
+<template>
+    <RoomExperience
+        :room="props.room"
+        :current-player="props.currentPlayer"
+        embedded
+    />
+</template>
@@ -0,0 +1,103 @@
+<script setup lang="ts">
+import { Head, Link, useForm } from '@inertiajs/vue3';
+import { ArrowLeft } from '@lucide/vue';
+
+import InputError from '@/components/InputError.vue';
+import { Checkbox } from '@/components/ui/checkbox';
+import { dashboard } from '@/routes';
+import { update as updateSettings } from '@/routes/room/settings';
+import type { RoomSettingsPageProps } from '@/types/room';
+
+const props = defineProps<RoomSettingsPageProps>();
+const form = useForm({
+    allow_participants_to_manage_rounds:
+        props.room.allow_participants_to_manage_rounds,
+    is_persistent: props.room.is_persistent,
+});
+
+function submit(): void {
+    form.patch(updateSettings(props.room.id).url, {
+        preserveScroll: true,
+    });
+}
+</script>
+
+<template>
+    <Head title="Raumeinstellungen" />
+
+    <main
+        class="flex min-h-[calc(100svh-4rem)] justify-center bg-slate-900 p-4 text-slate-100 sm:p-8"
+    >
+        <section class="flex w-full max-w-2xl flex-col gap-6">
+            <Link
+                :href="dashboard()"
+                class="inline-flex w-fit items-center gap-2 text-sm text-slate-300 transition hover:text-white"
+            >
+                <ArrowLeft class="size-4" />
+                Zurück zu meinen Räumen
+            </Link>
+
+            <div>
+                <h1 class="text-2xl font-bold">Raumeinstellungen</h1>
+                <p class="mt-1 text-sm text-slate-400">
+                    {{ room.title ?? 'Scrum Poker' }} · {{ room.join_code }}
+                </p>
+            </div>
+
+            <form
+                class="flex flex-col gap-6 rounded-xl border border-slate-700 bg-slate-800 p-6"
+                @submit.prevent="submit"
+            >
+                <label class="flex cursor-pointer items-start gap-4">
+                    <Checkbox
+                        :model-value="form.allow_participants_to_manage_rounds"
+                        @update:model-value="
+                            form.allow_participants_to_manage_rounds =
+                                $event === true
+                        "
+                    />
+                    <span>
+                        <strong class="block"
+                            >Alle dürfen Runden steuern</strong
+                        >
+                        <span class="mt-1 block text-sm text-slate-400">
+                            Alle aktiven Teilnehmer, auch Gäste, dürfen Karten
+                            aufdecken, Votes zurücksetzen und die nächste Runde
+                            starten.
+                        </span>
+                    </span>
+                </label>
+                <InputError
+                    :message="form.errors.allow_participants_to_manage_rounds"
+                />
+
+                <label class="flex cursor-pointer items-start gap-4">
+                    <Checkbox
+                        :model-value="form.is_persistent"
+                        @update:model-value="
+                            form.is_persistent = $event === true
+                        "
+                    />
+                    <span>
+                        <strong class="block"
+                            >Raum dauerhaft offen halten</strong
+                        >
+                        <span class="mt-1 block text-sm text-slate-400">
+                            Der Raum wird auch nach längerer Inaktivität nicht
+                            automatisch geschlossen.
+                        </span>
+                    </span>
+                </label>
+                <InputError :message="form.errors.is_persistent" />
+
+                <button
+                    type="submit"
+                    class="inline-flex w-fit rounded-md bg-primary px-4 py-2 text-sm font-semibold text-primary-foreground transition hover:bg-primary/90 disabled:opacity-50"
+                    :disabled="form.processing"
+                >
+                    {{ form.processing ? 'Wird gespeichert …' : 'Speichern' }}
+                </button>
+            </form>
+        </section>
+    </main>
+</template>
@@ -1,63 +1,10 @@
 <script setup lang="ts">
-import { Head, usePage } from '@inertiajs/vue3';
-import { computed, ref } from 'vue';
-
-import RoomHeader from '@/components/rooms/RoomHeader.vue';
-import RoomRetentionNotice from '@/components/rooms/RoomRetentionNotice.vue';
-import RoomTable from '@/components/rooms/RoomTable.vue';
-import RoomVoteDeck from '@/components/rooms/RoomVoteDeck.vue';
-import { useRoomRealtime } from '@/composables/useRoomRealtime';
+import RoomExperience from '@/components/rooms/RoomExperience.vue';
 import type { RoomPageProps } from '@/types/room';

 const props = defineProps<RoomPageProps>();
-
-const page = usePage();
-const presenterMode = ref(false);
-const roomNotice = computed(() => page.props.roomNotice);
-const canFavorite = computed(
-    () => page.props.auth.user?.id != props.room.owner_id,
-);
-
-const {
-    room: realtimeRoom,
-    currentPlayer: realtimeCurrentPlayer,
-    setCurrentVote,
-} = useRoomRealtime(
-    () => props.room,
-    () => props.currentPlayer,
-);
 </script>

 <template>
-    <Head :title="realtimeRoom.title ?? 'Scrum Poker'" />
-
-    <main
-        class="-m-6 min-h-[calc(100svh-4rem)] bg-slate-900 px-3 py-6 text-white sm:px-6 md:flex md:h-[calc(100dvh-4rem-1px)] md:min-h-0 md:flex-col md:overflow-hidden lg:px-10"
-    >
-        <RoomRetentionNotice v-if="roomNotice" :notice="roomNotice" />
-
-        <RoomHeader
-            :id="realtimeRoom.id"
-            :title="realtimeRoom.title"
-            :join_code="realtimeRoom.join_code"
-            :is_favorite="realtimeRoom.is_favorite"
-            :can-favorite="canFavorite"
-            v-model:presenter-mode="presenterMode"
-        />
-
-        <RoomTable
-            :room="realtimeRoom"
-            :current-player="realtimeCurrentPlayer"
-            :presenter-mode="presenterMode"
-        />
-
-        <RoomVoteDeck
-            :room-id="realtimeRoom.id"
-            :revealed="realtimeRoom.revealed"
-            :cards="realtimeRoom.deck.cards"
-            :current-vote="realtimeCurrentPlayer.current_vote"
-            :presenter-mode="presenterMode"
-            @vote-changed="setCurrentVote"
-        />
-    </main>
+    <RoomExperience :room="props.room" :current-player="props.currentPlayer" />
 </template>