{Array.from({length: pageCount}, (_,pi) => (
{/* Page dots */}
{pageCount > 1 && (
{links.slice(pi*pageSize, (pi+1)*pageSize).map(l => )}
))}
{Array.from({length:pageCount}, (_,i) => (
);
}
function QuickLinkIcon({ l, onFolderClick, navigateTool }) {
const [imgOk, setImgOk] = useState(true);
const isTool = l.url?.startsWith('tool://');
const hasCustomIcon = l.icon && l.icon !== '๐';
const faviconUrl = (!hasCustomIcon && !l.isFolder && !isTool) ? (() => {
try { return `https://www.google.com/s2/favicons?sz=64&domain=${new URL(l.url).hostname}`; }
catch { return null; }
})() : null;
const showFavicon = !hasCustomIcon && !!faviconUrl && imgOk && !l.isFolder && !isTool;
const showCustomImg = hasCustomIcon && !l.isFolder && l.icon.startsWith('http');
const showEmoji = !showFavicon && !showCustomImg;
const emoji = l.isFolder ? (l.icon||'๐') : (hasCustomIcon ? l.icon : (isTool ? 'โก' : '๐'));
const content = (
<>
{showFavicon && scrollTo(i)} style={{
width: i===page ? 14 : 5, height:5, borderRadius:3, cursor:'pointer',
background: i===page ? '#4ecdc4' : 'rgba(255,255,255,0.2)',
transition:'all 0.2s',
}}/>
))}
)}
e.target===e.currentTarget&&onClose()}>
);
}
function QuickLinks({ toast, mobile, setActive, setDevToolsNav }) {
const [links, setLinks] = useState([]);
const [folderModal, setFolderModal] = useState(null);
const [editMode, setEditMode] = useState(false);
useEffect(() => { api('/dashboard/links').then(setLinks).catch(() => {}); }, []);
// Tool-Navigation fรผr tool://-Links
const navigateTool = (url) => {
if (!url?.startsWith('tool://')) return;
const withoutScheme = url.replace('tool://', '');
const [toolId, query] = withoutScheme.split('?');
const sub = query?.replace('sub=', '');
if (toolId === 'devtools' && sub && setDevToolsNav) {
setActive('devtools');
setDevToolsNav({ tool: sub, ts: Date.now() });
} else if (setActive) {
setActive(toolId);
}
};
const legacyItems = links.filter(l => l.item_type === 'quicklink' || !l.item_type);
const hasLegacy = legacyItems.length > 0;
const deleteLegacy = async id => {
try {
await api(`/dashboard/links/${id}`, { method:'DELETE' });
setLinks(p => p.filter(l => l.id !== id));
toast('Entfernt');
} catch(e) { toast(e.message,'error'); }
};
const allItems = links.map(l => l.item_type === 'folder'
? { ...l, id:`folder-${l.id}`, isFolder:true, icon:l.icon||'๐', title:l.name }
: l
);
return (
{mob&&}
{loading ?
{folder.icon} {folder.name}
โฆ
: links.length===0 ? Ordner ist leer
:
{links.map(l=>)}
}
{folderModal && setFolderModal(null)} navigateTool={navigateTool}/>}
{/* Edit-Modus: alte Quick-Links verwalten */}
{editMode && hasLegacy && (
)}
{allItems.length === 0
?
:
);
}
function TodoList({ toast }) {
const [items, setItems] = useState([]);
const [text, setText] = useState('');
const [isOpen, setIsOpen] = useState(false);
useEffect(() => { api('/dashboard/todos').then(setItems).catch(() => {}); }, []);
const add = async () => {
if (!text.trim()) return;
try { const n = await api('/dashboard/todos', { body:{ text:text.trim() } }); setItems(p => [...p, n]); setText(''); }
catch(e) { toast(e.message, 'error'); }
};
const toggle = async item => {
try { const u = await api(`/dashboard/todos/${item.id}`, { method:'PUT', body:{ done:!item.done } }); setItems(p => p.map(i => i.id===item.id ? u : i)); }
catch(e) { toast(e.message, 'error'); }
};
const del = async id => {
try { await api(`/dashboard/todos/${id}`, { method:'DELETE' }); setItems(p => p.filter(i => i.id!==id)); }
catch(e) { toast(e.message, 'error'); }
};
const open = items.filter(i => !i.done);
const done = items.filter(i => i.done);
return (
SCHNELLZUGRIFF
{hasLegacy && (
)}
รLTERE LINKS (aus Einstellungen) โ kรถnnen hier gelรถscht werden
{legacyItems.map(l=>(
{l.icon?.startsWith('http')
? 
: l.icon||'๐'}
))}
{l.title}
Neue Links รผber Linkliste โ โ Schnellzugriff verwalten
Links oder Ordner in der Linkliste mit โ Schnellzugriff aktivieren.
: mobile
?
{allItems.map(l => )}
}
{isOpen && <>
);
}
function Notepad({ toast }) {
const [content, setContent] = useState('');
const [saved, setSaved] = useState(true);
const [saveTime, setSaveTime] = useState(null);
const [isOpen, setIsOpen] = useState(false);
const tmr = useRef(null);
useEffect(() => {
api('/dashboard/note').then(d => { setContent(d.content || ''); setSaveTime(d.updated_at); }).catch(() => {});
}, []);
const change = val => {
setContent(val); setSaved(false); clearTimeout(tmr.current);
tmr.current = setTimeout(async () => {
try { const r = await api('/dashboard/note', { method:'PUT', body:{ content:val } }); setSaved(true); setSaveTime(r.updated_at); }
catch(e) { toast(e.message, 'error'); }
}, 900);
};
return (
setText(e.target.value)}
onKeyDown={e => e.key==='Enter' && add()}
style={{ ...S.inp, flex:1, fontSize:16 }} placeholder="Neue Aufgabeโฆ" />
{open.length === 0 && done.length === 0 && (
))}
{done.length > 0 && (
<>
}
Noch keine Aufgaben.
)}
{open.map(item => (
ERLEDIGT
{done.map(item => (
{item.text}
))}
)}
{isOpen &&
{saved ? (saveTime ? `โ ${new Date(saveTime).toLocaleTimeString('de-DE', { hour:'2-digit', minute:'2-digit' })}` : 'โ') : 'โฆ'}
}
{isOpen &&