feat: způsob přihlášení a správa obchodů podle konfigurace serveru
CI / Generate TypeScript types (push) Successful in 12s
CI / Server unit tests (push) Successful in 26s
CI / Build server (push) Successful in 32s
CI / Build client (push) Successful in 41s
CI / Playwright E2E tests (push) Successful in 1m47s
CI / Build and push Docker image (push) Successful in 49s
CI / Notify (push) Successful in 2s

This commit is contained in:
2026-09-24 09:30:04 +02:00
parent 103445dba8
commit 5f54925808
10 changed files with 185 additions and 82 deletions
+2 -2
View File
@@ -5,8 +5,8 @@
- [ ] `easterEggRoutes.ts` — náhodně generované URL easter eggů jsou per-pod; URL funguje pouze na podu, který ji vygeneroval; zvážit deterministické seedy nebo sdílení přes Redis - [ ] `easterEggRoutes.ts` — náhodně generované URL easter eggů jsou per-pod; URL funguje pouze na podu, který ji vygeneroval; zvážit deterministické seedy nebo sdílení přes Redis
- [ ] `service.ts` — komplexní víceúrovňové funkce (`addChoice`, `removeChoiceIfPresent`) provádějí více po sobě jdoucích zápisů do stejného Redis klíče; pro plnou atomicitu je potřeba per-klíčový distribuovaný zámek (Redlock nebo `SET NX EX`) nebo sloučení logiky do jednoho `updateData` volání - [ ] `service.ts` — komplexní víceúrovňové funkce (`addChoice`, `removeChoiceIfPresent`) provádějí více po sobě jdoucích zápisů do stejného Redis klíče; pro plnou atomicitu je potřeba per-klíčový distribuovaný zámek (Redlock nebo `SET NX EX`) nebo sloučení logiky do jednoho `updateData` volání
- [ ] HTTP_REMOTE_TRUSTED_IPS se nikde nevalidují, hlavičky jsou přijímány odkudkoli - [ ] HTTP_REMOTE_TRUSTED_IPS se nikde nevalidují, hlavičky jsou přijímány odkudkoli
- [ ] V případě zapnutí přihlašování přes trusted headers nefunguje standardní přihlášení (nevrátí žádnou odpověď) - [X] V případě zapnutí přihlašování přes trusted headers nefunguje standardní přihlášení (nevrátí žádnou odpověď)
- [ ] Nemělo by se jít dostat na přihlašovací formulář (měla by tam být nanejvýš hláška nebo přesměrování) - [X] Nemělo by se jít dostat na přihlašovací formulář (měla by tam být nanejvýš hláška nebo přesměrování)
- [ ] Možnost úhrady celé útraty jednou osobou - [ ] Možnost úhrady celé útraty jednou osobou
- Základní myšlenka: jedna osoba uhradí celou útratu (v zájmu rychlosti odbavení), ostatním se automaticky vygeneruje QR kód, kterým následně uhradí svoji část útraty - Základní myšlenka: jedna osoba uhradí celou útratu (v zájmu rychlosti odbavení), ostatním se automaticky vygeneruje QR kód, kterým následně uhradí svoji část útraty
- Obecně to bude problém např. pokud si někdo objedná něco navíc (pití apod.) - Obecně to bude problém např. pokud si někdo objedná něco navíc (pití apod.)
+10
View File
@@ -87,3 +87,13 @@
font-weight: 600; font-weight: 600;
margin-top: 8px; margin-top: 8px;
} }
.login-card > .hint {
color: var(--luncher-text-muted);
}
.login-error {
color: var(--luncher-danger);
line-height: 1.5;
margin: 0;
}
+46 -14
View File
@@ -1,29 +1,37 @@
import React, { useCallback, useEffect, useRef } from 'react'; import React, { useCallback, useEffect, useRef, useState } from 'react';
import { Button } from 'react-bootstrap'; import { Button } from 'react-bootstrap';
import { useAuth } from './context/auth'; import { useAuth } from './context/auth';
import { login } from '../../types'; import { login } from '../../types';
import { useAppConfig } from './hooks/useGroupLimits';
import './Login.css'; import './Login.css';
/** /**
* Formulář pro prvotní zadání přihlašovacího jména. * Přihlášení. Podle konfigurace serveru buď přihlásí uživatele automaticky přes důvěryhodné
* hlavičky z proxy (bez formuláře), nebo zobrazí formulář pro zadání jména. Když se konfigurace
* nenačte, zkusí nejprve přihlášení „naprázdno" a jinak zobrazí formulář (původní chování).
*/ */
export default function Login() { export default function Login() {
const auth = useAuth(); const auth = useAuth();
const { loaded, trustedHeaders } = useAppConfig();
const loginRef = useRef<HTMLInputElement>(null); const loginRef = useRef<HTMLInputElement>(null);
const [trustedError, setTrustedError] = useState<string>();
const [attempt, setAttempt] = useState(0);
useEffect(() => { useEffect(() => {
if (auth && !auth.login) { if (!auth || auth.login || !loaded || trustedHeaders === false) return;
// Vyzkoušíme přihlášení "naprázdno", pokud projde, přihlásili nás trusted headers // Přihlášení přes hlavičky z proxy (případně pokus „naprázdno", pokud nevíme, jak server přihlašuje)
setTrustedError(undefined);
login().then(response => { login().then(response => {
const token = response.data; const token = response.data;
if (token) { if (token) {
auth?.setToken(token as unknown as string); // TODO vyřešit, API definice je špatně, je to skutečně string auth.setToken(token as unknown as string); // TODO vyřešit, API definice je špatně, je to skutečně string
} else if (trustedHeaders) {
setTrustedError((response.error as any)?.error ?? 'Přihlášení přes proxy se nezdařilo.');
} }
}).catch(error => { }).catch(() => {
// nezajímá nás if (trustedHeaders) setTrustedError('Server je nedostupný. Zkuste to prosím za chvíli.');
}); });
} }, [auth, loaded, trustedHeaders, attempt]);
}, [auth]);
const doLogin = useCallback(async () => { const doLogin = useCallback(async () => {
const length = loginRef?.current?.value.length && loginRef.current.value.replaceAll(/\s/g, '').length const length = loginRef?.current?.value.length && loginRef.current.value.replaceAll(/\s/g, '').length
@@ -35,12 +43,38 @@ export default function Login() {
} }
}, [auth]); }, [auth]);
if (!auth?.login) { if (auth?.login) {
return <div>Neplatný stav</div>
}
const header = <>
<h1 className='login-logo'>Luncher</h1>
<p className='login-subtitle'>Aplikace pro profesionální management obědů</p>
</>;
// Přihlašuje proxy — formulář se jménem nedává smysl
if (!loaded || trustedHeaders) {
return ( return (
<div className='login-page'> <div className='login-page'>
<div className='login-card'> <div className='login-card'>
<h1 className='login-logo'>Luncher</h1> {header}
<p className='login-subtitle'>Aplikace pro profesionální management obědů</p> {trustedError ? (
<div className='login-form'>
<p className='login-error'>{trustedError}</p>
<Button onClick={() => setAttempt(a => a + 1)}>Zkusit znovu</Button>
</div>
) : (
<p className='hint'>Přihlašuji…</p>
)}
</div>
</div>
);
}
return (
<div className='login-page'>
<div className='login-card'>
{header}
<div className='login-form'> <div className='login-form'>
<div> <div>
<label htmlFor="login-input">Zobrazované jméno</label> <label htmlFor="login-input">Zobrazované jméno</label>
@@ -66,5 +100,3 @@ export default function Login() {
</div> </div>
); );
} }
return <div>Neplatný stav</div>
}
@@ -6,6 +6,7 @@ import { faArrowsRotate, faPen, faPlus, faUpRightFromSquare, faXmark } from "@fo
import { addStore, deleteStore, updateStore, getStoreMenuStatus, refreshStoreMenu, Store, StoreMenuProvider, StoreScrapeInfo, StoreScrapeStatus } from "../../../../types"; import { addStore, deleteStore, updateStore, getStoreMenuStatus, refreshStoreMenu, Store, StoreMenuProvider, StoreScrapeInfo, StoreScrapeStatus } from "../../../../types";
import { getHumanDateTime } from "../../Utils"; import { getHumanDateTime } from "../../Utils";
import PriceHistory from "../PriceHistory"; import PriceHistory from "../PriceHistory";
import { useAppConfig } from "../../hooks/useGroupLimits";
import { getStoreUrls, storeUrlLabel } from "../../utils/storeUrls"; import { getStoreUrls, storeUrlLabel } from "../../utils/storeUrls";
type Props = { type Props = {
@@ -52,6 +53,9 @@ export default function StoreAdminModal({ isOpen, onClose, stores, onStoresChang
const [heslo, setHeslo] = useState(''); const [heslo, setHeslo] = useState('');
const [loading, setLoading] = useState(false); const [loading, setLoading] = useState(false);
const [error, setError] = useState<string | null>(null); const [error, setError] = useState<string | null>(null);
// Server bez admin hesla — správa (přidání/úprava/odebrání/obnovení) nejde, zbývá jen přehled.
// undefined = konfigurace nenačtena, chováme se jako dřív (správa zapnutá).
const adminEnabled = useAppConfig().storeAdmin !== false;
const [scrapeInfo, setScrapeInfo] = useState<Record<string, StoreScrapeInfo>>({}); const [scrapeInfo, setScrapeInfo] = useState<Record<string, StoreScrapeInfo>>({});
const [refreshing, setRefreshing] = useState<string | null>(null); const [refreshing, setRefreshing] = useState<string | null>(null);
// Rozbalená historie cen („obchod|služba") // Rozbalená historie cen („obchod|služba")
@@ -209,6 +213,14 @@ export default function StoreAdminModal({ isOpen, onClose, stores, onStoresChang
</Alert> </Alert>
)} )}
{!adminEnabled && (
<Alert variant="info">
Správa obchodů není na tomto serveru zapnutá (chybí <code>ADMIN_PASSWORD</code>).
Seznam obchodů, stav nabídek a historii cen lze jen prohlížet.
</Alert>
)}
{adminEnabled && <>
<Form.Group className="mb-3"> <Form.Group className="mb-3">
<Form.Label>Admin heslo</Form.Label> <Form.Label>Admin heslo</Form.Label>
<Form.Control <Form.Control
@@ -239,6 +251,7 @@ export default function StoreAdminModal({ isOpen, onClose, stores, onStoresChang
Přidat Přidat
</Button> </Button>
</div> </div>
</>}
<h6>Aktuální seznam</h6> <h6>Aktuální seznam</h6>
{stores.length === 0 ? ( {stores.length === 0 ? (
@@ -307,7 +320,7 @@ export default function StoreAdminModal({ isOpen, onClose, stores, onStoresChang
<span className="text-nowrap text-muted">Menu {PROVIDER_LABELS[p.provider]}:</span> <span className="text-nowrap text-muted">Menu {PROVIDER_LABELS[p.provider]}:</span>
<span className={className} title={title}>{text}</span> <span className={className} title={title}>{text}</span>
{/* Zakázané tlačítko nezobrazí tooltip — obalení do span ho zobrazí i bez hesla */} {/* Zakázané tlačítko nezobrazí tooltip — obalení do span ho zobrazí i bez hesla */}
<OverlayTrigger {adminEnabled && <OverlayTrigger
placement="top" placement="top"
overlay={ overlay={
<Tooltip> <Tooltip>
@@ -330,7 +343,7 @@ export default function StoreAdminModal({ isOpen, onClose, stores, onStoresChang
<FontAwesomeIcon icon={faArrowsRotate} spin={refreshing === key} /> <FontAwesomeIcon icon={faArrowsRotate} spin={refreshing === key} />
</Button> </Button>
</span> </span>
</OverlayTrigger> </OverlayTrigger>}
{p.dishCount > 0 && ( {p.dishCount > 0 && (
<Button variant="link" size="sm" className="p-0 text-nowrap" <Button variant="link" size="sm" className="p-0 text-nowrap"
onClick={() => setHistoryOpen(historyOpen === key ? null : key)}> onClick={() => setHistoryOpen(historyOpen === key ? null : key)}>
@@ -343,7 +356,7 @@ export default function StoreAdminModal({ isOpen, onClose, stores, onStoresChang
); );
})} })}
</div> </div>
<div className="d-flex gap-3"> {adminEnabled && <div className="d-flex gap-3">
<FontAwesomeIcon <FontAwesomeIcon
icon={faPen} icon={faPen}
className="action-icon" className="action-icon"
@@ -358,7 +371,7 @@ export default function StoreAdminModal({ isOpen, onClose, stores, onStoresChang
onClick={() => handleRemove(s.name)} onClick={() => handleRemove(s.name)}
style={{ cursor: 'pointer' }} style={{ cursor: 'pointer' }}
/> />
</div> </div>}
</ListGroup.Item> </ListGroup.Item>
); );
})} })}
+7 -2
View File
@@ -1,7 +1,12 @@
import { useSyncExternalStore } from "react"; import { useSyncExternalStore } from "react";
import { getGroupLimits, subscribeGroupLimits } from "../utils/appConfig"; import { getAppConfig, getGroupLimits, subscribeAppConfig } from "../utils/appConfig";
/** Aktuální limity skupinových objednávek (překreslí se po načtení konfigurace ze serveru). */ /** Aktuální limity skupinových objednávek (překreslí se po načtení konfigurace ze serveru). */
export function useGroupLimits() { export function useGroupLimits() {
return useSyncExternalStore(subscribeGroupLimits, getGroupLimits); return useSyncExternalStore(subscribeAppConfig, getGroupLimits);
}
/** Celá runtime konfigurace ze serveru (způsob přihlášení, zapnuté funkce, limity). */
export function useAppConfig() {
return useSyncExternalStore(subscribeAppConfig, getAppConfig);
} }
+11 -3
View File
@@ -10,7 +10,7 @@ import { getConfig } from '../../types/gen/sdk.gen';
import { getToken } from './Utils'; import { getToken } from './Utils';
import { toast } from 'react-toastify'; import { toast } from 'react-toastify';
import * as Sentry from '@sentry/react'; import * as Sentry from '@sentry/react';
import { setGroupLimits } from './utils/appConfig'; import { setAppConfig } from './utils/appConfig';
client.setConfig({ client.setConfig({
auth: () => getToken(), auth: () => getToken(),
@@ -20,14 +20,22 @@ client.setConfig({
// Sentry se inicializuje až podle runtime konfigurace ze serveru (bez DSN zůstává vypnuté). // Sentry se inicializuje až podle runtime konfigurace ze serveru (bez DSN zůstává vypnuté).
// Klient je statický build, takže DSN ani limity nejde zapéct při buildu — server je zná z env. // Klient je statický build, takže DSN ani limity nejde zapéct při buildu — server je zná z env.
getConfig().then(({ data }) => { getConfig().then(({ data }) => {
setGroupLimits(data?.limits?.group); setAppConfig({
loaded: true,
trustedHeaders: data?.auth?.trustedHeaders,
storeAdmin: data?.features?.storeAdmin,
groupLimits: data?.limits?.group,
});
if (data?.sentry.dsn) { if (data?.sentry.dsn) {
Sentry.init({ Sentry.init({
dsn: data.sentry.dsn, dsn: data.sentry.dsn,
environment: data.sentry.environment, environment: data.sentry.environment,
}); });
} }
}).catch(() => { /* config endpoint nedostupný — běžíme bez Sentry */ }); }).catch(() => {
// Config endpoint nedostupný — běžíme bez Sentry, s výchozími limity a původním chováním přihlášení
setAppConfig({ loaded: true });
});
// Interceptor na vyhození toasteru při chybě // Interceptor na vyhození toasteru při chybě
client.interceptors.response.use(async response => { client.interceptors.response.use(async response => {
+29 -10
View File
@@ -1,8 +1,8 @@
import type { GroupLimits } from "../../../types"; import type { GroupLimits } from "../../../types";
/** /**
* Runtime konfigurace ze serveru (GET /api/config). Do načtení (nebo když endpoint * Výchozí limity skupinových objednávek — stejné jako výchozí hodnoty na serveru
* neodpoví) platí výchozí hodnoty — stejné jako výchozí hodnoty na serveru (server/src/limits.ts). * (server/src/limits.ts). Platí do načtení konfigurace nebo když endpoint neodpoví.
*/ */
export const DEFAULT_GROUP_LIMITS: GroupLimits = { export const DEFAULT_GROUP_LIMITS: GroupLimits = {
maxNoteLength: 300, maxNoteLength: 300,
@@ -14,21 +14,40 @@ export const DEFAULT_GROUP_LIMITS: GroupLimits = {
maxItems: 20, maxItems: 20,
}; };
let groupLimits: GroupLimits = DEFAULT_GROUP_LIMITS; /** Runtime konfigurace ze serveru (GET /api/config). */
export type AppRuntimeConfig = {
/** Pokus o načtení konfigurace skončil (úspěšně i neúspěšně) */
loaded: boolean,
/** Přihlášení přes důvěryhodné hlavičky z proxy; undefined = nevíme (konfigurace se nenačetla) */
trustedHeaders?: boolean,
/** Správa obchodů je zapnutá (server má admin heslo); undefined = nevíme */
storeAdmin?: boolean,
groupLimits: GroupLimits,
};
let config: AppRuntimeConfig = { loaded: false, groupLimits: DEFAULT_GROUP_LIMITS };
const listeners = new Set<() => void>(); const listeners = new Set<() => void>();
export function getGroupLimits(): GroupLimits { export function getAppConfig(): AppRuntimeConfig {
return groupLimits; return config;
} }
/** Nastaví limity ze serveru (chybějící hodnoty doplní výchozími) a upozorní odběratele. */ export function getGroupLimits(): GroupLimits {
export function setGroupLimits(limits: Partial<GroupLimits> | undefined): void { return config.groupLimits;
if (!limits) return; }
groupLimits = { ...DEFAULT_GROUP_LIMITS, ...limits };
/** Uloží konfiguraci ze serveru (chybějící limity doplní výchozími) a upozorní odběratele. */
export function setAppConfig(patch: Partial<Omit<AppRuntimeConfig, 'groupLimits'>> & { groupLimits?: Partial<GroupLimits> }): void {
const { groupLimits, ...rest } = patch;
config = {
...config,
...rest,
groupLimits: groupLimits ? { ...DEFAULT_GROUP_LIMITS, ...groupLimits } : config.groupLimits,
};
listeners.forEach(l => l()); listeners.forEach(l => l());
} }
export function subscribeGroupLimits(listener: () => void): () => void { export function subscribeAppConfig(listener: () => void): () => void {
listeners.add(listener); listeners.add(listener);
return () => listeners.delete(listener); return () => listeners.delete(listener);
} }
+15 -20
View File
@@ -1,36 +1,31 @@
import { test, expect } from '@playwright/test'; import { test, expect } from '@playwright/test';
// Tento test záměrně NEPOUŽÍVÁ trusted-header – testuje reálný login formulář. // Tento soubor záměrně NEPOUŽÍVÁ výchozí trusted-header — testuje chování přihlašovací stránky.
test.use({ extraHTTPHeaders: {} }); test.use({ extraHTTPHeaders: {} });
test('uživatel se přihlásí formulářem a uvidí obsah aplikace', async ({ page }) => { test('při přihlášení přes proxy se formulář nezobrazí — bez hlavičky hláška, opakování s hlavičkou přihlásí', async ({ page }) => {
// Server běží s HTTP_REMOTE_USER_ENABLED=true, takže POST /api/login vždy vyžaduje // Server běží s HTTP_REMOTE_USER_ENABLED=true (přihlašuje proxy), takže formulář se jménem
// hlavičku remote-user. Zachytíme požadavky z formuláře (mají tělo s polem login) // nemá smysl. Bez hlavičky remote-user se zobrazí hláška s tlačítkem „Zkusit znovu".
// a přidáme hlavičku; požadavek auto-loginu (bez těla) projde bez hlavičky a selže, let sendHeader = false;
// čímž formulář zůstane viditelný.
await page.route('**/api/login', async (route) => { await page.route('**/api/login', async (route) => {
const body = route.request().postData();
let login: string | undefined;
try { login = body ? JSON.parse(body)?.login : undefined; } catch {}
await route.continue({ await route.continue({
headers: login headers: sendHeader
? { ...route.request().headers(), 'remote-user': login } ? { ...route.request().headers(), 'remote-user': 'testuser' }
: route.request().headers(), : route.request().headers(),
}); });
}); });
await page.goto('/'); await page.goto('/');
// Formulář musí být viditelný – auto-login selhal (nepřišla hlavička) const retry = page.getByRole('button', { name: 'Zkusit znovu' });
const loginInput = page.locator('#login-input'); await expect(retry).toBeVisible({ timeout: 10_000 });
await expect(loginInput).toBeVisible({ timeout: 10_000 }); await expect(page.getByText('Přihlášení probíhá přes firemní přihlášení (proxy)')).toBeVisible();
await expect(page.locator('#login-input')).toHaveCount(0);
// Vyplnění loginu a odeslání Enterem // Proxy teď identitu pošle — opakování přihlásí
await loginInput.fill('testuser'); sendHeader = true;
await loginInput.press('Enter'); await retry.click();
await expect(retry).not.toBeVisible({ timeout: 10_000 });
// Po přihlášení musí zmizet login formulář
await expect(loginInput).not.toBeVisible({ timeout: 10_000 });
// JWT musí být uloženo v localStorage jako 3-dílný token // JWT musí být uloženo v localStorage jako 3-dílný token
const token = await page.evaluate(() => localStorage.getItem('token')); const token = await page.evaluate(() => localStorage.getItem('token'));
+8 -1
View File
@@ -140,6 +140,12 @@ app.get("/api/config", (_req, res) => {
limits: { limits: {
group: getGroupLimits(), group: getGroupLimits(),
}, },
auth: {
trustedHeaders: HTTP_REMOTE_USER_ENABLED,
},
features: {
storeAdmin: !!process.env.ADMIN_PASSWORD,
},
}); });
}); });
@@ -160,7 +166,8 @@ app.post("/api/login", (req, res) => {
if (remoteUser && remoteUser.length > 0) { if (remoteUser && remoteUser.length > 0) {
res.status(200).json(generateToken(Buffer.from(remoteUser, 'latin1').toString(), true)); res.status(200).json(generateToken(Buffer.from(remoteUser, 'latin1').toString(), true));
} else { } else {
throw new Error("Je zapnuto přihlášení přes hlavičky, ale nepřišla hlavička nebo ??"); // Přihlašuje proxy (trusted headers) — bez hlavičky nejde o chybu serveru, ale o nepřihlášeného uživatele
res.status(401).json({ error: 'Přihlášení probíhá přes firemní přihlášení (proxy), ale nepřišla identita uživatele. Zkuste stránku obnovit nebo se přihlásit znovu.' });
} }
} else { } else {
if (!req.body?.login || req.body.login.trim().length === 0) { if (!req.body?.login || req.body.login.trim().length === 0) {
+16 -2
View File
@@ -1,6 +1,6 @@
get: get:
operationId: getConfig operationId: getConfig
summary: Vrátí veřejnou runtime konfiguraci pro klienta (např. Sentry DSN, limity objednávek). Nevyžaduje autentizaci. summary: Vrátí veřejnou runtime konfiguraci pro klienta (Sentry DSN, limity objednávek, způsob přihlášení, zapnuté funkce). Nevyžaduje autentizaci.
security: [] # Nevyžaduje autentizaci security: [] # Nevyžaduje autentizaci
responses: responses:
"200": "200":
@@ -9,8 +9,22 @@ get:
application/json: application/json:
schema: schema:
type: object type: object
required: [sentry, limits] required: [sentry, limits, auth, features]
properties: properties:
auth:
type: object
required: [trustedHeaders]
properties:
trustedHeaders:
type: boolean
description: Přihlášení probíhá přes důvěryhodné hlavičky z proxy (HTTP_REMOTE_USER_ENABLED) — klient nezobrazuje formulář se jménem
features:
type: object
required: [storeAdmin]
properties:
storeAdmin:
type: boolean
description: Správa obchodů je zapnutá (server má nastavené ADMIN_PASSWORD)
limits: limits:
type: object type: object
required: [group] required: [group]