a3a6319c29
See CHANGELOG.md for the full v0.16.0 entry. --------- Signed-off-by: dependabot[bot] <support@github.com> Co-authored-by: ralksta <ralksta@users.noreply.github.com> Co-authored-by: dependabot[bot] <49699333+dependabot[bot]@users.noreply.github.com> Co-authored-by: Claude Opus 5 <noreply@anthropic.com> Co-authored-by: Ralf <rohlenbo79@gmail.com> Co-authored-by: Paul Thies <110185070+ImScheinox@users.noreply.github.com> Co-authored-by: lancetm714 <108419425+lancetm714@users.noreply.github.com>
81 lines
3.0 KiB
TypeScript
81 lines
3.0 KiB
TypeScript
'use client';
|
|
|
|
import * as Icons from './Icons';
|
|
import { en } from '@/lib/i18n/locales/en';
|
|
import { LIGHTBOX_SHORTCUTS, shortcutDisplayKeys } from '@/lib/lightboxShortcuts';
|
|
|
|
/**
|
|
* The admin help section.
|
|
*
|
|
* It exists because parts of the portfolio have no control of their own. The
|
|
* lightbox is the clearest case: its keys are deliberately unadvertised to
|
|
* visitors, which also left the site owner with no way to learn they exist
|
|
* (#473). This is where the owner finds out what their portfolio can do.
|
|
*
|
|
* Labels come from the English dictionary rather than being retyped, so what
|
|
* this page promises is what a visitor is actually shown. The admin panel is
|
|
* English-only, hence `en` directly.
|
|
*/
|
|
export default function HelpView() {
|
|
return (
|
|
<div className="settings-panel">
|
|
<div className="settings-section-header">
|
|
<h3>
|
|
<Icons.IconFileText size={18} /> Help
|
|
</h3>
|
|
<p className="settings-section-sub">
|
|
What your portfolio can do that has no button of its own.
|
|
</p>
|
|
</div>
|
|
|
|
<div className="settings-group">
|
|
<div className="settings-group-head">
|
|
<span className="settings-group-title">
|
|
<Icons.IconFilm size={13} />
|
|
Image viewer
|
|
</span>
|
|
<span className="settings-group-desc">
|
|
Keys a visitor can press in the lightbox. There is deliberately no toolbar for these — a
|
|
permanent control over a photograph costs every visitor something — but visitors can
|
|
call up the same list with <kbd className="help-kbd">?</kbd> or{' '}
|
|
<kbd className="help-kbd">H</kbd>.
|
|
</span>
|
|
</div>
|
|
|
|
<dl className="help-shortcuts">
|
|
{LIGHTBOX_SHORTCUTS.map((shortcut) => (
|
|
<div key={shortcut.labelKey} className="help-shortcuts-row">
|
|
<dt className="help-shortcuts-keys">
|
|
{shortcutDisplayKeys(shortcut).map((key) => (
|
|
<kbd key={key} className="help-kbd">
|
|
{key}
|
|
</kbd>
|
|
))}
|
|
</dt>
|
|
<dd className="help-shortcuts-label">
|
|
{en.lightbox[shortcut.labelKey]}
|
|
{shortcut.note && <span className="help-shortcuts-note">{shortcut.note}</span>}
|
|
</dd>
|
|
</div>
|
|
))}
|
|
</dl>
|
|
</div>
|
|
|
|
<div className="settings-group">
|
|
<div className="settings-group-head">
|
|
<span className="settings-group-title">
|
|
<Icons.IconShieldCheck size={13} />
|
|
Diagnostics
|
|
</span>
|
|
<span className="settings-group-desc">
|
|
Checks the things that fail silently — a wrong proxy hop count, a deleted album ID, a
|
|
plaintext password, an album Immich does not consider shared. Open it from the{' '}
|
|
<strong>Diagnostics</strong> tab in the top bar; the status badge next to it still gives
|
|
a quick read on whether anything needs attention right now.
|
|
</span>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
);
|
|
}
|