acazares
27d9625bd0
- Added a step in the CI/CD pipeline to generate a version based on the branch and commit history. - Updated Dockerfile to accept the application version as an argument. - Modified the configuration to retrieve the application version from the environment variable. - Created a new API endpoint to expose the application version. - Added a new Svelte component to display the application version in the UI.
91 lines
2.1 KiB
Svelte
91 lines
2.1 KiB
Svelte
<script lang="ts">
|
|
import { onMount } from 'svelte';
|
|
import { api } from '$lib/api';
|
|
|
|
/**
|
|
* Componente para mostrar la versión de la aplicación
|
|
* Consume el endpoint /api/version del backend para obtener información de versión
|
|
*/
|
|
|
|
interface VersionInfo {
|
|
service: string;
|
|
version: string;
|
|
environment: string;
|
|
debug: boolean;
|
|
}
|
|
|
|
let versionInfo: VersionInfo | null = $state(null);
|
|
let loading: boolean = $state(true);
|
|
let error: string | null = $state(null);
|
|
|
|
/**
|
|
* Obtener información de versión desde el backend
|
|
*/
|
|
async function fetchVersion() {
|
|
try {
|
|
loading = true;
|
|
error = null;
|
|
|
|
const response = await api.get<VersionInfo>('/version');
|
|
|
|
if (response.error) {
|
|
throw new Error(response.error);
|
|
}
|
|
|
|
if (response.data) {
|
|
versionInfo = response.data;
|
|
}
|
|
} catch (err) {
|
|
console.error('Error al obtener versión:', err);
|
|
error = err instanceof Error ? err.message : 'Error desconocido';
|
|
} finally {
|
|
loading = false;
|
|
}
|
|
}
|
|
|
|
// Cargar versión al montar el componente
|
|
onMount(() => {
|
|
fetchVersion();
|
|
});
|
|
|
|
/**
|
|
* Obtener color del badge según el entorno
|
|
*/
|
|
function getEnvironmentColor(env: string): string {
|
|
switch (env?.toLowerCase()) {
|
|
case 'production':
|
|
return 'bg-green-600 text-white';
|
|
case 'development':
|
|
return 'bg-yellow-600 text-white';
|
|
case 'staging':
|
|
return 'bg-blue-600 text-white';
|
|
default:
|
|
return 'bg-gray-600 text-white';
|
|
}
|
|
}
|
|
</script>
|
|
|
|
<!-- Componente de versión -->
|
|
<div class="flex items-center app-version">
|
|
{#if loading}
|
|
<div class="text-xs text-muted-foreground">Cargando versión...</div>
|
|
{:else if error}
|
|
<div class="text-xs text-destructive">Error: {error}</div>
|
|
{:else if versionInfo}
|
|
<div class="flex items-center gap-2 text-xs">
|
|
|
|
<!-- Versión -->
|
|
<span class="font-mono font-semibold text-foreground">
|
|
v{versionInfo.version}
|
|
</span>
|
|
|
|
<!-- Indicador de debug (solo si está activo) -->
|
|
{#if versionInfo.debug}
|
|
<span class="rounded bg-orange-600 px-2 py-0.5 text-xs font-medium text-white">
|
|
DEBUG
|
|
</span>
|
|
{/if}
|
|
</div>
|
|
{/if}
|
|
</div>
|