fix: make project template inheritance granular and safe

resources/js/pages/projects/settings/Board.vue

@@ -3,6 +3,7 @@ import { Form, Head, Link } from '@inertiajs/vue3';
 import ProjectBoardSettingsController from '@/actions/App/Http/Controllers/ProjectBoardSettingsController';
 import Heading from '@/components/Heading.vue';
 import InputError from '@/components/InputError.vue';
+import TemplateInheritancePanel from '@/components/projects/TemplateInheritancePanel.vue';
 import { Badge } from '@/components/ui/badge';
 import { Button } from '@/components/ui/button';
 import {
@@ -138,31 +139,15 @@ const statusAllowsTarget = (
                 {{ status }}
             </div>
 
-            <Card v-if="templateState?.inheritsFromTemplate">
-                <CardHeader>
-                    <CardTitle>
-                        Template inheritance: {{ templateState.templateName }}
-                    </CardTitle>
-                    <CardDescription>
-                        This project stays linked to its template. Sections below show whether the current configuration is still inherited or has local overrides.
-                    </CardDescription>
-                </CardHeader>
-                <CardContent class="flex flex-wrap gap-2">
-                    <Badge
-                        v-for="area in templateState.inheritedAreas"
-                        :key="`inherited-${area.value}`"
-                        variant="outline"
-                    >
-                        {{ area.label }} · inherited
-                    </Badge>
-                    <Badge
-                        v-for="area in templateState.overriddenAreas"
-                        :key="`overridden-${area.value}`"
-                    >
-                        {{ area.label }} · overridden
-                    </Badge>
-                </CardContent>
-            </Card>
+            <TemplateInheritancePanel
+                :areas="[
+                    'board_columns',
+                    'ticket_statuses',
+                    'status_transitions',
+                ]"
+                :project-id="project.id"
+                :template-state="templateState"
+            />
 
             <Card>
                 <CardHeader>