feat: support both ticket link directions (KAN-12)

resources/js/components/tickets/detail/TicketDetailRelationships.vue

@@ -35,6 +35,7 @@ const canAddLink = computed(
 );
 const form = useForm({
     ticket_link_type_id: props.ticketLinkTypes[0]?.id ?? '',
+    link_direction: 'source',
     linked_ticket_id: '',
 });
 const protection = useFormProtection(form, {
@@ -220,7 +221,7 @@ function submit(): void {
                     />
                     <fieldset
                         :disabled="form.processing"
-                        class="grid min-w-0 gap-4 sm:grid-cols-[minmax(0,1fr)_minmax(0,2fr)]"
+                        class="grid min-w-0 gap-4 sm:grid-cols-3"
                     >
                         <TicketFormField
                             id="ticket_link_type_id"
@@ -230,13 +231,33 @@ function submit(): void {
                             :options="
                                 ticketLinkTypes.map((type) => ({
                                     value: type.id,
-                                    label: type.label,
+                                    label: `${type.label} / ${type.counterpart_label}`,
                                 }))
                             "
                             :error="form.errors.ticket_link_type_id"
                             :disabled="form.processing"
                             required
                         />
+                        <TicketFormField
+                            id="link_direction"
+                            v-model="form.link_direction"
+                            kind="select"
+                            :label="t('ticketRelationships.direction')"
+                            :options="[
+                                {
+                                    value: 'source',
+                                    label: selectedType?.label ?? '',
+                                },
+                                {
+                                    value: 'counterpart',
+                                    label:
+                                        selectedType?.counterpart_label ?? '',
+                                },
+                            ]"
+                            :error="form.errors.link_direction"
+                            :disabled="form.processing"
+                            required
+                        />
                         <TicketFormField
                             id="linked_ticket_id"
                             v-model="form.linked_ticket_id"
@@ -267,7 +288,11 @@ function submit(): void {
                         <span class="font-mono text-xs">{{
                             ticket.ticket_key
                         }}</span
-                        ><span>{{ selectedType.label }}</span
+                        ><span>{{
+                            form.link_direction === 'source'
+                                ? selectedType.label
+                                : selectedType.counterpart_label
+                        }}</span
                         ><ArrowRight class="size-4" aria-hidden="true" /><span
                             class="font-mono text-xs"
                             >{{ selectedTicket.ticket_key }}</span

resources/js/locales/en.ts

@@ -1200,8 +1200,9 @@ export const en = {
         'Open a child ticket to change its parent. Expand a group to see its descendants.',
     'ticketRelationships.addLink': 'Add or update a link',
     'ticketRelationships.selectTicket': 'Select a ticket',
+    'ticketRelationships.direction': 'This ticket',
     'ticketRelationships.directionHelp':
-        'The selected relationship points from this ticket to the linked ticket. Saving an existing pair updates its type and direction.',
+        'Choose how this ticket relates to the linked ticket. The reverse label appears on the other ticket. Saving an existing pair updates its type and direction.',
     'ticketRelationships.outgoing': 'Outgoing',
     'ticketRelationships.incoming': 'Incoming',
     'ticketRelationships.removeLink': 'Remove link to {key}',