feat(env): add global production context and safety indicators
This commit is contained in:
@@ -26,6 +26,11 @@
|
||||
import { addToast } from "$lib/toasts.js";
|
||||
import { gitService } from "../../services/gitService.js";
|
||||
import MappingTable from "$components/MappingTable.svelte";
|
||||
import {
|
||||
environmentContextStore,
|
||||
initializeEnvironmentContext,
|
||||
setSelectedEnvironment,
|
||||
} from "$lib/stores/environmentContext.js";
|
||||
|
||||
// State
|
||||
let selectedEnv = null;
|
||||
@@ -81,7 +86,10 @@
|
||||
|
||||
// Load environments and dashboards on mount
|
||||
onMount(async () => {
|
||||
await loadEnvironments();
|
||||
await initializeEnvironmentContext();
|
||||
if (!selectedEnv && $environmentContextStore?.selectedEnvId) {
|
||||
selectedEnv = $environmentContextStore.selectedEnvId;
|
||||
}
|
||||
await loadDashboards();
|
||||
});
|
||||
|
||||
@@ -97,29 +105,6 @@
|
||||
document.addEventListener("click", handleDocumentClick);
|
||||
}
|
||||
|
||||
// Load environments from API
|
||||
async function loadEnvironments() {
|
||||
try {
|
||||
const response = await api.getEnvironments();
|
||||
environments = response;
|
||||
// Set first environment as default if no selection
|
||||
if (environments.length > 0 && !selectedEnv) {
|
||||
selectedEnv = environments[0].id;
|
||||
}
|
||||
} catch (err) {
|
||||
console.error(
|
||||
"[DashboardHub][Coherence:Failed] Failed to load environments:",
|
||||
err,
|
||||
);
|
||||
// Use fallback environments if API fails
|
||||
environments = [
|
||||
{ id: "development", name: "Development" },
|
||||
{ id: "staging", name: "Staging" },
|
||||
{ id: "production", name: "Production" },
|
||||
];
|
||||
}
|
||||
}
|
||||
|
||||
// Load dashboards from API
|
||||
async function loadDashboards() {
|
||||
if (!selectedEnv) return;
|
||||
@@ -178,6 +163,7 @@
|
||||
// Handle environment change
|
||||
function handleEnvChange(event) {
|
||||
selectedEnv = event.target.value;
|
||||
setSelectedEnvironment(selectedEnv);
|
||||
currentPage = 1;
|
||||
selectedIds.clear();
|
||||
loadDashboards();
|
||||
@@ -718,6 +704,17 @@
|
||||
|
||||
return range;
|
||||
}
|
||||
|
||||
$: environments = $environmentContextStore?.environments || [];
|
||||
$: if (
|
||||
$environmentContextStore?.selectedEnvId &&
|
||||
selectedEnv !== $environmentContextStore.selectedEnvId
|
||||
) {
|
||||
selectedEnv = $environmentContextStore.selectedEnvId;
|
||||
currentPage = 1;
|
||||
selectedIds.clear();
|
||||
loadDashboards();
|
||||
}
|
||||
</script>
|
||||
|
||||
<div class="mx-auto w-full max-w-7xl space-y-6">
|
||||
@@ -766,21 +763,21 @@
|
||||
<div
|
||||
class="grid grid-cols-12 gap-4 px-6 py-3 bg-gray-50 border-b border-gray-200 font-semibold text-sm text-gray-700"
|
||||
>
|
||||
<div class="col-span-1 skeleton h-4"></div>
|
||||
<div class="col-span-3 font-medium text-gray-900 skeleton h-4"></div>
|
||||
<div class="col-span-2 skeleton h-4"></div>
|
||||
<div class="col-span-3 skeleton h-4"></div>
|
||||
<div class="col-span-3 flex items-center skeleton h-4"></div>
|
||||
<div class="col-span-1 h-4 rounded bg-gray-200 animate-pulse"></div>
|
||||
<div class="col-span-3 h-4 rounded bg-gray-200 animate-pulse"></div>
|
||||
<div class="col-span-2 h-4 rounded bg-gray-200 animate-pulse"></div>
|
||||
<div class="col-span-3 h-4 rounded bg-gray-200 animate-pulse"></div>
|
||||
<div class="col-span-3 h-4 rounded bg-gray-200 animate-pulse"></div>
|
||||
</div>
|
||||
{#each Array(5) as _}
|
||||
<div
|
||||
class="grid grid-cols-12 gap-4 px-6 py-4 border-b border-gray-200 last:border-b-0 hover:bg-gray-50 transition-colors"
|
||||
>
|
||||
<div class="col-span-1 skeleton h-4"></div>
|
||||
<div class="col-span-3 font-medium text-gray-900 skeleton h-4"></div>
|
||||
<div class="col-span-2 skeleton h-4"></div>
|
||||
<div class="col-span-3 skeleton h-4"></div>
|
||||
<div class="col-span-3 flex items-center skeleton h-4"></div>
|
||||
<div class="col-span-1 h-4 rounded bg-gray-200 animate-pulse"></div>
|
||||
<div class="col-span-3 h-4 rounded bg-gray-200 animate-pulse"></div>
|
||||
<div class="col-span-2 h-4 rounded bg-gray-200 animate-pulse"></div>
|
||||
<div class="col-span-3 h-4 rounded bg-gray-200 animate-pulse"></div>
|
||||
<div class="col-span-3 h-4 rounded bg-gray-200 animate-pulse"></div>
|
||||
</div>
|
||||
{/each}
|
||||
</div>
|
||||
|
||||
Reference in New Issue
Block a user