polishing, some breadcrumbs, predefined mutations implemented more

resources/js/components/AddMutationForm.vue

@@ -3,8 +3,8 @@ import { useForm } from '@inertiajs/vue3';
 import { route } from 'ziggy-js';
 
 const props = defineProps<{
-    dynamicId: number;
-    ledgerId: number;
+    dynamicId: string;
+    ledgerId: string;
 }>();
 
 const form = useForm({

resources/js/components/Chat.vue

@@ -33,18 +33,23 @@ const props = withDefaults(
             } | null;
         }>;
         dynamicId: string;
-        initialMessages: {
+        initialMessages?: {
             data: Array<any>;
             next_page_url: string | null;
-        };
+        } | null;
     }>(),
     {
         participants: () => [],
+        initialMessages: null,
     }
 );
 
-const messages = ref(props.initialMessages.data.reverse());
-const nextPageUrl = ref(props.initialMessages.next_page_url);
+const messages = ref(
+    props.initialMessages
+        ? props.initialMessages.data.slice().reverse()
+        : (props.chat.messages || []).slice()
+);
+const nextPageUrl = ref(props.initialMessages?.next_page_url || null);
 
 function loadMoreMessages() {
     if (!nextPageUrl.value) {

resources/js/components/MutationList.vue

@@ -4,8 +4,8 @@ import { route } from 'ziggy-js';
 import Chat from '@/components/Chat.vue';
 
 const props = defineProps<{
-    dynamicId: number;
-    ledgerId: number;
+    dynamicId: string;
+    ledgerId: string;
     ledgerAlignment?: string;
     mutations: Array<{
         id: number;