chore: comprehensive commit of all debugging, infrastructure, and extension fixes

Summary of changes:
- Corrected Directus extensions to use 'vue-router' for 'useRouter' instead of '@directus/extensions-sdk' (Fixed runtime crash).
- Standardized extension folder structure and moved built extensions to the root 'directus/extensions' directory.
- Updated 'scripts/sync-extensions.sh' and 'scripts/validate-extensions.sh' for better extension management.
- Added 'scripts/validate-sdk-imports.sh' as a safeguard against future invalid SDK imports.
- Integrated import validation into the '.husky/pre-push' hook.
- Standardized Docker restart policies and network configurations in 'cms-infra/docker-compose.yml'.
- Updated tracked 'data.db' with the correct 'module_bar' settings to ensure extension visibility.
- Cleaned up legacy files and consolidated extension package source code.

This commit captures the full state of the repository after resolving the 'missing extensions' issue.

packages/cms-infra/extensions/customer-manager/package.json

@@ -1,30 +1,27 @@
 {
   "name": "customer-manager",
-  "description": "Custom High-Fidelity Customer & Company Management for Directus",
-  "icon": "supervisor_account",
-  "version": "1.7.12",
+  "description": "Custom High-Fidelity Management for Directus",
+  "icon": "extension",
+  "version": "1.8.2",
   "type": "module",
   "keywords": [
     "directus",
     "directus-extension",
     "directus-extension-module"
   ],
-  "files": [
-    "dist"
-  ],
   "directus:extension": {
     "type": "module",
-    "path": "index.js",
+    "path": "dist/index.js",
     "source": "src/index.ts",
-    "host": "*",
-    "name": "Customer Manager"
+    "host": "app",
+    "name": "customer manager"
   },
   "scripts": {
-    "build": "directus-extension build && (cp -f dist/index.js index.js 2>/dev/null || true)",
+    "build": "directus-extension build",
     "dev": "directus-extension build -w"
   },
   "devDependencies": {
     "@directus/extensions-sdk": "11.0.2",
     "vue": "^3.4.0"
   }
-}
+}

packages/cms-infra/extensions/customer-manager/src/index.ts

@@ -0,0 +1,16 @@
+import { defineModule } from '@directus/extensions-sdk';
+import ModuleComponent from './module.vue';
+
+console.log('🚀 ANTIGRAVITY PROBE [1771026048]: Customer Manager Extension Loaded');
+
+export default defineModule({
+    id: 'customer-manager',
+    name: 'DEBUG: Customer Manager',
+    icon: 'supervisor_account',
+    routes: [
+        {
+            path: '',
+            component: ModuleComponent,
+        },
+    ],
+});

packages/cms-infra/extensions/customer-manager/src/module.vue

