carlos/almeira-web
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

feat(entity): habilitar MediaGridSelector para elegir y subir logotipo corporativo

Browse Source
This commit is contained in:
Carlos (Almeira) 2026-03-29 01:41:29 -05:00
parent 0b34e772d0
commit a99355f76e
2 changed files with 43 additions and 14 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

16
src/app/dashboard/entity/page.tsx
View File

@ -2,6 +2,7 @@ import { getEntity, updateEntity } from '@/app/actions/entity';
import { Building, Image as ImageIcon, Link as LinkIcon, Share2, Tv, RadioTower, Facebook, Instagram, Twitter, Youtube, Send, Mail, Globe, MapPin, Phone, MessageSquare } from 'lucide-react';
import { createSessionClient } from '@/lib/appwrite.server';
import { APPWRITE_ALMEIRA_CONFIG } from '@/lib/appwrite';
import EntityLogoField from '@/components/dashboard/EntityLogoField';
export default async function EntityPage() {
let entity: any = null;
@ -59,20 +60,7 @@ export default async function EntityPage() {
/>
</div>
<div>
<label className="text-[10px] font-black tracking-widest text-slate-500 uppercase block mb-2">Logotipo Corporativo</label>
{entity?.logotipo && (
<div className="mb-3 p-3 bg-slate-950 rounded-xl inline-block border border-slate-800">
<img src={entity.logotipo} alt="Logo actual" className="h-16 object-contain" />
</div>
)}
<input
type="file"
name="logotipo"
accept="image/*"
className="w-full bg-slate-950/50 border border-slate-800 rounded-xl file:mr-4 file:py-3 file:px-4 file:rounded-l-xl file:border-0 file:text-[10px] file:font-black file:uppercase file:bg-cyan-500/10 file:text-cyan-400 hover:file:bg-cyan-500/20 text-slate-300 text-sm transition-all"
/>
</div>
<EntityLogoField initialUrl={entity?.logotipo || ''} />
<div className="flex items-center gap-3 bg-slate-950 p-4 border border-slate-800 rounded-xl">
<input type="checkbox" name="mostrar_texto_logo" value="true" defaultChecked={entity?.mostrar_texto_logo === true} id="mostrar_texto_logo" className="w-5 h-5 accent-cyan-500 cursor-pointer" />

41
src/components/dashboard/EntityLogoField.tsx Normal file
View File

@ -0,0 +1,41 @@
'use client';
import { useState } from 'react';
import { MediaGridSelector } from './MediaGridSelector';
export default function EntityLogoField({
initialUrl = '',
initialId = ''
}: {
initialUrl?: string,
initialId?: string
}) {
// Si la entidad viene con url vieja, guardamos la url final. Si se escoge nueva, guardamos la url o el id según convenga.
// MediaGridSelector espera el ID del documento para hacer el preview.
const [mediaId, setMediaId] = useState(initialId);
const [finalUrl, setFinalUrl] = useState(initialUrl);
return (
<div>
<MediaGridSelector
value={mediaId}
onChange={(id, url) => {
setMediaId(id);
setFinalUrl(url || '');
}}
label="Logotipo Corporativo"
/>
{/* Si no hay mediaId activo pero sí URL antigua (legacy), la mostramos */}
{!mediaId && finalUrl && (
<div className="mt-4 mb-2 p-3 bg-slate-950 rounded-xl inline-block border border-slate-800">
<p className="text-[10px] text-slate-500 mb-2 uppercase tracking-widest font-bold">Logo Heredado</p>
<img src={finalUrl} alt="Logo actual" className="h-16 object-contain" />
</div>
)}
{/* Enviamos el string del ID o de la URL para que entity.ts la guarde.
Adaptaremos entity.ts para que si 'logotipo' es texto puro, lo guarde tal cual. */}
<input type="hidden" name="logotipo" value={finalUrl || ''} />
</div>
);
}