feat: 프로필 이미지 업로드 및 UI 개선

packages/bot/src/commands/index.ts

@@ -6,7 +6,6 @@ import type { CommandHandler } from '../bot';
 
 // Import user commands
 import { 핑Command } from './ping';
-import { 참가Command } from './join';
 import { 탈퇴Command } from './leave';
 import { 내정보Command } from './my-info';
 import { 참가자목록Command } from './member-list';
@@ -21,7 +20,6 @@ import { getAdminCommands as getAdminCommandsFromDir } from './admin';
 // User commands array
 const userCommands: CommandHandler[] = [
   핑Command,
-  참가Command,
   탈퇴Command,
   내정보Command,
   참가자목록Command,

packages/web/src/app/(admin)/admin/members/page.tsx

@@ -23,6 +23,7 @@ import {
   TableHeader,
   TableRow,
 } from '@/components/ui/table';
+import { getPartStyle, getPartLabel } from '@/lib/part-config';
 import { MemberFormDialog } from './member-form-dialog';
 import { DeleteMemberDialog } from './delete-member-dialog';
 
@@ -285,7 +286,11 @@ export default function AdminMembersPage() {
                 filteredMembers.map((member) => (
                   <TableRow key={member.id}>
                     <TableCell className="font-medium">{member.name}</TableCell>
-                    <TableCell>{member.part}</TableCell>
+                    <TableCell>
+                      <span className={`inline-flex items-center rounded-full px-2 py-0.5 text-xs font-medium ${getPartStyle(member.part).bg} ${getPartStyle(member.part).text}`}>
+                        {getPartLabel(member.part)}
+                      </span>
+                    </TableCell>
                     <TableCell className="text-muted-foreground">
                       {member.discordUsername}
                     </TableCell>

packages/web/src/app/(user)/layout.tsx

@@ -1,7 +1,7 @@
 'use client';
 
 import { useEffect, useState, useCallback } from 'react';
-import { useRouter } from 'next/navigation';
+import { useRouter, usePathname } from 'next/navigation';
 import { MainLayout } from '@/components/layout';
 
 interface UserInfo {
@@ -16,15 +16,23 @@ export default function UserLayout({
   children: React.ReactNode;
 }) {
   const router = useRouter();
+  const pathname = usePathname();
   const [user, setUser] = useState<UserInfo | null>(null);
+  const [onboardingChecked, setOnboardingChecked] = useState(false);
 
   useEffect(() => {
-    // Get user info from cookie or API
     const fetchUser = async () => {
       try {
         const response = await fetch('/api/auth/me');
         if (response.ok) {
           const data = await response.json();
+
+          // 온보딩 미완료 시 리다이렉트 (온보딩 페이지 자체는 예외)
+          if (!data.onboardingCompleted && pathname !== '/profile/onboarding') {
+            router.push('/profile/onboarding');
+            return;
+          }
+
           setUser({
             name: data.name || data.discordUsername || data.email?.split('@')[0] || '',
             email: data.email || '',
@@ -33,10 +41,12 @@ export default function UserLayout({
         }
       } catch {
         // User not authenticated, middleware will handle redirect
+      } finally {
+        setOnboardingChecked(true);
       }
     };
     fetchUser();
-  }, []);
+  }, [pathname, router]);
 
   const handleLogout = useCallback(async () => {
     try {
@@ -48,6 +58,15 @@ export default function UserLayout({
     }
   }, [router]);
 
+  // 온보딩 체크 중에는 로딩 표시 (무한루프 방지를 위해 온보딩 페이지는 바로 표시)
+  if (!onboardingChecked && pathname !== '/profile/onboarding') {
+    return (
+      <div className="flex items-center justify-center min-h-screen">
+        <div className="text-muted-foreground">로딩 중...</div>
+      </div>
+    );
+  }
+
   return (
     <MainLayout user={user} isAdmin={false} showSidebar={true} onLogout={handleLogout}>
       {children}

packages/web/src/app/(user)/members/[id]/page.tsx

@@ -8,6 +8,7 @@ import { Button } from '@/components/ui/button';
 import { Badge } from '@/components/ui/badge';
 import { Avatar, AvatarFallback, AvatarImage } from '@/components/ui/avatar';
 import { Separator } from '@/components/ui/separator';
+import { getPartStyle, getPartLabel } from '@/lib/part-config';
 
 interface MemberInfo {
   id: string;
@@ -151,15 +152,17 @@ export default function MemberProfilePage() {
                 <p className="text-2xl font-semibold">{member.name}</p>
                 <p className="text-muted-foreground">@{member.discordUsername}</p>
               </div>
-              <Badge variant="outline">{member.part}</Badge>
+              <span className={`inline-flex items-center rounded-full px-2.5 py-0.5 text-xs font-medium ${getPartStyle(member.part).bg} ${getPartStyle(member.part).text}`}>
+                {getPartLabel(member.part)}
+              </span>
             </div>
           </div>
 
           {member.bio && (
             <>
               <Separator />
               <div>
-                <p className="text-sm text-muted-foreground mb-1">한줄 소개</p>
+                <p className="text-sm text-muted-foreground mb-1">자기소개</p>
                 <p>{member.bio}</p>
               </div>
             </>