mirror of
https://github.com/Memo-2023/mana-monorepo.git
synced 2026-05-15 02:41:09 +02:00
🎨 style(matrix): fix RoomSettingsPanel styling to match app theme
Replace DaisyUI classes with the custom glassmorphic theme: - Use bg-white/80 dark:bg-black/80 with backdrop-blur - Use border-black/10 dark:border-white/10 for borders - Use text-foreground and text-muted-foreground for text - Add gradient avatars matching rest of app - Fix tab styling with proper active states Co-Authored-By: Claude Opus 4.5 <noreply@anthropic.com>
This commit is contained in:
Till-JS
parent
52f88af4c5
commit
ea0bf67f0d
6 changed files with 437 additions and 102 deletions
78
apps/lightwrite/apps/backend/Dockerfile
Normal file
78
apps/lightwrite/apps/backend/Dockerfile
Normal file
|
|
@ -0,0 +1,78 @@
|
|||
# Build stage
|
||||
FROM node:20-alpine AS builder
|
||||
|
||||
# Install pnpm
|
||||
RUN corepack enable && corepack prepare pnpm@9.15.0 --activate
|
||||
|
||||
WORKDIR /app
|
||||
|
||||
# Copy root workspace files
|
||||
COPY pnpm-workspace.yaml ./
|
||||
COPY package.json ./
|
||||
COPY pnpm-lock.yaml ./
|
||||
|
||||
# Copy shared packages
|
||||
COPY packages/shared-drizzle-config ./packages/shared-drizzle-config
|
||||
COPY packages/shared-errors ./packages/shared-errors
|
||||
COPY packages/shared-nestjs-auth ./packages/shared-nestjs-auth
|
||||
COPY packages/shared-nestjs-health ./packages/shared-nestjs-health
|
||||
COPY packages/shared-storage ./packages/shared-storage
|
||||
COPY packages/shared-tsconfig ./packages/shared-tsconfig
|
||||
|
||||
# Copy lightwrite packages
|
||||
COPY apps/lightwrite/packages ./apps/lightwrite/packages
|
||||
COPY apps/lightwrite/apps/backend ./apps/lightwrite/apps/backend
|
||||
|
||||
# Install dependencies
|
||||
RUN pnpm install --frozen-lockfile --ignore-scripts
|
||||
|
||||
# Build shared packages
|
||||
WORKDIR /app/packages/shared-errors
|
||||
RUN pnpm build
|
||||
|
||||
WORKDIR /app/packages/shared-nestjs-auth
|
||||
RUN pnpm build
|
||||
|
||||
WORKDIR /app/packages/shared-nestjs-health
|
||||
RUN pnpm build
|
||||
|
||||
WORKDIR /app/packages/shared-storage
|
||||
RUN pnpm build
|
||||
|
||||
# Build the backend
|
||||
WORKDIR /app/apps/lightwrite/apps/backend
|
||||
RUN pnpm build
|
||||
|
||||
# Production stage
|
||||
FROM node:20-alpine AS production
|
||||
|
||||
# Install pnpm and postgresql-client
|
||||
RUN corepack enable && corepack prepare pnpm@9.15.0 --activate \
|
||||
&& apk add --no-cache postgresql-client
|
||||
|
||||
WORKDIR /app
|
||||
|
||||
# Copy everything from builder
|
||||
COPY --from=builder /app/pnpm-workspace.yaml ./
|
||||
COPY --from=builder /app/package.json ./
|
||||
COPY --from=builder /app/pnpm-lock.yaml ./
|
||||
COPY --from=builder /app/node_modules ./node_modules
|
||||
COPY --from=builder /app/packages ./packages
|
||||
COPY --from=builder /app/apps/lightwrite ./apps/lightwrite
|
||||
|
||||
# Copy entrypoint script
|
||||
COPY apps/lightwrite/apps/backend/docker-entrypoint.sh /usr/local/bin/
|
||||
RUN chmod +x /usr/local/bin/docker-entrypoint.sh
|
||||
|
||||
WORKDIR /app/apps/lightwrite/apps/backend
|
||||
|
||||
# Expose port
|
||||
EXPOSE 3010
|
||||
|
||||
# Health check
|
||||
HEALTHCHECK --interval=30s --timeout=10s --start-period=5s --retries=3 \
|
||||
CMD wget --no-verbose --tries=1 --spider http://localhost:3010/health || exit 1
|
||||
|
||||
# Run entrypoint script
|
||||
ENTRYPOINT ["docker-entrypoint.sh"]
|
||||
CMD ["node", "dist/main.js"]
|
||||
46
apps/lightwrite/apps/backend/docker-entrypoint.sh
Normal file
46
apps/lightwrite/apps/backend/docker-entrypoint.sh
Normal file
|
|
@ -0,0 +1,46 @@
|
|||
#!/bin/sh
|
||||
set -e
|
||||
|
||||
echo "=========================================="
|
||||
echo " LightWrite Backend Startup"
|
||||
echo "=========================================="
|
||||
echo "Environment: ${NODE_ENV:-development}"
|
||||
echo "Port: ${PORT:-3010}"
|
||||
|
||||
# Wait for database to be ready
|
||||
if [ -n "$DATABASE_URL" ]; then
|
||||
echo "Waiting for database..."
|
||||
|
||||
# Extract host and port from DATABASE_URL
|
||||
DB_HOST=$(echo $DATABASE_URL | sed -n 's/.*@\([^:]*\):.*/\1/p')
|
||||
DB_PORT=$(echo $DATABASE_URL | sed -n 's/.*:\([0-9]*\)\/.*/\1/p')
|
||||
|
||||
# Default port if not found
|
||||
DB_PORT=${DB_PORT:-5432}
|
||||
|
||||
# Wait for database to accept connections
|
||||
max_attempts=30
|
||||
attempt=1
|
||||
while [ $attempt -le $max_attempts ]; do
|
||||
if pg_isready -h "$DB_HOST" -p "$DB_PORT" > /dev/null 2>&1; then
|
||||
echo "Database is ready!"
|
||||
break
|
||||
fi
|
||||
echo "Waiting for database... (attempt $attempt/$max_attempts)"
|
||||
sleep 2
|
||||
attempt=$((attempt + 1))
|
||||
done
|
||||
|
||||
if [ $attempt -gt $max_attempts ]; then
|
||||
echo "Warning: Could not connect to database after $max_attempts attempts"
|
||||
fi
|
||||
fi
|
||||
|
||||
# Push database schema (safe for production - only adds missing tables/columns)
|
||||
if [ "$RUN_DB_PUSH" = "true" ]; then
|
||||
echo "Pushing database schema..."
|
||||
npx drizzle-kit push --force || echo "Warning: db:push failed, continuing anyway..."
|
||||
fi
|
||||
|
||||
echo "Starting application..."
|
||||
exec "$@"
|
||||
93
apps/lightwrite/apps/web/Dockerfile
Normal file
93
apps/lightwrite/apps/web/Dockerfile
Normal file
|
|
@ -0,0 +1,93 @@
|
|||
# Build stage
|
||||
FROM node:20-alpine AS builder
|
||||
|
||||
# Build arguments for SvelteKit static env vars
|
||||
ARG PUBLIC_MANA_CORE_AUTH_URL=http://mana-auth:3001
|
||||
ARG PUBLIC_BACKEND_URL=http://lightwrite-backend:3010
|
||||
|
||||
# Set as environment variables for build
|
||||
ENV PUBLIC_MANA_CORE_AUTH_URL=$PUBLIC_MANA_CORE_AUTH_URL
|
||||
ENV PUBLIC_BACKEND_URL=$PUBLIC_BACKEND_URL
|
||||
|
||||
# Install pnpm
|
||||
RUN corepack enable && corepack prepare pnpm@9.15.0 --activate
|
||||
|
||||
WORKDIR /app
|
||||
|
||||
# Copy root workspace files
|
||||
COPY pnpm-workspace.yaml ./
|
||||
COPY package.json ./
|
||||
COPY pnpm-lock.yaml ./
|
||||
|
||||
# Copy shared packages needed by lightwrite web
|
||||
COPY packages/shared-auth ./packages/shared-auth
|
||||
COPY packages/shared-auth-ui ./packages/shared-auth-ui
|
||||
COPY packages/shared-branding ./packages/shared-branding
|
||||
COPY packages/shared-config ./packages/shared-config
|
||||
COPY packages/shared-i18n ./packages/shared-i18n
|
||||
COPY packages/shared-icons ./packages/shared-icons
|
||||
COPY packages/shared-stores ./packages/shared-stores
|
||||
COPY packages/shared-tailwind ./packages/shared-tailwind
|
||||
COPY packages/shared-theme ./packages/shared-theme
|
||||
COPY packages/shared-theme-ui ./packages/shared-theme-ui
|
||||
COPY packages/shared-types ./packages/shared-types
|
||||
COPY packages/shared-ui ./packages/shared-ui
|
||||
COPY packages/shared-utils ./packages/shared-utils
|
||||
COPY packages/shared-vite-config ./packages/shared-vite-config
|
||||
|
||||
# Copy lightwrite shared package
|
||||
COPY apps/lightwrite/packages ./apps/lightwrite/packages
|
||||
|
||||
# Copy lightwrite web
|
||||
COPY apps/lightwrite/apps/web ./apps/lightwrite/apps/web
|
||||
|
||||
# Install dependencies
|
||||
RUN pnpm install --frozen-lockfile
|
||||
|
||||
# Build shared packages that need building
|
||||
WORKDIR /app/packages/shared-vite-config
|
||||
RUN pnpm build
|
||||
|
||||
WORKDIR /app/packages/shared-auth
|
||||
RUN pnpm build || true
|
||||
|
||||
# Build the web app
|
||||
WORKDIR /app/apps/lightwrite/apps/web
|
||||
RUN pnpm exec svelte-kit sync
|
||||
RUN pnpm build
|
||||
|
||||
# Production stage
|
||||
FROM node:20-alpine AS production
|
||||
|
||||
# Keep same directory structure as builder so pnpm symlinks resolve correctly
|
||||
WORKDIR /app/apps/lightwrite/apps/web
|
||||
|
||||
# Copy the pnpm store that symlinks point to
|
||||
COPY --from=builder /app/node_modules/.pnpm /app/node_modules/.pnpm
|
||||
|
||||
# Copy the app's node_modules
|
||||
COPY --from=builder /app/apps/lightwrite/apps/web/node_modules ./node_modules
|
||||
|
||||
# Copy built application
|
||||
COPY --from=builder /app/apps/lightwrite/apps/web/build ./build
|
||||
COPY --from=builder /app/apps/lightwrite/apps/web/package.json ./
|
||||
|
||||
# Copy entrypoint script
|
||||
COPY apps/lightwrite/apps/web/docker-entrypoint.sh /docker-entrypoint.sh
|
||||
RUN chmod +x /docker-entrypoint.sh
|
||||
|
||||
# Expose port
|
||||
EXPOSE 5180
|
||||
|
||||
# Set environment variables
|
||||
ENV NODE_ENV=production
|
||||
ENV PORT=5180
|
||||
ENV HOST=0.0.0.0
|
||||
|
||||
# Health check
|
||||
HEALTHCHECK --interval=30s --timeout=10s --start-period=5s --retries=3 \
|
||||
CMD wget --no-verbose --tries=1 --spider http://localhost:5180/health || exit 1
|
||||
|
||||
# Run the app
|
||||
ENTRYPOINT ["/docker-entrypoint.sh"]
|
||||
CMD ["node", "build"]
|
||||
13
apps/lightwrite/apps/web/docker-entrypoint.sh
Normal file
13
apps/lightwrite/apps/web/docker-entrypoint.sh
Normal file
|
|
@ -0,0 +1,13 @@
|
|||
#!/bin/sh
|
||||
set -e
|
||||
|
||||
# This script injects runtime environment variables into the SvelteKit build
|
||||
# SvelteKit builds env vars at build time, but we need to inject them at runtime
|
||||
# for Docker deployments where the container runs in different environments
|
||||
|
||||
echo "Starting LightWrite Web with runtime configuration..."
|
||||
echo "PUBLIC_MANA_CORE_AUTH_URL_CLIENT: ${PUBLIC_MANA_CORE_AUTH_URL_CLIENT:-not set}"
|
||||
echo "PUBLIC_BACKEND_URL_CLIENT: ${PUBLIC_BACKEND_URL_CLIENT:-not set}"
|
||||
|
||||
# Execute the main command
|
||||
exec "$@"
|
||||
|
|
@ -13,6 +13,7 @@
|
|||
BellSlash,
|
||||
CircleNotch,
|
||||
SquaresFour,
|
||||
MagnifyingGlass,
|
||||
} from '@manacore/shared-icons';
|
||||
|
||||
interface Props {
|
||||
|
|
@ -96,34 +97,44 @@
|
|||
onclick={onClose}
|
||||
aria-label="Schließen"
|
||||
></button>
|
||||
|
||||
<!-- Slide-in Panel -->
|
||||
<div
|
||||
class="fixed inset-y-0 right-0 z-50 flex w-[90vw] max-w-[320px] lg:w-80 flex-col border-l border-base-300 bg-base-100 shadow-xl"
|
||||
class="fixed inset-y-0 right-0 z-50 flex w-[90vw] max-w-[320px] lg:w-80 flex-col
|
||||
bg-white/80 dark:bg-black/80 backdrop-blur-xl
|
||||
border-l border-black/10 dark:border-white/10 shadow-2xl"
|
||||
>
|
||||
<!-- Header -->
|
||||
<header class="flex items-center justify-between border-b border-base-300 px-4 py-3">
|
||||
<h2 class="font-semibold">Raum-Details</h2>
|
||||
<button class="btn btn-ghost btn-sm btn-circle" onclick={onClose}>
|
||||
<X class="h-5 w-5" />
|
||||
<header
|
||||
class="flex items-center justify-between border-b border-black/10 dark:border-white/10 px-4 py-3"
|
||||
>
|
||||
<h2 class="font-semibold text-foreground">Raum-Details</h2>
|
||||
<button
|
||||
class="p-2 rounded-lg hover:bg-black/5 dark:hover:bg-white/10 transition-colors"
|
||||
onclick={onClose}
|
||||
>
|
||||
<X class="h-5 w-5 text-foreground" />
|
||||
</button>
|
||||
</header>
|
||||
|
||||
<!-- Room Info -->
|
||||
<div class="border-b border-base-300 p-4 text-center">
|
||||
<div class="avatar placeholder mx-auto mb-3">
|
||||
<div class="w-20 rounded-full bg-neutral text-neutral-content">
|
||||
{#if room.avatar}
|
||||
<img src={room.avatar} alt={room.name} />
|
||||
{:else}
|
||||
<span class="text-2xl">{room.name.charAt(0).toUpperCase()}</span>
|
||||
{/if}
|
||||
</div>
|
||||
<div class="border-b border-black/10 dark:border-white/10 p-4 text-center">
|
||||
<div class="mx-auto mb-3 w-20 h-20 rounded-full overflow-hidden">
|
||||
{#if room.avatar}
|
||||
<img src={room.avatar} alt={room.name} class="w-full h-full object-cover" />
|
||||
{:else}
|
||||
<div
|
||||
class="w-full h-full flex items-center justify-center bg-gradient-to-br from-violet-500 to-purple-600 text-white"
|
||||
>
|
||||
<span class="text-2xl font-semibold">{room.name.charAt(0).toUpperCase()}</span>
|
||||
</div>
|
||||
{/if}
|
||||
</div>
|
||||
<h3 class="text-lg font-semibold">{room.name}</h3>
|
||||
<h3 class="text-lg font-semibold text-foreground">{room.name}</h3>
|
||||
{#if room.topic}
|
||||
<p class="mt-1 text-sm text-base-content/60">{room.topic}</p>
|
||||
<p class="mt-1 text-sm text-muted-foreground">{room.topic}</p>
|
||||
{/if}
|
||||
<p class="mt-2 text-xs text-base-content/50">
|
||||
<p class="mt-2 text-xs text-muted-foreground">
|
||||
{room.memberCount} Mitglieder
|
||||
{#if room.isEncrypted}
|
||||
• Verschlüsselt
|
||||
|
|
@ -132,140 +143,163 @@
|
|||
</div>
|
||||
|
||||
<!-- Tabs -->
|
||||
<div class="tabs tabs-bordered">
|
||||
<div class="flex border-b border-black/10 dark:border-white/10">
|
||||
<button
|
||||
class="tab flex-1"
|
||||
class:tab-active={activeTab === 'members'}
|
||||
class="flex-1 flex items-center justify-center gap-1.5 py-3 text-sm font-medium transition-colors
|
||||
{activeTab === 'members'
|
||||
? 'text-primary border-b-2 border-primary'
|
||||
: 'text-muted-foreground hover:text-foreground'}"
|
||||
onclick={() => (activeTab = 'members')}
|
||||
>
|
||||
<Users class="mr-1 h-4 w-4" />
|
||||
<Users class="h-4 w-4" />
|
||||
Mitglieder
|
||||
</button>
|
||||
<button
|
||||
class="tab flex-1"
|
||||
class:tab-active={activeTab === 'widgets'}
|
||||
class="flex-1 flex items-center justify-center gap-1.5 py-3 text-sm font-medium transition-colors
|
||||
{activeTab === 'widgets'
|
||||
? 'text-primary border-b-2 border-primary'
|
||||
: 'text-muted-foreground hover:text-foreground'}"
|
||||
onclick={() => (activeTab = 'widgets')}
|
||||
>
|
||||
<SquaresFour class="mr-1 h-4 w-4" />
|
||||
<SquaresFour class="h-4 w-4" />
|
||||
Widgets
|
||||
{#if widgets.length > 0}
|
||||
<span class="badge badge-sm badge-primary ml-1">{widgets.length}</span>
|
||||
<span
|
||||
class="px-1.5 py-0.5 rounded-full bg-gradient-to-r from-violet-500 to-purple-600 text-white text-[10px] font-medium"
|
||||
>
|
||||
{widgets.length}
|
||||
</span>
|
||||
{/if}
|
||||
</button>
|
||||
<button
|
||||
class="tab flex-1"
|
||||
class:tab-active={activeTab === 'settings'}
|
||||
class="flex-1 flex items-center justify-center gap-1.5 py-3 text-sm font-medium transition-colors
|
||||
{activeTab === 'settings'
|
||||
? 'text-primary border-b-2 border-primary'
|
||||
: 'text-muted-foreground hover:text-foreground'}"
|
||||
onclick={() => (activeTab = 'settings')}
|
||||
>
|
||||
<Gear class="mr-1 h-4 w-4" />
|
||||
<Gear class="h-4 w-4" />
|
||||
Einstellungen
|
||||
</button>
|
||||
</div>
|
||||
|
||||
<!-- Content -->
|
||||
<div class="flex-1 overflow-y-auto">
|
||||
<div class="flex-1 overflow-y-auto chat-scrollbar">
|
||||
{#if activeTab === 'members'}
|
||||
<!-- Invite User -->
|
||||
<div class="border-b border-base-300 p-3">
|
||||
<div class="border-b border-black/10 dark:border-white/10 p-3">
|
||||
<div class="relative">
|
||||
<MagnifyingGlass
|
||||
class="absolute left-3 top-1/2 -translate-y-1/2 h-4 w-4 text-muted-foreground"
|
||||
/>
|
||||
<input
|
||||
type="text"
|
||||
bind:value={inviteQuery}
|
||||
oninput={handleSearchInput}
|
||||
class="input input-bordered input-sm w-full"
|
||||
class="w-full rounded-xl bg-white/70 dark:bg-white/10 backdrop-blur-xl
|
||||
border border-black/10 dark:border-white/20 px-4 py-2 pl-10
|
||||
text-sm text-foreground focus:ring-2 focus:ring-primary focus:outline-none
|
||||
placeholder:text-muted-foreground"
|
||||
placeholder="Benutzer einladen..."
|
||||
/>
|
||||
{#if searching}
|
||||
<CircleNotch class="absolute right-3 top-1/2 h-4 w-4 -translate-y-1/2 animate-spin" />
|
||||
<CircleNotch
|
||||
class="absolute right-3 top-1/2 h-4 w-4 -translate-y-1/2 animate-spin text-muted-foreground"
|
||||
/>
|
||||
{/if}
|
||||
</div>
|
||||
|
||||
<!-- Search Results -->
|
||||
{#if searchResults.length > 0}
|
||||
<ul class="menu mt-2 rounded-lg bg-base-200 p-1">
|
||||
<div
|
||||
class="mt-2 rounded-xl bg-white/50 dark:bg-white/5 border border-black/10 dark:border-white/10 overflow-hidden"
|
||||
>
|
||||
{#each searchResults as user}
|
||||
<li>
|
||||
<button
|
||||
class="flex items-center gap-2 py-1"
|
||||
onclick={() => inviteUser(user.userId)}
|
||||
disabled={inviting}
|
||||
<button
|
||||
class="w-full flex items-center gap-2 px-3 py-2 hover:bg-black/5 dark:hover:bg-white/10 transition-colors"
|
||||
onclick={() => inviteUser(user.userId)}
|
||||
disabled={inviting}
|
||||
>
|
||||
<div
|
||||
class="w-8 h-8 rounded-full flex items-center justify-center bg-gradient-to-br from-violet-500 to-purple-600 text-white text-xs font-medium"
|
||||
>
|
||||
<div class="avatar placeholder">
|
||||
<div class="w-6 rounded-full bg-neutral text-neutral-content">
|
||||
<span class="text-xs">{user.displayName?.[0] || '?'}</span>
|
||||
</div>
|
||||
</div>
|
||||
<span class="flex-1 truncate text-sm">
|
||||
{user.displayName || user.userId}
|
||||
</span>
|
||||
<UserPlus class="h-4 w-4 text-primary" />
|
||||
</button>
|
||||
</li>
|
||||
{user.displayName?.[0]?.toUpperCase() || '?'}
|
||||
</div>
|
||||
<span class="flex-1 truncate text-sm text-foreground text-left">
|
||||
{user.displayName || user.userId}
|
||||
</span>
|
||||
<UserPlus class="h-4 w-4 text-primary" />
|
||||
</button>
|
||||
{/each}
|
||||
</ul>
|
||||
</div>
|
||||
{/if}
|
||||
</div>
|
||||
|
||||
<!-- Member List -->
|
||||
<ul class="menu p-2">
|
||||
<div class="p-2">
|
||||
{#each members as member}
|
||||
{@const PowerIcon = getPowerLevelIcon(member.powerLevel)}
|
||||
<li>
|
||||
<div class="flex items-center gap-2 py-1">
|
||||
<div class="avatar placeholder">
|
||||
<div class="w-8 rounded-full bg-neutral text-neutral-content">
|
||||
{#if member.avatarUrl}
|
||||
<img src={member.avatarUrl} alt="" />
|
||||
{:else}
|
||||
<span class="text-xs">
|
||||
{member.displayName.charAt(0).toUpperCase()}
|
||||
</span>
|
||||
{/if}
|
||||
<div
|
||||
class="flex items-center gap-3 px-3 py-2 rounded-xl hover:bg-black/5 dark:hover:bg-white/5 transition-colors"
|
||||
>
|
||||
<div class="w-10 h-10 rounded-full overflow-hidden flex-shrink-0">
|
||||
{#if member.avatarUrl}
|
||||
<img src={member.avatarUrl} alt="" class="w-full h-full object-cover" />
|
||||
{:else}
|
||||
<div
|
||||
class="w-full h-full flex items-center justify-center bg-gradient-to-br from-violet-500 to-purple-600 text-white text-sm font-medium"
|
||||
>
|
||||
{member.displayName.charAt(0).toUpperCase()}
|
||||
</div>
|
||||
</div>
|
||||
<div class="flex-1 min-w-0">
|
||||
<p class="truncate font-medium">{member.displayName}</p>
|
||||
<p class="truncate text-xs text-base-content/50">{member.userId}</p>
|
||||
</div>
|
||||
{#if PowerIcon}
|
||||
<PowerIcon class="h-4 w-4 text-warning" />
|
||||
{/if}
|
||||
</div>
|
||||
</li>
|
||||
<div class="flex-1 min-w-0">
|
||||
<p class="truncate font-medium text-foreground">{member.displayName}</p>
|
||||
<p class="truncate text-xs text-muted-foreground">{member.userId}</p>
|
||||
</div>
|
||||
{#if PowerIcon}
|
||||
<PowerIcon class="h-4 w-4 text-amber-500" />
|
||||
{/if}
|
||||
</div>
|
||||
{/each}
|
||||
</ul>
|
||||
</div>
|
||||
{:else if activeTab === 'widgets'}
|
||||
<!-- Widgets -->
|
||||
<div class="p-3">
|
||||
{#if widgets.length === 0}
|
||||
<div class="text-center py-8 text-base-content/50">
|
||||
<SquaresFour class="h-12 w-12 mx-auto mb-2 opacity-50" />
|
||||
<p>Keine Widgets in diesem Raum</p>
|
||||
<p class="text-xs mt-1">Bots können Widgets hinzufügen</p>
|
||||
<div class="text-center py-8">
|
||||
<SquaresFour class="h-12 w-12 mx-auto mb-2 text-muted-foreground opacity-50" />
|
||||
<p class="text-muted-foreground">Keine Widgets in diesem Raum</p>
|
||||
<p class="text-xs mt-1 text-muted-foreground">Bots können Widgets hinzufügen</p>
|
||||
</div>
|
||||
{:else}
|
||||
<div class="space-y-3">
|
||||
{#each widgets as widget}
|
||||
<div class="card bg-base-200 shadow-sm">
|
||||
<div class="card-body p-3">
|
||||
<div class="flex items-center justify-between">
|
||||
<h3 class="font-medium text-sm">{widget.name}</h3>
|
||||
<button class="btn btn-ghost btn-xs" onclick={() => toggleWidget(widget.id)}>
|
||||
{expandedWidget === widget.id ? 'Schließen' : 'Öffnen'}
|
||||
</button>
|
||||
</div>
|
||||
{#if expandedWidget === widget.id}
|
||||
<div class="mt-2 -mx-3 -mb-3">
|
||||
<iframe
|
||||
src={getWidgetUrl(widget)}
|
||||
title={widget.name}
|
||||
class="w-full border-0 rounded-b-2xl bg-base-300"
|
||||
style="height: 300px;"
|
||||
sandbox="allow-scripts allow-same-origin allow-forms allow-popups"
|
||||
></iframe>
|
||||
</div>
|
||||
{/if}
|
||||
<div
|
||||
class="rounded-xl bg-white/50 dark:bg-white/5 border border-black/10 dark:border-white/10 overflow-hidden"
|
||||
>
|
||||
<div class="flex items-center justify-between p-3">
|
||||
<h3 class="font-medium text-sm text-foreground">{widget.name}</h3>
|
||||
<button
|
||||
class="px-3 py-1 text-xs font-medium rounded-lg
|
||||
bg-black/5 dark:bg-white/10 hover:bg-black/10 dark:hover:bg-white/20
|
||||
text-foreground transition-colors"
|
||||
onclick={() => toggleWidget(widget.id)}
|
||||
>
|
||||
{expandedWidget === widget.id ? 'Schließen' : 'Öffnen'}
|
||||
</button>
|
||||
</div>
|
||||
{#if expandedWidget === widget.id}
|
||||
<div class="border-t border-black/10 dark:border-white/10">
|
||||
<iframe
|
||||
src={getWidgetUrl(widget)}
|
||||
title={widget.name}
|
||||
class="w-full border-0 bg-surface"
|
||||
style="height: 300px;"
|
||||
sandbox="allow-scripts allow-same-origin allow-forms allow-popups"
|
||||
></iframe>
|
||||
</div>
|
||||
{/if}
|
||||
</div>
|
||||
{/each}
|
||||
</div>
|
||||
|
|
@ -273,18 +307,29 @@
|
|||
</div>
|
||||
{:else}
|
||||
<!-- Settings -->
|
||||
<div class="space-y-2 p-3">
|
||||
<div class="p-3 space-y-2">
|
||||
<!-- Notifications -->
|
||||
<button class="btn btn-ghost w-full justify-start">
|
||||
<Bell class="h-4 w-4" />
|
||||
Benachrichtigungen
|
||||
<span class="ml-auto badge badge-sm">An</span>
|
||||
<button
|
||||
class="w-full flex items-center gap-3 px-4 py-3 rounded-xl
|
||||
hover:bg-black/5 dark:hover:bg-white/5 transition-colors"
|
||||
>
|
||||
<Bell class="h-5 w-5 text-foreground" />
|
||||
<span class="flex-1 text-left text-foreground">Benachrichtigungen</span>
|
||||
<span
|
||||
class="px-2 py-0.5 rounded-full bg-green-500/10 text-green-600 dark:text-green-400 text-xs font-medium"
|
||||
>
|
||||
An
|
||||
</span>
|
||||
</button>
|
||||
|
||||
<!-- Leave Room -->
|
||||
<button class="btn btn-ghost w-full justify-start text-error" onclick={leaveRoom}>
|
||||
<SignOut class="h-4 w-4" />
|
||||
Raum verlassen
|
||||
<button
|
||||
class="w-full flex items-center gap-3 px-4 py-3 rounded-xl
|
||||
text-red-600 dark:text-red-400 hover:bg-red-500/10 transition-colors"
|
||||
onclick={leaveRoom}
|
||||
>
|
||||
<SignOut class="h-5 w-5" />
|
||||
<span class="flex-1 text-left">Raum verlassen</span>
|
||||
</button>
|
||||
</div>
|
||||
{/if}
|
||||
|
|
|
|||
|
|
@ -592,6 +592,37 @@ services:
|
|||
retries: 3
|
||||
start_period: 40s
|
||||
|
||||
lightwrite-backend:
|
||||
build:
|
||||
context: .
|
||||
dockerfile: apps/lightwrite/apps/backend/Dockerfile
|
||||
image: lightwrite-backend:local
|
||||
container_name: mana-app-lightwrite-backend
|
||||
restart: always
|
||||
depends_on:
|
||||
mana-auth:
|
||||
condition: service_healthy
|
||||
environment:
|
||||
NODE_ENV: production
|
||||
PORT: 3010
|
||||
DATABASE_URL: postgresql://postgres:${POSTGRES_PASSWORD:-mana123}@postgres:5432/lightwrite
|
||||
MANA_CORE_AUTH_URL: http://mana-auth:3001
|
||||
CORS_ORIGINS: https://lightwrite.mana.how,https://mana.how
|
||||
S3_ENDPOINT: http://minio:9000
|
||||
S3_REGION: us-east-1
|
||||
S3_ACCESS_KEY: ${MINIO_ACCESS_KEY:-minioadmin}
|
||||
S3_SECRET_KEY: ${MINIO_SECRET_KEY:-minioadmin}
|
||||
S3_BUCKET: lightwrite-storage
|
||||
RUN_DB_PUSH: "true"
|
||||
ports:
|
||||
- "3010:3010"
|
||||
healthcheck:
|
||||
test: ["CMD", "wget", "--no-verbose", "--tries=1", "--spider", "http://127.0.0.1:3010/health"]
|
||||
interval: 30s
|
||||
timeout: 10s
|
||||
retries: 3
|
||||
start_period: 40s
|
||||
|
||||
# ============================================
|
||||
# Tier 4: Matrix Stack (Ports 4000-4099)
|
||||
# ============================================
|
||||
|
|
@ -1404,6 +1435,35 @@ services:
|
|||
retries: 3
|
||||
start_period: 40s
|
||||
|
||||
lightwrite-web:
|
||||
build:
|
||||
context: .
|
||||
dockerfile: apps/lightwrite/apps/web/Dockerfile
|
||||
args:
|
||||
PUBLIC_BACKEND_URL: http://lightwrite-backend:3010
|
||||
PUBLIC_MANA_CORE_AUTH_URL: http://mana-auth:3001
|
||||
image: lightwrite-web:local
|
||||
container_name: mana-app-lightwrite-web
|
||||
restart: always
|
||||
depends_on:
|
||||
lightwrite-backend:
|
||||
condition: service_healthy
|
||||
environment:
|
||||
NODE_ENV: production
|
||||
PORT: 5180
|
||||
PUBLIC_BACKEND_URL: http://lightwrite-backend:3010
|
||||
PUBLIC_MANA_CORE_AUTH_URL: http://mana-auth:3001
|
||||
PUBLIC_BACKEND_URL_CLIENT: https://lightwrite-api.mana.how
|
||||
PUBLIC_MANA_CORE_AUTH_URL_CLIENT: https://auth.mana.how
|
||||
ports:
|
||||
- "5180:5180"
|
||||
healthcheck:
|
||||
test: ["CMD", "wget", "--no-verbose", "--tries=1", "--spider", "http://127.0.0.1:5180/health"]
|
||||
interval: 30s
|
||||
timeout: 10s
|
||||
retries: 3
|
||||
start_period: 40s
|
||||
|
||||
mana-llm:
|
||||
build:
|
||||
context: ./services/mana-llm
|
||||
|
|
|
|||
Loading…
Add table
Add a link
Reference in a new issue