{error}
{statusText}
{hasMeasuredProgress ? `Page ${pagesParsed} / ${totalPages}` : 'Awaiting first page'}
{stageLabel}
+
{hasMeasuredProgress ? `${Math.round(progressPercent)}% complete` : statusSubText}
{compactLabel}
{compactSubLabel}
{sessionExpired ? 'Please sign in again to continue' : 'Connect an email account to sync your data across devices'} @@ -132,45 +131,41 @@ function SignInContent() { {/* Alerts */} {sessionExpired && ( -
Your session has expired. Please sign in again.
Don't have an account?{' '} Sign up
By signing in, you agree to our{' '} showPrivacyModal()} @@ -249,7 +246,7 @@ function SignInContent() {
New account sign-ups are currently disabled by the site administrator.
Already have an account?{' '} Sign in
Create your account to get started
= 3 ? 'text-green-600' : 'text-red-600'}`}> +
= 3 ? 'text-accent' : 'text-danger'}`}> {strengthLabels[strength - 1] || 'Very Weak'}
{password === passwordConfirmation ? '✓ Passwords match' : '✗ Passwords do not match'}
By creating an account, you agree to our{' '} showPrivacyModal()} @@ -258,7 +249,7 @@ export default function SignUpPage() {
Reset the audiobook to change generation settings.
TTS audio for this chapter may be cached Change the TTS playback options or restart the server to force uncached regeneration
{chapter.title}
•
{chapter.status !== 'completed' && Missing • }{formatDuration(chapter.duration)}
Audiobook settings are fixed after generation. Chapters will appear here as they are ready.
+ font-mono text-foreground border border-line"> {children}
{children}
{message}
We use strictly necessary cookies for authentication. Optional analytics is enabled only when you consent. See our Privacy Policy for details.
User API keys are restricted and no shared provider is configured. Ask an admin to add one.
This instance restricts user API keys. TTS runs through admin-configured shared providers only.
This is a shared provider configured by an admin. API key and base URL are managed server-side.
This instance restricts model selection to each provider's default model.
Logged in as:
@@ -1211,7 +1147,7 @@ export function SettingsModal({ : (session.user.name || session.user.email || 'Account')}
{session.user.email}
Anonymous session
Export My Data
Download all your data as a ZIP file
- Permanently deletes your account and all data. -
+ Permanently deletes your account and all data. +
{session?.user?.isAnonymous ? (runtimeConfig.enableUserSignups ? 'You are using an anonymous session. Sign up to save your progress permanently, your current data is automatically transferred.' @@ -1278,19 +1218,19 @@ export function SettingsModal({
{normalizedAppVersion ? `Current version: v${normalizedAppVersion}` : 'Release history from GitHub'} @@ -1459,20 +1393,20 @@ function SettingsChangelogPanel({
Could not load changelog right now.
Loading release notes…
{bootstrapError}
{isAutoLoggingIn ? 'Starting anonymous session...' : 'Loading...'}
+ We found existing anonymous data from before auth was enabled. + Claim it now to attach it to your account. +
+ ⚠️ First user to claim this data will own it and revoke access for anyone else. +
- We found existing anonymous data from before auth was enabled. - Claim it now to attach it to your account. -
- ⚠️ First user to claim this data will own it and revoke access for anyone else. -
Press Enter to create or Escape to cancel
{currentFileName}
Drag files onto each other to make folders. Drop into the sidebar to move.
+ {textPreview} ) : ( - + {children}, img: () => null, blockquote: (props) => ( - + ), code: (props) => ( ), diff --git a/src/components/doclist/views/DocumentTile.tsx b/src/components/doclist/views/DocumentTile.tsx index 467847b..e74cabc 100644 --- a/src/components/doclist/views/DocumentTile.tsx +++ b/src/components/doclist/views/DocumentTile.tsx @@ -2,10 +2,10 @@ import Link from 'next/link'; import { useDrag, useDrop, type DragSourceMonitor } from 'react-dnd'; -import { Button } from '@headlessui/react'; import { PDFIcon, EPUBIcon, FileIcon } from '@/components/icons/Icons'; import type { DocumentListDocument, IconSize } from '@/types/documents'; import { DocumentPreview } from '@/components/doclist/DocumentPreview'; +import { IconButton } from '@/components/ui'; import { useDocumentSelection } from '../dnd/DocumentSelectionContext'; import { DND_DOCUMENT, documentIdentityKey, type DocumentDragItem } from '../dnd/dndTypes'; @@ -138,11 +138,11 @@ export function DocumentTile({ data-doc-tile aria-selected={isSelected} className={ - 'group relative flex flex-col rounded-md overflow-hidden border transition-all duration-200 ease-out hover:scale-[1.01] ' + + 'group relative flex flex-col rounded-md overflow-hidden border transition duration-base ease-standard ' + (isSelected - ? 'border-accent bg-offbase' - : 'border-offbase bg-base hover:bg-offbase hover:border-accent') + - (isDropTarget ? ' ring-1 ring-accent' : '') + + ? 'border-accent-line bg-surface-sunken' + : 'border-line bg-surface hover:bg-accent-wash hover:border-accent-line') + + (isDropTarget ? ' ring-1 ring-accent-line' : '') + (isDragging ? ' opacity-50' : '') } > @@ -166,11 +166,11 @@ export function DocumentTile({ > {doc.type === 'pdf' ? ( - + ) : doc.type === 'epub' ? ( - + ) : ( - + )} {showDeleteButton && ( - onDelete(doc)} - className={`inline-flex items-center justify-center text-muted hover:text-accent hover:bg-base focus:outline-none transition-colors duration-200 ${TRASH_BTN_CLASSES[iconSize]}`} + size="xs" + className={TRASH_BTN_CLASSES[iconSize]} aria-label={`Delete ${doc.name}`} > @@ -198,7 +199,7 @@ export function DocumentTile({ d="M19 7l-.867 12.142A2 2 0 0116.138 21H7.862a2 2 0 01-1.995-1.858L5 7m5 4v6m4-6v6m1-10V4a1 1 0 00-1-1h-4a1 1 0 00-1 1v3M4 7h16" /> - + )} diff --git a/src/components/doclist/views/GalleryView.tsx b/src/components/doclist/views/GalleryView.tsx index ed6d1bf..a047b63 100644 --- a/src/components/doclist/views/GalleryView.tsx +++ b/src/components/doclist/views/GalleryView.tsx @@ -1,13 +1,12 @@ 'use client'; -import Link from 'next/link'; import { useEffect, useMemo, useRef, useState } from 'react'; import { useDrag, useDrop } from 'react-dnd'; import type { DocumentListDocument } from '@/types/documents'; import { PDFIcon, EPUBIcon, FileIcon } from '@/components/icons/Icons'; import { DocumentPreview } from '@/components/doclist/DocumentPreview'; import { formatDocumentSize } from '@/components/doclist/formatSize'; -import { buttonClass } from '@/components/ui/buttonPrimitives'; +import { Button, ButtonLink } from '@/components/ui'; import { useDocumentSelection } from '../dnd/DocumentSelectionContext'; import { DND_DOCUMENT, documentIdentityKey, type DocumentDragItem } from '../dnd/dndTypes'; @@ -38,9 +37,9 @@ function formatParseStatus(status: DocumentListDocument['parseStatus']): string } function KindIcon({ doc, className }: { doc: DocumentListDocument; className?: string }) { - if (doc.type === 'pdf') return ; - if (doc.type === 'epub') return ; - return ; + if (doc.type === 'pdf') return ; + if (doc.type === 'epub') return ; + return ; } function GalleryThumb({ @@ -92,34 +91,34 @@ function GalleryThumb({ onClick={onClick} aria-current={active ? 'true' : undefined} className={ - 'group relative w-[98px] sm:w-[110px] shrink-0 cursor-pointer rounded-lg overflow-hidden border bg-base snap-start transition-all duration-200 ease-out ' + + 'group relative w-[98px] sm:w-[110px] shrink-0 cursor-pointer rounded-lg overflow-hidden border bg-surface snap-start transition duration-base ease-standard ' + (active - ? 'border-accent shadow-[0_10px_24px_-18px_rgba(0,0,0,0.85)] -translate-y-0.5' - : 'border-offbase hover:border-accent hover:-translate-y-0.5') + - (isOver && canDrop ? ' border-accent' : '') + + ? 'border-accent-line shadow-elev-2 -translate-y-px' + : 'border-line hover:border-accent-line hover:-translate-y-px hover:shadow-elev-2') + + (isOver && canDrop ? ' border-accent-line' : '') + (isDragging ? ' opacity-50' : '') } title={doc.name} > - + @@ -181,51 +180,48 @@ export function GalleryView({ return ( - + {activeDoc ? ( - + {activeDoc.name} - + {activeDoc.type.toUpperCase()} • {formatDocumentSize(activeDoc.size)} - + Open - - + onDeleteDoc(activeDoc)} - className={buttonClass({ variant: 'secondary', size: 'sm' })} + variant="secondary" + size="sm" > Delete - + - - Type + + Type {activeDoc.type} - Size + Size {formatDocumentSize(activeDoc.size)} - Last opened + Last opened {formatDateTime(activeDoc.recentlyOpenedAt)} - Last modified + Last modified {formatDateTime(activeDoc.lastModified)} {activeDoc.folderId && ( <> - Folder + Folder {folderNameById?.[activeDoc.folderId] ?? activeDoc.folderId} @@ -233,19 +229,19 @@ export function GalleryView({ )} {activeDoc.type === 'pdf' && ( <> - Parse status + Parse status {formatParseStatus(activeDoc.parseStatus)} )} ) : ( - No documents to show + No documents to show )} - + ; - if (doc.type === 'epub') return ; - return ; + if (doc.type === 'pdf') return ; + if (doc.type === 'epub') return ; + return ; } function HeaderCell({ @@ -62,8 +62,8 @@ function HeaderCell({ onSortChange(field, nextDir); }} className={ - 'flex items-center gap-1 px-2 py-1.5 text-[10px] uppercase tracking-wide font-semibold transition-colors duration-200 ease-out hover:text-accent ' + - (active ? 'text-accent' : 'text-muted') + + 'flex items-center gap-1 px-2 py-1.5 text-[10px] uppercase tracking-wide font-semibold transition-colors duration-base ease-standard hover:text-accent ' + + (active ? 'text-accent' : 'text-soft') + (align === 'right' ? ' justify-end' : '') + ' ' + (className ?? '') @@ -131,11 +131,11 @@ function DocRow({ data-doc-tile aria-selected={isSelected} className={ - 'grid grid-cols-[minmax(0,1fr)_44px_72px_104px_28px] sm:grid-cols-[minmax(0,1fr)_56px_96px_140px_32px] items-center text-[12px] border-b border-offbase transition-colors duration-200 ease-out ' + + 'grid grid-cols-[minmax(0,1fr)_44px_72px_104px_28px] sm:grid-cols-[minmax(0,1fr)_56px_96px_140px_32px] items-center text-[12px] border-b border-line-soft transition-colors duration-base ease-standard ' + (isSelected - ? 'bg-offbase text-accent' - : 'text-foreground hover:bg-offbase') + - (isTarget ? ' ring-1 ring-accent ring-inset' : '') + + ? 'bg-surface-sunken text-accent' + : 'text-foreground hover:bg-accent-wash') + + (isTarget ? ' ring-1 ring-accent-line ring-inset' : '') + (isDragging ? ' opacity-50' : '') } > @@ -149,19 +149,19 @@ function DocRow({ {doc.name} - {doc.type} - + {doc.type} + {formatDocumentSize(doc.size)} - + {formatDate(doc.lastModified)} - { e.stopPropagation(); onDeleteDoc(doc); }} - className="h-7 w-7 flex items-center justify-center text-muted hover:text-accent hover:bg-offbase hover:scale-[1.02] rounded transition-all duration-200 ease-out" + size="sm" aria-label={`Delete ${doc.name}`} > @@ -172,7 +172,7 @@ function DocRow({ d="M19 7l-.867 12.142A2 2 0 0116.138 21H7.862a2 2 0 01-1.995-1.858L5 7m5 4v6m4-6v6m1-10V4a1 1 0 00-1-1h-4a1 1 0 00-1 1v3M4 7h16" /> - + ); } @@ -198,7 +198,7 @@ export function ListView({ return ( - + diff --git a/src/components/doclist/window/FinderSidebar.tsx b/src/components/doclist/window/FinderSidebar.tsx index 0ecf12c..20ee1c3 100644 --- a/src/components/doclist/window/FinderSidebar.tsx +++ b/src/components/doclist/window/FinderSidebar.tsx @@ -1,12 +1,13 @@ 'use client'; -import { Menu, MenuButton, MenuItem, MenuItems, Transition } from '@headlessui/react'; +import { Menu, MenuButton, Transition } from '@headlessui/react'; import { Fragment, useRef, type CSSProperties, type ReactNode } from 'react'; import { useDrop } from 'react-dnd'; import type { Folder, SidebarFilter } from '@/types/documents'; import { PDFIcon, EPUBIcon, FileIcon, DotsHorizontalIcon } from '@/components/icons/Icons'; import { FolderIcon, HomeIcon, ClockIcon, FolderPlusIcon } from './finderIcons'; import { DND_DOCUMENT, type DocumentDragItem } from '../dnd/dndTypes'; +import { IconButton, MenuActionItem, MenuItemsSurface, Sidebar as SidebarShell, SidebarNav, SidebarNavGroup, SidebarNavItem } from '@/components/ui'; interface FinderSidebarProps { filter: SidebarFilter; @@ -30,60 +31,6 @@ interface FinderSidebarProps { const MIN_WIDTH = 168; const MAX_WIDTH = 320; -interface SidebarRowProps { - active: boolean; - onClick: () => void; - icon: ReactNode; - label: string; - count?: number; - countClassName?: string; - trailing?: ReactNode; - isDropTarget?: boolean; -} - -function SidebarRow({ - active, - onClick, - icon, - label, - count, - countClassName, - trailing, - isDropTarget, -}: SidebarRowProps) { - return ( - - - {icon} - - {label} - {typeof count === 'number' && count > 0 && ( - - {count} - - )} - {trailing} - - ); -} - function FolderRow({ folder, active, @@ -122,7 +69,8 @@ function FolderRow({ ref={dropRef as unknown as React.RefObject} className="group/folder relative" > - } @@ -131,42 +79,20 @@ function FolderRow({ countClassName="group-hover/folder:-translate-x-6 group-focus-within/folder:-translate-x-6" isDropTarget={isDropTarget} /> - { e.stopPropagation(); onDelete(); }} - className="absolute right-1 top-1/2 -translate-y-1/2 h-5 w-5 inline-flex items-center justify-center rounded text-muted opacity-0 group-hover/folder:opacity-100 group-focus-within/folder:opacity-100 hover:text-accent hover:bg-offbase transition" + size="xs" + className="absolute right-1 top-1/2 -translate-y-1/2 opacity-0 group-hover/folder:opacity-100 group-focus-within/folder:opacity-100" aria-label={`Delete ${folder.name}`} title={`Delete ${folder.name}`} > - - - ); -} - -function SectionHeader({ - children, - isFirst, - rightSlot, -}: { - children: ReactNode; - isFirst?: boolean; - rightSlot?: ReactNode; -}) { - return ( - - {children} - {rightSlot && {rightSlot}} + ); } @@ -204,19 +130,20 @@ export function FinderSidebar({ }; return ( -
{textPreview}
{activeDoc.type.toUpperCase()} • {formatDocumentSize(activeDoc.size)}
No documents to show