vmi-virtual-memorial/vmi-wd-frontend / 62cb8d8

Browse files

carry document indicator everywhere names show up

Authored by espadonne
SHA
62cb8d8152f7d5706a7067ac4c058313fe8ea2da
Parents
e99d51f
Tree
a8e1987

5 changed files

StatusFile+-
M app/memorial/conflict/[id]/page.tsx 3 1
M app/memorial/page.tsx 4 1
M app/memorial/search/page.tsx 3 1
A components/DocumentIcon.tsx 18 0
M lib/api.ts 2 0
app/memorial/conflict/[id]/page.tsxmodified
@@ -5,6 +5,7 @@ import Link from 'next/link';
55
 import { useParams } from 'next/navigation';
66
 import { getConflicts, getPeopleByConflict, Conflict, Person } from '@/lib/api';
77
 import Header from '@/components/Header';
8
+import DocumentIcon from '@/components/DocumentIcon';
89
910
 export default function ConflictPage() {
1011
   const params = useParams();
@@ -105,10 +106,11 @@ export default function ConflictPage() {
105106
                   href={`/memorial/person/${person.id}`}
106107
                   className="block p-6 border-2 border-gray-200 rounded-lg hover:border-vmi-gold hover:bg-vmi-light-gold transition-all duration-200 group"
107108
                 >
108
-                  <h3 className="text-xl font-bold text-gray-800 group-hover:text-vmi-red transition-colors mb-2">
109
+                  <h3 className="text-xl font-bold text-gray-800 group-hover:text-vmi-red transition-colors mb-2 flex items-center gap-2">
109110
                     {person.full_display_name ?
110111
                       person.full_display_name.replace(person.rank + ' ', '').replace(person.rank + ', ', '')
111112
                       : person.display_name.replace(person.rank + ' ', '').replace(person.rank + ', ', '')}
113
+                    {person.pdf_key && <DocumentIcon className="flex-shrink-0" />}
112114
                   </h3>
113115
                   {person.rank && (
114116
                     <p className="text-gray-700 font-semibold">{person.rank}</p>
app/memorial/page.tsxmodified
@@ -3,6 +3,7 @@
33
 import { useState, useEffect } from 'react';
44
 import Link from 'next/link';
55
 import Header from '@/components/Header';
6
+import DocumentIcon from '@/components/DocumentIcon';
67
78
 interface Person {
89
   id: number;
@@ -10,6 +11,7 @@ interface Person {
1011
   rank: string;
1112
   unit: string;
1213
   death_description?: string;
14
+  pdf_key?: string;
1315
 }
1416
1517
 interface ConflictWithCasualties {
@@ -179,8 +181,9 @@ export default function MemorialIndexPage() {
179181
                         href={`/memorial/person/${person.id}`}
180182
                         className="block p-4 border border-gray-200 rounded hover:border-vmi-gold hover:bg-vmi-light-gold transition-all duration-200 group"
181183
                       >
182
-                        <h3 className="font-bold text-gray-800 group-hover:text-vmi-red transition-colors">
184
+                        <h3 className="font-bold text-gray-800 group-hover:text-vmi-red transition-colors flex items-center gap-2">
183185
                           {person.display_name.replace(person.rank + ' ', '').replace(person.rank + ', ', '')}
186
+                          {person.pdf_key && <DocumentIcon className="flex-shrink-0" />}
184187
                         </h3>
185188
                         {person.rank && (
186189
                           <p className="text-gray-700 text-sm">{person.rank}</p>
app/memorial/search/page.tsxmodified
@@ -4,6 +4,7 @@ import { useState, useEffect } from 'react';
44
 import Link from 'next/link';
55
 import { searchPeople, getSearchFilters, PersonSearchResult, SearchFilters } from '@/lib/api';
66
 import Header from '@/components/Header';
7
+import DocumentIcon from '@/components/DocumentIcon';
78
89
 export default function MemorialSearchPage() {
910
   // Search state
@@ -264,10 +265,11 @@ export default function MemorialSearchPage() {
264265
                     >
265266
                       <div className="grid grid-cols-1 md:grid-cols-3 gap-4">
266267
                         <div>
267
-                          <h3 className="text-xl font-bold text-gray-800 group-hover:text-vmi-red transition-colors">
268
+                          <h3 className="text-xl font-bold text-gray-800 group-hover:text-vmi-red transition-colors flex items-center gap-2">
268269
                             {person.full_display_name ?
269270
                               person.full_display_name.replace(person.rank + ' ', '').replace(person.rank + ', ', '')
270271
                               : person.display_name}
272
+                            {person.pdf_key && <DocumentIcon className="flex-shrink-0" />}
271273
                           </h3>
272274
                           {person.rank && (
273275
                             <p className="text-gray-700">{person.rank}</p>
components/DocumentIcon.tsxadded
@@ -0,0 +1,18 @@
1
+interface DocumentIconProps {
2
+  className?: string;
3
+  title?: string;
4
+}
5
+
6
+export default function DocumentIcon({ className = "", title = "Memorial document available" }: DocumentIconProps) {
7
+  return (
8
+    <span title={title} className={`inline-block ${className}`}>
9
+      <svg xmlns="http://www.w3.org/2000/svg" width="20" height="20" viewBox="0 0 24 24" fill="none" stroke="#b91c1c" strokeWidth="2" strokeLinecap="round" strokeLinejoin="round" className="feather feather-file-text">
10
+        <path d="M14 2H6a2 2 0 0 0-2 2v16a2 2 0 0 0 2 2h12a2 2 0 0 0 2-2V8z" />
11
+        <polyline points="14 2 14 8 20 8" />
12
+        <line x1="16" y1="13" x2="8" y2="13" />
13
+        <line x1="16" y1="17" x2="8" y2="17" />
14
+        <line x1="10" y1="9" x2="9" y2="9" />
15
+      </svg>
16
+    </span>
17
+  );
18
+}
lib/api.tsmodified
@@ -79,6 +79,7 @@ export interface Person {
7979
   class_year?: number;
8080
   full_display_name?: string;
8181
   death_description?: string;
82
+  pdf_key?: string;
8283
 }
8384
8485
 export interface PersonDetail extends Person {
@@ -110,6 +111,7 @@ export interface PersonSearchResult {
110111
   death_date_display?: string;
111112
   conflict_name: string;
112113
   conflict_id: number;
114
+  pdf_key?: string;
113115
 }
114116
115117
 export interface SearchFilters {