fix: use native anchor tags for all public pages navigation and add Home button
This commit is contained in:
@@ -14,8 +14,8 @@ import {
|
|||||||
ZoomIn,
|
ZoomIn,
|
||||||
ZoomOut,
|
ZoomOut,
|
||||||
Maximize2,
|
Maximize2,
|
||||||
|
Home,
|
||||||
} from "lucide-react";
|
} from "lucide-react";
|
||||||
import Link from "next/link";
|
|
||||||
import { Document, Page, pdfjs } from "react-pdf";
|
import { Document, Page, pdfjs } from "react-pdf";
|
||||||
import "react-pdf/dist/Page/AnnotationLayer.css";
|
import "react-pdf/dist/Page/AnnotationLayer.css";
|
||||||
import "react-pdf/dist/Page/TextLayer.css";
|
import "react-pdf/dist/Page/TextLayer.css";
|
||||||
@@ -175,7 +175,7 @@ export default function DocumentViewClient({
|
|||||||
style={{ backgroundColor: primaryColor }}
|
style={{ backgroundColor: primaryColor }}
|
||||||
>
|
>
|
||||||
<div className="max-w-5xl mx-auto flex items-center justify-between">
|
<div className="max-w-5xl mx-auto flex items-center justify-between">
|
||||||
<div className="flex items-center gap-2 md:gap-3">
|
<a href="/portal" className="flex items-center gap-2 md:gap-3 hover:opacity-80 transition-opacity">
|
||||||
{organization.logoUrl ? (
|
{organization.logoUrl ? (
|
||||||
<img
|
<img
|
||||||
src={organization.logoUrl}
|
src={organization.logoUrl}
|
||||||
@@ -192,24 +192,25 @@ export default function DocumentViewClient({
|
|||||||
<h1 className="text-sm md:text-lg font-bold text-white truncate max-w-[150px] md:max-w-none">{organization.name}</h1>
|
<h1 className="text-sm md:text-lg font-bold text-white truncate max-w-[150px] md:max-w-none">{organization.name}</h1>
|
||||||
<p className="text-xs text-white/70 hidden md:block">Portal de Transparência</p>
|
<p className="text-xs text-white/70 hidden md:block">Portal de Transparência</p>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</a>
|
||||||
{backUrl ? (
|
<div className="flex items-center gap-2">
|
||||||
<Link
|
{backUrl ? (
|
||||||
href={backUrl}
|
<a
|
||||||
className="text-white/80 hover:text-white flex items-center gap-1 md:gap-2 text-xs md:text-sm"
|
href={backUrl}
|
||||||
|
className="text-white/80 hover:text-white flex items-center gap-1 md:gap-2 text-xs md:text-sm bg-white/10 hover:bg-white/20 px-2.5 py-1.5 rounded-lg transition-colors"
|
||||||
|
>
|
||||||
|
<ArrowLeft size={14} />
|
||||||
|
<span className="hidden sm:inline">Voltar</span>
|
||||||
|
</a>
|
||||||
|
) : null}
|
||||||
|
<a
|
||||||
|
href="/portal"
|
||||||
|
className="text-white/80 hover:text-white flex items-center gap-1 md:gap-2 text-xs md:text-sm bg-white/10 hover:bg-white/20 px-2.5 py-1.5 rounded-lg transition-colors"
|
||||||
>
|
>
|
||||||
<ArrowLeft size={14} className="md:hidden" />
|
<Home size={14} />
|
||||||
<ArrowLeft size={16} className="hidden md:block" />
|
<span className="hidden sm:inline">Início</span>
|
||||||
<span className="hidden sm:inline">Voltar à Pasta</span>
|
</a>
|
||||||
<span className="sm:hidden">Voltar</span>
|
</div>
|
||||||
</Link>
|
|
||||||
) : (
|
|
||||||
<div className="text-white/50 flex items-center gap-1 md:gap-2 text-xs md:text-sm">
|
|
||||||
<ArrowLeft size={14} className="md:hidden" />
|
|
||||||
<ArrowLeft size={16} className="hidden md:block" />
|
|
||||||
<span className="hidden sm:inline">Documento Público</span>
|
|
||||||
</div>
|
|
||||||
)}
|
|
||||||
</div>
|
</div>
|
||||||
</header>
|
</header>
|
||||||
|
|
||||||
|
|||||||
@@ -10,10 +10,7 @@ import {
|
|||||||
FileText,
|
FileText,
|
||||||
ChevronRight,
|
ChevronRight,
|
||||||
Building2,
|
Building2,
|
||||||
Home,
|
|
||||||
} from "lucide-react";
|
} from "lucide-react";
|
||||||
import Link from "next/link";
|
|
||||||
import { useRouter } from "next/navigation";
|
|
||||||
import { Badge } from "@/components/ui/badge";
|
import { Badge } from "@/components/ui/badge";
|
||||||
import { Input } from "@/components/ui/input";
|
import { Input } from "@/components/ui/input";
|
||||||
import { DynamicFavicon } from "@/components/DynamicFavicon";
|
import { DynamicFavicon } from "@/components/DynamicFavicon";
|
||||||
@@ -43,7 +40,6 @@ export default function PortalClient({
|
|||||||
organization: Organization;
|
organization: Organization;
|
||||||
folders: FolderType[];
|
folders: FolderType[];
|
||||||
}) {
|
}) {
|
||||||
const router = useRouter();
|
|
||||||
const [searchTerm, setSearchTerm] = useState("");
|
const [searchTerm, setSearchTerm] = useState("");
|
||||||
|
|
||||||
const filteredFolders = folders.filter((folder) =>
|
const filteredFolders = folders.filter((folder) =>
|
||||||
@@ -67,7 +63,7 @@ export default function PortalClient({
|
|||||||
{/* Header */}
|
{/* Header */}
|
||||||
<header className="bg-white border-b border-slate-100 sticky top-0 z-10">
|
<header className="bg-white border-b border-slate-100 sticky top-0 z-10">
|
||||||
<div className="max-w-7xl mx-auto px-4 sm:px-6 lg:px-8 h-16 sm:h-20 flex items-center justify-between">
|
<div className="max-w-7xl mx-auto px-4 sm:px-6 lg:px-8 h-16 sm:h-20 flex items-center justify-between">
|
||||||
<Link href="/portal" className="flex items-center gap-3 sm:gap-4 min-w-0 hover:opacity-80 transition-opacity">
|
<a href="/portal" className="flex items-center gap-3 sm:gap-4 min-w-0 hover:opacity-80 transition-opacity">
|
||||||
{organization.logoUrl ? (
|
{organization.logoUrl ? (
|
||||||
<img src={organization.logoUrl} alt={organization.name} className="h-8 sm:h-10 object-contain shrink-0" />
|
<img src={organization.logoUrl} alt={organization.name} className="h-8 sm:h-10 object-contain shrink-0" />
|
||||||
) : (
|
) : (
|
||||||
@@ -79,7 +75,7 @@ export default function PortalClient({
|
|||||||
<h1 className="text-xs sm:text-sm font-black text-slate-900 uppercase tracking-tight truncate">{organization.name}</h1>
|
<h1 className="text-xs sm:text-sm font-black text-slate-900 uppercase tracking-tight truncate">{organization.name}</h1>
|
||||||
<p className="text-[9px] sm:text-[10px] font-bold text-slate-400 uppercase tracking-widest hidden sm:block">Portal da Transparência</p>
|
<p className="text-[9px] sm:text-[10px] font-bold text-slate-400 uppercase tracking-widest hidden sm:block">Portal da Transparência</p>
|
||||||
</div>
|
</div>
|
||||||
</Link>
|
</a>
|
||||||
<Badge variant="outline" className="border-green-200 bg-green-50 text-green-600 font-bold text-[9px] sm:text-[10px] uppercase py-1 px-2 sm:px-3 shrink-0">
|
<Badge variant="outline" className="border-green-200 bg-green-50 text-green-600 font-bold text-[9px] sm:text-[10px] uppercase py-1 px-2 sm:px-3 shrink-0">
|
||||||
<span className="hidden sm:inline">Ambiente </span>Seguro
|
<span className="hidden sm:inline">Ambiente </span>Seguro
|
||||||
</Badge>
|
</Badge>
|
||||||
|
|||||||
@@ -11,8 +11,8 @@ import {
|
|||||||
Search,
|
Search,
|
||||||
ExternalLink,
|
ExternalLink,
|
||||||
ChevronRight,
|
ChevronRight,
|
||||||
|
Home,
|
||||||
} from "lucide-react";
|
} from "lucide-react";
|
||||||
import Link from "next/link";
|
|
||||||
import { Badge } from "@/components/ui/badge";
|
import { Badge } from "@/components/ui/badge";
|
||||||
import { Input } from "@/components/ui/input";
|
import { Input } from "@/components/ui/input";
|
||||||
import { Button } from "@/components/ui/button";
|
import { Button } from "@/components/ui/button";
|
||||||
@@ -105,7 +105,7 @@ export default function FolderViewClient({
|
|||||||
{/* Header */}
|
{/* Header */}
|
||||||
<header className="bg-white border-b border-slate-100 sticky top-0 z-10">
|
<header className="bg-white border-b border-slate-100 sticky top-0 z-10">
|
||||||
<div className="max-w-7xl mx-auto px-4 sm:px-6 lg:px-8 h-16 sm:h-20 flex items-center justify-between">
|
<div className="max-w-7xl mx-auto px-4 sm:px-6 lg:px-8 h-16 sm:h-20 flex items-center justify-between">
|
||||||
<Link href="/portal" className="flex items-center gap-3 sm:gap-4 min-w-0 hover:opacity-80 transition-opacity">
|
<a href="/portal" className="flex items-center gap-3 sm:gap-4 min-w-0 hover:opacity-80 transition-opacity">
|
||||||
{organization.logoUrl ? (
|
{organization.logoUrl ? (
|
||||||
<img src={organization.logoUrl} alt={organization.name} className="h-8 sm:h-10 object-contain shrink-0" />
|
<img src={organization.logoUrl} alt={organization.name} className="h-8 sm:h-10 object-contain shrink-0" />
|
||||||
) : (
|
) : (
|
||||||
@@ -117,10 +117,19 @@ export default function FolderViewClient({
|
|||||||
<h1 className="text-xs sm:text-sm font-black text-slate-900 uppercase tracking-tight truncate">{organization.name}</h1>
|
<h1 className="text-xs sm:text-sm font-black text-slate-900 uppercase tracking-tight truncate">{organization.name}</h1>
|
||||||
<p className="text-[9px] sm:text-[10px] font-bold text-slate-400 uppercase tracking-widest hidden sm:block">Portal da Transparência</p>
|
<p className="text-[9px] sm:text-[10px] font-bold text-slate-400 uppercase tracking-widest hidden sm:block">Portal da Transparência</p>
|
||||||
</div>
|
</div>
|
||||||
</Link>
|
</a>
|
||||||
<Badge variant="outline" className="border-green-200 bg-green-50 text-green-600 font-bold text-[9px] sm:text-[10px] uppercase py-1 px-2 sm:px-3 shrink-0">
|
<div className="flex items-center gap-2 sm:gap-3">
|
||||||
<span className="hidden sm:inline">Ambiente </span>Seguro
|
<a
|
||||||
</Badge>
|
href="/portal"
|
||||||
|
className="flex items-center gap-1.5 px-2.5 sm:px-3 py-1.5 sm:py-2 rounded-lg bg-slate-100 hover:bg-slate-200 text-slate-600 hover:text-slate-900 transition-colors text-[10px] sm:text-xs font-bold uppercase tracking-wide"
|
||||||
|
>
|
||||||
|
<Home size={14} />
|
||||||
|
<span className="hidden sm:inline">Início</span>
|
||||||
|
</a>
|
||||||
|
<Badge variant="outline" className="border-green-200 bg-green-50 text-green-600 font-bold text-[9px] sm:text-[10px] uppercase py-1 px-2 sm:px-3 shrink-0">
|
||||||
|
<span className="hidden sm:inline">Ambiente </span>Seguro
|
||||||
|
</Badge>
|
||||||
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</header>
|
</header>
|
||||||
|
|
||||||
@@ -157,9 +166,9 @@ export default function FolderViewClient({
|
|||||||
<div className="flex items-center flex-wrap gap-2 mb-2 text-sm font-medium">
|
<div className="flex items-center flex-wrap gap-2 mb-2 text-sm font-medium">
|
||||||
{folder.breadcrumbs.map((crumb) => (
|
{folder.breadcrumbs.map((crumb) => (
|
||||||
<React.Fragment key={crumb.id}>
|
<React.Fragment key={crumb.id}>
|
||||||
<Link href={`/visualizar/pasta/${crumb.id}`} className="px-2 py-1 rounded-lg bg-slate-100 text-slate-600 hover:bg-slate-200 hover:text-slate-900 transition-colors">
|
<a href={`/visualizar/pasta/${crumb.id}`} className="px-2 py-1 rounded-lg bg-slate-100 text-slate-600 hover:bg-slate-200 hover:text-slate-900 transition-colors">
|
||||||
{crumb.name}
|
{crumb.name}
|
||||||
</Link>
|
</a>
|
||||||
<ChevronRight size={14} className="text-slate-300" />
|
<ChevronRight size={14} className="text-slate-300" />
|
||||||
</React.Fragment>
|
</React.Fragment>
|
||||||
))}
|
))}
|
||||||
@@ -239,7 +248,7 @@ export default function FolderViewClient({
|
|||||||
transition={{ delay: idx * 0.05 }}
|
transition={{ delay: idx * 0.05 }}
|
||||||
className="relative bg-white border border-slate-100 p-4 rounded-xl hover:border-slate-200 transition-all group flex flex-col md:flex-row md:items-center justify-between gap-4"
|
className="relative bg-white border border-slate-100 p-4 rounded-xl hover:border-slate-200 transition-all group flex flex-col md:flex-row md:items-center justify-between gap-4"
|
||||||
>
|
>
|
||||||
<Link href={`/documento/${doc.id}`} target="_blank" className="absolute inset-0 z-0" />
|
<a href={`/documento/${doc.id}`} target="_blank" className="absolute inset-0 z-0" />
|
||||||
<div className="flex items-center gap-4 min-w-0">
|
<div className="flex items-center gap-4 min-w-0">
|
||||||
<div className="w-12 h-12 rounded-xl bg-slate-50 flex items-center justify-center text-slate-400 shrink-0 group-hover:bg-red-50 group-hover:text-red-500 transition-colors">
|
<div className="w-12 h-12 rounded-xl bg-slate-50 flex items-center justify-center text-slate-400 shrink-0 group-hover:bg-red-50 group-hover:text-red-500 transition-colors">
|
||||||
<FileText size={24} />
|
<FileText size={24} />
|
||||||
@@ -261,17 +270,14 @@ export default function FolderViewClient({
|
|||||||
</div>
|
</div>
|
||||||
|
|
||||||
<div className="flex flex-col sm:flex-row items-stretch sm:items-center gap-2 relative z-10">
|
<div className="flex flex-col sm:flex-row items-stretch sm:items-center gap-2 relative z-10">
|
||||||
<Button
|
<a
|
||||||
asChild
|
href={`/documento/${doc.id}`}
|
||||||
variant="outline"
|
target="_blank"
|
||||||
size="sm"
|
className="h-9 sm:h-10 border border-slate-200 hover:bg-slate-50 text-slate-600 font-bold text-[10px] uppercase rounded-lg px-3 sm:px-4 shadow-none flex items-center justify-center"
|
||||||
className="h-9 sm:h-10 border-slate-200 hover:bg-slate-50 text-slate-600 font-bold text-[10px] uppercase rounded-lg px-3 sm:px-4 shadow-none justify-center"
|
|
||||||
>
|
>
|
||||||
<Link href={`/documento/${doc.id}`} target="_blank">
|
<ExternalLink size={14} className="mr-2" />
|
||||||
<ExternalLink size={14} className="mr-2" />
|
Visualizar
|
||||||
Visualizar
|
</a>
|
||||||
</Link>
|
|
||||||
</Button>
|
|
||||||
{doc.fileUrl && doc.isDownloadable && (
|
{doc.fileUrl && doc.isDownloadable && (
|
||||||
<Button
|
<Button
|
||||||
asChild
|
asChild
|
||||||
|
|||||||
Reference in New Issue
Block a user