From 7ddd60e59ba7702f74621a276855d2bb60b92d79 Mon Sep 17 00:00:00 2001 From: Claude Date: Sun, 18 Oct 2026 04:27:51 +0000 Subject: [PATCH] =?UTF-8?q?Workers=20P2:=20Seite=20/hustler=20(lazy),=20Me?= =?UTF-8?q?n=C3=BC=20=E2=80=9EHustler=E2=80=9C=20statt=20Leads,=20Stil=20u?= =?UTF-8?q?nd=20Schrift=20Pixelify=20Sans?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit Co-Authored-By: Claude Sonnet 5.5 --- public/fonts/OFL-PixelifySans.txt | 93 +++++++++++ public/fonts/PixelifySans-Variable.woff2 | Bin 0 -> 12016 bytes src/App.jsx | 15 +- src/lib/navLinks.js | 3 +- src/pages/WorkersPage.jsx | 40 +++++ src/styles/workers.css | 190 +++++++++++++++++++++++ tests/unit/navLinks.test.mjs | 7 +- tests/unit/workersCss.test.mjs | 14 ++ tests/unit/workersFont.test.mjs | 8 + tests/unit/workersRoute.test.mjs | 19 +++ 10 files changed, 382 insertions(+), 7 deletions(-) create mode 100644 public/fonts/OFL-PixelifySans.txt create mode 100644 public/fonts/PixelifySans-Variable.woff2 create mode 100644 src/pages/WorkersPage.jsx create mode 100644 src/styles/workers.css create mode 100644 tests/unit/workersCss.test.mjs create mode 100644 tests/unit/workersFont.test.mjs create mode 100644 tests/unit/workersRoute.test.mjs diff --git a/public/fonts/OFL-PixelifySans.txt b/public/fonts/OFL-PixelifySans.txt new file mode 100644 index 0000000..6aa5bfb --- /dev/null +++ b/public/fonts/OFL-PixelifySans.txt @@ -0,0 +1,93 @@ +Copyright 2021 The Pixelify Sans Project Authors (https://github.com/eifetx/Pixelify-Sans) + +This Font Software is licensed under the SIL Open Font License, Version 1.1. +This license is copied below, and is also available with a FAQ at: +https://scripts.sil.org/OFL + + +----------------------------------------------------------- +SIL OPEN FONT LICENSE Version 1.1 - 26 February 2007 +----------------------------------------------------------- + +PREAMBLE +The goals of the Open Font License (OFL) are to stimulate worldwide +development of collaborative font projects, to support the font creation +efforts of academic and linguistic communities, and to provide a free and +open framework in which fonts may be shared and improved in partnership +with others. + +The OFL allows the licensed fonts to be used, studied, modified and +redistributed freely as long as they are not sold by themselves. The +fonts, including any derivative works, can be bundled, embedded, +redistributed and/or sold with any software provided that any reserved +names are not used by derivative works. The fonts and derivatives, +however, cannot be released under any other type of license. The +requirement for fonts to remain under this license does not apply +to any document created using the fonts or their derivatives. + +DEFINITIONS +"Font Software" refers to the set of files released by the Copyright +Holder(s) under this license and clearly marked as such. This may +include source files, build scripts and documentation. + +"Reserved Font Name" refers to any names specified as such after the +copyright statement(s). + +"Original Version" refers to the collection of Font Software components as +distributed by the Copyright Holder(s). + +"Modified Version" refers to any derivative made by adding to, deleting, +or substituting -- in part or in whole -- any of the components of the +Original Version, by changing formats or by porting the Font Software to a +new environment. + +"Author" refers to any designer, engineer, programmer, technical +writer or other person who contributed to the Font Software. + +PERMISSION & CONDITIONS +Permission is hereby granted, free of charge, to any person obtaining +a copy of the Font Software, to use, study, copy, merge, embed, modify, +redistribute, and sell modified and unmodified copies of the Font +Software, subject to the following conditions: + +1) Neither the Font Software nor any of its individual components, +in Original or Modified Versions, may be sold by itself. + +2) Original or Modified Versions of the Font Software may be bundled, +redistributed and/or sold with any software, provided that each copy +contains the above copyright notice and this license. These can be +included either as stand-alone text files, human-readable headers or +in the appropriate machine-readable metadata fields within text or +binary files as long as those fields can be easily viewed by the user. + +3) No Modified Version of the Font Software may use the Reserved Font +Name(s) unless explicit written permission is granted by the corresponding +Copyright Holder. This restriction only applies to the primary font name as +presented to the users. + +4) The name(s) of the Copyright Holder(s) or the Author(s) of the Font +Software shall not be used to promote, endorse or advertise any +Modified Version, except to acknowledge the contribution(s) of the +Copyright Holder(s) and the Author(s) or with their explicit written +permission. + +5) The Font Software, modified or unmodified, in part or in whole, +must be distributed entirely under this license, and must not be +distributed under any other license. The requirement for fonts to +remain under this license does not apply to any document created +using the Font Software. + +TERMINATION +This license becomes null and void if any of the above conditions are +not met. + +DISCLAIMER +THE FONT SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, +EXPRESS OR IMPLIED, INCLUDING BUT NOT LIMITED TO ANY WARRANTIES OF +MERCHANTABILITY, FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT +OF COPYRIGHT, PATENT, TRADEMARK, OR OTHER RIGHT. IN NO EVENT SHALL THE +COPYRIGHT HOLDER BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER LIABILITY, +INCLUDING ANY GENERAL, SPECIAL, INDIRECT, INCIDENTAL, OR CONSEQUENTIAL +DAMAGES, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING +FROM, OUT OF THE USE OR INABILITY TO USE THE FONT SOFTWARE OR FROM +OTHER DEALINGS IN THE FONT SOFTWARE. diff --git a/public/fonts/PixelifySans-Variable.woff2 b/public/fonts/PixelifySans-Variable.woff2 new file mode 100644 index 0000000000000000000000000000000000000000..fe867e95ffd9845016373064c630e8ece25c5948 GIT binary patch literal 12016 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 Ou(YY`By#=`^8o;(5Z15& literal 0 HcmV?d00001 diff --git a/src/App.jsx b/src/App.jsx index 23fd9d1..839cd7c 100644 --- a/src/App.jsx +++ b/src/App.jsx @@ -1,4 +1,4 @@ -import { useCallback, useEffect, useState } from 'react' +import { lazy, Suspense, useCallback, useEffect, useState } from 'react' import { BrowserRouter, Routes, Route, Navigate, Link, useLocation } from 'react-router-dom' import { AuthProvider, useAuth } from './context/AuthContext' import Sidebar from './components/Navbar' @@ -25,6 +25,9 @@ import BankCallbackPage from './pages/BankCallbackPage' import AdminRoute from './components/AdminRoute' import { safeReturnPath } from './lib/returnPath' +// Hochhaus der Hustler: erst beim Öffnen laden, damit Engine und Schrift nicht im Haupt-Bundle liegen +const WorkersPage = lazy(() => import('./pages/WorkersPage')) + function ProtectedRoute({ children }) { const { user, loading } = useAuth() const location = useLocation() @@ -40,6 +43,12 @@ function ProtectedRoute({ children }) { return children } +// Alte Adressen /leads und /workers führen auf /hustler, die Query bleibt (/workers?tab=botleads&bot= wird /hustler?tab=botleads&bot=) +function HustlerRedirect() { + const { search } = useLocation() + return +} + function AppRoutes() { const { user } = useAuth() const location = useLocation() @@ -57,7 +66,9 @@ function AppRoutes() { } /> } /> } /> - } /> + Wird geladen …}>} /> + } /> + } /> {/* Finanzen: nur Admins, alle anderen gehen zu /tickets */} } /> } /> diff --git a/src/lib/navLinks.js b/src/lib/navLinks.js index a96c9c5..b7e30a6 100644 --- a/src/lib/navLinks.js +++ b/src/lib/navLinks.js @@ -19,8 +19,7 @@ export function buildNavLinks({ isAdmin, pulseLevel, counts = {} }) { { key: 'speicher', label: 'E-Mail-Speicher', href: '/customers/email-speicher', count: counts.storage ?? 0 }, ], }, - // Leads liegen auf Eis (Lead-Automatik gestoppt 2026-09-30): grau, nicht klickbar - { key: 'leads', label: 'Leads', href: '/leads', paused: true }, + { key: 'hustler', label: 'Hustler', href: '/hustler' }, ...(isAdmin ? [{ key: 'finance', label: 'Finanzen', href: '/finance', also: '/finanzen' }] : []), { key: 'legal', label: 'Rechtliches', href: '/rechtliches' }, ...(isAdmin ? [{ key: 'serverpuls', label: 'Serverpuls', href: '/serverpuls', dot: pulseLevel }] : []), diff --git a/src/pages/WorkersPage.jsx b/src/pages/WorkersPage.jsx new file mode 100644 index 0000000..26f6bfd --- /dev/null +++ b/src/pages/WorkersPage.jsx @@ -0,0 +1,40 @@ +import { useEffect } from 'react' +import { useSearchParams } from 'react-router-dom' +import { PageHeader, Tabs } from '../components/ui' +import WorkersBoard from '../components/workers/WorkersBoard' +import { useAuth } from '../context/AuthContext' +import { workersApi } from '../lib/workersClient' +import { pickTab } from '../lib/workersView' +import '../styles/workers.css' + +// Reiter der Seite. Später kommen freigabe (P3) und botleads (P6) dazu; die Reiterleiste erscheint erst ab zwei Reitern. +const WORKERS_TABS = [ + { id: 'hochhaus', label: 'Hochhaus' }, +] + +const api = workersApi + +// Seite „Hustler“ (Dateiname bleibt WorkersPage): Titel, Reiterwahl über ?tab= und der Inhalt des gewählten Reiters. +// Auth und Dienst-API kommen von hier; das Board selbst kennt weder Anmeldung noch Appwrite. +export default function WorkersPage() { + const { isAdmin } = useAuth() + const [params, setParams] = useSearchParams() + const active = pickTab(WORKERS_TABS, params.get('tab')) + + // Tab-Titel nur solange die Seite offen ist; beim Verlassen kommt der vorige Titel zurück + useEffect(() => { + const previous = document.title + document.title = 'Hustler' + return () => { document.title = previous } + }, []) + + return ( +
+ + {WORKERS_TABS.length > 1 && ( + setParams({ tab: id })} /> + )} + {active.id === 'hochhaus' && } +
+ ) +} diff --git a/src/styles/workers.css b/src/styles/workers.css new file mode 100644 index 0000000..d307fed --- /dev/null +++ b/src/styles/workers.css @@ -0,0 +1,190 @@ +/* Hustler (Workers P2): Hochhaus, Kennzahlen, Worker-Karte, Liste, Einstellungen. Weißes Theme: Haarlinien statt Karten, nur Tokens aus global.css. */ + +/* Schrift selbst gehostet (SIL OFL 1.1, Lizenztext liegt daneben), nur der Latin-Schnitt mit allen Gewichten */ +@font-face { + font-family: "Pixelify Sans"; + src: url("/fonts/PixelifySans-Variable.woff2") format("woff2"); + font-weight: 400 700; + font-style: normal; + font-display: swap; +} + +.wk-page .page-head h1 { font-family: "Pixelify Sans", var(--font); letter-spacing: 0; } + +/* ---------- Kopfzeile mit Pausenschalter ---------- */ + +.wk-toolbar { + display: flex; + align-items: center; + flex-wrap: wrap; + gap: 8px; + padding: 12px 0; + border-top: 1px solid var(--line); + border-bottom: 1px solid var(--line); + margin-bottom: 20px; +} +.wk-status { color: var(--text-2); } + +/* ---------- Kennzahlen ---------- */ + +.wk-kpis.stats { + display: grid; + grid-template-columns: repeat(6, minmax(0, 1fr)); + gap: 16px 32px; + margin: 0 0 24px; +} +.wk-kpis .stat { min-width: 0; font-variant-numeric: tabular-nums; } +.wk-kpis .stat .sub { min-height: 16px; } + +/* ---------- Hochhaus und Seitenspalte ---------- */ + +.wk-main { + display: grid; + grid-template-columns: minmax(0, 1fr) 320px; + gap: 32px; + align-items: start; +} +.wk-side { + min-width: 0; + padding-left: 24px; + border-left: 1px solid var(--line); +} + +.wk-stage { position: relative; min-width: 0; } +.wk-canvas { + display: block; + width: 100%; + aspect-ratio: 5 / 4; + image-rendering: pixelated; + cursor: pointer; + touch-action: pan-y; +} +.wk-zoom { + position: absolute; + top: 8px; + right: 8px; + display: flex; + gap: 4px; +} +.wk-zoom .btn { min-width: 32px; } + +/* ---------- Worker-Karte ---------- */ + +.wk-card { position: relative; padding-bottom: 20px; } +.wk-card > .btn-quiet { position: absolute; top: 0; right: 0; } +.wk-card h3 { margin: 20px 0 8px; font-size: 13px; line-height: 20px; font-weight: 600; color: var(--text-2); } +.wk-portrait { + display: block; + width: 72px; + height: 96px; + margin-bottom: 8px; + image-rendering: pixelated; +} +.wk-name { font-family: "Pixelify Sans", var(--font); font-size: 20px; line-height: 26px; font-weight: 600; overflow-wrap: anywhere; } +.wk-role { color: var(--text-2); margin-bottom: 8px; } +.wk-hint { color: var(--text-2); font-size: 13px; } + +.wk-chip { + display: inline-block; + margin-right: 8px; + padding: 0 6px; + border-radius: var(--radius); + font-size: 12px; + line-height: 20px; + font-weight: 500; + background: var(--grey-bg); + color: var(--grey-fg); +} +.wk-chip-opus { background: var(--orange-bg); color: var(--orange-fg); } +.wk-chip-sonnet { background: var(--blue-bg); color: var(--blue-fg); } +.wk-chip-haiku { background: var(--green-bg); color: var(--green-fg); } +.wk-chip-overseer { background: var(--violet-bg); color: var(--violet-fg); } + +.wk-facts, .wk-counters dl { margin: 12px 0 0; } +.wk-facts > div, .wk-counters dl > div { + display: flex; + justify-content: space-between; + gap: 12px; + padding: 6px 0; + border-top: 1px solid var(--line); + font-variant-numeric: tabular-nums; +} +.wk-facts dt, .wk-counters dt { color: var(--text-2); flex: none; } +.wk-facts dd, .wk-counters dd { text-align: right; min-width: 0; overflow-wrap: anywhere; } + +.wk-trace { list-style: none; margin: 0; padding: 0; } +.wk-trace li { padding: 6px 0; border-top: 1px solid var(--line); font-size: 13px; line-height: 18px; overflow-wrap: anywhere; } +.wk-trace-time { color: var(--text-3); font-variant-numeric: tabular-nums; } + +/* ---------- Liste aller Worker ---------- */ + +.wk-list { margin-top: 8px; border-top: 1px solid var(--line); } +.wk-list ul { list-style: none; margin: 0; padding: 0; } +.wk-list-floor { margin: 16px 0 4px; font-size: 12px; line-height: 16px; font-weight: 600; color: var(--text-3); } +.wk-list button { + display: grid; + grid-template-columns: 8px minmax(0, 1fr) auto; + align-items: center; + gap: 8px; + width: 100%; + min-height: 32px; + padding: 4px 8px; + border-radius: var(--radius); + text-align: left; + transition: background-color 0.12s; +} +.wk-list button:hover { background: var(--bg-hover); } +.wk-list button[aria-pressed="true"] { background: var(--accent-soft); font-weight: 600; } +.wk-list button > span:last-child { color: var(--text-2); font-size: 12px; font-weight: 400; } +.wk-list button:focus-visible { outline-offset: -2px; } + +.wk-dot { width: 8px; height: 8px; border-radius: 50%; background: var(--text-3); } +.wk-dot-arbeitet { background: var(--green-fg); } +.wk-dot-wartet { background: var(--nav-dot); } +.wk-dot-leerlauf { background: var(--text-3); } +.wk-dot-grau { background: transparent; box-shadow: inset 0 0 0 1.5px var(--line-strong); } +.wk-dot-fehler { background: var(--danger); } + +/* ---------- Einstellungen (Dialog) ---------- */ + +.wk-set-group { + display: flex; + flex-direction: column; + gap: 12px; + padding-top: 16px; + border-top: 1px solid var(--line); +} +.wk-set-title { font-size: 13px; line-height: 20px; font-weight: 600; color: var(--text-2); } +.wk-set-group .muted { font-size: 13px; } + +.wk-halt { + display: flex; + flex-direction: column; + align-items: flex-start; + gap: 8px; + padding: 12px 0; + border-top: 1px solid var(--danger); + border-bottom: 1px solid var(--danger); +} +.wk-halt .wk-set-title { color: var(--red-fg); } + +/* ---------- Schmale Bildschirme ---------- */ + +@media (max-width: 1100px) { + .wk-kpis.stats { grid-template-columns: repeat(3, minmax(0, 1fr)); } + .wk-main { grid-template-columns: minmax(0, 1fr); gap: 24px; } + .wk-side { padding-left: 0; border-left: 0; padding-top: 24px; border-top: 1px solid var(--line); } +} + +@media (max-width: 860px) { + .wk-kpis.stats { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 16px 24px; } + .wk-zoom { gap: 6px; } + .wk-zoom .btn { min-width: 36px; min-height: 36px; } + .wk-toolbar .btn { min-height: 36px; } +} + +/* ---------- Weniger Bewegung ---------- */ + +@media (prefers-reduced-motion: reduce) { + .wk-list button, .wk-zoom .btn, .wk-toolbar .btn { transition: none; } +} diff --git a/tests/unit/navLinks.test.mjs b/tests/unit/navLinks.test.mjs index b9a7d62..59c02ac 100644 --- a/tests/unit/navLinks.test.mjs +++ b/tests/unit/navLinks.test.mjs @@ -15,11 +15,12 @@ test('buildNavLinks: vier Unterpunkte unter Kunden mit Zahlen, Admin-Eintraege n ['angebote', 'Abo-Angebote', '/customers/angebote', undefined], ['speicher', 'E-Mail-Speicher', '/customers/email-speicher', 2], ]) - assert.deepEqual(links.map((l) => l.key), ['tickets', 'planboard', 'projects', 'services', 'customers', 'leads', 'legal']) - assert.equal(links.find((l) => l.key === 'leads').paused, true) + assert.deepEqual(links.map((l) => l.key), ['tickets', 'planboard', 'projects', 'services', 'customers', 'hustler', 'legal']) + assert.deepEqual(links.find((l) => l.key === 'hustler'), { key: 'hustler', label: 'Hustler', href: '/hustler' }) + assert.ok(!links.some((l) => l.key === 'leads' || l.key === 'workers')) assert.equal(kunden.children.find((c) => c.key === 'chat').hot, true) const admin = buildNavLinks({ isAdmin: true, pulseLevel: 'warn', counts: {} }) - assert.deepEqual(admin.map((l) => l.key), ['tickets', 'planboard', 'projects', 'services', 'customers', 'leads', 'finance', 'legal', 'serverpuls', 'admin']) + assert.deepEqual(admin.map((l) => l.key), ['tickets', 'planboard', 'projects', 'services', 'customers', 'hustler', 'finance', 'legal', 'serverpuls', 'admin']) assert.equal(admin.find((l) => l.key === 'serverpuls').dot, 'warn') assert.equal(admin.find((l) => l.key === 'finance').also, '/finanzen') assert.equal(admin.find((l) => l.key === 'customers').children[0].count, 0, 'ohne Zahl 0') diff --git a/tests/unit/workersCss.test.mjs b/tests/unit/workersCss.test.mjs new file mode 100644 index 0000000..4dbe4b8 --- /dev/null +++ b/tests/unit/workersCss.test.mjs @@ -0,0 +1,14 @@ +import test from 'node:test' +import assert from 'node:assert/strict' +import { readFileSync, readdirSync } from 'node:fs' + +test('workers.css: nur wk-Klassen, @font-face, keine Hex-Farben, reduzierte Bewegung', () => { + const css = readFileSync(new URL('../../src/styles/workers.css', import.meta.url), 'utf8').replace(/\/\*[\s\S]*?\*\//g, '') // Kommentare vorher entfernen + for (const m of css.matchAll(/([^{}]+)\{/g)) { const pre = m[1].trim(); if (pre.startsWith('@')) continue; for (const sel of pre.split(',')) assert.ok(sel.trim().startsWith('.wk-'), sel) } // jede Regel beginnt mit einer wk-Klasse (Nachfahren dürfen globale Klassen nutzen) + assert.match(css, /@font-face\s*\{[^}]*font-family:\s*"Pixelify Sans"[^}]*PixelifySans-Variable\.woff2[^}]*font-display:\s*swap/s); assert.doesNotMatch(css, /#[0-9a-fA-F]{3,8}\b/) + assert.match(css, /prefers-reduced-motion/); assert.match(css, /@media \(max-width: 1100px\)/); assert.match(css, /@media \(max-width: 860px\)/) +}) +test('jede im JSX verwendete wk-Klasse ist definiert', () => { + const css = readFileSync(new URL('../../src/styles/workers.css', import.meta.url), 'utf8'); const dir = new URL('../../src/components/workers/', import.meta.url) + for (const f of readdirSync(dir).filter((x) => x.endsWith('.jsx'))) for (const m of readFileSync(new URL(f, dir), 'utf8').matchAll(/(? { + const buf = readFileSync(new URL('../../public/fonts/PixelifySans-Variable.woff2', import.meta.url)); assert.equal(buf.subarray(0, 4).toString('latin1'), 'wOF2'); assert.ok(buf.length > 10000 && buf.length < 400000, String(buf.length)) + const lic = readFileSync(new URL('../../public/fonts/OFL-PixelifySans.txt', import.meta.url), 'utf8'); assert.match(lic, /SIL OPEN FONT LICENSE Version 1\.1/); assert.match(lic, /Pixelify Sans/) +}) diff --git a/tests/unit/workersRoute.test.mjs b/tests/unit/workersRoute.test.mjs new file mode 100644 index 0000000..5563b30 --- /dev/null +++ b/tests/unit/workersRoute.test.mjs @@ -0,0 +1,19 @@ +import test from 'node:test' +import assert from 'node:assert/strict' +import { readFileSync } from 'node:fs' + +// Die Seite und die Routen sind unter Node nicht ladbar (JSX, Router): geprüft wird der Quelltext (Muster workersComponents.test.mjs) +test('App: /hustler lazy hinter ProtectedRoute, /leads und /workers leiten mit erhaltener Query auf /hustler um, kein statischer Import', () => { + const s = readFileSync(new URL('../../src/App.jsx', import.meta.url), 'utf8') + assert.match(s, /const WorkersPage = lazy\(\(\) => import\('\.\/pages\/WorkersPage'\)\)/); assert.doesNotMatch(s, /import WorkersPage from/) + assert.match(s, /<\/Suspense><\/ProtectedRoute>\} \/>/) + assert.match(s, /\} \/>/); assert.match(s, /\} \/>/) + assert.match(s, /function HustlerRedirect\(\)[\s\S]*?useLocation\(\)[\s\S]*?/) // /workers?tab=botleads&bot=x → /hustler?tab=botleads&bot=x + assert.ok(s.indexOf('path="/hustler"') < s.indexOf('path="*"')); assert.ok(s.indexOf('path="/workers"') < s.indexOf('path="*"')) +}) +test('WorkersPage: Titel Hustler (H1 und Tab-Titel), Reiter hochhaus (kein Platzhalter), Reiterleiste erst ab zwei Reitern, api-Instanz, Admin-Weitergabe', () => { + const s = readFileSync(new URL('../../src/pages/WorkersPage.jsx', import.meta.url), 'utf8') + assert.match(s, /title="Hustler"/); assert.match(s, /document\.title = 'Hustler'/) + assert.match(s, /id: 'hochhaus'/); assert.doesNotMatch(s, /id: 'freigabe'/); assert.match(s, /WORKERS_TABS\.length > 1/) + assert.match(s, /const api = workersApi/); assert.match(s, /pickTab\(/); assert.match(s, /isAdmin=\{isAdmin\}/) +})