mirror of
https://github.com/mauriceboe/TREK.git
synced 2026-10-22 06:56:35 +00:00
Maurice
0dd07befa7
The Plan tab was the last trip tab still in the old design. It now reads like Bookings, Costs, Lists, Files and Collab, without losing a function: - Day plan: each day is a card with a head band (day tile with weather, stay and rental pills, a "+" menu for place, stay, transport, transit and note), rows with "..." menus, white badges and a white route bar. - Places column: add, search and filters in three rows, a show dropdown, category and rating filters, and a selection bar at the foot. - Place inspector, day details and the stay editor on the shared dialog frame; the place form in the editor look with the name in the head band. - Clicking a booking or transport anywhere on the plan opens the booking detail popup first; Edit leads to the editor. The popup is one host shared with the Bookings and Transports tabs. - Files and Collab dialogs, notes, polls, links and chat moved to the same frame; shared DialogShell and dialogParts hold the building blocks. - The map hover card shows the place photo and follows the theme. Every new and reworded string is translated into all locales, and a few older English leftovers (help center, cost split, import hints) with them. Phone screens keep their own look.
26 lines
1.3 KiB
TypeScript
26 lines
1.3 KiB
TypeScript
import { Trash2 } from 'lucide-react'
|
|
import type { FileManagerState } from './useFileManager'
|
|
import { FileRow } from './FileManagerRow'
|
|
|
|
export function TrashView(S: FileManagerState) {
|
|
const { trashFiles, loadingTrash, t } = S
|
|
return (
|
|
<div className="flex-1 overflow-y-auto px-7 pb-4 pt-4 max-md:px-4">
|
|
{loadingTrash ? (
|
|
<div style={{ textAlign: 'center', padding: 40, color: 'var(--text-faint)' }}>
|
|
<div style={{ width: 20, height: 20, border: '2px solid var(--text-faint)', borderTopColor: 'transparent', borderRadius: '50%', animation: 'spin 0.8s linear infinite', margin: '0 auto' }} />
|
|
</div>
|
|
) : trashFiles.length === 0 ? (
|
|
<div style={{ textAlign: 'center', padding: '60px 20px', color: 'var(--text-faint)' }}>
|
|
<Trash2 size={40} style={{ color: 'var(--text-faint)', display: 'block', margin: '0 auto 12px' }} />
|
|
<p style={{ fontSize: 'calc(14px * var(--fs-scale-body, 1))', fontWeight: 600, color: 'var(--text-secondary)', margin: '0 0 4px' }}>{t('files.trashEmpty') || 'Trash is empty'}</p>
|
|
</div>
|
|
) : (
|
|
<div style={{ display: 'flex', flexDirection: 'column', gap: 8 }}>
|
|
{trashFiles.map(file => <FileRow key={file.id} {...S} file={file} isTrash />)}
|
|
</div>
|
|
)}
|
|
</div>
|
|
)
|
|
}
|