@@ -0,0 +1,398 @@
+<template>
+	<private-view title="Customer Manager">
+		<template #navigation>
+			<v-list nav>
+				<v-list-item @click="openCreateCompany" clickable>
+					<v-list-item-icon><v-icon name="add" color="var(--theme--primary)" /></v-list-item-icon>
+					<v-list-item-content>
+						<v-text-overflow text="Neue Firma anlegen" />
+					</v-list-item-content>
+				</v-list-item>
+
+				<v-divider />
+
+				<v-list-item
+					v-for="company in companies"
+					:key="company.id"
+					:active="selectedCompany?.id === company.id"
+					class="company-item"
+					clickable
+					@click="selectCompany(company)"
+				>
+					<v-list-item-icon><v-icon name="business" /></v-list-item-icon>
+					<v-list-item-content>
+						<v-text-overflow :text="company.name" />
+					</v-list-item-content>
+				</v-list-item>
+			</v-list>
+		</template>
+
+		<template #title-outer:after>
+			<v-notice v-if="notice" :type="notice.type" @close="notice = null" dismissible>
+				{{ notice.message }}
+			</v-notice>
+		</template>
+
+		<div class="content-wrapper">
+			<div v-if="!selectedCompany" class="empty-state">
+				<v-info title="Firmen auswählen" icon="business" center>
+					Wähle eine Firma in der Navigation aus oder
+					<v-button x-small @click="openCreateCompany">erstelle eine neue Firma</v-button>.
+				</v-info>
+			</div>
+
+			<template v-else>
+				<header class="header">
+					<div class="header-left">
+						<h1 class="title">{{ selectedCompany.name }}</h1>
+						<p class="subtitle">{{ employees.length }} Kunden-Mitarbeiter</p>
+					</div>
+					<div class="header-right">
+						<v-button secondary rounded icon v-tooltip.bottom="'Firma bearbeiten'" @click="openEditCompany">
+							<v-icon name="edit" />
+						</v-button>
+						<v-button primary @click="openCreateEmployee">
+							Mitarbeiter hinzufügen
+						</v-button>
+					</div>
+				</header>
+
+				<v-table
+					:headers="tableHeaders"
+					:items="employees"
+					:loading="loading"
+					class="clickable-table"
+					fixed-header
+					@click:row="onRowClick"
+				>
+					<template #[`item.name`]="{ item }">
+						<div class="user-cell">
+							<v-avatar :name="item.first_name" x-small />
+							<span class="user-name">{{ item.first_name }} {{ item.last_name }}</span>
+						</div>
+					</template>
+
+					<template #[`item.last_invited`]="{ item }">
+						<span v-if="item.last_invited" class="status-date">
+							{{ formatDate(item.last_invited) }}
+						</span>
+						<v-chip v-else x-small>Noch nie</v-chip>
+					</template>
+				</v-table>
+			</template>
+		</div>
+
+		<!-- Drawer: Company Form -->
+		<v-drawer
+			v-model="drawerCompanyActive"
+			:title="isEditingCompany ? 'Firma bearbeiten' : 'Neue Firma anlegen'"
+			icon="business"
+			@cancel="drawerCompanyActive = false"
+		>
+			<div v-if="drawerCompanyActive" class="drawer-content">
+                <div class="form-section">
+                    <div class="field">
+                        <span class="label">Firmenname</span>
+                        <v-input v-model="companyForm.name" placeholder="z.B. KLZ Cables" autofocus />
+                    </div>
+                </div>
+				
+				<div class="drawer-actions">
+					<v-button primary block :loading="saving" @click="saveCompany">Speichern</v-button>
+				</div>
+			</div>
+		</v-drawer>
+
+		<!-- Drawer: Employee Form -->
+		<v-drawer
+			v-model="drawerEmployeeActive"
+			:title="isEditingEmployee ? 'Mitarbeiter bearbeiten' : 'Neuen Mitarbeiter anlegen'"
+			icon="person"
+			@cancel="drawerEmployeeActive = false"
+		>
+			<div v-if="drawerEmployeeActive" class="drawer-content">
+                <div class="form-section">
+                    <div class="field">
+                        <span class="label">Vorname</span>
+                        <v-input v-model="employeeForm.first_name" placeholder="Vorname" autofocus />
+                    </div>
+
+                    <div class="field">
+                        <span class="label">Nachname</span>
+                        <v-input v-model="employeeForm.last_name" placeholder="Nachname" />
+                    </div>
+
+                    <div class="field">
+                        <span class="label">E-Mail</span>
+                        <v-input v-model="employeeForm.email" placeholder="E-Mail Adresse" type="email" />
+                    </div>
+
+                    <div class="field">
+                        <span class="label">Zentrale Person (Verknüpfung)</span>
+                        <v-select
+                            v-model="employeeForm.person"
+                            :items="peopleOptions"
+                            placeholder="Person aus dem People Manager auswählen..."
+                        />
+                    </div>
+
+                    <v-divider v-if="isEditingEmployee" />
+
+                    <div v-if="isEditingEmployee" class="field">
+                        <span class="label">Temporäres Passwort</span>
+                        <v-input v-model="employeeForm.temporary_password" readonly class="password-input" />
+                        <p class="field-note">Wird beim Senden der Zugangsdaten automatisch generiert.</p>
+                    </div>
+                </div>
+
+				<div class="drawer-actions">
+					<v-button primary block :loading="saving" @click="saveEmployee">Daten speichern</v-button>
+					
+					<template v-if="isEditingEmployee">
+						<v-divider />
+						<v-button
+							v-tooltip.bottom="'Generiert PW, speichert es und sendet E-Mail'"
+							secondary
+							block
+							:loading="invitingId === employeeForm.id"
+							@click="inviteUser(employeeForm)"
+						>
+							<v-icon name="send" left /> Zugangsdaten senden
+						</v-button>
+					</template>
+				</div>
+			</div>
+		</v-drawer>
+	</private-view>
+</template>
+
+<script setup lang="ts">
+import { ref, onMounted, nextTick, computed } from 'vue';
+import { useApi } from '@directus/extensions-sdk';
+
+const api = useApi();
+
+const companies = ref<any[]>([]);
+const selectedCompany = ref<any>(null);
+const employees = ref<any[]>([]);
+const loading = ref(false);
+const saving = ref(false);
+const invitingId = ref<string | null>(null);
+const notice = ref<{ type: string; message: string } | null>(null);
+
+// Forms State
+const drawerCompanyActive = ref(false);
+const isEditingCompany = ref(false);
+const companyForm = ref({ id: '', name: '' });
+
+const drawerEmployeeActive = ref(false);
+const isEditingEmployee = ref(false);
+const employeeForm = ref({ 
+    id: '', 
+    first_name: '', 
+    last_name: '', 
+    email: '', 
+    person: null,
+    temporary_password: '' 
+});
+
+const tableHeaders = [
+	{ text: 'Name', value: 'name', sortable: true },
+	{ text: 'E-Mail', value: 'email', sortable: true },
+	{ text: 'Zuletzt eingeladen', value: 'last_invited', sortable: true }
+];
+
+const people = ref<any[]>([]);
+
+const peopleOptions = computed(() => 
+    people.value.map(p => ({
+        text: `${p.first_name} ${p.last_name} (${p.email})`,
+        value: p.id
+    }))
+);
+
+async function fetchData() {
+    const [companiesResp, peopleResp] = await Promise.all([
+        api.get('/items/companies', { params: { sort: 'name', fields: ['id', 'name'] } }),
+        api.get('/items/people', { params: { sort: 'last_name' } })
+    ]);
+    companies.value = companiesResp.data.data;
+    people.value = peopleResp.data.data;
+}
+
+async function selectCompany(company: any) {
+	selectedCompany.value = company;
+	loading.value = true;
+	try {
+		const res = await api.get('/items/client_users', {
+			params: {
+				filter: { company: { _eq: company.id } },
+				fields: ['*', 'person.*'],
+				sort: 'first_name',
+			},
+		});
+		employees.value = res.data.data;
+	} finally {
+		loading.value = false;
+	}
+}
+
+// Company Actions
+function openCreateCompany() {
+	isEditingCompany.value = false;
+	companyForm.value = { id: '', name: '' };
+	drawerCompanyActive.value = true;
+}
+
+async function openEditCompany() {
+	if (!selectedCompany.value) return;
+    companyForm.value = { 
+        id: selectedCompany.value.id, 
+        name: selectedCompany.value.name 
+    };
+	isEditingCompany.value = true;
+    await nextTick();
+	drawerCompanyActive.value = true;
+}
+
+async function saveCompany() {
+	if (!companyForm.value.name) return;
+	saving.value = true;
+	try {
+		if (isEditingCompany.value) {
+			await api.patch(`/items/companies/${companyForm.value.id}`, { name: companyForm.value.name });
+			notice.value = { type: 'success', message: 'Firma aktualisiert!' };
+		} else {
+			await api.post('/items/companies', { name: companyForm.value.name });
+			notice.value = { type: 'success', message: 'Firma angelegt!' };
+		}
+		drawerCompanyActive.value = false;
+		await fetchCompanies();
+		if (selectedCompany.value?.id === companyForm.value.id) {
+			selectedCompany.value.name = companyForm.value.name;
+		}
+	} catch (e: any) {
+		notice.value = { type: 'danger', message: e.message };
+	} finally {
+		saving.value = false;
+	}
+}
+
+// Employee Actions
+function openCreateEmployee() {
+	isEditingEmployee.value = false;
+	employeeForm.value = { id: '', first_name: '', last_name: '', email: '', temporary_password: '' };
+	drawerEmployeeActive.value = true;
+}
+
+async function openEditEmployee(item: any) {
+    employeeForm.value = {
+        id: item.id || '',
+        first_name: item.first_name || '',
+        last_name: item.last_name || '',
+        email: item.email || '',
+        person: item.person?.id || item.person || null,
+        temporary_password: item.temporary_password || ''
+    };
+	isEditingEmployee.value = true;
+    await nextTick();
+	drawerEmployeeActive.value = true;
+}
+
+async function saveEmployee() {
+	if (!employeeForm.value.email || !selectedCompany.value) return;
+	saving.value = true;
+	try {
+		if (isEditingEmployee.value) {
+			await api.patch(`/items/client_users/${employeeForm.value.id}`, {
+				first_name: employeeForm.value.first_name,
+				last_name: employeeForm.value.last_name,
+				email: employeeForm.value.email,
+				person: employeeForm.value.person
+			});
+			notice.value = { type: 'success', message: 'Mitarbeiter aktualisiert!' };
+		} else {
+			await api.post('/items/client_users', {
+				first_name: employeeForm.value.first_name,
+				last_name: employeeForm.value.last_name,
+				email: employeeForm.value.email,
+				company: selectedCompany.value.id,
+				person: employeeForm.value.person
+			});
+			notice.value = { type: 'success', message: 'Mitarbeiter angelegt!' };
+		}
+		drawerEmployeeActive.value = false;
+		await selectCompany(selectedCompany.value);
+	} catch (e: any) {
+		notice.value = { type: 'danger', message: e.message };
+	} finally {
+		saving.value = false;
+	}
+}
+
+async function inviteUser(user: any) {
+	invitingId.value = user.id;
+	try {
+		await api.post(`/flows/trigger/33443f6b-cec7-4668-9607-f33ea674d501`, [user.id]);
+		notice.value = { type: 'success', message: `Zugangsdaten für ${user.first_name} versendet. 📧` };
+		await selectCompany(selectedCompany.value);
+		if (drawerEmployeeActive.value && employeeForm.value.id === user.id) {
+			const updated = employees.value.find(e => e.id === user.id);
+			if (updated) {
+                employeeForm.value.temporary_password = updated.temporary_password;
+            }
+		}
+	} catch (e: any) {
+		notice.value = { type: 'danger', message: `Fehler: ${e.message}` };
+	} finally {
+		invitingId.value = null;
+	}
+}
+
+function onRowClick(event: any) {
+	const item = event?.item || event;
+	if (item && item.id) {
+		openEditEmployee(item);
+	}
+}
+
+function formatDate(dateStr: string) {
+	return new Date(dateStr).toLocaleString('de-DE', {
+		day: '2-digit', month: '2-digit', year: 'numeric',
+		hour: '2-digit', minute: '2-digit'
+	});
+}
+
+onMounted(() => {
+	fetchData();
+});
+</script>
+
+<style scoped>
+.content-wrapper { padding: 32px; height: 100%; display: flex; flex-direction: column; }
+.company-item { cursor: pointer; }
+.header { margin-bottom: 24px; display: flex; justify-content: space-between; align-items: flex-end; }
+.header-right { display: flex; gap: 12px; }
+.title { font-size: 24px; font-weight: 800; margin-bottom: 4px; }
+.subtitle { color: var(--theme--foreground-subdued); font-size: 14px; }
+.empty-state { height: 100%; display: flex; align-items: center; justify-content: center; }
+.user-cell { display: flex; align-items: center; gap: 12px; }
+.user-name { font-weight: 600; }
+.status-date { font-size: 12px; color: var(--theme--foreground-subdued); }
+.drawer-content { padding: 24px; display: flex; flex-direction: column; gap: 32px; }
+.form-section { display: flex; flex-direction: column; gap: 20px; }
+.field { display: flex; flex-direction: column; gap: 8px; }
+.label { font-size: 12px; font-weight: 700; text-transform: uppercase; color: var(--theme--foreground-subdued); letter-spacing: 0.5px; }
+.field-note { font-size: 11px; color: var(--theme--foreground-subdued); margin-top: 4px; }
+.drawer-actions { margin-top: 24px; display: flex; flex-direction: column; gap: 12px; }
+.password-input :deep(textarea) {
+	font-family: var(--family-monospace);
+	font-weight: 800;
+	color: var(--theme--primary) !important;
+	background: var(--theme--background-subdued) !important;
+}
+
+.clickable-table :deep(tbody tr) { cursor: pointer; transition: background-color 0.2s ease; }
+.clickable-table :deep(tbody tr:hover) { background-color: var(--theme--background-subdued) !important; }
+:deep(.v-list-item) { cursor: pointer !important; }
+</style>