refactor: simplify AdminApps page to config selector and compact app chips

- Rewrite AdminApps.tsx from ~560 to ~165 lines: status card, config list, UUID input, save/disconnect
- Remove legacy types and conversion functions from adminApps.ts (~370 lines)
- Connection.tsx: flex-wrap app chips, reduce padding and icon size for compact layout
This commit is contained in:
c0mrade
2026-02-05 14:56:41 +03:00
parent 53940a0169
commit 1d7b984880
3 changed files with 118 additions and 885 deletions

View File

@@ -526,7 +526,7 @@ export default function Connection() {
{/* App cards grid (2 cols mobile, row on desktop) */}
{currentPlatformApps.length > 0 && (
<div className="grid grid-cols-2 gap-2 sm:flex">
<div className="flex flex-wrap gap-2">
{currentPlatformApps.map((app, idx) => {
const isSelected = currentApp?.name === app.name;
const appIconSvg = getSvgHtml(app.svgIconKey);
@@ -534,7 +534,7 @@ export default function Connection() {
<button
key={app.name + idx}
onClick={() => setSelectedRemnawaveApp(app)}
className={`relative flex min-w-0 items-center gap-2 overflow-hidden rounded-xl px-4 py-3 text-sm font-medium transition-all active:scale-[0.97] sm:flex-1 ${
className={`relative flex min-w-[calc(50%-0.25rem)] items-center gap-2 overflow-hidden rounded-xl px-4 py-2 text-sm font-medium transition-all active:scale-[0.97] ${
isSelected
? 'bg-accent-500/15 text-accent-400 ring-1 ring-accent-500/40'
: 'border border-dark-700/50 bg-dark-800/80 text-dark-200 hover:border-dark-600/50 hover:bg-dark-700/80'
@@ -544,7 +544,7 @@ export default function Connection() {
<span className="relative z-10 truncate">{app.name}</span>
{appIconSvg && (
<div
className="ml-auto h-12 w-12 shrink-0 opacity-30 [&>svg]:h-full [&>svg]:w-full"
className="ml-auto h-7 w-7 shrink-0 opacity-30 [&>svg]:h-full [&>svg]:w-full"
dangerouslySetInnerHTML={{ __html: appIconSvg }}
/>
)}