40 lines
1.3 KiB
Svelte
40 lines
1.3 KiB
Svelte
<!-- [DEF:ConnectionsSettingsPage:Component] -->
|
|
<!--
|
|
@SEMANTICS: settings, connections, page
|
|
@PURPOSE: Page for managing database connection configurations.
|
|
@LAYER: UI
|
|
-->
|
|
<script>
|
|
import ConnectionForm from '../../../components/tools/ConnectionForm.svelte';
|
|
import ConnectionList from '../../../components/tools/ConnectionList.svelte';
|
|
|
|
let listComponent;
|
|
|
|
// [DEF:handleSuccess:Function]
|
|
/* @PURPOSE: Refreshes the connection list after a successful creation.
|
|
@PRE: listComponent must be bound.
|
|
@POST: Triggers the fetchConnections method on the list component.
|
|
*/
|
|
function handleSuccess() {
|
|
if (listComponent) {
|
|
listComponent.fetchConnections();
|
|
}
|
|
}
|
|
// [/DEF:handleSuccess:Function]
|
|
</script>
|
|
|
|
<div class="max-w-7xl mx-auto py-6 sm:px-6 lg:px-8">
|
|
<div class="px-4 py-6 sm:px-0">
|
|
<h1 class="text-2xl font-semibold text-gray-900 mb-6">Connection Management</h1>
|
|
|
|
<div class="grid grid-cols-1 lg:grid-cols-2 gap-8">
|
|
<div>
|
|
<ConnectionForm on:success={handleSuccess} />
|
|
</div>
|
|
<div>
|
|
<ConnectionList bind:this={listComponent} />
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<!-- [/DEF:ConnectionsSettingsPage:Component] --> |